import { defineComponent, ref } from "vue";
import styles from "./index.module.less";
import IconTitle from "@/assets/icon-title.png";
import IconDown from "@/assets/icon-down.png";
import { Popup } from "vant";
import { isWeChat } from "@/helpers/utils";

export default defineComponent({
  name: "TheDown",
  setup(props, { emit, expose }) {
    const downLoadApp = (downType: string = 'student') => {
    //   if (isWeChat()) {
    //     alert("请点击右上角,使用浏览器打开");
    //     return;
    //   }

      // 线上地址
      // https://itunes.apple.com/cn/app/id1626971149?mt=8   学院
      // https://itunes.apple.com/cn/app/id1626971695?mt=8   酷乐秀
      // https://appstore.ks3-cn-beijing.ksyuncs.com/clx-student-domain.apk
      // https://appstore.ks3-cn-beijing.ksyuncs.com/clx-teacher-domain.apk

      // 酷乐秀 安卓 DEV：
      // 老师端：https://www.pgyer.com/N2U3https://www.pgyer.com/cooleshow
      // 学生端：https://www.pgyer.com/70e7https://www.pgyer.com/cooleshow_student
      // 测试环境
      // https://www.pgyer.com/powy iOS酷乐秀学生端
      // https://www.pgyer.com/iO0m iOS 酷乐秀老师端
      let urlIos = "";
      let urlAndroid = "";
      let type = downType;
      if (type === "student") {
        urlIos = "https://itunes.apple.com/cn/app/id1626971695?mt=8";
        urlAndroid = "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-student-domain.apk";
      } else if (type === "teacher") {
        urlIos = "https://itunes.apple.com/cn/app/id1626971149?mt=8";
        urlAndroid = "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-teacher-domain.apk";
      }

      if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
        window.location.href = urlIos;
      } else if (/(Android)/i.test(navigator.userAgent)) {
        window.location.href = urlAndroid;
      } else {
        if (type == 'student') {
          window.location.href = 'https://online.colexiu.com/student/#/download'
        } else {
          window.location.href = 'https://online.colexiu.com/student/#/download?type=teacher'
        }
      }
    };

    const show = ref(false);
    const toggle = () => {
      show.value = !show.value;
    };

    expose({
      downLoadApp,
      toggle,
    });

    return () => (
      <div>
        <Popup class={styles.downPoup} v-model:show={show.value}>
          <div class={styles.theDown}>
            <div class={styles.top}>
              <img src={IconTitle} alt="" />
              <span class={styles.title}>下载酷乐秀APP 发现更大的世界</span>
              <img
                style={{ transform: "rotateY(180deg)" }}
                src={IconTitle}
                alt=""
              />
            </div>
            <img class={styles.icon} src={IconDown} />
            <div class={styles.btns}>
              <div class={[styles.btn, styles.down]} onClick={() => downLoadApp()}>
                打开APP
              </div>
              <div
                class={[styles.btn, styles.text]}
                onClick={() => (show.value = false)}
              >
                继续浏览
              </div>
            </div>
          </div>
        </Popup>
      </div>
    );
  },
});
