瀏覽代碼

feat: ecahrt日报增加双刻度线

whh 9 月之前
父節點
當前提交
53332a1514
共有 3 個文件被更改,包括 74 次插入42 次删除
  1. 1 0
      src/utils/format.js
  2. 16 7
      src/views/analyse/WorkOrder.vue
  3. 57 35
      src/views/analyse/config/echartOptions.js

+ 1 - 0
src/utils/format.js

@@ -51,6 +51,7 @@ export const formatEchart = (data) => {
   const xAxisData = data.map(item => item.time);
   const yAxisData = keys.map(key => ({
     title: ORDER_OPTION_ENUM[key],
+    key,
     list: data.map(item => !item[key] ? 0 : Number(item[key].toFixed(2)))
   }))
 

+ 16 - 7
src/views/analyse/WorkOrder.vue

@@ -45,6 +45,15 @@ const isExistInHistory = computed(() => (recordList.value.findIndex(({ sessionId
 const isChart = computed(() => tabActive.value == 'customDaily');
 const chatDataSourceItem = computed(() => unref(chatDataSource)[chatDataSource.value.length - 1]);
 
+const resetFormData = () => {
+  workOrderParams.value = {
+    timeBegin: null,
+    timeEnd: null,
+    whichWay: 1,
+    checkGroup: [],
+  }
+}
+
 // 新建对话
 const handleCreateDialog = async () => {
   message.destroyAll();
@@ -63,6 +72,8 @@ const handleCreateDialog = async () => {
 
   recordActive.value = null;
 
+  resetFormData();
+
   clearChat();
 }
 
@@ -92,12 +103,7 @@ const handleChatDetail = async ({ sessionId }) => {
 
   currenSessionId.value = sessionId;
 
-  workOrderParams.value = {
-    timeBegin: null,
-    timeEnd: null,
-    whichWay: 1,
-    checkGroup: [],
-  }
+  resetFormData();
 
   scrollToBottom();
 }
@@ -191,7 +197,10 @@ const handleSubmit = async (question, params) => {
     option.echartWithTableData = reuslt;
   }
 
-  addChat(option);
+  addChat({
+    ...option,
+    innerLoading: true,
+  });
 
   setTimeout(() => {
 

+ 57 - 35
src/views/analyse/config/echartOptions.js

@@ -122,7 +122,6 @@ export const getAreaOptions = ({ xAxisData, seriesList }) => {
         show: true,
         textStyle: {
           color: '#1F2328',
-          // align: 'right',
           padding: 0
         },
         formatter: function (value) {
@@ -152,10 +151,51 @@ export const getOrderAreaOptions = ({ xAxisData, yAxisData }) => {
     '#8B4513',
   ];
 
+  const commonYAxisOptions = {
+    name: '',
+    nameTextStyle: {
+      fontSize: 12,
+      align: 'right',
+      padding: [10, 5],
+    },
+    min: 0,
+    splitLine: {
+      show: true,
+      lineStyle: {
+        type: 'dashed',
+      },
+    },
+    axisLine: {
+      show: false,
+      lineStyle: {
+        color: "#233653"
+      }
+    },
+    axisLabel: {
+      show: true,
+      color: '#666',
+      padding: 0,
+      formatter: function (value) {
+        return value
+      }
+    },
+    axisTick: {
+      show: false,
+    },
+  }
+
   const series = [];
 
+  const arrKey = yAxisData.map(item => item.key);
+  const isIncludeAssignKey = arrKey.includes('csSlq') || arrKey.includes('jsSlq');
+  const isOneSelfKey = isIncludeAssignKey && arrKey.length === 1;
+
   yAxisData.map((item, index) => {
     const itemColor = color[index];
+    let yAxisIndex = Number(item.key === 'csSlq' || item.key === 'jsSlq')
+
+    if ( isOneSelfKey ) yAxisIndex = 0;
+
     series.push({
       name: item.title,
       type: 'line',
@@ -163,6 +203,7 @@ export const getOrderAreaOptions = ({ xAxisData, yAxisData }) => {
       showAllSymbol: true,
       smooth: true,
       symbolSize: 5,
+      yAxisIndex,
       lineStyle: {
         width: 2,
         color: itemColor,
@@ -189,9 +230,9 @@ export const getOrderAreaOptions = ({ xAxisData, yAxisData }) => {
     },
     backgroundColor: '#fff',
     grid: {
-      top: 30,
-      left: 40,
-      right: 40,
+      top: 40,
+      // left: 40,
+      // right: 50,
       bottom: 30,
     },
     legend: {
@@ -212,7 +253,7 @@ export const getOrderAreaOptions = ({ xAxisData, yAxisData }) => {
         },
       },
       right: '4',
-      top: '6',
+      top: '10',
     },
     xAxis: [{
       type: "category",
@@ -239,37 +280,18 @@ export const getOrderAreaOptions = ({ xAxisData, yAxisData }) => {
       boundaryGap: false,
       data: xAxisData
     }],
-    yAxis: [{
-      name: '',
-      nameTextStyle: {
-        fontSize: 12,
-        align: 'right',
-        padding: [10, 5],
+    yAxis: [
+      {
+        ...commonYAxisOptions,
+        position: 'left'
       },
-      min: 0,
-      splitLine: {
-        show: true,
-        lineStyle: {
-          type: 'dashed',
-        },
-      },
-      axisLine: {
-        show: false,
-        lineStyle: {
-          color: "#233653"
+      {
+        ...commonYAxisOptions,
+        position: 'right',
+        splitLine: {
+          show: false
         }
-      },
-      axisLabel: {
-        show: true,
-        color: '#666',
-        padding: 0,
-        formatter: function (value) {
-          return value
-        }
-      },
-      axisTick: {
-        show: false,
-      },
-    }],
+      }
+    ],
   }
 }