first commit
This commit is contained in:
那些花儿
@@ -0,0 +1,405 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-index-bar__sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 12px 12px 12px 12px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-divider {
|
||||
margin: 6px 0 6px 0;
|
||||
border-color: #1867b0;
|
||||
}
|
||||
|
||||
.van-button--small {
|
||||
border-radius: 8px;
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.van-col {
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.title_span {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
top: 11px;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.cus_overflow {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.van-dropdown-menu__item {
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.van-cell__title {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.van-cell__right-icon {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.van-sidebar-item {
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background-color: white;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.footer .van-button {
|
||||
height: 34px;
|
||||
border-radius: 6px;
|
||||
width: 90% !important;
|
||||
}
|
||||
|
||||
.join {
|
||||
background-color: #0e78c5;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.info_tab .van-doc-card > div:first-child {
|
||||
border: 2px #0e78c5 solid;
|
||||
width: 26px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.more_text {
|
||||
display: inline-block !important;
|
||||
}
|
||||
.more_text .van-cell__value {
|
||||
width: 100% !important;
|
||||
}
|
||||
.more_text .van-field__label {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.van-card-header {
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
box-sizing: border-box;
|
||||
color: #0e78c5;
|
||||
font-weight: bold;
|
||||
}
|
||||
.van-tabs {
|
||||
height: calc(100vh - 46px);
|
||||
overflow: auto;
|
||||
}
|
||||
.van-cell-group__title {
|
||||
padding: 6px 0;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar title="会员入会分工会审核" left-text="返回" left-arrow @click-left="$pjaxReplace('/platform/h5/home')"></van-nav-bar>
|
||||
<van-search
|
||||
v-model="pageForm.searchKeyword"
|
||||
placeholder="请输入工号或者姓名进行查询"
|
||||
:show-action="false"
|
||||
:reverse-color="false"
|
||||
input-align="left"
|
||||
@search="doSearch"
|
||||
></van-search>
|
||||
<van-dropdown-menu :close-on-click-outside="false" :close-on-click-overlay="false">
|
||||
<van-dropdown-item :options="unitList" @change="doSearch" v-model="pageForm.unitId"></van-dropdown-item>
|
||||
<van-dropdown-item :options="auditList" @change="doSearch" v-model="pageForm.audit"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list v-if="tableData.length>0" v-model="tableLoading" :finished="tableFinished" finished-text="没有更多了" @load="pageData">
|
||||
<div v-for="item in tableData" :key="item.id" class="van-doc-card">
|
||||
<div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="width: 74%">
|
||||
<div class="van-ellipsis title">
|
||||
<span class="title_span">|</span>
|
||||
<span>{{item.username + '(' + item.loginname + ')'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 4px">
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">所属工会：</span>
|
||||
{{item.unionName}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">工作单位：</span>
|
||||
<span>{{item.unitName}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">在职状态：</span>
|
||||
{{item.userState}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人事编制：</span>
|
||||
<span>{{item.preparedBy}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人员类型：</span>
|
||||
{{item.personType}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">申报类型：</span>
|
||||
{{ '入会申请' }}
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
|
||||
<van-divider></van-divider>
|
||||
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<div>
|
||||
<span style="color: grey">当前状态：</span>
|
||||
<span>{{item.processInstanceNodeName}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<van-button size="small" @click="openView(item)" type="info" style="margin-right: 4px">查看</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
type="primary"
|
||||
v-if="item.processInstanceTaskStatus==='ACTIVE'"
|
||||
@click="openApproval(item)"
|
||||
style="margin-right: 4px"
|
||||
>
|
||||
审核
|
||||
</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
@click="openRevoke(item.processInstanceTaskId)"
|
||||
type="danger"
|
||||
style="margin-right: 4px"
|
||||
v-if="item.processInstanceTaskStatus==='COMPLETE'
|
||||
&& !item.nextTaskIsComplete"
|
||||
>
|
||||
撤回
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据" v-else></van-empty>
|
||||
</div>
|
||||
|
||||
<van-popup v-model="infoShow" position="right" :style="{ height: '100%', width: '100%' }" safe-area-inset-bottom>
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="infoShow=false" left-arrow left-text="返回" title="分工会审核"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<member-change-info ref="memberChangeInfoRef"></member-change-info>
|
||||
<div v-if="showApprovalForm">
|
||||
<div class="process-title">{{formData.processInstanceNodeName}}</div>
|
||||
<form @submit.prevent="">
|
||||
<van-field label="审核意见" name="approvalOpinion" v-model="formData.approvalOpinion" required></van-field>
|
||||
<van-field label="签字" name="signature" v-model="formData.approvalSignature" required class="direction-column-field">
|
||||
<h5-signature v-model="formData.approvalSignature" slot="input"></h5-signature>
|
||||
</van-field>
|
||||
</form>
|
||||
<div style="display: flex; justify-content: space-between; column-gap: 10px; padding: 10px">
|
||||
<van-button type="danger" block @click.submit="doApproval('BACK')">退回</van-button>
|
||||
<van-button type="danger" block @click.submit="doApproval('REJECT')">建议撤销</van-button>
|
||||
<van-button type="primary" block @click.submit="doApproval('PASS')">同意</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
</div>
|
||||
<script>
|
||||
<!--#include("../../common/mobileMemberChangeInfo.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unionId: "",
|
||||
unitId: "",
|
||||
audit: false
|
||||
},
|
||||
tableData: [],
|
||||
unitList: [],
|
||||
auditList: [
|
||||
{ text: "已审核", value: true },
|
||||
{ text: "未审核", value: false }
|
||||
],
|
||||
tableLoading: false,
|
||||
tableFinished: false,
|
||||
|
||||
userId: "",
|
||||
infoShow: false,
|
||||
showApprovalForm: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"member-change-info": MOBILE_MEMBER_CHANGE_INFO
|
||||
},
|
||||
methods: {
|
||||
openApproval(row) {
|
||||
this.infoShow = true
|
||||
this.$nextTick(() => {
|
||||
this.showApprovalForm = true
|
||||
this.formData = row.approvalParam
|
||||
this.$refs.memberChangeInfoRef.activeName = "change"
|
||||
this.$refs.memberChangeInfoRef.onOpen({ recordId: row.id, userId: row.userId })
|
||||
})
|
||||
},
|
||||
doApproval(approvalType) {
|
||||
this.formData.bpmTaskApprovalType = approvalType
|
||||
formRules(this.rules, this.formData, (valid) => {
|
||||
if (valid) {
|
||||
this.$axios
|
||||
.post("/platform/member/apply/branchUnionAudit/approval", {
|
||||
approval: JSON.stringify(this.formData)
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.infoShow = false
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
openRevoke(taskId) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "撤回",
|
||||
message: "您确定要撤回吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/member/apply/branchUnionAudit/revoke", { taskId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
openView(row) {
|
||||
this.infoShow = true
|
||||
this.$nextTick(() => {
|
||||
this.showApprovalForm = false
|
||||
this.$refs.memberChangeInfoRef.activeName = "basic"
|
||||
this.$refs.memberChangeInfoRef.onOpen({ recordId: row.id, userId: row.userId })
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.finished = false
|
||||
this.pageData()
|
||||
},
|
||||
pageData() {
|
||||
this.tableLoading = true
|
||||
this.$axios.post("/platform/member/apply/branchUnionAudit/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
if (this.tableData.length >= this.pageForm.totalCount) {
|
||||
this.tableFinished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.tableLoading = false
|
||||
} else {
|
||||
this.$toast(res.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
initUnion() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? null : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnion(unionId).then((data) => {
|
||||
this.unionList = data
|
||||
this.unionList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin) {
|
||||
this.unionList.unshift({ text: "全部工会", value: null })
|
||||
}
|
||||
if (this.unionList && this.unionList.length > 0) {
|
||||
this.$set(this.pageForm, "unionId", this.unionList[0].value)
|
||||
}
|
||||
})
|
||||
},
|
||||
flushUnits() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? this.pageForm.unionId : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnit(unionId).then((data) => {
|
||||
this.unitList = data
|
||||
this.unitList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (this.unitList && this.unitList.length > 0) {
|
||||
this.unitList.unshift({ text: "全部单位", value: null })
|
||||
this.$set(this.pageForm, "unitId", this.unitList[0].value)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initUnion()
|
||||
this.flushUnits()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,399 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-index-bar__sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 12px 12px 12px 12px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-divider {
|
||||
margin: 6px 0 6px 0;
|
||||
border-color: #1867b0;
|
||||
}
|
||||
|
||||
.van-button--small {
|
||||
border-radius: 8px;
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.van-col {
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.title_span {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
top: 11px;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.cus_overflow {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.van-dropdown-menu__item {
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.van-cell__title {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.van-cell__right-icon {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.van-sidebar-item {
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background-color: white;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.footer .van-button {
|
||||
height: 34px;
|
||||
border-radius: 6px;
|
||||
width: 90% !important;
|
||||
}
|
||||
|
||||
.join {
|
||||
background-color: #0e78c5;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.info_tab .van-doc-card > div:first-child {
|
||||
border: 2px #0e78c5 solid;
|
||||
width: 26px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.more_text {
|
||||
display: inline-block !important;
|
||||
}
|
||||
.more_text .van-cell__value {
|
||||
width: 100% !important;
|
||||
}
|
||||
.more_text .van-field__label {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.van-card-header {
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
box-sizing: border-box;
|
||||
color: #0e78c5;
|
||||
font-weight: bold;
|
||||
}
|
||||
.van-tabs {
|
||||
height: calc(100vh - 46px);
|
||||
overflow: auto;
|
||||
}
|
||||
.van-cell-group__title {
|
||||
padding: 6px 0;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar title="我的入会申请" left-text="返回" left-arrow @click-left="$pjaxReplace('/platform/h5/home')"></van-nav-bar>
|
||||
<van-search
|
||||
v-model="pageForm.searchKeyword"
|
||||
placeholder="请输入工号或者姓名进行查询"
|
||||
:show-action="false"
|
||||
:reverse-color="false"
|
||||
input-align="left"
|
||||
@search="doSearch"
|
||||
></van-search>
|
||||
<van-dropdown-menu
|
||||
v-if="$auth.hasRoleOr('SYSADMIN,SCHOOL_UNION_ADMIN,BRANCH_UNION_CHAIRMAN')"
|
||||
:close-on-click-outside="false"
|
||||
:close-on-click-overlay="false"
|
||||
>
|
||||
<van-dropdown-item :options="unionList" @change="unionChange" v-model="pageForm.unionId"></van-dropdown-item>
|
||||
<van-dropdown-item :options="unitList" @change="doSearch" v-model="pageForm.unitId"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list v-if="tableData.length>0" v-model="tableLoading" :finished="tableFinished" finished-text="没有更多了" @load="pageData">
|
||||
<div v-for="item in tableData" :key="item.id" class="van-doc-card">
|
||||
<div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="width: 74%">
|
||||
<div class="van-ellipsis title">
|
||||
<span class="title_span">|</span>
|
||||
<span>{{item.username + '(' + item.loginname + ')'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 4px">
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">所属工会：</span>
|
||||
{{item.unionName}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">工作单位：</span>
|
||||
<span>{{item.unitName}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">在职状态：</span>
|
||||
{{item.userState}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人事编制：</span>
|
||||
<span>{{item.preparedBy}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人员类型：</span>
|
||||
{{item.personType}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">申报类型：</span>
|
||||
{{ '入会申请' }}
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
|
||||
<van-divider></van-divider>
|
||||
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<div>
|
||||
<span style="color: grey">当前状态：</span>
|
||||
<span>{{item.processInstanceNodeName}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<van-button size="small" @click="openView(item)" type="info" style="margin-right: 4px">查看</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
type="primary"
|
||||
v-if="[10,40,70].includes(item.processInstanceNodeCode)"
|
||||
@click="$pjaxReplace('/platform/h5/member/apply/submit?id=' + item.id)"
|
||||
style="margin-right: 4px"
|
||||
>
|
||||
编辑
|
||||
</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
@click="openRevoke(item)"
|
||||
type="danger"
|
||||
style="margin-right: 4px"
|
||||
v-if="[20].includes(item.processInstanceNodeCode) && !item.nextTaskIsComplete"
|
||||
>
|
||||
撤销
|
||||
</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
@click="doDelete(item)"
|
||||
type="danger"
|
||||
style="margin-right: 4px"
|
||||
v-if="[10].includes(item.processInstanceNodeCode)"
|
||||
>
|
||||
删除
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据" v-else></van-empty>
|
||||
</div>
|
||||
|
||||
<van-popup v-model="infoShow" position="right" :style="{ height: '100%', width: '100%' }" safe-area-inset-bottom>
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="infoShow=false" left-arrow left-text="返回" title="我的申请信息"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<member-change-info ref="memberChangeInfoRef"></member-change-info>
|
||||
</van-popup>
|
||||
</div>
|
||||
<script>
|
||||
<!--#include("../../common/mobileMemberChangeInfo.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unionId: "",
|
||||
unitId: ""
|
||||
},
|
||||
tableData: [],
|
||||
unionList: [],
|
||||
unitList: [],
|
||||
tableLoading: false,
|
||||
tableFinished: false,
|
||||
|
||||
userId: "",
|
||||
infoShow: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"member-change-info": MOBILE_MEMBER_CHANGE_INFO
|
||||
},
|
||||
methods: {
|
||||
openRevoke(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "撤销",
|
||||
message: "您确定要撤销吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/member/apply/mine/revokeApply", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
doDelete(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "删除",
|
||||
message: "您确定要删除吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/member/apply/mine/delete", { id: row.id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
openView(row) {
|
||||
this.infoShow = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.memberChangeInfoRef.onOpen({ recordId: row.id, userId: row.userId })
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.finished = false
|
||||
this.pageData()
|
||||
},
|
||||
pageData() {
|
||||
this.tableLoading = true
|
||||
this.$axios.post("/platform/member/apply/mine/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
if (this.tableData.length >= this.pageForm.totalCount) {
|
||||
this.tableFinished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.tableLoading = false
|
||||
} else {
|
||||
this.$toast(res.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
unionChange() {
|
||||
this.$set(this.pageForm, "unitId", null)
|
||||
this.flushUnits()
|
||||
this.doSearch()
|
||||
},
|
||||
initUnion() {
|
||||
try {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? null : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnion(unionId).then((data) => {
|
||||
this.unionList = data
|
||||
this.unionList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin) {
|
||||
this.unionList.unshift({ text: "全部工会", value: null })
|
||||
}
|
||||
if (this.unionList && this.unionList.length > 0) {
|
||||
this.$set(this.pageForm, "unionId", this.unionList[0].value)
|
||||
}
|
||||
})
|
||||
} catch (e) {}
|
||||
},
|
||||
flushUnits() {
|
||||
try {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? this.pageForm.unionId : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnit(unionId).then((data) => {
|
||||
this.unitList = data
|
||||
this.unitList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin && !this.pageForm.unionId) {
|
||||
this.unitList.unshift({ text: "全部单位", value: null })
|
||||
}
|
||||
if (this.unitList && this.unitList.length > 0) {
|
||||
this.$set(this.pageForm, "unitId", this.unitList[0].value)
|
||||
}
|
||||
})
|
||||
} catch (e) {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initUnion()
|
||||
this.flushUnits()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,402 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.van-index-bar__sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 12px 12px 12px 12px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-divider {
|
||||
margin: 6px 0 6px 0;
|
||||
border-color: #1867b0;
|
||||
}
|
||||
|
||||
.van-button--small {
|
||||
border-radius: 8px;
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.van-col {
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.title_span {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
top: 11px;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.cus_overflow {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.van-dropdown-menu__item {
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.van-cell__title {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.van-cell__right-icon {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.van-sidebar-item {
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background-color: white;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.footer .van-button {
|
||||
height: 34px;
|
||||
border-radius: 6px;
|
||||
width: 90% !important;
|
||||
}
|
||||
|
||||
.join {
|
||||
background-color: #0e78c5;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.info_tab .van-doc-card > div:first-child {
|
||||
border: 2px #0e78c5 solid;
|
||||
width: 26px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.more_text {
|
||||
display: inline-block !important;
|
||||
}
|
||||
.more_text .van-cell__value {
|
||||
width: 100% !important;
|
||||
}
|
||||
.more_text .van-field__label {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.van-card-header {
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
box-sizing: border-box;
|
||||
color: #0e78c5;
|
||||
font-weight: bold;
|
||||
}
|
||||
.van-tabs {
|
||||
height: calc(100vh - 46px);
|
||||
overflow: auto;
|
||||
}
|
||||
.van-cell-group__title {
|
||||
padding: 6px 0;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar title="会员入会分工会审核" left-text="返回" left-arrow @click-left="$pjaxReplace('/platform/h5/home')"></van-nav-bar>
|
||||
<van-search
|
||||
v-model="pageForm.searchKeyword"
|
||||
placeholder="请输入工号或者姓名进行查询"
|
||||
:show-action="false"
|
||||
:reverse-color="false"
|
||||
input-align="left"
|
||||
@search="doSearch"
|
||||
></van-search>
|
||||
<van-dropdown-menu :close-on-click-outside="false" :close-on-click-overlay="false">
|
||||
<van-dropdown-item :options="unionList" @change="unionChange" v-model="pageForm.unionId"></van-dropdown-item>
|
||||
<van-dropdown-item :options="unitList" @change="doSearch" v-model="pageForm.unitId"></van-dropdown-item>
|
||||
<van-dropdown-item :options="auditList" @change="doSearch" v-model="pageForm.audit"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list v-if="tableData.length>0" v-model="tableLoading" :finished="tableFinished" finished-text="没有更多了" @load="pageData">
|
||||
<div v-for="item in tableData" :key="item.id" class="van-doc-card">
|
||||
<div>
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="width: 74%">
|
||||
<div class="van-ellipsis title">
|
||||
<span class="title_span">|</span>
|
||||
<span>{{item.username + '(' + item.loginname + ')'}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 4px">
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">所属工会：</span>
|
||||
{{item.unionName}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">工作单位：</span>
|
||||
<span>{{item.unitName}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">在职状态：</span>
|
||||
{{item.userState}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人事编制：</span>
|
||||
<span>{{item.preparedBy}}</span>
|
||||
</van-col>
|
||||
</van-row>
|
||||
<van-row>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">人员类型：</span>
|
||||
{{item.personType}}
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<span style="color: grey">申报类型：</span>
|
||||
{{ '入会申请' }}
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
|
||||
<van-divider></van-divider>
|
||||
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<div>
|
||||
<span style="color: grey">当前状态：</span>
|
||||
<span>{{item.processInstanceNodeName}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<van-button size="small" @click="openView(item)" type="info" style="margin-right: 4px">查看</van-button>
|
||||
<van-button
|
||||
size="small"
|
||||
type="primary"
|
||||
v-if="item.processInstanceTaskStatus==='ACTIVE'"
|
||||
@click="openApproval(item)"
|
||||
style="margin-right: 4px"
|
||||
>
|
||||
审核
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty image="/assets/platform/plugins/vant-green/images/nodata/nodata.png" description="暂无数据" v-else></van-empty>
|
||||
</div>
|
||||
|
||||
<van-popup v-model="infoShow" position="right" :style="{ height: '100%', width: '100%' }" safe-area-inset-bottom>
|
||||
<van-sticky>
|
||||
<van-nav-bar @click-left="infoShow=false" left-arrow left-text="返回" title="分工会审核"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<member-change-info ref="memberChangeInfoRef"></member-change-info>
|
||||
<div v-if="showApprovalForm">
|
||||
<div class="process-title">{{formData.processInstanceNodeName}}</div>
|
||||
<form @submit.prevent="">
|
||||
<van-field label="审核意见" name="approvalOpinion" v-model="formData.approvalOpinion" required></van-field>
|
||||
<van-field label="签字" name="signature" v-model="formData.approvalSignature" required class="direction-column-field">
|
||||
<h5-signature v-model="formData.approvalSignature" slot="input"></h5-signature>
|
||||
</van-field>
|
||||
</form>
|
||||
<div style="display: flex; justify-content: space-between; column-gap: 10px; padding: 10px">
|
||||
<van-button type="danger" block @click.submit="doApproval('BACK')">退回重新填写</van-button>
|
||||
<van-button type="danger" block @click.submit="doApproval('REJECT')">建议撤销</van-button>
|
||||
<van-button type="primary" block @click.submit="doApproval('PASS')">同意</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
</div>
|
||||
<script>
|
||||
<!--#include("../../common/mobileMemberChangeInfo.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unionId: "",
|
||||
unitId: "",
|
||||
audit: false
|
||||
},
|
||||
tableData: [],
|
||||
unionList: [],
|
||||
unitList: [],
|
||||
auditList: [
|
||||
{ text: "已审核", value: true },
|
||||
{ text: "未审核", value: false }
|
||||
],
|
||||
tableLoading: false,
|
||||
tableFinished: false,
|
||||
|
||||
userId: "",
|
||||
infoShow: false,
|
||||
showApprovalForm: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"member-change-info": MOBILE_MEMBER_CHANGE_INFO
|
||||
},
|
||||
methods: {
|
||||
openApproval(row) {
|
||||
this.infoShow = true
|
||||
this.$nextTick(() => {
|
||||
this.showApprovalForm = true
|
||||
this.formData = row.approvalParam
|
||||
this.$refs.memberChangeInfoRef.activeName = "change"
|
||||
this.$refs.memberChangeInfoRef.onOpen({ recordId: row.id, userId: row.userId })
|
||||
})
|
||||
},
|
||||
doApproval(approvalType) {
|
||||
this.formData.bpmTaskApprovalType = approvalType
|
||||
formRules(this.rules, this.formData, (valid) => {
|
||||
if (valid) {
|
||||
this.$axios
|
||||
.post("/platform/member/apply/schoolUnionAudit/approval", {
|
||||
approval: JSON.stringify(this.formData)
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.infoShow = false
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
openRevoke(taskId) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "撤回",
|
||||
message: "您确定要撤回吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/member/apply/schoolUnionAudit/revoke", { taskId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
openView(row) {
|
||||
this.infoShow = true
|
||||
this.$nextTick(() => {
|
||||
this.showApprovalForm = false
|
||||
this.$refs.memberChangeInfoRef.activeName = "basic"
|
||||
this.$refs.memberChangeInfoRef.onOpen({ recordId: row.id, userId: row.userId })
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.finished = false
|
||||
this.pageData()
|
||||
},
|
||||
pageData() {
|
||||
this.tableLoading = true
|
||||
this.$axios.post("/platform/member/apply/schoolUnionAudit/pageData", this.pageForm).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
this.pageForm.totalCount = res.data.totalCount
|
||||
if (this.tableData.length >= this.pageForm.totalCount) {
|
||||
this.tableFinished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.tableLoading = false
|
||||
} else {
|
||||
this.$toast(res.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
unionChange() {
|
||||
this.$set(this.pageForm, "unitId", null)
|
||||
this.flushUnits()
|
||||
this.doSearch()
|
||||
},
|
||||
initUnion() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? null : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnion(unionId).then((data) => {
|
||||
this.unionList = data
|
||||
this.unionList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin) {
|
||||
this.unionList.unshift({ text: "全部工会", value: null })
|
||||
}
|
||||
if (this.unionList && this.unionList.length > 0) {
|
||||
this.$set(this.pageForm, "unionId", this.unionList[0].value)
|
||||
}
|
||||
})
|
||||
},
|
||||
flushUnits() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? this.pageForm.unionId : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnit(unionId).then((data) => {
|
||||
this.unitList = data
|
||||
this.unitList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (this.unitList && this.unitList.length > 0) {
|
||||
this.unitList.unshift({ text: "全部单位", value: null })
|
||||
this.$set(this.pageForm, "unitId", this.unitList[0].value)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initUnion()
|
||||
this.flushUnits()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,384 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
.up_down > .van-cell {
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
.up_down > .van-cell > .van-field__label {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.van-cell, .van-picker button, .submit .van-button--normal {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.van-divider {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.direction-column-field .van-field__label{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-sticky>
|
||||
<van-nav-bar title="会员入会申请" left-text="返回" left-arrow @click-left="$pjaxReplace('/platform/h5/home')"></van-nav-bar>
|
||||
</van-sticky>
|
||||
<van-cell-group>
|
||||
<form novalidate @submit.prevent="">
|
||||
<van-field v-model="formData.username" label="姓名" readonly></van-field>
|
||||
<van-field v-model="formData.sex" label="性别" readonly></van-field>
|
||||
<van-field
|
||||
v-model="formData.idCard"
|
||||
name="idCard"
|
||||
label="身份证号"
|
||||
placeholder="请输入身份证件号"
|
||||
clearable
|
||||
maxlength="18"
|
||||
></van-field>
|
||||
<van-field
|
||||
v-model="formData.nation"
|
||||
name="nation"
|
||||
label="民族"
|
||||
readonly
|
||||
placeholder="请点击选择民族"
|
||||
@click="showNationPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showNationPicker">
|
||||
<van-picker :columns="nationColumns" @cancel="showNationPicker = false" @confirm="onNationConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
v-model="formData.political"
|
||||
name="nation"
|
||||
label="政治面貌"
|
||||
readonly
|
||||
placeholder="请选择政治面貌"
|
||||
@click="showPoliticalPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showPoliticalPicker">
|
||||
<van-picker :columns="politicalColumns" @cancel="showPoliticalPicker = false" @confirm="onPoliticalConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
v-model="formData.education"
|
||||
name="education"
|
||||
label="学历"
|
||||
readonly
|
||||
placeholder="请选择学历"
|
||||
@click="showEducationPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showEducationPicker">
|
||||
<van-picker :columns="educationColumns" @cancel="showEducationPicker = false" @confirm="onEducationConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field v-model="formData.unitName" label="工作单位" readonly></van-field>
|
||||
<van-field v-model="formData.unionName" label="所属工会" readonly></van-field>
|
||||
<van-field
|
||||
v-model="formData.governmentPosition"
|
||||
name="governmentPosition"
|
||||
label="职务"
|
||||
placeholder="请输入职务"
|
||||
clearable
|
||||
maxlength="30"
|
||||
></van-field>
|
||||
<van-field
|
||||
v-model="formData.userState"
|
||||
name="userState"
|
||||
label="在职状态"
|
||||
readonly
|
||||
placeholder="请选择在职状态"
|
||||
@click="showUserStatusPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showUserStatusPicker">
|
||||
<van-picker :columns="userStateColumns" @cancel="showUserStatusPicker = false" @confirm="onUserStateConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
v-model="formData.preparedBy"
|
||||
name="preparedBy"
|
||||
label="人事编制"
|
||||
readonly
|
||||
placeholder="请选择人事编制"
|
||||
@click="showPreparedByPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showPreparedByPicker">
|
||||
<van-picker :columns="preparedByColumns" @cancel="showPreparedByPicker = false" @confirm="onPreparedByConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
v-model="formData.personType"
|
||||
name="personType"
|
||||
label="人员类型"
|
||||
readonly
|
||||
placeholder="请选择人员类型"
|
||||
@click="showPersonTypePicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showPersonTypePicker">
|
||||
<van-picker :columns="personTypeColumns" @cancel="showPersonTypePicker = false" @confirm="onPersonTypeConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
v-model="formData.mobile"
|
||||
name="mobile"
|
||||
label="联系电话"
|
||||
placeholder="请输入联系电话"
|
||||
clearable
|
||||
type="tel"
|
||||
maxlength="11"
|
||||
></van-field>
|
||||
<van-field
|
||||
v-model="formData.email"
|
||||
name="email"
|
||||
label="电子邮箱"
|
||||
placeholder="请输入电子邮箱"
|
||||
clearable
|
||||
maxlength="25"
|
||||
></van-field>
|
||||
|
||||
<van-cell-group class="up_down">
|
||||
<div class="van-cell">
|
||||
<div style="display: flex;justify-content: space-between">
|
||||
<div style="display: flex;">
|
||||
<div style="width: 100%">
|
||||
<span>家庭主要成员及联系方式</span>
|
||||
</div>
|
||||
</div>
|
||||
<van-button v-if="formData.families && formData.families.length>0 && formData.families.length<5" style="width: 40px"
|
||||
icon="plus" type="primary" round size="mini"
|
||||
@click="formData.families.push({})"
|
||||
native-type="button"></van-button>
|
||||
</div>
|
||||
<van-divider></van-divider>
|
||||
<template v-if="formData.families && formData.families.length>0">
|
||||
<div v-for="o,i in formData.families" class="mt5">
|
||||
<div style="font-weight: 700;display: flex;justify-content: space-between">
|
||||
<span>成员{{toChinesNum(i+1)}}</span>
|
||||
<van-button style="width: 40px"
|
||||
icon="cross" type="danger" round size="mini"
|
||||
@click="formData.families.splice(i,1)"
|
||||
native-type="button"></van-button>
|
||||
</div>
|
||||
<van-field label="关系" v-model="o.relation" placeholder="请填写与本人关系"
|
||||
:rules="[{ required:true, message: '请填写与本人关系' }]"></van-field>
|
||||
<van-field label="姓名" v-model="o.name" placeholder="请填写姓名"
|
||||
:rules="[{ required:true, message: '请填写姓名' }]"></van-field>
|
||||
<van-field label="工作单位" v-model="o.unit" placeholder="请填写工作单位"
|
||||
:rules="[{ required:true, message: '请填写工作单位' }]"></van-field>
|
||||
<van-field label="备注" v-model="o.remark" placeholder="请填写备注"
|
||||
:rules="[{ required:true, message: '请填写备注' }]"></van-field>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div style="padding: 50px;text-align: center">
|
||||
<van-button style="width: 50px"
|
||||
icon="plus" type="primary" round size="mini"
|
||||
@click="formData.families.push({})"
|
||||
native-type="button"></van-button>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</van-cell-group>
|
||||
|
||||
<van-field
|
||||
label="个人简况（简历、获奖情况、有何特长）"
|
||||
name="personalData"
|
||||
v-model="formData.personalData"
|
||||
class="direction-column-field">
|
||||
<template #input>
|
||||
<text-editor v-model="formData.personalData"></text-editor>
|
||||
</template>
|
||||
</van-field>
|
||||
</form>
|
||||
<div v-if="!this.$store.state.user.member" style="display: flex; justify-content: space-between; column-gap: 10px; padding: 10px">
|
||||
<van-button block v-if="formData.id" type="primary" @click.submit="$pjaxReplace('/platform/h5/member/apply/mine')">返 回</van-button>
|
||||
<van-button block type="primary" @click.submit="doSave">保存申请</van-button>
|
||||
<van-button block type="primary" @click.submit="doSubmit">提交申请</van-button>
|
||||
</div>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
<script>
|
||||
new Vue({
|
||||
el: '#app',
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
id: GetQueryString('id'),
|
||||
isDisable: false,
|
||||
formData: {
|
||||
families: [],
|
||||
},
|
||||
// 民族
|
||||
showNationPicker: false,
|
||||
nationColumns: [],
|
||||
// 政治面貌
|
||||
showPoliticalPicker: false,
|
||||
politicalColumns: [],
|
||||
// 学历
|
||||
showEducationPicker: false,
|
||||
educationColumns: [],
|
||||
// 在职状态
|
||||
showUserStatusPicker: false,
|
||||
userStateColumns: [],
|
||||
// 人事编制
|
||||
showPreparedByPicker: false,
|
||||
preparedByColumns: [],
|
||||
// 人员类型
|
||||
showPersonTypePicker: false,
|
||||
personTypeColumns: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doSave() {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "保存",
|
||||
message: "您确定要保存吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
if (this.formData.families) {
|
||||
this.formData.families = JSON.stringify(this.formData.families)
|
||||
}
|
||||
this.$axios
|
||||
.post('/platform/member/apply/submit/doSave', this.formData)
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.$pjaxReplace('/platform/h5/member/apply/mine')
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
doSubmit() {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提交",
|
||||
message: "您确定要提交吗？",
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消"
|
||||
})
|
||||
.then(() => {
|
||||
if (this.formData.families) {
|
||||
this.formData.families = JSON.stringify(this.formData.families)
|
||||
}
|
||||
this.$axios
|
||||
.post('/platform/member/apply/submit/doSubmit', this.formData)
|
||||
.then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg)
|
||||
this.$pjaxReplace('/platform/h5/member/apply/mine')
|
||||
} else {
|
||||
this.$toast.fail(res.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onNationConfirm(o) {
|
||||
this.$set(this.formData, "nation", o.value)
|
||||
this.showNationPicker = false
|
||||
},
|
||||
onPoliticalConfirm(o) {
|
||||
this.$set(this.formData, "political", o.value)
|
||||
this.showPoliticalPicker = false
|
||||
},
|
||||
onEducationConfirm(o) {
|
||||
this.$set(this.formData, "education", o.value)
|
||||
this.showEducationPicker = false
|
||||
},
|
||||
onUserStateConfirm(o) {
|
||||
this.$set(this.formData, "userState", o.value)
|
||||
this.showUserStatusPicker = false
|
||||
},
|
||||
onPreparedByConfirm(o) {
|
||||
this.$set(this.formData, "preparedBy", o.value)
|
||||
this.showPreparedByPicker = false
|
||||
},
|
||||
onPersonTypeConfirm(o) {
|
||||
this.$set(this.formData, "personType", o.value)
|
||||
this.showPersonTypePicker = false
|
||||
},
|
||||
async initDictOptions() {
|
||||
// 民族
|
||||
const nationData = await this.$businessTool.getDictOptions('USER_NATION')
|
||||
this.nationColumns = nationData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
// 政治面貌
|
||||
const politicalData = await this.$businessTool.getDictOptions('POLITICAL_STATUS')
|
||||
this.politicalColumns = politicalData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
// 学历
|
||||
const educationData = await this.$businessTool.getDictOptions('USER_EDUCATION')
|
||||
this.educationColumns = educationData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
// 在职状态
|
||||
const userStatusData = await this.$businessTool.getDictOptions('USER_STATUS')
|
||||
this.userStateColumns = userStatusData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
// 人事编制
|
||||
const preparedByData = await this.$businessTool.getDictOptions('PREPARED_BY')
|
||||
this.preparedByColumns = preparedByData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
// 人员类型
|
||||
const personTypeData = await this.$businessTool.getDictOptions('PERSON_TYPE')
|
||||
this.personTypeColumns = personTypeData.map(item => {
|
||||
return { value: item.name, text: item.name }
|
||||
})
|
||||
},
|
||||
initUserData() {
|
||||
const url = this.id ? '/platform/member/apply/submit/findApplyById' : '/platform/member/apply/submit/findUserInfo'
|
||||
this.$axios.post(url, { id: this.id })
|
||||
.then(res => {
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data
|
||||
if (!this.id) {
|
||||
this.formData.id = null
|
||||
this.formData.userId = res.data.id
|
||||
}
|
||||
if (!this.formData.families) {
|
||||
this.formData.families = []
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
toChinesNum(num){
|
||||
let changeNum = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
|
||||
let unit = ["", "十", "百", "千", "万"];
|
||||
num = parseInt(num);
|
||||
let getWan = (temp) => {
|
||||
let strArr = temp.toString().split("").reverse();
|
||||
let newNum = "";
|
||||
for (let i = 0; i < strArr.length; i++) {
|
||||
newNum = (i == 0 && strArr[i] == 0 ? "" : (i > 0 && strArr[i] == 0 && strArr[i - 1] == 0 ? "" : changeNum[strArr[i]] + (strArr[i] == 0 ? unit[0] : unit[i]))) + newNum;
|
||||
}
|
||||
return newNum;
|
||||
}
|
||||
let overWan = Math.floor(num / 10000);
|
||||
let noWan = num % 10000;
|
||||
if (noWan.toString().length < 4) {
|
||||
noWan = "0" + noWan;
|
||||
}
|
||||
return overWan ? getWan(overWan) + "万" + getWan(noWan) : getWan(num);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initDictOptions()
|
||||
this.initUserData()
|
||||
},
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,530 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style>
|
||||
.top-col {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
width: calc((100% - 5px) / 2);
|
||||
}
|
||||
|
||||
.top-col:not(:last-child),
|
||||
.center-col:not(:last-child) {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.col-title {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.top-col-member-number {
|
||||
font-size: 30px;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
|
||||
.top-col-chart {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.center-col {
|
||||
background-color: white;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
/*width: calc((100% - (20px * 1)) / 2);*/
|
||||
}
|
||||
|
||||
.idx {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background-color: #f0f0f0;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.idx-rank {
|
||||
color: white !important;
|
||||
background-color: #314659 !important;
|
||||
}
|
||||
|
||||
.el-table__body-wrapper::-webkit-scrollbar {
|
||||
display: none; /* Chrome Safari */
|
||||
}
|
||||
|
||||
.el-table__body-wrapper {
|
||||
scrollbar-width: none; /* firefox */
|
||||
-ms-overflow-style: none; /* IE 10+ */
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.data-box {
|
||||
font-size: 13px;
|
||||
margin: 12px 0;
|
||||
|
||||
.th-row {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 12px;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
.td-row {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.common-ellipsis {
|
||||
width: 80px;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="会员统计" @click-left="historyBack" left-arrow left-text="返回" placeholder fixed></van-nav-bar>
|
||||
<van-row style="background-color: #f0f2f5" class="margin-top5" type="flex">
|
||||
<van-col span="12" class="top-col">
|
||||
<div class="col-title">会员数</div>
|
||||
<div class="top-col-member-number">
|
||||
{{memberNumberData.memberNum}}
|
||||
<span style="font-size: 14px"> 人</span>
|
||||
</div>
|
||||
<div style="color: rgba(0, 0, 0, 0.85); margin-top: 20px; font-size: 14px; display: flex; align-items: center; justify-content: flex-end">
|
||||
年同比 {{memberNumberData.ratio}} 
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="caret-up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
style="color: #67c23a"
|
||||
v-if="memberNumberData.diff>=0"
|
||||
viewBox="0 0 1024 1024"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.9 689L530.5 308.2c-9.4-10.9-27.5-10.9-37 0L165.1 689c-12.2 14.2-1.2 35 18.5 35h656.8c19.7 0 30.7-20.8 18.5-35z"
|
||||
></path>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="caret-up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
style="color: #f56c6c"
|
||||
v-else
|
||||
viewBox="0 0 1024 1024"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</van-col>
|
||||
|
||||
<van-col span="12" class="top-col">
|
||||
<div class="col-title">增长趋势</div>
|
||||
<div class="top-col-chart" id="growthTrendChart"></div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-row style="background-color: #f0f2f5; margin-top: 5px" type="flex">
|
||||
<van-col span="12" class="top-col">
|
||||
<div class="col-title">会员占比</div>
|
||||
<div class="top-col-chart" id="memberPercentageChart"></div>
|
||||
</van-col>
|
||||
<van-col span="12" class="top-col">
|
||||
<div class="col-title">性别占比</div>
|
||||
<div class="top-col-chart" id="memberSexPercentageChart"></div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-row style="background-color: #f0f2f5; margin-top: 5px" type="flex">
|
||||
<van-col span="24" class="center-col">
|
||||
<div class="col-title">在职状态</div>
|
||||
<div id="userStateMemberChart" style="width: 100%; height: 240px; box-sizing: border-box"></div>
|
||||
|
||||
<div class="col-title">人员类型</div>
|
||||
<div id="personTypeMemberChart" style="width: 100%; height: 240px; box-sizing: border-box"></div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-row style="background-color: #f0f2f5; margin-top: 5px" type="flex">
|
||||
<van-col span="24" class="center-col">
|
||||
<div class="col-title">工会会员数</div>
|
||||
<div id="unionMemberChart" style="width: 100%; height: 200px"></div>
|
||||
|
||||
<div class="data-box">
|
||||
<van-row class="th-row" style="display: flex">
|
||||
<van-col style="width: 80px">序号</van-col>
|
||||
<van-col style="width: 200px">工会名称</van-col>
|
||||
<van-col style="width: 80px">会员人数</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-row class="td-row" :style="{background:index %2==0?'#fff':'#fafafa'}" v-for="(item,index) in unionMember" :key="index">
|
||||
<van-col class="common-ellipsis">{{index + 1}}</van-col>
|
||||
<van-col style="width: 200px" class="common-ellipsis">{{item.unionname}}</van-col>
|
||||
<van-col class="common-ellipsis">{{item.value}}</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
<script>
|
||||
const chart = {
|
||||
growthTrendChart: undefined,
|
||||
memberPercentageChart: undefined,
|
||||
memberSexPercentageChart: undefined,
|
||||
unionMemberChart: undefined,
|
||||
personTypeMemberChart: undefined,
|
||||
userStateMemberChart: undefined
|
||||
}
|
||||
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
loading: {
|
||||
memberNumber: false,
|
||||
growthTrend: false,
|
||||
memberPercentage: false,
|
||||
memberSexPercentage: false,
|
||||
unionMember: false,
|
||||
personTypeMember: false,
|
||||
userStateMember: false
|
||||
},
|
||||
memberNumberData: {
|
||||
memberNum: "--",
|
||||
lastYearMemberNum: "--",
|
||||
ratio: "0.0%",
|
||||
diff: 0
|
||||
},
|
||||
memberPercentage: "--",
|
||||
unionMember: []
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 会员数
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
getMemberNumber() {
|
||||
this.loading.memberNumber = true
|
||||
this.$axios.post("/platform/member/info/board/memberNumber").then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
const {
|
||||
data: { memberNum, lastYearMemberNum }
|
||||
} = resp
|
||||
const diff = memberNum - lastYearMemberNum
|
||||
const ratio = (lastYearMemberNum ? (Math.abs(diff) / lastYearMemberNum) * 100 : (diff / 1) * 10).toFixed(2) + " %"
|
||||
this.memberNumberData = { memberNum, lastYearMemberNum, diff, ratio }
|
||||
this.loading.memberNumber = false
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 增长趋势
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getGrowthTrend() {
|
||||
this.loading.growthTrend = true
|
||||
this.$axios.post("/platform/member/info/board/growthTrend").then((resp) => {
|
||||
this.loading.growthTrend = false
|
||||
if (resp.code === 0) {
|
||||
const { data } = resp
|
||||
|
||||
const labels = data.map((v) => v.label)
|
||||
const values = data.map((v) => v.value)
|
||||
if (chart.growthTrendChart) {
|
||||
chart.growthTrendChart.changeData(values)
|
||||
return
|
||||
}
|
||||
|
||||
chart.growthTrendChart = new G2Plot.TinyArea("growthTrendChart", {
|
||||
autoFit: true,
|
||||
data: values,
|
||||
smooth: true,
|
||||
showContent: true,
|
||||
areaStyle: {
|
||||
fill: "#d6e3fd"
|
||||
},
|
||||
tooltip: {
|
||||
customContent: function (i, data) {
|
||||
if (labels[i]) {
|
||||
return labels[i] + "-" + data[0]?.data?.y + "人"
|
||||
}
|
||||
return ""
|
||||
}
|
||||
}
|
||||
})
|
||||
chart.growthTrendChart.render()
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 会员占比
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getMemberPercentage() {
|
||||
this.loading.memberPercentage = true
|
||||
this.$axios.post("/platform/member/info/board/memberPercentage").then((resp) => {
|
||||
this.loading.memberPercentage = false
|
||||
if (resp.code === 0) {
|
||||
const { data } = resp
|
||||
this.memberPercentage = data.toFixed(2)
|
||||
if (chart.memberPercentageChart) {
|
||||
chart.memberPercentageChart.changeData(data)
|
||||
return
|
||||
}
|
||||
chart.memberPercentageChart = new G2Plot.Liquid("memberPercentageChart", {
|
||||
outline: {
|
||||
border: 4,
|
||||
distance: 8
|
||||
},
|
||||
wave: {
|
||||
length: 128
|
||||
},
|
||||
autoFit: true,
|
||||
percent: data,
|
||||
statistic: {
|
||||
content: {
|
||||
style: {
|
||||
fontSize: 16
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
chart.memberPercentageChart.render()
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 男女占比
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getMemberSexPercentage() {
|
||||
this.loading.memberSexPercentage = true
|
||||
this.$axios.post("/platform/member/info/board/memberSexPercentage").then((resp) => {
|
||||
this.loading.memberSexPercentage = false
|
||||
if (resp.code === 0) {
|
||||
const { data } = resp
|
||||
if (chart.memberSexPercentageChart) {
|
||||
chart.memberSexPercentageChart.changeData(data)
|
||||
return
|
||||
}
|
||||
|
||||
chart.memberSexPercentageChart = new G2Plot.Pie("memberSexPercentageChart", {
|
||||
data,
|
||||
angleField: "value",
|
||||
colorField: "type",
|
||||
legend: false,
|
||||
label: {
|
||||
formatter: () => ""
|
||||
},
|
||||
interactions: [{ type: "element-active" }],
|
||||
color: ["#409EFF", "#F56C6C"]
|
||||
})
|
||||
chart.memberSexPercentageChart.render()
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 各工会会员数
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getUnionMember() {
|
||||
this.loading.unionMember = true
|
||||
this.$axios.post("/platform/member/info/board/unionMember").then((resp) => {
|
||||
this.loading.unionMember = false
|
||||
if (resp.code === 0) {
|
||||
const { chartData, tableData } = resp.data
|
||||
|
||||
this.unionMember = tableData
|
||||
|
||||
const labels = chartData.map((v) => v.unionname)
|
||||
const values = chartData.map((v) => v.value)
|
||||
|
||||
if (chart.unionMemberChart) {
|
||||
chart.unionMemberChart.changeData(values)
|
||||
return
|
||||
}
|
||||
|
||||
chart.unionMemberChart = new G2Plot.Column("unionMemberChart", {
|
||||
data: chartData,
|
||||
autoFit: true,
|
||||
xField: "unionname",
|
||||
yField: "value",
|
||||
label: {
|
||||
// 可手动配置 label 数据标签位置
|
||||
position: "middle", // 'top', 'bottom', 'middle',
|
||||
// 配置样式
|
||||
style: {
|
||||
fill: "#FFFFFF",
|
||||
opacity: 0.6
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
label: {
|
||||
autoHide: true,
|
||||
autoRotate: false
|
||||
}
|
||||
},
|
||||
meta: {
|
||||
label: {
|
||||
alias: "类型"
|
||||
},
|
||||
value: {
|
||||
alias: "会员数"
|
||||
}
|
||||
}
|
||||
})
|
||||
chart.unionMemberChart.render()
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 根据人员类型查找会员数
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getPersonTypeMember() {
|
||||
this.loading.personTypeMember = true
|
||||
this.$axios.post("/platform/member/info/board/personTypeMember").then((resp) => {
|
||||
this.loading.personTypeMember = false
|
||||
if (resp.code === 0) {
|
||||
const { data } = resp
|
||||
|
||||
if (chart.personTypeMemberChart) {
|
||||
chart.personTypeMemberChart.changeData(data)
|
||||
return
|
||||
}
|
||||
|
||||
chart.personTypeMemberChart = new G2Plot.Column("personTypeMemberChart", {
|
||||
data,
|
||||
autoFit: true,
|
||||
xField: "label",
|
||||
yField: "value",
|
||||
label: {
|
||||
// 可手动配置 label 数据标签位置
|
||||
position: "middle", // 'top', 'bottom', 'middle',
|
||||
// 配置样式
|
||||
style: {
|
||||
fill: "#FFFFFF",
|
||||
opacity: 0.6
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
label: {
|
||||
autoHide: true,
|
||||
autoRotate: false
|
||||
}
|
||||
},
|
||||
meta: {
|
||||
label: {
|
||||
alias: "类型"
|
||||
},
|
||||
value: {
|
||||
alias: "会员数"
|
||||
}
|
||||
}
|
||||
})
|
||||
chart.personTypeMemberChart.render()
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 根据在职状态查找会员数
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getUserStateMember() {
|
||||
this.loading.userStateMember = true
|
||||
this.$axios.post("/platform/member/info/board/userStateMember").then((resp) => {
|
||||
this.loading.userStateMember = false
|
||||
if (resp.code === 0) {
|
||||
const { data } = resp
|
||||
|
||||
if (chart.userStateMemberChart) {
|
||||
chart.userStateMemberChart.changeData(data)
|
||||
return
|
||||
}
|
||||
|
||||
chart.userStateMemberChart = new G2Plot.Radar("userStateMemberChart", {
|
||||
data,
|
||||
xField: "label",
|
||||
yField: "value",
|
||||
appendPadding: [0, 10, 0, 10],
|
||||
meta: {
|
||||
value: {
|
||||
alias: "会员数量",
|
||||
min: 0,
|
||||
nice: true,
|
||||
formatter: (v) => parseInt(v)
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
tickLine: null
|
||||
},
|
||||
yAxis: {
|
||||
label: false,
|
||||
grid: {
|
||||
alternateColor: "rgba(0, 0, 0, 0.04)"
|
||||
}
|
||||
},
|
||||
// 开启辅助点
|
||||
point: {
|
||||
size: 2
|
||||
},
|
||||
area: {}
|
||||
})
|
||||
chart.userStateMemberChart.render()
|
||||
} else {
|
||||
this.$toast.fail(resp.msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
initData() {
|
||||
this.getMemberNumber()
|
||||
this.getGrowthTrend()
|
||||
this.getMemberPercentage()
|
||||
this.getMemberSexPercentage()
|
||||
this.getUnionMember()
|
||||
this.getPersonTypeMember()
|
||||
this.getUserStateMember()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
+91
@@ -0,0 +1,91 @@
|
||||
const MOBILE_MEMBER_CHANGE_INFO = {
|
||||
template: `
|
||||
<div>
|
||||
<van-collapse v-model="activeName" accordion>
|
||||
<van-collapse-item name="basic">
|
||||
<template #title>
|
||||
<span style="color: #409eff">会员基础信息</span>
|
||||
</template>
|
||||
<van-cell-group>
|
||||
<van-cell title="姓名">{{ viewData.username }}</van-cell>
|
||||
<van-cell title="性别">{{ viewData.sex }}</van-cell>
|
||||
<van-cell title="联系方式">{{ viewData.mobile }}</van-cell>
|
||||
<van-cell title="所属工会">{{ viewData.unionName }}</van-cell>
|
||||
<van-cell title="所属单位">{{ viewData.unitName }}</van-cell>
|
||||
<van-cell title="在职状态">{{ viewData.userState }}</van-cell>
|
||||
<van-cell title="人事编制">{{ viewData.preparedBy }}</van-cell>
|
||||
<van-cell title="人员类型">{{ viewData.personType }}</van-cell>
|
||||
<van-cell title="出生日期">{{ $moment(viewData.birthday).format('YYYY-MM-DD') }}</van-cell>
|
||||
<van-cell title="学历">{{ viewData.education }}</van-cell>
|
||||
<van-cell title="政治面貌">{{ viewData.political }}</van-cell>
|
||||
<van-cell title="是否会员">{{ viewData.member ? '是' : '否' }}</van-cell>
|
||||
<van-cell title="是否福利会员">{{ viewData.welfareMember ? '是' : '否' }}</van-cell>
|
||||
<van-cell title="是否劳模">{{ viewData.isModelWorker ? '是' : '否' }}</van-cell>
|
||||
<van-cell title="个人简历">
|
||||
<div slot="label" class="van-cell-rich-text" v-html="viewData.personalData"></div>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-collapse-item>
|
||||
<van-collapse-item v-if="changeList && changeList.length > 0" title="会员变更信息" name="change">
|
||||
<template #title>
|
||||
<span style="color: #409eff">会员变更信息</span>
|
||||
</template>
|
||||
<table width="100%" style="line-height: 1.5rem;font-size: 13px; table-layout: fixed;border-collapse: collapse;">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="background-color: #f2f2f2;border: 1px solid #ddd;">序号</th>
|
||||
<th style="background-color: #f2f2f2;border: 1px solid #ddd;">变更字段</th>
|
||||
<th style="width: 35%;background-color: #f2f2f2;border: 1px solid #ddd;">原数据</th>
|
||||
<th style="width: 35%;background-color: #f2f2f2;border: 1px solid #ddd;">新数据</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr style="text-align: center;border-bottom: 1px solid #ddd;" v-for="(item,index) in changeList" :key="index">
|
||||
<td style="border: 1px solid #ddd;">{{ index + 1 }}</td>
|
||||
<td style="border: 1px solid #ddd;">{{ item.name }}</td>
|
||||
<td style="border: 1px solid #ddd;">{{ removeHTMLTag(item.value) }}</td>
|
||||
<td style="border: 1px solid #ddd;">{{ removeHTMLTag(item.newValue) }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</van-collapse-item>
|
||||
</van-collapse>
|
||||
</div>
|
||||
`,
|
||||
data() {
|
||||
return {
|
||||
changeList: [],
|
||||
viewData: {},
|
||||
activeName: "basic"
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
removeHTMLTag,
|
||||
findAuditChangeInfo(recordId) {
|
||||
if (!recordId) {
|
||||
return
|
||||
}
|
||||
this.$axios.post("/platform/member/apply/branchUnionAudit/findAuditChangeInfo", { recordId: recordId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.changeList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
findUserInfo(userId) {
|
||||
if (!userId) {
|
||||
return
|
||||
}
|
||||
this.$axios.post("/platform/member/apply/common/findOne", { id: userId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.viewData = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
onOpen(data) {
|
||||
this.findAuditChangeInfo(data.recordId)
|
||||
this.$nextTick(() => {
|
||||
this.findUserInfo(data.userId)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
+48
@@ -0,0 +1,48 @@
|
||||
const MOBILE_MEMBER_INFO = {
|
||||
template: `
|
||||
<div>
|
||||
<van-cell-group>
|
||||
<van-cell title="姓名">{{ viewData.username }}</van-cell>
|
||||
<van-cell title="性别">{{ viewData.sex }}</van-cell>
|
||||
<van-cell title="联系方式">{{ viewData.mobile }}</van-cell>
|
||||
<van-cell title="所属工会">{{ viewData.unionName }}</van-cell>
|
||||
<van-cell title="所属单位">{{ viewData.unitName }}</van-cell>
|
||||
<van-cell title="在职状态">{{ viewData.userState }}</van-cell>
|
||||
<van-cell title="人事编制">{{ viewData.preparedBy }}</van-cell>
|
||||
<van-cell title="人员类型">{{ viewData.personType }}</van-cell>
|
||||
<van-cell title="出生日期">{{ $moment(viewData.birthday).format('YYYY-MM-DD') }}</van-cell>
|
||||
<van-cell title="学历">{{ viewData.education }}</van-cell>
|
||||
<van-cell title="政治面貌">{{ viewData.political }}</van-cell>
|
||||
<van-cell title="是否会员">{{ viewData.member ? '是' : '否' }}</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
`,
|
||||
props: {
|
||||
userId: { type: String, required: true }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
viewData: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
userId: {
|
||||
handler: function () {
|
||||
this.findUserInfoByUserId()
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
findUserInfoByUserId() {
|
||||
if (!this.userId) {
|
||||
return
|
||||
}
|
||||
this.$axios.post("/platform/member/apply/common/findOne", { id: this.userId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.viewData = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,154 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
<style></style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar @click-left="historyBack" left-arrow left-text="返回" title="会员查询" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-search
|
||||
v-model="pageForm.searchKeyword"
|
||||
placeholder="请输入工号或者姓名进行查询"
|
||||
:show-action="false"
|
||||
:reverse-color="false"
|
||||
input-align="left"
|
||||
@search="doSearch"
|
||||
></van-search>
|
||||
<van-dropdown-menu :close-on-click-outside="false" :close-on-click-overlay="false">
|
||||
<van-dropdown-item :options="unionList" @change="unionChange"
|
||||
v-model="pageForm.unionId"></van-dropdown-item>
|
||||
<van-dropdown-item :options="unitList" @change="doSearch" v-model="pageForm.unitId"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
<div>
|
||||
<van-list v-if="tableData.length>0" v-model="tableLoading" :finished="tableFinished" finished-text="没有更多了"
|
||||
@load="pageData">
|
||||
<div class="table-list">
|
||||
<div class="table-card" v-for="row in tableData" :key="row.id">
|
||||
<van-cell title="姓名" :value="row.username"></van-cell>
|
||||
<van-cell title="工号" :value="row.loginname"></van-cell>
|
||||
<van-cell title="性别" :value="row.sex"></van-cell>
|
||||
<van-cell title="联系电话" :value="row.mobile"></van-cell>
|
||||
<van-cell title="所属工会" :value="row.unionName"></van-cell>
|
||||
<van-cell title="所属单位" :value="row.unitName"></van-cell>
|
||||
<van-cell class="table-card-footer">
|
||||
<van-button type="info" size="small" @click="viewInfo(row)">查看</van-button>
|
||||
</van-cell>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty v-else image="/assets/platform/plugins/vant-green/images/nodata/nodata.png"
|
||||
description="暂无数据"></van-empty>
|
||||
</div>
|
||||
|
||||
<div :style="{color:'#1890ff'}" style="text-align: right; position: fixed; bottom: 20px; right: 20px">
|
||||
<van-button :color="'#1890ff'" hairline size="small" type="primary">总人数：{{pageForm.totalCount}}人
|
||||
</van-button>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="infoShow" title="会员详细信息">
|
||||
<member-info ref="memberInfoRef" :user-id="userId"></member-info>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
<script>
|
||||
<!--#include("../common/mobileMemberInfo.js"){}#-->
|
||||
new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unionId: "",
|
||||
unitId: ""
|
||||
},
|
||||
tableData: [],
|
||||
unionList: [],
|
||||
unitList: [],
|
||||
tableLoading: false,
|
||||
tableFinished: false,
|
||||
|
||||
userId: "",
|
||||
infoShow: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"member-info": MOBILE_MEMBER_INFO
|
||||
},
|
||||
methods: {
|
||||
historyBack,
|
||||
viewInfo(row) {
|
||||
this.userId = row.id
|
||||
this.infoShow = true
|
||||
},
|
||||
unionChange() {
|
||||
this.$set(this.pageForm, "unitId", null)
|
||||
this.flushUnits()
|
||||
this.doSearch()
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.finished = false
|
||||
this.pageData()
|
||||
},
|
||||
pageData() {
|
||||
this.tableLoading = true
|
||||
this.$axios.post("/platform/member/info/group/pageData", {pageForm: JSON.stringify(this.pageForm)}).then((resp) => {
|
||||
this.tableData = this.tableData.concat(resp.data.list)
|
||||
this.pageForm.totalCount = resp.data.totalCount
|
||||
if (this.tableData.length >= this.pageForm.totalCount) {
|
||||
this.tableFinished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.tableLoading = false
|
||||
})
|
||||
},
|
||||
initUnion() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? null : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnion(unionId).then((data) => {
|
||||
this.unionList = data
|
||||
this.unionList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin) {
|
||||
this.unionList.unshift({text: "全部工会", value: null})
|
||||
}
|
||||
if (this.unionList && this.unionList.length > 0) {
|
||||
this.$set(this.pageForm, "unionId", this.unionList[0].value)
|
||||
}
|
||||
})
|
||||
},
|
||||
flushUnits() {
|
||||
const hasAdmin = this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])
|
||||
const unionId = hasAdmin ? this.pageForm.unionId : this.$store.state.user.union.id
|
||||
this.$businessTool.listUnit(unionId).then((data) => {
|
||||
this.unitList = data
|
||||
this.unitList.forEach((v) => {
|
||||
v.text = v.name
|
||||
v.value = v.id
|
||||
})
|
||||
if (hasAdmin && !this.pageForm.unionId) {
|
||||
this.unitList.unshift({text: "全部单位", value: null})
|
||||
}
|
||||
if (this.unitList && this.unitList.length > 0) {
|
||||
this.$set(this.pageForm, "unitId", this.unitList[0].value)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initUnion()
|
||||
this.flushUnits()
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user