工作台中间柱状图和右边门店排名根据时间查询，各模块切换查询条件时分页回到1

vue/gold-system/src/views/audit/rechargeAudit.vue

@@ -118,6 +118,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   rechargeVo.value.activityId = "";
@@ -296,6 +301,7 @@ const pass = function (row) {
   passObj.value.auditId = row.auditId;
   passObj.value.status = 1;
   passObj.value.rechargeId=row.rechargeId;
+  passObj.value.detailId=row.detailId;
   console.log("通过对象", passObj.value);
 };
 
@@ -305,7 +311,7 @@ const passConfirm = async function () {
     console.log("通过对象", passObj.value);
     // 发送POST请求
     const result = await API.post(
-      "http://192.168.8.93:10010/audit/audit/edit",
+      "http://192.168.8.93:10010/audit/audit/goldedit",
       passObj.value
     );
 
@@ -339,6 +345,8 @@ const reject = function (row) {
   rejectObj.value.auditId = row.auditId;
   rejectObj.value.status = 2;
   rejectObj.value.reson = "";
+  rejectObj.value.rechargeId=row.rechargeId;
+  rejectObj.value.detailId=row.detailId;
   console.log("驳回对象", rejectObj.value);
   openRejectVisible();
 };
@@ -350,7 +358,7 @@ const rejectConfirm = async function () {
         console.log("驳回对象", rejectObj.value);
         // 发送POST请求
         const result = await API.post(
-          "http://192.168.8.93:10010/audit/audit/edit",
+          "http://192.168.8.93:10010/audit/audit/goldedit",
           rejectObj.value
         );
 
@@ -477,7 +485,7 @@ onMounted(async function () {
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>

vue/gold-system/src/views/audit/refundAudit.vue

@@ -105,6 +105,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   consumeDetail.value.area = "";
@@ -323,6 +328,7 @@ const reject = function (row) {
   rejectObj.value.auditId = row.auditId;
   rejectObj.value.status = 2;
   rejectObj.value.reson = "";
+  rejectObj.value.refundId=row.refundId;
   console.log("驳回对象", rejectObj.value);
   openRejectVisible();
 };
@@ -423,7 +429,7 @@ onMounted(async function () {
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>

vue/gold-system/src/views/consume/allConsume.vue

@@ -99,6 +99,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   detailVo.value.productName = "";
@@ -311,7 +316,7 @@ getGoods();
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>

vue/gold-system/src/views/managerecharge/activity.vue

@@ -92,7 +92,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   getObj.value = {};
@@ -303,7 +307,7 @@ onMounted(async function () {
           </div>
           <div class="head-card-btn">
             <el-button @click="reset()">重置</el-button>
-            <el-button type="primary" @click="get()">查询</el-button>
+            <el-button type="primary" @click="search()">查询</el-button>
           </div>
         </div>
       </el-card>

vue/gold-system/src/views/managerecharge/rate.vue

@@ -67,7 +67,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 添加方法
 const rateAdd = ref({
   adminId: "1",
@@ -345,7 +349,7 @@ const checkNumber = function () {
             class="button-item"
             type="primary"
             style="float: right"
-            @click="get"
+            @click="search()"
             >查询</el-button
           >
           <el-button

vue/gold-system/src/views/recharge/adminRecharge.vue

@@ -113,7 +113,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   rechargeVo.value.activityId = "";
@@ -399,7 +403,7 @@ onMounted(async function () {
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>

vue/gold-system/src/views/recharge/allRecharge.vue

@@ -103,6 +103,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   rechargeVo.value.activityId = "";
@@ -366,7 +371,7 @@ onMounted(async function () {
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>

vue/gold-system/src/views/refund/allRefund.vue

@@ -87,6 +87,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   detail.value.refundGoods = "";
@@ -393,7 +398,7 @@ const checkNumber = function () {
           <el-col :span="3">
             <div class="head-card-btn">
               <el-button @click="reset()">重置</el-button>
-              <el-button type="primary" @click="get()">查询</el-button>
+              <el-button type="primary" @click="search()">查询</el-button>
             </div>
           </el-col>
         </el-row>
@@ -504,7 +509,7 @@ const checkNumber = function () {
                       删除
                     </el-button>
                   </template>
-                  <template #actions="{ confirm, cancel }">
+                  <template #actions="{ delConfirm, cancel }">
                     <el-button size="small" @click="cancel">取消</el-button>
                     <el-button type="primary" size="small" @click="delConfirm">
                       确定
@@ -546,7 +551,7 @@ const checkNumber = function () {
             :page-size="getObj.pageSize"
             :total="total"
             :current-page="getObj.pageNum"
-            @current-change="get"
+            @current-change="get()"
           >
             <div>跳至</div>
             <el-input

vue/gold-system/src/views/usergold/index.vue

@@ -111,7 +111,11 @@ const get = async function (val) {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
-
+// 搜索
+const search = function () {
+  getObj.value.pageNum = 1;
+  get();
+};
 // 重置
 const reset = function () {
   detail.value.jwcode = "";
@@ -251,7 +255,7 @@ onMounted(async function () {
           </div>
           <div class="head-card-btn">
             <el-button @click="reset()">重置</el-button>
-            <el-button type="primary" @click="get()">查询</el-button>
+            <el-button type="primary" @click="search()">查询</el-button>
           </div>
         </div>
       </el-card>

vue/gold-system/src/views/workspace/index.vue

@@ -20,24 +20,18 @@ const getDayConsumeCoin = ref({});
 const searchTime = ref([]);
 
 // 月份柱状图
-// 充值
-const payTotalRecharge = ref(0);
-const payTotalFree = ref(0);
-const payTotalTask = ref(0);
-const getMediuPayCoin = ref({});
-const payMonthCategory = ref([]);
-const payMonthRecharge = ref([]);
-const payMonthFree = ref([]);
-const payMonthTask = ref([]);
-// 消费
-const consumeTotalRecharge = ref(0);
-const consumeTotalFree = ref(0);
-const consumeTotalTask = ref(0);
-const getMediuConsumeCoin = ref({});
-const consumeMonthCategory = ref([]);
-const consumeMonthRecharge = ref([]);
-const consumeMonthFree = ref([]);
-const consumeMonthTask = ref([]);
+const getMiddleBarObj = ref({
+  updateType: "充值"
+});
+const getMiddleBarData = ref({});
+const middleTotalRecharge = ref(0);
+const middleTotalFree = ref(0);
+const middleTotalTask = ref(0);
+const middleCategory = ref([]);
+const middleRecharge = ref([]);
+const middleFree = ref([]);
+const middleTask = ref([]);
+
 
 // 地区排名
 const getAreaRankObj = ref({
@@ -90,6 +84,7 @@ const list = ref([]);
 const get = async function () {
   try {
     getAreaRank();
+    getMiddleBar();
     // 发送POST请求
     const result1 = await API.post(
       "http://192.168.8.93:10010/statistics/getSumCoin",
@@ -116,14 +111,14 @@ const get = async function () {
     //   {}
     // );
 
-    const result7 = await API.post(
-      "http://192.168.8.93:10010/statistics/getMediuPayCoin",
-      {}
-    );
-    const result8 = await API.post(
-      "http://192.168.8.93:10010/statistics/getMediuConsumeCoin",
-      {}
-    );
+    // const result7 = await API.post(
+    //   "http://192.168.8.93:10010/statistics/getMediuPayCoin",
+    //   {}
+    // );
+    // const result8 = await API.post(
+    //   "http://192.168.8.93:10010/statistics/getMediuConsumeCoin",
+    //   {}
+    // );
     const result9 = await API.post(
       "http://192.168.8.93:10010/statistics/b",
       {}
@@ -135,78 +130,14 @@ const get = async function () {
     getYearConsumeCoin.value = result3.data;
     getDayConsumeCoin.value = result4.data;
 
-    getMediuPayCoin.value = result7.data;
-    getMediuConsumeCoin.value = result8.data;
     platformData.value = result9.data;
 
     console.log("getSumCoin", getSumCoin.value);
     console.log("statistics", statistics.value);
     console.log("getYearConsumeCoin", getYearConsumeCoin.value);
     console.log("getDayConsumeCoin", getDayConsumeCoin.value);
-
-    console.log("getMediuPayCoin", getMediuPayCoin.value);
-    console.log("getMediuConsumeCoin", getMediuConsumeCoin.value);
     console.log("platformData", platformData.value);
 
-    // 月份
-    // 充值
-    payMonthCategory.value = getMediuPayCoin.value
-      .map((item) => item.month)
-      .reverse();
-    payMonthRecharge.value = getMediuPayCoin.value
-      .map((item) => Math.abs(item.rechargeSumCoin))
-      .reverse();
-    payMonthFree.value = getMediuPayCoin.value
-      .map((item) => Math.abs(item.freeSumCoin))
-      .reverse();
-    payMonthTask.value = getMediuPayCoin.value
-      .map((item) => Math.abs(item.taskSumCoin))
-      .reverse();
-    payMonthRecharge.value.forEach((number) => {
-      payTotalRecharge.value += number;
-    });
-    payMonthFree.value.forEach((number) => {
-      payTotalFree.value += number;
-    });
-    payMonthTask.value.forEach((number) => {
-      payTotalTask.value += number;
-    });
-    console.log("payMonthCategory", payMonthCategory.value);
-    console.log("payMonthRecharge", payMonthRecharge.value);
-    console.log("payMonthFree", payMonthFree.value);
-    console.log("payMonthTask", payMonthTask.value);
-    console.log("payTotalRecharge", payTotalRecharge.value);
-    console.log("payTotalFree", payTotalFree.value);
-    console.log("payTotalTask", payTotalTask.value);
-    // 消费
-    consumeMonthCategory.value = getMediuConsumeCoin.value
-      .map((item) => item.month)
-      .reverse();
-    consumeMonthRecharge.value = getMediuConsumeCoin.value
-      .map((item) => Math.abs(item.rechargeSumCoin))
-      .reverse();
-    consumeMonthFree.value = getMediuConsumeCoin.value
-      .map((item) => Math.abs(item.freeSumCoin))
-      .reverse();
-    consumeMonthTask.value = getMediuConsumeCoin.value
-      .map((item) => Math.abs(item.taskSumCoin))
-      .reverse();
-    consumeMonthRecharge.value.forEach((number) => {
-      consumeTotalRecharge.value += number;
-    });
-    consumeMonthFree.value.forEach((number) => {
-      consumeTotalFree.value += number;
-    });
-    consumeMonthTask.value.forEach((number) => {
-      consumeTotalTask.value += number;
-    });
-    console.log("consumeMonthCategory", consumeMonthCategory.value);
-    console.log("consumeMonthRecharge", consumeMonthRecharge.value);
-    console.log("consumeMonthFree", consumeMonthFree.value);
-    console.log("consumeMonthTask", consumeMonthTask.value);
-    console.log("consumeTotalRecharge", consumeTotalRecharge.value);
-    console.log("consumeTotalFree", consumeTotalFree.value);
-    console.log("consumeTotalTask", consumeTotalTask.value);
 
     option3Data.value = [
       {
@@ -432,10 +363,197 @@ const get = async function () {
     // 在这里可以处理错误逻辑，比如显示错误提示等
   }
 };
+// 获取中间柱状图数据
+const getMiddleBar = async function () {
+  const result = await API.post(
+    "http://192.168.8.147:10010/statistics/getCoinTime",
+    getMiddleBarObj.value
+  );
+
+  getMiddleBarData.value = result.data;
+  console.log("getMiddleBarData", getMiddleBarData.value);
+
+  // 柱状图数据处理
+  middleCategory.value = getMiddleBarData.value
+    .map((item) => item.day == null ? item.month : item.day.substring(0, 10));
+  middleRecharge.value = getMiddleBarData.value
+    .map((item) => Math.abs(item.rechargeSumCoin));
+  middleFree.value = getMiddleBarData.value
+    .map((item) => Math.abs(item.freeSumCoin));
+  middleFree.value = getMiddleBarData.value
+    .map((item) => Math.abs(item.taskSumCoin));
+
+  middleTotalRecharge.value = 0;
+  middleTotalFree.value = 0;
+  middleTotalTask.value = 0;
+  middleRecharge.value.forEach((number) => {
+    middleTotalRecharge.value += number;
+  });
+  middleFree.value.forEach((number) => {
+    middleTotalFree.value += number;
+  });
+  middleTask.value.forEach((number) => {
+    middleTotalTask.value += number;
+  });
+
+  console.log("middleCategory", middleCategory.value);
+  console.log("middleRecharge", middleRecharge.value);
+  console.log("middleFree", middleFree.value);
+  console.log("middleTask", middleTask.value);
+  console.log("middleTotalRecharge", middleTotalRecharge.value);
+  console.log("middleTotalFree", middleTotalFree.value);
+  console.log("middleTotalTask", middleTotalTask.value);
+
+  if (getMiddleBarObj.value.updateType == "充值") {
+    // 基于准备好的dom，初始化echarts实例
+    var recharge = echarts.init(document.getElementById("recharge"));
+    const option = {
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          // Use axis to trigger tooltip
+          type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
+        },
+      },
+      legend: {
+        show: false,
+      },
+      grid: {
+        left: "3%",
+        right: "4%",
+        bottom: "3%",
+        containLabel: true,
+      },
+      xAxis: {
+        type: "category",
+        data: middleCategory.value,
+      },
+      yAxis: {
+        type: "value",
+      },
+      series: [
+        {
+          name: "充值金币",
+          color: "#35e383",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleRecharge.value,
+        },
+        {
+          name: "免费金币",
+          color: "#5f8ff5",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleFree.value,
+        },
+        {
+          name: "任务金币",
+          color: "#ffe733",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleTask.value,
+        },
+      ],
+    };
+    
+    // 使用刚指定的配置项和数据显示图表。
+    recharge.setOption(option);
+  } else {
+    // 基于准备好的dom，初始化echarts实例
+    var consume = echarts.init(document.getElementById("consume"));
+    const option = {
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          // Use axis to trigger tooltip
+          type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
+        },
+      },
+      legend: {
+        show: false,
+      },
+      grid: {
+        left: "3%",
+        right: "4%",
+        bottom: "3%",
+        containLabel: true,
+      },
+      xAxis: {
+        type: "category",
+        data: middleCategory.value,
+      },
+      yAxis: {
+        type: "value",
+      },
+      series: [
+        {
+          name: "充值金币",
+          color: "#35e383",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleRecharge.value,
+        },
+        {
+          name: "免费金币",
+          color: "#5f8ff5",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleFree.value,
+        },
+        {
+          name: "任务金币",
+          color: "#ffe733",
+          type: "bar",
+          stack: "total",
+          label: {
+            show: false,
+          },
+          emphasis: {
+            focus: "series",
+          },
+          data: middleTask.value,
+        },
+      ],
+    };
+    // 使用刚指定的配置项和数据显示图表。
+    consume.setOption(option);
+  }
+}
+
 // 获取门店排名
 const getAreaRank = async function () {
   const result = await API.post(
-    "http://192.168.8.93:10010/statistics/getMee",
+    "http://192.168.8.147:10010/statistics/getMee",
     getAreaRankObj.value
   );
 
@@ -496,12 +614,15 @@ const changeGoldType = function () {
 // 点击标签页初始化
 const handleChange = function () {
   if (activeName.value == "recharge") {
+    getMiddleBarObj.value.updateType = "充值";
     getAreaRankObj.value.updateType = "充值";
   } else {
+    getMiddleBarObj.value.updateType = "消费";
     getAreaRankObj.value.updateType = "消费";
   }
   getAreaRankObj.value.type = "";
   goldType.value = "全部类型";
+  getMiddleBar();
   getAreaRank();
 };
 // 时间范围控制
@@ -509,8 +630,8 @@ const disabledDate = function (date) {
   const currentDate = new Date();
   const startDate = new Date(currentDate.getFullYear(), currentDate.getMonth() - 1, 1);
   const endDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
-  if(date >= startDate && date <= endDate){
-       return false;
+  if (date >= startDate && date <= endDate) {
+    return false;
   }
   return true;
 }
@@ -525,26 +646,20 @@ const today = function () {
   const endDate = new Date(
     current.getFullYear(),
     current.getMonth(),
-    current.getDate() + 1
+    current.getDate()
   );
   searchTime.value = [startDate, endDate];
   search();
   // console.log("searchTime", moment(searchTime.value[0]).format("YYYY-MM-DD") + "至" + moment(searchTime.value[1]).format("YYYY-MM-DD"))
-  
+
 };
 // 本周
-const  thisWeek= function () {
+const thisWeek = function () {
   const current = new Date();
-  const startDate = new Date(
-    current.getFullYear(),
-    current.getMonth(),
-    current.getDate() - 6
-  );
-  const endDate = new Date(
-    current.getFullYear(),
-    current.getMonth(),
-    current.getDate() + 1
-  );
+  const dayOfWeek = current.getDay(); // 获取今天是星期几（0 表示周日，1 表示周一，以此类推）
+  const diff = current.getDate() - dayOfWeek + (dayOfWeek === 0 ? -6 : 1); // 计算本周第一天的日期差值
+  const startDate = new Date(current.getFullYear(), current.getMonth(), diff);
+  const endDate = new Date(current.getFullYear(), current.getMonth(), diff + 6);
   searchTime.value = [startDate, endDate];
   search();
   // console.log("searchTime", moment(searchTime.value[0]).format("YYYY-MM-DD") + "至" + moment(searchTime.value[1]).format("YYYY-MM-DD"))
@@ -559,7 +674,7 @@ const thisMonth = function () {
   );
   const endDate = new Date(
     current.getFullYear(),
-    current.getMonth()+1,
+    current.getMonth() + 1,
     0
   );
   searchTime.value = [startDate, endDate];
@@ -575,7 +690,7 @@ const thisYear = function () {
     1
   );
   const endDate = new Date(
-    current.getFullYear()+1,
+    current.getFullYear() + 1,
     0,
     0
   );
@@ -583,22 +698,35 @@ const thisYear = function () {
   search();
   // console.log("searchTime", moment(searchTime.value[0]).format("YYYY-MM-DD") + "至" + moment(searchTime.value[1]).format("YYYY-MM-DD"))
 };
-const allTime=function(){
-  searchTime.value=["",""];
+const allTime = function () {
+  searchTime.value = ["", ""];
   search();
 }
 // 根据时间搜索
-const search=function(){
-  console.log("searchTime", moment(searchTime.value[0]).format("YYYY-MM-DD") + "至" + moment(searchTime.value[1]).format("YYYY-MM-DD"))
+const search = function () {
+  console.log("searchTime", moment(searchTime.value[0]).format("YYYY-MM-DD") + "至" + moment(searchTime.value[1]).format("YYYY-MM-DD"));
+
+  getMiddleBarObj.value.searchStartTime = moment(searchTime.value[0]).format("YYYY-MM-DD");
+  getMiddleBarObj.value.searchEndTime = moment(searchTime.value[1]).format("YYYY-MM-DD");
+  if (getMiddleBarObj.value.searchStartTime == "Invalid date") {
+    delete getMiddleBarObj.value.searchStartTime;
+  }
+  if (getMiddleBarObj.value.searchEndTime == "Invalid date") {
+    delete getMiddleBarObj.value.searchEndTime;
+  }
+  console.log("getMiddleBarObj", getMiddleBarObj.value);
+
   getAreaRankObj.value.searchStartTime = moment(searchTime.value[0]).format("YYYY-MM-DD");
   getAreaRankObj.value.searchEndTime = moment(searchTime.value[1]).format("YYYY-MM-DD");
-  if(getAreaRankObj.value.searchStartTime=="Invalid date"){
+  if (getAreaRankObj.value.searchStartTime == "Invalid date") {
     delete getAreaRankObj.value.searchStartTime;
   }
-  if(getAreaRankObj.value.searchEndTime=="Invalid date"){
+  if (getAreaRankObj.value.searchEndTime == "Invalid date") {
     delete getAreaRankObj.value.searchEndTime;
   }
   console.log("getAreaRankObj", getAreaRankObj.value);
+
+  getMiddleBar();
   getAreaRank();
 }
 
@@ -738,7 +866,7 @@ onMounted(async function () {
     },
     xAxis: {
       type: "category",
-      data: payMonthCategory.value,
+      data: middleCategory.value,
     },
     yAxis: {
       type: "value",
@@ -750,12 +878,12 @@ onMounted(async function () {
         type: "bar",
         stack: "total",
         label: {
-          show: true,
+          show: false,
         },
         emphasis: {
           focus: "series",
         },
-        data: payMonthRecharge.value,
+        data: middleRecharge.value,
       },
       {
         name: "免费金币",
@@ -763,12 +891,12 @@ onMounted(async function () {
         type: "bar",
         stack: "total",
         label: {
-          show: true,
+          show: false,
         },
         emphasis: {
           focus: "series",
         },
-        data: payMonthFree.value,
+        data: middleFree.value,
       },
       {
         name: "任务金币",
@@ -776,89 +904,18 @@ onMounted(async function () {
         type: "bar",
         stack: "total",
         label: {
-          show: true,
+          show: false,
         },
         emphasis: {
           focus: "series",
         },
-        data: payMonthTask.value,
+        data: middleTask.value,
       },
     ],
   };
   // 使用刚指定的配置项和数据显示图表。
   rechargeBar.setOption(option1);
 
-  //第二个柱状图 基于准备好的dom，初始化echarts实例
-  var consumeBar = echarts.init(document.getElementById("consume"));
-  const option2 = {
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        // Use axis to trigger tooltip
-        type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
-      },
-    },
-    legend: {
-      show: false,
-    },
-    grid: {
-      left: "3%",
-      right: "4%",
-      bottom: "3%",
-      containLabel: true,
-    },
-    xAxis: {
-      type: "category",
-      data: consumeMonthCategory.value,
-    },
-    yAxis: {
-      type: "value",
-    },
-    series: [
-      {
-        name: "充值金币",
-        color: "#35e383",
-        type: "bar",
-        stack: "total",
-        label: {
-          show: true,
-        },
-        emphasis: {
-          focus: "series",
-        },
-        data: consumeMonthRecharge.value,
-      },
-      {
-        name: "免费金币",
-        color: "#5f8ff5",
-        type: "bar",
-        stack: "total",
-        label: {
-          show: true,
-        },
-        emphasis: {
-          focus: "series",
-        },
-        data: consumeMonthFree.value,
-      },
-      {
-        name: "任务金币",
-        color: "#ffe733",
-        type: "bar",
-        stack: "total",
-        label: {
-          show: true,
-        },
-        emphasis: {
-          focus: "series",
-        },
-        data: consumeMonthTask.value,
-      },
-    ],
-  };
-  // 使用刚指定的配置项和数据显示图表。
-  consumeBar.setOption(option2);
-
   // 第一个饼状图 基于准备好的dom，初始化echarts实例
   var yearRechargePie = echarts.init(document.getElementById("yearRecharge"));
   const option3 = {
@@ -1126,24 +1183,24 @@ onMounted(async function () {
             <el-button text @click="thisMonth()">本月</el-button>
             <el-button text @click="thisYear()">本年</el-button>
             <el-date-picker v-model="searchTime" type="daterange" range-separator="→" start-placeholder="开始时间"
-              end-placeholder="结束时间" style="width: 200px;" :disabled-date="disabledDate"  @change="search"/>
+              end-placeholder="结束时间" style="width: 200px;" :disabled-date="disabledDate" @change="search" />
           </div>
 
-          <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" @tab-change="handleChange">
+          <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handleChange">
             <el-tab-pane label="金币充值" name="recharge">
               <div>
                 合计：充值金币：
                 <span class="mid-head-font">{{
-                  formatNum(payTotalRecharge)
+                  formatNum(middleTotalRecharge)
                 }}</span>
                 ，免费金币：
-                <span class="mid-head-font">{{ formatNum(payTotalFree) }}</span>
+                <span class="mid-head-font">{{ formatNum(middleTotalFree) }}</span>
                 ，任务金币：
-                <span class="mid-head-font">{{ formatNum(payTotalTask) }}</span>
+                <span class="mid-head-font">{{ formatNum(middleTotalTask) }}</span>
               </div>
               <div class="bar">
                 <el-scrollbar style="width: 1150px;">
-                  <div id="recharge" style="width: 1150px; height: 400px"></div>
+                  <div id="recharge" style="width: 100%; height: 400px;"></div>
                 </el-scrollbar>
 
                 <div style="width: 100px">
@@ -1189,19 +1246,22 @@ onMounted(async function () {
               <div>
                 合计：充值金币：
                 <span class="mid-head-font">{{
-                  formatNum(consumeTotalRecharge)
+                  formatNum(middleTotalRecharge)
                 }}</span>
                 ，免费金币：
                 <span class="mid-head-font">{{
-                  formatNum(consumeTotalFree)
+                  formatNum(middleTotalFree)
                 }}</span>
                 ，任务金币：
                 <span class="mid-head-font">{{
-                  formatNum(consumeTotalTask)
+                  formatNum(middleTotalTask)
                 }}</span>
               </div>
               <div class="bar">
-                <div id="consume" style="width: 1150px; height: 400px"></div>
+                <el-scrollbar style="width: 1150px;">
+                  <div id="consume" style="width: 100%; height: 400px;"></div>
+                </el-scrollbar>
+
                 <div style="width: 100px">
                   <div class="goldCategory">
                     <span class="light-green-dot"></span>
@@ -1297,7 +1357,6 @@ onMounted(async function () {
 </template>
 
 <style scoped>
-
 .head-mid-font {
   font-size: 20px;
   font-weight: bold;