529 lines
25 KiB
HTML
529 lines
25 KiB
HTML
<!--#
|
||
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;
|
||
}
|
||
|
||
|
||
</style>
|
||
|
||
<div id="app" v-cloak>
|
||
<guava ref="guava" style="width: 100%;height: 100%">
|
||
<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-button
|
||
:disabled="!((unionInfo.apply||unionInfo.reApply)&&reading)"
|
||
type="primary"
|
||
@click="apply"
|
||
style="width: 70%;margin-left: 15%;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-radio
|
||
style="width: 70%;margin-left: 15%;margin-top: 20px;color: #F56C6C"
|
||
v-model="reading" :label="true">
|
||
阅读须知：我自愿加入工会
|
||
</el-radio>
|
||
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
|
||
</el-tab-pane>
|
||
|
||
<el-tab-pane label="个人信息" name="second">
|
||
<div style="padding: 0 8%;padding-top: 50px">
|
||
<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="院级工会审核信息 "
|
||
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="校工会审核信息 "
|
||
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">
|
||
|
||
<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="loginname">
|
||
<el-input disabled placeholder="工号"
|
||
v-model="formData.loginname"></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 v-model="formData.education" style="width: 100%"
|
||
placeholder="请选择学历"
|
||
code="Education"></dict-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="8">
|
||
<el-form-item prop="academicDegree" label="学位">
|
||
<dict-select v-model="formData.academicDegree" style="width: 100%"
|
||
placeholder="请选择学位"
|
||
code="academicDegree"></dict-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="8">
|
||
<el-form-item prop="political" label="政治面貌">
|
||
<el-input maxlength="100" placeholder="政治面貌"
|
||
v-model="formData.political"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="8">
|
||
<el-form-item prop="userState" label="人员类型">
|
||
<dict-select v-model="formData.personType" style="width: 100%" placeholder="请选择人员类型"
|
||
code="UserType"></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="24">
|
||
<el-form-item prop="registeredResidence" label="户口所在地">
|
||
<el-input maxlength="50" placeholder="请填写户口所在地"
|
||
v-model="formData.registeredResidence" type="textarea"
|
||
rows="3"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="24">
|
||
<el-form-item prop="homeAddress" label="现居住地">
|
||
<el-input maxlength="50" placeholder="请填写现居住地"
|
||
v-model="formData.homeAddress" type="textarea"
|
||
rows="3"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item prop="vita" label="个人工作简历">
|
||
<el-input maxlength="50" 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="家庭成员">
|
||
<span style="color: red">(已结婚填配偶信息，未结婚填父母信息)</span>
|
||
<el-button style="float: right;margin-bottom: 10px" icon="el-icon-plus"
|
||
size="mini"
|
||
@click="formData.family.push({})"> 添加成员
|
||
</el-button>
|
||
<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-scope="scope">
|
||
<el-button type="danger" icon="el-icon-delete" circle
|
||
: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>
|
||
|
||
|
||
<!-- <member ref="member" :id="'${@shiro.getPrincipalProperty('id')}'" @save="doApply"></member>-->
|
||
</template>
|
||
|
||
<template #view>
|
||
|
||
</template>
|
||
</guava>
|
||
|
||
|
||
</div>
|
||
|
||
<script>
|
||
const vue = new Vue({
|
||
el: '#app',
|
||
mixins: [initTableMixins],
|
||
data() {
|
||
return {
|
||
formData: {
|
||
family: []
|
||
},
|
||
reading: false,
|
||
activeName: 'first',
|
||
unionInfoLoading: true,
|
||
unionInfo: {},
|
||
memberStates: 1,
|
||
rules: {
|
||
sex: [{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']}],
|
||
idcard: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
mobile: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
position: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
registeredResidence: [{
|
||
required: true,
|
||
message: '必填',
|
||
trigger: ['blur', 'change']
|
||
}],
|
||
},
|
||
nationOptions: nation,
|
||
unitOptions: [],
|
||
}
|
||
},
|
||
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'),
|
||
},
|
||
methods: {
|
||
|
||
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 formData = clone(this.formData)
|
||
formData.family = JSON.stringify(this.formData.family)
|
||
await $.post("/platform/member/apply/submit/doEdit", formData)
|
||
const resp = await $.get(loc() + "/doApply", {memberStates: this.memberStates})
|
||
if (resp.code === 0) {
|
||
await this.getUnionInfo()
|
||
this.$refs.memberInfo.getUserInfo()
|
||
this.$refs.guava.index()
|
||
this.notifySuccess(resp.msg)
|
||
} else {
|
||
this.notifyWarning(resp.msg)
|
||
}
|
||
}
|
||
})
|
||
},
|
||
async apply() {
|
||
this.$refs.guava.edit()
|
||
},
|
||
|
||
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 = ''
|
||
}
|
||
},
|
||
|
||
},
|
||
async created() {
|
||
this.getUnionInfo()
|
||
this.unitOptions = await getUnionUnits()
|
||
}
|
||
})
|
||
</script>
|
||
<!--#
|
||
}
|
||
#-->
|