Skip to content

Commit

Permalink
feat: complete setting related functions
Browse files Browse the repository at this point in the history
1. Support custom playback source
2. Fix the custom forward and backward BUG
3. Keep the current state
  • Loading branch information
Linkontoask committed Dec 31, 2020
1 parent a6b5949 commit f014352
Show file tree
Hide file tree
Showing 22 changed files with 491 additions and 65 deletions.
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,7 @@ macOS 版本暂时无法发布(因为我没钱买 mac )。
相关链接:

- [NeteaseCloudMusicApi](https://github.com/Binaryify/NeteaseCloudMusicApi)
- [UnblockNeteaseMusic](https://github.com/nondanee/UnblockNeteaseMusic)
- [vuejs](https://v3.vuejs.org/)
- [commitlint](https://commitlint.js.org/#/)
- [vue-cli](https://cli.vuejs.org/zh/)
Expand Down
9 changes: 8 additions & 1 deletion src/electron/main.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { app, protocol, BrowserWindow, screen } from 'electron'
import { app, protocol, BrowserWindow, screen, session } from 'electron'
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
import { eventInit } from '@/electron/event/index'
Expand Down Expand Up @@ -103,6 +103,13 @@ app.on('activate', () => {
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', async () => {
session.defaultSession.webRequest.onBeforeSendHeaders((details, callback) => {
const location = new URL(details.url)
if (location.port === '80') {
details.requestHeaders['Origin'] = location.origin
}
callback({ requestHeaders: details.requestHeaders })
})
if (isDevelopment && !process.env.IS_TEST) {
// Install Vue Devtools
try {
Expand Down
6 changes: 5 additions & 1 deletion src/modules/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import Song, { SongNameSpaced } from '@/pages/list/module'
import Artist, { ArtistNameSpaced } from '@/pages/artist/module'
import Download, { DownloadNameSpaced } from '@/pages/download/module'
import LocalMusic, { LocalMusicNameSpaced } from '@/pages/music/module'
import Setting, { SettingNameSpaced } from '@/pages/setting/module'
import Layout, { LayoutNameSpaced } from '@/layout/module'

export * from '@/pages/footer/module'
Expand All @@ -26,6 +27,7 @@ export * from '@/pages/header/module'
export * from '@/pages/list/module'
export * from '@/pages/artist/module'
export * from '@/pages/music/module'
export * from '@/pages/setting/module'
export * from '@/layout/module'

export {
Expand All @@ -41,6 +43,7 @@ export {
ArtistNameSpaced,
DownloadNameSpaced,
LocalMusicNameSpaced,
SettingNameSpaced,
LayoutNameSpaced
}

Expand All @@ -57,7 +60,8 @@ const modules = {
[SongNameSpaced]: Song,
[ArtistNameSpaced]: Artist,
[DownloadNameSpaced]: Download,
[LocalMusicNameSpaced]: LocalMusic
[LocalMusicNameSpaced]: LocalMusic,
[SettingNameSpaced]: Setting
}

export default modules
4 changes: 2 additions & 2 deletions src/pages/header/component/logo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@ import './logo.less'

export const Logo = defineComponent({
name: 'Logo',
render() {
setup() {
const router = useRouter()
const home = () => {
router.replace({
path: '/'
})
}
return (
return () => (
<div class="logo" onClick={home}>
<icon icon="logo-fill" size={132} height={40}></icon>
</div>
Expand Down
50 changes: 27 additions & 23 deletions src/pages/header/component/push-shift.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { defineComponent, nextTick, watch, toRefs } from 'vue'
import { defineComponent, nextTick, watch } from 'vue'
import { RootMutations } from '@/store/index'
import classnames from 'classnames'
import { useRoute, useStore, useRouter } from '@/hooks/index'
Expand All @@ -13,10 +13,8 @@ export const PushShift = defineComponent({
name: 'Logo',
setup() {
const store = useStore()
const setHistoryRoute = (routeObj: { oldRoute: string }) => {
store.commit(RootMutations.SET_HISTORY_ROUTE, {
oldRoute: routeObj.oldRoute
})
const setHistoryRoute = (oldRoute: string) => {
store.commit(RootMutations.SET_HISTORY_ROUTE, oldRoute)
}
const routeCanBeCollect = (isCollect: boolean) => {
store.commit(RootMutations.CAN_BE_COLLECT, isCollect)
Expand All @@ -28,37 +26,43 @@ export const PushShift = defineComponent({
store.commit(RootMutations.BACK_HISTORY_ROUTE, path)
}

const { fullPath } = toRefs(useRoute())
const route = useRoute()

watch(fullPath, (route, oldRoute) => {
const { historyRoute } = store.state
if (!historyRoute.canBeCollect) {
routeCanBeCollect(true)
} else {
watch(
() => route.fullPath,
(currentRoute, oldRoute) => {
const { historyRoute } = store.state
const backRoute = historyRoute.after[historyRoute.after.length - 1]
const forwardRoute = historyRoute.before[historyRoute.before.length - 1]
if (route === backRoute) {
routeForward(oldRoute)
} else if (route === forwardRoute) {
routeBack(oldRoute)
if (
!historyRoute.canBeCollect ||
!route.meta.canBeCollect ||
oldRoute === '/'
) {
routeCanBeCollect(true)
} else {
setHistoryRoute({
oldRoute: oldRoute
})
const { historyRoute } = store.state
const backRoute = historyRoute.after[historyRoute.after.length - 1]
const forwardRoute =
historyRoute.before[historyRoute.before.length - 1]
if (currentRoute === backRoute) {
routeForward(oldRoute)
} else if (currentRoute === forwardRoute) {
routeBack(oldRoute)
} else {
setHistoryRoute(oldRoute)
}
}
}
})
)

const router = useRouter()
const handleRouteCommand = (payload: string) => {
const { historyRoute } = store.state
routeCanBeCollect(false)
if (payload === COMMAND.FORWARD) {
routeForward(fullPath.value)
routeForward(route.fullPath)
}
if (payload === COMMAND.BACK) {
routeBack(fullPath.value)
routeBack(route.fullPath)
}
nextTick(() => {
// TODO Needs optimization
Expand Down
19 changes: 15 additions & 4 deletions src/pages/header/component/setting.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ import { MiddlewareView } from '@/electron/event/action-types'
import { Platform } from '@/config/build'
import { shade } from '@/theme/color'
import { Popover } from 'ant-design-vue'
import './setting.less'
import { setThemeColor } from '@/helpers'
import { useThemeColor } from '@/hooks'
import { useThemeColor, useRouter } from '@/hooks'
import './setting.less'

const { VUE_APP_PLATFORM } = process.env

Expand Down Expand Up @@ -36,8 +36,9 @@ const setColor = (baseColor: string) => {
}

export const Setting = defineComponent({
name: 'Setting',
name: 'SettingButton',
setup() {
const router = useRouter()
// eslint-disable-next-line prefer-const
let themeColor = useThemeColor()
const visibleColor = ref(false)
Expand All @@ -64,9 +65,19 @@ export const Setting = defineComponent({
default: () => <icon icon="skin"></icon>
}

const handleOpenSetting = () => {
router.push({
path: '/setting/source'
})
}

return () => (
<div class="setting">
<ve-button type="text" class="header-window-btn">
<ve-button
type="text"
class="header-window-btn"
onClick={handleOpenSetting}
>
<icon icon="setting"></icon>
</ve-button>
<ve-button type="text" class="header-window-btn">
Expand Down
1 change: 1 addition & 0 deletions src/pages/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,4 @@ export * from './main/interface'
export * from './footer/interface'
export * from './download/interface'
export * from './music/interface'
export * from './setting/interface'
1 change: 1 addition & 0 deletions src/pages/main/view/index.less
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
);
height: 100%;
.content {
position: relative;
height: 100%;

> div {
Expand Down
4 changes: 2 additions & 2 deletions src/pages/moments/view/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import { defineComponent } from 'vue'

export const Moments = defineComponent({
name: 'Moments',
render() {
return (
setup() {
return () => (
<div class="moments">
<h1>动态</h1>
</div>
Expand Down
1 change: 1 addition & 0 deletions src/pages/setting/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { Setting } from './view/index'
15 changes: 15 additions & 0 deletions src/pages/setting/interface.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import { PlaySource } from '@/interface'

export interface SettingState {
source: PlaySource[]
sourceAll: {
name: string
value: PlaySource
disabled?: boolean
}[]
}

export const enum SettingActions {}
export const enum SettingMutations {
SET_SOURCE = 'SET_SOURCE'
}
19 changes: 19 additions & 0 deletions src/pages/setting/module.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { actions, mutations } from './sage'
import { state } from './state'
import { uesModuleStore } from '@/hooks/index'
import { SettingActions, SettingMutations, SettingState } from '@/interface'

export const SettingNameSpaced = 'Setting'

export const useSettingModule = () => {
return uesModuleStore<SettingState, {}, SettingActions, SettingMutations>(
SettingNameSpaced
)
}

export default {
namespaced: true,
state,
actions,
mutations
}
11 changes: 11 additions & 0 deletions src/pages/setting/sage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { MutationTree, ActionTree } from 'vuex'
import { RootState } from '@/store/index'
import { SettingMutations, SettingState, PlaySource } from '@/interface'

export const actions: ActionTree<SettingState, RootState> = {}

export const mutations: MutationTree<SettingState> = {
[SettingMutations.SET_SOURCE](state, source: PlaySource[]) {
state.source = source
}
}
15 changes: 15 additions & 0 deletions src/pages/setting/state.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import { SettingState } from '@/interface/index'

export const state: SettingState = {
source: ['qq', 'kuwo', 'migu'],
sourceAll: [
{ name: 'QQ音乐', value: 'qq', disabled: true },
{ name: '酷我音乐', value: 'kuwo', disabled: true },
{ name: '咪咕音乐', value: 'migu', disabled: true },
{ name: '百度音乐', value: 'baidu' },
{ name: 'JOOX', value: 'joox' },
{ name: '酷狗音乐', value: 'kugou' },
{ name: '虾米音乐', value: 'xiami' }
// { name: 'Youtube', value: 'youtube' }
]
}
52 changes: 52 additions & 0 deletions src/pages/setting/view/index.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
@import '~@/theme/index.less';

.setting-view {
display: flex;
flex-direction: column;
height: 100%;
padding: 20px;
overflow: auto;
background-color: white;
h1 {
font-size: 20px;
font-weight: bold;
}
h2 {
margin-bottom: 10px;
font-size: 18px;
}
&-route {
padding-bottom: 20px;
border-bottom: @lighter-border;
&--active {
font-weight: bold;
}
ul {
display: flex;
align-items: center;
li {
margin-right: 10px;
cursor: pointer;
}
}
}
&-description {
margin: 8px 0;
font-size: 12px;
}
&-paragraph {
line-height: 2;
text-indent: 24px;
ul {
padding-left: 20px;
}
}
&-contanier {
flex: 1;
height: 0;
overflow: auto;
> div {
margin-top: 50px;
}
}
}
Loading

0 comments on commit f014352

Please sign in to comment.