新增单个列表导入/导出功能

postcss.config.js

@@ -15,7 +15,7 @@ module.exports = {
         '*-height', '*-width',
         'flex', '::-webkit-scrollbar',
         'top', 'left', 'bottom', 'right',
-        'border-radius',
+        'border-radius', 'gap',
       ],
       selectorBlackList: ['html', 'ignore-to-rem'],
       replace: true,

publish/changeLog.md

@@ -1,6 +1,7 @@
 ### 新增
 
 - 新增歌词简体中文转繁体中文，当软件语言被设置为繁体中文后，播放歌曲的歌词也将自动转成繁体中文显示
+- 为方便分享歌曲列表，新增单个列表导入/导出功能，可在右击“我的列表”里的列表名后弹出的菜单中使用
 
 ### 修复
 

src/renderer/components/material/Modal.vue

@@ -3,7 +3,9 @@ transition(enter-active-class="animated fadeIn"
       leave-active-class="animated fadeOut")
   div(:class="$style.modal" v-show="show" @click="bgClose && close()")
     transition(:enter-active-class="inClass"
-      :leave-active-class="outClass")
+      :leave-active-class="outClass"
+      @after-leave="$emit('after-leave', $event)"
+    )
       div(:class="$style.content" v-show="show" @click.stop)
         header(:class="$style.header")
           button(type="button" @click="close" v-if="closeBtn")
@@ -141,6 +143,7 @@ export default {
   overflow: hidden;
   max-height: 80%;
   max-width: 76%;
+  min-width: 220px;
   position: relative;
   display: flex;
   flex-flow: column nowrap;

src/renderer/lang/en-us/base.json

@@ -1,5 +1,7 @@
 {
-  "date_format_second": "{num} seconds ago",
+  "cancel_button_text": "Cancel",
+  "confirm_button_text": "OK",
+  "date_format_hour": "{num} hours ago",
   "date_format_minute": "{num} minutes ago",
-  "date_format_hour": "{num} hours ago"
+  "date_format_second": "{num} seconds ago"
 }

src/renderer/lang/en-us/view/list.json

@@ -1,28 +1,35 @@
 {
-  "lists_new_list_btn": "Create list",
-  "lists_new_list_input": "New list...",
-  "lists_rename": "Rename",
-  "lists_moveup": "Move Up",
-  "lists_movedown": "Move Down",
-  "lists_sync": "Update",
-  "lists_remove": "Remove",
-  "list_play": "Play",
-  "list_play_later": "Play later",
-  "list_copy_name": "Copy name",
+  "action": "Manage",
+  "album": "Album",
+  "default_list": "Recently Played",
   "list_add_to": "Add to ...",
-  "list_move_to": "Move to ...",
-  "list_sort": "Adjust position",
+  "list_copy_name": "Copy name",
   "list_download": "Download",
-  "list_search": "Search",
+  "list_move_to": "Move to ...",
+  "list_play": "Play",
+  "list_play_later": "Play later",
   "list_remove": "Remove",
+  "list_search": "Search",
+  "list_sort": "Adjust position",
   "list_source_detail": "Song Page",
-  "default_list": "Recently Played",
+  "lists_export": "Export",
+  "lists_export_part_desc": "Choose where to save the list file",
+  "lists_import": "Import",
+  "lists_import_part_button_cancel": "No",
+  "lists_import_part_button_confirm": "Overwrite",
+  "lists_import_part_confirm": "The imported list ({importName}) has the same ID as the local list ({localName}). Do you overwrite the local list?",
+  "lists_import_part_desc": "Select list file",
+  "lists_movedown": "Move Down",
+  "lists_moveup": "Move Up",
+  "lists_new_list_btn": "Create list",
+  "lists_new_list_input": "New list...",
+  "lists_remove": "Remove",
+  "lists_rename": "Rename",
+  "lists_sync": "Update",
+  "loding_list": "Loading...",
   "love_list": "Favorites",
   "name": "Name",
+  "no_item": "Nothing's here...",
   "singer": "Artist",
-  "album": "Album",
-  "action": "Manage",
-  "time": "Length",
-  "loding_list": "Loading...",
-  "no_item": "Nothing's here..."
+  "time": "Length"
 }

src/renderer/lang/zh-cn/base.json

@@ -1,5 +1,7 @@
 {
-  "date_format_second": "{num}秒前",
+  "cancel_button_text": "我不",
+  "confirm_button_text": "好的",
+  "date_format_hour": "{num}小时前",
   "date_format_minute": "{num}分钟前",
-  "date_format_hour": "{num}小时前"
+  "date_format_second": "{num}秒前"
 }

src/renderer/lang/zh-cn/view/list.json

@@ -1,28 +1,35 @@
 {
+  "action": "操作",
+  "album": "专辑",
+  "default_list": "试听列表",
+  "list_add_to": "添加到...",
+  "list_copy_name": "复制歌曲名",
+  "list_download": "下载",
+  "list_move_to": "移动到...",
+  "list_play": "播放",
+  "list_play_later": "稍后播放",
+  "list_remove": "删除",
+  "list_search": "搜索",
+  "list_sort": "调整位置",
+  "list_source_detail": "歌曲详情页",
+  "lists_export": "导出",
+  "lists_export_part_desc": "选择列表文件保存位置",
+  "lists_import": "导入",
+  "lists_import_part_button_cancel": "不要啊",
+  "lists_import_part_button_confirm": "覆盖掉",
+  "lists_import_part_confirm": "导入的列表（{importName}）与本地列表（{localName}）的ID相同，是否覆盖本地列表？",
+  "lists_import_part_desc": "选择列表文件",
+  "lists_movedown": "下移",
+  "lists_moveup": "上移",
   "lists_new_list_btn": "新建列表",
   "lists_new_list_input": "新列表...",
+  "lists_remove": "删除",
   "lists_rename": "重命名",
-  "lists_moveup": "上移",
-  "lists_movedown": "下移",
   "lists_sync": "更新",
-  "lists_remove": "删除",
-  "list_play": "播放",
-  "list_play_later": "稍后播放",
-  "list_copy_name": "复制歌曲名",
-  "list_source_detail": "歌曲详情页",
-  "list_add_to": "添加到...",
-  "list_move_to": "移动到...",
-  "list_sort": "调整位置",
-  "list_download": "下载",
-  "list_search": "搜索",
-  "list_remove": "删除",
-  "default_list": "试听列表",
+  "loding_list": "加载中...",
   "love_list": "收藏",
   "name": "歌曲名",
+  "no_item": "列表竟然是空的...",
   "singer": "歌手",
-  "album": "专辑",
-  "action": "操作",
-  "time": "时长",
-  "loding_list": "加载中...",
-  "no_item": "列表竟然是空的..."
+  "time": "时长"
 }

src/renderer/lang/zh-tw/base.json

@@ -1,5 +1,7 @@
 {
-  "date_format_second": "{num}秒前",
+  "cancel_button_text": "取消",
+  "confirm_button_text": "好的",
+  "date_format_hour": "{num}小時前",
   "date_format_minute": "{num}分鐘前",
-  "date_format_hour": "{num}小時前"
+  "date_format_second": "{num}秒前"
 }

src/renderer/lang/zh-tw/view/list.json

@@ -1,28 +1,35 @@
 {
-  "lists_new_list_btn": "新建列表",
-  "lists_new_list_input": "新列表...",
-  "lists_rename": "重命名",
-  "lists_moveup": "上移",
-  "lists_movedown": "下移",
-  "lists_sync": "更新",
-  "lists_remove": "刪除",
-  "list_play": "播放",
-  "list_play_later": "稍後播放",
-  "list_copy_name": "複製歌曲名",
+  "action": "操作",
+  "album": "專輯",
+  "default_list": "試聽列表",
   "list_add_to": "添加到...",
-  "list_move_to": "移動到...",
-  "list_sort": "調整位置",
+  "list_copy_name": "複製歌曲名",
   "list_download": "下載",
-  "list_search": "搜索",
+  "list_move_to": "移動到...",
+  "list_play": "播放",
+  "list_play_later": "稍後播放",
   "list_remove": "刪除",
+  "list_search": "搜索",
+  "list_sort": "調整位置",
   "list_source_detail": "歌曲詳情頁",
-  "default_list": "試聽列表",
+  "lists_export": "導出",
+  "lists_export_part_desc": "選擇列表文件保存位置",
+  "lists_import": "導入",
+  "lists_import_part_button_cancel": "不要啊",
+  "lists_import_part_button_confirm": "覆蓋掉",
+  "lists_import_part_confirm": "導入的列表（{importName}）與本地列表（{localName}）的ID相同，是否覆蓋本地列表？",
+  "lists_import_part_desc": "選擇列表文件",
+  "lists_movedown": "下移",
+  "lists_moveup": "上移",
+  "lists_new_list_btn": "新建列表",
+  "lists_new_list_input": "新列表...",
+  "lists_remove": "刪除",
+  "lists_rename": "重命名",
+  "lists_sync": "更新",
+  "loding_list": "加載中...",
   "love_list": "收藏列表",
   "name": "歌曲名",
+  "no_item": "列表竟然是空的...",
   "singer": "歌手",
-  "album": "專輯",
-  "action": "操作",
-  "time": "時長",
-  "loding_list": "加載中...",
-  "no_item": "列表竟然是空的..."
+  "time": "時長"
 }

src/renderer/plugins/Dialog/Dialog.vue

@@ -0,0 +1,73 @@
+<template>
+  <Modal :show="visible" @close="handleCancel" @after-leave="afterLeave" :closeBtn="false">
+    <main :class="$style.main">{{message}}</main>
+    <footer :class="$style.footer">
+      <Btn :class="$style.btn" v-if="showCancel" @click="handleCancel">{{cancelBtnText}}</Btn>
+      <Btn :class="$style.btn" @click="handleComfirm">{{confirmBtnText}}</Btn>
+    </footer>
+  </Modal>
+</template>
+
+<script>
+import Modal from '@renderer/components/material/Modal'
+import Btn from '@renderer/components/material/Btn'
+export default {
+  components: {
+    Modal,
+    Btn,
+  },
+  data() {
+    return {
+      visible: false,
+      message: '',
+      showCancel: false,
+      cancelButtonText: '',
+      confirmButtonText: '',
+    }
+  },
+  computed: {
+    cancelBtnText() {
+      return this.cancelButtonText || this.$t('base.cancel_button_text')
+    },
+    confirmBtnText() {
+      return this.confirmButtonText || this.$t('base.confirm_button_text')
+    },
+  },
+  beforeDestroy() {
+    const el = this.$el
+    el.parentNode.removeChild(el)
+  },
+  methods: {
+    afterLeave(el, done) {
+      this.$destroy()
+    },
+    handleCancel() {
+
+    },
+    handleComfirm() {
+
+    },
+  },
+}
+</script>
+
+<style lang="less" module>
+
+.main {
+  flex: auto;
+  min-height: 50px;
+  padding: 15px;
+  font-size: 14px;
+  max-width: 320px;
+  line-height: 1.5;
+}
+
+.footer {
+  flex: none;
+  padding: 0 15px 15px;
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-end;
+  gap: 15px;
+}
+</style>

src/renderer/plugins/Dialog/index.js

@@ -0,0 +1,50 @@
+import Dialog from './Dialog'
+import i18n from '../i18n'
+import store from '@renderer/store'
+import Vue from 'vue'
+
+const defaultOptions = {
+  message: '',
+  showCancel: false,
+  cancelButtonText: '',
+  confirmButtonText: '',
+}
+
+const dialog = {
+  install(Vue, options) {
+    const DialogConstructor = Vue.extend(Dialog)
+
+    const dialog = function Dialog(options) {
+      const { message, showCancel, cancelButtonText, confirmButtonText } =
+        Object.assign({}, defaultOptions, typeof options == 'string' ? { message: options } : options || {})
+      return new Promise((resolve, reject) => {
+        let instance = new DialogConstructor({ i18n, store }).$mount(document.createElement('div'))
+
+        // 属性设置
+        instance.visible = true
+        instance.message = message
+        instance.showCancel = showCancel
+        instance.cancelButtonText = cancelButtonText
+        instance.confirmButtonText = confirmButtonText
+
+        // 挂载
+        document.getElementById('container').appendChild(instance.$el)
+
+        instance.handleCancel = () => {
+          instance.visible = false
+          resolve(false)
+        }
+
+        instance.handleComfirm = () => {
+          instance.visible = false
+          resolve(true)
+        }
+      })
+    }
+    dialog.confirm = options => dialog({ ...options, showCancel: true })
+
+    Vue.prototype.$dialog = dialog
+  },
+}
+
+Vue.use(dialog)

src/renderer/plugins/index.js

@@ -1,2 +1,3 @@
 // import './axios'
+import './Dialog'
 import './Tips'

src/renderer/store/modules/download.js

@@ -11,6 +11,7 @@ import {
   getMusicUrl as getMusicUrlFormStorage,
   setMusicUrl,
   assertApiSupport,
+  filterFileName,
 } from '../../utils'
 import { NAMES, rendererInvoke } from '@common/ipc'
 
@@ -33,7 +34,6 @@ const dls = {}
 const tryNum = {}
 let isRuningActionTask = false
 
-const filterFileName = /[\\/:*?#"<>|]/g
 
 // getters
 const getters = {
@@ -378,9 +378,9 @@ const actions = {
       statusText: '待下载',
       url: null,
       // songmid: musicInfo.songmid,
-      fileName: `${rootState.setting.download.fileName
+      fileName: filterFileName(`${rootState.setting.download.fileName
         .replace('歌名', musicInfo.name)
-        .replace('歌手', musicInfo.singer)}.${ext}`.replace(filterFileName, ''),
+        .replace('歌手', musicInfo.singer)}.${ext}`),
       progress: {
         downloaded: 0,
         total: 0,