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 2024-06-09 17:49:17 +08:00
parent a475c456dd
commit 81ddba82c2
14 changed files with 203 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ShareDialog/index.vue
View File

@ -86,7 +86,7 @@
<el-collapse-item title="操作权限" name="1">
<el-checkbox-group v-model="shareOption.operationPermissionList" @change="permissionActionChange">
<el-checkbox label="UPLOAD">上传</el-checkbox>
<el-checkbox label="PUT">修改</el-checkbox>
<el-checkbox label="PUT">编辑</el-checkbox>
<el-checkbox label="DELETE">删除</el-checkbox>
</el-checkbox-group>
</el-collapse-item>

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

@ -89,7 +89,8 @@
<div class="search-content">
<div class="search-class">
<el-popover
v-show="showUploadButton"
v-if="showUploadButton"
v-show="!(pathList.length < 2 && homeHidden)"
v-model="isShowNewFolder"
placement="bottom"
trigger="hover"
@ -869,6 +870,10 @@ export default {
type: Number,
default: 106,
},
homeHidden: {
type: Boolean,
default: false,
},
showUploadButton: {
type: Boolean,
default: true,
@ -1199,6 +1204,7 @@ export default {
$route(to) {
if (to.query.tagId && this.queryCondition.tagId !== this.$route.query.tagId) {
this.queryCondition.tagId = this.$route.query.tagId
this.pathList = [{ folder: "" }]
this.getFileList()
}
},

17
src/styles/setting.scss
View File

@ -197,4 +197,21 @@ a:hover {
}
}
}
.setting-title-desc {
.setting-title-desc-text {
padding: 5px 0 20px 0;
}
>>>.el-divider--horizontal {
margin: 0;
}
}
>>> .el-form {
.form-instruction {
color: #9a9a9a;
font-size: .8125rem;
a {
color: #1890ff;
}
}
}

1
src/views/favorite/index.vue
View File

@ -8,6 +8,7 @@
:defaultSort="sortable"
:queryCondition="queryCondition"
:contextMenus="contextMenus"
homeHidden
>
</show-file>
</div>

33
src/views/fileType/audio.vue
View File

@ -8,6 +8,8 @@
:queryCondition="queryCondition"
singleFileType="音乐"
emptyStatus="还没有音乐呢~"
:showUploadButton="false"
:contextMenus="contextMenus"
></show-file>
</div>
</template>
@ -24,7 +26,36 @@ export default {
},
queryCondition: {
isFolder:false
}
},
contextMenus: [
{ label: '查看', operation: 'viewMode' ,child: [
{ iconClass: this.grid?'':'menu-point', label: '列表', operation: 'vmode-list'},
{ iconClass: this.grid?'menu-point':'', label: '缩略图', operation: 'vmode-grid'},
{ label: '显示文件夹大小', operation: 'show-folder-size'},
]
},
{ label: '排列方式', operation: 'arrangement' ,child: [
{ label: '名称', operation: 'orderName', orderProp: 'name'},
{ label: '大小', operation: 'orderSize', orderProp: 'size'},
{ label: '日期', operation: 'orderUpdateDate', orderProp: 'updateDate'},
]
},
{ label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: [
{ label: '文件夹', operation: 'createFolder', iconClass: 'folder'},
{ divider: true, operation: 'divider' },
{ label: '文本', operation: 'createTextFile', iconClass: 'file-txt'},
{ label: '思维导图', operation: 'createMinderFile', iconClass: 'file-mind'},
{ label: '流程图', operation: 'createDrawioFile', iconClass: 'file-drawio'},
{ label: 'Word', operation: 'createWordFile', iconClass: 'file-word'},
{ label: 'Excel', operation: 'createExcelFile', iconClass: 'file-excel'},
{ label: 'PPT', operation: 'createPPTFile', iconClass: 'file-ppt'},
]
},
{ divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'},
]
}
},
}

33
src/views/fileType/document.vue
View File

@ -7,6 +7,8 @@
:sortable="sortable"
:queryCondition="queryCondition"
emptyStatus="还没有文档呢~"
:showUploadButton="false"
:contextMenus="contextMenus"
>
</show-file>
</div>
@ -24,7 +26,36 @@ export default {
},
queryCondition: {
isFolder: false
}
},
contextMenus: [
{ label: '查看', operation: 'viewMode' ,child: [
{ iconClass: this.grid?'':'menu-point', label: '列表', operation: 'vmode-list'},
{ iconClass: this.grid?'menu-point':'', label: '缩略图', operation: 'vmode-grid'},
{ label: '显示文件夹大小', operation: 'show-folder-size'},
]
},
{ label: '排列方式', operation: 'arrangement' ,child: [
{ label: '名称', operation: 'orderName', orderProp: 'name'},
{ label: '大小', operation: 'orderSize', orderProp: 'size'},
{ label: '日期', operation: 'orderUpdateDate', orderProp: 'updateDate'},
]
},
{ label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: [
{ label: '文件夹', operation: 'createFolder', iconClass: 'folder'},
{ divider: true, operation: 'divider' },
{ label: '文本', operation: 'createTextFile', iconClass: 'file-txt'},
{ label: '思维导图', operation: 'createMinderFile', iconClass: 'file-mind'},
{ label: '流程图', operation: 'createDrawioFile', iconClass: 'file-drawio'},
{ label: 'Word', operation: 'createWordFile', iconClass: 'file-word'},
{ label: 'Excel', operation: 'createExcelFile', iconClass: 'file-excel'},
{ label: 'PPT', operation: 'createPPTFile', iconClass: 'file-ppt'},
]
},
{ divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'},
]
}
},
}

33
src/views/fileType/image.vue
View File

@ -6,6 +6,8 @@
:sortable="sortable"
:queryCondition="queryCondition"
emptyStatus="还没有图片呢~"
:showUploadButton="false"
:contextMenus="contextMenus"
>
</show-file>
</div>
@ -23,7 +25,36 @@ export default {
},
queryCondition: {
isFolder: false
}
},
contextMenus: [
{ label: '查看', operation: 'viewMode' ,child: [
{ iconClass: this.grid?'':'menu-point', label: '列表', operation: 'vmode-list'},
{ iconClass: this.grid?'menu-point':'', label: '缩略图', operation: 'vmode-grid'},
{ label: '显示文件夹大小', operation: 'show-folder-size'},
]
},
{ label: '排列方式', operation: 'arrangement' ,child: [
{ label: '名称', operation: 'orderName', orderProp: 'name'},
{ label: '大小', operation: 'orderSize', orderProp: 'size'},
{ label: '日期', operation: 'orderUpdateDate', orderProp: 'updateDate'},
]
},
{ label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: [
{ label: '文件夹', operation: 'createFolder', iconClass: 'folder'},
{ divider: true, operation: 'divider' },
{ label: '文本', operation: 'createTextFile', iconClass: 'file-txt'},
{ label: '思维导图', operation: 'createMinderFile', iconClass: 'file-mind'},
{ label: '流程图', operation: 'createDrawioFile', iconClass: 'file-drawio'},
{ label: 'Word', operation: 'createWordFile', iconClass: 'file-word'},
{ label: 'Excel', operation: 'createExcelFile', iconClass: 'file-excel'},
{ label: 'PPT', operation: 'createPPTFile', iconClass: 'file-ppt'},
]
},
{ divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'},
]
}
},
}

33
src/views/fileType/video.vue
View File

@ -7,6 +7,8 @@
:sortable="sortable"
:queryCondition="queryCondition"
emptyStatus="还没有视频呢~"
:showUploadButton="false"
:contextMenus="contextMenus"
>
</show-file>
</div>
@ -24,7 +26,36 @@ export default {
},
queryCondition: {
isFolder: false
}
},
contextMenus: [
{ label: '查看', operation: 'viewMode' ,child: [
{ iconClass: this.grid?'':'menu-point', label: '列表', operation: 'vmode-list'},
{ iconClass: this.grid?'menu-point':'', label: '缩略图', operation: 'vmode-grid'},
{ label: '显示文件夹大小', operation: 'show-folder-size'},
]
},
{ label: '排列方式', operation: 'arrangement' ,child: [
{ label: '名称', operation: 'orderName', orderProp: 'name'},
{ label: '大小', operation: 'orderSize', orderProp: 'size'},
{ label: '日期', operation: 'orderUpdateDate', orderProp: 'updateDate'},
]
},
{ label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: [
{ label: '文件夹', operation: 'createFolder', iconClass: 'folder'},
{ divider: true, operation: 'divider' },
{ label: '文本', operation: 'createTextFile', iconClass: 'file-txt'},
{ label: '思维导图', operation: 'createMinderFile', iconClass: 'file-mind'},
{ label: '流程图', operation: 'createDrawioFile', iconClass: 'file-drawio'},
{ label: 'Word', operation: 'createWordFile', iconClass: 'file-word'},
{ label: 'Excel', operation: 'createExcelFile', iconClass: 'file-excel'},
{ label: 'PPT', operation: 'createPPTFile', iconClass: 'file-ppt'},
]
},
{ divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'},
]
}
},
}

33
src/views/recently/index.vue
View File

@ -6,6 +6,8 @@
:sortable="sortable"
:queryCondition="queryCondition"
:showNavigation="true"
:contextMenus="contextMenus"
:showUploadButton="false"
></show-file>
</div>
</template>
@ -22,7 +24,36 @@
},
queryCondition: {
isFolder:false
}
},
contextMenus: [
{ label: '查看', operation: 'viewMode' ,child: [
{ iconClass: this.grid?'':'menu-point', label: '列表', operation: 'vmode-list'},
{ iconClass: this.grid?'menu-point':'', label: '缩略图', operation: 'vmode-grid'},
{ label: '显示文件夹大小', operation: 'show-folder-size'},
]
},
{ label: '排列方式', operation: 'arrangement' ,child: [
{ label: '名称', operation: 'orderName', orderProp: 'name'},
{ label: '大小', operation: 'orderSize', orderProp: 'size'},
{ label: '日期', operation: 'orderUpdateDate', orderProp: 'updateDate'},
]
},
{ label: '刷新', operation: 'refresh'},
{ divider: true, operation: 'divider' },
{ label: '新建', operation: 'create' , homeDisable: true, child: [
{ label: '文件夹', operation: 'createFolder', iconClass: 'folder'},
{ divider: true, operation: 'divider' },
{ label: '文本', operation: 'createTextFile', iconClass: 'file-txt'},
{ label: '思维导图', operation: 'createMinderFile', iconClass: 'file-mind'},
{ label: '流程图', operation: 'createDrawioFile', iconClass: 'file-drawio'},
{ label: 'Word', operation: 'createWordFile', iconClass: 'file-word'},
{ label: 'Excel', operation: 'createExcelFile', iconClass: 'file-excel'},
{ label: 'PPT', operation: 'createPPTFile', iconClass: 'file-ppt'},
]
},
{ divider: true, operation: 'divider' },
{ label: '写文章', operation: 'createMarkdownFile'},
]
}
},
}

12
src/views/setting/authAPP.vue
View File

@ -37,8 +37,10 @@
</div>
</div>
<div>
<div class="token-title-desc">您可以使用这些以生成的令牌来操作 JmalCloud API。</div>
<el-divider></el-divider>
<div class="setting-title-desc">
<div class="setting-title-desc-text">您可以使用这些以生成的令牌来操作 JmalCloud API。</div>
<el-divider></el-divider>
</div>
<div>
<ul v-if="accessTokenList.length > 0">
<li v-for="token in accessTokenList" :key="token.id">
@ -144,9 +146,6 @@ export default {
<style lang="scss" scoped>
@import "src/styles/setting";
>>>.el-divider--horizontal {
margin: 0;
}
>>>.el-alert {
margin-bottom: 15px;
.el-alert__content {
@ -156,9 +155,6 @@ export default {
font-size: 1rem;
}
}
.token-title-desc {
padding: 5px 0 20px 0;
}
.token-item {
display: flex;
height: 80px;

10
src/views/setting/cloudSetting/officeConfig.vue
View File

@ -1,15 +1,18 @@
<template>
<div class="container">
<el-form :rules="rules" ref="officeConfigForm" :model="configFormData" label-width="150px" size="small"
<el-form ref="officeConfigForm" :model="configFormData" label-width="150px" size="small"
style="width: 520px" autocomplete="off">
<el-form-item label="OnlyOffice地址" prop="documentServer">
<el-input placeholder="OnlyOffice Server 地址, 一般不用填" v-model.number="configFormData.documentServer"></el-input>
<span class="form-instruction">使用外部OnlyOffice服务时需要填写</span>
</el-form-item>
<el-form-item label="密钥" prop="secret">
<el-input type="password" placeholder="OnlyOffice JWT (留空为不使用密钥)" v-model="configFormData.secret"></el-input>
<span class="form-instruction">建议使用密钥,防止office服务被白嫖。<a href="https://helpcenter.onlyoffice.com/installation/docs-configure-jwt.aspx" target="_blank">查看OnlyOffice文档</a></span>
</el-form-item>
<el-form-item label="回调服务地址" prop="callbackServer">
<el-input placeholder="JmalCloud Server 地址, 一般不用填" v-model.number="configFormData.callbackServer"></el-input>
<span class="form-instruction">使用外部OnlyOffice服务时需要填写</span>
</el-form-item>
<el-form-item>
<el-button type="primary" v-loading="saveConfigLoading" @click="saveConfig">保存配置</el-button>
@ -41,11 +44,6 @@ export default {
tokenEnabled: false,
callbackServer: undefined
},
rules: {
// documentServer: [
// {required: true, message: '请输入文档服务器地址', trigger: 'blur'}
// ]
}
}
},
mounted() {

6
src/views/setting/cloudSetting/transcodeConfig.vue
View File

@ -13,10 +13,12 @@
</el-select>
</el-form-item>
<el-form-item label="目标码率(kbps)" prop="bitrate">
<el-input placeholder="默认2500 kbps,小于该值则不转码" v-model.number="configFormData.bitrate"></el-input>
<el-input placeholder="2500" v-model.number="configFormData.bitrate"></el-input>
<span class="form-instruction">默认2500 kbps,小于该值则不转码</span>
</el-form-item>
<el-form-item label="目标高度" prop="height">
<el-input placeholder="默认720,小于该值则不转码(视频宽度则默认随高度等比例缩放)" v-model.number="configFormData.height"></el-input>
<el-input placeholder="720" v-model.number="configFormData.height"></el-input>
<span class="form-instruction">默认720,小于该值则不转码(视频宽度则默认随高度等比例缩放)</span>
</el-form-item>
<el-form-item>
<el-button type="primary" v-loading="saveConfigLoading" @click="saveConfig">保存配置</el-button>

4
src/views/setting/taskProgress.vue
View File

@ -9,6 +9,10 @@
</div>
</div>
<div>
<div class="setting-title-desc">
<div class="setting-title-desc-text">OCR识别任务和视频转码任务</div>
<el-divider></el-divider>
</div>
<task-progress :data="taskProgressDataList"></task-progress>
</div>
</el-card>

1
src/views/tag/index.vue
View File

@ -7,6 +7,7 @@
:defaultSort="sortable"
:queryCondition="queryCondition"
:contextMenus="contextMenus"
homeHidden
>
</show-file>
</div>