修复打包部署顺序Bug

update

.appveyor.yml

@@ -4,14 +4,15 @@ platform:
 cache:
   - node_modules
   - '%APPDATA%\npm-cache'
-  # - '%USERPROFILE%\.electron'
+  - '%LOCALAPPDATA%\electron\Cache'
+  - '%LOCALAPPDATA%\electron-builder\Cache'
 
 install:
   - ps: Install-Product node 12 x64
   - npm install
 
 build_script:
-  - npm run pub:gh
+  - npm run publish:gh
 
 test: off
 

.gitignore

@@ -34,6 +34,7 @@ build/Release
 
 # Dependency directories
 node_modules/
+node_modules.bak*/
 jspm_packages/
 
 # TypeScript v1 declaration files
@@ -68,3 +69,5 @@ dist
 publish/assets
 
 publish/utils/githubToken.js
+
+src/**/*-internal.js

.travis.yml

@@ -0,0 +1,43 @@
+matrix:
+  include:
+    - os: osx
+      osx_image: xcode10.2
+      language: node_js
+      node_js: "12"
+      env:
+        - ELECTRON_CACHE=$HOME/.cache/electron
+        - ELECTRON_BUILDER_CACHE=$HOME/.cache/electron-builder
+
+    - os: linux
+      language: node_js
+      node_js: "12"
+      dist: trusty
+      services: docker
+      language: generic
+
+cache:
+  directories:
+    - node_modules
+    - $HOME/.cache/electron
+    - $HOME/.cache/electron-builder
+    - $HOME/.npm/_prebuilds
+
+notifications:
+  email: false
+
+script:
+  - |
+    if [ "$TRAVIS_OS_NAME" == "linux" ]; then
+      npm install && npm run publish:gh:linux
+    else
+      npm run publish:gh:mac
+    fi
+
+before_cache:
+  - rm -rf $HOME/.cache/electron-builder/wine
+
+# only run this script on pull requests and merges into
+# the 'master' and 'prod' branches
+branches:
+  only:
+    - master

CHANGELOG.md

@@ -6,6 +6,180 @@ Project versioning adheres to [Semantic Versioning](http://semver.org/).
 Commit convention is based on [Conventional Commits](http://conventionalcommits.org).
 Change log format is based on [Keep a Changelog](http://keepachangelog.com/).
 
+## [0.5.0](https://github.com/lyswhut/lx-music-desktop/compare/v0.4.0...v0.5.0) - 2019-09-05
+
+### 新增
+
+- 新增**封面嵌入**（默认开启，可到设置-下载设置关闭）
+- 新增**歌词下载**（默认关闭，可到设置-下载设置开启）
+- 新增单例应用功能（实现软件单开功能，禁止软件多开）
+
+### 优化
+
+- 优化歌单列表动画
+
+### 修复
+
+- 修复歌单无法翻页的问题
+- 修复在某些情况下，添加下载歌曲导致下载列表崩溃的问题
+- 修复版本更新弹窗Bug
+- 修复酷狗歌单推荐歌单出现在其他分类中的Bug
+
+## [0.4.0](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.5...v0.4.0) - 2019-09-04
+
+
+### 新增
+
+- 新增**歌单**功能，目前支持酷我、酷狗、百度源歌单
+- 在设置界面-关于洛雪音乐说明部分新增**最新版网盘下载地址**与**打赏地址**
+- 新增酷狗 电音热歌榜、DJ热歌榜
+- 新增版本更新超时功能，对于部分无法访问GitHub的用户做更新超时提醒
+
+### 移除
+
+- **注意**：0.4.0以前的版本即将失效，请更新到0.4.0版本
+
+## [0.3.5](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.4...v0.3.5) - 2019-08-30
+
+### 新增
+
+- 新增**测试接口**，该接口同样速度较慢，但软件的大部分功能可用，**请自行切换到该接口**，找接口辛苦，且用且珍惜！
+
+### 优化
+
+- 取消需要刷新URL时windows任务栏进度显示错误状态（现显示为暂停状态）
+
+### 修复
+
+- 修复使用临时接口时在试听列表双击灰色歌曲仍然会进行播放的Bug
+- 修复歌词加载Bug
+
+## [0.3.4](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.3...v0.3.4) - 2019-08-29
+
+### 优化
+
+- 减少接口不稳定带来的影响，适当增加请求等待时间
+
+### 修复
+
+- 修复播放过程中URL过期不会刷新URL的问题
+
+## [0.3.3](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.2...v0.3.3) - 2019-08-29
+
+### 修复
+
+- **messoer**的接口已经关闭，暂时切换到临时接口使用，部分功能受限。。。
+- 修复设置界面更新出错时仍然显示更新下载中的问题
+- 修复手动定位播放进度条时存在偏差的问题
+- 屏蔽播放器中没有歌曲时对进度条的点击
+
+
+## [0.3.2](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.1...v0.3.2) - 2019-08-24
+
+### 新增
+
+- 新增酷狗排行榜其他音质下载
+
+## [0.3.1](https://github.com/lyswhut/lx-music-desktop/compare/v0.3.0...v0.3.1) - 2019-08-24
+
+### 修复
+
+- 修复音量条主题适配
+
+## [0.3.0](https://github.com/lyswhut/lx-music-desktop/compare/v0.2.3...v0.3.0) - 2019-08-24
+
+### 新增
+
+- 新增**MAC**及**Linux**版本（需要的可自行下载）
+- 新增音量调整
+- 新增任务栏播放进度条控制选项（现在可在设置界面关闭在任务栏显示的播放进度）
+- 新增更新出错时的弹窗提示
+- 从该版本起，非安装版也会有更新弹窗提醒了，但仍然需要手动下载新版本更新，版本信息可到设置页面查看
+
+### 修复
+
+- 强制把临时接口设置回 `messoer` 接口
+
+## [0.2.3](https://github.com/lyswhut/lx-music-desktop/compare/v0.2.2...v0.2.3) - 2019-08-22
+
+### 新增
+
+- 新增任务栏程序标题改变功能（播放歌曲时任务栏标题将显示当前播放的歌曲）
+
+### 修复
+
+- 使用临时接口时，试听列表中的下载按钮仍然能点击的Bug
+- 修复某些情况下歌曲链接未能缓存的问题
+
+### 移除
+
+- 移除临时接口（因服务器被攻击，本接口已关闭）
+- 移除列表栏设置的隐藏专辑栏选项（感觉这个设置并没有什么luan用，并且还会打破布局）
+
+## [0.2.2](https://github.com/lyswhut/lx-music-desktop/compare/v0.2.1...v0.2.2) - 2019-08-21
+
+### 修复
+
+- 修复下载过程中出错重试5次都失败后不会自动开始下一个任务的Bug
+- 修复播放到一半URL过期时不会刷新URL直接播放下一首的问题
+
+## [0.2.1](https://github.com/lyswhut/lx-music-desktop/compare/v0.2.0...v0.2.1) - 2019-08-20
+
+### 优化
+
+- 新增歌曲URL存储，当URL无效时才重新获取，以减少接口不稳定的影响
+
+### 修复
+
+- 修复歌曲加载无法加载时自动切换混乱的Bug
+- 修复移除列表最后一首歌曲时播放器不停止播放的问题
+
+## [0.2.0](https://github.com/lyswhut/lx-music-desktop/compare/v0.1.6...v0.2.0) - 2019-08-20
+
+### 新增
+
+- 新增**百度音乐**排行榜及其音乐直接试听与下载
+- 新增网易云排行榜音乐直接试听与下载（目前仅支持128k音质）
+- 新增酷狗排行榜音乐直接试听与下载（目前仅支持128k音质）
+
+### 修复
+
+- 修复更新弹窗历史版本描述多余的换行问题
+- 修复歌曲无法播放的情况下歌词仍会播放的问题
+
+## [0.1.6](https://github.com/lyswhut/lx-music-desktop/compare/v0.1.5...v0.1.6) - 2019-08-19
+
+### 修复
+
+- 修复列表多选音源限制Bug
+
+## [0.1.5](https://github.com/lyswhut/lx-music-desktop/compare/v0.1.4...v0.1.5) - 2019-08-19
+
+### 新增
+
+- 新增搜索列表批量试听与下载功能
+- 新增排行榜列表批量试听与下载功能
+- 新增试听列表批量移除与下载功能
+- 新增下载列表批量开始、暂停与移除功能
+
+### 优化
+
+- 优化歌曲切换机制
+
+## [0.1.4](https://github.com/lyswhut/lx-music-desktop/compare/v0.1.3...v0.1.4) - 2019-08-18
+
+### 新增
+
+- 新增音乐来源切换，可到设置页面-基本设置 look look !
+- 为搜索结果列表添加多选功能。
+P.S：暂时没想好多选后的操作按钮放哪...
+
+### 优化
+
+- 重构与改进checkbox组件，使其支持不定选中状态
+- 完善上一个版本的http请求封装并切换部分请求到该方法上
+- 优化其他一些细节
+
 ## [0.1.3](https://github.com/lyswhut/lx-music-desktop/compare/v0.1.2...v0.1.3) - 2019-08-17
 
 ### 新增

README.md

@@ -1,35 +1,71 @@
-# 洛雪音乐助手桌面版
+<p align="center"><a href="https://github.com/lyswhut/lx-music-desktop"><img width="200" src="https://github.com/lyswhut/lx-music-desktop/blob/master/doc/images/icon.png" alt="lx-music logo"></a></p>
 
-[![GitHub release][1]][2]
+<p align="center">
+  <a href="https://github.com/lyswhut/lx-music-desktop/releases"><img src="https://img.shields.io/github/release/lyswhut/lx-music-desktop" alt="Release version"></a>
+  <a href="https://ci.appveyor.com/project/lyswhut/lx-music-desktop"><img src="https://ci.appveyor.com/api/projects/status/flrsqd5ymp8fnte5?svg=true" alt="Build status"></a>
+  <a href="https://travis-ci.org/lyswhut/lx-music-desktop"><img src="https://travis-ci.org/lyswhut/lx-music-desktop.svg?branch=master" alt="Build status"></a>
+  <!-- <a href="https://github.com/lyswhut/lx-music-desktop/releases"><img src="https://img.shields.io/github/downloads/lyswhut/lx-music-desktop/latest/total" alt="Downloads"></a> -->
+  <a href="https://github.com/lyswhut/lx-music-desktop/tree/dev"><img src="https://img.shields.io/github/package-json/v/lyswhut/lx-music-desktop/dev" alt="Dev branch version"></a>
+  <!-- <a href="https://github.com/lyswhut/lx-music-desktop/blob/master/LICENSE"><img src="https://img.shields.io/github/license/lyswhut/lx-music-desktop" alt="License"></a> -->
+</p>
+
+<!-- [![GitHub release][1]][2]
 [![Build status][3]][4]
-[![GitHub All Releases Download][5]][6]
+[![GitHub Releases Download][5]][6]
 [![dev branch][7]][8]
+[![GitHub license][9]][10] -->
 
-[1]: https://img.shields.io/github/release/lyswhut/lx-music-desktop
+<!-- [1]: https://img.shields.io/github/release/lyswhut/lx-music-desktop
 [2]: https://github.com/lyswhut/lx-music-desktop/releases
 [3]: https://ci.appveyor.com/api/projects/status/flrsqd5ymp8fnte5?svg=true
 [4]: https://ci.appveyor.com/project/lyswhut/lx-music-desktop
+[5]: https://img.shields.io/github/downloads/lyswhut/lx-music-desktop/latest/total
 [5]: https://img.shields.io/github/downloads/lyswhut/lx-music-desktop/total
 [6]: https://github.com/lyswhut/lx-music-desktop/releases
 [7]: https://img.shields.io/github/package-json/v/lyswhut/lx-music-desktop/dev
 [8]: https://github.com/lyswhut/lx-music-desktop/tree/dev
+[9]: https://img.shields.io/github/license/lyswhut/lx-music-desktop
+[10]: https://github.com/lyswhut/lx-music-desktop/blob/master/LICENSE -->
 
-## 说明
+<h2 align="center">洛雪音乐助手桌面版</h2>
 
-一个基于 Electron + Vue 开发的 Windows 版音乐软件。
+### 说明
+
+一个基于 Electron + Vue 开发的音乐软件。
 
 所用技术栈：
 
 - Electron 6.x
 - Vue 2.x
 
-其他说明：TODO
+已支持的平台：
 
-软件变化请查看：[更新日志](https://github.com/lyswhut/lx-music-desktop/blob/master/CHANGELOG.md)
+- Windows 7 及以上
+- Mac OS
+- Linux
 
-感谢 <https://github.com/messoer> 提供的部分音乐API！
+注意：win7需要开启**透明效果**软件才可使用
 
-## 使用方法
+软件变化请查看：[更新日志](https://github.com/lyswhut/lx-music-desktop/blob/master/CHANGELOG.md)<br>
+软件下载请转到：[发布页面](https://github.com/lyswhut/lx-music-desktop/releases)<br>
+或者到网盘下载（网盘内有MAC、windows版）：`https://www.lanzous.com/b906260/` 密码：`glqw`
+
+#### 关于软件更新
+
+软件启动时若发现新版本时会自动从本仓库下载安装包，下载完毕会弹窗提示更新。<br>
+若下载未完成时软件被关闭，下次启动软件会再次自动下载。<br>
+目前暂未添加跳过更新某个版本的功能。<br>
+注意：**绿色版**的软件更新功能**不可用**，为了能及时地获取更新，建议使用安装版！！<br>
+注意：**Mac版**、**Linux deb**版不支持自动更新！
+
+#### TODO
+
+- [ ] 新增拉取各大平台歌单
+- [ ] 新增聚合搜索
+
+### 源码使用方法
+
+环境要求：Node.js 12.x
 
 ```bash
 # 开发模式
@@ -38,11 +74,25 @@ npm run dev
 # 构建免安装版
 npm run pack:dir
 
-# 构建安装包
+# 构建安装包（windows版）
 npm run pack
 
 ```
 
-## License
+### UI界面
 
-Apache License 2.0
+<p><a href="https://github.com/lyswhut/lx-music-desktop"><img width="100%" src="https://github.com/lyswhut/lx-music-desktop/blob/master/doc/images/app.png" alt="lx-music UI"></a></p>
+
+### 致谢
+
+感谢 [@messoer](https://github.com/messoer) 曾经提供的部分音乐API！
+
+### 免责声明
+
+本项目**不开发或者破解直接获取音频数据**的功能，所有音频数据均来自**第三方接口**！<br>
+本软件仅用于**测试 `electron 6.x` 在各种系统上的兼容性**及用于**对比各大音乐平台歌单、排行榜等数据列表的差异性**，使用本软件产生的**任何涉及版权相关的数据**请于**24小时内删除**。<br>
+使用本软件所造成的的后果由使用者承担！
+
+### 许可证
+
+[Apache License 2.0](https://github.com/lyswhut/lx-music-desktop/blob/master/LICENSE)

build-config/main/webpack.config.base.js

@@ -7,11 +7,6 @@ module.exports = {
     libraryTarget: 'commonjs2',
     path: path.join(__dirname, '../../dist/electron'),
   },
-  externals: [
-    // suppress electron-debug warning
-    // see https://github.com/SimulatedGREG/electron-vue/issues/498
-    { 'electron-debug': 'electron-debug' },
-  ],
   resolve: {
     alias: {
       common: path.join(__dirname, '../../src/common'),

build-config/renderer/webpack.config.dev.js

@@ -10,7 +10,7 @@ const { mergeCSSLoaderDev } = require('../utils')
 
 module.exports = merge(baseConfig, {
   mode: 'development',
-  devtool: '#cheap-module-eval-source-map',
+  devtool: 'eval-source-map',
   module: {
     rules: [
       {
@@ -46,7 +46,7 @@ module.exports = merge(baseConfig, {
         NODE_ENV: '"development"',
         ELECTRON_DISABLE_SECURITY_WARNINGS: 'true',
       },
-      '__static': `"${path.join(__dirname, '../../src/static').replace(/\\/g, '\\\\')}"`,
+      __static: `"${path.join(__dirname, '../../src/static').replace(/\\/g, '\\\\')}"`,
     }),
   ],
   performance: {

build-config/web/webpack.config.dev.js

@@ -9,7 +9,7 @@ const { mergeCSSLoaderDev } = require('../utils')
 
 module.exports = merge(baseConfig, {
   mode: 'development',
-  devtool: '#cheap-module-eval-source-map',
+  devtool: 'eval-source-map',
   output: {
     filename: '[name].js',
     path: path.join(__dirname, '../../dist/web'),

licenses/license_en.txt

@@ -0,0 +1,5 @@
+This program is only for learning to communicate!
+Do not use for commercial purposes! !
+All consequences of using this software are borne by the user!
+
+By: lyswhut

licenses/license_zh.txt

@@ -0,0 +1,5 @@
+本程序仅用于学习交流使用！
+请勿用于商业用途！！
+使用本软件造成的一切后果由使用者承担！
+
+By: 落雪无痕

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "lx-music-desktop",
-  "version": "0.1.0",
+  "version": "0.4.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -4229,6 +4229,11 @@
         "randomfill": "^1.0.3"
       }
     },
+    "crypto-js": {
+      "version": "3.1.9-1",
+      "resolved": "https://registry.npm.taobao.org/crypto-js/download/crypto-js-3.1.9-1.tgz",
+      "integrity": "sha1-/aGedh/Ad+Af+/3G6f38WeiAbNg="
+    },
     "crypto-random-string": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/crypto-random-string/download/crypto-random-string-1.0.0.tgz",
@@ -6238,6 +6243,11 @@
         "resolve-dir": "^1.0.1"
       }
     },
+    "flac-metadata": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npm.taobao.org/flac-metadata/download/flac-metadata-0.1.1.tgz",
+      "integrity": "sha1-wC+KBtJL1bad4rhVEsbkW9j5F2w="
+    },
     "flat-cache": {
       "version": "2.0.1",
       "resolved": "https://registry.npm.taobao.org/flat-cache/download/flat-cache-2.0.1.tgz",
@@ -7529,7 +7539,6 @@
       "version": "0.4.24",
       "resolved": "https://registry.npm.taobao.org/iconv-lite/download/iconv-lite-0.4.24.tgz",
       "integrity": "sha1-ICK0sl+93CHS9SSXSkdKr+czkIs=",
-      "dev": true,
       "requires": {
         "safer-buffer": ">= 2.1.2 < 3"
       }
@@ -9405,6 +9414,14 @@
       "integrity": "sha1-bBUsNFzhHFL0ZcKr2VfoY5zWdN8=",
       "dev": true
     },
+    "node-id3": {
+      "version": "0.1.11",
+      "resolved": "https://registry.npm.taobao.org/node-id3/download/node-id3-0.1.11.tgz",
+      "integrity": "sha1-ypuX8MVOQPsjRuUptKxMFaDPFio=",
+      "requires": {
+        "iconv-lite": "^0.4.15"
+      }
+    },
     "node-libs-browser": {
       "version": "2.2.1",
       "resolved": "https://registry.npm.taobao.org/node-libs-browser/download/node-libs-browser-2.2.1.tgz",

package.json

@@ -1,12 +1,40 @@
 {
   "name": "lx-music-desktop",
-  "version": "0.1.3",
+  "version": "0.5.0",
   "description": "一个免费的音乐下载助手",
   "main": "./dist/electron/main.js",
+  "productName": "lx-music-desktop",
   "scripts": {
+    "pack": "node build-config/pack.js && npm run pack:win",
+    "pack:win": "npm run pack:win:setup && npm run pack:win:7z",
+    "pack:win:setup": "cross-env TARGET=win_安装版 ARCH=x64_x86 electron-builder -w=nsis --x64 --ia32",
+    "pack:win:portable": "npm run pack:win:portable:x64_x86 && npm run pack:win:portable:x64 && npm run pack:win:portable:x86",
+    "pack:win:portable:x64_x86": "cross-env TARGET=便携版 ARCH=x64_x86 electron-builder -w=portable --x64 --ia32",
+    "pack:win:portable:x64": "cross-env TARGET=便携版 ARCH=x64 electron-builder -w=portable --x64",
+    "pack:win:portable:x86": "cross-env TARGET=便携版 ARCH=x86 electron-builder -w=portable --ia32",
+    "pack:win:7z": "npm run pack:win:7z:x64 && npm run pack:win:7z:x86",
+    "pack:win:7z:x64": "cross-env TARGET=win_绿色版 ARCH=x64 electron-builder -w=7z --x64",
+    "pack:win:7z:x86": "cross-env TARGET=win_绿色版 ARCH=x86 electron-builder -w=7z --ia32",
     "publish": "node publish",
-    "pub:gh": "node build-config/pack.js && electron-builder --win -p always",
-    "pack": "node build-config/pack.js && electron-builder -w",
+    "publish:gh": "node build-config/pack.js && npm run publish:win",
+    "publish:win": "npm run publish:win:7z && npm run publish:win:setup",
+    "publish:win:setup": "cross-env TARGET=Setup ARCH=x64_x86 electron-builder -w=nsis --x64 --ia32 -p onTagOrDraft",
+    "publish:win:portable": "npm run publish:win:portable:x64_x86 && npm run publish:win:portable:x64 && npm run publish:win:portable:x86",
+    "publish:win:portable:x64_x86": "cross-env TARGET=portable ARCH=x64_x86 electron-builder -w=portable --x64 --ia32 -p onTagOrDraft",
+    "publish:win:portable:x64": "cross-env TARGET=portable ARCH=x64 electron-builder -w=portable --x64 -p onTagOrDraft",
+    "publish:win:portable:x86": "cross-env TARGET=portable ARCH=x86 electron-builder -w=portable --ia32 -p onTagOrDraft",
+    "publish:win:7z": "npm run publish:win:7z:x64 && npm run publish:win:7z:x86",
+    "publish:win:7z:x64": "cross-env TARGET=green ARCH=win_x64 electron-builder -w=7z --x64 -p always",
+    "publish:win:7z:x86": "cross-env TARGET=green ARCH=win_x86 electron-builder -w=7z --ia32 -p onTagOrDraft",
+    "publish:gh:mac": "node build-config/pack.js && npm run publish:mac",
+    "publish:mac": "npm run publish:mac:dmg",
+    "publish:mac:dmg": "electron-builder -m=dmg -p onTagOrDraft",
+    "publish:gh:linux": "node build-config/pack.js && npm run publish:linux",
+    "publish:linux": "npm run publish:linux:deb && npm run publish:linux:appImage",
+    "publish:linux:appImage": "cross-env ARCH=x64 electron-builder -l=AppImage -p onTagOrDraft",
+    "publish:linux:deb": "npm run publish:linux:deb:x64 && npm run publish:linux:deb:x86",
+    "publish:linux:deb:x64": "cross-env ARCH=x64 electron-builder -l=deb --x64 -p onTagOrDraft",
+    "publish:linux:deb:x86": "cross-env ARCH=x86 electron-builder -l=deb --ia32 -p onTagOrDraft",
     "pack:linux": "node build-config/pack.js && electron-builder -l",
     "pack:dir": "node build-config/pack.js && electron-builder --dir",
     "dev": "node build-config/runner-dev.js",
@@ -34,49 +62,50 @@
     "files": [
       "dist/electron/**/*"
     ],
+    "extraResources": [
+      "./licenses"
+    ],
     "win": {
-      "icon": "src/static/icons/lunch.ico",
+      "icon": "./resources/icons/256x256.ico",
       "legalTrademarks": "lyswhut",
-      "target": [
-        {
-          "arch": [
-            "ia32",
-            "x64"
-          ],
-          "target": "nsis"
-        }
-      ]
+      "artifactName": "${productName} v${version} ${env.ARCH} ${env.TARGET}.${ext}"
+    },
+    "mac": {
+      "icon": "./resources/icons/512x512.png",
+      "category": "public.app-category.music"
     },
     "linux": {
-      "target": [
-        {
-          "target": "AppImage",
-          "arch": [
-            "x64"
-          ]
-        },
-        {
-          "arch": [
-            "ia32",
-            "x64"
-          ],
-          "target": "deb"
-        },
-        {
-          "arch": [
-            "x64"
-          ],
-          "target": "snap"
-        }
-      ],
-      "maintainer": "lyswhut <lyswuhut@qq.com>"
+      "maintainer": "lyswhut <lyswuhut@qq.com>",
+      "artifactName": "${productName} v${version} ${env.ARCH}.${ext}"
     },
     "nsis": {
       "oneClick": false,
       "language": "2052",
       "allowToChangeInstallationDirectory": true,
       "differentialPackage": true,
-      "license": "./license.rtf"
+      "license": "./licenses/license.rtf",
+      "shortcutName": "lx-music"
+    },
+    "dmg": {
+      "contents": [
+        {
+          "x": 110,
+          "y": 150,
+          "name": "lx-music"
+        },
+        {
+          "x": 240,
+          "y": 150,
+          "type": "link",
+          "path": "/Applications",
+          "name": "lx-music"
+        }
+      ],
+      "title": "洛雪音乐助手 v${version}"
+    },
+    "appImage": {
+      "license": "./licenses/license_zh.txt",
+      "category": "Audio"
     },
     "publish": [
       {
@@ -90,9 +119,16 @@
     "type": "git",
     "url": "git+https://github.com/lyswhut/lx-music-desktop.git"
   },
-  "keywords": [],
-  "author": "lyswhut",
-  "license": "Apache License 2.0",
+  "keywords": [
+    "music-player",
+    "electron-app",
+    "vuejs2"
+  ],
+  "author": {
+    "name": "lyswhut",
+    "email": "lyswuhut@qq.com"
+  },
+  "license": "Apache-2.0",
   "bugs": {
     "url": "https://github.com/lyswhut/lx-music-desktop/issues"
   },
@@ -159,12 +195,15 @@
   },
   "dependencies": {
     "axios": "^0.19.0",
+    "crypto-js": "^3.1.9-1",
     "electron-log": "^3.0.7",
     "electron-store": "^4.0.0",
     "electron-updater": "^4.1.2",
+    "flac-metadata": "^0.1.1",
     "js-htmlencode": "^0.3.0",
     "lrc-file-parser": "^0.1.12",
     "node-downloader-helper": "^1.0.10",
+    "node-id3": "^0.1.11",
     "request": "^2.88.0",
     "vue": "^2.6.10",
     "vue-electron": "^1.0.6",

publish/index.js

@@ -7,16 +7,17 @@ const clearAssets = require('./utils/clearAssets')
 const updateVersionFile = require('./utils/updateChangeLog')
 // const copyFile = require('./utils/copyFile')
 // const githubRelease = require('./utils/githubRelease')
-const { parseArgv } = require('./utils')
+// const { parseArgv } = require('./utils')
 
 const run = async() => {
-  const params = parseArgv(process.argv.slice(2))
-  const bak = await updateVersionFile(params.ver)
+  // const params = parseArgv(process.argv.slice(2))
+  // const bak = await updateVersionFile(params.ver)
+  const bak = await updateVersionFile(process.argv.slice(2)[0])
 
   try {
     console.log(chalk.blue('Clearing assets...'))
     await clearAssets()
-    console.log(chalk.green('Assets clear complated...'))
+    console.log(chalk.green('Assets clear completed...'))
 
     // console.log(chalk.blue('Compileing assets...'))
     // await compileAssets()

publish/version.json

@@ -1,7 +1,67 @@
 {
-  "version": "0.1.3",
-  "desc": "<h3>新增</h3>\n<ul>\n<li>新增win32应用构建</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复安装包许可协议乱码问题</li>\n<li><strong>messoer 提供的接口已挂</strong>，暂时切换到临时接口！</li>\n</ul>\n<h3>移除</h3>\n<ul>\n<li>由于messoer接口无法使用，QQ音乐排行榜直接播放/下载功能暂时关闭</li>\n</ul>\n",
+  "version": "0.5.0",
+  "desc": "<h3>新增</h3>\n<ul>\n<li>新增<strong>封面嵌入</strong>（默认开启，可到设置-下载设置关闭）</li>\n<li>新增<strong>歌词下载</strong>（默认关闭，可到设置-下载设置开启）</li>\n<li>新增单例应用功能（实现软件单开功能，禁止软件多开）</li>\n</ul>\n<h3>优化</h3>\n<ul>\n<li>优化歌单列表动画</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复歌单无法翻页的问题</li>\n<li>修复在某些情况下，添加下载歌曲导致下载列表崩溃的问题</li>\n<li>修复版本更新弹窗Bug</li>\n<li>修复酷狗歌单推荐歌单出现在其他分类中的Bug</li>\n</ul>\n",
   "history": [
+    {
+      "version": "0.4.0",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增<strong>歌单</strong>功能，目前支持酷我、酷狗、百度源歌单</li>\n<li>在设置界面-关于洛雪音乐说明部分新增<strong>最新版网盘下载地址</strong>与<strong>打赏地址</strong></li>\n<li>新增酷狗 电音热歌榜、DJ热歌榜</li>\n<li>新增版本更新超时功能，对于部分无法访问GitHub的用户做更新超时提醒</li>\n</ul>\n<h3>移除</h3>\n<ul>\n<li><strong>注意</strong>：0.4.0以前的版本即将失效，请更新到0.4.0版本</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.5",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增<strong>测试接口</strong>，该接口同样速度较慢，但软件的大部分功能可用，<strong>请自行切换到该接口</strong>，找接口辛苦，且用且珍惜！</li>\n</ul>\n<h3>优化</h3>\n<ul>\n<li>取消需要刷新URL时windows任务栏进度显示错误状态（现显示为暂停状态）</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复使用临时接口时在试听列表双击灰色歌曲仍然会进行播放的Bug</li>\n<li>修复歌词加载Bug</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.4",
+      "desc": "<h3>优化</h3>\n<ul>\n<li>减少接口不稳定带来的影响，适当增加请求等待时间</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复播放过程中URL过期不会刷新URL的问题</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.3",
+      "desc": "<h3>修复</h3>\n<ul>\n<li><strong>messoer</strong>的接口已经关闭，暂时切换到临时接口使用，部分功能受限。。。</li>\n<li>修复设置界面更新出错时仍然显示更新下载中的问题</li>\n<li>修复手动定位播放进度条时存在偏差的问题</li>\n<li>屏蔽播放器中没有歌曲时对进度条的点击</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.2",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增酷狗排行榜其他音质下载</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.1",
+      "desc": "<h3>修复</h3>\n<ul>\n<li>修复音量条主题适配</li>\n</ul>\n"
+    },
+    {
+      "version": "0.3.0",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增<strong>MAC</strong>及<strong>Linux</strong>版本（需要的可自行下载）</li>\n<li>新增音量调整</li>\n<li>新增任务栏播放进度条控制选项（现在可在设置界面关闭在任务栏显示的播放进度）</li>\n<li>新增更新出错时的弹窗提示</li>\n<li>从该版本起，非安装版也会有更新弹窗提醒了，但仍然需要手动下载新版本更新，版本信息可到设置页面查看</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>强制把临时接口设置回 <code>messoer</code> 接口</li>\n</ul>\n"
+    },
+    {
+      "version": "0.2.3",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增任务栏程序标题改变功能（播放歌曲时任务栏标题将显示当前播放的歌曲）</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>使用临时接口时，试听列表中的下载按钮仍然能点击的Bug</li>\n<li>修复某些情况下歌曲链接未能缓存的问题</li>\n</ul>\n<h3>移除</h3>\n<ul>\n<li>移除临时接口（因服务器被攻击，本接口已关闭）</li>\n<li>移除列表栏设置的隐藏专辑栏选项（感觉这个设置并没有什么luan用，并且还会打破布局）</li>\n</ul>\n"
+    },
+    {
+      "version": "0.2.2",
+      "desc": "<h3>修复</h3>\n<ul>\n<li>修复下载过程中出错重试5次都失败后不会自动开始下一个任务的Bug</li>\n<li>修复播放到一半URL过期时不会刷新URL直接播放下一首的问题</li>\n</ul>\n"
+    },
+    {
+      "version": "0.2.1",
+      "desc": "<h3>优化</h3>\n<ul>\n<li>新增歌曲URL存储，当URL无效时才重新获取，以减少接口不稳定的影响</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复歌曲加载无法加载时自动切换混乱的Bug</li>\n<li>修复移除列表最后一首歌曲时播放器不停止播放的问题</li>\n</ul>\n"
+    },
+    {
+      "version": "0.2.0",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增<strong>百度音乐</strong>排行榜及其音乐直接试听与下载</li>\n<li>新增网易云排行榜音乐直接试听与下载（目前仅支持128k音质）</li>\n<li>新增酷狗排行榜音乐直接试听与下载（目前仅支持128k音质）</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复更新弹窗历史版本描述多余的换行问题</li>\n<li>修复歌曲无法播放的情况下歌词仍会播放的问题</li>\n</ul>\n"
+    },
+    {
+      "version": "0.1.6",
+      "desc": "<h3>修复</h3>\n<ul>\n<li>修复列表多选音源限制Bug</li>\n</ul>\n"
+    },
+    {
+      "version": "0.1.5",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增搜索列表批量试听与下载功能</li>\n<li>新增排行榜列表批量试听与下载功能</li>\n<li>新增试听列表批量移除与下载功能</li>\n<li>新增下载列表批量开始、暂停与移除功能</li>\n</ul>\n<h3>优化</h3>\n<ul>\n<li>优化歌曲切换机制</li>\n</ul>\n"
+    },
+    {
+      "version": "0.1.4",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增音乐来源切换，可到设置页面-基本设置 look look !</li>\n<li>为搜索结果列表添加多选功能。<br>\nP.S：暂时没想好多选后的操作按钮放哪…</li>\n</ul>\n<h3>优化</h3>\n<ul>\n<li>重构与改进checkbox组件，使其支持不定选中状态</li>\n<li>完善上一个版本的http请求封装并切换部分请求到该方法上</li>\n<li>优化其他一些细节</li>\n</ul>\n"
+    },
+    {
+      "version": "0.1.3",
+      "desc": "<h3>新增</h3>\n<ul>\n<li>新增win32应用构建</li>\n</ul>\n<h3>修复</h3>\n<ul>\n<li>修复安装包许可协议乱码问题</li>\n<li><strong>messoer 提供的接口已挂</strong>，暂时切换到临时接口！</li>\n</ul>\n<h3>移除</h3>\n<ul>\n<li>由于messoer接口无法使用，QQ音乐排行榜直接播放/下载功能暂时关闭</li>\n</ul>\n"
+    },
     {
       "version": "0.1.2",
       "desc": "<h3>修复</h3>\n<ul>\n<li>修复更新弹窗的内容显示问题</li>\n</ul>\n"

src/common/utils.js

@@ -0,0 +1,4 @@
+export const isLinux = process.platform == 'linux'
+export const isWin = process.platform == 'win32'
+export const isMac = process.platform == 'darwin'
+

src/index.pug

@@ -3,7 +3,7 @@ html(lang="cn")
     meta(charset="UTF-8")
     meta(name="viewport" content="width=device-width, initial-scale=1.0")
     meta(http-equiv="X-UA-Compatible" content="ie=edge")
-    title= require('../package.json').name
+    title 洛雪音乐助手
 
   body
     #root

src/main/events/index.js

@@ -1,4 +1,5 @@
 
 require('./request')
-require('./appName')
+// require('./appName')
+require('./musicMeta')
 

src/main/events/musicMeta.js

@@ -0,0 +1,6 @@
+const { mainOn } = require('../../common/icp')
+const { setMeta } = require('../utils/musicMeta')
+
+mainOn('setMusicMeta', (event, { filePath, meta }) => {
+  setMeta(filePath, meta)
+})

src/main/index.js

@@ -1,10 +1,25 @@
-const { app, BrowserWindow } = require('electron')
+const { app, BrowserWindow, Menu } = require('electron')
 const path = require('path')
 
+// 单例应用程序
+if (!app.requestSingleInstanceLock()) {
+  app.quit()
+  return
+}
+app.on('second-instance', (event, argv, cwd) => {
+  if (mainWindow) {
+    if (mainWindow.isMinimized()) mainWindow.restore()
+    mainWindow.focus()
+  } else {
+    app.quit()
+  }
+})
+
 require('./events')
 const progressBar = require('./events/progressBar')
 const trafficLight = require('./events/trafficLight')
 const autoUpdate = require('./utils/autoUpdate')
+const { isLinux, isMac } = require('../common/utils')
 
 const isDev = process.env.NODE_ENV !== 'production'
 
@@ -33,8 +48,8 @@ function createWindow() {
     useContentSize: true,
     width: 920,
     frame: false,
-    transparent: true,
-    icon: path.join(global.__static, 'icons/lunch.ico'),
+    transparent: !isLinux,
+    // icon: path.join(global.__static, isWin ? 'icons/256x256.ico' : 'icons/512x512.png'),
     resizable: false,
     maximizable: false,
     fullscreenable: false,
@@ -58,6 +73,24 @@ function createWindow() {
   if (!isDev) autoUpdate(mainWindow)
 }
 
+if (isMac) {
+  const template = [
+    {
+      label: app.getName(),
+      submenu: [{ label: '关于洛雪音乐', role: 'about' }, { type: 'separator' }, { label: '隐藏', role: 'hide' }, { label: '显示其他', role: 'hideothers' }, { label: '显示全部', role: 'unhide' }, { type: 'separator' }, { label: '退出', click: () => app.quit() }],
+    },
+    {
+      label: '窗口',
+      role: 'window',
+      submenu: [{ label: '最小化', role: 'minimize' }, { label: '关闭', role: 'close' }],
+    },
+  ]
+
+  Menu.setApplicationMenu(Menu.buildFromTemplate(template))
+} else {
+  Menu.setApplicationMenu(null)
+}
+
 app.once('ready', createWindow)
 
 app.on('window-all-closed', () => {
@@ -71,4 +104,3 @@ app.on('activate', () => {
     createWindow()
   }
 })
-

src/main/utils/autoUpdate.js

@@ -3,6 +3,7 @@ const { autoUpdater } = require('electron-updater')
 const { mainOn } = require('../../common/icp')
 
 autoUpdater.logger = log
+// autoUpdater.autoDownload = false
 autoUpdater.logger.transports.file.level = 'info'
 log.info('App starting...')
 
@@ -60,21 +61,30 @@ module.exports = win => {
   autoUpdater.on('checking-for-update', () => {
     sendStatusToWindow('Checking for update...')
   })
-  autoUpdater.on('update-available', (ev, info) => {
+  autoUpdater.on('update-available', info => {
     sendStatusToWindow('Update available.')
+    win.webContents.send('update-available', info)
   })
-  autoUpdater.on('update-not-available', (ev, info) => {
+  autoUpdater.on('update-not-available', info => {
     sendStatusToWindow('Update not available.')
+    setTimeout(() => { // 延迟发送事件，过早发送可能渲染进程还启动完成
+      win.webContents.send('update-not-available')
+    }, 5000)
   })
-  autoUpdater.on('error', (ev, err) => {
+  autoUpdater.on('error', () => {
     sendStatusToWindow('Error in auto-updater.')
+    setTimeout(() => { // 延迟发送事件，过早发送可能渲染进程还启动完成
+      win.webContents.send('update-error')
+    }, 6000)
   })
-  autoUpdater.on('download-progress', (ev, progressObj) => {
+  autoUpdater.on('download-progress', progressObj => {
     sendStatusToWindow('Download progress...')
   })
-  autoUpdater.on('update-downloaded', (ev, info) => {
+  autoUpdater.on('update-downloaded', info => {
     sendStatusToWindow('Update downloaded.')
-    win.webContents.send('update-downloaded')
+    setTimeout(() => { // 延迟发送事件，过早发送可能渲染进程还启动完成
+      win.webContents.send('update-downloaded')
+    }, 2000)
   })
   mainOn('quit-update', () => {
     setTimeout(() => {

src/main/utils/flacMeta.js

@@ -0,0 +1,38 @@
+const fs = require('fs')
+const flac = require('flac-metadata')
+
+module.exports = (filenPath, meta) => {
+  const reader = fs.createReadStream(filenPath)
+  const tempPath = filenPath + '.lxmtemp'
+  const writer = fs.createWriteStream(tempPath)
+  const processor = new flac.Processor()
+  if (meta.APIC) delete meta.APIC
+
+  const comments = []
+  for (const key in meta) {
+    comments.push(`${key.toUpperCase()}=${meta[key]}`)
+  }
+  const vendor = 'lx-music-desktop'
+
+  processor.on('preprocess', function(mdb) {
+    // Remove existing VORBIS_COMMENT block, if any.
+    if (mdb.type === flac.Processor.MDB_TYPE_VORBIS_COMMENT) {
+      mdb.remove()
+    }
+    // Inject new VORBIS_COMMENT block.
+    if (mdb.removed || mdb.isLast) {
+      let mdbVorbis = flac.data.MetaDataBlockVorbisComment.create(mdb.isLast, vendor, comments)
+      this.push(mdbVorbis.publish())
+    }
+  })
+
+  reader.pipe(processor).pipe(writer).on('finish', () => {
+    fs.unlink(filenPath, err => {
+      if (err) return console.log(err.message)
+      fs.rename(tempPath, filenPath, err => {
+        if (err) console.log(err.message)
+      })
+    })
+  })
+}
+

src/main/utils/mp3Meta.js

@@ -0,0 +1,17 @@
+const NodeID3 = require('node-id3')
+const path = require('path')
+const fs = require('fs')
+const request = require('request')
+const extReg = /^(\.(?:jpe?g|png)).*$/
+
+module.exports = (filePath, meta) => {
+  if (!meta.APIC) return NodeID3.write(meta, filePath)
+  let picPath = path.join(path.dirname(filePath), `${meta.title}-${meta.artist}${path.extname(meta.APIC).replace(extReg, '$1')}`)
+  request(meta.APIC).pipe(fs.createWriteStream(picPath)).on('finish', () => {
+    meta.APIC = picPath
+    NodeID3.write(meta, filePath)
+    fs.unlink(picPath, err => {
+      if (err) console.log(err.message)
+    })
+  })
+}

src/main/utils/musicMeta.js

@@ -0,0 +1,14 @@
+const path = require('path')
+const mp3Meta = require('./mp3Meta')
+const flacMeta = require('./flacMeta')
+
+exports.setMeta = (filePath, meta) => {
+  switch (path.extname(filePath)) {
+    case '.mp3':
+      mp3Meta(filePath, meta)
+      break
+    case '.flac':
+      flacMeta(filePath, meta)
+      break
+  }
+}

src/renderer/App.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-#container(v-if="isProd" :class="theme" @mouseenter="enableIgnoreMouseEvents" @mouseleave="dieableIgnoreMouseEvents")
+#container(v-if="isProd && !isLinux" :class="theme" @mouseenter="enableIgnoreMouseEvents" @mouseleave="dieableIgnoreMouseEvents")
   core-aside#left
   #right
     core-toolbar#toolbar
@@ -20,14 +20,24 @@
 <script>
 import { mapMutations, mapGetters, mapActions } from 'vuex'
 import { rendererOn } from '../common/icp'
+import { isLinux } from '../common/utils'
 window.ELECTRON_DISABLE_SECURITY_WARNINGS = process.env.ELECTRON_DISABLE_SECURITY_WARNINGS
-const win = require('electron').remote.getCurrentWindow()
-const body = document.body
+let win
+let body
+if (!isLinux) {
+  win = require('electron').remote.getCurrentWindow()
+  body = document.body
+}
 
 export default {
   data() {
     return {
       isProd: process.env.NODE_ENV === 'production',
+      isLinux,
+      globalObj: {
+        apiSource: 'messoer',
+      },
+      updateTimeout: null,
     }
   },
   computed: {
@@ -35,9 +45,11 @@ export default {
     ...mapGetters('list', ['defaultList']),
     ...mapGetters('download', {
       downloadList: 'list',
+      downloadStatus: 'downloadStatus',
     }),
   },
   mounted() {
+    document.body.classList.add(this.isLinux ? 'noTransparent' : 'transparent')
     this.init()
   },
   watch: {
@@ -49,6 +61,7 @@ export default {
     },
     defaultList: {
       handler(n) {
+        // console.log(n)
         this.electronStore.set('list.defaultList', n)
       },
       deep: true,
@@ -59,33 +72,71 @@ export default {
       },
       deep: true,
     },
+    'globalObj.apiSource'(n) {
+      if (n != this.setting.apiSource) {
+        this.setSetting(Object.assign({}, this.setting, {
+          apiSource: n,
+        }))
+      }
+    },
   },
   methods: {
     ...mapActions(['getVersionInfo']),
-    ...mapMutations(['setNewVersion', 'setVersionVisible']),
+    ...mapMutations(['setNewVersion', 'setVersionModalVisible']),
     ...mapMutations('list', ['initDefaultList']),
     ...mapMutations('download', ['updateDownloadList']),
+    ...mapMutations(['setSetting']),
     init() {
-      if (this.isProd) {
+      if (this.isProd && !isLinux) {
         body.addEventListener('mouseenter', this.dieableIgnoreMouseEvents)
         body.addEventListener('mouseleave', this.enableIgnoreMouseEvents)
       }
-      rendererOn('update-downloaded', () => {
-        this.getVersionInfo().then(body => {
-          this.setNewVersion(body)
-          this.$nextTick(() => {
-            this.setVersionVisible(true)
-          })
+      rendererOn('update-available', (e, info) => {
+        // this.showUpdateModal(true)
+        this.setNewVersion({
+          version: info.version,
         })
       })
+      rendererOn('update-error', () => {
+        if (!this.updateTimeout) return
+        this.setVersionModalVisible({ isError: true })
+        this.clearUpdateTimeout()
+        this.$nextTick(() => {
+          this.showUpdateModal()
+        })
+      })
+      rendererOn('update-downloaded', () => {
+        this.clearUpdateTimeout()
+        this.showUpdateModal()
+      })
+      rendererOn('update-not-available', () => {
+        if (!this.updateTimeout) return
+        if (this.setting.ignoreVersion) this.setSetting(Object.assign({}, this.setting, { ignoreVersion: null }))
+        this.clearUpdateTimeout()
+        this.setNewVersion({
+          version: this.version.version,
+        })
+      })
+      // 更新超时定时器
+      this.updateTimeout = setTimeout(() => {
+        this.updateTimeout = null
+        this.setVersionModalVisible({ isError: true })
+        this.$nextTick(() => {
+          this.showUpdateModal()
+        })
+      }, 180000)
 
       this.initData()
+      this.globalObj.apiSource = this.setting.apiSource
+      window.globalObj = this.globalObj
     },
     enableIgnoreMouseEvents() {
+      if (isLinux) return
       win.setIgnoreMouseEvents(false)
       // console.log('content enable')
     },
     dieableIgnoreMouseEvents() {
+      if (isLinux) return
       // console.log('content disable')
       win.setIgnoreMouseEvents(true, { forward: true })
     },
@@ -96,19 +147,40 @@ export default {
     },
     initPlayList() {
       let defaultList = this.electronStore.get('list.defaultList')
+      // console.log(defaultList)
       if (defaultList) {
-        defaultList.list.forEach(m => {
-          m.typeUrl = {}
-        })
+        // defaultList.list.forEach(m => {
+        //   m.typeUrl = {}
+        // })
         this.initDefaultList(defaultList)
       }
     },
     initDownloadList() {
       let downloadList = this.electronStore.get('download.list')
       if (downloadList) {
+        downloadList.forEach(item => {
+          if (item.status == this.downloadStatus.RUN || item.status == this.downloadStatus.WAITING) {
+            item.status = this.downloadStatus.PAUSE
+            item.statusText = '暂停下载'
+          }
+        })
         this.updateDownloadList(downloadList)
       }
     },
+    showUpdateModal() {
+      (this.version.newVersion && this.version.newVersion.history ? Promise.resolve(this.version.newVersion) : this.getVersionInfo().then(body => {
+        this.setNewVersion(body)
+        if (body.version !== this.setting.ignoreVersion) this.setSetting(Object.assign({}, this.setting, { ignoreVersion: null }))
+        return body
+      })).then(body => {
+        if (body.version === this.version.version) return
+        if (this.version.isError && body.version === this.setting.ignoreVersion) return
+
+        this.$nextTick(() => {
+          this.setVersionModalVisible({ isShow: true })
+        })
+      })
+    },
   },
   beforeDestroy() {
     if (this.isProd) {
@@ -116,6 +188,10 @@ export default {
       body.removeEventListener('mouseleave', this.enableIgnoreMouseEvents)
     }
   },
+  clearUpdateTimeout() {
+    clearTimeout(this.updateTimeout)
+    this.updateTimeout = null
+  },
 }
 </script>
 
@@ -124,22 +200,30 @@ export default {
 @import './assets/styles/layout.less';
 
 body {
-  // background-color: #fff;
-  padding: @shadow-app;
   user-select: none;
   height: 100vh;
   box-sizing: border-box;
 }
 
+.transparent {
+  padding: @shadow-app;
+  #container {
+    box-shadow: 0 0 @shadow-app rgba(0, 0, 0, 0.5);
+    border-radius: 4px;
+    background-color: transparent;
+  }
+}
+.noTransparent {
+  background-color: #fff;
+}
+
 #container {
   position: relative;
   display: flex;
   height: 100%;
-  box-shadow: 0 0 @shadow-app rgba(0, 0, 0, 0.5);
-  // background-color: #fff;
-  border-radius: 4px;
   overflow: hidden;
 }
+
 #left {
   flex: none;
   width: @width-app-left;

src/renderer/assets/styles/index.less

@@ -12,6 +12,10 @@
   .mixin-ellipsis-1;
 }
 
+.center {
+  text-align: center;
+}
+
 .break {
   word-break: break-all;
 }

src/renderer/components/core/Aside.vue

@@ -9,10 +9,10 @@ div(:class="$style.aside")
       dt 在线音乐
       dd
         router-link(:active-class="$style.active" to="search") 搜索
+      dd
+        router-link(:active-class="$style.active" to="songList") 歌单
       dd
         router-link(:active-class="$style.active" to="leaderboard") 排行榜
-      //- dd
-        router-link(:active-class="$style.active" to="recommend") 歌单
     dl
       dt 我的音乐
       dd

src/renderer/components/core/Player.vue

@@ -8,6 +8,13 @@ div(:class="$style.player")
     div(:class="$style.column1")
       div(:class="$style.container")
         div(:class="$style.title") {{title}}
+        div(:class="$style.volumeContent")
+          div(:class="$style.volume" @click.stop='handleChangeVolume' :title="`当前音量：${volumeStr}%`")
+            div(:class="$style.volumeBar" :style="{ width: volumeStr + '%' }")
+
+        //- div(:class="$style.playBtn" @click='handleNext' title="音量")
+          svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 291.063 291.064' space='preserve')
+            use(xlink:href='#icon-sound')
         div(:class="$style.playBtn" @click='handleNext' title="下一首")
           svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 220.847 220.847' space='preserve')
             use(xlink:href='#icon-nextMusic')
@@ -41,14 +48,16 @@ div(:class="$style.player")
 <script>
 import Lyric from 'lrc-file-parser'
 import { rendererSend } from '../../../common/icp'
-import { formatPlayTime2, getRandom, checkPath } from '../../utils'
+import { formatPlayTime2, getRandom, checkPath, setTitle } from '../../utils'
 import { mapGetters, mapActions, mapMutations } from 'vuex'
+import { requestMsg } from '../../utils/message'
 
 export default {
   data() {
     return {
       show: true,
       audio: null,
+      volume: 0,
       nowPlayTime: 0,
       maxPlayTime: 0,
       isPlay: false,
@@ -61,12 +70,16 @@ export default {
         name: '^',
         singer: '^',
       },
+      targetSong: null,
       pregessWidth: 0,
       lyric: {
         lrc: null,
         text: '',
         line: 0,
       },
+      delayNextTimeout: null,
+      audioErrorTime: 0,
+      retryNum: 0,
     }
   },
   computed: {
@@ -90,10 +103,18 @@ export default {
       // return 50
       return this.nowPlayTime / this.maxPlayTime || 0
     },
+    isAPITemp() {
+      return this.setting.apiSource == 'temp'
+    },
+    volumeStr() {
+      return parseInt(this.volume * 100)
+    },
   },
   mounted() {
-    this.setProgessWidth()
     this.init()
+    this.$nextTick(() => {
+      this.setProgessWidth()
+    })
   },
   watch: {
     changePlay(n) {
@@ -114,8 +135,13 @@ export default {
           ? n.findIndex(s => s.musicInfo.songmid === this.musicInfo.songmid)
           : n.findIndex(s => s.songmid === this.musicInfo.songmid)
         if (index < 0) {
-          this.fixPlayIndex(this.playIndex - 1)
-          if (n.length) this.handleNext()
+          // console.log(this.playIndex)
+          if (n.length) {
+            this.fixPlayIndex(this.playIndex - 1)
+            this.handleNext()
+          } else {
+            this.setPlayIndex(-1)
+          }
         } else {
           this.fixPlayIndex(index)
         }
@@ -126,6 +152,9 @@ export default {
       if (n.toFixed(2) === o.toFixed(2)) return
       this.sendProgressEvent(n, 'normal')
     },
+    volume(n) {
+      this.handleSaveVolume(n)
+    },
   },
   methods: {
     ...mapActions('player', ['getUrl', 'getPic', 'getLrc']),
@@ -134,10 +163,14 @@ export default {
       'fixPlayIndex',
       'resetChangePlay',
     ]),
+    ...mapMutations(['setVolume']),
+    ...mapMutations('list', ['updateMusicInfo']),
     init() {
       this.audio = document.createElement('audio')
+      this.volume = this.audio.volume = this.setting.player.volume
       this.audio.controls = false
       this.audio.autoplay = true
+      this.audio.preload = 'auto'
       this.audio.loop = this.setting.player.togglePlayMethod === 'singleLoop'
 
       this.audio.addEventListener('playing', () => {
@@ -158,36 +191,35 @@ export default {
         this.handleNext()
       })
       this.audio.addEventListener('error', () => {
+        // console.log('code', this.audio.error.code)
         if (!this.musicInfo.songmid) return
         console.log('出错')
         this.stopPlay()
-        this.status = '加载出错'
-        this.sendProgressEvent(this.progress, 'error')
+        if (this.audio.error.code !== 1 && this.retryNum < 3) { // 若音频URL无效则尝试刷新3次URL
+          // console.log(this.retryNum)
+          this.audioErrorTime = this.audio.currentTime // 记录出错的播放时间
+          this.retryNum++
+          this.setUrl(this.list[this.playIndex], true)
+          this.status = 'URL过期，正在刷新URL...'
+          return
+        }
 
-        // let urls = this.player_info.targetSong.urls
-        // if (urls && urls.some((url, index) => {
-        //   if (this.musicInfo.musicUrl.includes(url)) {
-        //     let newUrl = urls[index + 1]
-        //     if (!newUrl) return false
-        //     this.musicInfo.musicUrl = this.musicInfo.musicUrl.replace(url, newUrl)
-        //     // this.musicInfo.musicUrl = newUrl ? this.musicInfo.musicUrl.replace(url, newUrl) : this.setFormTag(this.musicInfo.musicUrl.replace(url, urls[0]))
-        //     return true
-        //   }
-        // })) {
-        //   this.audio.src = this.musicInfo.musicUrl
-        //   // console.log(this.musicInfo.musicUrl)
-        // } else {
-        //   this.handleNext()
-        // }
-        this.handleNext()
+        this.sendProgressEvent(this.progress, 'error')
+        this.status = '音频加载出错，5 秒后切换下一首'
+        this.addDelayNextTimeout()
       })
       this.audio.addEventListener('loadeddata', () => {
         this.maxPlayTime = this.audio.duration
+        if (this.audioErrorTime) {
+          this.audio.currentTime = this.audioErrorTime
+          this.audioErrorTime = 0
+        }
+        if (!this.targetSong.interval && this.listId != 'download') this.updateMusicInfo({ index: this.playIndex, data: { interval: formatPlayTime2(this.maxPlayTime) } })
+        this.status = '音乐加载中...'
+      })
+      this.audio.addEventListener('loadstart', () => {
         this.status = '音乐加载中...'
       })
-      // this.audio.addEventListener('loadstart', () => {
-      //   this.status = '开始加载音乐信息...'
-      // })
       this.audio.addEventListener('canplay', () => {
         console.log('加载完成开始播放')
         // if (this.musicInfo.lrc) this.lyric.lrc.play(this.audio.currentTime * 1000)
@@ -225,7 +257,10 @@ export default {
     },
     play() {
       console.log('play', this.playIndex)
-      let targetSong = this.list[this.playIndex]
+      this.checkDelayNextTimeout()
+      let targetSong = this.targetSong = this.list[this.playIndex]
+      this.retryNum = 0
+      this.audioErrorTime = 0
 
       if (this.listId == 'download') {
         if (!checkPath(targetSong.filePath) || !targetSong.isComplate || /\.ape$/.test(targetSong.filePath)) {
@@ -247,48 +282,74 @@ export default {
         this.setLrc(targetSong)
       }
     },
+    checkDelayNextTimeout() {
+      // console.log(this.delayNextTimeout)
+      if (this.delayNextTimeout) {
+        clearTimeout(this.delayNextTimeout)
+        this.delayNextTimeout = null
+      }
+    },
+    addDelayNextTimeout() {
+      this.checkDelayNextTimeout()
+      this.delayNextTimeout = setTimeout(() => {
+        this.delayNextTimeout = null
+        this.handleNext()
+      }, 5000)
+    },
     handleNext() {
       // if (this.list.listName === null) return
-      if (!this.list.length) return
+      let list
+      if (this.listId == 'download') {
+        list = this.list.filter(s => !(!checkPath(s.filePath) || !s.isComplate || /\.ape$/.test(s.filePath)))
+      } else if (this.isAPITemp) {
+        list = this.list.filter(s => s.source == 'kw')
+      } else {
+        list = this.list
+      }
+      if (!list.length) return this.setPlayIndex(-1)
+      let playIndex = this.list === list ? this.playIndex : list.indexOf(this.list[this.playIndex])
+      // console.log(playIndex)
       let index
       switch (this.setting.player.togglePlayMethod) {
         case 'listLoop':
-          index = this.hanldeListLoop()
+          index = this.hanldeListLoop(list, playIndex)
           break
         case 'random':
-          index = this.hanldeListRandom()
+          index = this.hanldeListRandom(list, playIndex)
           break
         case 'list':
-          index = this.hanldeListNext()
+          index = this.hanldeListNext(list, playIndex)
           break
         default:
           return
       }
       if (index < 0) return
+      if (this.list !== list) index = this.list.indexOf(list[index])
       this.setPlayIndex(index)
     },
-    hanldeListLoop() {
-      return this.playIndex === this.list.length - 1 ? 0 : this.playIndex + 1
+    hanldeListLoop(list, index) {
+      return index === list.length - 1 ? 0 : index + 1
     },
-    hanldeListNext() {
-      return this.playIndex === this.list.length - 1 ? -1 : this.playIndex + 1
+    hanldeListNext(list, index) {
+      return index === list.length - 1 ? -1 : index + 1
     },
-    hanldeListRandom() {
-      return getRandom(0, this.list.length)
+    hanldeListRandom(list, index) {
+      return getRandom(0, list.length)
     },
     startPlay() {
       this.isPlay = true
       if (this.musicInfo.lrc) this.lyric.lrc.play(this.audio.currentTime * 1000)
-      this.setAppName()
+      this.setAppTitle()
       this.sendProgressEvent(this.progress, 'normal')
     },
     stopPlay() {
       this.isPlay = false
       this.lyric.lrc.pause()
       this.sendProgressEvent(this.progress, 'paused')
-      this.clearAppName()
+      this.clearAppTitle()
     },
     setProgess(e) {
+      if (!this.audio.src) return
       this.audio.currentTime =
         (e.offsetX / this.pregessWidth) * this.maxPlayTime
       if (!this.isPlay) this.audio.play()
@@ -307,22 +368,27 @@ export default {
       this.musicInfo.img = null
     },
     getPlayType(highQuality, songInfo) {
+      switch (songInfo.source) {
+        case 'wy':
+        // case 'kg':
+          return '128k'
+      }
       let type = songInfo._types['192k'] ? '192k' : '128k'
       if (highQuality && songInfo._types['320k']) type = '320k'
       return type
     },
-    setUrl(targetSong) {
+    setUrl(targetSong, isRefresh) {
       let type = this.getPlayType(this.setting.player.highQuality, targetSong)
       this.musicInfo.url = targetSong.typeUrl[type]
+      this.status = '歌曲链接获取中...'
 
-      let urlP = this.musicInfo.url
-        ? Promise.resolve()
-        : this.getUrl({ musicInfo: targetSong, type }).then(() => {
-          this.musicInfo.url = targetSong.typeUrl[type]
-        })
-
-      urlP.then(() => {
-        this.audio.src = this.musicInfo.url
+      return this.getUrl({ musicInfo: targetSong, type, isRefresh }).then(() => {
+        this.audio.src = this.musicInfo.url = targetSong.typeUrl[type]
+      }).catch(err => {
+        if (err.message == requestMsg.cancelRequest) return
+        this.status = err.message
+        this.addDelayNextTimeout()
+        return Promise.reject(err)
       })
     },
     setImg(targetSong) {
@@ -335,21 +401,21 @@ export default {
       }
     },
     setLrc(targetSong) {
-      this.musicInfo.lrc = targetSong.lyric
+      this.musicInfo.lrc = targetSong.lrc
 
       let lrcP = this.musicInfo.lrc
         ? Promise.resolve()
         : this.getLrc(targetSong).then(() => {
-          this.musicInfo.lrc = targetSong.lyric
+          this.musicInfo.lrc = targetSong.lrc
         })
 
       lrcP
         .then(() => {
           this.lyric.lrc.setLyric(this.musicInfo.lrc)
-          if (this.isPlay) this.lyric.lrc.play(this.audio.currentTime * 1000)
+          if (this.isPlay && (this.musicInfo.url || this.listId == 'download')) this.lyric.lrc.play(this.audio.currentTime * 1000)
         })
-        .catch(err => {
-          this.status = err.message
+        .catch(() => {
+          this.status = '歌词获取失败'
         })
     },
     handleRemoveMusic() {
@@ -367,18 +433,27 @@ export default {
     },
     sendProgressEvent(status, mode) {
       // console.log(status)
-      rendererSend('progress', {
+      this.setting.player.isShowTaskProgess && rendererSend('progress', {
         status: status < 0.01 ? 0.01 : status,
         mode: mode || 'normal',
       })
     },
-    setAppName() {
-    //   rendererSend('appName', {
-    //     name: `${this.musicInfo.name} - ${this.musicInfo.singer}`,
-    //   })
+    setAppTitle() {
+      setTitle(`${this.musicInfo.name} - ${this.musicInfo.singer}`)
     },
-    clearAppName() {
-      // rendererSend('appName')
+    clearAppTitle() {
+      setTitle()
+    },
+    handleChangeVolume(e) {
+      let val = e.offsetX / 70
+      if (val < 0) val = 0
+      if (val > 1) val = 1
+      if (val > 0.97) val = 1
+      this.volume = val
+      if (this.audio) this.audio.volume = this.volume
+    },
+    handleSaveVolume(volume) {
+      this.setVolume(volume)
     },
   },
 }
@@ -451,6 +526,40 @@ export default {
   .mixin-ellipsis-1;
 }
 
+.volume-content {
+  width: 100px;
+  display: flex;
+  align-items: center;
+  padding: 0 15px;
+}
+
+.volume {
+  cursor: pointer;
+  width: 100%;
+  height: 0.25em;
+  border-radius: 10px;
+  // overflow: hidden;
+  transition: @transition-theme;
+  transition-property: background-color;
+  background-color: @color-player-progress;
+  // background-color: #f5f5f5;
+  position: relative;
+  border-radius: @radius-progress-border;
+}
+
+.volume-bar {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 0;
+  height: 100%;
+  border-radius: @radius-progress-border;
+  transition-duration: 0.2s;
+  background-color: @color-theme;
+  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
+  opacity: .5;
+}
+
 .play-btn {
   + .play-btn {
     margin-left: 10px;
@@ -571,6 +680,14 @@ each(@themes, {
         filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.3));
       }
     }
+    .volume {
+      background-color: ~'@{color-@{value}-player-progress}';
+    }
+
+    .volume-bar {
+      background-color: ~'@{color-@{value}-theme}';
+      box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
+    }
 
 
     .progress {

src/renderer/components/material/Btn.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  button(:class="[$style.btn, min ? $style.min : '']" @click="$emit('click', $event)")
+  button(:class="[$style.btn, min ? $style.min : '']" :disabled="disabled" @click="$emit('click', $event)")
     slot
 </template>
 
@@ -9,6 +9,10 @@ export default {
     min: {
       type: Boolean,
     },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
   },
 }
 </script>
@@ -27,6 +31,9 @@ export default {
   outline: none;
   transition: background-color 0.2s ease;
   background-color: @color-btn-background;
+  &[disabled] {
+    opacity: .4;
+  }
 
   &:hover {
     background-color: @color-theme_2-hover;

src/renderer/components/material/Checkbox.vue

@@ -1,18 +1,26 @@
 <template lang="pug">
 div(:class="$style.checkbox")
-  input(:type="need ? 'radio' : 'checkbox'" :id="id" :value="target" :name="name" @change="change" v-model="val")
+  input(:type="need ? 'radio' : 'checkbox'" :id="id" :disabled="disabled" :value="value" :name="name" @change="change" v-model="bool")
   label(:for="id" :class="$style.content")
-    div
+    div(v-if="indeterminate")
+      svg(v-show="indeterminate" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 32 448 448' space='preserve')
+        use(xlink:href='#icon-check-indeterminate')
+      svg(v-show="!indeterminate" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 0 448 512' space='preserve')
+        use(xlink:href='#icon-check-true')
+    div(v-else)
       svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' width="100%" viewBox='0 32 448 448' space='preserve')
-        use(xlink:href='#icon-check')
-    span
-      slot
+        use(xlink:href='#icon-check-true')
+    span(v-if="label != null" v-html="label")
 </template>
 
 <script>
 export default {
+  model: {
+    prop: 'checked',
+    event: 'input',
+  },
   props: {
-    target: {},
+    checked: {},
     value: {},
     id: {
       type: String,
@@ -25,41 +33,73 @@ export default {
       type: Boolean,
       default: false,
     },
+    label: {},
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+    indeterminate: {
+      type: Boolean,
+      default: false,
+    },
   },
   data() {
     return {
-      val: false,
+      bool: false,
     }
   },
   watch: {
-    value(n) {
-      if (this.target && n !== this.target) {
-        this.val = this.need
-          ? n === this.target
-            ? this.target
-            : false
-          : n === this.target
-      } else if (n !== this.val) {
-        this.val = n
-      }
+    checked(n) {
+      this.setValue(n)
     },
   },
   mounted() {
-    if (this.target) {
-      this.val = this.need
-        ? this.value === this.target
-          ? this.target
-          : false
-        : this.value === this.target
-    } else {
-      this.val = this.value
-    }
+    this.setValue(this.checked)
   },
   methods: {
     change() {
-      let val = this.target == null ? this.val : this.val ? this.target : null
-      this.$emit('input', val)
-      this.$emit('change', val)
+      let checked
+      if (Array.isArray(this.checked)) {
+        checked = [...this.checked]
+        const index = checked.indexOf(this.value)
+        if (index < 0) {
+          checked.push(this.value)
+        } else {
+          checked.splice(index, 1)
+        }
+      } else if (typeof this.checked == 'string') {
+        checked = this.bool ? this.value : ''
+      } else if (typeof this.checked == 'boolean') {
+        let bool = this.bool
+        if (this.indeterminate) {
+          bool = true
+          this.$nextTick(() => {
+            this.bool = true
+          })
+        }
+        checked = bool
+      }
+      this.$emit('input', checked)
+      this.$emit('change', checked)
+    },
+    setValue(value) {
+      let bool
+      if (Array.isArray(value)) {
+        bool = value.includes(this.value)
+      } else {
+        switch (typeof value) {
+          case 'string':
+            bool = value === this.value
+            break
+          case 'boolean':
+            bool = value
+            break
+          default:
+            return
+        }
+      }
+
+      this.bool = this.need ? bool && this.value : bool
     },
   },
 }
@@ -75,6 +115,11 @@ export default {
 
   > input {
     display: none;
+    &[disabled] {
+      + .content {
+        opacity: .5;
+      }
+    }
     &:checked {
       + .content {
         > div {

src/renderer/components/material/DownloadModal.vue

@@ -5,7 +5,7 @@ material-modal(:show="show" :bg-close="bgClose" @close="handleClose")
       | {{ info.name }}
       br
       | {{ info.singer }}
-    material-btn(:class="$style.btn" :key="type.type" @click="handleClick(type.type)" v-for="type in info.types") {{getTypeName(type.type)}} {{ type.type.toUpperCase() }}{{ type.size && ` - ${type.size.toUpperCase()}` }}
+    material-btn(:class="$style.btn" :title="!checkSource(type.type) && '目前网易云音源仅支持下载128k音质'" :disabled="!checkSource(type.type)" :key="type.type" @click="handleClick(type.type)" v-for="type in info.types") {{getTypeName(type.type)}} {{ type.type.toUpperCase() }}{{ type.size && ` - ${type.size.toUpperCase()}` }}
 
 </template>
 
@@ -49,6 +49,16 @@ export default {
           return '普通音质'
       }
     },
+    checkSource(type) {
+      switch (this.musicInfo.source) {
+        case 'wy':
+        // case 'kg':
+          return type == '128k'
+
+        default:
+          return true
+      }
+    },
   },
 }
 </script>

src/renderer/components/material/DownloadMultipleModal.vue

@@ -0,0 +1,82 @@
+<template lang="pug">
+material-modal(:show="show" :bg-close="bgClose" @close="handleClose")
+  main(:class="$style.main")
+    h2
+      | 已选择 {{list.length}} 首歌曲
+      br
+      | 请选择要优先下载的音质
+    material-btn(:class="$style.btn" @click="handleClick('128k')") 普通音质 - 128K
+    material-btn(:class="$style.btn" @click="handleClick('320k')") 高品音质 - 320K
+    material-btn(:class="$style.btn" @click="handleClick('ape')") 无损音质 - APE
+    material-btn(:class="$style.btn" @click="handleClick('flac')") 无损音质 - FLAC
+</template>
+
+<script>
+
+export default {
+  props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
+    bgClose: {
+      type: Boolean,
+      default: true,
+    },
+    list: {
+      type: Array,
+      default() {
+        return []
+      },
+    },
+  },
+  methods: {
+    handleClick(type) {
+      this.$emit('select', type)
+    },
+    handleClose() {
+      this.$emit('close')
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../../assets/styles/layout.less';
+
+.main {
+  padding: 15px;
+  max-width: 300px;
+  min-width: 200px;
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  h2 {
+    font-size: 13px;
+    color: @color-theme_2-font;
+    line-height: 1.3;
+    text-align: center;
+    margin-bottom: 15px;
+  }
+}
+
+.btn {
+  display: block;
+  margin-bottom: 15px;
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+each(@themes, {
+  :global(#container.@{value}) {
+    .main {
+      h2 {
+        color: ~'@{color-@{value}-theme_2-font}';
+      }
+    }
+  }
+})
+
+</style>

src/renderer/components/material/FlowBtn.vue

@@ -0,0 +1,122 @@
+<template lang="pug">
+transition(enter-active-class="animated-fast zoomIn" leave-active-class="animated zoomOut")
+  div(:class="$style.btns" v-show="show")
+    button(type="button" v-if="playBtn" title="播放" @click.stop="handleClick('play')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 287.386 287.386' space='preserve')
+        use(xlink:href='#icon-testPlay')
+    button(type="button" v-if="addBtn" title="添加" @click.stop="handleClick('add')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 42 42' space='preserve')
+        use(xlink:href='#icon-addTo')
+    button(type="button" v-if="downloadBtn" title="下载" @click.stop="handleClick('download')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 475.078 475.077' space='preserve')
+        use(xlink:href='#icon-download')
+    button(type="button" v-if="startBtn" title="开始" @click.stop="handleClick('start')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 170 170' space='preserve')
+        use(xlink:href='#icon-play')
+    button(type="button" v-if="pauseBtn" title="暂停" @click.stop="handleClick('pause')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 277.338 277.338' space='preserve')
+        use(xlink:href='#icon-pause')
+    button(type="button" v-if="removeBtn" title="移除" @click.stop="handleClick('remove')")
+      svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 212.982 212.982' space='preserve')
+        use(xlink:href='#icon-delete')
+
+</template>
+
+<script>
+
+export default {
+  props: {
+    removeBtn: {
+      type: Boolean,
+      default: true,
+    },
+    startBtn: {
+      type: Boolean,
+      default: false,
+    },
+    pauseBtn: {
+      type: Boolean,
+      default: false,
+    },
+    downloadBtn: {
+      type: Boolean,
+      default: true,
+    },
+    addBtn: {
+      type: Boolean,
+      default: true,
+    },
+    playBtn: {
+      type: Boolean,
+      default: true,
+    },
+    show: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  methods: {
+    handleClick(action) {
+      this.$emit('btn-click', action)
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../../assets/styles/layout.less';
+
+.btns {
+  position: fixed;
+  bottom: 80px;
+  right: 30px;
+  background-color: @color-search-form-background;
+  border-radius: 5px;
+  // padding: 3px 5px;
+  box-shadow: 0 1px 5px 0 rgba(0,0,0,.2);
+  button {
+    background-color: transparent;
+    border: none;
+    border-radius: 3px;
+    margin-right: 5px;
+    cursor: pointer;
+    padding: 4px 7px;
+    color: @color-btn;
+    outline: none;
+    transition: background-color 0.2s ease;
+    line-height: 0;
+    &:last-child {
+      margin-right: 0;
+    }
+
+    svg {
+      height: 1.2em;
+    }
+
+    &:hover {
+      background-color: @color-theme_2-hover;
+    }
+    &:active {
+      background-color: @color-theme_2-active;
+    }
+  }
+}
+
+each(@themes, {
+  :global(#container.@{value}) {
+    .btns {
+      background-color: ~'@{color-@{value}-search-form-background}';
+      button {
+        color: ~'@{color-@{value}-btn}';
+        &:hover {
+          background-color: ~'@{color-@{value}-theme_2-hover}';
+        }
+        &:active {
+          background-color: ~'@{color-@{value}-theme_2-active}';
+        }
+      }
+    }
+  }
+})
+</style>

src/renderer/components/material/InputRange.vue

@@ -0,0 +1,80 @@
+<template lang="pug">
+  input(type="range" :class="[$style.range, min ? $style.min : '']" :disabled="disabled" v-model="val" input="handleInput" @change="handleChange")
+</template>
+
+<script>
+export default {
+  props: {
+    min: {
+      type: Boolean,
+    },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
+    value: {
+      type: Number,
+      default: 0,
+    },
+  },
+  data() {
+    return {
+      val: 0,
+    }
+  },
+  mounted() {
+    this.val = this.value
+  },
+  methods: {
+    handleChange(e) {
+      this.$emit('input', this.val)
+      this.$emit('change', e)
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../../assets/styles/layout.less';
+
+.range {
+  display: inline-block;
+  border-radius: .25em;
+  cursor: pointer;
+  color: @color-btn;
+  outline: none;
+  background: transparent;
+  // background-color: @color-btn-background;
+  &[disabled] {
+    opacity: .4;
+  }
+
+  &:hover {
+    background-color: @color-theme_2-hover;
+  }
+  &:active {
+    background-color: @color-theme_2-active;
+  }
+}
+
+.min {
+
+}
+
+// each(@themes, {
+//   :global(#container.@{value}) {
+//     .btn {
+//       color: ~'@{color-@{value}-btn}';
+//       background-color: ~'@{color-@{value}-btn-background}';
+//       &:hover {
+//         background-color: ~'@{color-@{value}-theme_2-hover}';
+//       }
+//       &:active {
+//         background-color: ~'@{color-@{value}-theme_2-active}';
+//       }
+//     }
+//   }
+// })
+
+</style>

src/renderer/components/material/ListButtons.vue

@@ -9,6 +9,12 @@ div(:class="$style.btns")
   button(type="button" title="添加" v-if="userInfo" @click.stop="handleClick('add')")
     svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 42 42' space='preserve')
       use(xlink:href='#icon-addTo')
+  button(type="button" v-if="startBtn" title="开始" @click.stop="handleClick('start')")
+    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 170 170' space='preserve')
+      use(xlink:href='#icon-play')
+  button(type="button" v-if="pauseBtn" title="暂停" @click.stop="handleClick('pause')")
+    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 277.338 277.338' space='preserve')
+      use(xlink:href='#icon-pause')
   button(type="button" v-if="removeBtn" title="移除" @click.stop="handleClick('remove')")
     svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 212.982 212.982' space='preserve')
       use(xlink:href='#icon-delete')
@@ -27,6 +33,14 @@ export default {
       type: Number,
       required: true,
     },
+    startBtn: {
+      type: Boolean,
+      default: false,
+    },
+    pauseBtn: {
+      type: Boolean,
+      default: false,
+    },
     removeBtn: {
       type: Boolean,
       default: true,

src/renderer/components/material/SongList.vue

@@ -0,0 +1,235 @@
+<template lang="pug">
+div(:class="$style.songList")
+  transition(enter-active-class="animated fadeIn" leave-active-class="animated fadeOut")
+    div(v-if="list.length" :class="$style.list")
+      div(:class="$style.thead")
+        table
+          thead
+            tr
+              th.nobreak.center(style="width: 37px;")
+                material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
+                  :indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
+              th.nobreak(style="width: 25%;") 歌曲名
+              th.nobreak(style="width: 20%;") 歌手
+              th.nobreak(style="width: 22%;") 专辑
+              th.nobreak(style="width: 18%;") 操作
+              th.nobreak(style="width: 10%;") 时长
+      div.scroll(:class="$style.tbody" ref="dom_scrollContent")
+        table
+          tbody
+            tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)")
+              td.nobreak.center(style="width: 37px;" @click.stop)
+                material-checkbox(:id="index.toString()" v-model="selectdList" @change="handleChangeSelect" :value="item")
+              td.break(style="width: 25%;")
+                | {{item.name}}
+                span.badge.badge-info(v-if="item._types['320k']") 高品质
+                span.badge.badge-success(v-if="item._types.ape || item._types.flac") 无损
+              td.break(style="width: 20%;") {{item.singer}}
+              td.break(style="width: 22%;") {{item.albumName}}
+              td(style="width: 18%;")
+                material-list-buttons(:index="index" :search-btn="true" :play-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :download-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :remove-btn="false" @btn-click="handleListBtnClick")
+                //- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
+                //- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
+                //- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') ＋
+              td(style="width: 10%;") {{item.interval || '--/--'}}
+        div(:class="$style.pagination")
+          material-pagination(:count="total" :limit="limit" :page="page" @btn-click="handleTogglePage")
+    div(v-else :class="$style.noitem")
+      p(v-html="noItem")
+  material-flow-btn(:show="isShowEditBtn && (source == 'kw' || !isAPITemp)" :remove-btn="false" @btn-click="handleFlowBtnClick")
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { scrollTo } from '../../utils'
+export default {
+  name: 'MaterialSongList',
+  model: {
+    prop: 'selectdData',
+    event: 'input',
+  },
+  props: {
+    list: {
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    page: {
+      type: Number,
+      required: true,
+    },
+    limit: {
+      type: Number,
+      required: true,
+    },
+    total: {
+      type: Number,
+      required: true,
+    },
+    selectdData: {
+      type: Array,
+      required: true,
+    },
+    source: {
+      type: String,
+    },
+    noItem: {
+      type: String,
+      default: '列表加载中...',
+    },
+  },
+  computed: {
+    ...mapGetters(['setting']),
+    isAPITemp() {
+      return this.setting.apiSource == 'temp'
+    },
+  },
+  watch: {
+    selectdList(n) {
+      const len = n.length
+      if (len) {
+        this.isSelectAll = true
+        this.isIndeterminate = len !== this.list.length
+        this.isShowEditBtn = true
+      } else {
+        this.isSelectAll = false
+        this.isShowEditBtn = false
+      }
+    },
+    selectdData(n) {
+      const len = n.length
+      if (len) {
+        this.isSelectAll = true
+        this.isIndeterminate = len !== this.list.length
+        this.isShowEditBtn = true
+        this.selectdList = [...n]
+      } else {
+        this.isSelectAll = false
+        this.isShowEditBtn = false
+        this.resetSelect()
+      }
+    },
+    list(n) {
+      this.resetSelect()
+      if (!this.list.length) return
+      this.$nextTick(() => scrollTo(this.$refs.dom_scrollContent, 0))
+    },
+  },
+  data() {
+    return {
+      clickTime: 0,
+      clickIndex: -1,
+      isSelectAll: false,
+      isIndeterminate: false,
+      isShowEditBtn: false,
+      selectdList: [],
+    }
+  },
+  methods: {
+    handleDoubleClick(index) {
+      if (
+        window.performance.now() - this.clickTime > 400 ||
+        this.clickIndex !== index
+      ) {
+        this.clickTime = window.performance.now()
+        this.clickIndex = index
+        return
+      }
+      this.emitEvent((this.source == 'kw' || (!this.isAPITemp && this.list[index].source != 'tx')) ? 'testPlay' : 'search', index)
+      this.clickTime = 0
+      this.clickIndex = -1
+    },
+    handleListBtnClick(info) {
+      this.emitEvent('listBtnClick', info)
+    },
+    handleSelectAllData(isSelect) {
+      this.selectdList = isSelect ? [...this.list] : []
+      this.$emit('input', [...this.selectdList])
+    },
+    resetSelect() {
+      this.selectdList = false
+      this.selectdList = []
+    },
+    handleTogglePage(page) {
+      this.emitEvent('togglePage', page)
+    },
+    handleFlowBtnClick(action) {
+      this.emitEvent('flowBtnClick', action)
+    },
+    emitEvent(action, data) {
+      this.$emit('action', { action, data })
+    },
+    handleChangeSelect() {
+      this.$emit('input', [...this.selectdList])
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../../assets/styles/layout.less';
+.song-list {
+  overflow: hidden;
+  height: 100%;
+  display: flex;
+  flex-flow: column nowrap;
+  background-color: @color-theme_2;
+}
+
+.list {
+  position: relative;
+  font-size: 14px;
+  overflow: hidden;
+  display: flex;
+  flex-flow: column nowrap;
+}
+.thead {
+  flex: none;
+}
+.tbody {
+  flex: auto;
+  overflow-y: auto;
+  td {
+    font-size: 12px;
+    :global(.badge) {
+      margin-right: 3px;
+      &:first-child {
+        margin-left: 3px;
+      }
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+  }
+}
+.pagination {
+  text-align: center;
+  padding: 15px 0;
+  // left: 50%;
+  // transform: translateX(-50%);
+}
+.noitem {
+  position: relative;
+  height: 100%;
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  align-items: center;
+
+  p {
+    font-size: 24px;
+    color: #ccc;
+  }
+}
+
+each(@themes, {
+  :global(#container.@{value}) {
+    .thead {
+      background-color: ~'@color-@{value}-theme_2';
+    }
+  }
+})
+
+</style>

src/renderer/components/material/TagList.vue

@@ -0,0 +1,215 @@
+<template lang="pug">
+  div(:class="$style.tagList")
+    div(:class="$style.label" ref="dom_btn" @click="handleShow") {{value.name}}
+    div.scroll(:class="$style.list" @click.stop ref="dom_list" :style="listStyle")
+      div(:class="$style.tag" @click="handleClick(null)") 默认
+      dl(v-for="type in list")
+        dt(:class="$style.type") {{type.name}}
+        dd(:class="$style.tag" v-for="tag in type.list" @click="handleClick(tag)") {{tag.name}}
+</template>
+
+<script>
+// import { isChildren } from '../../utils'
+export default {
+  props: {
+    list: {
+      type: Array,
+      default() {
+        return []
+      },
+    },
+    value: {
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      show: false,
+      listStyle: {
+        height: 0,
+        opacity: 0,
+      },
+    }
+  },
+  watch: {
+    show(n) {
+      this.$nextTick(() => {
+        if (n) {
+          let sh = this.$refs.dom_list.scrollHeight
+          this.listStyle.height = (sh > 250 ? 250 : sh) + 'px'
+          this.listStyle.opacity = 1
+          this.listStyle.overflow = 'auto'
+        } else {
+          this.listStyle.height = 0
+          this.listStyle.opacity = 0
+        }
+      })
+    },
+    list() {
+      this.$refs.dom_list.scrollTop = 0
+    },
+  },
+  mounted() {
+    document.addEventListener('click', this.handleHide)
+  },
+  beforeDestroy() {
+    document.removeEventListener('click', this.handleHide)
+  },
+  methods: {
+    handleHide(e) {
+      // if (e && e.target.parentNode != this.$refs.dom_list && this.show) return this.show = false
+      if (e && e.target == this.$refs.dom_btn) return
+      setTimeout(() => {
+        this.show = false
+      }, 50)
+    },
+    handleClick(item) {
+      if (!item) {
+        item = {
+          name: '默认',
+          id: null,
+        }
+      }
+      if (item.id === this.value.id) return this.handleShow()
+      this.$emit('input', item)
+      this.$emit('change', item)
+      this.handleShow()
+    },
+    handleShow() {
+      this.show = !this.show
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../../assets/styles/layout.less';
+
+.tag-list {
+  font-size: 12px;
+  position: relative;
+}
+
+.label {
+  padding: 8px 15px;
+  // background-color: @color-btn-background;
+  transition: background-color @transition-theme;
+  border-top: 2px solid @color-tab-border-bottom;
+  // border-left: 2px solid @color-tab-border-bottom;
+  box-sizing: border-box;
+  text-align: center;
+  // border-top-left-radius: 3px;
+  color: @color-btn;
+  cursor: pointer;
+
+  &:hover {
+    background-color: @color-theme_2-hover;
+  }
+  &:active {
+    background-color: @color-theme_2-active;
+  }
+}
+
+.list {
+  position: absolute;
+  top: 100%;
+  width: 646px;
+  left: 0;
+  border-bottom: 2px solid @color-tab-border-bottom;
+  border-right: 2px solid @color-tab-border-bottom;
+  border-bottom-right-radius: 5px;
+  background-color: @color-theme_2;
+  overflow: hidden;
+  opacity: 0;
+  transition: .25s ease;
+  transition-property: height, opacity;
+  z-index: 10;
+  padding: 10px;
+  box-sizing: border-box;
+
+  li {
+    cursor: pointer;
+    padding: 8px 15px;
+    // color: @color-btn;
+    text-align: center;
+    outline: none;
+    transition: background-color @transition-theme;
+    background-color: @color-btn-background;
+    box-sizing: border-box;
+
+    &:hover {
+      background-color: @color-theme_2-hover;
+    }
+    &:active {
+      background-color: @color-theme_2-active;
+    }
+  }
+}
+
+.type {
+  padding-top: 10px;
+  padding-bottom: 3px;
+  color: #999;
+}
+
+.tag {
+  display: inline-block;
+  margin: 5px;
+  background-color: @color-btn-background;
+  padding: 8px 10px;
+  border-radius: @radius-progress-border;
+  transition: background-color @transition-theme;
+  cursor: pointer;
+  &:hover {
+    background-color: @color-theme_2-hover;
+  }
+  &:active {
+    background-color: @color-theme_2-active;
+  }
+}
+
+
+each(@themes, {
+  :global(#container.@{value}) {
+    .label {
+      border-top-color: ~'@{color-@{value}-tab-border-bottom}';
+      // border-left-color: ~'@{color-@{value}-tab-border-bottom}';
+      color: ~'@{color-@{value}-btn}';
+      &:hover {
+        background-color: ~'@{color-@{value}-theme_2-hover}';
+      }
+      &:active {
+        background-color: ~'@{color-@{value}-theme_2-active}';
+      }
+    }
+
+    .list {
+      border-bottom-color: ~'@{color-@{value}-tab-border-bottom}';
+      border-right-color: ~'@{color-@{value}-tab-border-bottom}';
+      // border-left-color: ~'@{color-@{value}-tab-border-bottom}';
+      li {
+        // color: ~'@{color-@{value}-btn}';
+        background-color: ~'@{color-@{value}-btn-background}';
+        &:hover {
+          background-color: ~'@{color-@{value}-theme_2-hover}';
+        }
+        &:active {
+          background-color: ~'@{color-@{value}-theme_2-active}';
+        }
+      }
+    }
+
+    .tag {
+      background-color: ~'@{color-@{value}-btn-background}';
+      &:hover {
+        background-color: ~'@{color-@{value}-theme_2-hover}';
+      }
+      &:active {
+        background-color: ~'@{color-@{value}-theme_2-active}';
+      }
+    }
+  }
+})
+
+</style>

src/renderer/components/material/VersionModal.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
 material-modal(:show="version.showModal" @close="handleClose")
   main(:class="$style.main" v-if="version.newVersion")
-    h2 🚀程序更新🚀
+    h2 {{ version.isError ? isUnknow ? '❓ 版本信息获取失败 ❓' : '🌟发现新版本🌟' : '🚀程序更新🚀'}}
 
     div.scroll(:class="$style.info")
       div(:class="$style.current")
@@ -15,7 +15,20 @@ material-modal(:show="version.showModal" @close="handleClose")
           h4 v{{ver.version}}
           p(v-html="ver.desc")
 
-    div(:class="$style.footer")
+    div(:class="$style.footer" v-if="version.isError")
+      div(:class="$style.desc" v-if="!isUnknow")
+        p 发现有新版本啦，但是自动更新功能出问题了
+        p
+          | 如果你所用的软件是
+          strong 安装版
+          | ，可以到QQ群：830125506 反馈哦
+        p
+          | 你现在可以选择继续使用当前版本或
+          strong 去发布页下载新版本
+      div(:class="$style.btns")
+        material-btn(:class="$style.btn" @click.onec="handleIgnoreClick") 忽略该版本
+        material-btn(:class="$style.btn" @click.onec="handleOpenPageClick") 去下载新版本
+    div(:class="$style.footer" v-else)
       div(:class="$style.desc")
         p 新版本已下载完毕，
         p
@@ -24,18 +37,18 @@ material-modal(:show="version.showModal" @close="handleClose")
           | 或稍后
           strong 关闭程序时
           | 自动更新~
-      material-btn(:class="$style.btn" @click.onec="handleClick") 立即重启更新
+      material-btn(:class="$style.btn" @click.onec="handleRestartClick") 立即重启更新
 
 </template>
 
 <script>
 import { mapGetters, mapMutations } from 'vuex'
 import { rendererSend } from '../../../common/icp'
-import { checkVersion } from '../../utils'
+import { checkVersion, openUrl } from '../../utils'
 
 export default {
   computed: {
-    ...mapGetters(['version']),
+    ...mapGetters(['version', 'setting']),
     history() {
       if (!this.version.newVersion) return []
       let arr = []
@@ -46,13 +59,26 @@ export default {
 
       return arr
     },
+    isUnknow() {
+      return this.version.newVersion.version == '0.0.0'
+    },
   },
   methods: {
-    ...mapMutations(['setVersionVisible']),
+    ...mapMutations(['setVersionModalVisible', 'setSetting']),
     handleClose() {
-      this.setVersionVisible(false)
+      this.setVersionModalVisible({
+        isShow: false,
+      })
     },
-    handleClick(event) {
+    handleIgnoreClick(event) {
+      this.handleClose()
+      // event.target.disabled = true
+      this.setSetting(Object.assign({}, this.setting, { ignoreVersion: this.version.newVersion.version }))
+    },
+    handleOpenPageClick() {
+      openUrl('https://github.com/lyswhut/lx-music-desktop')
+    },
+    handleRestartClick(event) {
       this.handleClose()
       event.target.disabled = true
       rendererSend('quit-update')
@@ -68,7 +94,7 @@ export default {
 .main {
   position: relative;
   padding: 15px;
-  max-width: 500px;
+  max-width: 450px;
   min-width: 300px;
   display: flex;
   flex-flow: column nowrap;
@@ -127,7 +153,7 @@ export default {
     h3 {
       padding: 5px 0 3px;
     }
-    padding-left: 15px;
+    padding: 0 15px;
     + .item {
       padding-top: 15px;
     }
@@ -156,6 +182,11 @@ export default {
   display: block;
   width: 100%;
 }
+.btns {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-gap: 0 10px;
+}
 
 each(@themes, {
   :global(#container.@{value}) {

src/renderer/route/paths.js

@@ -18,9 +18,9 @@ export default [
     view: 'Leaderboard',
   },
   {
-    path: '/recommend',
-    name: 'recommend',
-    view: 'Recommend',
+    path: '/songList',
+    name: 'songList',
+    view: 'SongList',
   },
   {
     path: '/list',

src/renderer/store/actions.js

@@ -5,8 +5,14 @@ import { author, name } from '../../../package.json'
 export default {
   getVersionInfo() {
     return new Promise((resolve, reject) => {
-      httpGet(`https://raw.githubusercontent.com/${author}/${name}/master/publish/version.json`, (err, resp, body) => {
-        if (err) return reject(err)
+      httpGet(`https://raw.githubusercontent.com/${author.name}/${name}/master/publish/version.json`, (err, resp, body) => {
+        if (err) {
+          return resolve({
+            version: '0.0.0',
+            desc: '<h3>版本信息获取失败</h3><ul><li>更新信息获取失败，可能是无法访问Github导致的，请手动检查更新！</li><li>检查方法：去设置-关于洛雪音乐打开<strong>开源地址</strong>或<strong>网盘地址</strong>查看<strong>版本号</strong>与当前版本对比是否最新</li></ul>',
+            history: [],
+          })
+        }
         resolve(body)
       })
     })

src/renderer/store/modules/download.js

@@ -2,18 +2,31 @@ import download from '../../utils/download'
 import fs from 'fs'
 import path from 'path'
 import music from '../../utils/music'
+import { getMusicType } from '../../utils/music/utils'
+import { setMeta, saveLrc } from '../../utils'
 
 // state
 const state = {
   list: [],
+  waitingList: [],
+  downloadStatus: {
+    RUN: 'run',
+    WAITING: 'waiting',
+    PAUSE: 'pause',
+    ERROR: 'error',
+    COMPLETED: 'completed',
+  },
 }
 
+
 const dls = {}
+const tryNum = {}
 
 // getters
 const getters = {
   list: state => state.list || [],
   dls: () => dls || {},
+  downloadStatus: state => state.downloadStatus,
 }
 
 const checkPath = path => {
@@ -40,19 +53,75 @@ const getExt = type => {
 
 const checkList = (list, musicInfo, type) => list.some(s => s.musicInfo.songmid === musicInfo.songmid && s.type === type)
 
-const refreshUrl = downloadInfo => {
-  return music[downloadInfo.musicInfo.source].getMusicUrl(downloadInfo.musicInfo, downloadInfo.type).promise
+const getStartTask = (list, downloadStatus, maxDownloadNum) => {
+  let downloadCount = 0
+  const waitList = list.filter(item => item.status == downloadStatus.WAITING ? true : (item.status === downloadStatus.RUN && ++downloadCount && false))
+  // console.log(downloadCount, waitList)
+  return downloadCount < maxDownloadNum && waitList.length > 0 && waitList.shift()
+}
+
+const addTask = (list, type, store) => {
+  window.requestAnimationFrame(() => {
+    let item = list.shift()
+    store.dispatch('download/createDownload', {
+      musicInfo: item,
+      type: getMusicType(item, type),
+    })
+    if (list.length) addTask(list, type, store)
+  })
+}
+
+const getUrl = (downloadInfo, isRefresh) => {
+  const url = downloadInfo.musicInfo.typeUrl[downloadInfo.type]
+  return url && !isRefresh ? Promise.resolve({ url }) : music[downloadInfo.musicInfo.source].getMusicUrl(downloadInfo.musicInfo, downloadInfo.type).promise
+}
+
+/**
+ * 设置歌曲meta信息
+ * @param {*} downloadInfo
+ * @param {*} filePath
+ * @param {*} isEmbedPic
+ */
+const saveMeta = (downloadInfo, filePath, isEmbedPic) => {
+  if (downloadInfo.type === 'ape') return
+  const promise = isEmbedPic
+    ? downloadInfo.musicInfo.img
+      ? Promise.resolve(downloadInfo.musicInfo.img)
+      : music[downloadInfo.musicInfo.source].getPic(downloadInfo.musicInfo).promise
+    : Promise.resolve()
+  promise.then(url => {
+    setMeta(filePath, {
+      title: downloadInfo.musicInfo.name,
+      artist: downloadInfo.musicInfo.singer,
+      album: downloadInfo.musicInfo.albumName,
+      APIC: url,
+    })
+  })
+}
+
+/**
+ * 保存歌词
+ * @param {*} downloadInfo
+ * @param {*} filePath
+ */
+const downloadLyric = (downloadInfo, filePath) => {
+  const promise = downloadInfo.musicInfo.lrc
+    ? Promise.resolve(downloadInfo.musicInfo.lrc)
+    : music[downloadInfo.musicInfo.source].getLyric(downloadInfo.musicInfo).promise
+  promise.then(lrc => {
+    if (lrc) saveLrc(filePath.replace(/(mp3|flac|ape)$/, 'lrc'), lrc)
+  })
 }
 
 // actions
 const actions = {
-  createDownload({ state, rootState }, { musicInfo, type }) {
+  createDownload({ state, rootState, commit }, { musicInfo, type }) {
     if (checkList(state.list, musicInfo, type)) return
     let ext = getExt(type)
     const downloadInfo = {
       isComplate: false,
-      isDownloading: false,
-      statusText: '任务初始化中',
+      status: state.downloadStatus.WAITING,
+      statusText: '待下载',
       url: null,
       fileName: `${rootState.setting.download.fileName
         .replace('歌名', musicInfo.name)
@@ -68,19 +137,33 @@ const actions = {
       key: `${musicInfo.songmid}${ext}`,
     }
     downloadInfo.filePath = path.join(rootState.setting.download.savePath, downloadInfo.fileName)
+    commit('addTask', downloadInfo)
     if (dls[downloadInfo.key]) {
       dls[downloadInfo.key].stop().finally(() => {
-        this.dispatch('download/addTask', downloadInfo)
+        delete dls[downloadInfo.key]
+        this.dispatch('download/startTask', downloadInfo)
       })
     } else {
       // console.log(downloadInfo)
-      this.dispatch('download/addTask', downloadInfo)
+      this.dispatch('download/startTask', downloadInfo)
     }
   },
-  addTask({ commit, rootState }, downloadInfo) {
-    commit('addTask', downloadInfo)
+  createDownloadMultiple({ state, rootState }, { list, type }) {
+    addTask([...list], type, this)
+  },
+  startTask({ commit, state, rootState }, downloadInfo) {
+    // 检查是否可以开始任务
+    if (downloadInfo && downloadInfo != state.downloadStatus.WAITING) commit('setStatus', { downloadInfo, status: state.downloadStatus.WAITING })
+    let result = getStartTask(state.list, state.downloadStatus, rootState.setting.download.maxDownloadNum)
+    if (!result) return
+    if (!downloadInfo) downloadInfo = result
+
+    // 开始任务
+    commit('onDownload', downloadInfo)
+    commit('setStatusText', { downloadInfo, text: '任务初始化中' })
     let msg = checkPath(rootState.setting.download.savePath)
     if (msg) return commit('setStatusText', '检查下载目录出错: ' + msg)
+    const _this = this
     const options = {
       url: downloadInfo.url,
       path: rootState.setting.download.savePath,
@@ -88,38 +171,59 @@ const actions = {
       method: 'get',
       override: true,
       onEnd() {
+        if (downloadInfo.progress.progress != '100.00') {
+          delete dls[downloadInfo.key]
+          return this.dispatch('download/startTask', downloadInfo)
+        }
         commit('onEnd', downloadInfo)
+        _this.dispatch('download/startTask')
+        const filePath = path.join(options.path, options.fileName)
+
+        saveMeta(downloadInfo, filePath, rootState.setting.download.isEmbedPic)
+        if (rootState.setting.download.isDownloadLrc) downloadLyric(downloadInfo, filePath)
         console.log('on complate')
       },
       onError(err) {
-        console.log(err)
-        if (err.message.includes('Response status was')) {
-          const code = err.message.replace(/Response status was (\d+)$/, '$1')
-          switch (code) {
-            case '401':
-            case '403':
-            case '410':
-              commit('setStatusText', { downloadInfo, text: '链接失效，正在刷新链接' })
-              refreshUrl(downloadInfo).then(result => {
-                commit('updateUrl', { downloadInfo, url: result.url })
-                commit('setStatusText', { downloadInfo, text: '链接刷新成功' })
-                dls[downloadInfo.key].url = dls[downloadInfo.key].requestURL = result.url
-                dls[downloadInfo.key].__initProtocol(result.url)
-                dls[downloadInfo.key].resume()
-              }).catch(err => {
-                console.log(err)
-              })
-              return
-
-            default:
-              break
-          }
-        }
+        // console.log(err.code, err.message)
         commit('onError', downloadInfo)
+        // console.log(tryNum[downloadInfo.key])
+        if (++tryNum[downloadInfo.key] > 5) {
+          _this.dispatch('download/startTask')
+          return
+        }
+        let code
+        if (err.message.includes('Response status was')) {
+          code = err.message.replace(/Response status was (\d+)$/, '$1')
+        } else if (err.code === 'ETIMEDOUT' || err.code == 'ENOTFOUND') {
+          code = err.code
+        } else {
+          console.log('Download failed, Attempting Retry')
+          dls[downloadInfo.key].resume()
+          commit('setStatusText', { downloadInfo, text: '正在重试' })
+          return
+        }
+        switch (code) {
+          case '401':
+          case '403':
+          case '410':
+          case 'ETIMEDOUT':
+          case 'ENOTFOUND':
+            commit('setStatusText', { downloadInfo, text: '链接失效，正在刷新链接' })
+            getUrl(downloadInfo, true).then(result => {
+              commit('updateUrl', { downloadInfo, url: result.url })
+              commit('setStatusText', { downloadInfo, text: '链接刷新成功' })
+              dls[downloadInfo.key].url = dls[downloadInfo.key].requestURL = result.url
+              dls[downloadInfo.key].__initProtocol(result.url)
+              dls[downloadInfo.key].resume()
+            }).catch(err => {
+              console.log(err)
+              _this.dispatch('download/startTask')
+            })
+        }
       },
-      onStateChanged(state) {
-        console.log(state)
-      },
+      // onStateChanged(state) {
+      //   console.log(state)
+      // },
       onDownload() {
         commit('onDownload', downloadInfo)
         console.log('on download')
@@ -130,88 +234,64 @@ const actions = {
       },
       onPause() {
         commit('pauseTask', downloadInfo)
+        _this.dispatch('download/startTask')
       },
       onResume() {
         commit('resumeTask', downloadInfo)
       },
     }
-    let p = options.url ? Promise.resolve() : refreshUrl(downloadInfo).then(result => {
+    commit('setStatusText', { downloadInfo, text: '获取URL中...' })
+    let p = options.url ? Promise.resolve() : getUrl(downloadInfo).then(result => {
       commit('updateUrl', { downloadInfo, url: result.url })
+      if (!result.url) return Promise.reject(new Error('获取URL失败'))
       options.url = result.url
     })
     p.then(() => {
+      tryNum[downloadInfo.key] = 0
       dls[downloadInfo.key] = download(options)
+    }).catch(err => {
+      // console.log(err.message)
+      commit('onError', downloadInfo)
+      commit('setStatusText', { downloadInfo, text: err.message })
+      this.dispatch('download/startTask')
     })
   },
+  // startTaskMultiple({ state, rootState }, list) {
+
+  // },
   removeTask({ commit, state }, index) {
     let info = state.list[index]
-    if (state.list[index].isDownloading) {
-      dls[info.key].stop().finally(() => {
-        delete dls[info.key]
-      })
+    if (state.list[index].status == state.downloadStatus.RUN) {
+      if (dls[info.key]) {
+        dls[info.key].stop().finally(() => {
+          delete dls[info.key]
+        })
+      }
     }
     commit('removeTask', index)
     if (dls[info.key]) delete dls[info.key]
+    this.dispatch('download/startTask')
   },
-  resumeTask({ commit, rootState }, downloadInfo) {
-    let msg = checkPath(rootState.setting.download.savePath)
-    if (msg) return commit('setStatusText', '检查下载目录出错: ' + msg)
-    const options = {
-      url: downloadInfo.url,
-      path: rootState.setting.download.savePath,
-      fileName: downloadInfo.fileName,
-      method: 'get',
-      override: true,
-      onEnd() {
-        commit('onEnd', downloadInfo)
-        console.log('on complate')
-      },
-      onError(err) {
-        commit('onError', downloadInfo)
-        commit('setStatusText', { downloadInfo, text: '链接失效，正在刷新链接' })
-        refreshUrl(downloadInfo).then(result => {
-          commit('updateUrl', { downloadInfo, url: result.url })
-          commit('setStatusText', { downloadInfo, text: '链接刷新成功' })
-          dls[downloadInfo.key].url = dls[downloadInfo.key].requestURL = result.url
-          dls[downloadInfo.key].__initProtocol(result.url)
-          dls[downloadInfo.key].resume()
-        }).catch(err => {
-          console.log(err)
-        })
-        console.log(err)
-      },
-      onStateChanged(state) {
-        console.log(state)
-      },
-      onDownload() {
-        commit('onDownload', downloadInfo)
-        console.log('on download')
-      },
-      onProgress(status) {
-        commit('onProgress', { downloadInfo, status })
-        console.log(status)
-      },
-      onPause() {
-        commit('pauseTask', downloadInfo)
-      },
-      onResume() {
-        commit('resumeTask', downloadInfo)
-      },
-    }
-
-    let p = options.url ? Promise.resolve() : refreshUrl(downloadInfo).then(result => {
-      commit('updateUrl', { downloadInfo, url: result.url })
-      options.url = result.url
-    })
-
-    if (fs.existsSync(downloadInfo.filePath)) {
-      options.resumeInfo = {
-        totalFileSize: downloadInfo.progress.total,
+  removeTaskMultiple({ commit, rootState, state }, list) {
+    list.forEach(item => {
+      let index = state.list.indexOf(item)
+      if (index < 0) return
+      // this.dispatch('download/removeTask', index)
+      if (state.list[index].status == state.downloadStatus.RUN) {
+        if (dls[item.key]) {
+          dls[item.key].stop().finally(() => {
+            delete dls[item.key]
+          })
+        }
       }
-    }
-    p.then(() => {
-      dls[downloadInfo.key] = download(options)
+      commit('removeTask', index)
+      if (dls[item.key]) delete dls[item.key]
     })
+    let result = getStartTask(state.list, state.downloadStatus, rootState.setting.download.maxDownloadNum)
+    while (result) {
+      this.dispatch('download/startTask', result)
+      result = getStartTask(state.list, state.downloadStatus, rootState.setting.download.maxDownloadNum)
+    }
   },
 }
 
@@ -224,29 +304,57 @@ const mutations = {
     state.list.splice(index, 1)
   },
   pauseTask(state, downloadInfo) {
-    downloadInfo.isDownloading = false
+    downloadInfo.status = state.downloadStatus.PAUSE
+    downloadInfo.statusText = '暂停下载'
   },
   resumeTask(state, downloadInfo) {
-    downloadInfo.statusText = '恢复下载'
+    downloadInfo.statusText = '开始下载'
   },
-  setStatusText(state, { downloadInfo, index, text }) {
+  setStatusText(state, { downloadInfo, index, text }) { // 设置状态文本
     if (downloadInfo) {
       downloadInfo.statusText = text
     } else {
       state.list[index].statusText = text
     }
   },
+  setStatus(state, { downloadInfo, index, status }) { // 设置状态及状态文本
+    let text
+    switch (status) {
+      case state.downloadStatus.RUN:
+        text = '正在下载'
+        break
+      case state.downloadStatus.WAITING:
+        text = '等待下载'
+        break
+      case state.downloadStatus.PAUSE:
+        text = '暂停下载'
+        break
+      case state.downloadStatus.ERROR:
+        text = '任务出错'
+        break
+      case state.downloadStatus.COMPLETED:
+        text = '下载完成'
+        break
+    }
+    if (downloadInfo) {
+      downloadInfo.statusText = text
+      downloadInfo.status = status
+    } else {
+      state.list[index].statusText = text
+      state.list[index].status = status
+    }
+  },
   onEnd(state, downloadInfo) {
     downloadInfo.isComplate = true
-    downloadInfo.isDownloading = false
+    downloadInfo.status = state.downloadStatus.COMPLETED
     downloadInfo.statusText = '下载完成'
   },
   onError(state, downloadInfo) {
-    downloadInfo.isDownloading = false
+    downloadInfo.status = state.downloadStatus.ERROR
     downloadInfo.statusText = '任务出错'
   },
   onDownload(state, downloadInfo) {
-    downloadInfo.isDownloading = true
+    downloadInfo.status = state.downloadStatus.RUN
     downloadInfo.statusText = '正在下载'
   },
   onProgress(state, { downloadInfo, status }) {

src/renderer/store/modules/list.js

@@ -30,9 +30,25 @@ const mutations = {
     if (state.defaultList.list.some(s => s.songmid === musicInfo.songmid)) return
     state.defaultList.list.push(musicInfo)
   },
+  defaultListAddMultiple(state, list) {
+    list.forEach(musicInfo => {
+      if (state.defaultList.list.some(s => s.songmid === musicInfo.songmid)) return
+      state.defaultList.list.push(musicInfo)
+    })
+  },
   defaultListRemove(state, index) {
     state.defaultList.list.splice(index, 1)
   },
+  updateMusicInfo(state, { index, data }) {
+    Object.assign(state.defaultList.list[index], data)
+  },
+  defaultListRemoveMultiple(state, list) {
+    list.forEach(musicInfo => {
+      let index = state.defaultList.list.indexOf(musicInfo)
+      if (index < 0) return
+      state.defaultList.list.splice(index, 1)
+    })
+  },
   defaultListClear(state) {
     state.defaultList.list.length = 0
   },

src/renderer/store/modules/player.js

@@ -8,7 +8,9 @@ const state = {
   changePlay: false,
 }
 
-let request
+let urlRequest
+let picRequest
+let lrcRequest
 
 // getters
 const getters = {
@@ -20,20 +22,33 @@ const getters = {
 
 // actions
 const actions = {
-  getUrl({ commit, state }, { musicInfo, type }) {
-    if (request && request.cancelHttp) request.cancelHttp()
-    request = music[musicInfo.source].getMusicUrl(musicInfo, type)
-    return request.promise.then(result => {
+  getUrl({ commit, state }, { musicInfo, type, isRefresh }) {
+    if (urlRequest && urlRequest.cancelHttp) urlRequest.cancelHttp()
+    if (musicInfo.typeUrl[type] && !isRefresh) return Promise.resolve()
+    urlRequest = music[musicInfo.source].getMusicUrl(musicInfo, type)
+    return urlRequest.promise.then(result => {
       commit('setUrl', { musicInfo, url: result.url, type })
     }).finally(() => {
-      request = null
+      urlRequest = null
     })
   },
   getPic({ commit, state }, musicInfo) {
-    return music[musicInfo.source].getPic(musicInfo).then(url => commit('getPic', { musicInfo, url }))
+    if (picRequest && picRequest.cancelHttp) picRequest.cancelHttp()
+    picRequest = music[musicInfo.source].getPic(musicInfo)
+    return picRequest.promise.then(url => {
+      commit('getPic', { musicInfo, url })
+    }).finally(() => {
+      picRequest = null
+    })
   },
   getLrc({ commit, state }, musicInfo) {
-    return music[musicInfo.source].getLyric(musicInfo).then(lrc => commit('setLrc', { musicInfo, lrc }))
+    if (lrcRequest && lrcRequest.cancelHttp) lrcRequest.cancelHttp()
+    lrcRequest = music[musicInfo.source].getLyric(musicInfo)
+    return lrcRequest.promise.then(lrc => {
+      commit('setLrc', { musicInfo, lrc })
+    }).finally(() => {
+      lrcRequest = null
+    })
   },
 }
 
@@ -41,13 +56,13 @@ const actions = {
 // mitations
 const mutations = {
   setUrl(state, datas) {
-    datas.musicInfo.typeUrl[datas.type] = datas.url
+    datas.musicInfo.typeUrl = Object.assign({}, datas.musicInfo.typeUrl, { [datas.type]: datas.url })
   },
   getPic(state, datas) {
     datas.musicInfo.img = datas.url
   },
   setLrc(state, datas) {
-    datas.musicInfo.lyric = datas.lrc
+    datas.musicInfo.lrc = datas.lrc
   },
   setList(state, { list, listId, index }) {
     state.list = list
@@ -58,6 +73,7 @@ const mutations = {
   setPlayIndex(state, index) {
     state.playIndex = index
     state.changePlay = true
+    // console.log(state.changePlay)
   },
   fixPlayIndex(state, index) {
     state.playIndex = index

src/renderer/store/modules/songList.js

@@ -0,0 +1,110 @@
+import music from '../../utils/music'
+const sortList = {}
+const sources = []
+for (const source of music.sources) {
+  const songList = music[source.id].songList
+  if (!songList) continue
+  sortList[source.id] = songList.sortList
+  sources.push(source)
+}
+
+// state
+const state = {
+  tags: {},
+  list: {
+    list: [],
+    total: 0,
+    page: 1,
+    limit: 30,
+    key: null,
+  },
+  listDetail: {
+    list: [],
+    total: 0,
+    page: 1,
+    limit: 30,
+    key: null,
+  },
+  selectListInfo: {},
+  isVisibleListDetail: false,
+}
+
+sources.forEach(source => {
+  state.tags[source.id] = null
+})
+
+
+// getters
+const getters = {
+  sourceInfo: () => ({ sources, sortList }),
+  tags: state => state.tags,
+  isVisibleListDetail: state => state.isVisibleListDetail,
+  selectListInfo: state => state.selectListInfo,
+  listData(state) {
+    return state.list
+  },
+  listDetail(state) {
+    return state.listDetail
+  },
+}
+
+// actions
+const actions = {
+  getTags({ state, rootState, commit }) {
+    let source = rootState.setting.songList.source
+    return music[source].songList.getTags().then(result => commit('setTags', { tags: result, source }))
+  },
+  getList({ state, rootState, commit }, page) {
+    let source = rootState.setting.songList.source
+    let tabId = rootState.setting.songList.tagInfo.id
+    let sortId = rootState.setting.songList.sortId
+    // console.log(sortId)
+    let key = `${source}${sortId}${tabId}${page}`
+    if (state.list.list.length && state.list.key == key) return true
+    return music[source].songList.getList(sortId, tabId, page).then(result => commit('setList', { result, key, page }))
+  },
+  getListDetail({ state, rootState, commit }, { id, page }) {
+    let source = rootState.setting.songList.source
+    let key = `${source}${id}${page}`
+    if (state.listDetail.list.length && state.listDetail.key == key) return true
+    return music[source].songList.getListDetail(id, page).then(result => commit('setListDetail', { result, key, page }))
+  },
+}
+
+// mitations
+const mutations = {
+  setTags(state, { tags, source }) {
+    state.tags[source] = tags
+  },
+  setList(state, { result, key, page }) {
+    state.list.list = result.list
+    state.list.total = result.total
+    state.list.limit = result.limit
+    state.list.page = page
+    state.list.key = key
+  },
+  setListDetail(state, { result, key, page }) {
+    state.listDetail.list = result.list
+    state.listDetail.total = result.total
+    state.listDetail.limit = result.limit
+    state.listDetail.page = page
+    state.listDetail.key = key
+  },
+  setVisibleListDetail(state, bool) {
+    state.isVisibleListDetail = bool
+  },
+  setSelectListInfo(state, info) {
+    state.selectListInfo = info
+  },
+  clearListDetail(state) {
+    state.listDetail.list = []
+  },
+}
+
+export default {
+  namespaced: true,
+  state,
+  getters,
+  actions,
+  mutations,
+}

src/renderer/store/mutations.js

@@ -12,14 +12,23 @@ export default {
     if (tabId != null) state.setting.leaderboard.tabId = tabId
     if (source != null) state.setting.leaderboard.source = source
   },
+  setSongList(state, { sortId, tagInfo, source }) {
+    if (tagInfo != null) state.setting.songList.tagInfo = tagInfo
+    if (sortId != null) state.setting.songList.sortId = sortId
+    if (source != null) state.setting.songList.source = source
+  },
   setNewVersion(state, val) {
-    val.history.forEach(ver => {
-      ver.desc = ver.desc.replace(/\n/g, '<br>')
-    })
+    // val.history.forEach(ver => {
+    //   ver.desc = ver.desc.replace(/\n/g, '<br>')
+    // })
     // val.desc = val.desc.replace(/\n/g, '<br>')
     state.version.newVersion = val
   },
-  setVersionVisible(state, val) {
-    state.version.showModal = val
+  setVersionModalVisible(state, { isShow, isError }) {
+    if (isShow !== undefined) state.version.showModal = isShow
+    if (isError !== undefined) state.version.isError = isError
+  },
+  setVolume(state, val) {
+    state.setting.player.volume = val
   },
 }

src/renderer/store/state.js

@@ -49,6 +49,7 @@ export default {
     version,
     newVersion: null,
     showModal: false,
+    isError: false,
   },
   userInfo: null,
   setting,

src/renderer/utils/download/index.js

@@ -45,9 +45,8 @@ export default ({
     onEnd()
     debugDownload && console.log('Download Completed')
   }).on('error', err => {
+    if (err.message === 'socket hang up') return
     onError(err)
-    dl.resume()
-    console.log('Download failed, Attempting Retry')
     debugDownload && console.error('Something happend', err)
   }).on('stateChanged', state => {
     onStateChanged(state)

src/renderer/utils/index.js

@@ -1,7 +1,9 @@
 import fs from 'fs'
-import { shell, remote } from 'electron'
+import { shell, remote, clipboard } from 'electron'
 import path from 'path'
 import os from 'os'
+import crypto from 'crypto'
+import { rendererSend } from '../../common/icp'
 
 /**
  * 获取两个数之间的随机整数，大于等于min，小于max
@@ -156,13 +158,19 @@ export const isChildren = (parent, children) => {
   return children.parentNode ? children.parentNode === parent ? true : isChildren(parent, children.parentNode) : false
 }
 
+/**
+ * 升级设置
+ * @param {*} setting
+ */
 export const updateSetting = setting => {
-  const defaultVersion = '1.0.1'
+  const defaultVersion = '1.0.6'
   const defaultSetting = {
     version: defaultVersion,
     player: {
       togglePlayMethod: 'listLoop',
       highQuality: false,
+      isShowTaskProgess: true,
+      volume: 1,
     },
     list: {
       isShowAlbumName: true,
@@ -170,14 +178,27 @@ export const updateSetting = setting => {
     download: {
       savePath: path.join(os.homedir(), 'Desktop'),
       fileName: '歌名 - 歌手',
+      maxDownloadNum: 3,
+      isDownloadLrc: false,
+      isEmbedPic: true,
     },
     leaderboard: {
       source: 'kw',
       tabId: 'kwbiaosb',
     },
+    songList: {
+      source: 'kg',
+      sortId: '5',
+      tagInfo: {
+        name: '默认',
+        id: null,
+      },
+    },
     themeId: 0,
     sourceId: 'kw',
+    apiSource: 'test',
     randomAnimate: true,
+    ignoreVersion: null,
   }
   const overwriteSetting = {
     version: defaultVersion,
@@ -192,6 +213,7 @@ export const updateSetting = setting => {
     objectDeepMerge(defaultSetting, overwriteSetting)
     setting = defaultSetting
   }
+  if (setting.apiSource != 'temp') setting.apiSource = 'test' // 强制设置回 test 接口源
   return setting
 }
 
@@ -202,3 +224,44 @@ export const updateSetting = setting => {
 export const openUrl = url => {
   shell.openExternal(url)
 }
+
+/**
+ * 设置标题
+ */
+let dom_title = document.getElementsByTagName('title')[0]
+export const setTitle = title => {
+  dom_title.innerText = title || '洛雪音乐助手'
+}
+
+
+/**
+ * 创建 MD5 hash
+ * @param {*} str
+ */
+export const toMD5 = str => crypto.createHash('md5').update(str).digest('hex')
+
+/**
+ * 复制文本到剪贴板
+ * @param {*} str
+ */
+export const clipboardWriteText = str => clipboard.writeText(str)
+
+/**
+ * 设置音频 meta 信息
+ * @param {*} filePath
+ * @param {*} meta
+ */
+export const setMeta = (filePath, meta) => {
+  rendererSend('setMusicMeta', { filePath, meta })
+}
+
+/**
+ * 保存歌词文件
+ * @param {*} filePath
+ * @param {*} lrc
+ */
+export const saveLrc = (filePath, lrc) => {
+  fs.writeFile(filePath, lrc, 'utf8', err => {
+    if (err) console.log(err)
+  })
+}

src/renderer/utils/message.js

@@ -0,0 +1,7 @@
+export const requestMsg = {
+  fail: '请求异常😮，可以多试几次，若还是不行就换一首吧。。。',
+  unachievable: '哦No😱...接口无法访问了！',
+  // unachievable: '哦No😱...接口无法访问了！已帮你切换到临时接口，重试下看能不能播放吧~',
+  notConnectNetwork: '无法连接到服务器',
+  cancelRequest: '取消http请求',
+}

src/renderer/utils/music/api-source.js

@@ -0,0 +1,52 @@
+import kw_api_temp from './kw/api-temp'
+import kw_api_test from './kw/api-test'
+// import tx_api_messoer from './tx/api-messoer'
+import kg_api_test from './kg/api-test'
+import wy_api_test from './wy/api-test'
+import bd_api_test from './bd/api-test'
+// import kw_api_internal from './kw/api-internal'
+// import tx_api_internal from './tx/api-internal'
+// import kg_api_internal from './kg/api-internal'
+// import wy_api_internal from './wy/api-internal'
+// import bd_api_internal from './bd/api-internal'
+
+const apis = {
+  kw_api_test,
+  // tx_api_messoer,
+  kg_api_test,
+  wy_api_test,
+  bd_api_test,
+  // kw_api_internal,
+  // tx_api_internal,
+  // kg_api_internal,
+  // wy_api_internal,
+  // bd_api_internal,
+  kw_api_temp,
+}
+
+
+const getAPI = source => {
+  switch (window.globalObj.apiSource) {
+    // case 'messoer':
+    //   return apis[`${source}_api_messoer`]
+    case 'test':
+      return apis[`${source}_api_test`]
+    case 'temp':
+      return apis[`${source}_api_temp`]
+  }
+}
+
+export default source => {
+  switch (source) {
+    case 'tx':
+      return getAPI('tx')
+    case 'kg':
+      return getAPI('kg')
+    case 'wy':
+      return getAPI('wy')
+    case 'bd':
+      return getAPI('bd')
+    default:
+      return getAPI('kw')
+  }
+}

src/renderer/utils/music/bd/api-internal.js

@@ -0,0 +1,44 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+
+const api_internal = {
+  successCode: 2200,
+  // getMusicUrl(songInfo, type) {
+  //   const requestObj = httpFatch(`http://play.taihe.com/data/music/songlink`, {
+  //     method: 'post',
+  //     headers: {
+  //       Origin: 'http://play.taihe.com',
+  //     },
+  //     formData: {
+  //       songIds: songInfo.songmid,
+  //     },
+  //   })
+  //   requestObj.promise = requestObj.promise.then(({ body }) => {
+  //     console.log(body)
+  //     return Promise.reject()
+  //     // if (body.error_code !== this.successCode) return this.getMusicUrl(songInfo, type)
+  //     // return body.code === 200 ? Promise.resolve({ type, url: body.result.bitrate.file_link }) : Promise.reject(new Error(requestMsg.fail))
+  //   })
+  //   return requestObj
+  // },
+  getMusicInfo(songInfo, tryNum = 0) {
+    const requestObj = httpFatch(`http://tingapi.ting.baidu.com/v1/restserver/ting?from=webapp_music&method=baidu.ting.song.baseInfos&song_id=${songInfo.songmid}`)
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      if (body.error_code !== this.successCode) return tryNum > 5 ? Promise.reject(new Error(requestMsg.fail)) : this.getMusicInfo(songInfo, ++tryNum)
+      return body ? Promise.resolve(body.result.items[0]) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = this.getMusicInfo(songInfo)
+    requestObj.promise = requestObj.promise.then(info => info.pic_premium)
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = this.getMusicInfo(songInfo)
+    requestObj.promise.then(info => httpFatch(info.lrclink).promise)
+    return requestObj
+  },
+}
+
+export default api_internal

src/renderer/utils/music/bd/api-test.js

@@ -0,0 +1,41 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_test = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/url/bd/${songInfo.songmid}/${type}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo, size = '500') {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/pic/bd/${songInfo.songmid}/${size}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/lrc/bd/${songInfo.songmid}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_test

src/renderer/utils/music/bd/index.js

@@ -0,0 +1,23 @@
+import leaderboard from './leaderboard'
+import api_source from '../api-source'
+import musicInfo from './musicInfo'
+import songList from './songList'
+
+const bd = {
+  leaderboard,
+  songList,
+  getMusicUrl(songInfo, type) {
+    return api_source('bd').getMusicUrl(songInfo, type)
+  },
+  getLyric(songInfo) {
+    return api_source('bd').getLyric(songInfo)
+  },
+  getPic(songInfo) {
+    return api_source('bd').getPic(songInfo)
+  },
+  getMusicInfo(songInfo) {
+    return musicInfo.getMusicInfo(songInfo.songmid)
+  },
+}
+
+export default bd

src/renderer/utils/music/bd/leaderboard.js

@@ -0,0 +1,132 @@
+import { httpFatch } from '../../request'
+// import { formatPlayTime } from '../../index'
+// import jshtmlencode from 'js-htmlencode'
+
+export default {
+  limit: 20,
+  list: [
+    {
+      id: 'bdrgb',
+      name: '热歌榜',
+      bangid: '2',
+    },
+    {
+      id: 'bdxgb',
+      name: '新歌榜',
+      bangid: '1',
+    },
+    {
+      id: 'bdycb',
+      name: '原创榜',
+      bangid: '200',
+    },
+    {
+      id: 'bdhyjqb',
+      name: '华语榜',
+      bangid: '20',
+    },
+    {
+      id: 'bdomjqb',
+      name: '欧美榜',
+      bangid: '21',
+    },
+    {
+      id: 'bdwugqb',
+      name: '网络榜',
+      bangid: '25',
+    },
+    {
+      id: 'bdjdlgb',
+      name: '老歌榜',
+      bangid: '22',
+    },
+    {
+      id: 'bdysjqb',
+      name: '影视金曲榜',
+      bangid: '24',
+    },
+    {
+      id: 'bdqgdcb',
+      name: '情歌对唱榜',
+      bangid: '23',
+    },
+    {
+      id: 'bdygb',
+      name: '摇滚榜',
+      bangid: '11',
+    },
+  ],
+  getUrl(id, p) {
+    return `http://musicmini.qianqian.com/2018/static/bangdan/bangdanList_${id}_${p}.html`
+  },
+  regExps: {
+    item: /data-song="({.+?})"/g,
+    info: /{total[\s:]+"(\d+)", size[\s:]+"(\d+)", page[\s:]+"(\d+)"}/,
+  },
+  requestObj: null,
+  getData(url) {
+    if (this.requestObj) this.requestObj.cancelHttp()
+    this.requestObj = httpFatch(url)
+    return this.requestObj.promise
+  },
+  filterData(rawList) {
+    // console.log(rawList)
+    return rawList.map(item => {
+      const types = []
+      const _types = {}
+      let size = null
+      types.push({ type: '128k', size })
+      _types['128k'] = {
+        size,
+      }
+      if (item.biaoshi) {
+        types.push({ type: '320k', size })
+        _types['320k'] = {
+          size,
+        }
+        types.push({ type: 'flac', size })
+        _types['flac'] = {
+          size,
+        }
+      }
+      // types.reverse()
+
+      return {
+        singer: item.song_artist.replace(',', '、'),
+        name: item.song_title,
+        albumName: item.album_title,
+        albumId: item.album_id,
+        source: 'bd',
+        interval: '',
+        songmid: item.song_id,
+        img: null,
+        lrc: null,
+        types,
+        _types,
+        typeUrl: {},
+      }
+    })
+  },
+  parseData(rawData) {
+    // return rawData.map(item => JSON.parse(item.replace(this.regExps.item, '$1').replace(/"/g, '"').replace(/\\\//g, '/').replace(/(@s_1,w_)\d+(,h_)\d+/, '$1500$2500')))
+    return rawData.map(item => JSON.parse(item.replace(this.regExps.item, '$1').replace(/"/g, '"').replace(/\\\//g, '/')))
+  },
+  getList(id, page) {
+    let type = this.list.find(s => s.id === id)
+    if (!type) return Promise.reject()
+    return this.getData(this.getUrl(type.bangid, page)).then(({ body }) => {
+      let result = body.match(this.regExps.item)
+      if (!result) return Promise.reject(new Error('匹配list失败'))
+      let info = body.match(this.regExps.info)
+      if (!info) return Promise.reject(new Error('匹配info失败'))
+      const list = this.filterData(this.parseData(result))
+      this.limit = parseInt(info[2])
+      return {
+        total: parseInt(info[1]),
+        list,
+        limit: this.limit,
+        page: parseInt(info[3]),
+      }
+    })
+  },
+}

src/renderer/utils/music/bd/musicInfo.js

@@ -0,0 +1,11 @@
+import { httpFatch } from '../../request'
+
+export default {
+  getMusicInfo(songmid) {
+    const requestObj = httpFatch(`https://musicapi.qianqian.com/v1/restserver/ting?method=baidu.ting.song.getSongLink&format=json&from=bmpc&version=1.0.0&version_d=11.1.6.0&songid=${songmid}&type=1&res=1&s_protocol=1&aac=2&project=tpass`)
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.error_code == 22000 ? body.reqult.songinfo : Promise.reject(new Error('获取音乐信息失败'))
+    })
+    return requestObj
+  },
+}

src/renderer/utils/music/bd/songList.js

@@ -0,0 +1,245 @@
+import { httpFatch } from '../../request'
+import { formatPlayTime, toMD5 } from '../../index'
+import CryptoJS from 'crypto-js'
+
+export default {
+  _requestObj_tags: null,
+  _requestObj_list: null,
+  _requestObj_listRecommend: null,
+  _requestObj_listDetail: null,
+  limit_list: 20,
+  limit_song: 25,
+  successCode: 22000,
+  sortList: [
+    {
+      name: '最热',
+      id: '1',
+    },
+    {
+      name: '最新',
+      id: '0',
+    },
+  ],
+  aesPassEncod(jsonData) {
+    let timestamp = Math.floor(Date.now() / 1000)
+    let privateKey = toMD5('baidu_taihe_music_secret_key' + timestamp).substr(8, 16)
+    let key = CryptoJS.enc.Utf8.parse(privateKey)
+    let iv = CryptoJS.enc.Utf8.parse(privateKey)
+    let arrData = []
+    let strData = ''
+    for (let key in jsonData) arrData.push(key)
+    arrData.sort()
+    for (let i = 0; i < arrData.length; i++) {
+      let key = arrData[i]
+      strData +=
+        (i === 0 ? '' : '&') + key + '=' + encodeURIComponent(jsonData[key])
+    }
+    let JsonFormatter = {
+      stringify(cipherParams) {
+        let jsonObj = {
+          ct: cipherParams.ciphertext.toString(CryptoJS.enc.Base64),
+        }
+        if (cipherParams.iv) {
+          jsonObj.iv = cipherParams.iv.toString()
+        }
+        if (cipherParams.salt) {
+          jsonObj.s = cipherParams.salt.toString()
+        }
+        return jsonObj
+      },
+      parse(jsonStr) {
+        let jsonObj = JSON.parse(jsonStr)
+        let cipherParams = CryptoJS.lib.CipherParams.create({
+          ciphertext: CryptoJS.enc.Base64.parse(jsonObj.ct),
+        })
+        if (jsonObj.iv) {
+          cipherParams.iv = CryptoJS.enc.Hex.parse(jsonObj.iv)
+        }
+        if (jsonObj.s) {
+          cipherParams.salt = CryptoJS.enc.Hex.parse(jsonObj.s)
+        }
+        return cipherParams
+      },
+    }
+    let encrypted = CryptoJS.AES.encrypt(strData, key, {
+      iv: iv,
+      blockSize: 16,
+      mode: CryptoJS.mode.CBC,
+      format: JsonFormatter,
+    })
+    let ciphertext = encrypted.toString().ct
+    let sign = toMD5('baidu_taihe_music' + ciphertext + timestamp)
+    let jsonRet = {
+      timestamp: timestamp,
+      param: ciphertext,
+      sign: sign,
+    }
+    return jsonRet
+  },
+  createUrl(param, method) {
+    let data = this.aesPassEncod(param)
+    return `http://musicmini.qianqian.com/v1/restserver/ting?method=${method}&time=${Date.now()}&timestamp=${data.timestamp}&param=${data.param}&sign=${data.sign}`
+  },
+  getTagsUrl() {
+    return this.createUrl({
+      from: 'qianqianmini',
+      type: 'diy',
+      version: '10.1.8',
+    }, 'baidu.ting.ugcdiy.getChannels')
+  },
+  getListUrl(sortType, tagName, page) {
+    return this.createUrl({
+      channelname: tagName || '默认',
+      from: 'qianqianmini',
+      offset: (page - 1) * this.limit_list,
+      order_type: sortType,
+      size: this.limit_list,
+      version: '10.1.8',
+    }, 'baidu.ting.ugcdiy.getChanneldiy')
+  },
+  getListDetailUrl(list_id, page) {
+    return this.createUrl({
+      list_id,
+      offset: (page - 1) * this.limit_song,
+      size: this.limit_song,
+      withcount: '1',
+      withsong: '1',
+    }, 'baidu.ting.ugcdiy.getBaseInfo')
+  },
+
+  // 获取标签
+  getTags() {
+    if (this._requestObj_tags) this._requestObj_tags.cancelHttp()
+    this._requestObj_tags = httpFatch(this.getTagsUrl())
+    return this._requestObj_tags.promise.then(({ body }) => {
+      if (body.error_code !== this.successCode) return this.getTags()
+      return {
+        hotTag: this.filterInfoHotTag(body.result.hot),
+        tags: this.filterTagInfo(body.result.tags),
+      }
+    })
+  },
+  filterInfoHotTag(rawList) {
+    return rawList.map(item => ({
+      name: item,
+      id: item,
+    }))
+  },
+  filterTagInfo(rawList) {
+    return rawList.map(type => ({
+      name: type.first,
+      list: type.second.map(item => ({
+        parent_id: type.first,
+        parent_name: type.first,
+        id: item,
+        name: item,
+      })),
+    }))
+  },
+
+  // 获取列表数据
+  getList(sortId, tagId, page) {
+    if (this._requestObj_list) this._requestObj_list.cancelHttp()
+    this._requestObj_list = httpFatch(
+      this.getListUrl(sortId, tagId, page)
+    )
+    return this._requestObj_list.promise.then(({ body }) => {
+      if (body.error_code !== this.successCode) return this.getList(sortId, tagId, page)
+      return {
+        list: this.filterList(body.diyInfo),
+        total: body.nums,
+        page,
+        limit: this.limit_list,
+      }
+    })
+  },
+
+
+  /**
+   * 格式化播放数量
+   * @param {*} num
+   */
+  formatPlayCount(num) {
+    if (num > 100000000) return parseInt(num / 10000000) / 10 + '亿'
+    if (num > 10000) return parseInt(num / 1000) / 10 + '万'
+    return num
+  },
+  filterList(rawData) {
+    return rawData.map(item => ({
+      play_count: this.formatPlayCount(item.listen_num),
+      id: item.list_id,
+      author: item.username,
+      name: item.title,
+      // time: item.publish_time,
+      img: item.list_pic_large || item.list_pic,
+      grade: item.grade,
+      desc: item.desc || item.tag,
+    }))
+  },
+
+  // 获取歌曲列表内的音乐
+  getListDetail(id, page) {
+    if (this._requestObj_listDetail) {
+      this._requestObj_listDetail.cancelHttp()
+    }
+    this._requestObj_listDetail = httpFatch(this.getListDetailUrl(id, page))
+    return this._requestObj_listDetail.promise.then(({ body }) => {
+      if (body.error_code !== this.successCode) return this.getListDetail(id, page)
+      let listData = this.filterData(body.result.songlist)
+      return {
+        list: listData,
+        page,
+        limit: this.limit_song,
+        total: body.result.song_num,
+      }
+    })
+  },
+  filterData(rawList) {
+    // console.log(rawList)
+    return rawList.map(item => {
+      const types = []
+      const _types = {}
+      let size = null
+      let itemTypes = item.all_rate.split(',')
+      if (itemTypes.includes('128')) {
+        types.push({ type: '128k', size })
+        _types['128k'] = {
+          size,
+        }
+      }
+      if (itemTypes.includes('320')) {
+        types.push({ type: '320k', size })
+        _types['320k'] = {
+          size,
+        }
+      }
+      if (itemTypes.includes('flac')) {
+        types.push({ type: 'flac', size })
+        _types['flac'] = {
+          size,
+        }
+      }
+      // types.reverse()
+
+      return {
+        singer: item.author.replace(',', '、'),
+        name: item.title,
+        albumName: item.album_title,
+        albumId: item.album_id,
+        source: 'bd',
+        interval: formatPlayTime(parseInt(item.file_duration)),
+        songmid: item.song_id,
+        img: item.pic_s500,
+        lrc: null,
+        types,
+        _types,
+        typeUrl: {},
+      }
+    })
+  },
+
+}
+
+// getList
+// getTags
+// getListDetail

src/renderer/utils/music/index.js

@@ -2,6 +2,7 @@ import kw from './kw'
 import kg from './kg'
 import tx from './tx'
 import wy from './wy'
+import bd from './bd'
 export default {
   sources: [
     {
@@ -20,9 +21,14 @@ export default {
       name: '网易音乐',
       id: 'wy',
     },
+    {
+      name: '百度音乐',
+      id: 'bd',
+    },
   ],
   kw,
   kg,
   tx,
   wy,
+  bd,
 }

src/renderer/utils/music/kg/api-internal.js

@@ -0,0 +1,41 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_messoer = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/kugou/url?id=${songInfo._types[type].hash}&quality=${type.replace(/k$/, '')}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/kugou/pic?id=${songInfo.hash}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/kugou/lrc?id=${songInfo.hash}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body ? Promise.resolve(body) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_messoer

src/renderer/utils/music/kg/api-test.js

@@ -0,0 +1,41 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_test = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/url/kg/${songInfo._types[type].hash}/${type}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/pic/kg/${songInfo.hash}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/lrc/kg/${songInfo.hash}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_test

src/renderer/utils/music/kg/index.js

@@ -1,7 +1,19 @@
 import leaderboard from './leaderboard'
+import api_source from '../api-source'
+import songList from './songList'
 
 const kg = {
   leaderboard,
+  songList,
+  getMusicUrl(songInfo, type) {
+    return api_source('kg').getMusicUrl(songInfo, type)
+  },
+  getLyric(songInfo) {
+    return api_source('kg').getLyric(songInfo)
+  },
+  getPic(songInfo) {
+    return api_source('kg').getPic(songInfo)
+  },
 }
 
 export default kg

src/renderer/utils/music/kg/leaderboard.js

@@ -1,5 +1,5 @@
 import { httpGet, cancelHttp } from '../../request'
-import { formatPlayTime } from '../../index'
+import { formatPlayTime, sizeFormate } from '../../index'
 
 export default {
   list: [
@@ -10,7 +10,7 @@ export default {
     },
     {
       id: 'kgwlhgb',
-      name: '网络红歌榜',
+      name: '网络榜',
       bangid: '23784',
     },
     {
@@ -30,29 +30,29 @@ export default {
     },
     {
       id: 'kggfjqb',
-      name: '古风金曲榜',
+      name: '古风榜',
       bangid: '33161',
     },
     {
       id: 'kgyyjqb',
-      name: '粤语金曲榜',
+      name: '粤语榜',
       bangid: '33165',
     },
     {
       id: 'kgomjqb',
-      name: '欧美金曲榜',
+      name: '欧美榜',
       bangid: '33166',
     },
-    // {
-    //   id: 'kgdyrgb',
-    //   name: '电音热歌榜',
-    //   bangid: '33160',
-    // },
-    // {
-    //   id: 'kgjdrgb',
-    //   name: 'DJ热歌榜',
-    //   bangid: '24971',
-    // },
+    {
+      id: 'kgdyrgb',
+      name: '电音榜',
+      bangid: '33160',
+    },
+    {
+      id: 'kgjdrgb',
+      name: 'DJ热歌榜',
+      bangid: '24971',
+    },
     // {
     //   id: 'kghyxgb',
     //   name: '华语新歌榜',
@@ -89,18 +89,58 @@ export default {
     })
   },
   filterData(rawList) {
-    return rawList.map(item => ({
-      singer: item.singername,
-      name: item.songname,
-      albumName: item.album_name,
-      albumId: item.album_id,
-      songmid: item.audio_id,
-      source: 'kg',
-      interval: formatPlayTime(item.duration / 1000),
-      img: null,
-      lrc: null,
-      typeUrl: {},
-    }))
+    // console.log(rawList)
+    return rawList.map(item => {
+      const types = []
+      const _types = {}
+      if (item.filesize !== 0) {
+        let size = sizeFormate(item.filesize)
+        types.push({ type: '128k', size, hash: item.hash })
+        _types['128k'] = {
+          size,
+          hash: item.hash,
+        }
+      }
+      if (item.filesize_320 !== 0) {
+        let size = sizeFormate(item.filesize_320)
+        types.push({ type: '320k', size, hash: item.hash_320 })
+        _types['320k'] = {
+          size,
+          hash: item.hash_320,
+        }
+      }
+      if (item.filesize_ape !== 0) {
+        let size = sizeFormate(item.filesize_ape)
+        types.push({ type: 'ape', size, hash: item.hash_ape })
+        _types.ape = {
+          size,
+          hash: item.hash_ape,
+        }
+      }
+      if (item.filesize_flac !== 0) {
+        let size = sizeFormate(item.filesize_flac)
+        types.push({ type: 'flac', size, hash: item.hash_flac })
+        _types.flac = {
+          size,
+          hash: item.hash_flac,
+        }
+      }
+      return {
+        singer: item.singername,
+        name: item.songname,
+        albumName: item.album_name,
+        albumId: item.album_id,
+        songmid: item.audio_id,
+        source: 'kg',
+        interval: formatPlayTime(item.duration / 1000),
+        img: null,
+        lrc: null,
+        hash: item.HASH,
+        types,
+        _types,
+        typeUrl: {},
+      }
+    })
   },
   getList(id, page) {
     let type = this.list.find(s => s.id === id)

src/renderer/utils/music/kg/songList.js

@@ -0,0 +1,260 @@
+import { httpFatch } from '../../request'
+import { formatPlayTime, sizeFormate } from '../../index'
+
+export default {
+  _requestObj_tags: null,
+  _requestObj_listInfo: null,
+  _requestObj_list: null,
+  _requestObj_listRecommend: null,
+  _requestObj_listDetail: null,
+  currentTagInfo: {
+    id: undefined,
+    info: undefined,
+  },
+  sortList: [
+    {
+      name: '推荐',
+      id: '5',
+    },
+    {
+      name: '最热',
+      id: '6',
+    },
+    {
+      name: '最新',
+      id: '7',
+    },
+    {
+      name: '热藏',
+      id: '3',
+    },
+    {
+      name: '飙升',
+      id: '8',
+    },
+  ],
+  regExps: {
+    listData: /global\.data = (\[.+\]);/,
+  },
+  getInfoUrl(tagId) {
+    return tagId
+      ? `http://www2.kugou.kugou.com/yueku/v9/special/getSpecial?is_smarty=1&cdn=cdn&t=5&c=${tagId}`
+      : `http://www2.kugou.kugou.com/yueku/v9/special/getSpecial?is_smarty=1&`
+  },
+  getSongListUrl(sortId, tagId, page) {
+    if (tagId == null) tagId = ''
+    return `http://www2.kugou.kugou.com/yueku/v9/special/getSpecial?is_ajax=1&cdn=cdn&t=${sortId}&c=${tagId}&p=${page}`
+  },
+  getSongListDetailUrl(id) {
+    return `http://www2.kugou.kugou.com/yueku/v9/special/single/${id}-5-9999.html`
+  },
+
+  /**
+   * 格式化播放数量
+   * @param {*} num
+   */
+  formatPlayCount(num) {
+    if (num > 100000000) return parseInt(num / 10000000) / 10 + '亿'
+    if (num > 10000) return parseInt(num / 1000) / 10 + '万'
+    return num
+  },
+  filterInfoHotTag(rawData) {
+    const result = []
+    if (rawData.status !== 1) return result
+    for (const key of Object.keys(rawData.data)) {
+      let tag = rawData.data[key]
+      result.push({
+        id: tag.id,
+        name: tag.special_name,
+      })
+    }
+    return result
+  },
+  filterTagInfo(rawData) {
+    const result = []
+    for (const name of Object.keys(rawData)) {
+      result.push({
+        name,
+        list: rawData[name].data.map(tag => ({
+          parent_id: tag.parent_id,
+          parent_name: tag.pname,
+          id: tag.id,
+          name: tag.name,
+        })),
+      })
+    }
+    return result
+  },
+
+  getSongList(sortId, tagId, page) {
+    if (this._requestObj_list) this._requestObj_list.cancelHttp()
+    this._requestObj_list = httpFatch(
+      this.getSongListUrl(sortId, tagId, page)
+    )
+    return this._requestObj_list.promise.then(({ body }) => {
+      if (body.status !== 1) return this.getSongList(sortId, tagId, page)
+      return this.filterList(body.special_db)
+    })
+  },
+  getSongListRecommend() {
+    if (this._requestObj_listRecommend) this._requestObj_listRecommend.cancelHttp()
+    this._requestObj_listRecommend = httpFatch(
+      'http://everydayrec.service.kugou.com/guess_special_recommend',
+      {
+        method: 'post',
+        headers: {
+          'User-Agent': 'KuGou2012-8275-web_browser_event_handler',
+        },
+        body: {
+          appid: 1001,
+          clienttime: 1566798337219,
+          clientver: 8275,
+          key: 'f1f93580115bb106680d2375f8032d96',
+          mid: '21511157a05844bd085308bc76ef3343',
+          platform: 'pc',
+          userid: '262643156',
+          return_min: 6,
+          return_max: 15,
+        },
+      }
+    )
+    return this._requestObj_listRecommend.promise.then(({ body }) => {
+      if (body.status !== 1) return this.getSongListRecommend()
+      return this.filterList(body.data.special_list)
+    })
+  },
+  filterList(rawData) {
+    return rawData.map(item => ({
+      play_count: item.total_play_count || this.formatPlayCount(item.play_count),
+      id: item.specialid,
+      author: item.nickname,
+      name: item.specialname,
+      time: item.publish_time || item.publishtime,
+      img: item.img || item.imgurl,
+      grade: item.grade,
+      desc: item.intro,
+    }))
+  },
+
+  getListDetail(id, page) { // 获取歌曲列表内的音乐
+    if (this._requestObj_listDetail) this._requestObj_listDetail.cancelHttp()
+    this._requestObj_listDetail = httpFatch(this.getSongListDetailUrl(id))
+    return this._requestObj_listDetail.promise.then(({ body }) => {
+      let listData = body.match(this.regExps.listData)
+      if (listData) listData = this.filterData(JSON.parse(RegExp.$1))
+      return {
+        list: listData,
+        page: 1,
+        limit: 10000,
+        total: listData.length,
+      }
+    })
+  },
+  filterData(rawList) {
+    // console.log(rawList)
+    return rawList.map(item => {
+      const types = []
+      const _types = {}
+      if (item.filesize !== 0) {
+        let size = sizeFormate(item.filesize)
+        types.push({ type: '128k', size, hash: item.hash })
+        _types['128k'] = {
+          size,
+          hash: item.hash,
+        }
+      }
+      if (item.filesize_320 !== 0) {
+        let size = sizeFormate(item.filesize_320)
+        types.push({ type: '320k', size, hash: item.hash_320 })
+        _types['320k'] = {
+          size,
+          hash: item.hash_320,
+        }
+      }
+      if (item.filesize_ape !== 0) {
+        let size = sizeFormate(item.filesize_ape)
+        types.push({ type: 'ape', size, hash: item.hash_ape })
+        _types.ape = {
+          size,
+          hash: item.hash_ape,
+        }
+      }
+      if (item.filesize_flac !== 0) {
+        let size = sizeFormate(item.filesize_flac)
+        types.push({ type: 'flac', size, hash: item.hash_flac })
+        _types.flac = {
+          size,
+          hash: item.hash_flac,
+        }
+      }
+      return {
+        singer: item.singername,
+        name: item.songname,
+        albumName: item.album_name,
+        albumId: item.album_id,
+        songmid: item.audio_id,
+        source: 'kg',
+        interval: formatPlayTime(item.duration / 1000),
+        img: null,
+        lrc: null,
+        hash: item.hash,
+        types,
+        _types,
+        typeUrl: {},
+      }
+    })
+  },
+
+  // 获取列表信息
+  getListInfo(tagId) {
+    if (this._requestObj_listInfo) this._requestObj_listInfo.cancelHttp()
+    this._requestObj_listInfo = httpFatch(this.getInfoUrl(tagId))
+    return this._requestObj_listInfo.promise.then(({ body }) => {
+      if (body.status !== 1) return this.getListInfo(tagId)
+      return {
+        limit: body.data.params.pagesize,
+        page: body.data.params.p,
+        total: body.data.params.total,
+      }
+    })
+  },
+
+  // 获取列表数据
+  getList(sortId, tagId, page) {
+    let tasks = [this.getSongList(sortId, tagId, page)]
+    tasks.push(
+      this.currentTagInfo.id === tagId
+        ? Promise.resolve(this.currentTagInfo.info)
+        : this.getListInfo(tagId).then(info => {
+          this.currentTagInfo.id = tagId
+          this.currentTagInfo.info = Object.assign({}, info)
+          return info
+        })
+    )
+    if (!tagId && page === 1 && sortId === this.sortList[0].id) tasks.push(this.getSongListRecommend()) // 如果是所有类别，则顺便获取推荐列表
+    return Promise.all(tasks).then(([list, info, recommendList]) => {
+      if (recommendList) list.unshift(...recommendList)
+      return {
+        list,
+        ...info,
+      }
+    })
+  },
+
+  // 获取标签
+  getTags() {
+    if (this._requestObj_tags) this._requestObj_tags.cancelHttp()
+    this._requestObj_tags = httpFatch(this.getInfoUrl())
+    return this._requestObj_tags.promise.then(({ body }) => {
+      if (body.status !== 1) return this.getTags()
+      return {
+        hotTag: this.filterInfoHotTag(body.data.hotTag),
+        tags: this.filterTagInfo(body.data.tagids),
+      }
+    })
+  },
+}
+
+// getList
+// getTags
+// getListDetail

src/renderer/utils/music/kw/api-internal.js

@@ -0,0 +1,30 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_messoer = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/kuwo/url?id=${songInfo.songmid}&quality=${type.replace(/k$/, '')}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/kuwo/pic?id=${songInfo.songmid}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_messoer

src/renderer/utils/music/kw/api-temp.js

@@ -0,0 +1,18 @@
+import { httpFatch } from '../../request'
+import { headers, timeout } from '../options'
+
+const api_temp = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`http://temp.tempmusic.tk/url/kw/${songInfo.songmid}/${type}`, {
+      method: 'get',
+      headers,
+      timeout,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(body.msg))
+    })
+    return requestObj
+  },
+}
+
+export default api_temp

src/renderer/utils/music/kw/api-test.js

@@ -0,0 +1,30 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_test = {
+  // getMusicUrl(songInfo, type) {
+  //   const requestObj = httpFatch(`http://45.32.53.128:3002/m/kw/u/${songInfo.songmid}/${type}`, {
+  //     method: 'get',
+  //     headers,
+  //     timeout,
+  //   })
+  //   requestObj.promise = requestObj.promise.then(({ body }) => {
+  //     return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(body.msg))
+  //   })
+  //   return requestObj
+  // },
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/url/kw/${songInfo.songmid}/${type}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_test

src/renderer/utils/music/kw/index.js

@@ -4,6 +4,9 @@ import musicSearch from './musicSearch'
 import { formatSinger } from './util'
 import leaderboard from './leaderboard'
 import lyric from './lyric'
+import pic from './pic'
+import api_source from '../api-source'
+import songList from './songList'
 
 const kw = {
   _musicInfoRequestObj: null,
@@ -30,6 +33,7 @@ const kw = {
   tempSearch,
   musicSearch,
   leaderboard,
+  songList,
   getLyric(songInfo) {
     // let singer = songInfo.singer.indexOf('、') > -1 ? songInfo.singer.split('、')[0] : songInfo.singer
     return lyric.getLyric(songInfo.songmid)
@@ -52,36 +56,7 @@ const kw = {
   },
 
   getMusicUrl(songInfo, type) {
-    let requestObj
-    let cancelFn
-    const p = new Promise((resolve, reject) => {
-      cancelFn = reject
-      // requestObj = httpGet(`https://v1.itooi.cn/kuwo/url?id=${songInfo.songmid}&quality=${type.replace(/k$/, '')}&isRedirect=0`, (err, resp, body) => {
-      requestObj = httpGet(`https://www.stsky.cn/api/temp/getMusicUrl.php?id=${songInfo.songmid}&type=${type}`, (err, resp, body) => {
-        requestObj = null
-        cancelFn = null
-        if (err) {
-          if (err.message === 'socket hang up') return reject(new Error('接口挂了'))
-          const { promise, cancelHttp } = this.getMusicUrl(songInfo, type)
-          obj.cancelHttp = cancelHttp
-          return promise
-        }
-        // body.code === 200 ? resolve({ type, url: body.data }) : reject(new Error(body.msg))
-        body.code === 0 ? resolve({ type, url: body.data }) : reject(new Error(body.msg))
-      })
-    })
-    const obj = {
-      promise: p,
-      cancelHttp() {
-        console.log('cancel')
-        if (!requestObj) return
-        cancelHttp(requestObj)
-        cancelFn(new Error('取消http请求'))
-        requestObj = null
-        cancelFn = null
-      },
-    }
-    return obj
+    return api_source('kw').getMusicUrl(songInfo, type)
   },
 
   getMusicInfo(songInfo) {
@@ -119,24 +94,7 @@ const kw = {
   },
 
   getPic(songInfo) {
-    if (this._musicPicRequestObj != null) {
-      cancelHttp(this._musicPicRequestObj)
-      this._musicPicPromiseCancelFn(new Error('取消http请求'))
-    }
-    return new Promise((resolve, reject) => {
-      this._musicPicPromiseCancelFn = reject
-      // this._musicPicRequestObj = httpGet(`https://v1.itooi.cn/kuwo/pic?id=${songInfo.songmid}&isRedirect=0`, (err, resp, body) => {
-      this._musicPicRequestObj = httpGet(`https://www.stsky.cn/api/temp/getPic.php?size=320&songmid=${songInfo.songmid}`, (err, resp, body) => {
-        this._musicPicRequestObj = null
-        this._musicPicPromiseCancelFn = null
-        if (err) {
-          console.log(err)
-          reject(err)
-        }
-        // body.code === 200 ? resolve(body.data) : reject(new Error(body.msg))
-        body.code === 0 ? resolve(body.data) : reject(new Error(body.msg))
-      })
-    })
+    return pic.getPic(songInfo)
   },
 }
 

src/renderer/utils/music/kw/leaderboard.js

@@ -1,5 +1,7 @@
 import { httpGet, cancelHttp } from '../../request'
-import { formatPlayTime } from '../../index'
+import { formatPlayTime, decodeName } from '../../index'
+import { formatSinger } from './util'
+
 
 export default {
   list: [
@@ -106,6 +108,7 @@ export default {
     })
   },
   filterData(rawList, rawList2) {
+    // console.log(rawList.length, rawList2.length)
     return rawList.map((item, inedx) => {
       let formats = item.formats.split('|')
       let types = []
@@ -140,15 +143,15 @@ export default {
           size: null,
         }
       }
-      types.reverse()
+      // types.reverse()
       return {
-        singer: item.artist,
-        name: item.name,
-        albumName: item.album,
+        singer: formatSinger(decodeName(item.artist)),
+        name: decodeName(item.name),
+        albumName: decodeName(item.album),
         albumId: item.albumid,
         songmid: item.id,
         source: 'kw',
-        interval: formatPlayTime(rawList2[inedx].duration),
+        interval: rawList2[inedx] && formatPlayTime(rawList2[inedx].duration),
         img: item.pic,
         lrc: null,
         types,

src/renderer/utils/music/kw/lyric.js

@@ -1,8 +1,6 @@
-import { httpGet, cancelHttp } from '../../request'
+import { httpFatch } from '../../request'
 
 export default {
-  _musicLrcRequestObj: null,
-  _musicLrcPromiseCancelFn: null,
   formatTime(time) {
     let m = parseInt(time / 60)
     let s = (time % 60).toFixed(2)
@@ -12,23 +10,10 @@ export default {
     return `[ti:${songinfo.songName}]\n[ar:${songinfo.artist}]\n[al:${songinfo.album}]\n[by:]\n[offset:0]\n${lrclist ? lrclist.map(l => `[${this.formatTime(l.time)}]${l.lineLyric}\n`).join('') : '暂无歌词'}`
   },
   getLyric(songId) {
-    if (this._musicLrcRequestObj != null) {
-      cancelHttp(this._musicLrcRequestObj)
-      this._musicLrcPromiseCancelFn(new Error('取消http请求'))
-    }
-    return new Promise((resolve, reject) => {
-      this._musicLrcPromiseCancelFn = reject
-      // this._musicLrcRequestObj = httpGet(`https://v1.itooi.cn/kuwo/lrc?id=${songId}`, (err, resp, body) => {
-      this._musicLrcRequestObj = httpGet(`http://m.kuwo.cn/newh5/singles/songinfoandlrc?musicId=${songId}`, (err, resp, body) => {
-        this._musicLrcRequestObj = null
-        this._musicLrcPromiseCancelFn = null
-        if (err) {
-          console.log(err)
-          reject(err)
-        }
-        // resolve(body)
-        resolve(this.transformLrc(body.data))
-      })
+    const requestObj = httpFatch(`http://m.kuwo.cn/newh5/singles/songinfoandlrc?musicId=${songId}`)
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return this.transformLrc(body.data)
     })
+    return requestObj
   },
 }

src/renderer/utils/music/kw/pic.js

@@ -0,0 +1,9 @@
+import { httpFatch } from '../../request'
+
+export default {
+  getPic({ songmid }) {
+    const requestObj = httpFatch(`http://artistpicserver.kuwo.cn/pic.web?corp=kuwo&type=rid_pic&pictype=500&size=500&rid=${songmid}`)
+    requestObj.promise = requestObj.promise.then(({ body }) => body)
+    return requestObj
+  },
+}

src/renderer/utils/music/kw/songList.js

@@ -0,0 +1,214 @@
+import { httpFatch } from '../../request'
+import { formatPlayTime, decodeName } from '../../index'
+import { formatSinger } from './util'
+
+export default {
+  _requestObj_tags: null,
+  _requestObj_hotTags: null,
+  _requestObj_list: null,
+  _requestObj_listDetail: null,
+  limit_list: 25,
+  limit_song: 100,
+  successCode: 200,
+  sortList: [
+    {
+      name: '最新',
+      id: 'new',
+    },
+    {
+      name: '最热',
+      id: 'hot',
+    },
+  ],
+  tagsUrl: 'http://wapi.kuwo.cn/api/pc/classify/playlist/getTagList?cmd=rcm_keyword_playlist&user=0&prod=kwplayer_pc_9.0.5.0&vipver=9.0.5.0&source=kwplayer_pc_9.0.5.0&loginUid=0&loginSid=0&appUid=76039576',
+  hotTagUrl: 'http://wapi.kuwo.cn/api/pc/classify/playlist/getRcmTagList?loginUid=0&loginSid=0&appUid=76039576',
+  getListUrl({ sortId, id, type, page }) {
+    if (!id) return `http://wapi.kuwo.cn/api/pc/classify/playlist/getRcmPlayList?loginUid=0&loginSid=0&appUid=76039576&&pn=${page}&rn=${this.limit_list}&order=${sortId}`
+    switch (type) {
+      case '10000': return `http://wapi.kuwo.cn/api/pc/classify/playlist/getTagPlayList?loginUid=0&loginSid=0&appUid=76039576&pn=${page}&id=${id}&rn=${this.limit_list}`
+      case '43': return `http://mobileinterfaces.kuwo.cn/er.s?type=get_pc_qz_data&f=web&id=${id}&prod=pc`
+    }
+    // http://wapi.kuwo.cn/api/pc/classify/playlist/getTagPlayList?loginUid=0&loginSid=0&appUid=76039576&id=173&pn=1&rn=100
+  },
+  getListDetailUrl(id, page) {
+    // http://nplserver.kuwo.cn/pl.svc?op=getlistinfo&pid=2858093057&pn=0&rn=100&encode=utf8&keyset=pl2012&identity=kuwo&pcmp4=1&vipver=MUSIC_9.0.5.0_W1&newver=1
+    return `http://nplserver.kuwo.cn/pl.svc?op=getlistinfo&pid=${id}&pn=${page - 1}&rn=${this.limit_song}&encode=utf8&keyset=pl2012&identity=kuwo&pcmp4=1&vipver=MUSIC_9.0.5.0_W1&newver=1`
+    // http://mobileinterfaces.kuwo.cn/er.s?type=get_pc_qz_data&f=web&id=140&prod=pc
+  },
+
+  // http://nplserver.kuwo.cn/pl.svc?op=getlistinfo&pid=2849349915&pn=0&rn=100&encode=utf8&keyset=pl2012&identity=kuwo&pcmp4=1&vipver=MUSIC_9.0.5.0_W1&newver=1
+  // 获取标签
+  getTag() {
+    if (this._requestObj_tags) this._requestObj_tags.cancelHttp()
+    this._requestObj_tags = httpFatch(this.tagsUrl)
+    return this._requestObj_tags.promise.then(({ body }) => {
+      if (body.code !== this.successCode) return this.getTag()
+      return this.filterTagInfo(body.data)
+    })
+  },
+  // 获取标签
+  getHotTag() {
+    if (this._requestObj_hotTags) this._requestObj_hotTags.cancelHttp()
+    this._requestObj_hotTags = httpFatch(this.hotTagUrl)
+    return this._requestObj_hotTags.promise.then(({ body }) => {
+      if (body.code !== this.successCode) return this.getHotTag()
+      return this.filterInfoHotTag(body.data[0].data)
+    })
+  },
+  filterInfoHotTag(rawList) {
+    return rawList.map(item => ({
+      id: `${item.id}-${item.digest}`,
+      name: item.name,
+    }))
+  },
+  filterTagInfo(rawList) {
+    return rawList.map(type => ({
+      name: type.name,
+      list: type.data.map(item => ({
+        parent_id: type.id,
+        parent_name: type.name,
+        id: `${item.id}-${item.digest}`,
+        name: item.name,
+      })),
+    }))
+  },
+
+  // 获取列表数据
+  getList(sortId, tagId, page) {
+    if (this._requestObj_list) this._requestObj_list.cancelHttp()
+    let id
+    let type
+    if (tagId) {
+      let arr = tagId.split('-')
+      id = arr[0]
+      type = arr[1]
+    } else {
+      id = null
+    }
+    this._requestObj_list = httpFatch(this.getListUrl({ sortId, id, type, page }))
+    return this._requestObj_list.promise.then(({ body }) => {
+      if (!id || type == '10000') {
+        if (body.code !== this.successCode) return this.getListUrl({ sortId, id, type, page })
+        return {
+          list: this.filterList(body.data.data),
+          total: body.data.total,
+          page: body.data.pn,
+          limit: body.data.rn,
+        }
+      } else if (!body.length) {
+        return this.getListUrl({ sortId, id, type, page })
+      }
+      return {
+        list: this.filterList2(body),
+        total: 1000,
+        page,
+        limit: 1000,
+      }
+    })
+  },
+
+
+  /**
+   * 格式化播放数量
+   * @param {*} num
+   */
+  formatPlayCount(num) {
+    if (num > 100000000) return parseInt(num / 10000000) / 10 + '亿'
+    if (num > 10000) return parseInt(num / 1000) / 10 + '万'
+    return num
+  },
+  filterList(rawData) {
+    return rawData.map(item => ({
+      play_count: this.formatPlayCount(item.listencnt),
+      id: item.id,
+      author: item.uname,
+      name: item.name,
+      // time: item.publish_time,
+      img: item.img,
+      grade: item.favorcnt / 10,
+      desc: item.desc,
+    }))
+  },
+  filterList2(rawData) {
+    const list = []
+    rawData.forEach(item => {
+      if (!item.label) return
+      list.push(...item.list.map(item => ({
+        play_count: item.play_count === undefined ? null : this.formatPlayCount(item.listencnt),
+        id: item.id,
+        author: item.uname,
+        name: item.name,
+        // time: item.publish_time,
+        img: item.img,
+        grade: item.favorcnt / 10,
+        desc: item.desc,
+      })))
+    })
+    return list
+  },
+
+  // 获取歌曲列表内的音乐
+  getListDetail(id, page) {
+    if (this._requestObj_listDetail) {
+      this._requestObj_listDetail.cancelHttp()
+    }
+    this._requestObj_listDetail = httpFatch(this.getListDetailUrl(id, page))
+    return this._requestObj_listDetail.promise.then(({ body }) => {
+      if (body.result !== 'ok') return this.getListDetail(id, page)
+      return {
+        list: this.filterListDetail(body.musiclist),
+        page,
+        limit: body.rn,
+        total: body.total,
+      }
+    })
+  },
+  filterListDetail(rawData) {
+    // console.log(rawList)
+    return rawData.map((item, inedx) => {
+      let formats = item.formats.split('|')
+      let types = []
+      let _types = {}
+      if (formats.indexOf('MP3128')) {
+        types.push({ type: '128k', size: null })
+        _types['128k'] = {
+          size: null,
+        }
+      }
+      if (formats.indexOf('MP3H')) {
+        types.push({ type: '320k', size: null })
+        _types['320k'] = {
+          size: null,
+        }
+      }
+      if (formats.indexOf('ALFLAC')) {
+        types.push({ type: 'flac', size: null })
+        _types['flac'] = {
+          size: null,
+        }
+      }
+
+      return {
+        singer: formatSinger(decodeName(item.artist)),
+        name: decodeName(item.name),
+        albumName: decodeName(item.album),
+        albumId: item.albumid,
+        songmid: item.id,
+        source: 'kw',
+        interval: formatPlayTime(parseInt(item.duration)),
+        img: null,
+        lrc: null,
+        types,
+        _types,
+        typeUrl: {},
+      }
+    })
+  },
+  getTags() {
+    return Promise.all([this.getTag(), this.getHotTag()]).then(([tags, hotTag]) => ({ tags, hotTag }))
+  },
+}
+
+// getList
+// getTags
+// getListDetail

src/renderer/utils/music/options.js

@@ -0,0 +1,9 @@
+export const bHh = '624868746c'
+
+export const headers = {
+  'User-Agent': 'lx-music request',
+  [bHh]: [bHh],
+}
+
+
+export const timeout = 15000

src/renderer/utils/music/tx/api-internal.js

@@ -0,0 +1,24 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_messoer = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/tencent/url?id=${songInfo.strMediaMid}&quality=${type.replace(/k$/, '')}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    return {
+      promise: Promise.resolve(`https://y.gtimg.cn/music/photo_new/T002R500x500M000${songInfo.albumId}.jpg`),
+    }
+  },
+}
+
+export default api_messoer

src/renderer/utils/music/tx/api-test.js

@@ -0,0 +1,24 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../messoer'
+
+const api_messoer = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/tencent/url?id=${songInfo.strMediaMid}&quality=${type.replace(/k$/, '')}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    return {
+      promise: Promise.resolve(`https://y.gtimg.cn/music/photo_new/T002R500x500M000${songInfo.albumId}.jpg`),
+    }
+  },
+}
+
+export default api_messoer

src/renderer/utils/music/tx/index.js

@@ -1,46 +1,19 @@
-import { httpGet, cancelHttp } from '../../request'
 import leaderboard from './leaderboard'
 import lyric from './lyric'
+import api_source from '../api-source'
 
 const tx = {
   leaderboard,
 
   getMusicUrl(songInfo, type) {
-    let requestObj
-    let cancelFn
-    const p = new Promise((resolve, reject) => {
-      cancelFn = reject
-      requestObj = httpGet(`https://v1.itooi.cn/tencent/url?id=${songInfo.strMediaMid}&quality=${type.replace(/k$/, '')}&isRedirect=0`, (err, resp, body) => {
-        requestObj = null
-        cancelFn = null
-        if (err) {
-          console.log(err)
-          const { promise, cancelHttp } = this.getMusicUrl(songInfo, type)
-          obj.cancelHttp = cancelHttp
-          return promise
-        }
-        body.code === 200 ? resolve({ type, url: body.data }) : reject(new Error(body.msg))
-      })
-    })
-    const obj = {
-      promise: p,
-      cancelHttp() {
-        console.log('cancel')
-        if (!requestObj) return
-        cancelHttp(requestObj)
-        cancelFn(new Error('取消http请求'))
-        requestObj = null
-        cancelFn = null
-      },
-    }
-    return obj
+    return api_source('tx').getMusicUrl(songInfo, type)
   },
   getLyric(songInfo) {
     // let singer = songInfo.singer.indexOf('、') > -1 ? songInfo.singer.split('、')[0] : songInfo.singer
     return lyric.getLyric(songInfo.songmid)
   },
   getPic(songInfo) {
-    return Promise.resolve(`https://y.gtimg.cn/music/photo_new/T002R500x500M000${songInfo.albumId}.jpg`)
+    return api_source('tx').getPic(songInfo)
   },
 }
 

src/renderer/utils/music/tx/lyric.js

@@ -1,32 +1,19 @@
-import { httpGet, cancelHttp } from '../../request'
+import { httpFatch } from '../../request'
 import { b64DecodeUnicode } from '../../index'
 
 export default {
-  _musicLrcRequestObj: null,
-  _musicLrcPromiseCancelFn: null,
   regexps: {
     matchLrc: /.+"lyric":"([\w=+/]*)".+/,
   },
   getLyric(songmid) {
-    if (this._musicLrcRequestObj != null) {
-      cancelHttp(this._musicLrcRequestObj)
-      this._musicLrcPromiseCancelFn(new Error('取消http请求'))
-    }
-    return new Promise((resolve, reject) => {
-      this._musicLrcPromiseCancelFn = reject
-      this._musicLrcRequestObj = httpGet(`https://c.y.qq.com/lyric/fcgi-bin/fcg_query_lyric_new.fcg?songmid=${songmid}&g_tk=2001461048&loginUin=0&hostUin=0&format=jsonp&inCharset=utf8&outCharset=utf-8&platform=yqq`, {
-        headers: {
-          Referer: 'https://y.qq.com/portal/player.html',
-        },
-      }, (err, resp, body) => {
-        this._musicLrcRequestObj = null
-        this._musicLrcPromiseCancelFn = null
-        if (err) {
-          console.log(err)
-          reject(err)
-        }
-        resolve(b64DecodeUnicode(body.replace(this.regexps.matchLrc, '$1')))
-      })
+    const requestObj = httpFatch(`https://c.y.qq.com/lyric/fcgi-bin/fcg_query_lyric_new.fcg?songmid=${songmid}&g_tk=2001461048&loginUin=0&hostUin=0&format=jsonp&inCharset=utf8&outCharset=utf-8&platform=yqq`, {
+      headers: {
+        Referer: 'https://y.qq.com/portal/player.html',
+      },
     })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return b64DecodeUnicode(body.replace(this.regexps.matchLrc, '$1'))
+    })
+    return requestObj
   },
 }

src/renderer/utils/music/utils.js

@@ -0,0 +1,19 @@
+/**
+ * 获取音乐音质
+ * @param {*} info
+ * @param {*} type
+ */
+
+const types = ['flac', 'ape', '320k', '192k', '128k']
+export const getMusicType = (info, type) => {
+  switch (window.globalObj.apiSource) {
+    // case 'kg':
+    case 'wy':
+      return '128k'
+  }
+  const rangeType = types.slice(types.indexOf(type))
+  for (const type of rangeType) {
+    if (info._types[type]) return type
+  }
+  return '128k'
+}

src/renderer/utils/music/wy/api-internal.js

@@ -0,0 +1,41 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_messoer = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/netease/url?id=${songInfo.songmid}&quality=${type.replace(/k$/, '')}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/netease/pic?id=${songInfo.songmid}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 200 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = httpFatch(`https://v1.itooi.cn/netease/lrc?id=${songInfo.songmid}&isRedirect=0`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body ? Promise.resolve(body) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_messoer

src/renderer/utils/music/wy/api-test.js

@@ -0,0 +1,41 @@
+import { httpFatch } from '../../request'
+import { requestMsg } from '../../message'
+import { headers, timeout } from '../options'
+
+const api_test = {
+  getMusicUrl(songInfo, type) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/url/wy/${songInfo.songmid}/${type}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve({ type, url: body.data }) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getPic(songInfo) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/pic/wy/${songInfo.songmid}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+  getLyric(songInfo) {
+    const requestObj = httpFatch(`http://test.tempmusic.tk/lrc/wy/${songInfo.songmid}`, {
+      method: 'get',
+      timeout,
+      headers,
+    })
+    requestObj.promise = requestObj.promise.then(({ body }) => {
+      return body.code === 0 ? Promise.resolve(body.data) : Promise.reject(new Error(requestMsg.fail))
+    })
+    return requestObj
+  },
+}
+
+export default api_test

src/renderer/utils/music/wy/index.js

@@ -1,7 +1,17 @@
 import leaderboard from './leaderboard'
+import api_source from '../api-source'
 
 const wy = {
   leaderboard,
+  getMusicUrl(songInfo, type) {
+    return api_source('wy').getMusicUrl(songInfo, type)
+  },
+  getLyric(songInfo) {
+    return api_source('wy').getLyric(songInfo)
+  },
+  getPic(songInfo) {
+    return api_source('wy').getPic(songInfo)
+  },
 }
 
 export default wy

src/renderer/utils/music/wy/leaderboard.js

@@ -91,6 +91,42 @@ export default {
   filterData(rawList) {
     // console.log(rawList)
     return rawList.map(item => {
+      const types = []
+      const _types = {}
+      let size
+      switch (item.privilege.maxbr) {
+        case 999000:
+          size = null
+          types.push({ type: 'flac', size })
+          _types['flac'] = {
+            size,
+          }
+        case 320000:
+          size = null
+          types.push({ type: '320k', size })
+          _types['320k'] = {
+            size,
+          }
+        case 192000:
+        case 190000:
+          size = null
+          types.push({ type: '192k', size })
+          _types['192k'] = {
+            size,
+          }
+          // case '160000':
+
+        default:
+          size = null
+          types.push({ type: '128k', size })
+          _types['128k'] = {
+            size,
+          }
+          break
+      }
+
+      types.reverse()
+
       return {
         singer: this.getSinger(item.artists),
         name: item.name,
@@ -101,6 +137,8 @@ export default {
         songmid: item.id,
         img: item.album.picUrl,
         lrc: null,
+        types,
+        _types,
         typeUrl: {},
       }
     })

src/renderer/utils/request.js

@@ -1,25 +1,20 @@
 import request from 'request'
 // import progress from 'request-progress'
 import { debugRequest } from './env'
+import { requestMsg } from './message'
+import { bHh } from './music/options'
 // import fs from 'fs'
 
-const fatchData = (url, method, options, callback) => {
-  console.log('---start---', url)
-  return request(url, {
-    method,
-    headers: options.headers,
-    Origin: options.origin,
-    data: options.data,
-    // timeout: 5000,
-    json: options.format === undefined || options.format === 'json',
-  }, (err, resp, body) => {
-    if (err) return callback(err, null)
-    console.log('---end---', url)
-    callback(null, resp, body)
-  })
+const headers = {
+  'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36',
 }
 
-export const httpFatch = (url, options = { method: 'get' }) => {
+/**
+ * promise 形式的请求方法
+ * @param {*} url
+ * @param {*} options
+ */
+const buildHttpPromose = (url, options) => {
   let requestObj
   let cancelFn
   const p = new Promise((resolve, reject) => {
@@ -32,12 +27,13 @@ export const httpFatch = (url, options = { method: 'get' }) => {
       requestObj = null
       cancelFn = null
       if (err) {
-        console.log(err)
-        if (err.code === 'ETIMEDOUT') {
+        console.log(err.code)
+        if (err.code === 'ETIMEDOUT' || err.code == 'ESOCKETTIMEDOUT') {
           const { promise, cancelHttp } = httpFatch(url, options)
           obj.cancelHttp = cancelHttp
-          return promise
+          promise.then()
         }
+        return reject(err)
       }
       resolve(resp)
     })
@@ -45,10 +41,10 @@ export const httpFatch = (url, options = { method: 'get' }) => {
   const obj = {
     promise: p,
     cancelHttp() {
-      console.log('cancel')
       if (!requestObj) return
+      console.log('cancel')
       cancelHttp(requestObj)
-      cancelFn(new Error('取消http请求'))
+      cancelFn(new Error(requestMsg.cancelRequest))
       requestObj = null
       cancelFn = null
     },
@@ -56,6 +52,30 @@ export const httpFatch = (url, options = { method: 'get' }) => {
   return obj
 }
 
+/**
+ * 请求超时自动重试
+ * @param {*} url
+ * @param {*} options
+ */
+export const httpFatch = (url, options = { method: 'get' }) => {
+  const requestObj = buildHttpPromose(url, options)
+  requestObj.promise = requestObj.promise.catch(err => {
+    if (err.code === 'ETIMEDOUT' || err.code == 'ESOCKETTIMEDOUT') {
+      const { promise, cancelHttp } = httpFatch(url, options)
+      requestObj.cancelHttp()
+      requestObj.cancelHttp = cancelHttp
+      return promise
+    }
+    if (err.message === 'socket hang up') {
+      // window.globalObj.apiSource = 'temp'
+      return Promise.reject(new Error(requestMsg.unachievable))
+    }
+    if (err.code === 'ENOTFOUND') return Promise.reject(new Error(requestMsg.notConnectNetwork))
+    return Promise.reject(err)
+  })
+  return requestObj
+}
+
 /**
  * 取消请求
  * @param {*} index
@@ -194,3 +214,28 @@ export const http_jsonp = (url, options, callback) => {
     callback(err, resp, body)
   })
 }
+
+const fatchData = (url, method, options, callback) => {
+  // console.log(url, options)
+  console.log('---start---', url)
+  if (options.headers && options.headers[bHh]) {
+    let s = Buffer.from(bHh, 'hex').toString()
+    s = s.replace(s.substr(-1), '')
+    s = Buffer.from(s, 'base64').toString()
+    options.headers[s] = !!s
+    delete options.headers[bHh]
+  }
+  return request(url, {
+    method,
+    headers: Object.assign({}, headers, options.headers || {}),
+    Origin: options.origin,
+    body: options.body,
+    form: options.form,
+    formData: options.formData,
+    timeout: options.timeout || 10000,
+    json: options.format === undefined || options.format === 'json',
+  }, (err, resp, body) => {
+    if (err) return callback(err, null)
+    callback(null, resp, body)
+  })
+}

src/renderer/views/Download.vue

@@ -6,8 +6,11 @@ div(:class="$style.download")
       table
         thead
           tr
-            th.nobreak(style="width: 30%;") 歌曲名
-            th.nobreak(style="width: 25%;") 进度
+            th.nobreak.center(style="width: 37px;")
+              material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
+                :indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
+            th.nobreak(style="width: 28%;") 歌曲名
+            th.nobreak(style="width: 22%;") 进度
             th.nobreak(style="width: 15%;") 状态
             th.nobreak(style="width: 10%;") 品质
             th.nobreak(style="width: 20%;") 操作
@@ -15,12 +18,17 @@ div(:class="$style.download")
       table
         tbody
           tr(v-for='(item, index) in list' :key='item.key' @click="handleDoubleClick(index)" :class="isPlayList && playIndex === index ? $style.active : ''")
-            td.break(style="width: 30%;") {{item.musicInfo.name}} - {{item.musicInfo.singer}}
-            td.break(style="width: 25%;") {{item.progress.progress}}%
+            td.nobreak.center(style="width: 37px;" @click.stop)
+              material-checkbox(:id="index.toString()" v-model="selectdData" :value="item")
+            td.break(style="width: 28%;") {{item.musicInfo.name}} - {{item.musicInfo.singer}}
+            td.break(style="width: 22%;") {{item.progress.progress}}%
             td.break(style="width: 15%;") {{item.statusText}}
-            td.break(style="width: 10%;") {{item.type.toUpperCase()}}
+            td.break(style="width: 10%;") {{item.type && item.type.toUpperCase()}}
             td(style="width: 20%; padding-left: 0; padding-right: 0;")
-              material-list-buttons(:index="index" :downloadBtn="false" @btn-click="handleBtnClick")
+              material-list-buttons(:index="index" :download-btn="false" :start-btn="!item.isComplate && item.status != downloadStatus.WAITING && (item.status != downloadStatus.RUN)"
+                :pause-btn="!item.isComplate && (item.status == downloadStatus.RUN || item.status == downloadStatus.WAITING)"
+                :play-btn="item.status == downloadStatus.COMPLETED" @btn-click="handleListBtnClick")
+    material-flow-btn(:show="isShowEditBtn" :play-btn="false" :download-btn="false" :add-btn="false" :start-btn="true" :pause-btn="true" @btn-click="handleFlowBtnClick")
   div(:class="$style.noItem" v-else)
 </template>
 
@@ -34,26 +42,51 @@ export default {
     return {
       clickTime: window.performance.now(),
       clickIndex: -1,
+      selectdData: [],
+      isSelectAll: false,
+      isIndeterminate: false,
+      isShowEditBtn: false,
+      isShowDownloadMultiple: false,
     }
   },
   computed: {
-    ...mapGetters('download', ['list', 'dls']),
+    ...mapGetters('download', ['list', 'dls', 'downloadStatus']),
     ...mapGetters('player', ['listId', 'playIndex']),
     isPlayList() {
       return this.listId == 'download'
     },
   },
-  methods: {
-    ...mapActions('download', ['removeTask', 'resumeTask']),
-    ...mapMutations('player', ['setList']),
-    pauseTask(index) {
-      let info = this.list[index]
-      this.dls[info.key].pause()
+  watch: {
+    selectdData(n) {
+      const len = n.length
+      if (len) {
+        this.isSelectAll = true
+        this.isIndeterminate = len !== this.list.length
+        this.isShowEditBtn = true
+      } else {
+        this.isSelectAll = false
+        this.isShowEditBtn = false
+      }
     },
-    startTask(index) {
+    list() {
+      this.resetSelect()
+    },
+  },
+  methods: {
+    ...mapActions('download', ['removeTask', 'removeTaskMultiple', 'startTask']),
+    ...mapMutations('player', ['setList']),
+    ...mapMutations('download', ['pauseTask']),
+    handlePauseTask(index) {
       let info = this.list[index]
       let dl = this.dls[info.key]
-      dl ? dl.resume() : this.resumeTask(info)
+      dl ? dl.pause() : this.pauseTask(info)
+      console.log('pause')
+    },
+    handleStartTask(index) {
+      console.log('start')
+      let info = this.list[index]
+      let dl = this.dls[info.key]
+      dl ? dl.resume() : this.startTask(info)
     },
     handleDoubleClick(index) {
       if (
@@ -72,26 +105,71 @@ export default {
       let info = this.list[index]
       if (info.isComplate) {
         this.handlePlay(index)
-      } else if (info.isDownloading) {
-        this.pauseTask(index)
+      } else if (info.status === this.downloadStatus.RUN) {
+        this.handlePauseTask(index)
       } else {
-        this.startTask(index)
+        this.handleStartTask(index)
       }
     },
     handlePlay(index) {
       if (!checkPath(this.list[index].filePath)) return
       this.setList({ list: this.list, listId: 'download', index })
     },
-    handleBtnClick(info) {
+    handleListBtnClick(info) {
       switch (info.action) {
         case 'play':
           this.handlePlay(info.index)
           break
+        case 'start':
+          this.handleStartTask(info.index)
+          break
+        case 'pause':
+          this.handlePauseTask(info.index)
+          break
         case 'remove':
           this.removeTask(info.index)
           break
       }
     },
+    handleSelectAllData(isSelect) {
+      this.selectdData = isSelect ? [...this.list] : []
+    },
+    resetSelect() {
+      this.isSelectAll = false
+      this.selectdData = []
+    },
+    handleFlowBtnClick(action) {
+      switch (action) {
+        case 'start':
+          this.selectdData.forEach(item => {
+            if (item.isComplate || item.status == this.downloadStatus.RUN) return
+            let index = this.list.indexOf(item)
+            if (index < 0) return
+            this.handleStartTask(index)
+          })
+          break
+        case 'pause':
+          let runs = []
+          this.selectdData.forEach(item => {
+            if (item.isComplate || item.status == this.downloadStatus.PAUSE) return
+            if (item.status == this.downloadStatus.RUN) return runs.push(item)
+            let index = this.list.indexOf(item)
+            if (index < 0) return
+            this.handlePauseTask(index)
+          })
+          runs.forEach(item => {
+            if (item.isComplate || item.status == this.downloadStatus.PAUSE) return
+            let index = this.list.indexOf(item)
+            if (index < 0) return
+            this.handlePauseTask(index)
+          })
+          break
+        case 'remove':
+          this.removeTaskMultiple(this.selectdData)
+          break
+      }
+      this.resetSelect()
+    },
   },
 }
 </script>

src/renderer/views/Leaderboard.vue

@@ -1,44 +1,15 @@
 <template lang="pug">
   div(:class="$style.leaderboard")
     div(:class="$style.header")
-      material-tab(:class="$style.tab" :list="types" item-key="id" item-name="name" v-model="tabId")
+      material-tab(:class="$style.tab" :list="types" align="left" item-key="id" item-name="name" v-model="tabId")
       material-select(:class="$style.select" :list="sourceInfo.sources" item-key="id" item-name="name" v-model="source")
-    div(:class="$style.content")
-      div(v-if="list.length" :class="$style.list")
-        div(:class="$style.thead")
-          table
-            thead
-              tr
-                th.nobreak(style="width: 27%;") 歌曲名
-                th.nobreak(style="width: 20%;") 歌手
-                th.nobreak(style="width: 25%;") 专辑
-                th.nobreak(style="width: 18%;") 操作
-                th.nobreak(style="width: 10%;") 时长
-        div.scroll(:class="$style.tbody" ref="dom_scrollContent")
-          table
-            tbody
-              tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)")
-                td.break(style="width: 27%;")
-                  | {{item.name}}
-                  //- span.badge.badge-info(v-if="item._types['320k']") 高品质
-                  //- span.badge.badge-success(v-if="item._types.ape || item._types.flac") 无损
-                td.break(style="width: 20%;") {{item.singer}}
-                td.break(style="width: 25%;") {{item.albumName}}
-                td(style="width: 18%;")
-                  material-list-buttons(:index="index" :search-btn="true" :play-btn="item.source == 'kw'" :download-btn="item.source == 'kw'" :remove-btn="false" @btn-click="handleBtnClick")
-                  //- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
-                  //- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
-                  //- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') ＋
-                td(style="width: 10%;") {{item.interval}}
-          div(:class="$style.pagination")
-            material-pagination(:count="info.total" :limit="info.limit" :page="info.page" @btn-click="handleTogglePage")
-    material-download-modal(:show="showDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="showDownload = false")
+    material-song-list(v-model="selectdData" @action="handleSongListAction" :source="source" :page="page" :limit="info.limit" :total="info.total" :list="list")
+    material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
+    material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
 </template>
 
 <script>
 import { mapGetters, mapMutations, mapActions } from 'vuex'
-import { scrollTo } from '../utils'
-// import music from '../utils/music'
 export default {
   name: 'Leaderboard',
   data() {
@@ -46,10 +17,10 @@ export default {
       tabId: null,
       source: null,
       page: 1,
-      clickTime: 0,
-      clickIndex: -1,
-      showDownload: false,
+      isShowDownload: false,
       musicInfo: null,
+      selectdData: [],
+      isShowDownloadMultiple: false,
     }
   },
   computed: {
@@ -59,6 +30,9 @@ export default {
     types() {
       return this.source ? this.sourceInfo.sourceList[this.source] : []
     },
+    isAPITemp() {
+      return this.setting.apiSource == 'temp'
+    },
   },
   watch: {
     tabId(n, o) {
@@ -66,7 +40,6 @@ export default {
       if (!o && this.page !== 1) return
       this.getList(1).then(() => {
         this.page = this.info.page
-        scrollTo(this.$refs.dom_scrollContent, 0)
       })
     },
     source(n, o) {
@@ -82,28 +55,15 @@ export default {
   methods: {
     ...mapMutations(['setLeaderboard']),
     ...mapActions('leaderboard', ['getList']),
-    ...mapActions('download', ['createDownload']),
-    ...mapMutations('list', ['defaultListAdd']),
+    ...mapActions('download', ['createDownload', 'createDownloadMultiple']),
+    ...mapMutations('list', ['defaultListAdd', 'defaultListAddMultiple']),
     ...mapMutations('player', ['setList']),
-    handleDoubleClick(index) {
-      if (
-        window.performance.now() - this.clickTime > 400 ||
-        this.clickIndex !== index
-      ) {
-        this.clickTime = window.performance.now()
-        this.clickIndex = index
-        return
-      }
-      (this.source == 'kw') ? this.testPlay(index) : this.handleSearch(index)
-      this.clickTime = 0
-      this.clickIndex = -1
-    },
-    handleBtnClick(info) {
+    handleListBtnClick(info) {
       switch (info.action) {
         case 'download':
           this.musicInfo = this.list[info.index]
           this.$nextTick(() => {
-            this.showDownload = true
+            this.isShowDownload = true
           })
           break
         case 'play':
@@ -117,8 +77,15 @@ export default {
       }
     },
     testPlay(index) {
-      let targetSong = this.list[index]
-      this.defaultListAdd(targetSong)
+      let targetSong
+      if (index == null) {
+        targetSong = this.selectdData[0]
+        this.defaultListAddMultiple(this.selectdData)
+        this.resetSelect()
+      } else {
+        targetSong = this.list[index]
+        this.defaultListAdd(targetSong)
+      }
       let targetIndex = this.defaultList.list.findIndex(
         s => s.songmid === targetSong.songmid
       )
@@ -135,21 +102,59 @@ export default {
       this.$router.push({
         path: 'search',
         query: {
-          text: `${info.name} - ${info.singer}`,
+          text: `${info.name} ${info.singer}`,
         },
       })
     },
     handleTogglePage(page) {
       this.getList(page).then(() => {
         this.page = this.info.page
-        this.$nextTick(() => {
-          scrollTo(this.$refs.dom_scrollContent, 0)
-        })
       })
     },
     handleAddDownload(type) {
       this.createDownload({ musicInfo: this.musicInfo, type })
-      this.showDownload = false
+      this.isShowDownload = false
+    },
+    handleAddDownloadMultiple(type) {
+      switch (this.source) {
+        // case 'kg':
+        case 'wy':
+          type = '128k'
+      }
+      this.createDownloadMultiple({ list: [...this.selectdData], type })
+      this.isShowDownloadMultiple = false
+      this.resetSelect()
+    },
+    handleFlowBtnClick(action) {
+      switch (action) {
+        case 'download':
+          this.isShowDownloadMultiple = true
+          break
+        case 'play':
+          this.testPlay()
+          break
+        case 'add':
+          this.defaultListAddMultiple(this.selectdData)
+          this.resetSelect()
+          break
+      }
+    },
+    handleSongListAction({ action, data }) {
+      switch (action) {
+        case 'listBtnClick':
+          return this.handleListBtnClick(data)
+        case 'togglePage':
+          return this.handleTogglePage(data)
+        case 'flowBtnClick':
+          return this.handleFlowBtnClick(data)
+        case 'testPlay':
+          return this.testPlay(data)
+        case 'search':
+          return this.handleSearch(data)
+      }
+    },
+    resetSelect() {
+      this.selectdData = []
     },
   },
 }
@@ -183,46 +188,5 @@ export default {
   overflow: hidden;
   flex-flow: column nowrap;
 }
-.list {
-  position: relative;
-  height: 100%;
-  font-size: 14px;
-  display: flex;
-  flex-flow: column nowrap;
-  // table {
-  //   position: relative;
-  //   thead {
-  //     position: fixed;
-  //     width: 100%;
-  //     th {
-  //       width: 100%;
-  //     }
-  //   }
-  // }
-}
-.thead {
-  flex: none;
-}
-.tbody {
-  flex: auto;
-  overflow-y: auto;
-  td {
-    font-size: 12px;
-    :global(.badge) {
-      margin-right: 3px;
-      &:first-child {
-        margin-left: 3px;
-      }
-      &:last-child {
-        margin-right: 0;
-      }
-    }
-  }
-}
-.pagination {
-  text-align: center;
-  padding: 15px 0;
-  // left: 50%;
-  // transform: translateX(-50%);
-}
+
 </style>

src/renderer/views/List.vue

@@ -6,15 +6,21 @@
         table
           thead
             tr
+              th.nobreak.center(style="width: 37px;")
+                material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
+                  :indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
               th.nobreak(style="width: 25%;") 歌曲名
               th.nobreak(style="width: 20%;") 歌手
-              th.nobreak(style="width: 25%;" v-if="setting.list.isShowAlbumName") 专辑
+              th.nobreak(style="width: 20%;") 专辑
               th.nobreak(style="width: 20%;") 操作
               th.nobreak(style="width: 10%;") 时长
       div.scroll(:class="$style.tbody")
         table
           tbody
-            tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)" :class="isPlayList && playIndex === index ? $style.active : ''")
+            tr(v-for='(item, index) in list' :key='item.songmid'
+              @click="handleDoubleClick(index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') || item.source == 'tx' ? $style.disabled : '']")
+              td.nobreak.center(style="width: 37px;" @click.stop)
+                  material-checkbox(:id="index.toString()" v-model="selectdData" :value="item")
               td.break(style="width: 25%;") {{item.name}}
                 //- span.badge.badge-light(v-if="item._types['128k']") 128K
                 //- span.badge.badge-light(v-if="item._types['192k']") 192K
@@ -22,16 +28,18 @@
                 //- span.badge.badge-info(v-if="item._types.ape") APE
                 //- span.badge.badge-success(v-if="item._types.flac") FLAC
               td.break(style="width: 20%;") {{item.singer}}
-              td.break(style="width: 25%;" v-if="setting.list.isShowAlbumName") {{item.albumName}}
+              td.break(style="width: 20%;") {{item.albumName}}
               td(style="width: 20%; padding-left: 0; padding-right: 0;")
-                material-list-buttons(:index="index" @btn-click="handleBtnClick")
+                material-list-buttons(:index="index" @btn-click="handleListBtnClick")
                 //- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
                 //- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
                 //- button.btn-secondary(type='button' @click.stop='handleRemove(index)') 删除
                 //- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') ＋
-              td(style="width: 10%;") {{item.interval}}
+              td(style="width: 10%;") {{item.interval || '--/--'}}
     div(:class="$style.noItem" v-else)
-    material-download-modal(:show="showDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="showDownload = false")
+    material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
+    material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
+    material-flow-btn(:show="isShowEditBtn" :add-btn="false" :play-btn="false" @btn-click="handleFlowBtnClick")
 </template>
 
 <script>
@@ -42,8 +50,13 @@ export default {
     return {
       clickTime: window.performance.now(),
       clickIndex: -1,
-      showDownload: false,
+      isShowDownload: false,
       musicInfo: null,
+      selectdData: [],
+      isSelectAll: false,
+      isIndeterminate: false,
+      isShowEditBtn: false,
+      isShowDownloadMultiple: false,
     }
   },
   computed: {
@@ -61,6 +74,25 @@ export default {
         ? this.defaultList.list
         : this.userList.find(l => l._id == this.$route.query.id) || []
     },
+    isAPITemp() {
+      return this.setting.apiSource == 'temp'
+    },
+  },
+  watch: {
+    selectdData(n) {
+      const len = n.length
+      if (len) {
+        this.isSelectAll = true
+        this.isIndeterminate = len !== this.list.length
+        this.isShowEditBtn = true
+      } else {
+        this.isSelectAll = false
+        this.isShowEditBtn = false
+      }
+    },
+    list() {
+      this.resetSelect()
+    },
   },
   // beforeRouteUpdate(to, from, next) {
   //   // if (to.query.id === undefined) return
@@ -88,9 +120,9 @@ export default {
   // }
   // },
   methods: {
-    ...mapMutations('list', ['defaultListRemove']),
+    ...mapMutations('list', ['defaultListRemove', 'defaultListRemoveMultiple']),
+    ...mapActions('download', ['createDownload', 'createDownloadMultiple']),
     ...mapMutations('player', ['setList']),
-    ...mapActions('download', ['createDownload']),
     handleDoubleClick(index) {
       if (
         window.performance.now() - this.clickTime > 400 ||
@@ -105,24 +137,25 @@ export default {
       this.clickIndex = -1
     },
     testPlay(index) {
+      if ((this.isAPITemp && this.list[index].source != 'kw') || this.list[index].source == 'tx') return
       this.setList({ list: this.list, listId: 'test', index })
     },
     handleRemove(index) {
       this.defaultListRemove(index)
     },
-    handleBtnClick(info) {
+    handleListBtnClick(info) {
       switch (info.action) {
         case 'download':
-          this.musicInfo = this.list[info.index]
+          const minfo = this.list[info.index]
+          if ((this.isAPITemp && minfo.source != 'kw') || minfo.source == 'tx') return
+          this.musicInfo = minfo
           this.$nextTick(() => {
-            this.showDownload = true
+            this.isShowDownload = true
           })
           break
         case 'play':
           this.testPlay(info.index)
           break
-        case 'add':
-          break
         case 'remove':
           this.handleRemove(info.index)
           break
@@ -130,7 +163,31 @@ export default {
     },
     handleAddDownload(type) {
       this.createDownload({ musicInfo: this.musicInfo, type })
-      this.showDownload = false
+      this.isShowDownload = false
+    },
+    handleSelectAllData(isSelect) {
+      this.selectdData = isSelect ? [...this.list] : []
+    },
+    resetSelect() {
+      this.isSelectAll = false
+      this.selectdData = []
+    },
+    handleAddDownloadMultiple(type) {
+      const list = this.setting.apiSource == 'temp' ? this.selectdData.filter(s => s.source == 'kw') : this.selectdData.filter(s => s.source != 'tx')
+      this.createDownloadMultiple({ list, type })
+      this.resetSelect()
+      this.isShowDownloadMultiple = false
+    },
+    handleFlowBtnClick(action) {
+      switch (action) {
+        case 'download':
+          this.isShowDownloadMultiple = true
+          break
+        case 'remove':
+          this.defaultListRemoveMultiple(this.selectdData)
+          this.resetSelect()
+          break
+      }
     },
   },
 }
@@ -178,6 +235,10 @@ export default {
   }
 }
 
+.disabled {
+  opacity: .5;
+}
+
 each(@themes, {
   :global(#container.@{value}) {
     .tbody {

src/renderer/views/Recommend.vue

@@ -1,20 +0,0 @@
-<template lang="pug">
-  div
-    h2 推荐
-</template>
-
-<script>
-export default {
-  name: 'About',
-  data() {
-    return {
-      count: 0,
-    }
-  },
-  methods: {
-    add() {
-      this.count++
-    },
-  },
-}
-</script>

src/renderer/views/Search.vue

@@ -6,7 +6,10 @@
         table
           thead
             tr
-              th.nobreak(style="width: 30%;") 歌曲名
+              th.nobreak.center(style="width: 37px;")
+                material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
+                  :indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
+              th.nobreak(style="width: 25%;") 歌曲名
               th.nobreak(style="width: 20%;") 歌手
               th.nobreak(style="width: 25%;") 专辑
               th.nobreak(style="width: 15%;") 操作
@@ -15,19 +18,24 @@
         table
           tbody
             tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)")
-              td.break(style="width: 30%;")
+              td.nobreak.center(style="width: 37px;" @click.stop)
+                material-checkbox(:id="index.toString()" v-model="selectdData" :value="item")
+              td.break(style="width: 25%;")
                 | {{item.name}}
                 span.badge.badge-info(v-if="item._types['320k']") 高品质
                 span.badge.badge-success(v-if="item._types.ape || item._types.flac") 无损
               td.break(style="width: 20%;") {{item.singer}}
               td.break(style="width: 25%;") {{item.albumName}}
               td(style="width: 15%;")
-                material-list-buttons(:index="index" :remove-btn="false" @btn-click="handleBtnClick")
+                material-list-buttons(:index="index" :remove-btn="false" @btn-click="handleListBtnClick")
               td(style="width: 10%;") {{item.interval}}
         div(:class="$style.pagination")
           material-pagination(:count="listInfo.total" :limit="limit" :page="page" @btn-click="handleTogglePage")
-    div(v-else :class="$style.noItem")
-    material-download-modal(:show="showDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="showDownload = false")
+    div(v-else :class="$style.noitem")
+      p 搜我所想~~😉
+    material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
+    material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
+    material-flow-btn(:show="isShowEditBtn" :remove-btn="false" @btn-click="handleFlowBtnClick")
 </template>
 
 <script>
@@ -42,8 +50,13 @@ export default {
       text: '',
       clickTime: 0,
       clickIndex: -1,
-      showDownload: false,
+      isShowDownload: false,
       musicInfo: null,
+      selectdData: [],
+      isSelectAll: false,
+      isIndeterminate: false,
+      isShowEditBtn: false,
+      isShowDownloadMultiple: false,
     }
   },
   beforeRouteUpdate(to, from, next) {
@@ -71,6 +84,22 @@ export default {
       this.handleSearch(this.text, this.page)
     }
   },
+  watch: {
+    selectdData(n) {
+      const len = n.length
+      if (len) {
+        this.isSelectAll = true
+        this.isIndeterminate = len !== this.list.length
+        this.isShowEditBtn = true
+      } else {
+        this.isSelectAll = false
+        this.isShowEditBtn = false
+      }
+    },
+    list() {
+      this.resetSelect()
+    },
+  },
   computed: {
     ...mapGetters(['userInfo']),
     ...mapGetters('search', ['list', 'limit', 'listInfo']),
@@ -78,9 +107,9 @@ export default {
   },
   methods: {
     ...mapActions('search', ['search']),
-    ...mapActions('download', ['createDownload']),
+    ...mapActions('download', ['createDownload', 'createDownloadMultiple']),
     ...mapMutations('search', ['clearList', 'setPage']),
-    ...mapMutations('list', ['defaultListAdd']),
+    ...mapMutations('list', ['defaultListAdd', 'defaultListAddMultiple']),
     ...mapMutations('player', ['setList']),
     handleSearch(text, page) {
       this.search({ text, page, limit: this.limit }).then(data => {
@@ -103,12 +132,12 @@ export default {
       this.clickTime = 0
       this.clickIndex = -1
     },
-    handleBtnClick(info) {
+    handleListBtnClick(info) {
       switch (info.action) {
         case 'download':
           this.musicInfo = this.list[info.index]
           this.$nextTick(() => {
-            this.showDownload = true
+            this.isShowDownload = true
           })
           break
         case 'play':
@@ -118,10 +147,15 @@ export default {
           break
       }
     },
-    openDownloadModal() {},
     testPlay(index) {
-      let targetSong = this.list[index]
-      this.defaultListAdd(targetSong)
+      let targetSong
+      if (index == null) {
+        targetSong = this.selectdData[0]
+        this.defaultListAddMultiple(this.selectdData)
+      } else {
+        targetSong = this.list[index]
+        this.defaultListAdd(targetSong)
+      }
       let targetIndex = this.defaultList.list.findIndex(
         s => s.songmid === targetSong.songmid
       )
@@ -138,7 +172,34 @@ export default {
     },
     handleAddDownload(type) {
       this.createDownload({ musicInfo: this.musicInfo, type })
-      this.showDownload = false
+      this.isShowDownload = false
+    },
+    handleAddDownloadMultiple(type) {
+      this.createDownloadMultiple({ list: [...this.selectdData], type })
+      this.resetSelect()
+      this.isShowDownloadMultiple = false
+    },
+    handleSelectAllData(isSelect) {
+      this.selectdData = isSelect ? [...this.list] : []
+    },
+    resetSelect() {
+      this.isSelectAll = false
+      this.selectdData = []
+    },
+    handleFlowBtnClick(action) {
+      switch (action) {
+        case 'download':
+          this.isShowDownloadMultiple = true
+          break
+        case 'play':
+          this.testPlay()
+          this.resetSelect()
+          break
+        case 'add':
+          this.defaultListAddMultiple(this.selectdData)
+          this.resetSelect()
+          break
+      }
     },
   },
 }
@@ -183,7 +244,17 @@ export default {
   // left: 50%;
   // transform: translateX(-50%);
 }
-// .noItem {
+.noitem {
+  position: relative;
+  height: 100%;
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  align-items: center;
 
-// }
+  p {
+    font-size: 24px;
+    color: #ccc;
+  }
+}
 </style>

src/renderer/views/Setting.vue

@@ -13,18 +13,28 @@ div.scroll(:class="$style.setting")
     dd(title='弹出层的动画效果')
       h3 弹出层随机动画
       div
-        material-checkbox(id="setting_animate" v-model="current_setting.randomAnimate") 是否启用
+        material-checkbox(id="setting_animate" v-model="current_setting.randomAnimate" label="是否启用")
+
+    dd(title='选择音乐来源')
+      h3 音乐来源
+      div
+        material-checkbox(v-for="item in apiSources" :id="`setting_api_source_${item.id}`" @change="handleAPISourceChange(item.id)" :class="$style.gapTop"
+          need v-model="current_setting.apiSource" :disabled="item.disabled" :value="item.id" :label="item.label" :key="item.id")
 
     dt 播放设置
     dd(title="都不选时播放完当前歌曲就停止播放")
       h3 歌曲切换方式
       div
-        material-checkbox(:id="`setting_player_togglePlay_${item.value}`" :class="$style.gap" :target="item.value" :key="item.value"
-            v-model="current_setting.player.togglePlayMethod" v-for="item in togglePlayMethods") {{item.name}}
+        material-checkbox(:id="`setting_player_togglePlay_${item.value}`" :class="$style.gapLeft" :value="item.value" :key="item.value"
+            v-model="current_setting.player.togglePlayMethod" v-for="item in togglePlayMethods" :label="item.name")
     dd(title='启用时将优先播放320K品质的歌曲')
       h3 优先播放高品质音乐
       div
-        material-checkbox(id="setting_player_highQuality" v-model="current_setting.player.highQuality") 是否启用
+        material-checkbox(id="setting_player_highQuality" v-model="current_setting.player.highQuality" label="是否启用")
+    dd(title='在任务栏上显示当前歌曲播放进度')
+      h3 是否启用任务栏播放进度条
+      div
+        material-checkbox(id="setting_player_showTaskProgess" v-model="current_setting.player.isShowTaskProgess" label="是否启用")
     dt 下载设置
     dd(title='下载歌曲保存的路径')
       h3 下载路径
@@ -37,34 +47,54 @@ div.scroll(:class="$style.setting")
     dd(title='下载歌曲时的命名方式')
       h3 文件命名方式
       div
-        material-checkbox(:id="`setting_download_musicName_${item.value}`" :class="$style.gap" name="setting_download_musicName" :target="item.value" :key="item.value" need
-            v-model="current_setting.download.fileName" v-for="item in musicNames") {{item.name}}
-    dt 列表设置
-    dd(title='播放列表是否显示专辑栏')
+        material-checkbox(:id="`setting_download_musicName_${item.value}`" :class="$style.gapLeft" name="setting_download_musicName" :value="item.value" :key="item.value" need
+            v-model="current_setting.download.fileName" v-for="item in musicNames" :label="item.name")
+    dd(title='封面嵌入')
+      h3 是否将封面嵌入音频文件中（只支持MP3格式）
+      div
+        material-checkbox(id="setting_download_isEmbedPic" v-model="current_setting.download.isEmbedPic" label="是否启用")
+    dd(title='歌词下载')
+      h3 是否同时下载歌词文件
+      div
+        material-checkbox(id="setting_download_isDownloadLrc" v-model="current_setting.download.isDownloadLrc" label="是否启用")
+    //- dt 列表设置
+    //- dd(title='播放列表是否显示专辑栏')
       h3 专辑栏
       div
-        material-checkbox(id="setting_list_showalbum" v-model="current_setting.list.isShowAlbumName") 是否显示专辑栏
+        material-checkbox(id="setting_list_showalbum" v-model="current_setting.list.isShowAlbumName" label="是否显示专辑栏")
     dt 备份与恢复
     dd
       h3 部分数据
       div
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleImportPlayList") 导入列表
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleExportPlayList") 导出列表
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleImportSetting") 导入设置
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleExportSetting") 导出设置
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleImportPlayList") 导入列表
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleExportPlayList") 导出列表
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleImportSetting") 导入设置
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleExportSetting") 导出设置
     dd
       h3 所有数据（设置与试听列表）
       div
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleImportAllData") 导入
-        material-btn(:class="[$style.btn, $style.gap]" min @click="handleExportAllData") 导出
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleImportAllData") 导入
+        material-btn(:class="[$style.btn, $style.gapLeft]" min @click="handleExportAllData") 导出
+    dt 软件更新
+    dd
+      p.small
+        | 最新版本：{{version.newVersion ? version.newVersion.version : '未知'}}
+      p.small 当前版本：{{version.version}}
+      p.small(v-if="version.newVersion")
+        span(v-if="isLatestVer") 软件已是最新，尽情地体验吧~🥂
+        material-btn(v-else-if="setting.ignoreVersion || version.isError" :class="[$style.btn, $style.gapLeft]" min @click="showUpdateModal") 打开更新窗口 🚀
+        span(v-else) 发现新版本并在努力下载中，请稍等...⏳
+      p.small(v-else) 检查更新中...
     dt 关于洛雪音乐
     dd
       p.small
         | 本软件完全免费，代码已开源，开源地址：
-        span.hover(@click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop')") https://github.com/lyswhut/lx-music-desktop
-      p
-        small 当前版本：
-        | {{version.version}}
+        span.hover(title="点击打开" @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop#readme')") https://github.com/lyswhut/lx-music-desktop
+      p.small
+        | 最新版网盘下载地址（网盘内有MAC、windows版）：
+        span.hover(title="点击打开" @click="handleOpenUrl('https://www.lanzous.com/b906260/')") https://www.lanzous.com/b906260/
+        |   密码：
+        span.hover(title="点击复制" @click="clipboardWriteText('glqw')") glqw
       p.small
         |  本软件仅用于学习交流使用，禁止将本软件用于
         strong 非法用途
@@ -76,10 +106,18 @@ div.scroll(:class="$style.setting")
           strong 使用者
           | 承担！
       p.small
-          | 本软件的部分接口使用自 https://github.com/messoer ，非常感谢
+          | 怀念曾经的
           strong @messoer
-          | ！
-      p.small 若有问题可 mail to：lyswhut@qq.com 或到 github 提交 issue
+          | ，非常感谢曾经为本软件提供数据源！
+      p.small 若有问题可 mail to：lyswhut@qq.com 或到 GitHub 提交 issue
+      p.small
+        | 若觉得好用的话可以去 GitHub 点个
+        strong star
+        | 支持作者哦~~🍻
+      p
+        span 如果你资金充裕，还可以
+        material-btn(@click="handleOpenUrl('https://cdn.stsky.cn/qrc.png')" min title="土豪，你好 🙂") 打赏下作者
+        span ，以帮我分担点服务器费用~❤️
       p
         small By：
         | 落雪无痕
@@ -87,13 +125,19 @@ div.scroll(:class="$style.setting")
 
 <script>
 import { mapGetters, mapMutations } from 'vuex'
-import { openDirInExplorer, openSelectDir, openSaveDir, updateSetting, openUrl } from '../utils'
+import { openDirInExplorer, openSelectDir, openSaveDir, updateSetting, openUrl, clipboardWriteText } from '../utils'
+import { rendererSend } from '../../common/icp'
 import fs from 'fs'
+
+
 export default {
   name: 'Setting',
   computed: {
     ...mapGetters(['setting', 'themes', 'version']),
     ...mapGetters('list', ['defaultList']),
+    isLatestVer() {
+      return this.version.newVersion && this.version.version === this.version.newVersion.version
+    },
   },
   data() {
     return {
@@ -102,17 +146,21 @@ export default {
         player: {
           togglePlayMethod: 'random',
           highQuality: false,
+          isShowTaskProgess: true,
         },
         list: {
           isShowAlbumName: true,
         },
         download: {
-          savePath: 'C:\\',
+          savePath: '',
           fileName: '歌名 - 歌手',
+          isDownloadLrc: false,
+          isEmbedPic: true,
         },
         themeId: 0,
         sourceId: 0,
         randomAnimate: true,
+        apiSource: 'messoer',
       },
       togglePlayMethods: [
         {
@@ -132,6 +180,29 @@ export default {
           value: 'singleLoop',
         },
       ],
+      apiSources: [
+        // {
+        //   id: 'messoer',
+        //   // label: '由 messoer 提供的接口（推荐，软件的所有功能都可用）',
+        //   label: '由 messoer 提供的接口（该接口已关闭）',
+        //   disabled: true,
+        // },
+        // {
+        //   id: 'internal',
+        //   label: '内置接口（只能试听或下载128k音质，该接口支持软件的所有功能）',
+        //   disabled: false,
+        // },
+        {
+          id: 'test',
+          label: '测试接口（软件的大部分功能可用，该接口访问速度略慢）',
+          disabled: false,
+        },
+        {
+          id: 'temp',
+          label: '临时接口（软件的某些功能不可用，该接口比测试接口快一些，建议测试接口不可用再使用本接口）',
+          disabled: false,
+        },
+      ],
       musicNames: [
         {
           name: '歌名 - 歌手',
@@ -156,12 +227,21 @@ export default {
       },
       deep: true,
     },
+    'current_setting.player.isShowTaskProgess'(n) {
+      if (n) return
+      this.$nextTick(() => {
+        rendererSend('progress', {
+          status: -1,
+          mode: 'normal',
+        })
+      })
+    },
   },
   mounted() {
     this.init()
   },
   methods: {
-    ...mapMutations(['setSetting']),
+    ...mapMutations(['setSetting', 'setVersionModalVisible']),
     ...mapMutations('list', ['setDefaultList']),
     init() {
       this.current_setting = JSON.parse(JSON.stringify(this.setting))
@@ -310,6 +390,20 @@ export default {
     handleOpenUrl(url) {
       openUrl(url)
     },
+    handleAPISourceChange(id) {
+      this.$nextTick(() => {
+        window.globalObj.apiSource = id
+      })
+    },
+    showUpdateModal() {
+      this.setVersionModalVisible({ isShow: true })
+    },
+    clipboardWriteText(text) {
+      clipboardWriteText(text)
+    },
+    openRewardModal() {
+
+    },
   },
 }
 </script>
@@ -357,11 +451,16 @@ export default {
 
 }
 
-.gap {
-  + .gap {
+.gap-left {
+  + .gap-left {
     margin-left: 20px;
   }
 }
+.gap-top {
+  + .gap-top {
+    margin-top: 10px;
+  }
+}
 
 .theme {
   display: flex;

src/renderer/views/SongList.vue

@@ -0,0 +1,399 @@
+<template lang="pug">
+  div(:class="$style.container")
+    div(:class="$style.header")
+      material-tag-list(:class="$style.tagList" :list="tagList" v-model="tagInfo")
+      material-tab(:class="$style.tab" :list="sorts" item-key="id" item-name="name" v-model="sortId")
+      material-select(:class="$style.select" :list="sourceInfo.sources" item-key="id" item-name="name" v-model="source")
+    div(:class="$style.main")
+      transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
+        div(:class="$style.songListDetail" v-show="isVisibleListDetail")
+          div(:class="$style.songListHeader")
+            div(:class="$style.songListHeaderLeft")
+              img(:src="selectListInfo.img")
+              span(:class="$style.playNum" v-if="selectListInfo.play_count") {{selectListInfo.play_count}}
+            div(:class="$style.songListHeaderMiddle")
+              h3(:title="selectListInfo.name") {{selectListInfo.name}}
+              p(:title="selectListInfo.desc") {{selectListInfo.desc}}
+            div(:class="$style.songListHeaderRight")
+              material-btn(:class="$style.closeDetailButton" @click="hideListDetail") 返回
+          material-song-list(v-model="selectdData" @action="handleSongListAction" :source="source" :page="listDetail.page" :limit="listDetail.limit" :total="listDetail.total" :list="listDetail.list")
+      transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
+        div.scroll(:class="$style.songList" ref="dom_scrollContent" v-show="!isVisibleListDetail")
+          ul
+            li(:class="$style.item" v-for="(item, index) in listData.list" @click="handleItemClick(index)")
+              div(:class="$style.left")
+                img(:src="item.img")
+              div(:class="$style.right" :src="item.img")
+                h4(:title="item.name") {{item.name}}
+                p(:title="item.desc") {{item.desc}}
+            li(:class="$style.item" style="cursor: default;" v-if="listData.list && listData.list.length && listData.list.length % 3 == 2")
+          div(:class="$style.pagination")
+            material-pagination(:count="listData.total" :limit="listData.limit" :page="listData.page" @btn-click="handleToggleListPage")
+    material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
+    material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
+</template>
+
+<script>
+import { mapGetters, mapMutations, mapActions } from 'vuex'
+import { scrollTo } from '../utils'
+// import music from '../utils/music'
+export default {
+  name: 'SongList',
+  data() {
+    return {
+      tagInfo: {
+        name: '默认',
+        id: null,
+      },
+      sortId: undefined,
+      source: null,
+      isShowDownload: false,
+      musicInfo: null,
+      selectdData: [],
+      isShowDownloadMultiple: false,
+      isToggleSource: false,
+    }
+  },
+  computed: {
+    ...mapGetters(['setting']),
+    ...mapGetters('songList', ['sourceInfo', 'tags', 'listData', 'isVisibleListDetail', 'selectListInfo', 'listDetail']),
+    ...mapGetters('list', ['defaultList']),
+    sorts() {
+      return this.source ? this.sourceInfo.sortList[this.source] : []
+    },
+    isAPITemp() {
+      return this.setting.apiSource == 'temp'
+    },
+    tagList() {
+      return this.tags[this.source] ? this.tags[this.source].tags : []
+    },
+  },
+  watch: {
+    sortId(n, o) {
+      this.setSongList({ sortId: n })
+      if (o === undefined && this.listData.page !== 1) return
+      this.$nextTick(() => {
+        this.getList(1).then(() => {
+          this.$nextTick(() => {
+            scrollTo(this.$refs.dom_scrollContent, 0)
+          })
+        })
+      })
+      // if (this.isVisibleListDetail) this.setVisibleListDetail(false)
+    },
+    tagInfo(n, o) {
+      this.setSongList({ tagInfo: n })
+      if (!o && this.listData.page !== 1) return
+      if (this.isToggleSource) {
+        this.isToggleSource = false
+        return
+      }
+      this.$nextTick(() => {
+        this.getList(1).then(() => {
+          this.$nextTick(() => {
+            scrollTo(this.$refs.dom_scrollContent, 0)
+          })
+        })
+      })
+      // if (this.isVisibleListDetail) this.setVisibleListDetail(false)
+    },
+    source(n, o) {
+      this.setSongList({ source: n })
+      if (!this.tags[n]) this.getTags()
+      if (o) {
+        this.isToggleSource = true
+        this.tagInfo = {
+          name: '默认',
+          id: null,
+        }
+        this.sortId = this.sorts[0] && this.sorts[0].id
+      }
+    },
+  },
+  mounted() {
+    this.source = this.setting.songList.source
+    this.isToggleSource = true
+    this.tagInfo = this.setting.songList.tagInfo
+    this.sortId = this.setting.songList.sortId
+  },
+  methods: {
+    ...mapMutations(['setSongList']),
+    ...mapActions('songList', ['getTags', 'getList', 'getListDetail']),
+    ...mapMutations('songList', ['setVisibleListDetail', 'setSelectListInfo', 'clearListDetail']),
+    ...mapActions('download', ['createDownload', 'createDownloadMultiple']),
+    ...mapMutations('list', ['defaultListAdd', 'defaultListAddMultiple']),
+    ...mapMutations('player', ['setList']),
+    handleListBtnClick(info) {
+      switch (info.action) {
+        case 'download':
+          this.musicInfo = this.listDetail.list[info.index]
+          this.$nextTick(() => {
+            this.isShowDownload = true
+          })
+          break
+        case 'play':
+          this.testPlay(info.index)
+          break
+        case 'search':
+          this.handleSearch(info.index)
+          break
+        // case 'add':
+        //   break
+      }
+    },
+    testPlay(index) {
+      let targetSong
+      if (index == null) {
+        targetSong = this.selectdData[0]
+        this.defaultListAddMultiple(this.selectdData)
+        this.resetSelect()
+      } else {
+        targetSong = this.listDetail.list[index]
+        this.defaultListAdd(targetSong)
+      }
+      let targetIndex = this.defaultList.list.findIndex(
+        s => s.songmid === targetSong.songmid
+      )
+      if (targetIndex > -1) {
+        this.setList({
+          list: this.defaultList.list,
+          listId: 'test',
+          index: targetIndex,
+        })
+      }
+    },
+    handleSearch(index) {
+      const info = this.listDetail.list[index]
+      this.$router.push({
+        path: 'search',
+        query: {
+          text: `${info.name} ${info.singer}`,
+        },
+      })
+    },
+    handleToggleListPage(page) {
+      this.getList(page).then(() => {
+        this.$nextTick(() => {
+          scrollTo(this.$refs.dom_scrollContent, 0)
+        })
+      })
+    },
+    handleToggleListDetailPage(page) {
+      this.getListDetail({ id: this.selectListInfo.id, page }).then(() => {
+        this.$nextTick(() => {
+          scrollTo(this.$refs.dom_scrollContent, 0)
+        })
+      })
+    },
+    handleAddDownload(type) {
+      this.createDownload({ musicInfo: this.musicInfo, type })
+      this.isShowDownload = false
+    },
+    handleAddDownloadMultiple(type) {
+      switch (this.source) {
+        // case 'kg':
+        case 'wy':
+          type = '128k'
+      }
+      this.createDownloadMultiple({ list: [...this.selectdData], type })
+      this.resetSelect()
+      this.isShowDownloadMultiple = false
+    },
+    handleItemClick(index) {
+      this.setSelectListInfo(this.listData.list[index])
+      this.setVisibleListDetail(true)
+      this.clearListDetail()
+      this.$nextTick(() => {
+        this.getListDetail({ id: this.selectListInfo.id, page: 1 })
+      })
+    },
+    handleFlowBtnClick(action) {
+      switch (action) {
+        case 'download':
+          this.isShowDownloadMultiple = true
+          break
+        case 'play':
+          this.testPlay()
+          break
+        case 'add':
+          this.defaultListAddMultiple(this.selectdData)
+          this.resetSelect()
+          break
+      }
+    },
+    handleSongListAction({ action, data }) {
+      switch (action) {
+        case 'listBtnClick':
+          return this.handleListBtnClick(data)
+        case 'togglePage':
+          return this.handleToggleListDetailPage(data)
+        case 'flowBtnClick':
+          return this.handleFlowBtnClick(data)
+        case 'testPlay':
+          return this.testPlay(data)
+        case 'search':
+          return this.handleSearch(data)
+      }
+    },
+    resetSelect() {
+      this.selectdData = []
+    },
+    hideListDetail() {
+      setTimeout(() => this.setVisibleListDetail(false), 50)
+    },
+  },
+}
+</script>
+
+
+<style lang="less" module>
+@import '../assets/styles/layout.less';
+
+.container {
+  height: 100%;
+  display: flex;
+  flex-flow: column nowrap;
+}
+.header {
+  flex: none;
+  width: 100%;
+  display: flex;
+  flex-flow: row nowrap;
+
+}
+.tab {
+  flex: auto;
+}
+.select {
+  flex: none;
+  width: 80px;
+}
+
+.main {
+  flex: auto;
+  overflow: hidden;
+  // position: relative;
+}
+
+.song-list-header {
+  background-color: @color-theme_2;
+  display: flex;
+  flex-flow: row nowrap;
+  height: 60px;
+}
+.song-list-header-left {
+  flex: none;
+  margin-left: 5px;
+  width: 60px;
+  position: relative;
+  img {
+    max-width: 100%;
+    max-height: 100%;
+  }
+  .play-num {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    padding: 2px;
+    background-color: rgba(0, 0, 0, 0.4);
+    color: #fff;
+    font-size: 11px;
+    text-align: right;
+    .mixin-ellipsis-1;
+  }
+}
+
+.song-list-header-middle {
+  flex: auto;
+  padding: 5px 7px;
+  h3 {
+    .mixin-ellipsis-1;
+    line-height: 1.2;
+    padding-bottom: 5px;
+  }
+  p {
+    .mixin-ellipsis-2;
+    font-size: 12px;
+    line-height: 1.2;
+    color: #888;
+  }
+}
+.song-list-header-right {
+  flex: none;
+  display: flex;
+  align-items: center;
+  padding-right: 15px;
+}
+
+.song-list-detail {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  display: flex;
+  flex-flow: column nowrap;
+}
+
+.songList {
+  height: 100%;
+  overflow-y: auto;
+  padding: 0 15px;
+  background-color: #fff;
+  ul {
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: space-between;
+  }
+}
+.item {
+  width: 32%;
+  box-sizing: border-box;
+  display: flex;
+  margin-top: 15px;
+  cursor: pointer;
+  transition: opacity @transition-theme;
+  &:hover {
+    opacity: .7;
+  }
+}
+.left {
+  flex: none;
+  width: 66px;
+  height: 66px;
+  display: flex;
+
+  img {
+    max-width: 100%;
+    max-height: 100%;
+  }
+}
+.right {
+  flex: auto;
+  padding: 5px 15px 5px 7px;
+  overflow: hidden;
+  h4 {
+    font-size: 14px;
+    text-align: justify;
+    line-height: 1.2;
+    .mixin-ellipsis-1;
+  }
+  p {
+    margin-top: 12px;
+    font-size: 12px;
+    .mixin-ellipsis-2;
+    text-align: justify;
+    line-height: 1.2;
+    // text-indent: 24px;
+
+    color: #888;
+  }
+}
+.pagination {
+  text-align: center;
+  padding: 15px 0;
+  // left: 50%;
+  // transform: translateX(-50%);
+}
+</style>