🐛 perf<报表管理-任务管理>:

任务管理修改列;
普通展示修改表格;

src/views/reportManage/TaskManage/index.vue

@@ -20,6 +20,7 @@ interface taskRuleForm {
   brand: string;
   operation: string[];
   currency: string;
+  currencyCodePlatform: string;
 }
 
 const formSize = ref<ComponentSize>('default');
@@ -32,6 +33,7 @@ const taskRuleForm = reactive({
   brand: '',
   operation: [],
   currency: '',
+  currencyCodePlatform: '',
 });
 const resetForm = (formEl: FormInstance | undefined) => {
   if (!formEl) return;
@@ -43,7 +45,8 @@ const rules = reactive<FormRules>({
   country: [{required: true, message: '请输入国家', trigger: 'blur'}],
   brand: [{required: true, message: '请输入品牌', trigger: 'blur'}],
   operation: [{required: true, message: '请选择运营', trigger: 'change'}],
-  currency: [{required: true, message: '请输入货币', trigger: 'blur'}],
+  currency: [{required: true, message: '请输入回款/余额币种', trigger: 'blur'}],
+  currencyCodePlatform: [{required: true, message: '请输入平台货币', trigger: 'blur'}],
 });
 
 //表格
@@ -54,6 +57,7 @@ interface RowVO {
   brandName: string;
   user_name: string;
   currencyCode: string;
+  currencyCodePlatform: string;
   child_user_number: number;
   user: [];
 }
@@ -118,8 +122,9 @@ const gridOptions = reactive<VxeGridProps<RowVO>>({
     {field: 'country', title: '国家', editRender: {autofocus: '.vxe-input--inner'}, slots: {edit: 'country_edit'}},
     {field: 'brandName', title: '品牌', editRender: {}, slots: {edit: 'brand_edit'}},
     {field: 'user_name', title: '运营', editRender: {}, slots: {edit: 'operation_edit'}},
-    {field: 'currencyCode', title: '汇款币种', editRender: {}, slots: {edit: 'currency_edit'}},
-    {field: 'child_user_number', title: '录入人员数', slots: {edit: 'quantity_edit'}},
+    {field: 'currencyCode', title: '回款币种', editRender: {}, slots: {edit: 'currency_edit'}},
+    {field: 'currencyCodePlatform', title: '回款/余额币种', editRender: {}, slots: {edit: 'currencyCodePlatform_edit'}},
+    //{field: 'child_user_number', title: '录入人员数', slots: {edit: 'quantity_edit'}},
     {title: '操作', width: 300, slots: {default: 'operate'}},
   ],
   data: [],
@@ -259,7 +264,8 @@ const requiredFields = [
   { field: 'country', title: '国家' },
   { field: 'brandName', title: '品牌' },
   { field: 'user', title: '运营' },
-  { field: 'currencyCode', title: '汇款币种' }
+  { field: 'currencyCode', title: '回款币种' },
+  { field: 'currencyCodePlatform', title: '回款/余额币种' }
 ];
 
 const validateRow = (row) => {
@@ -283,8 +289,9 @@ async function updateRow(row) {
       brandName: row.brandName,
       user: row.user,
       currencyCode: row.currencyCode,
+      currencyCodePlatform: row.currencyCodePlatform,
     };
-    console.log('updatedRowData', updatedRowData);
+    //console.log('updatedRowData', updatedRowData);
     try {
       const response = await postUpdateTask(updatedRowData);
       console.log(response);
@@ -325,6 +332,7 @@ async function createTask() {
     platformName: taskRuleForm.name,
     brandName: taskRuleForm.brand,
     currencyCode: taskRuleForm.currency,
+    currencyCodePlatform: taskRuleForm.currencyCodePlatform,
     user: taskRuleForm.operation,
   };
   try {
@@ -345,6 +353,7 @@ const submitEvent = async () => {
     brandName: taskRuleForm.brand,
     user_name: taskRuleForm.operation,
     currencyCode: taskRuleForm.currency,
+    currencyCodePlatform: taskRuleForm.currencyCodePlatform,
     child_user_number: '',
   };
   // 将新行添加到表格数据中
@@ -436,6 +445,9 @@ onMounted(() => {
         <template #currency_edit="{ row }">
           <vxe-input v-model="row.currencyCode"></vxe-input>
         </template>
+        <template #currencyCodePlatform_edit="{ row }">
+          <vxe-input v-model="row.currencyCodePlatform"></vxe-input>
+        </template>
         <template #quantity_edit="{ row }">
         </template>
       </vxe-grid>
@@ -472,6 +484,9 @@ onMounted(() => {
       <el-form-item label="回款币种" prop="currency">
         <el-input v-model="taskRuleForm.currency" placeholder="请输入回款币种" />
       </el-form-item>
+      <el-form-item label="回款/余额币种" prop="currencyCodePlatform">
+        <el-input v-model="taskRuleForm.currencyCodePlatform" placeholder="请输入回款/余额币种" />
+      </el-form-item>
     </el-form>
     <template #footer>
       <div class="dialog-footer">

src/views/reportManage/dataCenter/combinedDisplay/components/tableData/mainData.vue

@@ -17,8 +17,10 @@ const tableData = ref([]);
 
 const dayStartDate = ref(null);
 const dayEndDate = ref(null);
-const weekDate = ref(null);
+const weekStart = ref(null);
+const weekEnd = ref(null);
 const monthStartDate = ref(null);
+const monthEndDate = ref(null);
 
 const gridOptions = reactive({
   border: false,
@@ -77,8 +79,10 @@ async function fetchMainData(taskIds) {
       task_ids: taskIds,
       day_start_date: dayStartDate.value,
       day_end_date: dayEndDate.value,
-      week_start_date: weekDate.value,
+      week_start_date: weekStart.value,
+      week_end_date: weekEnd.value,
       month_start_date: monthStartDate.value,
+      month_end_date: monthEndDate.value,
     });
     gridOptions.data = response.data;
     gridOptions.pagerConfig.total = response.total;
@@ -98,7 +102,7 @@ watch(() => props.taskIds, (newTaskIds) => {
 // 监测 dayDate 变化
 watch(() => props.dayDate, (newDayDate) => {
   if (newDayDate) {
-    // console.log('newDayDate',newDayDate);
+     //console.log('newDayDate',newDayDate);
     const {dailyStartDate, dailyTime} = newDayDate;
     dayStartDate.value = dailyStartDate;
     dayEndDate.value = dailyTime;
@@ -108,17 +112,20 @@ watch(() => props.dayDate, (newDayDate) => {
 // 监测 weekDate 变化
 watch(() => props.weekDate, (newWeekDate) => {
   if (newWeekDate) {
-    // console.log('newWeekDate',newWeekDate);
-    const {weekStartDate} = newWeekDate;
-    weekDate.value = weekStartDate;
+     //console.log('newWeekDate',newWeekDate);
+    const {weekStartDate, weekEndDate} = newWeekDate;
+    weekStart.value = weekStartDate;
+    weekEnd.value = weekEndDate;
     loadData();
   }
 });
 // 监测 monthDate 变化
 watch(() => props.monthDate, (newMonthDate) => {
   if (newMonthDate) {
-    const {startDate} = newMonthDate;
+    //console.log('newMonthDate',newMonthDate);
+    const {startDate, endDate} = newMonthDate;
     monthStartDate.value = startDate;
+    monthEndDate.value = endDate;
     // loadData();
   }
 });
@@ -148,8 +155,9 @@ const fetchColumnNames = (data) => {
         .map((key, index) => ({
           field: key,
           title: key, // 使用字段名作为列标题
-          width: key.includes('~') ? 120 : (index < 5 ? 90 : 87),
-          fixed: index < 6 ? 'left' : undefined // 前五列固定
+          minWidth: key.includes('~') ? 120 : index < 5 ? 90 : /\d{4}-\d{2}-\d{2}/.test(key)? 113 :105,
+          fixed: index < 6? 'left' : undefined,
+          align: 'center',
         }));
   }
 };
@@ -159,7 +167,7 @@ const cellStyleHandler = ({ column }) => {
   const dayFormat = /\d{2}-\d{2}/;
   const dayDetailedFormat = /\d{4}-\d{2}-\d{2}/;
   const monthFormat = /\d{4}-\d{2}/;
-  if (columnName.includes('~') || columnName.includes('截止') || columnName.includes('近90天平台退货率')) {
+  if (columnName.includes('~') || columnName.includes('截止') || columnName.includes('近90天平台退货率')|| columnName.includes('余额')) {
     return { backgroundColor: '#b3ced7' };
   }
   if (monthFormat.test(columnName) && !dayDetailedFormat.test(columnName)) {

src/views/reportManage/dataCenter/combinedDisplay/components/tableData/monthlyComparativeData.vue

@@ -79,15 +79,20 @@ async function fetchMonthlyData(taskIds) {
       const dynamicColumns = [];
       for (const key in firstRow) {
         if (key.includes('的销售额') || key.includes('的周销售额')) {
-          dynamicColumns.push({ field: key, title: key });
+          dynamicColumns.push({
+            field: key,
+            title: key,
+            minWidth: 90,
+          });
         }
       }
       tableColumns.value = [
-        { field: 'platformNumber', title: '平台编号', fixed: "left" },
-        { field: 'platformName', title: '平台名称', fixed: "left" },
-        { field: 'user_name', title: '运营', fixed: "left" },
-        { field: 'country', title: '国家', fixed: "left" },
-        { field: 'brandName', title: '品牌', fixed: "left" },
+        { field: 'platformNumber', title: '平台编号', fixed: "left" ,minWidth:90},
+        { field: 'platformName', title: '平台名称', fixed: "left" ,minWidth:90},
+        { field: 'user_name', title: '运营', fixed: "left" ,minWidth:90},
+        { field: 'country', title: '国家', fixed: "left" ,minWidth:90},
+        { field: 'brandName', title: '品牌', fixed: "left" ,minWidth:90},
+        { field: 'currencyCode', title: '回款币种', fixed: "left" ,minWidth:90},
         ...dynamicColumns
       ];
     } else {

src/views/reportManage/dataCenter/normalDisplay/components/TableDataDisplay.vue

@@ -74,7 +74,7 @@ const currentGridOptions = computed(() => {
   return {
     ...gridOptions,
     ...selectedGridOptions,
-    columns: dateType.value === 'day' ? dayDataColumns.value : selectedGridOptions.columns
+    //columns: dateType.value === 'day' ? dayDataColumns.value : selectedGridOptions.columns
   };
 });
 // 分页
@@ -102,14 +102,14 @@ watch(currentDate,(newValue)=>{
    fetchCurrentData(props.taskIds);
 })
 
-async function fetchDayData(taskIds) {
+async function fetchData(taskIds, apiFunc, startDate, endDate, dataColumns, dateTypeKey) {
   try {
     gridOptions.loading = true;
-    const resp = await getDayData({
+    const resp = await apiFunc({
       page: gridOptions.pagerConfig.currentPage,
       limit: gridOptions.pagerConfig.pageSize,
-      day_start_date: dayStartDate.value,
-      day_end_date: dayEndDate.value,
+      [`${dateTypeKey}_start_date`]: startDate.value,
+      [`${dateTypeKey}_end_date`]: endDate.value,
       task_ids: taskIds,
     });
     gridOptions[dateType.value].data = resp.data;
@@ -117,25 +117,22 @@ async function fetchDayData(taskIds) {
     if (resp.data.length > 0) {
       const firstRow = resp.data[0];
       const dynamicColumns = [];
-      dayDataColumns.value = dayDataColumns.value.filter(column => !/\d{2}-\d{2}的/.test(column.field));
+      dataColumns.value = dataColumns.value.filter(column => !/\d{2}-\d{2}的/.test(column.field)&&! column.field.includes('余额币种')&&! column.field.includes('退货率'));
       for (const key in firstRow) {
-        if (/\d{2}-\d{2}/.test(key)) { // 匹配以日期开头的键名
+        if (/\d{2}-\d{2}的/.test(key) || key.includes('余额币种') ||key.includes('退货率')) {
           dynamicColumns.push({
             field: key,
-            title: key ,
-            width:/\d{4}-\d{2}-\d{2}/.test(key)?124:90,
-            align: 'center'
+            title: key,
+            minWidth:key.includes('~') ? 120 :/\d{4}-\d{2}的/.test(key)? 100 :113,
+            align: 'center',
           });
         }
       }
-      if (dateType.value === 'day') {
-        dayDataColumns.value = [
-          ...dayDataColumns.value, // 原始的列
-          ...dynamicColumns       // 动态生成的列
-        ];
-      }
-      else {
-        dayDataColumns.value = [];
+      //console.log(dynamicColumns);
+      if (dateType.value === dateTypeKey) {
+        dataColumns.value = [...dataColumns.value, ...dynamicColumns];
+      } else {
+        dataColumns.value = [];
         gridOptions.pagerConfig.total = 0;
       }
     }
@@ -146,92 +143,16 @@ async function fetchDayData(taskIds) {
   }
 }
 
-async function fetchWeekData(taskIds)  {
-  try {
-    gridOptions.loading = true;
-    const resp = await getWeekData({
-      page: gridOptions.pagerConfig.currentPage,
-      limit: gridOptions.pagerConfig.pageSize,
-      week_start_date: weekStartDate.value,
-      week_end_date: weekEndDate.value,
-      task_ids: taskIds,
-    });
-    gridOptions[dateType.value].data = resp.data;
-    gridOptions.pagerConfig.total = resp.total;
-    if (resp.data.length > 0) {
-      const firstRow = resp.data[0];
-      const dynamicColumns = [];
-      weekDataColumns.value = weekDataColumns.value.filter(column => !/\d{2}-\d{2}的/.test(column.field));
-      for (const key in firstRow) {
-        if (/\d{2}-\d{2}/.test(key)) { // 匹配以日期开头的键名
-          dynamicColumns.push({
-            field: key,
-            title: key ,
-            width:key.includes('~') ? 120 :113,
-            align: 'center'
-          });
-        }
-      }
-      if (dateType.value === 'week') {
-        weekDataColumns.value = [
-          ...weekDataColumns.value, // 原始的列
-          ...dynamicColumns       // 动态生成的列
-        ];
-      }
-      else {
-        weekDataColumns.value = [];
-        gridOptions.pagerConfig.total = 0;
-      }
-    }
-  } catch (error) {
-    console.error('Error fetching task data:', error);
-  } finally {
-    gridOptions.loading = false;
-  }
+async function fetchDayData(taskIds) {
+  await fetchData(taskIds, getDayData, dayStartDate, dayEndDate, dayDataColumns, 'day');
+}
+
+async function fetchWeekData(taskIds) {
+  await fetchData(taskIds, getWeekData, weekStartDate, weekEndDate, weekDataColumns, 'week');
 }
 
 async function fetchMonthData(taskIds) {
-  try {
-    gridOptions.loading = true;
-    const resp = await getMonthData({
-      page: gridOptions.pagerConfig.currentPage,
-      limit: gridOptions.pagerConfig.pageSize,
-      week_start_date: monthStartDate.value,
-      week_end_date: monthEndDate.value,
-      task_ids: taskIds,
-    });
-    gridOptions[dateType.value].data = resp.data;
-    gridOptions.pagerConfig.total = resp.total;
-    if (resp.data.length > 0) {
-      const firstRow = resp.data[0];
-      const dynamicColumns = [];
-      monthDataColumns.value = monthDataColumns.value.filter(column => !/\d{2}-\d{2}的/.test(column.field));
-      for (const key in firstRow) {
-        if (/\d{2}-\d{2}/.test(key)) { // 匹配以日期开头的键名
-          dynamicColumns.push({
-            field: key,
-            title: key ,
-            width:/\d{4}-\d{2}-\d{2}/.test(key)?124:90,
-            align: 'center'
-          });
-        }
-      }
-      if (dateType.value === 'month') {
-        monthDataColumns.value = [
-          ...monthDataColumns.value, // 原始的列
-          ...dynamicColumns       // 动态生成的列
-        ];
-      }
-      else {
-        monthDataColumns.value = [];
-        gridOptions.pagerConfig.total = 0;
-      }
-    }
-  } catch (error) {
-    console.error('Error fetching task data:', error);
-  } finally {
-    gridOptions.loading = false;
-  }
+  await fetchData(taskIds, getMonthData, monthStartDate, monthEndDate, monthDataColumns, 'month');
 }
 
 function fetchCurrentData(taskIds) {

src/views/reportManage/dataCenter/normalDisplay/components/TableDataEntry.vue

@@ -14,6 +14,7 @@ import { dayColumns, weekColumns, monthColumns } from '../../utils/columns';
 import { ComponentSize, ElMessage, FormInstance, FormRules } from 'element-plus';
 import enLocale from 'element-plus/es/locale/lang/en';
 import Selector from '/@/views/reportManage/dataCenter/normalDisplay/components/Selector/index.vue';
+
 dayjs.extend(isoWeek);
 
 // const router = useRouter();
@@ -132,8 +133,8 @@ interface taskDataForm {
   impression: number;
   ad_click: number;
   ad_order: number;
-  money_by_amazon_original: number;
-  money_by_other_original: number;
+  money_by_amazon: number;
+  money_by_other: number;
   session: number;
   order: number;
   availableSalesDay: number;
@@ -160,8 +161,8 @@ const taskDataForm = reactive({
   intransitInventory: null,
   overseasStorage: null,
   refundRate: null,
-  money_by_amazon_original:null,
-  money_by_other_original:null,
+  money_by_amazon: null,
+  money_by_other: null,
 });
 
 const resetForm = (formEl: FormInstance | undefined) => {
@@ -176,8 +177,8 @@ const rules = reactive<FormRules>({
   impression: [{required: true, message: '请输入广告展示量', trigger: 'blur'}],
   ad_click: [{required: true, message: '请输入广告点击量', trigger: 'blur'}],
   ad_order: [{required: true, message: '请输入广告订单量', trigger: 'blur'}],
-  money_by_amazon_original: [{required: true, message: '请输入亚马逊佣金', trigger: 'blur'}],
-  money_by_other_original: [{required: true, message: '请输入其他佣金', trigger: 'blur'}],
+  money_by_amazon: [{required: true, message: '请输入亚马逊佣金', trigger: 'blur'}],
+  money_by_other: [{required: true, message: '请输入其他佣金', trigger: 'blur'}],
   session: [{required: true, message: '请输入会话数', trigger: 'blur'}],
   order: [{required: true, message: '请输入订单', trigger: 'blur'}],
   availableSalesDay: [{required: true, message: '请输入可用销量天数', trigger: 'blur'}],
@@ -186,6 +187,9 @@ const rules = reactive<FormRules>({
   refundRate: [{required: true, message: '请输入最近90天平台退货率', trigger: 'blur'}],
 });
 
+const flatDayColumns = ref(flattenColumns(dayColumns.value));
+const flatWeekColumns = ref(flattenColumns(weekColumns.value));
+const flatMonthColumns = ref(flattenColumns(monthColumns.value));
 //表格
 let taskId = 0;
 let currentId = 0;
@@ -205,8 +209,8 @@ interface RowVO {
   impression: number;
   ad_click: number;
   ad_order: number;
-  money_by_amazon_original: number;
-  money_by_other_original: number;
+  money_by_amazon: number;
+  money_by_other: number;
   session: string;
   order: string;
   availableSalesDay: number;
@@ -293,7 +297,7 @@ const clearRowEvent = (row: RowVO) => {
 const handelEditRow = (row: RowVO) => {
   const $grid = xGrid.value;
   if ($grid) {
-    originalDataMap.set(row.id, { ...row });
+    originalDataMap.set(row.id, {...row});
     $grid.setEditRow(row);
   }
 };
@@ -301,12 +305,13 @@ const handelEditRow = (row: RowVO) => {
 function updateDataChange(newId) {
   if (selectorRef.value) {
     taskIds.value = newId.value;
-    fetchCurrentTaskData()
+    fetchCurrentTaskData();
   }
 }
 
 // 获取表格数据
 let dateParams;
+
 async function fetchTaskData(apiFunction) {
   try {
     gridOptions.loading = true;
@@ -369,7 +374,7 @@ const editEvent = async (row: RowVO) => {
 
 // 校验数据
 const validateNumericFields = (fields: Record<string, any>, fieldsToValidate: string[]): boolean => {
-  const numericFields = ['sales_original', 'total_sales_current_monthly_original', 'ad_sales_original', 'ad_cost_original', 'money_by_amazon_original', 'money_by_other_original', 'refundRate'];
+  const numericFields = ['sales_original', 'total_sales_current_monthly_original', 'ad_sales_original', 'ad_cost_original', 'money_by_amazon', 'money_by_other', 'refundRate'];
   const integerFields = ['impression', 'ad_click', 'ad_order', 'session', 'order', 'availableSalesDay', 'intransitInventory', 'overseasStorage'];
 
   for (const field of fieldsToValidate) {
@@ -446,8 +451,8 @@ async function createWeekData() {
     impression: taskDataForm.impression,
     ad_click: taskDataForm.ad_click,
     ad_order: taskDataForm.ad_order,
-    money_by_amazon_original: taskDataForm.money_by_amazon_original,
-    money_by_other_original: taskDataForm.money_by_other_original,
+    money_by_amazon: taskDataForm.money_by_amazon,
+    money_by_other: taskDataForm.money_by_other,
     session: taskDataForm.session,
     order: taskDataForm.order,
     availableSalesDay: taskDataForm.availableSalesDay,
@@ -521,7 +526,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         await createDayData();
       }
       if (dateType === 'week') {
-        const fieldsToValidate = ['sales_original', 'ad_sales_original', 'ad_cost_original', 'total_sales_current_monthly_original', 'impression', 'ad_click', 'ad_order', 'money_by_amazon_original', 'money_by_other_original', 'session', 'order', 'availableSalesDay', 'intransitInventory', 'overseasStorage', 'refundRate'];
+        const fieldsToValidate = ['sales_original', 'ad_sales_original', 'ad_cost_original', 'total_sales_current_monthly_original', 'impression', 'ad_click', 'ad_order', 'money_by_amazon', 'money_by_other', 'session', 'order', 'availableSalesDay', 'intransitInventory', 'overseasStorage', 'refundRate'];
         if (!validateNumericFields(taskDataForm, fieldsToValidate)) return; // 验证字段
         await createWeekData();
       }
@@ -530,7 +535,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         if (!validateNumericFields(taskDataForm, fieldsToValidate)) return; // 验证字段
         await createMonthData();
       }
-       //taskDataFormRef.value.resetFields();
+      //taskDataFormRef.value.resetFields();
     }
   });
 };
@@ -576,8 +581,8 @@ async function updateWeekData(row: RowVO) {
       impression: row.impression,
       ad_click: row.ad_click,
       ad_order: row.ad_order,
-      money_by_amazon_original: row.money_by_amazon_original,
-      money_by_other_original: row.money_by_other_original,
+      money_by_amazon: row.money_by_amazon,
+      money_by_other: row.money_by_other,
       session: row.session,
       order: row.order,
       availableSalesDay: row.availableSalesDay,
@@ -648,7 +653,7 @@ const editRowEvent = async (row: any) => {
       if (!validateNumericFields(row, fieldsToValidate)) return; // 验证字段
       await updateDayData(row);
     } else if (dateType === 'week') {
-      const fieldsToValidate = ['sales_original', 'ad_sales_original', 'ad_cost_original', 'total_sales_current_monthly_original', 'impression', 'ad_click', 'ad_order', 'money_by_amazon_original', 'money_by_other_original', 'session', 'order', 'availableSalesDay', 'intransitInventory', 'overseasStorage', 'refundRate'];
+      const fieldsToValidate = ['sales_original', 'ad_sales_original', 'ad_cost_original', 'total_sales_current_monthly_original', 'impression', 'ad_click', 'ad_order', 'money_by_amazon', 'money_by_other', 'session', 'order', 'availableSalesDay', 'intransitInventory', 'overseasStorage', 'refundRate'];
       if (!validateNumericFields(row, fieldsToValidate)) return; // 验证字段
       await updateWeekData(row);
     } else if (dateType === 'month') {
@@ -668,16 +673,32 @@ const currentGridOptions = computed(() => {
   };
 });
 
+function flattenColumns(columns) {
+  let result = [];
+  columns.forEach(column => {
+    if (column.children && column.children.length > 0) {
+      result = result.concat(flattenColumns(column.children));
+    } else {
+      result.push(column);
+    }
+  });
+  return result;
+}
+
+
 const filteredDayColumns = computed(() => {
-  return dayColumns.value.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营','销售额','广告销售额','广告花费'].includes(item.title));
+  const flat = flatDayColumns.value;
+  return flat.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营', '销售额', '广告销售额', '广告花费', '回款币种'].includes(item.title));
 });
 
 const filteredWeekColumns = computed(() => {
-  return weekColumns.value.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营','销售额','广告销售额','广告花费','当月累计销售额','Other回款金额','Amazon回款金额'].includes(item.title));
+  const flat = flatWeekColumns.value;
+  return flat.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营', '销售额', '广告销售额', '广告花费', '当月累计销售额', 'Other回款金额', 'Amazon回款金额','回款币种'].includes(item.title));
 });
 
 const filteredMonthColumns = computed(() => {
-  return monthColumns.value.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营','销售额','广告销售额','广告花费'].includes(item.title));
+  const flat = flatMonthColumns.value;
+  return flat.filter(item => !['平台编号', '平台名称', '国家', '品牌', '操作', '运营', '销售额', '广告销售额', '广告花费','回款币种'].includes(item.title));
 });
 
 onMounted(() => {
@@ -688,16 +709,16 @@ onMounted(() => {
 
 <template>
   <div>
-    <el-card class="custom-card-style justify-between my-1.5 mx-2" >
-      <div class="custom-card-style flex gap-1.5 justify-between my-1.5 mx-2" >
+    <el-card class="custom-card-style justify-between my-1.5 mx-2">
+      <div class="custom-card-style flex gap-1.5 justify-between my-1.5 mx-2">
         <Selector ref="selectorRef" @update:updateData="updateDataChange" />
         <div v-if="dateType === 'day'" class="demo-date-picker">
           <div class="block">
             <span class="demonstration">日数据时间:</span>
             <el-date-picker
                 v-model="dailySalesTime"
-                :shortcuts="shortcuts"
                 :disabled-date="disabledDate"
+                :shortcuts="shortcuts"
                 type="Date"
                 @change="handleDayChange"
             />
@@ -766,7 +787,7 @@ onMounted(() => {
   </div>
   <el-card class="mx-2">
     <div style="position: relative">
-      <vxe-grid ref="xGrid" stripe v-bind="currentGridOptions" v-on="gridEvents">
+      <vxe-grid ref="xGrid" v-bind="currentGridOptions" v-on="gridEvents">
         <template #operate="{ row }">
           <template v-if="hasActiveEditRow(row)">
             <el-button link size="small" @click="clearRowEvent(row)">取消</el-button>
@@ -777,6 +798,38 @@ onMounted(() => {
           </template>
           <el-button :disabled="row.id" link size="small" type="primary" @click="editEvent(row)">创建</el-button>
         </template>
+        <!--<template #sales_header>-->
+        <!--  <div class="first-col">-->
+        <!--    <div class="first-col-top">销售额</div>-->
+        <!--    <div class="first-col-bottom">销售额(本币)</div>-->
+        <!--  </div>-->
+        <!--</template>-->
+        <!--<template #sales_default="{ row }">-->
+        <!--  <div class="flex items-center gap-5">-->
+        <!--    <div>-->
+        <!--      $-->
+        <!--    </div>-->
+        <!--    <div>-->
+        <!--      <div class="font-bold">-->
+        <!--        {{ row.sales }}-->
+        <!--      </div>-->
+        <!--      <div style="color: #929ca5">-->
+        <!--        {{ row.sales_original }}-->
+        <!--      </div>-->
+        <!--    </div>-->
+        <!--  </div>-->
+        <!--</template>-->
+        <!--<template #sales_edit="{ row }">-->
+        <!--  <div class="flex">-->
+        <!--    <div>-->
+        <!--      $-->
+        <!--    </div>-->
+        <!--    <div>-->
+        <!--      {{ row.sales }}-->
+        <!--      <el-input v-model="row.sales_original" size="small"></el-input>-->
+        <!--    </div>-->
+        <!--  </div>-->
+        <!--</template>-->
         <template #sales_original_edit="{ row }">
           <vxe-input v-model="row.sales_original"></vxe-input>
         </template>
@@ -799,10 +852,10 @@ onMounted(() => {
           <vxe-input v-model="row.ad_order"></vxe-input>
         </template>
         <template #money_by_amazon_edit="{ row }">
-          <vxe-input v-model="row.money_by_amazon_original"></vxe-input>
+          <vxe-input v-model="row.money_by_amazon"></vxe-input>
         </template>
         <template #money_by_other_edit="{ row }">
-          <vxe-input v-model="row.money_by_other_original"></vxe-input>
+          <vxe-input v-model="row.money_by_other"></vxe-input>
         </template>
         <template #session_edit="{ row }">
           <vxe-input v-model="row.session"></vxe-input>
@@ -860,7 +913,7 @@ onMounted(() => {
   </el-dialog>
 </template>
 
-<style scoped>
+<style lang="scss" scoped>
 .demo-date-picker {
   display: flex;
   width: 100%;
@@ -883,9 +936,4 @@ onMounted(() => {
   border-radius: 10px;
   margin-bottom: 10px;
 }
-
-.flex-between {
-  display: flex;
-  justify-content: space-between;
-}
 </style>

src/views/reportManage/dataCenter/utils/columns.ts

@@ -1,30 +1,25 @@
 import { ref } from 'vue';
 //数据录入
 export const dayColumns = ref([
-  {field: 'platformNumber', title: '平台编号'},
-  {field: 'platformName', title: '平台名称'},
-  {field: 'country', title: '国家'},
-  {field: 'brandName', title: '品牌'},
-  {field: 'user_name', title: '运营'},
-
-  {field: 'sales', title: '销售额'},
-  {field: 'ad_sales', title: '广告销售额'},
-  {field: 'ad_cost', title: '广告花费'},
-  {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 157,},
-  {
-    field: 'ad_sales_original',
-    title: '广告销售额(本币)',
-    editRender: {},
-    slots: {edit: 'ad_sales_original_edit'},
-    width: 180,
-  },
-  {
-    field: 'ad_cost_original',
-    title: '广告花费(本币)',
-    editRender: {},
-    slots: {edit: 'ad_cost_original_edit'},
-    width: 180,
-  },
+  {field: 'platformNumber', title: '平台编号',align: 'center'},
+  {field: 'platformName', title: '平台名称',align: 'center'},
+  {field: 'country', title: '国家',align: 'center'},
+  {field: 'brandName', title: '品牌',align: 'center'},
+  {field: 'user_name', title: '运营',align: 'center'},
+  {field: 'currencyCode', title: '回款币种',align: 'center'},
+  {title: '销售额',align: 'center',children: [
+      {field: 'sales', title: '销售额',},
+      {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 122,align: 'center'},
+    ]},
+  {title:'广告销售额',align: 'center',children: [
+      {field: 'ad_sales', title: '广告销售额',align: 'center'},
+      {field: 'ad_sales_original', title: '广告销售额(本币)', editRender: {}, slots: {edit: 'ad_sales_original_edit'}, width: 151, align: 'center'},
+    ]},
+  //{field: 'sales', title: '销售额', editRender: {}, slots: {edit: 'sales_edit', default: 'sales_default',header: 'sales_header'}},
+  {title: '广告花费',align: 'center',children: [
+      {field: 'ad_cost', title: '广告花费',align: 'center'},
+      {field: 'ad_cost_original', title: '广告花费(本币)', editRender: {}, slots: {edit: 'ad_cost_original_edit'}, width: 138, align: 'center'},
+    ]},
   {title: '操作', width: 220, slots: {default: 'operate'}},
 ]);
 
@@ -34,52 +29,49 @@ export const weekColumns = ref([
   {field: 'country', title: '国家', fixed: 'left', width: 90},
   {field: 'brandName', title: '品牌', fixed: 'left', width: 90},
   {field: 'user_name', title: '运营', fixed: 'left', width: 90},
+  {field: 'currencyCode', title: '回款币种', fixed: 'left', width: 111},
+
+  {title: '销售额',align: 'center',children: [
+      {field: 'sales', title: '销售额', width: 120},
+      {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 122,},
+    ]},
+  {title: '广告销售额',align: 'center',children: [
+      {field: 'ad_sales', title: '广告销售额', width: 120},
+      {
+        field: 'ad_sales_original',
+        title: '广告销售额(本币)',
+        editRender: {},
+        slots: {edit: 'ad_sales_original_edit'},
+        width: 151,
+      },
+    ]},
+  {title: '广告花费',align: 'center',children: [
+      {field: 'ad_cost', title: '广告花费', width: 120},
+      {
+        field: 'ad_cost_original',
+        title: '广告花费(本币)',
+        editRender: {},
+        slots: {edit: 'ad_cost_original_edit'},
+        width: 138,
+      },
+    ]},
+  {title: '当月累计销售额',align: 'center',children:[
+      {field: 'total_sales_current_monthly', title: '当月累计销售额', width: 120},
+      {
+        field: 'total_sales_current_monthly_original',
+        title: '当月累计销售额(本币)',
+        editRender: {},
+        slots: {edit: 'total_sales_current_monthly_edit'},
+        width: 180,
+      },
+    ]},
 
-  {field: 'sales', title: '销售额', width: 120},
-  {field: 'ad_sales', title: '广告销售额', width: 120},
-  {field: 'ad_cost', title: '广告花费', width: 120},
-  {field: 'total_sales_current_monthly', title: '当月累计销售额', width: 120},
-  {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 122,},
-  {
-    field: 'ad_sales_original',
-    title: '广告销售额(本币)',
-    editRender: {},
-    slots: {edit: 'ad_sales_original_edit'},
-    width: 151,
-  },
-  {
-    field: 'ad_cost_original',
-    title: '广告花费(本币)',
-    editRender: {},
-    slots: {edit: 'ad_cost_original_edit'},
-    width: 138,
-  },
-  {
-    field: 'total_sales_current_monthly_original',
-    title: '当月累计销售额(本币)',
-    editRender: {},
-    slots: {edit: 'total_sales_current_monthly_edit'},
-    width: 180,
-  },
   {field: 'impression', title: '广告曝光', editRender: {}, slots: {edit: 'impression_edit'}, width: 120},
   {field: 'ad_click', title: '广告点击', editRender: {}, slots: {edit: 'ad_click_edit'}, width: 120},
   {field: 'ad_order', title: '广告订单', editRender: {}, slots: {edit: 'ad_order_edit'}, width: 120},
-  {field: 'money_by_amazon', title: 'Amazon回款金额', width: 120},
-  {field: 'money_by_other', title: 'Other回款金额', width: 120},
-  {
-    field: 'money_by_amazon_original',
-    title: 'Amazon回款金额(本币)',
-    editRender: {},
-    slots: {edit: 'money_by_amazon_edit'},
-    width: 120
-  },
-  {
-    field: 'money_by_other_original',
-    title: 'Other回款金额(本币)',
-    editRender: {},
-    slots: {edit: 'money_by_other_edit'},
-    width: 120
-  },
+  {field: 'money_by_amazon', title: 'Amazon回款金额', editRender: {}, slots: {edit: 'money_by_amazon_edit'},width: 134},
+  {field: 'currencyCodePlatform', title: '平台货币', editRender: {}, slots: {edit: 'currencyCodePlatform_edit'},width: 112},
+  {field: 'money_by_other', title: 'Other回款金额',editRender: {}, slots: {edit: 'money_by_other_edit'}, width: 134},
   {field: 'session', title: '流量', editRender: {}, slots: {edit: 'session_edit'}, width: 120},
   {field: 'order', title: '订单', editRender: {}, slots: {edit: 'order_edit'}, width: 120},
   {
@@ -113,45 +105,48 @@ export const monthColumns = ref([
   {field: 'country', title: '国家',width: 90},
   {field: 'brandName', title: '品牌',width: 90},
   {field: 'user_name', title: '运营',width: 90},
+  {field: 'currencyCode', title: '回款币种',width: 111},
 
-  {field: 'sales', title: '销售额',width: 90},
-  {field: 'ad_sales', title: '广告销售额',width: 91},
-  {field: 'ad_cost', title: '广告花费',width: 90},
-  {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 122,},
-  {
-    field: 'ad_sales_original',
-    title: '广告销售额(本币)',
-    editRender: {},
-    slots: {edit: 'ad_sales_original_edit'},
-    width: 151,
-  },
-  {
-    field: 'ad_cost_original',
-    title: '广告花费(本币)',
-    editRender: {},
-    slots: {edit: 'ad_cost_original_edit'},
-    width: 138,
-  },
-  {field: 'impression', title: '广告曝光', editRender: {}, slots: {edit: 'impression_edit'}},
-  {field: 'ad_click', title: '广告点击', editRender: {}, slots: {edit: 'ad_click_edit'}},
-  {field: 'ad_order', title: '广告订单', editRender: {}, slots: {edit: 'ad_order_edit'}},
+  {title: '销售额',align: 'center',children: [
+      {field: 'sales', title: '销售额', width: 120},
+      {field: 'sales_original', title: '销售额(本币)', editRender: {}, slots: {edit: 'sales_original_edit'}, width: 122,},
+    ]},
+  {title: '广告销售额',align: 'center',children: [
+      {field: 'ad_sales', title: '广告销售额', width: 120},
+      {
+        field: 'ad_sales_original',
+        title: '广告销售额(本币)',
+        editRender: {},
+        slots: {edit: 'ad_sales_original_edit'},
+        width: 151,
+      },
+    ]},
+  {title: '广告花费',align: 'center',children: [
+      {field: 'ad_cost', title: '广告花费', width: 120},
+      {
+        field: 'ad_cost_original',
+        title: '广告花费(本币)',
+        editRender: {},
+        slots: {edit: 'ad_cost_original_edit'},
+        width: 138,
+      },
+    ]},
+
+  {field: 'impression', title: '广告曝光', editRender: {}, slots: {edit: 'impression_edit'}, width: 120},
+  {field: 'ad_click', title: '广告点击', editRender: {}, slots: {edit: 'ad_click_edit'}, width: 120},
+  {field: 'ad_order', title: '广告订单', editRender: {}, slots: {edit: 'ad_order_edit'}, width: 120},
   {title: '操作', width: 120, slots: {default: 'operate'}, fixed: 'right'},
 ]);
 
 // 表格展示
 export const dayDataColumns = ref([
-  // {field: 'platformNumber', title: '平台编号', slots: {default: 'platformNumber_default'}},
-  // {field: 'platformName', title: '平台名称', slots: {default: 'platformName_default'}},
-  // {field: 'user_name', title: '运营', slots: {default: 'user_name_default'}},
-  // {field: 'country', title: '国家', slots: {default: 'country_default'}},
-  // {field: 'brandName', title: '品牌', slots: {default: 'brandName_default'}},
-  // {field: 'currencyCode', title: '汇款币种', slots: {default: 'currencyCode_default'}},
-  {field: '平台编号', title: '平台编号', fixed: 'left', width: 90},
-  {field: '平台名称', title: '平台名称', fixed: 'left', width: 90},
-  {field: '运营', title: '运营', fixed: 'left', width: 90},
-  {field: '国家', title: '国家', fixed: 'left', width: 90},
-  {field: '品牌名称', title: '品牌', fixed: 'left', width: 90},
-  {field: '货币名称', title: '汇款币种', fixed: 'left', width: 90},
+  {field: '平台编号', title: '平台编号', fixed: 'left',minWidth: 90},
+  {field: '平台名称', title: '平台名称', fixed: 'left', minWidth: 90},
+  {field: '运营', title: '运营', fixed: 'left', minWidth: 90},
+  {field: '国家', title: '国家', fixed: 'left', minWidth: 90},
+  {field: '品牌名称', title: '品牌', fixed: 'left', minWidth: 90},
+  {field: '货币名称', title: '回款币种', fixed: 'left', minWidth: 90},
+  //{field: 'currencyCodePlatform', title: '平台货币', fixed: 'left', width: 112},
   //{field: 'sales_original', title: '销售额(本币)', width: 104,},
   //{field: 'ad_sales_original', title: '广告销售额(本币)', width: 132,},
   //{field: 'ad_cost_original', title: '广告花费(本币)', width: 116,},
@@ -165,12 +160,13 @@ export const dayDataColumns = ref([
   // {field: 'roas', title: '广告ROAS'},
 ]);
 export const weekDataColumns = ref([
-  {field: 'platformNumber', title: '平台编号', fixed: 'left', width: 90},
-  {field: 'platformName', title: '平台名称', fixed: 'left', width: 90},
-  {field: 'user_name', title: '运营', fixed: 'left', width: 90},
-  {field: 'country', title: '国家', fixed: 'left', width: 90},
-  {field: 'brandName', title: '品牌', fixed: 'left', width: 90},
-  {field: 'currencyCode', title: '汇款币种', fixed: 'left', width: 90},
+  {field: 'platformNumber', title: '平台编号', fixed: 'left', minWidth: 90},
+  {field: 'platformName', title: '平台名称', fixed: 'left', minWidth: 90},
+  {field: 'user_name', title: '运营', fixed: 'left', minWidth: 90},
+  {field: 'country', title: '国家', fixed: 'left', minWidth: 90},
+  {field: 'brandName', title: '品牌', fixed: 'left', minWidth: 90},
+  {field: 'currencyCode', title: '回款币种', fixed: 'left', minWidth: 90},
+
   //{field: 'sales_original', title: '销售额(本币)', width: 104,},
   //{field: 'ad_sales_original', title: '广告销售额(本币)', width: 132,},
   //{field: 'ad_cost_original', title: '广告花费(本币)', width: 116,},
@@ -196,7 +192,7 @@ export const weekDataColumns = ref([
   //{field: 'ad_conversion_rate', title: '广告转化率', width: 120},
   //{field: 'money_by_amazon', title: 'Amazon回款金额', width: 120},
   //{field: 'money_by_other', title: 'Ebay及其他平台可用余额', width: 120},
-  //{field: 'currencyCode', title: '回款/余额币种', width: 120},
+  //{field: 'currencyCode', title: '回款币种', width: 120},
   //{field: 'total_sales_current_monthly', title: '销售额完成情况', width: 120},
   //{field: 'sales_weekly_year_on_year', title: '环比上周增长率', width: 120},
   //{field: 'sales_monthly_year_on_year', title: '环比上月周增长率', width: 120},
@@ -210,13 +206,13 @@ export const weekDataColumns = ref([
   //{field: 'refundRate', title: '最近90天平台退货率', width: 120},
 ]);
 export const monthDataColumns = ref([
-  {field: 'platformNumber', title: '平台编号', fixed: 'left', width: 90},
-  {field: 'platformName', title: '平台名称', fixed: 'left', width: 90},
-  {field: 'user_name', title: '运营', fixed: 'left', width: 90},
-  {field: 'country', title: '国家', fixed: 'left', width: 90},
-  {field: 'brandName', title: '品牌', fixed: 'left', width: 90},
-  {field: 'currencyCode', title: '汇款币种', fixed: 'left', width: 90},
-
+  {field: 'platformNumber', title: '平台编号', fixed: 'left', minWidth: 90},
+  {field: 'platformName', title: '平台名称', fixed: 'left', minWidth: 90},
+  {field: 'user_name', title: '运营', fixed: 'left', minWidth: 90},
+  {field: 'country', title: '国家', fixed: 'left', minWidth: 90},
+  {field: 'brandName', title: '品牌', fixed: 'left', minWidth: 90},
+  {field: 'currencyCode', title: '回款币种', fixed: 'left', minWidth: 90},
+  //{field: 'currencyCodePlatform', title: '平台货币', fixed: 'left', width: 112},
   //{field: 'sales', title: '销售额'},
   //{field: 'ad_cost', title: '广告花费'},
   //{field: 'ad_sales', title: '广告销售额'},
@@ -249,7 +245,7 @@ export const monthDataColumns = ref([
 //   {field: 'sales_monthly_year_on_year_week', title: '环比上月周增长率'},
 //   {field: 'sales_year_on_year', title: '同比上年周增长率'},
 //   {field: 'money_by_amazon', title: 'Amazon平台已回款金额'},
-//   {field: 'currencyCode', title: '回款/余额币种'},
+//   {field: 'currencyCode', title: '回款币种'},
 //   {field: 'money_by_other', title: 'Ebay及其他平台可用余额'},
 //   // // { field: 'session', title: '周流量'},
 //   // {field: 'ad_order', title: '订单'},