|
|
|
@ -1,22 +1,30 @@ |
|
|
|
|
<template> |
|
|
|
|
<!-- 赛事管理 --> |
|
|
|
|
<div> |
|
|
|
|
<el-card shadow="hover" class="m-b-20"> |
|
|
|
|
<div class="flex-between"> |
|
|
|
|
<el-page-header @back="back" :content="name + '/管理'"></el-page-header> |
|
|
|
|
</div> |
|
|
|
|
</el-card> |
|
|
|
|
<div class="page" style="margin-bottom: 24px"> |
|
|
|
|
<div class="tabs"> |
|
|
|
|
<a class="item" v-for="(item,index) in tabs" :key="index" :class="{active: index == active}" @click="tabChange(index)">{{ item }}</a> |
|
|
|
|
</div> |
|
|
|
|
<MatchDetail v-if="active == 'tab1'" ref="detail" /> |
|
|
|
|
<MatchArch v-if="active == 'tab2'" /> |
|
|
|
|
<MatchProgress v-else-if="active == 'tab3'" /> |
|
|
|
|
<notice v-else-if="active == 'tab4'" /> |
|
|
|
|
<MatchSignup v-else-if="active == 'tab5'" /> |
|
|
|
|
</div> |
|
|
|
|
<!-- 赛事管理 --> |
|
|
|
|
<div> |
|
|
|
|
<el-card shadow="hover" |
|
|
|
|
class="m-b-20"> |
|
|
|
|
<div class="flex-between"> |
|
|
|
|
<el-page-header @back="back" |
|
|
|
|
:content="name + '/管理'"></el-page-header> |
|
|
|
|
</div> |
|
|
|
|
</el-card> |
|
|
|
|
<div class="page" |
|
|
|
|
style="margin-bottom: 24px"> |
|
|
|
|
<div class="tabs"> |
|
|
|
|
<a class="item" |
|
|
|
|
v-for="(item,index) in tabs" |
|
|
|
|
:key="index" |
|
|
|
|
:class="{active: index == active}" |
|
|
|
|
@click="tabChange(index)">{{ item }}</a> |
|
|
|
|
</div> |
|
|
|
|
<MatchDetail v-if="active == 'tab1'" |
|
|
|
|
ref="detail" /> |
|
|
|
|
<MatchArch v-if="active == 'tab2'" /> |
|
|
|
|
<MatchProgress v-else-if="active == 'tab3'" /> |
|
|
|
|
<notice v-else-if="active == 'tab4'" /> |
|
|
|
|
<MatchSignup v-else-if="active == 'tab5'" /> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
@ -28,100 +36,99 @@ import MatchProgress from "./matchProgress"; |
|
|
|
|
import notice from "./notice"; |
|
|
|
|
import MatchSignup from "./matchSignup"; |
|
|
|
|
export default { |
|
|
|
|
name: "matchManage", |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
name: this.$route.query.name, |
|
|
|
|
active: this.$route.query.tab || "tab1", |
|
|
|
|
tabs: { |
|
|
|
|
tab1: "大赛详情", |
|
|
|
|
tab2: "大赛成绩管理", |
|
|
|
|
tab3: "竞赛进展", |
|
|
|
|
tab4: "公告通知", |
|
|
|
|
tab5: "报名人员" |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
components: { |
|
|
|
|
MatchDetail, |
|
|
|
|
MatchArch, |
|
|
|
|
MatchProgress, |
|
|
|
|
notice, |
|
|
|
|
MatchSignup |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
Setting.dynamicRoute && this.initTabs() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
initTabs() { |
|
|
|
|
const btns = this.$store.state.btns |
|
|
|
|
const tab1 = btns.includes('/match:管理:大赛详情') |
|
|
|
|
const tab2 = btns.includes('/match:管理:大赛成绩管理') |
|
|
|
|
const tab3 = btns.includes('/match:管理:竞赛进展') |
|
|
|
|
const tab4 = btns.includes('/match:管理:公告通知') |
|
|
|
|
const tab5 = btns.includes('/match:管理:报名人员') |
|
|
|
|
name: "matchManage", |
|
|
|
|
data () { |
|
|
|
|
return { |
|
|
|
|
name: this.$route.query.name, |
|
|
|
|
active: this.$route.query.tab || '', |
|
|
|
|
tabs: { |
|
|
|
|
tab1: "大赛详情", |
|
|
|
|
tab2: "大赛成绩管理", |
|
|
|
|
tab3: "竞赛进展", |
|
|
|
|
tab4: "公告通知", |
|
|
|
|
tab5: "报名人员" |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
components: { |
|
|
|
|
MatchDetail, |
|
|
|
|
MatchArch, |
|
|
|
|
MatchProgress, |
|
|
|
|
notice, |
|
|
|
|
MatchSignup |
|
|
|
|
}, |
|
|
|
|
mounted () { |
|
|
|
|
Setting.dynamicRoute && this.initTabs() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
initTabs () { |
|
|
|
|
const btns = this.$store.state.btns |
|
|
|
|
const tab1 = btns.includes('/match:管理:大赛详情') |
|
|
|
|
const tab2 = btns.includes('/match:管理:大赛成绩管理') |
|
|
|
|
const tab3 = btns.includes('/match:管理:竞赛进展') |
|
|
|
|
const tab4 = btns.includes('/match:管理:公告通知') |
|
|
|
|
const tab5 = btns.includes('/match:管理:报名人员') |
|
|
|
|
|
|
|
|
|
tab1 || this.$delete(this.tabs, 'tab1') |
|
|
|
|
tab2 || this.$delete(this.tabs, 'tab2') |
|
|
|
|
tab3 || this.$delete(this.tabs, 'tab3') |
|
|
|
|
tab4 || this.$delete(this.tabs, 'tab4') |
|
|
|
|
tab5 || this.$delete(this.tabs, 'tab5') |
|
|
|
|
tab1 || this.$delete(this.tabs, 'tab1') |
|
|
|
|
tab2 || this.$delete(this.tabs, 'tab2') |
|
|
|
|
tab3 || this.$delete(this.tabs, 'tab3') |
|
|
|
|
tab4 || this.$delete(this.tabs, 'tab4') |
|
|
|
|
tab5 || this.$delete(this.tabs, 'tab5') |
|
|
|
|
|
|
|
|
|
const type = this.$route.query.tab |
|
|
|
|
const keys = Object.keys(this.tabs) |
|
|
|
|
this.active = keys.includes(type) ? type : keys[0] |
|
|
|
|
}, |
|
|
|
|
back() { |
|
|
|
|
this.handleSave(0) && this.backPage() |
|
|
|
|
}, |
|
|
|
|
// 判断是否需要confirm |
|
|
|
|
handleSave(i) { |
|
|
|
|
// 如果是赛事详情,则要判断是否已经保存,未保存则提示是否保存 |
|
|
|
|
if (this.active === 'tab1') { |
|
|
|
|
const { detail } = this.$refs |
|
|
|
|
if (detail) { |
|
|
|
|
const step = detail.$refs['step' + detail.step] |
|
|
|
|
if (detail.step < 4 && step && step.updateTime) { |
|
|
|
|
this.$confirm(`编辑的内容未保存,是否保存并且发布?`, '提示', { |
|
|
|
|
type: 'warning' |
|
|
|
|
}).then(() => { |
|
|
|
|
detail.save(1, 1) |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
}).catch(() => { |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
const type = this.$route.query.tab |
|
|
|
|
const keys = Object.keys(this.tabs) |
|
|
|
|
if (keys.length) this.active = keys.includes(type) ? type : keys[0] |
|
|
|
|
}, |
|
|
|
|
back () { |
|
|
|
|
this.handleSave(0) && this.backPage() |
|
|
|
|
}, |
|
|
|
|
// 判断是否需要confirm |
|
|
|
|
handleSave (i) { |
|
|
|
|
// 如果是赛事详情,则要判断是否已经保存,未保存则提示是否保存 |
|
|
|
|
if (this.active === 'tab1') { |
|
|
|
|
const { detail } = this.$refs |
|
|
|
|
if (detail) { |
|
|
|
|
const step = detail.$refs['step' + detail.step] |
|
|
|
|
if (detail.step < 4 && step && step.updateTime) { |
|
|
|
|
this.$confirm(`编辑的内容未保存,是否保存并且发布?`, '提示', { |
|
|
|
|
type: 'warning' |
|
|
|
|
}).then(() => { |
|
|
|
|
detail.save(1, 1) |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
}).catch(() => { |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
} |
|
|
|
|
return false |
|
|
|
|
}) |
|
|
|
|
} else { |
|
|
|
|
return true |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 返回列表 |
|
|
|
|
backPage(){ |
|
|
|
|
this.$router.push(`/match?page=${this.$store.state.matchPage}&platformSource=${this.$store.state.platformSource}`) |
|
|
|
|
}, |
|
|
|
|
// tab切换 |
|
|
|
|
tabSwitch(i) { |
|
|
|
|
this.active = i |
|
|
|
|
this.$router.push(`/matchManage?id=${this.$route.query.id}&tab=${i}&name=${this.name}`) |
|
|
|
|
}, |
|
|
|
|
// 判断返回还是tab |
|
|
|
|
backOrTab(i) { |
|
|
|
|
i ? this.tabSwitch(i) : this.backPage() |
|
|
|
|
}, |
|
|
|
|
// tab回调 |
|
|
|
|
tabChange(i) { |
|
|
|
|
this.handleSave(i) && this.tabSwitch(i) |
|
|
|
|
} else { |
|
|
|
|
this.backOrTab(i) |
|
|
|
|
} |
|
|
|
|
return false |
|
|
|
|
} else { |
|
|
|
|
return true |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 返回列表 |
|
|
|
|
backPage () { |
|
|
|
|
this.$router.push(`/match?page=${this.$store.state.matchPage}&platformSource=${this.$store.state.platformSource}`) |
|
|
|
|
}, |
|
|
|
|
// tab切换 |
|
|
|
|
tabSwitch (i) { |
|
|
|
|
this.active = i |
|
|
|
|
this.$router.push(`/matchManage?id=${this.$route.query.id}&tab=${i}&name=${this.name}`) |
|
|
|
|
}, |
|
|
|
|
// 判断返回还是tab |
|
|
|
|
backOrTab (i) { |
|
|
|
|
i ? this.tabSwitch(i) : this.backPage() |
|
|
|
|
}, |
|
|
|
|
// tab回调 |
|
|
|
|
tabChange (i) { |
|
|
|
|
this.handleSave(i) && this.tabSwitch(i) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
|
|
|
|
|
|
|
</style> |