You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
505 lines
13 KiB
505 lines
13 KiB
<template>
|
|
<view class="container" style="min-height:100vh">
|
|
<view class="header" @click="handleBack">
|
|
<image class="header-back-img" src="../../imgs/back.png"></image>
|
|
{{ registerType == 1 ? '失能老年人医养结合和健康服务登记' : '高龄老人医养结合服务登记'}}
|
|
<view></view>
|
|
</view>
|
|
<view class="view-step">
|
|
<view>
|
|
<image src="../../imgs/icon_wanc.png" class="step-img"></image>
|
|
<p style="color:#3D3D3D">信息</p>
|
|
</view>
|
|
<h1></h1>
|
|
<view>
|
|
<image src="../../imgs/icon_moren.png" class="step-img"></image>
|
|
<p>评估</p>
|
|
</view>
|
|
<h1></h1>
|
|
<view>
|
|
<image src="../../imgs/icon_moren.png" class="step-img"></image>
|
|
<p>筛查</p>
|
|
</view>
|
|
<h1></h1>
|
|
<view>
|
|
<image src="../../imgs/icon_moren.png" class="step-img"></image>
|
|
<p>登记</p>
|
|
</view>
|
|
<h1></h1>
|
|
<view>
|
|
<image src="../../imgs/icon_moren.png" class="step-img"></image>
|
|
<p>确认</p>
|
|
</view>
|
|
</view>
|
|
<view style="flex: 1; position: relative;margin-top: 20px;">
|
|
<scroll-view class="view-scroll" scroll-y="true" :lower-threshold="50" scroll-with-animation >
|
|
<view class="view-form">
|
|
<p class="view-title" style="margin-bottom: 0;">老人信息</p>
|
|
<u-form :model="form" :rules="rules" ref="uForm" label-width="100">
|
|
<u-form-item class="view-form-item" label="姓名" prop="name">
|
|
<u-input class='form-item-input' v-model="form.name" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="身份证号" prop="idCard">
|
|
<u-input class='form-item-input' v-model="form.idCard" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="联系方式" prop="phone">
|
|
<u-input class='form-item-input' v-model="form.phone" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="家庭住址" prop="address">
|
|
<u-input class='form-item-input' v-model="form.address" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<p style="color: #303133;font-size: 15px;line-height: 52px;">照片</p>
|
|
<view class="uploat_img">
|
|
<view class="uploat_img-ul">
|
|
<!-- <view class="uploat_img-li" v-for="(item,index) in form.imgList" :key="index">
|
|
<image src="../../del.png" mode="" class="img-li-del" @click="handleImgDel(index, 1)"></image>
|
|
</view> -->
|
|
<u-upload
|
|
@afterRead="afterRead"
|
|
name="1">
|
|
<image v-if="form.pic" :src="imgurl + form.pic" style="max-width: 80px;max-height: 80px;" ></image>
|
|
</u-upload>
|
|
</view>
|
|
</view>
|
|
</u-form>
|
|
</view>
|
|
<view class="view-form">
|
|
<p class="view-title" style="margin-bottom: 0;">老人信息</p>
|
|
<u-form :model="form" :rules="rules" ref="uForm1" label-width="100">
|
|
<u-form-item class="view-form-item" label="监护人姓名" prop="guardianName">
|
|
<u-input class='form-item-input' v-model="form.guardianName" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="身份证号" prop="guardianIdcard">
|
|
<u-input class='form-item-input' v-model="form.guardianIdcard" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="联系方式" prop="guardianPhone">
|
|
<u-input class='form-item-input' v-model="form.guardianPhone" placeholder="请填写"/>
|
|
</u-form-item>
|
|
<u-form-item class="view-form-item" label="家庭住址" prop="guardianAddress">
|
|
<u-input class='form-item-input' v-model="form.guardianAddress" placeholder="请填写"/>
|
|
</u-form-item>
|
|
</u-form>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="view-modal-but" @click="handleSubmit">下一步</view>
|
|
<u-toast ref="uToast"></u-toast>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import config from '@/common/config'
|
|
import {queryById,queryAdd,queryUpd,upload} from '@/common/api.js';
|
|
export default {
|
|
data() {
|
|
return {
|
|
imgurl:config.baseUrl,
|
|
fileList:[],
|
|
rules: {
|
|
name:[{
|
|
required: true,
|
|
message: '请输入姓名',
|
|
trigger: ['blur']
|
|
}],
|
|
age:[{
|
|
required: true,
|
|
message: '请输入年龄',
|
|
trigger: ['blur']
|
|
}],
|
|
idCard:[{
|
|
required: true,
|
|
message: '请输入身份证号',
|
|
trigger: ['blur']
|
|
},{
|
|
// 自定义验证函数
|
|
validator: (rule, value, callback) => {
|
|
let regs = /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/;
|
|
if (!regs.test(this.form.idCard)) {
|
|
return false
|
|
}else{
|
|
return true
|
|
}
|
|
},
|
|
message: '身份证号格式不正确',
|
|
// 触发器可以同时用blur和change
|
|
trigger: ['change','blur'],
|
|
},
|
|
],
|
|
guardianIdcard:[{
|
|
// 自定义验证函数
|
|
validator: (rule, value, callback) => {
|
|
let regs = /^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/;
|
|
if (!regs.test(this.form.guardianIdcard) && this.form.guardianIdcard) {
|
|
return false
|
|
}else{
|
|
return true
|
|
}
|
|
},
|
|
message: '身份证号格式不正确',
|
|
required: true,
|
|
// 触发器可以同时用blur和change
|
|
trigger: ['change','blur'],
|
|
},
|
|
],
|
|
phone:[{
|
|
required: true,
|
|
message: '请输入联系方式',
|
|
trigger: ['blur']
|
|
},{
|
|
// 自定义验证函数
|
|
validator: (rule, value, callback) => {
|
|
let regs = /^1[3-9]\d{9}$/;
|
|
if (!regs.test(this.form.phone)) {
|
|
return false
|
|
}else{
|
|
return true
|
|
}
|
|
},
|
|
message: '格式不正确',
|
|
// 触发器可以同时用blur和change
|
|
trigger: ['change','blur'],
|
|
}
|
|
],
|
|
guardianPhone:[{
|
|
// 自定义验证函数
|
|
validator: (rule, value, callback) => {
|
|
let regs = /^1[3-9]\d{9}$/;
|
|
if (!regs.test(this.form.guardianPhone) && this.form.guardianPhone) {
|
|
return false
|
|
}else{
|
|
return true
|
|
}
|
|
},
|
|
message: '格式不正确',
|
|
// 触发器可以同时用blur和change
|
|
trigger: ['change','blur'],
|
|
}
|
|
],
|
|
phone:[{
|
|
required: true,
|
|
message: '请输入联系方式',
|
|
trigger: ['blur']
|
|
},{
|
|
// 自定义验证函数
|
|
validator: (rule, value, callback) => {
|
|
let regs = /^1[3-9]\d{9}$/;
|
|
if (!regs.test(this.form.phone)) {
|
|
return false
|
|
}else{
|
|
return true
|
|
}
|
|
},
|
|
message: '格式不正确',
|
|
// 触发器可以同时用blur和change
|
|
trigger: ['change','blur'],
|
|
}
|
|
],
|
|
|
|
},
|
|
modalShow: false,
|
|
token: uni.getStorageSync('userToken'),
|
|
action: config.baseUrl + '/upload',
|
|
guardianForm:{},
|
|
form:{
|
|
imgList:[],
|
|
},
|
|
patientId:0, // 患者ID
|
|
patientData:{}, //患者详情
|
|
registerType:1
|
|
}
|
|
},
|
|
methods: {
|
|
// 新增图片
|
|
async afterRead(event) {
|
|
console.log()
|
|
// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
|
|
let lists = [].concat(event.file)
|
|
console.log(lists)
|
|
let fileListLen = this.fileList.length
|
|
for (let i = 0; i < lists.length; i++) {
|
|
const result = await this.uploadFilePromise(lists[i].url)
|
|
}
|
|
},
|
|
uploadFilePromise(url) {
|
|
return new Promise((resolve, reject) => {
|
|
let a = uni.uploadFile({
|
|
url: config.baseUrl + '/common/upload', // 仅为示例，非真实的接口地址
|
|
header : { Authorization: `Bearer ${this.token}` },
|
|
filePath: url,
|
|
name: 'file',
|
|
success: (res) => {
|
|
res = JSON.parse(res.data)
|
|
if(res.code == 200){
|
|
this.form.pic = res.fileName
|
|
this.fileList = [
|
|
{
|
|
url: config.baseUrl + res.fileName,
|
|
}
|
|
]
|
|
console.log(this.fileList)
|
|
}else{
|
|
this.$refs.uToast.show({
|
|
type: 'error',
|
|
icon: false,
|
|
message: "上传失败",
|
|
})
|
|
}
|
|
}
|
|
});
|
|
})
|
|
},
|
|
// 通过ID查询患者详情
|
|
async getQueryById(){
|
|
this.fileList = []
|
|
const res = await queryById({id:this.patientId})
|
|
if(res.code == 200){
|
|
let { id,name,sex,age,idCard,phone,address,guardianName, guardianIdcard, guardianPhone, guardianAddress,pic} = res.data
|
|
this.form = {
|
|
id, name, sex, age, idCard, phone, address,
|
|
guardianName, guardianIdcard, guardianPhone, guardianAddress,
|
|
pic: pic || ''
|
|
}
|
|
if(this.form.pic){
|
|
this.fileList = [
|
|
{
|
|
url: config.baseUrl + this.form.pic,
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
// 删除图片
|
|
handleImgDel(_index, _type) {
|
|
this.form.imgList.splice(_index, 1);
|
|
},
|
|
// 提交信息
|
|
handleSubmit(){
|
|
this.$refs.uForm.validate().then(async formRes =>{
|
|
const res = await queryUpd(this.form)
|
|
if(res.code == 200){
|
|
// this.$refs.uToast.show({
|
|
// type: 'success',
|
|
// icon: false,
|
|
// message: "提交成功",
|
|
// })
|
|
uni.navigateTo({ url: `/pages/healthService/healthService2?elderlyId=${this.patientId}&djType=${this.registerType}` });
|
|
}
|
|
})
|
|
},
|
|
// 选中某个单选框时，由radio时触发
|
|
radioChange(_item,row) {
|
|
_item.options.forEach(i=>{
|
|
i.disabled = false
|
|
})
|
|
row.disabled = true
|
|
// 循环计算分值
|
|
let sum = 0
|
|
this.testList.forEach(i =>{
|
|
i.options.forEach(j =>{
|
|
if(j.disabled){
|
|
sum += j.score
|
|
console.log('sum',sum)
|
|
}
|
|
})
|
|
})
|
|
|
|
this.form.codeList.SHZLNLPG = sum
|
|
},
|
|
handleShow(){
|
|
this.modalShow = true
|
|
console.log(this.modalShow)
|
|
},
|
|
// 返回上一步
|
|
handleBack(){
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
});
|
|
},
|
|
},
|
|
created() {
|
|
|
|
},
|
|
async mounted (){
|
|
},
|
|
onLoad(data) {
|
|
let {id,type} = data
|
|
this.patientId = id
|
|
this.registerType = type
|
|
console.log(this.registerType)
|
|
this.getQueryById()
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.view-title{
|
|
font-size: 16px;
|
|
color: #FF981F;
|
|
margin-bottom: 10px;
|
|
}
|
|
.view-modal-but{
|
|
height: 45px;
|
|
background: #FF981F;
|
|
border-radius: 23px;
|
|
font-size: 15px;
|
|
color: #FFFFFF;
|
|
line-height: 45px;
|
|
text-align: center;
|
|
margin-top: 14px;
|
|
font-size: 15px;
|
|
color: #FFFFFF;
|
|
}
|
|
.view-modal-ul{
|
|
.view-modal-li{
|
|
|
|
}
|
|
}
|
|
.li-options-item{
|
|
margin-bottom: 10px;
|
|
span{
|
|
font-size: 15px;
|
|
color: #555555;
|
|
}
|
|
}
|
|
.view-modal{
|
|
.view-modal-h1{
|
|
font-size: 20px;
|
|
color: #3D3D3D;
|
|
text-align: center;
|
|
}
|
|
.modal-li-p{
|
|
font-size: 17px;
|
|
color: #3D3D3D;
|
|
margin-bottom: 20px;
|
|
}
|
|
.view-modal-p{
|
|
font-size: 12px;
|
|
color: #999999;
|
|
margin: 10px 0;
|
|
}
|
|
}
|
|
.view-form1{
|
|
margin-top: 20px;
|
|
.view-form-li1{
|
|
p{
|
|
flex:1
|
|
}
|
|
.form-li-right{
|
|
view{
|
|
width: 100%;
|
|
text-align: right;
|
|
color:#FF981F;
|
|
line-height: 52px;
|
|
|
|
}
|
|
.li-right-unit{
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.view-form{
|
|
padding: 14px;
|
|
background: #fff;
|
|
border-radius: 10px;
|
|
margin-bottom: 10px;
|
|
.view-form-title{
|
|
font-size: 16px;
|
|
color:#FF981F;
|
|
margin-bottom: 10px;
|
|
}
|
|
.view-form-ul{
|
|
.view-form-li{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #E2E2E2;
|
|
.form-li-right{
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
.form-li-input{
|
|
flex: 1;
|
|
border: none;
|
|
text-align: right;
|
|
height: 40px;
|
|
}
|
|
}
|
|
p{
|
|
font-size: 18px;
|
|
width: 120px;
|
|
}
|
|
}
|
|
// .view-form-li:last-child{
|
|
// border: none;
|
|
// }
|
|
}
|
|
}
|
|
.uploat_img{
|
|
// padding: 14px 0 0 22px;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
// margin-bottom: 10px ;
|
|
.uploat_img-ul{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
.uploat_img-li{
|
|
width: 90px !important;
|
|
height: 90px !important;
|
|
border-radius: 10px !important;
|
|
border: 1px dashed #CACACA;
|
|
margin-right: 18px;
|
|
margin-bottom: 14px;
|
|
position: relative;
|
|
.img-li-del{
|
|
position: absolute;
|
|
top: 4px;
|
|
right: 4px;
|
|
width: 14px;
|
|
height: 14px;
|
|
}
|
|
}
|
|
}
|
|
|
|
p{
|
|
font-size: 16px;
|
|
color:#FF981F;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
|
|
.header{
|
|
font-size: 16px;
|
|
color: #3D3D3D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.header-back-img{
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
view{
|
|
width: 20px;
|
|
}
|
|
}
|
|
.container{
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-sizing: border-box;
|
|
padding: 46px 16px 20px 16px;
|
|
background: linear-gradient(130deg,#ffe8cc 8%,#fcfcfc,#fcfcfc,#fcfcfc);
|
|
}
|
|
</style>
|
|
<style>
|
|
.u-modal__button-group__wrapper{
|
|
display: none !important;
|
|
}
|
|
.view-scroll {
|
|
height: 100%;
|
|
position: absolute;
|
|
}
|
|
.u-radio-group--row{
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
</style>
|