perf: 优化文件功能按钮

siknet · Mar 13, 2024 · 7208d51 · 7208d51
1 parent 16359a9
commit 7208d51
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 7 deletions.
diff --git a/resources/assets/js/pages/manage/file.vue b/resources/assets/js/pages/manage/file.vue
@@ -42,24 +42,30 @@
                     <Button :disabled="shearFirst.pid == pid" size="small" type="primary" @click="shearTo" :style="{marginLeft: showBtnText ? '12px' : 0}">
                         <div class="file-shear">
                             <span>{{$L('粘贴')}}</span>
-                            <span v-show="showBtnText">"<em>{{shearFirst.name}}</em>"</span>
+                            <template v-show="showBtnText">"<em>{{shearFirst.name}}</em>"</template>
                             <span v-if="shearIds.length > 1">{{$L('等')}}{{shearIds.length}}{{$L('个文件')}}</span>
                         </div>
                     </Button>
                     <Button type="primary" size="small" @click="clearShear">{{ $L('取消剪切') }}</Button>
                 </template>
                 <template v-else-if="selectIds.length > 0">
                     <Button size="small" type="info" @click="handleContextClick('shearSelect')" :style="{marginLeft: showBtnText ? '12px' : 0}">
-                        <Icon type="ios-cut" />
-                        <span v-show="showBtnText">{{$L('剪切')}}</span>
+                        <div class="tool-box">
+                            <Icon type="ios-cut" />
+                            <span v-show="showBtnText">{{$L('剪切')}}</span>
+                        </div>
                     </Button>
                     <Button :disabled="compressedSownloadDisabled" size="small" type="info" @click="downloadZipFile(selectIds)">
-                        <Icon type="ios-download" />
-                        <span v-show="showBtnText">{{$L('打包下载')}}</span>
+                        <div class="tool-box">
+                            <Icon type="ios-download" />
+                            <span v-show="showBtnText">{{$L('打包下载')}}</span>
+                        </div>
                     </Button>
                     <Button size="small" type="error" @click="deleteFile(selectIds)">
-                        <Icon type="ios-trash" />
-                        <span v-show="showBtnText">{{$L('删除')}}</span>
+                        <div class="tool-box">
+                            <Icon type="ios-trash" />
+                            <span v-show="showBtnText">{{$L('删除')}}</span>
+                        </div>
                     </Button>
                     <Button type="primary" size="small" @click="clearSelect">
                         {{showBtnText ? $L('取消选择') : $L('取消')}}

diff --git a/resources/assets/sass/pages/page-file.scss b/resources/assets/sass/pages/page-file.scss
@@ -163,6 +163,16 @@
             .ivu-btn {
                 font-size: 12px;
                 margin-left: 12px;
+                .tool-box {
+                    display: flex;
+                    align-items: center;
+                    > i {
+                        font-size: 14px;
+                    }
+                    > span {
+                        margin-left: 2px;
+                    }
+                }
             }
             .file-shear {
                 display: flex;