From 3eeea14b97e5f24fbef123010abd5713f8f00f9e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=98=BF=E8=BE=89?= <a@a.com>
Date: Tue, 19 Nov 2024 14:29:23 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=87=E4=BB=B6=E9=80=89=E6=8B=A9=E5=99=A8?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81audio=E7=9A=84=E8=A1=A8=E5=8D=95=E7=B1=BB?=
 =?UTF-8?q?=E5=9E=8B=E9=80=89=E9=A1=B9=EF=BC=8C=E4=BC=98=E5=8C=96=E9=83=A8?=
 =?UTF-8?q?=E5=88=86=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/fileSelector/index.vue | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/web/src/components/fileSelector/index.vue b/web/src/components/fileSelector/index.vue
index e9f18f6..db3c706 100644
--- a/web/src/components/fileSelector/index.vue
+++ b/web/src/components/fileSelector/index.vue
@@ -23,10 +23,25 @@
     </div>
     <div v-if="props.inputType === 'video'"
       style="position: relative; display: flex; align-items: center;  justify-items: center;"
-      :style="{ width: props.inputImageSize + 'px', height: props.inputImageSize + 'px' }">
+      :style="{ width: props.inputImageSize * 2 + 'px', height: props.inputImageSize + 'px' }">
       <video :src="data" :controls="false" :autoplay="true" :muted="true" :loop="true"></video>
       <div v-show="!(!!data)"
-        style="position: absolute; left: 0; top: 0; height: 100%; aspect-ratio: 1 / 1; display: flex; justify-content: center; align-items: center;">
+        style="position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;">
+        <el-icon :size="24">
+          <Plus />
+        </el-icon>
+      </div>
+      <div @click="selectVisiable = true" class="addControllorHover"></div>
+      <el-icon v-show="!!data" class="closeHover" :size="16" @click="dataClear">
+        <Close />
+      </el-icon>
+    </div>
+    <div v-if="props.inputType === 'audio'"
+      style="position: relative; display: flex; align-items: center;  justify-items: center;"
+      :style="{ width: props.inputImageSize * 2 + 'px', height: props.inputImageSize + 'px' }">
+      <audio style="width: 100%;" :src="data" :controls="!!data" :autoplay="false" :muted="true" :loop="true"></audio>
+      <div v-show="!(!!data)"
+        style="position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;">
         <el-icon :size="24">
           <Plus />
         </el-icon>
@@ -274,7 +289,7 @@ onMounted(() => {
 
 .addControllorHover {
   width: 100%;
-  aspect-ratio: 1 / 1;
+  height: 100%;
   position: absolute;
   left: 0;
   top: 0;