From 29d35b3106a021b5b531e1584ccf820e8c18b0b6 Mon Sep 17 00:00:00 2001
From: Rogee <rogee@ipao.vip>
Date: Fri, 26 Dec 2025 21:49:14 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=AE=A2=E5=8D=95?=
 =?UTF-8?q?=E8=A7=86=E5=9B=BE=E4=B8=AD=E7=9A=84=E4=B8=8B=E6=8B=89=E9=80=89?=
 =?UTF-8?q?=E9=A1=B9=E9=94=99=E8=AF=AF=EF=BC=8C=E4=BC=98=E5=8C=96=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E8=A7=86=E5=9B=BE=E7=9A=84=E5=B8=83=E5=B1=80=E5=92=8C?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../portal/src/views/creator/OrdersView.vue   |   9 +-
 .../portal/src/views/creator/SettingsView.vue | 216 ++++++++++--------
 2 files changed, 120 insertions(+), 105 deletions(-)

diff --git a/frontend/portal/src/views/creator/OrdersView.vue b/frontend/portal/src/views/creator/OrdersView.vue
index e65acf6..8b093aa 100644
--- a/frontend/portal/src/views/creator/OrdersView.vue
+++ b/frontend/portal/src/views/creator/OrdersView.vue
@@ -18,7 +18,8 @@
                     class="h-9 px-3 rounded border border-slate-200 text-sm focus:border-primary-500 outline-none bg-white cursor-pointer">
                     <option value="all">全部</option>
                     <option value="completed">已完成</option>
-                    <optiefunde value="refunding">退款申请中</optiefunde <option value="refunded">已退款</option>
+                    <option value="refunding">退款申请中</option>
+                    <option value="refunded">已退款</option>
                 </select>
             </div>
             <div class="ml-auto relative w-64">
@@ -151,8 +152,8 @@
             </div>
             <div class="space-y-3">
                 <label class="flex items-center gap-3 p-3 border rounded-lg cursor-pointer hover:bg-slate-50" :class="refundAction === 'accept'
-                        ? 'border-green-500 bg-green-50'
-                        : 'border-slate-200'
+                    ? 'border-green-500 bg-green-50'
+                    : 'border-slate-200'
                     ">
                     <RadioButton v-model="refundAction" value="accept" />
                     <span>同意退款</span>
@@ -265,4 +266,4 @@ const confirmRefund = () => {
     });
     // In real app, refresh list
 };
-</script>
+</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 649ff33..16cddcd 100644
--- a/frontend/portal/src/views/creator/SettingsView.vue
+++ b/frontend/portal/src/views/creator/SettingsView.vue
@@ -1,129 +1,143 @@
 <template>
-  <div class="p-8 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-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 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>
-          <div>
-             <h4 class="font-bold mb-1">频道设置须知</h4>
-             <ul class="list-disc list-inside space-y-1 opacity-90">
-                <li>建议封面图尺寸 1280x320px，重点内容居中。</li>
-                <li>频道名称修改后需人工审核，审核期间原名称仍可见。</li>
-                <li>优质的频道介绍和精美的视觉设计有助于大幅提升关注转化率。</li>
-             </ul>
-          </div>
-       </div>
+      <div class="max-w-5xl mx-auto 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>
+            <div>
+               <h4 class="font-bold mb-1">频道设置须知</h4>
+               <ul class="list-disc list-inside space-y-1 opacity-90">
+                  <li>建议封面图尺寸 1280x320px，重点内容居中。</li>
+                  <li>频道名称修改后需人工审核，审核期间原名称仍可见。</li>
+                  <li>优质的频道介绍和精美的视觉设计有助于大幅提升关注转化率。</li>
+               </ul>
+            </div>
+         </div>
 
-       <!-- 1. Basic Info -->
-       <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">
-             <!-- 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">
-                      <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">
-                         <i class="pi pi-camera text-white text-2xl"></i>
-                      </div>
-                   </div>
-                </div>
-                <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="给您的频道起个名字">
-                   </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="介绍一下您的频道特色...">
-                   </div>
-                </div>
-             </div>
+         <!-- 1. Basic Info -->
+         <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>
 
-             <!-- 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>
-             </div>
-          </div>
-       </div>
+            <div class="space-y-6">
+               <!-- 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">
+                        <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">
+                           <i class="pi pi-camera text-white text-2xl"></i>
+                        </div>
+                     </div>
+                  </div>
+                  <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="给您的频道起个名字">
+                     </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="介绍一下您的频道特色...">
+                     </div>
+                  </div>
+               </div>
 
-       <!-- 2. Visual Style -->
-       <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>
-             </div>
-          </div>
-       </div>
-    </div>
+               <!-- 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>
+               </div>
+            </div>
+         </div>
 
-    <input type="file" ref="fileInput" class="hidden" @change="handleFileChange">
-    <Toast />
-  </div>
+         <!-- 2. Visual Style -->
+         <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>
+               </div>
+            </div>
+         </div>
+      </div>
+
+      <input type="file" ref="fileInput" class="hidden" @change="handleFileChange">
+      <Toast />
+   </div>
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue';
 import Toast from 'primevue/toast';
 import { useToast } from 'primevue/usetoast';
+import { reactive, ref } from 'vue';
 
 const toast = useToast();
 const fileInput = ref(null);
 const currentUploadType = ref('');
 
 const form = reactive({
-    name: '梅派传人小林',
-    bio: '专注京剧程派艺术传承与推广',
-    description: '',
-    avatar: 'https://api.dicebear.com/7.x/avataaars/svg?seed=Master1',
-    cover: 'https://images.unsplash.com/photo-1514306191717-452ec28c7f31?ixlib=rb-1.2.1&auto=format&fit=crop&w=1200&q=80'
+   name: '梅派传人小林',
+   bio: '专注京剧程派艺术传承与推广',
+   description: '',
+   avatar: 'https://api.dicebear.com/7.x/avataaars/svg?seed=Master1',
+   cover: 'https://images.unsplash.com/photo-1514306191717-452ec28c7f31?ixlib=rb-1.2.1&auto=format&fit=crop&w=1200&q=80'
 });
 
 const triggerUpload = (type) => {
-    currentUploadType.value = type;
-    fileInput.value.click();
+   currentUploadType.value = type;
+   fileInput.value.click();
 };
 
 const handleFileChange = (event) => {
-    const file = event.target.files[0];
-    if (file) {
-        const reader = new FileReader();
-        reader.onload = (e) => {
-            if (currentUploadType.value === 'avatar') {
-                form.avatar = e.target.result;
-            } else {
-                form.cover = e.target.result;
-            }
-        };
-        reader.readAsDataURL(file);
-    }
+   const file = event.target.files[0];
+   if (file) {
+      const reader = new FileReader();
+      reader.onload = (e) => {
+         if (currentUploadType.value === 'avatar') {
+            form.avatar = e.target.result;
+         } else {
+            form.cover = e.target.result;
+         }
+      };
+      reader.readAsDataURL(file);
+   }
 };
 
 const saveSettings = () => {
-    if (!form.name) {
-        toast.add({ severity: 'error', summary: '错误', detail: '频道名称不能为空', life: 3000 });
-        return;
-    }
-    toast.add({ severity: 'success', summary: '保存成功', detail: '部分信息正在审核中', life: 3000 });
+   if (!form.name) {
+      toast.add({ severity: 'error', summary: '错误', detail: '频道名称不能为空', life: 3000 });
+      return;
+   }
+   toast.add({ severity: 'success', summary: '保存成功', detail: '部分信息正在审核中', life: 3000 });
 };
 </script>
\ No newline at end of file