|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="page">
|
|
|
|
|
<div class="page-content">
|
|
|
|
|
<div class="p-title">大赛信息</div>
|
|
|
|
|
<el-form label-width="170px"
|
|
|
|
|
label-suffix=":"
|
|
|
|
|
size="small"
|
|
|
|
|
:disabled="!editing && form.id !== ''">
|
|
|
|
|
<el-form-item label="竞赛封面（选填）">
|
|
|
|
|
<el-upload class="avatar-uploader"
|
|
|
|
|
accept=".jpg,.png,.jpeg,.gif"
|
|
|
|
|
:on-remove="handleRemove"
|
|
|
|
|
:on-error="uploadError"
|
|
|
|
|
:before-remove="beforeRemove"
|
|
|
|
|
:limit="1"
|
|
|
|
|
:on-exceed="handleExceed"
|
|
|
|
|
action=""
|
|
|
|
|
:http-request="handleRequest">
|
|
|
|
|
<img v-if="form.coverUrl"
|
|
|
|
|
:src="form.coverUrl"
|
|
|
|
|
class="avatar">
|
|
|
|
|
<div class="uploader-default"
|
|
|
|
|
v-else>
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<p>上传封面</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="tip"
|
|
|
|
|
class="el-upload__tip">
|
|
|
|
|
<p>展示宽度为220，高度140，JPG/PNG/GIF，3MB以内</p>
|
|
|
|
|
</div>
|
|
|
|
|
</el-upload>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="竞赛封面长图（选填）">
|
|
|
|
|
<el-upload class="avatar-uploader avatar-uploader-lg"
|
|
|
|
|
accept=".jpg,.png,.jpeg,.gif"
|
|
|
|
|
:on-remove="handleLgRemove"
|
|
|
|
|
:on-error="uploadError"
|
|
|
|
|
:before-remove="beforeRemove"
|
|
|
|
|
:limit="1"
|
|
|
|
|
:on-exceed="handleExceed"
|
|
|
|
|
action=""
|
|
|
|
|
:http-request="handleRequestLg">
|
|
|
|
|
<img v-if="form.carouselUrl"
|
|
|
|
|
:src="form.carouselUrl"
|
|
|
|
|
class="avatar-lg">
|
|
|
|
|
<div class="uploader-default"
|
|
|
|
|
v-else>
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<p>上传封面</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="tip"
|
|
|
|
|
class="el-upload__tip">
|
|
|
|
|
<p>展示宽度为1920，高度300，JPG/PNG/GIF，3MB以内</p>
|
|
|
|
|
</div>
|
|
|
|
|
</el-upload>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="竞赛名称">
|
|
|
|
|
<div class="d-inline-block">
|
|
|
|
|
<el-input placeholder="请输入竞赛名称"
|
|
|
|
|
v-model="form.name"
|
|
|
|
|
clearable></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="主办方">
|
|
|
|
|
<div class="inline-input">
|
|
|
|
|
<div class="input-wrap"
|
|
|
|
|
v-for="(item,index) in sponsorList"
|
|
|
|
|
:key="index">
|
|
|
|
|
<el-input placeholder="主办方名称"
|
|
|
|
|
v-model="sponsorList[index]"></el-input>
|
|
|
|
|
<i v-if="sponsorList.length > 1"
|
|
|
|
|
class="remove"
|
|
|
|
|
@click="delSponsor(index)"></i>
|
|
|
|
|
<button v-if="index == 0"
|
|
|
|
|
class="add-btn"
|
|
|
|
|
type="button"
|
|
|
|
|
:disabled="!editing && form.id !== ''"
|
|
|
|
|
@click="addSponsor">
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<span>添加</span>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="承办方（选填）">
|
|
|
|
|
<div class="inline-input">
|
|
|
|
|
<div class="input-wrap"
|
|
|
|
|
v-for="(item,index) in undertakerList"
|
|
|
|
|
:key="index">
|
|
|
|
|
<el-input placeholder="承办方名称"
|
|
|
|
|
v-model="undertakerList[index]"></el-input>
|
|
|
|
|
<i v-if="undertakerList.length > 1"
|
|
|
|
|
class="remove"
|
|
|
|
|
@click="delOrganizer(index)"></i>
|
|
|
|
|
<button v-if="index == 0"
|
|
|
|
|
class="add-btn"
|
|
|
|
|
type="button"
|
|
|
|
|
:disabled="!editing && form.id !== ''"
|
|
|
|
|
@click="addOrganizer">
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<span>添加</span>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<button v-if="!undertakerList.length"
|
|
|
|
|
class="add-btn"
|
|
|
|
|
type="button"
|
|
|
|
|
@click="addOrganizer">
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
<span>添加</span>
|
|
|
|
|
</button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="报名时间">
|
|
|
|
|
<el-date-picker v-model="signupTime"
|
|
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
|
|
type="datetimerange"
|
|
|
|
|
range-separator="-"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
:picker-options="pickerOptions"></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="竞赛时间">
|
|
|
|
|
<el-date-picker v-model="playTime"
|
|
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
|
|
type="datetimerange"
|
|
|
|
|
range-separator="-"
|
|
|
|
|
start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期"
|
|
|
|
|
:picker-options="pickerOptions"></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="比赛范围">
|
|
|
|
|
<div v-if="form.id">
|
|
|
|
|
<el-radio v-model="form.competitionScope"
|
|
|
|
|
:label="0"
|
|
|
|
|
disabled>本校内</el-radio>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-radio v-model="form.competitionScope"
|
|
|
|
|
:label="1">全平台</el-radio>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-radio v-model="form.competitionScope"
|
|
|
|
|
:label="2">指定区域、院校</el-radio>
|
|
|
|
|
<el-button v-if="form.competitionScope === 2"
|
|
|
|
|
type="primary"
|
|
|
|
|
size="mini"
|
|
|
|
|
@click="showRange">选择院校</el-button>
|
|
|
|
|
<span style="margin-left: 20px">{{ rangeName }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="竞赛类型">
|
|
|
|
|
<el-radio v-model="form.completeCompetitionSetup.competitionType"
|
|
|
|
|
:label="0">个人赛</el-radio>
|
|
|
|
|
<el-radio v-model="form.completeCompetitionSetup.competitionType"
|
|
|
|
|
:label="1">团队赛</el-radio>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
v-if="!form.completeCompetitionSetup.competitionType"
|
|
|
|
|
label="报名人数上限">
|
|
|
|
|
<div class="input-center">
|
|
|
|
|
<el-input placeholder="请输入人数"
|
|
|
|
|
v-model.number="form.completeCompetitionSetup.quantityLimit"
|
|
|
|
|
type="number"></el-input> 人
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<template v-if="form.completeCompetitionSetup.competitionType">
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="报名团队数上限">
|
|
|
|
|
<div class="input-center">
|
|
|
|
|
<el-input placeholder="请输入团队数"
|
|
|
|
|
v-model.number="form.completeCompetitionSetup.quantityLimit"
|
|
|
|
|
type="number"></el-input> 队
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="团队人数">
|
|
|
|
|
<div class="input-center"
|
|
|
|
|
style="width: 250px;">
|
|
|
|
|
<el-input v-model.number="form.completeCompetitionSetup.minTeamSize"
|
|
|
|
|
type="number"></el-input> 至
|
|
|
|
|
<el-input style="margin-left: 5px;"
|
|
|
|
|
v-model.number="form.completeCompetitionSetup.maxTeamSize"
|
|
|
|
|
type="number"></el-input> 人/队
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</template>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="报名邀请码">
|
|
|
|
|
<div class="input-center"
|
|
|
|
|
style="width: 550px;">
|
|
|
|
|
<el-radio v-model="form.completeCompetitionSetup.isNeedCode"
|
|
|
|
|
:label="0">不需要</el-radio>
|
|
|
|
|
<el-radio v-model="form.completeCompetitionSetup.isNeedCode"
|
|
|
|
|
:label="1">需要</el-radio>
|
|
|
|
|
<el-input style="width: 250px"
|
|
|
|
|
placeholder="请输入4位邀请码或点击随机生成"
|
|
|
|
|
v-model="form.completeCompetitionSetup.invitationCode"
|
|
|
|
|
:disabled="form.completeCompetitionSetup.isNeedCode === 0"></el-input>
|
|
|
|
|
<el-button v-if="form.completeCompetitionSetup.isNeedCode === 1"
|
|
|
|
|
@click="randomInv">随机</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item class="req"
|
|
|
|
|
label="竞赛详情">
|
|
|
|
|
<quill v-if="quillShow"
|
|
|
|
|
:border="true"
|
|
|
|
|
v-model="form.description"
|
|
|
|
|
:height="400"
|
|
|
|
|
:readonly="!editing && form.id !== ''" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="附件">
|
|
|
|
|
<Upload :limit="5"
|
|
|
|
|
:file-list.sync="fileList"
|
|
|
|
|
:on-remove="handleAnnexRemove"
|
|
|
|
|
@onSuccess="uploadAnnexSuccess" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-dialog title="请勾选院校"
|
|
|
|
|
:visible.sync="rangeVisible"
|
|
|
|
|
width="580px"
|
|
|
|
|
custom-class="range-dia"
|
|
|
|
|
:close-on-click-modal="false">
|
|
|
|
|
<div class="range-wrap">
|
|
|
|
|
<el-cascader ref="range"
|
|
|
|
|
class="range-cas"
|
|
|
|
|
key="range"
|
|
|
|
|
v-model="range"
|
|
|
|
|
:props="props"
|
|
|
|
|
:show-all-levels="false"
|
|
|
|
|
clearable
|
|
|
|
|
filterable
|
|
|
|
|
:before-filter="beforeFilter"
|
|
|
|
|
:options="rangeList"
|
|
|
|
|
@change="rangeChange"
|
|
|
|
|
@visible-change="rangeViChange"
|
|
|
|
|
@input.native="rangeSearch"></el-cascader>
|
|
|
|
|
<el-tag v-for="(tag, i) in rangeChecked"
|
|
|
|
|
:key="tag.value"
|
|
|
|
|
class="range-check"
|
|
|
|
|
closable
|
|
|
|
|
:disable-transitions="false"
|
|
|
|
|
@close="val => closeRange(i)">
|
|
|
|
|
{{tag.label}}
|
|
|
|
|
</el-tag>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<span slot="footer"
|
|
|
|
|
class="dialog-footer">
|
|
|
|
|
<el-button size="small"
|
|
|
|
|
@click="rangeVisible = false">取 消</el-button>
|
|
|
|
|
<el-button size="small"
|
|
|
|
|
type="primary"
|
|
|
|
|
@click="rangeSubmit">确 定</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import util from "@/libs/util";
|
|
|
|
|
import quill from "@/components/quill";
|
|
|
|
|
import Upload from '@/components/upload';
|
|
|
|
|
import Oss from '@/components/upload/upload.js'
|
|
|
|
|
export default {
|
|
|
|
|
props: ['editing'],
|
|
|
|
|
data () {
|
|
|
|
|
const that = this
|
|
|
|
|
return {
|
|
|
|
|
form: {
|
|
|
|
|
id: this.$route.query.id || '',
|
|
|
|
|
platformSource: 0, // 平台来源(0:中台，1：职站)
|
|
|
|
|
ztOpen: 0, // 中台是否开启(0开启 1未开启 默认0)
|
|
|
|
|
name: '',
|
|
|
|
|
sponsor: '',
|
|
|
|
|
undertaker: '',
|
|
|
|
|
competitionScope: 1, // 大赛范围(0:本校内 1:全平台 2:指定区域、院校)
|
|
|
|
|
competitionRangeList: [], // 大赛范围选择
|
|
|
|
|
competitionAnnexList: [], // 赛事附件
|
|
|
|
|
coverUrl: '',
|
|
|
|
|
carouselUrl: '',
|
|
|
|
|
publishStatus: 0,
|
|
|
|
|
signUpStartTime: '',
|
|
|
|
|
signUpEndTime: '',
|
|
|
|
|
playStartTime: '',
|
|
|
|
|
playEndTime: '',
|
|
|
|
|
description: '',
|
|
|
|
|
releaseType: 0,
|
|
|
|
|
completeCompetitionSetup: {
|
|
|
|
|
competitionType: 0,
|
|
|
|
|
invitationCode: '',
|
|
|
|
|
isNeedCode: 0,
|
|
|
|
|
maxTeamSize: '',
|
|
|
|
|
minTeamSize: '',
|
|
|
|
|
quantityLimit: '',
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
fileName: '',
|
|
|
|
|
signupTime: [],
|
|
|
|
|
playTime: [],
|
|
|
|
|
sponsorList: [""],
|
|
|
|
|
undertakerList: [""],
|
|
|
|
|
fileList: [],
|
|
|
|
|
pickerOptions: {
|
|
|
|
|
disabledDate: time => {
|
|
|
|
|
return this.$route.query.id ? false : time.getTime() < new Date().getTime() - 86400000
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
rangeVisible: false,
|
|
|
|
|
range: [],
|
|
|
|
|
rangeInit: [],
|
|
|
|
|
rangeName: '',
|
|
|
|
|
rangeChecked: [],
|
|
|
|
|
schools: [],
|
|
|
|
|
rangeList: [],
|
|
|
|
|
rangeTimer: null,
|
|
|
|
|
// 选择区域懒加载
|
|
|
|
|
props: {
|
|
|
|
|
multiple: true,
|
|
|
|
|
checkStrictly: true,
|
|
|
|
|
lazy: true,
|
|
|
|
|
lazyLoad (node, resolve) {
|
|
|
|
|
// 如果是在模糊搜索中，则不再用懒加载请求数据
|
|
|
|
|
const input = document.querySelector('.el-cascader__search-input')
|
|
|
|
|
const checked = that.rangeChecked
|
|
|
|
|
|
|
|
|
|
if (input && input.value.trim()) {
|
|
|
|
|
const val = input.value.trim()
|
|
|
|
|
return that.schools.filter(e => e.label.includes(val))
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const { level, value } = node
|
|
|
|
|
// 省份
|
|
|
|
|
if (!level) {
|
|
|
|
|
that.$get(that.api.queryProvince).then(({ list }) => {
|
|
|
|
|
const data = []
|
|
|
|
|
list.map(e => {
|
|
|
|
|
e.value = e.provinceId
|
|
|
|
|
e.label = e.provinceName
|
|
|
|
|
e.children = []
|
|
|
|
|
e.disabled = !!checked.find(n => n.provinceId == e.provinceId && !n.cityId)
|
|
|
|
|
data.push(e)
|
|
|
|
|
})
|
|
|
|
|
resolve(data)
|
|
|
|
|
}).catch(res => { })
|
|
|
|
|
} else if (level === 1) {
|
|
|
|
|
// 城市
|
|
|
|
|
that.$get(that.api.queryCity, {
|
|
|
|
|
provinceId: value
|
|
|
|
|
}).then(({ list }) => {
|
|
|
|
|
const data = []
|
|
|
|
|
list.map(e => {
|
|
|
|
|
e.value = e.cityId
|
|
|
|
|
e.label = e.cityName
|
|
|
|
|
e.children = []
|
|
|
|
|
e.disabled = !!checked.find(n => n.cityId == e.cityId && n.provinceId == e.provinceId && !n.schoolId)
|
|
|
|
|
data.push(e)
|
|
|
|
|
})
|
|
|
|
|
resolve(data)
|
|
|
|
|
}).catch(res => { })
|
|
|
|
|
} else if (level === 2) {
|
|
|
|
|
// 学校
|
|
|
|
|
that.$get(that.api.getSchoolsByProvince, {
|
|
|
|
|
provinceId: node.data.provinceId,
|
|
|
|
|
cityId: value,
|
|
|
|
|
schoolName: ''
|
|
|
|
|
}).then(({ list }) => {
|
|
|
|
|
const data = []
|
|
|
|
|
list.map(e => {
|
|
|
|
|
e.value = e.schoolId
|
|
|
|
|
e.label = e.schoolName
|
|
|
|
|
e.leaf = true
|
|
|
|
|
e.disabled = !!checked.find(n => n.schoolId == e.schoolId && n.cityId == e.cityId && n.provinceId == e.provinceId)
|
|
|
|
|
data.push(e)
|
|
|
|
|
})
|
|
|
|
|
resolve(data)
|
|
|
|
|
}).catch(res => { })
|
|
|
|
|
} else {
|
|
|
|
|
resolve([])
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
submiting: false,
|
|
|
|
|
updateTime: 0,
|
|
|
|
|
quillShow: true
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
quill,
|
|
|
|
|
Upload
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
editing: function (val) {
|
|
|
|
|
this.quillShow = false
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.quillShow = true
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 监听信息是否有更改,有的话页面离开的时候要询问是否要保存
|
|
|
|
|
form: {
|
|
|
|
|
handler () {
|
|
|
|
|
this.updateTime++
|
|
|
|
|
},
|
|
|
|
|
deep: true
|
|
|
|
|
},
|
|
|
|
|
signupTime: function (val) {
|
|
|
|
|
const { form } = this
|
|
|
|
|
if (val) {
|
|
|
|
|
form.signUpStartTime = val[0];
|
|
|
|
|
form.signUpEndTime = val[1];
|
|
|
|
|
} else {
|
|
|
|
|
form.signUpStartTime = ''
|
|
|
|
|
form.signUpEndTime = ''
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
playTime: function (val) {
|
|
|
|
|
const { form } = this
|
|
|
|
|
if (val) {
|
|
|
|
|
form.playStartTime = val[0]
|
|
|
|
|
form.playEndTime = val[1]
|
|
|
|
|
} else {
|
|
|
|
|
form.playStartTime = ''
|
|
|
|
|
form.playEndTime = ''
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted () {
|
|
|
|
|
this.getData()
|
|
|
|
|
this.getSchool()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getData () {
|
|
|
|
|
const { id } = this.form
|
|
|
|
|
id && this.$post(`${this.api.getCompetition}?competitionId=${id}`).then(({ competition }) => {
|
|
|
|
|
this.$parent.publishStatus = competition.publishStatus
|
|
|
|
|
this.$parent.releaseType = competition.releaseType
|
|
|
|
|
this.$parent.setupId = competition.completeCompetitionSetup.setupId
|
|
|
|
|
if (competition.signUpStartTime) this.signupTime = [competition.signUpStartTime, competition.signUpEndTime]
|
|
|
|
|
if (competition.playStartTime) this.playTime = [competition.playStartTime, competition.playEndTime]
|
|
|
|
|
this.sponsorList = competition.sponsor.split(",")
|
|
|
|
|
this.undertakerList = competition.undertaker.split(",")
|
|
|
|
|
// 附件
|
|
|
|
|
const fileList = competition.competitionAnnexList
|
|
|
|
|
if (fileList) {
|
|
|
|
|
const files = []
|
|
|
|
|
fileList.map(e => {
|
|
|
|
|
files.push({
|
|
|
|
|
id: e.id,
|
|
|
|
|
name: e.fileName,
|
|
|
|
|
url: e.filePath
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
this.fileList = files
|
|
|
|
|
} else {
|
|
|
|
|
competition.competitionAnnexList = []
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 选择范围
|
|
|
|
|
const ranges = competition.competitionRangeList
|
|
|
|
|
if (ranges) {
|
|
|
|
|
const range = []
|
|
|
|
|
ranges.map(e => {
|
|
|
|
|
const item = [+e.provinceId]
|
|
|
|
|
e.cityId && item.push(+e.cityId)
|
|
|
|
|
e.schoolId && item.push(+e.schoolId)
|
|
|
|
|
range.push(item)
|
|
|
|
|
})
|
|
|
|
|
this.range = range
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 选择范围name
|
|
|
|
|
const rangeName = competition.competitionRangeRespList
|
|
|
|
|
if (rangeName) {
|
|
|
|
|
const range = []
|
|
|
|
|
rangeName.map(e => {
|
|
|
|
|
const name = e.type ? (e.cityName || e.provinceName) : e.schoolName
|
|
|
|
|
range.push(name)
|
|
|
|
|
})
|
|
|
|
|
this.rangeName = range.join('，')
|
|
|
|
|
}
|
|
|
|
|
this.form = competition
|
|
|
|
|
this.$parent.resumeData()
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.updateTime = 0
|
|
|
|
|
})
|
|
|
|
|
}).catch(err => { })
|
|
|
|
|
},
|
|
|
|
|
// 选择范围
|
|
|
|
|
showRange () {
|
|
|
|
|
this.rangeVisible = true
|
|
|
|
|
},
|
|
|
|
|
// 范围勾选回调
|
|
|
|
|
rangeChange (val, e) {
|
|
|
|
|
const checked = this.$refs.range.getCheckedNodes()
|
|
|
|
|
const name = []
|
|
|
|
|
const { rangeChecked } = this
|
|
|
|
|
checked.map(e => {
|
|
|
|
|
rangeChecked.find(n => n.value === e.value && n.label == e.label) || name.push(e.data) // 未勾选的，则push
|
|
|
|
|
})
|
|
|
|
|
this.rangeChecked.push(...name)
|
|
|
|
|
},
|
|
|
|
|
// 范围展开收缩回调
|
|
|
|
|
rangeViChange (e) {
|
|
|
|
|
// 展开的时候清空搜索结果
|
|
|
|
|
if (e) {
|
|
|
|
|
this.rangeList = []
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 获取学校列表
|
|
|
|
|
getSchool () {
|
|
|
|
|
this.$get(this.api.querySchoolData).then(({ list }) => {
|
|
|
|
|
const result = []
|
|
|
|
|
list.map(e => {
|
|
|
|
|
e.value = e.schoolId
|
|
|
|
|
e.label = e.schoolName
|
|
|
|
|
e.leaf = true
|
|
|
|
|
result.push(e)
|
|
|
|
|
})
|
|
|
|
|
this.schools = result
|
|
|
|
|
}).catch(res => { })
|
|
|
|
|
},
|
|
|
|
|
// 范围模糊查询前置钩子
|
|
|
|
|
beforeFilter () {
|
|
|
|
|
return false
|
|
|
|
|
},
|
|
|
|
|
// 范围筛选
|
|
|
|
|
rangeSearch (el) {
|
|
|
|
|
const val = el.target.value.trim()
|
|
|
|
|
const checked = this.rangeChecked
|
|
|
|
|
if (!val) {
|
|
|
|
|
this.rangeList = []
|
|
|
|
|
return false
|
|
|
|
|
}
|
|
|
|
|
clearTimeout(this.rangeTimer)
|
|
|
|
|
this.rangeTimer = setTimeout(() => {
|
|
|
|
|
let result = this.schools.filter(e => {
|
|
|
|
|
if (e.label.includes(val)) {
|
|
|
|
|
e.disabled = !!checked.find(n => n.schoolId == e.schoolId)
|
|
|
|
|
return e
|
|
|
|
|
}
|
|
|
|
|
}) // 用学校列表做比对
|
|
|
|
|
this.rangeList = result
|
|
|
|
|
}, 100)
|
|
|
|
|
},
|
|
|
|
|
closeRange (i) {
|
|
|
|
|
this.rangeChecked.splice(i, 1)
|
|
|
|
|
},
|
|
|
|
|
// 范围确定
|
|
|
|
|
rangeSubmit () {
|
|
|
|
|
// 处理提交需要的id
|
|
|
|
|
const data = []
|
|
|
|
|
const checked = this.rangeChecked
|
|
|
|
|
checked.map(e => {
|
|
|
|
|
data.push({
|
|
|
|
|
provinceId: e.provinceId || '',
|
|
|
|
|
cityId: e.cityId || '',
|
|
|
|
|
schoolId: e.schoolId || '',
|
|
|
|
|
type: e.schoolId ? 0 : 1
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
this.form.competitionRangeList = data
|
|
|
|
|
|
|
|
|
|
// 处理显示的name
|
|
|
|
|
const name = []
|
|
|
|
|
checked.map(e => {
|
|
|
|
|
name.push(e.label)
|
|
|
|
|
})
|
|
|
|
|
this.rangeName = name.join('、')
|
|
|
|
|
|
|
|
|
|
this.rangeVisible = false
|
|
|
|
|
},
|
|
|
|
|
handleExceed (files, fileList) {
|
|
|
|
|
util.warningMsg(`当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择！`);
|
|
|
|
|
},
|
|
|
|
|
// 封面自定义上传
|
|
|
|
|
async handleRequest ({ file }) {
|
|
|
|
|
Oss.upload(file).then(res => {
|
|
|
|
|
this.form.coverUrl = res.url
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 封面自定义上传
|
|
|
|
|
async handleRequestLg ({ file }) {
|
|
|
|
|
Oss.upload(file).then(res => {
|
|
|
|
|
this.form.carouselUrl = res.url
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 附件上传成功
|
|
|
|
|
uploadAnnexSuccess (file) {
|
|
|
|
|
const { id } = this.form
|
|
|
|
|
const data = {
|
|
|
|
|
competitionId: id || '',
|
|
|
|
|
fileName: file.name,
|
|
|
|
|
filePath: file.url
|
|
|
|
|
}
|
|
|
|
|
this.form.competitionAnnexList.push(data)
|
|
|
|
|
// 编辑的时候需要调新增附件接口
|
|
|
|
|
id && this.$post(this.api.saveComAnnex, data).then(res => { }).catch(res => { })
|
|
|
|
|
},
|
|
|
|
|
uploadError (err, file, fileList) {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "上传出错，请重试！",
|
|
|
|
|
type: "error",
|
|
|
|
|
center: true
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
beforeRemove (file, fileList) {
|
|
|
|
|
return this.$confirm(`确定移除 ${file.name}？`);
|
|
|
|
|
},
|
|
|
|
|
handleRemove () {
|
|
|
|
|
Oss.del(this.form.coverUrl)
|
|
|
|
|
this.form.coverUrl = ''
|
|
|
|
|
},
|
|
|
|
|
handleLgRemove () {
|
|
|
|
|
Oss.del(this.form.carouselUrl)
|
|
|
|
|
this.form.carouselUrl = ''
|
|
|
|
|
},
|
|
|
|
|
handleAnnexRemove (file, fileList) {
|
|
|
|
|
Oss.del(file.url)
|
|
|
|
|
const { id } = file
|
|
|
|
|
id && this.$post(`${this.api.delComAnnex}?id=${id}`).then(res => { }).catch(res => { })
|
|
|
|
|
},
|
|
|
|
|
// 随机邀请码
|
|
|
|
|
randomInv () {
|
|
|
|
|
let result = ''
|
|
|
|
|
for (let i = 0; i < 4; i++) {
|
|
|
|
|
result += Math.floor(Math.random() * 10);
|
|
|
|
|
}
|
|
|
|
|
this.form.completeCompetitionSetup.invitationCode = result
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* @description 提交
|
|
|
|
|
* status 0：草稿，1发布
|
|
|
|
|
* next 0：返回，1：不做任何操作，2：下一步
|
|
|
|
|
* releaseType 发布类型（0发布信息，1完整比赛）
|
|
|
|
|
* */
|
|
|
|
|
save (status, next = 0, releaseType = 0) {
|
|
|
|
|
const form = JSON.parse(JSON.stringify(this.form))
|
|
|
|
|
form.sponsor = this.sponsorList.filter(d => d).join();
|
|
|
|
|
form.undertaker = this.undertakerList.filter(d => d).join();
|
|
|
|
|
if (!form.name) return util.warningMsg("请填写竞赛名称");
|
|
|
|
|
// 下一步需要校验
|
|
|
|
|
if (next === 2) {
|
|
|
|
|
if (form.competitionScope == 2 && (!form.competitionRangeList || !form.competitionRangeList.length)) return util.warningMsg('请选择区域、院校')
|
|
|
|
|
if (!form.sponsor) return util.warningMsg("请填写主办方");
|
|
|
|
|
if (!form.signUpStartTime) return util.warningMsg("请选择报名时间");
|
|
|
|
|
let now = new Date().getTime();
|
|
|
|
|
let signUpStartTime = new Date(form.signUpStartTime).getTime();
|
|
|
|
|
let signUpEndTime = new Date(form.signUpEndTime).getTime();
|
|
|
|
|
let playStartTime = new Date(form.playStartTime).getTime();
|
|
|
|
|
if (!form.playStartTime) return util.warningMsg("请选择竞赛时间");
|
|
|
|
|
if (playStartTime && signUpEndTime && playStartTime < signUpEndTime) return util.warningMsg("竞赛时间不能早于报名结束时间");
|
|
|
|
|
const { competitionType, quantityLimit, minTeamSize, maxTeamSize, isNeedCode, invitationCode } = form.completeCompetitionSetup
|
|
|
|
|
// 团队
|
|
|
|
|
if (competitionType) {
|
|
|
|
|
if (quantityLimit === '') return util.warningMsg('请填写报名团队数上限')
|
|
|
|
|
if (quantityLimit < 0) return util.warningMsg('报名团队数上限不得小于0')
|
|
|
|
|
if (minTeamSize === '') return util.warningMsg('请填写团队人数下限')
|
|
|
|
|
if (minTeamSize < 2) return util.warningMsg('团队人数下限不得小于2')
|
|
|
|
|
if (maxTeamSize === '') return util.warningMsg('请填写团队人数上限')
|
|
|
|
|
if (minTeamSize > maxTeamSize) return util.warningMsg('团队人数上限不得小于下限')
|
|
|
|
|
} else { // 个人
|
|
|
|
|
if (quantityLimit === '') return util.warningMsg('请填写报名人数上限')
|
|
|
|
|
if (quantityLimit < 0) return util.warningMsg('报名人数上限不得小于0')
|
|
|
|
|
}
|
|
|
|
|
if (isNeedCode && (!invitationCode || invitationCode.length !== 4)) return util.warningMsg('请填写四位数邀请码')
|
|
|
|
|
if (!form.description) return util.warningMsg("请填写竞赛详情");
|
|
|
|
|
} else {
|
|
|
|
|
if (form.competitionScope == 2 && (!form.competitionRangeList || !form.competitionRangeList.length)) form.competitionScope = 1
|
|
|
|
|
}
|
|
|
|
|
this.$parent.showLoad()
|
|
|
|
|
// delete form.publishStatus
|
|
|
|
|
// if (status === 1) form.publishStatus = 1
|
|
|
|
|
form.publishStatus = status
|
|
|
|
|
form.ztOpen = form.id ? form.ztOpen : (status ? 0 : 1) // 保存则禁用，发布则启用
|
|
|
|
|
form.releaseType = releaseType
|
|
|
|
|
form.id = this.$route.query.id
|
|
|
|
|
if (form.id) {
|
|
|
|
|
this.$post(this.api.editCompetition, form).then(res => {
|
|
|
|
|
this.$parent.hideLoad()
|
|
|
|
|
this.updateTime && util.successMsg("修改成功");
|
|
|
|
|
this.updateTime = 0
|
|
|
|
|
this.$emit('next', next)
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
this.$parent.hideLoad()
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.$post(this.api.addCompetition, form).then(({ competitionId, setupId }) => {
|
|
|
|
|
this.updateTime = 0
|
|
|
|
|
this.$parent.hideLoad()
|
|
|
|
|
util.successMsg("创建成功");
|
|
|
|
|
this.$emit('next', next, setupId, competitionId)
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
this.$parent.hideLoad()
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 预览
|
|
|
|
|
preview () {
|
|
|
|
|
util.local.set('match', this.form)
|
|
|
|
|
window.open(this.$router.resolve('/matchPreview').href)
|
|
|
|
|
},
|
|
|
|
|
addSponsor () {
|
|
|
|
|
this.sponsorList.push("");
|
|
|
|
|
},
|
|
|
|
|
delSponsor (index) {
|
|
|
|
|
this.sponsorList.splice(index, 1);
|
|
|
|
|
},
|
|
|
|
|
addOrganizer () {
|
|
|
|
|
this.undertakerList.push("");
|
|
|
|
|
},
|
|
|
|
|
delOrganizer (index) {
|
|
|
|
|
this.undertakerList.splice(index, 1);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
$upload-width: 220px;
|
|
|
|
|
$upload-height: 140px;
|
|
|
|
|
$upload-lg-height: 150px;
|
|
|
|
|
/deep/ .avatar-uploader {
|
|
|
|
|
.el-upload {
|
|
|
|
|
position: relative;
|
|
|
|
|
width: $upload-width;
|
|
|
|
|
height: $upload-height;
|
|
|
|
|
border: 1px dashed #d9d9d9;
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
border-color: #cb221c;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.uploader-default {
|
|
|
|
|
display: flex;
|
|
|
|
|
height: $upload-height;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
text-align: center;
|
|
|
|
|
background: rgba(0, 0, 0, 0.04);
|
|
|
|
|
|
|
|
|
|
i {
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: #8c939d;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: rgba(0, 0, 0, 0.65);
|
|
|
|
|
line-height: 1;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.avatar-uploader-lg {
|
|
|
|
|
.el-upload {
|
|
|
|
|
width: 100%;
|
|
|
|
|
max-width: 960px;
|
|
|
|
|
height: $upload-lg-height;
|
|
|
|
|
|
|
|
|
|
.uploader-default {
|
|
|
|
|
height: $upload-lg-height;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.avatar {
|
|
|
|
|
display: block;
|
|
|
|
|
width: $upload-width;
|
|
|
|
|
height: $upload-height;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.avatar-lg {
|
|
|
|
|
display: block;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: $upload-lg-height;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.el-upload__tip {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: rgba(0, 0, 0, 0.45);
|
|
|
|
|
line-height: 1;
|
|
|
|
|
|
|
|
|
|
&:first-child {
|
|
|
|
|
margin-bottom: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/ .d-inline-block {
|
|
|
|
|
width: 216px;
|
|
|
|
|
|
|
|
|
|
.el-select,
|
|
|
|
|
.el-input {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.inline-input {
|
|
|
|
|
.input-wrap {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
|
|
|
|
.el-input {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
width: 216px;
|
|
|
|
|
margin-right: 8px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.remove {
|
|
|
|
|
width: 16px;
|
|
|
|
|
height: 16px;
|
|
|
|
|
background: url('../../../assets/img/close.png') 0 0 / cover no-repeat;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.add-btn {
|
|
|
|
|
margin-left: 32px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.add-btn {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
width: 216px;
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: rgba(0, 0, 0, 0.65);
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
border: 1px dashed rgba(0, 0, 0, 0.15);
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
|
|
i {
|
|
|
|
|
margin-right: 8px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.range-check {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin: 0 0 10px 10px;
|
|
|
|
|
}
|
|
|
|
|
/deep/.range-cas {
|
|
|
|
|
.el-tag {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.input-center {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
width: 216px;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
.el-input {
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.el-steps {
|
|
|
|
|
justify-content: center;
|
|
|
|
|
}
|
|
|
|
|
/deep/.req {
|
|
|
|
|
.el-form-item__label {
|
|
|
|
|
&:before {
|
|
|
|
|
content: '*';
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
color: #f00;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
