<template>
|
<div>
|
<el-row
|
v-for="(item, i) in Fromfamily"
|
:key="i"
|
>
|
<el-col :span="22">
|
<el-form
|
:rules="rules"
|
:inline="true"
|
:model="Fromfamily[i]"
|
ref="Fromfamily"
|
label-width="110px"
|
>
|
<el-form-item label="姓名" prop="name">
|
<el-input placeholder="请输入-不超过10字" v-model="Fromfamily[i].name" maxlength="10" show-word-limit></el-input>
|
</el-form-item>
|
<el-form-item label="公民身份号码" prop="cardNo">
|
<el-input placeholder="请输入有效身份证号码" v-model="Fromfamily[i].cardNo" ></el-input>
|
</el-form-item>
|
<el-form-item label="与人员关系">
|
<el-select placeholder="请选择" v-model="Fromfamily[i].relationId">
|
<el-option v-for="li in relation" :key="li.value" :label="li.name" :value="li.value"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-button type="primary" @click="onSubmitfamily(i)">保存</el-button>
|
</el-form>
|
</el-col>
|
<el-col :span="2">
|
<i
|
class="el-icon-circle-plus-outline"
|
type="danger"
|
v-if="i == 0"
|
style="font-size: 30px; color: #67c23a; margin-right: 5px"
|
@click="addItem"
|
></i>
|
<i
|
class="el-icon-remove-outline"
|
type="danger"
|
v-if="i != 0"
|
style="font-size: 30px; color: #f56c6c"
|
@click="del(i)"
|
></i>
|
</el-col>
|
</el-row>
|
</div>
|
</template>
|
|
<script>
|
import {isvalidPhone,isIdcard} from '../../../../assets/js/fromValidate';
|
|
var validIdcrad=(rule, value,callback)=>{
|
if (!value){
|
callback(new Error('请输入身份证号码'))
|
}else if (!isIdcard(value)){
|
callback(new Error('请输入正确的身份证号码'))
|
}else {
|
callback()
|
}
|
};
|
|
export default {
|
props:['editId'],
|
data() {
|
return{
|
Fromfamily:[
|
{
|
cardNo:'',
|
name:'',
|
relationId:'',
|
populationId:0,
|
}
|
],
|
rules: {
|
name: [
|
{ required: true, message: '请输入姓名', trigger: 'blur' },
|
],
|
cardNo:[
|
{required: true, validator: validIdcrad, trigger: 'change' }
|
],
|
},
|
relation:[],
|
}
|
},
|
|
watch:{
|
editId(val) {
|
this.Fromfamily.populationId =val;
|
}
|
},
|
|
mounted() {
|
/** populationId:获取人口ID */
|
if(this.$route.query.id) {
|
this.Fromfamily.populationId = this.$route.query.id;
|
this.getDetails();
|
}
|
this.householder();
|
},
|
methods: {
|
/** 获取吸毒信息 populationId：人口id
|
* id:主键id 有id编辑 无id新增 */
|
getDetails() {
|
this.$api.get("population/relation/list",{populationId:this.Fromfamily.populationId},e=> {
|
if(e.length) {
|
this.Fromfamily = e;
|
}
|
})
|
},
|
addItem() {
|
this.Fromfamily.push({
|
cardNo:'',
|
name:'',
|
relationId:'',
|
populationId:0,
|
});
|
},
|
// 删除
|
del(index) {
|
if(this.$route.query.id) {
|
this.$api.get("population/relation/delete",{id:this.Fromfamily[index].id},e=> {
|
demo.toast("删除成功");
|
this.Fromfamily.splice(index, 1);
|
})
|
}else {
|
this.Fromfamily.splice(index, 1);
|
}
|
},
|
|
//与户主关系
|
householder() {
|
let params = {
|
key:'GB/T4761'
|
}
|
this.$api.get('dictionary/listDictionaryByKey',params,e=>{
|
this.relation = e.map(d=> {
|
return {
|
value:d.dictValue,
|
name:d.dictName
|
}
|
})
|
})
|
},
|
|
onSubmitfamily(i) {
|
if(this.Fromfamily.populationId == '') {
|
return this.$message({
|
message: '请先填写完基础信息',
|
type: 'warning'
|
});
|
}
|
if(this.Fromfamily[i].name == '') {
|
return this.$message({
|
message: '请输入姓名',
|
type: 'warning'
|
});
|
}
|
|
if(this.Fromfamily[i].cardNo == '') {
|
return this.$message({
|
message: '请输入身份证号',
|
type: 'warning'
|
});
|
}
|
if(this.Fromfamily[i].id) {
|
//编辑
|
this.$api.post("population/relation/edit",this.Fromfamily[i],e=> {
|
demo.toast("编辑成功")
|
})
|
} else {
|
//新增
|
this.Fromfamily[i].populationId=this.Fromfamily.populationId;
|
this.$api.post("population/relation/add",this.Fromfamily[i],d=> {
|
this.$message({
|
message: '保存成功',
|
type: 'success'
|
});
|
});
|
}
|
|
},
|
}
|
}
|
</script>
|
|
<style>
|
|
</style>
|
