详情

ems-ui/src/api/basecfg/objModel.js

@@ -20,7 +20,7 @@ export function getModel(id) {
 // 根据code查询能源对象属性详细
 export function getModelByCode(code) {
   return request({
-    url: '/ems/object/model/getByModelCode?code=' + code,
+    url: '/ems/object/model/getByModelCode?modelCode=' + code,
     method: 'get'
   })
 }

ems-ui/src/views/basecfg/emsfacs/index.vue

@@ -125,122 +125,183 @@
         </el-dialog>
       </el-col>
     </el-row>
-    <el-drawer :title="curRow.facsName" size="80%" :visible.sync="showDrawer" direction="rtl">
-      <div class="drawer-content">
-        <el-tabs v-model="subKey">
-          <el-tab-pane label="属性定义" name="attr">
-            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增
-            </el-button>
-            <el-table class="sub-table" :data="attrData">
-              <el-table-column label="序号" align="center" type="index" />
-              <el-table-column label="属性名称" align="center" prop="attrName" />
-              <el-table-column label="属性描述" align="center" prop="attrDesc" />
-              <el-table-column label="属性值" align="center" prop="attrValue" />
-              <el-table-column label="属性单位" align="center" prop="attrUnit" />
-              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                <template slot-scope="scope">
-                  <el-button size="mini" type="text" @click="editSub(scope.row)">修改</el-button>
-                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">
-                    删除</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="能力定义" name="ability">
-            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增
-            </el-button>
-            <el-table class="sub-table" :data="abilityData">
-              <el-table-column label="序号" align="center" type="index" />
-              <el-table-column label="能力名称" align="center" prop="abilityName" />
-              <el-table-column label="下发参数" align="center" prop="abilityParam" />
-              <el-table-column label="描述" align="center" prop="abilityDesc" />
-              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                <template slot-scope="scope">
-                  <el-button size="mini" type="text" @click="editSub(scope.row)">
-                    修改</el-button>
-                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">
-                    删除</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="事件定义" name="event">
-            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增
-            </el-button>
-            <el-table class="sub-table" :data="eventData">
-              <el-table-column label="序号" align="center" type="index" />
-              <el-table-column label="事件名称" align="center" prop="eventName" />
-              <el-table-column label="事件类型" align="center" prop="eventType">
+
+      <!-- 详情弹框 -->
+      <el-dialog :visible.sync="showDrawer" title="设施详情">
+        <div v-if="curRow">
+          <!-- 设备基本信息 -->
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span class="section-title">设施基本信息</span>
+            </div>
+            <div>
+              <p>设施代码：{{ curRow.facsCode }}</p>
+              <p>设施名称：{{ curRow.facsName }}</p>
+              <p>设施名称：{{ curRow.facsCategoryName }}</p>
+              <p>设施子类：{{ curRow.facsSubCategoryName }}</p>
+              <p>归属区域：{{ curRow.refAreaName}}</p>
+              <!-- 其他基本信息 -->
+            </div>
+          </el-card>
+
+          <!-- 属性信息 -->
+          <el-card class="box-card" v-if="attrData.length > 0">
+            <div slot="header" class="clearfix">
+              <span class="section-title">属性定义</span>
+            </div>
+            <div v-for="(item, index) in attrData" :key="index">
+              <p>属性名称：{{ item.attrName }}</p>
+              <p>属性描述：{{ item.attrDesc }}</p>
+              <p>属性值：{{ item.attrValue }}</p>
+              <p>属性单位：{{ item.attrUnit }}</p>
+            </div>
+          </el-card>
+
+          <!-- 能力信息 -->
+          <el-card class="box-card" v-if="abilityData.length > 0">
+            <div slot="header" class="clearfix">
+              <span class="section-title">能力定义</span>
+            </div>
+            <div v-for="(item, index) in abilityData" :key="index">
+              <p>能力名称：{{ item.abilityName }}</p>
+              <p>下发参数：{{ item.abilityParam }}</p>
+              <p>描述：{{ item.abilityDesc }}</p>
+            </div>
+          </el-card>
+
+          <!-- 事件信息 -->
+          <el-card class="box-card" v-if="eventData.length > 0">
+            <div slot="header" class="clearfix">
+              <span class="section-title">事件定义</span>
+            </div>
+            <div v-for="(item, index) in eventData" :key="index">
+              <p>事件名称：{{ item.eventName }}</p>
+              <p>事件类型：{{ item.eventType === 1 ? '消息上报' : '异常告警' }}</p>
+              <p>事件代码：{{ item.eventCode }}</p>
+              <p>外部事件代码：{{ item.extEventCode }}</p>
+              <p>描述：{{ item.eventDesc }}</p>
+              <!-- 在每个条目之后添加横线，除了最后一个条目 -->
+              <div v-if="index < eventData.length - 1" class="divider"></div>
+            </div>
+          </el-card>
+        </div>
+      </el-dialog>
+<!--    <el-drawer :title="curRow.facsName" size="80%" :visible.sync="showDrawer" direction="rtl">-->
+<!--      <div class="drawer-content">-->
+<!--        <el-tabs v-model="subKey">-->
+<!--          <el-tab-pane label="属性定义" name="attr">-->
+<!--            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增-->
+<!--            </el-button>-->
+<!--            <el-table class="sub-table" :data="attrData">-->
+<!--              <el-table-column label="序号" align="center" type="index" />-->
+<!--              <el-table-column label="属性名称" align="center" prop="attrName" />-->
+<!--              <el-table-column label="属性描述" align="center" prop="attrDesc" />-->
+<!--              <el-table-column label="属性值" align="center" prop="attrValue" />-->
+<!--              <el-table-column label="属性单位" align="center" prop="attrUnit" />-->
+<!--              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <el-button size="mini" type="text" @click="editSub(scope.row)">修改</el-button>-->
+<!--                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">-->
+<!--                    删除</el-button>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--            </el-table>-->
+<!--          </el-tab-pane>-->
+<!--          <el-tab-pane label="能力定义" name="ability">-->
+<!--            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增-->
+<!--            </el-button>-->
+<!--            <el-table class="sub-table" :data="abilityData">-->
+<!--              <el-table-column label="序号" align="center" type="index" />-->
+<!--              <el-table-column label="能力名称" align="center" prop="abilityName" />-->
+<!--              <el-table-column label="下发参数" align="center" prop="abilityParam" />-->
+<!--              <el-table-column label="描述" align="center" prop="abilityDesc" />-->
+<!--              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <el-button size="mini" type="text" @click="editSub(scope.row)">-->
+<!--                    修改</el-button>-->
+<!--                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">-->
+<!--                    删除</el-button>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--            </el-table>-->
+<!--          </el-tab-pane>-->
+<!--          <el-tab-pane label="事件定义" name="event">-->
+<!--            <el-button type="primary" class="mb8" icon="el-icon-plus" size="mini" @click="addSub">新增-->
+<!--            </el-button>-->
+<!--            <el-table class="sub-table" :data="eventData">-->
+<!--              <el-table-column label="序号" align="center" type="index" />-->
+<!--              <el-table-column label="事件名称" align="center" prop="eventName" />-->
+<!--              <el-table-column label="事件类型" align="center" prop="eventType">-->
                 <template slot-scope="scope">
                   <span>{{ scope.row.eventType === 1 ? '消息上报' : '异常告警' }}</span>
                 </template>
-              </el-table-column>
-              <el-table-column label="事件代码" align="center" prop="eventCode" />
-              <el-table-column label="外部事件代码" align="center" prop="extEventCode" />
-              <el-table-column label="描述" align="center" prop="eventDesc" />
-              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                <template slot-scope="scope">
-                  <el-button size="mini" type="text" @click="editSub(scope.row)">修改</el-button>
-                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">
-                    删除</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-    </el-drawer>
-    <el-dialog :title="subTitle" :visible.sync="subDialogShow" width="450px" append-to-body>
-      <el-form v-if="subKey=='attr'" ref="subForm" :model="attrForm" label-width="100px">
-        <el-form-item label="属性名称" prop="attrName" required :rules="[{ required: true, message: '属性名称不能为空'}]">
-          <el-input v-model="attrForm.attrName" placeholder="请输入属性名称" />
-        </el-form-item>
-        <el-form-item label="属性值" prop="attrValue">
-          <el-input v-model="attrForm.attrValue" placeholder="请输入属性值" />
-        </el-form-item>
-        <el-form-item label="属性单位" prop="attrUnit">
-          <el-input v-model="attrForm.attrUnit" placeholder="请输入属性单位" />
-        </el-form-item>
-        <el-form-item label="描述" prop="attrDesc">
-          <el-input v-model="attrForm.attrDesc" placeholder="请输入描述" />
-        </el-form-item>
-      </el-form>
-      <el-form v-else-if="subKey=='ability'" ref="subForm" :model="abilityForm" label-width="100px">
-        <el-form-item label="能力名称" prop="abilityName" required :rules="[{ required: true, message: '能力名称不能为空'}]">
-          <el-input v-model="abilityForm.abilityName" placeholder="请输入能力名称" />
-        </el-form-item>
-        <el-form-item label="能力下发参数" prop="abilityParam">
-          <el-input v-model="abilityForm.abilityParam" placeholder="请输入能力下发参数" />
-        </el-form-item>
-        <el-form-item label="描述" prop="abilityDesc">
-          <el-input v-model="abilityForm.abilityDesc" placeholder="请输入描述" />
-        </el-form-item>
-      </el-form>
-      <el-form v-else-if="subKey=='event'" ref="subForm" :model="eventForm" label-width="100px">
-        <el-form-item label="事件名称" prop="eventName" required :rules="[{ required: true, message: '事件名称不能为空'}]">
-          <el-input v-model="eventForm.eventName" placeholder="请输入事件名称" />
-        </el-form-item>
-        <el-form-item label="事件类型" prop="eventType" required :rules="[{ required: true, message: '事件类型不能为空'}]">
-          <el-select v-model="eventForm.eventType" style="width:100%" placeholder="请选择事件类型">
-            <el-option label="消息上报" :value="1" />
-            <el-option label="异常告警" :value="2" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="事件代码" prop="eventCode">
-          <el-input v-model="eventForm.eventCode" placeholder="请输入事件代码" />
-        </el-form-item>
-        <el-form-item label="外部事件代码" prop="extEventCode">
-          <el-input v-model="eventForm.extEventCode" placeholder="请输入外部事件代码" />
-        </el-form-item>
-        <el-form-item label="描述" prop="eventDesc">
-          <el-input v-model="eventForm.eventDesc" placeholder="请输入描述" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="subFormSubmit">确 定</el-button>
-        <el-button @click="subFormCancel">取 消</el-button>
-      </div>
-    </el-dialog>
+<!--              </el-table-column>-->
+<!--              <el-table-column label="事件代码" align="center" prop="eventCode" />-->
+<!--              <el-table-column label="外部事件代码" align="center" prop="extEventCode" />-->
+<!--              <el-table-column label="描述" align="center" prop="eventDesc" />-->
+<!--              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">-->
+<!--                <template slot-scope="scope">-->
+<!--                  <el-button size="mini" type="text" @click="editSub(scope.row)">修改</el-button>-->
+<!--                  <el-button size="mini" type="text" class="deleteBtn" @click="deleteSub(scope.row)">-->
+<!--                    删除</el-button>-->
+<!--                </template>-->
+<!--              </el-table-column>-->
+<!--            </el-table>-->
+<!--          </el-tab-pane>-->
+<!--        </el-tabs>-->
+<!--      </div>-->
+<!--    </el-drawer>-->
+<!--    <el-dialog :title="subTitle" :visible.sync="subDialogShow" width="450px" append-to-body>-->
+<!--      <el-form v-if="subKey=='attr'" ref="subForm" :model="attrForm" label-width="100px">-->
+<!--        <el-form-item label="属性名称" prop="attrName" required :rules="[{ required: true, message: '属性名称不能为空'}]">-->
+<!--          <el-input v-model="attrForm.attrName" placeholder="请输入属性名称" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="属性值" prop="attrValue">-->
+<!--          <el-input v-model="attrForm.attrValue" placeholder="请输入属性值" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="属性单位" prop="attrUnit">-->
+<!--          <el-input v-model="attrForm.attrUnit" placeholder="请输入属性单位" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="描述" prop="attrDesc">-->
+<!--          <el-input v-model="attrForm.attrDesc" placeholder="请输入描述" />-->
+<!--        </el-form-item>-->
+<!--      </el-form>-->
+<!--      <el-form v-else-if="subKey=='ability'" ref="subForm" :model="abilityForm" label-width="100px">-->
+<!--        <el-form-item label="能力名称" prop="abilityName" required :rules="[{ required: true, message: '能力名称不能为空'}]">-->
+<!--          <el-input v-model="abilityForm.abilityName" placeholder="请输入能力名称" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="能力下发参数" prop="abilityParam">-->
+<!--          <el-input v-model="abilityForm.abilityParam" placeholder="请输入能力下发参数" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="描述" prop="abilityDesc">-->
+<!--          <el-input v-model="abilityForm.abilityDesc" placeholder="请输入描述" />-->
+<!--        </el-form-item>-->
+<!--      </el-form>-->
+<!--      <el-form v-else-if="subKey=='event'" ref="subForm" :model="eventForm" label-width="100px">-->
+<!--        <el-form-item label="事件名称" prop="eventName" required :rules="[{ required: true, message: '事件名称不能为空'}]">-->
+<!--          <el-input v-model="eventForm.eventName" placeholder="请输入事件名称" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="事件类型" prop="eventType" required :rules="[{ required: true, message: '事件类型不能为空'}]">-->
+<!--          <el-select v-model="eventForm.eventType" style="width:100%" placeholder="请选择事件类型">-->
+<!--            <el-option label="消息上报" :value="1" />-->
+<!--            <el-option label="异常告警" :value="2" />-->
+<!--          </el-select>-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="事件代码" prop="eventCode">-->
+<!--          <el-input v-model="eventForm.eventCode" placeholder="请输入事件代码" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="外部事件代码" prop="extEventCode">-->
+<!--          <el-input v-model="eventForm.extEventCode" placeholder="请输入外部事件代码" />-->
+<!--        </el-form-item>-->
+<!--        <el-form-item label="描述" prop="eventDesc">-->
+<!--          <el-input v-model="eventForm.eventDesc" placeholder="请输入描述" />-->
+<!--        </el-form-item>-->
+<!--      </el-form>-->
+<!--      <div slot="footer" class="dialog-footer">-->
+<!--        <el-button type="primary" @click="subFormSubmit">确 定</el-button>-->
+<!--        <el-button @click="subFormCancel">取 消</el-button>-->
+<!--      </div>-->
+<!--    </el-dialog>-->
   </div>
 </template>
 
@@ -260,12 +321,17 @@ import { listAllFacsCategory } from '@/api/basecfg/facscategory'
 import { areaTreeSelect } from '@/api/basecfg/area'
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import {getModelByCode} from '@/api/basecfg/objModel'
+import {addAbilityBatch} from "@/api/basecfg/objAbility";
+import data from "@/views/system/dict/data.vue";
+import {code} from "quill/ui/icons";
 
 export default {
   name: 'Facs',
   components: { Treeselect },
   data() {
     return {
+      code:'',
       showDrawer: false,
       // 遮罩层
       loading: true,
@@ -450,17 +516,20 @@ export default {
     // 设配详情
     handleDetail(row) {
       this.showDrawer = true
-      this.curRow = row
+      this.curRow= row
+      console.log("data",this.curRow)
       this.subKey = this.$options.data().subKey
-      getFacs(row.id).then(({ code, data }) => {
-        if (code === 200) {
-          const { facsAttrs = [], facsAbilities = [], facsEvents = [] } = data
-          this.attrData = facsAttrs
-          this.abilityData = facsAbilities
-          this.eventData = facsEvents
-        }
+      getModelByCode(this.curRow.facsModel).then(response => {
+        const code=response.data
+        console.log("code",code)
+        this.attrData=response.data.attrList
+        this.eventData=response.data.eventList
+        this.abilityData=response.data.abilityList
+
       })
+
     },
+
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids
@@ -580,6 +649,7 @@ export default {
   }
 }
 </script>
+
 <style lang="scss" scoped>
 .sub-table {
   .el-icon-delete {
@@ -596,4 +666,15 @@ export default {
 .drawer-content {
   padding: 0 20px;
 }
+
+.divider {
+  border-bottom: 2px solid #ebeef5; /* 这是Element UI的默认边框颜色，你可以根据需要调整 */
+  margin: 10px 0; /* 这是横线与内容的间距，你可以根据需要调整 */
+}
+
+.section-title {
+  font-size: 18px; /* 标题字体大小 */
+  font-weight: bold; /* 字体加粗 */
+}
+
 </style>

ems-ui/src/views/devmgr/state/index.vue

@@ -98,36 +98,136 @@
           :limit.sync="queryParams.pageSize"
           @pagination="getList"
         />
+        <!-- 设备基本信息 -->
 
-        <!-- 添加或修改能源设备对话框 -->
-        <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="deviceName">
-              <el-input disabled v-model="form.deviceName" placeholder="请输入设备名称"/>
-            </el-form-item>
-            <el-form-item label="设备代码" prop="deviceCode">
-              <el-input disabled v-model="form.deviceCode" placeholder="请输入设备代码"/>
-            </el-form-item>
-            <el-form-item label="归属设施" prop="refFacs" >
-              <el-input disabled v-model="form.refFacsName" placeholder="归属设施"/>
-            </el-form-item>
-            <el-form-item label="归属区域" prop="refArea">
-              <el-input disabled v-model="form.refAreaName" placeholder="归属区域"/>
-            </el-form-item>
-            <el-form-item label="设备类型" prop="deviceType">
-              <el-input disabled v-model="form.deviceTypeName" placeholder="设备类型"/>
-            </el-form-item>
-            <el-form-item label="子系统" prop="subsystemName">
-              <el-input disabled v-model="form.subsystemName" placeholder="子系统"/>
-            </el-form-item>
-            <el-form-item label="设备状态" prop="deviceStatus">
-              <el-input disabled v-model="form.deviceStatus" placeholder="设备状态"/>
-            </el-form-item>
-          </el-form>
-          <div slot="footer" class="dialog-footer">
-            <el-button @click="cancel">关闭</el-button>
+
+        <!-- 详情弹框 -->
+        <el-dialog :visible.sync="open" title="设备状态详情" custom-class="detail-dialog">
+          <div v-if="curRow">
+            <!-- 设施基本信息 -->
+            <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>
+                <p><span class="bold">归属设施：</span>{{ curRow.refFacs }}</p>
+                <p><span class="bold">归属区域：</span>{{ curRow.refArea }}</p>
+                <p><span class="bold">子系统：</span>{{ curRow.subsystemName }}</p>
+                <p><span class="bold">设备状态：</span>{{ curRow.deviceStatus }}</p>
+              </div>
+            </el-card>
+
+            <!-- 属性信息 -->
+            <el-card class="box-card" v-if="attrData.length > 0">
+              <div slot="header" class="clearfix">
+                <span class="section-title">属性定义</span>
+              </div>
+              <div v-for="(item, index) in attrData" :key="index">
+                <p><span class="bold">属性名称：</span>{{ item.attrName }}</p>
+                <p><span class="bold">属性描述：</span>{{ item.attrDesc }}</p>
+                <p><span class="bold">属性值：</span>{{ item.attrValue }}</p>
+                <p><span class="bold">属性单位：</span>{{ item.attrUnit }}</p>
+                <!-- 在每个条目之后添加横线，除了最后一个条目 -->
+                <div v-if="index < attrData.length - 1" class="divider"></div>
+              </div>
+            </el-card>
+            <el-card class="box-card" v-else>
+              <div slot="header" class="clearfix">
+                <span class="section-title">属性定义</span>
+              </div>
+              <div>
+                <p><span class="bold">属性名称：</span>暂无数据</p>
+                <p><span class="bold">属性描述：</span>暂无数据</p>
+                <p><span class="bold">属性值：</span>暂无数据</p>
+                <p><span class="bold">属性单位：</span>暂无数据</p>
+              </div>
+            </el-card>
+
+            <!-- 能力信息 -->
+            <el-card class="box-card" v-if="abilityData.length > 0">
+              <div slot="header" class="clearfix">
+                <span class="section-title">能力定义</span>
+              </div>
+              <div v-for="(item, index) in abilityData" :key="index">
+                <p><span class="bold">能力名称：</span>{{ item.abilityName }}</p>
+                <p><span class="bold">下发参数：</span>{{ item.abilityParam }}</p>
+                <p><span class="bold">描述：</span>{{ item.abilityDesc }}</p>
+                <!-- 在每个条目之后添加横线，除了最后一个条目 -->
+                <div v-if="index < abilityData.length - 1" class="divider"></div>
+              </div>
+            </el-card>
+            <el-card class="box-card" v-else>
+              <div slot="header" class="clearfix">
+                <span class="section-title">能力定义</span>
+              </div>
+              <div>
+                <p><span class="bold">能力名称：</span>暂无数据</p>
+                <p><span class="bold">下发参数：</span>暂无数据</p>
+                <p><span class="bold">描述：</span>暂无数据</p>
+              </div>
+            </el-card>
+
+            <!-- 事件信息 -->
+            <el-card class="box-card" v-if="eventData.length > 0">
+              <div slot="header" class="clearfix">
+                <span class="section-title">事件定义</span>
+              </div>
+              <div v-for="(item, index) in eventData" :key="index">
+                <p><span class="bold">事件名称：</span>{{ item.eventName }}</p>
+                <p><span class="bold">事件类型：</span>{{ item.eventType === 1 ? '消息上报' : '异常告警' }}</p>
+                <p><span class="bold">事件代码：</span>{{ item.eventCode }}</p>
+                <p><span class="bold">外部事件代码：</span>{{ item.extEventCode }}</p>
+                <p><span class="bold">描述：</span>{{ item.eventDesc }}</p>
+                <!-- 在每个条目之后添加横线，除了最后一个条目 -->
+                <div v-if="index < eventData.length - 1" class="divider"></div>
+              </div>
+            </el-card>
+            <el-card class="box-card" v-else>
+              <div slot="header" class="clearfix">
+                <span class="section-title">事件定义</span>
+              </div>
+              <div>
+                <p><span class="bold">事件名称：</span>暂无数据</p>
+                <p><span class="bold">事件类型：</span>暂无数据</p>
+                <p><span class="bold">事件代码：</span>暂无数据</p>
+                <p><span class="bold">外部事件代码：</span>暂无数据</p>
+                <p><span class="bold">描述：</span>暂无数据</p>
+              </div>
+            </el-card>
           </div>
         </el-dialog>
+
+        <!-- 添加或修改能源设备对话框 -->
+        <!--        <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="deviceName">-->
+<!--              <el-input disabled v-model="form.deviceName" placeholder="请输入设备名称"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="设备代码" prop="deviceCode">-->
+<!--              <el-input disabled v-model="form.deviceCode" placeholder="请输入设备代码"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="归属设施" prop="refFacs" >-->
+<!--              <el-input disabled v-model="form.refFacsName" placeholder="归属设施"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="归属区域" prop="refArea">-->
+<!--              <el-input disabled v-model="form.refAreaName" placeholder="归属区域"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="设备类型" prop="deviceType">-->
+<!--              <el-input disabled v-model="form.deviceTypeName" placeholder="设备类型"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="子系统" prop="subsystemName">-->
+<!--              <el-input disabled v-model="form.subsystemName" placeholder="子系统"/>-->
+<!--            </el-form-item>-->
+<!--            <el-form-item label="设备状态" prop="deviceStatus">-->
+<!--              <el-input disabled v-model="form.deviceStatus" placeholder="设备状态"/>-->
+<!--            </el-form-item>-->
+<!--          </el-form>-->
+<!--          <div slot="footer" class="dialog-footer">-->
+<!--            <el-button @click="cancel">关闭</el-button>-->
+<!--          </div>-->
+<!--        </el-dialog>-->
       </el-col>
     </el-row>
   </div>
@@ -142,6 +242,7 @@ import { listSubsystemAll } from '@/api/adapter/subsystem'
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import { getBuilding } from '@/api/basecfg/building'
+import {getModelByCode} from "@/api/basecfg/objModel";
 
 
 export default {
@@ -181,6 +282,10 @@ export default {
         children: "children",
         label: "label"
       },
+      curRow: {},
+      attrData: [],
+      abilityData: [],
+      eventData: [],
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -284,13 +389,28 @@ export default {
       this.resetForm('queryForm')
       this.handleQuery()
     },
+    // handleDetail(row) {
+    //   this.reset()
+    //   const id = row.id || this.ids
+    //   getDevice(id).then(response => {
+    //     this.form = response.data
+    //     console.log("设备详情",this.form)
+    //     this.open = true
+    //     this.title = '设备详情'
+    //   })
+    // },
+    // 设备状态详情
     handleDetail(row) {
       this.reset()
-      const id = row.id || this.ids
-      getDevice(id).then(response => {
-        this.form = response.data
+      this.curRow= row
+      console.log("设备data",this.curRow)
+      getModelByCode(this.curRow.deviceModel).then(response => {
         this.open = true
-        this.title = '设备详情'
+        const code=response.data
+        console.log("code",code)
+        this.attrData=response.data.attrList
+        this.eventData=response.data.eventList
+        this.abilityData=response.data.abilityList
       })
     },
     handleAreaType(data) {
@@ -314,3 +434,19 @@ export default {
   }
 }
 </script>
+
+<style lang="scss" scoped>
+.detail-dialog .el-dialog {
+  width: 80%; /* 调整弹框宽度 */
+}
+
+.section-title {
+  font-size: 18px; /* 标题字体大小 */
+  font-weight: bold; /* 字体加粗 */
+  margin-top: 20px; /* 标题顶部间距 */
+  margin-bottom: 10px; /* 标题底部间距 */
+}
+
+
+
+</style>

ems-ui/src/views/mgr/powergrid.vue

@@ -492,28 +492,28 @@ export default {
       }
       const xaxis = DateTool.getTime(60);
       const {
-        pv,
         supply,
+        pv,
       } = data;
       const series = [
-      {
-          name: '市电',
+        {
+          name: '光伏',
           type: 'bar',
           barWidth: '30%', // 调整柱状图宽度
           data: [],
           itemStyle: {
-              color: '#6395FA',
+            color: '#8CDF6C',
           },
         },
         {
-          name: '光伏',
+          name: '市电',
           type: 'bar',
           barWidth: '30%', // 调整柱状图宽度
           data: [],
           itemStyle: {
-              color: '#8CDF6C',
+            color: '#6395FA',
           },
-        }
+        },
       ];
       xaxis.forEach((item, index) => {
         let timeIndex = index + 1;
@@ -528,9 +528,10 @@ export default {
           series[1].data.push(supply[timeIndex].quantity);
         }
       });
-      this.pvSupplyIndex.series = series;
+      this.pvSupplyIndex.series =series;
       this.pvSupplyIndex.xAxis.data = xaxis;
     },
+
     getList() {
       this.loading = true;
       if (this.activeName === 'first') {