y轴范围也会影响列表，支持 score，

wujingjing

2024-10-15 f9ffa3b42a98edcb1c901c3ad1fde98c9ad8589a

y轴范围也会影响列表，支持 score，

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

@@ -5,7 +5,7 @@
            <!-- TimeRange v-model 跟 @change 中的值会不一样，以@change 中为准 -->
            <template v-if="visibleParams && visibleParams.length > 0">
                <component
                    class="flex-0 m-1"
                    class="flex-0 m-2"
                    v-model="paramsValueList[index].value"
                    v-for="(item, index) in visibleParams as any"
                    :key="item.id"
@@ -18,9 +18,18 @@
                ></component>
            </template>
            <slot> </slot>
            <YRange @input="yRangeInput" />
            <el-tooltip
                v-if="originChartType === ChartTypeEnum.Score"
                :content="`${Object.keys(scoreMap)
                    .map((key) => `${key} 表示${scoreMap[key]}`)
                    .join(', ')}`"
                placement="top-start"
            >
                <SvgIcon name="fa fa-question-circle-o" :size="15" class="ml-1 cursor-help flex-center" color="#909399" />
            </el-tooltip>

            <YRange v-model="yRange" @input="yRangeInput" />
            <el-checkbox class="m-1" v-model="isMultiCompare" label="多日对比" @change="multiCompareChange"></el-checkbox>
            <el-checkbox class="m-2" v-model="isMultiCompare" label="多日对比" @change="multiCompareChange"></el-checkbox>

            <DisplayMode class="ml-auto" v-model="showMode" @change="displayModeChange" />
        </div>
@@ -52,10 +61,6 @@
import { deepClone } from '/@/utils/other';
import { debounce } from '/@/utils/util';
const chartRef = ref<HTMLDivElement>(null);
const yRange = ref({
    min: null as number,
    max: null as number,
});

const showMode = ref(DisplayModeType.Chart);
// const props = defineProps({
@@ -350,7 +355,7 @@
    handleData();
    setNewOption();
};
const { chartContainerResize, chartInstance, initChart } = useDrawChatChart({ chartRef, drawChart });
const { chartContainerResize, chartInstance } = useDrawChatChart({ chartRef, drawChart });

// 更换列表
const changeMap = new Map<string, any>(null);
@@ -405,6 +410,11 @@
    }
};

let realRange = {
    min: null,
    max: null,
};

const getSingleDayOption = (day = COMMON_DAY) =>
    ({
        tooltip: {
@@ -454,11 +464,9 @@
    } as echarts.EChartsOption);
//#region ====================== 设置Y范围 ======================
const debounceSetYRange = debounce((val) => {
    (realRange.min = val.min), (realRange.max = val.max);
    chartInstance.value.setOption({
        yAxis: {
            min: val.min,
            max: val.max,
        },
        yAxis: realRange,
    });

    currentSeries.value = currentSeries.value.concat([]);
@@ -527,17 +535,25 @@

const tableData = computed(() => {
    if (!currentSeries.value) return [];
    // const min = yRange.value.min == null ? -Infinity : yRange.value.min;
    // const max = yRange.value.max == null ? Infinity : yRange.value.max;
    const min = realRange.min == null ? -Infinity : realRange.min;
    const max = realRange.max == null ? Infinity : realRange.max;
    const timeDataMap = currentSeries.value.reduce((preVal, curVal, index) => {
        for (const item of curVal.data) {
            const [time, value] = item;

            // if (value < min || value > max) {
            //     continue;
            // }
            let [time, value] = item;
            // 多日对比，只显示时分秒
            if (isMultiCompare.value) {
                time = time.slice(11);
            }
            if (value < min || value > max) {
                continue;
            }
            if (!preVal[time]) {
                preVal[time] = [];
            }

            // score 类型，value 值，需要映射成另一个值
            if (originChartType === ChartTypeEnum.Score) {
                value = scoreMap[value];
            }
            preVal[time][index] = value;
        }
@@ -571,7 +587,6 @@
watch(
    () => currentSeries.value,
    (val) => {
        if (!tableIsShow.value) return;
        tableKey.value = _.random(0, 100000) + '';
    }
);

 src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue

@@ -107,7 +107,7 @@
                ...item,
                width: 0,
                label: item.title,
                sortable: item.type === 'time',
                // sortable: item.type === 'time',
                prop: index + '',
                isShow: isShow,
            } as TableCol;