import { browser } from '@/helpers/utils'
import { Button, Toast } from 'vant'
import { defineComponent } from 'vue'
import styles from './index.module.less'
import request from '@/helpers/request'

export const getAssetsHomeFile = (fileName: string) => {
  const path = `./images/${fileName}`
  const modules = import.meta.globEager('./images/*')
  return modules[path].default
}

export default defineComponent({
  name: 'download',
  data() {
    const query = this.$route.query
    return {
      type: query.type || 'student',
      androidUrl: '',
      wxStatus: false
    }
  },
  async mounted() {
    let platform = 'android-student'
    if (this.type === 'student') {
      platform = 'android-student'
      document.title = '酷乐秀下载'
    } else if (this.type === 'teacher') {
      platform = 'android-teacher'
      document.title = '酷乐秀学院下载'
    }

    try {
      const { data } = await request.get(
        '/api-student/open/appVersionInfo/queryLatestByPlatform',
        {
          params: {
            platform,
            status: 'history'
          }
        }
      )
      this.androidUrl = data.downloadUrl
    } catch {
      //
    }
  },
  methods: {
    downLoadApp() {
      if (browser().weixin) {
        this.wxStatus = true
        return
      }

      // 线上地址
      // https://itunes.apple.com/cn/app/id1626971149?mt=8   学院
      // https://itunes.apple.com/cn/app/id1626971695?mt=8   酷乐秀

      // 酷乐秀 安卓 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 = ''
      if (location.origin.indexOf('online.colexiu.com') > -1) {
        if (this.type === 'student') {
          urlIos = 'https://itunes.apple.com/cn/app/id1626971695?mt=8'
          urlAndroid = this.androidUrl // 'https://oss.dayaedu.com/appstore/clx-student-domain.apk'
        } else if (this.type === 'teacher') {
          urlIos = 'https://itunes.apple.com/cn/app/id1626971149?mt=8'
          urlAndroid = this.androidUrl // 'https://oss.dayaedu.com/appstore/clx-teacher-domain.apk'
        }
      } else {
        if (this.type === 'student') {
          urlIos = 'https://www.pgyer.com/powy'
          urlAndroid = this.androidUrl // 'https://www.pgyer.com/70e7'
        } else {
          urlIos = 'https://www.pgyer.com/iO0m'
          urlAndroid = this.androidUrl // 'https://www.pgyer.com/N2U3'
        }
      }

      if (
        browser().ios ||
        /(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)
      ) {
        window.location.href = urlIos
        // if (this.type == 'student') {
        //   window.location.href =
        //     'https://itunes.apple.com/cn/app/id1626971695?mt=8'
        // } else if (this.type == 'teacher') {
        //   window.location.href =
        //     'https://itunes.apple.com/cn/app/id1626971149?mt=8'
        // }
      } else {
        window.location.href = urlAndroid
      }
    }
  },
  render() {
    return (
      <div class={styles.downContainer}>
        <div class={styles.logo}>
          {this.type === 'student' ? (
            <img src={getAssetsHomeFile('logo.png')} alt="" />
          ) : (
            <img src={getAssetsHomeFile('teacher_logo.png')} alt="" />
          )}
        </div>
        <div class={styles.down}>
          <Button type="primary" round plain onClick={this.downLoadApp}>
            点击下载App
          </Button>
        </div>
        <div class={styles.mainImg}>
          {this.type === 'student' ? (
            <img src={getAssetsHomeFile('student_bg.png')} alt="" />
          ) : (
            <img src={getAssetsHomeFile('teacher_bg.png')} alt="" />
          )}
        </div>

        {this.wxStatus && (
          <div
            class={styles.wxpopup}
            onClick={() => {
              this.wxStatus = false
            }}
          >
            <img src={getAssetsHomeFile('wx_bg.png')} alt="" />
          </div>
        )}
      </div>
    )
  }
})
