fix: 关闭home挂载导出 复制慧琳姐的 工作台内容（为了打包）

src/views/home.vue

@@ -130,9 +130,10 @@ function logout() {
 // 挂载
 onMounted(async function () {
   // 获取用户信息
-  //getAdminData()
-  // 初始化获取导出列表
-  await getExportList()
+
+  await getAdminData()
+  // // 初始化获取导出列表
+  // await getExportList()
 })
 // 处理地区点击事件，直接在组件内更新当前地区，包老师改的，直接传参
 const changeDataByArea = (item) => {

src/views/workspace/index.vue

@@ -1,5 +1,4 @@
 <template>
-
   <el-row>
     <!-- 数据总览卡片 -->
     <el-col :span="4" style="padding-right: 10px;"> <!-- 适当留白避免拥挤 -->
@@ -14,6 +13,7 @@
     <!-- 剩余栅格空间（可选，用于占满一行） -->
     <el-col :span="18"></el-col>
   </el-row>
+
   <el-row :gutter="10">
     <!-- 第一个卡片 -->
     <el-col :span="6">
@@ -21,23 +21,21 @@
         <template #header>
           <div class="card-header">
             <div class="card-title">当前金币余量</div>
-            <div>{{ currentGold / 100 }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;较前一日
-              {{
-                dailyChange / 100
-              }}
+            <div>{{ currentGold / 100 }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;较前一日 {{
+                dailyChange / 100 }}
               <template v-if="dailyChange > 0">
                 <el-icon style="color:red">
-                  <ArrowUpBold/>
+                  <ArrowUpBold />
                 </el-icon>
               </template>
               <template v-else-if="dailyChange < 0">
                 <el-icon style="color:forestgreen">
-                  <ArrowDownBold/>
+                  <ArrowDownBold />
                 </el-icon>
               </template>
               <template v-else>
                 <el-icon style="color:grey">
-                  <SemiSelect/>
+                  <SemiSelect />
                 </el-icon>
               </template>
             </div>
@@ -48,9 +46,7 @@
           <div class="margin-bottom">免费金币：{{ currentFree / 100 }}</div>
           <div class="margin-bottom">[六月到期|{{ currentFreeJune / 100 }}]&nbsp;&nbsp;&nbsp;&nbsp;[12月到期|{{
               currentFreeDecember /
-              100
-            }}]
-          </div>
+              100 }}]</div>
           <div>任务金币：{{ currentTask / 100 }}</div>
         </div>
       </el-card>
@@ -73,14 +69,14 @@
     <!-- 第三个卡片 -->
     <el-col :span="6">
       <el-card class="card-item">
-        <div class="card-title">全年累计消费金币数</div>
+        <div class="card-title">全年累计消耗金币数</div>
         <div class="card-title">{{ yearlyReduce / 100 }}</div>
         <div class="center-card">消费：{{ yearlyConsume / 100 }}</div>
         <div class="center-card">退款：{{ yearlyRefund / 100 }}</div>
         <template #footer>
           <div></div>
-          <div class="margin-bottom center-card">昨日新增消费：{{ dailyConsume / 100 }}</div>
           <div class="margin-bottom center-card">昨日新增消耗：{{ dailyReduce / 100 }}</div>
+          <div class="margin-bottom center-card">昨日新增消费：{{ dailyConsume / 100 }}</div>
           <div class="margin-bottom center-card">昨日新增退款：{{ dailyRefund / 100 }}</div>
         </template>
       </el-card>
@@ -94,34 +90,34 @@
         <el-col class="center-card">周同比:{{ sumWow }}%&nbsp;&nbsp;&nbsp;&nbsp;
           <template v-if="sumWow > 0">
             <el-icon style="color:red">
-              <ArrowUpBold/>
+              <ArrowUpBold />
             </el-icon>
           </template>
           <template v-else-if="sumWow < 0">
             <el-icon style="color:forestgreen">
-              <ArrowDownBold/>
+              <ArrowDownBold />
             </el-icon>
           </template>
           <template v-else>
             <el-icon style="color:grey">
-              <SemiSelect/>
+              <SemiSelect />
             </el-icon>
           </template>
         </el-col>
-        <el-col class="center-card">日环比:{{ sumDaily.toFixed(2) }}%&nbsp;&nbsp;&nbsp;&nbsp;
+        <el-col class="center-card">日环比:{{ sumDaily }}%&nbsp;&nbsp;&nbsp;&nbsp;
           <template v-if="sumDaily > 0">
             <el-icon style="color:red">
-              <ArrowUpBold/>
+              <ArrowUpBold />
             </el-icon>
           </template>
           <template v-else-if="sumDaily < 0">
             <el-icon style="color:forestgreen">
-              <ArrowDownBold/>
+              <ArrowDownBold />
             </el-icon>
           </template>
           <template v-else>
             <el-icon style="color:grey">
-              <SemiSelect/>
+              <SemiSelect />
             </el-icon>
           </template>
         </el-col>
@@ -146,14 +142,11 @@
           <el-col :span="24">
             <el-row>
               <div style="margin-top:5px">合计&nbsp;&nbsp;&nbsp;&nbsp;
-                永久金币 {{
-                  activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100
+                永久金币 {{ activeTab === 'recharge' ? sumRechargePermanent / 100 : sumConsumePermanent / 100
                 }}&nbsp;&nbsp;&nbsp;&nbsp;
-                免费金币 {{
-                  activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100
+                免费金币 {{ activeTab === 'recharge' ? sumRechargeFree / 100 : sumConsumeFree / 100
                 }}&nbsp;&nbsp;&nbsp;&nbsp;
-                任务金币 {{
-                  activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100
+                任务金币 {{ activeTab === 'recharge' ? sumRechargeTask / 100 : sumConsumeTask / 100
                 }}&nbsp;&nbsp;&nbsp;&nbsp;
               </div>
               <div @change="handleDatePickerChange">
@@ -208,21 +201,13 @@
 
 <script setup>
 import * as echarts from 'echarts'
-import {onMounted, ref, watch} from 'vue'
+import { ref, onMounted, nextTick, watch, onUnmounted } from 'vue'
 import API from '@/util/http'
-import {ElMessage} from 'element-plus'
+import { ElMessage } from 'element-plus'
 import dayjs from 'dayjs';
 import utc from 'dayjs-plugin-utc'
-import {ArrowDownBold, ArrowUpBold, SemiSelect} from '@element-plus/icons-vue'
-
 dayjs.extend(utc)
-
-// 标记当前激活的时间范围按钮
-const activeTimeRange = ref('')
-// 日期选择器变化时清除按钮激活状态
-const handleDatePickerChange = () => {
-  activeTimeRange.value = ''
-}
+import { ArrowUpBold, ArrowDownBold, SemiSelect } from '@element-plus/icons-vue'
 // 地区数据
 const markets = ref([])
 // 图表相关
@@ -265,8 +250,39 @@ const sumDaily = ref(0)
 const rechargeNum = ref(0)
 const firstRecharge = ref(0)
 const length = ref(0)
-const isLoading = ref(false)
-const formatDate = function (date) {
+//  加载状态
+const chartLoading = ref(true)
+
+const handleResize = () => {
+  if (chartInstance.value) {
+    try {
+      chartInstance.value.resize()
+      console.log('resize一下')
+    } catch (error) {
+      console.error('图表resize失败:', error)
+    }
+  }
+}
+// 初始化图表
+const initChart = () => {
+  if (!chartInstance && chartRef.value) {
+    chartInstance = echarts.init(chartRef.value)
+    window.addEventListener('resize', handleResize)
+  }
+}
+// 销毁图表
+const destroyChart = () => {
+  if (chartInstance.value) {
+    try {
+      chartInstance.value.dispose()
+    } catch (error) {
+      console.error('图表销毁失败:', error)
+    }
+    chartInstance.value = null
+  }
+  window.removeEventListener('resize', handleResize)
+}
+const formatDate = function(date) {
   const year = date.getFullYear();
   const month = String(date.getMonth() + 1).padStart(2, '0');
   const day = String(date.getDate()).padStart(2, '0');
@@ -279,7 +295,7 @@ const formatDate = function (date) {
 const getToday = function () {
   const today = dayjs()
   const startTime = today.startOf('day').format('YYYY-MM-DD HH:mm:ss')
-  const endTime = today.add(1, 'day').startOf('day').format('YYYY-MM-DD HH:mm:ss')
+  const endTime = today.add(1,'day').startOf('day').format('YYYY-MM-DD HH:mm:ss')
   dateRange.value = [startTime, endTime]
   console.log('看看dateRange', dateRange.value)
   activeTimeRange.value = 'today' // 标记当前激活状态
@@ -289,8 +305,8 @@ const getToday = function () {
 // 本周
 const getWeek = function () {
   const today = dayjs()
-  const startTime = (today.startOf('week').add(1, 'day')).format('YYYY-MM-DD HH:mm:ss')
-  const endTime = today.add(1, 'week').startOf('week').add(1, 'day').format('YYYY-MM-DD HH:mm:ss')
+  const startTime = (today.startOf('week').add(1,'day')).format('YYYY-MM-DD HH:mm:ss')
+  const endTime = today.add(1,'week').startOf('week').add(1,'day').format('YYYY-MM-DD HH:mm:ss')
   dateRange.value = [startTime, endTime]
   console.log('看看dateRange', dateRange.value)
   activeTimeRange.value = 'week' // 标记当前激活状态
@@ -301,7 +317,7 @@ const getWeek = function () {
 const getMonth = function () {
   const today = dayjs()
   const startTime = today.startOf('month').format('YYYY-MM-DD HH:mm:ss')
-  const endTime = today.add(1, 'month').startOf('month').format('YYYY-MM-DD HH:mm:ss')
+  const endTime = today.add(1,'month').startOf('month').format('YYYY-MM-DD HH:mm:ss')
   dateRange.value = [startTime, endTime]
   console.log('看看dateRange', dateRange.value)
   activeTimeRange.value = 'month' // 标记当前激活状态
@@ -312,10 +328,11 @@ const getMonth = function () {
 const getYear = function () {
   const today = dayjs()
   const startTime = today.startOf('year').format('YYYY-MM-DD HH:mm:ss')
-  const endTime = today.add(1, 'year').startOf('year').format('YYYY-MM-DD HH:mm:ss')
+  const endTime = today.add(1,'year').startOf('year').format('YYYY-MM-DD HH:mm:ss')
   dateRange.value = [startTime, endTime]
   console.log('看看dateRange', dateRange.value)
   activeTimeRange.value = 'year' // 标记当前激活状态
+
   getChartData()
 }
 
@@ -400,7 +417,7 @@ const processData = (data) => {
 // 获取市场列表
 const getMarkets = async () => {
   try {
-    const response = await API({url: '/general/market', data: {}})
+    const response = await API({ url: '/general/market', data: {} })
     if (Array.isArray(response.data)) {
       markets.value = response.data
       console.log('市场列表获取成功:', markets.value)
@@ -423,7 +440,7 @@ const getChartData = async () => {
     }
 
     // 本年
-    if (!dateRange.value || dateRange.value.length === 0) {
+    if(!dateRange.value || dateRange.value.length === 0){
       getYear()
     }
 
@@ -559,7 +576,7 @@ const updateChart = (chartData) => {
     initChart()
   }
   chartLoading.value = true
-try{
+  try{
     let series = []
     let legend = []
 
@@ -570,7 +587,7 @@ try{
           type: 'bar',
           stack: 'recharge',
           data: chartData.rechargePermanent,
-        itemStyle: {color: '#5470c6'},
+          itemStyle: { color: '#5470c6' },
           barWidth: 30
         },
         {
@@ -578,7 +595,7 @@ try{
           type: 'bar',
           stack: 'recharge',
           data: chartData.rechargeFree,
-        itemStyle: {color: '#91cc75'},
+          itemStyle: { color: '#91cc75' },
           barWidth: 30
         },
         {
@@ -586,7 +603,7 @@ try{
           type: 'bar',
           stack: 'recharge',
           data: chartData.rechargeTask,
-        itemStyle: {color: '#fac858'},
+          itemStyle: { color: '#fac858' },
           barWidth: 30
         }
       ]
@@ -598,7 +615,7 @@ try{
           type: 'bar',
           stack: 'consume',
           data: chartData.consumePermanent,
-        itemStyle: {color: '#5470c6'},
+          itemStyle: { color: '#5470c6' },
           barWidth: 30
         },
         {
@@ -606,7 +623,7 @@ try{
           type: 'bar',
           stack: 'consume',
           data: chartData.consumeFree,
-        itemStyle: {color: '#91cc75'},
+          itemStyle: { color: '#91cc75' },
           barWidth: 30
         },
         {
@@ -614,7 +631,7 @@ try{
           type: 'bar',
           stack: 'consume',
           data: chartData.consumeTask,
-        itemStyle: {color: '#fac858'},
+          itemStyle: { color: '#fac858' },
           barWidth: 30
         }
       ]
@@ -665,7 +682,7 @@ try{
     }
 
     chartInstance.setOption(option)
-} catch (error) {
+  } catch (error) {
     console.error('图表更新失败:', error)
     ElMessage.error('图表渲染失败')
   } finally {
@@ -683,25 +700,20 @@ const handleTabChange = () => {
 
 const getAdminData = async function () {
   try {
-    const result = await API({url: '/admin/userinfo', data: {}})
+    const result = await API({ url: '/admin/userinfo', data: {} })
     adminData.value = result
     console.log('用户信息', adminData.value)
   } catch (error) {
     console.log('请求失败', error)
   }
 }
-
-const workDataUpdateTime = ref(null)
 // 获取卡片数据
 const getCardData = async () => {
   try {
-    const response = await API({url: '/workbench/getCard', data: {}})
-    console.log('卡片数据', response.startDate)
+    const response = await API({ url: '/workbench/getCard', data: {} })
     workDataUpdateTime.value = response.updateTime
-
     if (response && response.data) {
       processData(response.data)
-
     } else if (Array.isArray(response?.marketCards)) {
       processData(response)
     } else {
@@ -711,15 +723,26 @@ const getCardData = async () => {
     console.error('获取卡片数据失败:', error)
   }
 }
+const workDataUpdateTime = ref(null)
 
+// 标记当前激活的时间范围按钮
+const activeTimeRange = ref('')
+// 日期选择器变化时清除按钮激活状态
+const handleDatePickerChange = () => {
+  activeTimeRange.value = ''
+}
 
 onMounted(async () => {
   await getAdminData()
   await getCardData()
   await getMarkets()
   getYear()
-  await getChartData()
-  console.log('挂载后调用')
+  window.addEventListener('resize', () => {
+    chartInstance.resize()
+  })
+})
+onUnmounted(() => {
+  destroyChart()
 })
 </script>