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 2024-11-21 19:20:56 +08:00
parent 76eb430ea5
commit 8bb086a400
10 changed files with 714 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@ -2,7 +2,7 @@
* @Author: cclu 1106109051@qq.com * @Author: cclu 1106109051@qq.com
* @Date: 2024-11-18 11:40:21 * @Date: 2024-11-18 11:40:21
* @LastEditors: cclu 1106109051@qq.com * @LastEditors: cclu 1106109051@qq.com
* @LastEditTime: 2024-11-19 09:33:22 * @LastEditTime: 2024-11-21 10:44:39
* @FilePath: \aiRobot\index.html * @FilePath: \aiRobot\index.html
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
@ -13,7 +13,7 @@
<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>地图测试</title>
<base href="/map/"> <base href="/aiMap/">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

76
src/components/map/component/RobotDialogueBox.less
View File

@ -64,6 +64,16 @@
background: rgba(27, 27, 27, 0.51); background: rgba(27, 27, 27, 0.51);
border-radius: 4px; border-radius: 4px;
padding: 8px 12px; padding: 8px 12px;
.firstClickTab{
width: 100%;
.clickItem{
margin-right: 8px;
cursor: pointer;
color: rgb(24, 144, 255);
text-decoration: none;
}
}
.el-loading-mask{ .el-loading-mask{
background-color: transparent!important; background-color: transparent!important;
.el-loading-spinner{ .el-loading-spinner{
@ -76,25 +86,66 @@
} }
.elTable{ .elTable{
background-color: transparent !important;
.el-table__inner-wrapper{ .el-table__inner-wrapper{
.el-table__header-wrapper{
.el-table__header{
thead{
tr{
background: transparent !important;
th{
background: transparent !important;
.cell{
color: #fff!important;
}
}
}
}
}
}
.el-table__body-wrapper{ .el-table__body-wrapper{
.el-scrollbar{ .el-scrollbar{
.el-scrollbar__wrap{ .el-scrollbar__wrap{
.el-scrollbar__view{ .el-scrollbar__view{
.el-table__body{ .el-table__body{
.el-table__row{
background: transparent !important;
color: #fff!important;
}
tr:hover>td.el-table__cell{
background: transparent !important;
color: #fff!important;
}
.el-table__row--level-0{ .el-table__row--level-0{
.el-table__cell{ .el-table__cell{
.cell{ .cell{
display: flex; // display: flex;
align-items: center; // align-items: center;
.el-table__expand-icon{
.el-icon{
color: #fff;
}
}
} }
} }
} }
.el-table__row--level-1{ .el-table__row--level-1{
.el-table__cell{ .el-table__cell{
.cell{ .cell{
display: flex; // display: flex;
align-items: center; // align-items: center;
.el-table__indent{ .el-table__indent{
padding-left: 0!important; padding-left: 0!important;
} }
@ -104,8 +155,8 @@
.el-table__row--level-2{ .el-table__row--level-2{
.el-table__cell{ .el-table__cell{
.cell{ .cell{
display: flex; // display: flex;
align-items: center; // align-items: center;
.el-table__indent{ .el-table__indent{
padding-left: 0!important; padding-left: 0!important;
} }
@ -115,8 +166,8 @@
.el-table__row--level-3{ .el-table__row--level-3{
.el-table__cell{ .el-table__cell{
.cell{ .cell{
display: flex; // display: flex;
align-items: center; // align-items: center;
.el-table__indent{ .el-table__indent{
padding-left: 0!important; padding-left: 0!important;
} }
@ -126,8 +177,8 @@
.el-table__row--level-4{ .el-table__row--level-4{
.el-table__cell{ .el-table__cell{
.cell{ .cell{
display: flex; // display: flex;
align-items: center; // align-items: center;
.el-table__indent{ .el-table__indent{
padding-left: 0!important; padding-left: 0!important;
} }
@ -149,6 +200,11 @@
} }
} }
} }
.dialogContent::-webkit-scrollbar {
width: 0px; /* 隐藏水平滚动条 */
height: 0px; /* 隐藏垂直滚动条 */
}
.inputBox{ .inputBox{
width: 100%; width: 100%;

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

@ -1,11 +1,17 @@
<script setup lang="ts"> <script setup lang="ts">
import { log } from "console"; import { log } from "console";
import moment from "moment"; import moment from "moment";
import { onMounted, reactive, ref } from "vue"; import { h, nextTick, onMounted, reactive, ref, watch } from "vue";
import { formatNumber, wrapTreeNode } from "../../../options/serveice"; import {
formatNumber,
parseThousandSeparatedNumber,
wrapTreeNode,
} from "../../../options/serveice";
import request from "../../../request/requestConfig"; import request from "../../../request/requestConfig";
import { import {
handleGetANALYSISRULEDetail, handleGetANALYSISRULEDetail,
handleGetANALYSISRULEList,
handleSynchroSENTENCE,
handleTranslateSentence, handleTranslateSentence,
} from "../service"; } from "../service";
import "./RobotDialogueBox.less"; import "./RobotDialogueBox.less";
@ -20,6 +26,12 @@ let dialogueList = reactive<any>([]);
const searchText = ref<string>(); const searchText = ref<string>();
// 是否让最新的对话框 是加载效果 // 是否让最新的对话框 是加载效果
const isNewDialogLoading = ref<boolean>(false); const isNewDialogLoading = ref<boolean>(false);
// 这一次对话框出现之后问问题的id
const thisQuestionId = ref<any>();
// 第一个对话框出现的tab
const clickTabList: any = [{ label: "基础信息", value: 1 }];
// 当前选中的查询tab
const selectTab = ref<number>(0);
onMounted(() => { onMounted(() => {
// 默认在初始显示的 // 默认在初始显示的
@ -35,12 +47,14 @@ const handleGetShowDailogBox = () => {
type: 1, type: 1,
text: "", text: "",
isFirst: true, isFirst: true,
isOver: false,
}; };
dialogueList.push(obj); dialogueList.push(obj);
showDialogBox.value = true; showDialogBox.value = true;
setTimeout(() => { setTimeout(() => {
dialogueList[0].text = "猜你想了解："; dialogueList[0].text = "猜你想了解：";
dialogueList[0].isOver = true;
isNewDialogLoading.value = false; isNewDialogLoading.value = false;
}, 1000); }, 1000);
} }
@ -50,11 +64,10 @@ const handleCloseDialogbox = () => {
showDialogBox.value = false; showDialogBox.value = false;
}; };
// 添加对话内容的方法 // 添加对话内容的方法
const handleAddDialogList = () => { const handleAddDialogList = (text: string) => {
console.log("searchText", searchText.value);
let userObj: any = { let userObj: any = {
type: 2, type: 2,
text: searchText.value, text: text,
isFirst: false, isFirst: false,
}; };
let robotObj: any = { let robotObj: any = {
@ -64,14 +77,64 @@ const handleAddDialogList = () => {
}; };
dialogueList.push(userObj); dialogueList.push(userObj);
handleScrollToBottom();
dialogueList.push(robotObj); dialogueList.push(robotObj);
handleScrollToBottom();
isNewDialogLoading.value = true; isNewDialogLoading.value = true;
}; };
// 给最后一个对话框赋值上结果 且关闭加载效果 // 给最后一个对话框赋值上结果 且关闭加载效果
const handleLastUpdate = (str: any) => { const handleLastUpdate = (str: any) => {
dialogueList[dialogueList.lengtg - 1].text = str; dialogueList[dialogueList.length - 1].text = str;
dialogueList[dialogueList.length - 1].isOver = true;
isNewDialogLoading.value = false; isNewDialogLoading.value = false;
handleScrollToBottom();
}; };
// 给多层级树状表格结构加上rowKey
const handleSetRowKeyTable = (list: any) => {
console.log("list", list);
if (list && list.length > 0) {
let res: any = JSON.parse(JSON.stringify(list));
res.forEach((item: any, index: number) => {
item.rowKey = `${index + 1}`;
if (item.children && item.children.length > 0) {
item.children.forEach((subItem: any, subIndex: number) => {
subItem.rowKey = `${index + 1}-${subIndex + 1}`;
if (subItem.children && subItem.children.length > 0) {
subItem.children.forEach((thirdItem: any, thirdIndex: number) => {
thirdItem.rowKey = `${index + 1}-${subIndex + 1}-${
thirdIndex + 1
}`;
if (thirdItem.children && thirdItem.children.length > 0) {
thirdItem.children.forEach(
(fourthItem: any, fourthIndex: number) => {
fourthItem.rowKey = `${index + 1}-${subIndex + 1}-${
thirdIndex + 1
}-${fourthIndex + 1}`;
if (fourthItem.children && fourthItem.children.length > 0) {
fourthItem.children.forEach(
(fifthItem: any, fifthIndex: number) => {
fourthItem.rowKey = `${index + 1}-${subIndex + 1}-${
thirdIndex + 1
}-${fourthIndex + 1}-${fifthIndex + 1}`;
}
);
}
}
);
}
});
}
});
}
});
return res;
} else {
return [];
}
};
// 配置请求的方法 // 配置请求的方法
const handleConfigRequest = async ( const handleConfigRequest = async (
url: any, url: any,
@ -88,12 +151,13 @@ const handleConfigRequest = async (
} }
if (config.responseFormat === "nestingList") { if (config.responseFormat === "nestingList") {
data = wrapTreeNode(data.Result_Data.List); data = handleSetRowKeyTable(wrapTreeNode(data.Result_Data.List));
} else { } else {
data = data.Result_Data.List; data = handleSetRowKeyTable(data.Result_Data.List);
} }
let newRes: any; console.log("data", data);
let newRes: any;
// 根据输出结果的的配置 去处理接口返回的结果 // 根据输出结果的的配置 去处理接口返回的结果
// 先判断是单个服务区 还是多个服务区 // 先判断是单个服务区 还是多个服务区
if (answer?.ServerpartId && answer?.ServerpartId.indexOf(",") === -1) { if (answer?.ServerpartId && answer?.ServerpartId.indexOf(",") === -1) {
@ -102,32 +166,36 @@ const handleConfigRequest = async (
// 单个服务区 那么要去掉合计和片区层 只展示服务区层即以下 // 单个服务区 那么要去掉合计和片区层 只展示服务区层即以下
if (config?.serverpart) { if (config?.serverpart) {
if (data && data.length > 0) { if (data && data.length > 0) {
data.forEach((item: any) => { data.forEach((item: any, index: number) => {
if (config?.serverpart === 1) { if (config?.serverpart === 1) {
newRes = [item]; newRes = [item];
} else { } else {
if (item.children && item.children.length > 0) { if (item.children && item.children.length > 0) {
item.children.forEach((subItem: any) => { item.children.forEach((subItem: any, subIndex: number) => {
if (config?.serverpart === 2) { if (config?.serverpart === 2) {
newRes = [subItem]; newRes = [subItem];
} else { } else {
if (subItem.children && subItem.children.length > 0) { if (subItem.children && subItem.children.length > 0) {
subItem.children.forEach((thirdItem: any) => { subItem.children.forEach(
if (config?.serverpart === 3) { (thirdItem: any, thirdIndex: number) => {
newRes = [thirdItem]; if (config?.serverpart === 3) {
} else { newRes = [thirdItem];
if ( } else {
thirdItem.children && if (
thirdItem.children.length > 0 thirdItem.children &&
) { thirdItem.children.length > 0
thirdItem.children.forEach((fourthItem: any) => { ) {
if (config?.serverpart === 4) { thirdItem.children.forEach(
newRes = [fourthItem]; (fourthItem: any, fourthIndex: number) => {
} if (config?.serverpart === 4) {
}); newRes = [fourthItem];
}
}
);
}
} }
} }
}); );
} }
} }
}); });
@ -212,7 +280,7 @@ const handleAnalyzeConfig = async (configDetail: any, answer: any) => {
let currentUser: any = { let currentUser: any = {
ProvinceCode: "340000", ProvinceCode: "340000",
}; };
// formatType 0：数值 1：字段 2：取缓存 3：取年份 name 就是去resData里面去字段 value 非1 的时候会有值 // formatType 0：数值 1：字段 2：取缓存 3：取年份 name 就是去resData里面去字段 value 非1 的时候会有值 4: 取选中的服务区
if (realKey.formatType === 1) { if (realKey.formatType === 1) {
req[key] = answer[realKey.fieldName]; req[key] = answer[realKey.fieldName];
} else if (realKey.formatType === 0) { } else if (realKey.formatType === 0) {
@ -223,6 +291,8 @@ const handleAnalyzeConfig = async (configDetail: any, answer: any) => {
req[key] = answer[realKey.fieldName] req[key] = answer[realKey.fieldName]
? moment(answer[realKey.fieldName]).format("YYYY") ? moment(answer[realKey.fieldName]).format("YYYY")
: ""; : "";
}else if(realKey.formatType === 4){
req[key] = props.currentServerPartDetail[realKey.fieldName];
} }
} }
} }
@ -239,24 +309,92 @@ const handleAnalyzeConfig = async (configDetail: any, answer: any) => {
answer answer
); );
} }
// 如果返回的表格数据里面有对象格式的 需要拆开来
let newRes: any = [];
if (result && result.length > 0) {
result.forEach((item: any, index: number) => {
item.rowKey = `${index + 1}`;
if (item.children && item.children.length > 0) {
item.children.forEach((subItem: any, subIndex: number) => {
subItem.rowKey = `${index + 1}-${subIndex + 1}`;
});
}
let obj = disasseListObj(item); // 根据输出结果的配置 去修改实际值
newRes.push(obj); console.log("dsadsadasf", result);
const newResult: any = handleChangeTableList(result, newRESPONSE_CONFIG);
console.log("newResult", newResult);
return newResult;
};
// 去循环处理一个数组里面的数据 是否符合配置项的要求
const handleChangeTableList = (list: any, config: any) => {
if (list && list.length > 0) {
let res: any = [];
list.forEach((item: any) => {
let obj: any = handleChangeListItem(item);
console.log("321312", obj);
obj = handleChangeObj(obj, config);
res.push(obj);
}); });
return res;
} else {
return [];
} }
console.log("newRes", newRes); };
return newRes; // 判断如果数组的一个对象里面的一个字段是对象的话 就要把这个对象里面的值拆到外面来
const handleChangeListItem = (item: any, parentKey?: any) => {
if (item) {
let obj: any = {};
for (let key in item) {
if (
typeof item[key] === "object" &&
item[key] !== null &&
key !== "children"
) {
let newObj: any = handleChangeListItem(item[key], key);
for (let smallKey in newObj) {
obj[`${key}${smallKey}`] = newObj[smallKey];
}
} else {
obj[key] = item[key];
}
}
return obj;
}
};
// 处理对象
const handleChangeObj = (obj: any, config: any) => {
if (obj) {
let newObj: any = JSON.parse(JSON.stringify(obj));
for (let key in config) {
if (newObj[key]) {
let configObj: any = config[key];
for (let samllKey in configObj) {
// 判断是不是要以万元为单位
if (configObj["isTenThousand"] && samllKey === "isTenThousand") {
newObj[key] =
typeof newObj[key] === "number"
? newObj[key] / 10000
: formatNumber(
parseThousandSeparatedNumber(newObj[key]) / 10000
);
}
// 判断是不是要加上百分比
if (configObj["isRate"] && samllKey === "isRate") {
newObj[key] = newObj[key] + "%";
}
// 判断是不是金额 金额的话 要加上千分号
if (configObj["isMoney"] && samllKey === "isMoney") {
console.log("newObj[key]2", newObj[key]);
newObj[key] =
typeof newObj[key] === "number"
? formatNumber(newObj[key])
: formatNumber(parseThousandSeparatedNumber(newObj[key]));
}
}
}
}
if (newObj.children && newObj.children.length > 0) {
newObj.children = handleChangeTableList(newObj.children, config);
}
return newObj;
} else {
return {};
}
}; };
// 给一个对象 对象里面有字段的值是对象 输出拆了的对象数据到老对象中 // 给一个对象 对象里面有字段的值是对象 输出拆了的对象数据到老对象中
@ -323,95 +461,20 @@ const disassembleObjects = (obj: any, parentKey: any) => {
// 表格显示字段的递归处理 // 表格显示字段的递归处理
const handleChangeShow = (obj: any, addObj?: any) => { const handleChangeShow = (obj: any, addObj?: any) => {
// 如果是有父级的 那要区分一下prop 就是表格取的字段
let moneyList: any = [
"金额",
"营收",
"应收",
"缴款",
"费用",
"额",
"数值",
"增长值",
];
let rateList: any = ["同比", "环比", "率", "增长率", "比例"];
let columnsList: any = []; let columnsList: any = [];
for (let key in obj) { for (let key in obj) {
// 判断是不是金钱类的 要添加千分号 let newObj: any = obj[key];
let isMoney: boolean = false;
// 判断是不是名称类的 要宽一点
let isName: boolean = false;
// 判断是否需要带%
let isRate: boolean = false;
// 判断现在的这个字段是不是对象
let isObject: boolean = false;
if (typeof obj[key] === "string") {
moneyList.forEach((item: any) => {
if (obj[key].indexOf(item) !== -1) {
isMoney = true;
}
});
if (obj[key].indexOf("名") !== -1) {
isName = true;
}
rateList.forEach((item: any) => {
if (obj[key].indexOf(item) !== -1 && !isMoney) {
isRate = true;
}
});
} else if (
typeof obj[key] === "object" &&
obj[key] !== null &&
key !== "ShopINCList" &&
key !== "children"
) {
isObject = true;
}
if (isObject) { columnsList.push({
// let resObj = { width: newObj.width,
// label: key, label: newObj.label,
// children: handleChangeShow(), prop: newObj.prop,
// }; align: newObj.align,
let resObj = disassembleObjects(obj[key], key); "show-overflow-tooltip": true,
console.log("resObj222", resObj); isSlot: newObj.isSlot,
if (resObj && resObj.length > 0) { isMoney: newObj.isMoney,
resObj.forEach((item: any) => { isRate: newObj.isRate,
columnsList.push(item); });
});
}
// columnsList.push(resObj);
} else {
let resObj: any = {
width: isName ? 250 : 150,
label: isName
? `${obj[key] || ''}`
: `<div style="text-align: center">${
(addObj?.name ? addObj?.name + "" : "") + obj[key]
}</div>`,
prop: (addObj?.key ? addObj?.key + "" : "") + key,
// valueType: isMoney ? "digit" : "",
align: isMoney ? "right" : "",
"show-overflow-tooltip": true,
isSlot: false,
isMoney: isMoney,
isRate: isRate,
};
if (isRate) {
resObj.isSlot = true;
// resObj.formatter = (_: any, record: any) => {
// return record[key] ? record[key] + "%" : "";
// };
}
if (isMoney) {
resObj.isSlot = true;
// resObj.formatter = (_: any, record: any) => {
// return record[key] ? `<span>${formatNumber(record[key])}</span>` : "";
// };
}
columnsList.push(resObj);
}
} }
return columnsList; return columnsList;
}; };
@ -436,23 +499,41 @@ const handleConfigItemTable = (tableData: any, configObj: any, answer: any) => {
// 配置列表的显示列 // 配置列表的显示列
if (configObj) { if (configObj) {
let resObj: any = JSON.parse(configObj.RESPONSE_CONFIG); let resObj: any = JSON.parse(configObj.RESPONSE_CONFIG);
console.log("resObj", resObj);
console.log("answer", answer);
let columns: any = [];
if (resObj) { if (resObj) {
// 处理对象格式 columns = handleChangeShow(resObj);
let columns: any = handleChangeShow(resObj); console.log("columns", columns);
// 已经拿到显示列 和 表格数据 直接赋值给当前对话框的最后一项即可
let obj: any = JSON.parse(
JSON.stringify(dialogueList[dialogueList.length - 1])
);
dialogueList[dialogueList.length - 1] = {
...obj,
haveTable: true,
tableData: tableData,
columns: columns,
};
isNewDialogLoading.value = false;
searchText.value = "";
} }
let obj: any = JSON.parse(
JSON.stringify(dialogueList[dialogueList.length - 1])
);
dialogueList[dialogueList.length - 1] = {
...obj,
haveTable: true,
tableData: tableData,
columns: columns,
text: `${answer?.RevenueAnalysis}：${
answer?.StartDate ? answer?.StartDate : ""
}${answer?.EndDate ? "-" + answer?.EndDate : ""}`,
};
isNewDialogLoading.value = false;
} }
handleScrollToBottom();
};
// 将滚动条滚动到底部 一般触发时间为打字机效果 和 提问的时候
const handleScrollToBottom = () => {
const div: any = document.getElementById("dialogContent");
console.log("div", div);
setTimeout(() => {
nextTick(() => {
if (div) {
div.scrollTop = div.scrollHeight; // 将 scrollTop 设置为 scrollHeight，滚动到最底部
}
});
}, 100);
}; };
// 调用回答问题的接口 // 调用回答问题的接口
@ -460,18 +541,60 @@ const handleAnswerQuestions = async () => {
const req: any = { const req: any = {
Sentence: searchText.value, Sentence: searchText.value,
ProvinceCode: "340000", ProvinceCode: "340000",
DialogCode: thisQuestionId.value || "",
}; };
// 需要在对话框中的效果就是 输入问题之后 出现问问题和回答的对话框之后 就删除对话框内容 但是接口搜索还是需要显示内容
searchText.value = "";
const data = await handleTranslateSentence(req); const data = await handleTranslateSentence(req);
console.log("data", data); console.log("data", data);
let searchRes: string = "";
// 如果单独搜索服务区 会出现ServerpartInfoList返参 根据返参 来标出点位 // 如果单独搜索服务区 会出现ServerpartInfoList返参 根据返参 来标出点位
if (data?.ServerpartInfoList && data?.ServerpartInfoList.length > 0) { if (data?.ServerpartInfoList && data?.ServerpartInfoList.length > 0) {
emit("handleEnterySearch");
emit("handleLightServerpart", data?.ServerpartInfoList);
let obj: any = JSON.parse(
JSON.stringify(dialogueList[dialogueList.length - 1])
);
let str: string = ``;
data?.ServerpartInfoList.forEach((item: any) => {
if (str) {
str += `、${item.SERVERPART_NAME}`;
} else {
str = `${item.SERVERPART_NAME}`;
}
});
dialogueList[dialogueList.length - 1] = {
...obj,
text: data?.RevenueAnalysis || "",
// `已标注${str}的地图位置`
};
isNewDialogLoading.value = false;
} else if (data?.RevenueAnalysis) { } else if (data?.RevenueAnalysis) {
//再判断这次查询是否有文字结果返回 如果有的话 再进行判断 是要根据语义 调用接口 还是 直接输出这段文字 //再判断这次查询是否有文字结果返回 如果有的话 再进行判断 是要根据语义 调用接口 还是 直接输出这段文字
if (data?.AnalysisRuleId) { if (data?.AnalysisRuleId) {
// 去拿到这个id的配置明细 // 去拿到这个id的配置明细
const configDetail = await handleGetANALYSISRULEDetail({ // 添加判断 可能会有多个id 单个id的时候 直接调用详情接口拿到数据 多个id去请求列表接口 拿到优先级高的 直接给configDetail赋值
ANALYSISRULEId: data?.AnalysisRuleId, let configDetail: any;
const configList: any = await handleGetANALYSISRULEList({
searchParameter: {
ANALYSISRULE_ID: 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];
}
// const configDetail = await handleGetANALYSISRULEDetail({
// ANALYSISRULEId: data?.AnalysisRuleId,
// });
console.log("configDetail", configDetail); console.log("configDetail", configDetail);
// 如果拿到值就根据配置去调用接口 拿到数据 输出数据 // 如果拿到值就根据配置去调用接口 拿到数据 输出数据
if (configDetail) { if (configDetail) {
@ -487,15 +610,148 @@ const handleAnswerQuestions = async () => {
} }
} else { } else {
handleLastUpdate("小驿还无法理解，请换个说法，我会不停努力学习的！"); handleLastUpdate("小驿还无法理解，请换个说法，我会不停努力学习的！");
searchRes = "查询失败";
}
// 问完去调日志接口记录 且在没有对话框id的时候 存一个对话框id
const logData: any = await handleSynchroSENTENCE({
DIALOG_CODE: thisQuestionId.value,
SENTENCE_CONTENT: req.Sentence,
SENTENCE_RESULT: data?.RevenueAnalysis || "查询失败",
SENTENCE_TYPE: data?.SentenceType,
SENTENCE_STATE:
searchRes === "查询失败" || data?.RevenueAnalysis === "无法识别。"
? 0
: 1,
OPERATE_DATE: moment().format("YYYY-MM-DD HH:mm:ss"),
STAFF_NAME: "新项目",
// STAFF_ID
});
console.log("logData", logData);
if (thisQuestionId.value) {
} else {
thisQuestionId.value = logData?.DIALOG_CODE;
} }
}; };
// 提问的方法 // 提问的方法
const handleSubmit = async () => { const handleSubmit = async () => {
if (searchText.value) {
// 先添加对话内容
handleAddDialogList(searchText.value);
// 调用回答问题的接口
await handleAnswerQuestions();
}
};
// 点击标签调用的方法
const handleClickTab = async (value: number) => {
selectTab.value = value;
console.log("handleClickTab", props.currentServerPartDetail);
let searchObj: any = {
1: `${props.currentServerPartDetail?.SERVERPART_NAME || ""}基础信息`,
};
// 先添加对话内容 // 先添加对话内容
handleAddDialogList(); handleAddDialogList(searchObj[value]);
// 调用回答问题的接口 // 拿到配置列表 拿到这个内容的配置内容
await handleAnswerQuestions(); const configDetail: any = await handleGetConfigList(searchObj[value]);
if (value === 1) {
handleServerpartBasicInfo(configDetail);
}
};
// 调用配置列表 根据现在点击的这一项类型 来查出对应的配置详情id
const handleGetConfigList = async (str: string) => {
const data = await handleGetANALYSISRULEList({
searchParameter: {
ANALYSISRULE_ID: "",
current: 1,
pageSize: 10,
},
pagesize: 999999,
PageIndex: 1,
});
console.log("data", data);
let detailObj: number = 0;
if (data && data.length > 0) {
data.forEach((item: any) => {
if (str.indexOf(item.TRIGGER_WORDS) !== -1 && item.RULE_SOURCE === 1000) {
detailObj = item;
}
});
}
console.log("detailObj", detailObj);
return detailObj;
};
// 输出服务区基础数据的方法
const handleServerpartBasicInfo = async (config: any) => {
console.log("config", config);
let newReq: any = config.PARAM_TEMPLATE
? JSON.parse(config.PARAM_TEMPLATE)
: ""; // 入参
let newRESPONSE_CONFIG: any = config.RESPONSE_CONFIG
? JSON.parse(config.RESPONSE_CONFIG)
: ""; // 出参
let newPARSING_RULES: any = config.PARSING_RULES
? JSON.parse(config.PARSING_RULES)
: ""; // 对应的规则
let OUTPUT_FORMAT: any = config.OUTPUT_FORMAT
? JSON.parse(config.OUTPUT_FORMAT)
: ""; // 输出格式
console.log("newReq", newReq);
console.log("newRESPONSE_CONFIG", newRESPONSE_CONFIG);
console.log("newPARSING_RULES", newPARSING_RULES);
console.log("OUTPUT_FORMAT", OUTPUT_FORMAT);
// 拿入参
let req: any = {}
if(newPARSING_RULES){
}
};
// 传入的数据
const props = defineProps<{
currentServerPartDetail: any;
}>();
// 传入的方法
const emit = defineEmits<{
(e: "handleLightServerpart", infoList: any): void; // 高亮查到的图层
(e: "handleEnterySearch"): void; // 全部服务区圆点置灰
}>();
// 监听当前选择的服务区
watch(
() => props.currentServerPartDetail,
(newVal, oldVal) => {
console.log("new", newVal);
console.log("old", oldVal);
if (newVal) {
if (selectTab.value !== 0) {
handleClickTab(selectTab.value);
}
}
},
{ deep: true }
);
// 处理单元格数据
const handleFormatter = (
row: any,
column: any,
cellValue: any,
index: number
) => {
return h("div", { style: "text-align:center" }, [
JSON.stringify(row), // 显示列的 label
]);
}; };
</script> </script>
@ -512,7 +768,7 @@ const handleSubmit = async () => {
</div> </div>
<div class="dialogBox"> <div class="dialogBox">
<!-- 实际的对话框方框 --> <!-- 实际的对话框方框 -->
<div class="dialogContent"> <div id="dialogContent" class="dialogContent">
<div <div
class="dialogueBoxItem" class="dialogueBoxItem"
v-for="(item, index) in dialogueList" v-for="(item, index) in dialogueList"
@ -530,16 +786,31 @@ const handleSubmit = async () => {
class="dialogueTextBox" class="dialogueTextBox"
v-loading="isNewDialogLoading && index === dialogueList.length - 1" v-loading="isNewDialogLoading && index === dialogueList.length - 1"
> >
{{ item.text || "" }} <div>{{ item.text || "" }}</div>
<div v-if="item.haveTable"> <div
v-if="item.isFirst && item.isOver"
style="margin-top: 8px"
class="firstClickTab"
>
<div
v-for="(item, index) in clickTabList"
:key="index"
class="clickItem"
@click="handleClickTab(item.value)"
>
{{ item.label || "" }}
</div>
</div>
<div v-if="item.haveTable" style="margin-top: 8px">
<el-table <el-table
:data="item.tableData" :data="item.tableData"
border
:fit="true" :fit="true"
tree-props="treeProps" tree-props="treeProps"
row-key="rowKey" row-key="rowKey"
class="elTable" class="elTable"
:max-height="500"
> >
<el-table-column <el-table-column
v-for="(column, index) in item.columns" v-for="(column, index) in item.columns"
@ -547,21 +818,37 @@ const handleSubmit = async () => {
:prop="column.prop" :prop="column.prop"
:label="column.label" :label="column.label"
:width="column.width" :width="column.width"
:align="column.align"
header-align="center"
> >
<!-- :formatter="handleFormatter" -->
<!-- 自定义表头内容 --> <!-- 自定义表头内容 -->
<template #header> <template #header>
<div v-html="column.label"></div> <div v-html="column.label"></div>
</template> </template>
<!-- 默认的单元格内容渲染 --> <!-- 默认的单元格内容渲染 -->
<template #default="{ row }"> <!-- <template #default="{ row }">
<div v-if="column.isSlot"> <div
v-if="column.isSlot"
:style="{
justifyContent:
column.align === 'right'
? 'flex-end'
: column.align === 'left'
? 'flex-start'
: column.align === 'center'
? 'center'
: '',
}"
>
<span v-html="renderCell(row, column)"></span> <span v-html="renderCell(row, column)"></span>
</div> </div>
<div v-else> <div v-else>
<span>{{ row[column.prop] }}</span> <span>{{ row[column.prop] }}</span>
</div> </div>
</template> </template> -->
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
@ -586,7 +873,7 @@ const handleSubmit = async () => {
<img <img
class="searchIcon" class="searchIcon"
src="@/assets/ai/searchIconBlue.png" src="@/assets/ai/searchIconBlue.png"
@clcik="handleSubmit()" @click="handleSubmit()"
/> />
</div> </div>
</div> </div>

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

@ -11,7 +11,7 @@ import RobotDialogueBox from "./component/RobotDialogueBox.vue";
// 地图实例 // 地图实例
const scene = ref<any>(); const scene = ref<any>();
// 悬浮框实例 // 悬浮框实例
const hoverPoint = ref<any>(); const hoverPoint = ref<any>();
// 所有服务区的数据 // 所有服务区的数据
let defaultServerPartList = reactive<any>([]); let defaultServerPartList = reactive<any>([]);
@ -19,6 +19,8 @@ let defaultServerPartList = reactive<any>([]);
let ServerpartTypeObj = reactive<any>({}); let ServerpartTypeObj = reactive<any>({});
// 判断是否有加载效果 // 判断是否有加载效果
const isShowLoading = ref<boolean>(false); const isShowLoading = ref<boolean>(false);
// 当前选中的服务区
const currentServerPartDetail = ref<any>();
onMounted(async () => { onMounted(async () => {
scene.value = new Scene({ scene.value = new Scene({
@ -78,7 +80,15 @@ const handleGetAllService = async () => {
}; };
const data = await handleGetServerpartList(req); const data = await handleGetServerpartList(req);
console.log("data", data); console.log("data", data);
defaultServerPartList = data; if (data && data.length > 0) {
let res: any = [];
data.forEach((item: any) => {
if (item.SPREGIONTYPE_ID !== 89 && item.SPREGIONTYPE_ID) {
res.push(item);
}
});
defaultServerPartList = res;
}
return data; return data;
}; };
@ -116,8 +126,6 @@ const handleAllServiceMarkedPoint = async () => {
}); });
pointLayer.on("mousemove", (ev: any) => { pointLayer.on("mousemove", (ev: any) => {
const detail: any = ev.feature; const detail: any = ev.feature;
console.log("detail", detail);
hoverPoint.value.style.top = `${ev.y}px`; hoverPoint.value.style.top = `${ev.y}px`;
hoverPoint.value.style.left = `${ev.x}px`; hoverPoint.value.style.left = `${ev.x}px`;
hoverPoint.value.style.display = "block"; hoverPoint.value.style.display = "block";
@ -137,9 +145,78 @@ const handleAllServiceMarkedPoint = async () => {
hoverPoint.value.style.display = "none"; hoverPoint.value.style.display = "none";
}); });
// 点击事件
pointLayer.on("click", (e) => {
console.log("e", e);
handleClickPointLayer(e.feature);
});
// 鼠标取消点击
pointLayer.on("unclick", () => {
handleChangeToDefault();
});
scene.value.addLayer(pointLayer); scene.value.addLayer(pointLayer);
}; };
// 点击服务区圆点触发的时间
const handleClickPointLayer = (detail: any) => {
// 给当前选中的服务区存储值
currentServerPartDetail.value = detail;
// 地图上出现选中服务区的效果
handleAddSelect(detail);
};
// 给服务区圆点加上选中效果
const handleAddSelect = (detail: any) => {
let current: any = handleGetThisLayer("lightPointLayer");
if (current) {
scene.value.removeLayer(current);
}
const lightPointLayer = new PointLayer({});
lightPointLayer.name = "lightPointLayer";
lightPointLayer.shape("circle");
lightPointLayer.size(15);
lightPointLayer.color("#efff19");
lightPointLayer.style({
opacity: 0.6,
});
lightPointLayer.source([detail], {
parser: {
type: "json",
x: "SERVERPART_X",
y: "SERVERPART_Y",
},
});
scene.value.addLayer(lightPointLayer);
};
// 取消服务区选中等效果的实现方法
const handleChangeToDefault = () => {
// 清除当前选中的服务区值
currentServerPartDetail.value = undefined;
// 取消点击时要清除的图层名称列表
const list: any = ["lightPointLayer", "searchPointLayerText"];
list.forEach((item: any) => {
let current: any = handleGetThisLayer(item);
if (current) {
scene.value.removeLayer(current);
}
});
// 将进入搜索状态的服务区正常圆点 变回正常颜色
let current: any = handleGetThisLayer("pointLayer");
current.color("SPREGIONTYPE_ID", (value: number) => {
return Number(value || 0) === 65 ||
Number(value || 0) === 45 ||
Number(value || 0) === 47
? "#34B6B7"
: "#CEF8D6";
});
current.render();
};
// 鼠标移入点触发的时间 // 鼠标移入点触发的时间
const handlePointHover = () => { const handlePointHover = () => {
const el = document.createElement("div"); const el = document.createElement("div");
@ -170,12 +247,105 @@ const handleGetEnumeration = async () => {
} }
ServerpartTypeObj = typeObj; ServerpartTypeObj = typeObj;
}; };
// 给传入的服务区 标上高亮点
// 判断当前是否已经存在高亮图层 如果存在的话 就改变值 不用重新添加图层
const handleLightServerpart = (infoList: any) => {
let current: any = handleGetThisLayer("searchPointLayerText");
let idList: any = [];
infoList.forEach((item: any) => {
idList.push(item.SERVERPART_ID);
});
let searchRes: any = [];
defaultServerPartList.forEach((item: any) => {
if (idList.indexOf(item.SERVERPART_ID) !== -1) {
searchRes.push(item);
}
});
// 删除原有的 添加新的
if (current) {
scene.value.removeLayer(current);
}
let searchPointLayerText = new PointLayer({
zIndex: 9,
});
searchPointLayerText.name = "searchPointLayerText";
searchPointLayerText.source(searchRes, {
parser: {
type: "json",
x: "SERVERPART_X",
y: "SERVERPART_Y",
},
});
searchPointLayerText.shape("circle");
searchPointLayerText.size(8);
searchPointLayerText.color("#fdff3d");
searchPointLayerText.style({
opacity: 0.7, // 透明度
});
searchPointLayerText.on("mousemove", (ev: any) => {
const detail: any = ev.feature;
hoverPoint.value.style.top = `${ev.y}px`;
hoverPoint.value.style.left = `${ev.x}px`;
hoverPoint.value.style.display = "block";
hoverPoint.value.innerHTML = `<div>
<div>${detail?.SERVERPART_NAME || ""}</div>
</div>`;
});
// 鼠标移出
searchPointLayerText.on("mouseout", (ev: any) => {
hoverPoint.value.style.display = "none";
});
scene.value.addLayer(searchPointLayerText);
};
// 传入服务区id 在地图上出现一个选中的效果 且 id只能传入一个服务区
const handleSelectedServerpart = (id: any) => {
if (defaultServerPartList && defaultServerPartList.length > 0) {
let seletObj: any = {};
defaultServerPartList.forEach((item: any) => {
if (item.SERVERPART_ID === id) {
seletObj = item;
}
});
}
};
// 查找当前全部图层中是否有传入的图层名称 有的话 输出图层数据
const handleGetThisLayer = (name: string) => {
let res: any;
let allLayers: any = scene.value.getLayers();
console.log("allLayers", allLayers);
if (allLayers && allLayers.length > 0) {
allLayers.forEach((item: any) => {
if (item.name === name) {
res = item;
}
});
}
if (res) {
return res;
}
};
// 进入搜索状态 改变现在的服务区点位颜色 全部变成灰色
const handleEnterySearch = () => {
let current: any = handleGetThisLayer("pointLayer");
current.color("#dededd");
current.render();
};
</script> </script>
<template> <template>
<div id="map" class="mapBox"> <div id="map" class="mapBox">
<div class="RobotBox"> <div class="RobotBox">
<RobotDialogueBox /> <RobotDialogueBox
@handleLightServerpart="handleLightServerpart"
@handleEnterySearch="handleEnterySearch"
:currentServerPartDetail="currentServerPartDetail"
/>
</div> </div>
</div> </div>
</template> </template>

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

@ -58,3 +58,22 @@ export async function handleGetANALYSISRULEDetail(params: any) {
// 拿到配置列表 多个的时候按照优先级去选择
export async function handleGetANALYSISRULEList(params: any) {
const data: any = await request.post('/Analysis/GetANALYSISRULEList', params)
if (data.Result_Code !== 100) {
return data
}
return data.Result_Data.List
}
// 语义识别接口 同步接口
export async function handleSynchroSENTENCE(params: any) {
const data: any = await request.post('/Analysis/SynchroSENTENCE', params)
if (data.Result_Code !== 100) {
return data
}
return data.Result_Data
}

9
src/options/serveice.ts
View File

@ -18,4 +18,11 @@ export const formatNumber = (num: number) => {
} else { } else {
return num.toLocaleString(); // 使用千分号，不保留小数位 return num.toLocaleString(); // 使用千分号，不保留小数位
} }
} }
// 把可能是带千分号的数字 变为数字
export const parseThousandSeparatedNumber = (str: string) => {
if (!str) return 0; // 如果字符串为空，返回0
const cleaned = str.replace(/,/g, ""); // 移除千分号
return parseFloat(cleaned); // 转换为数字
};

2
src/request/request.ts
View File

@ -44,7 +44,7 @@ const errorHandler = (error: any): any => {
// 创建 axios 实例 // 创建 axios 实例
const instance = axios.create({ const instance = axios.create({
baseURL: 'https://api.eshangtech.com/EShangApiMain', // 默认请求前缀 baseURL: 'https://api.eshangtech.com/EShangApiMain', // 默认请求前缀
timeout: 10000, // 请求超时时间 timeout: 60000, // 请求超时时间
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },

2
src/request/requestCode.ts
View File

@ -44,7 +44,7 @@ const errorHandler = (error: any): any => {
// 创建 axios 实例 // 创建 axios 实例
const instance = axios.create({ const instance = axios.create({
baseURL: 'https://api.eshangtech.com/CommercialApi', // 默认请求前缀 baseURL: 'https://api.eshangtech.com/CommercialApi', // 默认请求前缀
timeout: 10000, // 请求超时时间 timeout: 60000, // 请求超时时间
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },

2
src/request/requestConfig.ts
View File

@ -44,7 +44,7 @@ const errorHandler = (error: any): any => {
// 创建 axios 实例 // 创建 axios 实例
const instance = axios.create({ const instance = axios.create({
baseURL: 'https://api.eshangtech.com/', // 默认请求前缀 baseURL: 'https://api.eshangtech.com/', // 默认请求前缀
timeout: 10000, // 请求超时时间 timeout: 60000, // 请求超时时间
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },

2
vite.config.ts
View File

@ -14,7 +14,7 @@ export default defineConfig({
plugins: [ plugins: [
vue(), vue(),
], ],
base: '/map', base: '/aiMap',
build: { build: {
outDir: 'dist', // 打包输出目录 outDir: 'dist', // 打包输出目录
assetsDir: 'assets', // 静态资源目录 assetsDir: 'assets', // 静态资源目录