Jelajahi Sumber

fix: 消费统计卡片从资金专户页移到首页dashboard

alphah 1 Minggu lalu
induk
melakukan
de839098af

TEMPAT SAMPAH
frontend/dist.zip


+ 89 - 6
frontend/src/views/dashboard/tenant.vue

@@ -45,17 +45,50 @@
         <div class="data-card">
           <div class="card-title">今日转账金额(元)</div>
           <div class="card-value">{{ statAmount.amount_of_today || "--" }}</div>
-          <!-- <div class="card-link"></div> -->
         </div>
         <div class="data-card">
           <div class="card-title">近7日转账金额(元)</div>
           <div class="card-value">{{ statAmount.amount_of_7days || "--" }}</div>
-          <!-- <div class="card-link"></div> -->
         </div>
         <div class="data-card">
           <div class="card-title">总转账金额(元)</div>
           <div class="card-value">{{ statAmount.amount_of_all || "--" }}</div>
-          <!-- <div class="card-link"></div> -->
+        </div>
+      </div>
+
+      <div class="section-header" style="margin-top: 24px;">
+        <h2>消费数据统计</h2>
+      </div>
+      <div class="data-cards">
+        <div class="data-card consume-card">
+          <div class="card-title">今日消费金额(元)</div>
+          <div class="card-value">{{ consumeAmount.amount_of_today || "--" }}</div>
+        </div>
+        <div class="data-card consume-card">
+          <div class="card-title">近7日消费金额(元)</div>
+          <div class="card-value">{{ consumeAmount.amount_of_7days || "--" }}</div>
+        </div>
+        <div class="data-card consume-card">
+          <div class="card-title">总消费金额(元)</div>
+          <div class="card-value">{{ consumeAmount.amount_of_all || "--" }}</div>
+        </div>
+      </div>
+
+      <div class="section-header" style="margin-top: 24px;">
+        <h2>汇总统计</h2>
+      </div>
+      <div class="data-cards">
+        <div class="data-card summary-card">
+          <div class="card-title">今日汇总(元)</div>
+          <div class="card-value">{{ summaryAmount.amount_of_today || "--" }}</div>
+        </div>
+        <div class="data-card summary-card">
+          <div class="card-title">近7日汇总(元)</div>
+          <div class="card-value">{{ summaryAmount.amount_of_7days || "--" }}</div>
+        </div>
+        <div class="data-card summary-card">
+          <div class="card-title">总汇总(元)</div>
+          <div class="card-value">{{ summaryAmount.amount_of_all || "--" }}</div>
         </div>
       </div>
     </div>
@@ -89,6 +122,18 @@ const statAmount = ref<{
   amount_of_all?: string;
 }>({});
 
+const consumeAmount = ref<{
+  amount_of_today?: string;
+  amount_of_7days?: string;
+  amount_of_all?: string;
+}>({});
+
+const summaryAmount = ref<{
+  amount_of_today?: string;
+  amount_of_7days?: string;
+  amount_of_all?: string;
+}>({});
+
 function handleTenantChange(value: number | undefined) {
   currentTenantId.value = value;
 }
@@ -96,7 +141,6 @@ function handleTenantChange(value: number | undefined) {
 const allTenantData = ref<TenantTable[]>([]);
 
 async function fetchStatAmount() {
-  // 如果不是平台用户,把 currentTenantId 设为 undefined
   if (!is_platform_user.value) {
     currentTenantId.value = undefined;
   }
@@ -108,6 +152,24 @@ async function fetchStatAmount() {
   }
 }
 
+async function fetchConsumeAmount() {
+  try {
+    const res = await AccountAPI.statConsumeAmount(currentTenantId.value, currentEnterpriseId.value);
+    consumeAmount.value = res.data.data || {};
+  } catch (error) {
+    console.error("获取消费统计金额失败:", error);
+  }
+}
+
+async function fetchSummaryAmount() {
+  try {
+    const res = await AccountAPI.statSummaryAmount(currentTenantId.value, currentEnterpriseId.value);
+    summaryAmount.value = res.data.data || {};
+  } catch (error) {
+    console.error("获取汇总统计金额失败:", error);
+  }
+}
+
 async function fetchAllTenantData() {
   try {
     const res = await TenantAPI.listTenant({
@@ -127,10 +189,15 @@ onMounted(() => {
     fetchAllTenantData();
   }
   fetchStatAmount();
+  fetchConsumeAmount();
+  fetchSummaryAmount();
 });
 
-// watch currentTenantId 变化,重新获取统计金额数据
-watch(currentTenantId, fetchStatAmount);
+watch(currentTenantId, () => {
+  fetchStatAmount();
+  fetchConsumeAmount();
+  fetchSummaryAmount();
+});
 
 // 租户仪表盘组件
 </script>
@@ -230,6 +297,22 @@ watch(currentTenantId, fetchStatAmount);
   border-left: 3px solid #409eff;
 }
 
+.data-card.consume-card {
+  border-left-color: #409eff;
+}
+
+.data-card.consume-card .card-value {
+  color: #409eff;
+}
+
+.data-card.summary-card {
+  border-left-color: #e6a23c;
+}
+
+.data-card.summary-card .card-value {
+  color: #e6a23c;
+}
+
 .card-title {
   font-size: 12px;
   color: #909399;

+ 0 - 108
frontend/src/views/module_payment/account/components/AccountOverview.vue

@@ -225,64 +225,6 @@
       </el-col>
     </el-row>
 
-    <el-row :gutter="16" class="mt-4">
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">今日消费金额</div>
-            <div class="stat-value consume-value">¥{{ consumeAmount.amount_of_today || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">近7天消费金额</div>
-            <div class="stat-value consume-value">¥{{ consumeAmount.amount_of_7days || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">累计消费金额</div>
-            <div class="stat-value consume-value">¥{{ consumeAmount.amount_of_all || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-
-    <el-row :gutter="16" class="mt-4">
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">今日汇总</div>
-            <div class="stat-value summary-value">¥{{ summaryAmount.amount_of_today || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">近7天汇总</div>
-            <div class="stat-value summary-value">¥{{ summaryAmount.amount_of_7days || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-
-      <el-col :span="8">
-        <el-card shadow="hover">
-          <div class="stat-item">
-            <div class="stat-label">累计汇总</div>
-            <div class="stat-value summary-value">¥{{ summaryAmount.amount_of_all || "0.00" }}</div>
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-
     <el-card class="mt-4">
       <template #header>
         <div class="card-header">
@@ -365,18 +307,6 @@ const transferAmount = ref<{
   amount_of_all?: string;
 }>({});
 
-const consumeAmount = ref<{
-  amount_of_today?: string;
-  amount_of_7days?: string;
-  amount_of_all?: string;
-}>({});
-
-const summaryAmount = ref<{
-  amount_of_today?: string;
-  amount_of_7days?: string;
-  amount_of_all?: string;
-}>({});
-
 const currentEnterpriseId = computed(
   () => props.enterpriseId || enterpriseStore.getCurrentEnterprise?.enterprise_id
 );
@@ -521,44 +451,14 @@ async function fetchTransferAmount() {
   }
 }
 
-async function fetchConsumeAmount() {
-  if (!currentEnterpriseId.value) return;
-  loading.value = true;
-  try {
-    const res = await AccountAPI.statConsumeAmount(undefined, currentEnterpriseId.value);
-    consumeAmount.value = res.data.data || {};
-  } catch (error) {
-    console.error("获取消费统计金额失败:", error);
-  } finally {
-    loading.value = false;
-  }
-}
-
-async function fetchSummaryAmount() {
-  if (!currentEnterpriseId.value) return;
-  loading.value = true;
-  try {
-    const res = await AccountAPI.statSummaryAmount(undefined, currentEnterpriseId.value);
-    summaryAmount.value = res.data.data || {};
-  } catch (error) {
-    console.error("获取汇总统计金额失败:", error);
-  } finally {
-    loading.value = false;
-  }
-}
-
 async function handleRefresh() {
   await fetchAccountInfo();
   await fetchTransferAmount();
-  await fetchConsumeAmount();
-  await fetchSummaryAmount();
 }
 
 async function refresh() {
   await fetchAccountInfo();
   await fetchTransferAmount();
-  await fetchConsumeAmount();
-  await fetchSummaryAmount();
 }
 
 defineExpose({ refresh });
@@ -609,14 +509,6 @@ defineExpose({ refresh });
   .balance-value {
     color: #67c23a;
   }
-
-  .consume-value {
-    color: #409eff;
-  }
-
-  .summary-value {
-    color: #e6a23c;
-  }
 }
 
 .text-truncate {