Merge remote-tracking branch 'origin/dev-hanshaozhuang' into develop

src/views/review/createReview/index.vue

@@ -10,7 +10,7 @@
         :inline="true"
       >
         <el-form-item label="对应标准">
-          <el-select v-model="formModel.ask" clearable style="width: 100%">
+          <el-select v-model="formModel.ask" style="width: 100%">
             <el-option
               key="1"
               value="1"
@@ -20,8 +20,8 @@
           </el-select>
         </el-form-item>
       </el-form>
-      <div v-if="pageIndex === 1" style="display: flex">
-        <div style="flex-shrink: 0">
+      <div v-if="pageIndex === 1">
+        <div class="review-data-title">
           发起评审（{{
             selectDictLabel(
               dict.type.create_review_type,
@@ -33,24 +33,18 @@
               formModel.reviewSubtype
             )
           }}）
+          <div class="review-data-return" @click="handleGoBack">
+            <span class="el-icon-back" />返回
           </div>
-        <div
-          style="
-            flex-grow: 1;
-            text-align: right;
-            color: #1890ff;
-            text-decoration: underline;
-            cursor: pointer;
-          "
-          @click="handleGoBack"
-        >
-          返回
         </div>
       </div>
     </div>
     <div v-if="pageIndex === 0" class="create-review-content">
       <div class="center-tip">
-        <div class="el-icon-time icon-custon-style" />
+        <el-image
+          :src="require('@/assets/images/createReview/xuanzepinshen.png')"
+          class="icon-custon-style"
+        ></el-image>
         <div class="center-tip-text">请选择要发起的评审类型</div>
         <div class="center-top-text-small">只能选择一种类型</div>
       </div>
@@ -75,7 +69,10 @@
       </div>
       <div class="create-review-footer">
         <el-button type="primary" class="next-button" @click="pageIndex = 1"
-          >下一步</el-button
+          ><span
+            class="el-icon-check"
+            style="margin-right: 6px"
+          />下一步</el-button
         >
       </div>
     </div>
@@ -122,6 +119,28 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.create-review {
+  .review-data-title {
+    text-align: center;
+    position: relative;
+    font-size: 20px;
+    font-family: Microsoft YaHei, Microsoft YaHei-700;
+    font-weight: 700;
+    color: #303133;
+    line-height: 18px;
+    .review-data-return {
+      position: absolute;
+      top: 0;
+      right: 0;
+      text-align: right;
+      cursor: pointer;
+      font-size: 14px;
+      font-family: Microsoft YaHei, Microsoft YaHei-400;
+      font-weight: 400;
+      color: #1a6fd7;
+    }
+  }
+}
 .create-review-content {
   width: 100%;
   margin-top: 50px;
@@ -130,9 +149,9 @@ export default {
   flex-direction: column;
   align-items: center;
   .center-tip {
-    width: 400px;
-    height: 200px;
-    border: 1px solid #bbbbbb;
+    width: 574px;
+    height: 252px;
+    border: 1px solid #ebebeb;
     margin-bottom: 50px;
     display: flex;
     flex-direction: column;
@@ -140,17 +159,22 @@ export default {
     align-items: center;
     text-align: center;
     .icon-custon-style {
-      font-size: 90px;
-      color: #00afff;
+      width: 139px;
+      height: 124px;
+      border: 1px dashed #ebebeb;
     }
     .center-tip-text {
-      font-size: 18px;
-      font-weight: bold;
+      color: #303133;
+      font-size: 16px;
+      font-family: Microsoft YaHei, Microsoft YaHei-400;
+      font-weight: 400;
       margin: 10px 0;
     }
     .center-top-text-small {
-      font-size: 12px;
-      color: #bbbbbb;
+      font-size: 14px;
+      font-family: Microsoft YaHei, Microsoft YaHei-400;
+      font-weight: 400;
+      color: #f9a221;
     }
   }
   .review-type-content {
@@ -168,7 +192,7 @@ export default {
     display: flex;
     justify-content: center;
     .next-button {
-      width: 150px;
+      width: 130px;
     }
   }
 }

src/views/review/createReview/reviewData/index.vue

@@ -3,15 +3,17 @@
     <el-form
       :model="formModel"
       :rules="formRules"
-      label-suffix=":"
       label-width="200px"
+      label-position="top"
     >
-      <el-form-item label="对应标准" label-width="72px">
-        汽车整车信息安全技术要求
-      </el-form-item>
+      <div class="standard-text">对应标准：汽车整车信息安全技术要求</div>
       <div class="subtitle">评审对象</div>
       <el-form-item label="条款分类" prop="tiaokuanfenlei">
-        <el-select v-model="formModel.tiaokuanfenlei" clearable>
+        <el-select
+          v-model="formModel.tiaokuanfenlei"
+          style="width: 421px"
+          clearable
+        >
           <el-option
             v-for="dict in dict.type.sys_scene_type"
             :key="dict.value"
@@ -20,7 +22,7 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="条款分类" prop="biaozhuntiuaokuan">
+      <el-form-item label="标准条款" prop="biaozhuntiuaokuan">
         <el-button type="primary" plain @click="handleReSelect"
           >重新选择标准条款</el-button
         >
@@ -55,6 +57,8 @@
           </div>
         </div>
       </el-form-item>
+      <el-row :gutter="41">
+        <el-col span="12">
           <el-form-item label="审查要点" prop="shenchayaodian">
             <el-input
               v-model="formModel.shenchayaodian"
@@ -62,11 +66,13 @@
               placeholder="请输入审查要点"
               maxlength="100"
               show-word-limit
-          :autosize="{ minRows: 6, maxRows: 6 }"
-          style="width: 350px"
+              :autosize="{ minRows: 4, maxRows: 6 }"
+              resize="none"
             >
             </el-input>
           </el-form-item>
+        </el-col>
+        <el-col span="12">
           <el-form-item label="审查细则" prop="shenchaxize">
             <el-input
               v-model="formModel.shenchaxize"
@@ -74,16 +80,20 @@
               placeholder="请输入审查细则"
               maxlength="100"
               show-word-limit
-          :autosize="{ minRows: 6, maxRows: 6 }"
-          style="width: 350px"
+              :autosize="{ minRows: 4, maxRows: 6 }"
+              resize="none"
             >
             </el-input>
           </el-form-item>
+        </el-col>
+      </el-row>
 
       <div class="subtitle">评审成员</div>
       <el-form-item label="评审人员">
-        <div>组长-xxx</div>
+        <div class="assessor-text">
+          <div style="margin-bottom: 10px">组长-xxx</div>
           <div>组员-xxx、xxx、xxx</div>
+        </div>
       </el-form-item>
       <div class="subtitle">附加信息</div>
       <el-form-item label="备注信息">
@@ -93,15 +103,18 @@
           placeholder="请输入备注信息"
           maxlength="100"
           show-word-limit
-          :autosize="{ minRows: 6, maxRows: 6 }"
-          style="width: 350px"
+          :autosize="{ minRows: 3, maxRows: 6 }"
+          resize="none"
         >
         </el-input>
       </el-form-item>
     </el-form>
     <div class="create-review-footer">
       <el-button type="primary" class="next-button" @click="handleConfirm"
-        >确认发起</el-button
+        ><span
+          class="el-icon-check"
+          style="margin-right: 6px"
+        />确认发起</el-button
       >
     </div>
   </div>
@@ -151,6 +164,15 @@ export default {
 
 <style lang="scss" scoped>
 .review-data {
+  .standard-text {
+    width: 100%;
+    text-align: center;
+    font-size: 14px;
+    font-family: Microsoft YaHei, Microsoft YaHei-400;
+    font-weight: 400;
+    color: #606266;
+    line-height: 18px;
+  }
   .create-review-footer {
     margin-top: 50px;
     text-align: center;
@@ -160,5 +182,25 @@ export default {
       width: 150px;
     }
   }
+  .assessor-text {
+    background: #f5f5f5;
+    border: 1px solid #d9d9d9;
+    border-radius: 4px;
+    padding: 7px 10px;
+    font-family: Microsoft YaHei, Microsoft YaHei-400;
+    font-weight: 400;
+    text-align: left;
+    color: #606266;
+    line-height: 16px;
+  }
+  ::v-deep.el-form-item.is-required:not(.is-no-asterisk)
+    > .el-form-item__label:before,
+  .el-form-item.is-required:not(.is-no-asterisk)
+    .el-form-item__label-wrap
+    > .el-form-item__label:before {
+    float: right;
+    margin-left: 4px;
+    margin-right: 0;
+  }
 }
 </style>

src/views/task/new/components/CarInfo.vue

+<template>
+  <div class="car-info">
+    <el-card v-for="(card, index) in cards" :key="index" class="box-card">
+      <div style="text-align: right">
+        <span
+          type="text"
+          class="el-icon-close"
+          style="cursor: pointer"
+          @click="removeCard(index)"
+        />
+      </div>
+
+      <el-form label-position="top">
+        <el-form-item label="车辆识别码（VIN）">
+          <el-select v-model="card.code" clearable>
+            <el-option
+              key="1"
+              value="1"
+              label="汽车整车信息安全技术要求"
+            ></el-option>
+            <el-option key="2" value="2" label="xxxxx软件升级要求"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="样品编号">
+          <el-select v-model="card.number" clearable>
+            <el-option
+              key="1"
+              value="1"
+              label="汽车整车信息安全技术要求"
+            ></el-option>
+            <el-option key="2" value="2" label="xxxxx软件升级要求"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="样品名称">
+          <el-input v-model="card.name" disabled />
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <div class="box-card-add" @click="addCard">
+      <span class="el-icon-plus" />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CarInfo',
+  model: {
+    prop: 'cards',
+    event: 'change'
+  },
+  props: {
+    cards: {
+      type: Array,
+      default: () => []
+    }
+  },
+  methods: {
+    addCard() {
+      this.cards.push({
+        code: '',
+        number: '',
+        name: ''
+      })
+      this.emitChange()
+    },
+    removeCard(index) {
+      this.cards.splice(index, 1)
+      this.emitChange()
+    },
+    emitChange() {
+      this.$emit('change', this.cards)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.car-info {
+  display: flex;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+  .box-card {
+    width: 500px;
+    height: 277px;
+    margin-bottom: 20px;
+    margin-right: 40px;
+  }
+  .box-card-add {
+    width: 500px;
+    height: 277px;
+    background: #f3f8fd;
+    border: 2px dashed #d9d9d9;
+    border-radius: 4px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 60px;
+    color: #969696;
+    cursor: pointer;
+  }
+  .box-card,
+  .box-card-add {
+    flex: 0 0 500px; // 不允许子元素在主轴方向上伸缩
+    height: 277px;
+  }
+  .select-group {
+    margin-top: 15px;
+  }
+
+  .card-header-btn {
+    float: right;
+  }
+  ::v-deep.el-select,
+  .el-input {
+    width: 463.44px;
+  }
+  ::v-deep.el-form-item {
+    margin-bottom: 0;
+  }
+  ::v-deep.el-form--label-top .el-form-item__label {
+    padding-bottom: 0px;
+  }
+}
+</style>

src/views/task/new/components/PartInfo.vue

+<template>
+  <div class="part-info">
+    <el-card v-for="(card, index) in cards" :key="index" class="box-card">
+      <div style="text-align: right">
+        <span
+          type="text"
+          class="el-icon-close"
+          style="cursor: pointer"
+          @click="removeCard(index)"
+        />
+      </div>
+
+      <el-form label-position="top">
+        <el-form-item label="样品编号">
+          <el-select v-model="card.number" clearable>
+            <el-option
+              key="1"
+              value="1"
+              label="汽车整车信息安全技术要求"
+            ></el-option>
+            <el-option key="2" value="2" label="xxxxx软件升级要求"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="样品名称">
+          <el-input v-model="card.name" disabled />
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <div class="box-card-add" @click="addCard">
+      <span class="el-icon-plus" />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PartInfo',
+  model: {
+    prop: 'cards',
+    event: 'change'
+  },
+  props: {
+    cards: {
+      type: Array,
+      default: () => []
+    }
+  },
+  methods: {
+    addCard() {
+      this.cards.push({
+        code: '',
+        number: '',
+        name: ''
+      })
+      this.emitChange()
+    },
+    removeCard(index) {
+      this.cards.splice(index, 1)
+      this.emitChange()
+    },
+    emitChange() {
+      this.$emit('change', this.cards)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.part-info {
+  display: flex;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+  .box-card {
+    width: 500px;
+    margin-bottom: 20px;
+    margin-right: 40px;
+  }
+  .box-card-add {
+    width: 500px;
+    background: #f3f8fd;
+    border: 2px dashed #d9d9d9;
+    border-radius: 4px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 60px;
+    color: #969696;
+    cursor: pointer;
+  }
+  .box-card,
+  .box-card-add {
+    flex: 0 0 500px; // 不允许子元素在主轴方向上伸缩
+    height: 201px;
+  }
+  .select-group {
+    margin-top: 15px;
+  }
+
+  .card-header-btn {
+    float: right;
+  }
+  ::v-deep.el-select,
+  .el-input {
+    width: 463.44px;
+  }
+  ::v-deep.el-form-item {
+    margin-bottom: 0;
+  }
+  ::v-deep.el-form--label-top .el-form-item__label {
+    padding-bottom: 0px;
+  }
+}
+</style>

src/views/task/new/index.vue

@@ -24,18 +24,25 @@
       <!--          >车型检验任务-->
       <!--        </el-button>-->
       <!--      </el-form-item>-->
+      <div class="subtitle">基础信息</div>
+      <el-row :gutter="20">
+        <el-col :span="8">
           <el-form-item label="对应标准">
-        <el-select v-model="formType" clearable>
+            <el-select v-model="formType" style="width: 100%" clearable>
               <el-option
                 key="1"
                 value="1"
                 label="汽车整车信息安全技术要求"
               ></el-option>
-          <el-option key="2" value="2" label="xxxxx软件升级要求"></el-option>
+              <el-option
+                key="2"
+                value="2"
+                label="xxxxx软件升级要求"
+              ></el-option>
             </el-select>
           </el-form-item>
-
-      <div class="subtitle">基础信息</div>
+        </el-col>
+      </el-row>
       <el-row :gutter="20">
         <el-col :span="8">
           <el-form-item label="任务编号" prop="no">
@@ -388,6 +395,12 @@
           </div>
         </div>
       </div>
+      <!-- 整车样品信息 -->
+      <div class="subtitle" style="margin-top: 20px">整车样品信息</div>
+      <CarInfo v-model="carInfoArr" />
+      <!-- 零件样品信息 -->
+      <div class="subtitle" style="margin-top: 20px">零件样品信息</div>
+      <PartInfo v-model="partInfoArr" />
     </el-form>
 
     <div class="bottom-button">
@@ -412,6 +425,8 @@
 <script>
 import Sortable from 'sortablejs'
 import { manufacturerData } from '../../../api/task/new'
+import CarInfo from './components/CarInfo'
+import PartInfo from './components/PartInfo'
 export default {
   dicts: [
     'sys_task_status',
@@ -419,8 +434,25 @@ export default {
     'confidentiality_level',
     'test_scenario'
   ],
+  components: {
+    CarInfo,
+    PartInfo
+  },
   data() {
     return {
+      carInfoArr: [
+        {
+          code: '',
+          number: '',
+          name: ''
+        }
+      ],
+      partInfoArr: [
+        {
+          number: '',
+          name: ''
+        }
+      ],
       websock: null,
       name: '',
       formType: '1',