fix:home界面组件更新联动
This commit is contained in:
@@ -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',
|
||||||
|
|||||||
@@ -527,6 +527,7 @@ const local:any = {
|
|||||||
Currentspeed:'当前速度',
|
Currentspeed:'当前速度',
|
||||||
Used:'已用',
|
Used:'已用',
|
||||||
maxspeed:'峰值',
|
maxspeed:'峰值',
|
||||||
|
deviceCount: "设备数",
|
||||||
},
|
},
|
||||||
userInfo:{
|
userInfo:{
|
||||||
user:'用户',
|
user:'用户',
|
||||||
|
|||||||
@@ -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]">-->
|
||||||
|
|||||||
@@ -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);
|
||||||
|
|||||||
@@ -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);
|
||||||
|
|||||||
Reference in New Issue
Block a user