193 lines
4.9 KiB
Vue
193 lines
4.9 KiB
Vue
<script setup>
|
|
import { onLoad } from "@dcloudio/uni-app"
|
|
// import mySwiper from "@/components/mySwiper.vue"
|
|
import {ref,onMounted,nextTick} from "vue"
|
|
import {useStore} from '@/store/index.js'
|
|
import api from "@/api/index.js"
|
|
const store = useStore()
|
|
onLoad(() => {
|
|
// console.log(useStore.userInfo)
|
|
userinfo.value = JSON.parse(uni.getStorageSync('userInfo'))
|
|
// console.log(userinfo.value)
|
|
avatar.value = uni.getStorageSync('avatarUrl')
|
|
})
|
|
const userinfo = ref(null)
|
|
const avatar = ref(null)
|
|
// 方法
|
|
function toDetail(type) {
|
|
let url = ''
|
|
switch(type) {
|
|
case 1:
|
|
url = '/pages/user/setting/userAgreement'
|
|
break;
|
|
case 2:
|
|
url = '/pages/user/setting/privacyPolicy'
|
|
break;
|
|
case 3:
|
|
url = '/pages/user/setting/phone_list'
|
|
break;
|
|
case 4:
|
|
url = '/pages/user/setting/aboutUs'
|
|
break;
|
|
case 5: // 退出
|
|
uni.showModal({
|
|
title:"提示",
|
|
content:"确认要退出登录吗？",
|
|
success:async function(res) {
|
|
if(res.confirm) {
|
|
store.logout()
|
|
}
|
|
}
|
|
})
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
if(url) {
|
|
uni.navigateTo({
|
|
url
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
<template>
|
|
<view class="userInfoBox page-box page-bg-gray">
|
|
<view class="row-box">
|
|
<view class="rb-card" @tap="toDetail(1)">
|
|
<view class="rbc-content">
|
|
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
|
<!-- <uni-icons type="person" color="gray" size="26"></uni-icons> -->
|
|
用户协议</view>
|
|
<view class="rbc-content-row rbc-content-right">
|
|
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="rb-card" @tap="toDetail(2)">
|
|
<view class="rbc-content">
|
|
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
|
<!-- <uni-icons type="phone" color="gray" size="26"></uni-icons> -->
|
|
隐私政策摘要</view>
|
|
<view class="rbc-content-row rbc-content-right">
|
|
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="rb-card" @tap="toDetail(3)">
|
|
<view class="rbc-content">
|
|
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
|
<!-- <uni-icons type="calendar" color="gray" size="26"></uni-icons> -->
|
|
个人信息手机清单</view>
|
|
<view class="rbc-content-row rbc-content-right">
|
|
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="rb-card" @tap="toDetail(4)">
|
|
<view class="rbc-content">
|
|
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
|
<!-- <uni-icons type="paperplane" color="gray" size="26"></uni-icons> -->
|
|
关于我们</view>
|
|
<view class="rbc-content-row rbc-content-right">
|
|
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="rb-card" @tap="toDetail(5)">
|
|
<view class="rbc-content">
|
|
<view class="rbc-content-row rbc-content-left rbc-content-left-box">
|
|
<!-- <uni-icons type="paperplane" color="gray" size="26"></uni-icons> -->
|
|
退出账号</view>
|
|
<view class="rbc-content-row rbc-content-right">
|
|
<uni-icons type="forward" color="gray" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<style scoped lang="scss">
|
|
.avatar-box{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
width: 100%;
|
|
padding: 20rpx 0;
|
|
background: #26758d;
|
|
image{
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
background-color: white;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
.rbc-content-right{
|
|
display: flex;
|
|
align-items: center;
|
|
background: white;
|
|
border-radius: 50%;
|
|
}
|
|
.rbc-content-left-box{
|
|
uni-icons{
|
|
margin-right: 20rpx;
|
|
}
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.row-box{
|
|
padding: 20rpx 0;
|
|
.rb-card{
|
|
padding: 20rpx;
|
|
background: white;
|
|
margin-bottom: 2rpx;
|
|
.rbc-title{
|
|
|
|
}
|
|
.rbc-content-box{
|
|
margin-top: 10rpx;
|
|
.rbc-content-row{
|
|
width: 50%;
|
|
text-align: center;
|
|
// padding: 40rpx 20rpx;
|
|
// box-shadow: 10rpx 10rpx 10rpx #cdcdcd;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
.rbc-content{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
}
|
|
}
|
|
.btn-box{
|
|
text-align: center;
|
|
margin-top: 40rpx;
|
|
.btn{
|
|
display: inline-block;
|
|
padding: 10px 20px;
|
|
background: #e2e2e2;
|
|
color: #26758d;
|
|
border-radius: 10px;
|
|
width: 50%;
|
|
}
|
|
}
|
|
.userinfo-box{
|
|
position: relative;
|
|
image{
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border-radius: 50%;
|
|
background: white;
|
|
margin-right: 20rpx;
|
|
}
|
|
color: white;
|
|
background-color: #26758d;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 40rpx 20rpx;
|
|
}
|
|
.user-box{
|
|
background: #f6f6f6;
|
|
}
|
|
</style> |