diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js index f9c62ab3..0356eac5 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js @@ -1,4 +1,6 @@ import { getDeviceList } from "./httpList"; +import { delay } from "@screen/utils/common"; +import { Message } from "element-ui"; import { setMarkToMap } from "./map"; @@ -49,7 +51,20 @@ export const eventMap = { async "地图设备/map"(item) { const config = DeviceForMap[item.title]; - const data = await getDeviceList(config.deviceType).catch(() => {}); + const loadingMessage = Message.info({ + message: `${item.title}设备加载中...`, + duration: 0, + customClass: "loading-message", + iconClass: "el-icon-loading", + }); + + const data = await getDeviceList(config.deviceType) + .then(async (data) => { + await delay(600); + return data; + }) + .catch(() => {}) + .finally(() => loadingMessage.close()); if (!data) return; @@ -74,231 +89,4 @@ export const eventMap = { "地图设备/map_close"(item) { cacheRemoveFunc[`地图设备/${item.title}`]?.(); }, - - // async "路测设备/摄像机"(item) { - // // https://lbs.amap.com/demo/javascript-api-v2/example/mass-markers/labelmarker-mass - - // // { - // // camId: "57937", - // // camLat: "0", - // // camLong: "0", - // // camName: "G35 K055+565 (可控)", - // // camOrientation: "2", - // // camStatus: "0", - // // camType: "1", - // // deptId: "1751", - // // deptName: "G35济菏改扩建", - // // firmType: "2", - // // pileNum: "K055+565", - // // ptzCtrl: "0", - // // road: "G35", - // // status: "0", - // // }; - - // const ballFault = require("@screen/images/deviceType/ball_fault.svg"); - // const ball = require("@screen/images/deviceType/ball.svg"); - - // const data = await getDeviceList(1); - // // const data = [ - // // { - // // longitude: 116.268564, - // // latitude: 35.73115, - // // otherConfig: '{"ptzCtrl":0}', - // // }, - // // { - // // longitude: 116.258178, - // // latitude: 35.720996, - // // }, - // // { - // // longitude: 116.255542, - // // latitude: 35.717335, - // // }, - // // { - // // longitude: 116.252883, - // // latitude: 35.713114, - // // }, - // // { - // // longitude: 116.249416, - // // latitude: 35.707627, - // // }, - // // ]; - - // if (!data) return; - - // cacheRemoveFunc.DriveTestEquipment_Camera_Remove?.(); - - // cacheRemoveFunc.DriveTestEquipment_Camera_Remove = await setMarkToMap.call( - // this, - // item, - // data, - // (extData) => { - // try { - // this.dialogConfig = { - // // 0 有(球机) 1 ⽆(枪机) - // component: cameraCtrlMap[JSON.parse(extData.otherConfig)?.ptzCtrl], - // data: extData, - // }; - // } catch (error) {} - // }, - // null, - // { - // iconCallback(bool, item) { - // const type = JSON.parse(item.otherConfig)?.ptzCtrl; - - // switch (type) { - // case "0": - // case 0: - // return bool ? ball : ballFault; - // } - // }, - // } - // ); - // }, - // async "路测设备/摄像机_close"() { - // cacheRemoveFunc.DriveTestEquipment_Camera_Remove?.(); - // }, - // async "路测设备/行车诱导_close"() { - // cacheRemoveFunc.Driving_Guidance_Remove?.(); - // }, - // async "路测设备/行车诱导"(item) { - // const data = await getDeviceList(12); - - // // const data = [ - // // { - // // longitude: 116.268564, - // // latitude: 35.73115, - // // otherConfig: '{"ptzCtrl":0}', - // // }, - // // { - // // longitude: 116.258178, - // // latitude: 35.720996, - // // }, - // // { - // // longitude: 116.255542, - // // latitude: 35.717335, - // // }, - // // { - // // longitude: 116.252883, - // // latitude: 35.713114, - // // }, - // // { - // // longitude: 116.249416, - // // latitude: 35.707627, - // // }, - // // ]; - - // if (!data) return; - - // cacheRemoveFunc.Driving_Guidance_Remove?.(); - - // cacheRemoveFunc.Driving_Guidance_Remove = await setMarkToMap.call( - // this, - // item, - // data, - // (extData) => { - // this.dialogConfig = { - // component: "DrivingGuidance", - // data: extData, - // }; - // } - // ); - // }, - // async "路测设备/情报板_close"() { - // cacheRemoveFunc.Info_Board_Remove?.(); - // }, - // async "路测设备/情报板"(item) { - // const data = await getDeviceList(2); - - // // const data = [ - // // { - // // longitude: 116.268564, - // // latitude: 35.73115, - // // otherConfig: '{"ptzCtrl":0}', - // // }, - // // { - // // longitude: 116.258178, - // // latitude: 35.720996, - // // }, - // // { - // // longitude: 116.255542, - // // latitude: 35.717335, - // // }, - // // { - // // longitude: 116.252883, - // // latitude: 35.713114, - // // }, - // // { - // // longitude: 116.249416, - // // latitude: 35.707627, - // // }, - // // ]; - - // if (!data) return; - - // cacheRemoveFunc.Info_Board_Remove?.(); - - // cacheRemoveFunc.Info_Board_Remove = await setMarkToMap.call( - // this, - // item, - // data, - // (extData) => { - // this.dialogConfig = { - // component: "InfoBoard", - // data: extData, - // }; - // } - // ); - // }, - // async "路测设备/语音广播_close"() { - // // cacheRemoveFunc.Info_Board_Remove?.(); - // }, - // async "路测设备/语音广播"(item) { - // console.log( - // "%c [ item ]-194-「buttonEvent.js」", - // "font-size:15px; background:#31100b; color:#75544f;", - // item - // ); - // return; - // const data = await getDeviceList(2); - - // // const data = [ - // // { - // // longitude: 116.268564, - // // latitude: 35.73115, - // // otherConfig: '{"ptzCtrl":0}', - // // }, - // // { - // // longitude: 116.258178, - // // latitude: 35.720996, - // // }, - // // { - // // longitude: 116.255542, - // // latitude: 35.717335, - // // }, - // // { - // // longitude: 116.252883, - // // latitude: 35.713114, - // // }, - // // { - // // longitude: 116.249416, - // // latitude: 35.707627, - // // }, - // // ]; - - // if (!data) return; - - // // cacheRemoveFunc.Info_Board_Remove?.(); - - // // cacheRemoveFunc.Info_Board_Remove = await setMarkToMap.call( - // // this, - // // item, - // // data, - // // (extData) => { - // // this.dialogConfig = { - // // component: "InfoBoard", - // // data: extData, - // // }; - // // } - // // ); - // }, }; diff --git a/ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss b/ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss index c2eb91b6..caf6123d 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss +++ b/ruoyi-ui/src/views/JiHeExpressway/scss/el-reset.scss @@ -1,3 +1,10 @@ +.loading-message { + background-color: #265a70; + border: 0; + > i { + margin-right: 9px; + } +} div.el-popper { background: linear-gradient(180deg, #005c79 0%, #009bcc 100%); color: #fff;