多路数据

src/views/dataChart/privateChart/privateChartEditParams.vue

@@ -9,7 +9,7 @@
       </el-tab-pane> -->
       <el-tab-pane label="AI取数" name="third">
         <div class="box fullHeigh">
-          <div class="box-msg">
+          <div class="box-msg" ref="container">
             <div v-for="(item, i) in items" :key="i" :class="{ active: item.type === 1 }" class="box-msg-items d-flex mb-3">
               <div class="box-msg-items-header py-3" :class="item.type === 1 ? 'ml-3' : 'mr-3'">
                 <el-image style="width: 30px; height: 30px;" :src="require(`@/assets/image/${item.type === 1 ? 'robot' : 'robot'}.jpg`)" fit="cover"></el-image>
@@ -23,7 +23,9 @@
                 </div>
                 <div v-if="item.type === 2" class="box-msg-items-item-content">
                   <template v-if="Object.keys(item.content).length === 0">
-                    正在思考中...
+                    <div style="white-space: nowrap;">
+                      正在思考中...
+                    </div>
                   </template>
                   <template v-else>
                     <div>
@@ -32,6 +34,7 @@
                     <div class="mt-3">
                       <m-table
                         clearHeader
+                        size="small"
                         shadow="never"
                         :headers="item.content.columns"
                         :items="item.content.rows"
@@ -135,6 +138,11 @@ export default {
           ...obj,
           columns: columns.map(e => ({ label: e, prop: e, value: e }))
         }
+        this.$nextTick(() => {
+          const container = this.$refs.container
+          // 滚动到底部 - IE11 兼容写法
+          container.scrollTop = container.scrollHeight
+        })
       } catch (error) {
         this.$message.error(error)
       } finally {
@@ -175,6 +183,7 @@ export default {
   $height: 60px;
   &-msg {
     height: calc(100% - #{$height});
+    overflow-y: auto;
     &-items {
       &.active {
         flex-direction: row-reverse; /* 水平反向 */
@@ -194,11 +203,6 @@ export default {
           }
         }
       }
-      // height: 100%;
-      &-header {
-        // width: 30px;
-        // height: 30px;
-      }
       &-item {
         &-title {
           font-size: 14px;
@@ -208,6 +212,7 @@ export default {
         &-content {
           font-size: 14px;
           color: #999;
+          max-width: 90%;
         }
       }
     }
@@ -232,4 +237,7 @@ export default {
   box-shadow: unset;
   border-color: #EBEEF5;
 }
+.container {
+  scroll-behavior: smooth;
+}
 </style>

src/views/dataChart/privateChart/privateChartEditShow.vue

@@ -45,12 +45,21 @@ export default {
       } else {
         _data.push(...this.data)
       }
-      series.forEach((item, index) => {
-        item.data = _data[index]
+      const _tem = series[0]
+      const { data: dataSource, ...opt } = _tem
+      this.data.forEach((d, i) => {
+        series[i] = {
+          data: _data[i],
+          ...opt
+        }
       })
+      // series.forEach((item, index) => {
+      //   item.data = _data[index]
+      // })
       if (_option.xAxis?.data) {
         _option.xAxis.data = config?.xAxisData ?? this.data[0].map((e, i) => i)
       }
+      console.log(_option)
       this.chart.setOption(_option, this.key !== key)
       this.key = key
       this.chart.hideLoading()