update:新增ota
This commit is contained in:
@@ -24,6 +24,10 @@ const props = defineProps({
|
||||
type: Number,
|
||||
default: 40,
|
||||
},
|
||||
phase: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
// 副标题:如“新版本将优化智能弓体验”
|
||||
description: {
|
||||
type: String,
|
||||
@@ -48,6 +52,14 @@ const isSuccess = computed(() => props.state === "update_success");
|
||||
const isFailure = computed(() => props.state === "update_failure");
|
||||
// Clamp progress to keep the progress bar width within its container.
|
||||
const progressValue = computed(() => Math.min(100, Math.max(0, Number(props.progress) || 0)));
|
||||
const progressPhaseText = computed(() => {
|
||||
const phaseText = {
|
||||
started: "正在准备固件更新",
|
||||
downloading: "正在下载固件",
|
||||
installing: "正在安装固件",
|
||||
};
|
||||
return phaseText[props.phase] || "正在进行固件更新";
|
||||
});
|
||||
|
||||
// 点击立即更新前先校验设备在线状态。
|
||||
const handleUpdateClick = () => {
|
||||
@@ -127,10 +139,10 @@ const handleUpdateClick = () => {
|
||||
<!-- 更新成功:图片左边距 34rpx,文案左边距 44rpx,按钮浮动底部居中 -->
|
||||
<block v-else-if="isSuccess">
|
||||
<image src="https://static.shelingxingqiu.com/shootmini/static/ota/update-ok.png" mode="aspectFit" class="result-title-img" style="width: 220rpx; height: 62rpx;" />
|
||||
<text class="dialog-desc">请关机并重启智能弓</text>
|
||||
<text class="dialog-desc">固件更新已完成</text>
|
||||
<view class="btn-group-result">
|
||||
<view class="primary-btn" @click="emit('done')">
|
||||
<text class="primary-btn-text">完成</text>
|
||||
<text class="primary-btn-text">关闭</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
@@ -139,6 +151,10 @@ const handleUpdateClick = () => {
|
||||
<block v-else-if="isProgress">
|
||||
<image src="https://static.shelingxingqiu.com/shootmini/static/ota/update_progress.png" mode="aspectFit" class="result-title-img" style="width: 220rpx; height: 62rpx;" />
|
||||
<view class="progress-wrap">
|
||||
<view class="progress-meta">
|
||||
<text class="progress-phase">{{ progressPhaseText }}</text>
|
||||
<text class="progress-value">{{ Math.floor(progressValue) }}%</text>
|
||||
</view>
|
||||
<view class="progress-track">
|
||||
<view class="progress-fill" :style="{ width: `${progressValue}%` }"></view>
|
||||
</view>
|
||||
@@ -391,9 +407,26 @@ const handleUpdateClick = () => {
|
||||
}
|
||||
.progress-wrap {
|
||||
width: 394rpx;
|
||||
margin-top: 40rpx;
|
||||
margin-top: 28rpx;
|
||||
margin-left: 44rpx;
|
||||
}
|
||||
.progress-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16rpx;
|
||||
color: #ffffff;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
.progress-phase {
|
||||
flex: 1;
|
||||
}
|
||||
.progress-value {
|
||||
flex-shrink: 0;
|
||||
margin-left: 16rpx;
|
||||
color: #fed847;
|
||||
}
|
||||
.progress-track {
|
||||
width: 100%;
|
||||
height: 18rpx;
|
||||
|
||||
Reference in New Issue
Block a user