更新

src/views/poDogJobManage/components/poDogJobManageEdit.vue

@@ -4,7 +4,7 @@
     v-loading="loading"
   >
     <div class="contents">
-      {{detailInfo}}
+      {{kaoHeLists}}
       <el-form
         :model="detailInfo"
         ref="detailInfoRef"
@@ -196,10 +196,130 @@
               placeholder="请输入DNA编号"
             ></el-input>
           </el-form-item>
+          <el-form-item
+            class="elItemClass sxjqClass"
+            v-for="(item, index) in kaoHeLists"
+            :key="index"
+            :prop="'propKaoHe' + index"
+          >
+            <template slot="label">
+              <span class="labelNameClass">考核分数</span>
+              <span class="yuandianClass"></span>
+              <span class="numClass">{{ index + 1}}</span>
+            </template>
+            <el-select
+              clearable
+              placeholder="专业方向"
+              class="itemSxjqClass"
+              v-model="item.zhuanye"
+            >
+              <el-option
+                v-for="(item, index) in zyfxOptions"
+                :key="index"
+                :label="item.label"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+            <el-input
+              v-model.trim="item.fenshu"
+              placeholder="分数"
+              :clearable="true"
+              class="itemJqxphClass"
+            ></el-input>
+            <div
+              class="conBtnClass"
+              title="增加考核"
+              v-if="index === 0"
+              @click="addKaoHe"
+            >+</div>
+            <div
+              class="conBtnClass"
+              title="删除考核"
+              v-if="index > 0"
+              @click="removeKaoHe(index)"
+            >-</div>
+          </el-form-item>
         </div>
 
         <div class="hengLine"></div>
 
+        <div
+          class="titles"
+          style="width: 90px;"
+        >采集人信息</div>
+        <div class="divBoxClass">
+          <el-form-item
+            label="采集人姓名"
+            class="elItemClass"
+            prop="xxdjryXm"
+          >
+            <el-input
+              v-model="detailInfo.xxdjryXm"
+              :disabled="true"
+              placeholder="采集人姓名"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            label="采集人身份证号码"
+            class="elItemClass"
+            prop="xxdjryGmsfhm"
+          >
+            <el-input
+              v-model="detailInfo.xxdjryGmsfhm"
+              :disabled="true"
+              placeholder="采集人身份证号码"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            label="采集人单位名称"
+            class="elItemClass"
+            prop="xxdjdwGajgmc"
+          >
+            <el-input
+              v-model="detailInfo.xxdjdwGajgmc"
+              :disabled="true"
+              placeholder="采集人单位名称"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            label="采集人单位代码"
+            class="elItemClass"
+            prop="xxdjdwGajgjgdm"
+          >
+            <el-input
+              v-model="detailInfo.xxdjdwGajgjgdm"
+              :disabled="true"
+              placeholder="采集人单位代码"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            label="采集时间"
+            class="elItemClass"
+            prop="djsj"
+          >
+            <el-input
+              v-model="detailInfo.djsj"
+              :disabled="true"
+              placeholder="采集时间"
+            ></el-input>
+          </el-form-item>
+        </div>
+
+        <div class="hengLine"></div>
+
+        <div class="elBtns">
+          <el-button
+            size="small"
+            @click="goBack"
+          >返回</el-button>
+          <el-button
+            type="primary"
+            size="small"
+            style="margin-right: 0 !important;"
+            @click="saveData"
+          >保存</el-button>
+        </div>
       </el-form>
     </div>
   </div>
@@ -233,8 +353,6 @@ export default {
         trainingLevelId: "",
         speciesId: "",
         dna: "",
-        // workingDogClassificationId: "",
-        // score: "",
 
         xxdjryXm: "",
         xxdjryGmsfhm: "",
@@ -242,6 +360,12 @@ export default {
         xxdjdwGajgjgdm: "",
         djsj: "",
       },
+      kaoHeLists: [
+        {
+          zhuanye: "",
+          fenshu: "",
+        },
+      ],
       rules: {
         chipCode: [
           { required: true, message: "请输入芯片号", trigger: "blur" },
@@ -296,6 +420,19 @@ export default {
             trigger: "change",
           },
         ],
+        xxdjryXm: [
+          { required: true, message: "采集人姓名必填", trigger: "blur" },
+        ],
+        xxdjryGmsfhm: [
+          { required: true, message: "采集人身份证号码必填", trigger: "blur" },
+        ],
+        xxdjdwGajgmc: [
+          { required: true, message: "采集人单位名称必填", trigger: "blur" },
+        ],
+        xxdjdwGajgjgdm: [
+          { required: true, message: "采集人单位代码必填", trigger: "blur" },
+        ],
+        djsj: [{ required: true, message: "采集时间必填", trigger: "blur" }],
       },
       userInfoJson: {},
 
@@ -304,6 +441,7 @@ export default {
       sylbOptions: [],
       gzqdjOptions: [],
       jyjqOptions: [],
+      zyfxOptions: [],
     };
   },
   async mounted() {
@@ -330,6 +468,7 @@ export default {
     this.sylbOptions = await getJsonDataApi("CODE_BASEDATA");
     this.gzqdjOptions = await getJsonDataApi("CODE_GZQDJ");
     this.jyjqOptions = await getJsonDataApi("CODE_SPECIES");
+    this.zyfxOptions = await getJsonDataApi("CODE_WORKINGDOGCLASSIFICA");
   },
   methods: {
     handleTiQu() {
@@ -338,7 +477,58 @@ export default {
         }
       });
     },
+    addKaoHe() {
+      this.kaoHeLists.push({
+        zhuanye: "",
+        fenshu: "",
+      });
+    },
+    removeKaoHe(index) {
+      this.kaoHeLists.splice(index, 1);
+    },
+    updateKaoHeRules(val) {
+      if (val?.length) {
+        val.forEach((item, index) => {
+          this.rules[`propKaoHe${index}`] = [
+            {
+              required: true,
+              validator: (rule, value, callback) => {
+                let myreg = /^([0-9]{1,2}$)|(^[0-9]{1,2}\.[0-9]{1,2}$)|100$/;
+                let zhuanye = item.zhuanye || "";
+                let fenshu = item.fenshu || "";
+                if (!zhuanye) {
+                  callback(new Error(`请选择专业方向`));
+                } else if (!fenshu) {
+                  callback(new Error(`请输入分数`));
+                } else if (!myreg.test(fenshu)) {
+                  callback(new Error(`分数输入有误，0-100之间且小数位最多2位`));
+                } else {
+                  callback();
+                }
+              },
+              trigger: "change",
+            },
+          ];
+        });
+      }
+    },
+    goBack() {},
     getDetail(id) {},
+    saveData() {
+      this.$refs.detailInfoRef.validate((result) => {
+        if (result) {
+        }
+      });
+    },
+  },
+  watch: {
+    kaoHeLists: {
+      deep: true,
+      immediate: true,
+      handler(val) {
+        this.updateKaoHeRules(val);
+      },
+    },
   },
 };
 </script>
@@ -391,11 +581,11 @@ export default {
     vertical-align: middle;
   }
   .itemSxjqClass {
-    width: 32%;
+    width: 41% !important;
     margin-right: 5%;
   }
   .itemJqxphClass {
-    width: 50%;
+    width: 41%;
     margin-right: 5%;
   }
   .itemJqxphClass2 {