From 3955e6ed53d450f8faf488d4b74ba0c0c83c5aaa Mon Sep 17 00:00:00 2001 From: 648540858 <456panlinlin> Date: 星期二, 12 四月 2022 21:06:21 +0800 Subject: [PATCH] 异步通道刷新,优化ui效果 --- web_src/src/components/DeviceList.vue | 45 +++++++++++++++++++++++++++++++++------------ 1 files changed, 33 insertions(+), 12 deletions(-) diff --git a/web_src/src/components/DeviceList.vue b/web_src/src/components/DeviceList.vue index 8a156d5..4f8b460 100644 --- a/web_src/src/components/DeviceList.vue +++ b/web_src/src/components/DeviceList.vue @@ -57,7 +57,7 @@ <el-table-column label="鎿嶄綔" width="450" align="center" fixed="right"> <template slot-scope="scope"> - <el-button size="mini" :loading="syncDevices.includes(scope.row.deviceId)" v-if="scope.row.online!=0" icon="el-icon-refresh" @click="refDevice(scope.row)">鍒锋柊</el-button> + <el-button size="mini" v-if="scope.row.online!=0" icon="el-icon-refresh" @click="refDevice(scope.row)" @mouseover="getTooltipContent(scope.row.deviceId)">鍒锋柊</el-button> <el-button-group> <el-button size="mini" icon="el-icon-video-camera-solid" v-bind:disabled="scope.row.online==0" type="primary" @click="showChannelList(scope.row)">閫氶亾</el-button> <el-button size="mini" icon="el-icon-location" v-bind:disabled="scope.row.online==0" type="primary" @click="showDevicePosition(scope.row)">瀹氫綅</el-button> @@ -78,6 +78,7 @@ :total="total"> </el-pagination> <deviceEdit ref="deviceEdit" ></deviceEdit> + <syncChannelProgress ref="syncChannelProgress" ></syncChannelProgress> </el-main> </el-container> </div> @@ -86,11 +87,13 @@ <script> import uiHeader from './UiHeader.vue' import deviceEdit from './dialog/deviceEdit.vue' + import syncChannelProgress from './dialog/SyncChannelProgress.vue' export default { name: 'app', components: { uiHeader, - deviceEdit + deviceEdit, + syncChannelProgress, }, data() { return { @@ -105,7 +108,6 @@ count:15, total:0, getDeviceListLoading: false, - syncDevices:[] }; }, computed: { @@ -198,8 +200,7 @@ //鍒锋柊璁惧淇℃伅 refDevice: function(itemData) { console.log("鍒锋柊瀵瑰簲璁惧:" + itemData.deviceId); - var that = this; - this.syncDevices.push(itemData.deviceId) + let that = this; this.$axios({ method: 'post', url: '/api/device/query/devices/' + itemData.deviceId + '/sync' @@ -212,14 +213,14 @@ type: 'error' }); }else{ - that.$message({ - showClose: true, - message: res.data.msg, - type: 'success' - }); + // that.$message({ + // showClose: true, + // message: res.data.msg, + // type: 'success' + // }); + this.$refs.syncChannelProgress.openDialog(itemData.deviceId) } that.initData() - this.syncDevices.splice(this.syncDevices.indexOf(itemData.deviceId, 1)); }).catch((e) => { console.error(e) that.$message({ @@ -227,9 +228,29 @@ message: e, type: 'error' }); - this.syncDevices.splice(this.syncDevices.indexOf(itemData.deviceId, 1)); }); + }, + + getTooltipContent: async function (deviceId){ + let result = ""; + await this.$axios({ + method: 'get', + async: false, + url:`/api/device/query/${deviceId}/sync_status/`, + }).then((res) => { + if (res.data.code == 0) { + if (res.data.data.errorMsg !== null) { + result = res.data.data.errorMsg + } else if (res.data.msg !== null) { + result = res.data.msg + } else { + result = `鍚屾涓�...[${res.data.data.current}/${res.data.data.total}]`; + } + } + }) + return result; + }, //閫氱煡璁惧涓婁紶濯掍綋娴� sendDevicePush: function(itemData) { // let deviceId = this.currentDevice.deviceId; -- Gitblit v1.8.0