<!--
 * @Date: 2022-09-30 09:53:14
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2022-10-24 16:44:07
 * @FilePath: /swx/src/pages/addRecord/index.vue
 * @Description: 文件描述
-->
<template>
  <view style="padding: 1rem;">
    <view 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>
    <view style="background-color: #FFFFFF; padding-bottom: 2rem; border-radius: 1rem;">
      <!-- <AtInput disabled :border="true" title="用户名" type='text' placeholder='请输入姓名' v-model:value="username" /> -->
      <view class="at-input" style="margin-right: 1rem;">
        <view class="at-input__container">
          <label class="h5-label at-input__title at-input__title">用户名</label>
          <input class="h5-input at-input__input" placeholder-class="placeholder" :placeholder="username" :disabled="true"/>
        </view>
      </view>
      <view class="at-input" style="margin-right: 1rem;">
        <view class="at-input__container">
          <label class="h5-label at-input__title at-input__title">陪伴状态</label>
          <input @tap="show_popup=true" class="h5-input at-input__input" placeholder-class="placeholder" :value="user_status" placeholder="请选择陪伴状态" :disabled="true"/>
          <view style="margin-right: 0; margin-top: 0.5rem;"><van-icon :name="icon_sel" color="" /></view>
        </view>
      </view>
      <van-field :value="note" label-class="label-class" input-class="input-class" label="跟进内容" type="textarea"
      placeholder="请输入跟进记录详情" placeholder-style="color: #CCC; font-size: 1.05rem;" :autosize="{ maxHeight: 300, minHeight: 150 }" customStyle="" inputAlign=""
      rightIcon="" :required="false" :border="false" @change="onChange" />
    </view>
  </view>
  <bottom-button @on-submit="onSubmit">保存</bottom-button>

  <!-- 陪伴状态弹出框 -->
  <van-popup :show="show_popup" position="bottom" custom-style="height: 50%;" :lock-scroll="true">
    <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="columns" toolbar-class="picker-toolbar"
      @confirm="onConfirm" @cancel="onCancel" />
  </van-popup>

  <van-toast id="van-toast" />

</template>

<script setup>
import { ref, onMounted } from "vue";
import icon_sel from '@/images/icon/sel@2x.png'
import bottomButton from "@/components/bottom-button";
import Taro from '@tarojs/taro'
import { hostInfoAPI } from '@/api/Host/index';
import { getCurrentPageParam } from "@/utils/weapp";
import { DEFAULT_HOST_STATUS } from '@/utils/sysData'
import { addPartnerAPI } from '@/api/Partner/index';
import Toast from '@/components/vant-weapp/toast/toast';

const username = JSON.parse(getCurrentPageParam().name);
const columns = ref(DEFAULT_HOST_STATUS);
onMounted(async () => {
  const { code, data } = await hostInfoAPI({ i: getCurrentPageParam().host_id });
  if (code) {
    columns.value = columns.value.concat(data.user_status);
  }
});

const onSubmit = async () => {
  if (!user_status.value) {
    Toast.fail('陪伴状态为空');
    return false;
  }
  if (!note.value) {
    Toast.fail('跟进内容为空');
    return false;
  }
  const params = {
    member_id: getCurrentPageParam().id,
    status: user_status.value,
    note: note.value
  }
  const { code, data } = await addPartnerAPI(params);
  if (code) {
    Toast.success('添加成功');
    Taro.navigateBack();
  }
}

const show_popup = ref(false);
const user_status = ref('');
const note = ref('');
const onChange = (event) => {
  note.value = event.detail;
}
const onConfirm = (event) => {
  const { picker, value, index } = event.detail;
  user_status.value = value;
  show_popup.value = false;
}
const onCancel = (event) => {
  show_popup.value = false;
}
</script>

<script>
import "./index.less";
import mixin from '@/utils/mixin';

export default {
  name: "addRecordPage",
  mixins: [mixin.init],
};
</script>