优化页面-手机端响应式
This commit is contained in:
parent
8a3385cbea
commit
e858bba93e
@ -1,17 +1,42 @@
|
||||
<template>
|
||||
<div class="result-container">
|
||||
<h2 class="title search-title">幼儿信息查询</h2>
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px" class="search-form">
|
||||
<el-form
|
||||
:model="queryParams"
|
||||
ref="queryForm"
|
||||
label-width="70px"
|
||||
class="search-form"
|
||||
>
|
||||
<el-row :gutter="10">
|
||||
<el-col :xs="24" :ms="12" :md="5">
|
||||
<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-col>
|
||||
<el-col :xs="24" :ms="12" :md="5">
|
||||
<el-form-item label="联系方式" prop="phone">
|
||||
<el-input v-model="queryParams.phone" placeholder="请输入联系方式" clearable size="small" />
|
||||
<el-input
|
||||
v-model="queryParams.phone"
|
||||
placeholder="请输入联系方式"
|
||||
clearable
|
||||
size="small"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :ms="12" :md="4">
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="mini" @click="handleQuery">查询</el-button>
|
||||
<el-button type="primary" size="mini" @click="handleQuery"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button size="mini" @click="cancel">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div class="main" v-show="hide">
|
||||
<h2 class="title">幼儿信息维护</h2>
|
||||
@ -20,25 +45,44 @@
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="幼儿基础信息">
|
||||
<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 :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="英文名" prop="enName">
|
||||
<el-input v-model="form.enName" placeholder="请输入联系方式" />
|
||||
<el-input
|
||||
v-model="form.enName"
|
||||
placeholder="请输入联系方式"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="小名" prop="infantName">
|
||||
<el-input v-model="form.infantName" placeholder="请输入联系方式" />
|
||||
<el-input
|
||||
v-model="form.infantName"
|
||||
placeholder="请输入联系方式"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
@ -67,7 +111,10 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="证件号码" prop="zjhm">
|
||||
<el-input v-model="form.zjhm" placeholder="请输入证件号码" />
|
||||
<el-input
|
||||
v-model="form.zjhm"
|
||||
placeholder="请输入证件号码"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
@ -129,12 +176,18 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="详细地址" prop="addrDetail">
|
||||
<el-input v-model="form.addrDetail" placeholder="请输入详细地址" />
|
||||
<el-input
|
||||
v-model="form.addrDetail"
|
||||
placeholder="请输入详细地址"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="曾就读园" prop="everSchool">
|
||||
<el-input v-model="form.everSchool" placeholder="请输入曾经就读幼儿园" />
|
||||
<el-input
|
||||
v-model="form.everSchool"
|
||||
placeholder="请输入曾经就读幼儿园"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
@ -144,13 +197,17 @@
|
||||
v-for="dict in ynOptions"
|
||||
:key="dict.dictValue"
|
||||
:label="dict.dictValue"
|
||||
>{{dict.dictLabel}}</el-radio>
|
||||
>{{ dict.dictLabel }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="入园渠道" prop="source">
|
||||
<el-select v-model="form.source" placeholder="请选择入园渠道">
|
||||
<el-select
|
||||
v-model="form.source"
|
||||
placeholder="请选择入园渠道"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in sourceOptions"
|
||||
:key="dict.dictValue"
|
||||
@ -167,23 +224,35 @@
|
||||
v-for="dict in statusOptions"
|
||||
:key="dict.dictValue"
|
||||
:label="dict.dictValue"
|
||||
>{{dict.dictLabel}}</el-radio>
|
||||
>{{ dict.dictLabel }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<el-form-item label="其他语言" prop="otherLanguage">
|
||||
<el-input v-model="form.otherLanguage" placeholder="请输入其他语言" />
|
||||
<el-input
|
||||
v-model="form.otherLanguage"
|
||||
placeholder="请输入其他语言"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
@ -196,46 +265,78 @@
|
||||
<el-row :gutter="15">
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
</el-row>
|
||||
<el-row :gutter="15">
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
</el-row>
|
||||
<el-row :gutter="15">
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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
|
||||
v-for="dict in jtgxOptions"
|
||||
:key="dict.dictValue"
|
||||
@ -247,29 +348,49 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="住址" prop="gfaddress">
|
||||
<el-input v-model="form_jhr.gfaddress" placeholder="请输入住址" @input="onInput()"/>
|
||||
<el-input
|
||||
v-model="form_jhr.gfaddress"
|
||||
placeholder="请输入住址"
|
||||
@input="onInput()"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="15">
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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
|
||||
v-for="dict in jtgxOptions"
|
||||
:key="dict.dictValue"
|
||||
@ -281,17 +402,29 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :xs="24" :sm="12">
|
||||
<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-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="住址" prop="gmaddress">
|
||||
<el-input v-model="form_jhr.gmaddress" placeholder="请输入住址" @input="onInput()"/>
|
||||
<el-input
|
||||
v-model="form_jhr.gmaddress"
|
||||
placeholder="请输入住址"
|
||||
@input="onInput()"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -327,22 +460,22 @@ export default {
|
||||
placeholders: {
|
||||
province: "请选择省",
|
||||
city: "请选择市",
|
||||
area: "请选择区"
|
||||
area: "请选择区",
|
||||
},
|
||||
diglogForm: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null
|
||||
area: null,
|
||||
},
|
||||
diglogForm1: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null
|
||||
area: null,
|
||||
},
|
||||
diglogForm2: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null
|
||||
area: null,
|
||||
},
|
||||
hide: false,
|
||||
ishf: true,
|
||||
@ -373,7 +506,7 @@ export default {
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
name: undefined,
|
||||
phone: undefined
|
||||
phone: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
@ -381,12 +514,10 @@ export default {
|
||||
form_jhr: {},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
created() {},
|
||||
components: {
|
||||
//省市区三级联动全局组件
|
||||
VDistpicker
|
||||
VDistpicker,
|
||||
},
|
||||
methods: {
|
||||
// 强制输入刷新
|
||||
@ -399,7 +530,7 @@ export default {
|
||||
// return this.selectDictLabel(this.classOptions, row.classid);
|
||||
var actions = [];
|
||||
var datas = this.classOptions;
|
||||
Object.keys(datas).map(key => {
|
||||
Object.keys(datas).map((key) => {
|
||||
if (datas[key].bjbh == "" + row.classid) {
|
||||
actions.push(datas[key].bjmc);
|
||||
return false;
|
||||
@ -409,7 +540,7 @@ export default {
|
||||
},
|
||||
/** 查询幼儿信息 */
|
||||
getInfo() {
|
||||
getChild_query(this.queryParams).then(response => {
|
||||
getChild_query(this.queryParams).then((response) => {
|
||||
if (response.code == "200") {
|
||||
this.hide = true;
|
||||
this.childList = response.rows;
|
||||
@ -420,23 +551,35 @@ export default {
|
||||
this.ynOptions = response.ynAll;
|
||||
this.sourceOptions = response.sourceAll;
|
||||
this.jtgxOptions = response.jtgxAll;
|
||||
this.form_jhr.fathername = response.data.byChildContactpeople.fathername;
|
||||
this.form_jhr.mothername = response.data.byChildContactpeople.mothername;
|
||||
this.form_jhr.fathername =
|
||||
response.data.byChildContactpeople.fathername;
|
||||
this.form_jhr.mothername =
|
||||
response.data.byChildContactpeople.mothername;
|
||||
this.form_jhr.fphone = response.data.byChildContactpeople.fphone;
|
||||
this.form_jhr.foffphone = response.data.byChildContactpeople.foffphone;
|
||||
this.form_jhr.foffphone =
|
||||
response.data.byChildContactpeople.foffphone;
|
||||
this.form_jhr.mphone = response.data.byChildContactpeople.mphone;
|
||||
this.form_jhr.moffphone = response.data.byChildContactpeople.moffphone;
|
||||
this.form_jhr.grandfathername = response.data.byChildContactpeople.grandfathername;
|
||||
this.form_jhr.moffphone =
|
||||
response.data.byChildContactpeople.moffphone;
|
||||
this.form_jhr.grandfathername =
|
||||
response.data.byChildContactpeople.grandfathername;
|
||||
this.form_jhr.gfgx = response.data.byChildContactpeople.gfgx;
|
||||
this.form_jhr.gfphone = response.data.byChildContactpeople.gfphone;
|
||||
this.form_jhr.gfoffphone = response.data.byChildContactpeople.gfoffphone;
|
||||
this.form_jhr.gfaddress = response.data.byChildContactpeople.gfaddress;
|
||||
this.form_jhr.grandmothername = response.data.byChildContactpeople.grandmothername;
|
||||
this.form_jhr.gfoffphone =
|
||||
response.data.byChildContactpeople.gfoffphone;
|
||||
this.form_jhr.gfaddress =
|
||||
response.data.byChildContactpeople.gfaddress;
|
||||
this.form_jhr.grandmothername =
|
||||
response.data.byChildContactpeople.grandmothername;
|
||||
this.form_jhr.gmgx = response.data.byChildContactpeople.gmgx;
|
||||
this.form_jhr.gmoffphone = response.data.byChildContactpeople.gmoffphone;
|
||||
this.form_jhr.gmaddress = response.data.byChildContactpeople.gmaddress;
|
||||
this.form_jhr.gmoffphone = response.data.byChildContactpeople.gmoffphone;
|
||||
this.form_jhr.createTime = response.data.byChildContactpeople.createTime;
|
||||
this.form_jhr.gmoffphone =
|
||||
response.data.byChildContactpeople.gmoffphone;
|
||||
this.form_jhr.gmaddress =
|
||||
response.data.byChildContactpeople.gmaddress;
|
||||
this.form_jhr.gmoffphone =
|
||||
response.data.byChildContactpeople.gmoffphone;
|
||||
this.form_jhr.createTime =
|
||||
response.data.byChildContactpeople.createTime;
|
||||
|
||||
this.diglogForm.province = response.data.birthProvincename;
|
||||
this.diglogForm.city = response.data.birthCityname;
|
||||
@ -455,13 +598,13 @@ export default {
|
||||
|
||||
/** 提交按钮 */
|
||||
submitForm: function () {
|
||||
this.$refs["form"].validate(valid => {
|
||||
this.$refs["form"].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.form.id != undefined) {
|
||||
updateChild_jz(this.form).then(response => {
|
||||
updateChild_jz(this.form).then((response) => {
|
||||
if (response.code === 200) {
|
||||
this.form_jhr.childid = this.form.id;
|
||||
updateContactpeople_jz(this.form_jhr).then(response => {
|
||||
updateContactpeople_jz(this.form_jhr).then((response) => {
|
||||
if (response.code === 200) {
|
||||
this.msgSuccess("修改成功");
|
||||
// this.hide = false;
|
||||
@ -552,11 +695,10 @@ export default {
|
||||
cancel() {
|
||||
this.queryParams = {
|
||||
name: undefined,
|
||||
phone: undefined
|
||||
phone: undefined,
|
||||
};
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
Loading…
x
Reference in New Issue
Block a user