backup/ZY-Player
1
0
Fork 0
mirror of https://github.com/cuiocean/ZY-Player.git synced 2026-02-12 23:15:00 +08:00
Code Issues Projects Releases Wiki Activity

支持收藏列表的拖曳排序

Browse Source
This commit is contained in:
haiyangcui
2020-09-07 20:48:33 +02:00
parent b7e497e2d9
commit 595136c799
2 changed files with 49 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -34,6 +34,7 @@
"vue": "^2.6.11",
"vue-infinite-loading": "^2.4.5",
"vue-waterfall-plugin": "^1.0.7",
"vuedraggable": "^2.24.1",
"vuex": "^3.4.0",
"xgplayer": "^2.9.10",
"xgplayer-hls.js": "^2.2.3"

62
src/components/Star.vue
View File

@@ -21,20 +21,24 @@
<span class="btn"></span>
</span>
</li>
<li v-for="(i, j) in list" :key="j" @click="detailEvent(i)" :class="[i.hasUpdate ? 'zy-highlighted': '']">
<span class="name">{{i.name}}</span>
<span class="type">{{i.type}}</span>
<span class="time">{{i.year}}</span>
<span class="site">{{getSiteName(i.key)}}</span>
<span class="note">{{i.note}}</span>
<span class="operate">
<span class="btn" @click.stop="playEvent(i)">播放</span>
<span class="btn" @click.stop="shareEvent(i)">分享</span>
<span class="btn" @click.stop="updateEvent(i)">同步</span>
<span class="btn" @click.stop="downloadEvent(i)">下载</span>
<span class="btn" @click.stop="deleteEvent(i)">删除</span>
</span>
</li>
<draggable v-model="list" @change="listUpdatedEvent">
<transition-group>
<li v-for="(i, j) in list" :key="j" @click="detailEvent(i)" :class="[i.hasUpdate ? 'zy-highlighted': '']">
<span class="name">{{i.name}}</span>
<span class="type">{{i.type}}</span>
<span class="time">{{i.year}}</span>
<span class="site">{{getSiteName(i.key)}}</span>
<span class="note">{{i.note}}</span>
<span class="operate">
<span class="btn" @click.stop="playEvent(i)">播放</span>
<span class="btn" @click.stop="shareEvent(i)">分享</span>
<span class="btn" @click.stop="updateEvent(i)">同步</span>
<span class="btn" @click.stop="downloadEvent(i)">下载</span>
<span class="btn" @click.stop="deleteEvent(i)">删除</span>
</span>
</li>
</transition-group>
</draggable>
</ul>
</div>
</div>
@@ -45,6 +49,8 @@
import { mapMutations } from 'vuex'
import { star, history, sites } from '../lib/dexie'
import zy from '../lib/site/tools'
import draggable from 'vuedraggable'
const { clipboard } = require('electron')
export default {
name: 'star',
@@ -54,6 +60,9 @@ export default {
sites: []
}
},
components: {
draggable
},
computed: {
view: {
get () {
@@ -87,6 +96,19 @@ export default {
this.SET_SHARE(val)
}
}
// draggableList: {
// get () {
// return this.list
// },
// set (value) {
// star.clear().then(res1 => {
// star.bulkAdd(value).then(res2 => {
// this.$message.success('排序成功')
// this.list = value
// })
// })
// }
// }
},
watch: {
view () {
@@ -146,6 +168,17 @@ export default {
this.getStarList()
})
},
listUpdatedEvent () {
star.clear().then(res1 => {
// 重新排序
var id = this.list.length
this.list.forEach(element => {
element.id = id
star.add(element)
id -= 1
})
})
},
updateEvent (e) {
zy.detail(e.key, e.ids).then(res => {
var doc = {
@@ -243,6 +276,7 @@ export default {
},
created () {
this.getStarList()
window.Sortable = require('sortablejs').Sortable
}
}
</script>