2
0

fix:home界面组件更新联动

This commit is contained in:
zhongzm
2024-12-25 18:51:47 +08:00
parent 8edc1e19c7
commit 1c81fa2ec0
5 changed files with 24 additions and 3 deletions

View File

@@ -527,6 +527,7 @@ const local: any = {
Currentspeed:'Current speed', Currentspeed:'Current speed',
Used:'Used', Used:'Used',
maxspeed:'Max', maxspeed:'Max',
deviceCount: "Device",
}, },
userInfo:{ userInfo:{
user:'User', user:'User',

View File

@@ -527,6 +527,7 @@ const local:any = {
Currentspeed:'当前速度', Currentspeed:'当前速度',
Used:'已用', Used:'已用',
maxspeed:'峰值', maxspeed:'峰值',
deviceCount: "设备数",
}, },
userInfo:{ userInfo:{
user:'用户', user:'用户',

View File

@@ -1,15 +1,26 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue';
import HeaderBanner from './modules/header-banner.vue'; import HeaderBanner from './modules/header-banner.vue';
import CardData from './modules/card-data.vue'; import CardData from './modules/card-data.vue';
import LineChart from './modules/line-chart.vue'; import LineChart from './modules/line-chart.vue';
// import PieChart from './modules/pie-chart.vue'; // import PieChart from './modules/pie-chart.vue';
// import ProjectNews from './modules/project-news.vue'; // import ProjectNews from './modules/project-news.vue';
// import CreativityBanner from './modules/creativity-banner.vue'; // import CreativityBanner from './modules/creativity-banner.vue';
// 创建对 HeaderBanner 组件的引用
const headerBannerRef = ref();
// 创建更新仪表盘的方法
const updateDashboard = async () => {
await headerBannerRef.value?.updateDashboard();
};
// 提供更新方法给子组件
provide('updateDashboard', updateDashboard);
</script> </script>
<template> <template>
<ASpace direction="vertical" :size="16"> <ASpace direction="vertical" :size="16">
<HeaderBanner /> <HeaderBanner ref="headerBannerRef"/>
<LineChart /> <LineChart />
<CardData /> <CardData />
<!-- <ARow :gutter="[16, 16]">--> <!-- <ARow :gutter="[16, 16]">-->

View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, computed, onMounted, onUnmounted } from 'vue'; import { ref, computed, onMounted, onUnmounted, inject } from 'vue';
import { useBillingStore } from '@/store/modules/billing/billing'; import { useBillingStore } from '@/store/modules/billing/billing';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { submitOrder } from '@/service/api/auth'; import { submitOrder } from '@/service/api/auth';
@@ -7,6 +7,8 @@ import { message } from 'ant-design-vue';
import type { Ref } from 'vue'; import type { Ref } from 'vue';
const { t } = useI18n(); const { t } = useI18n();
// 注入更新仪表盘的方法
const updateDashboard = inject('updateDashboard') as () => Promise<void>;
interface RechargeOption { interface RechargeOption {
amount: number; amount: number;
@@ -95,6 +97,8 @@ const handleRecharge = async () => {
// 更新余额,传入充值金额 // 更新余额,传入充值金额
await billingStore.updateBalance(paymentAmount.value); await billingStore.updateBalance(paymentAmount.value);
// 更新仪表盘数据
await updateDashboard();
} catch (error) { } catch (error) {
message.error('充值失败,请重试!'); message.error('充值失败,请重试!');
console.error('Failed to submit recharge order:', error); console.error('Failed to submit recharge order:', error);

View File

@@ -1,10 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { ref, onMounted } from 'vue'; import { ref, onMounted, inject } from 'vue';
import { fetchPackageList, submitOrder } from '@/service/api/auth'; import { fetchPackageList, submitOrder } from '@/service/api/auth';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
const { t } = useI18n(); const { t } = useI18n();
// 注入更新仪表盘的方法
const updateDashboard = inject('updateDashboard') as () => Promise<void>;
interface PackageOption { interface PackageOption {
id: string; id: string;
@@ -127,6 +129,8 @@ const handleSubmitOrder = async () => {
packageId: selectedPackage.value.id packageId: selectedPackage.value.id
}); });
message.success('套餐办理成功!'); message.success('套餐办理成功!');
// 更新仪表盘数据
await updateDashboard();
} catch (error) { } catch (error) {
message.error('套餐办理失败,请重试!'); message.error('套餐办理失败,请重试!');
console.error('Failed to submit order:', error); console.error('Failed to submit order:', error);