fix: 赞赏ui

frontend_nuxt/components/BaseUserAvatar.vue

@@ -15,7 +15,7 @@ import { computed, ref, watch } from 'vue'
 import { useAttrs } from 'vue'
 import BaseImage from './BaseImage.vue'
 
-const DEFAULT_AVATAR = '/default-avatar.svg'
+const DEFAULT_AVATAR = '/default-avatar.jpg'
 
 const props = defineProps({
   userId: {

frontend_nuxt/components/DonateGroup.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="donate-container">
-    <ToolTip content="打赏作者" placement="bottom">
+    <ToolTip content="打赏作者" placement="bottom" v-if="donateItems.length > 0">
       <div class="donate-viewer" @click="openPanel">
         <div
           class="donate-viewer-item-container"
@@ -22,6 +22,11 @@
         </div>
       </div>
     </ToolTip>
+    <ToolTip content="赞赏作者" placement="bottom" v-else>
+      <div class="donate-viewer-item placeholder" @click="openPanel">
+        <financing class="donate-viewer-item-placeholder-icon" />
+      </div>
+    </ToolTip>
     <div
       v-if="panelVisible"
       class="donate-panel"
@@ -38,7 +43,7 @@
         <financing class="donate-option-icon" />
         <div class="donate-counts-text">30</div>
       </div>
-      <div class="donate-option selected">
+      <div class="donate-option">
         <financing class="donate-option-icon" />
         <div class="donate-counts-text">100</div>
       </div>
@@ -47,6 +52,7 @@
 </template>
 
 <script setup>
+import { Finance } from '@icon-park/vue-next'
 import { nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const emit = defineEmits(['update:modelValue'])
@@ -58,18 +64,18 @@ const panelVisible = ref(false)
 const donatePanelRef = ref(null)
 const panelInlineStyle = ref({})
 const donateItems = ref([
-  {
-    id: 1,
-    count: 100,
-  },
-  {
-    id: 2,
-    count: 300,
-  },
-  {
-    id: 3,
-    count: 500,
-  },
+  // {
+  //   id: 1,
+  //   count: 100,
+  // },
+  // {
+  //   id: 2,
+  //   count: 300,
+  // },
+  // {
+  //   id: 3,
+  //   count: 500,
+  // },
 ])
 let hideTimer = null
 
@@ -174,6 +180,29 @@ onBeforeUnmount(() => {
   box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
 }
 
+.donate-viewer-item.placeholder {
+  display: flex;
+  cursor: pointer;
+  flex-direction: row;
+  padding: 2px 10px;
+  gap: 5px;
+  border: 1px solid var(--normal-border-color);
+  border-radius: 10px;
+  margin-right: 5px;
+  font-size: 14px;
+  color: var(--text-color);
+  align-items: center;
+  background-color: var(--normal-light-background-color);
+}
+
+.donate-viewer-item {
+  font-size: 16px;
+}
+
+.donate-viewer-item-placeholder-icon {
+  opacity: 0.5;
+}
+
 .donate-option {
   cursor: pointer;
   padding: 3px 6px;

frontend_nuxt/pages/message-box/index.vue

@@ -84,7 +84,7 @@
           >
             <div class="conversation-avatar">
               <BaseImage
-                :src="ch.avatar || '/default-avatar.svg'"
+                :src="ch.avatar || '/default-avatar.jpg'"
                 :alt="ch.name"
                 class="avatar-img"
                 @error="handleAvatarError"
@@ -194,7 +194,7 @@ function formatTime(timeString) {
 
 // 头像加载失败处理
 function handleAvatarError(event) {
-  event.target.src = '/default-avatar.svg'
+  event.target.src = '/default-avatar.jpg'
 }
 
 async function fetchChannels() {

frontend_nuxt/public/default-avatar.svg

@@ -1 +0,0 @@
-<svg t="1755789348718" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13787" width="400" height="400"><path d="M152.773168 306.474932h45.030559c37.525466 0 56.288199 18.762733 56.288198 56.288198v45.024199c0 37.525466-18.762733 56.288199-56.288198 56.288199h-45.030559c-37.525466 0-56.281839-18.762733-56.281839-56.288199v-45.030559c0-37.525466 18.762733-56.288199 56.288199-56.288199z" fill="#4D4132" p-id="13788"></path><path d="M409.294708 763.229814h228.968944v146.285714c0 63.22723-51.263602 114.484472-114.484472 114.484472-63.23359 0-114.484472-51.257242-114.484472-114.484472v-146.285714z" fill="#C5AC95" p-id="13789"></path><path d="M73.97605 520.357366c0 55.957466 45.361292 101.318758 101.318757 101.318758 55.951106 0 101.312398-45.361292 101.312398-101.318758 0-55.951106-45.361292-101.312398-101.318758-101.312397-55.951106 0-101.312398 45.361292-101.312397 101.318758z" fill="#C9AB90" p-id="13790"></path><path d="M490.48964 2.531379c186.520646 0 337.710112 151.195826 337.710112 337.716472v382.740671c0 99.474286-80.63523 180.109516-180.109516 180.109515H287.858484c-74.599354 0-135.078957-60.485963-135.078956-135.085317V340.247851C152.773168 153.727205 303.968994 2.531379 490.48964 2.531379z" fill="#EBD3BD" p-id="13791"></path><path d="M400.434882 509.099727c124.342857 0 225.140075 93.241242 225.140075 208.259975 0 5.679702-0.25441 11.308522-0.731429 16.880099H176.019876a195.278708 195.278708 0 0 1-0.731429-16.880099c0-115.018733 100.797217-208.259975 225.146435-208.259975zM805.684472 306.474932h45.030559c37.525466 0 56.288199 18.762733 56.288199 56.288198v45.024199c0 37.525466-18.762733 56.288199-56.288199 56.288199h-45.030559c-37.525466 0-56.288199-18.762733-56.288199-56.288199v-45.030559c0-37.525466 18.762733-56.288199 56.288199-56.288199z" fill="#4D4132" p-id="13792"></path><path d="M749.402634 520.357366c0 55.957466 45.361292 101.318758 101.312397 101.318758s101.318758-45.361292 101.318758-101.318758c0-55.951106-45.367652-101.312398-101.318758-101.312397s-101.318758 45.361292-101.318758 101.318758z" fill="#EBD3BD" p-id="13793"></path><path d="M805.684472 509.099727a45.030559 45.030559 0 1 0 90.061118 0.01908 45.030559 45.030559 0 0 0-90.061118-0.01908z" fill="#E89E80" p-id="13794"></path><path d="M175.288447 374.01441a90.061118 90.061118 0 1 0 180.115876 0c0-49.737143-40.323975-90.054758-90.061118-90.054758s-90.054758 40.323975-90.054758 90.061118z" fill="#FFFFFF" p-id="13795"></path><path d="M220.319006 379.64323a39.401739 39.401739 0 1 0 78.803478 0 39.401739 39.401739 0 0 0-78.803478 0z" fill="#514141" p-id="13796"></path><path d="M490.48964 374.01441c0 49.737143 40.323975 90.061118 90.061118 90.061118s90.048398-40.323975 90.048397-90.061118-40.317615-90.054758-90.054757-90.054758-90.061118 40.323975-90.061118 90.061118z" fill="#FFFFFF" p-id="13797"></path><path d="M535.520199 379.64323a39.401739 39.401739 0 1 0 78.797118 0 39.401739 39.401739 0 0 0-78.803478 0z" fill="#514141" p-id="13798"></path><path d="M394.806062 362.75677a40.18405 40.18405 0 0 1 37.754435 26.458634l41.99036 115.47031A78.803478 78.803478 0 0 1 400.504845 610.412124h-17.789615a78.803478 78.803478 0 0 1-72.920249-108.633043l46.207205-112.970733a41.920398 41.920398 0 0 1 38.797516-26.051578z" fill="#E89E80" p-id="13799"></path><path d="M165.36646 190.807453m38.16149 0l101.763975 0q38.161491 0 38.161491 38.161491l0 0q0 38.161491-38.161491 38.161491l-101.763975 0q-38.161491 0-38.16149-38.161491l0 0q0-38.161491 38.16149-38.161491Z" fill="#4D4132" p-id="13800"></path><path d="M483.378882 190.807453m38.161491 0l127.204969 0q38.161491 0 38.16149 38.161491l0 0q0 38.161491-38.16149 38.161491l-127.204969 0q-38.161491 0-38.161491-38.161491l0 0q0-38.161491 38.161491-38.161491Z" fill="#4D4132" p-id="13801"></path></svg>