From 3e39f6178465a8f4543d72afd7ed26bb64590803 Mon Sep 17 00:00:00 2001
From: liutong <836164388@qq.com>
Date: Thu, 13 Mar 2025 18:00:23 +0800
Subject: [PATCH] =?UTF-8?q?feat(coach):=20=E5=AE=8C=E5=96=84=E6=95=99?=
 =?UTF-8?q?=E7=BB=83=E4=B8=AA=E4=BA=BA=E4=BF=A1=E6=81=AF=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加头像修改功能
- 实现姓名、邮箱、手机、微信等信息的输入
- 增加性别和生日的选择器
- 优化页面布局和提示文本
---
 pages/coach/my/info.vue | 225 +++++++++++++++++++++++++++++-----------
 1 file changed, 165 insertions(+), 60 deletions(-)

diff --git a/pages/coach/my/info.vue b/pages/coach/my/info.vue
index d1ab9c6..5145f01 100644
--- a/pages/coach/my/info.vue
+++ b/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
+        })
+      }
+    },
+
+    //性别选择相关
+    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;
       }
-      this.formData[res.inputName]=_inputValue
-      // console.log('接收AQ上传回调xxx1',res)
-      // console.log('接收AQ上传回调xxx2',this.formData.member_store_certification_arr)
+      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>