https://www.hebeiyifanwood.com/assets/js/unit/activity-info.js

1class ScriptActivityInfo extends Script {
2  constructor(params) {
3    super(params)
4    this.$dom = document.querySelector(`#${this.attrId}`)
5    this.$title = this.$dom.querySelector('.activity-info__title')
6    this.$description = this.$dom.querySelector('.activity-info__description')
7    this.$time = this.$dom.querySelector('.activity-info__time')
8    this.$btn = this.$dom.querySelector('.activity-info__get')
9    this.info = {}
10  }
11  async init() {
12    await this.initData()
13    this.initPage()
14    this.initEvent()
15  }
16  async initData() {
17    let id = window.app.info.page.content_id
18    if (!id) id = location.hash.replace(/\?\S+/g, '').replace('#', '') || 0
19    this.info = await this.getActivityInfo(Number(id))
20  }
21  initPage() {
22    if (this.info.discount_setting) this.$title.innerHTML = this.getDiscountTypeContent(this.info.discount_setting, this.info.usage_amount)
23    if (this.info.description) this.$description.innerHTML = this.info.description
24    if (this.info.time_type && this.info.time_setting) this.$time.innerHTML = this.getTimeTypeContent(this.info.time_type, this.info.time_setting)
25  }
26  initEvent() {
27    this.$btn.addEventListener('click', () => {
28      this.getCoupon()
29    })
30  }
31  /** 时间内容显示不同的时间文案 */
32  getTimeTypeContent(type, setting) {
33    // time_type,1 有开始时间结束时间，2从现在起多少时间有效，3无时间限制
34    let str = ''
35    if (Number(type) === 3) str = window.app.info.utilts.$t('No time limit')
36    else if (Number(type) === 1) {
37      const start_time = setting.start_time
38      const end_time = setting.end_time
39      str = `
40        <span class="activity-info__start">${start_time}</span>
41        <span>-</span>
42        <span class="activity-info__end">${end_time}</span>
43      `
44    } else if (Number(type) === 2) {
45      str = `${window.app.info.utilts.$t('Valid for')} ${setting.day} ${window.app.info.utilts.$t('days after receiving')}`
46    }
47    return str
48  }
49  /** 不同的折扣类型显示不同的标题内容 */
50  getDiscountTypeContent(setting, usage_amount) {
51    //discount_type 打折类型1，打折比率10%，2减金额
52    const type = setting.discount_type
53    const value = setting.discount_value
54    const afterStr = usage_amount ? `${window.app.utilts.$t('for order over')} <span class="active">$${(usage_amount / 100).toFixed(2)}</span>` : ('<span class="active">' + this.utilts.$t('All Orders') + '</span>')
55    let beforeStr = ''
56    if (type === 1) {
57      beforeStr = `${(((1000 - value)) / 10).toFixed(0)}%`
58    } else if (type === 2) {
59      beforeStr = `$${value / 100}`
60    }
61    return `${window.app.utilts.$t('Get')} <span class="active">${beforeStr}</span> ${window.app.utilts.$t('Off')} <br> ${afterStr}`
62  }
63  getActivityInfo(id) {
64    return new Promise((resolve, reject) => {
65      this.utilts.request({
66        url: '/coupon/detail',
67        method: 'GET',
68        params: {
69          id,
70          site_id: window.app.info.site.site_id
71        }
72      })
73        .then(res => {
74          if (!res.data.id) window.location.href = globalThis.Server.getRinseHref('/404', window.app.info.site)
75          resolve(res.data)
76        })
77        .catch(err => {
78          window.location.href = globalThis.Server.getRinseHref('/404', window.app.info.site)
79          reject(err)
80        })
81    })
82  }
83  getCoupon() {
84    if (!window.app.info.user.is_login) {
85      location.href = '/login.html'
86      return
87    }
88    this.utilts.request({
89      url: '/coupon/receive',
90      method: 'POST',
91      params: { id: window.app.info.page.content_id },
92      message: false
93    }).then(res => {
94      if (res.data) {
95        const modal = new Modal().init({
96          title: this.utilts.$t('Congratulations'),
97          content: `${this.utilts.$t('You are got a coupon.')}`,
98          submitText: this.utilts.$t('ok'),
99          isHideCancel: true,
100          onSubmit: () => {
101            modal.destroy()
102          },
103        }).open()
104      }
105    }).catch(res => {
106      new Message().error(res.msg||'error')
107    })
108  }
109  render() {}
110}