更新:增加数据迁移功能
This commit is contained in:
154
pages/mine/migrate/index.vue
Normal file
154
pages/mine/migrate/index.vue
Normal file
@@ -0,0 +1,154 @@
|
|||||||
|
<template>
|
||||||
|
<view class="commonPage commonPageBox">
|
||||||
|
<public-module></public-module>
|
||||||
|
<z-nav-bar title="数据迁移" bgColor="#258feb" fontColor="#fff"></z-nav-bar>
|
||||||
|
<view class="migrate-tips">迁移后不可恢复,请谨慎操作!</view>
|
||||||
|
|
||||||
|
<view class="code-wrap">
|
||||||
|
<view class="account">账号:{{ userInfo.tel || userInfo.email}}</view>
|
||||||
|
<view v-if="code" class="code-box">
|
||||||
|
<view class="code-number">{{ code }}</view>
|
||||||
|
<view><text>{{ remaining }}</text>有效<text class="uni-link" @click="handleRefresh">(刷新)</text></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="migrate-intro">
|
||||||
|
<view class="migrate-intro-title">迁移说明</view>
|
||||||
|
<view>1. 请在吴门国际APP中完成数据迁移,操作方式【我的】-【数据迁移】-【输入账号和移验证码】。</view>
|
||||||
|
<view>2. 数据迁移完成后,本账号数据将被清空,已购买的天医币、积分、课程、VIP等数据将转移到新账号。</view>
|
||||||
|
<view>3. 迁移过程可能需要几分钟时间,请耐心等待。</view>
|
||||||
|
<view>4. 如遇到问题,请联系客服获取帮助。</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import $http from "@/config/requestConfig.js";
|
||||||
|
import { mapState } from "vuex";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
code: '',
|
||||||
|
remaining: '',
|
||||||
|
timer: null,
|
||||||
|
lastRefreshTime: 0, // 上次刷新时间戳
|
||||||
|
refreshCooldown: 10000 // 节流时间,3秒内只能刷新一次
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState(["userInfo"]),
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.countDown()
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 组件销毁前清除定时器
|
||||||
|
if (this.timer) clearInterval(this.timer);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getCode() {
|
||||||
|
this.$http
|
||||||
|
.post("common/user/getMigrationCode")
|
||||||
|
.then((res) => {
|
||||||
|
if (res.code == 0) {
|
||||||
|
this.code = res.migrationCode;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
console.log(e);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
async countDown() {
|
||||||
|
// 清除已有的定时器
|
||||||
|
if (this.timer) clearInterval(this.timer);
|
||||||
|
|
||||||
|
await this.getCode() // 获取验证码
|
||||||
|
|
||||||
|
// 初始化倒计时时间(3分钟 = 180秒)
|
||||||
|
let totalSeconds = 175;
|
||||||
|
|
||||||
|
// 立即更新第一次显示
|
||||||
|
this.updateRemainingTime(totalSeconds);
|
||||||
|
|
||||||
|
// 设置每秒执行的定时器
|
||||||
|
this.timer = setInterval(() => {
|
||||||
|
totalSeconds--;
|
||||||
|
if (totalSeconds <= 0) {
|
||||||
|
this.countDown()
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.updateRemainingTime(totalSeconds);
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
updateRemainingTime(totalSeconds) {
|
||||||
|
const minutes = Math.floor(totalSeconds / 60);
|
||||||
|
const seconds = totalSeconds % 60;
|
||||||
|
this.remaining = `${minutes}分${seconds.toString().padStart(2, '0')}秒`;
|
||||||
|
},
|
||||||
|
// 带节流的刷新方法
|
||||||
|
handleRefresh() {
|
||||||
|
const now = Date.now();
|
||||||
|
// 如果距离上次刷新时间小于节流时间,不执行刷新
|
||||||
|
if (now - this.lastRefreshTime < this.refreshCooldown) {
|
||||||
|
uni.showToast({
|
||||||
|
title: `操作太频繁,请${Math.ceil((this.refreshCooldown - (now - this.lastRefreshTime)) / 1000)}秒后再试`,
|
||||||
|
icon: 'none',
|
||||||
|
duration: 2000
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新上次刷新时间
|
||||||
|
this.lastRefreshTime = now;
|
||||||
|
|
||||||
|
// 执行刷新
|
||||||
|
this.countDown();
|
||||||
|
|
||||||
|
// 给用户反馈
|
||||||
|
uni.showToast({
|
||||||
|
title: '刷新成功',
|
||||||
|
icon: 'success',
|
||||||
|
duration: 1500
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.migrate-tips {
|
||||||
|
color: #ff0000;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-wrap {
|
||||||
|
margin: 0 20px;
|
||||||
|
padding: 10px 15px;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 16px;
|
||||||
|
.code-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
padding-top: 10px;
|
||||||
|
|
||||||
|
.code-number {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 28px;
|
||||||
|
color: #000;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.migrate-intro {
|
||||||
|
margin: 20px;
|
||||||
|
.migrate-intro-title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user