设备列表-能源设备

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

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

@@ -51,8 +51,6 @@
               <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="handleQuery">搜索</el-button>
             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -62,26 +60,22 @@
         <el-row :gutter="10" class="mb8">
           <el-col :span="1.5">
             <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
-                       v-hasPermi="['ems:device:add']"
-            >新增
+                       v-hasPermi="['ems:device:add']">新增
             </el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
-                       v-hasPermi="['ems:device:edit']"
-            >修改
+                       v-hasPermi="['ems:device:edit']">修改
             </el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
-                       v-hasPermi="['ems:device:remove']"
-            >删除
+                       v-hasPermi="['ems:device:remove']">删除
             </el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
-                       v-hasPermi="['ems:device:export']"
-            >导出
+                       v-hasPermi="['ems:device:export']">导出
             </el-button>
           </el-col>
           <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
@@ -97,26 +91,11 @@
           <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="handleDevProcess(scope.row)"
-                         v-hasPermi="['basecfg:device:edit']" v-if="shouldShowDevProcessButton(scope.row)"
-              >
-                器件
+                         v-hasPermi="['basecfg:device:edit']" v-if="shouldShowDevProcessButton(scope.row)">器件
               </el-button>
               <el-button size="mini" type="text" icon="el-icon-info" @click="handleDetail(scope.row)"
-                         v-hasPermi="['basecfg:device:edit']"
-              >
-                详情
-              </el-button>
-              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-                         v-hasPermi="['basecfg:device:edit']"
-              >
-                修改
-              </el-button>
-              <el-button size="mini" type="text" icon="el-icon-delete" class="deleteBtn"
-                         @click="handleDelete(scope.row)" v-hasPermi="['basecfg:device:remove']"
-              >
-                删除
+                         v-hasPermi="['basecfg:device:edit']">详情
               </el-button>
-
             </template>
           </el-table-column>
         </el-table>
@@ -217,9 +196,6 @@
                   </el-table>
                 </el-form-item>
               </div>
-
-
-
           </el-form>
           <div slot="footer" class="dialog-footer">
             <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -233,14 +209,12 @@
             <el-row :gutter="10" class="mb8">
               <el-col :span="1.5">
                 <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleComponentAdd"
-                           v-hasPermi="['ems:component:add']"
-                >新增
+                           v-hasPermi="['ems:component:add']">新增
                 </el-button>
               </el-col>
             </el-row>
             <el-table v-loading="loading" :data="ComponentList">
               <el-table-column type="selection" width="55" align="center"/>
-              <!--              <el-table-column label="设备代码" align="center" prop="deviceCode" />-->
               <el-table-column label="部件编码" align="center" prop="compoCode"/>
               <el-table-column label="部件标签" align="center" prop="compoTag">
                 <template slot-scope="scope">
@@ -254,7 +228,6 @@
               <el-table-column label="部件型号" align="center" prop="compoSpec"/>
               <el-table-column label="祖籍列表" align="center" prop="ancestors"/>
               <el-table-column label="上级部件" align="center" prop="parentEqpt"/>
-
               <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-edit" @click="handleComponentUpdate(scope.row)"
@@ -278,9 +251,6 @@
             <!-- 添加或修改设备器件对话框 -->
             <el-dialog :title="title" :visible.sync="componentOpen" width="600px" append-to-body>
               <el-form ref="componentForm" :model="componentForm" :rules="componentRules" label-width="150px">
-                <!--                <el-form-item label="设备code" prop="deviceCode">-->
-                <!--                  <el-input v-model="componentForm.deviceCode" placeholder="请输入设备code" />-->
-                <!--                </el-form-item>-->
                 <el-form-item label="部件编码" prop="compoCode">
                   <el-input v-model="componentForm.compoCode" placeholder="请输入部件编码"/>
                 </el-form-item>
@@ -333,6 +303,10 @@
 
         <!-- 详情弹框 -->
         <el-dialog :visible.sync="showDrawer" title="设备状态详情" custom-class="detail-dialog">
+          <div class="button-group">
+            <el-button type="primary" plain icon="el-icon-edit" size="mini" @click="handleUpdate(curRow)" v-hasPermi="['ems:device:edit']">修改</el-button>
+            <el-button type="danger" plain icon="el-icon-delete" size="mini" @click="handleDelete(curRow)" v-hasPermi="['ems:device:remove']">删除</el-button>
+          </div>
           <div v-if="curRow">
             <!-- 分页导航 -->
             <el-tabs v-model="activeTab">
@@ -354,7 +328,6 @@
                   <p><span class="bold">子系统：</span>{{ curRow.subsystemName }}</p>
                   <p><span class="bold">设备类型：</span>{{ curRow.deviceCategoryName }}</p>
                   <p><span class="bold">归属设施：</span>{{ curRow.refFacsName }}</p>
-                  <p><span class="bold">归属区域：</span>{{ curRow.areaPath }}</p>
                 </div>
               </el-card>
             </div>
@@ -377,7 +350,6 @@
                 </div>
               </el-card>
             </div>
-
             <!-- 设备能力-->
             <div v-if="activeTab === 'ability'">
               <el-card class="box-card">
@@ -390,10 +362,34 @@
                   <el-table-column label="能力键" prop="abilityKey"></el-table-column>
                   <el-table-column label="能力参数" prop="abilityParam"></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-edit" @click="handleAbilityEdit(scope.row)">执行</el-button>
+                    </template>
+                  </el-table-column>
                 </el-table>
               </el-card>
             </div>
-
+            <el-dialog title="编辑能力信息" :visible.sync="abilityDialogVisible" width="60%" append-to-body >
+                <el-form ref="abilityForm" :model="abilityForm" label-width="120px">
+                  <el-form-item label="能力名称">
+                    <el-input v-model="abilityForm.abilityName" placeholder="请输入能力名称" />
+                  </el-form-item>
+                  <el-form-item label="能力键">
+                    <el-input v-model="abilityForm.abilityKey" placeholder="请输入能力键" />
+                  </el-form-item>
+                  <el-form-item label="能力参数">
+                    <el-input type="textarea" v-model="abilityForm.abilityParam" placeholder="请输入能力参数" />
+                  </el-form-item>
+                  <el-form-item label="能力描述">
+                    <el-input type="textarea" v-model="abilityForm.abilityDesc" placeholder="请输入能力描述" />
+                  </el-form-item>
+                </el-form>
+                <div slot="footer" class="dialog-footer">
+                  <el-button type="primary" @click="saveAbilityEdit">执行</el-button>
+                  <el-button @click="cancelAbilityEdit">取消</el-button>
+                </div>
+              </el-dialog>
             <!-- 设备事件= -->
             <div v-if="activeTab === 'event'">
               <el-card class="box-card">
@@ -428,12 +424,22 @@ import { getDevProcess } from '@/api/commonApi'
 import { addComponent, delComponent, getComponent, listByDevice, updateComponent } from '@/api/basecfg/component'
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import {listcallAbility} from '@/api/basecfg/objAbility'
+
 
 export default {
   name: 'Device',
   components: { Treeselect },
   data() {
     return {
+      abilityDialogVisible: false,
+      abilityForm: {
+        abilityName: '',
+        abilityKey: '',
+        abilityParam: '',
+        abilityDesc: ''
+      },
+      currentAbilityIndex: -1,
       activeTab: 'basic',
       ComponentRow: [],
       componentForm: {},
@@ -568,6 +574,7 @@ export default {
     this.getAllDevProcess(this.subcategoryCode)
   },
   methods: {
+
     formatEventType(row, column, cellValue) {
       return cellValue === 1 ? '消息上报' : '异常告警';
     },
@@ -661,6 +668,44 @@ export default {
       this.open = false
       this.reset()
     },
+    /** 执行弹框 */
+    handleAbilityEdit(row) {
+      this.abilityDialogVisible = true
+      this.abilityForm = { ...row }
+      this.currentAbilityIndex = this.abilityData.indexOf(row)
+    },
+    /**执行按钮*/
+    saveAbilityEdit() {
+      if (this.currentAbilityIndex !== -1) {
+        const updatedAbility = { ...this.abilityForm };
+        const abilityParams = {
+          objCode: this.curRow.deviceCode,
+          objType: 2,
+          modeCode: updatedAbility.subsystemCode,
+          abilityKey: updatedAbility.abilityKey,
+          abilityParam: JSON.stringify({ type: 'event', key: updatedAbility.abilityParam })
+        };
+        listcallAbility(abilityParams)
+          .then((response) => {
+            if (response.code === 200) {
+              this.$message.success('保存成功');
+              this.abilityData.splice(this.currentAbilityIndex, 1, updatedAbility);
+            }
+          })
+        this.abilityDialogVisible = false;
+      }
+    },
+    /** 取消执行按钮 */
+    cancelAbilityEdit() {
+      this.abilityDialogVisible = false
+      this.abilityForm = {
+        abilityName: '',
+        abilityKey: '',
+        abilityParam: '',
+        abilityDesc: ''
+      }
+      this.currentAbilityIndex = -1
+    },
     // 表单重置
     reset() {
       this.form = {
@@ -743,7 +788,6 @@ export default {
     handleDetail(row) {
       this.showDrawer = true
       this.curRow = row
-      console.log("设备详情", this.curRow)
       this.subKey = this.$options.data().subKey
       getModelByCode(this.curRow.deviceModel).then(response => {
         this.eventData = response.data?.eventList || [];
@@ -757,12 +801,14 @@ export default {
       });
       this.activeTab = 'basic';
     },
+
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset()
       const id = row.id || this.ids
       getDevice(id).then(response => {
         this.form = response.data
+        console.log("this.form",this.form)
         this.open = true
         this.title = '修改能源设备'
         this.attrList = [];
@@ -784,7 +830,6 @@ export default {
       if (!this.form.customAttrs) {
         this.form.customAttrs = []
       }
-      // 准备要发送的数据
       let dataToSubmit = []
       this.attrList.forEach(attr => {
         const attrName = attr.attrName
@@ -792,7 +837,6 @@ export default {
         const attrValue = this.attrValuesMap[attrKey]
         const existingIndex = dataToSubmit.findIndex(item => item.attrKey === attrKey)
         if (existingIndex === -1) {
-          // 如果attrKey不存在于dataToSubmit中，则添加
           dataToSubmit.push({
             modelCode: this.form.deviceModel,
             objCode: this.form.deviceCode,
@@ -811,7 +855,6 @@ export default {
         const attrValue = customAttr.attrValue
         const existingIndex = dataToSubmit.findIndex(item => item.attrKey === attrKey)
         if (existingIndex === -1) {
-          // 如果attrKey不存在于dataToSubmit中，则添加
           dataToSubmit.push({
             modelCode: '',
             objCode: this.form.deviceCode,
@@ -830,6 +873,9 @@ export default {
               this.$modal.msgSuccess('修改成功')
               this.open = false
               this.getList()
+              if (this.showDrawer && this.curRow && this.curRow.id === this.form.id) {
+                this.handleDetail(this.form)
+              }
             })
 
             if (dataToSubmit.length > 0) {
@@ -837,8 +883,6 @@ export default {
                 .then(response => {
                   if (response.code === 200) {
                     this.$message.success('属性添加成功')
-                  } else {
-                    this.$message.error('属性添加失败')
                   }
                 })
             }
@@ -846,7 +890,7 @@ export default {
             addDevice(this.form).then(response => {
               this.$modal.msgSuccess('新增成功')
               this.open = false
-              this.getList()
+              this.getList() // 刷新设备列表
             })
 
             if (dataToSubmit.length > 0) {
@@ -854,9 +898,7 @@ export default {
                 .then(response => {
                   if (response.code === 200) {
                     this.$message.success('属性添加成功')
-                  } else {
-                    this.$message.error('属性添加失败')
-                  }
+                  } 
                 })
             }
           }
@@ -1057,4 +1099,15 @@ export default {
   padding: 5px 0;
   border-bottom: 1px solid #ebeef5;
 }
+.dialog-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+}
+
+.button-group {
+  display: flex;
+  gap: 10px;
+}
 </style>

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

@@ -73,15 +73,15 @@
             <template slot-scope="scope">
               <el-button size="mini" type="text" icon="el-icon-info" @click="handleDetail(scope.row)">详情</el-button>
               <!-- 下拉菜单 -->
-              <el-dropdown @command="handleOperate(scope.row)">
-                <el-button type="text" size="mini">
+              <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 abilityData"
+                    v-for="ability in abilityDevice"
                     :key="ability.abilityKey"
-                    :command="ability"
+                    @click.native="handleDeviceOperate(ability,scope.row)"
                   >
                     {{ ability.abilityName }}
                   </el-dropdown-item>
@@ -236,6 +236,7 @@ export default {
       curRow: {},
       attrData: [],
       abilityData: [],
+      abilityDevice:[],
       eventData: [],
       BaseData: [],
       ProtocolData: [],
@@ -267,10 +268,29 @@ export default {
     this.getSubCategorygetByCode()
   },
   methods: {
-
+    loadAbilities(row) {
+      if (!this.curRow) {
+        this.$message.warning('请选择一条设备记录');
+        return;
+      }
+      getModelByCode(row.deviceModel).then(response => {
+        this.abilityDevice = response.data?.abilityList.filter(item => item.hiddenFlag === 1) || [];
+      })
+    },
     /**设备能力-执行按钮*/
+    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' });
+
+      })
+    },
     handleOperate(row) {
-      console.log("row",row)
       listcallAbility({
         abilityKey:row.abilityKey,
         objCode: this.curRow.deviceCode,