<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";
|
import agentMessage from "./agentMessage.js";
|
import mapServer from '../../assets/js/map/mapServer';
|
import mapRoam from '../../assets/js/map/mapRoam.js'
|
import mapImg from '../../assets/js/map/mapImg.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;
|
}
|
modelLayer.init();
|
setTimeout(() => {
|
this.getMsg("ai", "您好，请输入指令");
|
}, 1000);
|
|
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();
|
this.$nextTick(()=>{
|
this.setMsgStart(msg);
|
})
|
},
|
async setMsgStart(res) {
|
this.$store.state.showImageUrl = false
|
const data = await getAIMessage(res);
|
},
|
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>
|
