From a2c49d354e64ab3e6bbc81ab21a82dc2ea76b6c8 Mon Sep 17 00:00:00 2001
From: alger <algerkc@qq.com>
Date: Thu, 28 Dec 2023 10:45:11 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20=E6=B7=BB=E5=8A=A0=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E9=A1=B5=E9=9D=A2=20=E5=8F=AF=E9=85=8D=E7=BD=AE?=
 =?UTF-8?q?=E4=BB=A3=E7=90=86=E5=BC=80=E5=85=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app.js                              | 27 ++++++++++++
 components.d.ts                     |  3 +-
 electron/preload.js                 | 18 +++++++-
 electron/set.json                   |  5 +++
 package.json                        |  1 +
 src/App.vue                         | 11 +++--
 src/layout/components/SearchBar.vue |  7 ++++
 src/layout/components/TitleBar.vue  | 19 +++++----
 src/router/index.ts                 | 15 ++++++-
 src/store/index.ts                  | 11 +++++
 src/utils/index.ts                  |  8 +++-
 src/views/set/index.vue             | 64 +++++++++++++++++++++++++++++
 12 files changed, 173 insertions(+), 16 deletions(-)
 create mode 100644 electron/set.json
 create mode 100644 src/views/set/index.vue

diff --git a/app.js b/app.js
index 4190b18..f8cbe89 100644
--- a/app.js
+++ b/app.js
@@ -1,5 +1,7 @@
 const { app, BrowserWindow, ipcMain, Tray, Menu, globalShortcut, nativeImage } = require('electron')
 const path = require('path')
+const Store = require('electron-store');
+const setJson = require('./electron/set.json')
 
 let mainWin = null
 function createWindow() {
@@ -50,6 +52,13 @@ function createWindow() {
       win.show()
     }
   })
+
+  const set = store.get('set')
+  // store.set('set', setJson)
+
+  if (!set) {
+    store.set('set', setJson)
+  }
 }
 
 app.whenReady().then(createWindow)
@@ -104,3 +113,21 @@ ipcMain.on('mini-tray', (event) => {
   const win = BrowserWindow.fromWebContents(event.sender)
   win.hide()
 })
+
+// 重启
+ipcMain.on('restart', () => {
+  app.relaunch()
+  app.exit(0)
+})
+
+const store = new Store();
+
+// 定义ipcRenderer监听事件
+ipcMain.on('setStore', (_, key, value) => {
+  store.set(key, value)
+})
+
+ipcMain.on('getStore', (_, key) => {
+  let value = store.get(key)
+  _.returnValue = value || ""
+})
\ No newline at end of file
diff --git a/components.d.ts b/components.d.ts
index 830f9ce..b6817ad 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -7,7 +7,6 @@ export {}
 
 declare module 'vue' {
   export interface GlobalComponents {
-    AlbumsItem: typeof import('./src/components/common/AlbumsItem.vue')['default']
     MPop: typeof import('./src/components/common/MPop.vue')['default']
     MusicList: typeof import('./src/components/MusicList.vue')['default']
     NAvatar: typeof import('naive-ui')['NAvatar']
@@ -23,8 +22,8 @@ declare module 'vue' {
     NMessageProvider: typeof import('naive-ui')['NMessageProvider']
     NPopover: typeof import('naive-ui')['NPopover']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
-    NSelect: typeof import('naive-ui')['NSelect']
     NSlider: typeof import('naive-ui')['NSlider']
+    NSwitch: typeof import('naive-ui')['NSwitch']
     NTooltip: typeof import('naive-ui')['NTooltip']
     PlayBottom: typeof import('./src/components/common/PlayBottom.vue')['default']
     PlayListsItem: typeof import('./src/components/common/PlayListsItem.vue')['default']
diff --git a/electron/preload.js b/electron/preload.js
index 531b338..aa27375 100644
--- a/electron/preload.js
+++ b/electron/preload.js
@@ -6,4 +6,20 @@ contextBridge.exposeInMainWorld('electronAPI', {
   close: () => ipcRenderer.send('close-window'),
   dragStart: (data) => ipcRenderer.send('drag-start', data),
   miniTray: () => ipcRenderer.send('mini-tray'),
-})
\ No newline at end of file
+  restart: () => ipcRenderer.send('restart'),
+})
+
+const electronHandler = {
+  ipcRenderer: {
+    setStoreValue: (key, value) => {
+      ipcRenderer.send("setStore", key, value)
+    },
+
+    getStoreValue(key) {
+      const resp = ipcRenderer.sendSync("getStore", key)
+      return resp
+    },
+  }
+}
+
+contextBridge.exposeInMainWorld('electron', electronHandler)
\ No newline at end of file
diff --git a/electron/set.json b/electron/set.json
new file mode 100644
index 0000000..851b12a
--- /dev/null
+++ b/electron/set.json
@@ -0,0 +1,5 @@
+{
+  "version": "0.0.1",
+  "isProxy": false,
+  "author": "alger"
+}
diff --git a/package.json b/package.json
index 5f45987..5398666 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "@vueuse/core": "^10.7.1",
     "autoprefixer": "^9.8.6",
     "axios": "^0.21.1",
+    "electron-store": "^8.1.0",
     "lodash": "^4.17.21",
     "naive-ui": "^2.34.4",
     "postcss": "^7.0.36",
diff --git a/src/App.vue b/src/App.vue
index 9125e82..66ba4c7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -11,15 +11,20 @@
 
 <script lang="ts" setup>
 import { darkTheme } from 'naive-ui'
-import { useStore } from 'vuex'
+import store from '@/store'
 
 const audio = ref<HTMLAudioElement | null>(null)
 
-const store = useStore()
 const playMusicUrl = computed(() => store.state.playMusicUrl as string)
 // 是否播放
 const play = computed(() => store.state.play as boolean)
-
+const windowData = window as any
+onMounted(()=>{
+  if(windowData.electron){
+    const setData = windowData.electron.ipcRenderer.getStoreValue('set');
+    store.commit('setSetData', setData)
+  }
+})
 </script>
 
 <style lang="scss" scoped >
diff --git a/src/layout/components/SearchBar.vue b/src/layout/components/SearchBar.vue
index 827d429..ddfb21e 100644
--- a/src/layout/components/SearchBar.vue
+++ b/src/layout/components/SearchBar.vue
@@ -175,6 +175,10 @@ const options = [
     {
         label: '退出登录',
         key: 'logout'
+    },
+    {
+      label: '设置',
+      key: 'set'
     }
 ]
 
@@ -208,6 +212,9 @@ const selectItem = async (key: any) => {
         case 'login':
             router.push("/login")
             break;
+        case 'set':
+            router.push("/set")
+            break;
     }
 }
 
diff --git a/src/layout/components/TitleBar.vue b/src/layout/components/TitleBar.vue
index 082dc63..013a410 100644
--- a/src/layout/components/TitleBar.vue
+++ b/src/layout/components/TitleBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="title-bar" @mousedown="drag">
+  <div id="title-bar" @mousedown="drag" v-if="isElectron">
     <div id="title">Alger Music</div>
     <div id="buttons">
       <button @click="minimize">
@@ -19,13 +19,18 @@
 import { useDialog } from 'naive-ui'
 
 const dialog = useDialog()
+const windowData = window as any
+
+const isElectron = computed(() => {
+  return !!windowData.electronAPI.minimize
+})
 
 const minimize = () => {
-  window.electronAPI.minimize()
+  windowData.electronAPI.minimize()
 }
 
 const maximize = () => {
-  window.electronAPI.maximize()
+  windowData.electronAPI.maximize()
 }
 
 const close = () => {
@@ -35,16 +40,16 @@ const close = () => {
     positiveText: '最小化',
     negativeText: '关闭',
     onPositiveClick: () => {
-      window.electronAPI.miniTray()
+      windowData.electronAPI.miniTray()
     },
     onNegativeClick: () => {
-      window.electronAPI.close()
+      windowData.electronAPI.close()
     }
   })
 }
 
-const drag = (event: HTMLElement) => {
-  window.electronAPI.dragStart(event)
+const drag = (event: MouseEvent) => {
+  windowData.electronAPI.dragStart(event)
 }
 </script>
 
diff --git a/src/router/index.ts b/src/router/index.ts
index 4c1193d..9e60f74 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -2,7 +2,7 @@ import { createRouter, createWebHashHistory } from 'vue-router'
 import AppLayout from '@/layout/AppLayout.vue'
 import homeRouter from '@/router/home'
 
-let loginRouter = {
+const loginRouter = {
   path: '/login',
   name: 'login',
   mate: {
@@ -13,11 +13,22 @@ let loginRouter = {
   component: () => import('@/views/login/index.vue'),
 }
 
+const setRouter = {
+  path: '/set',
+  name: 'set',
+  mate: {
+    keepAlive: true,
+    title: '设置',
+    icon: 'icon-Home',
+  },
+  component: () => import('@/views/set/index.vue'),
+}
+
 const routes = [
   {
     path: '/',
     component: AppLayout,
-    children: [...homeRouter, loginRouter],
+    children: [...homeRouter, loginRouter, setRouter],
   },
 ]
 
diff --git a/src/store/index.ts b/src/store/index.ts
index ebaa788..e2b4b29 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -13,6 +13,7 @@ interface State {
   user: any
   playList: SongResult[]
   playListIndex: number
+  setData: any
 }
 
 const state: State = {
@@ -24,8 +25,11 @@ const state: State = {
   user: null,
   playList: [],
   playListIndex: 0,
+  setData: null,
 }
 
+const windowData = window as any
+
 const mutations = {
   setMenus(state: State, menus: any[]) {
     state.menus = menus
@@ -62,6 +66,13 @@ const mutations = {
       (state.playListIndex - 1 + state.playList.length) % state.playList.length
     await updatePlayMusic(state)
   },
+  async setSetData(state: State, setData: any) {
+    state.setData = setData
+    windowData.electron.ipcRenderer.setStoreValue(
+      'set',
+      JSON.parse(JSON.stringify(setData))
+    )
+  },
 }
 
 const getSongUrl = async (id: number) => {
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 0a315ff..54bda5a 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -36,8 +36,14 @@ export const formatNumber = (num: any) => {
   }
   return (num / 100000000).toFixed(1) + '亿'
 }
-
+const windowData = window as any
 export const getIsMc = () => {
+  if (!windowData.electron) {
+    return false
+  }
+  if (windowData.electron.ipcRenderer.getStoreValue('set').isProxy) {
+    return true
+  }
   return false
 }
 const ProxyUrl =
diff --git a/src/views/set/index.vue b/src/views/set/index.vue
new file mode 100644
index 0000000..0bab1f3
--- /dev/null
+++ b/src/views/set/index.vue
@@ -0,0 +1,64 @@
+<template>
+  <div class="set-page">
+    <div class="set-item">
+      <div>
+        <div class="set-item-title">代理</div>
+        <div class="set-item-content">无法听音乐时打开</div>
+      </div>
+      <n-switch v-model:value="setData.isProxy"/>
+    </div>
+    <div class="set-item">
+      <div>
+        <div class="set-item-title">版本</div>
+        <div class="set-item-content">当前已是最新版本</div>
+      </div>
+      <div>{{ setData.version }}</div>
+    </div>
+    <div class="set-item">
+      <div>
+        <div class="set-item-title">作者</div>
+        <div class="set-item-content"></div>
+      </div>
+      <div>{{ setData.author }}</div>
+    </div>
+
+    <div class="set-action">
+      <n-button @click="handelCancel">取消</n-button>
+      <n-button type="primary" @click="handleSave">保存并重启</n-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import store from '@/store'
+import { useRouter } from 'vue-router';
+
+const setData = ref(store.state.setData)
+const router = useRouter()
+
+const handelCancel = () => {
+  router.back()
+}
+
+const windowData = window as any
+
+const handleSave = () => {
+  store.commit('setSetData', setData.value)
+  windowData.electronAPI.restart()
+}
+</script>
+
+<style scoped lang="scss">
+.set-page{
+  @apply flex flex-col justify-center items-center pt-8;
+}
+.set-item{
+  @apply w-3/5  flex justify-between items-center mb-4;
+  .set-item-title{
+    @apply text-gray-200 text-base;
+  }
+  .set-item-content{
+    @apply text-gray-400 text-sm;
+  }
+}
+</style>
\ No newline at end of file