ion/Melo
1
0
Fork 0
Code Issues Pull Requests Actions 11 Packages Projects Releases Wiki Activity

优化版本更新操作

Browse Source
This commit is contained in:
lyswhut
2023-01-31 17:48:38 +08:00
parent c24b29a42c
commit 6b69cdf12f
22 changed files with 553 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/layout/ChangeLogModal.vue
+200
View File
@@ -0,0 +1,200 @@
<template lang="pug">
material-modal(:show="isShowChangeLog" @close="isShowChangeLog = false" max-width="60%")
main(:class="$style.main")
h2 当前版本更新日志
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 当前版本：{{versionInfo.version}}
template(v-if="info.desc")
h3 版本变化：
pre(:class="$style.desc" v-text="info.desc")
div(:class="[$style.history, $style.desc]" v-if="info.history.length")
h3 历史版本：
div(:class="$style.item" v-for="ver in info.history")
h4 v{{ver.version}}
pre(v-text="ver.desc")
div(:class="$style.footer")
div(:class="$style.desc")
p 📢&nbsp;为了减少疑问，我们墙裂建议阅读版本更新日志来了解当前所用版本的变化！
p 📢&nbsp;若遇到问题可以去设置-关于查看常见问题
p(v-if="!info.isLatest") 🚀&nbsp;发现新版本（v{{versionInfo.newVersion.version}}），建议 去设置-软件更新 更新新版本
</template>
<script>
import { compareVer } from '@common/utils'
import { versionInfo, isShowChangeLog } from '@renderer/store'
import { getLastStartInfo } from '@renderer/utils/ipc'
import { computed, ref } from '@common/utils/vueTools'
export default {
setup() {
const lastStartVersion = ref(null)
getLastStartInfo().then(version => {
lastStartVersion.value = version
})
const info = computed(() => {
let currentVer = process.versions.app
let lastStartVer = lastStartVersion.value
let info = {
version: '',
desc: '',
history: [],
isLatest: true,
}
if (!versionInfo.newVersion || !versionInfo.newVersion?.history) return info
info.isLatest = compareVer(currentVer, versionInfo.newVersion.version) >= 0
for (const ver of versionInfo.newVersion.history) {
switch (compareVer(ver.version, currentVer)) {
case 0:
info.version = ver.version
info.desc = ver.desc
break
case -1:
if (lastStartVer && compareVer(lastStartVer, ver.version) < 0) info.history.push(ver)
}
}
if (!info.version) {
if (currentVer == versionInfo.newVersion.version) {
info.version = versionInfo.newVersion.version
info.desc = versionInfo.newVersion.desc
}
}
return info
})
return {
versionInfo,
info,
isShowChangeLog,
}
},
}
</script>
<style lang="less" module>
@import '@renderer/assets/styles/layout.less';
.main {
position: relative;
padding: 15px 0;
// max-width: 450px;
min-width: 300px;
display: flex;
flex-flow: column nowrap;
justify-content: center;
overflow: hidden;
// overflow-y: auto;
* {
box-sizing: border-box;
}
h2 {
flex: 0 0 none;
font-size: 16px;
color: var(--color-font);
line-height: 1.3;
text-align: center;
margin-bottom: 15px;
}
h3 {
font-size: 14px;
line-height: 1.3;
}
pre {
white-space: pre-wrap;
text-align: justify;
margin-top: 10px;
}
}
.info {
flex: 1 1 auto;
font-size: 14px;
line-height: 1.5;
overflow-y: auto;
height: 100%;
padding: 0 15px;
}
.current {
> p {
padding-left: 15px;
}
}
.desc {
h3, h4 {
font-weight: bold;
}
h3 {
padding: 5px 0 3px;
}
ul {
list-style: initial;
padding-inline-start: 30px;
}
p {
font-size: 14px;
line-height: 1.5;
}
}
.history {
h3 {
padding-top: 15px;
}
.item {
h3 {
padding: 5px 0 3px;
}
padding: 0 15px;
+ .item {
padding-top: 15px;
}
h4 {
font-weight: 700;
}
> p {
padding-left: 15px;
}
}
}
.footer {
flex: 0 0 none;
padding: 0 15px;
.desc {
padding-top: 20px;
font-size: 13px;
color: var(--color-primary-font);
line-height: 1.25;
p {
font-size: 13px;
color: var(--color-primary-font);
line-height: 1.25;
}
}
}
// .btns {
// display: flex;
// flex-flow: row nowrap;
// gap: 15px;
// }
// .btn {
// margin-top: 10px;
// display: block;
// width: 100%;
// }
// .btn2 {
// margin-top: 10px;
// display: block;
// width: 50%;
// }
</style>
src/renderer/components/layout/VersionModal.vue → src/renderer/components/layout/UpdateModal.vue
+113 -95
View File
@@ -1,6 +1,40 @@
<template lang="pug">
material-modal(:show="versionInfo.showModal" @close="handleClose")
main(:class="$style.main" v-if="versionInfo.isDownloaded")
material-modal(:show="versionInfo.showModal" @close="handleClose" max-width="60%")
main(:class="$style.main" v-if="versionInfo.isLatest")
h2 🎉 已是最新版本 🎉
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 最新版本：{{versionInfo.newVersion?.version}}
h3 当前版本：{{versionInfo.version}}
h3 版本变化：
pre(:class="$style.desc" v-text="versionInfo.newVersion?.desc")
div(:class="$style.footer")
div(:class="$style.btns")
base-btn(v-if="versionInfo.status == 'checking'" :class="$style.btn" disabled) 检查更新中...
base-btn(v-else :class="$style.btn" @click="handleCheckUpdate") 重新检查更新
main(:class="$style.main" v-else-if="versionInfo.isUnknown")
h2 ❓ 获取最新版本信息失败 ❓
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 当前版本：{{versionInfo.version}}
div(:class="$style.desc")
p 更新信息获取失败，可能是无法访问Github导致的，请手动检查更新！
p
| 检查方法：打开
base-btn(min @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" aria-label="点击打开") 软件发布页
| 或
base-btn(min @click="handleOpenUrl('https://www.lanzoui.com/b0bf2cfa/')" aria-label="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" aria-label="点击复制") glqw
| )查看它们的
strong 版本号
| 与当前版本({{versionInfo.version}})对比是否一样，
p 若一样则不必理会该弹窗，直接关闭即可，否则请手动下载新版本更新。
div(:class="$style.footer")
div(:class="$style.btns")
base-btn(v-if="versionInfo.status == 'error'" :class="$style.btn" @click="handleCheckUpdate") 重新检查更新
base-btn(v-else :class="$style.btn" disabled) 检查更新中...
main(:class="$style.main" v-else-if="versionInfo.status == 'downloaded'")
h2 🚀程序更新🚀
div.scroll.select(:class="$style.info")
@@ -23,77 +57,10 @@ material-modal(:show="versionInfo.showModal" @close="handleClose")
| 或稍后
strong 关闭程序时
| 自动更新~
base-btn(:class="$style.btn" @click.onec="handleRestartClick") 立即重启更新
main(:class="$style.main" v-else-if="versionInfo.isError && !versionInfo.isUnknow && versionInfo.newVersion?.version != versionInfo.version")
h2 ❌ 版本更新出错 ❌
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 最新版本：{{versionInfo.newVersion?.version}}
h3 当前版本：{{versionInfo.version}}
h3 版本变化：
pre(:class="$style.desc" v-text="versionInfo.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}}
pre(v-text="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')" aria-label="点击打开") 软件发布页
| &nbsp;或&nbsp;
strong.hover.underline(@click="handleOpenUrl('https://www.lanzoui.com/b0bf2cfa/')" aria-label="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" aria-label="点击复制") glqw
| )&nbsp;下载新版本，
p
| 国内Windows/MAC用户推荐到
strong 网盘
| 下载。
base-btn(:class="$style.btn" @click.onec="handleIgnoreClick") {{ isIgnored ? '恢复当前版本的更新失败提醒' : '忽略当前版本的更新失败提醒'}}
main(:class="$style.main" v-else-if="versionInfo.isDownloading && versionInfo.isTimeOut && !versionInfo.isUnknow")
h2 ❗️ 新版本下载超时 ❗️
div(:class="$style.desc")
p 你当前所在网络访问GitHub较慢，导致新版本下载超时（已经下了半个钟了😳），你仍可选择继续等，但墙裂建议手动更新版本！
p
| 你可以去
base-btn(min @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" aria-label="点击打开") 软件发布页
| 或
base-btn(min @click="handleOpenUrl('https://www.lanzoui.com/b0bf2cfa/')" aria-label="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" aria-label="点击复制") glqw
| )下载新版本，
p
| 国内Windows/MAC用户推荐到
strong 网盘
| 下载。
p 当前下载进度：{{progress}}
main(:class="$style.main" v-else-if="versionInfo.isUnknow")
h2 ❓ 获取最新版本信息失败 ❓
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 当前版本：{{versionInfo.version}}
div(:class="$style.desc")
p 更新信息获取失败，可能是无法访问Github导致的，请手动检查更新！
p
| 检查方法：打开
base-btn(min @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" aria-label="点击打开") 软件发布页
| 或
base-btn(min @click="handleOpenUrl('https://www.lanzoui.com/b0bf2cfa/')" aria-label="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" aria-label="点击复制") glqw
| )查看它们的
strong 版本号
| 与当前版本({{versionInfo.version}})对比是否一样，
p 若一样则不必理会该弹窗，直接关闭即可，否则请手动下载新版本更新。
div(:class="$style.btns")
base-btn(:class="$style.btn" @click.onec="handleRestartClick") 立即重启更新
main(:class="$style.main" v-else)
h2 🌟发现新版本🌟
div.scroll.select(:class="$style.info")
div(:class="$style.current")
h3 最新版本：{{versionInfo.newVersion?.version}}
@@ -108,28 +75,30 @@ material-modal(:show="versionInfo.showModal" @close="handleClose")
div(:class="$style.footer")
div(:class="$style.desc")
p 发现有新版本啦，正在努力更新中，若下载太慢可以手动更新哦~
p
| 你也可以关闭本弹窗继续使用软件，还可在
strong 设置-软件更新
| 重新打开本弹窗。
p
| 手动更新可以去&nbsp;
p 发现有新版本啦，你可以尝试使用自动更新或手动更新，
p 手动更新可以去&nbsp;
strong.hover.underline(@click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop/releases')" aria-label="点击打开") 软件发布页
| &nbsp;或&nbsp;
strong.hover.underline(@click="handleOpenUrl('https://www.lanzoui.com/b0bf2cfa/')" aria-label="点击打开") 网盘
| (密码：
strong.hover(@click="handleCopy('glqw')" aria-label="点击复制") glqw
| )&nbsp;下载，
p 国内Windows/MAC用户推荐到网盘下载。
p 当前下载进度：{{progress}}
| )&nbsp;下载
p 注：国内Windows/MAC用户推荐到网盘下载，若遇到问题可以看
strong.hover.underline(@click="handleOpenUrl('https://lyswhut.github.io/lx-music-doc/desktop/faq')" aria-label="点击打开") 常见问题
p(v-if="progress") 当前下载进度：{{progress}}
p(v-else) &nbsp;
div(:class="$style.btns")
base-btn(:class="$style.btn2" @click="handleIgnoreClick") {{ isIgnored ? '取消忽略' : '忽略更新该版本'}}
base-btn(v-if="versionInfo.status == 'downloading'" :class="$style.btn2" disabled) 下载更新中...
base-btn(v-else :class="$style.btn2" @click="handleDonwloadClick") 下载更新
</template>
<script>
import { compareVer, sizeFormate } from '@common/utils'
import { openUrl, clipboardWriteText } from '@common/utils/electron'
import { dialog } from '@renderer/plugins/Dialog'
import { versionInfo } from '@renderer/store'
import { getIgnoreVersion, saveIgnoreVersion, quitUpdate } from '@renderer/utils/ipc'
import { getIgnoreVersion, saveIgnoreVersion, quitUpdate, downloadUpdate, checkUpdate } from '@renderer/utils/ipc'
export default {
setup() {
@@ -154,16 +123,20 @@ export default {
return arr
},
progress() {
return this.versionInfo.downloadProgress
? `${this.versionInfo.downloadProgress.percent.toFixed(2)}% - ${sizeFormate(this.versionInfo.downloadProgress.transferred)}/${sizeFormate(this.versionInfo.downloadProgress.total)} - ${sizeFormate(this.versionInfo.downloadProgress.bytesPerSecond)}/s`
: '处理更新中...'
return this.versionInfo.status == 'downloading'
? this.versionInfo.downloadProgress
? `${this.versionInfo.downloadProgress.percent.toFixed(2)}% - ${sizeFormate(this.versionInfo.downloadProgress.transferred)}/${sizeFormate(this.versionInfo.downloadProgress.total)} - ${sizeFormate(this.versionInfo.downloadProgress.bytesPerSecond)}/s`
: '处理更新中...'
: ''
},
isIgnored() {
return this.ignoreVersion == this.versionInfo.newVersion?.version
},
},
created() {
this.ignoreVersion = getIgnoreVersion()
getIgnoreVersion().then(version => {
this.ignoreVersion = version
})
},
methods: {
handleClose() {
@@ -180,9 +153,41 @@ export default {
handleCopy(text) {
clipboardWriteText(text)
},
handleIgnoreClick() {
saveIgnoreVersion(this.isIgnored ? null : this.versionInfo.newVersion?.version)
this.handleClose()
async handleIgnoreClick() {
if (this.isIgnored) {
saveIgnoreVersion(this.ignoreVersion = null)
return
}
if (this.history.length >= 2) {
if (await dialog.confirm({
message: window.i18n.t('update__ignore_tip', { num: this.history.length + 1 }),
cancelButtonText: window.i18n.t('update__ignore_cancel'),
confirmButtonText: window.i18n.t('update__ignore_confirm'),
})) {
setTimeout(() => {
dialog({
message: window.i18n.t('update__ignore_confirm_tip'),
confirmButtonText: window.i18n.t('update__ignore_confirm_tip_confirm'),
})
}, 500)
return
}
}
saveIgnoreVersion(this.ignoreVersion = this.versionInfo.newVersion?.version)
// saveIgnoreVersion(this.versionInfo.newVersion?.version)
// this.handleClose()
},
handleDonwloadClick() {
if (this.isIgnored) saveIgnoreVersion(this.ignoreVersion = null)
versionInfo.status = 'downloading'
downloadUpdate()
},
handleCheckUpdate() {
if (this.isIgnored) saveIgnoreVersion(this.ignoreVersion = null)
versionInfo.status = 'checking'
versionInfo.reCheck = true
checkUpdate()
},
},
}
@@ -194,8 +199,8 @@ export default {
.main {
position: relative;
padding: 15px;
max-width: 450px;
padding: 15px 0;
// max-width: 450px;
min-width: 300px;
display: flex;
flex-flow: column nowrap;
@@ -226,11 +231,11 @@ export default {
.info {
flex: 1 1 auto;
font-size: 13px;
font-size: 14px;
line-height: 1.5;
overflow-y: auto;
height: 100%;
padding-right: 5px;
padding: 0 15px;
}
.current {
> p {
@@ -279,23 +284,36 @@ export default {
}
.footer {
flex: 0 0 none;
padding: 0 15px;
.desc {
padding-top: 10px;
font-size: 12px;
font-size: 13px;
color: var(--color-primary-font);
line-height: 1.25;
p {
font-size: 12px;
font-size: 13px;
color: var(--color-primary-font);
line-height: 1.25;
}
}
}
.btns {
display: flex;
flex-flow: row nowrap;
gap: 15px;
}
.btn {
margin-top: 10px;
display: block;
width: 100%;
}
.btn2 {
margin-top: 10px;
display: block;
width: 50%;
}
</style>