<template>
|
<view class="container">
|
<view class="main">
|
<view class="content">
|
<u-form labelWidth="70" :model="form" :rules="rules" ref="form">
|
<view class="event-info">
|
<!-- <view class="box-title">
|
<box-title title="基础信息"></box-title>
|
</view> -->
|
<u-form-item @click="showSelectBus(dataList.roleList, '角色', 'roleTypeName','roleType')" class="form-item"
|
labelWidth="100" label="角色" required prop="roleType">
|
<u--input border="none" v-model="roleTypeName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.relationshipList, '角色关系', 'relationshipName','relationship')"
|
class="form-item" labelWidth="100" label="角色关系" required prop="relationship">
|
<u--input border="none" v-model="relationshipName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="姓名" required prop="name">
|
<u--input border="none" v-model="form.name" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
|
<u-form-item class="form-item" labelWidth="100" label="身份证" prop="idCard">
|
<u--input border="none" v-model="form.idCard" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.genderList, '性别', 'genderName','gender')"
|
class="form-item" labelWidth="100" label="性别" prop="gender">
|
<u--input border="none" v-model="genderName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="手机号码" prop="phoneNumber">
|
<u--input border="none" v-model="form.phoneNumber" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="其他联系方式" prop="otherContact">
|
<u--input border="none" v-model="form.otherContact" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.isPrimaryContactList, '是否主要联系人', 'isPrimaryContactName','isPrimaryContact')"
|
class="form-item" labelWidth="110" label="是否主要联系人"
|
prop="isPrimaryContact">
|
<u--input border="none" v-model="isPrimaryContactName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.residentialStatusList, '居住情况', 'residentialStatusName','residentialStatus')"
|
class="form-item" labelWidth="100" label="居住情况"
|
prop="residentialStatus">
|
<u--input border="none" v-model="residentialStatusName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="港澳台通行证" prop="hkmtPass">
|
<u--input border="none" v-model="form.hkmtPass" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="护照" prop="passport">
|
<u--input border="none" v-model="form.passport" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="现居住地" prop="currentAddress">
|
<u--input border="none" v-model="form.currentAddress" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.ethnicityList, '民族', 'ethnicityName','ethnicity')"
|
class="form-item" labelWidth="100" label="民族" prop="ethnicity">
|
<u--input border="none" v-model="ethnicityName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.educationList, '学历', 'educationName','education')"
|
class="form-item" labelWidth="100" label="学历" prop="education">
|
<u--input border="none" v-model="educationName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.partyEmberList, '是否党员', 'partyEmberName','partyEmber')"
|
class="form-item" labelWidth="100" label="是否党员" prop="partyEmber">
|
<u--input border="none" v-model="partyEmberName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="工作单位" prop="employer">
|
<u--input border="none" v-model="form.employer" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.workStatusList, '工作状态', 'workStatusName','workStatus')"
|
class="form-item" labelWidth="100" label="工作状态" prop="workStatus">
|
<u--input border="none" v-model="workStatusName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item @click="showSelectBus(dataList.maritalStatusList, '婚姻状态', 'maritalStatusName','maritalStatus')"
|
class="form-item" labelWidth="100" label="婚姻状态" prop="maritalStatus">
|
<u--input border="none" v-model="maritalStatusName" disabled disabledColor="#ffffff"
|
placeholder="请选择">
|
</u--input>
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="户籍登记地" prop="hukouRegistration">
|
<u--input border="none" v-model="form.hukouRegistration" placeholder="请输入">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="车牌号" prop="cardNumber">
|
<u--input border="none" v-model="form.cardNumber" placeholder="多个用中划线(-)隔开">
|
</u--input>
|
</u-form-item>
|
|
<u-form-item class="form-item" labelWidth="100" label="备注" prop="remark">
|
<u--input border="none" v-model="form.remark" placeholder="补充说明">
|
</u--input>
|
</u-form-item>
|
</view>
|
</u-form>
|
</view>
|
|
<!-- <view class="btn-group b-c-w">
|
<view>
|
<u-button @click="submit" type="primary" :text="addOrUpdateTitle" width="120px"></u-button>
|
</view>
|
<view>
|
<u-button @click="navigator" type="primary" :plain="true" text="返回首页"></u-button>
|
</view>
|
</view> -->
|
|
<view class="footer flex j-c-s-b a-i-c bgc-ff" v-if="type == 2">
|
<button class="del-btn footer-btn" @click="delAction">删除</button>
|
<button class="save-btn footer-btn" @click="submit">保存</button>
|
</view>
|
<!-- <view class="footer flex j-c-s-b a-i-c bgc-ff" >
|
<button class="add-btn footer-btn" >提交</button>
|
</view> -->
|
<footer-btn v-if="type == 1" @click="submit" />
|
|
</view>
|
|
<!-- 事件类型下拉框 -->
|
<!-- <select-bus v-if="typeShow" :show="typeShow" v-model="form[selectBusModel]" type="radio"
|
:popupTitle="selectBusTitle" :dataLists="selectBusList" @cancel="typeShow = false" @submit="typeSelect">
|
</select-bus> -->
|
<u-picker :defaultIndex="[selectDefaultIndex[selectBusKey]]" :closeOnClickOverlay="true" v-if="typeShow" :show="typeShow" :columns="[selectBusList]"
|
@close="typeShow = false" @cancel="typeShow = false" keyName="name" @confirm="typeSelect"></u-picker>
|
</view>
|
</template>
|
|
<script>
|
import selectBus from "@/components/my-components/selectBus.vue"
|
import uploadMixin from "@/mixin/uploadMixin";
|
import {
|
saveOrUpdateHousehold,removeHousehold
|
} from '@/api/house/household.js'
|
import {
|
bizDictionary
|
} from '@/api/system/dict.js'
|
export default {
|
components: {
|
selectBus,
|
},
|
mixins: [uploadMixin],
|
data() {
|
return {
|
addOrUpdateTitle:"添加",
|
houseCode:"",
|
form: {
|
roleName: "",
|
relationName: '',
|
location: "",
|
title: "",
|
roleType:null,
|
description: "",
|
},
|
rules: {
|
// roleType: [{
|
// required: true,
|
// message: '请选择角色'
|
// }],
|
name: [{
|
required: true,
|
message: '请填写姓名'
|
}],
|
},
|
typeShow: false,
|
roleName: "",
|
dataList: {
|
roleList: [],
|
relationshipList: [],
|
genderList:[
|
{
|
value: 1,
|
name: '男',
|
},
|
{
|
value: 0,
|
name: '女',
|
},
|
{
|
value: 2,
|
name: '未知',
|
}
|
],
|
isPrimaryContactList:[
|
{
|
value: 1,
|
name: '是',
|
},
|
{
|
value: 0,
|
name: '否',
|
}
|
],
|
residentialStatusList:[
|
{
|
value: 1,
|
name: '是',
|
},
|
{
|
value: 0,
|
name: '否',
|
}
|
],
|
ethnicityList:[
|
|
],
|
educationList:[
|
|
],
|
partyEmberList:[
|
{
|
value: 1,
|
name: '是',
|
},
|
{
|
value: 2,
|
name: '否',
|
}
|
],
|
workStatusList:[
|
|
],
|
maritalStatusList:[
|
|
]
|
},
|
roleTypeName: '',
|
relationshipName: '',
|
genderName: '',
|
residentialStatusName:"",
|
isPrimaryContactName: '',
|
ethnicityName: '',
|
educationName: '',
|
partyEmberName: '',
|
workStatusName: '',
|
maritalStatusName: '',
|
// 下拉变量
|
selectBusList: [],
|
selectBusVal: '',
|
selectBusTitle: '',
|
selectBusModel: '',
|
type: 1 ,//1添加 ，2编辑
|
selectBusKey:"",
|
selectDefaultIndex:{
|
roleType:0,
|
relationship:0,
|
gender:0,
|
isPrimaryContact:0,
|
ethnicity:0,
|
education:0,
|
partyEmber:0,
|
workStatus:0,
|
maritalStatus:0
|
}
|
}
|
},
|
created() {
|
this.getHeader()
|
},
|
mounted() {
|
},
|
onLoad(option) {
|
this.type = option.type;
|
// this.houseCode = data.houseCode
|
this.houseCode = uni.getStorageSync("siteInfo").houseCode;
|
if(option.type == 1){
|
|
this.addOrUpdateTitle = "保存"
|
this.getAllBizDict()
|
}
|
if(option.type == 2){
|
this.addOrUpdateTitle = "修改"
|
const data = JSON.parse(option.data)
|
this.getHouseholdInfo(data)
|
}
|
},
|
onShow() {
|
},
|
methods: {
|
async getAllBizDict(){
|
// 获取角色关系字典
|
await this.getBizDict('roleRelation',this.dataList.relationshipList)
|
// 获取角色字典
|
await this.getBizDict('roleType',this.dataList.roleList)
|
// 获取民族字典
|
await this.getBizDict('nationType',this.dataList.ethnicityList)
|
// 获取学历字典
|
await this.getBizDict('educationType',this.dataList.educationList)
|
// 获取工作状态字典
|
await this.getBizDict('workStatusType',this.dataList.workStatusList)
|
// 获取婚姻状态字典
|
await this.getBizDict('marriageStatusType',this.dataList.maritalStatusList)
|
},
|
// 获取业务字典
|
async getBizDict(code,list){
|
const param = {
|
code: code
|
}
|
const res = await bizDictionary(param)
|
res.data.forEach(e=>{
|
list.push({
|
name:e.dictValue,
|
value:Number(e.dictKey)
|
})
|
})
|
},
|
// 获取住户信息
|
async getHouseholdInfo(data){
|
// 获取所有字典
|
await this.getAllBizDict()
|
this.form = data
|
|
// this.roleTypeName = this.findObjValue(data.roleType, this.dataList.roleList)
|
// this.relationshipName = this.findObjValue(data.relationship, this.dataList.relationshipList)
|
// this.genderName = this.findObjValue(data.gender, this.dataList.genderList)
|
// this.isPrimaryContactName = this.findObjValue(data.isPrimaryContact, this.dataList.isPrimaryContactList)
|
// this.ethnicityName = this.findObjValue(data.ethnicity, this.dataList.ethnicityList)
|
// this.educationName = this.findObjValue(data.education, this.dataList.educationList)
|
// this.partyEmberName = this.findObjValue(data.partyEmber, this.dataList.partyEmberList)
|
// this.workStatusName = this.findObjValue(data.workStatus, this.dataList.workStatusList)
|
// this.maritalStatusName = this.findObjValue(data.maritalStatus, this.dataList.maritalStatusList)
|
|
this.roleTypeName = this.findObjValue(data.roleType, this.dataList.roleList).name
|
this.selectDefaultIndex.roleType = this.findObjValue(data.roleType, this.dataList.roleList).index;
|
this.relationshipName = this.findObjValue(data.relationship, this.dataList.relationshipList).name;
|
this.selectDefaultIndex.relationship = this.findObjValue(data.relationship, this.dataList.relationshipList).index;
|
this.genderName = this.findObjValue(data.gender, this.dataList.genderList).name;
|
this.selectDefaultIndex.gender = this.findObjValue(data.gender, this.dataList.genderList).index;
|
this.isPrimaryContactName = this.findObjValue(data.isPrimaryContact, this.dataList.isPrimaryContactList).name;
|
this.selectDefaultIndex.isPrimaryContact = this.findObjValue(data.isPrimaryContact, this.dataList.isPrimaryContactList).index;
|
this.ethnicityName = this.findObjValue(data.ethnicity, this.dataList.ethnicityList).name;
|
this.selectDefaultIndex.ethnicity = this.findObjValue(data.ethnicity, this.dataList.ethnicityList).index;
|
this.educationName = this.findObjValue(data.education, this.dataList.educationList).name;
|
this.selectDefaultIndex.education = this.findObjValue(data.education, this.dataList.educationList).index;
|
this.partyEmberName = this.findObjValue(data.partyEmber, this.dataList.partyEmberList).name;
|
this.selectDefaultIndex.partyEmber = this.findObjValue(data.partyEmber, this.dataList.partyEmberList).index;
|
this.workStatusName = this.findObjValue(data.workStatus, this.dataList.workStatusList).name;
|
this.selectDefaultIndex.workStatus = this.findObjValue(data.workStatus, this.dataList.workStatusList).index;
|
this.maritalStatusName = this.findObjValue(data.maritalStatus, this.dataList.maritalStatusList).name;
|
this.selectDefaultIndex.maritalStatus = this.findObjValue(data.maritalStatus, this.dataList.maritalStatusList).index;
|
|
},
|
// 显示选择弹框
|
showSelectBus(data, title, model, key) {
|
this.selectBusList = data
|
this.selectBusTitle = title
|
this.selectBusModel = model
|
this.selectBusKey = key
|
this.typeShow = true
|
},
|
//类型选择确认
|
typeSelect(item) {
|
const [ result ] = item.value
|
this[this.selectBusModel] = result.name
|
this.form[this.selectBusKey] = result.value
|
this.selectDefaultIndex[this.selectBusKey] = item.indexs[0];
|
this.typeShow = !this.typeShow
|
},
|
//表单提交
|
submit() {
|
this.$refs.form.validate().then(res => {
|
this.saveOrUpdate();
|
})
|
},
|
// 新增更新操作
|
async saveOrUpdate() {
|
this.form['houseCode'] = this.houseCode
|
// 字典解析
|
const roleTypeIndex = this.dataList.roleList.findIndex(item => item.name === this.roleTypeName)
|
const relationshipIndex = this.dataList.relationshipList.findIndex(item => item.name === this.relationshipName)
|
const genderIndex = this.dataList.genderList.findIndex(item => item.name === this.genderName)
|
const isPrimaryContactIndex = this.dataList.isPrimaryContactList.findIndex(item => item.name === this.isPrimaryContactName)
|
const ethnicityIndex = this.dataList.ethnicityList.findIndex(item => item.name === this.ethnicityName)
|
const educationIndex = this.dataList.educationList.findIndex(item => item.name === this.educationName)
|
const partyEmberIndex = this.dataList.partyEmberList.findIndex(item => item.name === this.partyEmberName)
|
const workStatusIndex = this.dataList.workStatusList.findIndex(item => item.name === this.workStatusName)
|
const maritalStatusIndex = this.dataList.maritalStatusList.findIndex(item => item.name === this.maritalStatusName)
|
|
this.form['roleType'] = roleTypeIndex >0 ? this.dataList.roleList[roleTypeIndex].value : ""
|
this.form['relationship'] = relationshipIndex >0 ? this.dataList.relationshipList[relationshipIndex].value: ""
|
this.form['gender'] = genderIndex >0 ?this.dataList.genderList[genderIndex].value: ""
|
this.form['isPrimaryContact'] = isPrimaryContactIndex >0 ?this.dataList.isPrimaryContactList[isPrimaryContactIndex].value: ""
|
this.form['ethnicity'] = ethnicityIndex >0 ?this.dataList.ethnicityList[ethnicityIndex].value: ""
|
this.form['education'] = educationIndex >0 ?this.dataList.educationList[educationIndex].value: ""
|
this.form['partyEmber'] = partyEmberIndex >0 ?this.dataList.partyEmberList[partyEmberIndex].value:""
|
this.form['workStatus'] = workStatusIndex >0 ?this.dataList.workStatusList[workStatusIndex].value:""
|
this.form['maritalStatus'] = maritalStatusIndex >0 ?this.dataList.maritalStatusList[maritalStatusIndex].value:""
|
|
const res = await saveOrUpdateHousehold(this.form)
|
if (res.code !== 200) {
|
uni.showToast({
|
title: "保存失败",
|
icon: "error",
|
duration: 1500
|
})
|
return
|
}
|
uni.showToast({
|
title: "保存成功",
|
icon: "success",
|
duration: 1500,
|
success: () => {
|
setTimeout(() => {
|
uni.navigateBack()
|
}, 1500)
|
}
|
})
|
},
|
findObjValue(value, obj) {
|
// if(value){
|
// const res = obj.find(item => {
|
// return item.value == value
|
// })
|
// return res.name
|
// }
|
// return ""
|
let data = {
|
index: "",
|
name:""
|
}
|
for(let i =0,ii = obj.length;i<ii;i++){
|
if(value == obj[i].value){
|
data.index = i;
|
data.name = obj[i].name;
|
}
|
}
|
return data;
|
|
|
},
|
|
delAction(){
|
uni.showModal({
|
title:"提示！",
|
content:"是否要删除该家人信息？",
|
success:(res)=>{
|
if(res.confirm){
|
this.ddelActionRequest()
|
}
|
}
|
})
|
},
|
ddelActionRequest(){
|
removeHousehold(this.form.id).then(res=>{
|
if(res.code == 200){
|
setTimeout(()=>{
|
uni.navigateBack();
|
},1000)
|
}else {
|
uni.showToast({
|
title: "删除失败",
|
icon: "error",
|
duration: 1500
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.container {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
display: flex;
|
flex-direction: column;
|
background: #F5F5F5;
|
|
|
.main {
|
// position: relative;
|
// height: 0;
|
// flex: 1;
|
display: flex;
|
flex-direction: column;
|
|
.content {
|
// height: 0;
|
// flex: 1;
|
// overflow-y: auto;
|
padding-bottom: 160rpx;
|
// padding-bottom: 36rpx;
|
}
|
|
|
.btn-group {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
height: 116rpx;
|
position: fixed;
|
left: 0;
|
bottom: 0;
|
width: 100%;
|
}
|
}
|
|
// .box-title {
|
// padding: 10rpx 10rpx;
|
// }
|
|
.event-info {
|
background-color: #ffffff;
|
margin: 20rpx 30rpx;
|
padding: 30rpx;
|
border-radius: 8rpx;
|
/deep/ .u-form-item {
|
background-color: #ffffff;
|
padding: 5px 20px;
|
border-bottom: 1rpx solid #eff1f3;
|
}
|
|
}
|
|
.event-pic {
|
background-color: #ffffff;
|
padding: 40rpx 30rpx;
|
}
|
}
|
.footer {
|
width: 100%;
|
padding: 20rpx 30rpx;
|
box-sizing: border-box;
|
z-index: 999;
|
position:fixed;
|
bottom:0;
|
left:0;
|
backgroun-color:#fff;
|
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
|
box-shadow: 0rpx 0rpx 10rpx 1rpx rgba(0,0,0,0.1);
|
.footer-btn {
|
width:48%;
|
height: 78rpx;
|
line-height: 78rpx;
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
font-size: 32rpx;
|
color: #fff;
|
}
|
|
.add-btn {
|
width: 100%;
|
background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
|
}
|
|
.del-btn {
|
background: linear-gradient(163deg, #FE6C5C 0%, #EA1F1F 99%);
|
|
}
|
|
.save-btn {
|
background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
|
}
|
}
|
</style>
|
