设备台账、设备告警

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

ems-ui-cloud/src/views/analysis/device/DevcWarning/index.vue

@@ -107,6 +107,7 @@ export default {
       const {
         code,
         data,
+
       } = await fetchAlarmIndex({
         areaCode: this.selectedServiceArea.val,
       });

ems-ui-cloud/src/views/analysis/device/warn.vue

@@ -18,7 +18,7 @@
           <el-col :span="12">
             <LineChartBlock title="历史告警变化" :opt-cfg="devcWarningHis">
               <template v-slot:filters>
-                <SwitchTag :ds="[{ val: 'day', text: '按日' }, { val: 'month', text: '按月' }, { val: 'year', text: '按年' }]"
+                <SwitchTag :ds="[{ val: 'year', text: '按年' }, { val: 'month', text: '按月' }, { val: 'day', text: '按日' }]"
                   :defTag="dateType" :tagClick="onDateTypeSwitch" />
               </template>
             </LineChartBlock>
@@ -57,7 +57,7 @@
           <el-col :span="12">
             <BarChartBlock title="告警统计报表" :opt-cfg="subSysIndex">
               <template v-slot:filters>
-                <SwitchTag :ds="[{ val: 'day', text: '按日' }, { val: 'month', text: '按月' }, { val: 'year', text: '按年' }]"
+                <SwitchTag :ds="[{ val: 'year', text: '按年' }, { val: 'month', text: '按月' }, { val: 'day', text: '按日' }]"
                   :defTag="dateType" :tagClick="onSubSysDateTypeSwitch" />
               </template>
             </BarChartBlock>
@@ -103,10 +103,12 @@ export default {
   },
   data () {
     return {
+      startRecTime: '',
+      endRecTime: '',
       areaName: undefined,
       areaOptions: [],
       ALARM_STATE,
-      dateType: {val: 'day'},
+      dateType: {val: 'year'},
       areaCode: '',
       devcWarningHis: {
         unit: '  ',
@@ -136,8 +138,16 @@ export default {
   async mounted () {
     await this.getAreaTreeByTag('0', false)
     this.queryCharts()
+    this.getRecentSevenDays();
   },
   methods: {
+    /**计算近7天的时间范围*/
+    getRecentSevenDays() {
+      const endRecTime = dayjs(); // 当前时间
+      const startRecTime = endRecTime.subtract(7, 'days'); // 7天前的时间
+      this.startRecTime = startRecTime.format('YYYY-MM-DD HH:mm:ss');
+      this.endRecTime = endRecTime.format('YYYY-MM-DD HH:mm:ss');
+    },
     /** 查询区域树结构 */
     async getAreaTreeByTag(areaCode, recursion) {
       await areaTreeSelect(areaCode, recursion).then(response => {
@@ -267,6 +277,8 @@ export default {
         alarmStateList: [
           ALARM_STATE.new.value, ALARM_STATE.disposing.value,
         ],
+        startRecTime: this.startRecTime,
+        endRecTime: this.endRecTime,
       });
       if (ApiCode.SUCCESS === code && rows && rows.length > 0) {
         result = rows;

ems-ui-cloud/src/views/devmgr/el/index.vue

@@ -22,10 +22,16 @@
             <el-autocomplete v-model="queryParams.objName" placeholder="请输入对象名称" clearable
               :fetch-suggestions="querySearch" @select="handleSelect"></el-autocomplete>
           </el-form-item>
-          <el-form-item label="创建时间" prop="recordTime">
-            <el-date-picker clearable v-model="queryParams.recordTime" type="date" value-format="yyyy-MM-dd"
-              placeholder="请选择日期">
-            </el-date-picker>
+          <el-form-item label="创建时间">
+            <el-date-picker
+              v-model="queryParams.recordTimeRange"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
           </el-form-item>
           <el-form-item label="维护标题" prop="maintainTitle">
             <el-input v-model="queryParams.maintainTitle" placeholder="请输入维护标题" clearable
@@ -40,7 +46,6 @@
             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
           </el-form-item>
         </el-form>
-
         <el-row :gutter="10" class="mb8">
           <el-col :span="1.5">
             <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
@@ -57,13 +62,11 @@
 
         <el-table v-loading="loading" :data="rbookList" @selection-change="handleSelectionChange">
           <el-table-column type="selection" width="55" align="center" />
+          <el-table-column label="园区编号" align="center" prop="areaCode" />
           <el-table-column label="记录编号" align="center" prop="recordCode" />
           <el-table-column label="目标对象" align="center" prop="objName">
             <template slot-scope="scope">
-              <span v-if="scope.row.objType">({{ dict.type.device_type[scope.row.objType].label }}) {{
-                scope.row.objName
-                }}</span>
-              <span v-else>({{ dict.type.device_type[scope.row.objType].label }}){{ scope.row.objName }}</span>
+              {{ scope.row.objName }}
             </template>
           </el-table-column>
           <el-table-column label="安装位置" align="center" prop="insLocation" />
@@ -90,22 +93,22 @@
     <!-- 查看设备台账对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="园区编码" prop="areaCode">
+          <el-select v-model="form.areaCode">
+            <el-option v-for="item in areaOptionsForSelect" :label="item.label" :value="item.id" :key="item.id" />
+          </el-select>
+        </el-form-item>
         <el-form-item label="记录编号" prop="recordCode">
           <el-input v-model="form.recordCode" placeholder="请输入记录编号" :disabled="isViewOnly" />
         </el-form-item>
         <el-form-item label="对象类型">
           <el-select v-model="form.objType" placeholder="请选择对象类型" @change="changeObjOptions" :disabled="isViewOnly">
-            <!--            <el-option v-for = "item in objTypeOptions"-->
-            <!--                       :label="item.name"-->
-            <!--                       :value="item.code"-->
-            <!--                       :key="item.code" />-->
-            <el-option v-for="dict in dict.type.device_type" :key="dict.value" :label="dict.label"
+                     <el-option v-for="dict in dict.type.device_type" :key="dict.value" :label="dict.label"
               :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="    " prop="objCode" v-if="showObjCode">
-          <el-cascader v-model="form.objCode" :options="AllCode" placeholder="请选择具体数据" @change="handleSelect"
-            :props="{ value: 'value', label: 'label', children: 'children' }" :disabled="isViewOnly"></el-cascader>
+        <el-form-item label=" " prop="objCode">
+          <treeselect v-model="form.objCode" :options="objCodeOptions" :show-count="true" placeholder="请选择具体数据"  @select="handleSelect"/>
         </el-form-item>
         <el-form-item label="创建时间" prop="recordTime">
           <el-date-picker clearable v-model="form.recordTime" type="date" value-format="yyyy-MM-dd"
@@ -148,6 +151,11 @@
     <!-- 添加或修改设备台账对话框 -->
     <el-dialog :title="title" :visible.sync="addOrUpdateOpen" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="园区编码" prop="areaCode">
+          <el-select v-model="form.areaCode">
+            <el-option v-for="item in areaOptionsForSelect" :label="item.label" :value="item.id" :key="item.id" />
+          </el-select>
+        </el-form-item>
         <el-form-item label="记录编号" prop="recordCode">
           <el-input v-model="form.recordCode" placeholder="请输入记录编号" />
         </el-form-item>
@@ -157,9 +165,8 @@
               :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="   " prop="objCode" v-if="showObjCode">
-          <el-cascader v-model="form.objCode" :options="AllCode" placeholder="请选择具体数据" @change="handleSelect"
-            :props="{ value: 'value', label: 'label', children: 'children' }"></el-cascader>
+        <el-form-item label=" " prop="objCode">
+          <treeselect v-model="form.objCode" :options="objCodeOptions" :show-count="true" placeholder="请选择具体数据"  @select="handleSelect"/>
         </el-form-item>
         <el-form-item label="创建时间" prop="recordTime">
           <el-date-picker clearable v-model="form.recordTime" type="date" value-format="yyyy-MM-dd"
@@ -200,7 +207,7 @@ import Treeselect from '@riophae/vue-treeselect'
 export default {
   name: 'Rbook',
   components: {Treeselect},
-  dicts: ['device_type'],
+   dicts: ['device_type'],
   data () {
     return {
       isViewOnly: false, // 添加这个标志变量
@@ -218,6 +225,7 @@ export default {
       total: 0,
       // 设备台账表格数据
       rbookList: [],
+      areaOptionsForSelect:[],
       // 弹出层标题
       title: '',
       // 是否显示弹出层
@@ -247,18 +255,21 @@ export default {
         areaCode: ''
       },
       queryFacsParams: {
-        areaCode: ''
+        areaCode: '',
+        objType: null,
       },
-
-      objTypeOptions: [
-        {code: 1, name: '设施'},
-        {code: 0, name: '设备'},
+      objTypeOptiOns:[
+        {code: '1', name: '区域'},
+        {code: '2', name: '设备'},
+        {code: '3', name: '设施'}
       ],
-
-      // 表单参数
+     // 表单参数
       form: {},
       // 表单校验
       rules: {
+        areaCode: [
+          {required: true, message: '园区编号不能为空', trigger: 'blur'}
+        ],
         recordCode: [
           {required: true, message: '记录编号不能为空', trigger: 'blur'}
         ],
@@ -279,8 +290,11 @@ export default {
   },
   async created () {
     await this.getAreaTreeByTag('0', false)
-    this.getList()
+    // 确保默认选中第一个Tab，并设置 queryParams.objType
+    this.queryParams.objType = this.dict.type.device_type[0].value;
+    this.getList(true); // 调用 getList 并传递一个参数来强制刷新
   },
+
   // 当对象类型有值时，显示对象代码输入框
   watch: {
     'form.objType' (newVal) {
@@ -289,19 +303,24 @@ export default {
     // 根据名称筛选区域树
     areaName (val) {
       this.$refs.tree.filter(val)
-    }
+    },
   },
   methods: {
     /** 查询设备台账列表 */
-    getList () {
+    getList(refresh = false) {
+      if (refresh) {
+        // 强制刷新时重置页码
+        this.queryParams.pageNum = 1;
+      }
       this.loading = true
       listRbook(this.queryParams).then(response => {
-        console.log('设备台账搜索参数！！！！！', this.queryParams)
+       console.log('设备台账搜索参数！！！！！', this.queryParams)
         this.rbookList = response.rows
         this.total = response.total
         this.loading = false
       })
     },
+
     /** 查询区域树结构 */
     async getAreaTreeByTag(areaCode, recursion) {
       await areaTreeSelect(areaCode, recursion).then(response => {
@@ -310,7 +329,10 @@ export default {
           label: '全部',
           children: []
         }].concat(response.data)
-        this.queryParams.areaCode = '-1'
+        this.form.areaCode = '-1'
+        // 创建一个新的数组仅包含“全部”下的前三个子项
+        this.areaOptionsForSelect = response.data.slice(0, 3);
+
       })
     },
     // 筛选节点
@@ -319,7 +341,8 @@ export default {
       return data.label.indexOf(value) !== -1
     },
     handleNodeClick (data, node) {
-      this.queryParams.areaCode = data.id
+      this.form.areaCode = data.id
+      console.log('Selected areaCode:', this.form.areaCode);
       this.getList()
     },
     // 取消按钮
@@ -374,127 +397,70 @@ export default {
       this.single = selection.length !== 1
       this.multiple = !selection.length
     },
+    getAreaLabelById(id) {
+      const item = this.areaOptions.find(item => item.id === id);
+      return item ? item.label : 'default';
+    },
 
-    /**对象类型*/
     changeObjOptions (objType) {
-      if (objType == 1) {
-        this.queryFacsParams.areaCode = this.areaCode
-        // 设施
-        listAllFacs(this.queryFacsParams).then(response => {
-          this.objCodeOptions = response.data
-          console.log('设施多少数据！！！', this.objCodeOptions)
-          this.AllCode = this.objCodeOptions.map(item => ({
-            value: item.facsCode,
-            label: item.facsName
-          }))
+      console.log("objType",objType)
+      if (objType === '1') {
+        // 区域逻辑
+        areaTreeSelect(this.form.areaCode, true).then(response => {
+          this.objCodeOptions = [{
+            id: this.form.areaCode,
+            label: this.getAreaLabelById(this.form.areaCode),
+            children: response.data
+          }]
+          console.log("this.objCodeOptions ",this.objCodeOptions )
         })
-      } else if (objType == 0) {
-        // 设备
-        devTreeByFacs(this.areaCode).then(response => {
+      } else if (objType === '2') {
+        // 设备逻辑
+        areaTreeSelect(this.form.areaCode, true).then(response => {
+          this.objCodeOptions = [{
+            id: this.form.areaCode,
+            label: this.getAreaLabelById(this.form.areaCode),
+            children: response.data
+          }]
+          console.log("this.objCodeOptions ",this.objCodeOptions )
+        })
+      } else if (objType === '3') {
+        // 设施逻辑
+        const devcCategory = 'Z';
+        devTreeByFacs(this.form.areaCode, devcCategory).then(response => {
           this.objCodeOptions = response.data
-          console.log('设备多少数据！！！', this.objCodeOptions)
-          this.AllCode = this.buildTree(this.objCodeOptions)
-
+          console.log("this.objCodeOptions ",this.objCodeOptions )
         })
-
       }
     },
-    buildTree (data) {
-      return data.map(item => {
-        const node = {
-          value: item.id,
-          label: item.label,
-          children: item.children ? this.buildTree(item.children) : undefined
-        }
-        return node
-      })
-    },
-
     /** 数据自动填补*/
     handleSelect (value) {
+      console.log("数据自动填补", value);
+      if (value && value.id && value.label) {
+        // 将 label 值填入“目标对象”输入框
+        this.form.objName = value.label;
+        // 找到选中的id所在的层级路径，并以"/"连接
+        const pathLabels = this.findPathLabel(this.objCodeOptions, value.id);
+        if (pathLabels) {
+          this.form.insLocation = pathLabels.join('/');
+        }
+      }
+    },
 
-      // 检查 value 是否为数组
-      if (Array.isArray(value)) {
-        // 检查数组是否至少有一个元素，并且第一个元素的首字母是否为字母
-        if (value.length > 0 && /^[a-zA-Z]/.test(value[0][0])) {
-          this.queryFacsParams.areaCode = this.areaCode
-
-          // 获取能源设施所有信息
-          listAllFacs(this.queryFacsParams).then(response => {
-            const data = response.data
-            console.log('data', data)
-            // 循环输出
-            for (let i = 0; i < data.length; i++) {
-              if (value.includes(data[i].facsCode)) {
-                this.form.objName = data[i].facsName
-                this.form.insLocation = data[i].refAreaName
-                console.log('设施名字', this.form.objName)
-                console.log('设施地址', this.form.insLocation)
-                return
-              }
-            }
-          })
-        } else if (value.length > 0) {
-          // 获取能源设备所有信息
-          devTreeByFacs(this.areaCode).then(response => {
-            const data = response.data
-            console.log('data', data)
-
-            function findDeviceById (data, path = [], ids) {
-              for (const item of data) {
-                const currentPath = [...path, {label: item.label, tier: item.tier}]
-                if (ids.includes(item.id)) {
-                  // 找到 tier 为 'Device' 的层级，并获取最后一个“-”后面的数据
-                  const deviceTierIndex = currentPath.findIndex(p => p.tier === 'Device')
-                  let lastSegment = ''
-                  let deviceLabel = ''
-                  if (deviceTierIndex !== -1) {
-                    deviceLabel = currentPath[deviceTierIndex].label
-                    lastSegment = deviceLabel.split('-').pop()
-                  }
-                  return {labels: currentPath, lastSegment, deviceLabel, found: true}
-                }
-                if (item.children && item.children.length) {
-                  const result = findDeviceById(item.children, currentPath, ids)
-                  if (result.found) {
-                    return result
-                  }
-                }
-              }
-              return {labels: [], lastSegment: null, deviceLabel: '', found: false}
-            }
-
-            let lastResult = {labels: [], lastSegment: null, deviceLabel: '', found: false}
-            value.forEach(id => {
-              const result = findDeviceById(data, [], [id])
-              if (result.found) {
-                lastResult = result
-              }
-            })
-
-            if (lastResult.found) {
-              // 构建 insLocation 和 objName
-              let insLocationParts = [lastResult.labels[0].label] // 第一层的 label
-              if (lastResult.deviceLabel) {
-                let deviceLabelParts = lastResult.deviceLabel.split('-')
-                deviceLabelParts.pop() // 移除最后一个“-”后面的数据
-                insLocationParts = insLocationParts.concat(deviceLabelParts.join('-'))
-              }
-
-              this.form.insLocation = insLocationParts.join(' / ')
-              this.form.objName = lastResult.lastSegment
-              console.log('设备名字', this.form.objName)
-              console.log('设备地址', this.form.insLocation)
-            } else {
-              console.log('没有找到匹配的设备')
-            }
-          })
-        } else {
-          console.log('value 为空数组或不满足条件')
+// 递归函数，用于找到id所在的层级路径，并返回路径上的label数组
+    findPathLabel (options, id, path = []) {
+      for (let i = 0; i < options.length; i++) {
+        const option = options[i];
+        if (option.id === id) {
+          return path.concat(option.label);
+        } else if (option.children && option.children.length > 0) {
+          const foundLabels = this.findPathLabel(option.children, id, path.concat(option.label));
+          if (foundLabels) {
+            return foundLabels;
+          }
         }
-      } else {
-        console.log('value 不是数组')
       }
+      return null;
     },
 
     /**编辑按钮操作*/
@@ -503,11 +469,12 @@ export default {
       this.title = '编辑设备台账'
     },
 
-    // /** 新增按钮操作 */
+    /** 新增按钮操作 */
     handleAdd () {
       this.reset()
       this.addOrUpdateOpen = true
       this.title = '添加设备台账'
+
     },
     /**查看按钮*/
     handleViewRec (row) {
@@ -522,11 +489,6 @@ export default {
         this.open = true
         this.title = '查看设备台账'
         this.isViewOnly = true // 设置为查看模式
-        // if (this.form.objType === 1) {
-        //   this.form.objType = "设施";
-        // } else if (this.form.objType === 0) {
-        //   this.form.objType = "设备";
-        // }
       })
     },
     /** 提交按钮 */