添加测评机构页面添加资源

package-lock.json

@@ -492,8 +492,8 @@
     },
     "async-validator": {
       "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.8.5.tgz",
-      "integrity": "sha512-tXBM+1m056MAX0E8TL2iCjg8WvSyXu0Zc8LNtYqrVeyoL3+esHRZ4SieE9fKQyyU09uONjnMEjrNBMqT0mbvmA==",
+      "resolved": "https://registry.npm.taobao.org/async-validator/download/async-validator-1.8.5.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fasync-validator%2Fdownload%2Fasync-validator-1.8.5.tgz",
+      "integrity": "sha1-3D4I7B/Q3dtn5ghC8CwM0c7G1/A=",
       "requires": {
         "babel-runtime": "6.x"
       }
@@ -2869,8 +2869,8 @@
     },
     "deepmerge": {
       "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz",
-      "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ=="
+      "resolved": "https://registry.npm.taobao.org/deepmerge/download/deepmerge-1.5.2.tgz",
+      "integrity": "sha1-EEmdhohEza1P7ghC34x/bwyVp1M="
     },
     "define-properties": {
       "version": "1.1.3",
@@ -3171,9 +3171,9 @@
       "dev": true
     },
     "element-ui": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.8.2.tgz",
-      "integrity": "sha512-LABKHKGUyewFNvpf9BQLecB659Wq0XYvyP1tBveZ4RWpdlPSylDfGW/RLvDYU7zuCBoRasdZAz7ryjOwq1lLNg==",
+      "version": "2.11.0",
+      "resolved": "https://registry.npm.taobao.org/element-ui/download/element-ui-2.11.0.tgz",
+      "integrity": "sha1-TouyCDiXhbbyIVxf/fZDHdwBfJ0=",
       "requires": {
         "async-validator": "~1.8.1",
         "babel-helper-vue-jsx-merge-props": "^2.0.0",
@@ -6899,7 +6899,7 @@
     },
     "normalize-wheel": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
+      "resolved": "https://registry.npm.taobao.org/normalize-wheel/download/normalize-wheel-1.0.1.tgz",
       "integrity": "sha1-rsiGr/2wRQcNhWRH32Ls+GFG7EU="
     },
     "npm-run-path": {
@@ -9980,8 +9980,8 @@
     },
     "resize-observer-polyfill": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
-      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
+      "resolved": "https://registry.npm.taobao.org/resize-observer-polyfill/download/resize-observer-polyfill-1.5.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fresize-observer-polyfill%2Fdownload%2Fresize-observer-polyfill-1.5.1.tgz",
+      "integrity": "sha1-DpAg3T0hAkRY1OvSfiPkAmmBBGQ="
     },
     "resolve": {
       "version": "1.11.0",
@@ -11143,8 +11143,8 @@
     },
     "throttle-debounce": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
-      "integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
+      "resolved": "https://registry.npm.taobao.org/throttle-debounce/download/throttle-debounce-1.1.0.tgz",
+      "integrity": "sha1-UYU9o3vmihVctugns1FKPEIuic0="
     },
     "through": {
       "version": "2.3.8",

package.json

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "axios": "latest",
-    "element-ui": "^2.8.2",
+    "element-ui": "^2.11.0",
     "font-awesome": "^4.7.0",
     "mockjs": "^1.0.1-beta3",
     "vue": "^2.5.2",

src/components/cheat/AgencyAdd.vue

@@ -3,6 +3,17 @@
     <div class="create-body">
       <div class="title">添加机构</div>
       <el-form :model="agency" :rules="rules" ref="agency" label-width="12%" class="demo-report">
+        <!--<el-form-item prop="file" label="头像">-->
+        <!--<el-row class="demo-avatar demo-basic">-->
+        <!--<el-col :span="12">-->
+        <!--<div class="demo-basic&#45;&#45;circle">-->
+        <!--<div class="block">-->
+        <!--<el-avatar :size="200" src="https://www.baidu.com/img/bd_logo1.png"></el-avatar>-->
+        <!--</div>-->
+        <!--</div>-->
+        <!--</el-col>-->
+        <!--</el-row>- -->
+        <!--</el-form-item>-->
         <el-form-item label="机构名称" prop="name">
           <el-input v-if="isModifyMode" v-model="agency.name"></el-input>
           <!--<span v-if="!isModifyMode">{{agency.name}}</span>-->
@@ -24,11 +35,65 @@
           <!--<span v-if="!isModifyMode">{{agency.address}}</span>-->
         </el-form-item>
         <el-form-item label="测评机构能力" prop="name">
-          <el-input v-if="isModifyMode" v-model="agency.ability"></el-input>
+          <el-checkbox-group v-if="isModifyMode" v-model="agency.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">{{agency.ability}}</span>-->
         </el-form-item>
         <el-form-item label="测评机构资源" prop="name">
-          <el-input v-if="isModifyMode" v-model="agency.resource"></el-input>
+          <span v-for="item in agency.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>
+          <!--<div>-->
+          <!--<el-row>-->
+          <!--<el-col :span="2">-->
+          <!--<span>专家数量</span>-->
+          <!--</el-col>-->
+          <!--<el-col :span="10">-->
+          <!--共&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.professionalsCount"-->
+          <!--placeholder="0"></el-input-number>&nbsp;&nbsp;人，-->
+          <!--可用&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.professionalsFreeCount"-->
+          <!--placeholder="0"></el-input-number>&nbsp;&nbsp;人；-->
+          <!--</el-col>-->
+          <!--</el-row>-->
+          <!--<el-row>-->
+          <!--<el-col :span="2">-->
+          <!--<span>服务器数量</span>-->
+          <!--</el-col>-->
+          <!--<el-col :span="10">-->
+          <!--共&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.serversCount" placeholder="0"></el-input-number>&nbsp;&nbsp;台，-->
+          <!--可用&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.serversFreeCount"-->
+          <!--placeholder="0"></el-input-number>&nbsp;&nbsp;台；-->
+          <!--</el-col>-->
+          <!--</el-row>-->
+          <!--<el-row>-->
+          <!--<el-col :span="2">-->
+          <!--<span>专用设备数量</span>-->
+          <!--</el-col>-->
+          <!--<el-col :span="10">-->
+          <!--共&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.devicesCount" placeholder="0"></el-input-number>&nbsp;&nbsp;台，-->
+          <!--可用&nbsp;&nbsp;<el-input-number :min="0" v-model="agency.devicesFreeCount"-->
+          <!--placeholder="0"></el-input-number>&nbsp;&nbsp;台。-->
+          <!--</el-col>-->
+          <!--</el-row>-->
+          <!--</div>-->
+          <!--<el-input v-if="isModifyMode" v-model="agency.resource"></el-input>-->
           <!--<span v-if="!isModifyMode">{{agency.resource}}</span>-->
         </el-form-item>
         <el-form-item prop="file" label="头像">
@@ -111,6 +176,7 @@
 import Http from '@/js/http'
 import Apis from '@/js/api'
 import {notify} from '@/constants/index'
+import {getAllAbilities, getAllAgencyResourceTypes} from '@/js/index'
 
 export default {
   name: 'AgencyAdd',
@@ -119,14 +185,30 @@ export default {
       userId: 0,
       isModifyMode: true,
       dialogVisible: false,
+      serviceTypes: [],
+      resourceTypes: [],
       agency: {
         mobile: '',
         email: '',
         name: '',
         bankAccount: '',
         address: '',
-        ability: '',
-        resource: '',
+        ability: [],
+        resource: [
+          {
+            id: 0,
+            type: '',
+            name: '',
+            totalNum: 0,
+            availableNum: 0,
+          }
+        ],
+        professionalsCount: 0,
+        professionalsFreeCount: 0,
+        serversCount: 0,
+        serversFreeCount: 0,
+        devicesCount: 0,
+        devicesFreeCount: 0,
         photo: [],
         photoUrl: '',
         password: '',
@@ -150,10 +232,36 @@ export default {
         // conclusion: [
         //   {required: true, message: '请输入报告结论', trigger: 'blur'}
         // ]
-      }
+      },
+      tableData: [{
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }, {
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1517 弄'
+      }, {
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1519 弄'
+      }, {
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1516 弄'
+      }]
     }
   },
+  mounted () {
+    this.$nextTick(() => {
+      this.init()
+    })
+  },
   methods: {
+    init () {
+      this.setServiceTypes()
+      this.setResourceTypes()
+    },
     //加载数据
     loadData: function () {
     },
@@ -256,6 +364,50 @@ export default {
         password: '',
         username: '',
       }
+    },
+    setServiceTypes () {
+      this.serviceTypes = getAllAbilities()
+    },
+    addAgencyResource () {
+      const tmpResource = {
+        id: this.agency.resource.length,
+        type: this.resourceTypes[0],
+        name: '',
+        totalNum: 0,
+        availableNum: 0,
+      }
+      this.agency.resource.push(tmpResource)
+      this.checkAgencyResourceVaild()
+    },
+    removeAgencyResource (id) {
+      this.agency.resource.splice(id, 1)
+      for (var i = 0; i < this.agency.resource.length; i++) {
+        this.agency.resource[i].id = i
+      }
+    },
+    setResourceTypes () {
+      this.resourceTypes = getAllAgencyResourceTypes()
+    },
+    checkAgencyResourceVaild () {
+      if (this.agency.resource.length === 0) {
+        return true
+      }
+      for (var i = 0;i<this.agency.resource.length;i++) {
+        const item = this.agency.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 () {
@@ -312,4 +464,8 @@ export default {
     height: 178px;
     display: block;
   }
+
+  .el-input-number {
+    width: 150px;
+  }
 </style>

src/js/index.js

@@ -147,6 +147,12 @@ export const getAllAbilities = () => {
   //return Http.get(Apis.GENERAL.GET_ALL_ABILITIES)
 }
 
+//获取所有测评资源种类
+export const getAllAgencyResourceTypes = () => {
+  return ['人力资源', '服务器资源', '专用设备']
+  //return Http.get(Apis.GENERAL.GET_ALL_ABILITIES)
+}
+
 //获取所有服务类型
 export const getAllServiceTypes = () => {
   return ['接口测试', '安全漏洞扫描', '风险评估服务', '源代码安全审计服务', '功能测试服务', '性能测试', '功能和易用性测试']

src/main.js

@@ -6,6 +6,7 @@ import router from './router'
 import 'font-awesome/css/font-awesome.css'
 import './style/main.scss'
 import {
+  Avatar,
   Button,
   ButtonGroup,
   Card,
@@ -105,6 +106,7 @@ Vue.use(CollapseItem)
 Vue.use(Dialog)
 Vue.use(Card)
 Vue.use(Tag)
+Vue.use(Avatar)
 
 Vue.prototype.$msgbox = MessageBox
 Vue.prototype.$alert = MessageBox.alert