From ebf344fe86d269c378e95b0f9a4233a689d4f95e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Mon, 26 Aug 2024 15:54:48 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20=E4=BF=AE=E5=A4=8D=E5=88=86?=
 =?UTF-8?q?=E4=BA=AB=E5=9B=BE=E8=A7=92=E8=89=B2image=E6=B8=B2=E6=9F=93?=
 =?UTF-8?q?=E5=BC=82=E5=B8=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/userAvatar/tua-detail-card.vue | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/components/userAvatar/tua-detail-card.vue b/src/components/userAvatar/tua-detail-card.vue
index 46fec5c1..c24c80da 100644
--- a/src/components/userAvatar/tua-detail-card.vue
+++ b/src/components/userAvatar/tua-detail-card.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="tua-dc-container">
-    <img :src="props.modelValue.avatar.image" class="tua-dc-avatar" alt="avatar" />
+    <img :src="avatar" class="tua-dc-avatar" alt="avatar" />
     <v-btn
       class="tua-dc-share"
       prepend-icon="mdi-share-variant"
@@ -46,11 +46,11 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { computed, onMounted, ref, watch } from "vue";
+import { computed, onMounted, onUnmounted, ref, watch } from "vue";
 
 import TSUserAvatar from "../../plugins/Sqlite/modules/userAvatar.js";
 import { useUserStore } from "../../store/modules/user.js";
-import { generateShareImg } from "../../utils/TGShare.js";
+import { generateShareImg, saveImgLocal } from "../../utils/TGShare.js";
 
 import TuaDcConstellations from "./tua-dc-constellations.vue";
 import TuaDcProp from "./tua-dc-prop.vue";
@@ -84,15 +84,26 @@ const propMain = computed<Array<TGApp.Game.Avatar.PropMapItem | false>>(() => {
 });
 
 const bg = ref<string>("/source/nameCard/profile/原神·印象.webp");
+const avatar = ref<string>(props.modelValue.avatar.image);
 const loading = ref<boolean>(false);
 
 onMounted(async () => {
   await loadData();
 });
 
+onUnmounted(() => {
+  if (avatar.value.startsWith("blob:")) {
+    URL.revokeObjectURL(avatar.value);
+  }
+});
+
 watch(
   () => props.modelValue,
   async () => {
+    if (avatar.value.startsWith("blob:")) {
+      URL.revokeObjectURL(avatar.value);
+    }
+    avatar.value = props.modelValue.avatar.image;
     await loadData();
   },
 );
@@ -108,6 +119,9 @@ async function loadData(): Promise<void> {
       bg.value = "url('/source/nameCard/profile/原神·印象.webp')";
     }
   }
+  if (!avatar.value.startsWith("blob:")) {
+    avatar.value = await saveImgLocal(props.modelValue.avatar.image);
+  }
 }
 
 async function share(): Promise<void> {