From 7a63e18ab1f51447a41866c02806c170cb56d400 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Tue, 26 Mar 2024 15:25:56 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=E4=B8=8B=E8=BD=BD?=
 =?UTF-8?q?=E8=BF=9B=E5=BA=A6=E6=9D=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/views/template/component/ModelCard.vue | 32 ++++++++++---------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/ui/src/views/template/component/ModelCard.vue b/ui/src/views/template/component/ModelCard.vue
index 0ed62b70e..07c5312ed 100644
--- a/ui/src/views/template/component/ModelCard.vue
+++ b/ui/src/views/template/component/ModelCard.vue
@@ -29,12 +29,18 @@
     </div>
     <!-- progress -->
     <div class="progress-mask" v-if="currentModel.status === 'DOWNLOAD'">
-      <el-progress type="dashboard" :percentage="progress" class="percentage">
+      <el-progress
+        type="circle"
+        :width="56"
+        color="#3370ff"
+        :percentage="progress"
+        class="percentage"
+      >
         <template #default="{ percentage }">
           <span class="percentage-value">{{ percentage }}%</span>
-          <span class="percentage-label">正在下载 <span class="dotting"></span></span>
         </template>
       </el-progress>
+      <span class="percentage-label">正在下载 <span class="dotting"></span></span>
     </div>
 
     <template #mouseEnter>
@@ -144,10 +150,7 @@ const initInterval = () => {
         downModel.value = ok.data
       })
     } else {
-      if (downModel.value) {
-        props.updateModelById(props.model.id, downModel.value)
-        downModel.value = undefined
-      }
+      downModel.value = undefined
     }
   }, 6000)
 }
@@ -185,28 +188,27 @@ onBeforeUnmount(() => {
     position: absolute;
     top: 0;
     left: 0;
-    background-color: rgba(122, 122, 122, 0.8);
+    background-color: rgba(255, 255, 255, 0.9);
     width: 100%;
     height: 100%;
-    z-index: 111;
+    z-index: 99;
     text-align: center;
     .percentage {
       top: 50%;
-      transform: translateY(-50%);
-      margin-top: 5px;
+      transform: translateY(-65%);
     }
 
     .percentage-value {
       display: block;
-      margin-top: 10px;
-      font-size: 28px;
-      color: #ffffff;
+      font-size: 12px;
+      color: var(--el-color-primary);
     }
     .percentage-label {
       display: block;
-      margin-top: 10px;
+      margin-top: 45px;
+      margin-left: 10px;
       font-size: 12px;
-      color: #ffffff;
+      color: var(--el-color-primary);
     }
   }
 }