Browse Source

feat(coach): 完善教练个人信息页面功能

- 添加头像修改功能
- 实现姓名、邮箱、手机、微信等信息的输入
- 增加性别和生日的选择器
- 优化页面布局和提示文本
master
liutong 1 year ago
parent
commit
3e39f61784
  1. 225
      pages/coach/my/info.vue

225
pages/coach/my/info.vue

@ -5,8 +5,8 @@
<view class="main_section">
<view class="section">
<view class="item">
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image>
<view class="btn">修改头像</view>
<image @click="changeAvatar()" class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image>
<view class="btn" @click="changeAvatar()">修改头像</view>
</view>
</view>
@ -16,7 +16,7 @@
姓名 <text class="required">*</text>
</view>
<view class="input">
<input placeholder="请输入" />
<input v-model="formData.name" placeholder="请输入姓名" />
</view>
</view>
@ -25,7 +25,7 @@
账号 <text class="required"></text>
</view>
<view class="input">
<input disabled placeholder="请输入" />
<input disabled placeholder="暂无" />
</view>
</view>
@ -34,7 +34,7 @@
部门 <text class="required"></text>
</view>
<view class="input">
<input disabled placeholder="请选择" />
<input disabled placeholder="暂无" />
</view>
</view>
@ -43,7 +43,7 @@
等级 <text class="required"></text>
</view>
<view class="input">
<input disabled placeholder="请输入" />
<input disabled placeholder="暂无" />
</view>
</view>
</view>
@ -54,8 +54,15 @@
性别 <text class="required">*</text>
</view>
<view class="input">
<input placeholder="请输入" />
<fui-picker :options="options" :show="show" @change="change" @cancel="cancel"></fui-picker>
<input placeholder="请选择性别" v-model="sex_name" @click="picker_show_sex=true"/>
<fui-picker
layer="1"
:linkage="true"
:options="options_sex_arr"
:show="picker_show_sex"
@change="changePickerSex"
@cancel="picker_sex_show=false"
></fui-picker>
</view>
</view>
@ -64,8 +71,15 @@
生日 <text class="required">*</text>
</view>
<view class="input">
<input disabled placeholder="请输入" />
<fui-date-picker :show="show" type="3" @change="change" @cancel="cancel"></fui-date-picker>
<input placeholder="请选择生日" @click="picker_show_birthday=true" v-model="formData.birthday"/>
<fui-date-picker
:minDate="minDate"
:maxDate="maxDate"
:show="picker_show_birthday"
type="3"
@change="changePickerBirthday"
@cancel="picker_show_birthday=false"
></fui-date-picker>
</view>
</view>
@ -74,7 +88,7 @@
邮箱 <text class="required">*</text>
</view>
<view class="input">
<input disabled placeholder="请选择" />
<input v-model="formData.email" placeholder="请输入邮箱" />
</view>
</view>
@ -83,7 +97,7 @@
手机 <text class="required">*</text>
</view>
<view class="input">
<input disabled placeholder="请选择" />
<input v-model="formData.tel" placeholder="请输入手机" />
</view>
</view>
@ -92,7 +106,7 @@
微信 <text class="required"></text>
</view>
<view class="input">
<input disabled placeholder="请输入" />
<input v-model="formData.wx" placeholder="请输入微信" />
</view>
</view>
</view>
@ -104,74 +118,165 @@
<script>
import user from '@/api/user.js';
import AQUplodeImgMulti from '@/components/AQ/AQUplodeImgMulti';
import {Api_url} from "@/common/config.js";
import AQTabber from "@/components/AQ/AQTabber"
export default {
components: {
AQTabber,
AQUplodeImgMulti,
},
data() {
return {
formData:{
images_arr:[]
images_arr:[],
name:'',//
email:'',//
tel:'',//
wx:'',//
sex:'',//
birthday:'',//
},
//
show_course:false,//
//
course_name:'课程',//
options_course: [
{
text: '请选择课程',
value: '',
checked: true
}, {
text: '羽毛球课程1',
value: '1'
}, {
text: '篮球课程2',
value: '2'
}
],
//APi
uploadUrl: `${Api_url}/salesmanapi/common/uploadFile`,
//
show_classroom:false,//
//
classroom_name:'课室',//
options_classroom: [
{
text: '请选择课室',
value: '',
checked: true
}, {
text: '羽毛球201',
value: '1'
}, {
text: '篮球室101',
value: '2'
}
//
picker_show_sex: false,
sex_name:'请选择',
options_sex_arr:[
{ value: 1, text: '男' },
{ value: 2, text: '女' },
],
//
minDate:'',
maxDate:'',
picker_show_birthday:false,
}
},
onLoad() {
},
onShow() {
this.init()
},
methods: {
//######AQ######
//
AQUploadSuccess(res){
console.log('接收AQ上传回调xxx1',res)
// 使 split
let _inputValue = []
if(res.filePathArr.length){
_inputValue = res.filePathArr
async init(){
this.getBirthday()
},
//
changeAvatar() {
uni.chooseImage({
count: 1,
sizeType: ['compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
const tempFilePath = res.tempFilePaths[0]
//
this.uploadFilePromise(tempFilePath)
}
})
},
async uploadFilePromise(url) {
console.log('AQ',this.uploadUrl,url)
return new Promise((resolve, reject) => {
let a = uni.uploadFile({
url: this.uploadUrl, //
filePath: url,
name: "file",
formData: {
token: this.$store.state.token,
},
success: (e) => {
console.log('上传成功1',e)
let res = JSON.parse(e.data.replace(/\ufeff/g, "") || "{}")
console.log('上传成功2',res)
if (res.code >= 0){
this.userInfo.pic = res.data.pic_path
this.editPic(res.data.pic_path)
}else{
this.$util.showToast({
title: res.message
});
}
setTimeout(() => {
resolve(res.data.data);
}, 1000);
},
});
});
},
//Api
async editPic(pic) {
let res = await salesmanApi.editPic({pic: pic})
if (res.code >= 0) {
this.$util.showToast({
title: '修改成功'
})
} else {
this.$util.showToast({
title: res.message
})
}
this.formData[res.inputName]=_inputValue
// console.log('AQxxx1',res)
// console.log('AQxxx2',this.formData.member_store_certification_arr)
},
//
changePickerSex(e){
console.log('监听选择',e)
this.sex_name = e.text
this.formData.sex = e.value
this.picker_show_sex = false
},
//
//+30
getBirthday(){
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
let year_30 = year - 30;
let month_30 = month;
let day_30 = day;
if (month_30 == 2 && day_30 > 28) {
month_30 = 3;
day_30 = 1;
}
if (month_30 == 4 && day_30 > 30) {
month_30 = 5;
day_30 = 1;
}
if (month_30 == 6 && day_30 > 30) {
month_30 = 7;
day_30 = 1;
}
if (month_30 == 9 && day_30 > 30) {
month_30 = 10;
day_30 = 1;
}
if (month_30 == 11 && day_30 > 30) {
month_30 = 12;
day_30 = 1;
}
if (month_30 > 12) {
month_30 = month_30 - 12;
year_30 = year_30 + 1;
}
let minDate = year_30 + "-" + month_30 + "-" + day_30
let maxDate = year + "-" + month + "-" + day
this.minDate = minDate
this.maxDate = maxDate
},
//
changePickerBirthday(e){
console.log('监听生日选择',e)
this.formData.birthday = e.result
this.picker_show_birthday = false
},
}
}
</script>

Loading…
Cancel
Save