diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg new file mode 100644 index 00000000..17e57887 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball_fault.svg b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball_fault.svg new file mode 100644 index 00000000..b575f454 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/deviceType/ball_fault.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + 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 d08b34ea..38a5c421 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 @@ -33,6 +33,9 @@ export const eventMap = { // 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 = [ // { @@ -74,6 +77,18 @@ export const eventMap = { 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; + } + }, } ); }, diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/map.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/map.js index 87c906d1..8f5879f8 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/map.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/map.js @@ -97,20 +97,30 @@ export async function setMarkerCluster(map, points, markerFun) { * @param {*} _markerClick marker 点击 * @returns */ -export async function setMarkToMap(item, data, _markerClick, content) { +export async function setMarkToMap( + item, + data, + _markerClick, + content, + { iconCallback } = {} +) { const { mapIns } = this.getMap(); if (!mapIns) return Message.error("地图加载失败!"); - const normal = require(`@screen/images/layer${item.id.replace( - /^\.|[^/]+(?=.svg$)/g, - (data) => (data === "." ? "" : `${data}`) - )}`); + const normal = + normal || + require(`@screen/images/layer${item.id.replace( + /^\.|[^/]+(?=.svg$)/g, + (data) => (data === "." ? "" : `${data}`) + )}`); - const fault = require(`@screen/images/layer${item.id.replace( - /^\.|[^/]+(?=.svg$)/g, - (data) => (data === "." ? "" : `${data}_fault`) - )}`); + const fault = + fault || + require(`@screen/images/layer${item.id.replace( + /^\.|[^/]+(?=.svg$)/g, + (data) => (data === "." ? "" : `${data}_fault`) + )}`); const faultBg = require(`@screen/images/mapBg/fault.svg`); const normalBg = require(`@screen/images/mapBg/normal.svg`); @@ -124,6 +134,10 @@ export async function setMarkToMap(item, data, _markerClick, content) { const markerCluster = await setMarkerCluster( mapIns, data.map((item) => { + const deviceIcon = + iconCallback === "function" && + iconCallback(item.deviceState == 1, item); + return { weight: 1, lnglat: [item.longitude, item.latitude], @@ -146,7 +160,9 @@ export async function setMarkToMap(item, data, _markerClick, content) { height: 18px; margin-left: 3px; margin-bottom: 6px; - " src='${item.deviceState == 1 ? normal : fault}'> + " src='${ + deviceIcon ? deviceIcon : item.deviceState == 1 ? normal : fault + }'> `, }; }),