@ -17,7 +17,7 @@
< template v-if ="form.competitionScope === 2" > < template v-if ="form.competitionScope === 2" >
< div class = "select-wrap" > < div class = "select-wrap" >
< span class = "label" > 省份 < / span > < span class = "label" > 省份 < / span >
< el -select size = "small" v-model ="form.provinceId" @change="getCity" > < el -select size = "small" v-model ="form.provinceId" clearable @change="getCity" >
< el -option label = "请选择" value = "" > < / e l - o p t i o n > < el -option label = "请选择" value = "" > < / e l - o p t i o n >
< el -option < el -option
v - for = "(item,index) in provinces" v - for = "(item,index) in provinces"
@ -29,7 +29,7 @@
< / div > < / div >
< div class = "select-wrap" > < div class = "select-wrap" >
< span class = "label" > 城市 < / span > < span class = "label" > 城市 < / span >
< el -select size = "small" v-model ="form.cityId" @change="initData" > < el -select size = "small" v-model ="form.cityId" clearable @change="initData" >
< el -option label = "请选择" value = "" > < / e l - o p t i o n > < el -option label = "请选择" value = "" > < / e l - o p t i o n >
< el -option < el -option
v - for = "(item,index) in cities" v - for = "(item,index) in cities"
@ -57,7 +57,7 @@
< li v-for ="(item,index) in listData" :key="index" @click="toDetail(item)" > < li v-for ="(item,index) in listData" :key="index" @click="toDetail(item)" >
< div class = "left" > < div class = "left" >
< div class = "cover" > < div class = "cover" >
< img :src ="item.coverUrl "alt = "" > < img : src = "item.coverUrl || 'https://huoran.oss-cn-shenzhen.aliyuncs.com/20220623/png/1539857403162943488.png' "alt = "" >
< / div > < / div >
< div class = "info" > < div class = "info" >
< div class = "title" > { { item . competitionName } } < / div > < div class = "title" > { { item . competitionName } } < / div >
@ -100,8 +100,7 @@
@ click . stop = "signup(item)" > { { statusList [ item . status ] } } < / p > @ click . stop = "signup(item)" > { { statusList [ item . status ] } } < / p >
< p class = "end-text" v-if ="item.status != 5" > < p class = "end-text" v-if ="item.status != 5" >
距离 { { endList [ item . status ] } } 还有 距离 { { endList [ item . status ] } } 还有
< template v-if ="item.end > 0" > < em > { { item . end } } < / em > 天 < / template > < em > { { item . end } } < / em >
< em v -else v-countdown ="index" > {{ item.end }} < / em >
< / p > < / p >
< / div > < / div >
< / li > < / li >
@ -129,9 +128,8 @@
< / template > < / template >
< script > < script >
import { mapAc tions } from "vuex" ; import { mapMuta tions } from "vuex" ;
import { Loading } from "element-ui" ; import { Loading } from "element-ui" ;
import bus from "@/libs/bus" ;
import Setting from "@/setting" import Setting from "@/setting"
import util from "@/libs/util" import util from "@/libs/util"
@ -139,6 +137,7 @@ export default {
name : "match" , name : "match" ,
data ( ) { data ( ) {
return { return {
timer : null ,
token : util . local . get ( Setting . tokenKey ) , token : util . local . get ( Setting . tokenKey ) ,
way : 2 , way : 2 ,
statusList : [ "等待报名" , "已报名" , "立即报名" , "报名截止" , "比赛中" , "已结束" ] , statusList : [ "等待报名" , "已报名" , "立即报名" , "报名截止" , "比赛中" , "已结束" ] ,
@ -163,9 +162,13 @@ export default {
provinceId : '' , provinceId : '' ,
cityId : '' , cityId : '' ,
sequence : '' , sequence : '' ,
competitionScope : 1 , / / 大 赛 范 围 ( 0 : 本 校 内 1 : 全 平 台 2 . 指 定 区 域 、 院 校 ) competitionScope : '' , / / 大 赛 范 围 ( 0 : 本 校 内 1 : 全 平 台 2 . 指 定 区 域 、 院 校 )
} , } ,
scopes : [ scopes : [
{
id : '' ,
name : '不限'
} ,
{ {
id : 1 , id : 1 ,
name : '全平台' name : '全平台'
@ -197,81 +200,8 @@ export default {
contestIds : [ ] , contestIds : [ ] ,
isFirst : true , isFirst : true ,
timerList : [ ] , timerList : [ ] ,
defaultBanner : '../../../assets/img/info-banner.png' ,
} ; } ;
} , } ,
directives : {
countdown : {
bind : function ( el , binding , vnode ) {
let that = vnode . context ;
let item = that . listData [ binding . value ] ;
let time = "" ;
let second = 1000 ;
let minute = second * 60 ;
let hour = minute * 60 ;
let now = new Date ( ) . getTime ( ) ;
let signUpStartTime = new Date ( that . core . dateCompatible ( item . signUpStartTime ) ) . getTime ( ) ; / / 报 名 开 始 时 间
let signUpEndTime = new Date ( that . core . dateCompatible ( item . signUpEndTime ) ) . getTime ( ) ; / / 报 名 结 束 时 间
let playStartTime = new Date ( that . core . dateCompatible ( item . playStartTime ) ) . getTime ( ) ; / / 比 赛 开 始 时 间
let playEndTime = new Date ( that . core . dateCompatible ( item . playEndTime ) ) . getTime ( ) ; / / 比 赛 结 束 时 间
switch ( item . status ) {
/ / s t a t u s 每 个 值 的 解 释 请 看 g e t D a t a 方 法
case 0 :
if ( now > signUpStartTime ) {
item . status = 1 ;
} else {
time = signUpStartTime - now ;
}
break ;
case 1 :
if ( now > signUpEndTime ) {
item . status = 3 ;
} else {
time = signUpEndTime - now ;
}
break ;
case 2 :
if ( now > signUpEndTime ) {
item . status = 3 ;
} else {
time = signUpEndTime - now ;
}
break ;
case 3 :
if ( now > playStartTime ) {
item . status = 4 ;
} else {
time = playStartTime - now ;
}
break ;
case 4 :
if ( now > playEndTime ) {
item . status = 5 ;
} else {
time = playEndTime - now ;
}
break ;
}
time = ` ${ Math . floor ( time / hour ) } : ${ Math . floor ( time % hour / minute ) } : ${ Math . floor ( time % hour % minute / second ) } ` ;
let timer = setInterval ( ( ) => {
let timeList = time . split ( ":" ) ;
let total = Number . parseInt ( timeList [ 0 ] * 60 * 60 ) + Number . parseInt ( timeList [ 1 ] * 60 ) + Number . parseInt ( timeList [ 2 ] ) ;
if ( total > 0 ) {
-- total ;
let hours = Math . floor ( total / ( 60 * 60 ) ) ;
let minutes = Math . floor ( total % ( 60 * 60 ) / 60 ) ;
let seconds = Math . floor ( total % ( 60 * 60 ) % 60 ) ;
time = ` ${ that . core . formateTime ( hours ) } : ${ that . core . formateTime ( minutes ) } : ${ that . core . formateTime ( seconds ) } ` ;
} else {
clearInterval ( timer ) ;
}
el . innerHTML = time ;
} , 1000 ) ;
that . timerList . push ( timer ) ;
}
}
} ,
watch : { watch : {
keyword : function ( val ) { keyword : function ( val ) {
clearTimeout ( this . searchTimer ) ; clearTimeout ( this . searchTimer ) ;
@ -283,75 +213,88 @@ export default {
mounted ( ) { mounted ( ) {
this . getProvince ( ) this . getProvince ( )
this . getData ( ) this . getData ( )
this . $once ( "hook:beforeDestroy" , function ( ) { this . $once ( 'hook:beforeDestroy' , function ( ) {
this . timerList . forEach ( ( n , k ) => { clearInterval ( this . timer )
clearInterval ( n ) ; } )
} ) ;
this . timerList = [ ] ;
} ) ;
} , } ,
methods : { methods : {
... mapActions ( "match" , [ ... mapMutations ( 'match' , [
"setMatchId" , "setMatchSignupStatus" 'SET_SOURCE'
] ) , ] ) ,
async getData ( ) { getList ( ) {
this . loadIns = Loading . service ( ) const { form } = this
const { token , form } = this const scope = form . competitionScope
const scope = form . competitionScope const data = {
this . $post ( this . api . contestPageConditionQueryByOccupationlabStu , { pageNum : this . page ,
pageNum : this . page , pageSize : this . pageSize ,
pageSize : this . pageSize , platformSource : 1 , / / 大 赛 来 源 ( 0 中 台 ， 1 职 站 )
platformSource : 1 , / / 大 赛 来 源 ( 0 中 台 ， 1 职 站 ) cityId : scope === 2 ? ( form . cityId || null ) : null , / / 选 择 了 全 平 台 则 不 用 传 省 市 i d
competitionScope : scope , provinceId : scope === 2 ? ( form . provinceId || null ) : null ,
cityId : scope === 2 ? ( form . cityId || null ) : null , / / 选 择 了 全 平 台 则 不 用 传 省 市 i d sequence : form . sequence || null ,
provinceId : scope === 2 ? ( form . provinceId || null ) : null , keyWord : this . keyword
sequence : form . sequence || null , }
keyWord : this . keyword if ( scope ) data . competitionScope = scope
} ) . then ( ( { data } ) => { this . $post ( this . api . contestPageConditionQueryByOccupationlabStu , data ) . then ( ( { data } ) => {
this . listData = data . records this . listData = data . records
this . totals = data . total this . totals = data . total
let time = 60 * 60 * 1000 * 24 ; const second = 1000 ;
this . listData . forEach ( ( n , k ) => { const minute = second * 60 ;
/ / 报 名 时 间 、 比 赛 时 间 处 理 const hour = minute * 60 ;
let now = new Date ( ) . getTime ( ) ; this . listData . forEach ( ( n , k ) => {
let signUpStartTime = new Date ( this . core . dateCompatible ( n . signUpStartTime ) ) . getTime ( ) ; / / 报 名 开 始 时 间 / / 报 名 时 间 、 比 赛 时 间 处 理
let signUpEndTime = new Date ( this . core . dateCompatible ( n . signUpEndTime ) ) . getTime ( ) ; / / 报 名 结 束 时 间 let now = new Date ( ) . getTime ( ) ;
let playStartTime = new Date ( this . core . dateCompatible ( n . playStartTime ) ) . getTime ( ) ; / / 比 赛 开 始 时 间 let signUpStartTime = new Date ( this . core . dateCompatible ( n . signUpStartTime ) ) . getTime ( ) ; / / 报 名 开 始 时 间
let playEndTime = new Date ( this . core . dateCompatible ( n . playEndTime ) ) . getTime ( ) ; / / 比 赛 结 束 时 间 let signUpEndTime = new Date ( this . core . dateCompatible ( n . signUpEndTime ) ) . getTime ( ) ; / / 报 名 结 束 时 间
let playStartTime = new Date ( this . core . dateCompatible ( n . playStartTime ) ) . getTime ( ) ; / / 比 赛 开 始 时 间
/ / w h e t h e r T o S i g n U p 0 已 报 名 ， 1 未 报 名 let playEndTime = new Date ( this . core . dateCompatible ( n . playEndTime ) ) . getTime ( ) ; / / 比 赛 结 束 时 间
if ( now < signUpStartTime ) { / / 报 名 没 开 始 let total = 0
n . status = 0 ; / / w h e t h e r T o S i g n U p 0 已 报 名 ， 1 未 报 名
n . end = Math . floor ( ( signUpStartTime - now ) / time ) ; if ( now < signUpStartTime ) { / / 报 名 没 开 始
} else if ( now > signUpStartTime && now < signUpEndTime ) { / / 报 名 进 行 中 n . status = 0 ;
n . status = ( ! token || n . whetherToSignUp ) ? 2 : 1 / / 1 已 报 名 ， 2 立 即 报 名 ( 未 登 录 ， 或 者 w h e t h e r T o S i g n U p = 1 ， 则 显 示 立 即 报 名 ) total = signUpStartTime - now
n . end = Math . floor ( ( signUpEndTime - now ) / time ) ; } else if ( now > signUpStartTime && now < signUpEndTime ) { / / 报 名 进 行 中
} else if ( now > signUpEndTime && now < playStartTime ) { / / 报 名 结 束 了 , 但 比 赛 没 开 始 n . status = n . whetherToSignUp ? 2 : 1 / / 1 已 报 名 ， 2 立 即 报 名
n . status = 3 ; total = signUpEndTime - now
n . end = Math . floor ( ( playStartTime - now ) / time ) ; } else if ( now > signUpEndTime && now < playStartTime ) { / / 报 名 结 束 了 , 但 比 赛 没 开 始
} else if ( now > playStartTime && now < playEndTime ) { / / 比 赛 进 行 中 n . status = 3 ;
n . status = 4 ; total = playStartTime - now
n . end = Math . floor ( ( playEndTime - now ) / time ) ; } else if ( now > playStartTime && now < playEndTime ) { / / 比 赛 进 行 中
} else if ( now > playEndTime ) { / / 比 赛 结 束 n . status = 4 ;
n . status = 5 ; total = playEndTime - now
} } else if ( now > playEndTime ) { / / 比 赛 结 束
n . status = 5 ;
}
if ( total > 0 ) {
const day = Math . floor ( total / ( 60 * 60 * 1000 * 24 ) )
const time = ` ${ this . core . formateTime ( Math . floor ( total / hour ) ) } : ${ this . core . formateTime ( Math . floor ( total % hour / minute ) ) } : ${ this . core . formateTime ( Math . floor ( total % hour % minute / second ) ) } `
n . end = day ? day + '天' : time
}
/ / 比 赛 范 围 / / 比 赛 范 围
const list = n . contestRangeRespList const list = n . contestRangeRespList
if ( list ) { if ( list ) {
const range = [ ] const range = [ ]
list . map ( e => { list . map ( e => {
range . push ( e . type ? ( e . provinceName || e . cityName ) : e . schoolName ) range . push ( e . type ? ( e . provinceName || e . cityName ) : e . schoolName )
} ) } )
n . ranges = ` ${ n . range } （ ${ range . join ( '，' ) } ） ` n . ranges = ` ${ n . range } （ ${ range . join ( '，' ) } ） `
} else { } else {
n . ranges = n . range n . ranges = n . range
} }
} ) ; } ) ;
this . loadIns . close ( ) this . loadIns . close ( )
} ) . catch ( res => { } ) . catch ( res => {
this . loadIns . close ( ) this . loadIns . close ( )
} ) } )
} ,
getData ( ) {
this . loadIns = Loading . service ( )
this . getList ( )
if ( ! Setting . isDev ) {
clearInterval ( this . timer )
this . timer = setInterval ( this . getList , 1000 )
}
} , } ,
initData ( ) { initData ( ) {
this . page = 1 this . page = 1
@ -367,12 +310,14 @@ export default {
getCity ( ) { getCity ( ) {
const { form } = this const { form } = this
form . cityId = '' form . cityId = ''
this . $get ( this . api . queryCity , { form . provinceId ?
provinceId : form . provinceId this . $get ( this . api . queryCity , {
} ) . then ( ( { list } ) => { provinceId : form . provinceId
this . cities = list } ) . then ( ( { list } ) => {
this . cities = list
this . initData ( )
} ) . catch ( res => { } ) :
this . initData ( ) this . initData ( )
} ) . catch ( res => { } )
} , } ,
changeType ( type ) { changeType ( type ) {
this . way = type ; this . way = type ;
@ -389,10 +334,7 @@ export default {
this . initData ( ) this . initData ( )
} , } ,
toDetail ( item ) { toDetail ( item ) {
let status = item . status == 1 ? ( item . signup ? true : false ) : "hide" ; this . $router . push ( ` /touristMatch/details?id= ${ item . id } &status= ${ item . status } &end= ${ item . end } ` ) ;
this . setMatchId ( item . id ) ;
this . setMatchSignupStatus ( status ) ;
this . $router . push ( ` /touristMatch/details?status= ${ item . status } &end= ${ item . end } ` ) ;
} , } ,
handleCurrentChange ( val ) { handleCurrentChange ( val ) {
this . page = val ; this . page = val ;
@ -401,7 +343,7 @@ export default {
signup ( item ) { signup ( item ) {
/ / 如 果 没 登 录 ， 提 示 去 登 录 / / 如 果 没 登 录 ， 提 示 去 登 录
if ( item . status == 2 ) { if ( item . status == 2 ) {
if ( this . token ) { if ( util . local . get ( Setting . tokenKey ) ) {
this . $post ( this . api . addApplicant , { this . $post ( this . api . addApplicant , {
contestId : item . id contestId : item . id
} ) . then ( res => { } ) . then ( res => {
@ -412,6 +354,7 @@ export default {
this . $confirm ( '请先登录，是否直接前往登录？' , "提示" , { this . $confirm ( '请先登录，是否直接前往登录？' , "提示" , {
type : 'success' type : 'success'
} ) . then ( ( ) => { } ) . then ( ( ) => {
this . SET _SOURCE ( )
this . $router . push ( '/login' ) this . $router . push ( '/login' )
} ) . catch ( ( ) => { } ) } ) . catch ( ( ) => { } )
} }
@ -492,6 +435,9 @@ export default {
. label { . label {
margin - right : 10 px ; margin - right : 10 px ;
} }
. el - select {
width : 130 px ;
}
} }
. list - inner { . list - inner {
display : flex ; display : flex ;
