import {login} from '@apis';
import {useMutation} from '@tanstack/react-query';
import {useEffect, useState} from 'react';
import {showToast} from '@tarojs/taro';
import {useStore} from 'zustand';
import {userStore} from '@stores';

export function useFields(visible) {
  const [files, setFields] = useState({userName: '', password: ''});

  function onChange(key) {
    return function (val) {
      setFields(prev => ({...prev, [key]: val}));
    };
  }

  useEffect(
    function () {
      visible && setFields({userName: '', password: ''});
    },
    [visible],
  );

  return [files, onChange];
}

export function useLogin(userName, password, {onClose}) {
  const setUser = useStore(userStore, state => state.init);
  const {isLoading, mutate} = useMutation({
    mutationFn: login,
    onSuccess(data) {
      if (data.code === '200') {
        const userData = {
          userName: data.data.userName,
          power: data.data.power,
        };

        onClose();
        showToast({title: '登录成功', icon: 'success'});
        setUser(userData);
      }
    },
  });

  function onClick() {
    if (!userName) {
      return showToast({title: '请输入用户名', mask: true, icon: 'error'});
    }
    if (!password) {
      return showToast({title: '请输入密码', mask: true, icon: 'error'});
    }
    mutate({userName, password});
  }

  return [isLoading, onClick];
}