Files
UNION_NJUST/target/classes/views/platform/member/apply/index.html
T
2026-09-23 09:38:39 +08:00

676 lines
33 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"){
#-->
<style>
.v-body {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
background-color: #f0f2f5;
}
.v-card {
width: calc(100% - 0px);
height: calc(100% - 0px);
position: relative;
}
.transition-row {
width: 100%;
height: 100%;
}
.transition-item {
width: 100%;
height: 100%;
}
.demo-table-expand {
font-size: 0;
}
.demo-table-expand label {
color: #99a9bf;
}
.word-iframe {
width: 100%;
height: 600px;
}
.word-dialog .el-dialog__body{
padding: 6px 20px;
}
.word-dialog .el-dialog__footer {
text-align: center;
margin: 0 auto;
width: 90%;
}
.word-dialog .el-button {
font-size: 16px;
width: 100%;
}
</style>
<div id="app" v-cloak>
<guava ref="guava">
<template>
<div class="v-body">
<el-card class="v-card" shadow="never">
<el-tabs v-model="activeName">
<el-tab-pane label="申请入会" name="first">
<div style="display: flex;width: 100%;height: 100%;align-items: center;justify-content: center;position: relative;padding: 10px">
<el-card style="width: 500px">
<div slot="header" class="clearfix">
<h4>工会信息</h4>
</div>
<div v-loading="unionInfoLoading">
<el-form label-suffix=":" label-width="120px">
<el-form-item label="工会名称">{{unionInfo.unionname}}
</el-form-item>
<el-form-item label="工会编码">{{unionInfo.unioncode}}
</el-form-item>
<el-form-item label="工会负责人">{{unionInfo.manager}}
</el-form-item>
<el-form-item label="联系电话">{{unionInfo.telephone}}
</el-form-item>
<el-form-item label="加入方式">
<el-radio-group v-model="memberStates">
<el-radio :label="1">新增</el-radio>
<!-- <el-radio :label="2">转入</el-radio>-->
</el-radio-group>
</el-form-item>
</el-form>
<el-row justify="center" type="flex"
style="flex-flow: column;align-items: center">
<!--<el-checkbox v-model="applyFunMember">同时申请加入大病互助基金会员</el-checkbox>-->
<el-button
:disabled="!(unionInfo.apply||unionInfo.reApply)"
type="primary"
@click="apply"
style="width: 70%;margin-top: 20px">
<span v-if="unionInfo.apply||unionInfo.reApply">{{unionInfo.reApply?'重新申请':'申请加入'}}</span>
<span v-else-if="unionInfo.record">{{unionInfo.record.stateName}}</span>
<span v-else>您已是会员</span>
</el-button>
<el-button style="width: 70%;margin-top: 10px;margin-left: 0;" type="primary" @click="exportApply">
导出申请表
</el-button>
</el-row>
</div>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="个人信息" name="second">
<div style="padding: 0 8%;">
<member ref="memberInfo"
:id="'${@shiro.getPrincipalProperty('id')}'" view></member>
</div>
</el-tab-pane>
<el-tab-pane label="申请记录" name="third">
<el-table :data="unionInfo.records" style="width: 100%" row-key="id"
@expand-change="onExpand">
<el-table-column type="expand">
<template slot-scope="{row}">
<el-form class="demo-table-expand" v-loading="row.loading"
label-position="right" label-suffix=":"
label-width="120px">
<el-form>
<el-form-item label="部门工会审核信息&emsp;"
label-width="180px"
class="view-header">
</el-form-item>
</el-form>
<el-row :gutter="20"
v-if="row.info&&row.info.unionAudit">
<el-col :span="12">
<el-form-item label="审核人员">
<span>{{ row.info.unionAudit.username }}</span>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="审核时间">
<span>{{ row.info.unionAudit.auditTime }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="审核意见">
<span>{{ row.info.unionAudit.auditOpinion }}</span>
</el-form-item>
</el-col>
</el-row>
<el-row v-else type="flex" justify="center">
<el-form-item label="暂无审核信息">
</el-form-item>
</el-row>
<el-form>
<el-form-item label="校工会审核信息&emsp;"
label-width="180px"
class="view-header">
</el-form-item>
</el-form>
<el-row :gutter="20"
v-if="row.info&&row.info.schoolAudit">
<el-col :span="12">
<el-form-item label="审核人员">
<span>{{ row.info.schoolAudit.username }}</span>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="审核时间">
<span>{{ row.info.schoolAudit.auditTime }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="审核意见">
<span>{{ row.info.schoolAudit.auditOpinion }}</span>
</el-form-item>
</el-col>
</el-row>
<el-row v-else type="flex" justify="center">
<el-form-item label="暂无审核信息">
</el-form-item>
</el-row>
</el-form>
</template>
</el-table-column>
<el-table-column align="center" header-align="center" label="序号"
type="index"></el-table-column>
<el-table-column label="申请人" prop="username" header-align="center"
align="center"></el-table-column>
<el-table-column label="申请时间" prop="applyTime" header-align="center"
align="center"></el-table-column>
<el-table-column label="工会" prop="unionname" header-align="center"
align="center"></el-table-column>
<el-table-column label="状态" prop="stateId" header-align="center"
align="center">
<template scope="{row}">
<span :style="'color:'+row.stateColor">{{ row.stateName }}</span>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-card>
</div>
</template>
<template #edit_func>
<!-- <el-button type="primary" @click="doSubmit">提交</el-button>-->
</template>
<template #edit>
<el-form :model="formData" :rules="rules" ref="AddForm" label-width="170px">
<div style="width: 800px;margin: 0 auto;">
<h3 style="text-align: center; line-height: 36px; letter-spacing: 8px">
中华全国总工会
<br/>
入会申请书
</h3>
<p style="text-indent: 2em; font-size: 18px; letter-spacing: 3px; font-family: fangsong; font-weight: bold">
我自愿加入中华全国总工会,遵守工会章程,执行工会决议,积极参加工会活动,为全面建成小康社会、把我国建设成为富强民主文明和谐美丽的社会主义现代化强国、实现中华民族伟大复兴的中国梦而奋斗。
</p>
</div>
<el-divider></el-divider>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="姓名" prop="username">
<el-input disabled placeholder="姓名"
v-model="formData.username"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="性别" prop="sex">
<el-radio v-model="formData.sex" label="男" border size="small">男
</el-radio>
<el-radio v-model="formData.sex" label="女" border size="small">女
</el-radio>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="nation" label="民族">
<el-select placeholder="请选择民族" style="width: 100%" filterable v-model="formData.nation">
<el-option v-for="nation in nationOptions" :key="nation" :value="nation"
:label="nation"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="education" label="学历">
<dict-select code="Education" placeholder="请选择学历"
style="width: 100%"
v-model="formData.education"></dict-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="political" label="政治面貌">
<dict-select code="political" placeholder="请选择政治面貌"
style="width: 100%"
v-model="formData.political"></dict-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="marriage" label="婚否">
<dict-select v-model="formData.marriage" style="width: 100%" placeholder="请选择婚否"
code="maritalStatus"></dict-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="idcard" label="身份证号">
<el-input v-model="formData.idcard" placeholder="身份证号"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="mobile" label="联系电话">
<el-input maxlength="100" placeholder="联系电话"
v-model="formData.mobile"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="unitid" label="所属单位">
<el-select placeholder="所属单位"
style="width: 100%"
filterable @change="unitChange"
v-model="formData.unitid">
<el-option v-for="unit in unitOptions" :key="unit.id" :value="unit.id"
:label="unit.name"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="registeredResidence" label="户口所在地">
<el-input maxlength="50" placeholder="请填写户口所在地"
v-model="formData.registeredResidence"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="homeAddress" label="现居住地">
<el-input placeholder="请填写现居住地"
v-model="formData.homeAddress"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="jobTitle" label="岗位">
<el-input placeholder="请填写岗位"
v-model="formData.jobTitle"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item prop="vita" label="工作经历">
<el-input maxlength="500" placeholder="请填写工作经历"
v-model="formData.vita" type="textarea"
rows="3"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item prop="specialSkill" label="有何特长">
<el-input maxlength="50" placeholder="请填写特长"
v-model="formData.specialSkill" type="textarea"
rows="3"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="签&emsp;&emsp;字" prop="sign">
<sign :qz.sync="formData.sign" prefix="memberApply"></sign>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="加入爱心互助基金会员" prop="applyFunMember">
<el-radio-group @input="applyFunMemberChange" size="small"
v-model="formData.applyFunMember">
<el-radio :label="true" border>是</el-radio>
<el-radio :label="false" border>否</el-radio>
</el-radio-group>
<span @click="openWord"
style="margin-left: 10px; color: #0e5996; cursor: pointer;">
点击阅读《爱心互助基金办法》
</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="家庭成员">
<span style="color: red">(已结婚填配偶信息,未结婚填父母信息)</span>
<el-table
:data="formData.family"
border
size="mini"
style="width: 100%">
<el-table-column prop="relation" label="与本人关系" align="center"
header-align="center">
<template slot-scope="scope">
<el-input placeholder="请输入与本人关系" maxlength="30"
v-model="scope.row.relation"
clearable></el-input>
</template>
</el-table-column>
<el-table-column prop="name" label="姓名" align="center"
header-align="center">
<template slot-scope="scope">
<el-input placeholder="请输入姓名" maxlength="100"
v-model="scope.row.name" clearable></el-input>
</template>
</el-table-column>
<el-table-column prop="unit" label="单位" align="center"
header-align="center">
<template slot-scope="scope">
<el-input placeholder="请输入单位" maxlength="100"
v-model="scope.row.unit" clearable></el-input>
</template>
</el-table-column>
<el-table-column prop="remark" label="备注" align="center"
header-align="center">
<template slot-scope="scope">
<el-input placeholder="请输入备注" maxlength="100"
v-model="scope.row.remark" clearable></el-input>
</template>
</el-table-column>
<el-table-column label="操作" width="100px" align="center"
header-align="center">
<template slot="header" slot-scope="scope">
<el-button type="primary"
size="mini"
icon="el-icon-plus"
@click="formData.family.push({})">
</el-button>
</template>
<template slot-scope="scope">
<el-button type="danger" icon="el-icon-delete"
size="mini"
:disabled="formData.family.length===0"
@click="formData.family.splice(scope.$index,1)"></el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-row type="flex" justify="end">
<el-button @click="$refs.guava.index()">取消</el-button>
<el-button @click="doSubmit" type="primary">提交</el-button>
</el-row>
</template>
<template #view>
</template>
</guava>
<el-dialog
class="word-dialog"
title="爱心互助基金办法"
:visible.sync="wordDialogVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
:show-close="true"
@close="wordDialogClose"
top="2%"
width="45%">
<vi-title title="爱心互助基金事关教职工的切身权益,请仔细阅读。"></vi-title>
<iframe class="word-iframe" scrolling="auto" frameborder="none;"
src="/assets/platform/plugins/pdfJs/web/viewer.html?file=/assets/platform/word/南京理工大学教职工爱心互助基金管理办法.pdf">
</iframe>
<span slot="footer" class="dialog-footer">
<el-button :type="seconds > 0 ? 'info' : 'primary'" @click="applyDo"
:disabled="seconds > 0">
我已阅读《爱心互助基金办法》条款内容,继续提交申请
<span v-if="seconds > 0" style="font-size: 18px; font-weight: bold">({{seconds}}s)</span>
</el-button>
</span>
</el-dialog>
</div>
<script>
let intervalId = null
const vue = new Vue({
el: '#app',
dicts: ['memberApplyPersonType'],
mixins: [initTableMixins],
data() {
return {
seconds: 10,
wordDialogVisible: false,
formData: {
family: []
},
reading: false,
activeName: 'first',
unionInfoLoading: true,
unionInfo: {},
memberStates: 1,
rules: {
sex: [{required: true, message: '必填', trigger: ['blur', 'change']}],
nation: [{required: true, message: '必填', trigger: ['blur', 'change']}],
education: [{required: true, message: '必填', trigger: ['blur', 'change']}],
academicDegree: [{required: true, message: '必填', trigger: ['blur', 'change']}],
political: [{required: true, message: '必填', trigger: ['blur', 'change']}],
applyFunMember: [{required: true, message: '必填', trigger: ['blur', 'change']}],
idcard: [
{required: true, message: '必填', trigger: 'blur'},
{pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '你的身份证格式不正确'}
],
mobile: [
{required: true, message: '必填', trigger: 'blur'},
{pattern: /^1[34578]\d{9}$/, message: '你的联系电话格式不正确'}
],
position: [{required: true, message: '必填', trigger: ['blur', 'change']}],
homeAddress: [{required: true, message: '必填', trigger: ['blur', 'change']}],
specialSkill: [{required: true, message: '必填', trigger: ['blur', 'change']}],
marriage: [{required: true, message: '必填', trigger: ['blur', 'change']}],
unitid: [{required: true, message: '必填', trigger: ['blur', 'change']}],
sign: [{required: true, message: '必填', trigger: ['blur', 'change']}],
registeredResidence: [{
required: true,
message: '必填',
trigger: ['blur', 'change']
}],
},
nationOptions: nation,
unitOptions: [],
hasRead: false,
}
},
components: {
'guava': httpVueLoader('/components/plugins/Guava.vue?v=1.0.0'),
'member': httpVueLoader('/components/member/MemberInfo.vue?v=1.0.3'),
'dict-select': httpVueLoader('/components/plugins/DictSelect.vue?v=1.0.0'),
'sign': httpVueLoader('/components/sign/sign.vue?v' + new Date().getTime()),
},
methods: {
applyFunMemberChange() {
if (this.hasRead === false) {
this.$alert('请先仔细阅读爱心互助基金办法', '温馨提醒')
this.formData.applyFunMember = null
}
},
wordDialogClose() {
clearInterval(intervalId);
},
openWord() {
this.wordDialogVisible = true
this.$nextTick(() => {
intervalId = setInterval(() => {
if (this.seconds <= 0) {
clearInterval(intervalId);
} else {
this.seconds -= 1;
}
}, 1000)
})
},
async onExpand(row) {
this.$set(row, "loading", true)
const resp = await $.get("/platform/member/common/findApplyInfo", {id: row.id})
this.$set(row, "loading", false)
if (resp.code === 0) {
this.$set(row, "info", resp.data)
} else {
this.$set(row, "info", {})
this.notifyWarning(resp.msg)
}
},
async doApply(user) {
if (!this.reading) {
this.$notify.warning({title: '提示', message: '请勾选阅读须知'});
return
}
const resp = await $.get(loc() + "/doApply", {memberStates: this.memberStates})
if (resp.code === 0) {
await this.getUnionInfo()
this.$refs.memberInfo.getUserInfo()
this.$refs.guava.index()
} else {
this.notifyWarning(resp.msg)
}
},
doSubmit() {
this.$refs['AddForm'].validate(async (valid) => {
if (valid) {
const confirm = await this.$confirm('您确定要申请吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
if ('confirm' !== confirm) return
const loading = this.$loading({
lock: true,
text: '数据提交中...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
const formData = clone(this.formData)
formData.family = JSON.stringify(this.formData.family)
await $.post("/platform/member/apply/submit/doEdit", formData)
const resp = await $.post(loc() + "/doApply", {
memberStates: this.memberStates,
sign: formData.sign,
applyFunMember: this.formData.applyFunMember
})
if (resp.code === 0) {
await this.getUnionInfo()
this.$refs.memberInfo.getUserInfo()
this.$refs.guava.index()
this.notifySuccess(resp.msg)
} else {
this.notifyWarning(resp.msg)
}
loading.close()
}
})
},
applyDo() {
this.hasRead = true
this.wordDialogVisible = false
},
async apply() {
/*const values = this.dict.type.memberApplyPersonType.map(v => v.value)
const personType = "${@shiro.getPrincipalProperty('personType')}"
const msg = '您当前的人员类型是<span style="color: red">' + (personType || '空') + '</span>,目前只允许<strong>' + values.join('、') + '</strong>加入会员,如有疑问,请联系校工会进行更改。'
if (!values.includes(personType)) {
this.$alert(msg, '提示', {
confirmButtonText: '确定',
dangerouslyUseHTMLString: true
})
return
}*/
this.$refs.guava.edit()
//this.wordDialogVisible = true
},
async getUnionInfo() {
this.unionInfoLoading = true
const resp = await $.get(loc() + "/unionInfo")
this.unionInfoLoading = false
if (resp.code === 0) {
this.unionInfo = resp.data
this.formData = resp.data
this.$set(this.formData, "family", resp.data.family ? JSON.parse(resp.data.family) : [])
this.formData = resp.data
} else {
this.notifyWarning(resp.msg)
}
},
async unitChange(v) {
const unit = this.unitOptions.find(x => x.id === v)
if (unit) {
this.formData.unionid = unit.unionid
this.formData.unionname = unit.unionname
} else {
this.formData.unionid = ''
this.formData.unionname = ''
}
},
exportApply() {
window.open(loc() + '/exportApply')
}
},
async created() {
this.getUnionInfo()
this.unitOptions = await getUnionUnits()
}
})
</script>
<!--#
}
#-->