/*
 * @Date: 2022-06-22 00:07:42
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2023-06-21 15:58:52
 * @FilePath: /huizhu/src/composables/useLogin.js
 * @Description: 登录流程封装（验证码发送、表单校验、提交登录）
 */
import { bLoginAPI } from '@/api/B/login'
import { useRouter } from 'vue-router'
import { wxInfo } from '@/utils/tools';
import { ref } from 'vue'
import { useCountDown } from '@vant/use';
import { smsAPI } from '@/api/common'
import { showSuccessToast, showFailToast } from 'vant';

/**
 * 登录逻辑组合式函数
 * - 主要用于 B 端登录（历史代码）
 * @returns {Object} 页面所需的响应式状态与方法集合
 */
export const useLogin = () => {
  const phone = ref('');
  const code = ref('')

  const refForm = ref(null);
  /**
   * 校验表单并触发提交
   * @returns {void}
   */
  const validateForm = () => {
    const valid = refForm.value.validate();
    valid
      .then(() => {
        refForm.value.submit();
      })
      .catch(error => {
        console.error(error);
        showFailToast('请检查后再次提交');
      })
  }

  /**
   * 判断微信环境看是否弹出控件框
   * 桌面微信直接输入
   * 其他环境弹出输入框
   */
  let use_widget = ref(true);
  use_widget.value = !!(wxInfo().isiOS || wxInfo().isAndroid);

  /**
   * 手机号码校验
   * 函数返回 true 表示校验通过，false 表示不通过
   * @param {string} val 输入值
   * @returns {boolean} 是否校验通过
   */
  const sms_disabled = ref(false);
  const phoneValidator = (val) => {
    let flag = false;
    // 简单判断手机号位数
    if (/1\d{10}/.test(val) && phone.value.length === 11) {
      sms_disabled.value = false;
      flag = true;
    } else {
      sms_disabled.value = true;
      flag = false;
    }
    return flag
  };

  /**
   * 手机号数字弹框
   */
  const keyboard_show = ref(false);
  const refPhone = ref(null)
  /**
   * 弹出数字键盘
   * @returns {void}
   */
  const showKeyboard = () => { // 弹出数字弹框
    keyboard_show.value = true;
  };
  /**
   * 数字键盘失焦回调
   * - 关闭键盘并触发手机号校验
   * @returns {void}
   */
  const keyboardBlur = () => { // 数字键盘失焦回调
    keyboard_show.value = false;
    refPhone.value.validate();
  };

  // 设置发送短信倒计时
  // TAG: vant 自带倒计时函数
  const limitSeconds = ref(60000); // 配置倒计时秒数
  const countDown = useCountDown({ // 配置倒计时
    time: limitSeconds.value,
    onFinish: () => {
      countDown.reset();
    }
  });

  /**
   * 发送验证码
   * - 启动倒计时，避免频繁触发
   * @returns {Promise<void>}
   */
  const sendCode = async () => { // 发送验证码
    countDown.start();
    // 验证码接口
    const { code } = await smsAPI({ phone: phone.value });
    if (code) {
      showSuccessToast('发送成功');
    }
  };

  // 过滤输入的数字 只能四位
  /**
   * 限制验证码输入长度（最多 4 位）
   * @param {string} value 输入值
   * @returns {string} 截断后的值
   */
  const smsFormatter = (value) => value.substring(0, 4);

  /**
   * 用户登录
   * @param {{ phone: string, code: string }} values 表单值
   * @returns {Promise<void>}
   */
  const $router = useRouter();
  const onSubmit = async (values) => {
    const { code } = await bLoginAPI({ phone: values.phone, pin: values.code })
    if (code) {
      $router.push({
        path: '/business/index'
      });
    }
  };

  return {
    phone,
    code,
    onSubmit,
    use_widget,
    sms_disabled,
    phoneValidator,
    keyboardBlur,
    keyboard_show,
    showKeyboard,
    refPhone,
    refForm,
    validateForm,
    smsFormatter,
    limitSeconds,
    countDown,
    sendCode,
  }
}