From 2f09fa2e05278bc6106f39b7efb9a53c73a5f309 Mon Sep 17 00:00:00 2001
From: z_yu <1534695664@qq.com>
Date: Mon, 18 Jul 2022 16:43:34 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=BE=E5=A4=87=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/storeManage/deviceManage/param.js     |  14 +-
 src/views/storeManage/deviceManage/index.vue  |  11 +-
 .../deviceManage/module/bindParams.vue        | 133 ++++++------------
 .../deviceManage/module/deviceDetail.vue      |  62 +++++---
 4 files changed, 101 insertions(+), 119 deletions(-)

diff --git a/src/api/storeManage/deviceManage/param.js b/src/api/storeManage/deviceManage/param.js
index 3de1354..52de8a1 100644
--- a/src/api/storeManage/deviceManage/param.js
+++ b/src/api/storeManage/deviceManage/param.js
@@ -8,23 +8,23 @@ export function getParams(params) {
   })
 }
 
-export function del(ids) {
+export function del(id) {
   const params = {
-    id: ids[0]
+    id: id
   }
   return request({
-    url: 'api/storeroom/delete',
+    url: 'api/spec/delete',
     method: 'delete',
     params
   })
 }
 
-export function edit(data) {
+export function add(data) {
   return request({
-    url: 'api/storeroom/update',
-    method: 'put',
+    url: 'api/spec/bind',
+    method: 'post',
     data
   })
 }
 
-export default { getParams, edit, del }
+export default { getParams, add, del }
diff --git a/src/views/storeManage/deviceManage/index.vue b/src/views/storeManage/deviceManage/index.vue
index 78ef012..859155f 100644
--- a/src/views/storeManage/deviceManage/index.vue
+++ b/src/views/storeManage/deviceManage/index.vue
@@ -48,7 +48,7 @@
           <span class="right-top-line" />
           <span class="left-bottom-line" />
           <div class="tree-scroll">
-            <el-tree ref="tree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :default-expanded-keys="defaultExpandedKeys" highlight-current @node-click="handleNodeClick" />
+            <el-tree ref="tree" v-loading="crud.loading" :expand-on-click-node="false" :data="crud.data" :props="defaultProps" node-key="id" :default-expanded-keys="defaultExpandedKeys" highlight-current @node-click="handleNodeClick" />
           </div>
         </div>
       </el-col>
@@ -123,9 +123,14 @@ export default {
     handleNodeClick(val) {
       if (val) {
         this.crud.selectionChangeHandler([val])
-        this.$refs.deviceDetail.storeroomId = val
+        if (val.id === this.crud.data[0].id) {
+          this.activeRightBtn = false
+          this.$refs.deviceDetail.storeroomId = {}
+        } else {
+          this.activeRightBtn = true
+          this.$refs.deviceDetail.storeroomId = val
+        }
         this.$refs.deviceDetail.crud.toQuery()
-        this.activeRightBtn = true
       }
     },
     // 编辑前将区域临时清空，避免日志入库数据过长
diff --git a/src/views/storeManage/deviceManage/module/bindParams.vue b/src/views/storeManage/deviceManage/module/bindParams.vue
index e811395..2dee754 100644
--- a/src/views/storeManage/deviceManage/module/bindParams.vue
+++ b/src/views/storeManage/deviceManage/module/bindParams.vue
@@ -1,7 +1,7 @@
 <template>
   <!--表单组件-->
   <!-- :before-close="crud.cancelCU" -->
-  <el-dialog class="binding-params-dialog" :close-on-click-modal="false" :visible.sync="bingParamsVisible" title="绑定参数">
+  <el-dialog class="binding-params-dialog" :close-on-click-modal="false" :visible.sync="bingParamsVisible" title="绑定参数" @closed="handleClose">
     <span class="dialog-right-top" />
     <span class="dialog-left-bottom" />
     <div class="setting-dialog">
@@ -19,19 +19,14 @@
           <el-button type="primary" @click="add">添加</el-button>
         </el-form>
       </div>
-      <!-- <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
-        <el-form-item label="区域名称" prop="name">
-          <el-input v-model="form.name" style="width: 370px;" />
-        </el-form-item>
-      </el-form> -->
-      <el-table ref="table" v-loading="crud.loading" :data="params">
+      <el-table ref="table" :loading="loading" :data="params">
         <el-table-column type="index" label="序号" width="55" align="center" />
         <el-table-column prop="paramId" label="参数ID" align="center" />
         <el-table-column prop="paramName" label="参数名称" align="center" />
         <el-table-column prop="unit" label="单位值" align="center" />
         <el-table-column label="操作" align="center">
           <template slot-scope="scope">
-            <el-button size="mini" icon="el-icon-delete" class="delete-btn" @click="handleDelete(scope.$index)">删除</el-button>
+            <el-button size="mini" icon="el-icon-delete" class="delete-btn" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -41,106 +36,60 @@
 
 <script>
 import crudMethod from '@/api/storeManage/deviceManage/param'
-import CRUD, { presenter, form } from '@crud/crud'
-// import Vue from 'vue'
-
-const defaultForm = { id: null, name: null, sort: null }
 
 export default {
   name: 'BingParams',
-  cruds() {
-    return [
-      CRUD({
-        title: '区域', url: 'api/storeroom/tree',
-        crudMethod: { ...crudMethod },
-        sort: ['sort,asc']
-      })
-    ]
-  },
-  mixins: [presenter(), form(defaultForm)],
   data() {
     return {
       rules: {
-        name: [
-          { required: true, message: '请输入区域名称', trigger: 'blur' }
+        paramId: [
+          { required: true, message: '请输入参数ID', trigger: 'blur' }
+        ],
+        paramName: [
+          { required: true, message: '请输入参数名称', trigger: 'blur' }
+        ],
+        unit: [
+          { required: true, message: '请输入单位值', trigger: 'blur' }
         ]
       },
       params: [],
       form: {},
-      // permission: {
-      //   add: ['admin', 'storeroom:add'],
-      //   edit: ['admin', 'storeroom:edit'],
-      //   del: ['admin', 'storeroom:del']
-      // },
-      // defaultProps: {
-      //   children: 'children',
-      //   label: 'name'
-      // },
-      // activeRightBtn: false,
+      deviceInfoId: null,
+      loading: false,
       bingParamsVisible: false
-      // ,
-      // deleteData: {},
-      // allowDelete: false, // 是否允许删除当前区域
-      // defaultExpandedKeys: []
     }
   },
   methods: {
-    // // 获取数据前设置好接口地址
-    // [CRUD.HOOK.beforeRefresh]() {
-    //   if (this.$refs.deviceDetail) {
-    //     this.$refs.deviceDetail.query.id = ''
-    //   }
-    //   return true
-    // },
-    // [CRUD.HOOK.afterRefresh]() {
-    //   Vue.set(this.defaultExpandedKeys, 0, this.crud.data[0].id)
-    //   this.$refs.tree.setCurrentKey(this.crud.data[0].id)
-    //   this.$refs.deviceDetail.storeroomId = this.crud.data[0].id
-    //   this.crud.selections = [this.crud.data[0]]
-    // },
-    // // 选中区域后，显示设备详情数据
-    // handleNodeClick(val) {
-    //   if (val) {
-    //     this.crud.selectionChangeHandler([val])
-    //     this.$refs.deviceDetail.query.id = val.id
-    //     this.$refs.deviceDetail.storeroomId = val
-    //     // this.$refs.deviceDetail.crud.toQuery()
-    //     this.activeRightBtn = true
-    //   }
-    // },
-    // // 编辑前将区域临时清空，避免日志入库数据过长
-    // [CRUD.HOOK.beforeToEdit](crud, form) {
-    //   form.deviceDetails = null
-    // },
-    // [CRUD.HOOK.beforeSubmit]() {
-    //   this.crud.form.pid = this.defaultExpandedKeys[0]
-    //   this.crud.form.remark = this.crud.form.name
-    //   if (!this.crud.form.sort) {
-    //     this.crud.form.sort = this.crud.data[0].children.reduce((prev, cur) => { return { sort: Math.max(prev.sort, cur.sort) } }).sort + 1
-    //   }
-    // },
-    // toDelete(data) {
-    //   this.deleteData = data
-    //   this.deleteVisible = true
-    //   this.allowDelete = this.$refs.deviceDetail.crud.data && this.$refs.deviceDetail.crud.data.length === 0
-    // },
-    // handleConfirm() {
-    //   this.deleteVisible = false
-    //   this.crud.delAllLoading = true
-    //   this.crud.doDelete(this.deleteData)
-    // },
-    // handleClose(done) {
-    //   this.deleteData = {}
-    //   done()
-    // }
-    handleDelete(index) {
-      // this.params.splice(index, 1)
+    handleDelete(index, row) {
+      crudMethod.del(row.id).then((res) => {
+        this.params.splice(index, 1)
+      })
     },
     add() {
-      // this.params.push(JSON.parse(JSON.stringify(this.form)))
-      // this.form.paramId = ''
-      // this.form.paramName = ''
-      // this.form.unit = ''
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.form.deviceInfoId = { id: this.deviceInfoId }
+          this.form.sequence = this.params.reduce((prev, cur) => { return { sequence: Math.max(prev.sequence, cur.sequence) } }, { sequence: 0 }).sequence + 1
+          crudMethod.add(this.form).then((res) => {
+            this.loading = true
+            crudMethod.getParams({ deviceInfoId: this.deviceInfoId }).then((data) => {
+              this.params.splice(0, this.params.length, ...data)
+              this.resetForm()
+              this.loading = false
+            })
+          })
+        } else {
+          return false
+        }
+      })
+    },
+    handleClose() {
+      this.resetForm()
+    },
+    resetForm() {
+      this.form.paramId = ''
+      this.form.paramName = ''
+      this.form.unit = ''
     }
   }
 }
diff --git a/src/views/storeManage/deviceManage/module/deviceDetail.vue b/src/views/storeManage/deviceManage/module/deviceDetail.vue
index 475e618..e61d595 100644
--- a/src/views/storeManage/deviceManage/module/deviceDetail.vue
+++ b/src/views/storeManage/deviceManage/module/deviceDetail.vue
@@ -8,15 +8,15 @@
         </template>
         <template v-slot:right>
           <el-button v-permission="permission.del" icon="el-icon-delete" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections && crud.selections.length === 0" @click="toDelete(crud.selections)">删除</el-button>
-          <el-select v-model="deviceType" class="filter-item" style="margin-left:10px" placeholder="全部">
+          <el-select v-model="deviceType" class="filter-item" style="margin-left:10px" placeholder="全部" @change="crud.toQuery">
             <el-option :key="0" label="全部" value="" />
             <el-option v-for="item in deviceTypeOptions" :key="item.id" :label="item.name" :value="item.id" />
           </el-select> <!-- -->
         </template>
         <template v-slot:rightButtonGroup>
           <div class="archives-handler-btn">
-            <el-button class="binding-mac-btn iconfont icon-bangdingshebei-fanbai" type="primary" :disabled="crud.selections.length !== 1" @click="bindingMac()">绑定设备</el-button>
-            <el-button class="binding-param-btn iconfont icon-bangdingcanshu-fanbai" type="primary" :disabled="crud.selections.length !== 1" @click="bindingParam(crud.selections[0].id)">绑定参数</el-button>
+            <el-button class="binding-mac-btn iconfont icon-bangdingshebei-fanbai" type="primary" :disabled="crud.selections.length !== 1 || (crud.selections[0].deviceTypeId && crud.selections[0].deviceTypeId.name !== '桌面式RFID读写器')" @click="bindingMac()">绑定设备</el-button>
+            <el-button class="binding-param-btn iconfont icon-bangdingcanshu-fanbai" type="primary" :disabled="crud.selections.length !== 1 || (crud.selections[0].deviceTypeId && (crud.selections[0].deviceTypeId.name !== '空调' && crud.selections[0].deviceTypeId.name !== '恒湿机' && crud.selections[0].deviceTypeId.name !== '漏水传感器' && crud.selections[0].deviceTypeId.name !== '温湿度感应器' && crud.selections[0].deviceTypeId.name !== '空气质量检测设备'))" @click="bindingParam(crud.selections[0].id)">绑定参数</el-button>
           </div>
         </template>
       </crudOperation>
@@ -174,18 +174,37 @@
       <span class="left-bottom-line" />
       <!--表格渲染-->
       <el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
-        <el-table-column type="selection" width="55" />
-        <el-table-column type="index" label="序号" width="55" />
-        <el-table-column prop="dicName" label="所属区域" />
-        <el-table-column prop="dicCode" label="设备状态" />
-        <el-table-column prop="dicExplain" label="设备类型" />
-        <el-table-column prop="dicCode" label="设备厂商" />
-        <el-table-column prop="dicCode" label="设备名称" />
-        <el-table-column prop="dicExplain" label="设备ID" />
-        <el-table-column prop="dicExplain" label="接口IP" />
-        <el-table-column prop="dicExplain" label="端口" />
-        <el-table-column prop="dicExplain" label="绑定设备" />
-        <el-table-column prop="dicExplain" label="绑定参数" />
+        <el-table-column align="center" type="selection" width="55" />
+        <el-table-column align="center" type="index" label="序号" width="55" />
+        <el-table-column align="center" prop="storeroomId.name" label="所属区域" />
+        <el-table-column align="center" label="设备状态">
+          <template slot-scope="scope">
+            <span :class="{ 'spk-a': scope.row.deviceState === 1 }" />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="deviceTypeId.name" label="设备类型" />
+        <el-table-column align="center" prop="supplierId.name" label="设备厂商" />
+        <el-table-column align="center" prop="deviceName" label="设备名称" />
+        <el-table-column align="center" label="设备ID">
+          <template slot-scope="scope">
+            <span v-if="scope.row.deviceId"> {{ scope.row.deviceId }} </span>
+            <span v-else>——</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="接口IP">
+          <template slot-scope="scope">
+            <span v-if="scope.row.deviceIp"> {{ scope.row.deviceIp }} </span>
+            <span v-else>——</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="端口">
+          <template slot-scope="scope">
+            <span v-if="scope.row.devicePort"> {{ scope.row.devicePort }} </span>
+            <span v-else>——</span>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="dicExplain" label="绑定设备" />
+        <el-table-column align="center" prop="dicExplain" label="绑定参数" />
       </el-table>
       <!--分页组件-->
       <pagination />
@@ -217,8 +236,7 @@ export default {
           reset: false,
           download: false,
           group: false
-        },
-        sort: ['dicSequence,asc']
+        }
       })
     ]
   },
@@ -487,6 +505,7 @@ export default {
       })
     },
     bindingParam(id) {
+      this.$refs.bindingParamsDlg.deviceInfoId = id
       paramApi.getParams({ deviceInfoId: id }).then((data) => {
         this.$refs.bindingParamsDlg.params = data
         this.$refs.bindingParamsDlg.bingParamsVisible = true
@@ -528,4 +547,13 @@ export default {
   }
   margin-left: auto;
 }
+.spk-a {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border-radius: 6px;
+  background-color: #1aae93;
+  box-shadow: 0px 0px 6px 1px #1aae93;
+  vertical-align: middle;
+}
 </style>