lx-music-desktop/src/renderer/App.vue
2019-08-16 17:27:23 +08:00

161 lines
3.8 KiB
Vue

<template lang="pug">
#container(v-if="isProd" :class="theme" @mouseenter="enableIgnoreMouseEvents" @mouseleave="dieableIgnoreMouseEvents")
core-aside#left
#right
core-toolbar#toolbar
core-view#view
core-player#player
core-icons
material-version-modal(v-show="version.showModal")
#container(v-else :class="theme")
core-aside#left
#right
core-toolbar#toolbar
core-view#view
core-player#player
core-icons
material-version-modal(v-show="version.showModal")
</template>
<script>
import { mapMutations, mapGetters, mapActions } from 'vuex'
import { rendererOn } from '../common/icp'
window.ELECTRON_DISABLE_SECURITY_WARNINGS = process.env.ELECTRON_DISABLE_SECURITY_WARNINGS
const win = require('electron').remote.getCurrentWindow()
const body = document.body
export default {
data() {
return {
isProd: process.env.NODE_ENV === 'production',
}
},
computed: {
...mapGetters(['electronStore', 'setting', 'theme', 'version']),
...mapGetters('list', ['defaultList']),
...mapGetters('download', {
downloadList: 'list',
}),
},
mounted() {
this.init()
},
watch: {
setting: {
handler(n) {
this.electronStore.set('setting', n)
},
deep: true,
},
defaultList: {
handler(n) {
this.electronStore.set('list.defaultList', n)
},
deep: true,
},
downloadList: {
handler(n) {
this.electronStore.set('download.list', n)
},
deep: true,
},
},
methods: {
...mapActions(['getVersionInfo']),
...mapMutations(['setNewVersion', 'setVersionVisible']),
...mapMutations('list', ['initDefaultList']),
...mapMutations('download', ['updateDownloadList']),
init() {
if (this.isProd) {
body.addEventListener('mouseenter', this.dieableIgnoreMouseEvents)
body.addEventListener('mouseleave', this.enableIgnoreMouseEvents)
}
rendererOn('update-downloaded', () => {
this.getVersionInfo().then(body => {
this.setNewVersion(body)
this.$nextTick(() => {
this.setVersionVisible(true)
})
})
})
this.initData()
},
enableIgnoreMouseEvents() {
win.setIgnoreMouseEvents(false)
// console.log('content enable')
},
dieableIgnoreMouseEvents() {
// console.log('content disable')
win.setIgnoreMouseEvents(true, { forward: true })
},
initData() { // 初始化数据
this.initPlayList() // 初始化播放列表
this.initDownloadList() // 初始化下载列表
},
initPlayList() {
let defaultList = this.electronStore.get('list.defaultList')
if (defaultList) {
defaultList.list.forEach(m => {
m.typeUrl = {}
})
this.initDefaultList(defaultList)
}
},
initDownloadList() {
let downloadList = this.electronStore.get('download.list')
if (downloadList) {
this.updateDownloadList(downloadList)
}
},
},
beforeDestroy() {
if (this.isProd) {
body.removeEventListener('mouseenter', this.dieableIgnoreMouseEvents)
body.removeEventListener('mouseleave', this.enableIgnoreMouseEvents)
}
},
}
</script>
<style lang="less">
@import './assets/styles/index.less';
@import './assets/styles/layout.less';
body {
// background-color: #fff;
padding: @shadow-app;
user-select: none;
height: 100vh;
box-sizing: border-box;
}
#container {
position: relative;
display: flex;
height: 100%;
box-shadow: 0 0 @shadow-app rgba(0, 0, 0, 0.5);
// background-color: #fff;
border-radius: 4px;
overflow: hidden;
}
#left {
flex: none;
width: @width-app-left;
}
#right {
flex: auto;
display: flex;
flex-flow: column nowrap;
}
#toolbar, #player {
flex: none;
}
#view {
flex: auto;
height: 0;
}
</style>