379 lines
7.9 KiB
Vue
379 lines
7.9 KiB
Vue
<template>
|
||
<view class="app">
|
||
<view class="message">请填写下面的信息</view>
|
||
<view class="user">
|
||
<view class="item">
|
||
<span>姓名：</span>
|
||
<span>{{personInfo.patientName}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>电话：</span>
|
||
<span>{{personInfo.phone}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>地址：</span>
|
||
<span>{{personInfo.address}}</span>
|
||
</view>
|
||
<view class="selecttime" @tap='timeshow=true'>
|
||
<span>时间：</span>
|
||
<text v-if="usertime==''" style="color: black;">请选择时间</text>
|
||
<text v-else style="color: black;">{{usertime}}</text>
|
||
<image src="../../static/jiantou.png"></image>
|
||
</view>
|
||
</view>
|
||
<view class="remarks">
|
||
服务时长:{{orderlist.serveDurationUnit}}
|
||
</view>
|
||
<view class="Package">套餐信息：
|
||
<text class="money">￥{{orderlist.nurseItemPrice}}</text>
|
||
<text class="detail">
|
||
·{{orderlist.nurseItemName}}
|
||
</text>
|
||
</view>
|
||
<view class="Consumablespackage">耗材包详情：
|
||
<text class="money">￥{{orderlist.consumableTotalPrice}}</text>
|
||
<text class="detail">
|
||
{{orderlist.itemConsumableList}}
|
||
</text>
|
||
</view>
|
||
<view class="remarks">
|
||
<span>备注：</span>
|
||
<input placeholder="">
|
||
</view>
|
||
<view class="radio-content">
|
||
<view class="radio-right">
|
||
<view class="radio" :class="radio1 == 2 ? 'radio-default':''" @tap="changeRadio2">
|
||
<view :class="radio1 == 2 ? 'radio-active':''"></view>
|
||
</view>
|
||
</view>
|
||
<text class="agreement" @tap="changeRadio2">我已阅读并同意</text>
|
||
<text @tap='maskshow=true;showRegectAgreeButton=false'>《用户协议》</text>
|
||
</view>
|
||
<view class="priceback">
|
||
<view class="prices">￥{{orderlist.totalPrice}}</view>
|
||
<view class="xiugai">修改信息</view>
|
||
<view class="queren" @tap='updata'>确认预约</view>
|
||
</view>
|
||
<u-toast ref="uToast" />
|
||
<upicker v-model="timeshow" mode="time" start-year='2022' :params="timeparams" @confirm='timeconfirm'></upicker>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import {
|
||
getAppStationItemInfo,
|
||
getAppPatientList,
|
||
submitAppointment
|
||
} from '@/api/appointmenttime/appointmenttime.js'
|
||
import baseurl from '@/api/baseurl.js'
|
||
import upicker from '../picker/picker.vue'
|
||
export default {
|
||
components: {
|
||
upicker
|
||
},
|
||
data() {
|
||
return {
|
||
timeparams: {
|
||
year: true,
|
||
month: true,
|
||
day: true,
|
||
hour: true,
|
||
endhour: true,
|
||
minute: true,
|
||
endminute: true,
|
||
},
|
||
timeshow: false,
|
||
maskshow: false,
|
||
orderlist: {
|
||
"patientId": '',
|
||
"stationId": 2,
|
||
"stationItemId": 2,
|
||
"stationItemPriceId": 3,
|
||
"serviceAddress": "",
|
||
"serviceDate": "",
|
||
"serviceStartTime": "",
|
||
"serviceEndTime": "",
|
||
"nurseItemName": "",
|
||
"nurseItemPrice": '',
|
||
"serveDurationUnit": "",
|
||
"consumableTotalPrice": '',
|
||
"totalPrice": '',
|
||
"remark": "",
|
||
"orderCount": 1,
|
||
"orderConsumableList": []
|
||
},
|
||
maskshow: false,
|
||
userlist: [],
|
||
patientId: 46,
|
||
phone: '',
|
||
patientName: '',
|
||
address: '',
|
||
usertime: '',
|
||
radio1: 1,
|
||
stationId: 2,
|
||
stationItemId: 2,
|
||
stationItemPriceId: 3,
|
||
username: "",
|
||
personInfo: [],
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
console.log(options)
|
||
this.getInfo()
|
||
this.getPatientInfo()
|
||
//获取护理站id等信息
|
||
this.personInfo.patientId = options.patientId
|
||
this.orderlist.stationId = options.stationId
|
||
this.orderlist.stationItemId = options.stationItemId
|
||
this.orderlist.stationItemPriceId = options.stationItemPriceId
|
||
//耗材包详情方法调用
|
||
// this.getPatientInfo(options.stationId, options.stationItemId, options.stationItemPriceId)
|
||
},
|
||
methods: {
|
||
//获取时间
|
||
timeconfirm(e) {
|
||
console.log(e)
|
||
this.orderlist.serviceDate = e.year + '-' + e.month + '-' + e.day
|
||
this.orderlist.serviceStartTime = e.hour + ":" + e.minute
|
||
this.orderlist.serviceEndTime = e.endhour + ":" + e.endminute
|
||
this.usertime = e.year + '年' + e.month + '月' + e.day + '日' + e.hour + ":" + e.minute + '至' +e.endhour + ":" + e.endminute
|
||
console.log(this.orderlist,this.usertime)
|
||
},
|
||
getInfo() { //被护理人信息
|
||
getAppPatientList(this.patientId).then(res => {
|
||
this.personInfo = res.data[0]
|
||
console.log("this.personInfo", this.personInfo);
|
||
})
|
||
},
|
||
|
||
//获取耗材包详情
|
||
getPatientInfo(stationId, stationItemId, stationItemPriceId) {
|
||
getAppStationItemInfo(this.stationId, this.stationItemId, this.stationItemPriceId).then(res => {
|
||
console.log(res)
|
||
this.orderlist = res.data
|
||
//被护理人信息
|
||
|
||
})
|
||
},
|
||
//确认预约
|
||
updata() {
|
||
this.orderlist.orderCount = 1;
|
||
// console.log(this.orderlist)
|
||
submitAppointment(this.orderlist).then(res => {
|
||
|
||
}
|
||
|
||
)
|
||
},
|
||
changeRadio2() {
|
||
this.radio1 = 2;
|
||
// console.log("个人")
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
.app {
|
||
.money {
|
||
font-size: 32rpx;
|
||
color: #D43953;
|
||
margin-left: 90%;
|
||
}
|
||
|
||
font-size: 36rpx;
|
||
padding-top: 10rpx;
|
||
|
||
.user {
|
||
background: #FFFFFF;
|
||
width: 94%;
|
||
margin: 10rpx auto;
|
||
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
|
||
border-radius: 20rpx;
|
||
line-height: 93rpx;
|
||
|
||
.selecttime {
|
||
height: 93rpx;
|
||
margin-left: 3%;
|
||
|
||
text {
|
||
font-size: 34rpx;
|
||
color: #878987;
|
||
}
|
||
|
||
image {
|
||
width: 18rpx;
|
||
height: 27rpx;
|
||
margin-left: 50%;
|
||
}
|
||
}
|
||
|
||
.item {
|
||
width: 97%;
|
||
height: 93rpx;
|
||
border-bottom: 1rpx solid #D8D4D4;
|
||
margin-left: 3%;
|
||
|
||
}
|
||
}
|
||
|
||
.remarks {
|
||
width: 94%;
|
||
height: 382rpx;
|
||
margin: 10rpx auto;
|
||
padding: 3%;
|
||
font-size: 35rpx;
|
||
height: 96rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
margin-top: 3%;
|
||
|
||
input {
|
||
margin-top: -6%;
|
||
margin-left: 15%;
|
||
}
|
||
}
|
||
|
||
.priceback {
|
||
|
||
width: 99%;
|
||
height: 141rpx;
|
||
background: #FFFFFF;
|
||
margin-top: 10%;
|
||
display: flex;
|
||
|
||
.prices {
|
||
font-size: 54rpx;
|
||
color: #D43953;
|
||
line-height: 73rpx;
|
||
margin-top: 5%;
|
||
}
|
||
|
||
.xiugai {
|
||
width: 205rpx;
|
||
height: 71rpx;
|
||
background: #E1AE3C;
|
||
border-radius: 26rpx;
|
||
margin-left: 35%;
|
||
margin-top: 5%;
|
||
line-height: 71rpx;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.queren {
|
||
width: 227rpx;
|
||
height: 71rpx;
|
||
background: #4C7BC9;
|
||
border-radius: 26rpx;
|
||
margin-top: 5%;
|
||
line-height: 71rpx;
|
||
text-align: center;
|
||
color: #ffffff;
|
||
|
||
}
|
||
}
|
||
|
||
// 同意协议
|
||
.radio-content {
|
||
height: 80rpx;
|
||
line-height: 2rpx;
|
||
font-size: 34rpx;
|
||
|
||
.agreement {
|
||
font-size: 34rpx;
|
||
color: #878987;
|
||
margin-left: 14%;
|
||
}
|
||
|
||
.radio-right {
|
||
margin-left: 66rpx;
|
||
|
||
.radio-default {
|
||
border: 2rpx solid #0fbda6;
|
||
}
|
||
|
||
.radio {
|
||
width: 34rpx;
|
||
height: 34rpx;
|
||
border-radius: 70%;
|
||
border: 2rpx solid #178ffb;
|
||
margin: 6px 25px -10px -10px;
|
||
|
||
.radio-active {
|
||
width: 16rpx;
|
||
height: 16rpx;
|
||
border-radius: 50%;
|
||
background-color: #178ffb;
|
||
margin-left: 20%;
|
||
margin-top: 20%;
|
||
// margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/* 耗材包 */
|
||
.Consumablespackage {
|
||
width: 94%;
|
||
height: 188rpx;
|
||
;
|
||
margin: 10rpx auto;
|
||
padding: 3%;
|
||
font-size: 35rpx;
|
||
height: 188rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
margin-top: 3%;
|
||
|
||
.detail {
|
||
width: 301rpx;
|
||
height: 31rpx;
|
||
line-height: 31rpx;
|
||
font-size: 33rpx;
|
||
color: #666666;
|
||
line-height: 31rpx;
|
||
margin-left: 20%;
|
||
}
|
||
|
||
|
||
|
||
}
|
||
|
||
/* 套餐 */
|
||
.Package {
|
||
width: 94%;
|
||
height: 243rpx;
|
||
;
|
||
margin: 10rpx auto;
|
||
padding: 3%;
|
||
font-size: 35rpx;
|
||
height: 243rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
margin-top: 3%;
|
||
|
||
.detail {
|
||
width: 301rpx;
|
||
height: 31rpx;
|
||
line-height: 31rpx;
|
||
font-size: 33rpx;
|
||
color: #666666;
|
||
line-height: 31rpx;
|
||
margin-left: 20%;
|
||
}
|
||
|
||
|
||
}
|
||
|
||
.message {
|
||
width: 94%;
|
||
height: 96rpx;
|
||
background: white;
|
||
border-radius: 20rpx;
|
||
margin: 0 auto;
|
||
text-align: center;
|
||
line-height: 96rpx;
|
||
}
|
||
}
|
||
</style>
|