import classnames from "classnames";
import { Component } from "react";
import Taro from "@tarojs/taro";

import { Block, View, Button, PageMeta } from "@tarojs/components";

// import { Popup } from "@antmjs/vantui";

import PopupConfirm from "./popup-confirm";
import PopupAlert from "./popup-alert";

import "./popup.less";

/*** props
 * isLarge            是否大尺寸
 * isShow             是否显示
 * isClose            右上角关闭图标
 * type               确认弹窗类型 10你需要完成注册 11 是否绑定 12是否换绑 13您选择的仪器有误，请重新确认  21序列号库仍在更新，请联系微信助手
 * title              弹窗标题
 * content            弹窗内容
 * cancelButtonText  取消按钮
 * confirmButtonText  确定按钮
 * textAlgin          文本对齐 left  right  center
 * @close             关闭回调
 * @confirm           确定回调
 * ***/
export default class PopupBinding extends Component<any, any> {
  constructor(props) {
    super(props);
    this.state = {
      name: "确认组件",
    };
  }

  async onLoad() {}
  componentDidMount() {}

  componentWillUnmount() {}

  componentDidShow() {
    // 是否已授权隐私
    // if (Taro.getStorageSync("isconfirmPopup") !== "true") {
    //   // this.setState({
    //   //   showconfirmPopup: true,
    //   // });
    //   this.props.closeconfirm();
    // }
  }

  componentDidHide() {}

  async initData() {}

  onClose = () => {
    this.props.close();
  };
  onConfirm = () => {
    this.props.confirm();
  };

  onConfirm2 = () => {
    this.props.confirm();
  };

  onClickStop = (e) => {
    e.stopPropagation();
  };

  render() {
    let {
      title,
      data,
      isExchangeBinding,
      content,
      cancelButtonText,
      confirmButtonText,
      isShow,
      isRegisterBoolean,
      isClose,
      isLarge,
      type,
    } = this.props;

    // let serial = Taro.getStorageSync("serial");
    // let isSerial = String(serial) === String(data.serial) ? true : false;

    // let isDuplicateName = false;
    // if (instrumentList.length) {
    //   let instrumentNameIndex = instrumentList.findIndex(
    //     (item) => item.instrumentName === data.instrumentName
    //   );
    //   if (instrumentNameIndex > -1) {
    //     isDuplicateName = true;
    //   }
    // }

    return (
      <Block>
        <PageMeta pageStyle={isShow ? "overflow: hidden;" : ""} />

        {!isRegisterBoolean && (
          <PopupAlert
            isShow={isShow}
            title="提示"
            content={
              <Block>
                <View>仪器：{data.instrumentName}</View>
                <View style="margin-top:20rpx">序列号：{data.serial}</View>
                <View style="margin-top:20rpx">
                  您需要完成注册登录才能进行仪器绑定
                </View>
              </Block>
            }
            confirmButtonText="知道了"
            textAlgin="center"
            isClose={false}
            close={this.onClose}
            confirm={this.onConfirm}
          ></PopupAlert>
        )}

        {isRegisterBoolean &&
          (type === 1 || type === 2) &&
          !isExchangeBinding && (
            <PopupConfirm
              isShow={isShow}
              isClose={false}
              title="提示"
              content={
                <Block>
                  <View className={classnames("text-center")}>
                    <View>仪器：{data.instrumentName}</View>
                    <View style="margin-top:20rpx">序列号：{data.serial}</View>
                    <View style="margin-top:20rpx">
                      请问是否确认绑定该仪器？
                    </View>
                  </View>
                </Block>
              }
              confirmButtonText="确认"
              cancelButtonText="暂不绑定"
              close={this.onClose}
              confirm={this.onConfirm}
            ></PopupConfirm>
          )}
        {isRegisterBoolean &&
          (type === 1 || type === 2) &&
          isExchangeBinding && (
            <PopupConfirm
              isShow={isShow}
              isClose={false}
              title="提示"
              content={
                <Block>
                  <View className={classnames("text-center")}>
                    <View>仪器：{data.instrumentName}</View>
                    <View style="margin-top:20rpx">序列号：{data.serial}</View>
                    <View style="margin-top:20rpx">
                      <View>检测到您的序列号与扫码序列号不一致，</View>
                      <View>是否进行换绑操作？</View>
                    </View>
                  </View>
                </Block>
              }
              confirmButtonText="确认"
              cancelButtonText="暂不换绑"
              close={this.onClose}
              confirm={this.onConfirm}
            ></PopupConfirm>
          )}
      </Block>
    );
  }
}
