You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
938 lines
29 KiB
938 lines
29 KiB
<template>
|
|
<view class="container safe-area-inset-bottom">
|
|
<image class="bkg" src="~@/static/me/wave.png" mode="widthFix"></image>
|
|
<zmm-watermark :column="2" :margin="30" :watermark="watermark"></zmm-watermark>
|
|
<u-notice-bar class="notice-bar" v-if="aspiration && aspiration.tip" :list="[aspiration.tip]"></u-notice-bar>
|
|
|
|
<view class="wrap" v-if="step === 1">
|
|
|
|
<view class="year-picker">
|
|
<view class="year-picker__title">报考年份</view>
|
|
<u-input class="year-picker__input"
|
|
v-model="form.year"
|
|
type="select"
|
|
:height="60"
|
|
border
|
|
border-color="#b2b2b2"
|
|
:custom-style="{
|
|
color: '#6c6f70'
|
|
}"
|
|
@click="isShowTime = true"></u-input>
|
|
</view>
|
|
<view class="user-form" v-if="false">
|
|
<view class="user-form__input">
|
|
<u-form :model="form" ref="uForm" :label-style="{ 'font-weight': '500' }" label-width="auto">
|
|
<u-form-item label="学生姓名" required prop="name">
|
|
<u-input v-model="form.name" placeholder="请输入" input-align="right" />
|
|
</u-form-item>
|
|
<u-form-item label="准考证" required prop="examination_number">
|
|
<u-input v-model="form.examination_number" placeholder="请输入" input-align="right" />
|
|
</u-form-item>
|
|
<u-form-item label="毕业学校" required prop="finish_school">
|
|
<u-input v-model="form.finish_school" placeholder="请输入" input-align="right" />
|
|
</u-form-item>
|
|
</u-form>
|
|
</view>
|
|
</view>
|
|
<view class="area-pick">
|
|
<view class="area-pick__title">所在区域</view>
|
|
<view class="area-pick__panel">
|
|
<view v-for="(group, groupId) in groupArea" :key="groupId" class="area-item" @click="form.group = groupId">
|
|
{{ groupId }}
|
|
<u-icon class="area-item__tag" v-if="form.group === groupId" name="checkmark-circle-fill" color="#fff" :size="64" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<u-button
|
|
shape="circle"
|
|
ripple
|
|
:custom-style="{
|
|
'background-image': 'linear-gradient(263deg, rgba(31,142,247,0.9) 0%, rgba(17,100,247,0.9981153777569027) 78%, rgba(17,100,247,0.9999999999999999) 78%)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
'margin-top': '110rpx',
|
|
'width': '450rpx',
|
|
'color': '#fff'
|
|
}"
|
|
@click="() => {
|
|
if (form.group) {
|
|
stepClick('next')
|
|
} else {
|
|
$u.toast('请选择区域')
|
|
}
|
|
}">下一步</u-button>
|
|
</view>
|
|
|
|
<view class="wrap" v-if="step > 1 && step <= (1 + batches.length)">
|
|
<view class="picked-data">
|
|
<view>{{ form.year }}年 {{ currentBatch.name || '-' }}</view>
|
|
</view>
|
|
|
|
<view class="card" v-for="item in currentBatchSub" :key="item.id">
|
|
<view class="card__title">
|
|
<view class="batch-sub__title">
|
|
{{ item.name || '-' }}
|
|
</view>
|
|
</view>
|
|
|
|
<view class="card__body">
|
|
<view class="batch-sub-school" v-for="school in item.batch_sub_schools" :key="school.id">
|
|
<view class="batch-sub-school__name">
|
|
志愿序号 {{ school.number || '-' }}
|
|
</view>
|
|
<view class="batch-sub-school__form sub-form1">
|
|
<view class="sub-form1__row sub-form1-title">
|
|
<view class="sub-form1__col1">
|
|
代码
|
|
</view>
|
|
<view class="sub-form1__col2">
|
|
学校
|
|
</view>
|
|
</view>
|
|
<view class="sub-form1__row">
|
|
<view class="sub-form1__col1">
|
|
<u-input
|
|
disabled
|
|
v-model="flatForm[`${currentBatch.id}-${item.id}-${school.id}-code`]"
|
|
:height="50"
|
|
border
|
|
border-color="#e0e0e0"
|
|
input-align="center"
|
|
:clearable="false"
|
|
@click="forSchoolName = { needSpec: (school.specialty && school.specialty.length > 0), code: `${currentBatch.id}-${item.id}-${school.id}-code`, value: `${currentBatch.id}-${item.id}-${school.id}-value` },getSchools(item.id),isShowSchoolSelect = true"></u-input>
|
|
</view>
|
|
<view class="sub-form1__col2">
|
|
<u-input
|
|
disabled
|
|
v-model="flatForm[`${currentBatch.id}-${item.id}-${school.id}-value`]"
|
|
:height="50" border border-color="#e0e0e0"
|
|
input-align="center"
|
|
:clearable="false"
|
|
@click="forSchoolName = { needSpec: (school.specialty && school.specialty.length > 0), code: `${currentBatch.id}-${item.id}-${school.id}-code`, value: `${currentBatch.id}-${item.id}-${school.id}-value` },getSchools(item.id),isShowSchoolSelect = true"></u-input>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="batch-sub-school-specialty sub-form2" v-if="school.specialty && school.specialty.length > 0">
|
|
<view class="sub-form2__row sub-form2-title">
|
|
<view class="sub-form2__col1">
|
|
序号
|
|
</view>
|
|
<view class="sub-form2__col2">
|
|
代码
|
|
</view>
|
|
<view class="sub-form2__col3">
|
|
专业
|
|
</view>
|
|
</view>
|
|
|
|
<view class="sub-form2__row" v-for="(spec, specIndex) in school.specialty" :key="spec.number">
|
|
<view class="sub-form2__col1">
|
|
{{ spec.number || '-' }}
|
|
</view>
|
|
<view class="sub-form2__col2">
|
|
<u-input
|
|
disabled
|
|
v-model="flatForm[`${currentBatch.id}-${item.id}-${school.id}-${specIndex}-code`]"
|
|
:height="50"
|
|
border
|
|
border-color="#e0e0e0"
|
|
input-align="center"
|
|
:clearable="false"
|
|
@click="forSpecName = { code: `${currentBatch.id}-${item.id}-${school.id}-${specIndex}-code`, value: `${currentBatch.id}-${item.id}-${school.id}-${specIndex}-value` },isShowSpecSelect = true"></u-input>
|
|
</view>
|
|
<view class="sub-form2__col3">
|
|
<u-input
|
|
disabled
|
|
v-model="flatForm[`${currentBatch.id}-${item.id}-${school.id}-${specIndex}-value`]"
|
|
:height="50"
|
|
border
|
|
border-color="#e0e0e0"
|
|
input-align="center"
|
|
:clearable="false"
|
|
@click="forSpecName = { code: `${currentBatch.id}-${item.id}-${school.id}-${specIndex}-code`, value: `${currentBatch.id}-${item.id}-${school.id}-${specIndex}-value` },isShowSpecSelect = true"></u-input>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="batch-sub-is-obey" v-if="item.show_specialty_obey">
|
|
<view>
|
|
其他专业是否服从
|
|
</view>
|
|
<u-radio-group v-model="flatForm[`${currentBatch.id}-${item.id}-specialty`]">
|
|
<u-radio name="1">是</u-radio>
|
|
<u-radio name="0">否</u-radio>
|
|
</u-radio-group>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="batch-sub-is-obey" v-if="item.show_school_obey">
|
|
<view>
|
|
其他院校是否服从
|
|
</view>
|
|
<u-radio-group v-model="flatForm[`${currentBatch.id}-${item.id}-school`]">
|
|
<u-radio name="1">是</u-radio>
|
|
<u-radio name="0">否</u-radio>
|
|
</u-radio-group>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="btns">
|
|
<u-button
|
|
shape="circle"
|
|
ripple
|
|
:custom-style="{
|
|
'background-image': 'linear-gradient(263deg, rgba(31,142,247,0.9) 0%, rgba(17,100,247,0.9981153777569027) 78%, rgba(17,100,247,0.9999999999999999) 78%)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
'margin-top': '110rpx',
|
|
'width': '290rpx',
|
|
'color': '#fff'
|
|
}"
|
|
@click="stepClick('prev')">上一步</u-button>
|
|
<template v-if="step <= (batches.length)">
|
|
<u-button
|
|
shape="circle"
|
|
ripple
|
|
:custom-style="{
|
|
'background-image': 'linear-gradient(263deg, rgba(31,142,247,0.9) 0%, rgba(17,100,247,0.9981153777569027) 78%, rgba(17,100,247,0.9999999999999999) 78%)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
'margin-top': '110rpx',
|
|
'width': '290rpx',
|
|
'color': '#fff',
|
|
'margin-left': '64rpx'
|
|
}"
|
|
@click="stepClick('next')">下一步</u-button>
|
|
</template>
|
|
<template v-else>
|
|
<u-button
|
|
shape="circle"
|
|
ripple
|
|
:custom-style="{
|
|
'background-image': 'linear-gradient(263deg, rgba(31,142,247,0.9) 0%, rgba(17,100,247,0.9981153777569027) 78%, rgba(17,100,247,0.9999999999999999) 78%)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
'margin-top': '110rpx',
|
|
'width': '290rpx',
|
|
'color': '#fff',
|
|
'margin-left': '64rpx'
|
|
}"
|
|
@click="isShowModal = true">提交</u-button>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
|
|
<u-picker
|
|
v-model="isShowTime"
|
|
mode="time"
|
|
:params="{
|
|
year: true,
|
|
month: false,
|
|
day: false,
|
|
hour: false,
|
|
minute: false,
|
|
second: false
|
|
}"
|
|
@confirm="e => form.year = e.year"></u-picker>
|
|
<u-modal v-model="isShowWhite" content="您暂时没有填报权限" @confirm="$u.route({ type: 'back' })"></u-modal>
|
|
<u-modal v-model="isShowModal" content="确认提交数据？" show-cancel-button @confirm="submit"></u-modal>
|
|
|
|
<!-- <u-select v-model="isShowSchoolSelect" mode="mutil-column-auto" :list="schoolList" @confirm="schoolListConfirm" @cancel="schoolListCancel"></u-select>-->
|
|
<u-select v-model="isShowSchoolSelect" :list="schoolList" @confirm="schoolListConfirm" @cancel="schoolListCancel"></u-select>
|
|
<u-select v-model="isShowSpecSelect" :list="specList" @confirm="specListConfirm" @cancel="specListCancel"></u-select>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import zmmWatermark from '@/uni_modules/zmm-watermark/components/zmm-watermark/zmm-watermark.vue';
|
|
import imglogo from '@/static/waterlogo.png';
|
|
export default {
|
|
components:{
|
|
zmmWatermark
|
|
},
|
|
data() {
|
|
return {
|
|
watermark:`<img style="width:60px" src="${imglogo}" />`,
|
|
isShowWhite: false,
|
|
isShowModal: false,
|
|
step: 1,
|
|
isShowTime: false,
|
|
areaList: [],
|
|
groupArea: {},
|
|
forSchoolName: {
|
|
code: '',
|
|
value: '',
|
|
needSpec: false,
|
|
},
|
|
isShowSchoolSelect: false,
|
|
schoolList: [],
|
|
schoolMap: new Map(),
|
|
isShowSpecSelect: false,
|
|
forSpecName: {
|
|
code: '',
|
|
value: '',
|
|
},
|
|
specList: [],
|
|
form: {
|
|
name: "",
|
|
finish_school: "",
|
|
examination_number: "",
|
|
group: "",
|
|
area_id: "",
|
|
year: new Date().getFullYear().toString(),
|
|
aspiration_id: ""
|
|
},
|
|
config: null,
|
|
|
|
currentBatchId: "",
|
|
aspiration: {},
|
|
batchSub: {},
|
|
|
|
subForm: [],
|
|
flatForm: {},
|
|
};
|
|
},
|
|
methods: {
|
|
specListCancel() {
|
|
if (this.forSpecName.code) {
|
|
this.flatForm[this.forSpecName.code] = ''
|
|
}
|
|
if (this.forSpecName.value) {
|
|
this.flatForm[this.forSpecName.value] = ''
|
|
}
|
|
},
|
|
specListConfirm(e) {
|
|
const { label, value, extra } = e[0]
|
|
if (this.forSpecName.code) {
|
|
this.flatForm[this.forSpecName.code] = value
|
|
}
|
|
if (this.forSpecName.value) {
|
|
this.flatForm[this.forSpecName.value] = label
|
|
}
|
|
},
|
|
schoolListCancel() {
|
|
if (this.forSchoolName.code) {
|
|
this.flatForm[this.forSchoolName.code] = ""
|
|
}
|
|
if (this.forSchoolName.value) {
|
|
this.flatForm[this.forSchoolName.value] = ""
|
|
}
|
|
|
|
this.forSchoolName.needSpec = false
|
|
},
|
|
schoolListConfirm(e) {
|
|
console.log(e)
|
|
if (e[0]) {
|
|
const { label, value, extra } = e[0]
|
|
const findSameSchoolName = Object.entries(this.flatForm).filter(([key, val]) => val === label)
|
|
let flag = false
|
|
const comparePrefix = (str1, str2) => {
|
|
const parts1 = str1.split('-');
|
|
const parts2 = str2.split('-');
|
|
|
|
return parts1[0] === parts2[0] && parts1[1] === parts2[1];
|
|
}
|
|
findSameSchoolName.forEach(([key, value]) => {
|
|
if (comparePrefix(key, this.forSchoolName.value)) {
|
|
flag = true
|
|
}
|
|
})
|
|
if (flag) {
|
|
this.$u.toast("选择学校重复")
|
|
return
|
|
}
|
|
if (this.forSchoolName.code) {
|
|
this.flatForm[this.forSchoolName.code] = value
|
|
}
|
|
if (this.forSchoolName.value) {
|
|
this.flatForm[this.forSchoolName.value] = label
|
|
}
|
|
|
|
if (this.forSchoolName.needSpec) {
|
|
this.getSpecialties(extra)
|
|
}
|
|
}
|
|
},
|
|
async getSpecialties(school_id) {
|
|
try {
|
|
const { list } = await this.$u.api.specialtyList({
|
|
page: 1,
|
|
page_size: 9999,
|
|
school_id
|
|
})
|
|
this.specList = list.map(i => ({ label: i.name, value: i.code, extra: i.id }))
|
|
} catch (err) {
|
|
console.error(err)
|
|
}
|
|
},
|
|
async getSchools(batchSubId) {
|
|
try {
|
|
this.schoolList = this.schoolMap.get(batchSubId)?.map(school => ({
|
|
value: school.code,
|
|
label: school.name,
|
|
extra: school.id
|
|
})) || []
|
|
// const { list } = await this.$u.api.schoolList({
|
|
// page: 1,
|
|
// page_size: 9999,
|
|
// group: this.aspiration.group
|
|
// })
|
|
// this.schoolList = list.data.map(school => ({
|
|
// value: school.code,
|
|
// label: school.name,
|
|
// extra: school.id
|
|
// }))
|
|
// this.schoolList = this.areaList.map(area => ({
|
|
// id: area.id,
|
|
// value: area.id,
|
|
// label: area.name,
|
|
// children: list.data.filter(school => school.area_id === area.id)?.map(i => ({
|
|
// value: i.code,
|
|
// label: i.name,
|
|
// extra: i.id
|
|
// }))
|
|
// }))
|
|
} catch (err) {
|
|
console.error(err)
|
|
}
|
|
},
|
|
async getBatchSub(batchId) {
|
|
if (!this.subForm.find(i => i.batchId === batchId)) {
|
|
this.subForm.push({
|
|
batchId,
|
|
name: this.batches.find(j => j.id === batchId)?.name,
|
|
batchSubs: []
|
|
})
|
|
}
|
|
if (this.batchSub.hasOwnProperty(batchId) && this.batchSub[batchId]) {
|
|
|
|
} else {
|
|
try {
|
|
const { batchSubs } = await this.$u.api.batchDetail({ id: batchId })
|
|
this.batchSub[batchId] = batchSubs
|
|
batchSubs.forEach(batchSub => {
|
|
this.schoolMap.set(batchSub.id, batchSub.school)
|
|
})
|
|
|
|
const formBatch = this.subForm.find(i => i.batchId === batchId)
|
|
formBatch.batchSubs = batchSubs.map(resSub => ({
|
|
batchSubId: resSub.id,
|
|
name: resSub.name,
|
|
batchSubSchools: resSub.batch_sub_schools.map(subSchool => ({
|
|
batchSubSchoolId: subSchool.id,
|
|
name: subSchool.number,
|
|
code: "",
|
|
value: "",
|
|
specialties: subSchool.specialty?.map((spec, specIndex) => ({
|
|
specialtyId: specIndex,
|
|
name: spec.number,
|
|
code: "",
|
|
value: ""
|
|
}))
|
|
})),
|
|
[resSub.show_specialty_obey ? 'specialtyObey' : 'notShowSpecialtyObey']: "1",
|
|
[resSub.show_school_obey ? 'schoolObey' : 'notShowSchoolObey']: "1"
|
|
}))
|
|
} catch (err) {
|
|
console.error(err)
|
|
}
|
|
}
|
|
this.currentBatchId = batchId
|
|
|
|
const resolveData = (batch) => {
|
|
const myBatchId = batch.batchId
|
|
if (batch.batchSubs && batch.batchSubs.length > 0) {
|
|
batch.batchSubs.forEach(batchSub => {
|
|
const myBatchSubId = batchSub.batchSubId
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-specialty`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-specialty`] = "1"
|
|
}
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-school`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-school`] = "1"
|
|
}
|
|
|
|
if (batchSub.batchSubSchools && batchSub.batchSubSchools.length > 0) {
|
|
batchSub.batchSubSchools.forEach(batchSubSchool => {
|
|
const myBatchSubSchoolId = batchSubSchool.batchSubSchoolId
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-value`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-value`] = ''
|
|
}
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-code`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-code`] = ''
|
|
}
|
|
|
|
if (batchSubSchool.specialties && batchSubSchool.specialties.length > 0) {
|
|
batchSubSchool.specialties.forEach(specialty => {
|
|
const mySpecialtyId = specialty.specialtyId
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-${mySpecialtyId}-value`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-${mySpecialtyId}-value`] = ''
|
|
}
|
|
if (!this.flatForm.hasOwnProperty(`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-${mySpecialtyId}-code`)) {
|
|
this.flatForm[`${myBatchId}-${myBatchSubId}-${myBatchSubSchoolId}-${mySpecialtyId}-code`] = ''
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
this.subForm.forEach(batch => resolveData(batch))
|
|
},
|
|
async getConfig () {
|
|
try {
|
|
const { list } = await this.$u.api.batchIndex({
|
|
group: this.form.group,
|
|
year: this.form.year
|
|
})
|
|
if (list.length > 0) {
|
|
this.form.aspiration_id = list[0].id
|
|
|
|
this.aspiration = list[0]
|
|
|
|
if (this.aspiration.image_id && this.aspiration.image) {
|
|
this.$u.route({
|
|
url: '/package_sub/pages/LoadImage/LoadImage',
|
|
params: {
|
|
src: this.aspiration.image.url
|
|
}
|
|
})
|
|
return
|
|
}
|
|
this.setTitle()
|
|
} else {
|
|
this.$u.toast("暂未获取到当年模版")
|
|
return 1
|
|
}
|
|
} catch (err) {
|
|
console.error(err)
|
|
}
|
|
},
|
|
async stepClick(type='next') {
|
|
if (type === 'next') {
|
|
let notConfig
|
|
if (this.step === 1 && !this.config) {
|
|
notConfig = await this.getConfig()
|
|
// await this.getSchools()
|
|
}
|
|
if (this.step < (1 + this.batches.length) && !notConfig) {
|
|
this.step = this.step + 1
|
|
}
|
|
} else if (type === 'prev') {
|
|
if (this.step === 1) {
|
|
this.form.group = ''
|
|
this.aspiration = null
|
|
this.config = null
|
|
}
|
|
else if (this.step > 1) {
|
|
this.step = this.step - 1
|
|
}
|
|
}
|
|
if (this.step > 1) {
|
|
await this.getBatchSub(this.batches[this.step-2]?.id)
|
|
}
|
|
},
|
|
setTitle() {
|
|
uni.setNavigationBarTitle({
|
|
title: `志愿模拟填报 - Step ${this.step}${ this.step !== 1 ? ('/'+(this.batches.length+1)) : '' }`
|
|
})
|
|
},
|
|
async getArea() {
|
|
try {
|
|
const res = await this.$u.api.area()
|
|
this.areaList = res.list
|
|
this.groupArea = res.list?.filter(i => i.group)?.reduce((acc, item) => {
|
|
const key = item.group;
|
|
if (!acc[key]) {
|
|
acc[key] = [];
|
|
}
|
|
acc[key].push(item);
|
|
return acc;
|
|
}, {})
|
|
} catch (err) {
|
|
console.error(err)
|
|
}
|
|
},
|
|
|
|
submit() {
|
|
const idName = ['batchId', 'batchSubId', 'batchSubSchoolId', 'specialtyId'];
|
|
const linkName = ['batchSubs', 'batchSubSchools', 'specialties'];
|
|
|
|
const updateTargetProperty = (target, key, property) => {
|
|
if (target && target.hasOwnProperty(property)) {
|
|
target[property] = this.flatForm[key];
|
|
}
|
|
};
|
|
|
|
for (const key in this.flatForm) {
|
|
let target = null;
|
|
const keys = key.split('-');
|
|
|
|
keys.forEach((val, i) => {
|
|
|
|
if (i === 2) {
|
|
if (/school$/.test(key)) {
|
|
updateTargetProperty(target, key, 'schoolObey');
|
|
} else if (/specialty$/.test(key)) {
|
|
updateTargetProperty(target, key, 'specialtyObey');
|
|
}
|
|
}
|
|
|
|
if (isNaN(Number(val))) {
|
|
if (i === 3 || i === 4) {
|
|
if (val === 'code' || val === 'value') {
|
|
updateTargetProperty(target, key, val);
|
|
}
|
|
}
|
|
} else {
|
|
target = (target && target[linkName[i - 1]])
|
|
? target[linkName[i - 1]].find(j => j[idName[i]] === Number(val))
|
|
: this.subForm.find(j => j[idName[i]] === Number(val));
|
|
}
|
|
});
|
|
}
|
|
this.$u.api.batchSubmit({
|
|
aspiration_id: this.aspiration.id,
|
|
data: this.subForm,
|
|
name: this.form.name,
|
|
finish_school: this.form.finish_school,
|
|
examination_number: this.form.examination_number,
|
|
}).then(_ => {
|
|
this.$u.route({
|
|
url: '/package_sub/pages/FormSuccess/FormSuccess',
|
|
params: {
|
|
title: "志愿填报",
|
|
redirect: '/pages/list/list',
|
|
type: 'switchTab'
|
|
}
|
|
});
|
|
});
|
|
}
|
|
},
|
|
computed: {
|
|
formArea() {
|
|
return this.areaList?.find(i => i.id === this.form.area_id)?.name
|
|
},
|
|
batches() {
|
|
return this.aspiration.batchs || []
|
|
},
|
|
currentBatchSub() {
|
|
return this.batchSub[this.currentBatchId]
|
|
},
|
|
currentBatch() {
|
|
return this.batches.find(i => i.id === this.currentBatchId) ?? {}
|
|
}
|
|
},
|
|
watch: {
|
|
step() {
|
|
this.setTitle()
|
|
}
|
|
},
|
|
onShow() {
|
|
this.setTitle()
|
|
if (!this.vuex_user.white) {
|
|
this.isShowWhite = true
|
|
}
|
|
},
|
|
created() {
|
|
this.getArea().then(_ => {
|
|
// this.getSchools()
|
|
})
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
.container {
|
|
position: relative;
|
|
min-height: 100vh;
|
|
width: 100vw;
|
|
background: #eaf8fe;
|
|
|
|
.notice-bar {
|
|
position: sticky;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 5;
|
|
}
|
|
|
|
.bkg {
|
|
width: 100vw;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.wrap {
|
|
z-index: 3;
|
|
position: relative;
|
|
padding-top: 40rpx;
|
|
|
|
.year-picker {
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 24rpx;
|
|
padding: 32rpx 75rpx 32rpx 60rpx;
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179rpx 3.355rpx 2.5rpx rgba(208, 209, 209, 0.3));
|
|
|
|
&__title {
|
|
font-size: 30rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
}
|
|
|
|
&__input {
|
|
flex: 1;
|
|
margin-left: 32rpx;
|
|
}
|
|
}
|
|
.user-form {
|
|
background: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 40rpx 24rpx 0;
|
|
padding: 32rpx 75rpx 32rpx 46rpx;
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179rpx 3.355rpx 2.5rpx rgba(208, 209, 209, 0.3));
|
|
|
|
&__title {
|
|
font-size: 30rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
}
|
|
|
|
&__input {
|
|
flex: 1;
|
|
margin-left: 32rpx;
|
|
}
|
|
}
|
|
|
|
.area-pick {
|
|
margin: 0 24rpx;
|
|
|
|
&__title {
|
|
font-size: 30rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
padding: 42rpx 0 38rpx 60rpx;
|
|
}
|
|
|
|
&__panel {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-gap: 22rpx 28rpx;
|
|
|
|
$colors: linear-gradient(0deg, #309cfe 0%, #58e5ff 100%),
|
|
linear-gradient(0deg, #309cfe 0%, #58e5ff 100%),
|
|
linear-gradient(0deg, #2f69fd 0%, #51bcfe 100%),
|
|
linear-gradient(0deg, #2f69fd 0%, #51bcfe 100%),
|
|
linear-gradient(0deg, #2941fc 0%, #587bff 100%),
|
|
linear-gradient(0deg, #2941fc 0%, #587bff 100%),
|
|
linear-gradient(0deg, #280bb7 0%, #5776fe 100%),
|
|
linear-gradient(0deg, #280bb7 0%, #5776fe 100%);
|
|
|
|
.area-item {
|
|
border-radius: 15rpx;
|
|
font-size: 46rpx;
|
|
text-transform: uppercase;
|
|
color: #ffffff;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
padding: 60rpx 0;
|
|
filter: drop-shadow(0 4rpx 2rpx rgba(0, 0, 0, 0.3));
|
|
position: relative;
|
|
overflow: hidden;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
&::before {
|
|
content: '';
|
|
opacity: 0.302;
|
|
width: 192rpx;
|
|
height: 192rpx;
|
|
border-radius: 96rpx;
|
|
background-image: linear-gradient(0deg, #309cfe 0%, #58c2ff 100%);
|
|
position: absolute;
|
|
top: -140rpx;
|
|
right: -38rpx;
|
|
}
|
|
|
|
&::after {
|
|
content: '';
|
|
opacity: 0.149;
|
|
width: 192rpx;
|
|
height: 192rpx;
|
|
border-radius: 96rpx;
|
|
background-color: #b9e1fd;
|
|
position: absolute;
|
|
bottom: -148rpx;
|
|
left: -44rpx;
|
|
}
|
|
|
|
&__tag {
|
|
z-index: 4;
|
|
position: absolute;
|
|
top: 10rpx;
|
|
right: 10rpx;
|
|
}
|
|
}
|
|
|
|
@for $i from 1 through length($colors) {
|
|
.area-item:nth-child(n + #{$i}) {
|
|
background: nth($colors, $i);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.picked-data {
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179rpx 3.355rpx 2.5rpx rgba(208,209,209,0.3));
|
|
background-color: rgba(255, 255, 255, 0.5);
|
|
margin: 20rpx 24rpx 0;
|
|
padding: 26rpx;
|
|
|
|
& > view {
|
|
word-break: break-word;
|
|
flex: 1;
|
|
text-align: center;
|
|
font-size: 32rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: bold;
|
|
// white-space: nowrap;
|
|
}
|
|
& > view + view {
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
|
|
.card {
|
|
margin: 28rpx 24rpx 0;
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179rpx 3.355rpx 2.5rpx rgba(208,209,209,0.3));
|
|
background-color: #ffffff;
|
|
|
|
&__title {
|
|
background: #fbf1e8;
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
padding: 0 16rpx;
|
|
}
|
|
&__body {
|
|
padding: 48rpx 30rpx 70rpx 30rpx;
|
|
}
|
|
}
|
|
.batch-sub {
|
|
|
|
&__title {
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
text-transform: uppercase;
|
|
color: #e77817;
|
|
font-weight: 500;
|
|
padding: 30rpx 20rpx;
|
|
}
|
|
|
|
&-is-obey {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 40rpx;
|
|
|
|
& > view:nth-child(1) {
|
|
font-size: 24rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
margin-right: 110rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.btns {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.batch-sub-school {
|
|
margin-top: 40rpx;
|
|
|
|
&:nth-child(1) {
|
|
margin-top: 0;
|
|
}
|
|
&__name {
|
|
font-size: 28rpx;
|
|
line-height: 36rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
}
|
|
.sub-form1 {
|
|
&-title {
|
|
font-size: 24rpx;
|
|
line-height: 36rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
margin: 28rpx 0;
|
|
text-align: center;
|
|
}
|
|
&__row {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
&__col1 {
|
|
flex-basis: 29%;
|
|
}
|
|
&__col2 {
|
|
flex-basis: 67.5%;
|
|
}
|
|
}
|
|
|
|
.sub-form2 {
|
|
&-title {
|
|
font-size: 24rpx;
|
|
line-height: 36rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
margin: 28rpx 0;
|
|
text-align: center;
|
|
}
|
|
&__row {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
&__col1 {
|
|
flex-basis: 14.8%;
|
|
font-size: 28rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
text-align: center;
|
|
}
|
|
&__col2 {
|
|
flex-basis: 29%;
|
|
}
|
|
&__col3 {
|
|
flex-basis: 48.9%;
|
|
}
|
|
}
|
|
.sub-form2__row + .sub-form2__row {
|
|
margin-top: 22rpx;
|
|
}
|
|
}
|
|
|
|
</style>
|