This commit is contained in:
2025-05-06 19:21:24 +08:00
parent a4e8706cf2
commit 4b0dfc8f0e
9 changed files with 601 additions and 439 deletions
@@ -222,7 +222,8 @@ public class ActUserController {
add(new ExcelExportEntity("联系方式", "mobile", 20));
add(new ExcelExportEntity("职务", "position", 20));
add(new ExcelExportEntity("所属单位", "unitName", 20));
add(new ExcelExportEntity("报名时间", "signUpTime2", 20));
add(new ExcelExportEntity("报名时间", "signUpTime", 20));
add(new ExcelExportEntity("是否签到", "isSignInDesc", 20));
}};
response.setContentType("application/octet-stream");
response.setHeader("Content-Disposition", "attachment;filename=" + new String((activity.getTitle() + "报名数据表.xlsx").getBytes(StandardCharsets.UTF_8), "ISO8859-1"));
@@ -79,9 +79,10 @@ public class ActivityItemApplyQueryController {
if (StrUtil.isNotBlank(pageForm.getSearchKeyword())) {
SqlExpressionGroup group = new SqlExpressionGroup();
group.or("au.userName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.unitName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.phone", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
cnd.and(group);
}
cnd.andEX("au.unitId","=",pageForm.getUnitId());
cnd.and("au.activityId", "=", pageForm.getActivityId());
cnd.andEX("aiu.itemId", "=", pageForm.getItemId());
cnd.asc("ai.`name`");
@@ -76,9 +76,12 @@ public class ActivitySignInQueryController {
if (StrUtil.isNotBlank(pageForm.getSearchKeyword())) {
SqlExpressionGroup group = new SqlExpressionGroup();
group.or("au.userName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.unitName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.phone", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
cnd.and(group);
}
cnd.andEX("au.unitId","=",pageForm.getUnitId());
cnd.andEX("au.isStay","=",pageForm.getIsStay());
cnd.andEX("au.isGrant","=",pageForm.getIsGrant());
cnd.and("au.activityId", "=", pageForm.getActivityId());
cnd.and("au.isSignIn", "=", 1);
cnd.desc("au.signInTime");
@@ -109,7 +112,15 @@ public class ActivitySignInQueryController {
Sql sql = Sqls.create("""
SELECT
au.*,
DATE_FORMAT(signInTime, '%Y-%m-%d %H:%i:%s') signInTime
DATE_FORMAT(signInTime, '%Y-%m-%d %H:%i:%s') signInTime,
CASE au.isStay
WHEN 1 THEN '住宿'
WHEN 0 THEN '不住宿'
END AS isStayDesc,
CASE au.isGrant
WHEN 1 THEN '已发放'
WHEN 0 THEN '未发放'
END AS isGrantDesc
FROM
`act_user` au
$condition
@@ -117,9 +128,12 @@ public class ActivitySignInQueryController {
if (StrUtil.isNotBlank(pageForm.getSearchKeyword())) {
SqlExpressionGroup group = new SqlExpressionGroup();
group.or("au.userName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.unitName", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
group.or("au.phone", "LIKE", "%" + pageForm.getSearchKeyword() + "%");
cnd.and(group);
}
cnd.andEX("au.isStay","=",pageForm.getIsStay());
cnd.andEX("au.isGrant","=",pageForm.getIsGrant());
cnd.andEX("au.unitId","=",pageForm.getUnitId());
cnd.and("au.activityId", "=", pageForm.getActivityId());
cnd.and("au.isSignIn", "=", 1);
cnd.desc("au.signInTime");
@@ -132,7 +146,9 @@ public class ActivitySignInQueryController {
add(new ExcelExportEntity("身份证号码", "idCard", 20));
add(new ExcelExportEntity("联系方式", "mobile", 20));
add(new ExcelExportEntity("参加单位名称", "unitName", 20));
add(new ExcelExportEntity("签到时间", "signUpTime2", 20));
add(new ExcelExportEntity("签到时间", "signInTime", 20));
add(new ExcelExportEntity("是否住宿", "isStayDesc", 20));
add(new ExcelExportEntity("物资发放", "isGrantDesc", 20));
}};
response.setContentType("application/octet-stream");
@@ -38,7 +38,11 @@ public class ActUserServiceImpl extends BaseServiceImpl<ActUser> implements ActU
Sql sql = Sqls.create("""
SELECT
u.*,
DATE_FORMAT(signUpTime, '%Y-%m-%d %H:%i:%s') signUpTime2,
DATE_FORMAT(signUpTime, '%Y-%m-%d %H:%i:%s') signUpTime,
CASE u.isSignIn
WHEN 1 THEN '已签到'
WHEN 0 THEN '未签到'
END AS isSignInDesc,
act.`title` AS activityName
FROM
act_user u
@@ -53,13 +57,8 @@ public class ActUserServiceImpl extends BaseServiceImpl<ActUser> implements ActU
seg.orLike("u.phone", pageForm.getSearchKeyword());
cnd.and(seg);
}
if (pageForm.getIsSignIn() != 1) {
cnd.andEX("u.isSignIn", "=", pageForm.getIsSignIn() == 2 ? 1 : 0);
}
// cnd.andEX("u.phone", "like", "%" + pageForm.getPhone() + "%");
if (StrUtil.isNotBlank(pageForm.getUnitName())) {
cnd.and("u.unitName", "like", "%" + pageForm.getUnitName() + "%");
}
cnd.andEX("u.isSignIn", "=", pageForm.getIsSignIn());
cnd.andEX("u.unitId", "=", pageForm.getUnitId());
sql.setCondition(cnd);
return sql;
}
@@ -23,5 +23,11 @@ public class ActSignInUserPageForm extends PageForm {
// 所属单位
private String unitName;
// 发放状态
private Integer isGrant;
// 单位
private Integer unitId;
// 是否住宿
private Integer isStay;
}
@@ -23,6 +23,8 @@ public class ActUserPageForm extends PageForm {
// 所属单位
private String unitName;
// 是否签到1.全部2.已签到3.未签到
// 所属单位
private String unitId;
// 是否签到
private Integer isSignIn;
}
@@ -46,9 +46,23 @@ layout("/layouts/platform_1.html"){
</div>
</div>
<div class="search-item">
<div class="search-item-label">姓名/单位</div>
<div class="search-item-label">姓名/电话</div>
<div class="search-item-option">
<el-input v-model="pageForm.searchKeyword" clearable placeholder="请输入姓名/单位"></el-input>
<el-input v-model="pageForm.searchKeyword" clearable placeholder="请输入姓名/电话"></el-input>
</div>
</div>
<div class="search-item">
<div class="search-item-label">所属单位</div>
<div class="search-item-option">
<el-select placeholder="请选择所属单位"
style="width: 100%;" clearable
filterable
@change="setModifyFormUnit"
v-model="pageForm.unitId">
<el-option :label="item.name" :value="item.id"
v-for="item in units"></el-option>
</el-select>
</div>
</div>
@@ -72,7 +86,7 @@ layout("/layouts/platform_1.html"){
<el-table-column label="性别" prop="sex"width="150"></el-table-column>
<el-table-column label="职务" prop="position"></el-table-column>
<el-table-column label="身份证号码" prop="idCard"></el-table-column>
<el-table-column label="联系方式" prop="mobile"></el-table-column>
<el-table-column label="联系方式" prop="phone"></el-table-column>
<el-table-column label="参加单位名称" prop="unitName"></el-table-column>
<el-table-column label="参加项目" prop="itemName"></el-table-column>
</el-table>
@@ -92,7 +106,8 @@ layout("/layouts/platform_1.html"){
year: new Date().getFullYear() + ""
},
activityOptions: [],
activityItemOptions: []
activityItemOptions: [],
units: [],
}
},
methods: {
@@ -126,9 +141,16 @@ layout("/layouts/platform_1.html"){
})
},
async getUnits(){
const resp = await $.post('/open/common/units')
if (resp.code === 0) {
this.units = resp.data
}
}
},
created() {
this.getActivityOptions()
this.getUnits()
}
})
</script>
@@ -33,9 +33,39 @@ layout("/layouts/platform_1.html"){
</div>
</div>
<div class="search-item">
<div class="search-item-label">姓名/单位</div>
<div class="search-item-label">发放状态</div>
<div class="search-item-option">
<el-input v-model="pageForm.searchKeyword" clearable placeholder="请输入姓名/单位"></el-input>
<el-select v-model="pageForm.isGrant" placeholder="请选择发放状态" clearable>
<el-option label="已发放" :value="1"></el-option>
<el-option label="未发放" :value="0"></el-option>
</el-select>
</div>
</div>
<div class="search-item">
<div class="search-item-label">住宿状态</div>
<div class="search-item-option">
<el-select v-model="pageForm.isStay" placeholder="请选择住宿状态" clearable>
<el-option label="住宿" :value="1"></el-option>
<el-option label="不住宿" :value="0"></el-option>
</el-select>
</div>
</div>
<div class="search-item">
<div class="search-item-label">姓名/电话</div>
<div class="search-item-option">
<el-input v-model="pageForm.searchKeyword" clearable placeholder="请输入姓名/电话"></el-input>
</div>
</div>
<div class="search-item">
<div class="search-item-label">所属单位</div>
<div class="search-item-option">
<el-select placeholder="请选择所属单位"
style="width: 100%;" clearable
filterable
v-model="pageForm.unitId">
<el-option :label="item.name" :value="item.id"
v-for="item in units"></el-option>
</el-select>
</div>
</div>
@@ -59,21 +89,28 @@ layout("/layouts/platform_1.html"){
<el-table-column label="性别" prop="sex"></el-table-column>
<el-table-column label="职务" prop="position"></el-table-column>
<el-table-column label="身份证号码" prop="idCard"></el-table-column>
<el-table-column label="联系方式" prop="mobile"></el-table-column>
<el-table-column label="联系方式" prop="phone"></el-table-column>
<el-table-column label="参加单位名称" prop="unitName"></el-table-column>
<el-table-column label="签到时间" prop="signInTime"></el-table-column>
<el-table-column label="是否住宿" prop="isStay">
<template slot-scope="{row}">
{{row.isStay?'住宿':'不住宿'}}
</template>
</el-table-column>
<el-table-column label="物资发放" prop="isGrant">
<template slot-scope="scope">
<template slot-scope="scope">
<el-tag v-if="scope.row.isGrant" type="success">已发放</el-tag>
<el-tag v-else type="danger">未发放</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="200">
<template #default="{row}">
<el-button v-if="!row.isGrant || row.isGrant === 0" type="primary" size="mini" @click="doGrant(row, true)">设为已发放物资</el-button>
<el-button v-else type="danger" size="mini" @click="doGrant(row, false)">设为未发放物资</el-button>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="200">
<template #default="{row}">
<el-button v-if="!row.isGrant || row.isGrant === 0" type="primary" size="mini"
@click="doGrant(row, true)">设为已发放物资
</el-button>
<el-button v-else type="danger" size="mini" @click="doGrant(row, false)">设为未发放物资</el-button>
</template>
</el-table-column>
</el-table>
<!--#include("/layouts/pagination.html"){}#-->
</el-card>
@@ -90,28 +127,29 @@ layout("/layouts/platform_1.html"){
pageForm: {
year: new Date().getFullYear() + ""
},
activityOptions: []
activityOptions: [],
units: [],
}
},
methods: {
async doGrant(row, isGrant) {
this.$confirm('您确定要设置成' + (isGrant ? '已发放' : '未发放') + '状态吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
const resp = await $.post("/platform/activity/signInUserQuery/doGrant", {
id: row.id,
isGrant: isGrant
})
if (resp.code === 0) {
this.doSearch()
this.$message.success(resp.msg)
} else {
this.$message.error(resp.msg)
}
})
},
async doGrant(row, isGrant) {
this.$confirm('您确定要设置成' + (isGrant ? '已发放' : '未发放') + '状态吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
const resp = await $.post("/platform/activity/signInUserQuery/doGrant", {
id: row.id,
isGrant: isGrant
})
if (resp.code === 0) {
this.doSearch()
this.$message.success(resp.msg)
} else {
this.$message.error(resp.msg)
}
})
},
doExport() {
window.open("/platform/activity/signInUserQuery/doExport?activityId=" + this.pageForm.activityId + "&searchKeyword=" + this.pageForm.searchKeyword)
},
@@ -131,9 +169,16 @@ layout("/layouts/platform_1.html"){
})
},
async getUnits() {
const resp = await $.post('/open/common/units')
if (resp.code === 0) {
this.units = resp.data
}
}
},
created() {
this.getActivityOptions()
this.getUnits()
}
})
</script>
@@ -2,411 +2,481 @@
layout("/layouts/platform_1.html"){
#-->
<div id="app">
<el-card shadow="never">
<div class="search">
<div class="search-item">
<div class="search-item-label">年度</div>
<div class="search-item-option">
<el-date-picker
:clearable="false"
placeholder="选择年"
style="width: 100%"
type="year"
@change="getActivityList"
v-model="pageForm.year"
value-format="yyyy"
></el-date-picker>
</div>
</div>
<div class="search-item">
<div class="search-item-label">所属活动</div>
<div class="search-item-option">
<el-select @change="doSearch"
placeholder="请选择活动查询"
style="width: 100%;"
v-model="pageForm.activityId">
<el-option :label="item.title" :value="item.id"
v-for="item in activityList"></el-option>
</el-select>
</div>
</div>
<div class="search-item">
<div class="search-item-label">姓名/电话</div>
<div class="search-item-option">
<el-input v-model="pageForm.searchKeyword" placeholder="请输入姓名"
clearable @keyup.enter.native="doSearch"></el-input>
</div>
</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="mt-3">
<el-row type="flex" style="justify-content: flex-end" class="mb-3">
<el-button icon="el-icon-plus" type="primary" size="small" @click="openAddUser">添加报名人员</el-button>
<el-button icon="el-icon-plus" type="primary" size="small" @click="doExport">导出</el-button>
<el-radio-group v-model="pageForm.isSignIn" type="primary" class="ml-3"@change="doSearch">
<el-radio-button :label="1">全部</el-radio-button>
<el-radio-button :label="2">已签到</el-radio-button>
<el-radio-button :label="3">未签到</el-radio-button>
</el-radio-group>
<el-card shadow="never">
<div class="search">
<div class="search-item">
<div class="search-item-label">年度</div>
<div class="search-item-option">
<el-date-picker
:clearable="false"
placeholder="选择年"
style="width: 100%"
type="year"
@change="getActivityList"
v-model="pageForm.year"
value-format="yyyy"
></el-date-picker>
</div>
</div>
<div class="search-item">
<div class="search-item-label">所属活动</div>
<div class="search-item-option">
<el-select @change="doSearch"
placeholder="请选择活动查询"
style="width: 100%;"
v-model="pageForm.activityId">
<el-option :label="item.title" :value="item.id"
v-for="item in activityList"></el-option>
</el-select>
</div>
</div>
<div class="search-item">
<div class="search-item-label">姓名/电话</div>
<div class="search-item-option">
<el-input v-model="pageForm.searchKeyword" placeholder="请输入姓名"
clearable @keyup.enter.native="doSearch"></el-input>
</div>
</div>
<div class="search-item">
<div class="search-item-label">签到状态</div>
<div class="search-item-option">
<el-select v-model="pageForm.isSignIn" placeholder="请选择发放状态" clearable>
<el-option label="已签到" :value="1"></el-option>
<el-option label="未签到" :value="0"></el-option>
</el-select>
</div>
</div>
<div class="search-item">
<div class="search-item-label">所属单位</div>
<div class="search-item-option">
<el-select placeholder="请选择所属单位"
style="width: 100%;" clearable
filterable
@change="setModifyFormUnit"
v-model="pageForm.unitId">
<el-option :label="item.name" :value="item.id"
v-for="item in units"></el-option>
</el-select>
</div>
</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="mt-3">
<el-row type="flex" style="justify-content: flex-end" class="mb-3">
<el-button icon="el-icon-plus" type="primary" size="small" @click="openAddUser">添加报名人员</el-button>
<el-button icon="el-icon-plus" type="primary" size="small" @click="doExport">导出</el-button>
</el-row>
<el-table v-loading="tableLoading" show-overflow-tooltip :data="tableData">
<el-table-column label="序号" type="index" header-align="center" align="center"
width="50"></el-table-column>
<el-table-column label="姓名" prop="userName"></el-table-column>
<el-table-column label="性别" prop="sex"></el-table-column>
<el-table-column label="联系方式" prop="phone"></el-table-column>
<el-table-column label="身份证件号" prop="idCard"></el-table-column>
<el-table-column label="职务" prop="position"></el-table-column>
<el-table-column label="所属单位" prop="unitName"></el-table-column>
<el-table-column label="报名时间" prop="signUpTime"></el-table-column>
<el-table v-loading="tableLoading" show-overflow-tooltip :data="tableData">
<el-table-column label="序号" type="index" header-align="center" align="center"
width="50"></el-table-column>
<el-table-column label="姓名" prop="userName"></el-table-column>
<el-table-column label="性别" prop="sex"></el-table-column>
<el-table-column label="联系方式" prop="phone"></el-table-column>
<el-table-column label="身份证件号" prop="idCard"></el-table-column>
<el-table-column label="职务" prop="position"></el-table-column>
<el-table-column label="所属单位" prop="unitName"></el-table-column>
<el-table-column label="报名时间" prop="signUpTime"></el-table-column>
<el-table-column label="是否签到" prop="isSignIn">
<template slot-scope="{row}">
{{row.isSignIn?'已签到':'未签到'}}
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="250">
<template #default="scope">
<el-button type="text" @click="openModify">修改</el-button>
<el-button type="text" class="text-danger" @click="onTableRowDelete(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--#include("/layouts/pagination.html"){}#-->
</el-card>
<el-dialog title="添加报名人员" :visible.sync="addDialog" width="60%">
<el-form :model="formData" :rules="formRules" ref="formRef" label-width="100px">
<el-form-item label="活动名称" prop="activityName">
<el-input v-model="formData.activityName" readonly></el-input>
</el-form-item>
<el-form-item label="参加单位" prop="unitName">
<el-input v-model="formData.unitName" placeholder="请输入参加单位"></el-input>
</el-form-item>
<el-form-item label="联系人" prop="contactName">
<el-input v-model="formData.contactName" placeholder="请输入联系人"></el-input>
</el-form-item>
<el-form-item label="联系方式" prop="contactPhone">
<el-input v-model="formData.contactPhone" placeholder="请输入联系方式" maxlength="11" type="text" show-word-limit></el-input>
</el-form-item>
<el-form-item label="报名人员" prop="userList">
<el-table :data="formData.userList" border size="small" width="100%">
<el-table-column label="姓名" prop="userName" fixed width="200">
<template slot-scope="{row}">
<el-autocomplete style="width: 100%"
v-model="row.userName"
:fetch-suggestions="queryUserAsync"
placeholder="请输入内容"
@select="handleSelect($event, row)"
></el-autocomplete>
<!-- <el-input v-model="row.userName" maxlength="50"-->
<!-- placeholder="请输入姓名"></el-input>-->
</template>
</el-table-column>
<el-table-column label="性别" prop="sex" width="200">
<template slot-scope="{row}">
<el-radio-group v-model="row.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</template>
</el-table-column>
<el-table-column label="联系方式" prop="phone" width="200">
<template slot-scope="{row}">
<el-input v-model="row.phone" maxlength="11" type="text"
show-word-limit placeholder="请输入联系方式"></el-input>
</template>
</el-table-column>
<el-table-column label="身份证件号" prop="idCard" width="250">
<template slot-scope="{row}">
<el-input v-model="row.idCard" maxlength="18" type="text"
show-word-limit placeholder="请输入身份证件号"></el-input>
</template>
</el-table-column>
<el-table-column label="职务" prop="position" width="200">
<template slot-scope="{row}">
<el-input v-model="row.position" maxlength="100"
placeholder="请输入职务"></el-input>
</template>
</el-table-column>
<!--<el-table-column label="所属单位" prop="unitName" width="250">
<template slot-scope="{row}">
<el-input v-model="row.unitName" maxlength="100" placeholder="请输所属单位"></el-input>
</template>
</el-table-column>-->
<el-table-column width="100px" fixed="right">
<template slot="header" slot-scope="scope">
<el-button type="primary" size="mini"
@click="formData.userList.push({})">添加
</el-button>
</template>
<template slot-scope="scope">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="formData.userList.length===0"
@click="formData.userList.splice(scope.$index,1)"
></el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="addDialog = false">取 消</el-button>
<el-button type="primary" @click="onAddUserSubmit">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="修改报名信息" :visible.sync="modifyDialog" width="40%">
<el-form :model="modifyForm" :rules="modifyRules" ref="modifyFormRef" label-width="100px">
<el-form-item label="姓名" prop="userName">
<el-input v-model="modifyForm.userName"></el-input>
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="modifyForm.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="联系方式" prop="phone">
<el-input v-model="modifyForm.phone"></el-input>
</el-form-item>
<el-form-item label="身份证件号" prop="idCard">
<el-input v-model="modifyForm.idCard"></el-input>
</el-form-item>
<el-form-item label="职务" prop="position">
<el-input v-model="modifyForm.position"></el-input>
</el-form-item>
<el-form-item label="所属单位" prop="unitName">
<el-input v-model="modifyForm.unitName"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<template #default="scope">
<el-button type="primary" size="mini" @click="openModify(scope.row)">修改</el-button>
<el-button type="danger" size="mini" @click="doRemove(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--#include("/layouts/pagination.html"){}#-->
</el-card>
<el-dialog title="添加报名人员" :visible.sync="addDialog" width="60%">
<el-form :model="formData" :rules="formRules" ref="formRef" label-width="100px">
<el-form-item label="活动名称" prop="activityName">
<el-input v-model="formData.activityName" readonly></el-input>
</el-form-item>
<el-form-item label="参加单位" prop="unitName">
<el-select placeholder="请选择所属单位"
style="width: 100%;" clearable
@change="setFormDataUnit"
v-model="formData.unitId">
<el-option :label="item.name" :value="item.id"
v-for="item in units"></el-option>
</el-select>
<!-- <el-input v-model="formData.unitName" placeholder="请输入参加单位"></el-input>-->
</el-form-item>
<el-form-item label="联系人" prop="contactName">
<el-input v-model="formData.contactName" placeholder="请输入联系人"></el-input>
</el-form-item>
<el-form-item label="联系方式" prop="contactPhone">
<el-input v-model="formData.contactPhone" placeholder="请输入联系方式" maxlength="11" type="text" show-word-limit></el-input>
</el-form-item>
<el-form-item label="报名人员" prop="userList">
<el-table :data="formData.userList" border size="small" width="100%">
<el-table-column label="姓名" prop="userName" fixed width="200">
<template slot-scope="{row}">
<el-autocomplete style="width: 100%"
v-model="row.userName"
:fetch-suggestions="queryUserAsync"
placeholder="请输入内容"
@select="handleSelect($event, row)"
></el-autocomplete>
<!-- <el-input v-model="row.userName" maxlength="50"-->
<!-- placeholder="请输入姓名"></el-input>-->
</template>
</el-table-column>
<el-table-column label="性别" prop="sex" width="200">
<template slot-scope="{row}">
<el-radio-group v-model="row.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</template>
</el-table-column>
<el-table-column label="联系方式" prop="phone" width="200">
<template slot-scope="{row}">
<el-input v-model="row.phone" maxlength="11" type="text"
show-word-limit placeholder="请输入联系方式"></el-input>
</template>
</el-table-column>
<el-table-column label="身份证件号" prop="idCard" width="250">
<template slot-scope="{row}">
<el-input v-model="row.idCard" maxlength="18" type="text"
show-word-limit placeholder="请输入身份证件号"></el-input>
</template>
</el-table-column>
<el-table-column label="职务" prop="position" width="200">
<template slot-scope="{row}">
<el-input v-model="row.position" maxlength="100"
placeholder="请输入职务"></el-input>
</template>
</el-table-column>
<!--<el-table-column label="所属单位" prop="unitName" width="250">
<template slot-scope="{row}">
<el-input v-model="row.unitName" maxlength="100" placeholder="请输所属单位"></el-input>
</template>
</el-table-column>-->
<el-table-column width="100px" fixed="right">
<template slot="header" slot-scope="scope">
<el-button type="primary" size="mini"
@click="formData.userList.push({})">添加
</el-button>
</template>
<template slot-scope="scope">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="formData.userList.length===0"
@click="formData.userList.splice(scope.$index,1)"
></el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="addDialog = false">取 消</el-button>
<el-button type="primary" @click="onAddUserSubmit">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="修改报名信息" :visible.sync="modifyDialog" width="40%">
<el-form :model="modifyForm" :rules="modifyRules" ref="modifyFormRef" label-width="100px">
<el-form-item label="姓名" prop="userName">
<el-input v-model="modifyForm.userName"></el-input>
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="modifyForm.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="联系方式" prop="phone">
<el-input v-model="modifyForm.phone"></el-input>
</el-form-item>
<el-form-item label="身份证件号" prop="idCard">
<el-input v-model="modifyForm.idCard"></el-input>
</el-form-item>
<el-form-item label="职务" prop="position">
<el-input v-model="modifyForm.position"></el-input>
</el-form-item>
<el-form-item label="所属单位" prop="unitName">
<el-select placeholder="请选择所属单位"
style="width: 100%;" clearable
@change="setModifyFormUnit"
v-model="modifyForm.unitId">
<el-option :label="item.name" :value="item.id"
v-for="item in units"></el-option>
</el-select>
<!-- <el-input v-model="modifyForm.unitName"></el-input>-->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="modifyDialog = false">取消</el-button>
<el-button type="primary" @click="onModifySubmit">提交</el-button>
</span>
</el-dialog>
</el-dialog>
</div>
<script>
const vue = new Vue({
el: "#app",
mixins: [initTableMixins],
data() {
return {
pageForm: {
isSignIn: 1,
year: new Date().getFullYear() + '',
},
activityList: [],
// 修改表单
modifyDialog: false,
modifyForm: {},
modifyRules: {
userName: [{required: true, message: '请输入姓名', trigger: ['blur', 'change']}],
sex: [{required: true, message: '请选择性别', trigger: ['blur', 'change']}],
phone: [{
required: true,
validator: (rule, value, callback) => {
if (!value) {
// 如果值为空,直接通过校验
callback();
} else if (/^[1][345789][0-9]{9}$/.test(value)) {
// 手机号格式正确
callback();
} else if (/^\d+-\d+$/.test(value) && value.length <= 16) {
// 座机号格式正确
callback();
} else {
// 格式错误,返回错误信息
callback(new Error(value.includes('-') ? '座机号码格式错误' : '手机号码格式错误'));
}
},
trigger: ["change", "blur"]
}],
idCard: [
{
required: true,
validator: (rule, value, callback) => {
if (!value) {
// 如果值为空,直接通过校验
callback();
} else if (/^[1-9]\d{5}(18|19|20)?\d{2}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}(\d|[Xx])$/.test(value)) {
// 18位身份证号码格式正确
callback();
} else if (/^[1-9]\d{7}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 15位身份证号码格式正确
callback();
} else if (/^[1-9]\d{5}(18|19|20)?\d{2}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 外国人身份证号码格式正确(18位)
callback();
} else if (/^[1-9]\d{7}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 外国人身份证号码格式正确(15位)
callback();
} else {
// 格式错误,返回错误信息
callback(new Error("身份证号码格式错误"));
}
},
trigger: ["change", "blur"]
}
],
position: [{required: true, message: '请输入职务', trigger: ['blur', 'change']}],
unitName: [{required: true, message: '请输入所属单位', trigger: ['blur', 'change']}],
},
// 添加报名人员相关
addDialog: false,
formData: {
activityId: '',
userList: []
},
formRules: {
activityId: [{required: true, message: '请选择活动', trigger: ['blur', 'change']}],
unitName: [{required: true, message: '请填写参加单位', trigger: ['blur', 'change']}],
contactName: [{required: true, message: '请填写联系人', trigger: ['blur', 'change']}],
contactPhone: [{required: true, message: '请填写联系电话', trigger: ['blur', 'change']}],
userList: [{required: true, message: '请添加报名人员', trigger: ['blur', 'change']}]
},
}
},
methods: {
doExport() {
window.open("/platform/activity/user/doExport?activityId=" + this.pageForm.activityId + "&searchKeyword=" + this.pageForm.searchKeyword)
},
openAddUser(){
if (!this.pageForm.activityId) {
this.$message.warning('请先选择活动')
return
}
this.formData.userList = []
this.addDialog = true
this.formData.activityId = this.pageForm.activityId
this.formData.activityName = this.activityList.find(item => item.id === this.formData.activityId).title
},
async queryUserAsync(query, cb){
const resp = await $.post('/platform/activity/user/queryUser', {
query,
activityId: this.formData.activityId
})
if (resp.code === 0) {
if (resp.data.list && resp.data.list.length > 0) {
cb(resp.data.list.map(v => {
return {value: v.username + '(' + (v.phone ? v.phone : '未填写联系方式') + ')', ...v}
}))
} else {
cb([])
}
} else {
cb([])
}
},
handleSelect(item, row){
this.$set(row, 'userId', item.id)
this.$set(row, 'userName', item.username)
this.$set(row, 'sex', item.sex)
this.$set(row, 'phone', item.phone ? item.phone : '')
},
async onAddUserSubmit(){
const userList = this.formData.userList;
if (!userList || userList === []) {
this.$message.warning("请添加报名人员")
return
}
let errorMessages = [];
const requiredFields = [
{ key: 'userName', message: '姓名不能为空' },
{ key: 'sex', message: '性别不能为空' },
{ key: 'phone', message: '联系方式不能为空' },
{ key: 'idCard', message: '身份证件号不能为空' },
{ key: 'position', message: '职务不能为空' }
];
userList.forEach((user, index) => {
requiredFields.forEach(field => {
if (user[field.key] == null || user[field.key] === "") {
errorMessages.push('第' + (index + 1) + '行:' + field.message);
}
});
});
if (errorMessages.length > 0) {
// 将错误信息转换为 HTML 格式,使用 <br> 实现换行
const errorSummary = errorMessages.join("<br>");
this.$message.warning({
message: errorSummary,
dangerouslyUseHTMLString: true
});
return
}
const formData = JSON.parse(JSON.stringify(this.formData));
formData.userList = JSON.stringify(this.formData.userList)
const resp = await $.post('/platform/activity/user/doAddActUser', formData)
if (resp.code === 0) {
this.$message.success(resp.msg)
this.addDialog = false
this.formData = {
activityId: '',
userList: []
}
this.doSearch()
} else {
this.$message.warning('操作失败')
console.log(resp.msg)
}
},
async openModify(row) {
const resp = await $.post('/platform/activity/user/findSignUserInfo', {id: row.id})
if (resp.code === 0) {
this.modifyForm = resp.data
this.modifyDialog = true
} else {
this.$message.warning('查询异常')
console.log(resp.msg)
}
},
onModifySubmit() {
this.$refs.modifyFormRef.validate(async valid => {
if (valid) {
const resp = await $.post('/platform/activity/user/doModifyActUser', this.modifyForm)
if (resp.code === 0) {
this.$message.success(resp.msg)
this.modifyDialog = false
this.$refs.modifyFormRef.resetFields()
this.doSearch()
} else {
this.$message.warning('操作失败')
console.log(resp.msg)
}
}
})
},
async getActivityList(){
const resp = await $.post('/platform/activity/user/getActivityList', {
year: this.pageForm.year
})
if (resp.code === 0 && resp.data && resp.data.length > 0) {
this.activityList = resp.data
this.$set(this.pageForm, 'activityId', this.activityList[0].id)
} else {
this.$set(this.pageForm, 'activityId', '')
}
this.pageData()
}
},
created() {
this.getActivityList()
}
})
const vue = new Vue({
el: "#app",
mixins: [initTableMixins],
data() {
return {
pageForm: {
year: new Date().getFullYear() + '',
},
activityList: [],
// 修改表单
modifyDialog: false,
modifyForm: {},
modifyRules: {
userName: [{required: true, message: '请输入姓名', trigger: ['blur', 'change']}],
sex: [{required: true, message: '请选择性别', trigger: ['blur', 'change']}],
phone: [{
required: true,
validator: (rule, value, callback) => {
if (!value) {
// 如果值为空,直接通过校验
callback();
} else if (/^[1][345789][0-9]{9}$/.test(value)) {
// 手机号格式正确
callback();
} else if (/^\d+-\d+$/.test(value) && value.length <= 16) {
// 座机号格式正确
callback();
} else {
// 格式错误,返回错误信息
callback(new Error(value.includes('-') ? '座机号码格式错误' : '手机号码格式错误'));
}
},
trigger: ["change", "blur"]
}],
idCard: [
{
required: true,
validator: (rule, value, callback) => {
if (!value) {
// 如果值为空,直接通过校验
callback();
} else if (/^[1-9]\d{5}(18|19|20)?\d{2}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}(\d|[Xx])$/.test(value)) {
// 18位身份证号码格式正确
callback();
} else if (/^[1-9]\d{7}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 15位身份证号码格式正确
callback();
} else if (/^[1-9]\d{5}(18|19|20)?\d{2}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 外国人身份证号码格式正确(18位)
callback();
} else if (/^[1-9]\d{7}((0[1-9])|(10|11|12))(([0|1|2][0-9])|10|20|30|31)\d{3}$/.test(value)) {
// 外国人身份证号码格式正确(15位)
callback();
} else {
// 格式错误,返回错误信息
callback(new Error("身份证号码格式错误"));
}
},
trigger: ["change", "blur"]
}
],
position: [{required: true, message: '请输入职务', trigger: ['blur', 'change']}],
unitName: [{required: true, message: '请输入所属单位', trigger: ['blur', 'change']}],
},
// 添加报名人员相关
addDialog: false,
formData: {
activityId: '',
userList: []
},
formRules: {
activityId: [{required: true, message: '请选择活动', trigger: ['blur', 'change']}],
unitName: [{required: true, message: '请填写参加单位', trigger: ['blur', 'change']}],
contactName: [{required: true, message: '请填写联系人', trigger: ['blur', 'change']}],
contactPhone: [{required: true, message: '请填写联系电话', trigger: ['blur', 'change']}],
userList: [{required: true, message: '请添加报名人员', trigger: ['blur', 'change']}]
},
units: [],
}
},
methods: {
setFormDataUnit(val) {
if (!val) {
this.formData.unitName = ''
return
}
this.formData.unitName = this.units.find(item => item.id === this.formData.unitId).name
},
setModifyFormUnit(val) {
if (!val) {
this.modifyForm.unitName = ''
return
}
this.modifyForm.unitName = this.units.find(item => item.id === this.modifyForm.unitId).name
},
doRemove(id) {
this.$confirm('您确定要删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
const resp = await $.post('/platform/activity/user/doDeleteActUser', {id})
if (resp.code === 0) {
this.doSearch()
this.$message.success(resp.msg)
} else {
this.$message.warning('操作失败')
}
})
},
doExport() {
window.open("/platform/activity/user/doExport?activityId=" + this.pageForm.activityId + "&searchKeyword=" + this.pageForm.searchKeyword)
},
openAddUser(){
if (!this.pageForm.activityId) {
this.$message.warning('请先选择活动')
return
}
this.formData.userList = []
this.addDialog = true
this.formData.activityId = this.pageForm.activityId
this.formData.activityName = this.activityList.find(item => item.id === this.formData.activityId).title
},
async queryUserAsync(query, cb){
const resp = await $.post('/platform/activity/user/queryUser', {
query,
activityId: this.formData.activityId
})
if (resp.code === 0) {
if (resp.data.list && resp.data.list.length > 0) {
cb(resp.data.list.map(v => {
return {value: v.username + '(' + (v.phone ? v.phone : '未填写联系方式') + ')', ...v}
}))
} else {
cb([])
}
} else {
cb([])
}
},
handleSelect(item, row){
this.$set(row, 'userId', item.id)
this.$set(row, 'userName', item.username)
this.$set(row, 'sex', item.sex)
this.$set(row, 'phone', item.phone ? item.phone : '')
},
async onAddUserSubmit(){
const userList = this.formData.userList;
if (!userList || userList === []) {
this.$message.warning("请添加报名人员")
return
}
let errorMessages = [];
const requiredFields = [
{ key: 'userName', message: '姓名不能为空' },
{ key: 'sex', message: '性别不能为空' },
{ key: 'phone', message: '联系方式不能为空' },
{ key: 'idCard', message: '身份证件号不能为空' },
{ key: 'position', message: '职务不能为空' }
];
userList.forEach((user, index) => {
requiredFields.forEach(field => {
if (user[field.key] == null || user[field.key] === "") {
errorMessages.push('第' + (index + 1) + '行:' + field.message);
}
});
});
if (errorMessages.length > 0) {
// 将错误信息转换为 HTML 格式,使用 <br> 实现换行
const errorSummary = errorMessages.join("<br>");
this.$message.warning({
message: errorSummary,
dangerouslyUseHTMLString: true
});
return
}
const formData = JSON.parse(JSON.stringify(this.formData));
formData.userList = JSON.stringify(this.formData.userList)
const resp = await $.post('/platform/activity/user/doAddActUser', formData)
if (resp.code === 0) {
this.$message.success(resp.msg)
this.addDialog = false
this.formData = {
activityId: '',
userList: []
}
this.doSearch()
} else {
this.$message.warning('操作失败')
console.log(resp.msg)
}
},
async openModify(row) {
const resp = await $.post('/platform/activity/user/findSignUserInfo', {id: row.id})
if (resp.code === 0) {
this.modifyForm = resp.data
this.modifyDialog = true
} else {
this.$message.warning('查询异常')
console.log(resp.msg)
}
},
onModifySubmit() {
this.$refs.modifyFormRef.validate(async valid => {
if (valid) {
const resp = await $.post('/platform/activity/user/doModifyActUser', this.modifyForm)
if (resp.code === 0) {
this.$message.success(resp.msg)
this.modifyDialog = false
this.$refs.modifyFormRef.resetFields()
this.doSearch()
} else {
this.$message.warning('操作失败')
console.log(resp.msg)
}
}
})
},
async getActivityList(){
const resp = await $.post('/platform/activity/user/getActivityList', {
year: this.pageForm.year
})
if (resp.code === 0 && resp.data && resp.data.length > 0) {
this.activityList = resp.data
this.$set(this.pageForm, 'activityId', this.activityList[0].id)
} else {
this.$set(this.pageForm, 'activityId', '')
}
this.pageData()
},
async getUnits(){
const resp = await $.post('/open/common/units')
if (resp.code === 0) {
this.units = resp.data
}
}
},
created() {
this.getActivityList()
this.getUnits()
}
})
</script>
<!--#
}