Merge branch 'dev'

2020-09-18 20:24:48 +08:00 · 2020-09-18 20:24:48 +08:00 · b3d13c3a90
parent ff05225b56 24ee42e0c7
commit b3d13c3a90
83 changed files with 3288 additions and 2457 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -6,6 +6,39 @@ 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/).

+## [1.1.0](https://github.com/lyswhut/lx-music-desktop/compare/v1.0.1...v1.1.0) - 2020-09-18
+
+### 新增
+
+- 在歌单详情界面新增播放当前歌单按钮、收藏歌单按钮，注：播放歌单不会将歌曲添加到试听列表
+- 新增`不允许将歌词窗口拖出主屏幕之外`的设置项，默认开启，在连接多个屏幕时想要拖动到其他屏幕时可关闭此设置
+- 新增大部分平台的歌词翻译，感谢 @InoriHimea 提供的[krc解码算法](https://github.com/lyswhut/lx-music-desktop/issues/296#issuecomment-683285784)
+- 新增`显示歌词翻译`设置，默认开启，仅支持某些平台，注：无论该设置是否开启，嵌入或下载歌词时都不会带上翻译
+- 新增`显示切换动画`设置，默认开启，关闭时将基本禁用软件内的所有切换动画
+- 播放状态栏新增桌面歌词的开关、播放模式的切换、歌曲的收藏按钮，Thanks to @andylow for the [icon](https://github.com/lyswhut/lx-music-desktop/pull/309)!
+
+### 修复
+
+- 修复使用全局快捷键还原窗口时，窗口没有获取焦点的问题
+- 修复我的列表搜索对最后一个字符的匹配问题
+- 修复窗口在`较小`模式下最小化/关闭按钮不居中的问题
+
+### 优化
+
+- 桌面歌词当前播放行改为上下居中
+- 为区分静音状态，静音时音量条会变淡，调整音量条时将会取消静音
+- 优化随机播放机制，现在通过`下一曲`切换歌曲时，直到播放完整个列表之前将不会再随机到之前播放过的歌曲，并且通过`上一曲`可以正确播放上一首歌曲
+- 当下载目录没有写入权限时将显示没有写入权限的提示
+
+### 移除
+
+- 移除默认的全局声音媒体快捷键接管
+- 移除对百度音乐的支持，因百度音乐原有的大部分API失效，而且该平台相对其他平台来说音乐太少了，可有可无，以后再看情况恢复
+
+### 其他
+
+- 更新electron到 10.1.2
+
 ## [1.0.1](https://github.com/lyswhut/lx-music-desktop/compare/v1.0.0...v1.0.1) - 2020-07-25

 ### 优化
--- a/FAQ.md
+++ b/FAQ.md
@ -35,7 +35,7 @@

 ## 播放整个歌单或排行榜

-播放在线列表内的歌曲需要将它们都添加到我的列表才能播放，你可以全选列表内的歌曲然后添加到现有列表或者新创建的列表，然后去播放改列表内的歌曲。
+播放在线列表内的歌曲需要将它们都添加到我的列表才能播放，你可以全选列表内的歌曲然后添加到现有列表或者新创建的列表，然后去播放该列表内的歌曲。

 ## 桌面歌词显示异常

@ -108,6 +108,7 @@ Windows 7 未开启 Aero 效果时桌面歌词会有问题，详情看下面的*

 - 若你之前可以安装成功，但现在安装失败，就去**控制面板-程序和功能**或用第三方卸载工具看下有没有之前的版本残留，若同时在不同路径下安装了多个版本就可能会出现该问题，这种情况卸载掉所有版本重新安装即可
 - 清理安装路径下的残留文件
+- 清理注册表（建议用清理工具清理）

 ## 缺少`xxx.dll`

@ -118,7 +119,7 @@ Windows 7 未开启 Aero 效果时桌面歌词会有问题，详情看下面的*

 ## 杀毒软件提示有病毒或恶意行为

-本人只能保证我写的代码不包含任何**恶意代码**、**收集用户信息**的行为，并且软件代码已开源，请自行查阅，软件安装包也是由CI拉取源代码构建，构建日志：[windows包](https://ci.appveyor.com/project/lyswhut/lx-music-desktop)、[Mac/Linux包](https://travis-ci.org/lyswhut/lx-music-desktop)<br>
+本人只能保证我写的代码不包含任何**恶意代码**、**收集用户信息**的行为，并且软件代码已开源，请自行查阅，软件安装包也是由CI拉取源代码构建，构建日志：[windows包](https://ci.appveyor.com/project/lyswhut/lx-music-desktop)、[Mac/Linux包](https://travis-ci.com/github/lyswhut/lx-music-desktop)<br>
 尽管如此，但这不意味着软件是100%安全的，由于软件使用了第三方依赖，当这些依赖存在恶意行为时（[供应链攻击](https://docs.microsoft.com/zh-cn/windows/security/threat-protection/intelligence/supply-chain-malware)），软件也将会受到牵连，所以我只能尽量选择使用较多人用、信任度较高的依赖。<br>
 当然，以上说明建立的前提是在你所用的安装包是从**本项目主页上写的链接**下载的，或者有相关能力者还可以下载源代码自己构建安装包。

--- a/README.md
+++ b/README.md
@ -3,7 +3,7 @@
 <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://travis-ci.com/lyswhut/lx-music-desktop"><img src="https://travis-ci.com/lyswhut/lx-music-desktop.svg?branch=master" alt="Build status"></a>
  <a href="https://electronjs.org/releases/stable"><img src="https://img.shields.io/github/package-json/dependency-version/lyswhut/lx-music-desktop/dev/electron/master" alt="Electron version"></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>
@ -36,7 +36,7 @@

 所用技术栈：

- Electron 9
+- Electron 10
 - Vue 2

 已支持的平台：
@ -47,7 +47,7 @@

 软件变化请查看：[更新日志](https://github.com/lyswhut/lx-music-desktop/blob/master/CHANGELOG.md)<br>
 软件下载请转到：[发布页面](https://github.com/lyswhut/lx-music-desktop/releases)<br>
-或者到网盘下载（网盘内有MAC、windows版）：`https://t-s.lanzous.com/b0bf2cfa/` 密码：`glqw`<br>
+或者到网盘下载（网盘内有MAC、windows版）：`https://www.lanzoux.com/b0bf2cfa/` 密码：`glqw`<br>
 使用常见问题请转至：[常见问题](https://github.com/lyswhut/lx-music-desktop/blob/master/FAQ.md)

 ### 源码使用方法
--- a/build-config/css-loader.config.js
+++ b/build-config/css-loader.config.js
@ -3,6 +3,6 @@ const isDev = process.env.NODE_ENV === 'development'
 module.exports = {
  modules: {
    localIdentName: isDev ? '[folder]-[name]--[local]--[hash:base64:5]' : '[hash:base64:5]',
+    exportLocalsConvention: 'camelCase',
  },
-  localsConvention: 'camelCase',
 }
--- a/build-config/pack.js
+++ b/build-config/pack.js
@ -14,7 +14,7 @@ const okayLog = chalk.bgGreen.white(' OKAY ') + ' '


 function build() {
-  del.sync(['dist/electron', 'build'])
+  del.sync(['dist/electron/**', 'build/**'])

  const spinners = new Spinnies({ color: 'blue' })
  spinners.add('main', { text: 'main building' })
--- a/build-config/renderer-lyric/webpack.config.base.js
+++ b/build-config/renderer-lyric/webpack.config.base.js
@ -1,9 +1,12 @@
 const path = require('path')
 const VueLoaderPlugin = require('vue-loader/lib/plugin')
 const HTMLPlugin = require('html-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')

 const vueLoaderConfig = require('../vue-loader.config')
+const { mergeCSSLoader } = require('../utils')

+const isDev = process.env.NODE_ENV === 'development'

 module.exports = {
  target: 'electron-renderer',
@ -46,6 +49,28 @@ module.exports = {
        loader: 'babel-loader',
        exclude: /node_modules/,
      },
+      {
+        test: /\.css$/,
+        oneOf: mergeCSSLoader(),
+      },
+      {
+        test: /\.less$/,
+        oneOf: mergeCSSLoader({
+          loader: 'less-loader',
+          options: {
+            sourceMap: true,
+          },
+        }),
+      },
+      {
+        test: /\.styl(:?us)?$/,
+        oneOf: mergeCSSLoader({
+          loader: 'stylus-loader',
+          options: {
+            sourceMap: true,
+          },
+        }),
+      },
      {
        test: /\.pug$/,
        oneOf: [
@ -98,5 +123,11 @@ module.exports = {
      __dirname,
    }),
    new VueLoaderPlugin(),
+    new MiniCssExtractPlugin({
+      // Options similar to the same options in webpackOptions.output
+      // both options are optional
+      filename: isDev ? '[name].css' : '[name].[contenthash:8].css',
+      chunkFilename: isDev ? '[id].css' : '[id].[contenthash:8].css',
+    }),
  ],
 }
--- a/build-config/renderer-lyric/webpack.config.dev.js
+++ b/build-config/renderer-lyric/webpack.config.dev.js
@ -6,37 +6,9 @@ const { merge } = require('webpack-merge')

 const baseConfig = require('./webpack.config.base')

-const { mergeCSSLoaderDev } = require('../utils')
-
 module.exports = merge(baseConfig, {
  mode: 'development',
  devtool: 'eval-source-map',
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        oneOf: mergeCSSLoaderDev(),
-      },
-      {
-        test: /\.less$/,
-        oneOf: mergeCSSLoaderDev({
-          loader: 'less-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-      {
-        test: /\.styl(:?us)?$/,
-        oneOf: mergeCSSLoaderDev({
-          loader: 'stylus-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-    ],
-  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin(),
--- a/build-config/renderer-lyric/webpack.config.prod.js
+++ b/build-config/renderer-lyric/webpack.config.prod.js
@ -1,6 +1,5 @@
 const path = require('path')
 const webpack = require('webpack')
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 const TerserPlugin = require('terser-webpack-plugin')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
@ -8,7 +7,6 @@ const { merge } = require('webpack-merge')

 const baseConfig = require('./webpack.config.base')

-const { mergeCSSLoaderProd } = require('../utils')
 const { dependencies } = require('../../package.json')

 let whiteListedModules = ['vue']
@ -20,32 +18,6 @@ module.exports = merge(baseConfig, {
  externals: [
    ...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)),
  ],
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        oneOf: mergeCSSLoaderProd(),
-      },
-      {
-        test: /\.less$/,
-        oneOf: mergeCSSLoaderProd({
-          loader: 'less-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-      {
-        test: /\.styl(:?us)?$/,
-        oneOf: mergeCSSLoaderProd({
-          loader: 'stylus-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-    ],
-  },
  plugins: [
    new CopyWebpackPlugin({
      patterns: [
@ -60,9 +32,6 @@ module.exports = merge(baseConfig, {
        NODE_ENV: '"production"',
      },
    }),
-    new MiniCssExtractPlugin({
-      filename: '[name].css',
-    }),
    new webpack.NamedChunksPlugin(),
  ],
  optimization: {
--- a/build-config/renderer/webpack.config.base.js
+++ b/build-config/renderer/webpack.config.base.js
@ -1,9 +1,12 @@
 const path = require('path')
 const VueLoaderPlugin = require('vue-loader/lib/plugin')
 const HTMLPlugin = require('html-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')

 const vueLoaderConfig = require('../vue-loader.config')
+const { mergeCSSLoader } = require('../utils')

+const isDev = process.env.NODE_ENV === 'development'

 module.exports = {
  target: 'electron-renderer',
@ -46,6 +49,28 @@ module.exports = {
        loader: 'babel-loader',
        exclude: /node_modules/,
      },
+      {
+        test: /\.css$/,
+        oneOf: mergeCSSLoader(),
+      },
+      {
+        test: /\.less$/,
+        oneOf: mergeCSSLoader({
+          loader: 'less-loader',
+          options: {
+            sourceMap: true,
+          },
+        }),
+      },
+      {
+        test: /\.styl(:?us)?$/,
+        oneOf: mergeCSSLoader({
+          loader: 'stylus-loader',
+          options: {
+            sourceMap: true,
+          },
+        }),
+      },
      {
        test: /\.pug$/,
        oneOf: [
@ -98,5 +123,11 @@ module.exports = {
      __dirname,
    }),
    new VueLoaderPlugin(),
+    new MiniCssExtractPlugin({
+      // Options similar to the same options in webpackOptions.output
+      // both options are optional
+      filename: isDev ? '[name].css' : '[name].[contenthash:8].css',
+      chunkFilename: isDev ? '[id].css' : '[id].[contenthash:8].css',
+    }),
  ],
 }
--- a/build-config/renderer/webpack.config.dev.js
+++ b/build-config/renderer/webpack.config.dev.js
@ -6,37 +6,9 @@ const { merge } = require('webpack-merge')

 const baseConfig = require('./webpack.config.base')

-const { mergeCSSLoaderDev } = require('../utils')
-
 module.exports = merge(baseConfig, {
  mode: 'development',
  devtool: 'eval-source-map',
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        oneOf: mergeCSSLoaderDev(),
-      },
-      {
-        test: /\.less$/,
-        oneOf: mergeCSSLoaderDev({
-          loader: 'less-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-      {
-        test: /\.styl(:?us)?$/,
-        oneOf: mergeCSSLoaderDev({
-          loader: 'stylus-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-    ],
-  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin(),
--- a/build-config/renderer/webpack.config.prod.js
+++ b/build-config/renderer/webpack.config.prod.js
@ -1,6 +1,5 @@
 const path = require('path')
 const webpack = require('webpack')
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 const TerserPlugin = require('terser-webpack-plugin')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
@ -8,7 +7,6 @@ const { merge } = require('webpack-merge')

 const baseConfig = require('./webpack.config.base')

-const { mergeCSSLoaderProd } = require('../utils')
 const { dependencies } = require('../../package.json')

 let whiteListedModules = ['vue']
@ -20,32 +18,6 @@ module.exports = merge(baseConfig, {
  externals: [
    ...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)),
  ],
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        oneOf: mergeCSSLoaderProd(),
-      },
-      {
-        test: /\.less$/,
-        oneOf: mergeCSSLoaderProd({
-          loader: 'less-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-      {
-        test: /\.styl(:?us)?$/,
-        oneOf: mergeCSSLoaderProd({
-          loader: 'stylus-loader',
-          options: {
-            sourceMap: true,
-          },
-        }),
-      },
-    ],
-  },
  plugins: [
    new CopyWebpackPlugin({
      patterns: [
@ -60,9 +32,6 @@ module.exports = merge(baseConfig, {
        NODE_ENV: '"production"',
      },
    }),
-    new MiniCssExtractPlugin({
-      filename: '[name].css',
-    }),
    new webpack.NamedChunksPlugin(),
  ],
  optimization: {
--- a/build-config/utils.js
+++ b/build-config/utils.js
@ -2,62 +2,21 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const cssLoaderConfig = require('./css-loader.config')
 const chalk = require('chalk')

-// merge css-loader in development
-exports.mergeCSSLoaderDev = beforeLoader => {
-  const loader = [
-    // 这里匹配 `<style module>`
-    {
-      resourceQuery: /module/,
-      use: [
-        'vue-style-loader',
-        {
-          loader: 'css-loader',
-          options: Object.assign({
-            sourceMap: true,
-          }, cssLoaderConfig),
-        },
-        {
-          loader: 'postcss-loader',
-          options: {
-            sourceMap: true,
-          },
-        },
-      ],
-    },
-    // 这里匹配普通的 `<style>` 或 `<style scoped>`
-    {
-      use: [
-        'vue-style-loader',
-        {
-          loader: 'css-loader',
-          options: {
-            sourceMap: true,
-          },
-        },
-        {
-          loader: 'postcss-loader',
-          options: {
-            sourceMap: true,
-          },
-        },
-      ],
-    },
-  ]
-  if (beforeLoader) {
-    loader[0].use.push(beforeLoader)
-    loader[1].use.push(beforeLoader)
-  }
-  return loader
-}
+const isDev = process.env.NODE_ENV === 'development'

-// merge css-loader in production
-exports.mergeCSSLoaderProd = beforeLoader => {
+// merge css-loader
+exports.mergeCSSLoader = beforeLoader => {
  const loader = [
    // 这里匹配 `<style module>`
    {
      resourceQuery: /module/,
      use: [
-        MiniCssExtractPlugin.loader,
+        {
+          loader: MiniCssExtractPlugin.loader,
+          options: {
+            hmr: isDev,
+          },
+        },
        {
          loader: 'css-loader',
          options: cssLoaderConfig,
@ -68,7 +27,12 @@ exports.mergeCSSLoaderProd = beforeLoader => {
    // 这里匹配普通的 `<style>` 或 `<style scoped>`
    {
      use: [
-        MiniCssExtractPlugin.loader,
+        {
+          loader: MiniCssExtractPlugin.loader,
+          options: {
+            hmr: isDev,
+          },
+        },
        'css-loader',
        'postcss-loader',
      ],
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -1,11 +1,10 @@
 {
  "name": "lx-music-desktop",
-  "version": "1.0.1",
+  "version": "1.1.0",
  "description": "一个免费的音乐下载助手",
  "main": "./dist/electron/main.js",
  "productName": "lx-music-desktop",
  "scripts": {
-    "php": "babel file.php -o file.js",
    "pack": "node build-config/pack.js && npm run pack:win",
    "pack:win": "npm run pack:win:setup:x86_64 && npm run pack:win:7z",
    "pack:win:setup:x86_64": "cross-env TARGET=win_安装版 ARCH=x86_64 electron-builder -w=nsis --x64 --ia32",
@ -51,7 +50,6 @@
    "pack:dir": "node build-config/pack.js && electron-builder --dir",
    "dev": "node build-config/runner-dev.js",
    "clean:electron": "rimraf dist/electron",
-    "clean:web": "rimraf dist/web",
    "clean": "rimraf dist && rimraf build",
    "build:main": "cross-env NODE_ENV=production webpack --config build-config/main/webpack.config.prod.js --progress --hide-modules",
    "build:renderer": "cross-env NODE_ENV=production webpack --config build-config/renderer/webpack.config.prod.js --progress --hide-modules",
@ -61,7 +59,7 @@
    "lint:fix": "eslint --ext .js,.vue -f ./node_modules/eslint-formatter-friendly --fix src"
  },
  "browserslist": [
-    "Electron 9.1.1"
+    "Electron 10.1.2"
  ],
  "engines": {
    "node": ">= 12"
@ -101,7 +99,7 @@
      "allowToChangeInstallationDirectory": true,
      "differentialPackage": true,
      "license": "./licenses/license.rtf",
-      "shortcutName": "lx-music"
+      "shortcutName": "LX Music"
    },
    "dmg": {
      "window": {
@ -112,7 +110,7 @@
        {
          "x": 106,
          "y": 252,
-          "name": "lx-music"
+          "name": "LX Music"
        },
        {
          "x": 490,
@ -160,47 +158,46 @@
  },
  "homepage": "https://github.com/lyswhut/lx-music-desktop#readme",
  "devDependencies": {
-    "@babel/core": "^7.10.5",
+    "@babel/core": "^7.11.6",
    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
    "@babel/plugin-transform-modules-umd": "^7.10.4",
-    "@babel/plugin-transform-runtime": "^7.10.5",
-    "@babel/polyfill": "^7.10.4",
-    "@babel/preset-env": "^7.10.4",
+    "@babel/plugin-transform-runtime": "^7.11.5",
+    "@babel/polyfill": "^7.11.5",
+    "@babel/preset-env": "^7.11.5",
    "babel-eslint": "^10.1.0",
    "babel-loader": "^8.1.0",
    "babel-minify-webpack-plugin": "^0.3.1",
    "babel-preset-minify": "^0.5.1",
-    "browserslist": "^4.13.0",
    "cfonts": "^2.8.6",
    "chalk": "^4.1.0",
    "changelog-parser": "^2.8.0",
-    "copy-webpack-plugin": "^6.0.3",
+    "copy-webpack-plugin": "^6.1.0",
    "core-js": "^3.6.5",
    "cross-env": "^7.0.2",
-    "css-loader": "^3.6.0",
+    "css-loader": "^4.3.0",
    "del": "^5.1.0",
-    "electron": "^9.1.1",
-    "electron-builder": "^22.7.0",
+    "electron": "^10.1.2",
+    "electron-builder": "^22.8.1",
    "electron-debug": "^3.1.0",
    "electron-devtools-installer": "^3.1.1",
-    "eslint": "^7.5.0",
+    "eslint": "^7.9.0",
    "eslint-config-standard": "^14.1.1",
    "eslint-formatter-friendly": "^7.0.0",
    "eslint-loader": "^4.0.2",
-    "eslint-plugin-html": "^6.0.2",
+    "eslint-plugin-html": "^6.1.0",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.1",
-    "file-loader": "^6.0.0",
+    "file-loader": "^6.1.0",
    "friendly-errors-webpack-plugin": "^1.7.0",
-    "html-webpack-plugin": "^4.3.0",
+    "html-webpack-plugin": "^4.4.1",
    "less": "^3.12.2",
-    "less-loader": "^6.2.0",
-    "markdown-it": "^11.0.0",
-    "mini-css-extract-plugin": "^0.9.0",
-    "optimize-css-assets-webpack-plugin": "^5.0.3",
-    "postcss-loader": "^3.0.0",
+    "less-loader": "^7.0.1",
+    "markdown-it": "^11.0.1",
+    "mini-css-extract-plugin": "^0.11.2",
+    "optimize-css-assets-webpack-plugin": "^5.0.4",
+    "postcss-loader": "^4.0.2",
    "postcss-pxtorem": "^5.1.1",
    "pug": "^3.0.0",
    "pug-loader": "^2.4.0",
@ -210,33 +207,32 @@
    "spinnies": "^0.5.1",
    "stylus": "^0.54.8",
    "stylus-loader": "^3.0.2",
-    "terser-webpack-plugin": "^3.0.7",
+    "terser-webpack-plugin": "^4.2.1",
    "url-loader": "^4.1.0",
    "vue-loader": "^15.9.3",
-    "vue-style-loader": "^4.1.2",
-    "vue-template-compiler": "^2.6.11",
-    "webpack": "^4.43.0",
+    "vue-template-compiler": "^2.6.12",
+    "webpack": "^4.44.2",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0",
    "webpack-hot-middleware": "^2.25.0",
-    "webpack-merge": "^5.0.9"
+    "webpack-merge": "^5.1.4"
  },
  "dependencies": {
    "crypto-js": "^4.0.0",
    "dnscache": "^1.0.2",
-    "electron-log": "^4.2.2",
+    "electron-log": "^4.2.4",
    "electron-store": "^6.0.0",
-    "electron-updater": "^4.3.1",
+    "electron-updater": "^4.3.5",
    "iconv-lite": "^0.6.2",
-    "image-size": "^0.8.3",
+    "image-size": "^0.9.1",
    "js-htmlencode": "^0.3.0",
    "lrc-file-parser": "^1.0.5",
-    "needle": "^2.5.0",
-    "node-id3": "^0.1.17",
+    "needle": "^2.5.2",
+    "node-id3": "^0.1.18",
    "request": "^2.88.2",
-    "vue": "^2.6.11",
-    "vue-i18n": "^8.18.2",
-    "vue-router": "^3.3.4",
+    "vue": "^2.6.12",
+    "vue-i18n": "^8.21.1",
+    "vue-router": "^3.4.3",
    "vuex": "^3.5.1",
    "vuex-router-sync": "^5.0.0"
  }
--- a/publish/changeLog.md
+++ b/publish/changeLog.md
@ -1,7 +1,30 @@
-### 优化
+### 新增

- 对我的列表歌曲搜索结果进行相似度排序
+- 在歌单详情界面新增播放当前歌单按钮、收藏歌单按钮，注：播放歌单不会将歌曲添加到试听列表
+- 新增`不允许将歌词窗口拖出主屏幕之外`的设置项，默认开启，在连接多个屏幕时想要拖动到其他屏幕时可关闭此设置
+- 新增大部分平台的歌词翻译，感谢 @InoriHimea 提供的[krc解码算法](https://github.com/lyswhut/lx-music-desktop/issues/296#issuecomment-683285784)
+- 新增`显示歌词翻译`设置，默认开启，仅支持某些平台，注：无论该设置是否开启，嵌入或下载歌词时都不会带上翻译
+- 新增`显示切换动画`设置，默认开启，关闭时将基本禁用软件内的所有切换动画
+- 播放状态栏新增桌面歌词的开关、播放模式的切换、歌曲的收藏按钮，Thanks to @andylow for the [icon](https://github.com/lyswhut/lx-music-desktop/pull/309)!

 ### 修复

- 修复在 Windows 系统下缩放比非100%时，拖动桌面歌词会自动加大桌面歌词窗口的问题
+- 修复使用全局快捷键还原窗口时，窗口没有获取焦点的问题
+- 修复我的列表搜索对最后一个字符的匹配问题
+- 修复窗口在`较小`模式下最小化/关闭按钮不居中的问题
+
+### 优化
+
+- 桌面歌词当前播放行改为上下居中
+- 为区分静音状态，静音时音量条会变淡，调整音量条时将会取消静音
+- 优化随机播放机制，现在通过`下一曲`切换歌曲时，直到播放完整个列表之前将不会再随机到之前播放过的歌曲，并且通过`上一曲`可以正确播放上一首歌曲
+- 当下载目录没有写入权限时将显示没有写入权限的提示
+
+### 移除
+
+- 移除默认的全局声音媒体快捷键接管
+- 移除对百度音乐的支持，因百度音乐原有的大部分API失效，而且该平台相对其他平台来说音乐太少了，可有可无，以后再看情况恢复
+
+### 其他
+
+- 更新electron到 10.1.2
--- a/publish/version.json
+++ b/publish/version.json
--- a/src/common/defaultHotKey.js
+++ b/src/common/defaultHotKey.js
@ -44,21 +44,6 @@ module.exports = {
        name: null,
        action: hotKeyPlayer.next.action,
      },
-      VolumeUp: {
-        type: hotKeyPlayer.volume_up.type,
-        name: null,
-        action: hotKeyPlayer.volume_up.action,
-      },
-      VolumeDown: {
-        type: hotKeyPlayer.volume_down.type,
-        name: null,
-        action: hotKeyPlayer.volume_down.action,
-      },
-      VolumeMute: {
-        type: hotKeyPlayer.volume_mute.type,
-        name: null,
-        action: hotKeyPlayer.volume_mute.action,
-      },
      'mod+alt+f5': {
        type: hotKeyPlayer.toggle_play.type,
        name: hotKeyPlayer.toggle_play.name,
--- a/src/common/defaultSetting.js
+++ b/src/common/defaultSetting.js
@ -3,7 +3,7 @@ const os = require('os')
 const { isMac } = require('./utils')

 const defaultSetting = {
-  version: '1.0.34',
+  version: '1.0.38',
  player: {
    togglePlayMethod: 'listLoop',
    highQuality: false,
@ -12,6 +12,7 @@ const defaultSetting = {
    isMute: false,
    mediaDeviceId: 'default',
    isMediaDeviceRemovedStopPlay: false,
+    isShowLyricTransition: true,
  },
  desktopLyric: {
    enable: false,
@ -22,6 +23,7 @@ const defaultSetting = {
    x: null,
    y: null,
    theme: 0,
+    isLockScreen: true,
    style: {
      fontSize: 120,
      opacity: 95,
@ -86,6 +88,7 @@ const defaultSetting = {
  sourceId: 'kw',
  apiSource: 'temp',
  sourceNameType: 'alias',
+  isShowAnimation: true,
  randomAnimate: true,
  ignoreVersion: null,
  isAgreePact: false,
--- a/src/common/ipcNames.js
+++ b/src/common/ipcNames.js
@ -43,6 +43,14 @@ const names = {
    hide_toggle: 'hide_toggle',
    get_data_path: 'get_data_path',
    show_dialog: 'show_dialog',
+
+    get_setting: 'get_setting',
+    get_playlist: 'get_playlist',
+    save_playlist: 'save_playlist',
+    get_data: 'get_data',
+    set_data: 'set_data',
+    save_data: 'save_data',
+    get_hot_key: 'get_hot_key',
  },
  winLyric: {
    close: 'close',
--- a/src/common/utils.js
+++ b/src/common/utils.js
@ -151,29 +151,33 @@ exports.initSetting = () => {
    name: 'config',
  })
  let setting = electronStore_config.get('setting')
-  if (!electronStore_config.get('version') && setting) { // 迁移配置
-    electronStore_config.set('version', electronStore_config.get('setting.version'))
-    electronStore_config.delete('setting.version')
-    const list = electronStore_config.get('list')
-    if (list) {
-      if (list.defaultList) electronStore_list.set('defaultList', list.defaultList)
-      if (list.loveList) electronStore_list.set('loveList', list.loveList)
-      electronStore_config.delete('list')
+  if (setting) {
+    let version = electronStore_config.get('version')
+    if (!version) { // 迁移配置
+      version = electronStore_config.get('setting.version')
+      electronStore_config.set('version', version)
+      electronStore_config.delete('setting.version')
+      const list = electronStore_config.get('list')
+      if (list) {
+        if (list.defaultList) electronStore_list.set('defaultList', list.defaultList)
+        if (list.loveList) electronStore_list.set('loveList', list.loveList)
+        electronStore_config.delete('list')
+      }
+      const downloadList = electronStore_config.get('download')
+      if (downloadList) {
+        if (downloadList.list) electronStore_list.set('downloadList', downloadList.list)
+        electronStore_config.delete('download')
+      }
    }
-    const downloadList = electronStore_config.get('download')
-    if (downloadList) {
-      if (downloadList.list) electronStore_list.set('downloadList', downloadList.list)
-      electronStore_config.delete('download')
-    }
-  }

-  // 迁移列表滚动位置设置 ~0.18.3
-  if (setting && setting.list.scroll) {
-    let scroll = setting.list.scroll
-    electronStore_list.set('defaultList.location', scroll.locations.defaultList || 0)
-    electronStore_list.set('loveList.location', scroll.locations.loveList || 0)
-    electronStore_config.delete('setting.list.scroll')
-    electronStore_config.set('setting.list.isSaveScrollLocation', scroll.enable)
+    // 迁移列表滚动位置设置 ~0.18.3
+    if (setting.list.scroll) {
+      let scroll = setting.list.scroll
+      electronStore_list.set('defaultList.location', scroll.locations.defaultList || 0)
+      electronStore_list.set('loveList.location', scroll.locations.loveList || 0)
+      electronStore_config.delete('setting.list.scroll')
+      electronStore_config.set('setting.list.isSaveScrollLocation', scroll.enable)
+    }
  }

  const { version: settingVersion, setting: newSetting } = exports.mergeSetting(setting, electronStore_config.get('version'))
@ -184,7 +188,7 @@ exports.initSetting = () => {
  // newSetting.controlBtnPosition = 'right'
  electronStore_config.set('version', settingVersion)
  electronStore_config.set('setting', newSetting)
-  return newSetting
+  return { version: settingVersion, setting: newSetting }
 }

 /**
@ -202,6 +206,15 @@ exports.initHotKey = () => {
  }

  let globalConfig = electronStore_hotKey.get('global')
+
+  // 移除v1.0.1及之前设置的全局声音媒体快捷键接管
+  if (globalConfig && globalConfig.keys.VolumeUp) {
+    delete globalConfig.keys.VolumeUp
+    delete globalConfig.keys.VolumeDown
+    delete globalConfig.keys.VolumeMute
+    electronStore_hotKey.set('global', globalConfig)
+  }
+
  if (!globalConfig) {
    globalConfig = defaultHotKey.global
    electronStore_hotKey.set('global', globalConfig)
--- a/src/main/event.js
+++ b/src/main/event.js
@ -22,6 +22,7 @@ global.lx_event.mainWindow.on(MAIN_WINDOW_EVENT_NAME.toggle_minimize, () => {
      global.modules.mainWindow.show()
    }
    global.modules.mainWindow.restore()
+    global.modules.mainWindow.focus()
  } else {
    global.modules.mainWindow.minimize()
  }
--- a/src/main/index.js
+++ b/src/main/index.js
@ -124,7 +124,9 @@ global.appHotKey = {
 }

 function init() {
-  global.appSetting = initSetting()
+  const info = initSetting()
+  global.appSetting = info.setting
+  global.appSettingVersion = info.version
  global.appHotKey.config = initHotKey()
  global.lx_event.common.initSetting()
  global.lx_event.hotKey.init()
--- a/src/main/modules/winLyric/event.js
+++ b/src/main/modules/winLyric/event.js
@ -1,16 +1,19 @@
 const { common: COMMON_EVENT_NAME, winLyric: WIN_LYRIC_EVENT_NAME, hotKey: HOT_KEY_EVENT_NAME, mainWindow: MAIN_WINDOW_EVENT_NAME } = require('../../events/_name')
 const { mainSend, NAMES: { winLyric: ipcWinLyricNames } } = require('../../../common/ipc')
 const { desktop_lyric } = require('../../../common/hotKey')
+const { setLyricWindow } = require('./utils')

 let isLock = null
 let isEnable = null
 let isAlwaysOnTop = null
+let isLockScreen = null
 const setLrcConfig = () => {
  let desktopLyric = global.appSetting.desktopLyric
  if (global.modules.lyricWindow) {
    mainSend(global.modules.lyricWindow, ipcWinLyricNames.set_lyric_config, {
      config: desktopLyric,
      languageId: global.appSetting.langId,
+      isShowLyricTransition: global.appSetting.player.isShowLyricTransition,
    })
    if (isLock != desktopLyric.isLock) {
      isLock = desktopLyric.isLock
@ -33,10 +36,21 @@ const setLrcConfig = () => {
      global.lx_event.winLyric.close()
    }
  }
+  if (isLockScreen != desktopLyric.isLockScreen) {
+    isLockScreen = desktopLyric.isLockScreen
+    if (desktopLyric.isLockScreen) {
+      setLyricWindow({
+        x: desktopLyric.x,
+        y: desktopLyric.y,
+        w: desktopLyric.width,
+        h: desktopLyric.height,
+      })
+    }
+  }
 }
 global.lx_event.common.on(COMMON_EVENT_NAME.config, name => {
  if (WIN_LYRIC_EVENT_NAME.name === name) return
-  setLrcConfig(false)
+  setLrcConfig()
 })

 global.lx_event.mainWindow.on(MAIN_WINDOW_EVENT_NAME.setLyricInfo, info => {
--- a/src/main/modules/winLyric/index.js
+++ b/src/main/modules/winLyric/index.js
@ -80,14 +80,18 @@ const createWindow = () => {
    x = screenWidth - width - offset
    y = screenHeight - height - offset
  }
+  if (global.appSetting.desktopLyric.isLockScreen) {
+    x = Math.max(-offset, screenWidth < (width + x) ? screenWidth - width : x)
+    y = Math.max(-offset, screenHeight < (height + y) ? screenHeight - height : y)
+  }
  /**
   * Initial window options
   */
  global.modules.lyricWindow = new BrowserWindow({
    height: Math.max(height > screenHeight ? screenHeight : height, 80),
    width: Math.max(width > screenWidth ? screenWidth : width, 380),
-    x: Math.max(-offset, screenWidth < (width + x) ? screenWidth - width : x),
-    y: Math.max(-offset, screenHeight < (height + y) ? screenHeight - height : y),
+    x,
+    y,
    minWidth: 380,
    minHeight: 80,
    useContentSize: true,
--- a/src/main/modules/winLyric/rendererEvent.js
+++ b/src/main/modules/winLyric/rendererEvent.js
@ -8,6 +8,7 @@ const {
  },
 } = require('../../../common/ipc')
 const { winLyric: WIN_LYRIC_EVENT_NAME } = require('../../events/_name')
+const { setLyricWindow } = require('./utils')

 mainOn(ipcWinLyricNames.get_lyric_info, (event, action) => {
  if (!global.modules.mainWindow) return
@ -23,54 +24,9 @@ mainOn(ipcWinLyricNames.set_lyric_config, (event, config) => {
 })

 mainHandle(ipcWinLyricNames.get_lyric_config, async() => {
-  return { config: global.appSetting.desktopLyric, languageId: global.appSetting.langId }
+  return { config: global.appSetting.desktopLyric, languageId: global.appSetting.langId, isShowLyricTransition: global.appSetting.player.isShowLyricTransition }
 })

-let bounds
-let winX
-let winY
-let wasW
-let wasY
-let offset = 8
-mainOn(ipcWinLyricNames.set_win_bounds, (event, { x = 0, y = 0, w = 0, h = 0 }) => {
-  if (!global.modules.lyricWindow) return
-  bounds = global.modules.lyricWindow.getBounds()
-  wasW = global.envParams.workAreaSize.width
-  wasY = global.envParams.workAreaSize.height + offset
-
-  bounds.width = w
-  bounds.height = h
-  if (bounds.width > wasW - offset) {
-    bounds.width = wasW - offset
-  } else if (bounds.width < 380) {
-    bounds.width = 380
-  }
-  if (bounds.height > wasY) {
-    bounds.height = wasY + offset
-  } else if (bounds.height < 80) {
-    bounds.height = 80
-  }
-
-
-  if (x != 0) {
-    winX = bounds.x + x
-    if (winX > wasW - bounds.width + offset) {
-      winX = wasW - bounds.width + offset
-    } else if (winX < -offset) {
-      winX = -offset
-    }
-    bounds.x = winX
-  }
-  if (y != 0) {
-    winY = bounds.y + y
-    if (winY > wasY - bounds.height) {
-      winY = wasY - bounds.height
-    } else if (winY < -offset) {
-      winY = -offset
-    }
-    bounds.y = winY
-  }
-
-  // console.log(bounds, x, y, w, h)
-  global.modules.lyricWindow.setBounds(bounds)
+mainOn(ipcWinLyricNames.set_win_bounds, (event, options) => {
+  setLyricWindow(options)
 })
--- a/src/main/modules/winLyric/utils.js
+++ b/src/main/modules/winLyric/utils.js
@ -0,0 +1,56 @@
+// 设置窗口位置、大小
+let bounds
+let winX
+let winY
+let wasW
+let wasY
+let offset = 8
+exports.setLyricWindow = ({ x = 0, y = 0, w = 0, h = 0 }) => {
+  if (!global.modules.lyricWindow) return
+  bounds = global.modules.lyricWindow.getBounds()
+  wasW = global.envParams.workAreaSize.width
+  wasY = global.envParams.workAreaSize.height + offset
+
+  bounds.width = w
+  bounds.height = h
+  if (bounds.width > wasW - offset) {
+    bounds.width = wasW - offset
+  } else if (bounds.width < 380) {
+    bounds.width = 380
+  }
+  if (bounds.height > wasY) {
+    bounds.height = wasY + offset
+  } else if (bounds.height < 80) {
+    bounds.height = 80
+  }
+
+  if (global.appSetting.desktopLyric.isLockScreen) {
+    if (x != 0) {
+      winX = bounds.x + x
+      if (winX > wasW - bounds.width + offset) {
+        winX = wasW - bounds.width + offset
+      } else if (winX < -offset) {
+        winX = -offset
+      }
+      bounds.x = winX
+    }
+    if (y != 0) {
+      winY = bounds.y + y
+      if (winY > wasY - bounds.height) {
+        winY = wasY - bounds.height
+      } else if (winY < -offset) {
+        winY = -offset
+      }
+      bounds.y = winY
+    }
+  } else {
+    if (x != 0) {
+      bounds.x = bounds.x + x
+    }
+    if (y != 0) {
+      bounds.y = bounds.y + y
+    }
+  }
+  // console.log(bounds, x, y, w, h)
+  global.modules.lyricWindow.setBounds(bounds)
+}
--- a/src/main/rendererEvents/setAppSetting.js
+++ b/src/main/rendererEvents/setAppSetting.js
@ -1,7 +1,9 @@
 const { mainWindow: MAIN_WINDOW_EVENT_NAME } = require('../events/_name')
-const { mainOn, NAMES: { mainWindow: ipcMainWindowNames } } = require('../../common/ipc')
+const { mainOn, NAMES: { mainWindow: ipcMainWindowNames }, mainHandle } = require('../../common/ipc')

 mainOn(ipcMainWindowNames.set_app_setting, (event, config) => {
  if (!config) return
  global.lx_event.common.setAppConfig(config, MAIN_WINDOW_EVENT_NAME.name)
 })
+
+mainHandle(ipcMainWindowNames.get_setting, async() => ({ setting: global.appSetting, version: global.appSettingVersion }))
--- a/src/main/rendererEvents/getCacheSize.js
+++ b/src/main/rendererEvents/getCacheSize.js
@ -1,7 +1,11 @@
 const { mainHandle, NAMES: { mainWindow: ipcMainWindowNames } } = require('../../common/ipc')

+mainHandle(ipcMainWindowNames.clear_cache, async(event, options) => {
+  if (!global.modules.mainWindow) throw new Error('mainWindow is undefined')
+  return global.modules.mainWindow.webContents.session.clearCache()
+})
+
 mainHandle(ipcMainWindowNames.get_cache_size, async(event, options) => {
  if (!global.modules.mainWindow) throw new Error('mainWindow is undefined')
  return global.modules.mainWindow.webContents.session.getCacheSize()
 })
-
--- a/src/main/rendererEvents/clearCache.js
+++ b/src/main/rendererEvents/clearCache.js
@ -1,8 +0,0 @@
-const { mainHandle, NAMES: { mainWindow: ipcMainWindowNames } } = require('../../common/ipc')
-
-mainHandle(ipcMainWindowNames.clear_cache, async(event, options) => {
-  if (!global.modules.mainWindow) throw new Error('mainWindow is undefined')
-  return global.modules.mainWindow.webContents.session.clearCache()
-})
-
-
--- a/src/main/rendererEvents/data.js
+++ b/src/main/rendererEvents/data.js
@ -0,0 +1,12 @@
+const Store = require('electron-store')
+const { mainOn, NAMES: { mainWindow: ipcMainWindowNames }, mainHandle } = require('../../common/ipc')
+
+
+const electronStore_data = new Store({
+  name: 'data',
+})
+
+mainHandle(ipcMainWindowNames.get_data, async(event, path) => electronStore_data.get(path))
+
+
+mainOn(ipcMainWindowNames.save_data, (event, { path, data }) => electronStore_data.get(path, data))
--- a/src/main/rendererEvents/hotKey.js
+++ b/src/main/rendererEvents/hotKey.js
@ -1,5 +1,10 @@
-const { mainSend, NAMES: { mainWindow: ipcMainWindowNames }, mainOn } = require('../../common/ipc')
+const Store = require('electron-store')
+const { mainSend, NAMES: { mainWindow: ipcMainWindowNames }, mainOn, mainHandle } = require('../../common/ipc')
 const { mainWindow: MAIN_WINDOW_EVENT_NAME, hotKey: HOT_KEY_EVENT_NAME } = require('../events/_name')
+
+const electronStore_hotKey = new Store({
+  name: 'hotKey',
+})
 // const { registerHotkey, unRegisterHotkey } = require('../modules/hotKey/utils')

 // mainHandle(ipcMainWindowNames.set_hot_key_config, async(event, { action, data }) => {
@ -14,6 +19,11 @@ const { mainWindow: MAIN_WINDOW_EVENT_NAME, hotKey: HOT_KEY_EVENT_NAME } = requi
 //   }
 // })

+mainHandle(ipcMainWindowNames.get_hot_key, async() => ({
+  local: electronStore_hotKey.get('local'),
+  global: electronStore_hotKey.get('global'),
+}))
+
 mainOn(ipcMainWindowNames.quit, () => global.lx_event.mainWindow.quit())
 mainOn(ipcMainWindowNames.min_toggle, () => global.lx_event.mainWindow.toggleMinimize())
 mainOn(ipcMainWindowNames.hide_toggle, () => global.lx_event.mainWindow.toggleHide())
--- a/src/main/rendererEvents/index.js
+++ b/src/main/rendererEvents/index.js
@ -7,15 +7,16 @@ require('./musicMeta')
 require('./selectDir')
 require('./setWindowSize')
 require('./showSaveDialog')
-require('./clearCache')
-require('./getCacheSize')
+require('./cache')
 require('./setIgnoreMouseEvent')
 require('./getEnvParams')
-require('./setAppSetting')
+require('./appSetting')
 require('./setLyricInfo')
 require('./hotKey')
 require('./getDataPath')
 require('./showDialog')
+require('./playList')
+require('./data')

 require('./xm_verify')

--- a/src/main/rendererEvents/playList.js
+++ b/src/main/rendererEvents/playList.js
@ -0,0 +1,23 @@
+const Store = require('electron-store')
+const { mainOn, NAMES: { mainWindow: ipcMainWindowNames }, mainHandle } = require('../../common/ipc')
+
+
+const electronStore_list = new Store({
+  name: 'playList',
+})
+
+mainHandle(ipcMainWindowNames.get_playlist, async(event, isIgnoredError = false) => {
+  let electronStore_list = new Store({
+    name: 'playList',
+    clearInvalidConfig: !isIgnoredError,
+  })
+
+  return {
+    defaultList: electronStore_list.get('defaultList'),
+    loveList: electronStore_list.get('loveList'),
+    userList: electronStore_list.get('userList'),
+    downloadList: electronStore_list.get('downloadList'),
+  }
+})
+
+mainOn(ipcMainWindowNames.save_playlist, (event, { type, data }) => electronStore_list.set(type, data))
--- a/src/renderer-lyric/App.vue
+++ b/src/renderer-lyric/App.vue
@ -4,7 +4,7 @@
    transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
      .control-bar(v-show="!lrcConfig.isLock")
        core-control-bar(:lrcConfig="lrcConfig" :themes="themeList")
-    core-lyric(:lrcConfig="lrcConfig")
+    core-lyric(:lrcConfig="lrcConfig" :isShowLyricTransition="isShowLyricTransition")
  div.resize-left(@mousedown.self="handleMouseDown('left', $event)")
  div.resize-top(@mousedown.self="handleMouseDown('top', $event)")
  div.resize-right(@mousedown.self="handleMouseDown('right', $event)")
@ -44,6 +44,7 @@ export default {
          isZoomActiveLrc: true,
        },
      },
+      isShowLyricTransition: true,
      themeList: [
        {
          id: 0,
@ -117,8 +118,9 @@ export default {
    document.removeEventListener('mouseup', this.handleMouseUp)
  },
  methods: {
-    handleUpdateConfig({ config, languageId }) {
+    handleUpdateConfig({ config, languageId, isShowLyricTransition }) {
      this.lrcConfig = config
+      this.isShowLyricTransition = isShowLyricTransition
      if (this.$i18n.locale !== languageId && languageId != null) this.$i18n.locale = languageId
    },
    handleMouseDown(origin, event) {
--- a/src/renderer-lyric/components/core/Lyric.vue
+++ b/src/renderer-lyric/components/core/Lyric.vue
@ -27,6 +27,10 @@ export default {
        }
      },
    },
+    isShowLyricTransition: {
+      type: Boolean,
+      default: true,
+    },
  },
  data() {
    return {
@ -58,6 +62,10 @@ export default {
      lyricLines: [],
      isSetedLines: false,
      isPlay: false,
+      lyrics: {
+        lyric: '',
+        tlyric: '',
+      },
    }
  },
  computed: {
@ -112,6 +120,11 @@ export default {
      },
      immediate: true,
    },
+    isShowLyricTransition(n) {
+      console.log(n)
+      this.setLyric()
+      rendererSend(NAMES.winLyric.get_lyric_info, 'status')
+    },
  },
  created() {
    rendererOn(NAMES.winLyric.set_lyric_info, (event, data) => this.handleSetInfo(data))
@ -144,7 +157,9 @@ export default {
      // console.log(type, data)
      switch (type) {
        case 'lyric':
-          window.lrc.setLyric(data)
+          this.lyrics.lyric = data.lrc
+          this.lyrics.tlyric = data.tlrc
+          this.setLyric()
          break
        case 'play':
          this.isPlay = true
@ -156,7 +171,9 @@ export default {
          break
        case 'info':
          // console.log('info', data)
-          window.lrc.setLyric(data.lyric)
+          this.lyrics.lyric = data.lyric
+          this.lyrics.tlyric = data.tlyric
+          this.setLyric()
          this.$nextTick(() => {
            this.lyric.line = data.line
            rendererSend(NAMES.winLyric.get_lyric_info, 'status')
@ -191,7 +208,7 @@ export default {
      }
      if (this.lyricEvent.isStopScroll) return
      let dom_p = this.dom_lines[this.lyric.line]
-      cancelScrollFn = scrollTo(this.$refs.dom_lyric, dom_p ? (dom_p.offsetTop - this.$refs.dom_lyric.clientHeight * 0.38) : 0)
+      cancelScrollFn = scrollTo(this.$refs.dom_lyric, dom_p ? (dom_p.offsetTop - this.$refs.dom_lyric.clientHeight * 0.5 + dom_p.clientHeight / 2) : 0)
    },
    handleLyricMouseDown(e) {
      if (e.target.classList.contains(this.$style.lrcLine)) {
@ -261,6 +278,9 @@ export default {
    close() {
      rendererSend(NAMES.winLyric.close)
    },
+    setLyric() {
+      window.lrc.setLyric((this.isShowLyricTransition && this.lyrics.tlyric ? this.lyrics.tlyric + '\n' : '') + this.lyrics.lyric)
+    },
  },
 }
 </script>
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@ -27,7 +27,7 @@ import { mapMutations, mapGetters, mapActions } from 'vuex'
 import { rendererOn, rendererSend, rendererInvoke, NAMES } from '../common/ipc'
 import { isLinux } from '../common/utils'
 import music from './utils/music'
-import { throttle, openUrl, compareVer } from './utils'
+import { throttle, openUrl, compareVer, getPlayList } from './utils'
 import { base as eventBaseName } from './event/names'

 window.ELECTRON_DISABLE_SECURITY_WARNINGS = process.env.ELECTRON_DISABLE_SECURITY_WARNINGS
@ -70,19 +70,34 @@ export default {
  },
  created() {
    this.saveDefaultList = throttle(n => {
-      window.electronStore_list.set('defaultList', n)
+      rendererSend(NAMES.mainWindow.save_playlist, {
+        type: 'defaultList',
+        data: n,
+      })
    }, 500)
    this.saveLoveList = throttle(n => {
-      window.electronStore_list.set('loveList', n)
+      rendererSend(NAMES.mainWindow.save_playlist, {
+        type: 'loveList',
+        data: n,
+      })
    }, 500)
    this.saveUserList = throttle(n => {
-      window.electronStore_list.set('userList', n)
+      rendererSend(NAMES.mainWindow.save_playlist, {
+        type: 'userList',
+        data: n,
+      })
    }, 500)
    this.saveDownloadList = throttle(n => {
-      window.electronStore_list.set('downloadList', n)
+      rendererSend(NAMES.mainWindow.save_playlist, {
+        type: 'downloadList',
+        data: n,
+      })
    }, 1000)
    this.saveSearchHistoryList = throttle(n => {
-      window.electronStore_data.set('searchHistoryList', n)
+      rendererSend(NAMES.mainWindow.set_data, {
+        path: 'searchHistoryList',
+        data: n,
+      })
    }, 500)
  },
  mounted() {
@ -135,12 +150,29 @@ export default {
    'windowSizeActive.fontSize'(n) {
      document.documentElement.style.fontSize = n
    },
+    'setting.isShowAnimation': {
+      handler(n) {
+        if (n) {
+          if (document.body.classList.contains('disableAnimation')) {
+            document.body.classList.remove('disableAnimation')
+          }
+        } else {
+          if (!document.body.classList.contains('disableAnimation')) {
+            document.body.classList.add('disableAnimation')
+          }
+        }
+      },
+      immediate: true,
+    },
  },
  methods: {
    ...mapActions(['getVersionInfo']),
    ...mapMutations(['setNewVersion', 'setVersionModalVisible', 'setDownloadProgress', 'setSetting', 'setDesktopLyricConfig']),
    ...mapMutations('list', ['initList']),
    ...mapMutations('download', ['updateDownloadList']),
+    ...mapMutations('search', {
+      setSearchHistoryList: 'setHistory',
+    }),
    init() {
      document.documentElement.style.fontSize = this.windowSizeActive.fontSize

@ -229,19 +261,23 @@ export default {
    },

    initData() { // 初始化数据
-      this.initPlayList() // 初始化播放列表
-      this.initDownloadList() // 初始化下载列表
+      this.initLocalList() // 初始化播放列表
+      // this.initDownloadList() // 初始化下载列表
+      this.initSearchHistoryList() // 初始化搜索历史列表
    },
-    initPlayList() {
-      let defaultList = window.electronStore_list.get('defaultList') || this.defaultList
-      let loveList = window.electronStore_list.get('loveList') || this.loveList
-      let userList = window.electronStore_list.get('userList') || this.userList
-      if (!defaultList.list) defaultList.list = []
-      if (!loveList.list) loveList.list = []
-      this.initList({ defaultList, loveList, userList })
+    initLocalList() {
+      getPlayList().then(({ defaultList, loveList, userList, downloadList }) => {
+        if (!defaultList) defaultList = this.defaultList
+        if (!loveList) loveList = this.loveList
+        if (!userList) userList = this.userList
+
+        if (!defaultList.list) defaultList.list = []
+        if (!loveList.list) loveList.list = []
+        this.initList({ defaultList, loveList, userList })
+        this.initDownloadList(downloadList) // 初始化下载列表
+      })
    },
-    initDownloadList() {
-      let downloadList = window.electronStore_list.get('downloadList')
+    initDownloadList(downloadList) {
      if (downloadList) {
        downloadList.forEach(item => {
          if (item.status == this.downloadStatus.RUN || item.status == this.downloadStatus.WAITING) {
@ -252,6 +288,16 @@ export default {
        this.updateDownloadList(downloadList)
      }
    },
+    initSearchHistoryList() {
+      rendererInvoke(NAMES.mainWindow.get_data, 'searchHistoryList').then(historyList => {
+        if (historyList == null) {
+          historyList = []
+          rendererInvoke(NAMES.mainWindow.set_data, { path: 'searchHistoryList', data: historyList })
+        } else {
+          this.setSearchHistoryList(historyList)
+        }
+      })
+    },
    showUpdateModal() {
      (this.version.newVersion && this.version.newVersion.history
        ? Promise.resolve(this.version.newVersion)
@ -354,6 +400,11 @@ body {
  box-sizing: border-box;
 }

+.disableAnimation * {
+  transition: none !important;
+  animation: none !important;
+}
+
 .transparent {
  padding: @shadow-app;
  #container {
--- a/src/renderer/components/core/Aside.vue
+++ b/src/renderer/components/core/Aside.vue
@ -147,7 +147,7 @@ export default {
    height: @control-btn-width;
    background: none;
    border: none;
-    // display: flex;
+    display: flex;
    // justify-content: center;
    // align-items: center;
    outline: none;
--- a/src/renderer/components/core/Icons.vue
+++ b/src/renderer/components/core/Icons.vue
@ -165,5 +165,46 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19
    g#icon-window-close(fill='currentColor')
      //- 0 0 24 24
      path(d="M20 6.91L17.09 4L12 9.09L6.91 4L4 6.91L9.09 12L4 17.09L6.91 20L12 14.91L17.09 20L20 17.09L14.91 12L20 6.91Z")
+
+
+    g#icon-list-loop(fill='currentColor')
+      // 0 0 24 24
+      path(d="M0 0h24v24H0z" fill="none")
+      path(d='M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z')
+
+    g#icon-single-loop(fill='currentColor')
+      // 0 0 24 24
+      path(d="M0 0h24v24H0z" fill="none")
+      path(d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z")
+
+    g#icon-list-random(fill='currentColor')
+      // 0 0 24 24
+      path(d="M0 0h24v24H0z" fill="none")
+      path(d="M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z")
+
+    g#icon-list-order(fill='currentColor')
+      // 0 0 24 24
+      path(d="M0 0h24v24H0z" fill="none")
+      path(d="M4 10h12v2H4zm0-4h12v2H4zm0 8h8v2H4zm10 0v6l5-3z")
+
+    g#icon-single(fill='currentColor')
+      //- 0 0 24 24
+      path(d='M18,6.8v9.9h-2.1v-5.3c0-0.8,0-1.2,0-1.4c0-0.2-0.1-0.3-0.3-0.4c-0.1-0.1-0.5-0.1-1-0.1h-0.2V8.4c1-0.3,1.8-0.8,2.3-1.6H18z')
+      polygon(points='6,18 14.5,12 6,6 ')
+
+    g#icon-desktop-lyric-on(fill='currentColor')
+      //- 0 0 512 512
+      path(d='M162.64,335.554H81.017V152.1H55.143V359.7h107.5V335.554ZM288.807,291.4a117.012,117.012,0,0,0-11.222-20.092,29.568,29.568,0,0,0-13.365-10.562,54.323,54.323,0,0,0,17.225-7.7,50.6,50.6,0,0,0,12.579-12.23,52.253,52.253,0,0,0,7.648-15.724,64.034,64.034,0,0,0,2.573-18.345,67.706,67.706,0,0,0-3.5-22.316,42.831,42.831,0,0,0-11.007-17.233,51.262,51.262,0,0,0-19.227-11.118q-11.722-3.969-28.018-3.971H192.459V359.7H217.9v-92.44h12.008a37.092,37.092,0,0,1,10.078,1.271,24.136,24.136,0,0,1,8.291,4.209,32.591,32.591,0,0,1,7.076,7.941A76.14,76.14,0,0,1,261.79,293.3L289.664,359.7H318.4Zm-13.938-67.106a30.684,30.684,0,0,1-7.862,11.118,33.47,33.47,0,0,1-12.293,6.83,53.247,53.247,0,0,1-16.225,2.3H217.9V175.928H241.92q17.01,0,26.374,8.259t9.363,24.937A38.647,38.647,0,0,1,274.869,224.292ZM456.714,325.229a100.649,100.649,0,0,1-21.156,8.657,84.575,84.575,0,0,1-23.015,3.1q-28.448,0-43.17-20.489t-14.724-60.833a133.161,133.161,0,0,1,4-34.228q4-15.009,11.436-25.413a50.462,50.462,0,0,1,18.083-15.883,51.244,51.244,0,0,1,23.8-5.48,82.427,82.427,0,0,1,23.73,3.256,89.743,89.743,0,0,1,21.013,9.451v-27.8a94.1,94.1,0,0,0-21.442-7.544,112.019,112.019,0,0,0-24.158-2.462q-19.158,0-34.594,7.624a74.755,74.755,0,0,0-26.3,21.68q-10.865,14.056-16.724,34.228T327.632,258.2q0,51.461,21.227,77.748t60.825,26.286a111.234,111.234,0,0,0,47.03-10.324V325.229Z')
+
+    g#icon-desktop-lyric-off(fill='currentColor')
+      //- 0 0 512 512
+      path(d='M162.64,335.554H81.017V152.1H55.143V359.7h107.5V335.554ZM288.807,291.4a117.012,117.012,0,0,0-11.222-20.092,29.568,29.568,0,0,0-13.365-10.562,54.323,54.323,0,0,0,17.225-7.7,50.6,50.6,0,0,0,12.579-12.23,52.253,52.253,0,0,0,7.648-15.724,64.034,64.034,0,0,0,2.573-18.345,67.706,67.706,0,0,0-3.5-22.316,42.831,42.831,0,0,0-11.007-17.233,51.262,51.262,0,0,0-19.227-11.118q-11.722-3.969-28.018-3.971H192.459V359.7H217.9v-92.44h12.008a37.092,37.092,0,0,1,10.078,1.271,24.136,24.136,0,0,1,8.291,4.209,32.591,32.591,0,0,1,7.076,7.941A76.14,76.14,0,0,1,261.79,293.3L289.664,359.7H318.4Zm-13.938-67.106a30.684,30.684,0,0,1-7.862,11.118,33.47,33.47,0,0,1-12.293,6.83,53.247,53.247,0,0,1-16.225,2.3H217.9V175.928H241.92q17.01,0,26.374,8.259t9.363,24.937A38.647,38.647,0,0,1,274.869,224.292ZM456.714,325.229a100.649,100.649,0,0,1-21.156,8.657,84.575,84.575,0,0,1-23.015,3.1q-28.448,0-43.17-20.489t-14.724-60.833a133.161,133.161,0,0,1,4-34.228q4-15.009,11.436-25.413a50.462,50.462,0,0,1,18.083-15.883,51.244,51.244,0,0,1,23.8-5.48,82.427,82.427,0,0,1,23.73,3.256,89.743,89.743,0,0,1,21.013,9.451v-27.8a94.1,94.1,0,0,0-21.442-7.544,112.019,112.019,0,0,0-24.158-2.462q-19.158,0-34.594,7.624a74.755,74.755,0,0,0-26.3,21.68q-10.865,14.056-16.724,34.228T327.632,258.2q0,51.461,21.227,77.748t60.825,26.286a111.234,111.234,0,0,0,47.03-10.324V325.229Z')
+      path(d='M69.148,97.826l17.7-17.651,333,334-17.7,17.652Z')
+
+    g#icon-add-2(fill='currentColor')
+      //- 0 0 1024 1024
+      path(d='M256,170s-62.469-76.808-141-24C44.762,222.824,84.909,325.08,256,415c21.339-8.361,44-17,44-17,19-6.392,28.155,20.742,16,26-27.589,11.935,5.974-4.141-60,28C-35.524,313.85,43.993,149.031,95,117c86.8-65.89,162,10,162,10s58.158-60.523,140-23c104.032,58.528,64,161.9,45,196-9.152,15.154-39.559-4.159-32-16,20.34-37.888,45.522-107.349-25-150C314.919,103.92,256,170,256,170Z')
+      path(d='M383,368c-8.1.01-24.77-.155-40,0-15.713.16-15.282,34.964,0,35,15.1,0.035,40,0,40,0s-0.068,42.8,0,48c0.208,15.961,32.261,15.791,32-1-0.072-4.649,0-47,0-47s38.008-.031,43,0c15.732,0.046,14.947-33.98-1-34-4.884.093-42,0-42,0s-0.053-28.341,0-46c0.046-15.189-32.028-15.512-32,0C383.027,337.74,382.782,365.139,383,368Z')
+
 </template>

--- a/src/renderer/components/core/Player.vue
+++ b/src/renderer/components/core/Player.vue
@ -9,11 +9,31 @@ div(:class="$style.player")
      div(:class="$style.column1")
        div(:class="$style.container")
          div(:class="$style.title" @click="handleCopy(title)" :title="title + $t('core.player.copy_title')") {{title}}
-          div(:class="$style.volumeContent")
-            div(:class="$style.volume")
-              div(:class="$style.volumeBar" :style="{ transform: `scaleX(${volume || 0})` }")
-            div(:class="$style.volumeMask" @mousedown="handleVolumeMsDown" ref="dom_volumeMask" :title="`${$t('core.player.volume')}${parseInt(volume * 100)}%`")
+          div(:class="$style.controlBtn")

+            div(:class="$style.volumeContent")
+              div(:class="[$style.volume, setting.player.isMute ? $style.muted : null]")
+                div(:class="$style.volumeBar" :style="{ transform: `scaleX(${volume || 0})` }")
+              div(:class="$style.volumeMask" @mousedown="handleVolumeMsDown" ref="dom_volumeMask" :title="`${$t('core.player.volume')}${parseInt(volume * 100)}%`")
+            div(:class="$style.titleBtn" @click='toggleDesktopLyric' :title="setting.desktopLyric.enable ? $t('core.player.desktop_lyric_off') : $t('core.player.desktop_lyric_on')")
+              svg(v-if="setting.desktopLyric.enable" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve')
+                use(xlink:href='#icon-desktop-lyric-off')
+              svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve')
+                use(xlink:href='#icon-desktop-lyric-on')
+            div(:class="$style.titleBtn" @click='toggleNextPlayMode' :title="nextTogglePlayName")
+              svg(v-if="setting.player.togglePlayMethod == 'listLoop'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='80%' viewBox='0 0 24 24' space='preserve')
+                use(xlink:href='#icon-list-loop')
+              svg(v-else-if="setting.player.togglePlayMethod == 'random'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='100%' viewBox='0 0 24 24' space='preserve')
+                use(xlink:href='#icon-list-random')
+              svg(v-else-if="setting.player.togglePlayMethod == 'list'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='120%' viewBox='0 0 24 24' space='preserve')
+                use(xlink:href='#icon-list-order')
+              svg(v-else-if="setting.player.togglePlayMethod == 'singleLoop'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='100%' viewBox='0 0 24 24' space='preserve')
+                use(xlink:href='#icon-single-loop')
+              svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='120%' viewBox='0 0 24 24' space='preserve')
+                use(xlink:href='#icon-single')
+            div(:class="$style.titleBtn" @click='addMusicTo' :title="$t('core.player.add_music_to')")
+              svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='80%' viewBox='0 0 512 512' space='preserve')
+                use(xlink:href='#icon-add-2')
          //- 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')
@ -47,6 +67,8 @@ div(:class="$style.player")
                      :lyric="lyric" :list="list" :listId="listId"
                      :playInfo="{ nowPlayTimeStr, maxPlayTimeStr, progress, nowPlayTime, status }"
                      :isPlay="isPlay" @action="handlePlayDetailAction")
+
+  material-list-add-modal(:show="isShowAddMusicTo" :musicInfo="listId == 'download' ? targetSong.musicInfo : targetSong" @close="isShowAddMusicTo = false")
  svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' style="display: none;")
    defs
      g(:id="$style.iconPic")
@ -72,6 +94,13 @@ import path from 'path'

 let audio

+const playNextModes = [
+  'listLoop',
+  'random',
+  'list',
+  'singleLoop',
+]
+
 export default {
  data() {
    return {
@ -112,11 +141,12 @@ export default {
        timeout: null,
        playTime: 0,
      },
+      isShowAddMusicTo: false,
    }
  },
  computed: {
    ...mapGetters(['setting']),
-    ...mapGetters('player', ['list', 'playIndex', 'changePlay', 'listId', 'isShowPlayerDetail']),
+    ...mapGetters('player', ['list', 'playIndex', 'changePlay', 'listId', 'isShowPlayerDetail', 'playedList']),
    // pic() {
    //   return this.musicInfo.img ? this.musicInfo.img : ''
    // },
@ -134,6 +164,15 @@ export default {
    progress() {
      return this.nowPlayTime / this.maxPlayTime || 0
    },
+    nextTogglePlayName() {
+      switch (this.setting.player.togglePlayMethod) {
+        case 'listLoop': return this.$t('core.player.play_toggle_mode_list_loop')
+        case 'random': return this.$t('core.player.play_toggle_mode_random')
+        case 'singleLoop': return this.$t('core.player.play_toggle_mode_single_loop')
+        case 'list': return this.$t('core.player.play_toggle_mode_list')
+        default: return this.$t('core.player.play_toggle_mode_off')
+      }
+    },
  },
  mounted() {
    this.init()
@ -153,6 +192,7 @@ export default {
            name: this.musicInfo.name,
            album: this.musicInfo.album,
            lyric: this.musicInfo.lrc,
+            tlyric: this.musicInfo.tlrc,
            isPlay: this.isPlay,
            line: this.lyric.line,
            played_time: audio.currentTime * 1000,
@ -194,6 +234,8 @@ export default {
    },
    'setting.player.togglePlayMethod'(n) {
      audio.loop = n === 'singleLoop'
+      if (this.playedList.length) this.clearPlayedList()
+      if (n == 'random' && this.playIndex > -1) this.setPlayedList(this.list[this.playIndex])
    },
    'setting.player.isMute'(n) {
      audio.muted = n
@ -201,6 +243,9 @@ export default {
    'setting.player.mediaDeviceId'(n) {
      this.setMediaDevice()
    },
+    'setting.player.isShowLyricTransition'() {
+      this.setLyric()
+    },
    async list(n, o) {
      if (n === o && this.musicInfo.songmid) {
        let index = this.listId == 'download'
@ -238,8 +283,11 @@ export default {
      'fixPlayIndex',
      'resetChangePlay',
      'visiblePlayerDetail',
+      'clearPlayedList',
+      'setPlayedList',
+      'removePlayedList',
    ]),
-    ...mapMutations(['setVolume']),
+    ...mapMutations(['setVolume', 'setPlayNextMode', 'setVisibleDesktopLyric']),
    ...mapMutations('list', ['updateMusicInfo']),
    ...mapMutations(['setMediaDeviceId']),
    handleRegisterEvent(action) {
@ -360,7 +408,7 @@ export default {
          this.lyric.lines = lines
          this.lyric.line = 0
        },
-        offset: 100,
+        offset: 80,
      })

      this.handleRegisterEvent('on')
@ -369,6 +417,7 @@ export default {
      console.log('play', this.playIndex)
      this.checkDelayNextTimeout()
      let targetSong = this.targetSong = this.list[this.playIndex]
+      if (this.setting.player.togglePlayMethod == 'random') this.setPlayedList(targetSong)
      this.retryNum = 0
      this.audioErrorTime = 0

@ -420,20 +469,51 @@ export default {
    async filterList() {
      // if (this.list.listName === null) return
      let list
+      let playedList = [...this.playedList]
      if (this.listId == 'download') {
        list = []
        for (const item of this.list) {
          const filePath = path.join(this.setting.download.savePath, item.fileName)
          if (!await checkPath(filePath) || !item.isComplate || /\.ape$/.test(filePath)) continue
+
+          let index = playedList.indexOf(item)
+          if (index > -1) {
+            playedList.splice(index, 1)
+            continue
+          }
          list.push(item)
        }
      } else {
-        list = this.list.filter(s => this.assertApiSupport(s.source))
+        list = this.list.filter(s => {
+          let index = playedList.indexOf(s)
+          if (index > -1) {
+            playedList.splice(index, 1)
+            return false
+          }
+          return this.assertApiSupport(s.source)
+        })
+      }
+      if (!list.length && this.playedList.length) {
+        this.clearPlayedList()
+        return this.filterList()
      }
      return list
    },
    async handlePrev() {
      // console.log(playIndex)
+      if (this.setting.player.togglePlayMethod == 'random' && this.playedList.length) {
+        let index = this.playedList.indexOf(this.targetSong)
+        index -= 1
+        if (index > -1) {
+          let listIndex = this.list.indexOf(this.playedList[index])
+          if (listIndex < 0) {
+            this.removePlayedList(index)
+            return this.handlePrev()
+          }
+          this.setPlayIndex(listIndex)
+          return
+        }
+      }
      let list = await this.filterList()
      if (!list.length) return this.setPlayIndex(-1)
      let playIndex = list.indexOf(this.list[this.playIndex])
@ -455,6 +535,20 @@ export default {
    },
    async handleNext() {
      // if (this.list.listName === null) return
+      // eslint-disable-next-line no-debugger
+      if (this.setting.player.togglePlayMethod == 'random' && this.playedList.length) {
+        let index = this.playedList.indexOf(this.targetSong)
+        index += 1
+        if (index < this.playedList.length) {
+          let listIndex = this.list.indexOf(this.playedList[index])
+          if (listIndex < 0) {
+            this.removePlayedList(index)
+            return this.handleNext()
+          }
+          this.setPlayIndex(listIndex)
+          return
+        }
+      }
      let list = await this.filterList()
      if (!list.length) return this.setPlayIndex(-1)
      let playIndex = list.indexOf(this.list[this.playIndex])
@ -561,25 +655,21 @@ export default {
    },
    setLrc(targetSong) {
      this.musicInfo.lrc = targetSong.lrc
+      this.musicInfo.tlrc = targetSong.tlrc

-      let lrcP = this.musicInfo.lrc
+      let lrcP = this.musicInfo.lrc && this.musicInfo.tlrc != null
        ? Promise.resolve()
        : this.getLrc(targetSong).then(() => {
          this.musicInfo.lrc = targetSong.lrc
+          this.musicInfo.tlrc = targetSong.tlrc
        })

      lrcP
-        .then(() => {
-          window.lrc.setLyric(this.musicInfo.lrc)
-          this.handleUpdateWinLyricInfo('lyric', this.musicInfo.lrc)
-          if (this.isPlay && (this.musicInfo.url || this.listId == 'download')) {
-            window.lrc.play(audio.currentTime * 1000)
-            this.handleUpdateWinLyricInfo('play', audio.currentTime * 1000)
-          }
-        })
        .catch(() => {
-          this.handleUpdateWinLyricInfo('lyric', this.musicInfo.lrc)
          this.status = this.statusText = this.$t('core.player.lyric_error')
+        }).finally(() => {
+          this.setLyric()
+          this.handleUpdateWinLyricInfo('lyric', { lrc: this.musicInfo.lrc, tlrc: this.musicInfo.tlrc })
        })
    },
    handleRemoveMusic() {
@ -623,8 +713,9 @@ export default {

      this.volume = val
      this.volumeEvent.msDownVolume = val
-      // console.log(val)
      if (audio) audio.volume = this.volume
+
+      if (this.setting.player.isMute) this.setVolume(false)
    },
    handleSetVolumeMute() {
      audio.muted = !audio.muted
@ -654,7 +745,7 @@ export default {
      this.setProgressWidth()
    },
    handleToMusicLocation() {
-      if (this.listId == 'download') return
+      if (!this.listId || this.listId == 'download') return
      if (this.playIndex == -1) return
      this.$router.push({
        path: 'list',
@ -766,6 +857,25 @@ export default {
        info,
      })
    },
+    setLyric() {
+      window.lrc.setLyric((this.setting.player.isShowLyricTransition && this.musicInfo.tlrc ? this.musicInfo.tlrc + '\n' : '') + this.musicInfo.lrc)
+      if (this.isPlay && (this.musicInfo.url || this.listId == 'download')) {
+        window.lrc.play(audio.currentTime * 1000)
+        this.handleUpdateWinLyricInfo('play', audio.currentTime * 1000)
+      }
+    },
+    toggleDesktopLyric() {
+      this.setVisibleDesktopLyric(!this.setting.desktopLyric.enable)
+    },
+    toggleNextPlayMode() {
+      let index = playNextModes.indexOf(this.setting.player.togglePlayMethod)
+      if (++index >= playNextModes.length) index = -1
+      this.setPlayNextMode(playNextModes[index] || '')
+    },
+    addMusicTo() {
+      if (!this.musicInfo.songmid) return
+      this.isShowAddMusicTo = true
+    },
  },
 }
 </script>
@ -855,17 +965,26 @@ export default {
 }

 .title {
-  flex: 1 1 0;
-  width: 0;
+  flex: 0 1 auto;
+  min-width: 0;
  padding-right: 5px;
  font-size: 14px;
  line-height: 18px;
  .mixin-ellipsis-1;
 }

+.controlBtn {
+  flex: none;
+  display: flex;
+  flex-flow: row nowrap;
+}
+
+
 .volume-content {
+  flex: none;
  position: relative;
  width: 80px;
+  margin-right: 10px;
  display: flex;
  align-items: center;
  opacity: .5;
@ -882,13 +1001,17 @@ export default {
  border-radius: 10px;
  // overflow: hidden;
  transition: @transition-theme;
-  transition-property: background-color;
+  transition-property: background-color, opacity;
  background-color: @color-player-progress-bar1;
  // background-color: #f5f5f5;
  position: relative;
  border-radius: @radius-progress-border;
 }

+.muted {
+  opacity: .5;
+}
+
 .volume-bar {
  position: absolute;
  left: 0;
@ -905,6 +1028,7 @@ export default {
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
 }

+
 .volume-mask {
  position: absolute;
  top: 0;
@ -913,6 +1037,32 @@ export default {
  cursor: pointer;
 }

+.titleBtn {
+  flex: none;
+  margin-left: 5px;
+  height: 100%;
+  width: 20px;
+  color: @color-theme;
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  align-items: center;
+
+  transition: opacity 0.2s ease;
+  opacity: .5;
+  cursor: pointer;
+
+  svg {
+    filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.2));
+  }
+  &:hover {
+    opacity: 1;
+  }
+  &:active {
+    opacity: 1;
+  }
+}
+
 .play-btn {
  + .play-btn {
    margin-left: 15px;
@ -1041,6 +1191,9 @@ each(@themes, {
      //   border-color: ~'@{color-@{value}-theme_2-background_1}';
      // }
    }
+    .titleBtn {
+      color: ~'@{color-@{value}-theme}';
+    }
    .play-btn {
      color: ~'@{color-@{value}-theme}';
      svg {
--- a/src/renderer/components/core/PlayerDetail.vue
+++ b/src/renderer/components/core/PlayerDetail.vue
@ -526,7 +526,7 @@ export default {
    padding: 8px 0;
    line-height: 1.2;
    overflow-wrap: break-word;
-    transition: @transition-theme;
+    transition: @transition-theme !important;
    transition-property: color, font-size;
  }
 }
--- a/src/renderer/components/core/Toolbar.vue
+++ b/src/renderer/components/core/Toolbar.vue
@ -183,6 +183,7 @@ export default {
  }

  button {
+    display: flex;
    position: relative;
    width: @control-btn-width;
    height: @control-btn-width;
--- a/src/renderer/components/material/FlowBtn.vue
+++ b/src/renderer/components/material/FlowBtn.vue
@ -1,123 +0,0 @@
-<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="$t('material.flow_btn.play')" @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="$t('material.flow_btn.add')" @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="$t('material.flow_btn.download')" @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="$t('material.flow_btn.start')" @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="$t('material.flow_btn.pause')" @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="$t('material.flow_btn.remove')" @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;
-  // transform: translateX(-25%);
-  background-color: @color-theme_2-background_2;
-  border-radius: 5px;
-  // padding: 3px 5px;
-  box-shadow: 0 1px 8px 0 rgba(0,0,0,.2);
-  button {
-    background-color: transparent;
-    border: none;
-    border-radius: @form-radius;
-    margin-right: 2px;
-    cursor: pointer;
-    padding: 6px 10px;
-    color: @color-btn;
-    outline: none;
-    transition: background-color 0.2s ease;
-    line-height: 0;
-    &:last-child {
-      margin-right: 0;
-    }
-
-    svg {
-      width: 18px;
-    }
-
-    &:hover {
-      background-color: @color-theme_2-hover;
-    }
-    &:active {
-      background-color: @color-theme_2-active;
-    }
-  }
-}
-
-each(@themes, {
-  :global(#container.@{value}) {
-    .btns {
-      background-color: ~'@{color-@{value}-theme_2-background_2}';
-      button {
-        color: ~'@{color-@{value}-btn}';
-        &:hover {
-          background-color: ~'@{color-@{value}-theme_2-hover}';
-        }
-        &:active {
-          background-color: ~'@{color-@{value}-theme_2-active}';
-        }
-      }
-    }
-  }
-})
-</style>
--- a/src/renderer/components/material/InputRange.vue
+++ b/src/renderer/components/material/InputRange.vue
@ -1,80 +0,0 @@
-<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>
--- a/src/renderer/components/material/ListButtons.vue
+++ b/src/renderer/components/material/ListButtons.vue
@ -1,31 +1,31 @@
 <template lang="pug">
 div(:class="$style.btns")
  button(type="button" v-if="playBtn" @contextmenu.capture.stop :title="$t('material.list_buttons.play')" @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')
+    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' v-once)
      use(xlink:href='#icon-testPlay')
  button(type="button" v-if="listAddBtn" @contextmenu.capture.stop :title="$t('material.list_buttons.add_to')" @click.stop="handleClick('listAdd')")
-    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')
+    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' v-once)
      use(xlink:href='#icon-addTo')
  button(type="button" v-if="downloadBtn && setting.download.enable" @contextmenu.capture.stop :title="$t('material.list_buttons.download')" @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')
+    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' v-once)
      use(xlink:href='#icon-download')
  //- button(type="button" :title="$t('material.list_buttons.add')" 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" @contextmenu.capture.stop :title="$t('material.list_buttons.start')" @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')
+    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' v-once)
      use(xlink:href='#icon-play')
  button(type="button" v-if="pauseBtn" @contextmenu.capture.stop :title="$t('material.list_buttons.pause')" @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')
+    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' v-once)
      use(xlink:href='#icon-pause')
  button(type="button" v-if="fileBtn" @contextmenu.capture.stop :title="$t('material.list_buttons.file')" @click.stop="handleClick('file')")
-    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='-61 0 512 512' space='preserve')
+    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='-61 0 512 512' space='preserve' v-once)
      use(xlink:href='#icon-musicFile')
  button(type="button" v-if="searchBtn" @contextmenu.capture.stop :title="$t('material.list_buttons.search')" @click.stop="handleClick('search')")
-    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 30.239 30.239' space='preserve')
+    svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 30.239 30.239' space='preserve' v-once)
      use(xlink:href='#icon-search')
  button(type="button" v-if="removeBtn" :title="$t('material.list_buttons.remove')" @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')
+    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' v-once)
      use(xlink:href='#icon-delete')

 </template>
--- a/src/renderer/components/material/SearchList.vue
+++ b/src/renderer/components/material/SearchList.vue
@ -239,7 +239,7 @@ export default {
    handleSearch() {
      if (!this.text.length) return this.resultList = []
      let list = []
-      let rxp = new RegExp(this.text.split('').join('.*'), 'i')
+      let rxp = new RegExp(this.text.split('').join('.*') + '.*', 'i')
      for (const item of this.list) {
        if (rxp.test(`${item.name}${item.singer}${item.albumName ? item.albumName : ''}`)) list.push(item)
      }
--- a/src/renderer/components/material/VersionModal.vue
+++ b/src/renderer/components/material/VersionModal.vue
@ -46,7 +46,7 @@ material-modal(:show="version.showModal" @close="handleClose" v-if="version.newV
          | 你可以去&nbsp;
          strong.hover.underline(@click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" title="点击打开") 软件发布页
          | &nbsp;或&nbsp;
-          strong.hover.underline(@click="handleOpenUrl('https://www.lanzous.com/b906260/')" title="点击打开") 网盘
+          strong.hover.underline(@click="handleOpenUrl('https://www.lanzoux.com/b0bf2cfa/')" title="点击打开") 网盘
          | (密码：
          strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
          | )&nbsp;下载新版本，
@ -63,7 +63,7 @@ material-modal(:show="version.showModal" @close="handleClose" v-if="version.newV
        | 你可以去
        material-btn(min @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" title="点击打开") 软件发布页
        | 或
-        material-btn(min @click="handleOpenUrl('https://www.lanzous.com/b906260/')" title="点击打开") 网盘
+        material-btn(min @click="handleOpenUrl('https://www.lanzoux.com/b0bf2cfa/')" title="点击打开") 网盘
        | (密码：
        strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
        | )下载新版本，
@ -84,7 +84,7 @@ material-modal(:show="version.showModal" @close="handleClose" v-if="version.newV
            | 检查方法：打开
            material-btn(min @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" title="点击打开") 软件发布页
            | 或
-            material-btn(min @click="handleOpenUrl('https://www.lanzous.com/b906260/')" title="点击打开") 网盘
+            material-btn(min @click="handleOpenUrl('https://www.lanzoux.com/b0bf2cfa/')" title="点击打开") 网盘
            | (密码：
            strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
            | )查看它们的
@ -117,7 +117,7 @@ material-modal(:show="version.showModal" @close="handleClose" v-if="version.newV
          | 手动更新可以去&nbsp;
          strong.hover.underline(@click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" title="点击打开") 软件发布页
          | &nbsp;或&nbsp;
-          strong.hover.underline(@click="handleOpenUrl('https://www.lanzous.com/b906260/')" title="点击打开") 网盘
+          strong.hover.underline(@click="handleOpenUrl('https://www.lanzoux.com/b0bf2cfa/')" title="点击打开") 网盘
          | (密码：
          strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
          | )&nbsp;下载，
--- a/src/renderer/components/material/listAddModal.vue
+++ b/src/renderer/components/material/listAddModal.vue
@ -61,7 +61,7 @@ export default {
        this.defaultList,
        this.loveList,
        ...this.userList,
-      ].filter(l => l.id != this.excludeListId)
+      ].filter(l => l.id != this.excludeListId.includes(l.id))
    },
    spaceNum() {
      return this.lists.length < 2 ? 0 : (3 - this.lists.length % 3 - 1)
@ -91,7 +91,7 @@ export default {
      this.newListName = event.target.value = ''
      this.isEditing = false
      if (!name) return
-      this.createUserList(name)
+      this.createUserList({ name })
    },
  },
 }
--- a/src/renderer/components/material/listAddMultipleModal.vue
+++ b/src/renderer/components/material/listAddMultipleModal.vue
@ -62,7 +62,7 @@ export default {
        this.defaultList,
        this.loveList,
        ...this.userList,
-      ].filter(l => l.id != this.excludeListId)
+      ].filter(l => l.id != this.excludeListId.includes(l.id))
    },
    spaceNum() {
      return this.lists.length < 2 ? 0 : (3 - this.lists.length % 3 - 1)
@ -92,7 +92,7 @@ export default {
      this.newListName = event.target.value = ''
      this.isEditing = false
      if (!name) return
-      this.createUserList(name)
+      this.createUserList({ name })
    },
  },
 }
--- a/src/renderer/event/index.js
+++ b/src/renderer/event/index.js
@ -1,21 +1,22 @@
 import Vue from 'vue'
 import keyBind from '../utils/keyBind'
-import { rendererOn, rendererSend, NAMES } from '../../common/ipc'
+import { rendererOn, rendererSend, NAMES, rendererInvoke } from '../../common/ipc'
 import { base as baseName } from './names'
-import Store from 'electron-store'
 import { common as hotKeyNamesCommon } from '../../common/hotKey'

 const eventHub = window.eventHub = new Vue()

-const electronStore_hotKey = window.electronStore_hotKey = new Store({
-  name: 'hotKey',
-})
-
 window.isEditingHotKey = false
-const appHotKeyConfig = window.appHotKeyConfig = {
-  local: electronStore_hotKey.get('local'),
-  global: electronStore_hotKey.get('global'),
+let appHotKeyConfig = {
+  local: {},
+  global: {},
 }
+rendererInvoke(NAMES.mainWindow.get_hot_key).then(({ local, global }) => {
+  appHotKeyConfig = window.appHotKeyConfig = {
+    local,
+    global,
+  }
+})

 eventHub.$on(baseName.bindKey, () => {
  keyBind.bindKey((key, type, event, keys) => {
--- a/src/renderer/lang/en-us/core/player.json
+++ b/src/renderer/lang/en-us/core/player.json
@ -17,5 +17,13 @@
  "hide_detail": "Hide detail page",
  "name": "Name: ",
  "singer": "Artist: ",
-  "album": "Album: "
+  "album": "Album: ",
+  "add_music_to": "Add the current song to...",
+  "desktop_lyric_on": "Open Desktop Lyrics",
+  "desktop_lyric_off": "Close Desktop Lyrics",
+  "play_toggle_mode_list_loop": "List Loop",
+  "play_toggle_mode_random": "List Random",
+  "play_toggle_mode_list": "Play in order",
+  "play_toggle_mode_single_loop": "Single Loop",
+  "play_toggle_mode_off": "Disable"
 }
--- a/src/renderer/lang/en-us/view/setting.json
+++ b/src/renderer/lang/en-us/view/setting.json
@ -1,6 +1,7 @@
 {
  "basic": "General",
  "basic_theme": "Theme",
+  "basic_show_animation": "Show switching animation",
  "basic_animation_title": "Animation effect of the pop-up layer",
  "basic_animation": "Random pop-up animation",
  "basic_source_title": "Choose a music source",
@ -35,6 +36,7 @@
  "play_toggle_random": "Playlist shuffle",
  "play_toggle_list": "Play in order",
  "play_toggle_single_loop": "Single repeat",
+  "play_lyric_transition": "Show lyrics translation",
  "play_quality_title": "The 320k quality is preferred for playing",
  "play_quality": "Prefer High Quality 320k",
  "play_task_bar_title": "Show playing progress on the taskbar",
@ -48,6 +50,7 @@
  "desktop_lyric_enable": "Display lyrics",
  "desktop_lyric_lock": "Lock lyrics",
  "desktop_lyric_always_on_top": "Make the lyrics always above other windows",
+  "desktop_lyric_lock_screen": "It is not allowed to drag the lyrics window out of the main screen",

  "search": "Search",
  "search_hot_title": "Select whether to show popular searches",
--- a/src/renderer/lang/en-us/view/song_list.json
+++ b/src/renderer/lang/en-us/view/song_list.json
@ -6,5 +6,7 @@
  "input_text": "Enter songlist link or songlist ID",
  "tip_1": "Cross-source playlists are not supported, please confirm whether the playlist to be opened corresponds to the current playlist source",
  "tip_2": "If you encounter a link to a playlist that cannot be opened, welcome feedback",
-  "tip_3": "Kugou source does not support opening with playlist ID, but supports Kugou code opening"
+  "tip_3": "Kugou source does not support opening with playlist ID, but supports Kugou code opening",
+  "play_all": "Play",
+  "add_all": "Collect"
 }
--- a/src/renderer/lang/zh-cn/core/player.json
+++ b/src/renderer/lang/zh-cn/core/player.json
@ -17,5 +17,13 @@
  "hide_detail": "隐藏详情页",
  "name": "歌曲名：",
  "singer": "艺术家：",
-  "album": "专辑名："
+  "album": "专辑名：",
+  "add_music_to": "添加当前歌曲到...",
+  "desktop_lyric_on": "开启桌面歌词",
+  "desktop_lyric_off": "关闭桌面歌词",
+  "play_toggle_mode_list_loop": "列表循环",
+  "play_toggle_mode_random": "列表随机",
+  "play_toggle_mode_list": "顺序播放",
+  "play_toggle_mode_single_loop": "单曲循环",
+  "play_toggle_mode_off": "禁用"
 }
--- a/src/renderer/lang/zh-cn/view/setting.json
+++ b/src/renderer/lang/zh-cn/view/setting.json
@ -3,6 +3,7 @@
  "basic_theme": "主题颜色",
  "basic_animation_title": "弹出层的动画效果",
  "basic_animation": "弹出层随机动画",
+  "basic_show_animation": "显示切换动画",
  "basic_source_title": "选择音乐来源",
  "basic_source_test": "测试接口（几乎软件的所有功能都可用）",
  "basic_source_temp": "临时接口（软件的某些功能不可用，建议测试接口不可用再使用本接口）",
@ -35,6 +36,7 @@
  "play_toggle_random": "列表随机",
  "play_toggle_list": "顺序播放",
  "play_toggle_single_loop": "单曲循环",
+  "play_lyric_transition": "显示歌词翻译",
  "play_quality_title": "启用时将优先播放320K品质的歌曲",
  "play_quality": "优先播放高品质音乐",
  "play_task_bar_title": "在任务栏上显示当前歌曲播放进度",
@ -48,6 +50,7 @@
  "desktop_lyric_enable": "显示歌词",
  "desktop_lyric_lock": "锁定歌词",
  "desktop_lyric_always_on_top": "使歌词总是在其他窗口之上",
+  "desktop_lyric_lock_screen": "不允许歌词窗口拖出主屏幕之外",

  "search": "搜索设置",
  "search_hot_title": "是否显示热门搜索",
--- a/src/renderer/lang/zh-cn/view/song_list.json
+++ b/src/renderer/lang/zh-cn/view/song_list.json
@ -6,5 +6,7 @@
  "input_text": "输入歌单链接或歌单ID",
  "tip_1": "不支持跨源打开歌单，请确认要打开的歌单与当前歌单源是否对应",
  "tip_2": "若遇到无法打开的歌单链接，欢迎反馈",
-  "tip_3": "酷狗源不支持用歌单ID打开，但支持酷狗码打开"
+  "tip_3": "酷狗源不支持用歌单ID打开，但支持酷狗码打开",
+  "play_all": "播放",
+  "add_all": "收藏"
 }
--- a/src/renderer/lang/zh-tw/core/player.json
+++ b/src/renderer/lang/zh-tw/core/player.json
@ -17,5 +17,13 @@
  "hide_detail": "隱藏詳情頁",
  "name": "歌曲名：",
  "singer": "藝術家：",
-  "album": "專輯名："
+  "album": "專輯名：",
+  "add_music_to": "添加當前歌曲到...",
+  "desktop_lyric_on": "開啟桌面歌詞",
+  "desktop_lyric_off": "關閉桌面歌詞",
+  "play_toggle_mode_list_loop": "列表循環",
+  "play_toggle_mode_random": "列表隨機",
+  "play_toggle_mode_list": "順序播放",
+  "play_toggle_mode_single_loop": "單曲循環",
+  "play_toggle_mode_off": "禁用"
 }
--- a/src/renderer/lang/zh-tw/view/setting.json
+++ b/src/renderer/lang/zh-tw/view/setting.json
@ -3,6 +3,7 @@
  "basic_theme": "主題顏色",
  "basic_animation_title": "彈出層的動畫效果",
  "basic_animation": "彈出層隨機動畫",
+  "basic_show_animation": "顯示切換動畫",
  "basic_source_title": "選擇音樂來源",
  "basic_source_test": "測試接口（幾乎軟件的所有功能都可用）",
  "basic_source_temp": "臨時接口（軟件的某些功能不可用，建議測試接口不可用再使用本接口）",
@ -34,6 +35,7 @@
  "play_toggle_random": "列表隨機",
  "play_toggle_list": "順序播放",
  "play_toggle_single_loop": "單曲循環",
+  "play_lyric_transition": "顯示歌詞翻譯",
  "play_quality_title": "啟用時將優先播放320K品質的歌曲",
  "play_quality": "優先播放高品質音樂",
  "play_task_bar_title": "在任務欄上顯示當前歌曲播放進度",
@ -46,6 +48,7 @@
  "desktop_lyric_enable": "顯示歌詞",
  "desktop_lyric_lock": "鎖定歌詞",
  "desktop_lyric_always_on_top": "使歌詞總是在其他窗口之上",
+  "desktop_lyric_lock_screen": "不允許歌詞窗口拖出主屏幕之外",
  "search": "搜索設置",
  "search_hot_title": "是否顯示熱門搜索",
  "search_hot": "熱門搜索",
--- a/src/renderer/lang/zh-tw/view/song_list.json
+++ b/src/renderer/lang/zh-tw/view/song_list.json
@ -6,5 +6,7 @@
  "input_text": "輸入歌單鏈接或歌單ID",
  "tip_1": "不支持跨源打開歌單，請確認要打開的歌單與當前歌單源是否對應",
  "tip_2": "若遇到無法打開的歌單鏈接，歡迎反饋",
-  "tip_3": "酷狗源不支持用歌單ID打開，但支持酷狗碼打開"
+  "tip_3": "酷狗源不支持用歌單ID打開，但支持酷狗碼打開",
+  "play_all": "播放",
+  "add_all": "收藏"
 }
--- a/src/renderer/main.js
+++ b/src/renderer/main.js
@ -16,14 +16,45 @@ import store from './store'

 import '../common/error'

+import { getSetting } from './utils'
+import languageList from '@/lang/languages.json'
+import { rendererSend, NAMES } from '../common/ipc'
+
 sync(store, router)

 Vue.config.productionTip = false

-new Vue({
-  router,
-  store,
-  i18n,
-  el: '#root',
-  render: h => h(App),
+
+getSetting().then(({ setting, version }) => {
+  // Set language automatically
+  if (!window.i18n.availableLocales.includes(setting.langId)) {
+    let langId = null
+    let locale = window.navigator.language.toLocaleLowerCase()
+    if (window.i18n.availableLocales.includes(locale)) {
+      langId = locale
+    } else {
+      for (const lang of languageList) {
+        if (lang.alternate == locale) {
+          langId = lang.locale
+          break
+        }
+      }
+      if (langId == null) langId = 'en-us'
+    }
+    setting.langId = langId
+    rendererSend(NAMES.mainWindow.set_app_setting, setting)
+    console.log('Set lang', setting.langId)
+  }
+  window.i18n.locale = setting.langId
+  store.commit('setSetting', setting)
+  store.commit('setSettingVersion', version)
+
+  new Vue({
+    router,
+    store,
+    i18n,
+    el: '#root',
+    render: h => h(App),
+  })
 })
+
--- a/src/renderer/store/modules/download.js
+++ b/src/renderer/store/modules/download.js
@ -177,7 +177,7 @@ const saveMeta = (downloadInfo, filePath, isEmbedPic, isEmbedLyric) => {
      : Promise.resolve(),
    isEmbedLyric
      ? downloadInfo.musicInfo.lrc
-        ? Promise.resolve(downloadInfo.musicInfo.lrc)
+        ? Promise.resolve({ lyric: downloadInfo.musicInfo.lrc, tlyric: downloadInfo.musicInfo.tlrc || '' })
        : music[downloadInfo.musicInfo.source].getLyric(downloadInfo.musicInfo).promise.catch(err => {
          console.log(err)
          return null
@ -190,7 +190,7 @@ const saveMeta = (downloadInfo, filePath, isEmbedPic, isEmbedLyric) => {
      artist: downloadInfo.musicInfo.singer,
      album: downloadInfo.musicInfo.albumName,
      APIC: imgUrl,
-      lyrics,
+      lyrics: lyrics.lyric,
    })
  })
 }
@ -202,10 +202,10 @@ const saveMeta = (downloadInfo, filePath, isEmbedPic, isEmbedLyric) => {
 */
 const downloadLyric = (downloadInfo, filePath) => {
  const promise = downloadInfo.musicInfo.lrc
-    ? Promise.resolve(downloadInfo.musicInfo.lrc)
+    ? Promise.resolve({ lyric: downloadInfo.musicInfo.lrc, tlyric: downloadInfo.musicInfo.tlrc || '' })
    : music[downloadInfo.musicInfo.source].getLyric(downloadInfo.musicInfo).promise
-  promise.then(lrc => {
-    if (lrc) saveLrc(filePath.replace(/(mp3|flac|ape|wav)$/, 'lrc'), lrc)
+  promise.then(lrcs => {
+    if (lrcs.lyric) saveLrc(filePath.replace(/(mp3|flac|ape|wav)$/, 'lrc'), lrcs.lyric)
  })
 }

@ -218,13 +218,13 @@ const refreshUrl = function(commit, downloadInfo) {
    if (!dl) return
    dl.refreshUrl(result.url)
    dl.start().catch(err => {
-      commit('onError', downloadInfo)
+      commit('onError', { downloadInfo, errorMsg: err.message })
      commit('setStatusText', { downloadInfo, text: err.message })
      this.dispatch('download/startTask')
    })
  }).catch(err => {
    // console.log(err)
-    commit('onError', downloadInfo)
+    commit('onError', { downloadInfo, errorMsg: err.message })
    commit('setStatusText', { downloadInfo, text: err.message })
    this.dispatch('download/startTask')
  })
@ -299,7 +299,7 @@ const actions = {
    try {
      await checkPath(rootState.setting.download.savePath)
    } catch (error) {
-      commit('onError', downloadInfo)
+      commit('onError', { downloadInfo, errorMsg: error.message })
      commit('setStatusText', '检查下载目录出错: ' + error.message)
      await dispatch('startTask')
      return
@ -324,9 +324,14 @@ const actions = {
        console.log('on complate')
      },
      onError(err) {
+        // console.log(err)
+        if (err.code == 'EPERM') {
+          commit('onError', { downloadInfo, errorMsg: '歌曲下载目录没有写入权限，请尝试更改歌曲保存路径' })
+          return
+        }
        // console.log(tryNum[downloadInfo.key])
        if (++tryNum[downloadInfo.key] > 2) {
-          commit('onError', downloadInfo)
+          commit('onError', { downloadInfo, errorMsg: err.message })
          dispatch('startTask')
          return
        }
@ -375,7 +380,7 @@ const actions = {
      dls[downloadInfo.key] = download(options)
    }).catch(err => {
      // console.log(err.message)
-      commit('onError', downloadInfo)
+      commit('onError', { downloadInfo, errorMsg: err.message })
      commit('setStatusText', { downloadInfo, text: err.message })
      dispatch('startTask')
    })
@ -437,7 +442,7 @@ const actions = {
      try {
        await dl.start()
      } catch (error) {
-        commit('onError', downloadInfo)
+        commit('onError', { downloadInfo, errorMsg: error.message })
        commit('setStatusText', error.message)
        await dispatch('startTask')
      }
@ -448,7 +453,7 @@ const actions = {
  startTasks(store, list) {
    if (isRuningActionTask) return
    isRuningActionTask = true
-    return startTasks(store, [...list]).finally(() => {
+    return startTasks(store, list.filter(item => !(item.isComplate || item.status == state.downloadStatus.RUN || item.status == state.downloadStatus.WAITING))).finally(() => {
      isRuningActionTask = false
    })
  },
@ -522,9 +527,9 @@ const mutations = {
    downloadInfo.status = state.downloadStatus.COMPLETED
    downloadInfo.statusText = '下载完成'
  },
-  onError(state, downloadInfo) {
+  onError(state, { downloadInfo, errorMsg }) {
    downloadInfo.status = state.downloadStatus.ERROR
-    downloadInfo.statusText = '任务出错'
+    downloadInfo.statusText = errorMsg || '任务出错'
  },
  onStart(state, downloadInfo) {
    downloadInfo.status = state.downloadStatus.RUN
--- a/src/renderer/store/modules/list.js
+++ b/src/renderer/store/modules/list.js
@ -28,6 +28,12 @@ const state = {
    list: [],
    location: 0,
  },
+  tempList: {
+    id: 'temp',
+    name: '临时列表',
+    list: [],
+    location: 0,
+  },
  userList: [],
 }

@ -140,15 +146,19 @@ const mutations = {
    if (!targetList) return
    Object.assign(targetList.list[index], data)
  },
-  createUserList(state, name) {
-    let newList = {
-      name,
-      id: `userlist_${Date.now()}`,
-      list: [],
-      location: 0,
+  createUserList(state, { name, id = `userlist_${Date.now()}`, list = [] }) {
+    let newList = state.userList.find(item => item.id === id)
+    if (!newList) {
+      newList = {
+        name,
+        id,
+        list: [],
+        location: 0,
+      }
+      state.userList.push(newList)
+      allListUpdate(newList)
    }
-    state.userList.push(newList)
-    allListUpdate(newList)
+    this.commit('list/listAddMultiple', { id, list })
  },
  removeUserList(state, index) {
    let list = state.userList.splice(index, 1)[0]
--- a/src/renderer/store/modules/player.js
+++ b/src/renderer/store/modules/player.js
@ -9,6 +9,7 @@ const state = {
  playIndex: -1,
  changePlay: false,
  isShowPlayerDetail: false,
+  playedList: [],
 }

 let urlRequest
@ -22,6 +23,7 @@ const getters = {
  changePlay: satte => satte.changePlay,
  playIndex: state => state.playIndex,
  isShowPlayerDetail: state => state.isShowPlayerDetail,
+  playedList: state => state.playedList,
 }

 // actions
@ -58,9 +60,9 @@ const actions = {
  getLrc({ commit, state }, musicInfo) {
    if (lrcRequest && lrcRequest.cancelHttp) lrcRequest.cancelHttp()
    lrcRequest = music[musicInfo.source].getLyric(musicInfo)
-    return lrcRequest.promise.then(lrc => {
+    return lrcRequest.promise.then(({ lyric, tlyric }) => {
      lrcRequest = null
-      commit('setLrc', { musicInfo, lrc })
+      commit('setLrc', { musicInfo, lyric, tlyric })
    }).catch(err => {
      lrcRequest = null
      return Promise.reject(err)
@ -78,12 +80,14 @@ const mutations = {
    datas.musicInfo.img = datas.url
  },
  setLrc(state, datas) {
-    datas.musicInfo.lrc = datas.lrc
+    datas.musicInfo.lrc = datas.lyric
+    datas.musicInfo.tlrc = datas.tlyric
  },
  setList(state, { list, index }) {
    state.listInfo = list
    state.playIndex = index
    state.changePlay = true
+    if (state.playedList.length) this.commit('player/clearPlayedList')
  },
  setPlayIndex(state, index) {
    state.playIndex = index
@ -96,6 +100,16 @@ const mutations = {
  resetChangePlay(state) {
    state.changePlay = false
  },
+  setPlayedList(state, item) {
+    if (state.playedList.includes(item)) return
+    state.playedList.push(item)
+  },
+  removePlayedList(state, index) {
+    state.playedList.splice(index, 1)
+  },
+  clearPlayedList(state) {
+    state.playedList = []
+  },
  visiblePlayerDetail(state, visible) {
    state.isShowPlayerDetail = visible
  },
--- a/src/renderer/store/modules/search.js
+++ b/src/renderer/store/modules/search.js
@ -1,15 +1,5 @@
-import Store from 'electron-store'
 import music from '../../utils/music'

-const electronStore_data = window.electronStore_data = new Store({
-  name: 'data',
-})
-let historyList = electronStore_data.get('searchHistoryList')
-if (historyList == null) {
-  historyList = []
-  electronStore_data.set('searchHistoryList', historyList)
-}
-
 const sources = []
 const sourceList = {}
 const sourceMaxPage = {}
@ -103,7 +93,7 @@ const state = {
  allPage: 1,
  total: 0,
  sourceMaxPage,
-  historyList,
+  historyList: [],
 }

 // getters
@ -211,6 +201,9 @@ const mutations = {
  clearHistory(state) {
    state.historyList = []
  },
+  setHistory(state, list) {
+    state.historyList = list
+  },
 }

 export default {
--- a/src/renderer/store/modules/songList.js
+++ b/src/renderer/store/modules/songList.js
@ -79,37 +79,29 @@ const actions = {
      cache.has(key)
        ? Promise.resolve(cache.get(key))
        : music[source].songList.getListDetail(id, page)
-    ).then(result => commit('setListDetail', { result, key, page }))
+    ).then(result => commit('setListDetail', { result, key, source, id, page }))
  },
-/*   getListDetailAll({ state, rootState }, id) {
+  getListDetailAll({ state, rootState }, id) {
    let source = rootState.setting.songList.source
-    let key = `sdetail__${source}__${id}__all`
-    if (cache.has(key)) return Promise.resolve(cache.get(key))
-    music[source].songList.getListDetail(id, 1).then(result => {
-      let data = { list: result.list, id }
-      if (result.total <= result.limit) {
-        data = { list: result.list, id }
-        cache.set(key, data)
-        return data
-      }
+    const loadData = (id, page) => {
+      let key = `sdetail__${source}__${id}__${page}`
+      return cache.has(key) ? Promise.resolve(cache.get(key)) : music[source].songList.getListDetail(id, page).then(result => {
+        cache.set(key, result)
+        return result
+      })
+    }
+    return loadData(id, 1).then(result => {
+      if (result.total <= result.limit) return result.list

      let maxPage = Math.ceil(result.total / result.limit)
      const loadDetail = (loadPage = 1) => {
-        let task = []
-        let loadNum = 0
-        while (loadPage <= maxPage && loadNum < 3) {
-          task.push(music[source].songList.getListDetail(id, ++loadPage))
-          loadNum++
-        }
        return loadPage == maxPage
-          ? Promise.all(task)
-          : Promise.all(task).then(result => loadDetail(loadPage).then(result2 => [...result, ...result2]))
+          ? loadData(id, ++loadPage).then(result => result.list)
+          : loadData(id, ++loadPage).then(result1 => loadDetail(loadPage).then(result2 => [...result1.list, ...result2]))
      }
-      return loadDetail().then(result2 => {
-        console.log(result2)
-      })
+      return loadDetail().then(result2 => [...result.list, ...result2])
    })
-  }, */
+  },
 }

 // mitations
@ -129,8 +121,10 @@ const mutations = {
    state.list.key = key
    cache.set(key, result)
  },
-  setListDetail(state, { result, key, page }) {
+  setListDetail(state, { result, key, source, id, page }) {
    state.listDetail.list = result.list
+    state.listDetail.id = id
+    state.listDetail.source = source
    state.listDetail.total = result.total
    state.listDetail.limit = result.limit
    state.listDetail.page = page
@ -153,6 +147,8 @@ const mutations = {
  },
  clearListDetail(state) {
    state.listDetail = {
+      id: null,
+      source: null,
      list: [],
      desc: null,
      total: 0,
--- a/src/renderer/store/mutations.js
+++ b/src/renderer/store/mutations.js
@ -9,12 +9,12 @@ export default {
  setSetting(state, val) {
    state.setting = val
  },
-  setAgreePact(state) {
-    state.setting.isAgreePact = true
-  },
  setSettingVersion(state, val) {
    state.settingVersion = val
  },
+  setAgreePact(state) {
+    state.setting.isAgreePact = true
+  },
  setLeaderboard(state, { tabId, source }) {
    if (tabId != null) state.setting.leaderboard.tabId = tabId
    if (source != null) state.setting.leaderboard.source = source
@ -49,6 +49,12 @@ export default {
      state.setting.player.volume = val
    }
  },
+  setPlayNextMode(state, val) {
+    state.setting.player.togglePlayMethod = val
+  },
+  setVisibleDesktopLyric(state, val) {
+    state.setting.desktopLyric.enable = val
+  },
  setMediaDeviceId(state, val) {
    state.setting.player.mediaDeviceId = val
  },
--- a/src/renderer/store/state.js
+++ b/src/renderer/store/state.js
@ -1,67 +1,9 @@
-
 // const isDev = process.env.NODE_ENV === 'development'
-import Store from 'electron-store'
 import { windowSizeList } from '../../common/config'
 import { version } from '../../../package.json'
-import { rendererSend, rendererInvoke, NAMES } from '../../common/ipc'
-import languageList from '@/lang/languages.json'
-import path from 'path'
-import { openDirInExplorer } from '../utils'
-
-
-const electronStore_config = window.electronStore_config = new Store({
-  name: 'config',
-})
-let setting = electronStore_config.get('setting')
-let settingVersion = electronStore_config.get('version')

 process.versions.app = version

-// Set language automatically
-if (!window.i18n.availableLocales.includes(setting.langId)) {
-  let langId = null
-  let locale = window.navigator.language.toLocaleLowerCase()
-  if (window.i18n.availableLocales.includes(locale)) {
-    langId = locale
-  } else {
-    for (const lang of languageList) {
-      if (lang.alternate == locale) {
-        langId = lang.locale
-        break
-      }
-    }
-    if (langId == null) langId = 'en-us'
-  }
-  setting.langId = langId
-  electronStore_config.set('setting', setting)
-  rendererSend(NAMES.mainWindow.set_app_setting, setting)
-  console.log('Set lang', setting.langId)
-}
-
-window.i18n.locale = setting.langId
-
-try {
-  window.electronStore_list = new Store({
-    name: 'playList',
-    clearInvalidConfig: false,
-  })
-} catch (error) {
-  rendererInvoke(NAMES.mainWindow.get_data_path).then(dataPath => {
-    let filePath = path.join(dataPath, 'playList.json.bak')
-    rendererInvoke(NAMES.mainWindow.show_dialog, {
-      type: 'error',
-      message: window.i18n.t('store.state.load_list_file_error_title'),
-      detail: window.i18n.t('store.state.load_list_file_error_detail', {
-        path: filePath,
-        detail: error.message,
-      }),
-    }).then(() => openDirInExplorer(filePath))
-  })
-  window.electronStore_list = new Store({
-    name: 'playList',
-  })
-}
-

 export default {
  themes: [
@ -144,8 +86,8 @@ export default {
    downloadProgress: null,
  },
  userInfo: null,
-  setting,
-  settingVersion,
+  setting: null,
+  settingVersion: null,

  windowSizeList,
 }
--- a/src/renderer/utils/download/Downloader.js
+++ b/src/renderer/utils/download/Downloader.js
@ -172,7 +172,7 @@ class Task extends EventEmitter {
        this.chunkInfo.startByte = 0
        this.resumeLastChunk = null
        this.progress.downloaded = 0
-        if (unlinkErr) this.__handleError(unlinkErr)
+        if (unlinkErr && unlinkErr.code !== 'ENOENT') this.__handleError(unlinkErr)
      })
    })
  }
--- a/src/renderer/utils/index.js
+++ b/src/renderer/utils/index.js
@ -1,4 +1,5 @@
 import fs from 'fs'
+import path from 'path'
 import { shell, clipboard } from 'electron'
 import crypto from 'crypto'
 import { rendererSend, rendererInvoke, NAMES } from '../../common/ipc'
@ -341,3 +342,22 @@ export const getProxyInfo = () => window.globalObj.proxy.enable


 export const assertApiSupport = source => window.globalObj.qualityList[source] != undefined
+
+export const getSetting = () => rendererInvoke(NAMES.mainWindow.get_setting)
+export const saveSetting = () => rendererInvoke(NAMES.mainWindow.set_app_setting)
+
+export const getPlayList = () => rendererInvoke(NAMES.mainWindow.get_playlist).catch(error => {
+  rendererInvoke(NAMES.mainWindow.get_data_path).then(dataPath => {
+    let filePath = path.join(dataPath, 'playList.json.bak')
+    rendererInvoke(NAMES.mainWindow.show_dialog, {
+      type: 'error',
+      message: window.i18n.t('store.state.load_list_file_error_title'),
+      detail: window.i18n.t('store.state.load_list_file_error_detail', {
+        path: filePath,
+        detail: error.message,
+      }),
+    }).then(() => openDirInExplorer(filePath))
+  })
+  return rendererInvoke(NAMES.mainWindow.get_playlist, true)
+})
+
--- a/src/renderer/utils/music/api-source-info.js
+++ b/src/renderer/utils/music/api-source-info.js
@ -12,7 +12,7 @@ module.exports = [
      wy: ['128k'],
      mg: ['128k'],
      xm: ['128k'],
-      bd: ['128k'],
+      // bd: ['128k'],
    },
  },
  {
--- a/src/renderer/utils/music/bd/index.js
+++ b/src/renderer/utils/music/bd/index.js
@ -21,7 +21,7 @@ const bd = {
  },
  getLyric(songInfo) {
    const requestObj = this.getMusicInfo(songInfo)
-    requestObj.promise = requestObj.promise.then(info => httpFetch(info.lrclink).promise.then(resp => resp.body))
+    requestObj.promise = requestObj.promise.then(info => httpFetch(info.lrclink).promise.then(resp => ({ lyric: resp.body, tlyric: '' })))
    return requestObj
  },
  // getLyric(songInfo) {
--- a/src/renderer/utils/music/index.js
+++ b/src/renderer/utils/music/index.js
@ -34,10 +34,10 @@ const sources = {
      name: '虾米音乐',
      id: 'xm',
    },
-    {
-      name: '百度音乐',
-      id: 'bd',
-    },
+    // {
+    //   name: '百度音乐',
+    //   id: 'bd',
+    // },
  ],
  kw,
  kg,
--- a/src/renderer/utils/music/kg/lyric.js
+++ b/src/renderer/utils/music/kg/lyric.js
@ -1,4 +1,41 @@
 import { httpFetch } from '../../request'
+import { decodeLyric } from './util'
+
+const parseLyric = str => {
+  str = str.replace(/(?:<\d+,\d+,\d+>|\r)/g, '')
+  let trans = str.match(/\[language:([\w=\\/+]+)\]/)
+  let tlyric
+  if (trans) {
+    str = str.replace(/\[language:[\w=\\/+]+\]\n/, '')
+    let json = JSON.parse(Buffer.from(trans[1], 'base64').toString())
+    for (const item of json.content) {
+      if (item.type == 1) {
+        tlyric = item.lyricContent
+        break
+      }
+    }
+  }
+  let i = 0
+  let lyric = str.replace(/\[((\d+),\d+)\].*/g, str => {
+    let result = str.match(/\[((\d+),\d+)\].*/)
+    let time = parseInt(result[2])
+    let ms = time % 1000
+    time /= 1000
+    let h = parseInt(time / 3600).toString().padStart(2, '0')
+    time %= 3600
+    let m = parseInt(time / 60).toString().padStart(2, '0')
+    time %= 60
+    let s = parseInt(time).toString().padStart(2, '0')
+    time = `${h}:${m}:${s}.${ms}`
+    if (tlyric) tlyric[i] = `[${time}]${tlyric[i++][0]}`
+    return str.replace(result[1], time)
+  })
+  tlyric = tlyric ? tlyric.join('\n') : ''
+  return {
+    lyric,
+    tlyric,
+  }
+}

 export default {
  getIntv(interval) {
@ -11,8 +48,30 @@ export default {
    }
    return parseInt(intv)
  },
-  getLyric(songInfo, tryNum = 0) {
-    let requestObj = httpFetch(`http://m.kugou.com/app/i/krc.php?cmd=100&keyword=${encodeURIComponent(songInfo.name)}&hash=${songInfo.hash}&timelength=${songInfo._interval || this.getIntv(songInfo.interval)}&d=0.38664927426725626`, {
+  // getLyric(songInfo, tryNum = 0) {
+  //   let requestObj = httpFetch(`http://m.kugou.com/app/i/krc.php?cmd=100&keyword=${encodeURIComponent(songInfo.name)}&hash=${songInfo.hash}&timelength=${songInfo._interval || this.getIntv(songInfo.interval)}&d=0.38664927426725626`, {
+  //     headers: {
+  //       'KG-RC': 1,
+  //       'KG-THash': 'expand_search_manager.cpp:852736169:451',
+  //       'User-Agent': 'KuGou2012-9020-ExpandSearchManager',
+  //     },
+  //   })
+  //   requestObj.promise = requestObj.promise.then(({ body, statusCode }) => {
+  //     if (statusCode !== 200) {
+  //       if (tryNum > 5) return Promise.reject('歌词获取失败')
+  //       let tryRequestObj = this.getLyric(songInfo, ++tryNum)
+  //       requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
+  //       return tryRequestObj.promise
+  //     }
+  //     return {
+  //       lyric: body,
+  //       tlyric: '',
+  //     }
+  //   })
+  //   return requestObj
+  // },
+  searchLyric(name, hash, time, tryNum = 0) {
+    let requestObj = httpFetch(`http://lyrics.kugou.com/search?ver=1&man=yes&client=pc&keyword=${encodeURIComponent(name)}&hash=${hash}&timelength=${time}`, {
      headers: {
        'KG-RC': 1,
        'KG-THash': 'expand_search_manager.cpp:852736169:451',
@ -22,11 +81,49 @@ export default {
    requestObj.promise = requestObj.promise.then(({ body, statusCode }) => {
      if (statusCode !== 200) {
        if (tryNum > 5) return Promise.reject('歌词获取失败')
-        let tryRequestObj = this.getLyric(songInfo, ++tryNum)
+        let tryRequestObj = this.searchLyric(name, hash, time, ++tryNum)
        requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
        return tryRequestObj.promise
      }
-      return body
+      if (body.candidates.length) {
+        let info = body.candidates[0]
+        return { id: info.id, accessKey: info.accesskey }
+      }
+      return null
+    })
+    return requestObj
+  },
+  getLyricDownload(id, accessKey, tryNum = 0) {
+    let requestObj = httpFetch(`http://lyrics.kugou.com/download?ver=1&client=pc&id=${id}&accesskey=${accessKey}&fmt=krc&charset=utf8`, {
+      headers: {
+        'KG-RC': 1,
+        'KG-THash': 'expand_search_manager.cpp:852736169:451',
+        'User-Agent': 'KuGou2012-9020-ExpandSearchManager',
+      },
+    })
+    requestObj.promise = requestObj.promise.then(({ body, statusCode }) => {
+      if (statusCode !== 200) {
+        if (tryNum > 5) return Promise.reject('歌词获取失败')
+        let tryRequestObj = this.getLyric(id, accessKey, ++tryNum)
+        requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
+        return tryRequestObj.promise
+      }
+
+      return decodeLyric(body.content).then(result => parseLyric(result))
+    })
+    return requestObj
+  },
+  getLyric(songInfo, tryNum = 0) {
+    let requestObj = this.searchLyric(songInfo.name, songInfo.hash, songInfo._interval || this.getIntv(songInfo.interval))
+
+    requestObj.promise = requestObj.promise.then(result => {
+      if (!result) return { lyric: '', tlyric: '' }
+
+      let requestObj2 = this.getLyricDownload(result.id, result.accessKey)
+
+      requestObj.cancelHttp = requestObj2.cancelHttp.bind(requestObj2)
+
+      return requestObj2.promise
    })
    return requestObj
  },
--- a/src/renderer/utils/music/kg/util.js
+++ b/src/renderer/utils/music/kg/util.js
@ -0,0 +1,19 @@
+import { inflate } from 'zlib'
+
+// https://github.com/lyswhut/lx-music-desktop/issues/296#issuecomment-683285784
+const enc_key = Buffer.from([0x40, 0x47, 0x61, 0x77, 0x5e, 0x32, 0x74, 0x47, 0x51, 0x36, 0x31, 0x2d, 0xce, 0xd2, 0x6e, 0x69], 'binary')
+export const decodeLyric = str => new Promise((resolve, reject) => {
+  if (!str.length) return
+  const buf_str = Buffer.from(str, 'base64').slice(4)
+  for (let i = 0, len = buf_str.length; i < len; i++) {
+    buf_str[i] = buf_str[i] ^ enc_key[i % 16]
+  }
+  inflate(buf_str, (err, result) => {
+    if (err) return reject(err)
+    resolve(result.toString())
+  })
+})
+
+// s.content[0].lyricContent.forEach(([str]) => {
+//   console.log(str)
+// })
--- a/src/renderer/utils/music/kw/lyric.js
+++ b/src/renderer/utils/music/kw/lyric.js
@ -17,7 +17,10 @@ export default {
      return requestObj.promise.then(({ statusCode, body, raw }) => {
        if (statusCode != 200) return Promise.reject(new Error(JSON.stringify(body)))
        return decodeLyric({ lrcBase64: raw.toString('base64'), isGetLyricx }).then(base64Data => {
-          return Buffer.from(base64Data, 'base64').toString()
+          return {
+            lyric: Buffer.from(base64Data, 'base64').toString(),
+            tlyric: '',
+          }
        })
      })
    })
--- a/src/renderer/utils/music/mg/lyric.js
+++ b/src/renderer/utils/music/mg/lyric.js
@ -12,7 +12,10 @@ export default {
          requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
          return tryRequestObj.promise
        }
-        return body
+        return {
+          lyric: body,
+          tlyric: '',
+        }
      })
      return requestObj
    } else {
@ -28,7 +31,10 @@ export default {
          requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
          return tryRequestObj.promise
        }
-        return body.lyric
+        return {
+          lyric: body.lyric,
+          tlyric: '',
+        }
      })
      return requestObj
    }
--- a/src/renderer/utils/music/tx/lyric.js
+++ b/src/renderer/utils/music/tx/lyric.js
@ -6,13 +6,17 @@ export default {
    matchLrc: /.+"lyric":"([\w=+/]*)".+/,
  },
  getLyric(songmid) {
-    const requestObj = httpFetch(`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`, {
+    const requestObj = httpFetch(`https://c.y.qq.com/lyric/fcgi-bin/fcg_query_lyric_new.fcg?songmid=${songmid}&g_tk=5381&loginUin=0&hostUin=0&format=json&inCharset=utf8&outCharset=utf-8&platform=yqq`, {
      headers: {
        Referer: 'https://y.qq.com/portal/player.html',
      },
    })
    requestObj.promise = requestObj.promise.then(({ body }) => {
-      return decodeName(b64DecodeUnicode(body.replace(this.regexps.matchLrc, '$1')))
+      if (body.code != 0) return Promise.reject(new Error('获取歌词失败'))
+      return {
+        lyric: decodeName(b64DecodeUnicode(body.lyric)),
+        tlyric: decodeName(b64DecodeUnicode(body.trans)),
+      }
    })
    return requestObj
  },
--- a/src/renderer/utils/music/wy/lyric.js
+++ b/src/renderer/utils/music/wy/lyric.js
@ -1,20 +1,27 @@
 import { httpFetch } from '../../request'
-import { weapi } from './utils/crypto'
+import { linuxapi } from './utils/crypto'

 export default songmid => {
-  const requestObj = httpFetch('http://music.163.com/weapi/song/lyric?csrf_token=', {
+  const requestObj = httpFetch('https://music.163.com/api/linux/forward', {
    method: 'post',
-    headers: {
-      'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36',
-      Referer: 'https://music.163.com/song?id=' + songmid,
-      origin: 'https://music.163.com',
-    },
-    form: weapi({ id: songmid, lv: -1, tv: -1, csrf_token: '' }),
+    'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36',
+    form: linuxapi({
+      method: 'POST',
+      url: 'https://music.163.com/api/song/lyric',
+      params: {
+        id: songmid,
+        lv: -1,
+        kv: -1,
+        tv: -1,
+      },
+    }),
  })
  requestObj.promise = requestObj.promise.then(({ body }) => {
-    // console.log(body)
    if (body.code !== 200) return Promise.reject('获取歌词失败')
-    return body.lrc.lyric
+    return {
+      lyric: body.lrc.lyric,
+      tlyric: body.tlyric.lyric,
+    }
  })
  return requestObj
 }
--- a/src/renderer/utils/music/xm/leaderboard.js
+++ b/src/renderer/utils/music/xm/leaderboard.js
@ -78,7 +78,7 @@ export default {
    return arr.join('、')
  },
  filterData(rawList) {
-    console.log(rawList)
+    // console.log(rawList)
    let ids = new Set()
    const list = []
    rawList.forEach(songData => {
--- a/src/renderer/utils/music/xm/lyric.js
+++ b/src/renderer/utils/music/xm/lyric.js
@ -1,6 +1,23 @@
 import { httpGet, httpFetch } from '../../request'
 import { xmRequest } from './util'

+const parseLyric = str => {
+  str = str.replace(/(?:<\d+>|\r)/g, '')
+  let tlyric = []
+  let lyric = str.replace(/\[[\d:.]+\].*?\n\[x-trans\].*/g, s => {
+    // console.log(s)
+    let [lrc, tlrc] = s.split('\n')
+    tlrc = tlrc.replace('[x-trans]', lrc.replace(/^(\[[\d:.]+\]).*$/, '$1'))
+    tlyric.push(tlrc)
+    return lrc
+  })
+  tlyric = tlyric.join('\n')
+  return {
+    lyric,
+    tlyric,
+  }
+}
+
 export default {
  failTime: 0,
  expireTime: 60 * 1000 * 1000,
@ -13,7 +30,10 @@ export default {
        requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj)
        return tryRequestObj.promise
      }
-      return body
+      return url.endsWith('.xtrc') ? parseLyric(body) : {
+        lyric: body,
+        tlyric: '',
+      }
    })
    return requestObj
  },
@ -27,7 +47,10 @@ export default {
        },
      }, function(err, resp, body) {
        if (err || resp.statusCode !== 200) return this.getLyricFile(url, ++retryNum).then(resolve).catch(reject)
-        return resolve(body)
+        return resolve(url.endsWith('.xtrc') ? parseLyric(body) : {
+          lyric: body,
+          tlyric: '',
+        })
      })
    })
  },
@ -47,8 +70,12 @@ export default {
        return tryRequestObj.promise
      }
      if (!body.result.data.lyrics.length) return Promise.reject(new Error('未找到歌词'))
-      let lrc = body.result.data.lyrics.find(lyric => /\.lrc$/.test(lyric.lyricUrl))
-      return lrc ? lrc.content : Promise.reject(new Error('未找到歌词'))
+      let lrc = body.result.data.lyrics.find(lyric => /\.(trc|lrc)$/.test(lyric.lyricUrl))
+      return lrc
+        ? lrc.lyricUrl.endsWith('.trc')
+          ? parseLyric(lrc.content)
+          : { lyric: lrc.content, tlyric: '' }
+        : Promise.reject(new Error('未找到歌词'))
    })
    return requestObj
  },
@ -74,7 +101,7 @@ export default {
    return requestObj
  },
  getLyric(songInfo) {
-    if (songInfo.lrcUrl && /\.lrc$/.test(songInfo.lrcUrl)) return this.getLyricFile_1(songInfo.lrcUrl)
+    if (songInfo.lrcUrl && /\.(xtrc|lrc)$/.test(songInfo.lrcUrl)) return this.getLyricFile_1(songInfo.lrcUrl)
    return Date.now() - this.failTime > this.expireTime ? this.getLyricUrl_1(songInfo) : this.getLyricUrl_2(songInfo)
  },
 }
--- a/src/renderer/views/Download.vue
+++ b/src/renderer/views/Download.vue
@ -29,7 +29,6 @@ div(:class="$style.download")
                :start-btn="!item.isComplate && item.status != downloadStatus.WAITING && (item.status != downloadStatus.RUN)"
                :pause-btn="!item.isComplate && (item.status == downloadStatus.RUN || item.status == downloadStatus.WAITING)" :list-add-btn="false"
                :play-btn="item.status == downloadStatus.COMPLETED" :search-btn="item.status == downloadStatus.ERROR" @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")
    material-menu(:menus="listItemMenu" :location="listMenu.menuLocation" item-name="name" :isShow="listMenu.isShowItemMenu" @menu-click="handleListItemMenuClick")
  div(:class="$style.noItem" v-else)
 </template>
@ -47,7 +46,6 @@ export default {
      clickTime: window.performance.now(),
      clickIndex: -1,
      selectdData: [],
-      // isShowEditBtn: false,
      isShowDownloadMultiple: false,
      tabId: 'all',
      keyEvent: {
@ -166,14 +164,6 @@ export default {
    },
  },
  watch: {
-    selectdData(n) {
-      const len = n.length
-      if (len) {
-        this.isShowEditBtn = true
-      } else {
-        this.isShowEditBtn = false
-      }
-    },
    list() {
      this.removeAllSelect()
    },
--- a/src/renderer/views/List.vue
+++ b/src/renderer/views/List.vue
@ -643,7 +643,7 @@ export default {
        this.listsData.isShowNewList = false
      })

-      this.createUserList(name)
+      this.createUserList({ name })
    },
    handleShowNewList() {
      this.listsData.isShowNewList = true
--- a/src/renderer/views/Setting.vue
+++ b/src/renderer/views/Setting.vue
@ -10,6 +10,11 @@ div.scroll(:class="$style.setting")
            span
            label {{$t('store.state.theme_' + theme.class)}}

+    dd
+      h3 {{$t('view.setting.basic_show_animation')}}
+      div
+        material-checkbox(id="setting_show_animate" v-model="current_setting.isShowAnimation" :label="$t('view.setting.is_show')")
+
    dd(:title="$t('view.setting.basic_animation_title')")
      h3 {{$t('view.setting.basic_animation')}}
      div
@ -58,6 +63,10 @@ div.scroll(:class="$style.setting")
      div
        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
+      h3 {{$t('view.setting.play_lyric_transition')}}
+      div
+        material-checkbox(id="setting_player_lyric_transition" v-model="current_setting.player.isShowLyricTransition" :label="$t('view.setting.is_show')")
    dd(:title="$t('view.setting.play_quality_title')")
      h3 {{$t('view.setting.play_quality')}}
      div
@ -82,6 +91,8 @@ div.scroll(:class="$style.setting")
        material-checkbox(id="setting_desktop_lyric_lock" v-model="current_setting.desktopLyric.isLock" :label="$t('view.setting.desktop_lyric_lock')")
      div(:class="$style.gapTop")
        material-checkbox(id="setting_desktop_lyric_alwaysOnTop" v-model="current_setting.desktopLyric.isAlwaysOnTop" :label="$t('view.setting.desktop_lyric_always_on_top')")
+      div(:class="$style.gapTop")
+        material-checkbox(id="setting_desktop_lyric_lockScreen" v-model="current_setting.desktopLyric.isLockScreen" :label="$t('view.setting.desktop_lyric_lock_screen')")
    dt {{$t('view.setting.search')}}
    dd(:title="$t('view.setting.search_hot_title')")
      h3 {{$t('view.setting.search_hot')}}
@ -228,7 +239,7 @@ div.scroll(:class="$style.setting")
        span.hover.underline(:title="$t('view.setting.click_open')" @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop#readme')") https://github.com/lyswhut/lx-music-desktop
      p.small
        | 最新版网盘下载地址（网盘内有Windows、MAC版）：
-        span.hover.underline(:title="$t('view.setting.click_open')" @click="handleOpenUrl('https://t-s.lanzous.com/b0bf2cfa')") 网盘地址
+        span.hover.underline(:title="$t('view.setting.click_open')" @click="handleOpenUrl('https://www.lanzoux.com/b0bf2cfa/')") 网盘地址
        | &nbsp;&nbsp;密码：
        span.hover(:title="$t('view.setting.click_copy')" @click="clipboardWriteText('glqw')") glqw
      p.small
@ -448,6 +459,7 @@ export default {
        langId: 'cns',
        themeId: 0,
        sourceId: 0,
+        isShowAnimation: true,
        randomAnimate: true,
        isAgreePact: false,
        controlBtnPosition: 'left',
@ -587,6 +599,15 @@ export default {
    'setting.player.mediaDeviceId'(n) {
      this.current_setting.player.mediaDeviceId = n
    },
+    'setting.player.isMute'(n) {
+      this.current_setting.player.isMute = n
+    },
+    'setting.desktopLyric.enable'(n) {
+      this.current_setting.desktopLyric.enable = n
+    },
+    'setting.player.togglePlayMethod'(n) {
+      this.current_setting.player.togglePlayMethod = n
+    },
    'current_setting.player.isShowTaskProgess'(n) {
      if (n) return
      this.$nextTick(() => {
--- a/src/renderer/views/SongList.vue
+++ b/src/renderer/views/SongList.vue
@ -10,11 +10,9 @@
            h3(:title="listDetail.info.name || selectListInfo.name") {{listDetail.info.name || selectListInfo.name}}
            p(:title="listDetail.info.desc || selectListInfo.desc") {{listDetail.info.desc || selectListInfo.desc}}
          div(:class="$style.songListHeaderRight")
-            //- material-btn(:class="$style.closeDetailButton" :disabled="detailLoading" @click="addSongListDetail") 添加
-            //- | &nbsp;
-            //- material-btn(:class="$style.closeDetailButton" :disabled="detailLoading" @click="playSongListDetail") 播放
-            //- | &nbsp;
-            material-btn(:class="$style.closeDetailButton" @click="hideListDetail") {{$t('view.song_list.back')}}
+            material-btn(:class="$style.headerRightBtn" :disabled="detailLoading" @click="playSongListDetail") {{$t('view.song_list.play_all')}}
+            material-btn(:class="$style.headerRightBtn" :disabled="detailLoading" @click="addSongListDetail") {{$t('view.song_list.add_all')}}
+            material-btn(:class="$style.headerRightBtn" @click="hideListDetail") {{$t('view.song_list.back')}}
        material-song-list(v-model="selectedData" @action="handleSongListAction" :source="source" :page="listDetail.page" :limit="listDetail.limit"
         :total="listDetail.total" :noItem="isGetDetailFailed ? $t('view.song_list.loding_list_fail') : $t('view.song_list.loding_list')" :list="listDetail.list")
    transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
@ -84,7 +82,7 @@ export default {
      listWidth: 645,
      isGetDetailFailed: false,
      isInitedTagListWidth: false,
-      // detailLoading: true,
+      detailLoading: false,
    }
  },
  computed: {
@ -97,7 +95,7 @@ export default {
      switch (this.source) {
        case 'wy':
        case 'kw':
-        case 'bd':
+        // case 'bd':
        case 'tx':
        case 'mg':
        case 'kg':
@ -179,11 +177,13 @@ export default {
  },
  methods: {
    ...mapMutations(['setSongList']),
-    ...mapActions('songList', ['getTags', 'getList', 'getListDetail']),
+    ...mapActions('songList', ['getTags', 'getList', 'getListDetail', 'getListDetailAll']),
    ...mapMutations('songList', ['setVisibleListDetail', 'setSelectListInfo']),
    ...mapActions('download', ['createDownload', 'createDownloadMultiple']),
-    ...mapMutations('list', ['listAdd', 'listAddMultiple']),
-    ...mapMutations('player', ['setList']),
+    ...mapMutations('list', ['listAdd', 'listAddMultiple', 'createUserList']),
+    ...mapMutations('player', {
+      setPlayList: 'setList',
+    }),
    listenEvent() {
      window.eventHub.$on('key_backspace_down', this.handle_key_backspace_down)
    },
@ -273,7 +273,7 @@ export default {
        s => s.songmid === targetSong.songmid,
      )
      if (targetIndex > -1) {
-        this.setList({
+        this.setPlayList({
          list: this.defaultList,
          index: targetIndex,
        })
@ -402,15 +402,28 @@ export default {
    assertApiSupport(source) {
      return assertApiSupport(source)
    },
-    /*     addSongListDetail() {
-      // this.detailLoading = true
-      // this.getListDetailAll(this.selectListInfo.id).then(() => {
-      //   this.detailLoading = false
-      // })
+    async fetchList() {
+      this.detailLoading = true
+      const list = await this.getListDetailAll(this.selectListInfo.id)
+      this.detailLoading = false
+      return list
+    },
+    async addSongListDetail() {
+      if (!this.listDetail.info.name) return
+      const list = await this.fetchList()
+      this.createUserList({ name: this.listDetail.info.name, id: `${this.listDetail.source}__${this.listDetail.id}`, list })
+    },
+    async playSongListDetail() {
+      if (!this.listDetail.info.name) return
+      const list = await this.fetchList()
+      this.setPlayList({
+        list: {
+          list,
+          id: null,
+        },
+        index: 0,
+      })
    },
-    playSongListDetail() {
-
-    }, */
  },
 }
 </script>
@ -517,6 +530,17 @@ export default {
  align-items: center;
  padding-right: 15px;
 }
+.header-right-btn {
+  border-radius: 0;
+  &:first-child {
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+  }
+  &:last-child {
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+  }
+}

 .song-list-detail-content {
  position: absolute;