| | |
| | | <template> |
| | | <zt-dialog ref="dialog" column="2" @confirm="formSubmit" append-to-body title="测试环境建立确认表"> |
| | | <el-form :model="dataForm" style="padding: 0" :inline="true" ref="dataForm" :disabled="dataForm.disabled" label-width="130px" class="confirmFormAuto"> |
| | | <el-form :model="dataForm" style="padding-top: 0" :inline="true" ref="dataForm" :disabled="dataForm.disabled" label-width="130px" class="confirmFormAuto"> |
| | | <div class="DConfirmForm"> |
| | | <el-form-item label-width="60px" label="编号:" style="width:100%;margin-bottom: 0"> |
| | | <span>{{dataForm.environ.code}}</span> |
| | |
| | | </div> |
| | | <div style="border: 1px solid rgba(0,0,0,.2);width: 99%" class="confirmDAuto DConfirmForm"> |
| | | <el-form-item class="marginTopAndMarginBottom" label="专业实验室名称" style="width: 49%"> |
| | | <el-input v-model="dataForm.environ.agencyName" placeholder="专业实验室名称"></el-input> |
| | | <el-input v-model="dataForm.testAgencyInfo.agencyName" placeholder="专业实验室名称"></el-input> |
| | | </el-form-item> |
| | | <el-form-item class="marginTopAndMarginBottom" label="测试地点" style="width: 49%"> |
| | | <el-input v-model="dataForm.environ.site" placeholder="测试地点"></el-input> |
| | | <el-input v-model="dataForm.testAgencyInfo.site" placeholder="测试地点"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="被测软件" style="width: 49%"> |
| | | <el-input v-model="dataForm.environ.softwareName" placeholder="被测软件"></el-input> |
| | | <el-input v-model="dataForm.project.softwareName" placeholder="被测软件"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="版本" style="width: 49%"> |
| | | <el-input v-model="dataForm.environ.softwareIdentity" placeholder="版本"></el-input> |
| | | <el-input v-model="dataForm.project.softwareIdentity" placeholder="版本"></el-input> |
| | | </el-form-item> |
| | | <div class="el-flexConfigDialog el-form-border"> |
| | | <div class="DFormWidth DAlign DHold"> |
| | |
| | | <div class="el-wt-border-left" style="padding-left:5px;width: calc(100% - 130px)"> |
| | | <div style="padding: 5px">软件资源:</div> |
| | | <div class="table-container"> |
| | | <el-table class="el-software el-margin-top-bot" height="150" border :data="dataForm.softwareResourcesList" |
| | | <el-table ref="tableSoftwareList" class="el-software el-margin-top-bot" border :data="dataForm.softwareResourcesList" |
| | | stripe> |
| | | <el-table-column prop="code" align="center" width="80" label="序号"> |
| | | <el-table-column prop="no" align="center" width="80" label="序号"> |
| | | <template slot-scope="scope"> |
| | | <span v-html="indexFormat(scope.$index)"></span> |
| | | </template> |
| | |
| | | <el-input v-model="row.version" placeholder="版本"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="use" align="center" width="180" label="用途"> |
| | | <el-table-column prop="purposes" align="center" width="180" label="用途"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.usage" placeholder="用途"></el-input> |
| | | <el-input v-model="row.purposes" placeholder="用途"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="unit" label="提供单位" width="180" align="center"> |
| | |
| | | </div> |
| | | <div style="padding: 5px">硬件资源:</div> |
| | | <div class="table-container"> |
| | | <el-table class="el-software el-margin-top-bot" height="150" border :data="dataForm.hardwareResourcesList" |
| | | <el-table ref="tableHardwareList" class="el-software el-margin-top-bot" border :data="dataForm.hardwareResourcesList" |
| | | stripe> |
| | | <el-table-column prop="code" align="center" width="80" label="序号"></el-table-column> |
| | | <el-table-column prop="itemName" min-width="300" label="硬件和固件项目名称"></el-table-column> |
| | | <el-table-column prop="usage" align="center" width="180" label="用途"></el-table-column> |
| | | <el-table-column prop="number" align="center" width="80" label="数量"></el-table-column> |
| | | <el-table-column prop="state" align="center" width="120" label="状态"></el-table-column> |
| | | <el-table-column prop="provideUnit" align="center" width="180" label="提供单位"></el-table-column> |
| | | <el-table-column prop="no" align="center" width="80" label="序号"> |
| | | <template slot-scope="scope"> |
| | | <span v-html="indexFormat(scope.$index)"></span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="itemName" min-width="300" label="硬件和固件项目名称"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.itemName" placeholder="硬件和固件项目名称"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="purposes" align="center" width="180" label="用途"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.purposes" placeholder="用途"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="number" align="center" width="80" label="数量"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.number" placeholder="数量"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="state" align="center" width="120" label="状态"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.state" placeholder="状态"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="provideUnit" align="center" width="180" label="提供单位"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.provideUnit" placeholder="提供单位"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="icon-container" @click="addHardwareRow()"> |
| | | <!-- 放置固定的图标 --> |
| | |
| | | 动态测试环境图 |
| | | </div> |
| | | <div style="width: calc(100% - 120px);"> |
| | | <div style="height:150px" class="el-wt-border-left"> |
| | | <div class="el-wt-border-left"> |
| | | <span>{{dataForm.environ.testEnvirontDiagram}}</span> |
| | | <config-uploader busi-type="test_environt_diagram" model-name="dataForm" :dataForm="dataForm" |
| | | @getImageUrl="getImageUrl" |
| | | v-model="dataForm.files"/> |
| | | <div v-if="dataForm.url"> |
| | | <el-image :src="dataForm.url"></el-image> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | <div class="el-wt-border-left" style="padding-left:5px;width: calc(100% - 130px)"> |
| | | <div class="table-container"> |
| | | <el-table class="el-software el-margin-top-bot" height="150" border :data="dataForm.environAnalysisList" |
| | | <el-table ref="tableEnvironeList" class="el-software el-margin-top-bot" border :data="dataForm.environAnalysisList" |
| | | stripe> |
| | | <el-table-column prop="code" align="center" width="80" label="序号"></el-table-column> |
| | | <el-table-column prop="realEnviron" min-width="300" label="真实环境"></el-table-column> |
| | | <el-table-column prop="testEnviron" align="center" width="100" label="测试环境"></el-table-column> |
| | | <el-table-column prop="environDifference" align="center" width="100" label="环境差异"></el-table-column> |
| | | <el-table-column prop="resultImpact" align="center" width="160" label="对测试结果影响"></el-table-column> |
| | | <el-table-column prop="measure" align="center" width="180" label="措施"></el-table-column> |
| | | <el-table-column prop="no" align="center" width="80" label="序号"> |
| | | <template slot-scope="scope"> |
| | | <span v-html="indexFormat(scope.$index)"></span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="realEnviron" min-width="300" label="真实环境"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.realEnviron" placeholder="真实环境"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="testEnviron" align="center" width="100" label="测试环境"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.testEnviron" placeholder="测试环境"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="environDifference" align="center" width="100" label="环境差异"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.environDifference" placeholder="环境差异"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="resultImpact" align="center" width="160" label="对测试结果影响"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.resultImpact" placeholder="对测试结果影响"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="measure" align="center" width="180" label="措施"> |
| | | <template v-slot="{ row }"> |
| | | <el-input v-model="row.measure" placeholder="措施"></el-input> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="icon-container" @click="addDiscrepancyRow()"> |
| | | <!-- 放置固定的图标 --> |
| | |
| | | return { |
| | | dataForm: { |
| | | id: '', |
| | | url:'', |
| | | environ:{ |
| | | code: '', |
| | | agencyName:'', |
| | | site:'', |
| | | softwareName:'', |
| | | softwareIdentity:'', |
| | | code: '1', |
| | | hardSoftwareRes: '', |
| | | testEnvirontDiagram: '', |
| | | establishStaff:'', |
| | |
| | | confirmatDate: '', |
| | | isVirusScan: '', |
| | | virusDatabaseVersion: '', |
| | | }, |
| | | project: { |
| | | softwareIdentity: '', |
| | | softwareName: '', |
| | | }, |
| | | testAgencyInfo: { |
| | | agencyName:'', |
| | | site:'', |
| | | }, |
| | | softwareResourcesList:[], |
| | | hardwareResourcesList:[], |
| | |
| | | return index += 1 |
| | | }, |
| | | addSoftwareRow(){ |
| | | this.dataForm.softwareData.push({}) |
| | | this.dataForm.softwareResourcesList.push({}) |
| | | this.$nextTick(()=>{ |
| | | const tableBody=this.$refs.tableSoftwareList.$el.querySelector('.el-table__body-wrapper') |
| | | tableBody.scrollTop = tableBody.scrollHeight |
| | | }) |
| | | }, |
| | | addHardwareRow(){}, |
| | | addDiscrepancyRow(){}, |
| | | addHardwareRow(){ |
| | | this.dataForm.hardwareResourcesList.push({}) |
| | | this.$nextTick(()=>{ |
| | | const tableBody=this.$refs.tableHardwareList.$el.querySelector('.el-table__body-wrapper') |
| | | tableBody.scrollTop = tableBody.scrollHeight; |
| | | }) |
| | | }, |
| | | addDiscrepancyRow(){ |
| | | this.dataForm.environAnalysisList.push({}) |
| | | this.$nextTick(()=>{ |
| | | const tableBody=this.$refs.tableEnvironeList.$el.querySelector('.el-table__body-wrapper') |
| | | tableBody.scrollTop = tableBody.scrollHeight; |
| | | }) |
| | | }, |
| | | getImageUrl(url){ |
| | | this.image.url = url |
| | | console.log(this.image.url,' this.image.url') |
| | | }, |
| | | // 表单提交 |
| | | async formSubmit() { |
| | | let res = await this.$http[!this.dataForm.id ? 'post' : 'put']('/project/Environ/', this.dataForm) |
| | |
| | | .DFormWidth { |
| | | width: 120px; |
| | | } |
| | | |
| | | .DAlign { |
| | | text-align: center; |
| | | } |
| | | |
| | | .DConfirmForm { |
| | | /*border-left: 1px solid;*/ |
| | | width: 100%; |
| | |
| | | .table-container { |
| | | position: relative; |
| | | } |
| | | |
| | | .table-container:hover .icon-container { |
| | | opacity: 1; /* 鼠标悬停时显示图标 */ |
| | | } |
| | | .icon-container { |
| | | z-index: 1; |
| | | position: absolute; |
| | |
| | | height: 30px; |
| | | text-align: center; |
| | | line-height: 30px; |
| | | transform: translateX(-50%); |
| | | transform: translate3d(-50%, 0, -20px); |
| | | border: 1px solid #EBEEF5; |
| | | background-color: #fafafa; |
| | | box-shadow: 0 3px 6px 0 rgba(72, 119, 232, 0.14); |
| | | border-radius: 2px; |
| | | transition: transform 0.3s ease,box-shadow 0.3s ease,opacity 0.3s ease; |
| | | opacity: 0; |
| | | } |
| | | .icon-container:hover{ |
| | | transform: translate3d(-50%, 0, 0); |
| | | box-shadow: 0 10px 10px 0 rgba(72, 119, 232, 0.34) |
| | | } |
| | | </style> |