幼儿信息家长端维护自适应

This commit is contained in:
paidaxing444 2020-11-01 20:26:00 +08:00
parent d84bd59fe8
commit b9942bb4d4
2 changed files with 63 additions and 40 deletions

View File

@ -94,20 +94,19 @@ export default {
}, },
// //
handleNodeClick(data) { handleNodeClick(data) {
console.log("node:" + data.id); // console.log("node:" + data.id);
this.title = data.label; this.title = data.label;
if (data.id == "-1") { if (data.id == "-1") {
this.getNote(); this.getNote();
} else { } else {
this.queryParams.id = data.id; this.queryParams.id = data.id;
this.getTaskList(); this.getTaskList();
} }
}, },
/**查询评估介绍 */ /**查询评估介绍 */
getNote() { getNote() {
listAssessmentintroduce(null).then((response) => { listAssessmentintroduce(null).then((response) => {
console.log("评估介绍:" + response.rows[0].content); // console.log(":" + response.rows[0].content);
this.note = response.rows[0].content; this.note = response.rows[0].content;
}); });
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="result-container"> <div class="result-container">
<h2 class="title">请输入幼儿姓名和手机号进行查询:</h2> <h2 class="title search-title">幼儿信息查询</h2>
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px"> <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="search-form">
<el-form-item label="幼儿姓名" prop="name"> <el-form-item label="幼儿姓名" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入幼儿姓名" clearable size="small" /> <el-input v-model="queryParams.name" placeholder="请输入幼儿姓名" clearable size="small" />
</el-form-item> </el-form-item>
@ -14,34 +14,34 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div class="main" v-show="hide"> <div class="main" v-show="hide">
<h2 class="title">幼儿信息查询与维护</h2> <h2 class="title">幼儿信息维护</h2>
<div class="result-form"> <div class="result-form">
<p class="form-title">提交核对幼儿信息</p> <!-- <p class="form-title">提交核对幼儿信息</p> -->
<el-tabs type="border-card"> <el-tabs type="border-card">
<el-tab-pane label="幼儿基础信息"> <el-tab-pane label="幼儿基础信息">
<el-row :gutter="15"> <el-row :gutter="15">
<el-form class="form" ref="form" :model="form" label-width="110px"> <el-form class="form" ref="form" :model="form" label-width="110px">
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="家长联系方式" prop="phone"> <el-form-item label="家长联系方式" prop="phone">
<el-input v-model="form.phone" placeholder="请输入联系方式" :disabled="hide" /> <el-input v-model="form.phone" placeholder="请输入联系方式" :disabled="hide" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="幼儿姓名" prop="name"> <el-form-item label="幼儿姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入幼儿姓名" :disabled="hide" /> <el-input v-model="form.name" placeholder="请输入幼儿姓名" :disabled="hide" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="英文名" prop="enName"> <el-form-item label="英文名" prop="enName">
<el-input v-model="form.enName" placeholder="请输入联系方式" /> <el-input v-model="form.enName" placeholder="请输入联系方式" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="小名" prop="infantName"> <el-form-item label="小名" prop="infantName">
<el-input v-model="form.infantName" placeholder="请输入联系方式" /> <el-input v-model="form.infantName" placeholder="请输入联系方式" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="性别" prop="xb"> <el-form-item label="性别" prop="xb">
<el-select v-model="form.xb" placeholder="请选择性别"> <el-select v-model="form.xb" placeholder="请选择性别">
<el-option <el-option
@ -53,7 +53,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="民族" prop="mz"> <el-form-item label="民族" prop="mz">
<el-select v-model="form.mz" placeholder="请选择民族"> <el-select v-model="form.mz" placeholder="请选择民族">
<el-option <el-option
@ -65,12 +65,12 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="证件号码" prop="zjhm"> <el-form-item label="证件号码" prop="zjhm">
<el-input v-model="form.zjhm" placeholder="请输入证件号码" /> <el-input v-model="form.zjhm" placeholder="请输入证件号码" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="幼儿出生日期" prop="csrq"> <el-form-item label="幼儿出生日期" prop="csrq">
<el-date-picker <el-date-picker
clearable clearable
@ -127,17 +127,17 @@
<el-input v-model="form.addrArea" v-if="false" /> <el-input v-model="form.addrArea" v-if="false" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="详细地址" prop="addrDetail"> <el-form-item label="详细地址" prop="addrDetail">
<el-input v-model="form.addrDetail" placeholder="请输入详细地址" /> <el-input v-model="form.addrDetail" placeholder="请输入详细地址" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="曾就读园" prop="everSchool"> <el-form-item label="曾就读园" prop="everSchool">
<el-input v-model="form.everSchool" placeholder="请输入曾经就读幼儿园" /> <el-input v-model="form.everSchool" placeholder="请输入曾经就读幼儿园" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="学习英语" prop="learnEnglish"> <el-form-item label="学习英语" prop="learnEnglish">
<el-radio-group v-model="form.learnEnglish"> <el-radio-group v-model="form.learnEnglish">
<el-radio <el-radio
@ -148,7 +148,7 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="入园渠道" prop="source"> <el-form-item label="入园渠道" prop="source">
<el-select v-model="form.source" placeholder="请选择入园渠道"> <el-select v-model="form.source" placeholder="请选择入园渠道">
<el-option <el-option
@ -160,7 +160,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="状态"> <el-form-item label="状态">
<el-radio-group v-model="form.status"> <el-radio-group v-model="form.status">
<el-radio <el-radio
@ -171,17 +171,17 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="第一语言" prop="firstLanguage"> <el-form-item label="第一语言" prop="firstLanguage">
<el-input v-model="form.firstLanguage" placeholder="请输入第一语言" maxlength="2" /> <el-input v-model="form.firstLanguage" placeholder="请输入第一语言" maxlength="2" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="第二语言" prop="seconderLanguage"> <el-form-item label="第二语言" prop="seconderLanguage">
<el-input v-model="form.seconderLanguage" placeholder="请输入第二语言" maxlength="2" /> <el-input v-model="form.seconderLanguage" placeholder="请输入第二语言" maxlength="2" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="其他语言" prop="otherLanguage"> <el-form-item label="其他语言" prop="otherLanguage">
<el-input v-model="form.otherLanguage" placeholder="请输入其他语言" /> <el-input v-model="form.otherLanguage" placeholder="请输入其他语言" />
</el-form-item> </el-form-item>
@ -194,46 +194,46 @@
<el-tab-pane label="监护人信息"> <el-tab-pane label="监护人信息">
<el-form ref="form_jhr" :model="form_jhr" label-width="110px"> <el-form ref="form_jhr" :model="form_jhr" label-width="110px">
<el-row :gutter="15"> <el-row :gutter="15">
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="父亲姓名" prop="fathername"> <el-form-item label="父亲姓名" prop="fathername">
<el-input v-model="form_jhr.fathername" placeholder="请输入父亲姓名" @input="onInput()" /> <el-input v-model="form_jhr.fathername" placeholder="请输入父亲姓名" @input="onInput()" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="联系电话" prop="fphone"> <el-form-item label="联系电话" prop="fphone">
<el-input v-model="form_jhr.fphone" placeholder="请输入父亲联系电话" @input="onInput()"/> <el-input v-model="form_jhr.fphone" placeholder="请输入父亲联系电话" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="办公电话" prop="foffphone"> <el-form-item label="办公电话" prop="foffphone">
<el-input v-model="form_jhr.foffphone" placeholder="请输入父亲办公电话" @input="onInput()"/> <el-input v-model="form_jhr.foffphone" placeholder="请输入父亲办公电话" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="15"> <el-row :gutter="15">
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="母亲姓名" prop="mothername"> <el-form-item label="母亲姓名" prop="mothername">
<el-input v-model="form_jhr.mothername" placeholder="请输入父亲姓名" @input="onInput()" /> <el-input v-model="form_jhr.mothername" placeholder="请输入父亲姓名" @input="onInput()" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="联系电话" prop="mphone"> <el-form-item label="联系电话" prop="mphone">
<el-input v-model="form_jhr.mphone" placeholder="请输入母亲姓名" @input="onInput()" /> <el-input v-model="form_jhr.mphone" placeholder="请输入母亲姓名" @input="onInput()" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="办公电话" prop="moffphone"> <el-form-item label="办公电话" prop="moffphone">
<el-input v-model="form_jhr.moffphone" placeholder="请输入母亲办公电话" @input="onInput()"/> <el-input v-model="form_jhr.moffphone" placeholder="请输入母亲办公电话" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="15"> <el-row :gutter="15">
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="其他联系人姓名" prop="grandfathername"> <el-form-item label="其他联系人姓名" prop="grandfathername">
<el-input v-model="form_jhr.grandfathername" placeholder="请输入其他联系人姓名" @input="onInput()"/> <el-input v-model="form_jhr.grandfathername" placeholder="请输入其他联系人姓名" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="与幼儿关系" prop="gfgx"> <el-form-item label="与幼儿关系" prop="gfgx">
<el-select v-model="form_jhr.gfgx" placeholder="请选择与幼儿关系" @input="onInput()" > <el-select v-model="form_jhr.gfgx" placeholder="请选择与幼儿关系" @input="onInput()" >
<el-option <el-option
@ -245,12 +245,12 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="联系电话" prop="gfphone"> <el-form-item label="联系电话" prop="gfphone">
<el-input v-model="form_jhr.gfphone" placeholder="请输入联系电话" @input="onInput()"/> <el-input v-model="form_jhr.gfphone" placeholder="请输入联系电话" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="办公电话" prop="gfoffphone"> <el-form-item label="办公电话" prop="gfoffphone">
<el-input v-model="form_jhr.gfoffphone" placeholder="请输入办公电话" @input="onInput()" /> <el-input v-model="form_jhr.gfoffphone" placeholder="请输入办公电话" @input="onInput()" />
</el-form-item> </el-form-item>
@ -262,12 +262,12 @@
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="15"> <el-row :gutter="15">
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="其他联系人姓名" prop="grandmothername"> <el-form-item label="其他联系人姓名" prop="grandmothername">
<el-input v-model="form_jhr.grandmothername" placeholder="请输入其他联系人姓名" @input="onInput()"/> <el-input v-model="form_jhr.grandmothername" placeholder="请输入其他联系人姓名" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="与幼儿关系" prop="gmgx"> <el-form-item label="与幼儿关系" prop="gmgx">
<el-select v-model="form_jhr.gmgx" placeholder="请选择与幼儿关系" @input="onInput()"> <el-select v-model="form_jhr.gmgx" placeholder="请选择与幼儿关系" @input="onInput()">
<el-option <el-option
@ -279,12 +279,12 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="联系电话" prop="gmphone"> <el-form-item label="联系电话" prop="gmphone">
<el-input v-model="form_jhr.gmphone" placeholder="请输入联系电话" @input="onInput()"/> <el-input v-model="form_jhr.gmphone" placeholder="请输入联系电话" @input="onInput()"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :xs="24" :sm="12">
<el-form-item label="办公电话" prop="gmoffphone"> <el-form-item label="办公电话" prop="gmoffphone">
<el-input v-model="form_jhr.gmoffphone" placeholder="请输入办公电话" @input="onInput()"/> <el-input v-model="form_jhr.gmoffphone" placeholder="请输入办公电话" @input="onInput()"/>
</el-form-item> </el-form-item>
@ -298,7 +298,6 @@
</el-form> </el-form>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button> <el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancelSub"> </el-button> <el-button @click="cancelSub"> </el-button>
@ -566,7 +565,14 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.result-container { .result-container {
padding: 60px 15px 0; padding: 30px 15px 0;
.search-title {
font-size: 22px;
text-align: center;
border-bottom: 1px solid #f1f1f1;
padding-bottom: 15px;
margin: 0 auto 20px;
}
.main { .main {
padding-top: 10px; padding-top: 10px;
border-top: 1px solid #eee; border-top: 1px solid #eee;
@ -574,6 +580,13 @@ export default {
text-align: center; text-align: center;
font-size: 18px; font-size: 18px;
} }
.dialog-footer {
margin: 10px auto 40px;
text-align: center;
}
.el-select {
width: 100%;
}
.result-form { .result-form {
.form-title { .form-title {
display: flex; display: flex;
@ -592,7 +605,7 @@ export default {
} }
} }
.form { .form {
width: 500px; // width: 500px;
margin: 30px auto 0; margin: 30px auto 0;
} }
} }
@ -620,12 +633,23 @@ export default {
} }
@media screen and (max-width: 768.89px) { @media screen and (max-width: 768.89px) {
.result-container { .result-container {
.search-form {
div {
margin-bottom: 5px;
}
}
.main { .main {
.result-form { .result-form {
.form { .form {
width: 100%; width: 100%;
} }
} }
::v-deep .distpicker-address-wrapper {
select {
width: 100%;
margin-bottom: 5px;
}
}
} }
} }
} }