From 578928d66720a75e6d06611324532dcb711e079c Mon Sep 17 00:00:00 2001
From: gerson <1405270578@qq.com>
Date: 星期三, 22 一月 2025 10:36:16 +0800
Subject: [PATCH] 统计重复问题
---
src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue | 377 +++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 277 insertions(+), 100 deletions(-)
diff --git a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
index 4c1d85b..23cd988 100644
--- a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
+++ b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
@@ -1,10 +1,11 @@
<!-- 鏌ヨ鏈�鏂拌鍛婁俊鎭� -->
<template>
<div class="w-full flex-column">
- <div class="flex-0 flex-items-center mb-1 h-[38px]">
+ <div class="flex-0 flex-items-center mb-1 flex-wrap">
<template v-if="visibleParams && visibleParams.length > 0 && showFilter">
<component
- class="flex-0 m-2"
+ class="flex-0 m-2 first-of-type:ml-0"
+ :class="{ hidden: isMap && showMode2 === DisplayModeType2.Map }"
v-model="visibleParams[index].value"
v-for="(item, index) in visibleParams as any"
:key="item.id"
@@ -13,27 +14,55 @@
:data="item"
@change="(val) => handleQueryChange(val, item)"
:originData="originData"
+ :disabled="disabled"
></component>
</template>
- <ColFilter v-if="!isTotalTable" class="ml-auto" :columnList="colList" @change="colFilterChange" />
- <DisplayMode v-if="isTotalTable" class="ml-auto" :order="modeChangeOrder" v-model="showMode" @change="displayModeChange" />
+ <DisplayMode
+ v-if="isTotalTable"
+ class="ml-auto"
+ :order="modeChangeOrder"
+ v-model="showMode"
+ :modeTypeMap="displayModeTypeMap"
+ @change="displayModeChange"
+ />
+ <div class="ml-auto space-x-2 flex-items-center" v-if="isMap || !isTotalTable">
+ <ColFilter
+ v-if="(!isMap && !isTotalTable) || (isMap && showMode2 === DisplayModeType2.List && !isTotalTable)"
+ :columnList="colList"
+ @change="colFilterChange"
+ />
+
+ <DisplayMode
+ v-if="isMap"
+ :order="modeChangeOrder2"
+ :modeTypeMap="displayModeTypeMap2"
+ v-model="showMode2"
+ @change="displayModeChange2"
+ />
+ </div>
</div>
- <div class="flex-auto flex-col" style="display: flex" v-show="showMode === DisplayModeType.List">
+ <div
+ class="flex-auto flex-col"
+ style="display: flex"
+ v-show="(!isMap && showMode === DisplayModeType.List) || (isMap && showMode2 === DisplayModeType2.List)"
+ >
<div class="flex-auto" ref="containerRef" v-resize="resizeHandler" v-loading="queryLoading">
<el-table
ref="tableRef"
:maxHeight="tableHeight"
:cell-style="tableCellStyle"
:header-cell-style="tableHeaderCellStyle"
- :data="chunkTableData[pager.index - 1]"
- @row-click="recordSelectChange"
+ :data="tableData"
+ @row-dblclick="tableDblClick"
+ @row-click="tableRowClick"
+ @sort-change="sortChange"
:spanMethod="objectSpanMethod"
class="w-full h-full"
highlightCurrentRow
:rowClassName="tableRowClassName"
- cellClassName="text-sm"
- headerCellClassName="text-sm"
+ cellClassName=""
+ headerCellClassName=""
>
<DefineColumns v-slot="{ cols }">
<template v-for="item in colList" :key="item.prop">
@@ -42,9 +71,10 @@
:type="item.type"
:label="item.label"
:width="item.width"
- :sortable="item.sortable"
+ :sortable="item.sortable ? 'custom' : false"
:key="item.prop"
:prop="item.prop"
+ @sortChange="sortChange"
show-overflow-tooltip
/>
</template>
@@ -57,7 +87,7 @@
:type="item.type"
:label="item.label"
:width="item.width"
- :sortable="item.sortable"
+ :sortable="item.sortable ? 'custom' : false"
:key="item.prop"
:prop="item.prop"
show-overflow-tooltip
@@ -85,9 +115,15 @@
/>
</div>
+ <div class="flex-auto" v-if="isMap && showMode2 === DisplayModeType2.Map">
+ <MapView :data="data" @equipClick="showCurve" @closeInfoWindow="closeInfoWindow" />
+ </div>
+
<div class="flex-auto" v-resize="debounceResizeChart" v-show="showMode === DisplayModeType.Chart">
<div ref="chartRef" style="height: 25rem"></div>
</div>
+
+ <EquipCurve v-model:isShow="chartDlgIsShow" class="mt-5" :data="equipCurveMapRow" :quotaChartCol="data?.quota_chart?.col" />
<InfoDetail class="text-base" v-model="infoDetailIsShow" :item="detailMapRow" :colList="colList" />
</div>
@@ -95,24 +131,27 @@
<script setup lang="ts">
import { createReusableTemplate } from '@vueuse/core';
-import type { TableInstance } from 'element-plus';
-import _ from 'lodash';
-import type { CSSProperties } from 'vue';
-import { computed, nextTick, onMounted, reactive, ref, type PropType, watchEffect, shallowRef } from 'vue';
-import { BORDER_COLOR, COL_HEADER_CELL_BG_COLOR, THICK_BORDER_WIDTH } from '../deviceLastValue/constants';
-import ColFilter from '/@/components/table/colFilter/ColFilter.vue';
-import { TableCol } from '/@/components/table/colFilter/types';
-import { debounce, getTextWidth, toPercent } from '/@/utils/util';
-import InfoDetail from './infoDetail/InfoDetail.vue';
-import StringInput from './components/StringInput.vue';
-import { curveQuery } from '/@/api/ai/chat';
-import { RecordSetParamsType, recordSetMapCom } from '../recordSet/types';
-import { DisplayModeType } from '../recordSet/components/types';
-import DisplayMode from '../recordSet/components/DisplayMode.vue';
import * as echarts from 'echarts';
+import type { TableInstance } from 'element-plus';
+import { chunk, sortBy } from 'lodash-es';
+import EquipCurve from './components/EquipCurve.vue';
+import type { CSSProperties } from 'vue';
+import { computed, nextTick, onMounted, reactive, ref, shallowRef, watchEffect, type PropType } from 'vue';
import { PATH_ICON } from '../../../common';
import { ChartTypeEnum } from '../../../types';
+import { BORDER_COLOR, COL_HEADER_CELL_BG_COLOR, THICK_BORDER_WIDTH } from '../deviceLastValue/constants';
+import DisplayMode from '../recordSet/components/DisplayMode.vue';
+import { DisplayModeType, DisplayModeType2, displayModeTypeMap, displayModeTypeMap2 } from '../recordSet/components/types';
+import { RecordSetParamsType, recordSetMapCom } from '../recordSet/types';
+import InfoDetail from './infoDetail/InfoDetail.vue';
+import MapView from './map/Map.vue';
+import { curveQuery } from '/@/api/ai/chat';
+import ColFilter from '/@/components/table/colFilter/ColFilter.vue';
+import type { TableCol } from '/@/components/table/colFilter/types';
import { axisLabelFormatter } from '/@/utils/chart';
+import { LocalPlus } from '/@/utils/storage';
+import { debounce, getTextWidth, toPercent } from '/@/utils/util';
+import { isSharePage } from '/@/stores/chatRoom';
const props = defineProps({
data: {
@@ -132,6 +171,17 @@
type: Boolean,
default: true,
},
+ disabled: {
+ type: Boolean,
+ default: false,
+ },
+ reportIndex: {
+ type: Number,
+ default: 0,
+ },
+ historyId: {
+ type: String,
+ },
});
const [DefineColumns, ReuseColumns] = createReusableTemplate<{
@@ -145,10 +195,19 @@
return propsData?.hasOwnProperty('agg_count_col') ?? false;
};
+const isMap = computed(() => {
+ return props.data?.hasOwnProperty('map') ?? false;
+});
+
const isTotalTable = computed(() => checkIsTotalTable(props.data));
+
+const checkHasAddRateCol = (current) => {
+ return current.find((item) => item.title === '姣斾緥' && item.type === 'text');
+};
const getTableCols = (propsData) => {
const current = propsData?.cols ?? [];
- if (checkIsTotalTable(propsData)) {
+
+ if (checkIsTotalTable(propsData) && !checkHasAddRateCol(current)) {
current.push({
title: '姣斾緥',
type: 'text',
@@ -169,7 +228,8 @@
const getTableValues = (propsData) => {
const agg_count_col = propsData?.agg_count_col;
const current = (propsData?.values ?? []) as Array<any[]>;
- if (checkIsTotalTable(propsData)) {
+
+ if (checkIsTotalTable(propsData)&& !current.find(item=>item[0]==='鍚堣') ) {
const last = current[current.length - 1];
const lastItemIndex = last?.length > 0 ? last.length - 1 : 0;
valueColIndex = agg_count_col ?? lastItemIndex;
@@ -217,10 +277,27 @@
};
// 缁熻琛ㄦ牸锛岄渶瑕佸鍔犵疮璁″�艰锛屼互鍙婃瘮渚嬪垪
const tableValues = ref(getTableValues(props.data));
-
+const storeCols = (colList: any[]) => {
+ const key = colList.map((item) => item.label).join(',');
+ if (!key) return;
+ LocalPlus.set(key, colList, 7);
+};
const colList = ref([]);
+const getStoreCols = (colList: any[]) => {
+ if (colList.length === 0) return colList;
+ const key = colList.map((item) => item.label).join(',');
+ if (!key) return colList;
+ const storeValue = LocalPlus.get(key);
+
+ if (!storeValue) {
+ return colList;
+ } else {
+ return storeValue;
+ }
+};
+
watchEffect(() => {
- colList.value =
+ const originData =
tableCols.value?.map((item, index) => {
let isShow = true;
if (props.data.max_cols != null) {
@@ -230,11 +307,14 @@
...item,
width: 0,
label: item.title,
- // sortable: item.type === 'time',
+ sortable: !!item.name,
prop: index + '',
isShow: isShow,
} as TableCol;
}) ?? [];
+
+ const storeCols = getStoreCols(originData);
+ colList.value = storeCols;
});
// 鎵�鏈夋樉绀虹殑 prop
@@ -274,7 +354,27 @@
};
}
};
+const getItemMap = (arr: any[], defaultProps = 'ID', isMultiple = false) => {
+ if (!arr || arr.length === 0) return {};
+ const result = arr.reduce((acc, curr) => {
+ if (isMultiple) {
+ if (!acc.get(curr[defaultProps])) {
+ acc.set(curr[defaultProps], [curr]);
+ } else {
+ {
+ /* acc[curr[defaultProps]].push(curr); */
+ }
+ acc.get(curr[defaultProps]).push(curr);
+ }
+ } else {
+ acc.set(curr[defaultProps], curr);
+ }
+ return acc;
+ }, new Map());
+
+ return result;
+};
// 鍗曞厓鏍艰鍚堝苟鎯呭喌
const cellRowSpanMap = new Map<string, number | undefined>();
@@ -291,14 +391,11 @@
return values;
}
- const groupData = _.groupBy(values, (item, index) => {
- const groupValue = item[curGroupIndex];
- return groupValue;
- });
+ const groupData = getItemMap(values, curGroupIndex, true);
// 椤哄欢涓嬩竴涓垎缁�
i++;
// 閲嶆柊鎺掑竷涓�涓嬩綅缃紝淇濊瘉 group 鐩搁偦锛屽悓鏃舵墦涓� rowspan
- const result = Object.values(groupData).reduce((preVal, curVal) => {
+ const result = Object.values(Array.from(groupData.values())).reduce((preVal, curVal) => {
curVal.map((item, index) => {
// 琛屽垪浣滀负 key
const key = `${j + index},${curGroupIndex}`;
@@ -319,6 +416,7 @@
* 3锛夎绠楀畬鐨勫搴︽斁鍦� colList.value 鐨� width 灞炴�т笂
* @param width
*/
+
const calcColWidth = (width) => {
// 杩斿洖鎵�鏈夋爣棰樺瓧绗︿覆
const maxStrList = tableCols.value.map((item, index) => {
@@ -339,7 +437,8 @@
// 璁＄畻姣忎竴鍒楁渶闀跨殑鏍囬瀛楃涓插拰鏍囬瀛楃涓查暱搴�
for (const item of tableValues.value) {
item.map((subItem, index) => {
- const subItemLen = subItem?.gblen();
+ // subItem 鍙兘鏄� 鏁板瓧
+ const subItemLen = (subItem + '')?.gblen();
if (maxLenList[index] < subItemLen) {
maxLenList[index] = subItemLen;
maxStrList[index] = subItem;
@@ -374,7 +473,7 @@
// 褰撳墠宸叉弧瓒冲搴�
let curWidth = 0;
// 鎺掑ソ搴忕殑瀹藉害鍒楄〃
- const sortedWidthList = _.sortBy(maxWidthList, 'maxWidth');
+ const sortedWidthList = sortBy(maxWidthList, 'maxWidth');
// 鍓╀綑瀹藉害
let restWidth = width;
let notFitStartIndex = 1;
@@ -419,7 +518,7 @@
}
if (tableCols.value.length > 0) {
cellRowSpanMap.clear();
- tableValues.value = buildGroupData(tableValues.value);
+ // tableValues.value = buildGroupData(tableValues.value);
calcColWidth(width);
nextTick(() => {
calcPagerHeight();
@@ -443,7 +542,7 @@
borderColor: BORDER_COLOR,
borderWidth: `${THICK_BORDER_WIDTH}px`,
color: '#7331a5',
- fontSize: '0.875rem',
+ // fontSize: '0.875rem',
...extraStyle,
};
};
@@ -462,7 +561,7 @@
borderWidth: `${THICK_BORDER_WIDTH}px`,
backgroundColor: COL_HEADER_CELL_BG_COLOR,
fontWeight: 700,
- fontSize: '0.875rem',
+ // fontSize: '0.875rem',
color: '#000',
...extraStyle,
};
@@ -503,19 +602,23 @@
tableRef.value.doLayout();
// pager.index = 1;
- chunkTableData.value = _.chunk(tableValues.value ?? [], pager.size);
+ chunkTableData.value = chunk(tableValues.value ?? [], pager.size);
};
//#endregion
+
+const tableData = computed(() => buildGroupData(chunkTableData.value[pager.index - 1]));
const reloadTable = () => {
// 閲嶆柊璁＄畻瀹藉害
resizeEvent({ width: containerRef.value.clientWidth, height: containerRef.value.clientHeight });
};
+
const colFilterChange = () => {
// 閲嶆柊璁＄畻瀹藉害
reloadTable();
+ storeCols(colList.value);
};
const tableHeight = ref(0.7 * document.body.clientHeight);
@@ -525,7 +628,7 @@
// 鏄惁宸茬粡鏄剧ず鎵�鏈夊垪浜�
const haveShowAll = computed(() => visibleColProp.value.length === colList.value.length);
-const recordSelectChange = (row) => {
+const showInfoDetail = (row) => {
if (haveShowAll.value) return;
detailMapRow.value = row;
infoDetailIsShow.value = true;
@@ -539,69 +642,80 @@
});
//#region ====================== 琛ㄦ牸杩囨护鍙傛暟 ======================
-
-const queryLoading = ref(false);
-const queryUpdate = async (val: any, item: any) => {
- const historyId = (props as any).originData.historyId;
+const getFilterList = () => {
const curAgentKey = props.data.agent_key;
+
+ // 鐩稿悓 agent_key 涓嬫墍鏈� filter 璇锋眰鍙傛暟
+ const filterList = ((props as any).originData?.content?.origin?.summary ?? []).reduce((preVal, curVal) => {
+ if (curVal.agent_key !== curAgentKey) return preVal;
+
+ const filter = (curVal.filter ?? []).reduce((subPreVal, subCurVal) => {
+ if (subCurVal.type === RecordSetParamsType.StringInput) {
+ subPreVal.push({
+ update: subCurVal.update,
+ value: subCurVal.value,
+ path: subCurVal.path,
+ });
+ } else if (subCurVal.type === RecordSetParamsType.TimeRange) {
+ subPreVal.push(
+ ...[
+ {
+ update: subCurVal.update,
+ value: subCurVal.start_value,
+ path: subCurVal.start_path,
+ },
+ {
+ update: subCurVal.update,
+ value: subCurVal.end_value,
+ path: subCurVal.end_path,
+ },
+ ]
+ );
+ } else if (subCurVal.type === RecordSetParamsType.Step) {
+ subPreVal.push({
+ update: subCurVal.update,
+ value: subCurVal.step_value,
+ path: subCurVal.step_path,
+ });
+ }
+
+ return subPreVal;
+ }, []);
+
+ preVal = preVal.concat(filter);
+
+ return preVal;
+ }, []);
+
+ return filterList;
+};
+const queryLoading = ref(false);
+let orderDimName = '';
+const queryUpdate = async (val?: any, item?: any) => {
+ const historyId = props.historyId;
let res = null;
- // 鏀瑰彉鍘熷鍊�
- if (item.type === RecordSetParamsType.StringInput) {
- item.origin.value = val;
- } else if (item.type === RecordSetParamsType.TimeRange) {
- item.origin.start_value = val[0];
- item.origin.end_value = val[1];
- } else if (item.type === RecordSetParamsType.Step) {
- item.origin.step_value = val;
+ if (item) {
+ // 鏀瑰彉鍘熷鍊�
+ if (item.type === RecordSetParamsType.StringInput) {
+ item.origin.value = val;
+ } else if (item.type === RecordSetParamsType.TimeRange) {
+ item.origin.start_value = val[0];
+ item.origin.end_value = val[1];
+ } else if (item.type === RecordSetParamsType.Step) {
+ item.origin.step_value = val;
+ }
}
+
+ const filterList = getFilterList();
try {
- // 鐩稿悓 agent_key 涓嬫墍鏈� filter 璇锋眰鍙傛暟
- const filterList = ((props as any).originData?.content?.origin?.summary ?? []).reduce((preVal, curVal) => {
- if (curVal.agent_key !== curAgentKey) return preVal;
-
- const filter = (curVal.filter ?? []).reduce((subPreVal, subCurVal) => {
- if (subCurVal.type === RecordSetParamsType.StringInput) {
- subPreVal.push({
- update: subCurVal.update,
- value: subCurVal.value,
- path: subCurVal.path,
- });
- } else if (subCurVal.type === RecordSetParamsType.TimeRange) {
- subPreVal.push(
- ...[
- {
- update: subCurVal.update,
- value: subCurVal.start_value,
- path: subCurVal.start_path,
- },
- {
- update: subCurVal.update,
- value: subCurVal.end_value,
- path: subCurVal.end_path,
- },
- ]
- );
- } else if (subCurVal.type === RecordSetParamsType.Step) {
- subPreVal.push({
- update: subCurVal.update,
- value: subCurVal.step_value,
- path: subCurVal.step_path,
- });
- }
-
- return subPreVal;
- }, []);
-
- preVal = preVal.concat(filter);
-
- return preVal;
- }, []);
const params = {
history_id: historyId,
// 鏌ヨ鍓嶅悗 agent_key 涓嶄細鍙�
agent_key: props.data.agent_key,
filter_json: JSON.stringify(filterList),
+ order_dim_name: orderDimName,
+ result_group_index: props.reportIndex,
};
res = await curveQuery(params);
queryLoading.value = true;
@@ -1005,14 +1119,77 @@
};
//#endregion
+const orderMap = new Map();
+const sortChange = ({ column, prop, order }) => {
+ // 鎭㈠鍘熺姸锛屾洿鏂板悗鍐嶆樉绀烘帓搴忕姸鎬�
+ const curOrder = orderMap.get(prop) ?? null;
+ column.order = curOrder;
+
+ let sendOrder;
+ if (order === 'descending') {
+ sendOrder = 'desc';
+ } else if (order === 'ascending') {
+ sendOrder = 'asc';
+ } else {
+ sendOrder = '';
+ }
+ const colName = colList.value[prop].name;
+ const sendOrderName = sendOrder ? `${colName},${sendOrder}` : '';
+ orderDimName = sendOrderName;
+
+ queryUpdate().then(() => {
+ orderMap.set(prop, order);
+ column.order = order;
+ });
+};
+
+// 鍦板浘妯″紡灞曠ず
+const showMode2 = ref(DisplayModeType2.Map);
+const modeChangeOrder2 = [DisplayModeType2.Map, DisplayModeType2.List];
+
+const displayModeChange2 = (val: DisplayModeType2) => {
+ if (val === DisplayModeType2.Map) {
+ //if (!chartInstance.value || needUpdateChart) {
+ //updateChart();
+ //needUpdateChart = false;
+ //}
+ }
+};
+
+const chartDlgIsShow = ref(false);
+const equipCurveMapRow = ref(null);
+const showCurve = (row) => {
+ if (isSharePage.value) return;
+ if (!row) return;
+ equipCurveMapRow.value = row;
+ chartDlgIsShow.value = true;
+};
+const closeInfoWindow = () => {
+ closeChartDlg();
+};
+const closeChartDlg = () => {
+ chartDlgIsShow.value = false;
+ equipCurveMapRow.value = null;
+};
+
+const tableRowClick = (row) => {
+ if (isMap.value) {
+ showCurve(row);
+ } else {
+ showInfoDetail(row);
+ }
+ chartDlgIsShow.value = true;
+};
+
+const tableDblClick = (row) => {
+ if (!isMap.value) return;
+ showInfoDetail(row);
+};
+
defineExpose({
updateAll,
updateCurrent,
updateIndexSummary,
});
</script>
-<style scoped lang="scss">
-// :deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell){
-// background-color: v-bind(stripedBgColor);
-// }
-</style>
+<style scoped lang="scss"></style>
--
Gitblit v1.9.3