Przeglądaj źródła

修改点+日志

Signed-off-by: hsshuxian <3049816743@qq.com>
hsshuxian 4 miesięcy temu
rodzic
commit
465f501e4b

+ 43 - 0
ems-ui-cloud/src/api/basecfg/objLog.js

@@ -0,0 +1,43 @@
+import request from '@/utils/request'
+
+/**
+ * 查询设备上报日志列表
+ */
+export function listReportLog(query) {
+  return request({
+    url: '/ems/object/log/reportLog/list',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 获取设备上报日志详细
+ */
+export function getReportLog(id) {
+  return request({
+    url: '/ems/object/log/reportLog/' + id,
+    method: 'get'
+  })
+}
+
+/**
+ * 查询调用日志列表
+ */
+export function listCallLog(query) {
+  return request({
+    url: '/ems/object/log/callLog/list',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 获取调用日志详细
+ */
+export function getCallLog(id) {
+  return request({
+    url: '/ems/object/log/callLog/' + id,
+    method: 'get'
+  })
+}

+ 334 - 15
ems-ui-cloud/src/views/basecfg/device/index.vue

@@ -18,7 +18,7 @@
         <el-tabs v-model="queryParams.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="W"></el-tab-pane>
           <el-tab-pane label="用能设备" name="Z"></el-tab-pane>
         </el-tabs>
         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
@@ -96,6 +96,27 @@
               <el-button size="mini" type="text" icon="el-icon-info" @click="handleDetail(scope.row)"
                          v-hasPermi="['basecfg:device:edit']">详情
               </el-button>
+              <!-- 下拉菜单 -->
+              <el-dropdown trigger="click" >
+                <el-button type="text" size="mini" @click="loadAbilities(scope.row)">
+                  操作<i class="el-icon-arrow-down el-icon--right"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item
+                    v-for="ability in abilityDevice"
+                    :key="ability.abilityKey"
+                    @click.native="handleDeviceOperate(ability,scope.row)"
+                  >
+                    {{ ability.abilityName }}
+                  </el-dropdown-item>
+                  <el-dropdown-item @click.native="showCallLog(scope.row)">
+                    调用日志
+                  </el-dropdown-item>
+                  <el-dropdown-item @click.native="showReportLog(scope.row)">
+                    设备日志
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
             </template>
           </el-table-column>
         </el-table>
@@ -104,6 +125,119 @@
                     :limit.sync="queryParams.pageSize"
                     @pagination="getList"
         />
+        <!-- 调用日志弹窗 -->
+        <el-dialog :visible.sync="callLog" title="调用日志" width="60%">
+          <el-form inline>
+            <el-form-item label="记录时间">
+              <el-date-picker
+                v-model="callDaterangeTime"
+                style="width: 240px"
+                value-format="yyyy-MM-dd HH:mm"
+                type="datetimerange"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              ></el-date-picker>
+            </el-form-item>
+            <el-form-item label="能力标识">
+              <el-select v-model="callLogQueryParams.abilityKey" placeholder="请选择能力标识" clearable>
+                <el-option
+                  v-for="item in abilityDevice"
+                  :key="item.abilityKey"
+                  :label="item.abilityName"
+                  :value="item.abilityKey"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="调用状态">
+              <el-select v-model="callLogQueryParams.callStatus" placeholder="请选择调用状态" clearable>
+                <el-option
+                  v-for="(value, key) in callStatusOptions"
+                  :key="key"
+                  :label="value"
+                  :value="key"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="handleCallLogQuery">查询</el-button>
+              <el-button @click="resetCallLogQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <el-table :data="callLogData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
+            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
+            <el-table-column label="对象代码" prop="objCode"></el-table-column>
+            <el-table-column label="模型代码" prop="modelCode"></el-table-column>
+            <el-table-column label="能力标识" prop="abilityKey"></el-table-column>
+            <el-table-column label="调用时间" prop="callTime"></el-table-column>
+            <el-table-column label="操作" align="center" width="100">
+              <template slot-scope="scope">
+                <el-button type="text" size="mini" icon="el-icon-info" @click="handleCallLogDetail(scope.row)">详情</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-dialog>
+
+        <!-- 调用日志详情弹窗 -->
+        <el-dialog :visible.sync="callLogDetailDialog" title="调用日志详情" width="50%">
+          <div v-if="callLogDetailData">
+            <p><strong>对象代码:</strong>{{ callLogDetailData.objCode }}</p>
+            <p><strong>对象类型:</strong>{{ formatObjType(callLogDetailData.objType) }}</p>
+            <p><strong>模型代码:</strong>{{ callLogDetailData.modelCode }}</p>
+            <p><strong>能力标识:</strong>{{ callLogDetailData.abilityKey }}</p>
+            <p><strong>调用时间:</strong>{{ callLogDetailData.callTime }}</p>
+            <p><strong>响应时间:</strong>{{ callLogDetailData.resTime }}</p>
+            <p><strong>调用结果:</strong>{{ formatCallStatus(callLogDetailData.callStatus) }}</p>
+            <p><strong>调用载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;">{{ callLogDetailData.callPayload }}</pre>
+            <p><strong>响应载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;">{{ callLogDetailData.resPayload  }}</pre>
+          </div>
+        </el-dialog>
+
+        <!-- 设备日志弹窗 -->
+        <el-dialog :visible.sync="reportLog" title="设备日志" width="60%">
+          <el-form inline>
+            <el-form-item label="记录时间">
+              <el-date-picker
+                v-model="logDaterangeTime"
+                style="width: 240px"
+                value-format="yyyy-MM-dd HH:mm"
+                type="datetimerange"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              ></el-date-picker>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="handleLogQuery">查询</el-button>
+              <el-button @click="resetLogQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <el-table :data="reportLogData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
+            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
+            <el-table-column label="对象代码" prop="objCode"></el-table-column>
+            <el-table-column label="消息描述" prop="msgDesc"></el-table-column>
+            <el-table-column label="上报时间" prop="reportTime" width="180"></el-table-column>
+            <el-table-column label="操作" align="center" width="100">
+              <template slot-scope="scope">
+                <el-button type="text" size="mini" icon="el-icon-info" @click="handleReportLogDetail(scope.row)">详情</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-dialog>
+
+        <!-- 设备日志详情弹窗 -->
+        <el-dialog :visible.sync="reportDetailDialog" title="设备日志详情" width="50%">
+          <div v-if="reportDetailData">
+            <p><strong>对象代码:</strong>{{ reportDetailData.objCode }}</p>
+            <p><strong>对象类型:</strong>{{ formatObjType(reportDetailData.objType) }}</p>
+            <p><strong>消息描述:</strong>{{ reportDetailData.msgDesc }}</p>
+            <p><strong>上报时间:</strong>{{ reportDetailData.reportTime }}</p>
+            <p><strong>上报载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;">{{ reportDetailData.reportPayload }}</pre>
+          </div>
+        </el-dialog>
 
         <!-- 添加或修改能源设备对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
@@ -140,14 +274,14 @@
               </el-select>
             </el-form-item>
             <el-form-item label="子系统" prop="subsystemCode">
-              <el-select v-model="form.subsystemCode">
+              <el-select v-model="form.subsystemCode" clearable>
                 <el-option v-for="item in subsystemOptions" :label="item.systemName" :value="item.systemCode"
                            :key="item.systemCode"
                 />
               </el-select>
             </el-form-item>
             </div>
-            <!-- 这里可以展示属性名称和属性值 -->
+            <!-- 属性名称、属性值 -->
               <div v-if="attrList.length > 0" class="attr-list-container">设备参数:
                 <ul>
                   <li v-for="attr in attrList" :key="attr.attrKey" class="attr-item">
@@ -331,21 +465,27 @@
                 </div>
               </el-card>
             </div>
-
             <!-- 属性信息 -->
             <div v-if="activeTab === 'attr'">
               <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                  <span class="section-title">设备参数</span>
-                </div>
                 <div v-for="(tableData, tableName) in attrTables" :key="tableName">
                   <p class="section-title">{{ tableData.title }}</p>
                   <el-table :data="tableData.data" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
                     <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                     <el-table-column label="属性名称" prop="attrName"></el-table-column>
                     <el-table-column label="属性标识" prop="attrKey"></el-table-column>
-                    <el-table-column label="属性值" prop="attrValue"></el-table-column>
-                    <el-table-column label="属性值描述" prop="attrValueName"></el-table-column>
+                    <!-- 动态显示属性值 -->
+                    <el-table-column label="属性值" align="center">
+                      <template slot-scope="scope">
+                        <span v-if="tableData.title === '状态属性'">
+                       {{ scope.row.attrValueName || getAttrValueText(scope.row.attrValue) }}
+                        <span v-if="scope.row.attrUnit">{{ scope.row.attrUnit }}</span>
+                        </span>
+                        <span v-else>
+                        {{ scope.row.attrValue }}
+                        </span>
+                      </template>
+                    </el-table-column>
                   </el-table>
                 </div>
               </el-card>
@@ -425,6 +565,7 @@ import { addComponent, delComponent, getComponent, listByDevice, updateComponent
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 import {listcallAbility} from '@/api/basecfg/objAbility'
+import { getCallLog, getReportLog, listCallLog, listReportLog } from '@/api/basecfg/objLog'
 
 
 export default {
@@ -448,6 +589,7 @@ export default {
       attrList: [],
       attrValues: [],
       ComponentList: [],
+      abilityDevice:[],
       attrValuesMap: {},
       modelList: [],
       showDrawer: false,
@@ -486,6 +628,31 @@ export default {
         children: 'children',
         label: 'label'
       },
+      callDaterangeTime: [],
+      logDaterangeTime: [],
+      logQueryParams: {
+        startTime: '',
+        endTime: ''
+      },
+      callLogQueryParams: {
+        abilityKey: '',
+        callStatus:  '' ,
+        startTime:  '',
+        endTime:  ''
+      },
+      callStatusOptions: {
+        0: '成功',
+        1: '进行中',
+        2: '失败'
+      },
+      callLogDetailDialog: false,
+      callLogDetailData: {},
+      reportDetailDialog: false,
+      reportDetailData: {},
+      callLog: false,
+      reportLog: false,
+      callLogData: [],
+      reportLogData: [],
       // 查询参数
       queryParams: {
         psCode: null,
@@ -524,7 +691,7 @@ export default {
         Base: { title: '基础属性', data: [] },
         Protocol: { title: '协议属性', data: [] },
         State: { title: '状态属性', data: [] },
-        Measure: { title: '量属性', data: [] }
+        Measure: { title: '量属性', data: [] }
       },
       // 表单参数
       form: {
@@ -572,12 +739,163 @@ export default {
     this.getSubCategorygetByCode()
     this.getFacsModel()
     this.getAllDevProcess(this.subcategoryCode)
+    const now = new Date();
+    const startOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);
+    const endOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);
+    this.logQueryParams.startTime = this.formatDate(startOfDay);
+    this.logQueryParams.endTime = this.formatDate(endOfDay);
+    this.callLogQueryParams.startTime = this.formatDate(startOfDay);
+    this.callLogQueryParams.endTime = this.formatDate(endOfDay);
+    // 设置默认日期范围
+    this.callDaterangeTime = [this.formatDate(startOfDay), this.formatDate(endOfDay)]
+    this.logDaterangeTime = [this.formatDate(startOfDay), this.formatDate(endOfDay)]
   },
   methods: {
+    formatDate(date) {
+      if (!date) return ''
+      const year = date.getFullYear()
+      const month = (date.getMonth() + 1).toString().padStart(2, '0')
+      const day = date.getDate().toString().padStart(2, '0')
+      const hours = date.getHours().toString().padStart(2, '0')
+      const minutes = date.getMinutes().toString().padStart(2, '0')
+      const seconds = date.getSeconds().toString().padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    },
+    formatObjType(value) {
+      const objTypeMap = {
+        2: '设备'
+      }
+      return objTypeMap[value] || '未知类型'
+    },
+    formatCallStatus(status) {
+      const statusMap = {
+        0: '成功',
+        1: '进行中',
+        2: '失败'
+      }
+      return statusMap[status] || '未知状态'
+    },
+
+    /**日志*/
+    showCallLog(row) {
+      this.curRow = row
+      this.getCallLog(row.deviceCode, this.callLogQueryParams.startTime, this.callLogQueryParams.endTime)
+      this.callLog = true
+    },
+    showReportLog(row) {
+      this.curRow = row
+      this.getReportLog(row.deviceCode, this.logQueryParams.startTime, this.logQueryParams.endTime) // 加载设备日志数据
+      this.reportLog = true
+    },
+    /**重置调用日志*/
+    resetCallLogQuery() {
+      this.callDaterangeTime = []
+      this.callLogQueryParams.abilityKey = ''
+      this.callLogQueryParams.callStatus = ''
+      this.handleCallLogQuery()
+    },
+    /**查询调用日志*/
+    handleCallLogQuery() {
+      if (this.curRow) {
+        const startTime = this.callDaterangeTime[0]
+        const endTime = this.callDaterangeTime[1]
+        const abilityKey = this.callLogQueryParams.abilityKey
+        const callStatus = this.callLogQueryParams.callStatus
+        this.getCallLog(this.curRow.deviceCode, startTime, endTime, abilityKey, callStatus)
+      }
+    },
+    /**调用日志表格*/
+    getCallLog(deviceCode, startTime, endTime, abilityKey, callStatus) {
+      const query = {
+        obj_code: deviceCode,
+        objType: '2',
+        startRecTime: startTime,
+        endRecTime: endTime,
+        abilityKey: abilityKey,
+        callStatus: callStatus
+      }
+      listCallLog(query).then(response => {
+        this.callLogData = response.data || []
+      })
+    },
+    /**调用日志详情*/
+    handleCallLogDetail(row) {
+      getCallLog(row.id).then(response => {
+        this.callLogDetailData = response.data || {}
+        this.callLogDetailDialog = true
+      })
+    },
+
+    /**重置设备日志*/
+    resetLogQuery() {
+      this.logDaterangeTime = []
+      this.handleLogQuery() // 重新查询
+    },
+    /** 查询设备日志*/
+    handleLogQuery() {
+      if (this.curRow) {
+        const startTime = this.logDaterangeTime[0]
+        const endTime = this.logDaterangeTime[1]
+        this.getReportLog(this.curRow.deviceCode, startTime, endTime)
+      }
+    },
+    /**设备日志表格*/
+    getReportLog(deviceCode, startTime, endTime) {
+      const query = {
+        objCode: deviceCode,
+        objType: '2',
+        startRecTime: startTime,
+        endRecTime: endTime,
+        pageNum: 1,
+        pageSize: 10
+      }
+      listReportLog(query).then(response => {
+        this.reportLogData = response.data || []
+      })
+    },
+    /**设备日志详情*/
+    handleReportLogDetail(row) {
+      getReportLog(row.id).then(response => {
+        this.reportDetailData = response.data || {}
+        this.reportDetailDialog = true
+
+      })
+    },
+    loadAbilities(row) {
+      if (!this.curRow) {
+        this.$message.warning('请选择一条设备记录');
+        return;
+      }
+      getModelByCode(row.deviceModel).then(response => {
+        this.abilityDevice = response.data.abilityList|| [];
+      })
+    },
+
+    /**设备能力-执行按钮*/
+    handleDeviceOperate(row ,curRow) {
+      listcallAbility({
+        abilityKey:row.abilityKey,
+        objCode: curRow.deviceCode,
+        objType:'2',
+        modeCode:row.modeCode,
+        abilityParam:row.abilityParam,
+      }).then(response => {
+        this.$message({ message: '设备能力执行成功', type: 'success' });
+
+      })
+    },
 
     formatEventType(row, column, cellValue) {
       return cellValue === 1 ? '消息上报' : '异常告警';
     },
+    getAttrValueText(attrValue) {
+      const valueMap = {
+        0: '关闭',
+        1: '开启',
+        2: '通电'
+      };
+      return valueMap[attrValue] || attrValue;
+    },
     /** 查询能源设备列表 */
     getList() {
       this.loading = true
@@ -670,9 +988,10 @@ export default {
     },
     /** 执行弹框 */
     handleAbilityEdit(row) {
-      this.abilityDialogVisible = true
-      this.abilityForm = { ...row }
-      this.currentAbilityIndex = this.abilityData.indexOf(row)
+      // 复制当前行记录的值到弹框表单中
+      this.abilityForm = JSON.parse(JSON.stringify(row));
+      this.currentAbilityIndex = this.abilityData.indexOf(row);
+      this.abilityDialogVisible = true;
     },
     /**执行按钮*/
     saveAbilityEdit() {
@@ -681,9 +1000,9 @@ export default {
         const abilityParams = {
           objCode: this.curRow.deviceCode,
           objType: 2,
-          modeCode: updatedAbility.subsystemCode,
+          modeCode: updatedAbility.modelCode,
           abilityKey: updatedAbility.abilityKey,
-          abilityParam: JSON.stringify({ type: 'event', key: updatedAbility.abilityParam })
+          abilityParam:  updatedAbility.abilityParam
         };
         listcallAbility(abilityParams)
           .then((response) => {

+ 19 - 16
ems-ui-cloud/src/views/basecfg/device/model.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="app-container">
     <el-tabs v-model="activeObjType" @tab-click="handleTabClick">
-      <el-tab-pane label="设施模型" name="1"></el-tab-pane>
+<!--      <el-tab-pane label="设施模型" name="1"></el-tab-pane>-->
       <el-tab-pane label="设备模型" name="2"></el-tab-pane>
-      <el-tab-pane label="设备部件" name="3"></el-tab-pane>
+<!--      <el-tab-pane label="设备部件" name="3"></el-tab-pane>-->
     </el-tabs>
 
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
@@ -125,10 +125,10 @@
           <el-input v-model="form.modelName" placeholder="请输入模型名称"/>
         </el-form-item>
         <el-form-item label="能力接口" prop="abilityHandle">
-        <el-input v-model="form.abilityHandle" placeholder="请输入能力接口"/>
+        <el-input v-model="form.abilityHandler" placeholder="请输入能力接口"/>
         </el-form-item>
         <el-form-item label="事件接口" prop="eventHandle">
-          <el-input v-model="form.eventHandle" placeholder="请输入事件接口"/>
+          <el-input v-model="form.eventHandler" placeholder="请输入事件接口"/>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -165,9 +165,9 @@
                 </template>
               </el-table-column>
             </el-table>
-            <pagination v-show="total>0" :total="total" :page.sync="queryAttrParams.pageNum"
-                        :limit.sync="queryAttrParams.pageSize"
-                        @pagination="getAttrList"/>
+<!--            <pagination v-show="total>0" :total="total" :page.sync="queryAttrParams.pageNum"-->
+<!--                        :limit.sync="queryAttrParams.pageSize"-->
+<!--                        @pagination="getAttrsList"/>-->
 
             <!-- 添加或修改属性对话框 -->
             <el-dialog :title="title" :visible.sync="attrOpen" width="650px" append-to-body>
@@ -377,10 +377,13 @@ export default {
       showSearch: true,
       // 总条数
       total: 0,
+      attrTotal:0,
+      eventTotal:0,
+      abilityTotal:0,
       // 能源对象属性表格数据
       modelList: [],
       filteredModelList:[],
-      activeObjType: '1',
+      activeObjType: '2',
       // 弹出层标题
       title: '',
       // 是否显示弹出层
@@ -438,8 +441,8 @@ export default {
         modelName: null,
         // 这里将由标签页控制
         objType: null,
-        abilityHandle: null,
-        eventHandle: null
+        abilityHandler: null,
+        eventHandler: null
       },
       eventForm: {},
       attrForm: {},
@@ -538,7 +541,7 @@ export default {
         this.$modal.msgSuccess('删除成功');
       })
     },
-    // 设配详情
+    // 设备模型·特性
     handleDetail(row) {
       this.showDrawer = true
       this.curRow = row
@@ -579,7 +582,7 @@ export default {
         { label: "枚举", value: "Enum" }
       ];
     },
-    /** 查询能源对象属性列表 */
+    /** 查询设备模型列表 */
     getList() {
       this.loading = true
       listModel({ objType: this.activeObjType }).then(response => {
@@ -600,7 +603,7 @@ export default {
 
     },
     /** 查询能源对象属性列表 */
-    getAttrList(modelcode) {
+    getAttrsList(modelcode) {
       this.loading = true
       getModelByCode(modelcode).then(response => {
         const data = response.data
@@ -705,7 +708,7 @@ export default {
       this.$modal.confirm('是否确认删除能源对象属性编号为"' + ids + '"的数据项?').then(function() {
         return delAttr(ids)
       }).then(() => {
-        this.getAttrList(row.modelCode)
+        this.getAttrsList(row.modelCode)
         this.$modal.msgSuccess('删除成功')
       }).catch(() => {
       })
@@ -749,13 +752,13 @@ export default {
             updateAttr(formData).then(response => {
               this.$modal.msgSuccess('修改成功');
               this.attrOpen = false;
-              this.getAttrList(this.attrForm.modelCode);  // 刷新属性列表
+              this.getAttrsList(this.attrForm.modelCode);  // 刷新属性列表
             });
           } else {
             addAttr(formData).then(response => {
               this.$modal.msgSuccess('新增成功');
               this.attrOpen = false;
-              this.getAttrList(this.attrForm.modelCode);
+              this.getAttrsList(this.attrForm.modelCode);
             });
           }
         }

+ 377 - 98
ems-ui-cloud/src/views/devmgr/attr/index.vue

@@ -4,39 +4,45 @@
       <el-col :span="4" :xs="24">
         <div class="head-container">
           <el-input v-model="areaName" placeholder="请输入区域名称" clearable size="small" prefix-icon="el-icon-search"
-            style="margin-bottom: 20px" />
+                    style="margin-bottom: 20px"
+          />
         </div>
         <div class="head-container" style="height: 100vh; overflow: hidden; position: relative;">
           <el-tree :data="treeAreaOptions" :props="defaultProps" :expand-on-click-node="false"
-            :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current
-            @node-click="handleNodeClick" style="height: calc(100vh - 50px); overflow-y: auto;" />
+                   :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current
+                   @node-click="handleNodeClick" style="height: calc(100vh - 50px); overflow-y: auto;"
+          />
         </div>
       </el-col>
       <el-col :span="20" :xs="24">
         <el-tabs v-model="queryParams.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="W"></el-tab-pane>
           <el-tab-pane label="用能设备" name="Z"></el-tab-pane>
         </el-tabs>
         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
-          label-width="68px">
+                 label-width="68px"
+        >
           <el-form-item label="设备分类" prop="deviceSubCategory">
             <el-select v-model="queryParams.deviceSubCategory">
               <el-option v-for="item in subCategoryOptions" placeholder="设备分类" :label="item.name" :value="item.code"
-                :key="item.code" />
+                         :key="item.code"
+              />
             </el-select>
           </el-form-item>
           <el-form-item label="归属设施" prop="refFacs">
             <el-select v-model="queryParams.refFacs">
               <el-option v-for="item in facsOptions" :label="item.facsName" :value="item.facsCode"
-                :key="item.facsCode" />
+                         :key="item.facsCode"
+              />
             </el-select>
           </el-form-item>
           <el-form-item label="子系统" prop="subsystemCode">
             <el-select v-model="queryParams.subsystemCode">
               <el-option v-for="item in subsystemOptions" :label="item.systemName" :value="item.systemCode"
-                :key="item.systemCode" />
+                         :key="item.systemCode"
+              />
             </el-select>
           </el-form-item>
           <el-form-item>
@@ -46,11 +52,11 @@
         </el-form>
 
         <el-table v-loading="loading" :data="deviceList">
-          <el-table-column label="设备名称" align="left" prop="deviceName" />
-          <el-table-column label="归属区域" align="left" prop="areaPath" width="280px" />
-          <el-table-column label="设备分类" align="center" prop="deviceCategoryName" />
-          <el-table-column label="归属设施" align="center" prop="refFacsName" />
-          <el-table-column label="子系统" align="center" prop="subsystemName" />
+          <el-table-column label="设备名称" align="left" prop="deviceName"/>
+          <el-table-column label="归属区域" align="left" prop="areaPath" width="280px"/>
+          <el-table-column label="设备分类" align="center" prop="deviceCategoryName"/>
+          <el-table-column label="归属设施" align="center" prop="refFacsName"/>
+          <el-table-column label="子系统" align="center" prop="subsystemName"/>
           <el-table-column label="设备状态" align="center" prop="deviceStatus">
             <template slot-scope="scope">
               <span :style="{
@@ -64,7 +70,8 @@
                 minWidth: '70px',
                 height: '35px',
                 textAlign: 'center'
-              }">
+              }"
+              >
                 {{ getDeviceStatusText(scope.row.deviceStatus) }}
               </span>
             </template>
@@ -73,7 +80,7 @@
             <template slot-scope="scope">
               <el-button size="mini" type="text" icon="el-icon-info" @click="handleDetail(scope.row)">详情</el-button>
               <!-- 下拉菜单 -->
-              <el-dropdown trigger="click" >
+              <el-dropdown trigger="click">
                 <el-button type="text" size="mini" @click="loadAbilities(scope.row)">
                   操作<i class="el-icon-arrow-down el-icon--right"></i>
                 </el-button>
@@ -85,19 +92,140 @@
                   >
                     {{ ability.abilityName }}
                   </el-dropdown-item>
+                  <el-dropdown-item @click.native="showCallLog(scope.row)">调用日志</el-dropdown-item>
+                  <el-dropdown-item @click.native="showReportLog(scope.row)">设备日志</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
             </template>
           </el-table-column>
         </el-table>
-
         <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize" @pagination="getList" />
+                    :limit.sync="queryParams.pageSize" @pagination="getList"
+        />
+
+        <!-- 调用日志弹窗 -->
+        <el-dialog :visible.sync="callLog" title="调用日志" width="60%">
+          <el-form inline>
+            <el-form-item label="记录时间">
+              <el-date-picker
+                v-model="callDaterangeTime"
+                style="width: 240px"
+                value-format="yyyy-MM-dd HH:mm"
+                type="datetimerange"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              ></el-date-picker>
+            </el-form-item>
+            <el-form-item label="能力标识">
+              <el-select v-model="callLogQueryParams.abilityKey" placeholder="请选择能力标识" clearable>
+                <el-option
+                  v-for="item in abilityDevice"
+                  :key="item.abilityKey"
+                  :label="item.abilityName"
+                  :value="item.abilityKey"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="调用状态">
+              <el-select v-model="callLogQueryParams.callStatus" placeholder="请选择调用状态" clearable>
+                <el-option
+                  v-for="(value, key) in callStatusOptions"
+                  :key="key"
+                  :label="value"
+                  :value="key"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="handleCallLogQuery">查询</el-button>
+              <el-button @click="resetCallLogQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <el-table :data="callLogData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
+            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
+            <el-table-column label="对象代码" prop="objCode"></el-table-column>
+            <el-table-column label="模型代码" prop="modelCode"></el-table-column>
+            <el-table-column label="能力标识" prop="abilityKey"></el-table-column>
+            <el-table-column label="调用时间" prop="callTime"></el-table-column>
+            <el-table-column label="操作" align="center" width="100">
+              <template slot-scope="scope">
+                <el-button type="text" size="mini" icon="el-icon-info" @click="handleCallLogDetail(scope.row)">详情
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-dialog>
+
+        <!-- 调用日志详情弹窗 -->
+        <el-dialog :visible.sync="callLogDetailDialog" title="调用日志详情" width="50%">
+          <div v-if="callLogDetailData">
+            <p><strong>对象代码:</strong>{{ callLogDetailData.objCode }}</p>
+            <p><strong>对象类型:</strong>{{ formatObjType(callLogDetailData.objType) }}</p>
+            <p><strong>模型代码:</strong>{{ callLogDetailData.modelCode }}</p>
+            <p><strong>能力标识:</strong>{{ callLogDetailData.abilityKey }}</p>
+            <p><strong>调用时间:</strong>{{ callLogDetailData.callTime }}</p>
+            <p><strong>响应时间:</strong>{{ callLogDetailData.resTime }}</p>
+            <p><strong>调用结果:</strong>{{ formatCallStatus(callLogDetailData.callStatus) }}</p>
+            <p><strong>调用载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;"
+            >{{ callLogDetailData.callPayload }}</pre>
+            <p><strong>响应载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;"
+            >{{ callLogDetailData.resPayload }}</pre>
+          </div>
+        </el-dialog>
+
+        <!-- 设备日志弹窗 -->
+        <el-dialog :visible.sync="reportLog" title="设备日志" width="60%">
+          <el-form inline>
+            <el-form-item label="记录时间">
+              <el-date-picker
+                v-model="logDaterangeTime"
+                style="width: 240px"
+                value-format="yyyy-MM-dd HH:mm"
+                type="datetimerange"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              ></el-date-picker>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="handleLogQuery">查询</el-button>
+              <el-button @click="resetLogQuery">重置</el-button>
+            </el-form-item>
+          </el-form>
+          <el-table :data="reportLogData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
+            <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
+            <el-table-column label="对象代码" prop="objCode"></el-table-column>
+            <el-table-column label="消息描述" prop="msgDesc"></el-table-column>
+            <el-table-column label="上报时间" prop="reportTime" width="180"></el-table-column>
+            <el-table-column label="操作" align="center" width="100">
+              <template slot-scope="scope">
+                <el-button type="text" size="mini" icon="el-icon-info" @click="handleReportLogDetail(scope.row)">详情
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-dialog>
+
+        <!-- 设备日志详情弹窗 -->
+        <el-dialog :visible.sync="reportDetailDialog" title="设备日志详情" width="50%">
+          <div v-if="reportDetailData">
+            <p><strong>对象代码:</strong>{{ reportDetailData.objCode }}</p>
+            <p><strong>对象类型:</strong>{{ formatObjType(reportDetailData.objType) }}</p>
+            <p><strong>消息描述:</strong>{{ reportDetailData.msgDesc }}</p>
+            <p><strong>上报时间:</strong>{{ reportDetailData.reportTime }}</p>
+            <p><strong>上报载体:</strong></p>
+            <pre style="white-space: pre-wrap; background-color: #f5f5f5; padding: 10px; border-radius: 4px;"
+            >{{ reportDetailData.reportPayload }}</pre>
+          </div>
+        </el-dialog>
 
         <el-dialog :visible.sync="open" title="设备状态详情" custom-class="detail-dialog">
           <div v-if="curRow">
             <!--分页导航 @tab-click="handleTabClick"-->
-            <el-tabs v-model="activeTab"  >
+            <el-tabs v-model="activeTab">
               <el-tab-pane label="设备基本信息" name="basic"></el-tab-pane>
               <el-tab-pane label="设备参数" name="attr"></el-tab-pane>
               <el-tab-pane label="设备事件" name="event"></el-tab-pane>
@@ -107,9 +235,6 @@
             <!--  设备基本信息 -->
             <div v-if="activeTab === 'basic'">
               <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                  <span class="section-title">设备状态基本信息</span>
-                </div>
                 <div>
                   <p><span class="bold">设备名称:</span>{{ curRow.deviceName }}</p>
                   <p><span class="bold">设备代码:</span>{{ curRow.deviceCode }}</p>
@@ -128,17 +253,24 @@
             <!-- 属性信息 -->
             <div v-if="activeTab === 'attr'">
               <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                  <span class="section-title">设备参数</span>
-                </div>
                 <div v-for="(tableData, tableName) in attrTables" :key="tableName">
                   <p class="section-title">{{ tableData.title }}</p>
                   <el-table :data="tableData.data" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
                     <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                     <el-table-column label="属性名称" prop="attrName"></el-table-column>
                     <el-table-column label="属性标识" prop="attrKey"></el-table-column>
-                    <el-table-column label="属性值" prop="attrValue"></el-table-column>
-                    <el-table-column label="属性值描述" prop="attrValueName"></el-table-column>
+                    <!-- 动态显示属性值 -->
+                    <el-table-column label="属性值" align="center">
+                      <template slot-scope="scope">
+                        <span v-if="tableData.title === '状态属性'">
+                       {{ scope.row.attrValueName || getAttrValueText(scope.row.attrValue) }}
+                        <span v-if="scope.row.attrUnit">{{ scope.row.attrUnit }}</span>
+                        </span>
+                        <span v-else>
+                         {{ scope.row.attrValue }}
+                        </span>
+                      </template>
+                    </el-table-column>
                   </el-table>
                 </div>
               </el-card>
@@ -146,27 +278,22 @@
             <!--设备能力-->
             <div v-if="activeTab === 'ability'">
               <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                  <span class="section-title">设备能力</span>
-                </div>
                 <el-table :data="abilityData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
                   <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                   <el-table-column label="能力名称" prop="abilityName"></el-table-column>
                   <el-table-column label="能力描述" prop="abilityDesc"></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-info" @click="handleOperate(scope.row)">执行</el-button>
+                      <el-button size="mini" type="text" icon="el-icon-info" @click="handleOperate(scope.row)">执行
+                      </el-button>
                     </template>
                   </el-table-column>
                 </el-table>
               </el-card>
             </div>
-          <!--设备事件-->
+            <!--设备事件-->
             <div v-if="activeTab === 'event'">
               <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                  <span class="section-title">设备事件</span>
-                </div>
                 <el-table :data="eventData" style="width: 100%" :show-header="true" :empty-text="'暂无数据'">
                   <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                   <el-table-column label="事件名称" prop="eventKey"></el-table-column>
@@ -184,21 +311,22 @@
 </template>
 
 <script>
-import {listDevRecursionByArea} from '@/api/device/device'
-import {areaTreeSelect} from '@/api/basecfg/area'
-import {getFacsCategorygetByCode, listAllFacs} from '@/api/basecfg/emsfacs'
-import {listSubsystemAll} from '@/api/adapter/subsystem'
-import {getModelByCode} from '@/api/basecfg/objModel'
+import { listDevRecursionByArea } from '@/api/device/device'
+import { areaTreeSelect } from '@/api/basecfg/area'
+import { getFacsCategorygetByCode, listAllFacs } from '@/api/basecfg/emsfacs'
+import { listSubsystemAll } from '@/api/adapter/subsystem'
+import { getModelByCode } from '@/api/basecfg/objModel'
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
-import {listcallAbility} from '@/api/basecfg/objAbility'
+import { listcallAbility } from '@/api/basecfg/objAbility'
 import { getObjAttr } from '@/api/basecfg/objAttribute'
+import { listReportLog, getReportLog, listCallLog, getCallLog } from '@/api/basecfg/objLog'
 
 export default {
   name: 'Device',
   dicts: ['sys_device_stat'],
-  components: {Treeselect},
-  data () {
+  components: { Treeselect },
+  data() {
     return {
       activeTab: 'basic',
       // 遮罩层
@@ -236,7 +364,7 @@ export default {
       curRow: {},
       attrData: [],
       abilityData: [],
-      abilityDevice:[],
+      abilityDevice: [],
       eventData: [],
       BaseData: [],
       ProtocolData: [],
@@ -246,7 +374,7 @@ export default {
         Base: { title: '基础属性', data: [] },
         Protocol: { title: '协议属性', data: [] },
         State: { title: '状态属性', data: [] },
-        Measure: { title: '量属性', data: [] }
+        Measure: { title: '量属性', data: [] }
       },
       // 查询参数
       queryParams: {
@@ -257,87 +385,238 @@ export default {
         locationRef: null,
         refFacs: null,
         subsystemCode: null
-      }
+      },
+      callDaterangeTime: [],
+      logDaterangeTime: [],
+      logQueryParams: {
+        startTime: '',
+        endTime: ''
+      },
+      callLogQueryParams: {
+        abilityKey: '',
+        callStatus: '',
+        startTime: ''
+      },
+      callStatusOptions: {
+        0: '成功',
+        1: '进行中',
+        2: '失败'
+      },
+      callLogDetailDialog: false,
+      callLogDetailData: {},
+      reportDetailDialog: false,
+      reportDetailData: {},
+      callLog: false,
+      reportLog: false,
+      callLogData: [],
+      reportLogData: []
+
     }
   },
-  created () {
+  created() {
     this.getList()
     this.getAreaTree('0', false)
     this.getFacsOptions()
     this.getSubsystem()
     this.getSubCategorygetByCode()
+    const now = new Date()
+    const startOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0)
+    const endOfDay = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59)
+    this.logQueryParams.startTime = this.formatDate(startOfDay)
+    this.logQueryParams.endTime = this.formatDate(endOfDay)
+    this.callLogQueryParams.startTime = this.formatDate(startOfDay)
+    this.callLogQueryParams.endTime = this.formatDate(endOfDay)
+    // 设置默认日期范围
+    this.callDaterangeTime = [this.formatDate(startOfDay), this.formatDate(endOfDay)]
+    this.logDaterangeTime = [this.formatDate(startOfDay), this.formatDate(endOfDay)]
+
   },
   methods: {
+    formatDate(date) {
+      if (!date) return ''
+      const year = date.getFullYear()
+      const month = (date.getMonth() + 1).toString().padStart(2, '0')
+      const day = date.getDate().toString().padStart(2, '0')
+      const hours = date.getHours().toString().padStart(2, '0')
+      const minutes = date.getMinutes().toString().padStart(2, '0')
+      const seconds = date.getSeconds().toString().padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    },
+    formatObjType(value) {
+      const objTypeMap = {
+        2: '设备'
+      }
+      return objTypeMap[value] || '未知类型'
+    },
+    formatCallStatus(status) {
+      const statusMap = {
+        0: '成功',
+        1: '进行中',
+        2: '失败'
+      }
+      return statusMap[status] || '未知状态'
+    },
+
+    /**日志*/
+    showCallLog(row) {
+      this.curRow = row
+      this.getCallLog(row.deviceCode, this.callLogQueryParams.startTime, this.callLogQueryParams.endTime)
+      this.callLog = true
+    },
+    showReportLog(row) {
+      this.curRow = row
+      this.getReportLog(row.deviceCode, this.logQueryParams.startTime, this.logQueryParams.endTime) // 加载设备日志数据
+      this.reportLog = true
+    },
+    /**重置调用日志*/
+    resetCallLogQuery() {
+      this.callDaterangeTime = []
+      this.callLogQueryParams.abilityKey = ''
+      this.callLogQueryParams.callStatus = ''
+      this.handleCallLogQuery()
+    },
+    /**查询调用日志*/
+    handleCallLogQuery() {
+      if (this.curRow) {
+        const startTime = this.callDaterangeTime[0]
+        const endTime = this.callDaterangeTime[1]
+        const abilityKey = this.callLogQueryParams.abilityKey
+        const callStatus = this.callLogQueryParams.callStatus
+        this.getCallLog(this.curRow.deviceCode, startTime, endTime, abilityKey, callStatus)
+      }
+    },
+    /**调用日志表格*/
+    getCallLog(deviceCode, startTime, endTime, abilityKey, callStatus) {
+      const query = {
+        obj_code: deviceCode,
+        objType: '2',
+        startRecTime: startTime,
+        endRecTime: endTime,
+        abilityKey: abilityKey,
+        callStatus: callStatus
+      }
+      listCallLog(query).then(response => {
+        this.callLogData = response.data || []
+      })
+    },
+    /**调用日志详情*/
+    handleCallLogDetail(row) {
+      getCallLog(row.id).then(response => {
+        this.callLogDetailData = response.data || {}
+        this.callLogDetailDialog = true
+      })
+    },
+
+    /**重置设备日志*/
+    resetLogQuery() {
+      this.logDaterangeTime = []
+      this.handleLogQuery() // 重新查询
+    },
+    /** 查询设备日志*/
+    handleLogQuery() {
+      if (this.curRow) {
+        const startTime = this.logDaterangeTime[0]
+        const endTime = this.logDaterangeTime[1]
+        this.getReportLog(this.curRow.deviceCode, startTime, endTime)
+      }
+    },
+    /**设备日志表格*/
+    getReportLog(deviceCode, startTime, endTime) {
+      const query = {
+        objCode: deviceCode,
+        objType: '2',
+        startRecTime: startTime,
+        endRecTime: endTime,
+        pageNum: 1,
+        pageSize: 10
+      }
+      listReportLog(query).then(response => {
+        this.reportLogData = response.data || []
+      })
+    },
+    /**设备日志详情*/
+    handleReportLogDetail(row) {
+      getReportLog(row.id).then(response => {
+        this.reportDetailData = response.data || {}
+        this.reportDetailDialog = true
+
+      })
+    },
     loadAbilities(row) {
       if (!this.curRow) {
-        this.$message.warning('请选择一条设备记录');
-        return;
+        this.$message.warning('请选择一条设备记录')
+        return
       }
       getModelByCode(row.deviceModel).then(response => {
-        this.abilityDevice = response.data?.abilityList.filter(item => item.hiddenFlag === 1) || [];
+        this.abilityDevice = response.data?.abilityList.filter(item => item.hiddenFlag === 1) || []
       })
     },
     /**设备能力-执行按钮*/
-    handleDeviceOperate(row ,curRow) {
+    handleDeviceOperate(row, curRow) {
       listcallAbility({
-        abilityKey:row.abilityKey,
+        abilityKey: row.abilityKey,
         objCode: curRow.deviceCode,
-        objType:'2',
-        modeCode:row.modeCode,
-        abilityParam:row.abilityParam,
+        objType: '2',
+        modeCode: row.modeCode,
+        abilityParam: row.abilityParam
       }).then(response => {
-        this.$message({ message: '设备能力执行成功', type: 'success' });
+        this.$message({ message: '设备能力执行成功', type: 'success' })
 
       })
     },
     handleOperate(row) {
       listcallAbility({
-        abilityKey:row.abilityKey,
+        abilityKey: row.abilityKey,
         objCode: this.curRow.deviceCode,
-        objType:'2',
-        modeCode:row.modeCode,
-        abilityParam:row.abilityParam,
+        objType: '2',
+        modeCode: row.modeCode,
+        abilityParam: row.abilityParam
       }).then(response => {
-        this.$message({ message: '设备能力执行成功', type: 'success' });
+        this.$message({ message: '设备能力执行成功', type: 'success' })
 
       })
     },
     getDeviceStatus(status) {
-      return status === 1 ? "在线" : "离线";
+      return status === 1 ? '在线' : '离线'
     },
     getDeviceStatusClass(status) {
-      return status === 1 ? "status-online" : "status-offline";
+      return status === 1 ? 'status-online' : 'status-offline'
     },
 
     formatEventType(row, column, cellValue) {
-      return cellValue === 1 ? '消息上报' : '异常告警';
+      return cellValue === 1 ? '消息上报' : '异常告警'
     },
-    getDeviceStatusText (status) {
+    getDeviceStatusText(status) {
       const statusMap = {
-        0: '运行',
-        1: '故障',
-        2: '未运行'
+        0: '离线',
+        1: '在线'
       }
       return statusMap[status] || ''
     },
-    getDeviceStatusTextColor (status) {
-      if (status === 0) return 'rgb(232,244,255)'
-      if (status === 1) return '#FFFFFF'
-      if (status === 2) return 'rgb(255,235,235)'
+    getAttrValueText(attrValue) {
+      const valueMap = {
+        0: '关闭',
+        1: '开启',
+        2: '通电'
+      }
+      return valueMap[attrValue] || attrValue
+    },
+    getDeviceStatusTextColor(status) {
+      if (status === 0) return '#FF0000'
+      if (status === 1) return '#00FF00'
       return '#000000' // 默认黑色文字
     },
-    getDeviceStatusBgColor (status) {
-      if (status === 0) return 'rgb(117,186,255)'
-      if (status === 1) return 'rgb(242,197,92)'
-      if (status === 2) return 'rgb(255,159,159)'
+    getDeviceStatusBgColor(status) {
+      if (status === 0) return '#FFDDDD'
+      if (status === 1) return '#DDFFDD'
       return 'transparent' // 默认无背景色
     },
     /** 查询能源设备列表 */
-    getList () {
+    getList() {
       this.loading = true
       listDevRecursionByArea(this.queryParams).then(response => {
         this.deviceList = response.rows
-        console.log("this.deviceList",this.deviceList)
+        console.log('this.deviceList', this.deviceList)
         this.total = response.total
         this.loading = false
 
@@ -354,32 +633,32 @@ export default {
       })
     },
     // 筛选节点
-    filterNode (value, data) {
+    filterNode(value, data) {
       if (!value) return true
       return data.label.indexOf(value) !== -1
     },
     // 节点单击事件
-    handleNodeClick (data) {
+    handleNodeClick(data) {
       this.queryParams.locationRef = data.id
       this.handleQuery()
     },
-    cancel () {
+    cancel() {
       this.open = false
       this.reset()
     },
     /** 搜索按钮操作 */
-    handleQuery () {
+    handleQuery() {
       this.queryParams.pageNum = 1
       this.getList()
     },
     /** 重置按钮操作 */
-    resetQuery () {
+    resetQuery() {
       this.queryParams.locationRef = null
       this.resetForm('queryForm')
       this.handleQuery()
     },
     // 设备状态详情
-    handleDetail (row) {
+    handleDetail(row) {
       this.reset()
       this.curRow = row
       console.log('设备this.curRow', this.curRow)
@@ -387,20 +666,20 @@ export default {
         this.open = true
         const code = response.data
         console.log('code', code)
-        this.eventData = response.data?.eventList || [];
+        this.eventData = response.data?.eventList || []
         // 过滤
-        this.abilityData = response.data?.abilityList.filter(item => item.hiddenFlag === 1) || [];
-        this.attrData=response.data?.attrList || [];
+        this.abilityData = response.data?.abilityList.filter(item => item.hiddenFlag === 1) || []
+        this.attrData = response.data?.attrList || []
       })
       getObjAttr(2, this.curRow.deviceCode).then(response => {
-        this.attrTables.Base.data = response.data?.Base || [];
-        this.attrTables.Protocol.data = response.data?.Protocol || [];
-        this.attrTables.State.data = response.data?.State || [];
-        this.attrTables.Measure.data = response.data?.Measure || [];
-      });
-      this.activeTab = 'basic';
-    },
-    getFacsOptions () {
+        this.attrTables.Base.data = response.data?.Base || []
+        this.attrTables.Protocol.data = response.data?.Protocol || []
+        this.attrTables.State.data = response.data?.State || []
+        this.attrTables.Measure.data = response.data?.Measure || []
+      })
+      this.activeTab = 'basic'
+    },
+    getFacsOptions() {
       const getFacsParams = {
         facsCategory: this.queryParams.deviceCategory,
         subCategory: this.queryParams.deviceSubCategory
@@ -409,17 +688,17 @@ export default {
         this.facsOptions = response.data
       })
     },
-    getSubsystem () {
+    getSubsystem() {
       listSubsystemAll().then(response => {
         this.subsystemOptions = response.data
       })
     },
-    getSubCategorygetByCode () {
+    getSubCategorygetByCode() {
       getFacsCategorygetByCode(this.queryParams.deviceCategory).then(response => {
         this.subCategoryOptions = response.data.subtypeList || []
       })
     },
-    deviceCategoryChange () {
+    deviceCategoryChange() {
       this.reset()
       if (this.queryParams.deviceCategory === 'E' || this.queryParams.deviceCategory === 'W'
         || this.queryParams.deviceCategory === 'T' || this.queryParams.deviceCategory === 'C') {
@@ -431,7 +710,7 @@ export default {
       this.getFacsOptions()
       this.handleQuery()
     },
-    reset () {
+    reset() {
       this.queryParams.pageNum = 1
       this.queryParams.pageSize = 10
       this.queryParams.deviceSubCategory = ''

+ 11 - 3
ems-ui-cloud/src/views/devmgr/meterData/index.vue

@@ -34,17 +34,25 @@
               @keyup.enter.native="handleQuery"
             />
           </el-form-item>
+          <el-form-item label="表计名称" prop="deviceName">
+            <el-input
+              v-model="queryParams.deviceName"
+              placeholder="请输入表计名称"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
 
           <el-form-item label="记录时间">
             <el-date-picker
               v-model="daterangeRecordTime"
               style="width: 240px"
-              value-format="yyyy-MM-dd"
-              type="daterange"
+              value-format="yyyy-MM-dd HH:mm"
+              type="datetimerange"
               range-separator="-"
               start-placeholder="开始日期"
               end-placeholder="结束日期"
-              @select="handleQuery"
+              @change="handleQuery"
             ></el-date-picker>
           </el-form-item>
 

+ 73 - 35
ems-ui-cloud/src/views/devmgr/meterRead/index.vue

@@ -18,6 +18,8 @@
           <el-tab-pane label="水表抄报" name="second">
           </el-tab-pane>
         </el-tabs>
+
+        <!--表格 -->
         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
           <el-form-item label="表记编号" prop="deviceCode">
             <el-input v-model="queryParams.deviceCode" placeholder="请输入设备代码" clearable @keyup.enter.native="handleQuery" />
@@ -52,46 +54,13 @@
                 填报</el-button>
               <el-button size="mini" type="text"  icon="el-icon-document" @click="handleViewRec(scope.row)">
                 查看</el-button>
-
             </template>
           </el-table-column>
         </el-table>
-
         <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
                     @pagination="getList" />
-        <el-dialog :title="fillTitle" :visible.sync="fillFormOpen" width="500px" append-to-body>
-          <el-form ref="fillForm" :model="fillForm" label-width="150px">
-            <el-form-item label="表计编号">
-              <el-input disabled :value="fillForm.deviceCode" />
-            </el-form-item>
-            <el-form-item label="上次抄表日期">
-              <el-input disabled :value="fillForm.lastTime" />
-            </el-form-item>
-            <el-form-item label="上次抄表示数">
-              <el-input disabled :value="fillForm.lastReading" />
-            </el-form-item>
-            <hr>
-            <el-form-item label="本次抄表月份">
-              <el-input disabled :value="currentMonth" />
-            </el-form-item>
-            <el-form-item required :rules="[{required:true,message:'请输入本次抄表示数'}]" label="本次抄表示数" prop="meterReading">
-              <el-input v-model="fillForm.meterReading" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入本次抄表示数" />
-            </el-form-item>
-            <el-form-item label="综合倍率" prop="magnification">
-              <el-input disabled :value="fillForm.magnification" />
-            </el-form-item>
-            <el-form-item :label="`参考增量(${activeTab==='first'?'度':'吨'})`">
-              <el-input disabled :value="increase" />
-            </el-form-item>
-          </el-form>
-
-          <div slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="submitFillForm">确 定</el-button>
-            <el-button @click="fillCancel">取 消</el-button>
-          </div>
-        </el-dialog>
         <!-- 历史抄表记录 -->
-        <el-dialog :title="title" :visible.sync="recListOpen" width="1200px" append-to-body>
+<!--        <el-dialog :title="title" :visible.sync="recListOpen" width="1200px" append-to-body>-->
           <el-form ref="recListForm" :model="recListForm" label-width="80px">
             <el-form-item label="年份" prop="year">
               <el-date-picker v-model="recListForm.year" :clearable="false" @change="getHistoryList" value-format="yyyy" type="year"
@@ -122,10 +91,79 @@
               </el-table>
             </el-form-item>
           </el-form>
+<!--          <div slot="footer" class="dialog-footer">-->
+<!--            <el-button @click="closeRecList">关 闭</el-button>-->
+<!--          </div>-->
+<!--        </el-dialog>-->
+        <!--  填报  -->
+        <el-dialog :title="fillTitle" :visible.sync="fillFormOpen" width="500px" append-to-body>
+          <el-form ref="fillForm" :model="fillForm" label-width="150px">
+            <el-form-item label="表计编号">
+              <el-input disabled :value="fillForm.deviceCode" />
+            </el-form-item>
+            <el-form-item label="上次抄表日期">
+              <el-input disabled :value="fillForm.lastTime" />
+            </el-form-item>
+            <el-form-item label="上次抄表示数">
+              <el-input disabled :value="fillForm.lastReading" />
+            </el-form-item>
+            <hr>
+            <el-form-item label="本次抄表月份">
+              <el-input disabled :value="currentMonth" />
+            </el-form-item>
+            <el-form-item required :rules="[{required:true,message:'请输入本次抄表示数'}]" label="本次抄表示数" prop="meterReading">
+              <el-input v-model="fillForm.meterReading" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入本次抄表示数" />
+            </el-form-item>
+            <el-form-item label="综合倍率" prop="magnification">
+              <el-input disabled :value="fillForm.magnification" />
+            </el-form-item>
+            <el-form-item :label="`参考增量(${activeTab==='first'?'度':'吨'})`">
+              <el-input disabled :value="increase" />
+            </el-form-item>
+          </el-form>
+
           <div slot="footer" class="dialog-footer">
-            <el-button @click="closeRecList">关 闭</el-button>
+            <el-button type="primary" @click="submitFillForm">确 定</el-button>
+            <el-button @click="fillCancel">取 消</el-button>
           </div>
         </el-dialog>
+
+<!--        &lt;!&ndash; 历史抄表记录 &ndash;&gt;-->
+<!--        <el-dialog :title="title" :visible.sync="recListOpen" width="1200px" append-to-body>-->
+<!--          <el-form ref="recListForm" :model="recListForm" label-width="80px">-->
+<!--            <el-form-item label="年份" prop="year">-->
+<!--              <el-date-picker v-model="recListForm.year" :clearable="false" @change="getHistoryList" value-format="yyyy" type="year"-->
+<!--                              placeholder="选择年份">-->
+<!--              </el-date-picker>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="计量设备" prop="year">-->
+<!--              <el-input disabled :value="recListForm.deviceCode" />-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="抄表历史" prop="recList">-->
+<!--              <el-table v-loading="loading" :data="recListForm.recList" max-height="280px">-->
+<!--                <el-table-column label="年份" align="center" prop="year" />-->
+<!--                <el-table-column label="月份" align="center" prop="meterMonth" >-->
+<!--                  <template slot-scope="scope">-->
+<!--                    &lt;!&ndash; 使用 JavaScript 字符串方法截取月份部分 &ndash;&gt;-->
+<!--                    {{ scope.row.meterMonth.slice(-2) }}-->
+<!--                  </template>-->
+<!--                </el-table-column>-->
+<!--                <el-table-column label="抄表示数" align="center" prop="meterReading" />-->
+<!--                <el-table-column label="用量" align="center" prop="increase" />-->
+<!--                <el-table-column label="抄表日期" align="center" prop="meterTime" />-->
+<!--                <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
+<!--                  <template slot-scope="scope">-->
+<!--                    <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="!canEdit(scope.row.meterMonth)"-->
+<!--                               @click="updateRecord(scope.row)">修改</el-button>-->
+<!--                  </template>-->
+<!--                </el-table-column>-->
+<!--              </el-table>-->
+<!--            </el-form-item>-->
+<!--          </el-form>-->
+<!--          <div slot="footer" class="dialog-footer">-->
+<!--            <el-button @click="closeRecList">关 闭</el-button>-->
+<!--          </div>-->
+<!--        </el-dialog>-->
       </el-col>
     </el-row>
   </div>