From 5bc687109b0ae418da839e529a64ca3bceacbfb2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Sat, 7 Sep 2024 10:55:15 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E8=B0=83=E6=95=B4=E5=B8=96?=
 =?UTF-8?q?=E5=AD=90=E5=8D=A1=E7=89=87=E9=A2=9C=E8=89=B2=EF=BC=8C=E5=AF=B9?=
 =?UTF-8?q?=E4=BA=8E=E5=AE=BD=E5=BA=A6=E4=B8=8D=E4=BD=8E=E4=BA=8E690?=
 =?UTF-8?q?=E7=9A=84=E5=9B=BE=E7=89=87=E8=BF=9B=E8=A1=8C=E9=93=BA=E6=BB=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/main/t-postcard.vue | 10 +++++-----
 src/components/post/tp-image.vue   | 11 +++++++++--
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/components/main/t-postcard.vue b/src/components/main/t-postcard.vue
index a049bb37..a977718b 100644
--- a/src/components/main/t-postcard.vue
+++ b/src/components/main/t-postcard.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-card rounded v-if="card">
+  <v-card :rounded="true" v-if="card">
     <div class="tpc-cover">
       <img :src="card.cover" alt="cover" @click="createPost(card)" />
       <div v-if="isAct" class="tpc-act">
@@ -100,19 +100,19 @@ onBeforeMount(() => {
 const EnumStatus = {
   STARTED: {
     status: "进行中",
-    colorCss: "#1EE2BA",
+    colorCss: "var(--tgc-od-green)",
   },
   FINISHED: {
     status: "已结束",
-    colorCss: "#C0C5C8",
+    colorCss: "var(--tgc-od-white)",
   },
   SELECTION: {
     status: "评选中",
-    colorCss: "#FF983B",
+    colorCss: "var(--tgc-od-orange)",
   },
   UNKNOWN: {
     status: "未知",
-    colorCss: "#F03F24", // 胭脂红
+    colorCss: "var(--tgc-od-red)",
   },
 };
 
diff --git a/src/components/post/tp-image.vue b/src/components/post/tp-image.vue
index 7ceff4c1..2ad1057d 100644
--- a/src/components/post/tp-image.vue
+++ b/src/components/post/tp-image.vue
@@ -3,13 +3,13 @@
     <img :src="localUrl" :alt="props.data.insert.image" :title="getImageTitle()" />
   </div>
   <div v-else class="tp-image-load" :title="getImageUrl()">
-    <v-progress-circular indeterminate color="primary" size="small" />
+    <v-progress-circular :indeterminate="true" color="primary" size="small" />
     <span>加载中...</span>
   </div>
   <TpoImage :image="props.data" v-model="showOverlay" />
 </template>
 <script lang="ts" setup>
-import { ref, onMounted, onUnmounted } from "vue";
+import { computed, ref, onMounted, onUnmounted } from "vue";
 
 import { saveImgLocal } from "../../utils/TGShare.js";
 import { bytesToSize } from "../../utils/toolFunc.js";
@@ -37,6 +37,12 @@ const props = defineProps<TpImageProps>();
 const showOverlay = ref(false);
 const localUrl = ref<string | undefined>(undefined);
 
+const imgWidth = computed<string>(() => {
+  if (props.data.attributes === undefined) return "auto";
+  if (props.data.attributes.width >= 690) return "100%";
+  return `${props.data.attributes.width}px`;
+});
+
 console.log("tp-image", props.data.insert.image, props.data.attributes);
 
 onMounted(async () => {
@@ -79,6 +85,7 @@ function getImageUrl(): string {
 }
 
 .tp-image-box img {
+  width: v-bind(imgWidth);
   max-width: 100%;
   height: auto;
   border-radius: 10px;