From 8c94710c240c898d5fd9ab98ed9d50ce1c929097 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Tue, 13 Aug 2024 20:38:44 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20=E4=BF=AE=E5=A4=8D=E5=85=AC?=
 =?UTF-8?q?=E5=91=8A=E5=88=86=E4=BA=AB=E5=9B=BEbanner=E7=BC=BA=E5=A4=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/post/tp-image.vue | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/post/tp-image.vue b/src/components/post/tp-image.vue
index 48d30f42..082173d8 100644
--- a/src/components/post/tp-image.vue
+++ b/src/components/post/tp-image.vue
@@ -2,7 +2,7 @@
   <div class="tp-image-box" @click="showOverlay = true">
     <img
       :style="getImageStyle()"
-      :src="getImageUrl()"
+      :src="localUrl"
       :alt="props.data.insert.image"
       :title="getImageTitle()"
     />
@@ -10,8 +10,9 @@
   <TpoImage :image="props.data" v-model="showOverlay" />
 </template>
 <script lang="ts" setup>
-import { StyleValue, ref } from "vue";
+import { StyleValue, ref, onMounted, onUnmounted } from "vue";
 
+import { saveImgLocal } from "../../utils/TGShare.js";
 import { bytesToSize } from "../../utils/toolFunc.js";
 
 import TpoImage from "./tpo-image.vue";
@@ -35,9 +36,19 @@ interface TpImageProps {
 
 const props = defineProps<TpImageProps>();
 const showOverlay = ref(false);
+const localUrl = ref<string>();
 
 console.log("tp-image", props.data.insert.image, props.data.attributes);
 
+onMounted(async () => {
+  const link = getImageUrl();
+  localUrl.value = await saveImgLocal(link);
+});
+
+onUnmounted(() => {
+  if (localUrl.value) URL.revokeObjectURL(localUrl.value);
+});
+
 function getImageStyle(): StyleValue {
   let style: StyleValue = <Array<StyleValue>>[];
   style.push("cursor: pointer");
@@ -67,7 +78,6 @@ function getImageTitle(): string {
 function getImageUrl(): string {
   const img = props.data.insert.image;
   const append = "?x-oss-process=image/format,png";
-  console.log("getImageUrl", img, append);
   if (img.endsWith(".gif")) return img;
   return img + append;
 }