|
|
@@ -27,7 +27,9 @@ const monthData = [];
|
|
|
// 排序
|
|
|
const order_date = ref('');
|
|
|
const sortOrder = ref('');
|
|
|
-
|
|
|
+const salesOrder = ref(null);
|
|
|
+const salesField = ref(null);
|
|
|
+const tableKey = ref(Math.random());
|
|
|
const gridOptions = reactive({
|
|
|
border: 'inner',
|
|
|
height: 900,
|
|
|
@@ -36,7 +38,9 @@ const gridOptions = reactive({
|
|
|
loading: false,
|
|
|
id: 'normalCustomStorage',
|
|
|
customConfig: {
|
|
|
- storage: true
|
|
|
+ storage: {
|
|
|
+ visible:true,
|
|
|
+ }
|
|
|
},
|
|
|
columnConfig: {
|
|
|
resizable: true,
|
|
|
@@ -146,7 +150,7 @@ async function fetchData(taskIds, apiFunc, startDate, endDate, dataColumns, date
|
|
|
const allColumns = new Set();
|
|
|
const salesColumns = [];
|
|
|
const otherColumns = [];
|
|
|
-
|
|
|
+ //清空列名
|
|
|
dataColumns.value = dataColumns.value.filter(column => !/\d{2}-\d{2}/.test(column.field) && !column.field.includes('余额币种') && !column.field.includes('退货率'));
|
|
|
|
|
|
resp.data.forEach(row => {
|
|
|
@@ -160,18 +164,18 @@ async function fetchData(taskIds, apiFunc, startDate, endDate, dataColumns, date
|
|
|
//"的销售额"字段可以排序
|
|
|
allColumns.forEach(key => {
|
|
|
let isSortable = false;
|
|
|
- if (key.includes('的销售额')&& !key.includes('增长率')) {
|
|
|
+ if (key.includes('的销售额') && !key.includes('增长率')) {
|
|
|
isSortable = true;
|
|
|
}
|
|
|
const column = {
|
|
|
field: key,
|
|
|
title: key,
|
|
|
- minWidth: key.includes('~') ? 95 : /\d{4}-\d{2}-\d{2}的/.test(key) ? 88 : key.includes('截止')? 90 :79,
|
|
|
+ minWidth: key.includes('~') ? 95 : /\d{4}-\d{2}-\d{2}的/.test(key) ? 93 : key.includes('截止') ? 90 : 79,
|
|
|
align: 'center',
|
|
|
formatter: formatEmptyCell,
|
|
|
sortable: isSortable,
|
|
|
};
|
|
|
- if (key.includes('的销售额')&& !key.includes('增长率')) {
|
|
|
+ if (key.includes('的销售额') && !key.includes('增长率')) {
|
|
|
salesColumns.push(column);
|
|
|
} else {
|
|
|
otherColumns.push(column);
|
|
|
@@ -185,15 +189,14 @@ async function fetchData(taskIds, apiFunc, startDate, endDate, dataColumns, date
|
|
|
const dateB = b.field.match(/\d{4}-\d{2}-\d{2}/)[0];
|
|
|
return new Date(dateA) - new Date(dateB);
|
|
|
});
|
|
|
- }
|
|
|
- else if (dateType.value=='week'){
|
|
|
+ } else if (dateType.value == 'week') {
|
|
|
salesColumns.sort((a, b) => {
|
|
|
const dateA = a.field.match(/\d{4}-\d{2}-\d{2}~\d{4}-\d{2}-\d{2}/)[0].split('~')[0];
|
|
|
const dateB = b.field.match(/\d{4}-\d{2}-\d{2}~\d{4}-\d{2}-\d{2}/)[0].split('~')[0];
|
|
|
- console.log(dateA,dateB);
|
|
|
+ console.log(dateA, dateB);
|
|
|
return new Date(dateA) - new Date(dateB);
|
|
|
});
|
|
|
- }else if (dateType.value=='month'){
|
|
|
+ } else if (dateType.value == 'month') {
|
|
|
salesColumns.sort((a, b) => {
|
|
|
const dateA = a.field.match(/\d{4}-\d{2}/)[0];
|
|
|
const dateB = b.field.match(/\d{4}-\d{2}/)[0];
|
|
|
@@ -242,16 +245,12 @@ function fetchCurrentData(taskIds, resetPage = false) {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-const salesOrder = ref(null);
|
|
|
-const salesField = ref(null);
|
|
|
|
|
|
-function handleSortChange({ column, order }) {
|
|
|
- salesOrder.value = order;
|
|
|
- salesField.value = column.field;
|
|
|
- //console.log('salesOrder', salesOrder.value);
|
|
|
- //console.log('salesField', salesField.value);
|
|
|
+function handleSortChange({ field, order }) {
|
|
|
+ //salesOrder.value = order;
|
|
|
+ //salesField.value = field;
|
|
|
sortOrder.value = order === 'asc' ? 'smallfirst' : 'bigfirst';
|
|
|
- const sortField = column.field;
|
|
|
+ const sortField = field;
|
|
|
if (sortField) {
|
|
|
const match = sortField.match(/(\d{4}-\d{2}-\d{2})的销售额/);
|
|
|
const matchRange = sortField.match(/(\d{4}-\d{2}-\d{2})~(\d{4}-\d{2}-\d{2})的销售额/);
|
|
|
@@ -265,7 +264,8 @@ function handleSortChange({ column, order }) {
|
|
|
}
|
|
|
}
|
|
|
saveSortState(); // 保存排序状态
|
|
|
- fetchCurrentData(props.taskIds, true); // 获取数据
|
|
|
+ fetchCurrentData(props.taskIds, true);
|
|
|
+ tableKey.value = Math.random();
|
|
|
}
|
|
|
|
|
|
watch(() => props.taskIds, (newTaskIds) => {
|
|
|
@@ -321,8 +321,8 @@ onMounted(() => {
|
|
|
|
|
|
<template>
|
|
|
<div>
|
|
|
- <vxe-grid :cell-style="cellStyle" :header-cell-style="headerCellStyle" stripe v-bind="currentGridOptions"
|
|
|
- v-on="gridEvents" @sort-change="handleSortChange">
|
|
|
+ <vxe-grid :key="tableKey" :cell-style="cellStyle" :header-cell-style="headerCellStyle" :sort-config="sortConfig" stripe
|
|
|
+ v-bind="currentGridOptions" v-on="gridEvents" @sort-change="handleSortChange">
|
|
|
<template #toolbar_buttons>
|
|
|
<el-button icon="plus" target="_blank" type="primary" @click="handleImport">数据录入</el-button>
|
|
|
</template>
|
|
|
@@ -332,8 +332,8 @@ onMounted(() => {
|
|
|
<template #platformName_default="{ row }">
|
|
|
<div class="font-semibold" style="color: #0097f8">{{ row.platformName }}</div>
|
|
|
</template>
|
|
|
- <template #currencyCode_default="{ row }">
|
|
|
- <el-tag color="#fef9c3" style="color: #f59e0b; border-color: #fbbf24;">{{ row.currencyCode }}</el-tag>
|
|
|
+ <template #brandName_default="{ row }">
|
|
|
+ <el-tag effect="plain" type="success" round>{{ row.brandName }}</el-tag>
|
|
|
</template>
|
|
|
</vxe-grid>
|
|
|
</div>
|
xinyan