feat(确认试验方案): 页面布局调整

src/views/processing/carTest/confirmation-test/index.vue

@@ -47,7 +47,7 @@
           <div class="message-list">
             <div class="message-box" style="background-color: #2eba3c">
               <div class="message-detail">
-                <div class="detail-title">审查细则(条)</div>
+                <div class="detail-title">测试用例(条)</div>
                 <div class="detail-num mt10">
                   {{ model.carReviewTask.details }}
                 </div>
@@ -61,9 +61,9 @@
             </div>
             <div class="message-box" style="background-color: #477bba">
               <div class="message-detail">
-                <div class="detail-title">审查细则符合率（%）</div>
+                <div class="detail-title">标准条款（条）</div>
                 <div class="detail-num mt10">
-                  {{ model.carReviewTask.detailsPass }} %
+                  {{ model.carReviewTask.detailsPass }}
                 </div>
               </div>
               <svg-icon
@@ -75,9 +75,9 @@
             </div>
             <div class="message-box" style="background-color: #eca740">
               <div class="message-detail">
-                <div class="detail-title">标准条款(条)</div>
+                <div class="detail-title">测试通过率(%)</div>
                 <div class="detail-num mt10">
-                  {{ model.carReviewTask.standards }}
+                  {{ model.carReviewTask.standards }} %
                 </div>
               </div>
               <svg-icon
@@ -89,9 +89,9 @@
             </div>
             <div class="message-box" style="background-color: #47baba">
               <div class="message-detail">
-                <div class="detail-title">标准条款通过率</div>
+                <div class="detail-title">测试通过(个)</div>
                 <div class="detail-num mt10">
-                  {{ model.carReviewTask.standardsPass }} %
+                  {{ model.carReviewTask.standardsPass }}
                 </div>
               </div>
               <svg-icon
@@ -103,7 +103,7 @@
             </div>
             <div class="message-box" style="background-color: #6c47ba">
               <div class="message-detail">
-                <div class="detail-title">参与审查人数（人）</div>
+                <div class="detail-title">测试未通过（个）</div>
                 <div class="detail-num mt10">
                   {{ model.carReviewTask.person }}
                 </div>
@@ -119,106 +119,63 @@
         </div>
       </div>
 
-      <!--审查表单概要-->
+      <!--测试情况概要-->
       <div>
         <div class="form-review-questionnaire">
           <div class="title-display">
             <span class="title-i"></span>
-            <span class="title-content">审查表单概要</span>
-            <div class="control-btns">
-              <div class="control-btn" @click="openAll()">
-                <icon-park
-                  type="down-c"
-                  theme="outline"
-                  size="16"
-                  style="margin-right: 5px"
-                  fill="#303133"
-                />
-                全部展开
-              </div>
-              <div class="control-btn" @click="closeAll()">
-                <icon-park
-                  type="up-c"
-                  theme="outline"
-                  size="16"
-                  style="margin-right: 5px"
-                  fill="#303133"
-                />
-                全部收起
-              </div>
-            </div>
+            <span class="title-content">测试情况概要</span>
           </div>
           <!--审查表单概要-->
-          <collapse v-model="activeNames" class="mt10">
-            <collapse-item
-              v-for="(item, key) in model.carReviewTask.standard"
-              :key="key"
-              :name="item.chapter"
-            >
-              <span slot="title" style="width: 100%">
-                <div class="standard-box">
-                  <div class="standard-left">
-                    <div class="standard">标准：</div>
-                    <div class="standard-title">
-                      {{ item.chapter + item.text }}
-                    </div>
-                  </div>
-                  <div class="standard-result">
-                    审查结果：
-                    <span v-if="item.passed == 1" class="green">符合</span>
-                    <span v-else class="orange">不符合</span>
-                  </div>
-                </div>
-              </span>
-              <table class="table">
-                <tr>
-                  <th>审查要点</th>
-                  <th>审查细则</th>
-                  <th class="investigate-result">审查结果</th>
-                  <th class="written-by">填写人</th>
+          <table class="table">
+            <col style="width: 100px" />
+            <thead>
+              <tr>
+                <th>章节号</th>
+                <th>标准技术要求</th>
+                <th>标准测试方法</th>
+                <th>测试场景</th>
+                <th>测试类型</th>
+                <th>用例编号</th>
+                <th>测试结果</th>
+              </tr>
+            </thead>
+            <tbody>
+              <!-- 循环遍历 keyPointList -->
+              <template v-for="(i, PointIndex) in tableData.keyPointList">
+                <tr :key="'PointIndex1' + PointIndex">
+                  <td align="center" :rowspan="getRows(i)">
+                    {{ '7.1.1' }}
+                  </td>
+                  <td align="center" :rowspan="getRows(i)">
+                    {{ i.text }}
+                  </td>
+                  <td align="center" :rowspan="getRows(i)">
+                    {{ i.text }}
+                  </td>
                 </tr>
-                <template v-for="(keyPoint, keyPointKey) in item.keyPointList">
-                  <tr :key="keyPointKey">
-                    <td :rowspan="keyPoint.reviewDetailsList.length + 1">
-                      {{ keyPoint.text }}
+                <!-- 循环遍历 reviewDetailsList -->
+                <template v-for="(v, reviewDetailIndex) in i.reviewDetailsList">
+                  <tr
+                    :key="'reviewDetailIndex' + PointIndex + reviewDetailIndex"
+                  >
+                    <td align="center">
+                      {{ '测试场景' }}
+                    </td>
+                    <td align="center">
+                      {{ '测试类型' }}
+                    </td>
+                    <td align="center">
+                      {{ '用例编号' }}
+                    </td>
+                    <td align="center">
+                      {{ '测试结果' }}
                     </td>
                   </tr>
-                  <template
-                    v-for="(
-                      reviewDetail, reviewDetailKey
-                    ) in keyPoint.reviewDetailsList"
-                  >
-                    <tr :key="reviewDetailKey">
-                      <td align="center">{{ reviewDetail.text }}</td>
-                      <td align="center" class="investigate-result">
-                        <el-tag
-                          v-if="reviewDetail.result.passed === 1"
-                          size="medium"
-                          type="success"
-                          >符合</el-tag
-                        >
-                        <el-tag
-                          v-if="reviewDetail.result.passed === 0"
-                          size="medium"
-                          type="danger"
-                          >不符合</el-tag
-                        >
-                      </td>
-                      <td align="center" class="written-by">
-                        {{
-                          reviewDetail.result
-                            ? reviewDetail.result.userName
-                              ? reviewDetail.result.userName
-                              : '__'
-                            : '__'
-                        }}
-                      </td>
-                    </tr>
-                  </template>
                 </template>
-              </table>
-            </collapse-item>
-          </collapse>
+              </template>
+            </tbody>
+          </table>
         </div>
         <!--签字确认-->
         <div class="form-signature-confirmation">
@@ -265,59 +222,27 @@
 </template>
 <!--js逻辑-->
 <script>
-import { checkTaskDetail, carTaskSubmit, getBySubtaskId } from '@/api/task/task'
-import collapse from '@/components/Collapse/collapse'
-import collapseItem from '@/components/Collapse/collapse-item'
 import routerMixins from '@/mixins/router'
+import { getRows, getRows2 } from '../../../../utils/reviewDetailsTable'
+import { listInspection } from '../../../../api/setting/standardTerms'
 export default {
   name: 'Index',
-  components: {
-    collapse: collapse,
-    'collapse-item': collapseItem
-  },
   dicts: ['test_cartype_type'],
   mixins: [routerMixins],
   data() {
     return {
-      isShow: true,
+      tableData: [],
       task: {},
-      auditRequirement: 0,
-      testScenarioList: [
-        { value: 0, label: 'TBOX-蜂窝以太网接口', check: false },
-        { value: 1, label: 'WiFi AP接口', check: false },
-        { value: 2, label: 'WiFi Client接口', check: false },
-        { value: 3, label: '充电以太网接口', check: false },
-        { value: 4, label: 'CAN 诊断接口(OBD)', check: false },
-        { value: 5, label: '以太网诊断接口(OBD)', check: false },
-        { value: 6, label: '车载摄像头以太网接口(无线)', check: false },
-        { value: 7, label: '第三方应用软件', check: false },
-        { value: 8, label: '远程控车应用', check: false },
-        { value: 9, label: 'USB接口', check: false },
-        { value: 10, label: 'XCB标定', check: false },
-        { value: 11, label: 'CCP标定', check: false },
-        { value: 12, label: '安全启动', check: false },
-        { value: 13, label: '远程控车', check: false },
-        { value: 14, label: 'V2X', check: false },
-        { value: 15, label: 'BT', check: false },
-        { value: 16, label: 'BLE', check: false },
-        { value: 17, label: 'NFC', check: false },
-        { value: 18, label: '射频钥匙', check: false },
-        { value: 19, label: '软件升级', check: false },
-        { value: 20, label: 'ECU固体', check: false }
-      ],
-      checkTestScenarioList: [],
       model: {
         carReviewTask: {},
         reviewSceneChangeTasks: {},
         detailsList: []
       },
-      columns: [],
       ruleForm: {
         enterpriseLeader: '',
         inspectionLeader: '',
         result: []
       },
-      activeNames: [],
       rules: {
         enterpriseLeader: [
           { required: true, message: '请输入车企负责人', trigger: 'blur' }
@@ -337,96 +262,88 @@ export default {
   //   await this.getTask()
   //   this.openAll()
   // },
+  mounted() {
+    this.init()
+  },
   methods: {
-    /**
-     * 获取任务详情
-     */
-    async getTask() {
+    getRows,
+    getRows2,
+    /** 获取体系审查、车型审查检验内容 */
+    init() {
       this.loading = true
-      const res = await checkTaskDetail({
-        taskId: this.taskId
+      listInspection({ id: '1744181159757221888' }).then(res => {
+        this.tableData = res.data
+        this.loading = false
       })
-      this.loading = false
-      if (res.code === 200) {
-        this.model = res.data
-        await this.getTaskDetail()
-        if (this.model.carReviewTask.imagesUrl) {
-          const imgs = this.model.carReviewTask.imagesUrl.split(',')
-          this.ruleForm.enterpriseLeader
-            ? process.env.VUE_APP_IMAGE_API + imgs[0]
-            : ''
-          this.ruleForm.inspectionLeader
-            ? process.env.VUE_APP_IMAGE_API + imgs[1]
-            : ''
-        }
-      } else {
-        this.$modal.msgError(res.msg)
-      }
     },
     /**
      * 获取任务详情
      */
-    async getTaskDetail() {
-      const result = await getBySubtaskId({
-        id: this.taskId
-      })
-      if (result.code === 200) {
-        this.task = result.data
-      }
-    },
+    // async getTask() {
+    //   this.loading = true
+    //   const res = await checkTaskDetail({
+    //     taskId: this.taskId
+    //   })
+    //   this.loading = false
+    //   if (res.code === 200) {
+    //     this.model = res.data
+    //     await this.getTaskDetail()
+    //     if (this.model.carReviewTask.imagesUrl) {
+    //       const imgs = this.model.carReviewTask.imagesUrl.split(',')
+    //       this.ruleForm.enterpriseLeader
+    //         ? process.env.VUE_APP_IMAGE_API + imgs[0]
+    //         : ''
+    //       this.ruleForm.inspectionLeader
+    //         ? process.env.VUE_APP_IMAGE_API + imgs[1]
+    //         : ''
+    //     }
+    //   } else {
+    //     this.$modal.msgError(res.msg)
+    //   }
+    // },
+    /**
+     * 获取任务详情
+     */
+    // async getTaskDetail() {
+    //   const result = await getBySubtaskId({
+    //     id: this.taskId
+    //   })
+    //   if (result.code === 200) {
+    //     this.task = result.data
+    //   }
+    // },
     /* 返回跳转*/
     goToProcessedReview() {
-      // if (!this.ruleForm.enterpriseLeader) {
-      //   this.$message.error('请车企负责人签字')
-      //   return
+      // this.ruleForm.taskId = this.taskId
+      // const formData = {
+      //   imagesUrl: [
+      //     this.ruleForm.enterpriseLeader,
+      //     this.ruleForm.inspectionLeader
+      //   ],
+      //   taskId: this.taskId
       // }
-      // if (!this.ruleForm.inspectionLeader) {
-      //   this.$message.error('请检验负责人签字')
-      //   return
-      // }
-      this.ruleForm.taskId = this.taskId
-      const formData = {
-        imagesUrl: [
-          this.ruleForm.enterpriseLeader,
-          this.ruleForm.inspectionLeader
-        ],
-        taskId: this.taskId
-      }
-      carTaskSubmit(formData).then(res => {
-        if (res.code === 200) {
-          this.$modal.msgSuccess('确认提交成功')
-          this.$router.push({
-            path: '/processing/unprocessed-review'
-          })
-        } else {
-          this.$modal.msgError(res.msg)
-        }
-      })
-    },
-
-    handleTestScenario(item) {
-      // 查看item.value在this.checkTestScenarioList里面存不存在
-      // 存在则删除
-      if (this.checkTestScenarioList.includes(item.value)) {
-        this.checkTestScenarioList.splice(
-          this.checkTestScenarioList.indexOf(item.label),
-          1
-        )
-        item.check = false
-      } else {
-        item.check = true
-        this.checkTestScenarioList.push(item.value)
-      }
-      console.log('李斯特', this.checkTestScenarioList)
-    },
-    openAll() {
-      this.activeNames = this.model.carReviewTask.standard.map(i => {
-        return i.chapter
-      })
-    },
-    closeAll() {
-      this.activeNames = []
+      // carTaskSubmit(formData).then(res => {
+      //   if (res.code === 200) {
+      //     this.$modal.msgSuccess('确认提交成功')
+      //     this.$router.push({
+      //       path: '/processing/unprocessed-review'
+      //     })
+      //   } else {
+      //     this.$modal.msgError(res.msg)
+      //   }
+      // })
     }
   }
 }
 </script>
+<style scoped>
+.form-signature-confirmation .img-item .img {
+  width: 50% !important;
+}
+.table {
+  margin-top: 20px;
+}
+.table th {
+  background-color: #f2f2f2 !important;
+}
+</style>