IPTV拖曳功能

src/components/IPTV.vue

@@ -40,6 +40,7 @@ import { iptv, iptvSearch } from '../lib/dexie'
 import { iptv as defaultSites } from '../lib/dexie/initData'
 import { remote } from 'electron'
 import fs from 'fs'
+import Sortable from 'sortablejs'
 export default {
   name: 'iptv',
   data () {
@@ -228,44 +229,25 @@ export default {
         ele.id = id
         id += 1
       })
+    },
+    rowDrop () {
+      const tbody = document.getElementById('iptv-table').querySelector('.el-table__body-wrapper tbody')
+      const _this = this
+      Sortable.create(tbody, {
+        onEnd ({ newIndex, oldIndex }) {
+          const currRow = _this.iptvList.splice(oldIndex, 1)[0]
+          _this.iptvList.splice(newIndex, 0, currRow)
+          _this.updateDatabase(_this.iptvList)
+        }
+      })
     }
   },
+  mounted () {
+    this.rowDrop()
+  },
   created () {
     this.getSites()
     this.getSearchList()
   }
 }
 </script>
-<style lang="scss" scoped>
-.detail{
-  position: absolute;
-  left: 80px;
-  right: 20px;
-  bottom: 0;
-  width: calc(100% - 100px);
-  height: calc(100% - 40px);
-  z-index: 888;
-  .detail-content{
-    height: calc(100% - 10px);
-    padding: 0 60px;
-    position: relative;
-    .detail-header{
-      width: 100%;
-      height: 40px;
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      .detail-title{
-        font-size: 16px;
-      }
-      .detail-close{
-        cursor: pointer;
-      }
-    }
-  }
-  .detail-body{
-    height: calc(100% - 100px);
-    overflow-y: auto;
-  }
-}
-</style>

src/components/Star.vue

@@ -7,7 +7,7 @@
         <el-button @click.stop="clearFavoritesEvent" type="text">清空</el-button>
         <el-button @click.stop="updateAllEvent" type="text">同步所有收藏</el-button>
       </div>
-      <div class="listpage-body" id="list-table">
+      <div class="listpage-body" id="star-table">
         <el-table
               :data="list"
               height="100%"
@@ -371,7 +371,7 @@ export default {
       })
     },
     rowDrop () {
-      const tbody = document.getElementById('list-table').querySelector('.el-table__body-wrapper tbody')
+      const tbody = document.getElementById('star-table').querySelector('.el-table__body-wrapper tbody')
       const _this = this
       Sortable.create(tbody, {
         onEnd ({ newIndex, oldIndex }) {