You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
365 lines
8.6 KiB
365 lines
8.6 KiB
<!--用户信息(教练)-详情-->
|
|
<template>
|
|
<view class="main_box">
|
|
|
|
<view class="main_section">
|
|
<view class="section">
|
|
<view class="item">
|
|
<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>
|
|
|
|
<view class="section">
|
|
<view class="item">
|
|
<view class="title">
|
|
姓名 <text class="required">*</text>
|
|
</view>
|
|
<view class="input">
|
|
<input v-model="formData.name" placeholder="请输入姓名" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
账号 <text class="required"></text>
|
|
</view>
|
|
<view class="input">
|
|
<input disabled placeholder="暂无" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
部门 <text class="required"></text>
|
|
</view>
|
|
<view class="input">
|
|
<input disabled placeholder="暂无" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
等级 <text class="required"></text>
|
|
</view>
|
|
<view class="input">
|
|
<input disabled placeholder="暂无" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="section">
|
|
<view class="item">
|
|
<view class="title">
|
|
性别 <text class="required">*</text>
|
|
</view>
|
|
<view class="input">
|
|
<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>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
生日 <text class="required">*</text>
|
|
</view>
|
|
<view class="input">
|
|
<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>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
邮箱 <text class="required">*</text>
|
|
</view>
|
|
<view class="input">
|
|
<input v-model="formData.email" placeholder="请输入邮箱" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
手机 <text class="required">*</text>
|
|
</view>
|
|
<view class="input">
|
|
<input v-model="formData.tel" placeholder="请输入手机" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="title">
|
|
微信 <text class="required"></text>
|
|
</view>
|
|
<view class="input">
|
|
<input v-model="formData.wx" placeholder="请输入微信" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="submet_btn">提交</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import user from '@/api/user.js';
|
|
import {Api_url} from "@/common/config.js";
|
|
import AQTabber from "@/components/AQ/AQTabber"
|
|
|
|
|
|
export default {
|
|
components: {
|
|
AQTabber,
|
|
},
|
|
data() {
|
|
return {
|
|
formData:{
|
|
images_arr:[],
|
|
name:'',//姓名
|
|
email:'',//邮箱
|
|
tel:'',//手机
|
|
wx:'',//微信
|
|
sex:'',//性别
|
|
birthday:'',//生日
|
|
},
|
|
|
|
//上传图片APi路径
|
|
uploadUrl: `${Api_url}/salesmanapi/common/uploadFile`,
|
|
|
|
//性别选择器 相关
|
|
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: {
|
|
|
|
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
|
|
})
|
|
}
|
|
},
|
|
|
|
//性别选择相关
|
|
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>
|
|
|
|
<style lang="less" scoped>
|
|
|
|
.main_box{
|
|
background: #292929 ;
|
|
}
|
|
|
|
//自定义导航栏
|
|
.navbar_section{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: #29d3b4;
|
|
.title{
|
|
padding: 20rpx 0;
|
|
font-size: 30rpx;
|
|
color: #315d55;
|
|
}
|
|
}
|
|
|
|
.main_section{
|
|
min-height: 100vh;
|
|
background: #292929 100%;
|
|
padding: 0 0rpx;
|
|
padding-top: 32rpx;
|
|
padding-bottom: 150rpx;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
|
|
.section{
|
|
background-color: #434544;
|
|
.item{
|
|
padding: 20rpx 40rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
.pic{
|
|
width: 82rpx;
|
|
height: 82rpx;
|
|
border-radius: 50%;
|
|
}
|
|
.btn{}
|
|
|
|
.title{
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 26rpx;
|
|
color: #D7D7D7;
|
|
.required{
|
|
margin-left: 10rpx;
|
|
color: red;
|
|
}
|
|
}
|
|
.input{
|
|
input{
|
|
text-align: right;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.submet_btn{
|
|
margin: 0 auto;
|
|
margin-top: 40rpx;
|
|
border: 2px solid #25a18b;
|
|
color: #25a18b;
|
|
width: 80%;
|
|
height: 80rpx;
|
|
font-size: 30rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|