语音识别，发送

src/views/aiModel/index.vue

@@ -1,44 +1,49 @@
 <template>
   <div class="counsel-container">
     <div class="counsel-header">
-      <span>会话</span>
+      <span>会话<i class="ai el-icon-chat-dot-round"></i></span>
     </div>
-    <div class="counsel-left flex">
-      <div class="header-img">
-        <img src="/static/images/aiModel/kefu.png" />
-      </div>
-      <div class="content">
-        <span>Hi,有问题您可以这样问我:</span>
-        <span class="high" @click="sendDefault">{{ defaultMsg }}</span>
-      </div>
-    </div>
-
-    <!--右侧-->
-    <div v-for="(item, index) in questionList" :key="index">
-      <!--右侧-->
-      <div class="counsel-right flex" v-if="item.type == 0">
-        <div class="content">
-          <span>{{ item.content }}</span>
-        </div>
-        <div class="header-img">
-          <img src="/static/images/aiModel/default.png" />
-        </div>
-      </div>
-      <!--左侧-->
-      <div class="counsel-left flex" v-else>
+    <div class="counsel-chats">
+      <div class="counsel-left flex">
         <div class="header-img">
           <img src="/static/images/aiModel/kefu.png" />
         </div>
         <div class="content">
-          <span v-if="item.type" class="tit">参考意见</span>
-          <span :class="{ high: item.type }" @click="onClick(item)">
-            {{ item.content }}
-          </span>
+          <span>Hi,有问题您可以这样问我:</span>
+          <span class="high" @click="sendDefault">{{ defaultMsg }}</span>
         </div>
       </div>
+      <!--右侧-->
+      <div v-for="(item, index) in questionList" :key="index">
+        <!--右侧-->
+        <div class="counsel-right flex" v-if="item.type == 0">
+          <div class="content">
+            <span>{{ item.content }}</span>
+          </div>
+          <div class="header-img">
+            <img src="/static/images/aiModel/default.png" />
+          </div>
+        </div>
+        <!--左侧-->
+        <div class="counsel-left flex" v-else>
+          <div class="header-img">
+            <img src="/static/images/aiModel/kefu.png" />
+          </div>
+          <div class="content">
+            <span v-if="item.type" class="tit">参考意见</span>
+            <span :class="{ high: item.type }" @click="onClick(item)">
+              {{ item.content }}
+            </span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="voice" v-if="spdisabled">
+      <div>正在识别</div>
+      <div class="noise"></div>
     </div>
     <div class="searchBtom">
-      <div v-if="spdisabled">正在识别...</div>
       <i class="el-icon-microphone icon" title="按住说话" @click="voice"></i>
       <el-input
         clearable
@@ -47,11 +52,11 @@
         class="search"
         placeholder="请输入问题"
       ></el-input>
-      <i
+      <div
         class="el-icon-s-promotion icon sendIcon"
         :class="sendContent ? 'ok' : 'no'"
         @click="send"
-      ></i>
+      ></div>
     </div>
   </div>
 </template>
@@ -134,7 +139,7 @@ export default {
       }).then((mres) => {
         if (mres.status == 200) {
           if (mres.data.type == "selectLand") {
-            this.questionList.push({ type: 1, content: "分析中...请稍等" });
+            this.questionList.push({ content: "分析中...请稍等" });
             const loading = this.$loading({
               lock: true,
               text: "分析中",
@@ -192,7 +197,7 @@ export default {
     display: flex;
     align-items: center;
     padding: 20px;
-    font-size: 12px;
+    font-size: 16px;
     color: #fff;
     border-bottom: 1px solid #1f4099;
   }
@@ -201,63 +206,85 @@ export default {
     display: block;
     text-align: center;
     margin-bottom: 20px;
-
     color: #999999;
     line-height: 40px;
   }
-  .header-img {
-    // flex: 0 0 50px;
-    margin-left: 10px;
-    width: 50px;
-    height: 50px;
-    border-radius: 50px;
-    display: block;
-    overflow: hidden;
 
-    img {
+  .counsel-chats {
+    height: calc(100% - 150px);
+    overflow-x: hidden;
+    overflow-y: auto;
+    .header-img {
+      // flex: 0 0 50px;
+      margin-left: 10px;
       width: 50px;
       height: 50px;
       border-radius: 50px;
-      object-fit: cover;
-    }
-  }
-  .high {
-    color: #b6e0ff !important;
-    cursor: pointer;
-    display: block;
-  }
-  .content {
-    // flex: 1;
-    margin-left: 20px;
-    max-width: calc(100% - 100px);
-    padding: 5px 20px;
-    border-radius: 8px;
-    background: #40a0ff6c;
+      display: block;
+      overflow: hidden;
 
-    .tit {
+      img {
+        width: 50px;
+        height: 50px;
+        border-radius: 50px;
+        object-fit: cover;
+      }
+    }
+    .high {
+      color: #b6e0ff !important;
+      cursor: pointer;
       display: block;
-      color: #f99f2b;
-      margin-bottom: 10px;
     }
+    .content {
+      // flex: 1;
+      margin-left: 20px;
+      max-width: calc(100% - 100px);
+      padding: 5px 20px;
+      border-radius: 8px;
+      background: #40a0ff6c;
 
-    span {
-      color: #ffffff;
-      line-height: 20px;
+      .tit {
+        display: block;
+        color: #f99f2b;
+        margin-bottom: 10px;
+      }
+
+      span {
+        color: #ffffff;
+        line-height: 20px;
+      }
     }
-  }
-  .counsel-left {
-    margin-bottom: 30px;
-    align-items: flex-start;
-    .content {
-      background: #b6e1ff3b;
+    .counsel-left {
+      margin-bottom: 30px;
+      align-items: flex-start;
+      .content {
+        background: #b6e1ff3b;
+      }
+    }
+    .counsel-right {
+      margin-bottom: 30px;
+      justify-content: flex-end;
+      align-items: flex-start;
+      width: 100%;
     }
   }
-
-  .counsel-right {
-    margin-bottom: 30px;
-    justify-content: flex-end;
-    align-items: flex-start;
-    width: 100%;
+}
+.voice {
+  width: 75%;
+  // height: 100px;
+  position: absolute;
+  left: 15%;
+  bottom: 92px;
+  text-align: center;
+  border-radius: 8px;
+  background: #40a0ff6c;
+  padding: 5px 20px;
+  .noise {
+    width: 110px;
+    height: 40px;
+    background-image: url("/static/images/aiModel/noise.png");
+    background-size: 100% 100%;
+    margin: 10px auto;
   }
 }
 

src/views/siteselection/index.vue

@@ -31,7 +31,7 @@
         <!-- :disabled="activeTabs != 'scjg'" -->
         <el-tab-pane
           label="选址结果"
-          :disabled="activeTabs != 'scjg'"
+          :disabled="activeTabs != 'xzjg'"
           name="xzjg"
         >
           <div v-drag style="height: 100%">
@@ -83,7 +83,7 @@ export default {
     // http://192.168.60.66:8080/siteselection?finalTable=temporary_1724917081014_f2d0835a22134486afbf96f29a9f49bb&rwbsm=0914edc2818a4661856a59c7c53555a2
     if (this.$route.query) {
       this.rwBsm = this.$route.query.rwbsm;
-      this.activeTabs = "scjg";
+      this.activeTabs = "xzjg";
     }
   },
   methods: {