把原本模块切成：日报表、月报表、其他

src/views/EHSD/saleContract/dailyReport/index.vue

@@ -1,15 +1,14 @@
 <template>
   <div class="pageIndexClass">
     <div style="background-color: #fff; padding: 15px 15px 0">
+
+      <el-tabs v-model="sourceList.pagination.current" type="card" class="demo-tabs" @tab-change="changeCurrent">
+        <el-tab-pane label="日报表" name="日报表"></el-tab-pane>
+        <el-tab-pane label="月报表" name="月报表"></el-tab-pane>
+        <el-tab-pane label="其他" name="其他"></el-tab-pane>
+      </el-tabs>
       <el-form :inline="true" :model="sourceList.pagination">
-        <el-form-item label="">
-          <el-radio-group v-model="sourceList.pagination.current" size="default" @change="changeCurrent">
-            <el-radio-button label="本日" />
-            <el-radio-button label="本周" />
-            <el-radio-button label="本月" />
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="其他">
+        <el-form-item label="其他" v-if="sourceList.pagination.current == '其他'">
           <el-date-picker v-model="sourceList.pagination.beginTime" type="date" placeholder="开始日期" value-format="YYYY-MM-DD 00:00:00"
                           :disabled-date="disabledFn" />
           <div style="padding:0 10px">
@@ -19,15 +18,97 @@
                           :disabled-date="disabledFn" />
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" @click="onQuery" class="query">搜索</el-button>
-          <el-button @click="onReset">重置</el-button>
+          <el-button  v-if="sourceList.pagination.current == '其他'" type="primary" @click="onQuery" class="query">搜索</el-button>
+          <el-button  v-if="sourceList.pagination.current == '其他'" @click="onReset()">重置</el-button>
           <el-button type="primary" @click="exportExcel">导出Excel</el-button>
-
         </el-form-item>
       </el-form>
     </div>
     <div style="background:#fff;padding:15px;margin-top:10px">
-      <el-table :data="sourceList.data" :height="tableHeight" style="width: 100%" v-loading="loading" border id="my-table">
+      <!-- 如果是日报表，则所有列宽度平均 -->
+      <el-table v-if="sourceList.pagination.current == '日报表'" :data="sourceList.data" :height="tableHeight" style="width: 100%" v-loading="loading" border id="my-table">
+        <el-table-column prop="groupName" label="组别" fixed="left" />
+        <el-table-column prop="saleUserName" label="业务员" fixed="left" />
+
+        <template v-if="dayList && dayList.length>0">
+          <el-table-column v-for="col in dayList" :key="col" :label="col" align="center">
+            <el-table-column prop="address" label="系统" min-width="" align="right">
+              <template #default="{ row, $index }">
+                <div style="width: 100%" :class="today==col?'isToday':''" v-if="row[col] && row[col].sumContractAmount">
+                  {{moneyFormat(row[col].sumContractAmount,2)}}
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column prop="address" label="聚水潭" min-width="" align="right">
+              <template #default="{ row, $index }">
+                <div style="width: 100%" :class="today==col?'isToday':''" v-if="row[col] && row[col].sumJstAmount">
+                  {{moneyFormat(row[col].sumJstAmount,2)}}
+                </div>
+              </template>
+            </el-table-column>
+          </el-table-column>
+        </template>
+
+        <el-table-column align="right" fixed="right">
+          <template #header>
+            <div>
+              系统
+              <br>
+              月累计
+            </div>
+          </template>
+          <template #default="{ row, $index }">
+            <div style="width: 100%">
+              {{moneyFormat(row.sumContractAmount,2)}}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="right" fixed="right">
+          <template #header>
+            <div>
+              聚水潭
+              <br>
+              月累计
+            </div>
+          </template>
+          <template #default="{ row, $index }">
+            <div style="width: 100%">
+              {{moneyFormat(row.sumJstAmount,2)}}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="right" fixed="right">
+          <template #header>
+            <div>
+              合计
+              <br>
+              月累计
+            </div>
+          </template>
+          <template #default="{ row, $index }">
+            <div style="width: 100%">
+              {{moneyFormat(row.sumAmount,2)}}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="月目标" align="right" fixed="right">
+          <template #default="{ row, $index }">
+            <div style="width: 100%">
+              {{moneyFormat(row.targetAmount,2)}}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="月达成率" align="right" fixed="right">
+          <template #default="{ row, $index }">
+            <div style="width: 100%">
+              {{moneyFormat(row.finishRate,2)}} %
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="ranking" label="排名" align="center" fixed="right" />
+      </el-table>
+      <!-- 否则，使用固定值 -->
+      <el-table v-else :data="sourceList.data" :height="tableHeight" style="width: 100%" v-loading="loading" border id="my-table">
         <el-table-column prop="groupName" label="组别" width="110" fixed="left" />
         <el-table-column prop="saleUserName" label="业务员" width="80" fixed="left" />
 
@@ -50,7 +131,7 @@
           </el-table-column>
         </template>
 
-        <el-table-column width="95" align="right" fixed="right">
+        <el-table-column width="columnWithWidth" align="right" fixed="right">
           <template #header>
             <div>
               系统
@@ -109,7 +190,6 @@
         <el-table-column prop="ranking" label="排名" width="60" align="center" fixed="right" />
       </el-table>
     </div>
-
   </div>
 </template>
 
@@ -123,7 +203,7 @@ import { nextTick } from "vue";
 const { proxy } = getCurrentInstance();
 const tableHeight = ref(0);
 const getTableHeight = () => {
-  tableHeight.value = window.innerHeight - 150 - 79;
+  tableHeight.value = window.innerHeight - 150 - 79 - 55;
 };
 getTableHeight();
 window.addEventListener("resize", () => {
@@ -145,12 +225,16 @@ const sourceList = ref({
     pageSize: 10,
     beginTime: "",
     endTime: "",
-    current: "本月",
+    // current: "本月",
+    current: "月报表",
   },
 });
+
+const columnWithWidth = undefined;
 const loading = ref(false);
 const getList = (req) => {
   sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
+  console.log(sourceList.value.pagination, "123123");
   loading.value = true;
   proxy
     .post("/deptPerf/monthlyReporting", sourceList.value.pagination)
@@ -181,16 +265,21 @@ const onQuery = () => {
 };
 
 const changeCurrent = (val) => {
+  console.log(val);
   switch (val) {
-    case "本日":
+    // case "本周":
+    //   sourceList.value.pagination.beginTime = weekBegin.value;
+    //   sourceList.value.pagination.endTime = weekEnd.value;
+    //   break;
+    case "日报表":
       sourceList.value.pagination.beginTime = today.value + " 00:00:00";
       sourceList.value.pagination.endTime = today.value + " 23:59:59";
       break;
-    case "本周":
-      sourceList.value.pagination.beginTime = weekBegin.value;
-      sourceList.value.pagination.endTime = weekEnd.value;
+    case "月报表":
+      sourceList.value.pagination.beginTime = beginTime.value;
+      sourceList.value.pagination.endTime = endTime.value;
       break;
-    case "本月":
+    case "其他":
       sourceList.value.pagination.beginTime = beginTime.value;
       sourceList.value.pagination.endTime = endTime.value;
       break;
@@ -198,13 +287,13 @@ const changeCurrent = (val) => {
   onQuery();
 };
 
-const onReset = () => {
-  sourceList.value.pagination.current = "本月";
+const onReset = (val='其他') => {
+  sourceList.value.pagination.current = val;
   sourceList.value.pagination.beginTime = beginTime.value;
   sourceList.value.pagination.endTime = endTime.value;
   onQuery();
 };
-onReset();
+onReset('月报表');
 
 // const nowYearMonth = ref(moment().format("YYYY-MM"));
 const disabledFn = (date) => {