You've already forked SmartisanNote.Remake
103 lines
2.9 KiB
Vue
103 lines
2.9 KiB
Vue
<template>
|
|
<ion-page>
|
|
<Header title="设置" :onBack="handleBackPress" background="#f9f9f9" color="#8e8e8e" />
|
|
|
|
<div class="settings-content">
|
|
<SettingGroup title="账户">
|
|
<div button @click="handleLogin" class="settings-item settings-item-clickable">
|
|
<div class="item-text-primary">登录云同步</div>
|
|
<div class="item-text-tertiary">未登录</div>
|
|
</div>
|
|
</SettingGroup>
|
|
|
|
<SettingGroup title="偏好设置">
|
|
<div class="settings-item settings-item-border">
|
|
<div class="item-text-primary">云同步</div>
|
|
<SwitchButton :model-value="settings.cloudSync" @update:model-value="toggleCloudSync" />
|
|
</div>
|
|
</SettingGroup>
|
|
|
|
<SettingGroup title="关于">
|
|
<div class="settings-item settings-item-border">
|
|
<div class="item-text-primary">版本</div>
|
|
<div class="item-text-tertiary">1.0.0</div>
|
|
</div>
|
|
<div button @click="handlePrivacyPolicy" class="settings-item settings-item-clickable settings-item-border">
|
|
<div class="item-text-primary">隐私政策</div>
|
|
</div>
|
|
<div button @click="handleTermsOfService" class="settings-item settings-item-clickable">
|
|
<div class="item-text-primary">服务条款</div>
|
|
</div>
|
|
</SettingGroup>
|
|
</div>
|
|
</ion-page>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, onMounted } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import { useAppStore } from '../stores/useAppStore'
|
|
import Header from '../components/Header.vue'
|
|
import SettingGroup from '../components/SettingGroup.vue'
|
|
import SwitchButton from '../components/SwitchButton.vue'
|
|
import { IonPage } from '@ionic/vue'
|
|
|
|
const store = useAppStore()
|
|
const router = useRouter()
|
|
|
|
// 页面挂载时加载初始数据
|
|
// 从Storage加载用户设置和便签数据
|
|
onMounted(() => {
|
|
store.loadData()
|
|
})
|
|
|
|
// 切换云同步设置
|
|
// 调用store中的方法更新云同步状态
|
|
const toggleCloudSync = value => {
|
|
store.toggleCloudSync()
|
|
}
|
|
|
|
// 处理登录云同步按钮点击事件
|
|
// 在完整实现中，这里会打开登录界面
|
|
const handleLogin = () => {
|
|
console.log('Login to cloud')
|
|
}
|
|
|
|
// 处理隐私政策按钮点击事件
|
|
// 在完整实现中，这里会显示隐私政策内容
|
|
const handlePrivacyPolicy = () => {
|
|
console.log('Privacy policy')
|
|
}
|
|
|
|
// 处理服务条款按钮点击事件
|
|
// 在完整实现中，这里会显示服务条款内容
|
|
const handleTermsOfService = () => {
|
|
console.log('Terms of service')
|
|
}
|
|
|
|
const handleBackPress = () => {
|
|
router.back()
|
|
}
|
|
|
|
const settings = computed(() => store.settings)
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.settings-content {
|
|
background: url('/assets/icons/drawable-xxhdpi/note_setting_bg.png');
|
|
width: 100%;
|
|
height: 100vh;
|
|
overflow-y: scroll;
|
|
|
|
.item-text-primary {
|
|
font-size: 1rem;
|
|
color: #8e8e8e;
|
|
}
|
|
|
|
.item-text-tertiary {
|
|
font-size: 0.9375rem;
|
|
color: #b4b4b4;
|
|
}
|
|
}
|
|
</style>
|