修复已知问题

wujingjing

2024-07-26 2530b07fb47856bebd1854af2b752938bd9f1c7d

 src/components/chat/chatComponents/summaryCom/components/recordSet/RecordSet.vue

@@ -1,37 +1,81 @@
<template>
   <div class="h-[20rem] w-full" v-resize="chartContainerResize">
      <div ref="chartRef"></div>
   <div class="w-full">
      <div class="flex space-x-2 mb-4" v-if="data?.params && data?.params.length > 0">
         <component
            v-model="paramsValueList[index].value"
            v-for="(item, index) in data?.params"
            :key="item.id"
            :id="item.id"
            :is="recordSetMapCom[item.type]"
            :data="item"
            :originData="originData"
            @change="(val) => handleQueryChange(val, item)"
            :disabled="chartLoading"
         ></component>
      </div>
      <div class="h-[20rem]" v-resize="chartContainerResize" v-loading="chartLoading">
         <div ref="chartRef"></div>
      </div>
   </div>
</template>

<script setup lang="ts">
import type * as echarts from 'echarts';
import _ from 'lodash';
import { ref } from 'vue';
import type { PropType } from 'vue';
import { ref, watch } from 'vue';
import { SCATTER_SYMBOL_SIZE, chatComProps, getChatChartOption } from '../../../common';
import { useDrawChatChart } from '../../../hooks/useDrawChatChart';
import type { RecordSet, RecordSetParamsItem } from './types';
import { recordSetMapCom } from './types';
import { filterQuery } from '/@/api/ai/chat';
import { deepClone } from '/@/utils/other';

const chartRef = ref<HTMLDivElement>(null);
const defaultDisplayType = 'line';

const props = defineProps(chatComProps);
// const props = defineProps({
//    data: {
//       type: Object as PropType<RecordSet>,
//    },
// });

const props = defineProps({
   data: {
      type: Object as PropType<any>,
   },
   originData: {
      type: Object as PropType<any>,
   },
   summaryIndex: {
      type: Number,
   },
}) as {
   data: RecordSet;
};
const chartLoading = ref(false);
const paramsValueList = ref(deepClone(props.data?.params));

let groupedValues = null;
let timeIndex = undefined;
let valueIndex = undefined;
const drawChart = () => {
   const data = props.data;
   const xType = 'time';
   let timeIndex = data.cols.findIndex((item) => item.type === 'time');
   timeIndex = data.cols.findIndex((item) => item.type === 'time');
   if (timeIndex === -1) {
      timeIndex = 0;
   }
   const timeCol = data.cols[timeIndex];

   let valueIndex = data.cols.findIndex((item) => item.type === 'value');
   valueIndex = data.cols.findIndex((item) => item.type === 'value');
   if (valueIndex === -1) {
      valueIndex = 2;
   }
   const valueCol = data.cols[valueIndex];

   let nameCol = null;
   let groupedValues = null;
   groupedValues = null;
   if (data.chart === 'muli_line') {
      let nameIndex = data.cols.findIndex((item) => item.type === 'name');
      if (nameIndex === -1) {
@@ -123,5 +167,48 @@
   chartInstance.value.setOption(combineOption);
};
const { chartContainerResize, chartInstance } = useDrawChatChart({ chartRef, drawChart });

// 更换列表
const changeMap = new Map<string,string>(null);

const handleQueryChange = async (val: string, item: RecordSetParamsItem) => {
   if (!val) return;
   const historyId = (props as any).originData.historyId;
   const summaryIndex = (props as any).summaryIndex;
   let res = null;

   try {
	
      changeMap.set(item.id,val);
      const paramsObj = {};
      for (const [key,value] of changeMap) {
         paramsObj[key] = value;
      }
      const params = {
         history_id: historyId,
         query_index: summaryIndex,
         param_json: JSON.stringify(paramsObj),
      };
      res = await filterQuery(params);
      chartLoading.value = true;
   } finally {
      chartLoading.value = false;
   }

   const title = res?.values?.title;
   const values = res?.values?.values ?? [];
   chartInstance.value.setOption({
      title: {
         text: title,
      },
      series:
         groupedValues &&
         Object.keys(groupedValues).map(() => {
            return {
               data: values.map((item) => [item[timeIndex], item[valueIndex]]),
            };
         }),
   });
};
</script>
<style scoped lang="scss"></style>