认证页面添加机构资源

src/components/authen/Authentication.vue

@@ -21,11 +21,31 @@
           <!--<span v-if="!isModifyMode">{{authentication.address}}</span>-->
         </el-form-item>
         <el-form-item label="测评机构能力" prop="name">
-          <el-input v-if="isModifyMode" v-model="authentication.ability"></el-input>
+          <el-checkbox-group v-if="isModifyMode" v-model="authentication.ability">
+            <span v-for="(item,index) in serviceTypes" :key="index">
+              <el-checkbox :label="item" name="type">{{item}}&nbsp;&nbsp;&nbsp;&nbsp;</el-checkbox>
+            </span>
+          </el-checkbox-group>
           <!--<span v-if="!isModifyMode">{{authentication.ability}}</span>-->
         </el-form-item>
         <el-form-item label="测评机构资源" prop="name">
-          <el-input v-if="isModifyMode" v-model="authentication.resource"></el-input>
+          <span v-for="item in authentication.resource" :key="item.id">
+            资源类型：&nbsp;<el-select v-model="item.type" placeholder="请选择" style="width: 150px" :value="item.type">
+              <el-option
+                v-for="item in resourceTypes"
+                :key="item"
+                :label="item"
+                :value="item">
+              </el-option>
+            </el-select>
+            资源名称：&nbsp;<el-input v-model="item.name" style="width: 150px"></el-input>
+            总量：&nbsp;<el-input-number :min="0" v-model="item.totalNum"></el-input-number>
+            可用数量：&nbsp;<el-input-number :min="0" :max="item.totalNum" v-model="item.availableNum"></el-input-number>
+            <el-button type="danger" icon="el-icon-delete" @click="removeAgencyResource(item.id)"></el-button>
+            <br/>
+          </span>
+          <el-button type="primary" icon="el-icon-circle-plus" plain size="small" @click="addAgencyResource">添加资源
+          </el-button>
           <!--<span v-if="!isModifyMode">{{authentication.resource}}</span>-->
         </el-form-item>
         <el-form-item prop="file" label="头像">
@@ -75,6 +95,7 @@
 import Http from '@/js/http'
 import Apis from '@/js/api'
 import {notify} from '@/constants/index'
+import {getAllAgencyResourceTypes, getAllServiceTypes} from '@/js/index'
 
 export default {
   name: 'Authentication',
@@ -82,13 +103,15 @@ export default {
     return {
       userId: 0,
       isModifyMode: true,
+      resourceTypes: [],
+      serviceTypes: [],
       authentication: {
         mobile: '',
         name: '',
         bankAccount: '',
         address: '',
         ability: '',
-        resource: '',
+        resource: [],
         photo: [],
         photoUrl: '',
       },
@@ -113,7 +136,16 @@ export default {
       }
     }
   },
+  mounted () {
+    this.$nextTick(() => {
+      this.init()
+    })
+  },
   methods: {
+    init () {
+      this.setServiceTypes()
+      this.setResourceTypes()
+    },
     //加载数据
     loadData: function () {
     },
@@ -171,6 +203,49 @@ export default {
       }).catch(error => {
         notify('error', error.data.msg)
       })
+    },
+    setServiceTypes () {
+      this.serviceTypes = getAllServiceTypes()
+    },
+    setResourceTypes () {
+      this.resourceTypes = getAllAgencyResourceTypes()
+    },
+    addAgencyResource () {
+      const tmpResource = {
+        id: this.authentication.resource.length,
+        type: this.resourceTypes[0],
+        name: '',
+        totalNum: 0,
+        availableNum: 0,
+      }
+      this.authentication.resource.push(tmpResource)
+    },
+    removeAgencyResource (id) {
+      this.authentication.resource.splice(id, 1)
+      for (var i = 0; i < this.authentication.resource.length; i++) {
+        this.authentication.resource[i].id = i
+      }
+    },
+    checkAgencyResourceVaild () {
+      if (this.authentication.resource.length === 0) {
+        return true
+      }
+      for (var i = 0; i < this.authentication.resource.length; i++) {
+        const item = this.authentication.resource[i]
+        if (item.type === '') {
+          notify('error', '资源类型不能为空')
+          return false
+        }
+        if (item.name === '') {
+          notify('error', '资源名称不能为空')
+          return false
+        }
+        if (item.totalNum < item.availableNum) {
+          notify('error', '资源总数量不能低于可用数量')
+          return false
+        }
+      }
+      return true
     }
   },
   created: function () {

src/components/cheat/AgencyAdd.vue

@@ -377,7 +377,6 @@ export default {
         availableNum: 0,
       }
       this.agency.resource.push(tmpResource)
-      this.checkAgencyResourceVaild()
     },
     removeAgencyResource (id) {
       this.agency.resource.splice(id, 1)
@@ -392,18 +391,18 @@ export default {
       if (this.agency.resource.length === 0) {
         return true
       }
-      for (var i = 0;i<this.agency.resource.length;i++) {
+      for (var i = 0; i < this.agency.resource.length; i++) {
         const item = this.agency.resource[i]
         if (item.type === '') {
-          notify('error','资源类型不能为空')
+          notify('error', '资源类型不能为空')
           return false
         }
         if (item.name === '') {
-          notify('error','资源名称不能为空')
+          notify('error', '资源名称不能为空')
           return false
         }
         if (item.totalNum < item.availableNum) {
-          notify('error','资源总数量不能低于可用数量')
+          notify('error', '资源总数量不能低于可用数量')
           return false
         }
       }