import { WCUserLogin } from "../../utils/Interface";
import { Component, PropsWithChildren, useEffect, useState } from "react";
import Taro from "@tarojs/taro";
// 引入 Swiper, SwiperItem 组件
import { Block, View, Text, Image, Input, Button } from "@tarojs/components";

/*** redux ***/
import { connect } from "react-redux";
import { setMobile } from "../../store/features/userInfo";
/*** redux end ***/

import "taro-ui/dist/style/components/button.scss"; // 按需引入
import "./login.less";

class Login extends Component<any, any> {
  constructor(props) {
    super(props);
    this.state = {
      name: "重新登录",
    };
  }

  async onLoad() {}
  componentDidMount() {}

  componentWillUnmount() {}

  componentDidShow() {}

  componentDidHide() {}

  async initData() {}

  WCUserLogin = async () => {
    const { code } = await Taro.login();
    const { data } = await WCUserLogin({ code });
    if (data.code === 200) {
      Taro.setStorageSync("token", data.data.token);
      this.props.setMobile(data.data.mobile);
      Taro.switchTab({
        url: "/pages/index/index",
      });
    }
  };

  render() {
    return (
      <Block>
        <Image
          src="https://oss.flossom.com/miniapp/img/logo.png"
          mode="widthFix"
        ></Image>
        <View className="submitbtn" onClick={this.WCUserLogin}>
          <Image
            src="https://oss.flossom.com/miniapp/img/btn_bg.png"
            mode="widthFix"
          ></Image>
          <View className="btn">重新登录</View>
        </View>
      </Block>
    );
  }
}

const mapStateToProps = (state) => ({
  mobile: state.userInfo.mobile,
});
const mapDispatchToProps = (dispatch) => ({
  setMobile(value) {
    dispatch(setMobile(value));
  },
});
export default connect(mapStateToProps, mapDispatchToProps)(Login);