Skip to content

A
alumni-show-h5
提交 33753fca authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

新增投票报名申请

上级 42743f3b
隐藏空白字符变更
内嵌 并排
正在显示 包含 277 行增加 和 13 行删除
package-lock.json
浏览文件 @ 33753fca
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
浏览文件 @ 33753fca
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
"md5": "^2.3.0", "md5": "^2.3.0",
"qs": "^6.9.4", "qs": "^6.9.4",
"timeago.js": "^4.0.2", "timeago.js": "^4.0.2",
"vant": "^2.10.11", "vant": "^2.12.9",
"vue": "^2.6.12", "vue": "^2.6.12",
"vue-meta": "^2.4.0", "vue-meta": "^2.4.0",
"vue-router": "^3.4.8", "vue-router": "^3.4.8",
......
src/api/vote.js
浏览文件 @ 33753fca
...@@ -29,3 +29,12 @@ export function getVoteItem(id) { ...@@ -29,3 +29,12 @@ export function getVoteItem(id) {
export function addVote(data) { export function addVote(data) {
return httpRequest.post('/api/alumni/v1/vote/add', data) return httpRequest.post('/api/alumni/v1/vote/add', data)
} }
// 提交报名信息
export function submitApply(data) {
return httpRequest.post('/api/alumni//v1/vote/create', data)
}
// 获取投票城市
export function getApplyCity() {
return httpRequest.get('/api/alumni/v1/vote/vote-config')
}
src/components/Form.vue
浏览文件 @ 33753fca
<template> <template>
<van-form ref="form" class="form" validate-trigger="onChange" v-bind="$attrs" v-on="$listeners"> <van-form ref="form" class="form" v-bind="$attrs" v-on="$listeners">
<template v-for="(item, index) in fields"> <template v-for="(item, index) in fields">
<div class="form-item" :key="index"> <div class="form-item" :key="index">
<!-- 时间 --> <!-- 时间 -->
......
src/components/UpliadMultiple.vue
浏览文件 @ 33753fca
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<van-uploader <van-uploader
v-model="fileList" v-model="fileList"
:after-read="afterRead" :after-read="afterRead"
:max-size="MaxSize" :max-size="maxSize"
@oversize="oversize" @oversize="oversize"
@delete="onDelete" @delete="onDelete"
v-bind="$attrs" v-bind="$attrs"
...@@ -15,7 +15,7 @@ import { upload } from '@/api/index' ...@@ -15,7 +15,7 @@ import { upload } from '@/api/index'
export default { export default {
name: 'UpliadMultiple', name: 'UpliadMultiple',
// 最大3M // 最大3M
props: { value: {}, MaxSize: { type: Number, default: 3 * 1024 * 1024 } }, props: { value: {}, maxSize: { type: Number, default: 3 * 1024 * 1024 } },
data() { data() {
return { fileList: [], urlList: [] } return { fileList: [], urlList: [] }
}, },
...@@ -32,7 +32,7 @@ export default { ...@@ -32,7 +32,7 @@ export default {
methods: { methods: {
oversize(file) { oversize(file) {
const rawFile = file.file const rawFile = file.file
if (rawFile.size > this.MaxSize) { if (rawFile.size > this.maxSize) {
this.$toast('文件大小不能超过3M') this.$toast('文件大小不能超过3M')
} }
}, },
......
src/components/Upload.vue
浏览文件 @ 33753fca
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
v-model="fileList" v-model="fileList"
upload-icon="plus" upload-icon="plus"
:after-read="afterRead" :after-read="afterRead"
:max-size="MaxSize" :max-size="maxSize"
@delete="onDelete" @delete="onDelete"
@oversize="oversize" @oversize="oversize"
v-bind="$attrs" v-bind="$attrs"
...@@ -21,7 +21,7 @@ import { upload } from '@/api/index' ...@@ -21,7 +21,7 @@ import { upload } from '@/api/index'
export default { export default {
name: 'Upload', name: 'Upload',
// 最大3M // 最大3M
props: { value: String, MaxSize: { type: Number, default: 3 * 1024 * 1024 } }, props: { value: String, maxSize: { type: Number, default: 3 * 1024 * 1024 } },
data() { data() {
return { fileList: [] } return { fileList: [] }
}, },
...@@ -36,8 +36,8 @@ export default { ...@@ -36,8 +36,8 @@ export default {
methods: { methods: {
oversize(file) { oversize(file) {
const rawFile = file.file const rawFile = file.file
if (rawFile.size > this.MaxSize) { if (rawFile.size > this.maxSize) {
this.$toast('文件大小不能超过3M') this.$toast(`文件大小不能超过${this.maxSize / 1024}K`)
} }
}, },
afterRead(file) { afterRead(file) {
......
src/components/attestationUpload.vue
浏览文件 @ 33753fca
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
v-model="fileList" v-model="fileList"
upload-icon="plus" upload-icon="plus"
:after-read="afterRead" :after-read="afterRead"
:max-size="MaxSize" :max-size="maxSize"
@delete="onDelete" @delete="onDelete"
@oversize="oversize" @oversize="oversize"
v-bind="$attrs" v-bind="$attrs"
...@@ -21,7 +21,7 @@ import { upload } from '@/api/index' ...@@ -21,7 +21,7 @@ import { upload } from '@/api/index'
export default { export default {
name: 'Upload', name: 'Upload',
// 最大3M // 最大3M
props: { value: String, MaxSize: { type: Number, default: 3 * 1024 * 1024 } }, props: { value: String, maxSize: { type: Number, default: 3 * 1024 * 1024 } },
data() { data() {
return { fileList: [] } return { fileList: [] }
}, },
...@@ -36,7 +36,7 @@ export default { ...@@ -36,7 +36,7 @@ export default {
methods: { methods: {
oversize(file) { oversize(file) {
const rawFile = file.file const rawFile = file.file
if (rawFile.size > this.MaxSize) { if (rawFile.size > this.maxSize) {
this.$toast('文件大小不能超过3M') this.$toast('文件大小不能超过3M')
} }
}, },
...@@ -91,7 +91,7 @@ export default { ...@@ -91,7 +91,7 @@ export default {
font-size: 40px; font-size: 40px;
color: #dcdcdc; color: #dcdcdc;
} }
::v-deep .van-cell{ ::v-deep .van-cell {
width: auto !important; width: auto !important;
} }
</style> </style>
src/router/index.js
浏览文件 @ 33753fca
...@@ -235,6 +235,11 @@ const routes = [ ...@@ -235,6 +235,11 @@ const routes = [
name: 'votePrimary', name: 'votePrimary',
component: () => import('@/views/vote/Primary.vue'), component: () => import('@/views/vote/Primary.vue'),
meta: { requiredLogin: true } meta: { requiredLogin: true }
},
{
path: '/vote/apply',
name: 'voteApply',
component: () => import('@/views/vote/Apply.vue')
} }
] ]
......
src/views/vote/Apply.vue 0 → 100644
浏览文件 @ 33753fca
<template>
<div class="vote-submit">
<h1 class="vote-submit__title">紫荆校友自荐信息填写</h1>
<p class="vote-submit__tips">
注：以下填写信息将在投票页面予以公示，请自荐人如实认真填写；如一次无法填写完成，建议将填写内容粘贴至WORD文档保存，防止下次打开时遗失已填写内容。
</p>
<v-form ref="form" :model="formModel" :fields="fields" @submit="onSubmit">
<input type="button" value="提交" class="submit-button" @click="handleSubmit" />
</v-form>
</div>
</template>
<script>
import VForm from '@/components/Form'
import * as api from '@/api/vote'
export default {
name: 'VoteApply',
components: { VForm },
data() {
return {
applyCityList: [],
formModel: {
vote_config_id: '',
name: '',
gender: '',
area: '',
class: '',
company: '',
job: '',
email: '',
phone: '',
address: '',
honor: '',
recommend: '',
photo: ''
}
}
},
watch: {
formModel: {
deep: true,
handler(data) {
window.localStorage.setItem('voteApply', JSON.stringify(data))
}
}
},
computed: {
fields() {
return [
{
fieldType: 'select',
name: 'vote_config_id',
required: true,
placeholder: '请选择地区',
rules: [{ required: true, message: '请选择地区' }],
values: this.applyCityList,
valueKey: 'name'
},
{
name: 'name',
label: '姓名',
required: true,
placeholder: '请输入姓名',
rules: [{ required: true, message: '请输入姓名' }]
},
{
fieldType: 'select',
name: 'gender',
label: '性别',
required: true,
placeholder: '请选择性别',
rules: [{ required: true, message: '请选择性别' }],
values: [
{ name: '1', text: '男' },
{ name: '0', text: '女' }
],
valueKey: 'name'
},
{
fieldType: 'area',
name: 'area',
label: '城市',
required: true,
placeholder: '选择所在城市',
rules: [{ required: true, message: '选择所在城市' }]
},
{
name: 'class',
label: '班级',
required: true,
placeholder: '请输入班级',
rules: [{ required: true, message: '请输入班级' }]
},
{
name: 'company',
label: '目前工作单位',
required: true,
placeholder: '请输入目前工作单位',
rules: [{ required: true, message: '请输入目前工作单位' }]
},
{
name: 'job',
label: '职务',
required: true,
placeholder: '请输入职务',
rules: [{ required: true, message: '请输入职务' }]
},
{
name: 'email',
label: '电子邮箱',
required: true,
placeholder: '请输入电子邮箱',
rules: [
{
required: true,
validator: value =>
/[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/.test(
value
),
message: '请输入电子邮箱'
}
]
},
{
name: 'phone',
label: '联系电话',
required: true,
placeholder: '请输入联系电话',
maxLength: 11,
rules: [{ required: true, validator: value => /^1[3-9]\d{9}$/.test(value), message: '请输入联系电话' }]
},
{
name: 'address',
label: '常住地址',
required: true,
placeholder: '请输入常住地址',
rules: [{ required: true, message: '请输入常住地址' }]
},
{
type: 'textarea',
name: 'honor',
label: '个人曾获得的社会荣誉列举',
required: true,
placeholder: '请简述您的创建的宗旨',
autosize: { maxHeight: 100, minHeight: 80 },
rules: [{ required: true, message: '请简述您的创建的宗旨' }]
},
{
type: 'textarea',
name: 'recommend',
label:
'推荐说明（包含您对校友会工作的认识、您会在哪些方面为校友工作做出贡献、您目前是否有足够的时间担任该职务等，不少于150字）',
required: true,
placeholder: '推荐说明',
autosize: { maxHeight: 200, minHeight: 120 },
rules: [
{ required: true, message: '请输入推荐说明' },
{
validator: value => value.length > 150,
message: '内容不少于150字'
}
]
},
{
fieldType: 'uploader',
name: 'photo',
label: '上传个人一寸免冠清晰证件照,投票时公示使用。（图片大小400K以内）',
required: true,
maxSize: 400 * 1024,
rules: [{ required: true, message: '请上传图片' }]
}
]
}
},
methods: {
getApplyCity() {
api.getApplyCity().then(response => {
const list = []
for (const key in response) {
list.push({ name: key, text: response[key] })
}
this.applyCityList = list
})
},
handleSubmit() {
this.$refs.form.submit()
},
onSubmit(data) {
const ruleForm = this.$refs.form.ruleForm
data.vote_config_id = ruleForm.vote_config_id
// 头像
if (data.photo) {
const [first = { url: '' }] = data.photo
data.photo = first.url
}
// 城市
if (data.area) {
const [province, city] = data.area.split('-')
data.province = province
data.city = city
}
delete data.area
api.submitApply(data).then(response => {
if (response.success) {
this.$dialog
.alert({
confirmButtonText: '确定',
message: '已完成提交'
})
.then(() => {
window.localStorage.removeItem('voteApply')
})
} else {
this.$toast(response.message)
}
})
}
},
beforeMount() {
const voteApply = window.localStorage.getItem('voteApply')
if (voteApply) {
this.formModel = JSON.parse(voteApply)
}
this.getApplyCity()
}
}
</script>
<style lang="scss" scoped>
.vote-submit {
margin: 0 20px;
::v-deep .van-field__label {
width: auto;
}
::v-deep .van-uploader {
width: 1.6rem;
}
}
.vote-submit__title {
font-size: 20px;
padding: 20px 0;
text-align: center;
}
.vote-submit__tips {
line-height: 1.5;
padding-bottom: 20px;
}
</style>
yarn.lock
浏览文件 @ 33753fca
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论