fix: 八角问答2

src/views/warningHome/components/chat_components/index.vue

@@ -9,20 +9,24 @@
                         <div class="think">
                             思考中<el-icon><ArrowDown /></el-icon>
                         </div>
-                        <div class="header" v-html="msg.text.header" :class="{'main-text': !msg.text.content}"></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 === '2024年广东省各市的稻谷播种面积？' && msg.loadEnd">
+                        <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年稻谷播种面积">
-                                    <template #default="scope">
-                                        {{ scope.row.area  }}亩
-                                    </template>
+                                    <template #default="scope"> {{ scope.row.area }}亩 </template>
                                 </el-table-column>
                             </el-table>
                         </div>
-                        <div class="table-wrap" v-if="msg.text.name === '花期统防统治报表，有没有与农资对接' && msg.loadEnd">
+                        <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 />
@@ -35,9 +39,7 @@
                             <el-table :data="tableData3" border style="width: 100%">
                                 <el-table-column prop="name" label="农作物类型" />
                                 <el-table-column prop="area" label="播种面积（亩）">
-                                    <template #default="scope">
-                                        {{ scope.row.area  }}亩
-                                    </template>
+                                    <template #default="scope"> {{ scope.row.area }}亩 </template>
                                 </el-table-column>
                             </el-table>
                         </div>
@@ -54,17 +56,17 @@
                     <div v-if="msg.type === 'auto'" class="system auto">
                         <div class="bubble">
                             {{ msg.text.header }}
-                            <!-- <div>
+                            <div>
                                 <div class="ask-title">你可以试着问我</div>
                                 <div class="ask-list">
                                     <li
                                         class="ask-item cursor-pointer"
-                                        @click="askText('2024年广东省各市的稻谷播种面积？')"
+                                        @click="toMapLayer(askQues.text.askContent[0], askQues.text)"
                                     >
-                                    2024年广东省各市的稻谷播种面积？
+                                        当前区域八角有什么生长风险？
                                     </li>
                                 </div>
-                            </div> -->
+                            </div>
                         </div>
                     </div>
 
@@ -73,11 +75,18 @@
                         <div class="bubble">
                             <div class="ask-title">你可以试着问我</div>
                             <div class="ask-list">
-                                <div class="to-map" v-for="(ask, askI) in msg.text.content" :key="askI" @click="toMapLayer(ask, msg.text)">
+                                <div
+                                    class="to-map"
+                                    v-for="(ask, askI) in msg.text.content"
+                                    :key="askI"
+                                    @click="toMapLayer(ask, msg.text)"
+                                >
                                     <li>
                                         {{ ask }}
                                     </li>
-                                    <div class="go-icon"><el-icon><ArrowRight /></el-icon></div>
+                                    <div class="go-icon">
+                                        <el-icon><ArrowRight /></el-icon>
+                                    </div>
                                 </div>
                             </div>
                         </div>
@@ -106,7 +115,12 @@
                         </div>
                         <div class="btn-r">
                             <img class="file-icon" src="@/assets/images/warningHome/chat/file.png" />
-                            <img class="send-icon" @click="sendMessage" src="@/assets/images/warningHome/chat/send.png" alt="send">
+                            <img
+                                class="send-icon"
+                                @click="sendMessage"
+                                src="@/assets/images/warningHome/chat/send.png"
+                                alt="send"
+                            />
                         </div>
                     </div>
                 </div>
@@ -135,73 +149,147 @@ const messages = ref([]);
 const isProcessing = ref(false); // 控制是否在处理消息
 
 const tableData = ref([
-    { 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 },
-])
+    { 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: "此次花期统防统治接收任务28个，完成进度64%。", rate: "90分", farmRate: "89分"},
-    {name: "大*农业", area: "广东省及周边省份", step: "此次花期统防统治接收任务17个，完成进度80%。", rate: "95分", farmRate: "92分"},
-    {name: "美*公司", area: "广东省及周边省份", step: "此次花期统防统治接收任务13个，完成进度59%。", rate: "89分", farmRate: "90分"},
-    {name: "盛*农业", area: "广东省、广西省，50家配送中心", step: "此次花期统防统治接收任务25个，完成进度72%", rate: "91分", farmRate: "88分"},
-    {name: "宝*公司", area: "广东省及周边省份", step: "此次花期统防统治接收任务20个，完成进度67%", rate: "90分", farmRate: "92分"},
-    {name: "优*农业", area: "广东省、福建省，30家配送中心", step: "此次花期统防统治接收任务15个，完成进度85%", rate: "94分", farmRate: "93分"},
-    {name: "新*科技", area: "广东省及周边省份", step: "此次花期统防统治接收任务18个，完成进度70%", rate: "87分", farmRate: "86分"},
-    {name: "海*农资", area: "广东省及周边省份", step: "此次花期统防统治接收任务21个，完成进度91%", rate: "96分", farmRate: "94分"},
-    {name: "丰*公司", area: "广东省、海南省", step: "此次花期统防统治接收任务20个，完成进度68%", rate: "88分", farmRate: "85分"},
-    {name: "绿*农业", area: "广东省、广西省，70家配送中心", step: "此次花期统防统治接收任务30个，完成进度75%", rate: "91分", farmRate: "93分"},
-    {name: "亮*集团", area: "广东省、云南省 ", step: "此次花期统防统治接收任务16个，完成进度70%", rate: "91分", farmRate: "89分"},
-])
+    {
+        name: "天*股份",
+        area: "广东省及周边省份，100家配送中心",
+        step: "此次花期统防统治接收任务28个，完成进度64%。",
+        rate: "90分",
+        farmRate: "89分",
+    },
+    {
+        name: "大*农业",
+        area: "广东省及周边省份",
+        step: "此次花期统防统治接收任务17个，完成进度80%。",
+        rate: "95分",
+        farmRate: "92分",
+    },
+    {
+        name: "美*公司",
+        area: "广东省及周边省份",
+        step: "此次花期统防统治接收任务13个，完成进度59%。",
+        rate: "89分",
+        farmRate: "90分",
+    },
+    {
+        name: "盛*农业",
+        area: "广东省、广西省，50家配送中心",
+        step: "此次花期统防统治接收任务25个，完成进度72%",
+        rate: "91分",
+        farmRate: "88分",
+    },
+    {
+        name: "宝*公司",
+        area: "广东省及周边省份",
+        step: "此次花期统防统治接收任务20个，完成进度67%",
+        rate: "90分",
+        farmRate: "92分",
+    },
+    {
+        name: "优*农业",
+        area: "广东省、福建省，30家配送中心",
+        step: "此次花期统防统治接收任务15个，完成进度85%",
+        rate: "94分",
+        farmRate: "93分",
+    },
+    {
+        name: "新*科技",
+        area: "广东省及周边省份",
+        step: "此次花期统防统治接收任务18个，完成进度70%",
+        rate: "87分",
+        farmRate: "86分",
+    },
+    {
+        name: "海*农资",
+        area: "广东省及周边省份",
+        step: "此次花期统防统治接收任务21个，完成进度91%",
+        rate: "96分",
+        farmRate: "94分",
+    },
+    {
+        name: "丰*公司",
+        area: "广东省、海南省",
+        step: "此次花期统防统治接收任务20个，完成进度68%",
+        rate: "88分",
+        farmRate: "85分",
+    },
+    {
+        name: "绿*农业",
+        area: "广东省、广西省，70家配送中心",
+        step: "此次花期统防统治接收任务30个，完成进度75%",
+        rate: "91分",
+        farmRate: "93分",
+    },
+    {
+        name: "亮*集团",
+        area: "广东省、云南省 ",
+        step: "此次花期统防统治接收任务16个，完成进度70%",
+        rate: "91分",
+        farmRate: "89分",
+    },
+]);
 
 const tableData3 = ref([
-    {name: "水稻", area: "839884"},
-    {name: "玉米", area: "16079"},
-    {name: "番薯", area: "39467"},
-    {name: "花生", area: "121093"},
-    {name: "中草药材", area: "72357"},
-    {name: "蔬菜", area: "407695"},
-    {name: "荔枝", area: "590322"},
-    {name: "龙眼", area: "324390"},
-    {name: "香蕉", area: "258688"},
-    {name: "柚子", area: "14527"},
-    {name: "黄皮", area: "48020"},
-])
-
+    { name: "水稻", area: "839884" },
+    { name: "玉米", area: "16079" },
+    { name: "番薯", area: "39467" },
+    { name: "花生", area: "121093" },
+    { name: "中草药材", area: "72357" },
+    { name: "蔬菜", area: "407695" },
+    { name: "荔枝", area: "590322" },
+    { name: "龙眼", area: "324390" },
+    { name: "香蕉", area: "258688" },
+    { name: "柚子", area: "14527" },
+    { name: "黄皮", area: "48020" },
+]);
+
+const askQues = {
+    type: "ask",
+    text: {
+        mapName: "分散种植",
+        askHeader: "当前区域八角有什么生长风险？",
+        askContent: ["当前区域八角有什么生长风险？"],
+    },
+};
 const steps = [
     { type: "auto", text: { header: "您好，飞鸟智慧种植大脑是您的私人管家" } },
+    // {
+    //     type: "ask",
+    //     text: {
+    //         mapName: "分散种植",
+    //         askHeader: "当前区域八角有什么生长风险？",
+    //         askContent: ["当前区域八角有什么生长风险？",],
+    //     },
+    // },
     {
         type: "ask",
         text: {
-            mapName: "分散种植",
-            askHeader: "当前区域八角有什么生长风险？",
-            askContent: ["当前区域八角有什么生长风险？",],
-        },
-    },
-    {
-        type: "ask",
-        text: {
-            mapName: "爆花态势",
-            askHeader: "当前区域荔枝有什么生长风险？",
-            askContent: ["当前区域荔枝有什么生长风险？"],
+            mapName: "病虫态势",
+            askHeader: "当前八角区域有哪些地块病虫害风险较高",
+            askContent: ["当前八角区域有哪些地块病虫害风险较高"],
         },
     },
     {
@@ -238,18 +326,13 @@ const steps = [
     },
 ];
 
-
 const stepIndex = ref(0);
 const triggerNextStep = () => {
     if (stepIndex.value < steps.length) {
-        addSystemReply(
-            steps[stepIndex.value].type,
-            steps[stepIndex.value].text,
-            () => {
-                isProcessing.value = false;
-                // steps[stepIndex.value].loadEnd = true
-            }
-        );
+        addSystemReply(steps[stepIndex.value].type, steps[stepIndex.value].text, () => {
+            isProcessing.value = false;
+            // steps[stepIndex.value].loadEnd = true
+        });
         stepIndex.value++;
         saveState();
         scrollToBottom();
@@ -275,12 +358,12 @@ const loadState = () => {
 };
 
 const toMapLayer = (name, text) => {
-    askText(name)
-    eventBus.emit("chat:showMapLayer", {name, mapName: text.mapName})
+    askText(name);
+    eventBus.emit("chat:showMapLayer", { name, mapName: text.mapName });
     // addSystemReply('system', {header: name, content: '', name}, () => {
     //     steps[stepIndex.value].loadEnd = true
     // });
-}
+};
 
 const askText = (val) => {
     userInput.value = val;
@@ -308,9 +391,9 @@ const sendMessage = () => {
     console.log("userText", userText);
     chat.map((item) => {
         if (userText.indexOf(item.name) !== -1) {
-            addSystemReply('system', {header: item.header, content: item.content, name: item.name}, () => {
+            addSystemReply("system", { header: item.header, content: item.content, name: item.name }, () => {
                 // steps[stepIndex.value].loadEnd = true
-                messages.value[messages.value.length - 1].loadEnd = true
+                messages.value[messages.value.length - 1].loadEnd = true;
                 setTimeout(triggerNextStep, 2000);
             });
             isSearch = false;
@@ -342,19 +425,22 @@ const sendMessage = () => {
 
 // **逐字显示系统回复（header 和 content）**
 const addSystemReply = (type = "system", textObject, callback) => {
-    isProcessing.value = true
+    isProcessing.value = true;
     let currentHeader = "";
     let currentContent = "";
     if (type === "ask") {
-        messages.value.push({ text: { header: textObject.askHeader, content: textObject.askContent, mapName: textObject.mapName }, type });
+        messages.value.push({
+            text: { header: textObject.askHeader, content: textObject.askContent, mapName: textObject.mapName },
+            type,
+        });
     } else {
         messages.value.push({ text: { header: currentHeader, content: currentContent, name: textObject.name }, type });
     }
     saveMessages();
     scrollToBottom();
 
-    const content = textObject.content
-    const header = textObject.header
+    const content = textObject.content;
+    const header = textObject.header;
 
     // **逐字显示 content**
     const showContent = () => {
@@ -371,7 +457,7 @@ const addSystemReply = (type = "system", textObject, callback) => {
                     contentIndex++;
                 } else {
                     clearInterval(contentInterval);
-                    messages.value[messages.value.length - 1].loadEnd = true
+                    messages.value[messages.value.length - 1].loadEnd = true;
                     scrollToBottom();
                     callback && callback(); // 回复完成后解锁输入
                 }
@@ -451,7 +537,7 @@ onMounted(() => {
 
 eventBus.on("chat:hideMapLayer", () => {
     // setTimeout(triggerNextStep, 2000);
-})
+});
 
 // **滚动到底部**
 const scrollToBottom = () => {
@@ -479,7 +565,7 @@ const scrollToBottom = () => {
         box-sizing: border-box;
         .chat-title {
             border-radius: 8px 8px 0 0;
-            background: #2F2F2F;
+            background: #2f2f2f;
             text-align: center;
             padding: 10px 0;
         }
@@ -498,7 +584,6 @@ const scrollToBottom = () => {
     flex: 1;
     overflow-y: auto;
     padding: 16px;
-
 }
 .message {
     display: flex;
@@ -515,18 +600,18 @@ const scrollToBottom = () => {
     overflow: auto;
     ::v-deep {
         .el-table .el-table__header th.el-table__cell {
-            background: #3B3B3B !important;
+            background: #3b3b3b !important;
             border-bottom-color: #555555;
             border-right-color: #555555;
         }
         .el-table .el-table__body tr:hover > td {
             background-color: transparent !important;
-            }
+        }
         .el-table {
             color: #fff;
         }
         .el-table tr {
-            background: #2F2F2F;
+            background: #2f2f2f;
             // pointer-events: none;
         }
         .el-table thead {
@@ -535,8 +620,12 @@ const scrollToBottom = () => {
         .el-table td.el-table__cell {
             border-color: #555555;
         }
-        .el-table--border .el-table__inner-wrapper:after, .el-table--border:after, .el-table--border:before, .el-table__inner-wrapper:before,
-        .el-table__border-bottom-patch, .el-table__border-left-patch{
+        .el-table--border .el-table__inner-wrapper:after,
+        .el-table--border:after,
+        .el-table--border:before,
+        .el-table__inner-wrapper:before,
+        .el-table__border-bottom-patch,
+        .el-table__border-left-patch {
             background-color: #555555;
         }
     }
@@ -553,12 +642,12 @@ const scrollToBottom = () => {
     padding-bottom: 10px;
 }
 .ask-list {
-    color: #55E5C6;
+    color: #55e5c6;
 }
 .to-map {
     display: flex;
     justify-content: space-between;
-    background: #3C3C3C;
+    background: #3c3c3c;
     padding: 6px 8px;
     border-radius: 6px;
     cursor: pointer;
@@ -586,7 +675,7 @@ const scrollToBottom = () => {
 .link {
     display: flex;
     .header-link {
-        color: #55E5C6;
+        color: #55e5c6;
         display: flex;
         align-items: baseline;
         text-decoration: underline;
@@ -602,7 +691,7 @@ const scrollToBottom = () => {
     border-radius: 8px;
     // max-width: 60%;
     background: rgba(255, 212, 137, 0.1);
-    color: #55E5C6;
+    color: #55e5c6;
     border-radius: 16px 2px 16px 16px;
     line-height: 24px;
     font-size: 14px;
@@ -632,7 +721,7 @@ const scrollToBottom = () => {
 }
 .system .bubble,
 .real .bubble {
-    background: #2F2F2F;
+    background: #2f2f2f;
     color: #fff;
     border-radius: 2px 16px 16px 16px;
 }
@@ -652,7 +741,7 @@ const scrollToBottom = () => {
     display: flex;
     flex-direction: column;
     padding: 10px;
-    background: #2F2F2F;
+    background: #2f2f2f;
     border-radius: 16px;
     /* border-top: 1px solid #ddd; */
     ::v-deep {

src/views/warningHome/map/alarmLayer.js

@@ -37,7 +37,6 @@ class AlarmLayer {
         eventBus.on("alarmList:changeMapLayer",({url, type,name}) => {
             that.plantLayer && that.kmap.map.removeLayer(that.plantLayer.layer)
             that.nameStr = name
-            console.log('sdadas',url);
             that.initWarningLayer(url, type,name)
         })
         // 种植面积，预估产量，底图切换