添加:webdav

This commit is contained in:
jmal 2021-02-05 18:02:18 +08:00
parent c97f67603c
commit f6b4eefaec
8 changed files with 151 additions and 7 deletions

View File

@ -5,7 +5,7 @@
import { Icon } from 'ant-design-vue'
const IconFont = Icon.createFromIconfontCN({
scriptUrl: '//at.alicdn.com/t/font_2024484_q3oifn59jr.js'
scriptUrl: '//at.alicdn.com/t/font_2024484_poicam3vg6b.js'
})
// 把此段代码贴到iconfont项目页面的控制台中, 以获取图标列表
@ -16,7 +16,7 @@ const IconFont = Icon.createFromIconfontCN({
// console.log(iconNames.slice(80,160))
export const iconFonts = {
list: ["menu-fuzhi", "iso", "zuijinhuoyue","key", "shouquan", "sort", "grid", "list", "emoji-a", "emoji-bizui", "emoji-baiyan", "emoji-aixin", "emoji-dajing", "emoji-ziya", "emoji-daxiao", "emoji-esi", "emoji-fadai", "emoji-fankun", "emoji-ganga", "emoji-fennu", "emoji-hanyan", "emoji-jingkong", "emoji-haochi", "emoji-emo", "emoji-jingsong", "emoji-jingya", "emoji-kaixin", "emoji-lengku", "emoji-danao", "emoji-liukoushui", "emoji-liulei", "emoji-mengbi", "mianwubiaoqing", "nanguo", "shuizhuo", "taoyan", "tanchi", "siliao", "tiaopi", "xiaochulei", "wuliao", "xingxingyan", "xieyan", "xiasi", "xiaolian", "ku", "shengqi", "yousiliao", "en", "bushufu", "bianbian", "fankun1", "feiwen", "ganmao", "huaixiao", "liuhan", "outu", "keshui", "renzhe", "santiaoxian", "guaiwu", "shoushang", "tianshi", "shuai", "xianwen", "xiaodiaodaya", "xiong", "yiwen", "yun", "liubixie", "shimo", "dianzan", "biti", "fendou", "huqi", "heng", "kulou", "leng", "taoyan1", "shuixing", "aini", "aixin1", "zhadan", "xinsui",
list: ["disk-drive", "menu-fuzhi", "iso", "zuijinhuoyue","key", "shouquan", "sort", "grid", "list", "emoji-a", "emoji-bizui", "emoji-baiyan", "emoji-aixin", "emoji-dajing", "emoji-ziya", "emoji-daxiao", "emoji-esi", "emoji-fadai", "emoji-fankun", "emoji-ganga", "emoji-fennu", "emoji-hanyan", "emoji-jingkong", "emoji-haochi", "emoji-emo", "emoji-jingsong", "emoji-jingya", "emoji-kaixin", "emoji-lengku", "emoji-danao", "emoji-liukoushui", "emoji-liulei", "emoji-mengbi", "mianwubiaoqing", "nanguo", "shuizhuo", "taoyan", "tanchi", "siliao", "tiaopi", "xiaochulei", "wuliao", "xingxingyan", "xieyan", "xiasi", "xiaolian", "ku", "shengqi", "yousiliao", "en", "bushufu", "bianbian", "fankun1", "feiwen", "ganmao", "huaixiao", "liuhan", "outu", "keshui", "renzhe", "santiaoxian", "guaiwu", "shoushang", "tianshi", "shuai", "xianwen", "xiaodiaodaya", "xiong", "yiwen", "yun", "liubixie", "shimo", "dianzan", "biti", "fendou", "huqi", "heng", "kulou", "leng", "taoyan1", "shuixing", "aini", "aixin1", "zhadan", "xinsui",
"maren", "zhutou", "qie", "youling", "apple-fill", "attachment", "android-fill", "apple", "download", "arrow-up-circle", "arrow-right-circle", "arrow-down", "ashbin", "add", "file_music", "menu", "role", "jiaoseguanli", "yemianshezhi", "drop_down", "yuandian", "tag", "service-directory", "fabu", "wailian", "bianji-", "WEBSITE", "wangzhanguanli", "Up", "up", "fenlei", "guanlizhuanjiawenzhang", "pifu", "tuichudenglu", "shezhi", "wangzhan", "huaban", "yunshezhi", "UserSettings", "blogger", "biaoqian", "myself", "guidang", "quxiaoyulan1-copy", "yulan-copy", "quxiaoyulan1", "yulan"]
}

View File

@ -54,8 +54,6 @@ export default {
}
},
data() {
// To fix https://github.com/PanJiaChen/vue-admin-template/issues/237
// TODO: refactor with render function
this.onlyOneChild = null
return {}
},

View File

@ -15,6 +15,19 @@
<sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
</el-menu>
</el-scrollbar>
<div class="quota-space">
<el-progress :class="{'collapse': isCollapse}" :percentage="percentage" :format="progressFormat" :color="customColors"></el-progress>
</div>
<div class="webdav">
<div :class="{'normal': true, 'collapse': isCollapse}" @mousemove="showCopyBtn = true" @mouseleave="showCopyBtn = false">
<svg-icon class="webdav-icon" icon-class="disk-drive"></svg-icon>
<div class="wedav-text">WebDAV </div>
<el-tooltip placement="right" v-if="showCopyBtn">
<div slot="content">点击复制WebDAV地址<br/>{{webdavUrl}}</div>
<svg-icon class="copy-btn" icon-class="menu-fuzhi" @click="copyWebDAVLink('.copy-btn')" :data-clipboard-text="webdavUrl"></svg-icon>
</el-tooltip>
</div>
</div>
</div>
</template>
@ -23,13 +36,34 @@ import { mapGetters } from 'vuex'
import Logo from './Logo'
import SidebarItem from './SidebarItem'
import variables from '@/styles/variables.scss'
import {formatSize} from "@/utils/number";
import fileConfig from "@/utils/file-config";
import Clipboard from "clipboard";
export default {
components: { SidebarItem, Logo },
data() {
return {
percentage: 0,
customColors: [
{color: '#f56c6c', percentage: 100},
{color: '#e6a23c', percentage: 80},
{color: '#5cb87a', percentage: 60},
{color: '#1989fa', percentage: 40},
{color: '#6f7ad3', percentage: 20}
],
showCopyBtn: false
}
},
computed: {
...mapGetters([
'sidebar'
'sidebar',
'name',
'userInfo'
]),
webdavUrl() {
return fileConfig.webDAVUrl(this.name)
},
routes() {
let routes = []
if(this.$route.meta.menuType === 0){
@ -65,6 +99,110 @@ export default {
isCollapse() {
return !this.sidebar.opened
}
},
watch: {
isCollapse(val){
this.progressFormat()
}
},
methods: {
copyWebDAVLink(className) {
let clipboard = new Clipboard(className)
clipboard.on('success', e => {
this.$message({message: '复制成功', type: 'success', duration: 1000})
// 释放内存
clipboard.destroy()
})
clipboard.on('error', e => {
// 不支持复制
this.$message({message: '该浏览器不支持自动复制', type: 'warning', duration: 1000})
clipboard.destroy()
})
},
mouseleave() {
console.log('mouseleave')
},
onmousemove() {
console.log('onmousemove')
},
progressFormat() {
const space = this.userInfo.takeUpSpace/1024/1024/1024
const quota = this.userInfo.quota
if(space && quota > 0){
this.percentage = Number((space/quota * 100).toFixed(1))
if(this.isCollapse){
return `${formatSize(this.userInfo.takeUpSpace)}`
} else {
return `${formatSize(this.userInfo.takeUpSpace)}/${quota}GB`
}
}
},
}
}
</script>
<style lang="scss" scoped>
.sidebar-container.has-logo {
/deep/.el-scrollbar {
height: calc(100% - 132px) !important;
}
}
.quota-space {
font-size: 14px;
height: 32px;
line-height: 32px;
/deep/.el-progress-bar {
padding-right: 40px;
margin-left: 20px;
}
/deep/.el-progress__text {
margin-left: 20px;
font-size: 12px!important;
}
.collapse {
/deep/.el-progress-bar {
padding-right: 4px;
margin-left: 2px;
}
/deep/.el-progress__text {
margin-left: 5px;
display: block;
}
}
}
.webdav {
.normal {
font-size: 1.5rem;
height: 46px;
display: flex;
line-height: 46px;
padding-left: 20px;
.webdav-icon {
margin-top: 12px;
margin-right: 0!important;
}
.copy-btn {
margin-top: 10px;
margin-left: 50px;
}
.copy-btn:hover {
cursor: pointer;
}
.wedav-text {
font-size: 12px;
margin-left: 20px;
}
}
.normal:hover {
cursor: pointer;
}
.collapse {
padding-left: 15px;
.wedav-text {
display: none;
}
.copy-btn {
display: none;
}
}
}
</style>

View File

@ -6,6 +6,7 @@ const getters = {
name: state => state.user.name,
showName: state => state.user.showName,
userId: state => state.user.userId,
userInfo: state => state.user.userInfo,
menuList: state => state.user.menuList,
}
export default getters

View File

@ -11,6 +11,7 @@ const getDefaultState = () => {
token: getToken(),
name: '',
showName: '',
userInfo: {},
avatar: '',
userId: getConsumerId(),
menuList: []
@ -40,6 +41,9 @@ const mutations = {
},
SET_MENU_LIST:(state,menuList) => {
state.menuList = menuList;
},
SET_USER_INFO:(state,userInfo) => {
state.userInfo = userInfo;
}
}
@ -99,6 +103,7 @@ const actions = {
commit('SET_SHOW_NAME', showName)
commit('SET_AVATAR', avatar)
commit('SET_USERID', id)
commit('SET_USER_INFO', data)
sessionStorage.setItem('store', JSON.stringify(state))
resolve(data)
}).catch(error => {

View File

@ -3,6 +3,9 @@ import fileApi from '@/api/file-api'
export default {
baseUrl: '/api',
webDAVUrl: function(username) {
return window.location.origin + `${this.baseUrl}/webDAV/${username}`
},
previewUrl: function(username, file) {
return `${this.baseUrl}/file/${username}${file.path}${file.name}`
},

View File

@ -78,7 +78,7 @@ export default {
},
webpChange(webpEnabled) {
settingApi.disabledWebp({userId: this.$store.state.user.userId, disabled: !webpEnabled}).then(() => {
webpEnabled ? this.$message.success('webp 以启用') : this.$message.warning('webp 以禁用')
webpEnabled ? this.$message.success('webp 已启用') : this.$message.warning('webp 已禁用')
}).catch(() => {
this.webpEnabled = !this.webpEnabled
})

View File

@ -480,7 +480,6 @@
// 复制分享链接
copyShareLink() {
var clipboard = new Clipboard('.tag-share-link')
console.log(clipboard)
clipboard.on('success', e => {
this.$message({
message: '复制成功',