160 lines
4.3 KiB
Vue
160 lines
4.3 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"
|
||
|
|
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) {
|
||
|
|
|
||
|
|
}
|
||
|
|
</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(1)">
|
||
|
|
<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(1)">
|
||
|
|
<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(1)">
|
||
|
|
<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(1)">
|
||
|
|
<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>
|