nurseWeChatAppletUI/pages/information/information.vue
2023-01-29 10:42:34 +08:00

327 lines
9.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="app">
<view class="" style="background-color: #F4F5F7;height: 20rpx;width:100%">
</view>
<view class="userinfo info">
<view class="item">
<span>姓名:</span>
<u-input :clearable='false' v-model="query.patientName" type="text" placeholder='请输入' maxlength='5' />
</view>
<!-- <view class="item">
<span>电话:</span>
<u-input :clearable='false' v-model="query.phone" maxlength='11' type="text" placeholder='请输入' />
</view> -->
<view class="item">
<span>身份证号:</span>
<u-input :clearable='false' v-model="query.cardNo" type="text" placeholder='请输入' maxlength='18' />
</view>
<view class="item" @tap='showPicker'>
<span>所属区域:</span>
<view class="address">{{address}}</view>
</view>
<view class="item">
<span>详细地址:</span>
<u-input :clearable='false' v-model="query.address" type="text" placeholder='小区、单元、门牌号' />
</view>
<view class="item" @tap='getAddress()'>
<span>所在位置:</span>
<view class="address" style="">
{{query.locationName}}
</view>
</view>
</view>
<view class="">
<m-city style='z-index: 10076;' :provinceData="list" headTitle="地区选择" ref="cityPicker"
@funcValue="getpickerParentValue" pickerSize="4">
</m-city>
</view>
<view class="info">
<view class="service">
<view class="title">
所属服务
</view>
<view class="Multiplechoice">
<view :class="query.nurseTypeIdList.find(e => e == item.id)?'choices':'choice'"
v-for="(item,index) in getNurseTypelist" :key="item.id" @tap="addnurseType(item)">
{{item.nurseTypeName}}
</view>
<view @tap="godisease(item)"
:class="query.nurseTypeIdList.find(e => e == item.id)?'choices':'choice'"
v-for="(item,index) in medicalcarelist" :key="item.id">
{{item.nurseTypeName}}
</view>
</view>
</view>
</view>
<view class="radio-content">
<view class="radio-right" @tap="changeRadio">
<view class="radio" :class="radio == 2 ? 'radio-default':''">
<view :class="radio == 2 ? 'radio-active':''"></view>
</view>
</view>
<view class="agreement">我已阅读并同意<text @tap='maskshow=true'
style="color: #000000;border-bottom: 1rpx solid #000000;">《用户协议》</text>
</view>
</view>
<view class="btn" @tap='informationinfo'>
提交
</view>
<u-toast ref="uToast" />
<!-- //用户协议 -->
<u-mask :show="maskshow" class='mask' @click='maskshow=false'>
<view class="Agreement">
<view class="title">
用户协议与隐私政策
</view>
<scroll-view scroll-y="true" class="scroll-Y" style="">
<contenttext></contenttext>
</scroll-view>
<view class="cancel" @tap='maskshow=false'>
取消
</view>
<view class="determine" @tap='tapradio'>
确定并同意
</view>
</view>
</u-mask>
</view>
</template>
<script>
import {
getRegionAndStreetInfo,
getNurseType,
information
} from '@/api/information/index.js'
import contenttext from './text.vue'
import {
getSubordinateRegions,
} from '@/api/modifyAddress/modifyAddress.js';
import gkcity from "../m-city/m-city.vue";
export default {
components: {
contenttext,
"m-city": gkcity
},
data() {
return {
radio: 1,
// chooseLocation: '', //地图选址
arealist: [], //区街道list
list: [{
id: "",
localName: "请选择",
children: [],
}, ],
areashow: false, //经纬度开关
maskshow: false, //用户协议
getNurseTypelist: [], //护理类型数组
medicalcarelist: [], //医疗护理数组
address: '', //页面所属区域
query: { //信息请求数组
patientName: "",
cardNo: "",
phone: "",
address: "",
areaCode: "",
homeLongitude: "",
homeLatitude: "",
nurseTypeIdList: [],
diseaseInfoList: [],
patientId: '',
locationName: '',
},
timer: null,
addresslength: null,
};
},
methods: {
//提交信息
informationinfo() {
var that = this
if (this.addresslength) {
if (this.addresslength.length > 2) {
try {
const value = uni.getStorageSync('phone');
if (value) {
that.query.phone = value
if (that.radio == 1) {
that.$refs.uToast.show({
title: '请审核并同意用户协议',
type: 'error'
})
} else {
information(that.query).then(res => {
if (res.code == 200) {
that.$refs.uToast.show({
title: '完善信息成功',
type: 'success',
duration: '1500'
})
if (that.timer) {
clearTimeout(that.timer)
}
that.timer = setTimeout(e => {
uni.navigateBack({
delta: 1
})
}, 1500)
} else if (res.code == 500) {
that.$refs.uToast.show({
title: res.msg,
type: 'error',
})
}
})
}
}
} catch (e) {}
} else {
that.$refs.uToast.show({
title: '所属区域应选择所在的区或街道,请重新选择!',
type: 'error'
})
}
} else {
that.$refs.uToast.show({
title: '所属区域应选择所在的区或街道,请重新选择!',
type: 'error'
})
}
},
//获取所在位置
getAddress() {
var that = this;
uni.chooseLocation({
success: function(location) {
that.query.locationName = location.address
that.query.homeLongitude = location.longitude;
that.query.homeLatitude = location.latitude;
}
});
},
// getAddress() {
// uni.getLocation({
// type: 'wgs84',
// success: function(res) {
// const key = '3VABZ-6LZWK-YPAJ3-AMQED-D7RUK-VPB37'; //使用在腾讯位置服务申请的key
// const referer = '泉医到家'; //调用插件的app的名称
// const location = JSON.stringify({
// latitude: 39.89631551,
// longitude: 116.323459711
// });
// wx.navigateTo({
// url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer
// });
// }
// });
// },
//护理类型请求
getNurseTypeInfo() {
getNurseType().then(res => {
this.medicalcarelist = res.data.filter(e => e.nurseTypeName == '医疗护理')
this.getNurseTypelist = res.data.filter(e => e.nurseTypeName != '医疗护理')
})
},
//区街道
areaInfo() {
getSubordinateRegions().then(res => {
this.list = res.data;
})
},
// 三级地址联动回调
getpickerParentValue(e) {
this.addresslength = e
if (e.length == 4) {
this.address = e[0].localName + e[1].localName + e[2].localName + e[3]
.localName
this.query.areaCode = e[3].id
} else if (e.length == 3) {
this.address = e[0].localName + e[1].localName + e[2].localName
this.query.areaCode = e[2].id
} else if (e.length == 2) {
this.address = e[0].localName + e[1].localName
this.query.areaCode = e[1].id
} else if (e.length == 1) {
this.address = e[0].localName
this.query.areaCode = e[0].id
} else {
this.address = ''
this.query.areaCode = ''
}
},
// 显示三级地址联动
showPicker() {
this.areashow = true
this.$refs.cityPicker.show();
},
//点击所需服务
addnurseType(item) {
if (this.query.nurseTypeIdList.findIndex(e => e == item.id) == -1) {
this.query.nurseTypeIdList.push(item.id)
} else {
this.query.nurseTypeIdList = this.query.nurseTypeIdList.filter(e => e != item.id)
}
},
godisease(item) {
uni.navigateTo({
url: `/pages/disease/disease?diseaseInfoList=${JSON.stringify(this.query.diseaseInfoList)}`
})
},
changeRadio() {
if (this.radio == 1) {
this.radio = 2;
} else {
this.radio = 1;
}
},
tapradio() {
this.radio = 2;
this.maskshow = false;
},
},
//进入界面加载
onLoad() {
let that = this
try {
const value = uni.getStorageSync('patientId');
if (value) {
that.query.patientId = value
}
} catch (e) {}
this.areaInfo()
this.getNurseTypeInfo();
},
//带参返回
// 从地图选点插件返回后在页面的onShow生命周期函数中能够调用插件接口取得选点结果对象
onShow() {
var that = this
// const chooseLocation = requirePlugin('chooseLocation');
// const location = chooseLocation.getLocation(); // 如果点击确认选点按钮则返回选点结果对象否则返回null
// if (location) {
// that.query.locationName = location.address
// that.chooseLocation = location.address
// that.query.homeLongitude = location.longitude;
// that.query.homeLatitude = location.latitude;
// }
uni.$on('disease', function(data) {
that.query.diseaseInfoList = JSON.parse(data.disease)
if (that.query.diseaseInfoList.length > 0) {
that.medicalcarelist.forEach(e => {
if (that.query.nurseTypeIdList.findIndex(el => el == e.id) == -1) {
that.query.nurseTypeIdList.push(e.id)
} else {}
})
} else {
that.medicalcarelist.forEach(e => {
that.query.nurseTypeIdList = that.query.nurseTypeIdList.filter(el => el != e.id)
})
}
})
},
}
</script>
<style lang="scss">
@import './information.scss';
</style>