<template>
|
<div class="app-container">
|
<!-- 回到顶部-->
|
<el-backtop :bottom="150" :right="30">
|
<el-button type="primary" circle
|
class="el-icon-top"
|
></el-button>
|
</el-backtop>
|
<h2 style="font-size:30px;padding-top:0px">婚姻状况登记表</h2>
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button
|
type="primary"
|
plain
|
icon="el-icon-plus"
|
size="mini"
|
@click="handleAdd"
|
v-hasPermi="['system:role:add']"
|
>新增</el-button>
|
</el-col>
|
<el-col :span="1.5">
|
<el-button
|
type="warning"
|
plain
|
icon="el-icon-download"
|
size="mini"
|
@click="handleExport"
|
v-hasPermi="['family:note:export']"
|
>导出</el-button>
|
</el-col>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
</el-row>
|
<el-divider />
|
|
<!-- 基本信息-->
|
<h2 style="font-size:21px">基本情况</h2>
|
<el-container>
|
<div style="padding-left:0px" >
|
<el-container >
|
<el-col >
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left"
|
v-loading="loading" :data="marryList" @selection-change="handleSelectionChange" >
|
<el-row :span="16">
|
<el-form-item label="姓名" prop="name" label-width="40px">
|
<el-input v-model="marryList.name " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="出生日期" prop="birthday" label-width="70px">
|
<el-input v-model="marryList.birthday" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="身份证号码" prop="id" label-width="85px">
|
<el-input v-model="marryList.id" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="婚姻状况" prop="marryStatus" label-width="70px">
|
<template v-if="!isEditing">
|
<el-input v-if="marryList.marryStatus===0" placeholder="未婚" style="" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.marryStatus===1" placeholder="初婚" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.marryStatus===2" placeholder="离婚" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.marryStatus===3" placeholder="再婚" :disabled="dsb"></el-input>
|
|
</template>
|
<template v-else>
|
<el-select v-model="marryList.marryStatus" placeholder="请选择婚姻状态" clearable :style="{width: '100%'}">
|
<el-option label="未婚" value="0"></el-option>
|
<el-option label="初婚" value="1"></el-option>
|
<el-option label="离婚" value="2"></el-option>
|
<el-option label="再婚" value="3"></el-option>
|
|
</el-select>
|
</template>
|
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="户籍地址" prop="address" label-width="70px">
|
<el-input v-model="marryList.address" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:200px">
|
<el-container>
|
<el-col v-loading="loading" :data="marryList" @selection-change="handleSelectionChange">
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left">
|
<el-row :span="16">
|
<el-form-item label="性别" prop="sex" label-width="40px">
|
<el-input v-model="marryList.sex === 1 ? '男':'女' " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="民族" prop="nation" label-width="40px">
|
<el-input v-model="marryList.nation " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="联系电话" prop="phone" label-width="70px">
|
<el-input v-model="marryList.phone" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="结婚时间" prop="marryTime" label-width="70px">
|
<el-input v-model="marryList.marryTime" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
|
|
|
<div style="padding-left:400px;padding-top:30px" >
|
<el-container >
|
|
|
<el-row >
|
<el-button
|
type="primary"
|
@click="handleEdit()"
|
v-if="isShow"
|
v-hasPermi="['system:role:edit']"
|
>编辑</el-button>
|
<el-button v-if="isShow_2" type="primary" @click="submitForm" :disabled="dsb">完成</el-button>
|
<br>
|
<el-button
|
type="primary"
|
@click="handleExport"
|
v-hasPermi="['family:note:export']"
|
>导出</el-button>
|
</el-row>
|
|
</el-container>
|
</div>
|
<!-- </el-dialog> self:user:export-->
|
</el-container>
|
<h2 style="font-size:16px " >配偶情况</h2>
|
<el-container>
|
<div style="padding-top:15px" >
|
<el-container >
|
<el-col >
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left"
|
v-loading="loading" :data="marryList" @selection-change="handleSelectionChange" >
|
<el-row :span="16">
|
<el-form-item label="姓名" prop="spouseName" label-width="40px">
|
<el-input v-model="marryList.spouseName" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="出生日期" prop="spouseBirthday" label-width="70px">
|
<el-input v-model="marryList.spouseBirthday" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="身份证号码" prop="spouseId" label-width="85px">
|
<el-input v-model="marryList.spouseId" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="婚姻状况" prop="spouseMarryStatus" label-width="70px">
|
<template v-if="!isEditing">
|
<el-input v-if="marryList.spouseMarryStatus===0" placeholder="未婚" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.spouseMarryStatus===1" placeholder="初婚" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.spouseMarryStatus===2" placeholder="离婚" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.spouseMarryStatus===3" placeholder="再婚" :disabled="dsb"></el-input>
|
|
</template>
|
<template v-else>
|
<el-select v-model="marryList.spouseMarryStatus" placeholder="请选择婚姻状态" clearable :style="{width: '100%'}">
|
<el-option label="未婚" value="0"></el-option>
|
<el-option label="初婚" value="1"></el-option>
|
<el-option label="离婚" value="2"></el-option>
|
<el-option label="再婚" value="3"></el-option>
|
|
</el-select>
|
</template>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="户籍地址" prop="spouseAddress" label-width="70px">
|
<el-input v-model="marryList.spouseAddress" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:200px;padding-top:15px">
|
<el-container>
|
<el-col v-loading="loading" :data="marryList" @selection-change="handleSelectionChange">
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left">
|
<el-row :span="16">
|
<el-form-item label="性别" prop="spouseSex" label-width="40px">
|
<el-input v-model="marryList.spouseSex === 1 ? '男':'女' " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="民族" prop="spouseNation" label-width="40px">
|
<el-input v-model="marryList.spouseNation " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="联系电话" prop="spousePhone" label-width="70px">
|
<el-input v-model="marryList.spousePhone" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="结婚时间" prop="marryTime" label-width="70px">
|
<el-input v-model="marryList.marryTime" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
|
|
|
<div style="padding-left:30px;padding-top:30px" >
|
<el-container >
|
|
|
|
</el-container>
|
</div>
|
<!-- </el-dialog> self:user:export-->
|
</el-container>
|
|
<!-- <h2 style="font-size:16px " >前任情况</h2> -->
|
<!-- <div>
|
<el-table v-loading="loading" :data="oldSpouseList" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
|
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column label="序号" sortable type="index" :index="(queryParams.pageNum-1)*queryParams.pageSize+1" width="70"/>
|
<el-table-column label="名字" prop="name" sortable width="120" />
|
<el-table-column label="出生时间" prop="birthday" sortable width="120" />
|
<el-table-column label="户籍地址" prop="address" sortable width="120" />
|
<el-table-column label="工作地址" prop="workAddress" sortable width="120" />
|
<el-table-column label="婚姻状态" prop="marryStatus" sortable width="120" >
|
<template slot-scope="scope">
|
<span v-if="scope.row.marryStatus== 0">未婚</span>
|
<span v-if="scope.row.marryStatus== 1">初婚</span>
|
<span v-if="scope.row.marryStatus== 2">离婚</span>
|
<span v-if="scope.row.marryStatus== 3">再婚</span>
|
</template>
|
|
</el-table-column>
|
<el-table-column label="性别" prop="sex" sortable width="100" >
|
<template slot-scope="scope">
|
<span v-if="scope.row.sex== 0">女</span>
|
<span v-if="scope.row.sex== 1">男</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="民族" prop="nation" sortable width="100" />
|
<el-table-column label="电话号码" prop="phone" sortable width="150" />
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
|
<el-button size="mini" type="text" icon="el-icon-edit" v-if="!editStatus[scope.row.id]"
|
@click="editRow(scope.row)" v-hasPermi="['system:role:edit']">修改</el-button>
|
<el-button size="mini" type="text"
|
v-if="editStatus[scope.row.id]" @click="saveRowExperienceList(scope.row)">保存</el-button>
|
<el-button size="mini" type="text" icon="el-icon-delete"
|
@click="handleExperienceDelete(scope.row)" v-hasPermi="['system:role:remove']">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div> -->
|
<div>
|
<el-collapse v-model="activeNames" @change="handleChange">
|
|
<el-collapse-item name="1" >
|
<template v-slot:title>
|
<div class="title-wrapper">
|
<h2 style="font-size:16px ">前任情况</h2>
|
<div>
|
<el-button class="button" size="mini" type="text" @click="showDialog('open')">
|
<sapn v-html="'\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'"></sapn></el-button>
|
</div>
|
</div>
|
</template>
|
<el-table v-loading="loading" :data="oldSpouseList" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
|
<el-table-column label="姓名" prop="name" sortable width="180" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.name }}</template>
|
<template v-else><el-input v-model="scope.row.name"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="出生日期" prop="birthday" sortable width="180" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.birthday }}</template>
|
<template v-else><el-input v-model="scope.row.birthday"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="户籍地址" prop="address" sortable width="180" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.address }}</template>
|
<template v-else><el-input v-model="scope.row.address"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="工作地址" prop="workAddress" sortable width="180" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.workAddress }}</template>
|
<template v-else><el-input v-model="scope.row.workAddress"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="户籍地址" prop="address" sortable width="180" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.address }}</template>
|
<template v-else><el-input v-model="scope.row.address"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="性别" prop="sex" sortable width="100" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.sex }}</template>
|
<template v-else><el-input v-model="scope.row.sex"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="民族" prop="nation" sortable width="100" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.nation }}</template>
|
<template v-else><el-input v-model="scope.row.nation"></el-input></template>
|
</template>
|
</el-table-column>
|
<el-table-column label="婚姻状态" prop="marryStatus" sortable width="140" align="center" >
|
<template slot-scope="scope">
|
<template v-if="!scope.row.isEdit">{{ scope.row.marryStatus }}</template>
|
<template v-else> <span v-if="scope.row.marryStatus== 0">未婚</span>
|
<span v-if="scope.row.marryStatus== 1">初婚</span>
|
<span v-if="scope.row.marryStatus== 2">离婚</span>
|
<span v-if="scope.row.marryStatus== 3">再婚</span></template>
|
</template>
|
</el-table-column>
|
<!-- 操作 -->
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
|
<el-button size="mini" type="text" icon="el-icon-edit" v-if="!editStatus[scope.row.id]"
|
@click="editRow(scope.row)" v-hasPermi="['system:role:edit']">修改</el-button>
|
<el-button size="mini" type="text"
|
v-if="editStatus[scope.row.id]" @click="saveRowmarryList(scope.row)">保存</el-button>
|
<el-button size="mini" type="text" icon="el-icon-delete"
|
@click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-collapse-item>
|
|
</el-collapse>
|
</div>
|
|
<h2 style="font-size:16px " >生育情况</h2>
|
|
|
<el-container>
|
<div style="padding-left:0px" >
|
<el-container >
|
<el-col >
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left"
|
v-loading="loading" :data="marryList" @selection-change="handleSelectionChange" >
|
<el-row :span="16">
|
<el-form-item label="生育情况" prop="bearStatus" label-width="80px">
|
<template >
|
<el-input v-if="marryList.bearStatus===0" placeholder="未生育" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.bearStatus===1" placeholder="在孕" :disabled="dsb"></el-input>
|
<el-input v-if="marryList.bearStatus===2" placeholder="已生育" :disabled="dsb"></el-input>
|
|
</template>
|
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="领取《计划生育服务手册》" prop="handbookStatus" label-width="180px">
|
<el-input v-model="marryList.handbookStatus ===1 ? '是':'否' " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="领取《独生子女证》" prop="oneBorn" label-width="150px">
|
<el-input v-model="marryList.oneBorn ===1 ? '是':'否' " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
<div style="padding-left:200px; padding-top: 58px; ">
|
<el-container>
|
<el-col v-loading="loading" :data="marryList" @selection-change="handleSelectionChange">
|
<el-form ref="elForm" :model="marryList" :rules="rules" size="medium" label-position="left" >
|
|
<el-row :span="16" >
|
<el-form-item label="领证时间" prop="handbookTime" label-width="70px">
|
<el-input v-model="marryList.handbookTime " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
<el-row :span="16">
|
<el-form-item label="领证时间" prop="oneBornTime" label-width="70px">
|
<el-input v-model="marryList.oneBornTime" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
|
</el-input>
|
</el-form-item>
|
</el-row>
|
|
</el-form>
|
</el-col>
|
</el-container>
|
</div>
|
|
|
|
<div style="padding-left:400px;padding-top:30px" >
|
</div>
|
<!-- </el-dialog> self:user:export-->
|
</el-container>
|
|
<h2 style="font-size:16px " >需声明的情况</h2>
|
<el-container>
|
<el-input v-model="marryList.content " placeholder="" clearable :style="{width: '80%'}" :disabled="dsb"> </el-input>
|
</el-container>
|
<h2 style="font-size:16px " >备注</h2>
|
<el-container>
|
<el-input v-model="marryList.remark " placeholder="" clearable :style="{width: '80%'}" :disabled="dsb"> </el-input>
|
</el-container>
|
|
<!-- 新增 -->
|
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
|
<el-form ref="elForm" :model="formDat" :rules="rules" size="medium" label-width="100px">
|
<h2 style="margin-left: 50px;">基本情况</h2>
|
<div style="width: 500px; display:table-cell;">
|
<el-form-item label="姓名" prop="name">
|
<el-input v-model="formDat.name" placeholder="请输入姓名" clearable :style="{width: '100%'}" ></el-input>
|
</el-form-item>
|
|
<el-form-item label="出生时间" prop="birthday" >
|
<el-date-picker
|
v-model='formDat.birthday'
|
type='date'
|
placeholder='选择日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="身份证号" prop="id">
|
<el-input v-model="formDat.id" placeholder="请输入身份证号" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="婚姻状况" prop="marryStatus">
|
<el-select v-model="formDat.marryStatus" placeholder="请选择婚姻状况" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="户籍地址" prop="address">
|
<el-input v-model="formDat.address" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
|
</div>
|
<div style=" width: 500px;display:table-cell;">
|
<el-form-item label="性别" prop="sex">
|
<el-select v-model="formDat.sex" placeholder="请选择性别" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption1" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="民族" prop="nation">
|
<el-input v-model="formDat.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="联系电话" prop="phone">
|
<el-input v-model="formDat.phone" placeholder="请输入联系电话" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
<el-form-item label="结婚时间" prop="marryTime">
|
<el-date-picker
|
v-model='formDat.marryTime'
|
type='date'
|
placeholder='选择结婚日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
</div>
|
|
<h2 style="margin-left: 50px;">配偶情况</h2>
|
<div style="width: 500px; display:table-cell;">
|
<el-form-item label="姓名" prop="spouseName">
|
<el-input v-model="formDat.spouseName" placeholder="请输入姓名" clearable :style="{width: '100%'}" ></el-input>
|
</el-form-item>
|
|
<el-form-item label="出生时间" prop="spouseBirthday" >
|
<el-date-picker
|
v-model='formDat.spouseBirthday'
|
type='date'
|
placeholder='选择日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="身份证号" prop="spouseId">
|
<el-input v-model="formDat.spouseId" placeholder="请输入身份证号" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="婚姻状况" prop="spouseMarryStatus">
|
<el-select v-model="formDat.spouseMarryStatus" placeholder="请选择婚姻状况" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="户籍地址" prop="spouseAddress">
|
<el-input v-model="formDat.spouseAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
|
</div>
|
<div style=" width: 500px;display:table-cell;">
|
<el-form-item label="性别" prop="spouseSex">
|
<el-select v-model="formDat.spouseSex" placeholder="请选择性别" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption1" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="民族" prop="spouseNation">
|
<el-input v-model="formDat.spouseNation" placeholder="请输入民族" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="联系电话" prop="spousePhone">
|
<el-input v-model="formDat.spousePhone" placeholder="请输入联系电话" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
<el-form-item label="结婚时间" prop="marryTime">
|
<el-date-picker
|
v-model='formDat.marryTime'
|
type='date'
|
placeholder='选择结婚日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
</div>
|
|
|
<h2 style="margin-left: 50px;">前任情况</h2>
|
<div style="width: 500px; display:table-cell;">
|
<el-form-item label="姓名" prop="spouseName">
|
<el-input v-model="formDat.spouseName" placeholder="请输入姓名" clearable :style="{width: '100%'}" ></el-input>
|
</el-form-item>
|
|
<el-form-item label="出生时间" prop="spouseBirthday" >
|
<el-date-picker
|
v-model='formDat.spouseBirthday'
|
type='date'
|
placeholder='选择日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="身份证号" prop="spouseId">
|
<el-input v-model="formDat.spouseId" placeholder="请输入身份证号" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="婚姻状况" prop="spouseMarryStatus">
|
<el-select v-model="formDat.spouseMarryStatus" placeholder="请选择婚姻状况" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="户籍地址" prop="spouseAddress">
|
<el-input v-model="formDat.spouseAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
|
</div>
|
<div style=" width: 500px;display:table-cell;">
|
<el-form-item label="性别" prop="spouseSex">
|
<el-select v-model="formDat.spouseSex" placeholder="请选择性别" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption1" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="民族" prop="spouseNation">
|
<el-input v-model="formDat.spouseNation" placeholder="请输入民族" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
<el-form-item label="联系电话" prop="spousePhone">
|
<el-input v-model="formDat.spousePhone" placeholder="请输入联系电话" clearable :style="{width: '100%'}" >
|
</el-input>
|
</el-form-item>
|
|
<el-form-item label="结婚时间" prop="marryTime">
|
<el-date-picker
|
v-model='formDat.marryTime'
|
type='date'
|
placeholder='选择结婚日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
</div>
|
|
<h2 style="margin-left: 50px;">生育情况</h2>
|
<div style="width: 500px; display:table-cell;">
|
<el-form-item label="生育情况" prop="bearStatus">
|
<el-select v-model="formDat.bearStatus" placeholder="请选择生育情况" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption2" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="领取《计划生育服务手册》" prop="handbookStatus">
|
<el-select v-model="formDat.handbookStatus" placeholder="请选择" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption3" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="手册领取时间" prop="handbookTime" >
|
<el-date-picker
|
v-model='formDat.handbookTime'
|
type='date'
|
placeholder='选择日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
<el-form-item label="领取《独生子女证》" prop="oneBorn">
|
<el-select v-model="formDat.oneBorn" placeholder="请选择" clearable :style="{width: '100%'}" >
|
<el-option v-for="(item, index) in typeOption3" :key="index" :label="item.label" :value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="《独生子女证》领取时间" prop="oneBornTime" >
|
<el-date-picker
|
v-model='formDat.oneBornTime'
|
type='date'
|
placeholder='选择日期'
|
style="width: 100%;"
|
></el-date-picker>
|
</el-form-item>
|
|
|
</div>
|
<el-form-item label="备注" prop="remark">
|
<el-input v-model="formDat.remark" placeholder="请输入备注" clearable :style="{width: '80%'}" ></el-input>
|
</el-form-item>
|
<el-form-item label="需声明情况" prop="content">
|
<el-input v-model="formDat.content" placeholder="请输入需声明情况" clearable :style="{width: '80%'}" ></el-input>
|
</el-form-item>
|
|
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" @click="submitDataScope">保 存</el-button>
|
<el-button @click="cancelData">取 消</el-button>
|
</div>
|
</el-dialog>
|
|
</div>
|
</template>
|
|
<script>
|
import { listRole, getRole, delRole, addRole, updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role";
|
import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu";
|
|
|
|
//在system/note/index.js中导入接口函数 --接好了
|
import {listMarry,updateMarry,delMarry,addMarry} from "@/api/marry/index";
|
import { delFamilyevent, uploadPic } from '../../api/bignote'
|
import { blobValidate } from '../../utils/ruoyi'
|
|
export default {
|
name: "show",
|
dicts: ['sys_normal_disable'],
|
data() {
|
return {
|
|
// 遮罩层
|
disabled: false,
|
|
loading: false,
|
formData:[],
|
// 选中数组
|
ids: [],
|
// 非单个禁用
|
single: true,
|
// 非多个禁用
|
multiple: true,
|
// 显示搜索条件
|
showSearch: true,
|
// 总条数
|
total: 0,
|
//头像上传
|
showBtnDealImg:true,
|
noneBtnImg:false,
|
limitCountImg:1,//上传图片的最大数量
|
//个人信息数据
|
marryList:[],
|
fit:['fill'],
|
|
oldSpouseList:[],
|
//下拉实现
|
activeNames:['1'],
|
// 弹出层标题
|
title: "",
|
// 是否显示弹出层
|
open: false,
|
// open:true,
|
// 是否显示弹出层（数据权限）
|
openDataScope: false,
|
menuExpand: false,
|
menuNodeAll: false,
|
deptExpand: true,
|
deptNodeAll: false,
|
// 日期范围
|
dateRange: [],
|
// 数据范围选项
|
fot:[".jpg",".jif"],
|
fileList:[
|
],
|
fileListOther:[
|
|
],
|
editStatus: {},
|
dsb:true,
|
btn:false,
|
isShow:true,
|
isShow_2:false,
|
|
formDat: {
|
|
oldSpouseList:undefined,
|
},
|
// 菜单列表
|
menuOptions: [],
|
// 部门列表
|
deptOptions: [],
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 5,
|
startDate:undefined,
|
content:undefined,
|
witness:undefined,
|
},
|
// 表单参数
|
form: {},
|
defaultProps: {
|
children: "children",
|
label: "label"
|
},
|
// 表单校验
|
rules: {
|
//基本信息
|
nickName: [{
|
// required: true,
|
message: '请输入姓名',
|
trigger: 'blur'
|
}],
|
oldName: [{
|
// required: true,
|
message: '请输入曾用名',
|
trigger: 'blur'
|
}],
|
idNum: [{
|
// required: true,
|
message: '请输入身份证号',
|
trigger: 'blur'
|
}],
|
nationality: [{
|
// required: true,
|
message: '请输入国籍',
|
trigger: 'blur'
|
}],
|
maritalStatus: [{
|
// required: true,
|
message: '请输入民族',
|
trigger: 'blur'
|
}],
|
locationAddress: [{
|
// required: true,
|
message: '请输入户籍地址',
|
trigger: 'blur'
|
}],
|
alwaysAddress: [{
|
// required: true,
|
message: '请输入常住地址',
|
trigger: 'blur'
|
}],
|
unit: [{
|
// required: true,
|
message: '请输入单位',
|
trigger: 'blur'
|
}],
|
position: [{
|
// required: true,
|
message: '请输入职务职称',
|
trigger: 'blur'
|
}],
|
locationPolice: [{
|
// required: true,
|
message: '请输入户籍地公安机关',
|
trigger: 'blur'
|
}],
|
alwaysPolice: [{
|
// required: true,
|
message: '请输入常住地公安机关',
|
trigger: 'blur'
|
}],
|
|
//主要学习及工作经历
|
startDate: [{
|
required: true,
|
message: '请输入起始日期',
|
trigger: 'blur'
|
}],
|
content: [{
|
required: true,
|
message: '请输入主要学习经历、工作单位及任职情况',
|
trigger: 'blur'
|
}],
|
witness: [{
|
required: true,
|
message: '请输入证明人',
|
trigger: 'blur'
|
}],
|
|
},
|
typeOptions: [],
|
//婚姻状况
|
typeOption: [{
|
value:'0',
|
label:'未婚'
|
},{
|
value:'1',
|
label:'初婚'
|
},{
|
value:'2',
|
label:'离婚'
|
},
|
{
|
value:'3',
|
label:'再婚'
|
}],
|
//性别
|
typeOption1: [{
|
value:'0',
|
label:'女'
|
},{
|
value:'1',
|
label:'男'
|
},],
|
|
//生育情况
|
|
typeOption2: [{
|
value:'0',
|
label:'未生育'
|
},{
|
value:'1',
|
label:'在孕'
|
},
|
{
|
value:'2',
|
label:'已生育'
|
}],
|
//领取证件
|
typeOption3: [{
|
value:'0',
|
label:'否'
|
},{
|
value:'1',
|
label:'是'
|
},
|
],
|
};
|
},
|
created() {
|
this.getList()
|
},
|
methods: {
|
|
|
// 取消按钮
|
cancelData() {
|
this.open = false;
|
this.reset();
|
},
|
//下拉
|
handleChange(val) {
|
console.log(val);
|
},
|
|
|
|
|
|
/** 查询角色列表 */
|
|
|
getList() {
|
this.loading = false;
|
alert(344)
|
//个人信息
|
listMarry(this.queryParams).then(response => {
|
alert(124)
|
console.log(response.data)
|
if(response.data.length == 0){
|
this.loading = false;
|
this.marryList=[];
|
this.total = 0;
|
this.oldSpouseList = [];
|
}
|
else{
|
this.marryList = response.data;
|
this.total = response.data.total;
|
this.oldSpouseList = this.marryList.oldSpouseList;
|
this.loading = false;
|
|
}
|
|
}
|
);
|
|
|
},
|
|
//图片的上传及上传按钮隐藏
|
|
|
// 取消按钮
|
cancel() {
|
this.open = false;
|
this.reset();
|
},
|
// 取消按钮（数据权限）
|
cancelDataScope() {
|
this.openDataScope = false;
|
this.reset();
|
},
|
// 表单重置
|
reset() {
|
if (this.$refs.menu != undefined) {
|
this.$refs.menu.setCheckedKeys([]);
|
}
|
this.menuExpand = false,
|
this.menuNodeAll = false,
|
this.deptExpand = true,
|
this.deptNodeAll = false,
|
this.form = {
|
roleId: undefined,
|
roleName: undefined,
|
roleKey: undefined,
|
roleSort: 0,
|
status: "0",
|
menuIds: [],
|
deptIds: [],
|
menuCheckStrictly: true,
|
deptCheckStrictly: true,
|
remark: undefined
|
};
|
this.resetForm("form");
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1;
|
this.getList();
|
},
|
/** 重置按钮操作 */
|
resetQuery() {
|
this.dateRange = [];
|
this.resetForm("queryForm");
|
this.handleQuery();
|
},
|
// 多选框选中数据
|
handleSelectionChange(selection) {
|
this.ids = selection.map(item => item.id)
|
console.log(this.ids)
|
this.single = selection.length!=1
|
this.multiple = !selection.length
|
},
|
|
/** 新增按钮操作 */
|
handleAdd() {
|
this.reset();
|
this.open = true;
|
this.title = "新增婚姻信息";
|
},
|
|
|
/** 查看详细信息 */
|
handleCheck(row){
|
const id = row.id;
|
this.$router.push("/self/self/edit/" + id);
|
},
|
/** 修改按钮操作 */
|
handleUpdate() {
|
|
let jd = true
|
|
// this.$router.push({
|
// path:"/self/marry/edit/" + id,
|
// query:{
|
// detail:jd
|
// }
|
// });
|
},
|
// 编辑按钮
|
handleEdit()
|
{
|
this.dsb = false
|
this.btn = true
|
this.isShow=false
|
this.isShow_2=true
|
this.isEditing=true
|
// this.isEdit=false
|
},
|
|
handleRemoveFile(file) {
|
alert(23)
|
},
|
handleRemove(file) {
|
alert("操作成功")
|
},
|
handlePictureCardPreview(file) {
|
this.dialogImageUrl = file.url;
|
this.dialogVisible = true;
|
},
|
//点击下载函数
|
handleDownload(url) {
|
var formData = {'path':"/"+url.replace(process.env.VUE_APP_BASE_TRUE_API,"")};
|
|
let lens = formData.path.split(".")
|
let suffix = lens[lens.length-1]
|
download(formData).then(async (response) => {
|
const isLogin = await blobValidate(response);
|
let nt = new Date().getTime()
|
let filename = 'selfevent_'+nt+'.'+suffix
|
const blob = new Blob([response])
|
saveAs(blob, filename)
|
})
|
},
|
|
|
/** 提交按钮（数据权限） */
|
submitDataScope: function() {
|
|
let ul = this.fileList.map(function (elem){
|
return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
|
}).join(",")
|
let uls = this.fileListOther.map(function (elem){
|
return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
|
}).join(",")
|
this.formDat.url = ul+","+uls
|
this.$refs["elForm"].validate(valid => {
|
if (valid) {
|
|
addMarry(this.formDat).then(response => {
|
this.$modal.msgSuccess("新增成功");
|
this.open = false;
|
this.getList();
|
});
|
}
|
});
|
},
|
requestUpload(params)
|
{
|
var file = params.file;
|
var formData = new FormData();
|
formData.append('uploadFile', file);
|
let _this = this
|
|
uploadPic(formData).then(response => {
|
let pth = response.data.originalFilename.substr(response.data.originalFilename.length-4, response.data.originalFilename.length)
|
|
if(_this.fot.includes(pth) === true)
|
{
|
_this.fileList.push({name:response.data.fileName, "url":response.data.url})
|
|
}
|
|
else{
|
_this.fileListOther.push({name:response.data.fileName, url:response.data.url})
|
|
}
|
})
|
|
},
|
|
editRow(row) {
|
this.$set(row, 'isEdit', true);
|
this.$set(this.editStatus, row.id, true);
|
},
|
//修改后的保存
|
|
submitForm() {
|
let ul = this.fileList.map(function (elem){
|
return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
|
}).join(",")
|
let uls = this.fileListOther.map(function (elem){
|
return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
|
}).join(",")
|
this.marryList.url = ul+","+uls
|
|
this.$refs['elForm'].validate(valid => {
|
if (valid) {
|
if (this.marryList.id !== undefined) {
|
updateMarry(this.marryList).then(response => {
|
this.$modal.msgSuccess("修改成功");
|
// this.open = false;
|
this.btn=false
|
});
|
} else {
|
this.$modal.msgSuccess("修改失败");
|
|
}
|
}
|
})
|
// 刷新页面
|
// window.location.reload();
|
},
|
//主要经历
|
saveRowmarryList(row) {
|
this.$refs['elForm'].validate(valid => {
|
if (valid) {
|
this.oldSpouseList = this.marryList.oldSpouseList
|
const foundIndex = this.oldSpouseList.findIndex(item => item.id === row.id);
|
if (foundIndex !== -1) {
|
const updatedData = Object.assign({}, this.marryList.oldSpouseList[foundIndex], row);
|
updateMarry(updatedData).then(response => {
|
this.$modal.msgSuccess("修改成功");
|
}).catch(error => {
|
this.$modal.msgError("修改失败");
|
console.log(error);
|
});
|
} else {
|
this.$modal.msgError("修改失败");
|
}
|
}
|
});
|
this.$set(row, 'isEdit', false);
|
this.$set(this.editStatus, row.id, false);
|
},
|
|
//隔行变色
|
tableRowClassName({ row, rowIndex }) {
|
if (rowIndex % 2 == 0) {
|
return "statistics-warning-row1";
|
} else {
|
return "statistics-warning-row";
|
}
|
},
|
/** 删除个人经历按钮操作 */
|
handleDelete(row) {
|
const Ids = row.id || this.ids;
|
this.$modal.confirm('是否确认删除所选数据项？').then(function() {
|
return delMarry(Ids);
|
}).then(() => {
|
this.getList();
|
this.$modal.msgSuccess("删除成功");
|
window.location.reload();
|
}).catch(() => {});
|
|
},
|
|
/** 导出按钮操作 */
|
handleExport() {
|
this.download('/self/user/export', {
|
...this.queryParams
|
}, `self_${new Date().getTime()}.xlsx`)
|
}
|
}
|
};
|
</script>
|
