🌷 UI(内容): 给企业端子断路器设备信息添加告警配置
This commit is contained in:
parent
209163eb36
commit
89c3b3047b
|
@ -8,19 +8,20 @@
|
|||
@changeEvent="viewDeviceChange($event)"
|
||||
@wsRealTImeMsg="wsRealTImeMsg($event)"
|
||||
></device-select>
|
||||
<div :class="infoData.deviceType === 'GATEWAY_CONTROLLER' ? 'link-to-list is-widening': 'link-to-list'" class="main-device-card">
|
||||
<el-button circle icon="el-icon-d-arrow-left" style="margin-left: 10px;" title="返回列表" @click="toTableClick"
|
||||
<div class="main-device-card">
|
||||
<div :class="infoData.deviceType === 'GATEWAY_CONTROLLER' ? 'link-to-list is-widening': 'link-to-list'">
|
||||
<el-button circle icon="el-icon-d-arrow-left" style="margin-left: 10px;" title="返回列表" @click="toTableClick"
|
||||
>返回列表</el-button
|
||||
>
|
||||
<el-button v-if="infoData.deviceType === 'GATEWAY_CONTROLLER'" circle title="批量升级" @click="batchUpgradeOpen">批量升级</el-button>
|
||||
</div>
|
||||
<div class="info-tabs-circuit main-device-card">
|
||||
<div v-show="breadcrumbList.length > 1" class="breadcrumb-wrap">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item
|
||||
v-for="(item, index) in breadcrumbList"
|
||||
:key="index"
|
||||
>
|
||||
>
|
||||
<el-button v-if="infoData.deviceType === 'GATEWAY_CONTROLLER'" circle title="批量升级" @click="batchUpgradeOpen">批量升级</el-button>
|
||||
</div>
|
||||
<div class="info-tabs-circuit">
|
||||
<div v-show="breadcrumbList.length > 1" class="breadcrumb-wrap">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item
|
||||
v-for="(item, index) in breadcrumbList"
|
||||
:key="index"
|
||||
>
|
||||
<span
|
||||
:class="
|
||||
item.deviceId === deviceId
|
||||
|
@ -28,123 +29,124 @@
|
|||
: 'breadcrumb-span'
|
||||
"
|
||||
@click="deviceClick(item, index)"
|
||||
>{{ item.deviceName }}</span
|
||||
>{{ item.deviceName }}</span
|
||||
>
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<el-tabs
|
||||
v-model="activeName"
|
||||
:class="breadcrumbList.length > 1 ? 'children-wrap' : ''"
|
||||
>
|
||||
<el-tab-pane label="运行状态" name="runingState">
|
||||
<div class="tabs-body protocol-wrap">
|
||||
<state-management
|
||||
v-if="devudeRunState"
|
||||
:deviceInfo="infoData"
|
||||
:realTimeData="realTimeData"
|
||||
></state-management>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="设备信息" name="info">
|
||||
<div class="tabs-body">
|
||||
<info-wrap
|
||||
v-if="activeName === 'info'"
|
||||
:infoData="infoData"
|
||||
:isTenant="isTenant"
|
||||
@updateInfo="updateInfo($event)"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
v-if="infoData.deviceType === 'GATEWAY_CONTROLLER' && !isTenant"
|
||||
label="子设备"
|
||||
name="child"
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
<el-tabs
|
||||
v-model="activeName"
|
||||
:class="breadcrumbList.length > 1 ? 'children-wrap' : ''"
|
||||
>
|
||||
<div class="tabs-body">
|
||||
<child-device
|
||||
v-if="activeName === 'child'"
|
||||
:pDevcieInfo="infoData"
|
||||
:sourceId="infoData.deviceId"
|
||||
@EventUpload="handleUpload"
|
||||
@toChildEvent="toNewDevice"
|
||||
></child-device>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- <el-tab-pane label="触发器" name="trigger">-->
|
||||
<!-- <div class="tabs-body protocol-wrap">-->
|
||||
<!-- <trigger-wrap-->
|
||||
<!-- v-if="activeName === 'trigger'"-->
|
||||
<!-- :deviceInfo="infoData"-->
|
||||
<!-- :sourceId="infoData.deviceId"-->
|
||||
<!-- ></trigger-wrap>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-tab-pane>-->
|
||||
<el-tab-pane label="固件" name="oat">
|
||||
<div class="tabs-body protocol-wrap">
|
||||
<model-oat
|
||||
v-if="activeName === 'oat'"
|
||||
:deviceInfo="infoData"
|
||||
:isTenant="isTenant"
|
||||
@updateInfo="updateInfo($event)"
|
||||
></model-oat>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="日志" name="devLog">
|
||||
<div class="tabs-body">
|
||||
<device-log
|
||||
v-if="activeName === 'devLog'"
|
||||
:pDevcieInfo="infoData"
|
||||
:sourceId="infoData.deviceId"
|
||||
></device-log>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="场景" name="scene">
|
||||
<div class="tabs-body">
|
||||
<e-device-scene
|
||||
v-if="activeName === 'scene'"
|
||||
:sourceId="infoData.deviceId"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="运行状态" name="runingState">
|
||||
<div class="tabs-body protocol-wrap">
|
||||
<state-management
|
||||
v-if="devudeRunState"
|
||||
:deviceInfo="infoData"
|
||||
:realTimeData="realTimeData"
|
||||
></state-management>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane v-if="infoData.deviceId === pInfo.deviceId" label="升级进度" name="batchUpgradeRate">
|
||||
<div class="tabs-body">
|
||||
<batch-upgrade-rate v-if="activeName === 'batchUpgradeRate'" ref="batchUpgradeRate" :sourceKey="pInfo.deviceKey"></batch-upgrade-rate>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="功能" name="function">
|
||||
<div class="tabs-body">
|
||||
<function-wrap :deviceInfo="infoData" :sourceId="deviceId"></function-wrap>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<el-tab-pane label="设备信息" name="info">
|
||||
<div class="tabs-body">
|
||||
<info-wrap
|
||||
v-if="activeName === 'info'"
|
||||
:infoData="infoData"
|
||||
:isTenant="isTenant"
|
||||
@updateInfo="updateInfo($event)"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
v-if="infoData.deviceType === 'GATEWAY_CONTROLLER' && !isTenant"
|
||||
label="子设备"
|
||||
name="child"
|
||||
>
|
||||
<div class="tabs-body">
|
||||
<child-device
|
||||
v-if="activeName === 'child'"
|
||||
:pDevcieInfo="infoData"
|
||||
:sourceId="infoData.deviceId"
|
||||
@EventUpload="handleUpload"
|
||||
@toChildEvent="toNewDevice"
|
||||
></child-device>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<!-- <el-tab-pane label="触发器" name="trigger">-->
|
||||
<!-- <div class="tabs-body protocol-wrap">-->
|
||||
<!-- <trigger-wrap-->
|
||||
<!-- v-if="activeName === 'trigger'"-->
|
||||
<!-- :deviceInfo="infoData"-->
|
||||
<!-- :sourceId="infoData.deviceId"-->
|
||||
<!-- ></trigger-wrap>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-tab-pane>-->
|
||||
<el-tab-pane label="固件" name="oat">
|
||||
<div class="tabs-body protocol-wrap">
|
||||
<model-oat
|
||||
v-if="activeName === 'oat'"
|
||||
:deviceInfo="infoData"
|
||||
:isTenant="isTenant"
|
||||
@updateInfo="updateInfo($event)"
|
||||
></model-oat>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="日志" name="devLog">
|
||||
<div class="tabs-body">
|
||||
<device-log
|
||||
v-if="activeName === 'devLog'"
|
||||
:pDevcieInfo="infoData"
|
||||
:sourceId="infoData.deviceId"
|
||||
></device-log>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="场景" name="scene">
|
||||
<div class="tabs-body">
|
||||
<e-device-scene
|
||||
v-if="activeName === 'scene'"
|
||||
:sourceId="infoData.deviceId"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane v-if="infoData.deviceId === pInfo.deviceId" label="升级进度" name="batchUpgradeRate">
|
||||
<div class="tabs-body">
|
||||
<batch-upgrade-rate v-if="activeName === 'batchUpgradeRate'" ref="batchUpgradeRate" :sourceKey="pInfo.deviceKey"></batch-upgrade-rate>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="功能" name="function">
|
||||
<div class="tabs-body">
|
||||
<function-wrap :deviceInfo="infoData" :sourceId="deviceId"></function-wrap>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height: 0;">
|
||||
<!-- 添加或修改建筑类型对话框 -->
|
||||
<dialog-template
|
||||
:title="dialogTitle"
|
||||
:visible="dialogOpen"
|
||||
style=""
|
||||
width="880px"
|
||||
@close="dialogOpen = false"
|
||||
>
|
||||
<e-batch-firmware-upgrade
|
||||
slot="dialog-center"
|
||||
:sourceData="this.form.data"
|
||||
:sourceId="this.pInfo.deviceId"
|
||||
@handleChange="handleFirmwareChange"
|
||||
></e-batch-firmware-upgrade>
|
||||
<div slot="dialog-footer" class="dialog-footer">
|
||||
<el-button size="mini" type="primary" @click="submitForm"
|
||||
>确 定</el-button
|
||||
>
|
||||
<el-button size="mini" @click="() => {dialogOpen = false}">取 消</el-button>
|
||||
</div>
|
||||
<!-- 添加或修改建筑类型对话框 -->
|
||||
<dialog-template
|
||||
:title="dialogTitle"
|
||||
:visible="dialogOpen"
|
||||
style=""
|
||||
width="880px"
|
||||
@close="dialogOpen = false"
|
||||
>
|
||||
<e-batch-firmware-upgrade
|
||||
slot="dialog-center"
|
||||
:sourceData="this.form.data"
|
||||
:sourceId="this.pInfo.deviceId"
|
||||
@handleChange="handleFirmwareChange"
|
||||
></e-batch-firmware-upgrade>
|
||||
<div slot="dialog-footer" class="dialog-footer">
|
||||
<el-button size="mini" type="primary" @click="submitForm"
|
||||
>确 定</el-button
|
||||
>
|
||||
<el-button size="mini" @click="() => {dialogOpen = false}">取 消</el-button>
|
||||
</div>
|
||||
|
||||
</dialog-template>
|
||||
</div>
|
||||
</dialog-template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
@ -434,29 +436,29 @@ export default {
|
|||
.link-to-list {
|
||||
display: flex;
|
||||
color: #656363;
|
||||
justify-content: flex-end;
|
||||
font-size: 20px;
|
||||
//height: 0;
|
||||
//background: #e4eaf3;
|
||||
height: 0;
|
||||
background: #e4eaf3;
|
||||
display: flex;
|
||||
position: relative;
|
||||
top: 10px;
|
||||
z-index: 100;
|
||||
//width: 120px;
|
||||
//left: calc(100% - 120px);
|
||||
width: 120px;
|
||||
left: calc(100% - 120px);
|
||||
cursor: default;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: nowrap;
|
||||
flex-direction: row-reverse;
|
||||
.el-button--medium.is-circle {
|
||||
//width: 25px;
|
||||
//height: 20px;
|
||||
padding: 10px;
|
||||
width: 25px;
|
||||
height: 20px;
|
||||
padding: 0;
|
||||
background: #0d8afd;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
border-radius: 5px;
|
||||
//height: 30px;
|
||||
//width: 100%;
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
@ -466,8 +468,8 @@ export default {
|
|||
}
|
||||
|
||||
.is-widening {
|
||||
//width: 220px;
|
||||
//left: calc(100% - 220px);
|
||||
width: 220px;
|
||||
left: calc(100% - 220px);
|
||||
}
|
||||
|
||||
.info-tabs-circuit {
|
||||
|
@ -1075,23 +1077,23 @@ export default {
|
|||
}
|
||||
}
|
||||
.iot-circuit-breaker-details-warp
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar {
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar {
|
||||
/*滚动条整体样式*/
|
||||
width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
|
||||
height: 3px;
|
||||
}
|
||||
.iot-circuit-breaker-details-warp
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar-thumb {
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar-thumb {
|
||||
/*滚动条里面小方块*/
|
||||
border-radius: 10px;
|
||||
box-shadow: inset 0 0 5px #9e9d9d;
|
||||
background: #ffffff;
|
||||
}
|
||||
.iot-circuit-breaker-details-warp
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar-track {
|
||||
.info-tabs-circuit
|
||||
.el-tabs__content::-webkit-scrollbar-track {
|
||||
/*滚动条里面轨道*/
|
||||
box-shadow: inset 0 0 5px #f6f6f6;
|
||||
border-radius: 10px;
|
||||
|
|
|
@ -135,13 +135,26 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="infoData.deviceType === 'MINIATURE_BREAKER' || infoData.deviceType === 'MOLDED_BREAKER'" class="group-list-info" style="margin-top: 15px;">
|
||||
<div class="top">
|
||||
<div class="top-label">
|
||||
<svg-icon icon-class="A_product1" style="margin-right: 2px; height: 20px; width: 20px;" />告警配置
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="infoData.deviceType === 'MINIATURE_BREAKER' || infoData.deviceType === 'MOLDED_BREAKER'" class="group-list-table" style="border: 0;">
|
||||
<device-alarm-config v-if="infoData.deviceType === 'MINIATURE_BREAKER' || infoData.deviceType === 'MOLDED_BREAKER'" :deviceId="infoData.deviceId" :deviceKey="infoData.deviceKey" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { updateDevice } from "@/api/iot/device";
|
||||
import DeviceAlarmConfig from '@/views/profile/DeviceAlarmConfig/DeviceAlarmConfig'
|
||||
export default {
|
||||
name: "DeviceInfo",
|
||||
props: ["infoData"],
|
||||
components: {DeviceAlarmConfig},
|
||||
data() {
|
||||
return {
|
||||
updateState: false,
|
||||
|
|
Loading…
Reference in New Issue