345 lines
10 KiB
Vue
345 lines
10 KiB
Vue
<template>
|
|
<view id="myapp" class="bodyA">
|
|
<!-- 滚动区域 -->
|
|
<view class="content">
|
|
<van-form @submit="onSubmit">
|
|
<van-cell-group class="vanCellGroup" inset>
|
|
<van-field class="required" v-model="form.name" label="姓名" placeholder="请输入" :rules="rulesObj.name">
|
|
</van-field>
|
|
<van-field v-model="form.sex" label="性别" disabled placeholder="---">
|
|
</van-field>
|
|
<van-field class="required" v-model="form.phone" label="手机号" placeholder="请输入"
|
|
:rules="rulesObj.phone" type="number" maxlength="11">
|
|
</van-field>
|
|
<van-field class="required" v-model="form.idcard" label="身份证" placeholder="请输入"
|
|
:rules="rulesObj.idcard" type="text">
|
|
</van-field>
|
|
<van-field class="required" v-model="dicObj.relation[form.relation]" label="与本人关系" is-link readonly
|
|
placeholder="请选择" :rules="rulesObj.relation" @click="relationFlag=true"></van-field>
|
|
</van-cell-group>
|
|
|
|
|
|
|
|
<view class="footer">
|
|
<van-button class="footerBtn delBtn" round block type="primary" @click.stop="del" v-if="!isAdd">删除
|
|
</van-button>
|
|
<van-button class="footerBtn" round block type="primary" native-type="submit" v-if="!showLoading">提交
|
|
</van-button>
|
|
<van-button class="footerBtn" round block loading loading-text="加载中..." loading-type color="#C0C0C0"
|
|
v-if="showLoading" disabled></van-button>
|
|
</view>
|
|
|
|
</van-form>
|
|
</view>
|
|
|
|
<!-- <van-popup v-model:show="sexFlag" round position="bottom">
|
|
<van-picker show-toolbar :columns="columns" value-key="typeName" @cancel="sexFlag = false"
|
|
@confirm="onConfirm">
|
|
</van-picker>
|
|
</van-popup> -->
|
|
|
|
<van-popup v-model:show="relationFlag" round position="bottom">
|
|
<van-picker show-toolbar :columns="columns2" value-key="typeName" @cancel="relationFlag = false"
|
|
@confirm="onConfirm2">
|
|
</van-picker>
|
|
</van-popup>
|
|
<!-- 底部 -->
|
|
<!-- <view class="footer">
|
|
<van-button class="footerBtn">按钮</van-button>
|
|
</view> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
removeJtcy,detailJtcy,editJtcy,addJtcy
|
|
} from '@/common/api.js'
|
|
import {
|
|
callbackRequest
|
|
} from '@/common/util.js'
|
|
import {Encrypt2} from "@/common/utils";
|
|
import CryptoJS from "@/common/crypto-js";
|
|
export default {
|
|
name: "problem",
|
|
data() {
|
|
return {
|
|
id: null,
|
|
isDel: false,
|
|
isAdd: false,
|
|
loadingFlag: '',
|
|
loadingFlag_Tm: 'x',
|
|
// code
|
|
// columns: [
|
|
// { typeName: '男' },
|
|
// { typeName: '女' },
|
|
// ],
|
|
columns2: [
|
|
{ typeName: '配偶', type: 1 },
|
|
{ typeName: '父母', type: 2 },
|
|
{ typeName: '子女', type: 3 },
|
|
],
|
|
// sexFlag: false,
|
|
relationFlag: false,
|
|
|
|
rulesObj: {
|
|
name: [{ required: true, message: '姓名不能为空' }],
|
|
// sex: [{ required: true, message: '性别不能为空' }],
|
|
idcard: [
|
|
{ required: true, message: '身份证不能为空' },
|
|
{ pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, message: '请填写正确的身份证', trigger: 'onBlur' }
|
|
],
|
|
phone: [
|
|
{ required: true, message: '手机号不能为空', trigger: 'onBlur' },
|
|
{ pattern: /^1((34[0-8])|(8\d{2})|(([35][0-35-9]|4[579]|66|7[35678]|9[1389])\d{1}))\d{7}$/, message: '请填写正确的手机号', trigger: 'onBlur' }
|
|
], // 手机号
|
|
relation: [{ required: true, message: '关系不能为空' }],
|
|
},
|
|
showLoading: false,
|
|
form: {
|
|
name: '', // 姓名
|
|
sex: '', // 性别
|
|
phone: '', // 手机
|
|
idcard: '', // 身份证
|
|
relation: '', // 关系
|
|
},
|
|
dicObj: {
|
|
// sex: {
|
|
// 1: '男',
|
|
// 2: '女',
|
|
// },
|
|
relation: {
|
|
1: '配偶',
|
|
2: '父母',
|
|
3: '子女',
|
|
}
|
|
},
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
// this.getUserInfo();
|
|
|
|
let urlData = options;
|
|
console.log(urlData);
|
|
this.id = urlData.id
|
|
this.isAdd = urlData.id == 'null'
|
|
this.isAdd ? this.loadingFlag = 'x' : this.getData(urlData.id)
|
|
},
|
|
methods: {
|
|
//
|
|
del() {
|
|
const that = this;
|
|
this.isDel = true;
|
|
|
|
uni.showModal({
|
|
title: '删除成员',
|
|
content: '确认删除该成员？',
|
|
success: res => {
|
|
if (res.confirm) {
|
|
that.loadingFlag_Tm = ''
|
|
// on confirm
|
|
let params={
|
|
method:removeJtcy,
|
|
memberId: that.id,
|
|
}
|
|
callbackRequest(params).then((res) => {
|
|
if (res.returnCode == '1') {
|
|
setTimeout(() => {
|
|
window.history.go(-1)
|
|
}, 2000)
|
|
}
|
|
uni.showToast({
|
|
title: res.returnMsg,//vant.toast方法原来的内容
|
|
icon: 'none',
|
|
forbidClick: true,
|
|
duration: 2000
|
|
})
|
|
that.loadingFlag_Tm = 'x';
|
|
that.isDel = false;
|
|
})
|
|
}
|
|
},
|
|
})
|
|
// vant.Dialog.confirm({
|
|
// message: '确认删除该成员？',
|
|
// }).then(() => {
|
|
// that.loadingFlag_Tm = ''
|
|
// // on confirm
|
|
// request.removeJtcy({ memberId: that.id }, function (res) {
|
|
// if (res.returnCode == '1') {
|
|
// setTimeout(() => {
|
|
// window.history.go(-1)
|
|
// }, 2000)
|
|
// }
|
|
// vant.Toast({
|
|
// message: res.returnMsg,
|
|
// forbidClick: true,
|
|
// duration: 2000
|
|
// })
|
|
// that.loadingFlag_Tm = 'x';
|
|
// that.isDel = false;
|
|
// })
|
|
// }).catch(() => {
|
|
// that.isDel = false;
|
|
// })
|
|
|
|
},
|
|
// 数据回显
|
|
getData(id) {
|
|
const that = this;
|
|
let params={
|
|
method:detailJtcy,
|
|
memberId: id,
|
|
}
|
|
callbackRequest(params).then((res) => {
|
|
console.log(res);
|
|
if (res.returnCode == 1) {
|
|
let resData = res.returnData;
|
|
let form = that.form;
|
|
form.name = resData.memberName
|
|
form.sex = resData.sex
|
|
form.phone = resData.memberPhone
|
|
//form.idcard = resData.memberIdCard
|
|
form.idcard = resData.memberIdCard
|
|
form.relation = resData.memberRelation
|
|
|
|
that.loadingFlag = 'x';
|
|
}
|
|
})
|
|
},
|
|
// 选择与本人关系 确认
|
|
onConfirm2(e) {
|
|
this.form.relation = e.type
|
|
this.relationFlag = false
|
|
},
|
|
// 选择性别 确认
|
|
// onConfirm(e) {
|
|
// console.log('xxxxxxxxx', this.sexFlag, e);
|
|
// this.form.sex = e.typeName
|
|
// this.sexFlag = false;
|
|
// },
|
|
|
|
// 修改家庭成员信息
|
|
changeDataFn() {
|
|
const that = this;
|
|
let form = this.form;
|
|
let params = {
|
|
method:editJtcy,
|
|
memberName: form.name,
|
|
memberIdCard: Encrypt2(form.idcard),
|
|
memberPhone: form.phone,
|
|
memberRelation: form.relation,
|
|
memberId: this.id,
|
|
};
|
|
console.log(params.memberIdCard)
|
|
// return
|
|
callbackRequest(params).then((res) => {
|
|
console.log(res);
|
|
let msg;
|
|
if (res.returnCode == 1) {
|
|
// msg= res.returnMsg
|
|
setTimeout(() => {
|
|
window.history.go(-1)
|
|
}, 2100);
|
|
}
|
|
uni.showToast({
|
|
title: res.returnMsg,//vant.toast方法原来的内容
|
|
icon: 'none',
|
|
forbidClick: true,
|
|
duration: 2000
|
|
})
|
|
that.loadingFlag_Tm = 'x';
|
|
that.showLoading = false;
|
|
})
|
|
},
|
|
|
|
// 添加家庭成员
|
|
addFn() {
|
|
|
|
const that = this;
|
|
let form = that.form;
|
|
let params = {
|
|
method:addJtcy,
|
|
memberName: form.name,
|
|
//memberIdCard: form.idcard,
|
|
memberIdCard: Encrypt2(form.idcard),
|
|
memberPhone: form.phone,
|
|
memberRelation: form.relation,
|
|
// memberId: getUrlRequest().id,
|
|
};
|
|
console.log('memberIdCard',params.memberIdCard)
|
|
callbackRequest(params).then((res) => {
|
|
console.log(params)
|
|
let msg;
|
|
if (res.returnCode == 1) {
|
|
msg = '新建成功'
|
|
setTimeout(() => {
|
|
window.history.go(-1)
|
|
}, 2100);
|
|
} else {
|
|
msg = res.returnMsg
|
|
}
|
|
uni.showToast({
|
|
title: msg,//vant.toast方法原来的内容
|
|
icon: 'none',
|
|
forbidClick: true,
|
|
duration: 2000
|
|
})
|
|
that.loadingFlag_Tm = 'x';
|
|
that.showLoading = false;
|
|
})
|
|
},
|
|
// 提交
|
|
onSubmit() {
|
|
console.log('提交');
|
|
if (this.isDel) return
|
|
this.showLoading = true;
|
|
this.loadingFlag_Tm = '';
|
|
let isAdd = this.isAdd;
|
|
isAdd ? this.addFn() : this.changeDataFn()
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
|
|
.content {
|
|
font-size: .38*74upx;
|
|
color: #0e1a24;
|
|
padding: .32*74upx;
|
|
padding-bottom: 2*74upx;
|
|
}
|
|
|
|
.vanCellGroup {
|
|
border-radius: .24*74upx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.vanCellGroup input {
|
|
border: none;
|
|
}
|
|
|
|
.tips {
|
|
font-size: .38*74upx;
|
|
color: #fb8107;
|
|
padding: .34*74upx .2*74upx;
|
|
background-color: #fff;
|
|
border-radius: .24*74upx;
|
|
margin-top: .24*74upx;
|
|
font-weight: bold;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.footer {
|
|
display: flex;
|
|
}
|
|
|
|
.footer .delBtn {
|
|
margin-right: .2*74upx;
|
|
background-color: #f2f6fa;
|
|
color: #97a5b1;
|
|
background-image: none;
|
|
border: none;
|
|
}
|
|
</style> |