flossom-miniapp/src/components/popup/popup-site-swiper.tsx

import classnames from "classnames";
import { Component } from "react";

import {
  Block,
  View,
  Image,
  Text,
  Button,
  PageMeta,
  Swiper,
  SwiperItem,
} from "@tarojs/components";

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

import "./popup.less";
import "./popup-site-swiper.less";

import { go } from "../../utils/traoAPI";

/*** props
 * isLarge            是否大尺寸
 * isShow             是否显示
 * isClose            右上角关闭图标
 * content            弹窗内容
 * confirmButtonText  确定按钮
 * textAlgin          文本对齐 left  right  center
 * data               数据
 * @confirm           关闭回调
 * ***/
export default class PopupSiteSwiper extends Component<any, any> {
  constructor(props) {
    super(props);
    this.state = {
      name: "确认组件",
    };
  }

  async onLoad() {}
  componentDidMount() {}

  componentWillUnmount() {}

  componentDidShow() {}

  componentDidHide() {}

  async initData() {}

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

  onConfirm = () => {
    let { type } = this.props;

    // switch (type) {
    //   case "1": // 未注册
    //     go("/pages/register/register");
    //     break;
    //   case "2": // 登录过期
    //     go("/pages/login/login");
    //     break;
    //   case "3": // 前端提示-关注公众号
    //     break;
    // }
    this.props.confirm();
  };

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

  render() {
    let {
      title,
      content,
      confirmButtonText,
      textAlgin,
      isShow,
      isLarge,
      // type,
    } = this.props;
    return (
      <Block>
        <PageMeta pageStyle={isShow ? "overflow: hidden;" : ""} />
        <Popup
          show={isShow}
          closeOnClickOverlay={false}
          round
          overlayStyle="width: 100vw;padding: 0;"
          onClick={this.onClickStop}
        >
          <View
            className="at-icon at-icon-close common-close"
            onClick={this.onClose}
          ></View>
          <View
            className={classnames("common-box", {
              large: isLarge,
            })}
          >
            {/* <View className="common-popup-title">{title}</View>
            <View className="common-popup-content-box">
              <View
                className={classnames("common-popup-content", {
                  "text-left": textAlgin === "left",
                  "text-right": textAlgin === "right",
                  "text-center": textAlgin === "center",
                })}
              >
                {content}
              </View>
            </View> */}
            {/* <Swiper
              className="absolutely"
              current={current}
              onChange={this.onChange.bind(this)}
              onAnimationFinish={this.onFinish.bind(this)}
              duration={800}
              indicatorDots={true}
              indicatorColor="#999"
              indicatorActiveColor="#333"
            >
              {welcomeList.map((item, index) => {
                return (
                  <SwiperItem
                    className="absolutely"
                    onClick={this.onClickSwiperItem.bind(this)}
                    key={"swiper_" + index}
                  >
                    <View
                      className="body FadeInFrame fadein"
                      style={{
                        top: menu.top + "px",
                        height: "calc(" + (100 % -menu.height) + "px)",
                        display: current === index ? "block" : "none",
                      }}
                    >
                      <View>
                        <Image
                          className="cover"
                          src={item.image}
                          mode="aspectFill"
                        ></Image>
                      </View>
                      <View className="bottom-card">
                        <View className="text slide-left">{item.title}</View>
                        <View className="txt slide-left">{item.desc}</View>
                      </View>
                    </View>
                  </SwiperItem>
                );
              })}
            </Swiper> */}

            <View className="common-popup-btns">
              <Button className="common-popup-btn" onClick={this.onConfirm}>
                {confirmButtonText}
              </Button>
            </View>
          </View>
        </Popup>
      </Block>
    );
  }
}