861 lines
23 KiB
Vue
861 lines
23 KiB
Vue
<template>
|
||
<view class="mask flex-center" v-if="shown">
|
||
<view class="content botton-radius">
|
||
<view class="content-top">
|
||
<text class="content-top-text">{{ title }}</text>
|
||
<image
|
||
class="content-top"
|
||
style="top: 0"
|
||
width="100%"
|
||
height="100%"
|
||
src="/uni_modules/uni-upgrade-center-app/static/app/bg_top.png"
|
||
></image>
|
||
</view>
|
||
<view class="content-header"></view>
|
||
<view class="content-body">
|
||
<view class="title">
|
||
<text>{{ subTitle }}</text>
|
||
<text class="content-body-version">{{ version }}</text>
|
||
</view>
|
||
<view class="body">
|
||
<scroll-view class="box-des-scroll" scroll-y="true">
|
||
<text class="box-des">
|
||
{{ contents }}
|
||
</text>
|
||
</scroll-view>
|
||
</view>
|
||
<view class="footer flex-center">
|
||
<template v-if="isApplicationStore">
|
||
<button
|
||
class="content-button"
|
||
style="border: none; color: #fff"
|
||
plain
|
||
@click="jumpToApplicationStore"
|
||
>
|
||
{{ downLoadBtnTextiOS }}
|
||
</button>
|
||
</template>
|
||
<template v-else>
|
||
<template v-if="!downloadSuccess">
|
||
<view class="progress-box flex-column" v-if="downloading">
|
||
<!-- 已知总大小:显示进度条 -->
|
||
<block v-if="!packageSizeUnknown">
|
||
<progress
|
||
class="progress"
|
||
:percent="downLoadPercent"
|
||
activeColor="#3DA7FF"
|
||
show-info
|
||
stroke-width="10"
|
||
/>
|
||
<view
|
||
style="
|
||
width: 100%;
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
"
|
||
>
|
||
<text>{{ downLoadingText }}</text>
|
||
<text>({{ downloadedSize }}/{{ packageFileSize }}M)</text>
|
||
</view>
|
||
</block>
|
||
<!-- 未知总大小:只显示已下载大小 -->
|
||
<block v-else>
|
||
<view
|
||
style="
|
||
width: 100%;
|
||
font-size: 28rpx;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
"
|
||
>
|
||
<text>{{ downLoadingText }}</text>
|
||
<text>已下载 {{ downloadedSize }}M</text>
|
||
</view>
|
||
</block>
|
||
<!-- 调试:显示 onProgressUpdate 原始数据 -->
|
||
<view style="width: 100%; margin-top: 10rpx; position: relative;">
|
||
<!-- <text
|
||
selectable
|
||
style="
|
||
width: 100%;
|
||
font-size: 20rpx;
|
||
color: #999;
|
||
word-break: break-all;
|
||
padding-right: 100rpx;
|
||
"
|
||
>{{ debugInfo }}
|
||
</text> -->
|
||
<text
|
||
v-if="debugInfo"
|
||
@click="copyDebugInfo"
|
||
style="
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
font-size: 20rpx;
|
||
color: #3DA7FF;
|
||
padding: 2rpx 10rpx;
|
||
border: 1rpx solid #3DA7FF;
|
||
border-radius: 6rpx;
|
||
"
|
||
>复制</text>
|
||
</view>
|
||
</view>
|
||
|
||
<button
|
||
v-else
|
||
class="content-button"
|
||
style="border: none; color: #fff"
|
||
plain
|
||
@click="updateApp"
|
||
>
|
||
{{ downLoadBtnText }}
|
||
</button>
|
||
</template>
|
||
<button
|
||
v-else-if="downloadSuccess && !installed"
|
||
class="content-button"
|
||
style="border: none; color: #fff"
|
||
plain
|
||
:loading="installing"
|
||
:disabled="installing"
|
||
@click="installPackage"
|
||
>
|
||
{{ installing ? "正在安装……" : "下载完成,立即安装" }}
|
||
</button>
|
||
<button
|
||
v-else-if="installed && !isWGT"
|
||
class="content-button"
|
||
style="border: none; color: #fff"
|
||
plain
|
||
:loading="installing"
|
||
:disabled="installing"
|
||
@click="installPackage"
|
||
>
|
||
安装未完成,点击安装
|
||
</button>
|
||
|
||
<button
|
||
v-else-if="installed && isWGT"
|
||
class="content-button"
|
||
style="border: none; color: #fff"
|
||
plain
|
||
@click="restart"
|
||
>
|
||
安装完毕,点击重启
|
||
</button>
|
||
</template>
|
||
</view>
|
||
</view>
|
||
|
||
<image
|
||
v-if="!is_mandatory"
|
||
class="close-img"
|
||
src="/uni_modules/uni-upgrade-center-app/static/app/app_update_close.png"
|
||
@click.stop="closeUpdate"
|
||
></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
// #ifdef APP-PLUS
|
||
import {
|
||
createNotificationProgress,
|
||
cancelNotificationProgress,
|
||
finishNotificationProgress,
|
||
} from "@/uni_modules/uts-progressNotification";
|
||
// #endif
|
||
import {
|
||
compare,
|
||
platform_iOS,
|
||
platform_Android,
|
||
platform_Harmony,
|
||
} from "../utils/utils";
|
||
const localFilePathKey = "UNI_ADMIN_UPGRADE_CENTER_LOCAL_FILE_PATH";
|
||
|
||
let downloadTask = null;
|
||
let openSchemePromise;
|
||
|
||
export default {
|
||
emits: ["close", "show"],
|
||
data() {
|
||
return {
|
||
// 从之前下载安装
|
||
installForBeforeFilePath: "",
|
||
|
||
// 安装
|
||
installed: false,
|
||
installing: false,
|
||
|
||
// 下载
|
||
downloadSuccess: false,
|
||
downloading: false,
|
||
|
||
downLoadPercent: 0,
|
||
downloadedSize: 0,
|
||
packageFileSize: 0,
|
||
packageSizeUnknown: true, // 服务器未返回 Content-Length 时总大小未知
|
||
debugInfo: "", // 调试:显示 onProgressUpdate 原始数据
|
||
|
||
tempFilePath: "", // 要安装的本地包地址
|
||
|
||
// 默认安装包信息
|
||
title: "更新日志",
|
||
contents: "",
|
||
version: "",
|
||
is_mandatory: false,
|
||
url: "",
|
||
platform: [],
|
||
store_list: null,
|
||
|
||
// 可自定义属性
|
||
subTitle: "发现新版本",
|
||
downLoadBtnTextiOS: "立即跳转更新",
|
||
downLoadBtnText: "立即下载更新",
|
||
downLoadingText: "安装包下载中,请稍后",
|
||
|
||
// #ifdef APP-PLUS
|
||
shown: true,
|
||
// #endif
|
||
// #ifdef APP-HARMONY
|
||
shown: false,
|
||
// #endif
|
||
};
|
||
},
|
||
onLoad({ local_storage_key }) {
|
||
if (!local_storage_key) {
|
||
console.error("local_storage_key为空,请检查后重试");
|
||
uni.navigateBack();
|
||
return;
|
||
}
|
||
|
||
const localPackageInfo = uni.getStorageSync(local_storage_key);
|
||
if (!localPackageInfo) {
|
||
console.error("安装包信息为空,请检查后重试");
|
||
uni.navigateBack();
|
||
return;
|
||
}
|
||
|
||
this.setLocalPackageInfo(localPackageInfo);
|
||
},
|
||
onBackPress() {
|
||
// 强制更新不允许返回
|
||
if (this.is_mandatory) return true;
|
||
// 下载中:询问是否取消下载
|
||
if (this.downloading) {
|
||
this.askAbortDownload();
|
||
return true;
|
||
}
|
||
// 下载完成未安装:保存文件后允许返回
|
||
if (this.downloadSuccess && this.tempFilePath) {
|
||
this.saveFile(this.tempFilePath, this.version);
|
||
}
|
||
},
|
||
onHide() {
|
||
openSchemePromise = null;
|
||
},
|
||
computed: {
|
||
isWGT() {
|
||
return this.type === "wgt";
|
||
},
|
||
isNativeApp() {
|
||
return this.type === "native_app";
|
||
},
|
||
isiOS() {
|
||
return this.platform.indexOf(platform_iOS) !== -1;
|
||
},
|
||
isAndroid() {
|
||
return this.platform.indexOf(platform_Android) !== -1;
|
||
},
|
||
isHarmony() {
|
||
return this.platform.indexOf(platform_Harmony) !== -1;
|
||
},
|
||
isApplicationStore() {
|
||
return !this.isWGT && this.isNativeApp && (this.isiOS || this.isHarmony);
|
||
// return this.isiOS || (!this.isiOS && !this.isWGT && this.url.indexOf('.apk') === -1);
|
||
},
|
||
needNotificationProgress() {
|
||
return (
|
||
this.platform.indexOf(platform_iOS) === -1 &&
|
||
!this.is_mandatory &&
|
||
!this.isHarmony
|
||
);
|
||
},
|
||
},
|
||
methods: {
|
||
show(shown, localPackageInfo) {
|
||
// #ifdef APP-HARMONY
|
||
this.$emit("show");
|
||
if (localPackageInfo) {
|
||
this.shown = shown;
|
||
this.setLocalPackageInfo(localPackageInfo);
|
||
} else {
|
||
console.error(`安装包信息为空,请检查后重试`);
|
||
}
|
||
// #endif
|
||
},
|
||
setLocalPackageInfo(localPackageInfo) {
|
||
const requiredKey = ["version", "url", "type"];
|
||
for (let key in localPackageInfo) {
|
||
if (requiredKey.indexOf(key) !== -1 && !localPackageInfo[key]) {
|
||
console.error(`参数 ${key} 必填,请检查后重试`);
|
||
// #ifdef APP-PLUS
|
||
uni.navigateBack();
|
||
// #endif
|
||
// #ifdef APP-HARMONY
|
||
this.shown = false;
|
||
// #endif
|
||
return;
|
||
}
|
||
}
|
||
|
||
Object.assign(this, localPackageInfo);
|
||
this.checkLocalStoragePackage();
|
||
},
|
||
checkLocalStoragePackage() {
|
||
// 如果已经有下载好的包,则直接提示安装
|
||
const localFilePathRecord = uni.getStorageSync(localFilePathKey);
|
||
if (localFilePathRecord) {
|
||
const { version, savedFilePath, installed } = localFilePathRecord;
|
||
|
||
// 比对版本
|
||
if (!installed && compare(version, this.version) === 0) {
|
||
this.downloadSuccess = true;
|
||
this.installForBeforeFilePath = savedFilePath;
|
||
this.tempFilePath = savedFilePath;
|
||
} else {
|
||
// 如果保存的包版本小 或 已安装过,则直接删除
|
||
this.deleteSavedFile(savedFilePath);
|
||
}
|
||
}
|
||
},
|
||
askAbortDownload() {
|
||
uni.showModal({
|
||
title: "是否取消下载?",
|
||
cancelText: "否",
|
||
confirmText: "是",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
downloadTask && downloadTask.abort();
|
||
if (this.needNotificationProgress) {
|
||
cancelNotificationProgress();
|
||
}
|
||
uni.navigateBack();
|
||
}
|
||
},
|
||
});
|
||
},
|
||
async closeUpdate() {
|
||
if (this.downloading) {
|
||
if (this.is_mandatory) {
|
||
return uni.showToast({
|
||
title: "下载中,请稍后……",
|
||
icon: "none",
|
||
duration: 500,
|
||
});
|
||
}
|
||
// 非强制更新:询问是否取消下载
|
||
this.askAbortDownload();
|
||
return;
|
||
}
|
||
|
||
if (this.downloadSuccess && this.tempFilePath) {
|
||
// 包已经下载完毕,稍后安装,将包保存在本地
|
||
await this.saveFile(this.tempFilePath, this.version);
|
||
}
|
||
|
||
// #ifdef APP-PLUS
|
||
uni.navigateBack();
|
||
// #endif
|
||
// #ifdef APP-HARMONY
|
||
this.shown = false;
|
||
this.$emit("close");
|
||
// #endif
|
||
},
|
||
updateApp() {
|
||
this.checkStoreScheme()
|
||
.catch(() => {
|
||
this.downloadPackage();
|
||
})
|
||
.finally(() => {
|
||
openSchemePromise = null;
|
||
});
|
||
},
|
||
// 跳转应用商店
|
||
checkStoreScheme() {
|
||
const storeList = (this.store_list || []).filter((item) => item.enable);
|
||
if (storeList && storeList.length) {
|
||
storeList
|
||
.sort((cur, next) => next.priority - cur.priority)
|
||
.map((item) => item.scheme)
|
||
.reduce((promise, cur, curIndex) => {
|
||
openSchemePromise = (promise || (promise = Promise.reject())).catch(
|
||
() => {
|
||
return new Promise((resolve, reject) => {
|
||
plus.runtime.openURL(cur, (err) => {
|
||
reject(err);
|
||
});
|
||
});
|
||
},
|
||
);
|
||
return openSchemePromise;
|
||
}, openSchemePromise);
|
||
return openSchemePromise;
|
||
}
|
||
|
||
return Promise.reject();
|
||
},
|
||
downloadPackage() {
|
||
this.downloading = true;
|
||
this.packageSizeUnknown = true;
|
||
console.log("[UPGRADE] 下载链接:", this.url);
|
||
|
||
// #ifdef APP-PLUS
|
||
// Android 上 uni.downloadFile 的 onProgressUpdate 可能不触发
|
||
// 改用 plus.downloader,statechanged 事件更可靠
|
||
const suffix = this.isWGT ? ".wgt" : ".apk";
|
||
const fileName = `_downloads/upgrade_${Date.now()}${suffix}`;
|
||
downloadTask = plus.downloader.createDownload(
|
||
this.url,
|
||
{ filename: fileName },
|
||
(d, status) => {
|
||
if (status === 200) {
|
||
this.tempFilePath = d.filename;
|
||
this.downLoadComplete();
|
||
} else {
|
||
console.log("下载失败,HTTP status:", status);
|
||
this.downloadFail();
|
||
}
|
||
},
|
||
);
|
||
downloadTask.addEventListener("statechanged", (d, status) => {
|
||
this.debugInfo = JSON.stringify({ d });
|
||
if (d.state === 3) {
|
||
// 下载中
|
||
if (d.totalSize > 0) {
|
||
this.packageSizeUnknown = false;
|
||
this.downLoadPercent = Math.round(
|
||
(d.downloadedSize / d.totalSize) * 100,
|
||
);
|
||
this.packageFileSize = (d.totalSize / Math.pow(1024, 2)).toFixed(2);
|
||
}
|
||
this.downloadedSize = (d.downloadedSize / Math.pow(1024, 2)).toFixed(
|
||
2,
|
||
);
|
||
if (this.needNotificationProgress && !this.downloadSuccess) {
|
||
createNotificationProgress({
|
||
title: "升级中心正在下载安装包……",
|
||
content: `${this.downLoadPercent}%`,
|
||
progress: this.downLoadPercent,
|
||
onClick: () => {
|
||
this.askAbortDownload();
|
||
},
|
||
});
|
||
}
|
||
} else if (d.state === 5) {
|
||
// 下载出错
|
||
console.log("下载出错,state:", d.state);
|
||
this.downloadFail();
|
||
}
|
||
});
|
||
downloadTask.start();
|
||
// #endif
|
||
|
||
// #ifndef APP-PLUS
|
||
// 其他平台保持原有 uni.downloadFile
|
||
downloadTask = uni.downloadFile({
|
||
url: this.url,
|
||
success: (res) => {
|
||
if (res.statusCode == 200) {
|
||
if (
|
||
this.isWGT &&
|
||
res.tempFilePath.split(".").slice(-1)[0] !== "wgt"
|
||
) {
|
||
const failCallback = (e) => {
|
||
console.log("[FILE RENAME FAIL]:", JSON.stringify(e));
|
||
};
|
||
plus.io.resolveLocalFileSystemURL(
|
||
res.tempFilePath,
|
||
(entry) => {
|
||
entry.getParent((parent) => {
|
||
const newName = `new_wgt_${Date.now()}.wgt`;
|
||
entry.copyTo(
|
||
parent,
|
||
newName,
|
||
(res) => {
|
||
this.tempFilePath = res.fullPath;
|
||
this.downLoadComplete();
|
||
},
|
||
failCallback,
|
||
);
|
||
}, failCallback);
|
||
},
|
||
failCallback,
|
||
);
|
||
} else {
|
||
this.tempFilePath = res.tempFilePath;
|
||
this.downLoadComplete();
|
||
}
|
||
} else {
|
||
console.log("下载错误:" + JSON.stringify(res));
|
||
this.downloadFail();
|
||
}
|
||
},
|
||
fail: (err) => {
|
||
console.log("下载错误:" + JSON.stringify(err));
|
||
this.downloadFail();
|
||
},
|
||
});
|
||
|
||
downloadTask.onProgressUpdate((res) => {
|
||
this.debugInfo = JSON.stringify(res);
|
||
if (res.totalBytesExpectedToWrite > 0) {
|
||
this.packageSizeUnknown = false;
|
||
this.downLoadPercent = Math.round(
|
||
(res.totalBytesWritten / res.totalBytesExpectedToWrite) * 100,
|
||
);
|
||
} else {
|
||
this.downLoadPercent = res.progress;
|
||
}
|
||
this.downloadedSize = (
|
||
res.totalBytesWritten / Math.pow(1024, 2)
|
||
).toFixed(2);
|
||
this.packageFileSize = (
|
||
res.totalBytesExpectedToWrite / Math.pow(1024, 2)
|
||
).toFixed(2);
|
||
|
||
if (this.needNotificationProgress && !this.downloadSuccess) {
|
||
createNotificationProgress({
|
||
title: "升级中心正在下载安装包……",
|
||
content: `${this.downLoadPercent}%`,
|
||
progress: this.downLoadPercent,
|
||
onClick: () => {
|
||
this.askAbortDownload();
|
||
},
|
||
});
|
||
}
|
||
});
|
||
// #endif
|
||
// if (this.needNotificationProgress) {
|
||
// uni.navigateBack();
|
||
// }
|
||
},
|
||
downloadFail() {
|
||
const errMsg = "下载失败,请点击重试";
|
||
|
||
this.downloadSuccess = false;
|
||
this.downloading = false;
|
||
|
||
this.downLoadPercent = 0;
|
||
this.downloadedSize = 0;
|
||
this.packageFileSize = 0;
|
||
this.packageSizeUnknown = true;
|
||
|
||
this.downLoadBtnText = errMsg;
|
||
|
||
downloadTask = null;
|
||
|
||
if (this.needNotificationProgress) {
|
||
finishNotificationProgress({
|
||
title: "升级包下载失败",
|
||
content: "请重新检查更新",
|
||
onClick: () => {},
|
||
});
|
||
}
|
||
},
|
||
downLoadComplete() {
|
||
this.downloadSuccess = true;
|
||
this.downloading = false;
|
||
|
||
this.downLoadPercent = 0;
|
||
this.downloadedSize = 0;
|
||
this.packageFileSize = 0;
|
||
|
||
downloadTask = null;
|
||
|
||
// 清理通知栏进度通知
|
||
if (this.needNotificationProgress) {
|
||
finishNotificationProgress({
|
||
title: "升级包下载完成",
|
||
content: "点击安装",
|
||
onClick: () => {},
|
||
});
|
||
}
|
||
|
||
// 强制更新,直接安装
|
||
if (this.is_mandatory) {
|
||
this.installPackage();
|
||
}
|
||
},
|
||
installPackage() {
|
||
// #ifdef APP-PLUS || APP-HARMONY
|
||
// wgt资源包安装
|
||
if (this.isWGT) {
|
||
this.installing = true;
|
||
}
|
||
plus.runtime.install(
|
||
this.tempFilePath,
|
||
{
|
||
force: false,
|
||
},
|
||
async (res) => {
|
||
this.installing = false;
|
||
this.installed = true;
|
||
|
||
// wgt包,安装后会提示 安装成功,是否重启
|
||
if (this.isWGT) {
|
||
// 强制更新安装完成重启
|
||
if (this.is_mandatory) {
|
||
// #ifdef APP-PLUS
|
||
// uni.showLoading({
|
||
// icon: "none",
|
||
// title: "安装成功,正在重启……",
|
||
// });
|
||
// #endif
|
||
|
||
setTimeout(() => {
|
||
// #ifdef APP-PLUS
|
||
uni.hideLoading();
|
||
// #endif
|
||
this.restart();
|
||
}, 1000);
|
||
}
|
||
} else {
|
||
const localFilePathRecord = uni.getStorageSync(localFilePathKey);
|
||
uni.setStorageSync(localFilePathKey, {
|
||
...localFilePathRecord,
|
||
installed: true,
|
||
});
|
||
}
|
||
},
|
||
async (err) => {
|
||
// 如果是安装之前的包,安装失败后删除之前的包
|
||
if (this.installForBeforeFilePath) {
|
||
await this.deleteSavedFile(this.installForBeforeFilePath);
|
||
this.installForBeforeFilePath = "";
|
||
}
|
||
|
||
// 安装失败需要重新下载安装包
|
||
this.installing = false;
|
||
this.installed = false;
|
||
|
||
// uni.showModal({
|
||
// title: "更新失败,请重新下载",
|
||
// content: err.message,
|
||
// showCancel: false,
|
||
// });
|
||
},
|
||
);
|
||
|
||
// 非wgt包,安装跳出覆盖安装,此处直接返回上一页
|
||
if (!this.isWGT && !this.is_mandatory) {
|
||
uni.navigateBack();
|
||
}
|
||
// #endif
|
||
},
|
||
restart() {
|
||
this.installed = false;
|
||
// #ifdef APP-HARMONY
|
||
uni.showModal({
|
||
title: "更新完毕",
|
||
content: "请手动重启",
|
||
showCancel: false,
|
||
success(res) {
|
||
plus.runtime.quit();
|
||
},
|
||
});
|
||
// #endif
|
||
// #ifdef APP-PLUS
|
||
//更新完重启app
|
||
plus.runtime.restart();
|
||
// #endif
|
||
},
|
||
saveFile(tempFilePath, version) {
|
||
return new Promise((resolve, reject) => {
|
||
uni.saveFile({
|
||
tempFilePath,
|
||
success({ savedFilePath }) {
|
||
uni.setStorageSync(localFilePathKey, {
|
||
version,
|
||
savedFilePath,
|
||
});
|
||
},
|
||
complete() {
|
||
resolve();
|
||
},
|
||
});
|
||
});
|
||
},
|
||
deleteSavedFile(filePath) {
|
||
uni.removeStorageSync(localFilePathKey);
|
||
return uni.removeSavedFile({
|
||
filePath,
|
||
});
|
||
},
|
||
copyDebugInfo() {
|
||
uni.setClipboardData({
|
||
data: this.debugInfo,
|
||
success() {
|
||
uni.showToast({ title: "已复制", icon: "success", duration: 1500 });
|
||
},
|
||
});
|
||
},
|
||
jumpToApplicationStore() {
|
||
plus.runtime.openURL(this.url);
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
page {
|
||
background: transparent;
|
||
}
|
||
|
||
.flex-center {
|
||
/* #ifndef APP-NVUE */
|
||
display: flex;
|
||
/* #endif */
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.mask {
|
||
position: fixed;
|
||
left: 0;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background-color: rgba(0, 0, 0, 0.65);
|
||
}
|
||
|
||
.botton-radius {
|
||
border-bottom-left-radius: 30rpx;
|
||
border-bottom-right-radius: 30rpx;
|
||
}
|
||
|
||
.content {
|
||
position: relative;
|
||
top: 0;
|
||
width: 600rpx;
|
||
background-color: #fff;
|
||
box-sizing: border-box;
|
||
padding: 0 50rpx;
|
||
font-family: Source Han Sans CN;
|
||
}
|
||
|
||
.text {
|
||
/* #ifndef APP-NVUE */
|
||
display: block;
|
||
/* #endif */
|
||
line-height: 200px;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.content-top {
|
||
position: absolute;
|
||
top: -195rpx;
|
||
left: 0;
|
||
width: 600rpx;
|
||
height: 270rpx;
|
||
}
|
||
|
||
.content-top-text {
|
||
font-size: 45rpx;
|
||
font-weight: bold;
|
||
color: #f8f8fa;
|
||
position: absolute;
|
||
top: 120rpx;
|
||
left: 50rpx;
|
||
z-index: 1;
|
||
}
|
||
|
||
.content-header {
|
||
height: 70rpx;
|
||
}
|
||
|
||
.title {
|
||
font-size: 33rpx;
|
||
font-weight: bold;
|
||
color: #3da7ff;
|
||
line-height: 38px;
|
||
}
|
||
|
||
.content-body {
|
||
width: 100%;
|
||
}
|
||
|
||
.content-body-version {
|
||
padding-left: 20rpx;
|
||
color: #fff;
|
||
font-size: 20rpx;
|
||
margin-left: 10rpx;
|
||
padding: 4rpx 8rpx;
|
||
border-radius: 20rpx;
|
||
background: #50aefd;
|
||
}
|
||
|
||
.footer {
|
||
height: 150rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
}
|
||
|
||
.box-des-scroll {
|
||
box-sizing: border-box;
|
||
padding: 0 40rpx;
|
||
height: 200rpx;
|
||
text-align: left;
|
||
}
|
||
|
||
.box-des {
|
||
font-size: 26rpx;
|
||
color: #000000;
|
||
line-height: 50rpx;
|
||
}
|
||
|
||
.progress-box {
|
||
width: 100%;
|
||
}
|
||
|
||
.progress {
|
||
width: 90%;
|
||
height: 40rpx;
|
||
/* border-radius: 35px; */
|
||
}
|
||
|
||
.close-img {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
z-index: 1000;
|
||
position: absolute;
|
||
bottom: -120rpx;
|
||
left: calc(50% - 70rpx / 2);
|
||
}
|
||
|
||
.content-button {
|
||
text-align: center;
|
||
flex: 1;
|
||
font-size: 30rpx;
|
||
font-weight: 400;
|
||
color: #ffffff;
|
||
border-radius: 40rpx;
|
||
margin: 0 18rpx;
|
||
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
|
||
background: linear-gradient(to right, #1785ff, #3da7ff);
|
||
}
|
||
|
||
.flex-column {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
}
|
||
</style>
|