From dcf516f2dedc87e75f7dd6d72545ede72fa2a7e6 Mon Sep 17 00:00:00 2001
From: YoYo <yoyo@euphon.net>
Date: Wed, 8 Apr 2026 19:47:20 +0000
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=A7=BB=E9=99=A4=E6=89=80=E6=9C=89?=
 =?UTF-8?q?=E6=9D=83=E9=99=90=E8=BA=AB=E4=BB=BD=E6=98=BE=E7=A4=BA=EF=BC=8C?=
 =?UTF-8?q?QR=E4=B8=8A=E4=BC=A0=E5=B8=83=E5=B1=80=E8=BF=98=E5=8E=9F?=
 =?UTF-8?q?=E4=B8=BAinitial=20commit=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.vue                 |  8 +---
 frontend/src/components/UserMenu.vue | 21 +--------
 frontend/src/views/MyDiary.vue       | 68 ++++++++--------------------
 3 files changed, 22 insertions(+), 75 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index b5c21dd..4e69697 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -16,7 +16,6 @@
           >
             <template v-if="auth.isLoggedIn">
               👤 {{ auth.user.display_name || auth.user.username }}
-              <span style="font-size:10px;background:rgba(255,255,255,0.2);padding:2px 7px;border-radius:8px;margin:0 3px;vertical-align:middle;font-weight:400;letter-spacing:0">{{ roleLabel }}</span>
               ▾
             </template>
             <template v-else>
@@ -70,7 +69,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted, watch } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { useAuthStore } from './stores/auth'
 import { useOilsStore } from './stores/oils'
@@ -88,11 +87,6 @@ const router = useRouter()
 const route = useRoute()
 const showUserMenu = ref(false)
 
-const roleLabel = computed(() => {
-  const map = { admin: '管理员', senior_editor: '高级编辑', editor: '编辑', viewer: '查看者' }
-  return map[auth.user.role] || '查看者'
-})
-
 // Sync ui.currentSection from route on load and navigation
 const routeToSection = { '/': 'search', '/manage': 'manage', '/inventory': 'inventory', '/oils': 'oils', '/projects': 'projects', '/mydiary': 'mydiary', '/audit': 'audit', '/bugs': 'bugs', '/users': 'users' }
 watch(() => route.path, (path) => {
diff --git a/frontend/src/components/UserMenu.vue b/frontend/src/components/UserMenu.vue
index 4dba78f..3f50c91 100644
--- a/frontend/src/components/UserMenu.vue
+++ b/frontend/src/components/UserMenu.vue
@@ -2,9 +2,6 @@
   <div class="usermenu-overlay" @click.self="$emit('close')">
     <div class="usermenu-card">
       <div class="usermenu-name">{{ auth.user.display_name || auth.user.username }}</div>
-      <div class="usermenu-role">
-        <span class="role-badge">{{ roleLabel }}</span>
-      </div>
 
       <div class="usermenu-actions">
         <button class="usermenu-btn" @click="goMyDiary">
@@ -71,16 +68,6 @@ const bugContent = ref('')
 
 const unreadCount = computed(() => notifications.value.filter(n => !n.is_read).length)
 
-const roleLabel = computed(() => {
-  const map = {
-    admin: '管理员',
-    senior_editor: '高级编辑',
-    editor: '编辑',
-    viewer: '查看者',
-  }
-  return map[auth.user.role] || auth.user.role
-})
-
 function formatTime(d) {
   if (!d) return ''
   return new Date(d + 'Z').toLocaleString('zh-CN', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' })
@@ -162,13 +149,7 @@ onMounted(loadNotifications)
   z-index: 4001;
 }
 
-.usermenu-name { font-size: 16px; font-weight: 600; color: #3e3a44; margin-bottom: 4px; }
-.usermenu-role { margin-bottom: 14px; }
-.role-badge {
-  display: inline-block; font-size: 11px; padding: 2px 10px;
-  border-radius: 8px; background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
-  color: #4a9d7e; font-weight: 500;
-}
+.usermenu-name { font-size: 16px; font-weight: 600; color: #3e3a44; margin-bottom: 14px; }
 
 .usermenu-actions { display: flex; flex-direction: column; gap: 4px; }
 .usermenu-btn {
diff --git a/frontend/src/views/MyDiary.vue b/frontend/src/views/MyDiary.vue
index e8b245c..c0f0715 100644
--- a/frontend/src/views/MyDiary.vue
+++ b/frontend/src/views/MyDiary.vue
@@ -130,14 +130,12 @@
 
         <div class="form-group">
           <label>我的二维码图片</label>
-          <div class="qr-preview">
-            <div class="upload-area qr-upload-area" @click="triggerUpload('qr')">
-              <img v-if="brandQrImage" :src="brandQrImage" class="qr-img" />
-              <span v-else class="upload-hint">📲 点击上传</span>
-            </div>
+          <div class="upload-area" @click="triggerUpload('qr')">
+            <img v-if="brandQrImage" :src="brandQrImage" class="upload-preview qr-upload-preview" />
+            <span v-else class="upload-hint">📲 点击上传二维码图片</span>
           </div>
           <input ref="qrInput" type="file" accept="image/*" style="display:none" @change="handleUpload('qr', $event)" />
-          <div class="field-hint" style="text-align:center">上传后将显示在配方卡片右下角</div>
+          <div class="field-hint">上传后将显示在配方卡片右下角</div>
         </div>
 
         <div class="form-group">
@@ -176,10 +174,6 @@
           <div class="form-static">{{ auth.user.username }}</div>
         </div>
 
-        <div class="form-group">
-          <label>角色</label>
-          <div class="role-badge-display">{{ roleLabel }}</div>
-        </div>
       </div>
 
       <div class="section-card">
@@ -218,7 +212,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted, watch } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { useRouter } from 'vue-router'
 import { useAuthStore } from '../stores/auth'
 import { useOilsStore } from '../stores/oils'
@@ -258,16 +252,6 @@ const newPassword = ref('')
 const confirmPassword = ref('')
 const businessReason = ref('')
 
-const roleLabel = computed(() => {
-  const roles = {
-    admin: '管理员',
-    senior_editor: '高级编辑',
-    editor: '编辑',
-    viewer: '查看者',
-  }
-  return roles[auth.user.role] || auth.user.role
-})
-
 onMounted(async () => {
   await diaryStore.loadDiary()
   displayName.value = auth.user.display_name || ''
@@ -812,28 +796,6 @@ async function applyBusiness() {
   color: #6b6375;
 }
 
-.role-badge-display {
-  display: inline-block;
-  font-size: 12px;
-  padding: 3px 12px;
-  border-radius: 8px;
-  background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
-  color: #4a9d7e;
-  font-weight: 500;
-}
-
-.qr-preview {
-  margin-top: 10px;
-  text-align: center;
-}
-
-.qr-img {
-  width: 120px;
-  height: 120px;
-  border-radius: 8px;
-  border: 1.5px solid #e5e4e7;
-}
-
 .upload-area {
   width: 100%;
   min-height: 80px;
@@ -851,6 +813,18 @@ async function applyBusiness() {
   border-color: #7ec6a4;
 }
 
+.qr-preview {
+  margin-top: 10px;
+  text-align: center;
+}
+
+.qr-img {
+  width: 120px;
+  height: 120px;
+  border-radius: 8px;
+  border: 1.5px solid #e5e4e7;
+}
+
 .upload-preview {
   max-width: 80px;
   max-height: 80px;
@@ -862,11 +836,9 @@ async function applyBusiness() {
   max-height: 100px;
 }
 
-.qr-upload-area {
-  width: 120px;
-  height: 120px;
-  min-height: unset;
-  border-radius: 8px;
+.qr-upload-preview {
+  max-width: 120px;
+  max-height: 120px;
 }
 
 .field-hint {