曲线查询更改

wujingjing

2024-10-14 3c8ba56f8ea1950067fac67f378e0e87bec3a23e

曲线查询更改

 src/api/ai/chat.ts

@@ -349,3 +349,20 @@
        },
    });
};

/**
 * 曲线查询
 * @param params 
 * @param req 
 * @returns 
 */
export const curveQuery = (params,req:any=request) =>{
    return req({
        url: 'chat/chat_supervisor_json',
        method: 'POST',
        data: params,
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
    });
}

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

@@ -38,12 +38,12 @@
import { useDrawChatChart } from '../../../hooks/useDrawChatChart';
import { ChartTypeEnum } from '../../../types';
import YRange from './components/YRange.vue';
import type { RecordSet, RecordSetParamsItem } from './types';
import type { RecordSetParamsItem } from './types';
import { RecordSetParamsType, recordSetMapCom, scoreMap } from './types';
import { filterQuery } from '/@/api/ai/chat';
import { curveQuery } from '/@/api/ai/chat';
import { axisLabelFormatter } from '/@/utils/chart';
import { deepClone } from '/@/utils/other';
import { debounce } from '/@/utils/util';
import { axisLabelFormatter } from '/@/utils/chart';

const chartRef = ref<HTMLDivElement>(null);
const yRange = ref({
@@ -71,37 +71,52 @@
        default: '20rem',
    },
}) as {
    data: RecordSet;
    data: any;
};
const chartLoading = ref(false);

const stepOptions = [
    { title: '5分钟', value: '5 minutes' },
    { title: '10分钟', value: '10 minutes' },
    { title: '半小时', value: '30 minutes' },
    { title: '1小时', value: '1 hours' },
    { title: '1天', value: '1 days' },
];

const visibleParams = computed(() => {
    const visibleList = props.data?.params?.filter((item) => !item?.hide) ?? [];

    // const visibleList = props.data?.params?.filter((item) => !item?.hide) ?? [];
    // index 作为 id
    const visibleList = (props.data?.filter ?? []).map((item, index) => ({
        id: index + '',
        ...item,
    }));
    const newList: RecordSetParamsItem[] = [];
    let nextMatchIndex = null;
    for (let index = 0; index < visibleList.length; index++) {
        if (nextMatchIndex === index) continue;
        const current = visibleList[index];
        const currentAny = current as any;
        if (index !== visibleList.length - 1 && currentAny.type === RecordSetParamsType.StartTime) {
            const next = visibleList[index + 1];
            const nextAny = next as any;

            if (nextAny.group === currentAny.group && nextAny.type === RecordSetParamsType.EndTime) {
        switch (current.type) {
            case RecordSetParamsType.TimeRange:
                newList.push({
                    id: current.id,
                    type: RecordSetParamsType.TimeRange,
                    value: [currentAny.value, nextAny.value],
                    group: currentAny.group,
                    range: [currentAny, nextAny],
                } as any);
                nextMatchIndex = index + 1;
            } else {
                newList.push(current);
            }
        } else {
            newList.push(current);
                    origin: current,
                    value: [current.start_value, current.end_value],
                    title: current.title,
                });
                break;
            case RecordSetParamsType.Step:
                newList.push({
                    id: current.id,
                    type: RecordSetParamsType.Step,
                    origin: current,
                    value: current.value,
                    list: stepOptions,
                    title: current.title,
                });
                break;
            default:
                break;
        }
        Reflect.deleteProperty(current,'id')
    }

    return newList;
@@ -116,7 +131,6 @@
let valueCol = null;

let preData = null;


let activeChartType: ChartTypeEnum = props.data?.chart_type ?? ChartTypeEnum.Line;
const originChartType = activeChartType;
@@ -176,14 +190,14 @@
        });
    }
    const yAxisFormatter =
    originChartType === ChartTypeEnum.Score
        originChartType === ChartTypeEnum.Score
            ? (value) => {
                    return scoreMap[value];
              }
            : axisLabelFormatter;

    const tooltipValueFormatter =
    originChartType === ChartTypeEnum.Score
        originChartType === ChartTypeEnum.Score
            ? (value) => {
                    return scoreMap[value];
              }
@@ -327,31 +341,30 @@
const { chartContainerResize, chartInstance } = useDrawChatChart({ chartRef, drawChart });

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

const changeMap = new Map<string, any>(null);
const handleQueryChange = async (val: any, item: RecordSetParamsItem) => {
    if (!val) return;

    const historyId = (props as any).originData.historyId;
    const summaryIndex = (props as any).summaryIndex;
    let res = null;

    try {
        if (item.type === RecordSetParamsType.TimeRange) {
            changeMap.set(item.range[0].id, val[0]), changeMap.set(item.range[1].id, val[1]);
            item.origin.start_value = val[0];
            item.origin.end_value = val[1];
            changeMap.set(item.id, item.origin);
        } else {
            changeMap.set(item.id, val);
            item.origin.value = val;
            changeMap.set(item.id, item.origin);
        }
        const paramsObj = {};
        for (const [key, value] of changeMap) {
            paramsObj[key] = value;
        }


        const filterObj = Array.from(changeMap.values());
        const params = {
            history_id: historyId,
            query_index: summaryIndex,
            param_json: JSON.stringify(paramsObj),
            agent_key: props.data.agent_key,
            filter_json: JSON.stringify(filterObj),
        };
        res = await filterQuery(params);
        res = await curveQuery(params);
        chartLoading.value = true;
    } finally {
        chartLoading.value = false;

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

@@ -13,12 +13,12 @@

<script setup lang="ts">
import { ref, type PropType, computed } from 'vue';
import type { ListParam } from '../types';
import { getTextWidth } from '/@/utils/util';
import { StepParam } from '../types';

const props = defineProps({
    data: {
        type: Object as PropType<ListParam>,
        type: Object as PropType<StepParam>,
    },
    disabled: {
        type: Boolean,

 src/components/chat/chatComponents/summaryCom/components/recordSet/types.ts

@@ -4,61 +4,47 @@
import { ChartTypeEnum } from '../../../types';

export const enum RecordSetParamsType {
    List = 'list',
    /** @description 后端格式 */
    StartTime = 'start_time',
    EndTime = 'end_time',
    Step = 'time_step',

    /** @description start 和 end 合并为一个 range */
    TimeRange = 'time_range',
}

export type BaseParam = {
    id: string;
    title: string;
    hide?: boolean;
    title:string;
    id:string
};

export type ListParamListItem = {
    title: string;
    value: string;
};
export type ListParam = {
    type: RecordSetParamsType.List;
export type StepParam = {
    type: RecordSetParamsType.Step;
    value: string;
    list: ListParamListItem[];
    origin: any;
} & BaseParam;

//#region ====================== 后端数据格式 ======================
export type TimeRangeBackEndParamType = RecordSetParamsType.StartTime | RecordSetParamsType.EndTime;
export type TimeRangeBackEndParam = {
    type: TimeRangeBackEndParamType;
    value: string;
    // 属于同一个 group 配对
    group: string;
} & BaseParam;
//#endregion
//#region ====================== 整合 start 和 end，得到前端格式 ======================
export type TimeRangeParamValue = [string, string];
export type TimeRangeParamValue = {
    startTime: string;
    endTime: string;
};
export type TimeRangeParam = {
    type: RecordSetParamsType.TimeRange;
    value: TimeRangeParamValue;
    // 属于同一个 group 配对
    group: string;
    range?: [TimeRangeBackEndParam, TimeRangeBackEndParam];
    value: [string,string];
    origin: any;
} & BaseParam;
//#endregion

export type RecordSetParamsItem = ListParam | TimeRangeParam | TimeRangeBackEndParam;
export type RecordSetParamsItem = StepParam | TimeRangeParam;
export type RecordSet = {
    params?: RecordSetParamsItem[];
    chartType?: ChartTypeEnum;
} & Record<string, any>;
};

export const recordSetMapCom = {
    [RecordSetParamsType.List]: List,
    [RecordSetParamsType.Step]: List,
    [RecordSetParamsType.TimeRange]: TimeRange,
    [RecordSetParamsType.StartTime]: Timestamp,
    [RecordSetParamsType.EndTime]: Timestamp,
};

export const scoreMap = {