🐛 修复公告分享图banner缺失

This commit is contained in:
目棃
2024-08-13 20:38:44 +08:00
parent 9fb95c6ade
commit 8c94710c24

View File

@@ -2,7 +2,7 @@
<div class="tp-image-box" @click="showOverlay = true"> <div class="tp-image-box" @click="showOverlay = true">
<img <img
:style="getImageStyle()" :style="getImageStyle()"
:src="getImageUrl()" :src="localUrl"
:alt="props.data.insert.image" :alt="props.data.insert.image"
:title="getImageTitle()" :title="getImageTitle()"
/> />
@@ -10,8 +10,9 @@
<TpoImage :image="props.data" v-model="showOverlay" /> <TpoImage :image="props.data" v-model="showOverlay" />
</template> </template>
<script lang="ts" setup> <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 { bytesToSize } from "../../utils/toolFunc.js";
import TpoImage from "./tpo-image.vue"; import TpoImage from "./tpo-image.vue";
@@ -35,9 +36,19 @@ interface TpImageProps {
const props = defineProps<TpImageProps>(); const props = defineProps<TpImageProps>();
const showOverlay = ref(false); const showOverlay = ref(false);
const localUrl = ref<string>();
console.log("tp-image", props.data.insert.image, props.data.attributes); 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 { function getImageStyle(): StyleValue {
let style: StyleValue = <Array<StyleValue>>[]; let style: StyleValue = <Array<StyleValue>>[];
style.push("cursor: pointer"); style.push("cursor: pointer");
@@ -67,7 +78,6 @@ function getImageTitle(): string {
function getImageUrl(): string { function getImageUrl(): string {
const img = props.data.insert.image; const img = props.data.insert.image;
const append = "?x-oss-process=image/format,png"; const append = "?x-oss-process=image/format,png";
console.log("getImageUrl", img, append);
if (img.endsWith(".gif")) return img; if (img.endsWith(".gif")) return img;
return img + append; return img + append;
} }