第一次上传
This commit is contained in:
@@ -0,0 +1,277 @@
|
||||
<template>
|
||||
<view class="app-page" :class="themeClass">
|
||||
<view class="surface-card page-hero">
|
||||
<text class="hero-kicker">BACKUP</text>
|
||||
<text class="hero-title">备份与恢复</text>
|
||||
<text class="hero-desc">导出本地 JSON 备份,恢复时覆盖当前设备数据,适合换机或手动留档。</text>
|
||||
<view class="hero-tags">
|
||||
<text class="hero-tag">本地文件</text>
|
||||
<text class="hero-tag soft">{{ store.state.settings.lastBackupAt ? '最近已备份' : '尚未备份' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<ad-custom unit-id="adunit-64707ea333329399"></ad-custom>
|
||||
<section-card title="导出备份" subtitle="将账单、预算和设置导出为 JSON 文件,便于迁移设备或手动保存">
|
||||
<view class="hero-panel surface-strong">
|
||||
<view>
|
||||
<text class="panel-title">安全备份当前数据</text>
|
||||
<text class="panel-desc">所有数据均为本地文件,不会自动上传服务器。</text>
|
||||
</view>
|
||||
<view class="status-chip">{{ store.state.settings.lastBackupAt ? '可继续备份' : '建议先备份' }}</view>
|
||||
</view>
|
||||
<view class="action-row single-row">
|
||||
<view class="primary-button" @click="exportBackupFile">导出备份</view>
|
||||
</view>
|
||||
<text class="tiny-text info-line" v-if="store.state.settings.lastBackupAt">最近备份:{{ store.state.settings.lastBackupAt }}</text>
|
||||
</section-card>
|
||||
|
||||
<section-card title="恢复备份" subtitle="粘贴之前导出的 JSON 内容,恢复后将覆盖当前设备数据">
|
||||
<view class="input-shell textarea-shell">
|
||||
<textarea v-model="importText" placeholder="请粘贴备份 JSON"></textarea>
|
||||
</view>
|
||||
<view class="action-row">
|
||||
<view class="ghost-button" @click="importText = ''">清空内容</view>
|
||||
<view class="primary-button" @click="restoreBackup">开始恢复</view>
|
||||
</view>
|
||||
</section-card>
|
||||
|
||||
<section-card title="数据操作" subtitle="谨慎执行不可撤销的本地清理操作">
|
||||
<view class="menu-list">
|
||||
<view class="menu-item surface-strong" @click="copyBackupText">
|
||||
<view>
|
||||
<text class="menu-title">复制备份内容</text>
|
||||
</view>
|
||||
<text class="status-chip">复制</text>
|
||||
</view>
|
||||
<view class="menu-item surface-strong danger-shell" @click="clearCache">
|
||||
<view>
|
||||
<text class="menu-title negative">清空全部数据</text>
|
||||
</view>
|
||||
<text class="danger-text">执行</text>
|
||||
</view>
|
||||
</view>
|
||||
</section-card>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue'
|
||||
import SectionCard from '../../../components/SectionCard.vue'
|
||||
import { useAppStore } from '../../../utils/store'
|
||||
import { onShow } from '@dcloudio/uni-app'
|
||||
|
||||
const store = useAppStore()
|
||||
const importText = ref('')
|
||||
const themeClass = computed(() => (store.state.settings.theme === 'dark' ? 'theme-dark' : ''))
|
||||
|
||||
function writeBackupFile(content) {
|
||||
const timeLabel = new Date().toLocaleString()
|
||||
if (typeof wx !== 'undefined' && wx.getFileSystemManager) {
|
||||
const filePath = `${wx.env.USER_DATA_PATH}/bill-helper-backup.json`
|
||||
wx.getFileSystemManager().writeFile({
|
||||
filePath,
|
||||
data: content,
|
||||
encoding: 'utf8',
|
||||
success: () => {
|
||||
store.markBackup(timeLabel)
|
||||
uni.showModal({ title: '备份成功', content: `文件已生成:${filePath}`, showCancel: false })
|
||||
},
|
||||
fail: () => {
|
||||
uni.setClipboardData({ data: content })
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
store.markBackup(timeLabel)
|
||||
uni.setClipboardData({ data: content })
|
||||
}
|
||||
|
||||
function exportBackupFile() {
|
||||
writeBackupFile(store.exportBackup())
|
||||
}
|
||||
|
||||
function restoreBackup() {
|
||||
if (!importText.value.trim()) {
|
||||
uni.showToast({ title: '请先粘贴备份内容', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
store.importBackup(importText.value)
|
||||
importText.value = ''
|
||||
uni.showToast({ title: '备份恢复成功', icon: 'none' })
|
||||
} catch (error) {
|
||||
uni.showToast({ title: '备份内容无效', icon: 'none' })
|
||||
}
|
||||
}
|
||||
|
||||
function copyBackupText() {
|
||||
uni.setClipboardData({ data: store.exportBackup() })
|
||||
}
|
||||
|
||||
function clearCache() {
|
||||
uni.showModal({
|
||||
title: '清空全部数据',
|
||||
content: '确认删除当前设备中的账单、预算和设置吗?此操作不可撤销。',
|
||||
success: ({ confirm }) => {
|
||||
if (confirm) {
|
||||
store.resetAll()
|
||||
uni.showToast({ title: '本地数据已清空', icon: 'none' })
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onShow(()=>{
|
||||
showIt()
|
||||
})
|
||||
|
||||
function showIt(){
|
||||
let interstitialAd = null;
|
||||
if (wx.createInterstitialAd) {
|
||||
interstitialAd = wx.createInterstitialAd({
|
||||
adUnitId: 'adunit-0abc32053b19a4e9'
|
||||
})
|
||||
interstitialAd.onLoad(() => {})
|
||||
interstitialAd.onError((err) => {
|
||||
console.error('插屏广告加载失败', err)
|
||||
})
|
||||
interstitialAd.onClose(() => {})
|
||||
}
|
||||
|
||||
setTimeout(()=>{
|
||||
if (interstitialAd) {
|
||||
interstitialAd.show().catch((err) => {
|
||||
console.error('插屏广告显示失败', err)
|
||||
})
|
||||
}
|
||||
}, 2280)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-hero {
|
||||
padding: 30rpx;
|
||||
background: linear-gradient(145deg, rgba(16, 42, 67, 0.96) 0%, rgba(61, 102, 178, 0.92) 100%);
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.hero-kicker,
|
||||
.hero-desc,
|
||||
.hero-tag.soft {
|
||||
color: rgba(255, 255, 255, 0.76);
|
||||
}
|
||||
|
||||
.hero-kicker {
|
||||
font-size: 20rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.hero-title {
|
||||
display: block;
|
||||
margin-top: 12rpx;
|
||||
font-size: 44rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.hero-desc {
|
||||
display: block;
|
||||
margin-top: 14rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.hero-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 14rpx;
|
||||
margin-top: 22rpx;
|
||||
}
|
||||
|
||||
.hero-tag,
|
||||
.status-chip {
|
||||
padding: 12rpx 18rpx;
|
||||
border-radius: 999rpx;
|
||||
background: rgba(255, 255, 255, 0.16);
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.hero-panel,
|
||||
.menu-item,
|
||||
.action-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.hero-panel,
|
||||
.menu-item {
|
||||
padding: 26rpx;
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
|
||||
.hero-panel {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.panel-title,
|
||||
.menu-title {
|
||||
display: block;
|
||||
font-size: 31rpx;
|
||||
font-weight: 700;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.panel-desc,
|
||||
|
||||
.status-chip {
|
||||
background: var(--brand-soft);
|
||||
color: var(--brand);
|
||||
}
|
||||
|
||||
.action-row {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
|
||||
.single-row .primary-button,
|
||||
.action-row .ghost-button,
|
||||
.action-row .primary-button {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.info-line {
|
||||
display: block;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.textarea-shell {
|
||||
align-items: flex-start;
|
||||
min-height: 280rpx;
|
||||
padding: 20rpx 24rpx;
|
||||
}
|
||||
|
||||
.textarea-shell textarea {
|
||||
min-height: 240rpx;
|
||||
}
|
||||
|
||||
.menu-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.danger-shell {
|
||||
border: 1rpx solid rgba(210, 85, 67, 0.12);
|
||||
}
|
||||
|
||||
.danger-text {
|
||||
font-size: 24rpx;
|
||||
color: var(--danger);
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user