117 lines
3.1 KiB
Vue
117 lines
3.1 KiB
Vue
<template>
|
|
<view class="page-wrapper">
|
|
<JeepayCustomNavbar bgDefaultColor="#fff" title="账号设置" backCtrl="back" />
|
|
<view class="user-photo">
|
|
<view class="title">用户头像</view>
|
|
<view class="right" @tap="uploadImg.preview()">
|
|
<JeepayUploadImg ref="uploadImg" v-model:src="vdata.userInfo.avatarUrl" bizType="applyment" mode="viewbtn" @change="modifyUser" />
|
|
<!-- <image class="user-img" src="/static/orderImg/ysf.svg" mode="scaleToFill" /> -->
|
|
<image style="width: 100rpx; height: 120rpx" src="/static/iconImg/icon-arrow-small.svg" mode="scaleToFill" />
|
|
</view>
|
|
</view>
|
|
<view class="user-name-wrapper" @tap="go.to('PAGES_EDIT_FORM', { realname: vdata.userInfo.realname })">
|
|
<view class="title">用户姓名</view>
|
|
<view class="right">
|
|
<view>{{ vdata.userInfo.realname }}</view>
|
|
<image style="width: 100rpx; height: 120rpx" src="/static/iconImg/icon-arrow-small.svg" mode="scaleToFill" />
|
|
</view>
|
|
</view>
|
|
<view class="user-name-wrapper remover" @tap="phone.open(vdata.callPhone)">
|
|
<view class="title">注销账号</view>
|
|
<view class="right">
|
|
<image style="width: 100rpx; height: 120rpx" src="/static/iconImg/icon-arrow-small.svg" mode="scaleToFill" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<CallPhone ref="phone" @callPhone="callPhone" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive, onMounted } from 'vue'
|
|
import { onShow } from '@dcloudio/uni-app';
|
|
import { $modifyUser, $userInfo } from '@/http/apiManager.js'
|
|
import storageManage from '@/commons/utils/storageManage.js'
|
|
import go from '@/commons/utils/go.js'
|
|
import infoBox from '@/commons/utils/infoBox.js'
|
|
import CallPhone from './components/CallPhone.vue'
|
|
|
|
const uploadImg = ref()
|
|
const phone = ref(null)
|
|
const vdata = reactive({
|
|
userInfo: storageManage.userInfo(),
|
|
siteInfos: storageManage.siteInfos(),
|
|
callPhone: {
|
|
}
|
|
})
|
|
|
|
onMounted(() => {
|
|
vdata.callPhone = {
|
|
tips: '为了您的账户安全，请联系客服进行账号注销处理，客服电话：',
|
|
phone: vdata.siteInfos.siteInfo.companyTel,
|
|
confirmText: '拨打电话'
|
|
}
|
|
})
|
|
|
|
onShow(() => {
|
|
userInfo()
|
|
})
|
|
|
|
const userInfo = () => {
|
|
$userInfo().then(({bizData}) => {
|
|
vdata.userInfo = bizData
|
|
// 保存用户数据
|
|
storageManage.userInfo(bizData)
|
|
})
|
|
}
|
|
|
|
const modifyUser = (ossFileUrl) => {
|
|
$modifyUser({
|
|
avatarUrl: ossFileUrl
|
|
}).then(() => {
|
|
return infoBox.showToast("保存成功")
|
|
})
|
|
}
|
|
|
|
const callPhone = () => {
|
|
uni.makePhoneCall({
|
|
phoneNumber: vdata.siteInfos.companyTel
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.title {
|
|
margin-left: 40rpx;
|
|
color: #666666;
|
|
}
|
|
.right {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.user-photo {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 240rpx;
|
|
background-color: #fff;
|
|
font-size: 32rpx;
|
|
|
|
.user-img {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
border-radius: 26rpx;
|
|
}
|
|
}
|
|
.user-name-wrapper {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding-bottom: 20rpx;
|
|
background-color: #fff;
|
|
}
|
|
.remover {
|
|
margin-top: 30rpx;
|
|
padding: 0;
|
|
}
|
|
</style>
|