From f05ce8d18bca8392fb29435ac70545b2b9494e30 Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Fri, 18 Jul 2025 16:11:59 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E4=BC=98=E5=8C=96=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E7=BB=84=E4=BB=B6=E7=9A=84=E4=BB=A3=E7=A0=81?=
 =?UTF-8?q?=E6=A0=BC=E5=BC=8F=E5=92=8C=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ShowFile/ShowFile.vue | 68 ++++------------------------
 1 file changed, 10 insertions(+), 58 deletions(-)

diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue
index 698d717..6c765a1 100644
--- a/src/components/ShowFile/ShowFile.vue
+++ b/src/components/ShowFile/ShowFile.vue
@@ -259,11 +259,7 @@
               </template>
 
             </el-autocomplete>
-            <el-dropdown
-              size="medium"
-              style="height: 40px;"
-              @command="contextmenuClick"
-            >
+            <el-dropdown size="medium" style="height: 40px;" @command="contextmenuClick" >
               <div>
                 <el-button round type="text" class="sort">
                   <svg-icon
@@ -276,70 +272,26 @@
               </div>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item command="orderName">
-                  <span
-                    :class="{
-                      'al-file-sort-item': true,
-                      active: sortable.prop === 'name',
-                    }"
-                  >
-                    <i
-                      :class="{
-                        'al-file-sort-item-icon': true,
-                        'el-icon-top': sortable.order === 'ascending',
-                        'el-icon-bottom': sortable.order === 'descending',
-                      }"
-                    ></i>
+                  <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'name' }" >
+                    <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
                     <span>名称</span>
                   </span>
                 </el-dropdown-item>
                 <el-dropdown-item command="orderSize">
-                  <span
-                    :class="{
-                      'al-file-sort-item': true,
-                      active: sortable.prop === 'size',
-                    }"
-                  >
-                    <i
-                      :class="{
-                        'al-file-sort-item-icon': true,
-                        'el-icon-top': sortable.order === 'ascending',
-                        'el-icon-bottom': sortable.order === 'descending',
-                      }"
-                    ></i>
+                  <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'size' }" >
+                    <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
                     <span>大小</span>
                   </span>
                 </el-dropdown-item>
                 <el-dropdown-item command="orderUploadDate">
-                  <span
-                    :class="{
-                      'al-file-sort-item': true,
-                      active: sortable.prop === 'uploadDate',
-                    }"
-                  >
-                    <i
-                      :class="{
-                        'al-file-sort-item-icon': true,
-                        'el-icon-top': sortable.order === 'ascending',
-                        'el-icon-bottom': sortable.order === 'descending',
-                      }"
-                    ></i>
+                  <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'uploadDate' }" >
+                    <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
                     <span>上传时间</span>
                   </span>
                 </el-dropdown-item>
                 <el-dropdown-item command="orderUpdateDate">
-                  <span
-                    :class="{
-                      'al-file-sort-item': true,
-                      active: sortable.prop === 'updateDate',
-                    }"
-                  >
-                    <i
-                      :class="{
-                        'al-file-sort-item-icon': true,
-                        'el-icon-top': sortable.order === 'ascending',
-                        'el-icon-bottom': sortable.order === 'descending',
-                      }"
-                    ></i>
+                  <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'updateDate', }">
+                    <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending'}"></i>
                     <span>修改时间</span>
                   </span>
                 </el-dropdown-item>
@@ -4955,7 +4907,7 @@ export default {
   left: 0;
   right: 0;
   bottom: 0;
-  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.05) 0px, transparent 4px);
+  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.05), transparent 4px);
   pointer-events: none;
   z-index: 10;
 }