fast(配置): 调整设备列表详情、屏蔽触发器、设备告警点击到tab再查询,设备实时websocket参数改版对接重连去掉延时,解决企业端设备详情返回列表失败

This commit is contained in:
fhysy 2024-09-30 09:37:12 +08:00
parent 4f998d267a
commit d9c8c0fbe6
4 changed files with 62 additions and 59 deletions

View File

@ -694,6 +694,7 @@ export default {
// ping ws // ping ws
timingPingWs(row) { timingPingWs(row) {
this.extenSubmit(row); this.extenSubmit(row);
clearInterval(this.timingPingWs_flag);
const _this = this; const _this = this;
this.timingPingWs_flag = setInterval(function() { this.timingPingWs_flag = setInterval(function() {
_this.extenSubmit(row); _this.extenSubmit(row);

View File

@ -1,33 +1,33 @@
<template> <template>
<div class="iot-circuit-breaker-details-warp"> <div class="iot-circuit-breaker-details-warp">
<device-select <device-select
ref="deviceSelect"
@wsRealTImeMsg="wsRealTImeMsg($event)"
v-if="pInfo" v-if="pInfo"
ref="deviceSelect"
:deviceInfo="pInfo" :deviceInfo="pInfo"
:wsDeviceInfo="infoData" :wsDeviceInfo="infoData"
@changeEvent="viewDeviceChange($event)" @changeEvent="viewDeviceChange($event)"
@wsRealTImeMsg="wsRealTImeMsg($event)"
></device-select> ></device-select>
<div :class="infoData.deviceType === 'GATEWAY_CONTROLLER' ? 'link-to-list is-widening': 'link-to-list'"> <div :class="infoData.deviceType === 'GATEWAY_CONTROLLER' ? 'link-to-list is-widening': 'link-to-list'">
<el-button icon="el-icon-d-arrow-left" style="margin-left: 10px;" title="返回列表" @click="toTableClick" circle <el-button circle icon="el-icon-d-arrow-left" style="margin-left: 10px;" title="返回列表" @click="toTableClick"
>返回列表</el-button >返回列表</el-button
> >
<el-button v-if="infoData.deviceType === 'GATEWAY_CONTROLLER'" @click="batchUpgradeOpen" title="批量升级" circle>批量升级</el-button> <el-button v-if="infoData.deviceType === 'GATEWAY_CONTROLLER'" circle title="批量升级" @click="batchUpgradeOpen">批量升级</el-button>
</div> </div>
<div class="info-tabs-circuit"> <div class="info-tabs-circuit">
<div class="breadcrumb-wrap" v-show="breadcrumbList.length > 1"> <div v-show="breadcrumbList.length > 1" class="breadcrumb-wrap">
<el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item <el-breadcrumb-item
v-for="(item, index) in breadcrumbList" v-for="(item, index) in breadcrumbList"
:key="index" :key="index"
> >
<span <span
@click="deviceClick(item, index)"
:class=" :class="
item.deviceId === deviceId item.deviceId === deviceId
? 'breadcrumb-span show-wrap' ? 'breadcrumb-span show-wrap'
: 'breadcrumb-span' : 'breadcrumb-span'
" "
@click="deviceClick(item, index)"
>{{ item.deviceName }}</span >{{ item.deviceName }}</span
> >
</el-breadcrumb-item> </el-breadcrumb-item>
@ -50,6 +50,7 @@
<el-tab-pane label="设备信息" name="info"> <el-tab-pane label="设备信息" name="info">
<div class="tabs-body"> <div class="tabs-body">
<info-wrap <info-wrap
v-if="activeName === 'info'"
:infoData="infoData" :infoData="infoData"
:isTenant="isTenant" :isTenant="isTenant"
@updateInfo="updateInfo($event)" @updateInfo="updateInfo($event)"
@ -57,34 +58,35 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane <el-tab-pane
v-if="infoData.deviceType === 'GATEWAY_CONTROLLER' && !isTenant"
label="子设备" label="子设备"
name="child" name="child"
v-if="infoData.deviceType === 'GATEWAY_CONTROLLER' && !isTenant"
> >
<div class="tabs-body"> <div class="tabs-body">
<child-device <child-device
v-if="activeName === 'child'" v-if="activeName === 'child'"
:pDevcieInfo="infoData" :pDevcieInfo="infoData"
:sourceId="infoData.deviceId" :sourceId="infoData.deviceId"
@toChildEvent="toNewDevice"
@EventUpload="handleUpload" @EventUpload="handleUpload"
@toChildEvent="toNewDevice"
></child-device> ></child-device>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="触发器" name="trigger"> <!-- <el-tab-pane label="触发器" name="trigger">-->
<div class="tabs-body protocol-wrap"> <!-- <div class="tabs-body protocol-wrap">-->
<trigger-wrap <!-- <trigger-wrap-->
:sourceId="infoData.deviceId" <!-- v-if="activeName === 'trigger'"-->
:deviceInfo="infoData" <!-- :deviceInfo="infoData"-->
></trigger-wrap> <!-- :sourceId="infoData.deviceId"-->
</div> <!-- ></trigger-wrap>-->
</el-tab-pane> <!-- </div>-->
<!-- </el-tab-pane>-->
<el-tab-pane label="固件" name="oat"> <el-tab-pane label="固件" name="oat">
<div class="tabs-body protocol-wrap"> <div class="tabs-body protocol-wrap">
<model-oat <model-oat
v-if="activeName === 'oat'" v-if="activeName === 'oat'"
:isTenant="isTenant"
:deviceInfo="infoData" :deviceInfo="infoData"
:isTenant="isTenant"
@updateInfo="updateInfo($event)" @updateInfo="updateInfo($event)"
></model-oat> ></model-oat>
</div> </div>
@ -107,9 +109,9 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="升级进度" name="batchUpgradeRate" v-if="infoData.deviceId === pInfo.deviceId"> <el-tab-pane v-if="infoData.deviceId === pInfo.deviceId" label="升级进度" name="batchUpgradeRate">
<div class="tabs-body"> <div class="tabs-body">
<batch-upgrade-rate ref="batchUpgradeRate" v-if="activeName === 'batchUpgradeRate'" :sourceKey="pInfo.deviceKey"></batch-upgrade-rate> <batch-upgrade-rate v-if="activeName === 'batchUpgradeRate'" ref="batchUpgradeRate" :sourceKey="pInfo.deviceKey"></batch-upgrade-rate>
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -118,25 +120,25 @@
<div style="height: 0;"> <div style="height: 0;">
<!-- 添加或修改建筑类型对话框 --> <!-- 添加或修改建筑类型对话框 -->
<dialog-template <dialog-template
style=""
:title="dialogTitle" :title="dialogTitle"
:visible="dialogOpen" :visible="dialogOpen"
style=""
width="880px" width="880px"
@close="dialogOpen = false" @close="dialogOpen = false"
> >
<e-batch-firmware-upgrade <e-batch-firmware-upgrade
slot="dialog-center" slot="dialog-center"
:sourceId="this.pInfo.deviceId"
:sourceData="this.form.data" :sourceData="this.form.data"
:sourceId="this.pInfo.deviceId"
@handleChange="handleFirmwareChange" @handleChange="handleFirmwareChange"
></e-batch-firmware-upgrade> ></e-batch-firmware-upgrade>
<div slot="dialog-footer" class="dialog-footer"> <div slot="dialog-footer" class="dialog-footer">
<el-button type="primary" size="mini" @click="submitForm" <el-button size="mini" type="primary" @click="submitForm"
> </el-button > </el-button
> >
<el-button @click="() => {dialogOpen = false}" size="mini"> </el-button> <el-button size="mini" @click="() => {dialogOpen = false}"> </el-button>
</div> </div>
</dialog-template> </dialog-template>
</div> </div>
</div> </div>

View File

@ -226,8 +226,8 @@ export default {
val.forEach((v, index) => { val.forEach((v, index) => {
this.forGetParmas(v, index); this.forGetParmas(v, index);
}); });
setTimeout(this.connection, 3000); // setTimeout(this.connection, 3000);
// this.connection() this.connection()
} }
}, },
realTimeData: { realTimeData: {

View File

@ -1,45 +1,45 @@
<template> <template>
<div class="app-container iot-device"> <div class="app-container iot-device">
<component :is="componectVal" :sourceId="sourceId" :isTenant="true"></component> <component :is="componectVal" :isTenant="true" :sourceId="sourceId" @toTableClick="toTableClick"></component>
<div v-show="componectVal === ''"> <div v-show="componectVal === ''">
<el-form <el-form
:model="queryParams" v-show="showSearch"
ref="queryForm" ref="queryForm"
:inline="true" :inline="true"
v-show="showSearch" :model="queryParams"
label-width="68px" label-width="68px"
> >
<el-form-item label="设备名称" prop="deviceName"> <el-form-item label="设备名称" prop="deviceName">
<el-input <el-input
v-model="queryParams.deviceName" v-model="queryParams.deviceName"
placeholder="请输入设备名称"
clearable clearable
placeholder="请输入设备名称"
size="small" size="small"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="设备状态" prop="deviceState"> <el-form-item label="设备状态" prop="deviceState">
<el-select v-model="queryParams.deviceState" placeholder="请选择设备状态" clearable size="small"> <el-select v-model="queryParams.deviceState" clearable placeholder="请选择设备状态" size="small">
<el-option <el-option
:label="keys"
v-for="(keys, vals) in deviceStatusOpt" v-for="(keys, vals) in deviceStatusOpt"
:key="vals" :key="vals"
:label="keys"
:value="vals" :value="vals"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="设备类型" prop="deviceType"> <el-form-item label="设备类型" prop="deviceType">
<el-select v-model="queryParams.deviceType" placeholder="请选择设备类型" clearable size="small"> <el-select v-model="queryParams.deviceType" clearable placeholder="请选择设备类型" size="small">
<el-option <el-option
:label="keys"
:value="vals"
v-for="(keys, vals) in deviceTypeList" v-for="(keys, vals) in deviceTypeList"
:key="vals" :key="vals"
:label="keys"
:value="vals"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<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-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -47,10 +47,10 @@
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning"
plain
icon="el-icon-download" icon="el-icon-download"
plain
size="mini" size="mini"
type="warning"
@click="handleExport" @click="handleExport"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
@ -64,36 +64,36 @@
@sort-change="sortChange" @sort-change="sortChange"
> >
<el-table-column <el-table-column
type="index"
label="序号"
align="center"
:index="indexFormatter" :index="indexFormatter"
align="center"
label="序号"
type="index"
width="80px" width="80px"
></el-table-column> ></el-table-column>
<el-table-column label="设备名称" align="left" prop="deviceName" /> <el-table-column align="left" label="设备名称" prop="deviceName" />
<el-table-column label="所属型号" align="left" prop="modelName" /> <el-table-column align="left" label="所属型号" prop="modelName" />
<el-table-column label="设备key" align="left" prop="deviceKey" /> <el-table-column align="left" label="设备key" prop="deviceKey" />
<el-table-column label="设备类型" align="left" width="120px" prop="deviceTypeName" /> <el-table-column align="left" label="设备类型" prop="deviceTypeName" width="120px" />
<el-table-column label="设备状态" align="center" width="120" prop="deviceState"> <el-table-column align="center" label="设备状态" prop="deviceState" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag type="success" v-if="scope.row.deviceState === 'ONLINE'">在线</el-tag> <el-tag v-if="scope.row.deviceState === 'ONLINE'" type="success">在线</el-tag>
<el-tag type="danger" v-else-if="scope.row.deviceState === 'OFFLINE'">离线</el-tag> <el-tag v-else-if="scope.row.deviceState === 'OFFLINE'" type="danger">离线</el-tag>
<el-tag type="danger" v-else-if="scope.row.deviceState === 'OUTLINE'">脱线</el-tag> <el-tag v-else-if="scope.row.deviceState === 'OUTLINE'" type="danger">脱线</el-tag>
<el-tag type="info" v-else-if="scope.row.deviceState === 'UNACTIVE'">未激活</el-tag> <el-tag v-else-if="scope.row.deviceState === 'UNACTIVE'" type="info">未激活</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" align="center" sortable="custom" width="160px" prop="createTime" /> <el-table-column align="center" label="创建时间" prop="createTime" sortable="custom" width="160px" />
<el-table-column <el-table-column
label="操作"
align="center" align="center"
width="200px"
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
label="操作"
width="200px"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
icon="el-icon-search"
size="mini" size="mini"
type="text" type="text"
icon="el-icon-search"
@click="handleDetails(scope.row)" @click="handleDetails(scope.row)"
>详情</el-button> >详情</el-button>
</template> </template>
@ -102,15 +102,15 @@
<pagination <pagination
v-show="total > 0" v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
:page.sync="queryParams.pageNum"
:total="total"
@pagination="getList" @pagination="getList"
/> />
</div> </div>
<div :class="componectVal === 'GatewayDetail'? 'to-home-wrap2 gateway-wrap': 'to-home-wrap2 '" @click="toTableClick" v-show="componectVal !== ''"> <div v-show="componectVal !== ''" :class="componectVal === 'GatewayDetail'? 'to-home-wrap2 gateway-wrap': 'to-home-wrap2 '" @click="toTableClick">
<el-button icon="el-icon-d-arrow-left" title="返回列表" circle>返回列表</el-button> <el-button circle icon="el-icon-d-arrow-left" title="返回列表">返回列表</el-button>
</div> </div>
</div> </div>
</template> </template>