边界划分

Signed-off-by: hsshuxian <3049816743@qq.com>

ems-ui-cloud/src/views/basecfg/boundaryRel/index.vue

@@ -35,7 +35,19 @@
             />
           </div>
         </div>
-        <div v-if="activeTab === 'device'"></div>
+        <div v-if="activeTab === 'device'">
+          <div class="head-container">
+            <el-input v-model="areaName" placeholder="请输入区块名称" clearable size="small" prefix-icon="el-icon-search"
+                      style="margin-bottom: 20px"
+            />
+          </div>
+          <div class="head-container">
+            <el-tree :key="tableKey" :data="deviceOptions" :props="defaultFacsProps" :expand-on-click-node="false"
+                     :filter-node-method="filterNode" ref="tree"
+                     node-key="id" default-expand-all highlight-current @node-click="handleDeviceNodeClick"
+            />
+          </div>
+        </div>
 
 
       </el-col>
@@ -231,7 +243,69 @@
         </div>
      <!--设备    -->
         <div v-if="activeTab === 'device'">
+          <el-tabs v-model="DeviceQueryParams.deviceCategory" @tab-click="deviceCategoryChange">
+            <el-tab-pane label="产能设备" name="E"></el-tab-pane>
+            <el-tab-pane label="储能设备" name="C"></el-tab-pane>
+            <el-tab-pane label="输能设备" name="W"></el-tab-pane>
+            <el-tab-pane label="用能设备" name="Z"></el-tab-pane>
+          </el-tabs>
+          <el-form :model="DeptQueryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
+                   label-width="68px"
+          >
+            <el-form-item label="设备分类" prop="deviceSubCategory">
+              <el-select v-model="DeptQueryParams.deviceSubCategory">
+                <el-option v-for="item in subCategoryOptions" placeholder="设备分类" :label="item.name" :value="item.code"
+                           :key="item.code"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="归属设施" prop="refFacs">
+              <el-select v-model="DeptQueryParams.refFacs">
+                <el-option v-for="item in facsAllOptions" :label="item.facsName" :value="item.facsCode"
+                           :key="item.facsCode"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="子系统" prop="subsystemCode">
+              <el-select v-model="DeptQueryParams.subsystemCode">
+                <el-option v-for="item in subsystemOptions" :label="item.systemName" :value="item.systemCode"
+                           :key="item.systemCode"
+                />
+              </el-select>
+            </el-form-item>
+
+            <el-form-item label="设备工艺" prop="psCode" v-if="DeptQueryParams.deviceCategory === 'W'">
+              <el-select v-model="DeptQueryParams.psCode">
+                <el-option v-for="item in devOptions" :label="item.psName" :value="item.psCode" :key="item.psCode"/>
+              </el-select>
+            </el-form-item>
+
 
+            <el-form-item>
+              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleDeviceQuery">搜索</el-button>
+              <el-button icon="el-icon-refresh" size="mini" @click="resetDeviceQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+
+          <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
+            <el-table-column type="selection" width="55" align="center"/>
+            <el-table-column label="设备名称" align="left" prop="deviceName"/>
+            <el-table-column label="安装位置" align="left" prop="areaPath" width="220px"/>
+            <el-table-column label="归属设施" align="center" prop="refFacsName"/>
+            <el-table-column label="设备分类" align="center" prop="deviceCategoryName"/>
+            <el-table-column label="子系统" align="center" prop="subsystemName"/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template slot-scope="scope">
+                <el-button
+                    size="mini"
+                    type="text"
+                    icon="el-icon-reading"
+                    @click="handleAllDevice(scope.row)"
+                    v-hasPermi="['ems:area:edit']"
+                >计量设备</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
 
       </el-col>
@@ -279,9 +353,6 @@
             </template>
           </el-table-column>
           <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-            <!--                <template slot-scope="scope">-->
-            <!--                  <el-button size="mini" type="text" icon="el-icon-arrow-up" @click="moveToDevice(scope.row)">绑定</el-button>-->
-            <!--                </template>-->
             <template slot-scope="scope">
               <!-- 检查是否已绑定 -->
               <div v-if="isAlreadyBound(scope.row.deviceCode)">
@@ -315,11 +386,13 @@ import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 import { areaTreeSelect, listDetailArea } from '@/api/basecfg/area'
 import SubTitle from '@/components/SubTitle/index.vue'
-import { getEmsTag } from '@/api/commonApi'
+import { getDevProcess, getEmsTag } from '@/api/commonApi'
 import { delDevice, listDevice } from '@/api/device/meterDevice'
 import { addAllByObj, listByObj } from '@/api/basecfg/boundaryRel'
 import { listDept } from '@/api/system/dept'
-import { getFacsCategorygetByCode, listFacs } from '@/api/basecfg/emsfacs'
+import { getFacsCategorygetByCode, listAllFacs, listFacs } from '@/api/basecfg/emsfacs'
+import { listDevRecursionByArea } from '@/api/device/device'
+import { listSubsystemAll } from '@/api/adapter/subsystem'
 
 
 export default {
@@ -332,6 +405,8 @@ export default {
       areaOptions: [],
       organOptions: [],
       facsOptions: undefined,
+      facsAllOptions:undefined,
+      deviceOptions:undefined,
       // 区域名称
       areaName: undefined,
       deptName:undefined,
@@ -363,6 +438,7 @@ export default {
       areaList: [],
       deptList:[],
       facsList:[],
+      deviceList:[],
       // 总条数
       total: 0,
       // 弹出层标题
@@ -408,6 +484,18 @@ export default {
         refArea: null,
         customAttrs: null
       },
+      // 设备查询参数
+      DeviceQueryParams: {
+        psCode: null,
+        pageNum: 1,
+        pageSize: 10,
+        deviceCode: null,
+        deviceSubCategory: '',
+        deviceCategory: 'E',
+        locationRef: null,
+        refFacs: null,
+        customAttrs: null
+      },
       // 水表、电表查询参数
       MeterQueryParams: {
         pageNum: 1,
@@ -470,6 +558,11 @@ export default {
       // 设施分类列表
       facsCategoryOptions: undefined,
       facsSubCategoryOptions: undefined,
+      // 设备分类
+      subCategoryOptions: undefined,
+      subsystemOptions: undefined,
+      subcategoryCode: '',
+      devOptions: undefined,
       parentAreaCode:'',
       dialogTitle: '',
       deviceDialogVisible: false,
@@ -481,16 +574,21 @@ export default {
   mounted() {
     this.getList();
     this.getFacsList();
+    this.getDeviceList();
   },
   created() {
-    this.getAreaTree('0', false)
+    this.getAreaFacsTree('0', false)
+    this.getAreaDeviceTree('0', false)
+    this.getAllDevProcess(this.subcategoryCode)
     this.getEmsTag('Area');
+    this.getFacsOptions()
+    this.getSubsystem()
     this.form.areaAttr = {};
     this.getList();
     this.getDeptList();
   },
   methods: {
-    getAreaTree(areaCode, recursion) {
+    getAreaFacsTree(areaCode, recursion) {
       areaTreeSelect(areaCode, recursion).then(response => {
         this.facsOptions = [{
           id: '-1',
@@ -499,6 +597,15 @@ export default {
         }]
       })
     },
+    getAreaDeviceTree(areaCode, recursion) {
+      areaTreeSelect(areaCode, recursion).then(response => {
+        this.deviceOptions =  [{
+          id: null,
+          label: '全部',
+          children: response.data
+        }]
+      })
+    },
     filterNode(value, data) {
       if (!value) return true
       return data.label.indexOf(value) !== -1
@@ -558,7 +665,7 @@ export default {
         this.getFacsList()
       }else if (tab.name === 'device') {
         this.showSearch = true;
-        //this.getDeviceList();
+        this.getDeviceList();
       }
     },
     /**电表、水表分页*/
@@ -615,6 +722,11 @@ export default {
       this.FacsQueryParams.refArea = data.id
       this.handleFacsQuery()
     },
+    //设备
+    handleDeviceNodeClick(data) {
+      this.DeviceQueryParams.refArea = data.id
+      this.handleDeviceQuery()
+    },
 
 
     /** 查询区域对象列表 */
@@ -690,6 +802,15 @@ export default {
         this.tableKey += 1;
       })
     },
+    /** 查询能源设备列表 */
+    getDeviceList() {
+      this.loading = true
+      listDevRecursionByArea(this.DeptQueryParams).then(response => {
+        this.deviceList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -796,6 +917,16 @@ export default {
       this.resetForm('queryForm')
       this.handleFacsQuery()
     },
+    /**设备搜索按钮操作 */
+    handleDeviceQuery() {
+      this.DeviceQueryParams.pageNum = 1
+      this.getDeviceList()
+    },
+    resetDeviceQuery() {
+      this.DeptQueryParams.locationRef = null
+      this.resetForm('queryForm')
+      this.handleDeviceQuery()
+    },
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
@@ -817,11 +948,10 @@ export default {
         }
       this.dialogTitle = `计量设备 - ${row.areaName}`;
       this.deviceDialogVisible = true;
-      this.getMeterData();
+      this.getMeterData(row);
     },
     /**组织结构计量设备*/
     handleDeptDevice(row) {
-      console.log("组织结构计量设备",row)
       this.queryParams.areaCode = row.deptId;
       if (row && row.ancestors) {
         const ancestorsArray = row.ancestors.split(',');
@@ -837,7 +967,6 @@ export default {
     },
     /**设施计量设备*/
     handleFacsDevice(row) {
-      console.log("设施计量设备",row)
       this.queryParams.areaCode = row.facsCode;
       this.MeterQueryParams.areaCode = row.refArea;
 
@@ -845,6 +974,15 @@ export default {
       this.deviceDialogVisible = true;
       this.getMeterData();
     },
+    /**设备计量设备*/
+    handleAllDevice(row) {
+      this.queryParams.areaCode = row.deviceCode;
+      this.MeterQueryParams.areaCode = row.locationRef;
+
+      this.dialogTitle = `计量设备 - ${row.deviceName}`;
+      this.deviceDialogVisible = true;
+      this.getMeterData();
+    },
     getMeterData() {
       this.loading = true;
       let meterCls = '';
@@ -853,27 +991,47 @@ export default {
       } else if (this.activeDeviceTab === 'waterMeter') {
         meterCls = 70;
       }
+      let objType;
+      if (this.activeTab === 'area') {
+        objType = 1;
+      } else if (this.activeTab === 'organ') {
+        objType = 4;
+      } else if (this.activeTab === 'facs') {
+        objType = 2;
+      } else if (this.activeTab === 'device') {
+        objType = 3;
+      }
       listDevice({ ...this.MeterQueryParams, meterCls}).then(response => {
         this.Unbound = response.rows;
         this.total = response.total;
         this.loading = false;
       });
-      listByObj(1,meterCls,this.queryParams.areaCode).then(response=>{
+      listByObj(objType,meterCls,this.queryParams.areaCode).then(response=>{
         this.Bound = response.data;
       })
     },
 
     /**绑定设备*/
     moveToDevice(row) {
+      let objType;
+      if (this.activeTab === 'area') {
+        objType = 1;
+      } else if (this.activeTab === 'organ') {
+        objType = 4;
+      } else if (this.activeTab === 'facs') {
+        objType = 2;
+      } else if (this.activeTab === 'device') {
+        objType = 3;
+      }
       const index = this.Unbound.indexOf(row);
       if (index !== -1) {
         this.Unbound.splice(index, 1);
       }
       const boundRow = {
-        ...row,
-        boundaryObj: this.queryParams.areaCode,
+        meterDeviceName: row.deviceName, // 表计名称
         meterDevice: row.deviceCode,
-        objType: 1
+        boundaryObj: this.queryParams.areaCode,
+        objType: objType // 设置 objType
       };
       this.Bound.push(boundRow);
     },
@@ -933,14 +1091,52 @@ export default {
     },
     facsCategoryChange() {
       this.FacsQueryParams.facsSubCategory = ''
-      this.getSubCategorygetByCode()
+      this.getFacsSubCategorygetByCode()
       this.handleFacsQuery()
     },
-    getSubCategorygetByCode() {
+    getFacsSubCategorygetByCode() {
       getFacsCategorygetByCode(this.FacsQueryParams.facsCategory).then(response => {
         this.facsSubCategoryOptions = response.data.subtypeList || []
       })
     },
+    getDeviceSubCategorygetByCode() {
+      getFacsCategorygetByCode(this.DeviceQueryParams.deviceCategory).then(response => {
+        this.subCategoryOptions = response.data.subtypeList || []
+      })
+    },
+    // 设施下拉框选项
+    getFacsOptions() {
+      const getFacsParams = {
+        facsCategory: this.DeviceQueryParams.deviceCategory,
+        subCategory: this.DeviceQueryParams.deviceSubCategory
+      }
+      listAllFacs(getFacsParams).then(response => {
+        this.facsAllOptions = response.data
+      })
+    },
+    deviceCategoryChange() {
+      this.DeviceQueryParams.deviceSubCategory = ''
+      //this.queryParams.psCode = null; // 重置设备工艺选择
+      if (this.DeviceQueryParams.deviceCategory === 'E' || this.DeviceQueryParams.deviceCategory === 'W'
+          || this.DeviceQueryParams.deviceCategory === 'T' || this.DeviceQueryParams.deviceCategory === 'C') {
+        this.getAreaDeviceTree('0', false)
+      } else if (this.DeviceQueryParams.deviceCategory === 'Z') {
+        this.getAreaDeviceTree('0', true)
+      }
+      this.getDeviceSubCategorygetByCode()
+      this.getFacsOptions()
+      this.handleDeviceQuery()
+    },
+    getSubsystem() {
+      listSubsystemAll().then(response => {
+        this.subsystemOptions = response.data
+      })
+    },
+    getAllDevProcess(subcategoryCode) {
+      getDevProcess(subcategoryCode).then(response => {
+        this.devOptions = response.data
+      })
+    },
     getEmsTag(tagModel) {
       console.log("tagModel", tagModel)
       getEmsTag(tagModel).then(response => {