179 lines
4.2 KiB
Plaintext
179 lines
4.2 KiB
Plaintext
<template>
|
|
<view class="page">
|
|
<scroll-view direction="vertical" :show-scrollbar="false" style="flex:1;">
|
|
<view class="list-title">账号绑定</view>
|
|
<view class="list-container">
|
|
<view class="list-item" @click="toast('手机号已绑定')">
|
|
<view class="item-left">
|
|
<uni-icons type="phone" size="20" color="#007AFF"></uni-icons>
|
|
<text class="list-text">手机号</text>
|
|
</view>
|
|
<view class="item-right">
|
|
<text class="item-desc">{{ mobileMask }}</text>
|
|
<uni-icons type="right" size="16" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view class="list-item" @click="toast('修改密码功能开发中')">
|
|
<view class="item-left">
|
|
<uni-icons type="locked" size="20" color="#FF9500"></uni-icons>
|
|
<text class="list-text">修改密码</text>
|
|
</view>
|
|
<uni-icons type="right" size="16" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="list-title">隐私与安全</view>
|
|
<view class="list-container">
|
|
<view class="list-item" @click="goPage('/pages/my/privacy')">
|
|
<view class="item-left">
|
|
<uni-icons type="eye" size="20" color="#34C759"></uni-icons>
|
|
<text class="list-text">隐私设置</text>
|
|
</view>
|
|
<uni-icons type="right" size="16" color="#999"></uni-icons>
|
|
</view>
|
|
<view class="list-item" @click="toast('登录设备管理开发中')">
|
|
<view class="item-left">
|
|
<uni-icons type="staff" size="20" color="#5AC8FA"></uni-icons>
|
|
<text class="list-text">登录设备管理</text>
|
|
</view>
|
|
<uni-icons type="right" size="16" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="list-title">其他</view>
|
|
<view class="list-container">
|
|
<view class="list-item danger" @click="onCancel">
|
|
<view class="item-left">
|
|
<uni-icons type="trash" size="20" color="#FF3B30"></uni-icons>
|
|
<text class="list-text danger-text">注销账号</text>
|
|
</view>
|
|
<uni-icons type="right" size="16" color="#999"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<text class="version">当前版本 v{{ appVersion }}</text>
|
|
</scroll-view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import Api from '@/common/api-service.uts'
|
|
import userState from '@/stores/user.uts'
|
|
|
|
const appVersion = ref('2.5.0')
|
|
|
|
const mobileMask = computed<string>(() => {
|
|
const info = userState.info
|
|
const m = info && info.mobile ? (info.mobile as string) : ''
|
|
if (m.length >= 11) {
|
|
return m.substring(0, 3) + '****' + m.substring(7)
|
|
}
|
|
return m || '未绑定'
|
|
})
|
|
|
|
function toast(msg : string) {
|
|
uni.showToast({ title: msg, icon: 'none' })
|
|
}
|
|
|
|
function goPage(url : string) {
|
|
uni.navigateTo({ url: url })
|
|
}
|
|
|
|
function onCancel() {
|
|
uni.showModal({
|
|
title: '注销账号',
|
|
content: '注销后你的资料将被匿名化处理，且无法恢复，确定继续吗？',
|
|
confirmText: '注销',
|
|
confirmColor: '#FF3B30',
|
|
success: (res) => {
|
|
if (! res.confirm) return
|
|
Api.user.cancelAccount()
|
|
.then(() => {
|
|
Api.auth.logout()
|
|
uni.reLaunch({ url: '/pages/login/index' })
|
|
})
|
|
.catch((e : any) => {
|
|
uni.showToast({ title: (e && e.message) ? e.message : '操作失败', icon: 'none' })
|
|
})
|
|
}
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.page {
|
|
flex: 1;
|
|
background-color: #f7f7f7;
|
|
}
|
|
|
|
.list-title {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
margin: 24rpx 30rpx 16rpx;
|
|
}
|
|
|
|
.list-container {
|
|
margin: 0 30rpx;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.list-item {
|
|
display: flex;
|
|
flex-flow: row nowrap;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 30rpx;
|
|
border-bottom: 1rpx solid #f0f0f0;
|
|
}
|
|
|
|
.list-item:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.list-item:active {
|
|
background-color: #f8f8f8;
|
|
}
|
|
|
|
.item-left {
|
|
display: flex;
|
|
flex-flow: row nowrap;
|
|
align-items: center;
|
|
flex: 1;
|
|
}
|
|
|
|
.item-left .uni-icons {
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.list-text {
|
|
font-size: 30rpx;
|
|
color: #333;
|
|
}
|
|
|
|
.item-right {
|
|
display: flex;
|
|
flex-flow: row nowrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.item-desc {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
margin-right: 12rpx;
|
|
}
|
|
|
|
.danger-text {
|
|
color: #FF3B30;
|
|
}
|
|
|
|
.version {
|
|
display: block;
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
color: #bbb;
|
|
margin: 60rpx 0;
|
|
}
|
|
</style>
|