|
|
@@ -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>
|
