1254 lines
40 KiB
Vue
1254 lines
40 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-form :model="queryParams" ref="queryForm" label-width="70px">
|
||
<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"
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :xs="24" :ms="12" :md="5">
|
||
<el-form-item label="幼儿性别" prop="xb">
|
||
<el-select
|
||
v-model="queryParams.xb"
|
||
placeholder="请选择幼儿性别"
|
||
clearable
|
||
size="small"
|
||
>
|
||
<el-option
|
||
v-for="dict in sexOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :xs="24" :ms="12" :md="5">
|
||
<el-form-item label="当前状态" prop="status">
|
||
<el-select
|
||
v-model="queryParams.status"
|
||
placeholder="请选择当前状态"
|
||
clearable
|
||
size="small"
|
||
>
|
||
<el-option
|
||
v-for="dict in statusOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
/>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :xs="24" :ms="12" :md="4">
|
||
<el-form-item class="no-margin">
|
||
<el-button
|
||
type="primary"
|
||
icon="el-icon-search"
|
||
size="mini"
|
||
@click="handleQuery"
|
||
>搜索</el-button
|
||
>
|
||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
|
||
>重置</el-button
|
||
>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
|
||
<div class="mb8 btn-list">
|
||
<el-button
|
||
type="primary"
|
||
icon="el-icon-plus"
|
||
size="mini"
|
||
@click="handleAdd"
|
||
v-hasPermi="['benyi:child:add']"
|
||
>新增</el-button
|
||
>
|
||
<el-button
|
||
type="success"
|
||
icon="el-icon-edit"
|
||
size="mini"
|
||
:disabled="single"
|
||
@click="handleUpdate"
|
||
v-hasPermi="['benyi:child:edit']"
|
||
>修改</el-button
|
||
>
|
||
<el-button
|
||
type="danger"
|
||
icon="el-icon-delete"
|
||
size="mini"
|
||
:disabled="multiple"
|
||
@click="handleDelete"
|
||
v-hasPermi="['benyi:child:remove']"
|
||
>删除</el-button
|
||
>
|
||
<el-button
|
||
type="warning"
|
||
icon="el-icon-download"
|
||
size="mini"
|
||
:disabled="multiple"
|
||
@click="handleTiaoban"
|
||
v-hasPermi="['benyi:child:edit']"
|
||
>调班</el-button
|
||
>
|
||
<el-button
|
||
type="info"
|
||
icon="el-icon-upload2"
|
||
size="mini"
|
||
@click="handleImport"
|
||
v-hasPermi="['benyi:child:import']"
|
||
>导入</el-button
|
||
>
|
||
<el-tooltip
|
||
effect="dark"
|
||
content="点我，可以复制链接发送给所有家长补填幼儿信息呦"
|
||
placement="top-start"
|
||
>
|
||
<el-button
|
||
type="primary"
|
||
icon="el-icon-document-copy"
|
||
size="mini"
|
||
@click="copy($event, inviteCode)"
|
||
v-hasPermi="['benyi:child:add']"
|
||
>家长填报链接</el-button
|
||
>
|
||
</el-tooltip>
|
||
</div>
|
||
|
||
<el-table
|
||
v-loading="loading"
|
||
border
|
||
:data="childList"
|
||
@selection-change="handleSelectionChange"
|
||
>
|
||
<el-table-column type="selection" width="55" align="center" />
|
||
<!-- <el-table-column label="编号" align="center" prop="id" /> -->
|
||
<!-- <el-table-column label="幼儿园名称" align="center" prop="schoolid" /> -->
|
||
<el-table-column fixed label="姓名" align="center" prop="name" />
|
||
<el-table-column
|
||
label="班级名称"
|
||
align="center"
|
||
prop="classid"
|
||
:formatter="classFormat"
|
||
/>
|
||
<el-table-column
|
||
label="家长手机号码"
|
||
width="120"
|
||
align="center"
|
||
prop="phone"
|
||
/>
|
||
<el-table-column
|
||
label="性别"
|
||
align="center"
|
||
prop="xb"
|
||
:formatter="xbFormat"
|
||
/>
|
||
<el-table-column
|
||
label="民族"
|
||
align="center"
|
||
prop="mz"
|
||
:formatter="mzFormat"
|
||
/>
|
||
<el-table-column
|
||
label="详细地址"
|
||
show-overflow-tooltip
|
||
align="center"
|
||
prop="addrDetail"
|
||
/>
|
||
<el-table-column
|
||
label="曾经就读幼儿园"
|
||
align="center"
|
||
prop="everSchool"
|
||
/>
|
||
<el-table-column
|
||
label="是否学习英语"
|
||
align="center"
|
||
prop="learnEnglish"
|
||
:formatter="ynFormat"
|
||
/>
|
||
<el-table-column
|
||
label="入园渠道"
|
||
align="center"
|
||
prop="source"
|
||
:formatter="sourceFormat"
|
||
/>
|
||
<el-table-column
|
||
label="状态"
|
||
align="center"
|
||
prop="status"
|
||
:formatter="statusFormat"
|
||
/>
|
||
<el-table-column
|
||
fixed="right"
|
||
label="操作"
|
||
align="center"
|
||
width="60"
|
||
class-name="small-padding fixed-width edit-btns"
|
||
>
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-edit"
|
||
@click="handleUpdate(scope.row)"
|
||
v-hasPermi="['benyi:child:edit']"
|
||
>修改</el-button
|
||
>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-delete"
|
||
@click="handleDelete(scope.row)"
|
||
v-hasPermi="['benyi:child:remove']"
|
||
>删除</el-button
|
||
>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<pagination
|
||
v-show="total > 0"
|
||
:total="total"
|
||
:page.sync="queryParams.pageNum"
|
||
:limit.sync="queryParams.pageSize"
|
||
@pagination="getList"
|
||
/>
|
||
|
||
<!-- 添加或修改幼儿信息对话框 -->
|
||
<el-dialog
|
||
:title="title"
|
||
:visible.sync="open"
|
||
class="big-dialog"
|
||
append-to-body
|
||
>
|
||
<el-tabs type="border-card">
|
||
<el-tab-pane label="幼儿基础信息">
|
||
<el-row :gutter="15">
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||
<el-col :span="12">
|
||
<el-form-item label="姓名" prop="name">
|
||
<el-input v-model="form.name" placeholder="请输入姓名" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="英文名" prop="enName">
|
||
<el-input v-model="form.enName" placeholder="请输入英文名" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="小名" prop="infantName">
|
||
<el-input
|
||
v-model="form.infantName"
|
||
placeholder="请输入小名"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="手机号码" prop="phone">
|
||
<el-input
|
||
v-model="form.phone"
|
||
placeholder="请输入家长手机号码"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="性别" prop="xb">
|
||
<el-select v-model="form.xb" placeholder="请选择性别">
|
||
<el-option
|
||
v-for="dict in sexOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="民族" prop="mz">
|
||
<el-select v-model="form.mz" placeholder="请选择民族">
|
||
<el-option
|
||
v-for="dict in mzOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="证件号码" prop="zjhm">
|
||
<el-input v-model="form.zjhm" placeholder="请输入证件号码" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="出生日期" prop="csrq">
|
||
<el-date-picker
|
||
clearable
|
||
size="small"
|
||
style="width: 200px"
|
||
v-model="form.csrq"
|
||
type="date"
|
||
value-format="yyyy-MM-dd"
|
||
placeholder="选择出生日期"
|
||
></el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="出生地" prop="birthProvincename">
|
||
<v-distpicker
|
||
v-model="form.birthProvincename"
|
||
:placeholders="placeholders"
|
||
:province="diglogForm.province"
|
||
:city="diglogForm.city"
|
||
:area="diglogForm.area"
|
||
@selected="onSelected_brith"
|
||
></v-distpicker>
|
||
<el-input v-model="form.birthProvince" v-if="false" />
|
||
<el-input v-model="form.birthCity" v-if="false" />
|
||
<el-input v-model="form.birthArea" v-if="false" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="户口地" prop="registeredProvincename">
|
||
<v-distpicker
|
||
v-model="form.registeredProvincename"
|
||
:placeholders="placeholders"
|
||
:province="diglogForm1.province"
|
||
:city="diglogForm1.city"
|
||
:area="diglogForm1.area"
|
||
@selected="onSelected_registered"
|
||
></v-distpicker>
|
||
<el-input v-model="form.registeredProvince" v-if="false" />
|
||
<el-input v-model="form.registeredCity" v-if="false" />
|
||
<el-input v-model="form.registeredArea" v-if="false" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="现住址" prop="addrProvincename">
|
||
<v-distpicker
|
||
v-model="form.addrProvincename"
|
||
:placeholders="placeholders"
|
||
:province="diglogForm2.province"
|
||
:city="diglogForm2.city"
|
||
:area="diglogForm2.area"
|
||
@selected="onSelected_addr"
|
||
></v-distpicker>
|
||
<el-input v-model="form.addrProvince" v-if="false" />
|
||
<el-input v-model="form.addrCity" v-if="false" />
|
||
<el-input v-model="form.addrArea" v-if="false" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="详细地址" prop="addrDetail">
|
||
<el-input
|
||
v-model="form.addrDetail"
|
||
placeholder="请输入详细地址"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="曾就读园" prop="everSchool">
|
||
<el-input
|
||
v-model="form.everSchool"
|
||
placeholder="请输入曾经就读幼儿园"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="学习英语" prop="learnEnglish">
|
||
<el-radio-group v-model="form.learnEnglish">
|
||
<el-radio
|
||
v-for="dict in ynOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictValue"
|
||
>{{ dict.dictLabel }}</el-radio
|
||
>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="入园渠道" prop="source">
|
||
<el-select v-model="form.source" placeholder="请选择入园渠道">
|
||
<el-option
|
||
v-for="dict in sourceOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="状态">
|
||
<el-radio-group v-model="form.status">
|
||
<el-radio
|
||
v-for="dict in statusOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictValue"
|
||
>{{ dict.dictLabel }}</el-radio
|
||
>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="第一语言" prop="firstLanguage">
|
||
<el-input
|
||
v-model="form.firstLanguage"
|
||
placeholder="请输入第一语言"
|
||
maxlength="2"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="第二语言" prop="seconderLanguage">
|
||
<el-input
|
||
v-model="form.seconderLanguage"
|
||
placeholder="请输入第二语言"
|
||
maxlength="2"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="其他语言" prop="otherLanguage">
|
||
<el-input
|
||
v-model="form.otherLanguage"
|
||
placeholder="请输入其他语言"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="选择班级" prop="classid">
|
||
<el-select v-model="form.classid" placeholder="请选择班级">
|
||
<el-option
|
||
v-for="dict in classOptions"
|
||
:key="dict.bjbh"
|
||
:label="dict.bjmc"
|
||
:value="dict.bjbh"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form>
|
||
</el-row>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="监护人信息">
|
||
<el-form
|
||
ref="form_jhr"
|
||
:model="form_jhr"
|
||
:rules="rules_jhr"
|
||
label-width="120px"
|
||
>
|
||
<el-row :gutter="15">
|
||
<el-col :span="12">
|
||
<el-form-item label="父亲姓名" prop="fathername">
|
||
<el-input
|
||
v-model="form_jhr.fathername"
|
||
placeholder="请输入父亲姓名"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="联系电话" prop="fphone">
|
||
<el-input
|
||
v-model="form_jhr.fphone"
|
||
placeholder="请输入父亲联系电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="办公电话" prop="foffphone">
|
||
<el-input
|
||
v-model="form_jhr.foffphone"
|
||
placeholder="请输入父亲办公电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="15">
|
||
<el-col :span="12">
|
||
<el-form-item label="母亲姓名" prop="mothername">
|
||
<el-input
|
||
v-model="form_jhr.mothername"
|
||
placeholder="请输入母亲姓名"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="联系电话" prop="mphone">
|
||
<el-input
|
||
v-model="form_jhr.mphone"
|
||
placeholder="请输入母亲联系电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="办公电话" prop="moffphone">
|
||
<el-input
|
||
v-model="form_jhr.moffphone"
|
||
placeholder="请输入母亲办公电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="15">
|
||
<el-col :span="12">
|
||
<el-form-item label="其他联系人姓名" prop="grandfathername">
|
||
<el-input
|
||
v-model="form_jhr.grandfathername"
|
||
placeholder="请输入其他联系人姓名"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="与幼儿关系" prop="gfgx">
|
||
<el-select
|
||
v-model="form_jhr.gfgx"
|
||
placeholder="请选择与幼儿关系"
|
||
>
|
||
<el-option
|
||
v-for="dict in jtgxOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="联系电话" prop="gfphone">
|
||
<el-input
|
||
v-model="form_jhr.gfphone"
|
||
placeholder="请输入联系电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="办公电话" prop="gfoffphone">
|
||
<el-input
|
||
v-model="form_jhr.gfoffphone"
|
||
placeholder="请输入办公电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="住址" prop="gfaddress">
|
||
<el-input
|
||
v-model="form_jhr.gfaddress"
|
||
placeholder="请输入住址"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="15">
|
||
<el-col :span="12">
|
||
<el-form-item label="其他联系人姓名" prop="grandmothername">
|
||
<el-input
|
||
v-model="form_jhr.grandmothername"
|
||
placeholder="请输入其他联系人姓名"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="与幼儿关系" prop="gmgx">
|
||
<el-select
|
||
v-model="form_jhr.gmgx"
|
||
placeholder="请选择与幼儿关系"
|
||
>
|
||
<el-option
|
||
v-for="dict in jtgxOptions"
|
||
:key="dict.dictValue"
|
||
:label="dict.dictLabel"
|
||
:value="dict.dictValue"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="联系电话" prop="gmphone">
|
||
<el-input
|
||
v-model="form_jhr.gmphone"
|
||
placeholder="请输入联系电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="办公电话" prop="gmoffphone">
|
||
<el-input
|
||
v-model="form_jhr.gmoffphone"
|
||
placeholder="请输入办公电话"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="24">
|
||
<el-form-item label="住址" prop="gmaddress">
|
||
<el-input
|
||
v-model="form_jhr.gmaddress"
|
||
placeholder="请输入住址"
|
||
/>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 幼儿调班信息对话框 -->
|
||
<el-dialog
|
||
title="幼儿调班"
|
||
:visible.sync="open_tb"
|
||
width="400px"
|
||
append-to-body
|
||
>
|
||
<el-form ref="form" :model="form" :rules="rules_tb" label-width="80px">
|
||
<el-form-item label="选择班级" prop="classid">
|
||
<el-select v-model="form.classid" placeholder="请选择班级">
|
||
<el-option
|
||
v-for="dict in classOptions"
|
||
:key="dict.bjbh"
|
||
:label="dict.bjmc"
|
||
:value="dict.bjbh"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitForm_tb">确 定</el-button>
|
||
<el-button @click="cancel_tb">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
<!-- 用户导入对话框 -->
|
||
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px">
|
||
<el-upload
|
||
ref="upload"
|
||
:limit="1"
|
||
accept=".xlsx, .xls"
|
||
:headers="upload.headers"
|
||
:action="upload.url"
|
||
:disabled="upload.isUploading"
|
||
:on-progress="handleFileUploadProgress"
|
||
:on-success="handleFileSuccess"
|
||
:auto-upload="false"
|
||
drag
|
||
>
|
||
<i class="el-icon-upload"></i>
|
||
<div class="el-upload__text">
|
||
将文件拖到此处，或
|
||
<em>点击上传</em>
|
||
</div>
|
||
<div class="el-upload__tip" slot="tip">
|
||
<el-link type="info" style="font-size: 12px" @click="importTemplate"
|
||
>下载模板</el-link
|
||
>
|
||
</div>
|
||
<div class="el-upload__tip" style="color: red" slot="tip">
|
||
提示：仅允许导入“xls”或“xlsx”格式文件！
|
||
</div>
|
||
</el-upload>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||
<el-button @click="upload.open = false">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
listChild,
|
||
getChild,
|
||
delChild,
|
||
addChild,
|
||
updateChild,
|
||
updateChild_tb,
|
||
importTemplate,
|
||
} from "@/api/benyi/child";
|
||
import {
|
||
listContactpeople,
|
||
getContactpeople,
|
||
getContactpeopleByChildId,
|
||
delContactpeople,
|
||
addContactpeople,
|
||
updateContactpeople,
|
||
} from "@/api/benyi/contactpeople";
|
||
|
||
import { listClass } from "@/api/system/class";
|
||
import { getToken } from "@/utils/auth";
|
||
|
||
//导入省市区三级联动库
|
||
import VDistpicker from "v-distpicker";
|
||
// 获取当前ip
|
||
import { getUserProfile } from "@/api/system/user";
|
||
// 点击复制
|
||
import Clipboard from "clipboard";
|
||
|
||
export default {
|
||
name: "Child",
|
||
data() {
|
||
return {
|
||
placeholders: {
|
||
province: "请选择省",
|
||
city: "请选择市",
|
||
area: "请选择区",
|
||
},
|
||
diglogForm: {
|
||
province: null,
|
||
city: null,
|
||
area: null,
|
||
},
|
||
diglogForm1: {
|
||
province: null,
|
||
city: null,
|
||
area: null,
|
||
},
|
||
diglogForm2: {
|
||
province: null,
|
||
city: null,
|
||
area: null,
|
||
},
|
||
// 连接内容
|
||
inviteCode: "",
|
||
// 遮罩层
|
||
loading: true,
|
||
// 选中数组
|
||
ids: [],
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
// 总条数
|
||
total: 0,
|
||
// 幼儿信息表格数据
|
||
childList: [],
|
||
// 弹出层标题
|
||
title: "",
|
||
// 是否显示弹出层
|
||
open: false,
|
||
open_tb: false,
|
||
// 状态数据字典
|
||
statusOptions: [],
|
||
// 性别状态字典
|
||
sexOptions: [],
|
||
// 民族字典
|
||
mzOptions: [],
|
||
//是否字典
|
||
ynOptions: [],
|
||
//入园渠道
|
||
sourceOptions: [],
|
||
//班级
|
||
classOptions: [],
|
||
//家庭关系
|
||
jtgxOptions: [],
|
||
//是否可编辑
|
||
isable: false,
|
||
// 幼儿导入参数
|
||
upload: {
|
||
// 是否显示弹出层（用户导入）
|
||
open: false,
|
||
// 弹出层标题（用户导入）
|
||
title: "",
|
||
// 是否禁用上传
|
||
isUploading: false,
|
||
// 设置上传的请求头部
|
||
headers: { Authorization: "Bearer " + getToken() },
|
||
// 上传的地址
|
||
url: process.env.VUE_APP_BASE_API + "/benyi/child/importData",
|
||
},
|
||
// 查询参数
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
schoolid: undefined,
|
||
classid: undefined,
|
||
name: undefined,
|
||
enName: undefined,
|
||
infantName: undefined,
|
||
phone: undefined,
|
||
xb: undefined,
|
||
mz: undefined,
|
||
zjhm: undefined,
|
||
csrq: undefined,
|
||
birthProvince: undefined,
|
||
birthProvincename: undefined,
|
||
birthCity: undefined,
|
||
birthCityname: undefined,
|
||
birthArea: undefined,
|
||
birthAreaname: undefined,
|
||
registeredProvince: undefined,
|
||
registeredProvincename: undefined,
|
||
registeredCity: undefined,
|
||
registeredCityname: undefined,
|
||
registeredArea: undefined,
|
||
registeredAreaname: undefined,
|
||
addrProvince: undefined,
|
||
addrProvincename: undefined,
|
||
addrCity: undefined,
|
||
addrCityname: undefined,
|
||
addrArea: undefined,
|
||
addrAreaname: undefined,
|
||
addrDetail: undefined,
|
||
everSchool: undefined,
|
||
learnEnglish: undefined,
|
||
source: undefined,
|
||
status: undefined,
|
||
enterDate: undefined,
|
||
outDate: undefined,
|
||
firstLanguage: undefined,
|
||
seconderLanguage: undefined,
|
||
otherLanguage: undefined,
|
||
createuserid: undefined,
|
||
},
|
||
// 表单参数
|
||
form: {},
|
||
// 表单参数
|
||
form_jhr: {},
|
||
//监护人验证
|
||
rules_jhr: {},
|
||
// 表单校验
|
||
rules: {
|
||
name: [
|
||
{ required: true, message: "幼儿姓名不能为空", trigger: "blur" },
|
||
],
|
||
phone: [
|
||
{ required: true, message: "家长手机号码不能为空", trigger: "blur" },
|
||
],
|
||
classid: [{ required: true, message: "班级不能为空", trigger: "blur" }],
|
||
},
|
||
rules_tb: {
|
||
classid: [{ required: true, message: "班级不能为空", trigger: "blur" }],
|
||
},
|
||
};
|
||
},
|
||
created() {
|
||
this.getList();
|
||
this.getClassList();
|
||
this.getDicts("sys_user_sex").then((response) => {
|
||
this.sexOptions = response.data;
|
||
});
|
||
this.getDicts("sys_normal_disable").then((response) => {
|
||
this.statusOptions = response.data;
|
||
});
|
||
this.getDicts("sys_dm_mz").then((response) => {
|
||
this.mzOptions = response.data;
|
||
});
|
||
this.getDicts("sys_yes_no").then((response) => {
|
||
this.ynOptions = response.data;
|
||
});
|
||
this.getDicts("sys_dm_ryqd").then((response) => {
|
||
this.sourceOptions = response.data;
|
||
});
|
||
this.getDicts("sys_dm_jtgx").then((response) => {
|
||
this.jtgxOptions = response.data;
|
||
});
|
||
this.getLink();
|
||
},
|
||
components: {
|
||
//省市区三级联动全局组件
|
||
VDistpicker,
|
||
},
|
||
methods: {
|
||
/** 导入按钮操作 */
|
||
handleImport() {
|
||
this.upload.title = "幼儿数据导入";
|
||
this.upload.open = true;
|
||
},
|
||
// 链接内容
|
||
getLink() {
|
||
getUserProfile().then((response) => {
|
||
var domain = window.location.host;
|
||
//console.log(domain);
|
||
//this.user = response.data;
|
||
this.inviteCode = "http://" + domain + "/benyi_child/child_preserve";
|
||
});
|
||
},
|
||
// 给家长发送链接
|
||
copy(e, text) {
|
||
const clipboard = new Clipboard(e.target, { text: () => text });
|
||
clipboard.on("success", (e) => {
|
||
this.msgSuccess("复制成功");
|
||
// 释放内存
|
||
clipboard.off("error");
|
||
clipboard.off("success");
|
||
clipboard.destroy();
|
||
});
|
||
clipboard.on("error", (e) => {
|
||
// 不支持复制
|
||
this.msgError("手机权限不支持复制功能");
|
||
// 释放内存
|
||
clipboard.off("error");
|
||
clipboard.off("success");
|
||
clipboard.destroy();
|
||
});
|
||
clipboard.onClick(e);
|
||
},
|
||
// 性别字典翻译
|
||
xbFormat(row, column) {
|
||
return this.selectDictLabel(this.sexOptions, row.xb);
|
||
},
|
||
// 字典翻译
|
||
mzFormat(row, column) {
|
||
return this.selectDictLabel(this.mzOptions, row.mz);
|
||
},
|
||
// 字典翻译
|
||
ynFormat(row, column) {
|
||
return this.selectDictLabel(this.ynOptions, row.learnEnglish);
|
||
},
|
||
// 字典翻译
|
||
sourceFormat(row, column) {
|
||
return this.selectDictLabel(this.sourceOptions, row.source);
|
||
},
|
||
// 字典翻译
|
||
statusFormat(row, column) {
|
||
return this.selectDictLabel(this.statusOptions, row.status);
|
||
},
|
||
// 字典翻译
|
||
classFormat(row, column) {
|
||
// return this.selectDictLabel(this.classOptions, row.classid);
|
||
var actions = [];
|
||
var datas = this.classOptions;
|
||
Object.keys(datas).map((key) => {
|
||
if (datas[key].bjbh == "" + row.classid) {
|
||
actions.push(datas[key].bjmc);
|
||
return false;
|
||
}
|
||
});
|
||
return actions.join("");
|
||
},
|
||
getClassList() {
|
||
listClass(null).then((response) => {
|
||
this.classOptions = response.rows;
|
||
});
|
||
},
|
||
/** 查询幼儿信息列表 */
|
||
getList() {
|
||
this.loading = true;
|
||
listChild(this.queryParams).then((response) => {
|
||
this.childList = response.rows;
|
||
this.total = response.total;
|
||
this.loading = false;
|
||
});
|
||
},
|
||
// 取消按钮
|
||
cancel() {
|
||
this.open = false;
|
||
this.reset();
|
||
},
|
||
// 取消按钮
|
||
cancel_tb() {
|
||
this.open_tb = false;
|
||
this.reset();
|
||
},
|
||
// 表单重置
|
||
reset() {
|
||
this.form = {
|
||
id: undefined,
|
||
schoolid: undefined,
|
||
classid: undefined,
|
||
name: undefined,
|
||
enName: undefined,
|
||
infantName: undefined,
|
||
phone: undefined,
|
||
xb: undefined,
|
||
mz: undefined,
|
||
zjhm: undefined,
|
||
csrq: undefined,
|
||
birthProvince: undefined,
|
||
birthProvincename: undefined,
|
||
birthCity: undefined,
|
||
birthCityname: undefined,
|
||
birthArea: undefined,
|
||
birthAreaname: undefined,
|
||
registeredProvince: undefined,
|
||
registeredProvincename: undefined,
|
||
registeredCity: undefined,
|
||
registeredCityname: undefined,
|
||
registeredArea: undefined,
|
||
registeredAreaname: undefined,
|
||
addrProvince: undefined,
|
||
addrProvincename: undefined,
|
||
addrCity: undefined,
|
||
addrCityname: undefined,
|
||
addrArea: undefined,
|
||
addrAreaname: undefined,
|
||
addrDetail: undefined,
|
||
everSchool: undefined,
|
||
learnEnglish: "Y",
|
||
source: undefined,
|
||
status: "0",
|
||
enterDate: undefined,
|
||
outDate: undefined,
|
||
firstLanguage: undefined,
|
||
seconderLanguage: undefined,
|
||
otherLanguage: undefined,
|
||
createuserid: undefined,
|
||
createTime: undefined,
|
||
};
|
||
|
||
this.diglogForm.province = "";
|
||
this.diglogForm.city = "";
|
||
this.diglogForm.area = "";
|
||
|
||
this.diglogForm1.province = "";
|
||
this.diglogForm1.city = "";
|
||
this.diglogForm1.area = "";
|
||
|
||
this.diglogForm2.province = "";
|
||
this.diglogForm2.city = "";
|
||
this.diglogForm2.area = "";
|
||
|
||
this.resetForm("form");
|
||
|
||
this.form_jhr = {
|
||
id: undefined,
|
||
childid: undefined,
|
||
fathername: undefined,
|
||
fphone: undefined,
|
||
foffphone: undefined,
|
||
mothername: undefined,
|
||
mphone: undefined,
|
||
moffphone: undefined,
|
||
grandfathername: undefined,
|
||
gfgx: undefined,
|
||
gfphone: undefined,
|
||
gfoffphone: undefined,
|
||
gfaddress: undefined,
|
||
grandmothername: undefined,
|
||
gmgx: undefined,
|
||
gmphone: undefined,
|
||
gmaddress: undefined,
|
||
gmoffphone: undefined,
|
||
createTime: undefined,
|
||
};
|
||
this.resetForm("form_jhr");
|
||
},
|
||
/** 搜索按钮操作 */
|
||
handleQuery() {
|
||
this.queryParams.pageNum = 1;
|
||
this.getList();
|
||
},
|
||
/** 重置按钮操作 */
|
||
resetQuery() {
|
||
this.resetForm("queryForm");
|
||
this.handleQuery();
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map((item) => item.id);
|
||
this.single = selection.length != 1;
|
||
this.multiple = !selection.length;
|
||
},
|
||
/** 新增按钮操作 */
|
||
handleAdd() {
|
||
this.reset();
|
||
this.open = true;
|
||
this.title = "添加幼儿信息";
|
||
},
|
||
/** 修改按钮操作 */
|
||
async handleUpdate(row) {
|
||
this.reset();
|
||
const id = row.id || this.ids;
|
||
await getChild(id).then((response) => {
|
||
this.form = response.data;
|
||
|
||
this.diglogForm.province = response.data.birthProvincename;
|
||
this.diglogForm.city = response.data.birthCityname;
|
||
this.diglogForm.area = response.data.birthAreaname;
|
||
|
||
this.diglogForm1.province = response.data.registeredProvincename;
|
||
this.diglogForm1.city = response.data.registeredCityname;
|
||
this.diglogForm1.area = response.data.registeredAreaname;
|
||
|
||
this.diglogForm2.province = response.data.addrProvincename;
|
||
this.diglogForm2.city = response.data.addrCityname;
|
||
this.diglogForm2.area = response.data.addrAreaname;
|
||
|
||
this.open = true;
|
||
this.title = "修改幼儿信息";
|
||
|
||
//根据幼儿id获取监护人信息
|
||
getContactpeopleByChildId(this.form.id).then((res) => {
|
||
// console.log("childid:" + this.form.id + ";jhr:" + res.data);
|
||
this.form_jhr = res.data;
|
||
});
|
||
});
|
||
},
|
||
/** 提交按钮 */
|
||
submitForm: function () {
|
||
this.$refs["form"].validate((valid) => {
|
||
if (valid) {
|
||
if (this.form.id != undefined) {
|
||
updateChild(this.form).then((response) => {
|
||
if (response.code === 200) {
|
||
updateContactpeople(this.form_jhr).then((res) => {
|
||
if (res.code === 200) {
|
||
this.msgSuccess("修改成功");
|
||
this.open = false;
|
||
this.getList();
|
||
}
|
||
});
|
||
}
|
||
});
|
||
} else {
|
||
addChild(this.form).then((response) => {
|
||
// console.log(response);
|
||
if (response.code === 200) {
|
||
this.form_jhr.childid = response.data;
|
||
addContactpeople(this.form_jhr).then((res) => {
|
||
this.msgSuccess("新增成功");
|
||
this.open = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 提交按钮 */
|
||
submitForm_tb: function () {
|
||
this.$refs["form"].validate((valid) => {
|
||
if (valid) {
|
||
// console.log(this.ids + "---" + this.form.classid);
|
||
updateChild_tb(this.form, this.ids).then((response) => {
|
||
if (response.code === 200) {
|
||
this.msgSuccess("调班成功");
|
||
this.open_tb = false;
|
||
this.getList();
|
||
}
|
||
});
|
||
}
|
||
});
|
||
},
|
||
/** 调班按钮操作 */
|
||
handleTiaoban(row) {
|
||
this.reset();
|
||
const ids = row.id || this.ids;
|
||
//console.log(ids);
|
||
this.open_tb = true;
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDelete(row) {
|
||
const ids = row.id || this.ids;
|
||
this.$confirm("是否确认删除幼儿信息数据项?", "警告", {
|
||
confirmButtonText: "确定",
|
||
cancelButtonText: "取消",
|
||
type: "warning",
|
||
})
|
||
.then(function () {
|
||
return delChild(ids);
|
||
})
|
||
.then(() => {
|
||
this.getList();
|
||
this.msgSuccess("删除成功");
|
||
})
|
||
.catch(function () {});
|
||
},
|
||
//所在省市区触发联动方法
|
||
onSelected_brith(data) {
|
||
// console.log("onSelected_brith=" + data);
|
||
if (
|
||
data.province.code == undefined ||
|
||
data.city.code == undefined ||
|
||
data.area.code == undefined
|
||
) {
|
||
this.form.birthProvincename = undefined;
|
||
} else {
|
||
this.form.birthProvincename = data.province.value;
|
||
this.form.birthProvince = data.province.code;
|
||
this.form.birthCityname = data.city.value;
|
||
this.form.birthCity = data.city.code;
|
||
this.form.birthAreaname = data.area.value;
|
||
this.form.birthArea = data.area.code;
|
||
}
|
||
},
|
||
//户口所在地
|
||
onSelected_registered(data) {
|
||
// console.log("onSelected_registered=" + data);
|
||
if (
|
||
data.province.code == undefined ||
|
||
data.city.code == undefined ||
|
||
data.area.code == undefined
|
||
) {
|
||
this.form.registeredProvincename = undefined;
|
||
} else {
|
||
this.form.registeredProvincename = data.province.value;
|
||
this.form.registeredProvince = data.province.code;
|
||
this.form.registeredCityname = data.city.value;
|
||
this.form.registeredCity = data.city.code;
|
||
this.form.registeredAreaname = data.area.value;
|
||
this.form.registeredArea = data.area.code;
|
||
}
|
||
},
|
||
//住址所在地
|
||
onSelected_addr(data) {
|
||
// console.log("onSelected_addr=" + data);
|
||
if (
|
||
data.province.code == undefined ||
|
||
data.city.code == undefined ||
|
||
data.area.code == undefined
|
||
) {
|
||
this.form.addrProvincename = undefined;
|
||
} else {
|
||
this.form.addrProvincename = data.province.value;
|
||
this.form.addrProvince = data.province.code;
|
||
this.form.addrCityname = data.city.value;
|
||
this.form.addrCity = data.city.code;
|
||
this.form.addrAreaname = data.area.value;
|
||
this.form.addrArea = data.area.code;
|
||
}
|
||
},
|
||
/** 下载模板操作 */
|
||
importTemplate() {
|
||
importTemplate().then((response) => {
|
||
this.download(response.msg);
|
||
});
|
||
},
|
||
// 文件上传中处理
|
||
handleFileUploadProgress(event, file, fileList) {
|
||
this.upload.isUploading = true;
|
||
},
|
||
// 文件上传成功处理
|
||
handleFileSuccess(response, file, fileList) {
|
||
this.upload.open = false;
|
||
this.upload.isUploading = false;
|
||
this.$refs.upload.clearFiles();
|
||
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
|
||
this.getList();
|
||
},
|
||
// 提交上传文件
|
||
submitFileForm() {
|
||
this.$refs.upload.submit();
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.el-select {
|
||
width: 100%;
|
||
}
|
||
.my-date-picker {
|
||
width: 100%;
|
||
}
|
||
.edit-btns {
|
||
.el-button {
|
||
display: block;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
.no-margin ::v-deep.el-form-item__content {
|
||
margin: 0 !important;
|
||
}
|
||
</style> |