ylj/aiMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
cclu 2025-01-17 18:27:11 +08:00
parent 75dd0a758e
commit 0e7f73f254
11 changed files with 19619 additions and 8675 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
aiMap.zip
View File

Binary file not shown.

2
index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>地图测试</title> <title>AI全景图</title>
<base href="/"> <!-- 确保这里匹配你的部署路径 --> <base href="/"> <!-- 确保这里匹配你的部署路径 -->
</head> </head>
<body> <body>

1
src/components/map/component/BusyRanking.less
View File

@ -20,6 +20,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 2px 0;
.left{ .left{
display: flex; display: flex;
align-items: center; align-items: center;

3
src/components/map/component/BusyRanking.vue
View File

@ -72,7 +72,8 @@ const emit = defineEmits<{
:key="index" :key="index"
> >
<div class="left"> <div class="left">
<div class="indexBox">{{ index + 1 }}</div> <!-- <div class="indexBox"></div> -->
<div style="color: #fff">{{ index + 1 }}、</div>
<div class="name">{{ item.SERVERPART_NAME || "-" }}</div> <div class="name">{{ item.SERVERPART_NAME || "-" }}</div>
</div> </div>
<div <div

200
src/components/map/component/RobotDialogueBox.vue
View File

@ -744,7 +744,7 @@ const handleAnalyzeConfig = async (configDetail: any, answer: any) => {
console.log("newRESPONSE_CONFIG", newRESPONSE_CONFIG); console.log("newRESPONSE_CONFIG", newRESPONSE_CONFIG);
let newResult: any; let newResult: any;
// 判断responseType 格式是否为 text 一般都为json // 判断responseType 格式是否为 text 一般都为json function时 说明调用这个组件的某个方法
if (OUTPUT_FORMAT.responseType === "text") { if (OUTPUT_FORMAT.responseType === "text") {
newResult = newRESPONSE_CONFIG newResult = newRESPONSE_CONFIG
.replace(/"/g, "'") .replace(/"/g, "'")
@ -787,6 +787,13 @@ const handleAnalyzeConfig = async (configDetail: any, answer: any) => {
// } // }
// } // }
// ); // );
} else if (OUTPUT_FORMAT.responseType === "function") {
await handleGetConfigFun(
OUTPUT_FORMAT.responseFunName,
req.ServerpartId,
result
);
return null;
} else { } else {
if (OUTPUT_FORMAT.responseFormat === "object") { if (OUTPUT_FORMAT.responseFormat === "object") {
newResult = result; newResult = result;
@ -1115,7 +1122,7 @@ const handleInspectionDialogueBox = async (detail: any, otherObj?: any) => {
dialogueList[dialogueList.length - 1].isOver = true; dialogueList[dialogueList.length - 1].isOver = true;
}; };
// 配置对话框表格的样式 // 配置对话框表格的样式 或 文字样式
const handleConfigItemTable = async ( const handleConfigItemTable = async (
tableData: any, tableData: any,
configObj: any, configObj: any,
@ -1406,7 +1413,7 @@ const handleAnswerQuestions = async () => {
const tableData = await handleAnalyzeConfig(configDetail, data); const tableData = await handleAnalyzeConfig(configDetail, data);
console.log("tableData2", tableData); console.log("tableData2", tableData);
returnData = tableData; returnData = tableData;
// 如果拿到值了 就去配这个对话框显示表格的样式 // 如果拿到值了 就去配这个对话框显示表格的样式 或文字样式
if (tableData) { if (tableData) {
await handleConfigItemTable(tableData, configDetail, data); await handleConfigItemTable(tableData, configDetail, data);
} }
@ -1417,45 +1424,52 @@ const handleAnswerQuestions = async () => {
} }
} }
} else { } else {
// 直接搜基础信息 因为没有服务区的输出 即使有配置id也不会去请求 这里判断一下 如果有配置id 还是按照配置id去调用 // 因为现在不止 基础信息 是 没有服务区 但是有配置id的情况 所以要加一下判断
if (data?.AnalysisRuleId) { if (data?.AnalysisRuleId) {
// 文字通过打字机效果实现 // 直接搜基础信息 因为没有服务区的输出 即使有配置id也不会去请求 这里判断一下 如果有配置id 还是按照配置id去调用
const allBoxes = document.querySelectorAll(".dialogueTextBox-text"); if (req.Sentence.indexOf("基础信息") !== -1) {
const lastBox: any = allBoxes[allBoxes.length - 1]; // 文字通过打字机效果实现
if (lastBox) { const allBoxes = document.querySelectorAll(".dialogueTextBox-text");
const lastContent = `<span class="style4">为您查找相关数据</span>`; const lastBox: any = allBoxes[allBoxes.length - 1];
isPrinting.value = true; if (lastBox) {
await handlePrintWord(lastBox, lastContent); const lastContent = `<span class="style4">为您查找相关数据</span>`;
} isPrinting.value = true;
// 去拿到这个id的配置明细 await handlePrintWord(lastBox, lastContent);
// 添加判断 可能会有多个id 单个id的时候 直接调用详情接口拿到数据 多个id去请求列表接口 拿到优先级高的 直接给configDetail赋值
let configDetail: any;
const configList: any = await handleGetANALYSISRULEList({
searchParameter: {
ANALYSISRULE_IDS: data?.AnalysisRuleId,
current: 1,
pageSize: 10,
},
sortstr: "RULE_PRIORITY asc",
PageIndex: 1,
pagesize: 999999,
});
console.log("configList", configList);
// 请求列表的时候 已经根据优先级排序 第一个就是优先级最高的 直接取值就可以
if (configList && configList.length > 0) {
configDetail = configList[0];
}
console.log("configDetail3232", configDetail);
// 如果拿到值就根据配置去调用接口 拿到数据 输出数据
if (configDetail) {
const tableData = await handleAnalyzeConfig(configDetail, data);
console.log("tableData3", tableData);
// 如果拿到值了 就去配这个对话框显示 表格或者打字机样式
if (tableData) {
await handleConfigItemTable(tableData, configDetail, data);
} }
// 去拿到这个id的配置明细
// 添加判断 可能会有多个id 单个id的时候 直接调用详情接口拿到数据 多个id去请求列表接口 拿到优先级高的 直接给configDetail赋值
let configDetail: any;
const configList: any = await handleGetANALYSISRULEList({
searchParameter: {
ANALYSISRULE_IDS: data?.AnalysisRuleId,
current: 1,
pageSize: 10,
},
sortstr: "RULE_PRIORITY asc",
PageIndex: 1,
pagesize: 999999,
});
console.log("configList", configList);
// 请求列表的时候 已经根据优先级排序 第一个就是优先级最高的 直接取值就可以
if (configList && configList.length > 0) {
configDetail = configList[0];
}
console.log("configDetail3232", configDetail);
// 如果拿到值就根据配置去调用接口 拿到数据 输出数据
if (configDetail) {
const tableData = await handleAnalyzeConfig(configDetail, data);
console.log("tableData3", tableData);
// 如果拿到值了 就去配这个对话框显示 表格或者打字机样式
if (tableData) {
await handleConfigItemTable(tableData, configDetail, data);
}
}
} else if (req.Sentence.indexOf("预警类型") !== -1) {
emit("handleChangeRightFilterInDialogue", "6");
handleSetWarningData(true);
} }
} else { } else {
console.log("noRuleId");
handleLastUpdate("小驿还无法理解，请换个说法，我会不停努力学习的！"); handleLastUpdate("小驿还无法理解，请换个说法，我会不停努力学习的！");
searchRes = "查询失败"; searchRes = "查询失败";
} }
@ -1862,6 +1876,7 @@ const emit = defineEmits<{
(e: "handleAreaInspection", index: number): void; // 全部服务区圆点置灰 (e: "handleAreaInspection", index: number): void; // 全部服务区圆点置灰
(e: "handleHiddenSuspended"): void; // 隐藏掉悬浮框 (e: "handleHiddenSuspended"): void; // 隐藏掉悬浮框
(e: "handleShowAi", value: boolean): void; // 将ai对话是否显示 跟主页说 (e: "handleShowAi", value: boolean): void; // 将ai对话是否显示 跟主页说
(e: "handleChangeRightFilterInDialogue", id: any): void; // 屏蔽右边的选择项改变的watch
}>(); }>();
// 监听当前选择的服务区 // 监听当前选择的服务区
@ -1952,12 +1967,15 @@ const handleGetBusinessTrade = async () => {
}; };
// 预警类型的方法 // 预警类型的方法
const handleSetWarningData = async () => { const handleSetWarningData = async (noAdd?: boolean) => {
showDialogBox.value = true; showDialogBox.value = true;
emit("handleShowAi", true); emit("handleShowAi", true);
handleAddDialogList( if (noAdd) {
`${props.currentServerPartDetail?.SERVERPART_NAME || ""}预警类型` } else {
); handleAddDialogList(
`${props.currentServerPartDetail?.SERVERPART_NAME || ""}预警类型`
);
}
setTimeout(() => { setTimeout(() => {
nextTick(() => { nextTick(() => {
dialogueList[dialogueList.length - 1].isOver = true; dialogueList[dialogueList.length - 1].isOver = true;
@ -2079,6 +2097,104 @@ const handleSelectWarning = async (value: number) => {
emit("handleWarningMap", warningData); emit("handleWarningMap", warningData);
}; };
// 配置中调用预警的输出 id 为服务区id warningData为配置请求出来的结果
const handleWarningConfig = async (id: any, warningData: any) => {
emit("handleChangeRightFilterInDialogue", "6");
let result: string = "";
let SERVERPART_NAME: string = "";
if (id) {
if (warningData && warningData.length > 0) {
let obj: any = {};
let str: string = "";
let objShopName: any = {};
warningData.forEach((item: any) => {
if (item.SERVERPART_NAME) {
SERVERPART_NAME = item.SERVERPART_NAME;
}
if (obj[item.WARNING_TYPE] && obj[item.WARNING_TYPE].length > 0) {
let old: any = obj[item.WARNING_TYPE];
old.push(item);
obj[item.WARNING_TYPE] = old;
} else {
let res: any = [];
res.push(item);
obj[item.WARNING_TYPE] = res;
}
if (
objShopName[item.WARNING_TYPE] &&
objShopName[item.WARNING_TYPE].length > 0
) {
let old: any = objShopName[item.WARNING_TYPE];
old += `，${item.SERVERPARTSHOP_NAME}`;
objShopName[item.WARNING_TYPE] = old;
} else {
let old: any = objShopName[item.WARNING_TYPE];
old = `${item.SERVERPARTSHOP_NAME}`;
objShopName[item.WARNING_TYPE] = old;
}
});
console.log("obj", obj);
console.log("objShopName", objShopName);
if (obj) {
for (let key in obj) {
let itemStr: string = `
${descObjRef.value[key]}：${objShopName[key]},共${obj[key].length}条;`;
str += itemStr;
}
}
result = `${SERVERPART_NAME || "-"}预警类型，存在：${str}
的情况，您可以鼠标移动到具体服务区查看情况。`;
} else {
result = `${SERVERPART_NAME || "-"}暂无预警数据`;
}
}
console.log("result", result);
if (result) {
isNewDialogLoading.value = false;
let obj: any = JSON.parse(
JSON.stringify(dialogueList[dialogueList.length - 1])
);
dialogueList[dialogueList.length - 1] = {
...obj,
isVHtml: true,
VHtml: result || "",
};
await nextTick();
const allBoxes = document.querySelectorAll(".dialogueTextBox-text");
const lastBox: any = allBoxes[allBoxes.length - 1];
if (lastBox) {
const lastContent = result || "";
isPrinting.value = true;
await handlePrintWord(lastBox, lastContent);
let obj: any = JSON.parse(
JSON.stringify(dialogueList[dialogueList.length - 1])
);
dialogueList[dialogueList.length - 1] = {
...obj,
isOver: true,
};
}
}
emit("handleEnterySearch");
emit("handleWarningMap", warningData);
};
// 直接根据配置的方法名称直接调用那个方法 type 调用的是哪个方法 id 服务区id 可以为空 warningData 请求出来的数据
const handleGetConfigFun = async (type: string, id: any, warningData: any) => {
// 配置直接调用的方法列表
let configFunObj: any = {
handleWarningConfig: (id: any, warningData: any) =>
handleWarningConfig(id, warningData),
};
if (type && configFunObj[type]) {
await configFunObj[type](id, warningData);
}
};
// 服务区巡检 // 服务区巡检
const servicepartInspection = (index?: number, inInput?: boolean) => { const servicepartInspection = (index?: number, inInput?: boolean) => {
searchText.value = ""; searchText.value = "";

27685
src/components/map/component/detailText.js
View File

File diff suppressed because it is too large Load Diff

0
src/components/map/component/map.js Normal file
View File

28
src/components/map/component/rightDetail.vue
View File

@ -142,6 +142,8 @@ const handleGetBusinessProjectList = async () => {
}); });
} }
console.log("scrollIdStr.value", scrollIdStr.value);
// 由于tab选项卡也是写死的 吧每一项的length 补充在选项卡的名称后面 // 由于tab选项卡也是写死的 吧每一项的length 补充在选项卡的名称后面
tabs.forEach((item: any) => { tabs.forEach((item: any) => {
if (item.key === 0) { if (item.key === 0) {
@ -158,16 +160,25 @@ const handleGetBusinessProjectList = async () => {
const list = [inCampList, suspend, closeList, historyList]; const list = [inCampList, suspend, closeList, historyList];
console.log("list", list); console.log("list", list);
allProjectList = list; allProjectList.splice(
onlineProjectList = list[defaultTab]; 0,
allProjectList.length,
...[inCampList, suspend, closeList, historyList]
);
onlineProjectList.splice(
0,
onlineProjectList.length,
...[inCampList, suspend, closeList, historyList][defaultTab]
);
console.log("defaultTab", defaultTab); console.log("defaultTab", defaultTab);
nextTick(() => { nextTick(() => {
selectProjectState.value = defaultTab; selectProjectState.value = defaultTab;
console.log("onlineProjectList3232", onlineProjectList); console.log("onlineProjectList3232", onlineProjectList);
const element: any = document.getElementById(scrollIdStr.value!.toString()); const element: any = document.getElementById(scrollIdStr.value!.toString());
element.scrollIntoView({ behavior: "smooth", block: "start" }); if (element) {
element.scrollIntoView({ behavior: "smooth", block: "start" });
}
}); });
}; };
@ -588,10 +599,19 @@ watch(
console.log("newVal", newVal); console.log("newVal", newVal);
console.log("oldVal", oldVal); console.log("oldVal", oldVal);
if (newVal && newVal.SERVERPART_ID) { if (newVal && newVal.SERVERPART_ID) {
selectTab.value = 0
onlineProjectList = [];
tabs = [
{ label: "在营", value: 0, key: 0 },
{ label: "暂停", value: 0, key: 1 },
{ label: "关闭", value: 0, key: 2 },
{ label: "历史", value: 0, key: 3 },
];
handleGetBusinessProjectList(); handleGetBusinessProjectList();
handleServiceDetail(newVal.SERVERPART_ID); handleServiceDetail(newVal.SERVERPART_ID);
} else { } else {
nextTick(() => { nextTick(() => {
selectTab.value = 0
onlineProjectList = []; onlineProjectList = [];
tabs = [ tabs = [
{ label: "在营", value: 0, key: 0 }, { label: "在营", value: 0, key: 0 },

20
src/components/map/component/rightSearchBox.vue
View File

@ -61,6 +61,9 @@ let selectBusinessTradeList = reactive<any>([]);
let selectBusinessTradeIdsObj = ref<any>(); let selectBusinessTradeIdsObj = ref<any>();
// 省份信息 // 省份信息
const baseInfoObj = ref<any>(); const baseInfoObj = ref<any>();
// 是否屏蔽掉watch
let isNoWatch: boolean = false;
let saveData = localStorage.getItem("baseInfoObj"); let saveData = localStorage.getItem("baseInfoObj");
if (saveData) { if (saveData) {
baseInfoObj.value = JSON.parse(saveData); baseInfoObj.value = JSON.parse(saveData);
@ -209,13 +212,24 @@ const handleGetBUSINESS_TRADE = async () => {
}); });
}; };
// 根据传入的值 改变选中的内容 且不会被watch监听到
const handleChangeFilterNoWatch = (id?: string) => {
console.log("handleChangeFilterNoWatch", id);
isNoWatch = true;
selectFilterList.value = id;
nextTick(() => {
isNoWatch = false;
});
};
onMounted(() => { onMounted(() => {
handleGetBUSINESS_TRADE(); handleGetBUSINESS_TRADE();
}); });
// 传入的方法 // 传入的方法
const emit = defineEmits<{ const emit = defineEmits<{
(e: "handleChangeMapShow", nowSelect: any): void; // 根据selectFilterList.value的选中 来对地图进行不同的操作 (e: "handleChangeMapShow", nowSelect: any, onlyChange: boolean): void; // 根据selectFilterList.value的选中 来对地图进行不同的操作
(e: "handleDeleteSelect"): void; // 清除选中的效果 (e: "handleDeleteSelect"): void; // 清除选中的效果
(e: "handleHiddenSuspended"): void; // 悬浮框的清除方法 (e: "handleHiddenSuspended"): void; // 悬浮框的清除方法
}>(); }>();
@ -228,8 +242,7 @@ const props = defineProps<{
watch( watch(
() => selectFilterList.value, () => selectFilterList.value,
(newVal, oldVal) => { (newVal, oldVal) => {
console.log("newVal", newVal); emit("handleChangeMapShow", newVal, isNoWatch);
emit("handleChangeMapShow", newVal);
}, },
{ deep: true } { deep: true }
); );
@ -239,6 +252,7 @@ defineExpose({
form: form, form: form,
selectBusinessTradeIdsObj: selectBusinessTradeIdsObj, selectBusinessTradeIdsObj: selectBusinessTradeIdsObj,
selectFilterList: selectFilterList, selectFilterList: selectFilterList,
handleChangeFilterNoWatch: handleChangeFilterNoWatch,
}); });
</script> </script>
<template> <template>

344
src/components/map/index.vue
View File

@ -17,6 +17,7 @@ import {
handleGetPeriodWarningList, handleGetPeriodWarningList,
handleGetProvinceVehicleTreeList, handleGetProvinceVehicleTreeList,
handleGetServerpartList, handleGetServerpartList,
handleGetTransactionDetailList,
} from "./service"; } from "./service";
import { handlegetServerConnec } from "../newService"; import { handlegetServerConnec } from "../newService";
import { ElLoading, ElMessage } from "element-plus"; import { ElLoading, ElMessage } from "element-plus";
@ -117,6 +118,12 @@ let isShowDetail = ref<boolean>(false);
let isShowRealData = ref<boolean>(false); let isShowRealData = ref<boolean>(false);
// 不同片区的标点颜色数组 // 不同片区的标点颜色数组
let SPREGIONTYPECOLORList = reactive<any>([]); let SPREGIONTYPECOLORList = reactive<any>([]);
// 实时经营数据的列表
let realRevenueList = reactive<any>([]);
// 当前到了第几批第五个
let nowFifthIndex = ref<number>(0);
// 地图的实时营收悬浮框
let mapTimer: any;
const route = useRoute(); const route = useRoute();
console.log("route", route); console.log("route", route);
@ -171,6 +178,8 @@ onMounted(async () => {
handleAllServiceMarkedPoint(); handleAllServiceMarkedPoint();
// 标出安徽省的边界 // 标出安徽省的边界
handleGetAnHuiBoundary(); handleGetAnHuiBoundary();
// 服务区实时数据
// handleGetRealServiceList();
hoverPoint.value = handlePointHover(); hoverPoint.value = handlePointHover();
@ -213,6 +222,7 @@ const handleGetAllService = async () => {
ShowWeather: true, // 显示天气 ShowWeather: true, // 显示天气
}; };
const data = await handleGetServerpartList(req); const data = await handleGetServerpartList(req);
let str: string = "";
console.log("data312312321321321", data); console.log("data312312321321321", data);
if (data && data.length > 0) { if (data && data.length > 0) {
let res: any = []; let res: any = [];
@ -246,10 +256,15 @@ const handleGetAllService = async () => {
allId.push(item.SERVERPART_ID.toString()); allId.push(item.SERVERPART_ID.toString());
} }
} }
if (str) {
str += `
${item.SERVERPART_NAME} ${item.SERVERPART_ID}`;
} else {
str = `${item.SERVERPART_NAME} ${item.SERVERPART_ID}`;
}
}); });
defaultServerPartList = res; defaultServerPartList = res;
allServerPartIdList = allId; allServerPartIdList = allId;
console.log("SPREGIONTYPECOLORLIST", SPREGIONTYPECOLORLIST);
SPREGIONTYPECOLORList = SPREGIONTYPECOLORLIST; SPREGIONTYPECOLORList = SPREGIONTYPECOLORLIST;
SPREGIONTYPECOLOR.value = SPREGIONTYPETYPEObj; SPREGIONTYPECOLOR.value = SPREGIONTYPETYPEObj;
@ -450,17 +465,19 @@ const handleAllServiceMarkedPoint = async () => {
scene.value.addLayer(pointLayer); scene.value.addLayer(pointLayer);
}; };
// 点击服务区圆点触发的时间 // 点击服务区圆点触发的事件
const handleClickPointLayer = async (detail: any) => { const handleClickPointLayer = async (detail: any) => {
// 给当前选中的服务区存储值 // 给当前选中的服务区存储值
currentServerPartDetail.value = detail; currentServerPartDetail.value = detail;
// 地图上出现选中服务区的效果 // 地图上出现选中服务区的效果
handleAddSelect(detail); handleAddSelect(detail);
// 先清空现有的全部图层 // 先清空现有的全部图层
handleDeleteNoDefault(""); handleDeleteNoDefault(RightSearchBoxRef.value.selectFilterList);
// 查看右边选中了哪些 调用在新的上面 // 查看右边选中了哪些 调用在新的上面
let nowSelect: string = RightSearchBoxRef.value.selectFilterList; let nowSelect: string = RightSearchBoxRef.value.selectFilterList;
await handleChangeMapShow(nowSelect); console.log("nowSelect", nowSelect);
await handleChangeMapShow(nowSelect, false);
// 右侧的详情抽屉 // 右侧的详情抽屉
showRightDetail.value = true; showRightDetail.value = true;
// 用户判断实时数据的右侧详情是否显示的判断 // 用户判断实时数据的右侧详情是否显示的判断
@ -546,7 +563,7 @@ const handleChangeToDefault = () => {
current.render(); current.render();
}; };
// 鼠标移入点触发的时间 // 鼠标移入点触发的事件
const handlePointHover = () => { const handlePointHover = () => {
const el = document.createElement("div"); const el = document.createElement("div");
el.style.background = "#000"; el.style.background = "#000";
@ -725,6 +742,7 @@ const handleSetCarData = async (
let selectObj: any = {}; let selectObj: any = {};
let selectRoad: any = {}; let selectRoad: any = {};
// 从服务区的道路名称的那个数组里面 取到现在的这个服务区数据
if (roadTestList && roadTestList.length > 0) { if (roadTestList && roadTestList.length > 0) {
roadTestList.forEach((item: any) => { roadTestList.forEach((item: any) => {
if (item.SERVERPART_ID.toString() === id) { if (item.SERVERPART_ID.toString() === id) {
@ -732,28 +750,45 @@ const handleSetCarData = async (
} }
}); });
} }
let roadReq: any = {}; let data: any = {};
let heightWay: any = [ let roadItem: any = {};
366, 803, 381, 756, 708, 646, 805, 710, 476, 694, 714, 490, 658, 819, 659, let roadReq: any = {
811, 716, 499, 941, 652, 943, 513, 510, 600, 707, 592, 706, RoadName: selectObj.EXPRESSWAY_NAME || "",
]; CityName: selectObj.SERVERPART_ADDRESS || "",
};
if (heightWay.indexOf(Number(selectObj.SERVERPART_ID)) === -1) { data = await handleGetBaiDuTrafficInfo(roadReq);
roadReq = { let roadRes: any = JSON.parse(data);
if (roadRes.status == 2) {
let roadReq: any = {
RoadName: selectObj.SERVERPART_NAME || "", RoadName: selectObj.SERVERPART_NAME || "",
CityName: selectObj.SERVERPART_ADDRESS || "", CityName: selectObj.SERVERPART_ADDRESS || "",
}; };
data = await handleGetBaiDuTrafficInfo(roadReq);
roadItem = JSON.parse(data);
} else { } else {
roadReq = { roadItem = roadRes;
RoadName: selectObj.EXPRESSWAY_NAME || "",
CityName: selectObj.SERVERPART_ADDRESS || "",
};
} }
console.log("selectObj", selectObj);
const data = await handleGetBaiDuTrafficInfo(roadReq); // let roadReq: any = {};
let roadItem: any = JSON.parse(data); // let heightWay: any = [
console.log("roadItem", roadItem); // 366, 803, 381, 756, 708, 646, 805, 710, 476, 694, 714, 490, 658, 819, 659,
// 811, 716, 499, 941, 652, 943, 513, 510, 600, 707, 592, 706,
// ];
// if (heightWay.indexOf(Number(selectObj.SERVERPART_ID)) === -1) {
// roadReq = {
// RoadName: selectObj.SERVERPART_NAME || "",
// CityName: selectObj.SERVERPART_ADDRESS || "",
// };
// } else {
// roadReq = {
// RoadName: selectObj.EXPRESSWAY_NAME || "",
// CityName: selectObj.SERVERPART_ADDRESS || "",
// };
// }
// const data = await handleGetBaiDuTrafficInfo(roadReq);
// let roadItem: any = JSON.parse(data);
if (featuresList && featuresList.length > 0) { if (featuresList && featuresList.length > 0) {
featuresList.forEach((item: any) => { featuresList.forEach((item: any) => {
if (item.properties.SERVERPART_ID.toString() === id) { if (item.properties.SERVERPART_ID.toString() === id) {
@ -800,7 +835,10 @@ const handleSetCarData = async (
// 拿到实况车流数据 // 拿到实况车流数据
const hanleGetRealTrafficData = async (id: any) => { const hanleGetRealTrafficData = async (id: any) => {
let roadList: any = JSON.parse(JSON.stringify(detailText.lineData)); let roadList: any = JSON.parse(JSON.stringify(detailText.lineData));
roadList = roadList[baseInfoObj.value.ProvinceCode.toString()];
let roadTestList: any = JSON.parse(JSON.stringify(detailText.roadTest)); let roadTestList: any = JSON.parse(JSON.stringify(detailText.roadTest));
roadTestList = roadTestList[baseInfoObj.value.ProvinceCode.toString()];
let onceRoadList: any = { let onceRoadList: any = {
type: "FeatureCollection", type: "FeatureCollection",
features: [], features: [],
@ -809,6 +847,7 @@ const hanleGetRealTrafficData = async (id: any) => {
let list: any = []; let list: any = [];
for (let i = 0; i < id.length; i++) { for (let i = 0; i < id.length; i++) {
// 如果现在选择的右边查询内容 没有实时车况的选中 那就不显示
if (nowSelectId.value.indexOf("2") === -1) { if (nowSelectId.value.indexOf("2") === -1) {
return; return;
} }
@ -817,6 +856,9 @@ const hanleGetRealTrafficData = async (id: any) => {
roadTestList, roadTestList,
featuresList featuresList
); );
// if (i > 0) {
// return;
// }
list.push(selectRoad); list.push(selectRoad);
onceRoadList.features = list; onceRoadList.features = list;
@ -825,11 +867,9 @@ const hanleGetRealTrafficData = async (id: any) => {
let haveList: any = allLayers.filter( let haveList: any = allLayers.filter(
(item: any) => item.name === "lineLayerOnce" (item: any) => item.name === "lineLayerOnce"
); );
console.log("haveList", haveList);
if (haveList && haveList.length > 0) { if (haveList && haveList.length > 0) {
let obj: any = haveList[0]; let obj: any = haveList[0];
console.log("obj", obj);
nextTick(() => { nextTick(() => {
scene.value.removeLayer(obj); scene.value.removeLayer(obj);
const lineLayer = new LineLayer({ const lineLayer = new LineLayer({
@ -889,14 +929,19 @@ const hanleGetRealTrafficData = async (id: any) => {
// 实况车流 // 实况车流
const handleGetRealTraffic = async () => { const handleGetRealTraffic = async () => {
let roadList: any = JSON.parse(JSON.stringify(detailText.lineData)); let roadList: any = JSON.parse(JSON.stringify(detailText.lineData));
roadList = roadList[baseInfoObj.value.ProvinceCode.toString()];
let roadTestList: any = JSON.parse(JSON.stringify(detailText.roadTest)); let roadTestList: any = JSON.parse(JSON.stringify(detailText.roadTest));
roadTestList = roadTestList[baseInfoObj.value.ProvinceCode.toString()];
console.log("roadList", roadList);
console.log("roadTestList", roadTestList);
// 单个服务区查询的车流实况的最后结果 可以直接传入图层当数据 // 单个服务区查询的车流实况的最后结果 可以直接传入图层当数据
let onceRoadList: any = { let onceRoadList: any = {
type: "FeatureCollection", type: "FeatureCollection",
features: [], features: [],
}; };
let featuresList: any = roadList.features; let featuresList: any = roadList.features;
console.log("roadList", roadList);
console.log("featuresList", featuresList); console.log("featuresList", featuresList);
console.log("currentServerPartDetail.value", currentServerPartDetail.value); console.log("currentServerPartDetail.value", currentServerPartDetail.value);
// 选中 // 选中
@ -950,6 +995,7 @@ const handleDeleteNoDefault = (nowSelect: string) => {
} }
if (nowSelect.indexOf("8") === -1) { if (nowSelect.indexOf("8") === -1) {
isShowRealData.value = false; isShowRealData.value = false;
clearInterval(mapTimer);
} }
} else { } else {
console.log("22222", defaultServerPartList); console.log("22222", defaultServerPartList);
@ -968,6 +1014,7 @@ const handleDeleteNoDefault = (nowSelect: string) => {
return colorList1[value]; return colorList1[value];
}); });
current.render(); current.render();
clearInterval(mapTimer);
} }
}; };
@ -1390,13 +1437,34 @@ const handleWarningMap = async (warningData: any) => {
if (obj[item.SERVERPART_ID] && obj[item.SERVERPART_ID].length > 0) { if (obj[item.SERVERPART_ID] && obj[item.SERVERPART_ID].length > 0) {
let str: string = ""; let str: string = "";
const tradeList: any = obj[item.SERVERPART_ID]; const tradeList: any = obj[item.SERVERPART_ID];
tradeList.forEach((key: any) => { // tradeList 是一个服务区的全部预警数据 可能存在多个类型 文字输出时需要根据类型输出 所以要分类
if (str) { let resList: any = [];
str += `、${key.SERVERPARTSHOP_NAME}; `; let typeList: any = [];
} else { tradeList.forEach((item: any) => {
str = `${waringObj[key.WARNING_TYPE]}：${key.SERVERPARTSHOP_NAME} `; if (typeList.indexOf(item.WARNING_TYPE) === -1) {
typeList.push(item.WARNING_TYPE);
} }
}); });
typeList.forEach((item: any) => {
let itemStr: string = "";
tradeList.forEach((subItem: any) => {
if (subItem.WARNING_TYPE === item) {
if (itemStr) {
itemStr += `、${subItem.SERVERPARTSHOP_NAME}`;
} else {
itemStr = `${waringObj[subItem.WARNING_TYPE]}：${
subItem.SERVERPARTSHOP_NAME
} `;
}
}
});
if (str) {
str += itemStr + ";";
} else {
str = itemStr + ";";
}
});
if ( if (
shopIdObj[item.SERVERPART_ID] && shopIdObj[item.SERVERPART_ID] &&
shopIdObj[item.SERVERPART_ID].length > 0 shopIdObj[item.SERVERPART_ID].length > 0
@ -1409,18 +1477,42 @@ const handleWarningMap = async (warningData: any) => {
handleUpdateMapPoint(); handleUpdateMapPoint();
}); });
console.log("obj33222", obj);
console.log("defaultServerPartList333444", defaultServerPartList);
defaultServerPartList.forEach((item: any) => { defaultServerPartList.forEach((item: any) => {
if (obj[item.SERVERPART_ID] && obj[item.SERVERPART_ID].length > 0) { if (obj[item.SERVERPART_ID] && obj[item.SERVERPART_ID].length > 0) {
const newObj: any = JSON.parse(JSON.stringify(item)); const newObj: any = JSON.parse(JSON.stringify(item));
let str: string = ""; let str: string = "";
const tradeList: any = obj[item.SERVERPART_ID]; const tradeList: any = obj[item.SERVERPART_ID];
tradeList.forEach((key: any) => { // tradeList 是一个服务区的全部预警数据 可能存在多个类型 文字输出时需要根据类型输出 所以要分类
if (str) { let resList: any = [];
str += `、${key.SERVERPARTSHOP_NAME}; `; let typeList: any = [];
} else { tradeList.forEach((item: any) => {
str = `${waringObj[key.WARNING_TYPE]}：${key.SERVERPARTSHOP_NAME} `; if (typeList.indexOf(item.WARNING_TYPE) === -1) {
typeList.push(item.WARNING_TYPE);
} }
}); });
typeList.forEach((item: any) => {
let itemStr: string = "";
tradeList.forEach((subItem: any) => {
if (subItem.WARNING_TYPE === item) {
if (itemStr) {
itemStr += `、${subItem.SERVERPARTSHOP_NAME}; `;
} else {
itemStr = `${waringObj[subItem.WARNING_TYPE]}：${
subItem.SERVERPARTSHOP_NAME
} `;
}
}
});
if (str) {
str += itemStr;
} else {
str = itemStr;
}
});
if ( if (
shopIdObj[item.SERVERPART_ID] && shopIdObj[item.SERVERPART_ID] &&
shopIdObj[item.SERVERPART_ID].length > 0 shopIdObj[item.SERVERPART_ID].length > 0
@ -1452,12 +1544,16 @@ const handleWarningMap = async (warningData: any) => {
scene.value.addLayer(warningLayer); scene.value.addLayer(warningLayer);
}; };
// 根据右侧的选择列表 来对地图进行操作 // 根据右侧的选择列表 来对地图进行操作 onlyChange 如果true的话 只改变值 不调用方法
const handleChangeMapShow = async (nowSelect: string) => { const handleChangeMapShow = async (nowSelect: string, onlyChange: boolean) => {
// 清空没有值的图层 // 清空没有值的图层
handleDeleteNoDefault(nowSelect); handleDeleteNoDefault(nowSelect);
console.log("nowSelect", nowSelect); console.log("nowSelect", nowSelect);
nowSelectId.value = nowSelect; nowSelectId.value = nowSelect;
if (onlyChange) {
return;
}
// 有值 根据值来判断显示的内容 // 有值 根据值来判断显示的内容
if (nowSelect) { if (nowSelect) {
if (nowSelect.indexOf("1") !== -1) { if (nowSelect.indexOf("1") !== -1) {
@ -1522,6 +1618,8 @@ const handleChangeMapShow = async (nowSelect: string) => {
nextTick(async () => { nextTick(async () => {
// 服务区繁忙 // 服务区繁忙
handleServiceBusy(); handleServiceBusy();
// 服务区实时营收数据
handleGetRealServiceList();
}); });
} }
} }
@ -1581,9 +1679,24 @@ const handleServiceBusy = async () => {
// 服务区巡检的实际方法 // 服务区巡检的实际方法
const handleAreaInspection = async (i: number) => { const handleAreaInspection = async (i: number) => {
if (i < defaultServerPartList.length) { let list = [];
if (defaultServerPartList && defaultServerPartList.length > 0) {
let firstObj: any = {};
let otherList: any = [];
defaultServerPartList.forEach((item: any) => {
if (item.SERVERPART_ID === 416) {
firstObj = item;
} else {
otherList.push(item);
}
});
list = otherList;
list.unshift(firstObj);
}
if (i < list.length) {
// i 为当前执行到第几项的索引 // i 为当前执行到第几项的索引
currentServerPartDetail.value = defaultServerPartList[i]; currentServerPartDetail.value = list[i];
// 先给上一次的图层 添加清除 // 先给上一次的图层 添加清除
handleDeleteNoDefault(""); handleDeleteNoDefault("");
// 每次巡检前 把 悬浮框先给隐藏起来 // 每次巡检前 把 悬浮框先给隐藏起来
@ -1592,7 +1705,7 @@ const handleAreaInspection = async (i: number) => {
handleAddSelect(currentServerPartDetail.value); handleAddSelect(currentServerPartDetail.value);
console.log(i, currentServerPartDetail.value); console.log(i, currentServerPartDetail.value);
// 图层样式添加 // 图层样式添加
await handleChangeMapShow("1,2,4"); await handleChangeMapShow("1,2,4", false);
// 拿到 经营数据 在营商家 // 拿到 经营数据 在营商家
let answerData: any = let answerData: any =
await RobotDialogueBoxRef.value.handleInspectionQuestions( await RobotDialogueBoxRef.value.handleInspectionQuestions(
@ -1675,6 +1788,158 @@ const handleShowAi = (value: boolean) => {
const handleShowDetail = (value: boolean) => { const handleShowDetail = (value: boolean) => {
isShowDetail.value = value; isShowDetail.value = value;
}; };
// 判断是不是对话框 新增了右侧的查询项
const handleChangeRightFilterInDialogue = (id?: string) => {
RightSearchBoxRef.value.handleChangeFilterNoWatch(id);
};
// 请求服务区的实时数据 每个服务区上面加个div显示的那种
const handleGetRealServiceList = async () => {
const req: any = {
ProvinceCode: baseInfoObj.value.ProvinceCode,
};
const data = await handleGetTransactionDetailList(req);
console.log("handleGetRealServiceList", data);
realRevenueList = data;
let list: any = handleShowRevenuePoint(data);
console.log("listdadasd", list);
let bigIndex: number = list.length;
// 根据顺序 显示每组五个的锚点div 每10秒更新一次
// 定时器 ID，用于清除定时器
console.log("bigIndex", bigIndex);
handleShowMapPoint(list[nowFifthIndex.value]);
nowFifthIndex.value++;
mapTimer = setInterval(() => {
if (bigIndex <= nowFifthIndex.value) {
nowFifthIndex.value = 0;
}
scene.value.removeAllMarkers();
handleShowMapPoint(list[nowFifthIndex.value]);
nowFifthIndex.value++;
}, 10000);
};
// 根据顺序 显示每组五个的锚点div 每10秒更新一次
const handleShowMapPoint = async (list: any) => {
console.log("list", list);
console.log("defaultServerPartList", defaultServerPartList);
let detailObj: any = {};
if (list && list.length > 0) {
list.forEach((item: any) => {
detailObj[item.Serverpart_ID] = item;
});
}
console.log("detailObj", detailObj);
defaultServerPartList.forEach((item: any) => {
if (detailObj[item.SERVERPART_ID]) {
let obj = detailObj[item.SERVERPART_ID];
item.realRevenueDetail = obj;
const el = document.createElement("div");
el.style.maxWidth = "20rem";
el.style.boxSizing = "border-box";
el.style.padding = "6px";
el.style.background = "rgba(56, 56, 56, 0.8)";
el.style.borderRadius = "8px";
el.style.color = "#fff";
el.style.fontSize = "1rem";
// 根据列表数据 写innerHTML的字符串
let listStr: string = "";
if (obj.TimeList && obj.TimeList.length > 0) {
if (obj.TimeList && obj.TimeList.length > 1) {
obj.TimeList = obj.TimeList.slice(0, 1);
}
obj.TimeList.forEach((subItem: any) => {
let smallStr: string = "";
if (subItem.sellList && subItem.sellList.length > 0) {
subItem.sellList.forEach((thirdItem: any) => {
if (smallStr) {
smallStr += `,${thirdItem.CommodityName}：${thirdItem.SellCount}件`;
} else {
smallStr = `${thirdItem.CommodityName}：${thirdItem.SellCount}件`;
}
});
}
let shop: string = `<div style="white-space: wrap;">${subItem.ServerpartShop_Name}：${smallStr}</div>`;
listStr += shop;
});
}
el.innerHTML = `<div style="white-space: wrap;">${obj.Serverpart_Name}</div><div style="white-space: wrap;">实时交易金额：${obj.CurRevenueAmount}元</div>${listStr}`;
const marker = new Marker({ element: el }).setLnglat([
item.SERVERPART_X,
item.SERVERPART_Y,
] as any);
scene.value.addMarker(marker);
} else {
item.realRevenueDetail = undefined;
}
});
// return;
// defaultServerPartList.forEach((item: any) => {
// if (item.weatherModel) {
// if (item.weatherModel.DAY_WEATHER_PIC) {
// const el = document.createElement("div");
// el.style.width = "32px";
// el.style.height = "24px";
// el.style.paddingBottom = "4px";
// el.style.textAlign = "center";
// // 创建并插入 <img> 元素
// const img = document.createElement("img");
// img.src = item.weatherModel.DAY_WEATHER_PIC;
// img.style.width = "15px";
// img.style.height = "15px";
// img.style.borderRadius = "50%"; // 圆形图片（可选）
// // img.title = item.DAY_WEATHER
// el.appendChild(img);
// const marker = new Marker({ element: el }).setLnglat([
// item.SERVERPART_X,
// item.SERVERPART_Y,
// ] as any);
// if (currentServerPartDetail.value) {
// if (
// item.SERVERPART_ID === currentServerPartDetail.value.SERVERPART_ID
// ) {
// scene.value.addMarker(marker);
// }
// } else if (
// searchSelectServerPartId &&
// searchSelectServerPartId.length > 0
// ) {
// if (
// searchSelectServerPartId.indexOf(item.SERVERPART_ID.toString()) !==
// -1
// ) {
// scene.value.addMarker(marker);
// }
// } else {
// scene.value.addMarker(marker);
// }
// }
// }
// });
};
// 根据当前的有了的实时营收数组 按照五个 五个一组的顺序 在地图上进行标出div
const handleShowRevenuePoint = (list: any) => {
// nowFifthIndex
if (list && list.length > 0) {
let newList: any = JSON.parse(JSON.stringify(list));
console.log("newList", newList);
// 将数组分为每5个元素为一组
let paginated = [];
for (let i = 0; i < newList.length; i += 5) {
paginated.push(newList.slice(i, i + 5));
}
return paginated;
}
};
</script> </script>
<template> <template>
@ -1688,6 +1953,7 @@ const handleShowDetail = (value: boolean) => {
@handleAreaInspection="handleAreaInspection" @handleAreaInspection="handleAreaInspection"
@handleHiddenSuspended="handleHiddenSuspended" @handleHiddenSuspended="handleHiddenSuspended"
@handleShowAi="handleShowAi" @handleShowAi="handleShowAi"
@handleChangeRightFilterInDialogue="handleChangeRightFilterInDialogue"
:currentServerPartDetail="currentServerPartDetail" :currentServerPartDetail="currentServerPartDetail"
:allServerPartIdList="allServerPartIdList" :allServerPartIdList="allServerPartIdList"
/> />

11
src/components/map/service.ts
View File

@ -198,3 +198,14 @@ export async function handleGetMapConfigByProvinceCode(params: any) {
} }
return data.Result_Data; return data.Result_Data;
} }
// 服务区门店的实时数据
export async function handleGetTransactionDetailList(params: any) {
const data: any = await requestCode.get('/Revenue/GetTransactionDetailList', params)
if (data.Result_Code !== 100) {
return data
}
return data.Result_Data.List
}