✨ feat: 用户资料页面API联调

 <!--
  * @Date: 2022-09-29 16:32:03
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-10-21 18:18:46
+ * @LastEditTime: 2022-10-24 16:48:30
  * @FilePath: /swx/src/pages/userInfo/index.vue
  * @Description: 用户资料
 -->
 <template>
   <view class="user-info-page">
-    <view class="bg-header">
+    <view id="top-header" class="bg-header">
       <view style="height: 4rem; padding: 1rem;">
         <van-row>
           <van-col span="17">
@@ -49,61 +49,49 @@
       </view>
     </view>
     <view class="list-wrapper" style="margin: 1rem;">
-      <view style="background-color: white; border-radius: 0.65rem; padding: 1rem;overflow: auto; margin-bottom: 1px;">
+      <view id="list-header" style="background-color: white; border-radius: 0.65rem; padding: 1rem;overflow: auto; margin-bottom: 1px;">
         <view style="display: inline-block; margin-right: 1rem; line-height: 60rpx;">
           <view class="bg-gradient" style="font-size: 1.15rem;">陪伴记录</view>
         </view>
-        <view @tap="show_status_popup=true" style="float: right; color: #FFFFFF; font-size: 0.9rem; border-radius: 1rem; padding: 0.3rem 1rem 0.3rem 1rem; background-color: #199A74;">
-          &nbsp;{{ status_type === '' ? '全部' : status_type }}&nbsp;&nbsp;
+        <view @tap="show_partner_popup=true" style="float: right; color: #FFFFFF; font-size: 0.9rem; border-radius: 1rem; padding: 0.3rem 1rem 0.3rem 1rem; background-color: #199A74;">
+          &nbsp;{{ partner === '' ? '全部' : partner }}&nbsp;&nbsp;
           <van-icon :name="icon_sel3" size="0.8rem" color="" style="vertical-align: middle;" />
         </view>
         <view style="float: right; margin-top: 0.25rem;">
           陪伴者：
         </view>
       </view>
-      <view>
-        <view style="background-color: white; padding: 1rem; border-radius: 1rem; margin-bottom: 1rem;">
+      <view id="partner-list">
+        <view v-for="(item, index) in partner_list" :key="index" style="background-color: white; padding: 1rem; border-radius: 1rem; margin-bottom: 1rem;">
           <view style="overflow: auto;">
             <view style="float: left; font-size: 1.15rem;">
-              <text style="color: #999999;">状态：</text><text style="color: #199A74;">跟进</text>
+              <text style="color: #999999;">状态：</text><text style="color: #199A74;">{{ item.status }}</text>
             </view>
             <view style="float: right; margin-top: 0.2rem; font-size: 0.9rem; color: #222222;">
-              净弘 2022-08-11 14:22
+              {{ item.created_by_name }} {{ formatDate(item.created_time) }}
             </view>
           </view>
           <view style="margin-top: 1rem;">
-            对比上次净妙这次参与活动明显的能够融入进去了，与其他学员间的交流也比较多了，期待越来越好！
-          </view>
-        </view>
-        <view style="background-color: white; padding: 1rem; border-radius: 1rem; margin-bottom: 1rem;">
-          <view style="overflow: auto;">
-            <view style="float: left; font-size: 1.15rem;">
-              <text style="color: #999999;">状态：</text><text style="color: #199A74;">跟进</text>
-            </view>
-            <view style="float: right; margin-top: 0.2rem; font-size: 0.9rem; color: #222222;">
-              净弘 2022-08-11 14:22
-            </view>
-          </view>
-          <view style="margin-top: 1rem;">
-            对比上次净妙这次参与活动明显的能够融入进去了，与其他学员间的交流也比较多了，期待越来越好！
+            {{ item.note }}
           </view>
         </view>
       </view>
+      <view style="height: 6rem;"></view>
     </view>
-    <view style="height: 2rem;"></view>
     <bottom-button @on-submit="onSubmit">添加记录</bottom-button>
 
   </view>
 
   <!-- 切换状态弹出框 -->
-  <van-popup :show="show_status_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
-    <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="status_type_columns"
-      toolbar-class="picker-toolbar" @confirm="onStatusTypeConfirm" @cancel="onStatusTypeCancel" @change="onStatusTypeChange" />
+  <van-popup :show="show_partner_popup" position="bottom" custom-style="height: 50%;" :lock-scroll="true">
+    <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="partner_columns"
+      :default-index="partner_index"
+      toolbar-class="picker-toolbar" @confirm="onPartnerConfirm" @cancel="onPartnerCancel" />
   </van-popup>
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, getCurrentInstance, onMounted } from "vue";
 import icon_vip from '@/images/icon/vip@2x.png'
 import Taro from '@tarojs/taro'
 import { AtAvatar } from 'taro-ui-vue3'
@@ -112,31 +100,16 @@ import icon_join from '@/images/icon/baoming@2x.png'
 import icon_sel3 from '@/images/icon/sel03@2x.png'
 import bottomButton from "@/components/bottom-button";
 
-const show_status_popup = ref(false);
-const status_type = ref('');
-const status_type_columns = ref(['净弘']);
-const onStatusTypeChange = (event) => {
-  const { picker, value, index } = event.detail;
-}
-const onStatusTypeConfirm = (event) => {
-  const { picker, value, index } = event.detail;
-  show_status_popup.value = false;
-  status_type.value = value;
-  console.warn('查询新数据');
-}
-const onStatusTypeCancel = (event) => {
-  show_status_popup.value = false;
-}
-
+const internalInstance = getCurrentInstance();
 const editInfo = (val) => {
   Taro.navigateTo({
-    url: '../editInfo/index'
+    url: '../editInfo/index?member_id=' + getCurrentPageParam().member_id + '&host_id=' + internalInstance.data.host_id
   })
 }
 
 const onSubmit = (val) => {
   Taro.navigateTo({
-    url: '../addRecord/index'
+    url: '../addRecord/index?id=' + internalInstance.data.id + '&host_id=' + internalInstance.data.host_id + '&name=' + JSON.stringify(internalInstance.data.name)
   })
 }
 </script>
@@ -145,9 +118,12 @@ const onSubmit = (val) => {
 import "./index.less";
 import { infoMemberAPI } from '@/api/Member/index';
 import { getCurrentPageParam } from "@/utils/weapp";
+import mixin from '@/utils/mixin';
+import * as dayjs from 'dayjs'
 
 export default {
   name: "userInfoPage",
+  mixins: [mixin.init],
   data () {
     return {
       avatar: '',
@@ -155,6 +131,16 @@ export default {
       reg_count: '',
       age_group: '',
       gender: '',
+      id: '',
+      host_id: '',
+      phone: '',
+      partner_list: [],
+      partner_user_list: [],
+      show_partner_popup: false,
+      partner: '',
+      partner_id: '',
+      partner_columns: [],
+      partner_index: 0
     }
   },
   async onShow () {
@@ -165,6 +151,38 @@ export default {
       this.reg_count = data.reg_count;
       this.age_group = data.member.age_group;
       this.gender = data.member.gender === 'man' ?  '男士' : '女士';
+      this.id = data.member.id;
+      this.host_id = data.member.host_id;
+      this.phone = data.member.phone;
+      this.partner_list = data.partner_list;
+      // 生成陪伴者显示列表
+      const user_list = [];
+      data.partner_user_list.forEach(item => {
+        user_list.push({
+          text: item.name,
+          key: item.user_id,
+        })
+      });
+      this.partner_columns = [{ text: '全部', key: '' }, ...user_list];
+    }
+  },
+  methods: {
+    async onPartnerConfirm (event) {
+      const { picker, value, index } = event.detail;
+      this.show_partner_popup = false;
+      this.partner_id = value.key;
+      this.partner = value.text;
+      //
+      const { code, data } = await infoMemberAPI({ i: getCurrentPageParam().member_id, created_by: this.partner_id });
+      if (code) {
+        this.partner_list = data.partner_list;
+      }
+    },
+    onPartnerCancel (event) {
+      this.show_partner_popup = false;
+    },
+    formatDate (date) {
+      return dayjs(date).format('YYYY-MM-DD HH:mm')
     }
   }
 };