import ColSticky from '@/components/col-sticky' import request from '@/helpers/request' import { browser, removeAuth } from '@/helpers/utils' import { postMessage } from '@/helpers/native-message' import { Button, Cell, CellGroup, Dialog, Image, Notify, Popup, Toast } from 'vant' import { defineComponent } from 'vue' import styles from './index.module.less' import logo from '@/common/images/logo.png' import { shareCall } from '@/teacher/share-page/share' import { getRandomKey } from '@/views/music/music' import qs from 'query-string' import dayjs from 'dayjs' import { orderStatus } from '@/views/order-detail/orderStatus' import { difficulty } from '@/constant' import { state } from '@/state' import iconTeacher from '@/common/images/icon_teacher.png' export const getAssetsHomeFile = (fileName: string) => { const path = `./images/${fileName}` const modules = import.meta.globEager('./images/*') return modules[path].default } export default defineComponent({ name: 'track-review-activity', data() { const query = this.$route.query return { id: query.id, recomUserId: query.recomUserId || '', // 推荐人id activeInfo: {} as any, popupStatus: false, wxStatus: false, behaviorId: getRandomKey(), selectMusic: {} as any, hiddenProperty: null as any } }, computed: { rankingMethod() { const activeInfo: any = this.activeInfo return activeInfo.rankingMethod || '' }, activityMusic() { const activeInfo: any = this.activeInfo const list = activeInfo.rankingMethod === 'TOTAL_SCORE' ? activeInfo.subjectInfos : activeInfo.activityMusicVoList return list || [] }, // 用户是否有中选的曲子 userSelectMusic() { let status = false this.activityMusic.forEach((item: any) => { if (item.join === 1) { status = true } }) return status }, // this.activeInfo.activityRewardList rewardList() { const activeInfo: any = this.activeInfo let list = activeInfo.activityRewardList || [] if (list && list.length > 0) { if (activeInfo.rankingMethod === 'TOTAL_SCORE') { list = [list] } else { const last = list.sort((a: any, b: any) => { return Number(a.group) < Number(b.group) ? -1 : 1 }) list = this.groupBy(last, (item: any) => { return [item.group] }) } } // console.log(list) return list || [] } }, async mounted() { await this.getMusicInfo() // 判断是否在内容打开页面 if (!browser().isApp) { // this.popupStatus = true // removeAuth() // return } else if (state.platformType === 'TEACHER') { this.onBackDialog('请使用酷乐秀学生端扫码打开') return } else { console.log(this.hiddenProperty, 'hidden property') this.hiddenProperty = 'hidden' in document ? 'hidden' : 'webkitHidden' in document ? 'webkitHidden' : 'mozHidden' in document ? 'mozHidden' : null const visibilityChangeEvent = this.hiddenProperty.replace( /hidden/i, 'visibilitychange' ) document.addEventListener(visibilityChangeEvent, this.onVisibilityChange) } // 判断活动状态的活动时间 this.checkActivityTime() }, unmounted() { if (this.hiddenProperty) { const visibilityChangeEvent = this.hiddenProperty.replace( /hidden/i, 'visibilitychange' ) document.removeEventListener( visibilityChangeEvent, this.onVisibilityChange ) } }, methods: { groupBy(array: any, f: any) { const groups = {} array.forEach(o => { //注意这里必须是forEach 大写 const group = JSON.stringify(f(o)) groups[group] = groups[group] || [] groups[group].push(o) }) return Object.keys(groups).map(function (group) { return groups[group] }) }, onVisibilityChange() { if (!document[this.hiddenProperty]) { this.getMusicInfo() } }, async getMusicInfo() { try { const res = await request.post( '/api-student/open/activity/info/' + this.id ) this.activeInfo = res.data document.title = this.activeInfo.activityName } catch { // } }, checkActivityTime() { // 判断活动状态的活动时间 try { const activeInfo = this.activeInfo if (activeInfo.activityState !== 1) { Dialog.alert({ message: '活动已结束,感谢你的关注!', theme: 'round-button', confirmButtonColor: '#2dc7aa' }) this.onBackDialog('活动已结束,感谢你的关注!') return false } const nowTime = dayjs() const startTime = dayjs(activeInfo.activityStart) const endTime = dayjs(activeInfo.activityEnd) if (dayjs(nowTime).isBefore(dayjs(startTime))) { this.onBackDialog('活动尚未开始,请您耐心等待!') return false } else if (!dayjs(nowTime).isBefore(dayjs(endTime))) { this.onBackDialog('活动已结束,感谢你的关注!') return false } return true } catch { // } }, onBackDialog(str: string) { Dialog.alert({ message: str, theme: 'round-button', confirmButtonColor: '#2dc7aa' }).then(() => { postMessage({ api: 'back' }) }) }, async onJoinActve() { if (!browser().isApp) { this.popupStatus = true removeAuth() return } const activeInfo = this.activeInfo try { if (!this.checkActivityTime()) { return } if (activeInfo.registrationMethod === 'CHARGE') { // 判断是否有待支付订单 const res = await request.post( '/api-student/userOrder/getPendingOrder', { data: { goodType: 'ACTI_REGIST', bizId: activeInfo.id } } ) // 判断是否是收费活动 orderStatus.orderObject.orderType = 'ACTI_REGIST' orderStatus.orderObject.orderName = activeInfo.activityName orderStatus.orderObject.orderDesc = activeInfo.activityName orderStatus.orderObject.actualPrice = activeInfo.registrationPrice orderStatus.orderObject.orderNo = res.data?.orderNo || '' orderStatus.orderObject.recomUserId = this.recomUserId orderStatus.orderObject.orderList = [ { orderType: 'ACTI_REGIST', goodsName: activeInfo.activityName, activityId: activeInfo.id, actualPrice: activeInfo.registrationPrice, recomUserId: this.recomUserId } ] this.$router.push({ path: '/orderDetail', query: { orderType: 'ACTI_REGIST', activityId: activeInfo.id } }) } else { await request.post( `/api-student/activity/joinActivity/${activeInfo.id}` ) // 成功通知 setTimeout(() => { Toast('报名成功') }, 300) // Notify({ type: 'success', message: '报名成功' }) this.getMusicInfo() } } catch { // } }, async onOpenMusic() { try { const selectMusic = this.selectMusic let evaluationId = '' // 判断是否是总分评测 if (this.rankingMethod === 'TOTAL_SCORE') { // 直接取第一首曲目的评测编号 const activityMusicVoList = this.activeInfo.activityMusicVoList || [] activityMusicVoList.forEach(item => { console.log(item, selectMusic) if (item.subjectId == selectMusic.subjectId && !evaluationId) { evaluationId = item.evaluationId } }) } else { evaluationId = selectMusic.evaluationId } if (selectMusic.join !== 1) { await request.post(`/api-student/activity/evaluation/${evaluationId}`) this.selectMusic.join = 1 } this.popupStatus = false if (this.rankingMethod === 'TOTAL_SCORE') { this.$router.push({ path: '/track-song', query: { subjectId: selectMusic.subjectId, id: this.id } }) return } const browserInfo = browser() const url = qs.stringifyUrl({ url: location.origin + '/accompany', query: { id: selectMusic.musicSheetId, behaviorId: this.behaviorId, client: browserInfo.isTeacher ? 'teacher' : 'student', setting: JSON.stringify({ mode: 'EVALUATING', resets: ['SPEED'], difficulty: this.activeInfo.evaluationDifficulty, feeType: 'FREE', submitData: { evaluationId: this.selectMusic.evaluationId } }) } }) postMessage({ api: 'openAccompanyWebView', content: { url, orientation: 0, isHideTitle: true, statusBarTextColor: false, isOpenLight: true } }) } catch { // } }, onOpenApp() { // if (!browser().isApp) { if (browser().weixin) { this.wxStatus = true return } // 如果不在app里面则不需要唤起操作 const { origin } = location const str = origin + `/student/#/track-review-activity?id=${this.id}&recomUserId=${this.recomUserId}` shareCall(str, {}) // 不管有没有唤起,则跳转到下载页面 setTimeout(() => { window.location.href = location.origin + '/student/#/download' }, 3000) } else { this.popupStatus = false } } }, render() { return (

活动时间: {dayjs(this.activeInfo.activityStart).format( 'YYYY-MM-DD' )} ~ {dayjs(this.activeInfo.activityEnd).format('YYYY-MM-DD')}

活动介绍
{this.activeInfo.describe}

活动奖品 this.$router.push({ path: '/leaderboard', query: { id: this.id } }) } > 查看挑战排行榜

{this.rewardList.map((item: any, index: number) => ( <>
{this.rankingMethod === 'TOTAL_SCORE' ? (
总评测分数达到 {this.activeInfo.rankingScore || 0} 分即可获奖
) : ( <> {index === 0 && ( )} {index === 1 && ( )} {index === 2 && ( )} 第{++index}名奖品 )}
{item.map((child: any) => (
{child.rewardName}
{child.rewardDescribe}
))}
))}

活动{this.rankingMethod === 'TOTAL_SCORE' ? '声部' : '曲目'} {this.rankingMethod === 'TOTAL_SCORE' ? ( { this.$router.push({ path: '/track-subject-song', query: { id: this.id } }) }} > 查看曲目 ) : ( 共{this.activityMusic.length || 0}首曲目 )}

{this.activityMusic.map((item: any) => ( ( ), title: () => ( {this.rankingMethod === 'TOTAL_SCORE' ? item.subjectName : item.musicSheetName} ), value: () => ( { this.$router.push({ path: '/track-subject-song', query: { id: this.id, subjectId: item.subjectId } }) }} > {this.rankingMethod === 'TOTAL_SCORE' ? `共${item.musicNums}首活动曲目` : item.musicSubject} ) }} /> (

{item.userId ? item.score : '--'}

), title: () => (
{item.userId ? ( <> ) : (
)}
{item.userId ? ( <>

{item.username}

{this.rankingMethod !== 'TOTAL_SCORE' && (

{item.userSubject}

)} ) : ( 虚位以待 )}
) }} >
))}
活动规则
{this.activeInfo.ruleDescribe}
{this.activeInfo.join !== 1 && (
)}
提示 (this.popupStatus = false)} />
{browser().isApp ? ( <> {this.rankingMethod === 'TOTAL_SCORE' ? ( <>

确定要参加 {this.selectMusic.subjectName} (声部)的比拼吗?

每位用户仅可选择一个声部参与挑战哦!

) : ( <>

确定要参加{this.selectMusic.musicSheetName} 评测 {difficulty[this.activeInfo.evaluationDifficulty]} 的比拼吗?

每位用户仅可选择一首曲目的一个难度哦!

)} ) : (

请在酷乐秀APP内打开活动链接!

)}
{browser().isApp ? (
) : (
)}
{this.wxStatus && (
{ this.wxStatus = false }} >
)}
) } })