|
@@ -6,22 +6,32 @@
|
|
|
<div v-for="(msg, index) in messages" :key="index" class="message" :class="msg.type">
|
|
|
<div v-if="msg.type === 'user'" class="bubble">{{ msg.text }}</div>
|
|
|
<div v-if="msg.type === 'system'" class="bubble answer">
|
|
|
- <div class="think" v-if="!msg.text.name">
|
|
|
+ <div class="think">
|
|
|
思考中<el-icon><ArrowDown /></el-icon>
|
|
|
</div>
|
|
|
- <div class="header" v-html="msg.text.header"></div>
|
|
|
- <div class="divider"></div>
|
|
|
+ <div class="header" v-html="msg.text.header" :class="{'main-text': !msg.text.content}"></div>
|
|
|
+ <div class="divider" v-if="msg.text.content"></div>
|
|
|
<div class="content" v-html="msg.text.content"></div>
|
|
|
- <div class="table-wrap" v-if="msg.text.name === '种植面积'">
|
|
|
+ <div class="table-wrap" v-if="msg.text.name === '2024年广东省各市的稻谷播种面积?' && msg.loadEnd">
|
|
|
<el-table :data="tableData" border style="width: 100%">
|
|
|
<el-table-column prop="city" label="市" width="100" />
|
|
|
- <el-table-column prop="area" label="2024年水稻种植面积" width="320">
|
|
|
+ <el-table-column prop="area" label="2024年稻谷播种面积">
|
|
|
<template #default="scope">
|
|
|
{{ scope.row.area }}亩
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
+ <div class="table-wrap" v-if="msg.text.name === '花期统防统治报表,有没有与农资对接' && msg.loadEnd">
|
|
|
+ <el-table :data="tableData2" border style="width: 100%">
|
|
|
+ <el-table-column prop="name" label="企业名称" />
|
|
|
+ <el-table-column prop="area" label="覆盖范围" show-overflow-tooltip />
|
|
|
+ <el-table-column prop="step" label="完成进度" show-overflow-tooltip />
|
|
|
+ <el-table-column prop="rate" label="系统/信用评分" show-overflow-tooltip />
|
|
|
+ <el-table-column prop="farmRate" label="农户评价" show-overflow-tooltip />
|
|
|
+ <el-table-column prop="result" label="成效" show-overflow-tooltip />
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div v-if="msg.type === 'real'" class="bubble answer">
|
|
|
<div class="think" v-if="!msg.text.name">
|
|
@@ -30,16 +40,6 @@
|
|
|
<div class="header" v-html="deepSeekAsk.markdownToHtml(msg.text.header)"></div>
|
|
|
<div class="divider"></div>
|
|
|
<div class="content" v-html="deepSeekAsk.markdownToHtml(msg.text.content)"></div>
|
|
|
- <div class="table-wrap" v-if="msg.text.name === '种植面积'">
|
|
|
- <el-table :data="tableData" border style="width: 100%">
|
|
|
- <el-table-column prop="city" label="市" width="100" />
|
|
|
- <el-table-column prop="area" label="2024年水稻种植面积" width="320">
|
|
|
- <template #default="scope">
|
|
|
- {{ scope.row.area }}亩
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
</div>
|
|
|
|
|
|
<div v-if="msg.type === 'auto'" class="system auto">
|
|
@@ -50,15 +50,9 @@
|
|
|
<div class="ask-list">
|
|
|
<li
|
|
|
class="ask-item cursor-pointer"
|
|
|
- @click="askText('2024年广东省各市的水稻种植面积')"
|
|
|
+ @click="askText('2024年广东省各市的稻谷播种面积?')"
|
|
|
>
|
|
|
- 2024年广东省各市的水稻种植面积
|
|
|
- </li>
|
|
|
- <li
|
|
|
- class="ask-item cursor-pointer"
|
|
|
- @click="askText('2024年广东省各市的水稻种植面积排行')"
|
|
|
- >
|
|
|
- 2024年广东省各市的水稻种植面积排行
|
|
|
+ 2024年广东省各市的稻谷播种面积?
|
|
|
</li>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -132,27 +126,84 @@ const messages = ref([]);
|
|
|
const isProcessing = ref(false); // 控制是否在处理消息
|
|
|
|
|
|
const tableData = ref([
|
|
|
- { city: '广州市', area: 10000 },
|
|
|
- { city: '佛山市', area: 900 },
|
|
|
- { city: '惠州市', area: 856 },
|
|
|
- { city: '茂名市', area: 789 },
|
|
|
+ { city: '广州', area: 360091 },
|
|
|
+ { city: '深圳', area: 14726 },
|
|
|
+ { city: '珠海', area: 66670 },
|
|
|
+ { city: '汕头', area: 690567 },
|
|
|
+ { city: '佛山', area: 104095 },
|
|
|
+ { city: '韶关', area: 1534904 },
|
|
|
+ { city: '河源', area: 1836469 },
|
|
|
+ { city: '梅州', area: 2428360 },
|
|
|
+ { city: '惠州', area: 1275493 },
|
|
|
+ { city: '汕尾', area: 1033786 },
|
|
|
+ { city: '东莞', area: 24106 },
|
|
|
+ { city: '中山', area: 37709 },
|
|
|
+ { city: '江门', area: 2523802 },
|
|
|
+ { city: '阳江', area: 1604316 },
|
|
|
+ { city: '湛江', area: 3357751 },
|
|
|
+ { city: '茂名', area: 3151002 },
|
|
|
+ { city: '肇庆', area: 2521029 },
|
|
|
+ { city: '清远', area: 1832838 },
|
|
|
+ { city: '潮州', area: 481617 },
|
|
|
+ { city: '揭阳', area: 1217258 },
|
|
|
+ { city: '云浮', area: 1317616 },
|
|
|
+])
|
|
|
+
|
|
|
+const tableData2 = ref([
|
|
|
+ {name: "天合股份", area: "广东省及周边省份,100家配送中心", step: "2024年上半年服务243.71万亩,带动增收1.11亿元;2025年目标完成率约24%", rate: "未明确评分", farmRate: "服务超6万户,节本增收显著", result: "绿色农资全覆盖,建立“耕、种、管、收”全程服务体系"},
|
|
|
+ {name: "大炎农业", area: "广东省及周边", step: "承担17.84万亩水稻、6.17万亩蔬菜物化补贴;带动654户农户销售226.1吨", rate: "绿色补贴覆盖率100%", farmRate: "合作社带动增收,农户组织化程度提高", result: "助农销售1.3亿元,建立稳定增收渠道"},
|
|
|
+ {name: "美荔公司", area: "广东省及周边", step: "完成30万亩次测土配方施肥目标", rate: "A级信用评定", farmRate: "守信经营,服务标准化受认可", result: "保障农资质量安全,推动化肥减量增效,覆盖本地10家A级企业"},
|
|
|
])
|
|
|
|
|
|
const steps = [
|
|
|
- { type: "auto", text: { header: "您好,飞鸟智慧种植大脑是您的私人管家" } },
|
|
|
+ { type: "auto", text: { header: "您好,飞鸟智慧种植大脑是您的私人管家" }, loadEnd: false },
|
|
|
+ {
|
|
|
+ type: "ask",
|
|
|
+ text: {
|
|
|
+ askHeader: "当前高州的作物分布",
|
|
|
+ askContent: ["当前高州的作物分布",],
|
|
|
+ },
|
|
|
+ loadEnd: false
|
|
|
+ },
|
|
|
{
|
|
|
type: "ask",
|
|
|
text: {
|
|
|
- askHeader: "猜您想问",
|
|
|
- askContent: ["2024年广东省各市的水稻种植面积", "2024年广东省各市的水稻种植面积变化"],
|
|
|
+ askHeader: "当前区域荔枝有什么生长风险?",
|
|
|
+ askContent: ["当前区域荔枝有什么生长风险?"],
|
|
|
},
|
|
|
+ loadEnd: false
|
|
|
},
|
|
|
{
|
|
|
type: "ask",
|
|
|
text: {
|
|
|
- askHeader: "猜您想问",
|
|
|
- askContent: ["荔枝出现花带叶怎么办?", "荔枝抽梢具体做什么农事呢?"],
|
|
|
+ askHeader: "当前区域哪些有荔枝地块有病虫害",
|
|
|
+ askContent: ["当前区域哪些有荔枝地块有病虫害"],
|
|
|
},
|
|
|
+ loadEnd: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "ask",
|
|
|
+ text: {
|
|
|
+ askHeader: "现在哪些地方有农情需求",
|
|
|
+ askContent: ["现在哪些地方有农情需求"],
|
|
|
+ },
|
|
|
+ loadEnd: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "ask",
|
|
|
+ text: {
|
|
|
+ askHeader: "哪些地方有植保机",
|
|
|
+ askContent: ["哪些地方有植保机"],
|
|
|
+ },
|
|
|
+ loadEnd: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "ask",
|
|
|
+ text: {
|
|
|
+ askHeader: "花期统防统治报表,有没有与农资对接",
|
|
|
+ askContent: ["花期统防统治报表,有没有与农资对接"],
|
|
|
+ },
|
|
|
+ loadEnd: false
|
|
|
},
|
|
|
];
|
|
|
|
|
@@ -164,8 +215,8 @@ const triggerNextStep = () => {
|
|
|
steps[stepIndex.value].type,
|
|
|
steps[stepIndex.value].text,
|
|
|
() => {
|
|
|
- console.log("stepIndex.value === 76574", stepIndex.value);
|
|
|
isProcessing.value = false;
|
|
|
+ // steps[stepIndex.value].loadEnd = true
|
|
|
}
|
|
|
);
|
|
|
stepIndex.value++;
|
|
@@ -194,6 +245,10 @@ const loadState = () => {
|
|
|
|
|
|
const toMapLayer = (name) => {
|
|
|
eventBus.emit("chat:showMapLayer", name)
|
|
|
+ askText(name)
|
|
|
+ // addSystemReply('system', {header: name, content: '', name}, () => {
|
|
|
+ // steps[stepIndex.value].loadEnd = true
|
|
|
+ // });
|
|
|
}
|
|
|
|
|
|
const askText = (val) => {
|
|
@@ -224,7 +279,8 @@ const sendMessage = () => {
|
|
|
chat.map((item) => {
|
|
|
if (userText.indexOf(item.name) !== -1) {
|
|
|
addSystemReply('system', {header: item.header, content: item.content, name: item.name}, () => {
|
|
|
- console.log("sendMessage eeeeee",);
|
|
|
+ // steps[stepIndex.value].loadEnd = true
|
|
|
+ messages.value[messages.value.length - 1].loadEnd = true
|
|
|
setTimeout(triggerNextStep, 2000);
|
|
|
});
|
|
|
isSearch = false;
|
|
@@ -261,9 +317,8 @@ const addSystemReply = (type = "system", textObject, callback) => {
|
|
|
isProcessing.value = true
|
|
|
let currentHeader = "";
|
|
|
let currentContent = "";
|
|
|
- console.log("stepIndex.value", type);
|
|
|
if (type === "ask") {
|
|
|
- messages.value.push({ text: { header: textObject.askHeader, content: textObject.askContent }, type });
|
|
|
+ messages.value.push({ text: { header: textObject.askHeader, content: textObject.askContent, }, type });
|
|
|
} else {
|
|
|
messages.value.push({ text: { header: currentHeader, content: currentContent, name: textObject.name }, type });
|
|
|
}
|
|
@@ -288,16 +343,11 @@ const addSystemReply = (type = "system", textObject, callback) => {
|
|
|
contentIndex++;
|
|
|
} else {
|
|
|
clearInterval(contentInterval);
|
|
|
- console.log("ddddddddone", stepIndex.value);
|
|
|
- // if (stepIndex.value === 2 || stepIndex.value === 6) {
|
|
|
-
|
|
|
- // nextTick(() => {
|
|
|
- // setTimeout(triggerNextStep, 1000);
|
|
|
- // });
|
|
|
- // }
|
|
|
+ messages.value[messages.value.length - 1].loadEnd = true
|
|
|
+ scrollToBottom();
|
|
|
callback && callback(); // 回复完成后解锁输入
|
|
|
}
|
|
|
- }, 50);
|
|
|
+ }, 5);
|
|
|
} else {
|
|
|
callback && callback(); // 如果 content 为空,直接解锁输入
|
|
|
}
|
|
@@ -371,6 +421,10 @@ onMounted(() => {
|
|
|
// }, 200)
|
|
|
});
|
|
|
|
|
|
+eventBus.on("chat:hideMapLayer", () => {
|
|
|
+ setTimeout(triggerNextStep, 2000);
|
|
|
+})
|
|
|
+
|
|
|
// **滚动到底部**
|
|
|
const scrollToBottom = () => {
|
|
|
nextTick(() => {
|
|
@@ -428,6 +482,9 @@ const scrollToBottom = () => {
|
|
|
}
|
|
|
}
|
|
|
.table-wrap {
|
|
|
+ padding-top: 12px;
|
|
|
+ width: 100%;
|
|
|
+ overflow: auto;
|
|
|
::v-deep {
|
|
|
.el-table .el-table__header th.el-table__cell {
|
|
|
background: #3B3B3B !important;
|
|
@@ -509,6 +566,8 @@ const scrollToBottom = () => {
|
|
|
}
|
|
|
.bubble {
|
|
|
padding: 16px 12px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ max-width: 100%;
|
|
|
border-radius: 8px;
|
|
|
// max-width: 60%;
|
|
|
background: rgba(255, 212, 137, 0.1);
|
|
@@ -520,6 +579,9 @@ const scrollToBottom = () => {
|
|
|
color: #999999;
|
|
|
// padding-bottom: 8px;
|
|
|
}
|
|
|
+ .main-text {
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
.content {
|
|
|
color: #ffffff;
|
|
|
}
|
|
@@ -537,7 +599,8 @@ const scrollToBottom = () => {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
-.system .bubble {
|
|
|
+.system .bubble,
|
|
|
+.real .bubble {
|
|
|
background: #2F2F2F;
|
|
|
color: #fff;
|
|
|
border-radius: 2px 16px 16px 16px;
|
|
@@ -591,7 +654,8 @@ const scrollToBottom = () => {
|
|
|
}
|
|
|
}
|
|
|
.file-icon {
|
|
|
- width: 16px;
|
|
|
+ // width: 16px;
|
|
|
+ height: 16px;
|
|
|
}
|
|
|
.send-icon {
|
|
|
margin-left: 8px;
|