<template>
|
<div class="chartBox">
|
<div class="ChartBox">
|
<JwChat-index :taleList="list" @enter="bindEnter" v-model="inputMsg" :toolConfig="tool">
|
</JwChat-index>
|
</div>
|
</div>
|
<!-- -->
|
</template>
|
|
<script>
|
import msgData from "../../assets/js/msg/msgData";
|
import store from "../../store";
|
import bus from "./../../assets/js/bus.js";
|
import { getAIMessage, getV1Fastgpt, getChartMessage } from "../../api/api.js";
|
import { getQueryEentity } from "../../api/modelBase.js";
|
import mapInfo from "../../assets/js/map/mapInfo.js";
|
import axios from "axios";
|
import layerJson from "../../assets/js/map/mapJsonLayer.js";
|
import { factors } from "@turf/turf";
|
import mapConfig from "../../assets/js/map/mapConfig.js";
|
import { getToken } from "../../utils/auth.js";
|
import modelLayer from "../../assets/js/map/modelLayer.js";
|
|
export default {
|
name: "jwChat",
|
|
data() {
|
return {
|
inputMsg: "",
|
loading: false,
|
list: [],
|
msgData: [],
|
tool: {
|
show: ["file", "history", "img"],
|
callback: this.toolEvent
|
},
|
config: {
|
img: "/image/cover.png",
|
name: "JwChat",
|
dept: "最简单、最便捷",
|
callback: this.bindCover
|
}
|
};
|
},
|
computed: {
|
Obj() {
|
return store.state.setMsgData;
|
}
|
},
|
watch: {
|
Obj(newVal, oldVal) {
|
if (newVal) {
|
if (newVal.text == "加载完成") {
|
setTimeout(() => {
|
this.setMsgImg();
|
}, 500);
|
setTimeout(() => {
|
this.setMsgtab();
|
}, 1500);
|
this.loading = false;
|
store.state.setMsgData = null;
|
} else {
|
this.list[this.list.length - 1].text = newVal;
|
}
|
}
|
}
|
},
|
mounted() {
|
if (window.timer) {
|
clearInterval(window.timer);
|
window.timer = null;
|
}
|
|
setTimeout(() => {
|
this.getMsg("ai", "您好，我是GeoAgent，请问可以帮您做些什么？");
|
}, 1000);
|
setTimeout(() => {
|
const obj = mapConfig.setJsonToMd([
|
{
|
h3: "警告: 苏比克湾区发现异常军事设施!"
|
},
|
{
|
p: "异常代码: 4r5as5s001"
|
},
|
{
|
p: "来源: XXX部"
|
},
|
{
|
p: "发现时间: XX年XX月XX号XX日XX点XX分"
|
}
|
]);
|
var roleMsg = msgData.getJsonToMdData(obj);
|
this.list.push(roleMsg);
|
}, 3000);
|
bus.$on("mapInfo", (res) => {
|
if (res) {
|
// this.setMapInfo(res);
|
}
|
});
|
bus.$on("setInsertMarkDown", (res) => {
|
if (res) {
|
this.setMarkDownInfo(res);
|
}
|
});
|
bus.$on("setRagMoreListAll", (res) => {
|
if (res) {
|
this.setRagMoreList(res);
|
}
|
});
|
// axios.get("http://192.168.11.89:12315/Markdown.md").then((response) => {
|
// if (response.status == 200) {
|
// console.log(response);
|
// this.setMarkDownInfo(response.data);
|
// }
|
// });
|
},
|
methods: {
|
getMd() {
|
const obj = mapConfig.setJsonToMd();
|
const length = this.list.length - 1;
|
var roleMsg = msgData.getJsonToMdData(obj);
|
this.list[length].list = roleMsg.list;
|
this.loading = false;
|
},
|
bindEnter() {
|
const msg = this.inputMsg;
|
|
if (!msg) return;
|
|
this.getMsg("role", msg);
|
|
this.setLoading();
|
setTimeout(() => {
|
this.setMsgStart(msg);
|
}, 200);
|
},
|
getQueryGroupBy(layer, filed) {
|
const layerId = modelLayer.layers.filter((item) => {
|
if (item.name == layer) {
|
return item;
|
}
|
});
|
if (layerId.length <= 0) {
|
return;
|
}
|
const obj = [
|
{
|
type: "count",
|
field: filed,
|
outfield: "count_" + filed
|
}
|
];
|
return {
|
layerid: layerId[0].id,
|
dbid: modelLayer.dbid,
|
token: getToken(),
|
statistics: JSON.stringify(obj),
|
containCount: true,
|
groupby: filed
|
};
|
},
|
async getQueryEentityGroupBy(res, filed, response, head) {
|
const data = await getQueryEentity(res);
|
const message = mapConfig.setScanList(data.data, filed, head);
|
|
if (message) {
|
if (this.loading) {
|
this.loading = false;
|
}
|
this.list[this.list.length - 1].sourceValue = "1";
|
this.list[this.list.length - 1].list = message;
|
} else {
|
if (response.content) {
|
this.getMsg("ai", response.content);
|
} else {
|
this.getMsg("ai", "稍后服务。。。");
|
}
|
}
|
},
|
async getQueryEentityDescription(res) {
|
const std = [];
|
const str = [];
|
const data = await getQueryEentity({
|
token: res.token,
|
start: 1,
|
count: 0,
|
containCount: true,
|
layerid: res.layerid,
|
dbid: res.dbid
|
});
|
const items = data.data.items;
|
|
items.map((rs) => {
|
var name = rs["weaponname"];
|
if (name) {
|
var boolen = true;
|
if (str.length == 0) {
|
boolen = true;
|
} else if (str.indexOf(name) > -1) {
|
boolen = false;
|
} else {
|
boolen = true;
|
}
|
if (boolen) {
|
const obj = mapConfig.setArrList(rs["descriptio"]);
|
for (var i in obj) {
|
std.push(obj[i]);
|
}
|
str.push(name);
|
}
|
}
|
});
|
const jstomd = mapConfig.setJsonToMd(std);
|
const length = this.list.length - 1;
|
var roleMsg = msgData.getJsonToMdData(jstomd);
|
this.list[length].list = roleMsg.list;
|
this.loading = false;
|
},
|
|
async setMsgStart(res) {
|
if (res == "定位到苏比克湾") {
|
this.setQueryMapPlan('flyToSubicBayArea', null)
|
} else if (res == "此区域有哪些武器系统") {
|
this.setQueryMapPlan('displayWeaponSystem', null)
|
} else if (res == "查询该区域内目标及分布") {
|
this.setQueryMapPlan('searchTarget', null)
|
}else if (res == "分析堤丰系统的性能和防御范围") {
|
this.setQueryMapPlan('defenceRangeTyphoonSystem', null)
|
} else if (res == "定位到美国空军指挥中心") {
|
this.setQueryMapPlan('USAFCommandCenterQuery', null)
|
} else if (res == "生成战场环境报告") {
|
this.getUrlMd(config.reportMd, config.reportDocx)
|
// axios.get("/Data/Report.html").then(response=>{
|
// var roleMsg = msgData.getHTMLData(response.data);
|
// this.list[this.list.length - 1].list = roleMsg.list;
|
// this.loading = false;
|
// })
|
}
|
else if (res.indexOf("055") > -1) {
|
layerJson.setTitleSetRest();
|
this.setV1Fastgpt(res);
|
} else {
|
const data = await getAIMessage(res);
|
|
if (data.status == 200) {
|
if (data.name) {
|
this.$store.state.setScreenFlag = true;
|
this.$nextTick(() => {
|
setTimeout(() => {
|
this.setQueryMapPlan(data.name, data);
|
}, 1000);
|
});
|
} else {
|
if (data.content) {
|
this.getMsg("ai", data.content);
|
this.list[this.list.length - 1].sourceValue = "2";
|
} else {
|
this.getMsg("ai", "");
|
this.list[this.list.length - 1].sourceValue = "2";
|
}
|
}
|
} else {
|
if (data.content) {
|
this.getMsg("ai", data.content);
|
this.list[this.list.length - 1].sourceValue = "2";
|
} else {
|
if (data.length > 0) {
|
this.setSourceList(data)
|
} else {
|
this.getMsg("ai", "稍后服务。。。");
|
}
|
//
|
}
|
}
|
}
|
|
|
},
|
setSourceList(res) {
|
const obj = res[0].quoteList
|
var roleMsg = [
|
{
|
type: "text",
|
val: "未查询到相关信息"
|
}
|
];
|
|
const length = this.list.length - 1;
|
|
if (obj.length > 0) {
|
this.$store.state.ragList.push({
|
quest: res,
|
index: length,
|
val: obj
|
});
|
roleMsg = msgData.getRagData(obj[0], true, res);
|
}
|
|
this.list[length].list = roleMsg;
|
this.loading = false;
|
},
|
getUrlMd(res, link) {
|
axios.get(res).then(response => {
|
if (response.status == 200) {
|
var roleMsg = msgData.getJsonToMdData(response.data, link);
|
this.list[this.list.length - 1].sourceValue = "1";
|
this.list[this.list.length - 1].list = roleMsg.list;
|
this.loading = false;
|
} else {
|
this.getMsg("ai", "稍后服务。。。");
|
}
|
})
|
},
|
setQueryMapPlan(res, response) {
|
if (this.$store.state.setScreenFlag == false) {
|
this.$store.state.setScreenFlag = true;
|
}
|
if (this.$store.state.showLenged) {
|
this.$store.state.showLenged = false;
|
}
|
|
if (res != "weaponSystemParameters") {
|
layerJson.setTitleSetRest();
|
}
|
mapInfo.setEntityQueryInput();
|
switch (res) {
|
|
case "flyToSubicBayArea":
|
this.$store.state.setScreenFlag = true;
|
mapInfo.setEntityQueryInput();
|
this.getMsg("ai", "地图已显示");
|
this.list[this.list.length - 1].sourceValue = "1";
|
break;
|
case "displayWeaponSystem":
|
mapInfo.setFlyTo({
|
longitude: 120.26907736668211,
|
latitude: 14.791708841800627,
|
height: 1371.1909347746105
|
});
|
var obj = this.getQueryGroupBy("武器", "weaponname");
|
// var table_head = ["武器名称", "数量", "出现时间"]
|
// this.getQueryEentityGroupBy(obj, "weaponname", response, table_head);
|
|
// this.getUrlMd("/Data/武器系统细化.md", null)
|
axios.get("/Data/武器系统.html").then(response => {
|
var roleMsg = msgData.getHTMLData(response.data);
|
this.list[this.list.length - 1].list = roleMsg.list;
|
this.loading = false;
|
})
|
layerJson.setAddWfsJson();
|
break;
|
case "weaponSystemParameters":
|
mapInfo.setFlyTo({
|
longitude: 120.26907736668211,
|
latitude: 14.791708841800627,
|
height: 1371.1909347746105
|
});
|
|
if (response.weapons) {
|
var name = "";
|
if (response.weapons.indexOf("堤丰") > -1) {
|
name = "堤丰";
|
} else if (response.weapons.indexOf("圣安东尼奥级") > -1) {
|
name = "圣安东尼奥级系统";
|
} else if (response.weapons.indexOf("丹辘级") > -1) {
|
name = "丹辘级系统";
|
} else if (response.weapons.indexOf("C130") > -1) {
|
name = "C130系统";
|
} else if (response.weapons.indexOf("何塞黎刹") > -1) {
|
name = "何塞黎刹级系统";
|
} else if (response.weapons.indexOf("鱼鹰") > -1) {
|
name = "鱼鹰系统";
|
} else if (response.weapons.indexOf("先锋级") > -1) {
|
name = "先锋级系统";
|
} else if (response.weapons.indexOf("支奴干") > -1) {
|
name = "支奴干系统";
|
} else if (response.weapons.indexOf("黑鹰") > -1) {
|
name = "黑鹰系统";
|
}
|
if (name) {
|
const url = "/Data/" + name + ".md";
|
this.getUrlMd(url, null)
|
} else {
|
this.getMsg("ai", response.content);
|
|
}
|
} else {
|
this.getMsg("ai", response.content);
|
}
|
break;
|
case "weaponParameters":
|
var obj = this.getQueryGroupBy("武器", "description", response);
|
this.getQueryEentityDescription(obj);
|
break;
|
|
case "searchTarget":
|
var obj = this.getQueryGroupBy("建筑", "targettype");
|
|
// 实体目标列表_1.html
|
axios.get("/Data/实体目标列表_1.html").then(response => {
|
var roleMsg = msgData.getHTMLData(response.data);
|
this.list[this.list.length - 1].list = roleMsg.list;
|
this.loading = false;
|
})
|
// axios.get("/Data/战场环境.json").then(response=>{
|
// var roleMsg =msgData.getJsonToHtml(response.data);
|
// this.list[this.list.length - 1].list = roleMsg.list;
|
// this.loading = false;
|
// })
|
// var table_head = ["目标类型", "数量"]
|
// this.getQueryEentityGroupBy(obj, "targettype", response, table_head);
|
var list = [
|
{
|
name: "军事目标",
|
color: "#73afff"
|
},
|
{
|
name: "政治目标",
|
color: "#fffd72"
|
},
|
{
|
name: "经济目标",
|
color: "#fabc56"
|
},
|
{
|
name: "社会目标",
|
color: "#272424"
|
},
|
{
|
name: "民宅",
|
color: "#979696"
|
}
|
];
|
layerJson.setQueryByFiledList(list, 0);
|
this.$store.state.showLenged = true;
|
break;
|
case "attackUSAFCommandCenter":
|
var obj = "strikeable = 'TRUE'" + "";
|
layerJson.setQueryByFiled(obj, "#FF0000", false);
|
this.getMsg("ai", "相关信息已在地图模块展示");
|
this.list[this.list.length - 1].sourceValue = "1";
|
break;
|
case "USAFCommandCenterQuery":
|
var obj = "ejfl like '%空军基地%'";
|
layerJson.setQueryExtent2(obj, false);
|
// this.getMsg("ai", "美国空军指挥中心，包含4座弹药库，11座油库，1座机库。");
|
// this.getUrlMd("/Data/美国空军指挥中心.md", null)
|
// this.list[this.list.length - 1].sourceValue = "1";
|
//
|
|
axios.get("/Data/美国空军指挥中心.html").then(response => {
|
var roleMsg = msgData.getHTMLData(response.data);
|
this.list[this.list.length - 1].list = roleMsg.list;
|
this.loading = false;
|
})
|
//
|
//
|
break;
|
case "simulationAttack":
|
var obj = "ejfl like '%空军基地%'";
|
layerJson.setQueryExtent2(obj, true);
|
this.getMsg("ai", "相关信息已在地图模块展示");
|
this.list[this.list.length - 1].sourceValue = "1";
|
break;
|
case "defenceRangeTyphoonSystem":
|
const objName = "堤丰系统"
|
var obj = "weaponname like '%" + objName + "%'" + "";
|
layerJson.setQueryTF2(obj);
|
this.getMsg("ai", "相关信息已在地图模块展示");
|
this.list[this.list.length - 1].sourceValue = "1";
|
this.getUrlMd("/Data/堤丰系统.md", null)
|
break;
|
|
default:
|
mapInfo.init(res);
|
if (response.content) {
|
this.getMsg("ai", response.content);
|
this.list[this.list.length - 1].sourceValue = "2";
|
} else {
|
this.getMsg("ai", "稍后服务。。。");
|
}
|
break;
|
}
|
},
|
|
setRagMoreList(res) {
|
const obj = this.$store.state.ragList;
|
const val_data = obj.filter((item) => {
|
if (item.quest === res) {
|
return item;
|
}
|
});
|
if (val_data.length <= 0) return;
|
|
this.$store.state.ragList = obj;
|
const val_obj = val_data[0];
|
const key = val_obj.index;
|
const val = val_obj.val;
|
this.list[key].list[0].more = false;
|
var flag = 1;
|
var intValTime = setInterval(() => {
|
if (flag >= val.length) {
|
const obj = JSON.parse(JSON.stringify(this.list));
|
this.list = obj;
|
for (var i in obj) {
|
if (obj[i].quest === res) {
|
obj.splice(i, 1);
|
}
|
}
|
|
clearInterval(intValTime);
|
return;
|
}
|
const valitem = val[flag];
|
const roleMsg = msgData.getRagData(valitem, false, "");
|
this.list[key].list.push(roleMsg[0]);
|
flag++;
|
}, 1000);
|
},
|
setRagInterval(flag, index, res) {
|
if (flag < res.length) {
|
const obj = res[flag];
|
this.list[index].list.push(roleMsg[0]);
|
setTimeout(() => {
|
flag++;
|
this.setRagInterval(flag, index, res);
|
}, 1000);
|
} else {
|
return;
|
}
|
},
|
async setV1Fastgpt(res) {
|
const data = await getV1Fastgpt(res);
|
|
const length = this.list.length - 1;
|
|
const obj = data[0].quoteList;
|
var roleMsg = [
|
{
|
type: "text",
|
val: "未查询到相关信息"
|
}
|
];
|
if (obj.length > 0) {
|
this.$store.state.ragList.push({
|
quest: res,
|
index: length,
|
val: obj
|
});
|
roleMsg = msgData.getRagData(obj[0], true, res);
|
}
|
|
this.list[length].list = roleMsg;
|
this.loading = false;
|
},
|
setMarkDownInfo(res) {
|
var roleMsg = msgData.getRole("markDown", res);
|
this.list.push(roleMsg.msg);
|
//
|
},
|
setMapInfo(res) {
|
var msg = "";
|
if (res.type === "erroInfo") {
|
msg = "<div>异常查询</div>" + res.value;
|
}
|
this.getMsg("role", msg);
|
this.setMsgStart(res.value);
|
},
|
getMsg(type, msg) {
|
var roleMsg = msgData.getRole(type, msg);
|
|
if (this.loading) {
|
this.loading = false;
|
|
this.list[this.list.length - 1].list = roleMsg.msg.list;
|
} else {
|
this.list.push(roleMsg.msg);
|
}
|
},
|
setShowMsg() {
|
if (this.msgData.text) {
|
this.setMsgText();
|
} else if (this.msgData.img) {
|
this.setMsgImg();
|
}
|
},
|
setMsgText() {
|
if (this.msgData.text) {
|
msgData.setmsgText(this.msgData.text);
|
}
|
},
|
setMsgImg() {
|
if (this.msgData.img) {
|
var val = msgData.setmsgImg(this.msgData.img);
|
|
this.list.push(val);
|
}
|
},
|
setMsgtab() {
|
if (this.msgData.tab) {
|
var val = msgData.setmsgtab(this.msgData.tab);
|
|
this.list.push(val);
|
}
|
},
|
setLoading() {
|
const loader = msgData.getLoader();
|
this.list.push(loader);
|
this.loading = true;
|
},
|
getLoadingFlag() {
|
if (this.list.length == 0) {
|
return;
|
}
|
var load = this.list[this.list.length - 1].text;
|
if ((load.indexOf = "loading" > -1)) {
|
return true;
|
}
|
return false;
|
}
|
}
|
};
|
</script>
|
<style scoped>
|
/* .rightSlot {
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
flex-direction: column;
|
} */
|
.chartBox {
|
width: 100%;
|
height: 100vh;
|
background: black;
|
position: relataive;
|
}
|
</style>
|
<style scoped>
|
.divboder {
|
display: flex;
|
}
|
|
.tabTable {
|
width: 100%;
|
min-width: 25vh !important;
|
text-align: center;
|
border: 1px solid #c1c1c1;
|
}
|
|
.tabTable .tabHeader {
|
height: 32px;
|
background: linear-gradient(180deg, #28a9de 0%, #1987c2 100%);
|
border-radius: 0px 0px 0px 0px;
|
color: white;
|
}
|
|
.tabTable .tabBody tr {
|
height: 64px;
|
border-bottom: 1px solid #c1c1c1;
|
}
|
|
.tabTable .tabBody td:nth-child(2) {
|
height: 64px;
|
word-break: break-all;
|
word-wrap: break-word;
|
text-align: center;
|
width: 68%;
|
padding: 0px 1%;
|
line-height: 30px;
|
border-bottom: 1px solid #c1c1c1;
|
}
|
|
@keyframes siz {
|
from {
|
width: 0;
|
}
|
|
to {
|
width: 100%;
|
}
|
}
|
|
.msgText {
|
width: 300px;
|
word-break: break-all;
|
word-wrap: break-word;
|
overflow: hidden;
|
white-space: normal;
|
letter-spacing: 0.15em;
|
animation: siz 3s steps(60) forwards;
|
}
|
|
.loading {
|
margin: 20px;
|
position: relative;
|
width: 1px;
|
height: 1px;
|
}
|
|
.loading:before,
|
.loading:after {
|
position: absolute;
|
display: inline-block;
|
width: 15px;
|
height: 15px;
|
content: "";
|
border-radius: 100%;
|
background-color: #000;
|
}
|
|
.loading:before {
|
left: -15px;
|
animation: ball-pulse infinite 0.75s -0.4s cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
}
|
|
.loading:after {
|
right: -15px;
|
animation: ball-pulse infinite 0.75s cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
}
|
|
@keyframes ball-pulse {
|
0% {
|
transform: scale(1);
|
opacity: 1;
|
}
|
|
50% {
|
transform: scale(0.1);
|
opacity: 0.6;
|
}
|
|
100% {
|
transform: scale(1);
|
opacity: 1;
|
}
|
}
|
</style>
|
