|
|
@@ -8,24 +8,32 @@
|
|
|
<view class="loginBox">
|
|
|
<view style="display: flex;height: 160rpx;justify-content: center;" >
|
|
|
<view style="text-align: center;">
|
|
|
- <image :src="$method.splitImgHost(form.avatar, true)" class="avatar"></image>
|
|
|
+ <image @click="editAvatar" :src="$method.splitImgHost(form.avatar, true)" class="avatar"></image>
|
|
|
<view class="nick">{{form.realname}}</view>
|
|
|
<view>
|
|
|
<view class="item">
|
|
|
<view>我的昵称</view>
|
|
|
- <view>{{form.nickname}}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
+ <view @click="editNickName">{{form.nickname}}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view>性别</view>
|
|
|
- <view>{{ array_sex[form.sex] }}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
+ <view class="rBox">
|
|
|
+ <picker @change="bindPickerChangeSex" :value="form.sex" :range="array_sex">
|
|
|
+ <view class="picker">{{ array_sex[form.sex] }}</view>
|
|
|
+ </picker>
|
|
|
+ <u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view>年龄</view>
|
|
|
- <view>{{ $method.getYears(form.userBirth) }}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
+ <view class="rBox">
|
|
|
+ <picker mode="date" :value="form.userBirth" @change="bindDateChange">
|
|
|
+ <view class="picker">{{ $method.getYears(form.userBirth) }} 岁</view>
|
|
|
+ </picker>
|
|
|
+ <u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view>关联学员身份</view>
|
|
|
- <view style="display: flex;">
|
|
|
+ <view style="display: flex;" @click="editIdCard">
|
|
|
<view style="text-align: right;">
|
|
|
<view>{{ form.realname }}</view>
|
|
|
<view>{{ form.idCard }}</view>
|
|
|
@@ -34,22 +42,36 @@
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view>所在城市</view>
|
|
|
- <view>{{ form.province }}-{{ form.city }}-{{ form.district }}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
+ <view class="rBox">
|
|
|
+ <pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion2">
|
|
|
+ <view class="picker">{{ form.province }} {{ form.city }} {{ form.district }}</view>
|
|
|
+ </pick-regions>
|
|
|
+ <u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view>手机号码</view>
|
|
|
<view>{{ form.telphone }}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
</view>
|
|
|
- <view class="item">
|
|
|
+ <!-- <view class="item">
|
|
|
<view>微信绑定</view>
|
|
|
- <view>nihongjiewechat<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
- </view>
|
|
|
+ <view>{{ form.gzh_open_id }}<u-icon name="arrow-right" color="#999999" size="28"></u-icon></view>
|
|
|
+ </view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
-
|
|
|
+ <u-modal v-model="n_show" @confirm="confirmNick" :show-cancel-button="true" title="修改昵称">
|
|
|
+ <view class="slot-content">
|
|
|
+ <u-input v-model="nickname" placeholder="请输入昵称" />
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
+ <u-modal v-model="id_show" @confirm="confirmId" :show-cancel-button="true" title="修改关联信息">
|
|
|
+ <view class="slot-content">
|
|
|
+ <u-input v-model="realname" placeholder="请输入真实姓名" />
|
|
|
+ <u-input v-model="idCard" placeholder="请输入身份证" />
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -60,6 +82,14 @@ export default {
|
|
|
return {
|
|
|
form:{},
|
|
|
array_sex: ['男', '女'],
|
|
|
+ n_show:false,
|
|
|
+ defaultRegionCode: '440112',
|
|
|
+ id_show:false,
|
|
|
+ nickname:'',
|
|
|
+ realname:'',
|
|
|
+ idCard:'',
|
|
|
+ avatarUrl:'',
|
|
|
+ avatarOssKey:''
|
|
|
|
|
|
};
|
|
|
},
|
|
|
@@ -71,7 +101,175 @@ export default {
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ uploadFile(options, int) {
|
|
|
+ var self = this;
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ var data = {
|
|
|
+ imageStatus: int
|
|
|
+ };
|
|
|
+ self.$api.aliyunpolicy(data).then(res => {
|
|
|
+ console.log(res.data,6)
|
|
|
+ if(res.data.code!=200){
|
|
|
+ self.$method.showToast('签名错误'+JSON.stringify(res.data))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ var ossToken = res.data.data.resultContent;
|
|
|
+ if(ossToken.host==null||ossToken.host==undefined){
|
|
|
+ self.$method.showToast('上传路径报错'+JSON.stringify(res.data))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ uni.uploadFile({
|
|
|
+ url: ossToken.host,
|
|
|
+ name: 'file',
|
|
|
+ filePath: options,
|
|
|
+ fileType: 'image',
|
|
|
+ header: {
|
|
|
+ AuthorizationToken: 'WX ' + uni.getStorageSync('token')
|
|
|
+ },
|
|
|
+ formData: {
|
|
|
+ key: ossToken.dir,
|
|
|
+ OSSAccessKeyId: ossToken.accessid,
|
|
|
+ policy: ossToken.policy,
|
|
|
+ Signature: ossToken.signature,
|
|
|
+ callback: ossToken.callback,
|
|
|
+ success_action_status: 200
|
|
|
+ },
|
|
|
+ success: result => {
|
|
|
+ if (result.statusCode === 200) {
|
|
|
+ self.avatarOssKey = ossToken.dir;
|
|
|
+ resolve();
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: '上传失败',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: '上传接口报错'+error,
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ imageInfos(){
|
|
|
+ var self = this
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ uni.getImageInfo({
|
|
|
+ src: self.avatarUrl,
|
|
|
+ success: async res => {
|
|
|
+ let canvasWidth = res.width; //图片原始长宽
|
|
|
+ let canvasHeight = res.height;
|
|
|
+ if (canvasWidth > 1000 || canvasHeight > 1000) {
|
|
|
+ uni.compressImage({
|
|
|
+ src: self.avatarUrl,
|
|
|
+ quality: 75,
|
|
|
+ width: '50%',
|
|
|
+ height: '50%',
|
|
|
+ success: async rest => {
|
|
|
+ const waitUpload = await self.uploadFile(rest.tempFilePath, 0);
|
|
|
+ resolve()
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ console.log('无需压缩');
|
|
|
+ const waitUpload = await self.uploadFile(self.avatarUrl, 0);
|
|
|
+ resolve()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async submitAvatar(){
|
|
|
+ const waitYS = await this.imageInfos();
|
|
|
+ let data = {avatar:this.avatarOssKey}
|
|
|
+ this.submitForm(data)
|
|
|
+ },
|
|
|
+ editAvatar(){
|
|
|
+ let that = this
|
|
|
+ uni.chooseImage({
|
|
|
+ count: 1, //默认9
|
|
|
+ sizeType: [ 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
|
|
+ success: function (res) {
|
|
|
+ that.avatarUrl = res.tempFilePaths[0]
|
|
|
+ that.submitAvatar()
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //城市
|
|
|
+ handleGetRegion2(region) {
|
|
|
+ let data = {province:region[0].name,city:region[1].name,district:region[2].name}
|
|
|
+ this.submitForm(data)
|
|
|
+ },
|
|
|
+ bindDateChange(e) {
|
|
|
+ let data = {userBirth:e.detail.value}
|
|
|
+ this.submitForm(data)
|
|
|
+ },
|
|
|
+ editIdCard(){
|
|
|
+ this.id_show = true
|
|
|
+ this.realname = this.form.realname
|
|
|
+ this.idCard = this.form.idCard
|
|
|
+ },
|
|
|
+ confirmId(){
|
|
|
+ if(this.realname==''){
|
|
|
+ uni.showModal({
|
|
|
+ title: "提示",
|
|
|
+ content: '真实姓名不能为空',
|
|
|
+ showCancel: false
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(this.idCard==''){
|
|
|
+ uni.showModal({
|
|
|
+ title: "提示",
|
|
|
+ content: '身份证ID不能为空',
|
|
|
+ showCancel: false
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let data = {realname:this.realname,idCard:this.idCard}
|
|
|
+ this.submitForm(data)
|
|
|
+ },
|
|
|
+ confirmNick(){
|
|
|
+ if(this.nickname==''){
|
|
|
+ uni.showModal({
|
|
|
+ title: "提示",
|
|
|
+ content: '昵称不能为空',
|
|
|
+ showCancel: false
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let data = {nickname:this.nickname}
|
|
|
+ this.submitForm(data)
|
|
|
+ },
|
|
|
+ editNickName(){
|
|
|
+ this.n_show = true
|
|
|
+ this.nickname = this.form.nickname
|
|
|
+ },
|
|
|
+ submitForm(data){
|
|
|
+ let self = this
|
|
|
+ this.$api.appuserInfo(data).then(res => {
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ setTimeout(()=>{
|
|
|
+ uni.showToast({
|
|
|
+ title: '提交成功',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ },500);
|
|
|
+ self.$api.refreshUserInfo()
|
|
|
+ }else{
|
|
|
+ uni.showToast({
|
|
|
+ title: res.data.msg,
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
computed: {...mapGetters(['userInfo'])},
|
|
|
watch:{
|
|
|
@@ -92,6 +290,19 @@ export default {
|
|
|
</style>
|
|
|
|
|
|
<style scope>
|
|
|
+ .avatar{
|
|
|
+ height: 70rpx;
|
|
|
+ width: 70rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+
|
|
|
+ }
|
|
|
+ .slot-content{
|
|
|
+ margin: 30rpx;
|
|
|
+ color: #606266;
|
|
|
+ }
|
|
|
+ .rBox{
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
.item{
|
|
|
width: 686rpx;
|
|
|
height: 80rpx;
|
he2802