207 lines
7.8 KiB
Vue
207 lines
7.8 KiB
Vue
<script lang="ts" setup>
|
||
import { systemInfo } from '@/utils/systemInfo'
|
||
import MxRadio from "@/pages-sub/components/radio/index.vue"
|
||
import MxInput from "@/pages-sub/components/input/index.vue"
|
||
import { getGradeList, getAreaList, saveUserAreaScore } from "@/service"
|
||
|
||
import { useUserStore } from "@/store"
|
||
import { storeToRefs } from "pinia";
|
||
|
||
// #ifdef MP-WEIXIN
|
||
definePage({
|
||
style: {
|
||
navigationStyle: 'custom',
|
||
},
|
||
excludeLoginPath: true,
|
||
})
|
||
// #endif
|
||
|
||
// #ifndef MP-WEIXIN
|
||
definePage({
|
||
style: {
|
||
navigationStyle: 'custom',
|
||
transparentTitle: 'always',
|
||
navigationBarTitleText: ''
|
||
},
|
||
excludeLoginPath: true,
|
||
})
|
||
// #endif
|
||
|
||
const handleBack = () => {
|
||
const pages = getCurrentPages()
|
||
if(pages.length <=1){
|
||
uni.switchTab({url:'/pages/index/index'})
|
||
return
|
||
}
|
||
uni.navigateBack()
|
||
}
|
||
|
||
const formData = ref({
|
||
genderLabel: '',
|
||
})
|
||
|
||
const userStore = useUserStore();
|
||
const { userInfo } = storeToRefs(userStore)
|
||
|
||
const handleSubmit = () => {
|
||
|
||
let params = {
|
||
areaName: userInfo.value.userExtend.area,
|
||
totalScore: userInfo.value.userExtend.expectedScore,
|
||
id: userInfo.value.userExtend.id
|
||
}
|
||
saveUserAreaScore({ data: params }).then((resp) => {
|
||
if (resp.code === 200) {
|
||
uni.navigateTo({ url: '/pages-sub/wishlist/create/secondBatch' })
|
||
}
|
||
})
|
||
}
|
||
|
||
const activeType = ref("")
|
||
const visible = ref(false)
|
||
|
||
const onOverlayClick = () => {
|
||
visible.value = false
|
||
}
|
||
|
||
const genderClassification = [{ label: '男', value: 1 }, { label: '女', value: 2 }]
|
||
const gradeClassification = ref([])
|
||
const areaList = ref([])
|
||
|
||
const handleOpenPopup = (type: string) => {
|
||
visible.value = true
|
||
activeType.value = type
|
||
}
|
||
|
||
const getTitle = (type: string) => {
|
||
const title = { "gender": '请选择性别', "grade": '请选择年级', "examinationArea": '请选择中考所在地' }
|
||
return title[type];
|
||
}
|
||
|
||
const navigateToSchool = () => {
|
||
uni.navigateTo({ url: `/pages-sub/wishlist/school?area=${userInfo.value.userExtend.area}` })
|
||
}
|
||
|
||
onShow(() => {
|
||
getGradeList().then(resp => {
|
||
if (resp.code === 200) {
|
||
gradeClassification.value = resp.result
|
||
}
|
||
})
|
||
|
||
getAreaList().then(resp => {
|
||
if (resp.code === 200) {
|
||
areaList.value = resp.result
|
||
}
|
||
})
|
||
|
||
formData.value.genderLabel = genderClassification.filter(item => item.value == userInfo.value.sex)[0]?.label
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<view class="flex flex-col custom-background h-screen">
|
||
<sar-navbar show-back @back="handleBack" :fixed="true" fixation-style="top:unset;"
|
||
:root-style="{ '--sar-navbar-bg': `transparent`, '--sar-navbar-item-color': 'black', 'padding-top': `${systemInfo?.statusBarHeight}px` }">
|
||
<template #title>
|
||
<view class="flex justify-center">志愿填报</view>
|
||
</template>
|
||
</sar-navbar>
|
||
|
||
<view class="flex items-center mx-[30rpx] mb-[20rpx]">
|
||
|
||
<view class="flex flex-col ml-[10rpx]">
|
||
<view class="text-[44rpx] font-500 mb-[14rpx]">一键生成志愿表</view>
|
||
<view class="text-[#B0B3B8] text-[30rpx]">生成我的专属志愿表</view>
|
||
</view>
|
||
<view class="w-[160rpx] h-[160rpx] ml-auto">
|
||
<image src="https://lwzk.ycymedu.com/img/tianbao/tb_zk03.png" mode="scaleToFill"
|
||
class="w-[160rpx] h-[160rpx]" />
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<form @submit="handleSubmit" class="flex-1 pb-safe">
|
||
<view class="flex flex-col h-full">
|
||
|
||
<view
|
||
class="flex items-center text-[30rpx] justify-between mx-[40rpx] py-[34rpx] px-[30rpx] bg-[#F7F8FA] mb-[20rpx]">
|
||
<view class="text-[#404142] text-left min-w-[150rpx] mr-[40rpx] ">总分</view>
|
||
<view class="flex-1 flex items-center">
|
||
<MxInput type="number" v-model:value="userInfo.userExtend.expectedScore" placeholder="请填写"
|
||
root-class="text-right" class="w-full" inputDirection="text-right"/>
|
||
|
||
</view>
|
||
</view>
|
||
<view
|
||
class="flex items-center text-[30rpx] justify-between mx-[40rpx] py-[34rpx] px-[30rpx] bg-[#F7F8FA]">
|
||
<view class="text-[#404142] text-left min-w-[150rpx] mr-[40rpx] ">中考所在区</view>
|
||
<view class="flex-1 flex items-center" @click="handleOpenPopup('examinationArea')">
|
||
<MxInput v-model:value="userInfo.userExtend.area" placeholder="请选择您的中考所在区"
|
||
root-class="text-right" class="w-full" inputDirection="text-right" :readonly="true" />
|
||
|
||
<view class="w-[18rpx] h-[36rpx] flex items-center ml-[10rpx]">
|
||
<image src="https://lwzk.ycymedu.com/img/tianbao/tb_jiantou.png"
|
||
mode="scaleToFill" class="w-[18rpx] h-[36rpx]" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<view class="mx-[40rpx] mt-[68rpx] bg-[#FEF6F6] rounded-[16rpx]">
|
||
<view class="h-[52rpx] w-[178rpx] flex items-center m-[-8rpx] ml-[20rpx]">
|
||
<image src="https://lw-zk.oss-cn-hangzhou.aliyuncs.com/img/home/tb_shuoming.png" mode="scaleToFill"
|
||
class="h-[52rpx] w-[178rpx]" />
|
||
</view>
|
||
|
||
<view class="flex flex-col text-[#E03C33] m-[20rpx]">
|
||
<view class="text-[24rpx] mt-[4rpx]">
|
||
<view>根据济南2026年中考招生政策，进入模拟志愿填报阶段的考生，默认历史、生物、地理、道法等水平考试等级均已达到普通高中基础填报要求（C级及以上），本产品仅用于统招平行志愿的模拟。</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
<view class="px-[30rpx] py-[16rpx] border-t-solid border-t-[#ededed] border-t-1 mt-auto">
|
||
<button form-type="submit" class="rounded-[16rpx] bg-[#1580FF] text-[#fff] submit-btn">开始推荐</button>
|
||
</view>
|
||
</view>
|
||
</form>
|
||
|
||
<sar-popup :visible="visible" effect="slide-bottom" @overlay-click="onOverlayClick">
|
||
<view class="bg-white rounded-[24rpx_24rpx_0_0] px-[30rpx] pb-safe pt-[30rpx] min-h-[492rpx]">
|
||
<view class="text-[34rpx] font-500 flex items-center justify-between mb-[30rpx]">
|
||
<view>{{ getTitle(activeType) }}</view>
|
||
<view class="w-[36rpx] h-[36rpx] flex items-center" @click="onOverlayClick">
|
||
<image src="https://lwzk.ycymedu.com/img/tianbao/tb_guanbi.png"
|
||
mode="scaleToFill" class="w-[36rpx] h-[36rpx]" />
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<MxRadio v-model:value="userInfo.userExtend.area" v-if="activeType == 'examinationArea'"
|
||
:options="areaList" label-key="label" value-key="value"
|
||
custom-root-cols-class="grid grid-cols-3 items-center gap-[20rpx]"
|
||
custom-root-class="pb-[20rpx]" custom-item-class="py-[12rpx] text-center "
|
||
active-item-class="bg-white text-[#1580FF] border-[#1580FF] border-[2rpx] border-solid" @change="visible = false"/>
|
||
|
||
</view>
|
||
</sar-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.custom-background {
|
||
background: linear-gradient( 177deg, #E4EDFF 0%, #F0F5FF 180rpx, #FEFEFF 360rpx);
|
||
background-position: 50% 50%;
|
||
background-origin: padding-box;
|
||
background-clip: border-box;
|
||
background-size: auto auto;
|
||
}
|
||
|
||
.submit-btn[disabled] {
|
||
background-color: #a1cbff;
|
||
color: #fff;
|
||
}
|
||
</style>
|