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

2 weeks ago · 1619f59e2c
2 changed files with 184 additions and 160 deletions
--- a/src/views/home.vue
+++ b/src/views/home.vue
@ -130,9 +130,10 @@ function logout() {
 // 挂载
 onMounted(async function () {
  // 获取用户信息
-  //getAdminData()
-  // 初始化获取导出列表
-  await getExportList()
+
+  await getAdminData()
+  // // 初始化获取导出列表
+  // await getExportList()
 })
 // 处理地区点击事件，直接在组件内更新当前地区，包老师改的，直接传参
 const changeDataByArea = (item) => {
--- a/src/views/workspace/index.vue
+++ b/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,10 +21,8 @@
        <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 />
@ -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>
@ -108,7 +104,7 @@
            </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 />
@ -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 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,7 +250,38 @@ const sumDaily = ref(0)
 const rechargeNum = ref(0)
 const firstRecharge = ref(0)
 const length = ref(0)
-const isLoading = ref(false)
+//  加载状态
+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');
@ -316,6 +332,7 @@ const getYear = function () {
  dateRange.value = [startTime, endTime]
  console.log('看看dateRange', dateRange.value)
  activeTimeRange.value = 'year' // 标记当前激活状态
+
  getChartData()
 }

@ -690,18 +707,13 @@ const getAdminData = async function () {
    console.log('请求失败', error)
  }
 }
-
-const workDataUpdateTime = ref(null)
 // 获取卡片数据
 const getCardData = async () => {
  try {
    const response = await API({ url: '/workbench/getCard', data: {} })
-    console.log('卡片数据', response.startDate)
    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>