v2.7.9

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zy",
-  "version": "2.7.7",
+  "version": "2.7.9",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
@@ -19,21 +19,21 @@
   "dependencies": {
     "axios": "^0.21.1",
     "cheerio": "^1.0.0-rc.5",
-    "core-js": "^3.9.0",
+    "core-js": "^3.9.1",
     "dexie": "^3.0.3",
     "electron-localshortcut": "^3.2.1",
     "electron-proxy-agent": "^1.2.0",
-    "electron-updater": "^4.3.5",
-    "element-ui": "^2.15.0",
-    "fast-xml-parser": "^3.18.0",
+    "electron-updater": "^4.3.8",
+    "element-ui": "^2.15.1",
+    "fast-xml-parser": "^3.19.0",
     "html2canvas": "^1.0.0-rc.7",
     "iptv-playlist-parser": "^0.6.0",
     "m3u": "0.0.2",
-    "m3u8-parser": "^4.5.2",
+    "m3u8-parser": "^4.6.0",
     "memcached": "^2.2.2",
     "modern-normalize": "^1.0.0",
     "mousetrap": "^1.6.5",
-    "pinyin-match": "^1.2.0",
+    "pinyin-match": "^1.2.1",
     "qrcode.vue": "^1.7.0",
     "randomstring": "^1.1.5",
     "session": "^0.1.0",
@@ -45,8 +45,8 @@
     "vuedraggable": "^2.24.3",
     "vuex": "^3.6.2",
     "xgplayer": "2.17.13",
-    "xgplayer-flv.js": "^2.2.0",
-    "xgplayer-hls.js": "^2.4.1"
+    "xgplayer-flv.js": "^2.3.0",
+    "xgplayer-hls.js": "^2.4.2"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.11",

src/components/Film.vue

@@ -322,7 +322,6 @@ export default {
   data () {
     return {
       showFind: false,
-      showToolbar: false,
       showTableLastColumn: false,
       sites: [],
       site: {},
@@ -350,13 +349,15 @@ export default {
       r18KeyWords: ['伦理', '论理', '倫理', '福利', '激情', '理论', '写真', '情色', '美女', '街拍', '赤足', '性感', '里番', 'VIP'],
       filteredList: [],
       areas: [],
+      searchRunning: false,
+      siteSearchCount: 0,
+      infiniteHandlerCount: 0,
+      // Toolbar
+      showToolbar: false,
       selectedAreas: [],
       sortKeyword: '',
       sortKeywords: ['按片名', '按上映年份', '按更新时间'],
-      selectedYears: { start: 0, end: new Date().getFullYear() },
-      searchRunning: false,
-      siteSearchCount: 0,
-      infiniteHandlerCount: 0
+      selectedYears: { start: 0, end: new Date().getFullYear() }
     }
   },
   components: {

src/components/History.vue

@@ -1,15 +1,53 @@
 <template>
   <div class="listpage" id="history">
     <div class="listpage-header" id="history-header">
-        <el-switch v-model="setting.historyViewMode" active-text="海报" active-value="picture" inactive-text="列表" inactive-value="table" @change="updateViewMode"></el-switch>
         <el-button @click.stop="exportHistory" icon="el-icon-upload2" title="导出全部，自动添加扩展名">导出</el-button>
         <el-button @click.stop="importHistory" icon="el-icon-download" title="支持同时导入多个文件">导入</el-button>
         <el-button @click.stop="removeSelectedItems" icon="el-icon-delete-solid">{{ multipleSelection.length === 0 ? "清空" : "删除所选" }}</el-button>
+        <el-button @click.stop="updateAllEvent" icon="el-icon-refresh">检查更新</el-button>
     </div>
+   <div class="toolbar" v-show="showToolbar">
+      <el-switch v-model="onlyShowItemsHasUpdate" active-text="有更新" inactive-text="全部" @change="refreshFilteredList"></el-switch>
+      <el-select v-model="selectedAreas" size="small" multiple placeholder="地区" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in areas"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="selectedTypes" size="small" multiple placeholder="类型" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in types"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="sortKeyword" size="small" placeholder="排序" popper-class="popper" :popper-append-to-body="false" @change="refreshFilteredList">
+        <el-option
+          v-for="item in sortKeywords"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <span>
+       上映区间：
+       <el-input-number size="small" v-model="selectedYears.start" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       至
+       <el-input-number size="small" v-model="selectedYears.end" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       </span>
+    </div>
+    <el-divider class="listpage-header-divider" content-position="right">
+      <el-button type="text" size="mini" @click="toggleViewMode">视图切换</el-button>
+      <el-button type="text" size="mini" @click='() => { showToolbar = !showToolbar; if (!showToolbar) this.refreshFilteredList() }' title="收起工具栏会重置筛选排序">{{ showToolbar ? '隐藏工具栏' : '显示工具栏' }}</el-button>
+      <el-button type="text" size="mini" @click="backTop">回到顶部</el-button>
+    </el-divider>
     <div class="listpage-body" id="history-body">
       <div class="show-table" id="history-table" v-if="setting.historyViewMode === 'table'">
         <el-table size="mini" fit height="100%"
-          :data="history"
+          :data="filteredList"
           row-key="id"
           ref="historyTable"
           @select="selectionCellClick"
@@ -40,7 +78,7 @@
               </span>
             </template>
           </el-table-column>
-          <el-table-column v-if="history.some(e => e.time)"
+          <el-table-column v-if="list.some(e => e.time)"
             width="150"
             label="时间进度">
             <template slot-scope="scope">
@@ -63,7 +101,7 @@
         </el-table>
       </div>
       <div class="show-picture" id="star-picture" v-if="setting.historyViewMode === 'picture'">
-        <Waterfall ref="historyWaterfall" :list="history" :gutter="20" :width="240"
+        <Waterfall ref="historyWaterfall" :list="filteredList" :gutter="20" :width="240"
           :breakpoints="{
             1200: { //当屏幕宽度小于等于1200
               rowPerView: 4,
@@ -80,6 +118,9 @@
             <template slot="item" slot-scope="props">
               <div class="card">
                 <div class="img">
+                  <div class="update" v-if="props.data.hasUpdate">
+                    <span>有更新</span>
+                  </div>
                   <img v-if="props.data.detail && props.data.detail.pic" style="width: 100%" :src="props.data.detail.pic" alt="" @load="$refs.historyWaterfall.refresh()" @click="detailEvent(props.data)">
                   <div class="operate">
                     <div class="operate-wrap">
@@ -120,12 +161,24 @@ export default {
   name: 'history',
   data () {
     return {
-      history: [],
+      list: [],
       sites: [],
       shiftDown: false,
       selectionBegin: '',
       selectionEnd: '',
-      multipleSelection: []
+      multipleSelection: [],
+      areas: [],
+      types: [],
+      // Update
+      numNoUpdate: 0,
+      // Toolbar
+      showToolbar: false,
+      selectedAreas: [],
+      selectedTypes: [],
+      sortKeyword: '',
+      sortKeywords: ['按片名', '按上映年份', '按更新时间'],
+      selectedYears: { start: 0, end: new Date().getFullYear() },
+      onlyShowItemsHasUpdate: false
     }
   },
   components: {
@@ -171,6 +224,14 @@ export default {
       set (val) {
         this.SET_SETTING(val)
       }
+    },
+    DetailCache: {
+      get () {
+        return this.$store.getters.getDetailCache
+      },
+      set (val) {
+        this.SET_DetailCache(val)
+      }
     }
   },
   watch: {
@@ -180,19 +241,122 @@ export default {
         this.getAllsites()
         if (this.setting.historyViewMode === 'table') this.showShiftPrompt()
       }
+    },
+    list: {
+      handler (list) {
+        this.areas = [...new Set(list.map(ele => ele.detail.area))].filter(x => x)
+        this.types = [...new Set(list.map(ele => ele.detail.type))].filter(x => x)
+        this.refreshFilteredList()
+      },
+      deep: true
+    },
+    numNoUpdate () {
+      // 如果所有历史都没有更新的话
+      if (this.numNoUpdate === this.list.length) {
+        this.numNoUpdate = 0
+        this.$message.warning('未查询到任何更新')
+      }
     }
   },
   methods: {
     ...mapMutations(['SET_VIEW', 'SET_DETAIL', 'SET_VIDEO', 'SET_SHARE', 'SET_SETTING']),
+    updateAllEvent () {
+      this.numNoUpdate = 0
+      this.list.forEach(e => {
+        this.updateEvent(e)
+      })
+    },
+    async updateEvent (e) {
+      try {
+        if (!this.DetailCache[e.site + '@' + e.ids]) {
+          this.DetailCache[e.site + '@' + e.ids] = await zy.detail(e.site, e.ids)
+        }
+        const newDetail = this.DetailCache[e.site + '@' + e.ids]
+        history.get(e.id).then(res => {
+          if (!e.hasUpdate && e.detail.last !== newDetail.last) {
+            res.hasUpdate = true
+            res.detail = newDetail
+            const msg = `检查到"${e.name}"有更新。`
+            this.$message.success(msg)
+          } else {
+            this.numNoUpdate += 1
+          }
+          history.update(e.id, res)
+          this.getAllhistory()
+        })
+      } catch (err) {
+        const msg = `更新"${e.name}"失败, 请重试。`
+        this.$message.warning(msg, err)
+      }
+    },
+    toggleViewMode () {
+      this.setting.historyViewMode = this.setting.historyViewMode === 'picture' ? 'table' : 'picture'
+      if (this.setting.historyViewMode === 'table') {
+        setTimeout(() => { this.rowDrop() }, 100)
+        this.showShiftPrompt()
+      } else {
+        setTimeout(() => { if (this.$refs.historyWaterfall) this.$refs.historyWaterfall.refresh() }, 700)
+      }
+      setting.find().then(res => {
+        res.historyViewMode = this.setting.historyViewMode
+        setting.update(res)
+      })
+    },
+    backTop () {
+      if (this.setting.starViewMode === 'picture') {
+        document.getElementById('history-body').scrollTop = 0
+      } else {
+        this.$refs.historyTable.bodyWrapper.scrollTop = 0
+      }
+    },
+    refreshFilteredList () {
+      if (!this.showToolbar) {
+        this.sortKeyword = ''
+        this.selectedAreas = []
+        this.selectedSearchClassNames = []
+        this.selectedYears.start = 0
+        this.selectedYears.end = new Date().getFullYear()
+        this.filteredList = this.list
+      } else {
+        let filteredData = this.list
+        filteredData = filteredData.filter(x => (this.selectedAreas.length === 0) || this.selectedAreas.includes(x.detail.area))
+        filteredData = filteredData.filter(x => (this.selectedTypes.length === 0) || this.selectedTypes.includes(x.detail.type))
+        filteredData = filteredData.filter(res => res.detail.year >= this.selectedYears.start)
+        filteredData = filteredData.filter(res => res.detail.year <= this.selectedYears.end)
+        switch (this.sortKeyword) {
+          case '按上映年份':
+            filteredData.sort(function (a, b) {
+              return a.detail.year - b.detail.year
+            })
+            break
+          case '按片名':
+            filteredData.sort(function (a, b) {
+              return a.detail.name.localeCompare(b.detail.name, 'zh')
+            })
+            break
+          case '按更新时间':
+            filteredData.sort(function (a, b) {
+              return new Date(b.detail.last) - new Date(a.detail.last)
+            })
+            break
+          default:
+            break
+        }
+        this.filteredList = filteredData
+      }
+      if (this.onlyShowItemsHasUpdate) {
+        this.filteredList = this.filteredList.filter(x => x.hasUpdate)
+      }
+    },
     fmtMSS (s) {
       return (s - (s %= 60)) / 60 + (s > 9 ? ':' : ':0') + s
     },
     selectionCellClick (selection, row) { // 历史id与顺序刚好相反，大的反而在前面
       if (this.shiftDown && this.selectionBegin !== '' && selection.includes(row)) {
         this.selectionEnd = row.id
-        const start = this.history.findIndex(e => e.id === Math.max(this.selectionBegin, this.selectionEnd))
-        const end = this.history.findIndex(e => e.id === Math.min(this.selectionBegin, this.selectionEnd))
-        const selections = this.history.slice(start, end + 1)
+        const start = this.list.findIndex(e => e.id === Math.max(this.selectionBegin, this.selectionEnd))
+        const end = this.list.findIndex(e => e.id === Math.min(this.selectionBegin, this.selectionEnd))
+        const selections = this.list.slice(start, end + 1)
         this.$nextTick(() => {
           selections.forEach(e => this.$refs.historyTable.toggleRowSelection(e, true))
         })
@@ -209,7 +373,7 @@ export default {
       this.multipleSelection = rows
     },
     removeSelectedItems () {
-      if (!this.multipleSelection.length) this.multipleSelection = this.history
+      if (!this.multipleSelection.length) this.multipleSelection = this.list
       this.multipleSelection.forEach(e => history.remove(e.id))
       this.multipleSelection = []
       this.getAllhistory()
@@ -224,6 +388,9 @@ export default {
           name: e.name
         }
       }
+      if (e.hasUpdate) {
+        this.clearHasUpdateFlag(e)
+      }
     },
     async playEvent (e) {
       const db = await history.find({ site: e.site, ids: e.ids })
@@ -232,8 +399,19 @@ export default {
       } else {
         this.video = { key: e.site, info: { id: e.ids, name: e.name, index: 0 } }
       }
+      if (e.hasUpdate) {
+        this.clearHasUpdateFlag(e)
+      }
       this.view = 'Play'
     },
+    async clearHasUpdateFlag (e) {
+      const db = await history.find({ id: e.id })
+      if (db) {
+        db.hasUpdate = false
+        history.update(e.id, db)
+        this.getAllhistory()
+      }
+    },
     shareEvent (e) {
       this.share = {
         show: true,
@@ -251,7 +429,7 @@ export default {
     },
     exportHistory () {
       this.getAllhistory()
-      const arr = [...this.history]
+      const arr = [...this.list]
       const str = JSON.stringify(arr, null, 2)
       const options = {
         filters: [
@@ -296,7 +474,7 @@ export default {
     },
     getAllhistory () {
       history.all().then(res => {
-        this.history = res.reverse()
+        this.list = res.reverse()
       })
     },
     getAllsites () {
@@ -320,24 +498,13 @@ export default {
     updateDatabase () {
       history.clear().then(res => {
         let id = length
-        this.history.forEach(ele => {
+        this.list.forEach(ele => {
           ele.id = id
           id -= 1
           history.add(ele)
         })
       })
     },
-    updateViewMode () {
-      if (this.setting.historyViewMode === 'table') {
-        this.showShiftPrompt()
-      } else {
-        setTimeout(() => { if (this.$refs.historyWaterfall) this.$refs.historyWaterfall.refresh() }, 700)
-      }
-      setting.find().then(res => {
-        res.historyViewMode = this.setting.historyViewMode
-        setting.update(res)
-      })
-    },
     showShiftPrompt () {
       if (this.setting.shiftTooltipLimitTimes === undefined) this.setting.shiftTooltipLimitTimes = 5
       if (this.setting.shiftTooltipLimitTimes) {

src/components/Recommendation.vue

@@ -1,39 +1,51 @@
 <template>
   <div class="listpage" id="recommendations">
     <div class="listpage-header" id="recommendations-header">
-        <el-switch v-model="setting.recommendationViewMode" active-text="海报" active-value="picture" inactive-text="列表" inactive-value="table" @change="updateViewMode"></el-switch>
         <el-button type="text">视频数：{{ recommendations.length }}</el-button>
-        <el-select v-model="selectedAreas" size="small" multiple placeholder="地区" popper-class="popper" :popper-append-to-body="false">
-          <el-option
-            v-for="item in areas"
-            :key="item"
-            :label="item"
-            :value="item">
-          </el-option>
-        </el-select>
-        <el-select v-model="selectedTypes" size="small" multiple placeholder="类型" popper-class="popper" :popper-append-to-body="false">
-          <el-option
-            v-for="item in types"
-            :key="item"
-            :label="item"
-            :value="item">
-          </el-option>
-        </el-select>
-        <el-select v-model="sortKeyword" size="small" placeholder="排序" popper-class="popper" :popper-append-to-body="false">
-          <el-option
-            v-for="item in sortKeywords"
-            :key="item"
-            :label="item"
-            :value="item">
-          </el-option>
-        </el-select>
         <el-button :loading="loading" @click.stop="updateEvent" icon="el-icon-refresh">更新推荐</el-button>
     </div>
+    <div class="toolbar" v-show="showToolbar">
+      <el-select v-model="selectedAreas" size="small" multiple placeholder="地区" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in areas"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="selectedTypes" size="small" multiple placeholder="类型" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in types"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="sortKeyword" size="small" placeholder="排序" popper-class="popper" :popper-append-to-body="false" @change="refreshFilteredList">
+        <el-option
+          v-for="item in sortKeywords"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <span>
+       上映区间：
+       <el-input-number size="small" v-model="selectedYears.start" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       至
+       <el-input-number size="small" v-model="selectedYears.end" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       </span>
+    </div>
+    <el-divider class="listpage-header-divider" content-position="right">
+      <el-button type="text" size="mini" @click="toggleViewMode">视图切换</el-button>
+      <el-button type="text" size="mini" @click='() => { showToolbar = !showToolbar; if (!showToolbar) this.refreshFilteredList() }' title="收起工具栏会重置筛选排序">{{ showToolbar ? '隐藏工具栏' : '显示工具栏' }}</el-button>
+      <el-button type="text" size="mini" @click="backTop">回到顶部</el-button>
+    </el-divider>
     <div class="listpage-body" id="recommendations-body" >
       <div class="show-table" id="star-table" v-if="setting.recommendationViewMode === 'table'">
         <el-table size="mini" fit height="100%" row-key="id"
         ref="recommendationsTable"
-        :data="filteredRecommendations"
+        :data="filteredList"
         @row-click="detailEvent">
           <el-table-column
             prop="name"
@@ -55,13 +67,13 @@
             width="100"
             align="center">
           </el-table-column>
-          <el-table-column v-if="filteredRecommendations.some(e => e.rate)"
+          <el-table-column v-if="filteredList.some(e => e.rate)"
             prop="rate"
             align="center"
             width="100"
             label="豆瓣评分">
           </el-table-column>
-          <el-table-column v-if="filteredRecommendations.some(e => e.detail.note)"
+          <el-table-column v-if="filteredList.some(e => e.detail.note)"
             prop="detail.note"
             label="备注">
           </el-table-column>
@@ -80,7 +92,7 @@
         </el-table>
       </div>
       <div class="show-picture" id="star-picture" v-if="setting.recommendationViewMode === 'picture'">
-        <Waterfall ref="recommendationsWaterfall" :list="filteredRecommendations" :gutter="20" :width="240"
+        <Waterfall ref="recommendationsWaterfall" :list="filteredList" :gutter="20" :width="240"
           :breakpoints="{
             1200: { //当屏幕宽度小于等于1200
               rowPerView: 4,
@@ -138,11 +150,15 @@ export default {
       sites: [],
       loading: false,
       types: [],
-      selectedTypes: [],
       areas: [],
+      filteredList: [],
+      // Toolbar
+      showToolbar: false,
       selectedAreas: [],
+      selectedTypes: [],
       sortKeyword: '',
-      sortKeywords: ['上映', '评分', '默认']
+      sortKeywords: ['按片名', '按上映年份', '按更新时间'],
+      selectedYears: { start: 0, end: new Date().getFullYear() }
     }
   },
   components: {
@@ -188,11 +204,6 @@ export default {
       set (val) {
         this.SET_SETTING(val)
       }
-    },
-    filteredRecommendations () {
-      let filteredData = this.recommendations.filter(x => (this.selectedAreas.length === 0) || this.selectedAreas.includes(x.detail.area))
-      filteredData = filteredData.filter(x => (this.selectedTypes.length === 0) || this.selectedTypes.includes(x.detail.type))
-      return filteredData
     }
   },
   watch: {
@@ -201,30 +212,72 @@ export default {
         if (this.$refs.recommendationsWaterfall) this.$refs.recommendationsWaterfall.resize()
       }
     },
-    sortKeyword () {
-      switch (this.sortKeyword) {
-        case '上映':
-          this.recommendations = this.recommendations.sort(function (a, b) {
-            return b.detail.year - a.detail.year
-          })
-          break
-        case '评分':
-          this.recommendations.sort(function (a, b) {
-            return b.rate - a.rate
-          })
-          break
-        case '默认':
-          this.recommendations.sort(function (a, b) {
-            return b.id - a.id
-          })
-          break
-        default:
-          break
-      }
+    recommendations: {
+      handler (recommendations) {
+        this.areas = [...new Set(recommendations.map(ele => ele.detail.area))].filter(x => x)
+        this.types = [...new Set(recommendations.map(ele => ele.detail.type))].filter(x => x)
+        this.refreshFilteredList()
+      },
+      deep: true
     }
   },
   methods: {
     ...mapMutations(['SET_VIEW', 'SET_DETAIL', 'SET_VIDEO', 'SET_SHARE', 'SET_SETTING']),
+    toggleViewMode () {
+      this.setting.recommendationViewMode = this.setting.recommendationViewMode === 'picture' ? 'table' : 'picture'
+      if (this.setting.recommendationViewMode === 'table') {
+        setTimeout(() => { this.rowDrop() }, 100)
+      } else {
+        setTimeout(() => { if (this.$refs.recommendationsWaterfall) this.$refs.recommendationsWaterfall.refresh() }, 700)
+      }
+      setting.find().then(res => {
+        res.recommendationViewMode = this.setting.recommendationViewMode
+        setting.update(res)
+      })
+    },
+    backTop () {
+      if (this.setting.recommendationViewMode === 'picture') {
+        document.getElementById('recommendations-body').scrollTop = 0
+      } else {
+        this.$refs.recommendationsTable.bodyWrapper.scrollTop = 0
+      }
+    },
+    refreshFilteredList () {
+      if (!this.showToolbar) {
+        this.sortKeyword = ''
+        this.selectedAreas = []
+        this.selectedSearchClassNames = []
+        this.selectedYears.start = 0
+        this.selectedYears.end = new Date().getFullYear()
+        this.filteredList = this.recommendations
+      } else {
+        let filteredData = this.recommendations
+        filteredData = filteredData.filter(x => (this.selectedAreas.length === 0) || this.selectedAreas.includes(x.detail.area))
+        filteredData = filteredData.filter(x => (this.selectedTypes.length === 0) || this.selectedTypes.includes(x.detail.type))
+        filteredData = filteredData.filter(res => res.detail.year >= this.selectedYears.start)
+        filteredData = filteredData.filter(res => res.detail.year <= this.selectedYears.end)
+        switch (this.sortKeyword) {
+          case '按上映年份':
+            filteredData.sort(function (a, b) {
+              return a.detail.year - b.detail.year
+            })
+            break
+          case '按片名':
+            filteredData.sort(function (a, b) {
+              return a.detail.name.localeCompare(b.detail.name, 'zh')
+            })
+            break
+          case '按更新时间':
+            filteredData.sort(function (a, b) {
+              return new Date(b.detail.last) - new Date(a.detail.last)
+            })
+            break
+          default:
+            break
+        }
+        this.filteredList = filteredData
+      }
+    },
     detailEvent (e) {
       this.detail = {
         show: true,

src/components/Setting.vue

@@ -384,7 +384,7 @@ export default {
     },
     async configDefaultParseURL () {
       if (!this.setting.defaultParseURL) await this.get7kParseURL()
-      this.d.defaultParseURL = this.setting.defaultParseURL.trim()
+      this.d.defaultParseURL = this.setting.defaultParseURL?.trim()
       this.show.configDefaultParseUrlDialog = false
       this.updateSettingEvent()
     },

src/components/Star.vue

@@ -1,17 +1,54 @@
 <template>
   <div class="listpage" id="star">
     <div class="listpage-header" id="star-header">
-        <el-switch v-model="setting.starViewMode" active-text="海报" active-value="picture" inactive-text="列表" inactive-value="table" @change="updateViewMode"></el-switch>
         <el-button @click.stop="exportFavoritesEvent" icon="el-icon-upload2" title="导出全部，自动添加扩展名">导出</el-button>
         <el-button @click.stop="importFavoritesEvent" icon="el-icon-download" title="支持同时导入多个文件">导入</el-button>
         <el-button @click.stop="removeSelectedItems" icon="el-icon-delete-solid">{{ multipleSelection.length === 0 ? "清空" : "删除所选" }}</el-button>
-        <el-button @click.stop="updateAllEvent" icon="el-icon-refresh">同步所有收藏</el-button>
+        <el-button @click.stop="updateAllEvent" icon="el-icon-refresh">检查更新</el-button>
     </div>
+    <div class="toolbar" v-show="showToolbar">
+      <el-switch v-model="onlyShowItemsHasUpdate" active-text="有更新" inactive-text="全部" @change="refreshFilteredList"></el-switch>
+      <el-select v-model="selectedAreas" size="small" multiple placeholder="地区" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in areas"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="selectedTypes" size="small" multiple placeholder="类型" popper-class="popper" :popper-append-to-body="false" @remove-tag="refreshFilteredList" @change="refreshFilteredList">
+        <el-option
+          v-for="item in types"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <el-select v-model="sortKeyword" size="small" placeholder="排序" popper-class="popper" :popper-append-to-body="false" @change="refreshFilteredList">
+        <el-option
+          v-for="item in sortKeywords"
+          :key="item"
+          :label="item"
+          :value="item">
+        </el-option>
+      </el-select>
+      <span>
+       上映区间：
+       <el-input-number size="small" v-model="selectedYears.start" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       至
+       <el-input-number size="small" v-model="selectedYears.end" :min=0 :max="new Date().getFullYear()" controls-position="right" step-strictly @change="refreshFilteredList"></el-input-number>
+       </span>
+    </div>
+    <el-divider class="listpage-header-divider" content-position="right">
+      <el-button type="text" size="mini" @click="toggleViewMode">视图切换</el-button>
+      <el-button type="text" size="mini" @click='() => { showToolbar = !showToolbar; if (!showToolbar) this.refreshFilteredList() }' title="收起工具栏会重置筛选排序">{{ showToolbar ? '隐藏工具栏' : '显示工具栏' }}</el-button>
+      <el-button type="text" size="mini" @click="backTop">回到顶部</el-button>
+    </el-divider>
     <div class="listpage-body" id="star-body">
       <div class="show-table" id="star-table"  v-if="setting.starViewMode === 'table'">
         <el-table size="mini" fit height="100%" row-key="id"
           ref="starTable"
-          :data="list"
+          :data="filteredList"
           :cell-class-name="checkUpdate"
           @row-click="detailEvent"
           @sort-change="handleSortChange"
@@ -84,7 +121,7 @@
         </el-table>
       </div>
       <div class="show-picture" id="star-picture" v-if="setting.starViewMode === 'picture'">
-        <Waterfall ref="starWaterfall" :list="list" :gutter="20" :width="240"
+        <Waterfall ref="starWaterfall" :list="filteredList" :gutter="20" :width="240"
           :breakpoints="{
             1200: { //当屏幕宽度小于等于1200
               rowPerView: 4,
@@ -155,7 +192,18 @@ export default {
       shiftDown: false,
       selectionBegin: '',
       selectionEnd: '',
-      multipleSelection: []
+      multipleSelection: [],
+      filteredList: [],
+      areas: [],
+      types: [],
+      // Toolbar
+      showToolbar: false,
+      selectedAreas: [],
+      selectedTypes: [],
+      sortKeyword: '',
+      sortKeywords: ['按片名', '按上映年份', '按更新时间'],
+      selectedYears: { start: 0, end: new Date().getFullYear() },
+      onlyShowItemsHasUpdate: false
     }
   },
   components: {
@@ -225,10 +273,77 @@ export default {
         this.numNoUpdate = 0
         this.$message.warning('未查询到任何更新')
       }
+    },
+    list: {
+      handler (list) {
+        this.areas = [...new Set(list.map(ele => ele.detail.area))].filter(x => x)
+        this.types = [...new Set(list.map(ele => ele.detail.type))].filter(x => x)
+        this.refreshFilteredList()
+      },
+      deep: true
     }
   },
   methods: {
     ...mapMutations(['SET_VIEW', 'SET_DETAIL', 'SET_VIDEO', 'SET_SHARE', 'SET_SETTING']),
+    toggleViewMode () {
+      this.setting.starViewMode = this.setting.starViewMode === 'picture' ? 'table' : 'picture'
+      if (this.setting.starViewMode === 'table') {
+        setTimeout(() => { this.rowDrop() }, 100)
+        this.showShiftPrompt()
+      } else {
+        setTimeout(() => { if (this.$refs.starWaterfall) this.$refs.starWaterfall.refresh() }, 700)
+      }
+      setting.find().then(res => {
+        res.starViewMode = this.setting.starViewMode
+        setting.update(res)
+      })
+    },
+    backTop () {
+      if (this.setting.starViewMode === 'picture') {
+        document.getElementById('star-body').scrollTop = 0
+      } else {
+        this.$refs.starTable.bodyWrapper.scrollTop = 0
+      }
+    },
+    refreshFilteredList () {
+      if (!this.showToolbar) {
+        this.sortKeyword = ''
+        this.selectedAreas = []
+        this.selectedSearchClassNames = []
+        this.selectedYears.start = 0
+        this.selectedYears.end = new Date().getFullYear()
+        this.filteredList = this.list
+      } else {
+        let filteredData = this.list
+        filteredData = filteredData.filter(x => (this.selectedAreas.length === 0) || this.selectedAreas.includes(x.detail.area))
+        filteredData = filteredData.filter(x => (this.selectedTypes.length === 0) || this.selectedTypes.includes(x.detail.type))
+        filteredData = filteredData.filter(res => res.detail.year >= this.selectedYears.start)
+        filteredData = filteredData.filter(res => res.detail.year <= this.selectedYears.end)
+        switch (this.sortKeyword) {
+          case '按上映年份':
+            filteredData.sort(function (a, b) {
+              return a.detail.year - b.detail.year
+            })
+            break
+          case '按片名':
+            filteredData.sort(function (a, b) {
+              return a.detail.name.localeCompare(b.detail.name, 'zh')
+            })
+            break
+          case '按更新时间':
+            filteredData.sort(function (a, b) {
+              return new Date(b.detail.last) - new Date(a.detail.last)
+            })
+            break
+          default:
+            break
+        }
+        this.filteredList = filteredData
+      }
+      if (this.onlyShowItemsHasUpdate) {
+        this.filteredList = this.filteredList.filter(x => x.hasUpdate)
+      }
+    },
     handleSortChange (column, prop, order) {
       this.updateDatabase()
     },
@@ -331,7 +446,7 @@ export default {
         star.get(e.id).then(resStar => {
           if (!e.hasUpdate && e.detail.last !== doc.detail.last) {
             doc.hasUpdate = true
-            const msg = `同步"${e.name}"成功, 检查到更新。`
+            const msg = `检查到"${e.name}"有更新。`
             this.$message.success(msg)
           } else {
             this.numNoUpdate += 1
@@ -340,7 +455,7 @@ export default {
           this.getFavorites()
         })
       } catch (err) {
-        const msg = `同步"${e.name}"失败, 请重试。`
+        const msg = `更新"${e.name}"失败, 请重试。`
         this.$message.warning(msg, err)
       }
     },
@@ -488,18 +603,6 @@ export default {
         }
       })
     },
-    updateViewMode () {
-      if (this.setting.starViewMode === 'table') {
-        setTimeout(() => { this.rowDrop() }, 100)
-        this.showShiftPrompt()
-      } else {
-        setTimeout(() => { if (this.$refs.starWaterfall) this.$refs.starWaterfall.refresh() }, 700)
-      }
-      setting.find().then(res => {
-        res.starViewMode = this.setting.starViewMode
-        setting.update(res)
-      })
-    },
     showShiftPrompt () {
       if (this.setting.shiftTooltipLimitTimes === undefined) this.setting.shiftTooltipLimitTimes = 5
       if (this.setting.shiftTooltipLimitTimes) {

src/lib/dexie/dexie.js

@@ -59,6 +59,10 @@ db.version(8).stores({
   })
 })
 
+db.version(9).stores({
+  history: '++id, [site+ids], name, type, year, index, time, duration, detail, onlinePlay, hasUpdate'
+})
+
 db.on('populate', () => {
   db.setting.bulkAdd(setting)
   db.sites.bulkAdd(sites)

src/lib/dexie/history.js

@@ -19,6 +19,9 @@ export default {
   async remove (id) {
     return await history.delete(id)
   },
+  async get (id) {
+    return await history.get(id)
+  },
   async clear () {
     return await history.clear()
   }