Files
UNION_NSI/target/classes/views/platform/activity/basic/ActivityEvent.html
T
2026-09-08 19:49:21 +08:00

714 lines
30 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!--#
layout("/layouts/platform.html"){
#-->
<div id="app" class="platform" v-cloak>
<guava ref="guava">
<template>
<el-card shadow="never">
<div class="search">
<div class="d-search-item btn-group tool-button mr10">
<el-checkbox-group @change="doSearch" v-model="pageForm.isMenWomen">
<el-checkbox-button :key="2" :label="2">男子</el-checkbox-button>
<el-checkbox-button :key="3" :label="3">女子</el-checkbox-button>
</el-checkbox-group>
</div>
<div class="d-search-item btn-group tool-button mr10">
<el-checkbox-group @change="doSearch" v-model="pageForm.isMenWomen">
<el-checkbox-button :key="4" :label="4">单项</el-checkbox-button>
<el-checkbox-button :key="5" :label="5">团体</el-checkbox-button>
</el-checkbox-group>
</div>
<div class="d-search-item btn-group tool-button mr10">
<el-select v-model="pageForm.group" @focus="focusGroup"
placeholder="请选择比赛组别" clearable
style="width: 100%">
<el-option
v-for="item in groupList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</div>
<div class="d-search-item btn-group tool-button mr10">
<el-select @focus="exerciseType" clearable filterable placeholder="请选择运动类型"
style="width: 100%" v-model="pageForm.events">
<el-option
:key="item.id"
:label="item.name"
:value="item.id"
v-for="item in exerciseTypeList">
</el-option>
</el-select>
</div>
<div class="search-query">
<el-button type="primary" icon="el-icon-search" @click="doSearch">搜索
</el-button>
</div>
</div>
</el-card>
<el-card shadow="never" class="mt10">
<table-tool label="比赛项目列表" :app="this">
<template #label_end>
</template>
<template #func>
<el-input type="number" v-model="pageForm.age" placeholder="输入年龄算出身年"
@input="ageInput"
style="width: auto">
<template slot="prepend">年龄计算器</template>
</el-input>
<el-tag class="ml10">{{ pageForm.ageYear }}</el-tag>
<el-date-picker
class="ml10"
v-model="pageForm.ageDate"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd">
</el-date-picker>
<el-button class="ml10" type="primary" icon="el-icon-check"
@click="doAssignmentDate">统赋年龄限制
</el-button>
<el-button type="primary" icon="el-icon-edit-outline"
@click="openAdd">
创建比赛项目
</el-button>
</template>
</table-tool>
<el-table :data="tableData" style="width: 100%;margin-bottom: 20px" row-key="id"
@sort-change="pageOrder"
ref="multipleTable"
v-loading="tableLoading" :size="tableSize" class="vi-table"
@selection-change="handleSelectionChange">
<el-table-column
:reserve-selection="true"
type="selection"
width="55">
</el-table-column>
<el-table-column align="center" header-align="center" type="index"
:index="indexMethod" label="序号"
width="80px"></el-table-column>
<el-table-column
align="center"
header-align="center"
v-for="column in tableColumns"
:label="column.label"
:width="column.width"
:prop="column.prop" :sortable="column.sortable"
:sortable="column.sortable" show-overflow-tooltip>
<template scope="{row}" v-if="column.prop=='baname'">
<span>{{row.baname!=null?row.baname:'暂无'}}</span>
</template>
<template scope="{row}" v-else-if="column.prop=='diname'">
<span>{{row.diname!=null?row.diname:'暂无'}}</span>
</template>
<template scope="{row}" v-else-if="column.prop=='isMenWomen'">
<span v-if="row.isMenWomen==1">男子</span>
<span v-if="row.isMenWomen==2">女子</span>
</template>
<template scope="{row}" v-else-if="column.prop=='spname'">
<span>{{row.spname!=null?row.spname:''}}</span>
</template>
<template scope="{row}" v-else-if="column.prop=='projectType'">
<span>{{row.projectType=='1'?'单项':'团体'}}</span>
</template>
<template scope="{row}" v-else-if="column.prop=='note'">
<span>{{row.note!=''?row.note:'暂无'}}</span>
</template>
<template scope="{row}" v-else-if="column.prop=='whetherEnable'">
<el-switch @change="switchChange(row)" v-model="row.whetherEnable"
active-color="#13ce66"
inactive-color="#ff4949"></el-switch>
</template>
</el-table-column>
<el-table-column prop="userOnline" align="center" header-align="center"
label="操作"
width="150px">
<template scope="{row}">
<el-dropdown @command="dropdownCommand">
<el-button size="mini" :loading="row.loading">
<i class="ti-settings"></i>
<span class="ti-angle-down"></span>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="{type:'edit',row}">
编辑
</el-dropdown-item>
<el-dropdown-item :command="{type:'delete',row}">
删除
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<!--#include("/layouts/pagination.html"){}#-->
</el-card>
</template>
<template #edit>
<vi-title title="填写比赛项目信息"></vi-title>
<el-form :model="formData" ref="form" :rules="formRules" label-width="120px"
label-suffix="">
<el-row gutter="40">
<el-col :span="24">
<el-form-item prop="isInterest" label="是否趣味项目">
<el-checkbox v-model="formData.isInterest">
{{formData.isInterest?'是趣味':'不是趣味'}}
</el-checkbox>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="projectCode" label="比赛项目编号">
<el-input v-model="formData.projectCode"
placeholder="请填写比赛项目编号"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="isMenWomen" label="性别">
<el-select v-model="formData.isMenWomen" placeholder="请选择男女分组"
allow-create filterable
default-first-option clearable style="width: 100%">
<el-option
v-for="item in menWomenList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="competitionCategory" label="比赛组别">
<el-select v-model="formData.competitionCategory" @focus="focusGroup"
placeholder="请选择比赛组别"
clearable style="width: 100%">
<el-option
v-for="item in groupList"
:key="item.id"
:label="item.name+''+item.code+''"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="distance" label="距离">
<el-select v-model="formData.distance" @focus="focusDistance"
placeholder="请选择距离"
clearable style="width: 100%">
<el-option
v-for="item in distanceList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="exerciseType" label="运动类型">
<el-select v-model="formData.exerciseType" @focus="exerciseType"
@change="changeExercise_typeList" placeholder="请选择运动类型"
filterable
clearable style="width: 100%">
<el-option
v-for="item in exerciseTypeList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="sports" label="运动项目">
<el-select v-model="formData.sports" placeholder="请选择具体运动项目"
clearable style="width: 100%">
<el-option
v-for="item in exerciseTypeList2"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="projectType" label="项目类型">
<el-select v-model="formData.projectType" placeholder="请选择具体运动项目"
allow-create filterable
default-first-option clearable style="width: 100%">
<el-option
v-for="item in projectTypeList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="ageDate" label="年龄限制范围" v-if="formData.projectType==1">
<el-date-picker
style="width: 100%"
v-model="formData.ageDate"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div style="float: right;margin: 20px 0">
<el-button type="primary" @click="formData.id?doEdit():doAdd()">提 交</el-button>
</div>
</template>
</guava>
</div>
<script>
var vue = new Vue({
el: '#app',
mixins: [initTableMixins],
data() {
return {
multipleSelection: [],
groupList: [],
exerciseTypeList: [],
distanceList: [],
exerciseTypeList2: [],
eventDialog: false,
loading: false,
title: "",
pageForm: {
age: 1,
ageYear: null,
activityId: null,
ageDate: null,
isMenWomen: []
},
tableColumns: [
{prop: 'projectCode', label: '项目编号', sortable: true},
{prop: 'allName', label: '全称', width: "200"},
{prop: 'isMenWomen', label: '男子/女子', sortable: true},
{prop: 'baname', label: '比赛组别', sortable: true},
{prop: 'diname', label: '距离', sortable: true},
{prop: 'exename', label: '运动类型', sortable: true},
{prop: 'spname', label: '运动项目', sortable: true},
{prop: 'projectType', label: '项目类型', sortable: true},
{prop: 'whetherEnable', label: '是否启用'},
],
projectTypeList: [
{id: '1', name: '单项'},
{id: '2', name: '团体'},
],
menWomenList: [
{id: 1, name: '男子'},
{id: 2, name: '女子'},
],
formRules: {
exerciseType: [{required: true, message: '必填', trigger: ['change', 'blur']}],
projectType: [{required: true, message: '必填', trigger: ['change', 'blur']}],
projectCode: [{required: true, message: '必填', trigger: ['change', 'blur']}],
/* competitionCategory: [{required: true, message: '必填', trigger: ['change', 'blur']}],
distance: [{required: true, message: '必填', trigger: ['change', 'blur']}],
exerciseType: [{required: true, message: '必填', trigger: ['change', 'blur']}],
*/
},
}
},
components: {
'guava': httpVueLoader('/components/plugins/Guava.vue'),
},
methods: {
ageInput(val) {
const year = new Date().getFullYear()
this.$set(this.pageForm, "ageYear", year - val)
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
async doAssignmentDate() {
const aa = this.multipleSelection.map(v => {
if (v.isInterest) {
return true
} else {
return false
}
})
if (aa.find(v => v == true)) {
this.$notify({
title: '警告',
message: '您勾选的列表中包含趣味项目,趣味项目暂不需要年龄限制',
type: 'warning'
});
return
}
if (this.multipleSelection.length === 0) {
this.$notify({
title: '警告',
message: '请先在旁边勾选需要设置的项目',
type: 'warning'
});
return
}
if (this.pageForm.ageDate == null) {
this.$notify({
title: '警告',
message: '请选择需要赋值的时间段',
type: 'warning'
});
return
}
const confirm = await this.$confirm('确定要勾选的项目赋年龄限制吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
if (confirm === "confirm") {
const data = await $.post(loc() + "/doAssignmentDate", {
startAgeDate: this.pageForm.ageDate[0],
endAgeDate: this.pageForm.ageDate[1],
eventIds: JSON.stringify(this.multipleSelection.map(v => v.id))
})
this.$notify.success({title: '成功', message: data.msg});
this.$refs.multipleTable.clearSelection();
this.doSearch()
}
},
dropdownCommand(command) {
const {type, row} = command
if (type === 'edit') {
this.openEdit(row)
} else if (type === 'delete') {
this.doDelete(row)
}
},
openAdd() {
this.$refs.guava.edit()
if (this.$refs['form']) {
this.$refs['form'].resetFields()
}
this.formData = {}
},
//查询比赛组别
async focusGroup() {
const resp = await $.post(loc() + "/focusGroup")
if(resp.code===0){
this.groupList = resp.data
}else{
this.notifyWarning(resp.msg)
}
},
//查询运动类型
async exerciseType() {
const resp = await $.post(loc() + "/exerciseType")
if(resp.code===0){
this.exerciseTypeList = resp.data
}else{
this.notifyWarning(resp.msg)
}
},
//查询距离
async focusDistance() {
const resp = await $.post(loc() + "/focusDistance")
if(resp.code===0){
this.distanceList = resp.data;
}else{
this.notifyWarning(resp.msg)
}
},
//根据运动id查询下面有哪些具体的运动项目
async changeExercise_typeList() {
const resp = await $.post(loc() + "/changeExercise_typeList", {exerciseType: this.formData.exerciseType})
if(resp.code===0){
this.exerciseTypeList2 = resp.data
}else{
this.notifyWarning(resp.msg)
}
},
doAdd() {
this.$refs["form"].validate(async (valid) => {
if (valid) {
const {data} = await $.post(loc() + "/getProjectCodeIsExist", {projectCode: this.formData.projectCode})
if (data) {
this.$message.error("编号已存在");
return
}
let allName = '';
this.menWomenList.find(v => {
if (v.id === this.formData.isMenWomen) {
allName += v.name
}
})
this.groupList.find(v => {
if (v.id === this.formData.competitionCategory) {
allName += v.name
}
})
this.distanceList.find(v => {
if (v.id === this.formData.distance) {
allName += v.name + '米'
}
})
/* this.exerciseTypeList.find(v => {
if (v.id === this.formData.exerciseType) {
allName += v.name
}
})*/
this.exerciseTypeList2.find(v => {
if (v.id === this.formData.sports) {
allName += v.name
}
})
this.projectTypeList.find(v => {
if (v.id === this.formData.projectType) {
allName += "(" + v.name + ")"
}
})
this.formData.allName = allName
if (this.formData.ageDate && this.formData.ageDate.length > 0) {
this.formData.startAgeDate = this.formData.ageDate[0]
this.formData.endAgeDate = this.formData.ageDate[1]
}
this.loading = true
const resp = await $.post(loc() + "/doAdd", this.formData)
this.loading = false
if(resp.code===0){
this.pageData();
this.$refs.guava.index()
}else{
this.notifyWarning(resp.msg)
}
}
})
},
pageData() {
sublime.showLoadingbar();
this.tabLoading = true
const pageForm = clone(this.pageForm)
pageForm.isMenWomen = JSON.stringify(pageForm.isMenWomen)
$.post(base + "/platform/activity/basic/event/pageData", pageForm, (data) => {
sublime.closeLoadingbar();
this.tabLoading = false
if (data.code == 0) {
this.tableData = data.data.list;
this.pageForm.totalCount = data.data.totalCount;
} else {
this.$message({
message: data.msg,
type: 'error'
});
}
}, "json");
},
async switchChange(data) {
this.formData = data
const resp = await $.post(loc() + "/doEdit", this.formData)
if(resp.code===0){
this.notifySuccess(resp.msg)
this.pageData()
}else{
this.notifyWarning(resp.msg)
}
},
doEdit() {
this.$refs["form"].validate(async (valid) => {
if (valid) {
if (this.formData.oldProjectCode !== this.formData.projectCode) {
const {data} = await $.post(loc() + "/getProjectCodeIsExist", {projectCode: this.formData.projectCode})
if (data) {
this.$message.error("编号已存在");
return
}
}
let allName = '';
this.menWomenList.find(v => {
if (v.id === this.formData.isMenWomen) {
allName += v.name
}
})
this.groupList.find(v => {
if (v.id === this.formData.competitionCategory) {
allName += v.name
}
})
this.distanceList.find(v => {
if (v.id === this.formData.distance) {
allName += v.name + '米'
}
})
/* this.exerciseTypeList.find(v => {
if (v.id === this.formData.exerciseType) {
allName += v.name
}
})*/
this.exerciseTypeList2.find(v => {
if (v.id === this.formData.sports) {
allName += v.name
}
})
this.projectTypeList.find(v => {
if (v.id === this.formData.projectType) {
allName += "(" + v.name + ")"
}
})
this.formData.allName = allName
if (this.formData.ageDate && this.formData.ageDate.length > 0) {
this.formData.startAgeDate = this.formData.ageDate[0]
this.formData.endAgeDate = this.formData.ageDate[1]
}
this.loading = true
const resp = await $.post(loc() + "/doEdit", this.formData)
this.loading = true
if(resp.code===0){
this.pageData();
this.$refs.guava.index()
}else{
this.notifyWarning(resp.msg)
}
}
});
},
openEdit(data) {
this.focusGroup()
this.exerciseType()
this.focusDistance()
this.formData = {
id: data.id,
isInterest: data.isInterest,
competitionCategory: data.competitionCategory,
distance: data.distance,
exerciseType: data.exerciseType,
sports: data.sports,
projectType: data.projectType,
note: data.note,
isMenWomen: data.isMenWomen,
projectCode: data.projectCode,
oldProjectCode: data.projectCode
}
if (data.startAgeDate != null) {
this.$set(this.formData, "ageDate", [data.startAgeDate, data.endAgeDate])
}
this.changeExercise_typeList()
this.$refs.guava.edit()
},
doDelete(row) {
const {id} = row
this.$confirm('确定要删除该活动吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
callback: async (a, b) => {
if ("confirm" === a) {//确认后再执行
this.$set(row, "loading", true)
const resp = await $.post(loc() + "/doDelete", {id: id});
this.$set(row, "loading", false)
if(resp.code===0){
this.pageData()
}else{
this.notifyWarning(resp.msg)
}
}
}
});
}
},
async created() {
this.pageData()
this.ageInput(this.pageForm.age)
}
})
</script>
<!--#
}
#-->