first commit
This commit is contained in:
@@ -0,0 +1,297 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style scoped>
|
||||
/* 同意条款样式 */
|
||||
.agree-section {
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 12px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.agree-section .van-checkbox__label {
|
||||
font-size: 13px;
|
||||
line-height: 1.5;
|
||||
color: #666;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app">
|
||||
<!-- 导航栏 -->
|
||||
<van-nav-bar title="文体社团会员申请" left-text="返回" left-arrow @click-left="historyBack" fixed placeholder></van-nav-bar>
|
||||
|
||||
<!-- 表单容器 -->
|
||||
<van-form ref="formRef" class="form-container">
|
||||
<!-- 社团信息 -->
|
||||
<van-cell-group title="社团信息" class="form-section">
|
||||
<van-field
|
||||
:rules="[{ required: true }]"
|
||||
v-model="formData.clubName"
|
||||
label="社团"
|
||||
placeholder="请选择社团"
|
||||
required
|
||||
is-link
|
||||
readonly
|
||||
name="clubName"
|
||||
@click="showClubPopup = true"
|
||||
></van-field>
|
||||
<van-popup v-model:show="showClubPopup" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="clubOptions.map(i => i.clubName)"
|
||||
@confirm="onClubConfirm"
|
||||
@cancel="showClubPopup = false"
|
||||
class="picker-style"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<van-cell-group title="基本信息" class="form-section">
|
||||
<van-field label="姓名" :rules="[{ required: true }]" v-model="formData.userName" readonly
|
||||
required name="userName"></van-field>
|
||||
<van-field label="工号" :rules="[{ required: true }]" v-model="formData.loginName" readonly
|
||||
required name="loginName"></van-field>
|
||||
<van-field label="性别" :rules="[{ required: true }]" v-model="formData.sex" readonly required></van-field>
|
||||
<van-field label="出生年月" v-model="formData.birthday" readonly placeholder="读取信息中心数据"></van-field>
|
||||
<van-field label="联系电话" v-model="formData.mobile" placeholder="请输入联系电话"></van-field>
|
||||
<van-field label="电子信箱" v-model="formData.email" placeholder="请输入电子信箱"></van-field>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 工作信息 -->
|
||||
<van-cell-group title="工作信息" class="form-section">
|
||||
<van-field label="分工会" v-model="formData.unionName" readonly></van-field>
|
||||
<van-field label="部门" v-model="formData.unitName" readonly></van-field>
|
||||
<van-field label="职务" v-model="formData.governmentPosition" readonly
|
||||
placeholder="读取信息中心数据"></van-field>
|
||||
<van-field label="职称" v-model="formData.technicalTitle" readonly
|
||||
placeholder="读取信息中心数据"></van-field>
|
||||
<van-field label="学历" v-model="formData.education" readonly placeholder="读取信息中心数据"></van-field>
|
||||
<van-field label="学位" v-model="formData.academicDegree" readonly
|
||||
placeholder="读取信息中心数据"></van-field>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 其他信息 -->
|
||||
<van-cell-group title="其他信息" class="form-section">
|
||||
<van-field
|
||||
class="direction-column-field"
|
||||
v-model="formData.sameTimeJoinOtherClubSituation"
|
||||
label="同时参加其他社团情况"
|
||||
type="textarea"
|
||||
rows="4"
|
||||
autosize
|
||||
maxlength="500"
|
||||
placeholder="请填写同时参加其他社团情况"
|
||||
></van-field>
|
||||
<van-field
|
||||
class="direction-column-field"
|
||||
v-model="formData.awardsExperience"
|
||||
label="文化、体育方面的活动经历、获奖情况"
|
||||
type="textarea"
|
||||
rows="4"
|
||||
autosize
|
||||
maxlength="500"
|
||||
placeholder="请填写相关经历及获奖情况"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 照片上传 -->
|
||||
<van-cell-group title="照片" class="form-section">
|
||||
<van-field class="direction-column-field" name="avatar" label="">
|
||||
<template #input>
|
||||
<h5-file-upload
|
||||
slot="input"
|
||||
:value.sync="formData.avatar"
|
||||
:upload_number="1"
|
||||
upload_mode="image"
|
||||
upload_result_category="interval"
|
||||
upload_result_type="url"
|
||||
complete_result
|
||||
></h5-file-upload>
|
||||
</template>
|
||||
</van-field>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 电子签名 -->
|
||||
<van-cell-group title="电子签名" class="form-section">
|
||||
<van-field class="direction-column-field" name="signature" label="">
|
||||
<template #input>
|
||||
<h5-signature v-model="formData.signature" slot="input"></h5-signature>
|
||||
</template>
|
||||
</van-field>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 同意条款 -->
|
||||
<van-cell-group class="agree-section form-section">
|
||||
<van-checkbox v-model="isAgree" shape="square">
|
||||
注：本人已仔细阅读并愿意遵守所参加本校教职工文体社团的章程和规定，自愿加入所报名社团。
|
||||
</van-checkbox>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 提交按钮 -->
|
||||
<div class="form-actions">
|
||||
<van-button native-type="button" @click="onSave" round type="info" plain>保存申请</van-button>
|
||||
<van-button @click="onSubmit" round type="info" v-if="!taskId">提交申请</van-button>
|
||||
<van-button @click="onFinishTask" round type="info" v-else>提交申请</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
|
||||
<script nonce="${cspNonce!}">
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
bizId: GetQueryString("bizId"),
|
||||
taskId: GetQueryString("taskId"),
|
||||
formData: {
|
||||
clubId: "",
|
||||
clubName: "",
|
||||
userName: "",
|
||||
loginName: "",
|
||||
sex: "",
|
||||
birthday: "",
|
||||
mobile: "",
|
||||
email: "",
|
||||
unionName: "",
|
||||
unitName: "",
|
||||
governmentPosition: "",
|
||||
technicalTitle: "",
|
||||
education: "",
|
||||
academicDegree: "",
|
||||
sameTimeJoinOtherClubSituation: "",
|
||||
awardsExperience: "",
|
||||
avatar: [],
|
||||
signature: ""
|
||||
},
|
||||
clubOptions: [],
|
||||
showClubPopup: false,
|
||||
isAgree: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSave() {
|
||||
this.$dialog.confirm({
|
||||
title: "提示",
|
||||
message: "您确定保存吗？"
|
||||
}).then(() => {
|
||||
this.$axios.post("/platform/club/join/apply/save", { data: JSON.stringify(this.formData) }).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$toast(res.msg)
|
||||
this.$pjaxReplace("/platform/club/join/mine/h5")
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
async onSubmit() {
|
||||
this.$refs.formRef.validate().then(() => {
|
||||
if (!this.isAgree) {
|
||||
this.$toast('请先阅读并同意协议')
|
||||
return
|
||||
}
|
||||
this.$dialog.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要提交申请吗？"
|
||||
}).then(() => {
|
||||
this.$axios.post("/platform/club/join/apply/submit", {
|
||||
data: JSON.stringify(this.formData),
|
||||
mode: true
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$toast(res.msg)
|
||||
this.$pjaxReplace("/platform/club/join/mine/h5")
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
async onFinishTask() {
|
||||
this.$refs.formRef.validate().then(() => {
|
||||
if (!this.isAgree) {
|
||||
this.$toast('请先阅读并同意协议')
|
||||
return
|
||||
}
|
||||
this.$dialog.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要提交申请吗？"
|
||||
}).then(() => {
|
||||
this.$axios.post("/platform/club/join/apply/submitAgain", {
|
||||
data: JSON.stringify(this.formData),
|
||||
taskId: GetQueryString("taskId")
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$toast(res.msg)
|
||||
this.$pjaxReplace("/platform/club/join/mine/h5")
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
checkApplyClub(clubId) {
|
||||
this.$axios.post("/platform/club/join/apply/checkApplyClub", { clubId }).then(res => {
|
||||
if (res.code !== 0) {
|
||||
this.$toast(res.msg)
|
||||
this.formData.clubId = ""
|
||||
this.formData.clubName = ""
|
||||
}
|
||||
})
|
||||
},
|
||||
onClubConfirm(value, index) {
|
||||
this.formData.clubId = this.clubOptions[index].id
|
||||
this.formData.clubName = value
|
||||
this.showClubPopup = false
|
||||
|
||||
// 检查是否已申请该社团
|
||||
this.checkApplyClub(this.formData.clubId)
|
||||
},
|
||||
listClub() {
|
||||
this.$axios.post("/platform/club/common/listClub").then(res => {
|
||||
if (res.code === 0) {
|
||||
this.clubOptions = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
init() {
|
||||
this.bizId = GetQueryString("bizId")
|
||||
if (this.bizId) {
|
||||
this.$axios.post("/platform/club/join/apply/info", { id: this.bizId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data
|
||||
this.isAgree = true
|
||||
}
|
||||
})
|
||||
} else {
|
||||
const user = this.$store.state.user
|
||||
this.$set(this.formData, "userId", user.id)
|
||||
this.$set(this.formData, "userName", user.username)
|
||||
this.$set(this.formData, "loginName", user.loginname)
|
||||
this.$set(this.formData, "unitId", user.unit ? user.unit.id : null)
|
||||
this.$set(this.formData, "unitName", user.unit ? user.unit.name : null)
|
||||
this.$set(this.formData, "unionId", user.union ? user.union.id : null)
|
||||
this.$set(this.formData, "unionName", user.union ? user.union.name : null)
|
||||
this.$set(this.formData, "sex", user.sex)
|
||||
this.$set(this.formData, "birthday", user.birthday ? this.$moment(user.birthday).format('YYYY-MM-DD') : '')
|
||||
this.$set(this.formData, "nation", user.nation)
|
||||
this.$set(this.formData, "mobile", user.mobile)
|
||||
this.$set(this.formData, "political", user.political)
|
||||
this.$set(this.formData, "education", user.education)
|
||||
this.$set(this.formData, "technicalTitle", user.technicalTitle)
|
||||
this.$set(this.formData, "position", user.position)
|
||||
this.$set(this.formData, "academicDegree", user.academicDegree)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listClub()
|
||||
this.init()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user