From 7d11378436e2a09e9c6a37fe40adfdd02efb9a37 Mon Sep 17 00:00:00 2001
From: Rogee <rogee@ipao.vip>
Date: Fri, 26 Dec 2025 23:10:57 +0800
Subject: [PATCH] =?UTF-8?q?feat(creator):=20=E6=B7=BB=E5=8A=A0=E6=8F=90?=
 =?UTF-8?q?=E7=8E=B0=E5=8A=9F=E8=83=BD=E5=92=8C=E8=B4=A6=E6=88=B7=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=EF=BC=8C=E4=BC=98=E5=8C=96=E7=AE=A1=E7=90=86=E6=A6=82?=
 =?UTF-8?q?=E8=A7=88=E8=A7=86=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/creator/DashboardView.vue       | 181 ++++++++++++------
 .../portal/src/views/creator/SettingsView.vue | 147 +++++++++-----
 frontend/portal/src/views/user/WalletView.vue |   8 +-
 3 files changed, 229 insertions(+), 107 deletions(-)

diff --git a/frontend/portal/src/views/creator/DashboardView.vue b/frontend/portal/src/views/creator/DashboardView.vue
index 67edd00..1323624 100644
--- a/frontend/portal/src/views/creator/DashboardView.vue
+++ b/frontend/portal/src/views/creator/DashboardView.vue
@@ -1,71 +1,132 @@
 <template>
-   <div>
-      <div class="flex items-center justify-between mb-8">
-         <h1 class="text-2xl font-bold text-slate-900">管理概览</h1>
-         <div class="flex gap-4">
-            <router-link to="/creator/contents/new"
-               class="px-6 py-2.5 bg-primary-600 text-white rounded-lg font-bold hover:bg-primary-700 transition-colors shadow-sm shadow-primary-200 cursor-pointer active:scale-95 flex items-center gap-2">
-               <i class="pi pi-plus"></i> 发布新内容
-            </router-link>
-         </div>
-      </div>
+  <div class="p-8">
+    <div class="flex items-center justify-between mb-8">
+       <h1 class="text-2xl font-bold text-slate-900">管理概览</h1>
+       <div class="flex gap-4">
+          <router-link to="/creator/contents/new" class="px-6 py-2.5 bg-primary-600 text-white rounded-lg font-bold hover:bg-primary-700 transition-colors shadow-sm shadow-primary-200 cursor-pointer active:scale-95 flex items-center gap-2">
+             <i class="pi pi-plus"></i> 发布新内容
+          </router-link>
+       </div>
+    </div>
 
-      <!-- Key Metrics -->
-      <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
-         <div v-for="metric in metrics" :key="metric.label"
-            class="bg-white p-6 rounded-xl shadow-sm border border-slate-100 hover:shadow-md transition-shadow">
-            <div class="text-sm text-slate-500 mb-2">{{ metric.label }}</div>
-            <div class="flex items-baseline gap-2">
-               <span class="text-3xl font-bold text-slate-900">{{ metric.value }}</span>
-               <span class="text-xs font-bold" :class="metric.trend > 0 ? 'text-green-600' : 'text-red-600'">
-                  <i class="pi" :class="metric.trend > 0 ? 'pi-arrow-up' : 'pi-arrow-down'"
-                     style="font-size: 0.7rem"></i>
-                  {{ Math.abs(metric.trend) }}%
-               </span>
-            </div>
-            <div class="text-xs text-slate-400 mt-2">{{ metric.subtext }}</div>
-         </div>
-      </div>
+    <!-- Key Metrics -->
+    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
+       <div v-for="metric in metrics" :key="metric.label" class="bg-white p-6 rounded-xl shadow-sm border border-slate-100 hover:shadow-md transition-shadow relative">
+          <div class="text-sm text-slate-500 mb-2">{{ metric.label }}</div>
+          <div class="flex items-baseline gap-2">
+             <span class="text-3xl font-bold text-slate-900">{{ metric.value }}</span>
+             <span class="text-xs font-bold" :class="metric.trend > 0 ? 'text-green-600' : 'text-red-600'">
+                <i class="pi" :class="metric.trend > 0 ? 'pi-arrow-up' : 'pi-arrow-down'" style="font-size: 0.7rem"></i>
+                {{ Math.abs(metric.trend) }}%
+             </span>
+          </div>
+          <div class="text-xs text-slate-400 mt-2">{{ metric.subtext }}</div>
+          
+          <!-- Withdraw Button for Revenue Card -->
+          <button v-if="metric.label === '累计总收益'" @click="showWithdraw = true" class="absolute top-6 right-6 px-3 py-1.5 bg-green-50 text-green-700 text-xs font-bold rounded-lg hover:bg-green-100 transition-colors">
+             提现
+          </button>
+       </div>
+    </div>
 
-      <!-- Pending Orders (Quick Access) -->
-      <div class="bg-white p-6 rounded-xl shadow-sm border border-slate-100">
-         <h3 class="font-bold text-slate-900 mb-4">待处理事项</h3>
-         <div class="flex gap-4">
-            <div
-               class="flex-1 p-4 bg-orange-50 border border-orange-100 rounded-xl flex items-center justify-between cursor-pointer hover:bg-orange-100 transition-colors"
-               @click="$router.push('/creator/orders')">
-               <div class="flex items-center gap-3">
-                  <div class="w-10 h-10 rounded-full bg-orange-200 text-orange-700 flex items-center justify-center"><i
-                        class="pi pi-refresh"></i></div>
-                  <div>
-                     <div class="font-bold text-slate-900">退款申请</div>
-                     <div class="text-xs text-orange-600">需要处理</div>
-                  </div>
-               </div>
-               <div class="text-2xl font-bold text-orange-700">2</div>
-            </div>
-            <div
-               class="flex-1 p-4 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-between cursor-pointer hover:bg-blue-100 transition-colors">
-               <div class="flex items-center gap-3">
-                  <div class="w-10 h-10 rounded-full bg-blue-200 text-blue-700 flex items-center justify-center"><i
-                        class="pi pi-comments"></i></div>
-                  <div>
-                     <div class="font-bold text-slate-900">新私信</div>
-                     <div class="text-xs text-blue-600">粉丝互动</div>
-                  </div>
-               </div>
-               <div class="text-2xl font-bold text-blue-700">5</div>
-            </div>
-         </div>
-      </div>
-   </div>
+    <!-- Pending Orders (Quick Access) -->
+    <div class="bg-white p-6 rounded-xl shadow-sm border border-slate-100">
+       <h3 class="font-bold text-slate-900 mb-4">待处理事项</h3>
+       <div class="flex gap-4">
+          <div class="flex-1 p-4 bg-orange-50 border border-orange-100 rounded-xl flex items-center justify-between cursor-pointer hover:bg-orange-100 transition-colors" @click="$router.push('/creator/orders')">
+             <div class="flex items-center gap-3">
+                <div class="w-10 h-10 rounded-full bg-orange-200 text-orange-700 flex items-center justify-center"><i class="pi pi-refresh"></i></div>
+                <div>
+                   <div class="font-bold text-slate-900">退款申请</div>
+                   <div class="text-xs text-orange-600">需要处理</div>
+                </div>
+             </div>
+             <div class="text-2xl font-bold text-orange-700">2</div>
+          </div>
+          <div class="flex-1 p-4 bg-blue-50 border border-blue-100 rounded-xl flex items-center justify-between cursor-pointer hover:bg-blue-100 transition-colors">
+             <div class="flex items-center gap-3">
+                <div class="w-10 h-10 rounded-full bg-blue-200 text-blue-700 flex items-center justify-center"><i class="pi pi-comments"></i></div>
+                <div>
+                   <div class="font-bold text-slate-900">新私信</div>
+                   <div class="text-xs text-blue-600">粉丝互动</div>
+                </div>
+             </div>
+             <div class="text-2xl font-bold text-blue-700">5</div>
+          </div>
+       </div>
+    </div>
+
+    <!-- Withdraw Dialog -->
+    <Dialog v-model:visible="showWithdraw" modal header="收益提现" :style="{ width: '35rem' }">
+        <div class="space-y-6 pt-2">
+           
+           <div>
+              <label class="block text-sm font-bold text-slate-700 mb-3">提现方式</label>
+              <div class="grid grid-cols-1 gap-3">
+                 <label class="flex items-center gap-4 p-4 border rounded-xl cursor-pointer hover:border-primary-500 hover:bg-slate-50 transition-all" :class="withdrawMethod === 'external' ? 'border-primary-500 bg-primary-50 ring-1 ring-primary-500' : 'border-slate-200'">
+                    <input type="radio" v-model="withdrawMethod" value="external" class="hidden">
+                    <div class="w-10 h-10 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center"><i class="pi pi-credit-card text-xl"></i></div>
+                    <div class="flex-1">
+                       <div class="font-bold text-slate-900">提现至银行卡/支付宝</div>
+                       <div class="text-xs text-slate-500" v-if="hasPayoutAccount">已绑定：招商银行 (8888)</div>
+                       <div class="text-xs text-orange-600 font-bold flex items-center gap-1" v-else>
+                          <i class="pi pi-exclamation-circle"></i> 未配置收款账户
+                          <router-link to="/creator/settings" class="underline hover:text-orange-800 ml-1">去配置</router-link>
+                       </div>
+                    </div>
+                    <i v-if="withdrawMethod === 'external'" class="pi pi-check-circle text-primary-600 text-xl"></i>
+                 </label>
+
+                 <label class="flex items-center gap-4 p-4 border rounded-xl cursor-pointer hover:border-primary-500 hover:bg-slate-50 transition-all" :class="withdrawMethod === 'wallet' ? 'border-primary-500 bg-primary-50 ring-1 ring-primary-500' : 'border-slate-200'">
+                    <input type="radio" v-model="withdrawMethod" value="wallet" class="hidden">
+                    <div class="w-10 h-10 rounded-full bg-green-100 text-green-600 flex items-center justify-center"><i class="pi pi-wallet text-xl"></i></div>
+                    <div class="flex-1">
+                       <div class="font-bold text-slate-900">转入个人钱包余额</div>
+                       <div class="text-xs text-slate-500">实时到账，可用于平台消费</div>
+                    </div>
+                    <i v-if="withdrawMethod === 'wallet'" class="pi pi-check-circle text-primary-600 text-xl"></i>
+                 </label>
+              </div>
+           </div>
+
+           <div>
+              <label class="block text-sm font-bold text-slate-700 mb-2">提现金额 (¥)</label>
+              <input type="number" placeholder="请输入金额" class="w-full h-12 px-4 border border-slate-200 rounded-lg text-lg font-bold outline-none focus:border-primary-500 transition-colors">
+              <div class="text-xs text-slate-400 mt-2 flex justify-between">
+                 <span>可提现收益: ¥ 8,920.50</span>
+                 <button class="text-primary-600 hover:underline">全部提现</button>
+              </div>
+           </div>
+        </div>
+        <template #footer>
+            <button @click="showWithdraw = false" class="px-4 py-2 text-slate-500 hover:text-slate-700 text-sm font-bold">取消</button>
+            <button @click="handleWithdraw" class="px-6 py-2 bg-primary-600 text-white rounded-lg text-sm font-bold hover:bg-primary-700 shadow-sm" :disabled="withdrawMethod === 'external' && !hasPayoutAccount" :class="{ 'opacity-50 cursor-not-allowed': withdrawMethod === 'external' && !hasPayoutAccount }">确认提现</button>
+        </template>
+    </Dialog>
+
+    <Toast />
+  </div>
 </template>
 
 <script setup>
 import { ref } from 'vue';
+import Dialog from 'primevue/dialog';
+import Toast from 'primevue/toast';
+import { useToast } from 'primevue/usetoast';
+
+const toast = useToast();
+const showWithdraw = ref(false);
+const withdrawMethod = ref('wallet');
+const hasPayoutAccount = ref(false); // Mock state
 
 const metrics = ref([
-   { label: '总关注用户', value: '12,548', trend: 1.2, subtext: '昨日 +125' },
-   { label: '累计总收益', value: '¥ 8,920.50', trend: 5.4, subtext: '近30天 +2,300' },
+    { label: '总关注用户', value: '12,548', trend: 1.2, subtext: '昨日 +125' },
+    { label: '累计总收益', value: '¥ 8,920.50', trend: 5.4, subtext: '近30天 +2,300' },
 ]);
+
+const handleWithdraw = () => {
+    showWithdraw.value = false;
+    const msg = withdrawMethod.value === 'wallet' ? '资金已转入您的个人钱包' : '提现申请已提交至银行处理';
+    toast.add({ severity: 'success', summary: '提现成功', detail: msg, life: 3000 });
+};
 </script>
\ No newline at end of file
diff --git a/frontend/portal/src/views/creator/SettingsView.vue b/frontend/portal/src/views/creator/SettingsView.vue
index 16cddcd..46be21a 100644
--- a/frontend/portal/src/views/creator/SettingsView.vue
+++ b/frontend/portal/src/views/creator/SettingsView.vue
@@ -1,14 +1,8 @@
 <template>
-   <div class="max-w-5xl mx-auto">
-      <div class="flex items-center justify-between mb-8">
-         <h1 class="text-2xl font-bold text-slate-900">频道设置</h1>
-         <button @click="saveSettings"
-            class="px-8 py-2.5 bg-primary-600 text-white rounded-lg font-bold hover:bg-primary-700 shadow-sm shadow-primary-200 cursor-pointer active:scale-95 flex items-center gap-2">
-            <i class="pi pi-check"></i> 保存修改
-         </button>
-      </div>
+   <div class="max-w-4xl mx-auto p-8">
+      <h1 class="text-2xl font-bold text-slate-900 mb-8">频道设置</h1>
 
-      <div class="max-w-5xl mx-auto space-y-8">
+      <div class="space-y-8">
          <!-- 0. Tips -->
          <div class="bg-blue-50 p-6 rounded-xl border border-blue-100 text-sm text-blue-700 flex items-start gap-4">
             <i class="pi pi-info-circle text-xl mt-0.5"></i>
@@ -17,24 +11,21 @@
                <ul class="list-disc list-inside space-y-1 opacity-90">
                   <li>建议封面图尺寸 1280x320px，重点内容居中。</li>
                   <li>频道名称修改后需人工审核，审核期间原名称仍可见。</li>
-                  <li>优质的频道介绍和精美的视觉设计有助于大幅提升关注转化率。</li>
                </ul>
             </div>
          </div>
 
-         <!-- 1. Basic Info -->
+         <!-- 1. Basic Info & Visuals -->
          <div class="bg-white rounded-xl shadow-sm border border-slate-100 p-8">
             <h2 class="text-lg font-bold text-slate-900 mb-6 pb-4 border-b border-slate-100">基本信息</h2>
 
-            <div class="space-y-6">
+            <div class="space-y-8">
                <!-- Avatar & Name -->
                <div class="flex items-start gap-6">
                   <div class="relative group cursor-pointer flex-shrink-0" @click="triggerUpload('avatar')">
-                     <div
-                        class="w-24 h-24 rounded-full border-4 border-slate-50 shadow-sm overflow-hidden bg-slate-100">
+                     <div class="w-24 h-24 rounded-full border-4 border-slate-50 shadow-sm overflow-hidden bg-slate-100">
                         <img :src="form.avatar" class="w-full h-full object-cover">
-                        <div
-                           class="absolute inset-0 bg-black/40 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity">
+                        <div class="absolute inset-0 bg-black/40 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity">
                            <i class="pi pi-camera text-white text-2xl"></i>
                         </div>
                      </div>
@@ -42,15 +33,27 @@
                   <div class="flex-1 space-y-4">
                      <div>
                         <label class="block text-sm font-bold text-slate-700 mb-2">频道名称</label>
-                        <input v-model="form.name" type="text"
-                           class="w-full h-11 px-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors"
-                           placeholder="给您的频道起个名字">
+                        <input v-model="form.name" type="text" class="w-full h-11 px-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors" placeholder="给您的频道起个名字">
                      </div>
                      <div>
                         <label class="block text-sm font-bold text-slate-700 mb-2">一句话简介</label>
-                        <input v-model="form.bio" type="text"
-                           class="w-full h-11 px-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors"
-                           placeholder="介绍一下您的频道特色...">
+                        <input v-model="form.bio" type="text" class="w-full h-11 px-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors" placeholder="介绍一下您的频道特色...">
+                     </div>
+                  </div>
+               </div>
+
+               <!-- Cover Image (Moved Here) -->
+               <div>
+                  <label class="block text-sm font-bold text-slate-700 mb-3">频道头图 (Cover)</label>
+                  <div class="aspect-[4/1] rounded-xl bg-slate-50 border-2 border-dashed border-slate-300 relative overflow-hidden group cursor-pointer hover:border-primary-400 transition-all" @click="triggerUpload('cover')">
+                     <img v-if="form.cover" :src="form.cover" class="w-full h-full object-cover">
+                     <div class="absolute inset-0 flex flex-col items-center justify-center text-slate-400 bg-white/50 opacity-100 group-hover:bg-white/80 transition-all" v-else>
+                        <i class="pi pi-image text-3xl mb-2"></i>
+                        <span class="text-sm font-medium">点击上传 (建议尺寸 1280x320)</span>
+                     </div>
+                     <!-- Hover Overlay -->
+                     <div v-if="form.cover" class="absolute inset-0 bg-black/40 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity">
+                        <span class="text-white font-bold"><i class="pi pi-refresh mr-2"></i>更换封面</span>
                      </div>
                   </div>
                </div>
@@ -58,45 +61,88 @@
                <!-- Intro Detail -->
                <div>
                   <label class="block text-sm font-bold text-slate-700 mb-2">详细介绍</label>
-                  <textarea v-model="form.description" rows="4"
-                     class="w-full p-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors resize-none"
-                     placeholder="详细描述您的履历、师承或频道内容规划..."></textarea>
+                  <textarea v-model="form.description" rows="4" class="w-full p-4 border border-slate-200 rounded-lg focus:border-primary-500 outline-none transition-colors resize-none" placeholder="详细描述您的履历、师承或频道内容规划..."></textarea>
+               </div>
+
+               <!-- Save Button -->
+               <div class="pt-6 border-t border-slate-100 flex justify-end">
+                  <button @click="saveSettings" class="px-8 py-3 bg-primary-600 text-white rounded-lg font-bold hover:bg-primary-700 shadow-lg shadow-primary-200 cursor-pointer active:scale-95 flex items-center gap-2">
+                     <i class="pi pi-check"></i> 保存修改
+                  </button>
                </div>
             </div>
          </div>
 
-         <!-- 2. Visual Style -->
+         <!-- 2. Payout Settings -->
          <div class="bg-white rounded-xl shadow-sm border border-slate-100 p-8">
-            <h2 class="text-lg font-bold text-slate-900 mb-6 pb-4 border-b border-slate-100">视觉风格</h2>
-
-            <div>
-               <label class="block text-sm font-bold text-slate-700 mb-3">频道头图 (Cover)</label>
-               <div
-                  class="aspect-[4/1] rounded-xl bg-slate-50 border-2 border-dashed border-slate-300 relative overflow-hidden group cursor-pointer hover:border-primary-400 transition-all"
-                  @click="triggerUpload('cover')">
-                  <img v-if="form.cover" :src="form.cover" class="w-full h-full object-cover">
-                  <div
-                     class="absolute inset-0 flex flex-col items-center justify-center text-slate-400 bg-white/50 opacity-100 group-hover:bg-white/80 transition-all"
-                     v-else>
-                     <i class="pi pi-image text-3xl mb-2"></i>
-                     <span class="text-sm font-medium">点击上传 (建议尺寸 1280x320)</span>
-                  </div>
-                  <!-- Hover Overlay for replace -->
-                  <div v-if="form.cover"
-                     class="absolute inset-0 bg-black/40 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity">
-                     <span class="text-white font-bold"><i class="pi pi-refresh mr-2"></i>更换封面</span>
+            <div class="flex items-center justify-between mb-6 pb-4 border-b border-slate-100">
+               <h2 class="text-lg font-bold text-slate-900">收款账户</h2>
+               <button @click="showAddAccount = true" class="text-sm font-bold text-primary-600 hover:text-primary-700 cursor-pointer flex items-center gap-1 px-3 py-1.5 rounded hover:bg-primary-50 transition-colors">
+                  <i class="pi pi-plus"></i> 添加账户
+               </button>
+            </div>
+            
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+               <!-- Mock Account Card -->
+               <div class="p-4 border border-slate-200 rounded-xl flex items-center gap-4 bg-white relative group hover:border-primary-200 transition-colors">
+                  <div class="w-10 h-10 rounded-full bg-red-50 text-red-600 flex items-center justify-center"><i class="pi pi-briefcase"></i></div>
+                  <div>
+                     <div class="font-bold text-slate-900">招商银行</div>
+                     <div class="text-sm text-slate-500">储蓄卡 (8888)</div>
                   </div>
+                  <button class="absolute top-4 right-4 text-slate-300 hover:text-red-500 cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity p-2"><i class="pi pi-trash"></i></button>
                </div>
             </div>
          </div>
       </div>
 
       <input type="file" ref="fileInput" class="hidden" @change="handleFileChange">
+      
+      <!-- Add Account Dialog -->
+      <Dialog v-model:visible="showAddAccount" modal header="添加收款账户" :style="{ width: '25rem' }">
+          <div class="space-y-4">
+             <div>
+                <label class="block text-sm font-bold text-slate-700 mb-2">账户类型</label>
+                <div class="flex gap-4">
+                   <label class="flex items-center gap-2 cursor-pointer p-2 border border-transparent rounded hover:bg-slate-50">
+                      <RadioButton v-model="newAccount.type" value="bank" />
+                      <span>银行卡</span>
+                   </label>
+                   <label class="flex items-center gap-2 cursor-pointer p-2 border border-transparent rounded hover:bg-slate-50">
+                      <RadioButton v-model="newAccount.type" value="alipay" />
+                      <span>支付宝</span>
+                   </label>
+                </div>
+             </div>
+             
+             <div v-if="newAccount.type === 'bank'">
+                <label class="block text-sm font-bold text-slate-700 mb-2">银行名称</label>
+                <input type="text" class="w-full h-10 px-3 border border-slate-200 rounded-lg outline-none focus:border-primary-500" placeholder="如：招商银行">
+             </div>
+
+             <div>
+                <label class="block text-sm font-bold text-slate-700 mb-2">{{ newAccount.type === 'bank' ? '银行卡号' : '支付宝账号' }}</label>
+                <input type="text" class="w-full h-10 px-3 border border-slate-200 rounded-lg outline-none focus:border-primary-500" placeholder="请输入账号">
+             </div>
+
+             <div>
+                <label class="block text-sm font-bold text-slate-700 mb-2">真实姓名</label>
+                <input type="text" class="w-full h-10 px-3 border border-slate-200 rounded-lg outline-none focus:border-primary-500" placeholder="需与实名认证一致">
+             </div>
+          </div>
+          <template #footer>
+              <button @click="showAddAccount = false" class="px-4 py-2 text-slate-500 hover:text-slate-700 text-sm font-bold cursor-pointer">取消</button>
+              <button @click="handleAddAccount" class="px-6 py-2 bg-primary-600 text-white rounded-lg text-sm font-bold hover:bg-primary-700 cursor-pointer shadow-sm">保存</button>
+          </template>
+      </Dialog>
+
       <Toast />
    </div>
 </template>
 
 <script setup>
+import Dialog from 'primevue/dialog';
+import RadioButton from 'primevue/radiobutton';
 import Toast from 'primevue/toast';
 import { useToast } from 'primevue/usetoast';
 import { reactive, ref } from 'vue';
@@ -104,6 +150,14 @@ import { reactive, ref } from 'vue';
 const toast = useToast();
 const fileInput = ref(null);
 const currentUploadType = ref('');
+const showAddAccount = ref(false);
+
+const newAccount = reactive({
+    type: 'bank',
+    name: '',
+    account: '',
+    realname: ''
+});
 
 const form = reactive({
    name: '梅派传人小林',
@@ -133,6 +187,11 @@ const handleFileChange = (event) => {
    }
 };
 
+const handleAddAccount = () => {
+    showAddAccount.value = false;
+    toast.add({ severity: 'success', summary: '添加成功', detail: '收款账户已添加', life: 3000 });
+};
+
 const saveSettings = () => {
    if (!form.name) {
       toast.add({ severity: 'error', summary: '错误', detail: '频道名称不能为空', life: 3000 });
diff --git a/frontend/portal/src/views/user/WalletView.vue b/frontend/portal/src/views/user/WalletView.vue
index 05adbd2..916de18 100644
--- a/frontend/portal/src/views/user/WalletView.vue
+++ b/frontend/portal/src/views/user/WalletView.vue
@@ -79,16 +79,18 @@
              </div>
           </div>
        </div>
-       
-       <!-- Empty State (Hidden for mock) -->
-       <!-- <div class="text-center py-12 text-slate-400">暂无交易记录</div> -->
     </div>
+    
+    <Toast />
   </div>
 </template>
 
 <script setup>
 import { ref, computed } from 'vue';
+import Toast from 'primevue/toast';
+import { useToast } from 'primevue/usetoast';
 
+const toast = useToast();
 const showRecharge = ref(false);
 const selectedAmount = ref(50);
 const customAmount = ref('');