lunanting/jmalcloud-view
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 优化文件显示组件的代码格式和样式

Browse Source
This commit is contained in:
jmal 2025-07-18 16:11:59 +08:00
parent 3765aa57b6
commit f05ce8d18b
1 changed files with 10 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
src/components/ShowFile/ShowFile.vue
View File

@ -259,11 +259,7 @@
</template> </template>
</el-autocomplete> </el-autocomplete>
<el-dropdown <el-dropdown size="medium" style="height: 40px;" @command="contextmenuClick" >
size="medium"
style="height: 40px;"
@command="contextmenuClick"
>
<div> <div>
<el-button round type="text" class="sort"> <el-button round type="text" class="sort">
<svg-icon <svg-icon
@ -276,70 +272,26 @@
</div> </div>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="orderName"> <el-dropdown-item command="orderName">
<span <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'name' }" >
:class="{ <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
'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>名称</span>
</span> </span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="orderSize"> <el-dropdown-item command="orderSize">
<span <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'size' }" >
:class="{ <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
'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>大小</span>
</span> </span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="orderUploadDate"> <el-dropdown-item command="orderUploadDate">
<span <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'uploadDate' }" >
:class="{ <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending' }" ></i>
'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>上传时间</span>
</span> </span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item command="orderUpdateDate"> <el-dropdown-item command="orderUpdateDate">
<span <span :class="{ 'al-file-sort-item': true, active: sortable.prop === 'updateDate', }">
:class="{ <i :class="{ 'al-file-sort-item-icon': true, 'el-icon-top': sortable.order === 'ascending', 'el-icon-bottom': sortable.order === 'descending'}"></i>
'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>修改时间</span>
</span> </span>
</el-dropdown-item> </el-dropdown-item>
@ -4955,7 +4907,7 @@ export default {
left: 0; left: 0;
right: 0; right: 0;
bottom: 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; pointer-events: none;
z-index: 10; z-index: 10;
} }