Merge remote-tracking branch 'origin/dev' into dev
This commit is contained in:
jmal
commit
bbc2ee1365
13
package.json
13
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "jmal-cloud-view",
|
||||
"version": "2.1.9",
|
||||
"version": "2.2.32",
|
||||
"description": "jmalcloud",
|
||||
"author": "Jmal <zhushilun084@163.com>",
|
||||
"license": "MIT",
|
||||
@ -15,6 +15,7 @@
|
||||
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
|
||||
},
|
||||
"dependencies": {
|
||||
"@moefe/vue-aplayer": "^2.0.0-beta.5",
|
||||
"ant-design-vue": "^1.6.5",
|
||||
"clipboard": "^2.0.6",
|
||||
"cropperjs": "^1.5.6",
|
||||
@ -48,7 +49,6 @@
|
||||
"vue-aplayer": "^1.6.1",
|
||||
"vue-runtime-helpers": "^1.1.2",
|
||||
"vue-simple-uploader": "^0.7.4",
|
||||
"vue-template-compiler": "^2.6.12",
|
||||
"vue-video-player": "^5.0.2",
|
||||
"vue-wechat-title": "^2.0.5",
|
||||
"vuedraggable": "^2.23.2",
|
||||
@ -59,13 +59,13 @@
|
||||
"@babel/register": "7.0.0",
|
||||
"@vue/cli-plugin-babel": "3.6.0",
|
||||
"@vue/cli-plugin-eslint": "^3.9.1",
|
||||
"@vue/cli-plugin-unit-jest": "^4.5.12",
|
||||
"@vue/cli-service": "^4.5.12",
|
||||
"@vue/cli-plugin-unit-jest": "3.6.3",
|
||||
"@vue/cli-service": "3.6.0",
|
||||
"@vue/test-utils": "1.0.0-beta.29",
|
||||
"autoprefixer": "^9.5.1",
|
||||
"babel-core": "7.0.0-bridge.0",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-jest": "^26.6.3",
|
||||
"babel-jest": "23.6.0",
|
||||
"babel-plugin-import": "^1.13.0",
|
||||
"chalk": "2.4.2",
|
||||
"connect": "3.6.6",
|
||||
@ -79,7 +79,8 @@
|
||||
"script-loader": "0.7.2",
|
||||
"serve-static": "^1.13.2",
|
||||
"svg-sprite-loader": "4.1.3",
|
||||
"svgo": "1.2.2"
|
||||
"svgo": "1.2.2",
|
||||
"vue-template-compiler": "2.6.10"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.9",
|
||||
|
||||
@ -18,20 +18,20 @@
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css"/>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.js"></script>
|
||||
<!--element-ui.js-->
|
||||
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.1/lib/theme-chalk/index.css">
|
||||
<script src="https://unpkg.com/element-ui@2.15.1/lib/index.js"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css">
|
||||
<script src="https://unpkg.com/element-ui@2.13.0/lib/index.js"></script>
|
||||
<!--pl-table.js-->
|
||||
<link rel="stylesheet" href="https://unpkg.com/pl-table@2.7.5/themes/index.css">
|
||||
<script src="https://unpkg.com/pl-table@2.7.5/lib/index.js"></script>
|
||||
<!--viewer css-->
|
||||
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/viewerjs/1.7.1/viewer.min.css">
|
||||
<!--vue-aplayer-->
|
||||
<script src="//cdn.jsdelivr.net/npm/vue-aplayer"></script>
|
||||
<!--vue-aplayer-theme-->
|
||||
<script src="https://cdn.jsdelivr.net/npm/colorthief@2.0.2/src/color-thief.js"></script>
|
||||
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= webpackConfig.name %></title>
|
||||
<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/5.13.0/css/all.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/colorthief@2.0.2/src/color-thief.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
|
||||
@ -1374,7 +1374,6 @@ export default {
|
||||
}
|
||||
// 开始拖拽
|
||||
container.ondragstart = (e) => {
|
||||
e.target.style.cursor = 'no-drop'
|
||||
// 正在选区获取按住关键键时禁止拖拽
|
||||
if (_this.drawFlag || _this.isCmd || _this.selectPin) {
|
||||
e.preventDefault()
|
||||
@ -1387,8 +1386,11 @@ export default {
|
||||
}
|
||||
// 该文件正在重命名
|
||||
if (e.target.rowIndex === _this.editingIndex){
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
return
|
||||
}
|
||||
e.target.style.cursor = 'no-drop'
|
||||
// 当滚动条滚动后禁止拖拽
|
||||
if (_this.fileListScrollTop === 0) {
|
||||
// 复制被拖拽dom的title, 拖拽过程中移除, 拖拽完后还原
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
<template>
|
||||
<div ref="audioPreview" v-if="show">
|
||||
<div class="audio-player"
|
||||
v-aplayerDrag="{ x: transformX, y: transformY }"
|
||||
v-aplayerDrag="{ x: transformX, y: transformY }"
|
||||
@mouseenter="closeBarShow = true" @mouseleave="closeBarShow = false" @touchmove="closeBarShow = true" @touchend="touchend">
|
||||
<aplayer
|
||||
<a-player
|
||||
ref="audioPlayer"
|
||||
autoplay
|
||||
listFolded
|
||||
loop.sync="all"
|
||||
order.sync="list"
|
||||
:mini.sync="mini"
|
||||
:music.sync="music"
|
||||
:list="list"
|
||||
:lrc-type="0">
|
||||
</aplayer>
|
||||
:audio="list"
|
||||
:lrc-type="0"
|
||||
>
|
||||
</a-player>
|
||||
<div v-show="closeBarShow" class="close-bar" @click="close">
|
||||
<svg-icon class="audio-player-close" icon-class="close"/>
|
||||
</div>
|
||||
@ -36,19 +36,12 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
pc: this.$pc,
|
||||
transformX: !this.$pc ? 20: (document.body.clientWidth-500)/2,
|
||||
transformY: 0,
|
||||
transformX: !this.$pc ? document.body.clientWidth - 100: (document.body.clientWidth-500)/2,
|
||||
transformY: !this.$pc ? document.body.clientHeight/2 - 100 : 0,
|
||||
show: false,
|
||||
closeBarShow: false,
|
||||
music: {
|
||||
id: '',
|
||||
src: '', // 音频文件的 URL
|
||||
title: '', // 歌曲名称
|
||||
artist: '', // 演唱者
|
||||
pic: '', // 封面图片 URL
|
||||
lrc: '', // LRC 歌词或者歌词文件的 URL
|
||||
theme: '', // 歌曲的主题色，会覆盖播放器的主题色
|
||||
},
|
||||
// api ==> https://aplayer.netlify.app/docs/guide/options.html#volume
|
||||
audios: [],
|
||||
list: [],
|
||||
mini: !this.$pc,
|
||||
audioPlayerDoc: undefined
|
||||
@ -65,31 +58,40 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
Bus.$on('onAddAudio',(newFile, audioCoverUrl) => {
|
||||
this.show = true
|
||||
if (!this.show) {
|
||||
this.show = true
|
||||
}
|
||||
let url = fileConfig.previewUrl(this.$store.state.user.name, newFile, this.$store.getters.token)
|
||||
if(!this.$store.state.user.token){
|
||||
url = fileConfig.publicPreviewUrl(newFile.id, window.shareId);
|
||||
}
|
||||
let music = newFile.music
|
||||
let fileName = newFile.name.substring(0,newFile.name.length - newFile.suffix.length-1)
|
||||
this.music = {
|
||||
let musicOperation = {
|
||||
id: newFile.id,
|
||||
src: url,
|
||||
title: music.songName ? music.songName : fileName,
|
||||
url: url,
|
||||
name: music.songName ? music.songName : fileName,
|
||||
artist: music.songName ? music.singer : fileName,
|
||||
pic: music.songName ? audioCoverUrl+newFile.id :'',
|
||||
lrc: '',
|
||||
theme: 'pic'
|
||||
cover: music.songName ? audioCoverUrl+newFile.id :'',
|
||||
type: newFile.contentType
|
||||
}
|
||||
let musicIndex = this.list.findIndex(item => item.id === newFile.id)
|
||||
let musicIndex = this.audios.findIndex(item => item.id === newFile.id)
|
||||
if(musicIndex < 0){
|
||||
this.list.push(this.music)
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.audioPlayer.play()
|
||||
})
|
||||
if(this.audios.length === 1){
|
||||
let loop = document.querySelector('.aplayer-icon.aplayer-icon-loop');
|
||||
loop.style.display = 'inline'
|
||||
let order = document.querySelector('.aplayer-icon.aplayer-icon-order');
|
||||
order.style.display = 'inline'
|
||||
}
|
||||
this.audios.push(musicOperation)
|
||||
setTimeout(() => {
|
||||
this.list = this.audios
|
||||
setTimeout(() => {
|
||||
this.$refs.audioPlayer.switch(this.audios.length - 1)
|
||||
}, 0)
|
||||
}, 0)
|
||||
} else {
|
||||
let listMusic = this.audioPlayerDoc.querySelectorAll('.aplayer-list ol li')[musicIndex]
|
||||
listMusic.click()
|
||||
this.$refs.audioPlayer.switch(musicIndex)
|
||||
}
|
||||
})
|
||||
},
|
||||
@ -98,7 +100,7 @@ export default {
|
||||
this.show = false
|
||||
this.audioPlayerDoc = undefined
|
||||
this.$refs.audioPlayer.pause()
|
||||
this.list.splice(0, this.list.length)
|
||||
this.audios.splice(0, this.audios.length)
|
||||
},
|
||||
touchend() {
|
||||
const that = this
|
||||
|
||||
@ -37,10 +37,11 @@ Vue.use(EVueContextmenu)
|
||||
|
||||
Vue.use(vant.ImagePreview)
|
||||
|
||||
Vue.component('Aplayer', VueAPlayer)
|
||||
VueAPlayer.disableVersionBadge = true
|
||||
|
||||
Vue.config.productionTip = false
|
||||
import APlayer from '@moefe/vue-aplayer';
|
||||
Vue.use(APlayer, {
|
||||
defaultCover: 'https://images.unsplash.com/photo-1511671782779-c97d3d27a1d4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=200&q=60',
|
||||
productionTip: false, // 是否在控制台输出版本信息
|
||||
});
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
|
||||
@ -10,7 +10,7 @@
|
||||
}
|
||||
|
||||
>>>.svg-icon {
|
||||
margin-top: 0.05em;
|
||||
margin-top: 0.05em;
|
||||
// vertical-align: unset;
|
||||
}
|
||||
|
||||
@ -70,7 +70,6 @@
|
||||
.newFileMenu li > .menuitem > .text {
|
||||
cursor: pointer;
|
||||
font-weight: normal;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.newFileMenu li > .menuitem > .svg-icon {
|
||||
cursor: pointer;
|
||||
@ -294,6 +293,7 @@
|
||||
color: #606266;
|
||||
font-size: smaller;
|
||||
word-wrap: break-word;
|
||||
width: -webkit-fill-available;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@ -336,7 +336,7 @@
|
||||
.grid-item-icon-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
top: 0px;
|
||||
border-radius: 5px;
|
||||
margin: 0;
|
||||
-webkit-backdrop-filter: contrast(0.5);
|
||||
@ -346,21 +346,21 @@
|
||||
/deep/ .grid-time:hover {
|
||||
background-color: #e0f3fc;
|
||||
}
|
||||
.checkbox-group-header {
|
||||
.checkbox-group-header {
|
||||
margin: 10px 0 0;
|
||||
.grid-all-checkbox {
|
||||
height: 50px;
|
||||
width: fit-content;
|
||||
margin-left: 25px;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
}
|
||||
.el-divider--horizontal {
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.grid-all-checkbox {
|
||||
height: 50px;
|
||||
width: fit-content;
|
||||
margin-left: 25px;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
}
|
||||
.el-divider--horizontal {
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
/deep/ .grid-divider {
|
||||
display: block;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user