feat: 实现创作者频道设置功能及收款账户管理

frontend/portal/src/views/creator/SettingsView.vue

@@ -92,12 +92,14 @@
             <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"
+                  v-if="payoutAccounts.length === 0"
                   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>
+               <span v-else class="text-xs text-slate-400">仅支持一个收款账户，删除后可更换</span>
             </div>
 
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div class="grid grid-cols-1 gap-4">
                <div v-for="acc in payoutAccounts" :key="acc.id"
                   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 flex items-center justify-center text-xl"
@@ -145,7 +147,7 @@
 
             <div v-if="newAccount.type === 'bank'">
                <label class="block text-sm font-bold text-slate-700 mb-2">银行名称</label>
-               <input type="text"
+               <input type="text" v-model="newAccount.name"
                   class="w-full h-10 px-3 border border-slate-200 rounded-lg outline-none focus:border-primary-500"
                   placeholder="如：招商银行">
             </div>
@@ -153,14 +155,14 @@
             <div>
                <label class="block text-sm font-bold text-slate-700 mb-2">{{ newAccount.type === 'bank' ? '银行卡号' :
                   '支付宝账号' }}</label>
-               <input type="text"
+               <input type="text" v-model="newAccount.account"
                   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"
+               <input type="text" v-model="newAccount.realname"
                   class="w-full h-10 px-3 border border-slate-200 rounded-lg outline-none focus:border-primary-500"
                   placeholder="需与实名认证一致">
             </div>
@@ -218,7 +220,7 @@ const fetchData = async () => {
             // Set defaults if empty
             if (!form.avatar) form.avatar = 'https://api.dicebear.com/7.x/avataaars/svg?seed=Master1';
         }
-        if (accounts) payoutAccounts.value = accounts;
+        payoutAccounts.value = accounts || [];
     } catch (e) {
         console.error(e);
     }
@@ -263,6 +265,13 @@ const handleFileChange = async (event) => {
 };
 
 const handleAddAccount = async () => {
+   if (payoutAccounts.value.length >= 1) {
+       toast.add({ severity: 'error', summary: '限制', detail: '仅支持一个收款账户', life: 3000 });
+       return;
+   }
+   if (newAccount.type === 'alipay') {
+       newAccount.name = '支付宝';
+   }
    if (!newAccount.name || !newAccount.account || !newAccount.realname) {
        toast.add({ severity: 'warn', summary: '提示', detail: '请填写完整信息', life: 3000 });
        return;