mirrors/lx-music-desktop
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化更新弹窗机制及其内容描述

Browse Source
This commit is contained in:
lyswhut
2019-11-03 17:18:44 +08:00
parent a2af321c5e
commit dfa15c6952
9 changed files with 174 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
src/renderer/components/material/VersionModal.vue
View File

@@ -1,7 +1,31 @@
<template lang="pug">
material-modal(:show="version.showModal" @close="handleClose")
main(:class="$style.main" v-if="version.newVersion")
h2 {{ version.isError ? (isUnknow ? '❓ 版本信息获取失败 ❓' : '🌟发现新版本🌟') : '🚀程序更新🚀'}}
material-modal(:show="version.showModal" @close="handleClose" v-if="version.newVersion")
main(:class="$style.main" v-if="version.isDownloaded")
h2 🚀程序更新🚀
div.scroll(:class="$style.info")
div(:class="$style.current")
h3 最新版本：{{version.newVersion.version}}
h3 当前版本：{{version.version}}
h3 版本变化：
p(:class="$style.desc" v-html="version.newVersion.desc")
div(:class="[$style.history, $style.desc]" v-if="history.length")
h3 历史版本：
div(:class="$style.item" v-for="ver in history")
h4 v{{ver.version}}
p(v-html="ver.desc")
div(:class="$style.footer")
div(:class="$style.desc")
p 新版本已下载完毕，
p
| 你可以选择
strong 立即重启更新
| 或稍后
strong 关闭程序时
| 自动更新~
material-btn(:class="$style.btn" @click.onec="handleRestartClick") 立即重启更新
main(:class="$style.main" v-else-if="version.isError && !version.isUnknow && version.newVersion.version != version.version")
h2 ❌ 版本更新出错 ❌
div.scroll(:class="$style.info")
div(:class="$style.current")
@@ -15,44 +39,97 @@ material-modal(:show="version.showModal" @close="handleClose")
h4 v{{ver.version}}
p(v-html="ver.desc")
div(:class="$style.footer" v-if="version.isError")
div(:class="$style.desc" v-if="!isUnknow")
div(:class="$style.footer")
div(:class="$style.desc")
p 发现有新版本啦，但是自动更新功能出问题了，
p
| 你现在可以选择继续使用当前版本或
strong 去发布页下载新版本
| ，
| 你可以去&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(@click="handleCopy('glqw')" title="点击复制") glqw
| )&nbsp;下载新版本，
p
| 国内Windows/MAC用户推荐到
strong.hover.underline(@click="handleOpenUrl('https://www.lanzous.com/b906260/')") 网盘(点击打开)
| 下载，密码：
strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
div(:class="$style.btns")
material-btn(:class="$style.btn" @click.onec="handleIgnoreClick") 忽略该版本
material-btn(:class="$style.btn" @click.onec="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop#readme')") 去软件发布页
div(:class="$style.footer" v-else)
div(:class="$style.desc")
p 新版本已下载完毕，
p
| 你可以选择
strong 立即重启更新
| 或稍后
strong 关闭程序时
| 自动更新~
material-btn(:class="$style.btn" @click.onec="handleRestartClick") 立即重启更新
strong 网盘
| 下载。
main(:class="$style.main" v-else-if="version.isTimeOut")
h2 ❗️ 新版本下载超时 ❗️
div(:class="$style.desc")
p 你当前所在网络访问GitHub较慢，导致新版本下载超时（已经下了半个钟了😳），建议手动更新版本！
p
| 你可以去
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="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
| )下载新版本，
p
| 国内Windows/MAC用户推荐到
strong 网盘
| 下载。
p 当前下载进度：{{progress}}
main(:class="$style.main" v-else-if="version.isUnknow")
h2 ❓ 获取最新版本信息失败 ❓
div.scroll(:class="$style.info")
div(:class="$style.current")
h3 当前版本：{{version.version}}
div(:class="$style.desc")
p 更新信息获取失败，可能是无法访问Github导致的，请手动检查更新！
p
| 检查方法：打开
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="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" title="点击复制") glqw
| )查看它们的
strong 版本号
| 与当前版本({{version.version}})对比是否一样，
p 若一样则不必理会该弹窗，直接关闭即可，否则请手动下载新版本更新。
main(:class="$style.main" v-else)
h2 🌟发现新版本🌟
div.scroll(:class="$style.info")
div(:class="$style.current")
h3 最新版本：{{version.newVersion.version}}
h3 当前版本：{{version.version}}
h3 版本变化：
p(:class="$style.desc" v-html="version.newVersion.desc")
div(:class="[$style.history, $style.desc]" v-if="history.length")
h3 历史版本：
div(:class="$style.item" v-for="ver in history")
h4 v{{ver.version}}
p(v-html="ver.desc")
div(:class="$style.footer")
div(:class="$style.desc")
p 发现有新版本啦，正在努力更新中，若下载太慢可以手动更新哦~
p
| 手动更新可以去&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(@click="handleCopy('glqw')" title="点击复制") glqw
| )&nbsp;下载，
p 国内Windows/MAC用户推荐到网盘下载。
p 当前下载进度：{{progress}}
</template>
<script>
import { mapGetters, mapMutations } from 'vuex'
import { rendererSend } from '../../../common/ipc'
import { checkVersion, openUrl, clipboardWriteText } from '../../utils'
import { checkVersion, openUrl, clipboardWriteText, sizeFormate } from '../../utils'
export default {
computed: {
...mapGetters(['version', 'setting']),
history() {
if (!this.version.newVersion) return []
if (!this.version.newVersion || !this.version.newVersion.history) return []
let arr = []
let currentVer = this.version.version
this.version.newVersion.history.forEach(ver => {
@@ -61,8 +138,10 @@ export default {
return arr
},
isUnknow() {
return this.version.newVersion.version == '0.0.0'
progress() {
return this.version.downloadProgress
? `${this.version.downloadProgress.percent.toFixed(2)}% - ${sizeFormate(this.version.downloadProgress.transferred)}/${sizeFormate(this.version.downloadProgress.total)} - ${sizeFormate(this.version.downloadProgress.bytesPerSecond)}/s`
: '初始化中...'
},
},
methods: {
@@ -72,11 +151,6 @@ export default {
isShow: false,
})
},
handleIgnoreClick(event) {
this.handleClose()
// event.target.disabled = true
this.setSetting(Object.assign({}, this.setting, { ignoreVersion: this.version.newVersion.version }))
},
handleOpenUrl(url) {
openUrl(url)
},
@@ -148,6 +222,10 @@ export default {
list-style: initial;
padding-inline-start: 30px;
}
p {
font-size: 14px;
line-height: 1.5;
}
}
.history {
@@ -175,22 +253,23 @@ export default {
.footer {
flex: 0 0 none;
.desc {
font-size: 12px;
padding-top: 10px;
font-size: 12px;
color: @color-theme;
line-height: 1.2;
p {
font-size: 12px;
color: @color-theme;
line-height: 1.2;
}
}
}
.btn {
margin-top: 10px;
display: block;
width: 100%;
}
.btns {
display: grid;
padding-top: 10px;
grid-template-columns: 1fr 1fr;
grid-gap: 0 10px;
}
each(@themes, {
:global(#container.@{value}) {