更改搜索框
This commit is contained in:
魏啾
276
pages/user/information.vue
Normal file
276
pages/user/information.vue
Normal file
@@ -0,0 +1,276 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<!-- 占位符导航栏 -->
|
||||
<navseat :opacity='opacity' :title='titlename' :titleshow='true'></navseat>
|
||||
<view class="onecontent">
|
||||
<view :style="[{'padding-top':HeighT.customBar +44+'px'}]"></view>
|
||||
<view class="onecontentbox">
|
||||
<!-- <button open-type="chooseAvatar" @chooseavatar="uploadImg">
|
||||
<image class="onecontentboximage" :src="userHeadImg" mode=""></image>
|
||||
</button> -->
|
||||
<!-- <image class="onecontentboximage" :src="userHeadImg" mode="" @click="uploadImg"></image> -->
|
||||
<button type="default" class="btn" open-type="chooseAvatar" @chooseavatar="uploadImg">
|
||||
<view class="" :style="'background-image:url('+userHeadImg+');'"
|
||||
style="width: 180rxp;height: 180rpx; background-position: center;"></view>
|
||||
</button>
|
||||
|
||||
|
||||
<view class="onecontentboxitem flex-between">
|
||||
<view class="onecontentboxitemtext">
|
||||
昵称
|
||||
</view>
|
||||
<input class="onecontentboxiteminput" v-model="nickName" type="nickname" @blur="bindblur"
|
||||
placeholder="请输入昵称" @input="bindinput" />
|
||||
|
||||
</view>
|
||||
<view class="onecontentboxitem flex-between" style="border-top: 1rpx dotted #333333;">
|
||||
<view class="onecontentboxitemtext">
|
||||
手机号
|
||||
</view>
|
||||
<button class="onecontentboxiteminput buttonstyle"
|
||||
style="background-color: #fff;border: none;!important" open-type="getPhoneNumber"
|
||||
@getphonenumber="getPhone">{{phonetitle}} </button>
|
||||
<!-- <input class="onecontentboxiteminput" disabled v-model="phonetitle" type="text"
|
||||
placeholder="请输入手机号"> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentboxitemnamber" @click="sumbit">
|
||||
保存
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import navseat from '@/components/navseat.vue'
|
||||
export default {
|
||||
components: {
|
||||
navseat
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
titlename: '完善信息',
|
||||
opacity: false,
|
||||
form: {
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore',
|
||||
},
|
||||
userInfo: uni.cache.get('userInfo'),
|
||||
userHeadImg: "",
|
||||
nickName: '',
|
||||
phonetitle: ""
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.userInfo = uni.cache.get('userInfo')
|
||||
this.nickName = this.userInfo.nickName
|
||||
this.userHeadImg = this.userInfo.headImg
|
||||
this.phonetitle = this.userInfo.telephone ? this.userInfo.telephone : '请授权手机号'
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop <= 44) { //搜索导航栏
|
||||
this.opacitys = false
|
||||
} else {
|
||||
this.opacitys = true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getPhone(d) {
|
||||
if (d.detail.iv) {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: async (data) => {
|
||||
console.log(data)
|
||||
let res = await this.api.userwxlogins({
|
||||
code: data.code,
|
||||
encryptedData: d.detail.encryptedData,
|
||||
iv: d.detail.iv,
|
||||
})
|
||||
this.phonetitle = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
bindblur(e) {
|
||||
console.log(e, 11)
|
||||
this.nickName = e.detail.value; // 获取微信昵称
|
||||
},
|
||||
bindinput(e) {
|
||||
console.log(e, 22)
|
||||
this.nickName = e.detail.value; // 获取微信昵称
|
||||
},
|
||||
// uploadImg() {
|
||||
// let _this = this
|
||||
// uni.chooseImage({
|
||||
// crop: {
|
||||
// width: 200,
|
||||
// height: 200
|
||||
// },
|
||||
// success: (chooseImageRes) => {
|
||||
// const tempFilePaths = chooseImageRes.tempFilePaths;
|
||||
// uni.uploadFile({
|
||||
// url: uni.conf.baseUrl + '/common/upload',
|
||||
// filePath: tempFilePaths[0],
|
||||
// header: {
|
||||
// environment: 'app',
|
||||
// type: 'android',
|
||||
// version: '1.7.3',
|
||||
// },
|
||||
// name: "file",
|
||||
// formData: {
|
||||
// file: chooseImageRes.tempFiles[0],
|
||||
// },
|
||||
// success: (uploadFileRes) => {
|
||||
// let {
|
||||
// data
|
||||
// } = JSON.parse(uploadFileRes.data)
|
||||
// this.userHeadImg = data
|
||||
// },
|
||||
// });
|
||||
// },
|
||||
// })
|
||||
// },
|
||||
uploadImg(e) {
|
||||
const {
|
||||
avatarUrl
|
||||
} = e.detail
|
||||
console.log(e)
|
||||
console.log(e.detail)
|
||||
// this.userHeadImg = avatarUrl
|
||||
uni.uploadFile({
|
||||
url: 'https://wxcashiertest.sxczgkj.cn/cashierService/common/upload',
|
||||
// url: uni.conf.baseUrl + '/common/upload',
|
||||
|
||||
filePath: avatarUrl,
|
||||
header: {
|
||||
environment: 'app',
|
||||
type: 'android',
|
||||
version: '1.7.3',
|
||||
},
|
||||
name: "file",
|
||||
formData: {
|
||||
file: avatarUrl,
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
let {
|
||||
data
|
||||
} = JSON.parse(uploadFileRes.data)
|
||||
this.userHeadImg = data
|
||||
},
|
||||
});
|
||||
},
|
||||
async sumbit() {
|
||||
let res = await this.api.upUserInfo({
|
||||
headImg: this.userHeadImg,
|
||||
nickName: this.nickName,
|
||||
telephone: this.phonetitle == '请授权手机号' ? '' : this.phonetitle
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
HeighT() { //手机类型的尺寸
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
.onecontent {
|
||||
padding: 0 28rpx;
|
||||
width: 100%;
|
||||
height: 446rpx;
|
||||
background: linear-gradient(180deg, #FFD158 0%, #F9F9F9 100%);
|
||||
|
||||
.onecontentbox {
|
||||
position: relative;
|
||||
margin-top: 116rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
padding: 75rpx 32rpx 0rpx 32rpx;
|
||||
|
||||
.onecontentboximage {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: -60rpx;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.onecontentboxitem {
|
||||
padding: 24rpx 0;
|
||||
|
||||
.onecontentboxitemtext {
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontentboxiteminput {
|
||||
text-align: right;
|
||||
flex: auto;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.buttonstyle {
|
||||
.buttonstyle:after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontentboxitemnamber {
|
||||
margin-top: 84rpx;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
padding: 20rpx 0;
|
||||
background: #FFD158;
|
||||
border-radius: 46rpx 46rpx 46rpx 46rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 100%;
|
||||
padding: 0;
|
||||
|
||||
>view {
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.buttonstyle:after {
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user