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.
786 lines
20 KiB
786 lines
20 KiB
<template>
|
|
<page-meta
|
|
:page-style="`overflow:${isShowRecommend ? 'hidden' : 'visible'};`"
|
|
></page-meta>
|
|
<view class="container safe-area-inset-bottom">
|
|
<image class="bkg" src="~@/static/me/wave.png" mode="widthFix"></image>
|
|
|
|
<view class="wrap">
|
|
<view class="card">
|
|
<u-form :model="form" ref="uForm" label-width="auto">
|
|
<u-form-item label="学生姓名" prop="name">
|
|
<u-input
|
|
v-model="form.name"
|
|
placeholder="请输入"
|
|
input-align="right"
|
|
/>
|
|
</u-form-item>
|
|
<u-form-item label="性别" prop="sex">
|
|
<u-input
|
|
type="select"
|
|
v-model="form.sex"
|
|
placeholder="请选择"
|
|
input-align="right"
|
|
@click="isShowSex = true"
|
|
/>
|
|
</u-form-item>
|
|
<u-form-item label="中考年份" required prop="year">
|
|
<u-input
|
|
type="select"
|
|
v-model="form.year"
|
|
placeholder="请选择"
|
|
input-align="right"
|
|
@click="isShowYear = true"
|
|
/>
|
|
</u-form-item>
|
|
<!-- <u-form-item label="民族" prop="nationality">
|
|
<u-input
|
|
v-model="form.nationality"
|
|
placeholder="请输入"
|
|
input-align="right"
|
|
/>
|
|
</u-form-item> -->
|
|
<!-- <u-form-item label="所在城市" required prop="city">-->
|
|
<!-- <u-input type="select" v-model="form.city" placeholder="请选择" input-align="right" @click="regionType = 'city',isShowRegion = true" />-->
|
|
<!-- </u-form-item>-->
|
|
<u-form-item label="所在县区" required prop="area_id">
|
|
<u-input
|
|
type="select"
|
|
:value="formArea"
|
|
placeholder="请选择"
|
|
input-align="right"
|
|
@click="isShowAreaSelect = true"
|
|
/>
|
|
</u-form-item>
|
|
<u-form-item label="所在学校" prop="school_id">
|
|
<u-input
|
|
type="select"
|
|
:value="form.school_name"
|
|
placeholder="请输入"
|
|
input-align="right"
|
|
@click="isShowSchoolSelect = true"
|
|
/>
|
|
</u-form-item>
|
|
</u-form>
|
|
</view>
|
|
|
|
<view class="card">
|
|
<view class="card__title">成绩</view>
|
|
|
|
<view class="score">
|
|
<view class="score-row">
|
|
<view class="score-row__text">考试裸分：</view>
|
|
<u-input
|
|
v-model="form.anticipate_score"
|
|
style="width: 280rpx"
|
|
placeholder="输入考试裸分"
|
|
input-align="center"
|
|
border
|
|
border-color="#e0e0e0"
|
|
:height="50"
|
|
:clearable="false"
|
|
></u-input>
|
|
</view>
|
|
|
|
<view class="score-row">
|
|
<view class="score-row__text">体育分数：</view>
|
|
<u-input
|
|
v-model="form.physical_score"
|
|
style="width: 280rpx"
|
|
placeholder="输入体育分数"
|
|
input-align="center"
|
|
border
|
|
border-color="#e0e0e0"
|
|
:height="50"
|
|
:clearable="false"
|
|
></u-input>
|
|
</view>
|
|
|
|
<view class="score-row">
|
|
<view class="score-row__text">口语听力：</view>
|
|
<u-input
|
|
v-model="form.hearing_score"
|
|
style="width: 280rpx"
|
|
placeholder="输入口语听力"
|
|
input-align="center"
|
|
border
|
|
border-color="#e0e0e0"
|
|
:height="50"
|
|
:clearable="false"
|
|
></u-input>
|
|
</view>
|
|
|
|
<view class="score-row">
|
|
<view class="score-row__text">难度系数：</view>
|
|
<u-input
|
|
v-model="form.difficulty"
|
|
style="width: 280rpx"
|
|
placeholder="输入难度系数"
|
|
input-align="center"
|
|
border
|
|
border-color="#e0e0e0"
|
|
:height="50"
|
|
:clearable="false"
|
|
></u-input>
|
|
</view>
|
|
|
|
<view style="line-height: 2.5" @click="isShowQrcode = true">
|
|
<u-icon name="question-circle-fill"></u-icon>
|
|
<text style="padding-left: 6rpx"
|
|
>您可以联系客服了解难度系数填写</text
|
|
>
|
|
</view>
|
|
|
|
<!-- <view class="score-row">-->
|
|
<!-- <view class="score-row__text">成绩稳定性：</view>-->
|
|
|
|
<!-- <view class="my-radio-group">-->
|
|
<!-- <view class="my-radio" :class="form.is_stable ? 'my-radio--checked' : ''" @click="form.is_stable = 1">是</view>-->
|
|
<!-- <view class="my-radio" :class="!form.is_stable ? 'my-radio--checked' : ''" @click="form.is_stable = 0">否</view>-->
|
|
<!-- </view>-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="score-row">-->
|
|
<!-- <view class="score-row__text">是否为裸分：</view>-->
|
|
|
|
<!-- <view class="my-radio-group">-->
|
|
<!-- <view class="my-radio" :class="form.is_bare ? 'my-radio--checked' : ''" @click="form.is_bare = 1">是</view>-->
|
|
<!-- <view class="my-radio" :class="!form.is_bare ? 'my-radio--checked' : ''" @click="form.is_bare = 0">否</view>-->
|
|
<!-- </view>-->
|
|
<!-- </view>-->
|
|
</view>
|
|
</view>
|
|
|
|
<u-button
|
|
shape="circle"
|
|
:custom-style="{
|
|
background: 'linear-gradient(to right, #2e63ef, #4186f2)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
color: '#fff',
|
|
'font-size': '33rpx',
|
|
'letter-spacing': '5rpx',
|
|
width: '450rpx',
|
|
margin: '130rpx auto 0',
|
|
}"
|
|
@click="submit"
|
|
>保存</u-button
|
|
>
|
|
</view>
|
|
|
|
<u-select
|
|
v-model="isShowSex"
|
|
:list="sexList"
|
|
@confirm="(e) => (form.sex = e[0].value)"
|
|
></u-select>
|
|
<u-picker
|
|
mode="time"
|
|
v-model="isShowYear"
|
|
:params="{
|
|
year: true,
|
|
month: false,
|
|
day: false,
|
|
hour: false,
|
|
minute: false,
|
|
second: false,
|
|
}"
|
|
@confirm="(e) => (form.year = e.year)"
|
|
></u-picker>
|
|
<!-- <u-picker-->
|
|
<!-- mode="region"-->
|
|
<!-- v-model="isShowRegion"-->
|
|
<!-- :default-region="defaultRegion"-->
|
|
<!-- :params="regionParams"-->
|
|
<!-- @confirm="regionPick"></u-picker>-->
|
|
<u-select
|
|
v-model="isShowSchoolSelect"
|
|
mode="mutil-column-auto"
|
|
:list="schoolList"
|
|
@confirm="schoolListConfirm"
|
|
></u-select>
|
|
|
|
<u-select
|
|
v-model="isShowAreaSelect"
|
|
:list="areaList"
|
|
@confirm="areaConfirm"
|
|
></u-select>
|
|
|
|
<u-popup
|
|
v-model="isShowRecommend"
|
|
border-radius="10"
|
|
mode="bottom"
|
|
safe-area-inset-bottom
|
|
length="90%"
|
|
closeable
|
|
:custom-style="{ background: '#eaf9fe' }"
|
|
>
|
|
<view>
|
|
<view
|
|
class="recommend-panel"
|
|
v-for="(value, key) in { top: '冲', steady: '稳', safeguard: '保' }"
|
|
:key="key"
|
|
>
|
|
<view class="recommend-panel__title"> “{{ value }}”推荐学校 </view>
|
|
|
|
<view class="recommend-panel__content">
|
|
<view class="list" v-if="recommends[key].length > 0">
|
|
<view
|
|
class="list-item"
|
|
v-for="i in recommends[key]"
|
|
:key="i.id"
|
|
@click="
|
|
$u.route({
|
|
url: '/package_sub/pages/SchoolDetail/SchoolDetail',
|
|
params: {
|
|
id: i.id,
|
|
},
|
|
})
|
|
"
|
|
>
|
|
<view class="left">
|
|
<image
|
|
mode="aspectFill"
|
|
class="list-item__img"
|
|
:src="i.icon && i.icon.url ? i.icon.url : vuex_default_icon"
|
|
></image>
|
|
</view>
|
|
<view class="right">
|
|
<view class="list-item__title">
|
|
<text>{{ i.name }}</text>
|
|
<u-icon name="arrow-right" color="#333" :size="30"></u-icon>
|
|
</view>
|
|
<view class="list-item__tags">
|
|
<view class="list-item__tags--area">
|
|
{{ schoolArea(i.area_id) }}
|
|
</view>
|
|
<view
|
|
class="list-item__tags--type"
|
|
v-for="(tag, index1) in i.type"
|
|
:key="index1"
|
|
>
|
|
{{ tag }}
|
|
</view>
|
|
<view
|
|
v-if="i.star"
|
|
class="list-item__tags--star"
|
|
>
|
|
{{ i.star }}
|
|
</view>
|
|
|
|
|
|
</view>
|
|
<view class="list-item__info">
|
|
<view>
|
|
办学性质：{{
|
|
i.nature === 1 ? "公办" : i.nature === 2 ? "民办" : "-"
|
|
}}
|
|
</view>
|
|
<view>历年均分：{{i.avg_score?i.avg_score:'-'}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-else style="text-align: center;line-height: 2;color: #666;">暂无学校</view>
|
|
</view>
|
|
</view>
|
|
|
|
<u-button
|
|
shape="circle"
|
|
:custom-style="{
|
|
background: 'linear-gradient(to right, #2e63ef, #4186f2)',
|
|
height: '76rpx',
|
|
'line-height': '76rpx',
|
|
color: '#fff',
|
|
'font-size': '33rpx',
|
|
'letter-spacing': '5rpx',
|
|
width: '450rpx',
|
|
margin: '60rpx auto 0',
|
|
}"
|
|
@click="$u.route({
|
|
url: '/package_sub/pages/BatchForm/BatchForm'
|
|
})"
|
|
>去模拟填报</u-button
|
|
>
|
|
</view>
|
|
</u-popup>
|
|
<u-mask
|
|
:show="isShowQrcode"
|
|
border-radius="14"
|
|
@click="isShowQrcode = false"
|
|
>
|
|
<view class="qrcode-wrap">
|
|
<Qrcode @tap.stop></Qrcode>
|
|
</view>
|
|
</u-mask>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import Qrcode from "@/component/Qrcode/index.vue";
|
|
|
|
export default {
|
|
components: {
|
|
Qrcode,
|
|
},
|
|
data() {
|
|
return {
|
|
isShowQrcode: false,
|
|
regionType: "city",
|
|
isShowRegion: false,
|
|
isShowYear: false,
|
|
isShowSex: false,
|
|
sexList: [
|
|
{
|
|
value: "男",
|
|
label: "男",
|
|
},
|
|
{
|
|
value: "女",
|
|
label: "女",
|
|
},
|
|
{
|
|
value: "保密",
|
|
label: "保密",
|
|
},
|
|
],
|
|
form: {
|
|
area_id: "",
|
|
year: "",
|
|
name: "",
|
|
sex: "",
|
|
nationality: "",
|
|
city: "",
|
|
school_id: "",
|
|
school_name: "",
|
|
anticipate_score: "",
|
|
physical_score: "",
|
|
hearing_score: "",
|
|
difficulty: "",
|
|
is_stable: 1,
|
|
is_bare: 1,
|
|
},
|
|
rules: {
|
|
area_id: [
|
|
{
|
|
required: true,
|
|
message: "请选择县区",
|
|
},
|
|
],
|
|
anticipate_score: [
|
|
{
|
|
required: true,
|
|
message: "请填写",
|
|
},
|
|
{
|
|
type: "number",
|
|
message: "请填写数字",
|
|
},
|
|
],
|
|
physical_score: [
|
|
{
|
|
required: true,
|
|
message: "请填写",
|
|
},
|
|
{
|
|
type: "number",
|
|
message: "请填写数字",
|
|
},
|
|
],
|
|
hearing_score: [
|
|
{
|
|
required: true,
|
|
message: "请填写",
|
|
},
|
|
{
|
|
type: "number",
|
|
message: "请填写数字",
|
|
},
|
|
],
|
|
},
|
|
|
|
isShowAreaSelect: false,
|
|
areaList: [],
|
|
isShowSchoolSelect: false,
|
|
schoolList: [],
|
|
|
|
recommends: {
|
|
top: [],
|
|
steady: [],
|
|
safeguard: [],
|
|
},
|
|
isShowRecommend: false,
|
|
};
|
|
},
|
|
watch: {
|
|
vuex_user: {
|
|
handler: function (newVal) {
|
|
const keys = new Map([
|
|
["middle_exam_year", "year"],
|
|
["name", "name"],
|
|
["sex", "sex"],
|
|
["nationality", "nationality"],
|
|
]);
|
|
|
|
Array.from(keys.keys()).forEach((key) => {
|
|
if (newVal[key]) {
|
|
this.form[keys.get(key)] = newVal[key];
|
|
}
|
|
});
|
|
},
|
|
immediate: true,
|
|
},
|
|
},
|
|
computed: {
|
|
formArea() {
|
|
return this.areaList.find((i) => i.value === this.form.area_id)?.label;
|
|
},
|
|
regionParams() {
|
|
return this.regionType === "city"
|
|
? {
|
|
province: true,
|
|
city: true,
|
|
area: false,
|
|
}
|
|
: {
|
|
province: false,
|
|
city: false,
|
|
area: true,
|
|
};
|
|
},
|
|
defaultRegion() {
|
|
if (this.regionType === "area") {
|
|
return [this.form.province, this.form.city];
|
|
}
|
|
},
|
|
schoolArea() {
|
|
return function (areaId) {
|
|
return this.areaList.find((i) => i.value === areaId)?.label;
|
|
};
|
|
},
|
|
},
|
|
methods: {
|
|
areaConfirm(e) {
|
|
if (e[0]) {
|
|
this.form.area_id = e[0].value;
|
|
}
|
|
},
|
|
async getArea() {
|
|
try {
|
|
const res = await this.$u.api.area();
|
|
this.areaList = res.list?.map((i) => ({ label: i.name, value: i.id }));
|
|
|
|
const areaVal = this.vuex_user?(this.vuex_user['area']?this.vuex_user['area']:''):''
|
|
this.areaList.map(i=>{
|
|
if(i.label==areaVal){
|
|
this.form.area_id = i.value
|
|
}
|
|
})
|
|
console.log("this.form.area_id",this.form.area_id)
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
},
|
|
schoolListConfirm(e) {
|
|
if (e[1]) {
|
|
const { extra, label } = e[1];
|
|
this.form.school_id = extra;
|
|
this.form.school_name = label;
|
|
}
|
|
},
|
|
async getSchools() {
|
|
try {
|
|
const { list } = await this.$u.api.schoolList({
|
|
page: 1,
|
|
page_size: 9999,
|
|
type: "初中",
|
|
});
|
|
this.schoolList = this.areaList.map((area) => ({
|
|
id: area.value,
|
|
value: area.value,
|
|
label: area.label,
|
|
children: list.data
|
|
?.filter((school) => school.area_id === area.value)
|
|
?.map((i) => ({
|
|
value: i.code,
|
|
label: i.name,
|
|
extra: i.id,
|
|
})),
|
|
}));
|
|
|
|
const schoolVal = this.vuex_user?(this.vuex_user['school']?this.vuex_user['school']:''):''
|
|
list.data.map(i=>{
|
|
if(i.name==schoolVal){
|
|
this.form.school_id = i.id
|
|
this.form.school_name = i.name
|
|
}
|
|
})
|
|
console.log(this.schoolList);
|
|
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
},
|
|
|
|
regionPick(e) {
|
|
if (e.hasOwnProperty("province")) {
|
|
this.form.province = e.province?.label;
|
|
}
|
|
if (e.hasOwnProperty("city")) {
|
|
this.form.city = e.city?.label;
|
|
}
|
|
if (e.hasOwnProperty("area")) {
|
|
this.form.area = e.area?.label;
|
|
}
|
|
},
|
|
|
|
submit() {
|
|
const myValid = () => {
|
|
const isPositiveNumber = (input) => {
|
|
const regex = /^(?:0|[1-9]\d*)(?:\.\d+)?$/;
|
|
return regex.test(input);
|
|
};
|
|
if (
|
|
isPositiveNumber(this.form.anticipate_score) &&
|
|
isPositiveNumber(this.form.hearing_score) &&
|
|
isPositiveNumber(this.form.physical_score)
|
|
) {
|
|
return true;
|
|
} else {
|
|
this.$u.toast("分数请填写数字");
|
|
return false;
|
|
}
|
|
};
|
|
this.$refs["uForm"].validate((valid) => {
|
|
const valid1 = myValid();
|
|
if (valid && valid1) {
|
|
try {
|
|
this.$u.api.recommendForm(this.form).then(async (res) => {
|
|
console.log(res);
|
|
uni.showToast({
|
|
title: "提交成功",
|
|
icon: "none",
|
|
duration: 1000,
|
|
});
|
|
const { model } = res;
|
|
this.recommends = model?.recommends;
|
|
this.isShowRecommend = true;
|
|
});
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
}
|
|
});
|
|
},
|
|
},
|
|
onReady() {
|
|
this.$refs.uForm.setRules(this.rules);
|
|
},
|
|
created() {
|
|
this.getArea().then((_) => this.getSchools());
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.u-drawer-bottom {
|
|
background: #eaf9fe !important;
|
|
}
|
|
.container {
|
|
position: relative;
|
|
min-height: 100vh;
|
|
width: 100vw;
|
|
background: #eaf8fe;
|
|
|
|
.wrap {
|
|
z-index: 3;
|
|
position: relative;
|
|
padding-top: 3.6vh;
|
|
|
|
.card {
|
|
margin: 20rpx 24rpx 0;
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179rpx 3.355rpx 2.5rpx rgba(208, 209, 209, 0.3));
|
|
background-color: #ffffff;
|
|
padding: 32rpx 36rpx 40rpx 40rpx;
|
|
|
|
&__title {
|
|
display: inline-block;
|
|
font-size: 30rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
padding: 0 10rpx;
|
|
z-index: 3;
|
|
position: relative;
|
|
|
|
&::after {
|
|
content: "";
|
|
background: linear-gradient(to right, #2e63ef, #4187f2);
|
|
height: 6rpx;
|
|
border-radius: 4rpx;
|
|
z-index: 0;
|
|
position: absolute;
|
|
bottom: 4rpx;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.score {
|
|
margin-top: 38rpx;
|
|
|
|
&-row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
&__text {
|
|
flex-basis: 170rpx;
|
|
font-size: 28rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
.score-row + .score-row {
|
|
margin-top: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
.bkg {
|
|
width: 100vw;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
.my-radio-group {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
|
|
.my-radio {
|
|
width: 131rpx;
|
|
height: 48rpx;
|
|
border-radius: 24rpx;
|
|
font-size: 24rpx;
|
|
line-height: 48rpx;
|
|
text-transform: uppercase;
|
|
color: #000000;
|
|
background-color: #e4e9f0;
|
|
text-align: center;
|
|
transition: all 0.2s;
|
|
|
|
&--checked {
|
|
background-color: #1165f8;
|
|
color: #fff;
|
|
}
|
|
}
|
|
.my-radio + .my-radio {
|
|
margin-left: 18rpx;
|
|
}
|
|
}
|
|
|
|
.recommend-panel {
|
|
padding: 0 24rpx;
|
|
|
|
&__title {
|
|
font-size: 36rpx;
|
|
text-transform: uppercase;
|
|
color: #333333;
|
|
font-weight: bold;
|
|
padding: 44rpx 0;
|
|
}
|
|
&__content {
|
|
.list {
|
|
&-item {
|
|
padding: 24rpx 28rpx 24rpx 32rpx;
|
|
border-radius: 20rpx;
|
|
filter: drop-shadow(-2.179px 3.355px 2.5px rgba(208, 209, 209, 0.3));
|
|
background-color: #ffffff;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.left {
|
|
.list-item__img {
|
|
border-radius: 100%;
|
|
height: 150rpx;
|
|
width: 150rpx;
|
|
}
|
|
}
|
|
.right {
|
|
flex: 1;
|
|
margin-left: 34rpx;
|
|
|
|
.list-item__title {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
text {
|
|
max-width: 300rpx;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
.list-item__tags {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
padding-top: 20rpx;
|
|
|
|
&--area {
|
|
color: #1a95da;
|
|
font-size: 24rpx;
|
|
border-radius: 20rpx;
|
|
background-color: rgba(26, 149, 218, 0.2);
|
|
padding: 8rpx 18rpx;
|
|
}
|
|
&--type {
|
|
color: #dd9447;
|
|
font-size: 24rpx;
|
|
border-radius: 20rpx;
|
|
background-color: rgba(233, 144, 50, 0.2);
|
|
padding: 6rpx 18rpx;
|
|
}
|
|
&--star{
|
|
color: #fff;
|
|
font-size: 24rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #4186f2;
|
|
padding: 6rpx 18rpx;
|
|
}
|
|
& > view + view {
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
.list-item__info {
|
|
padding-top: 20rpx;
|
|
font-size: 24rpx;
|
|
text-transform: uppercase;
|
|
color: rgba(51, 51, 51, 0.8);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
}
|
|
}
|
|
.list-item + .list-item {
|
|
margin-top: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.qrcode-wrap {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
}
|
|
</style>
|