yxt_product
/
yxt-yythmall-ui-miniprogram
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

111

master
mac 1 year ago
parent
35b510e3fe
commit
1de27c0bf3
1 changed files with 262 additions and 199 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 461
      pages/me/base_info.vue

461
pages/me/base_info.vue
View File

@ -1,200 +1,263 @@
<template>
<view style="display: flex;flex-direction: column;">
<NavBar ref="nav" navTitle="个人信息" :showIcon="true" :supportChange="false">
</NavBar>
<loading-state ref="pageView" @request="request">
<view @click="uploadHeadImage()" class="menu-item">
<text class="text">头像</text>
<image :src="page.photo" style="width: 70rpx;height: 70rpx;margin-right: 10rpx;"></image>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view @click="remark()" class="menu-item">
<text class="text">昵称</text>
<text class="explain">{{page.nick}}</text>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view class="menu-item">
<text class="text">手机号</text>
<text class="explain"></text>
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">{{page.phone}}</button>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view @click="toRealInfo()" class="menu-item">
<text class="text">实名信息</text>
<text class="explain">{{page.realAttestationExplain}}</text>
<image class="more" src="../../static/more.png"></image>
</view>
</loading-state>
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog ref="inputClose" mode="input" title="修改昵称" :value="page.nick" placeholder="请输入内容"
@confirm="dialogInputConfirm"></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
page: {}
}
},
onLoad(options) {
this.request()
uni.$on("real-info", (e) => {
this.$nextTick(() => {
this.$refs.pageView.setLoadState(0)
})
this.request();
})
},
onUnload() {
uni.$off('real-info');
},
methods: {
// 获取数据
request() {
let _this = this
_this.$api.getBaseInfo(getApp().globalData.sid).then((resp) => {
_this.page = resp
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(2)
})
}).catch(e => {
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(1)
})
})
},
uploadHeadImage() {
let _this = this
uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
uni.uploadFile({
url: _this.$api.headerUpload,
filePath: tempFilePaths[0],
name: 'file',
formData: {
'userSid': getApp().globalData.sid
},
success: (uploadFileRes) => {
_this.page.photo = JSON.parse(uploadFileRes.data).data;
}
});
}
});
},
// 修改昵称
remark() {
this.$refs.inputDialog.open()
},
dialogInputConfirm(val) {
let _this = this
_this.$api.changeNick({
userSid: getApp().globalData.sid,
userNickName: val
}).then((resp) => {
_this.page.nick = val
}).catch(e => {
console.log(e);
})
},
getPhoneNumber(e) {
let _this = this
console.log(e.detail.code)
_this.$api.getPhone({
userSid: getApp().globalData.sid,
code: e.detail.code
}).then((resp) => {
_this.page.phone = resp
}).catch(e => {
console.log(e);
})
},
toRealInfo() {
uni.navigateTo({
url: '/pages/me/RealInfo'
})
}
}
}
</script>
<style lang="scss">
button {
color: #828282;
background-color: #fff;
font-size: 28rpx;
padding-right: 10rpx;
}
button::after {
border: 0;
}
// 修改点击时的样式
.button-hover {
color: #F85959;
background-color: #fff;
}
page {
background-color: #f1f2f3;
}
.menu-item {
height: 112rpx;
width: auto;
display: flex;
flex-direction: row;
background-color: #fff;
align-items: center;
padding-left: 36rpx;
padding-right: 36rpx;
}
.more {
width: 35rpx;
height: 35rpx;
float: right;
}
.menu-item .icon {
width: 69rpx;
height: 35rpx;
}
.menu-item .text {
font-size: 32rpx;
color: #101010;
flex: 1;
float: left;
}
.menu-item .explain {
font-size: 28rpx;
color: #828282;
margin-right: 10rpx;
}
.line-thin {
height: 1rpx;
width: 100%;
background-color: #eee;
}
<template>
<view style="display: flex;flex-direction: column;">
<NavBar ref="nav" navTitle="个人信息" :showIcon="true" :supportChange="false">
</NavBar>
<loading-state ref="pageView" @request="request">
<view @click="uploadHeadImage()" class="menu-item">
<text class="text">头像</text>
<image :src="page.photo" style="width: 70rpx;height: 70rpx;margin-right: 10rpx;"></image>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view @click="remark()" class="menu-item">
<text class="text">昵称</text>
<text class="explain">{{page.nick}}</text>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view class="menu-item">
<text class="text">手机号</text>
<text class="explain"></text>
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">{{page.phone}}</button>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view @click="toRealInfo()" class="menu-item">
<text class="text">实名信息</text>
<text class="explain">{{page.realAttestationExplain}}</text>
<image class="more" src="../../static/more.png"></image>
</view>
<view class="line-thin"></view>
<view @click="bank()" class="menu-item">
<text class="text">推荐支行</text>
<zqs-select class="explain2" :multiple="false" :list="options" label-key="bankName" value-key="bankSid"
title="选择支行" clearable v-model="page.customerBankName" placeholder=" 请选择支行" @search="searchEvent"
@change="selectChange2"></zqs-select>
</view>
</loading-state>
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog ref="inputClose" mode="input" title="修改昵称" :value="page.nick" placeholder="请输入内容"
@confirm="dialogInputConfirm"></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
options: [{
label: '沃尔玛（WALMART)',
value: '0',
},
{
label: '国家电网有限公司（STATE GRID)',
value: '1',
},
{
label: '中国石油天然气集团有限公司',
value: '2',
},
{
label: '苹果公司（APPLE)',
value: '3',
},
{
label: 'CVSHealth公司（CVS HEALTH)',
value: '4',
},
{
label: '联合健康集团（UNITEDHEALTH GROUP)',
value: '5',
},
{
label: '丰田汽车公司（TOYOTA MOTOR)',
value: '6',
}
],
page: {}
}
},
onLoad(options) {
this.request()
uni.$on("real-info", (e) => {
this.$nextTick(() => {
this.$refs.pageView.setLoadState(0)
})
this.request();
})
},
onUnload() {
uni.$off('real-info');
},
methods: {
// 获取数据
request() {
let _this = this
_this.$api.getBaseInfo(getApp().globalData.sid).then((resp) => {
_this.page = resp
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(2)
_this.options = resp.customerBankList
})
}).catch(e => {
_this.$nextTick(() => {
_this.$refs.pageView.setLoadState(1)
})
})
},
uploadHeadImage() {
let _this = this
uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
uni.uploadFile({
url: _this.$api.headerUpload,
filePath: tempFilePaths[0],
name: 'file',
formData: {
'userSid': getApp().globalData.sid
},
success: (uploadFileRes) => {
_this.page.photo = JSON.parse(uploadFileRes.data).data;
}
});
}
});
},
// 修改昵称
remark() {
this.$refs.inputDialog.open()
},
dialogInputConfirm(val) {
let _this = this
_this.$api.changeNick({
userSid: getApp().globalData.sid,
userNickName: val
}).then((resp) => {
_this.page.nick = val
}).catch(e => {
console.log(e);
})
},
getPhoneNumber(e) {
let _this = this
console.log(e.detail.code)
_this.$api.getPhone({
userSid: getApp().globalData.sid,
code: e.detail.code
}).then((resp) => {
_this.page.phone = resp
}).catch(e => {
console.log(e);
})
},
toRealInfo() {
uni.navigateTo({
url: '/pages/me/RealInfo'
})
},
bank() {},
selectChange2(e) {
// 此处为点击的事件
let param = {
userSid: getApp().globalData.sid,
customerBankSid: e.bankSid
}
let _this = this
_this.$api.saveTuiJianZhiHang(param).then((resp) => {
_this.request()
}).catch(e => {
_this.request()
})
},
searchEvent(val) {
console.log('查询事件参数', val)
// 此处把新的请求值 赋值给options
},
}
}
</script>
<style lang="scss">
button {
color: #828282;
background-color: #fff;
font-size: 28rpx;
padding-right: 10rpx;
}
button::after {
border: 0;
}
// 修改点击时的样式
.button-hover {
color: #F85959;
background-color: #fff;
}
page {
background-color: #f1f2f3;
}
.menu-item {
height: 112rpx;
width: auto;
display: flex;
flex-direction: row;
background-color: #fff;
align-items: center;
padding-left: 36rpx;
padding-right: 36rpx;
}
.more {
width: 35rpx;
height: 35rpx;
float: right;
}
.menu-item .icon {
width: 69rpx;
height: 35rpx;
}
.menu-item .text {
font-size: 32rpx;
color: #101010;
flex: 1;
float: left;
}
.menu-item .explain {
font-size: 28rpx;
color: #828282;
margin-right: 10rpx;
}
.menu-item .explain2 {
font-size: 28rpx;
color: #828282;
}
.line-thin {
height: 1rpx;
width: 100%;
background-color: #eee;
}
</style>
Write Preview
Loading…
Cancel
Save