349 lines
7.6 KiB
Vue
349 lines
7.6 KiB
Vue
<template>
|
||
<view class="app">
|
||
<view class="user">
|
||
<view class="item">
|
||
<span>姓名：</span>
|
||
<span class='addition' v-if="userlist.patientName">{{userlist.patientName}}</span>
|
||
</view>
|
||
<view class="item">
|
||
<span>电话：</span>
|
||
<span class='addition' v-if="userlist.phone">{{userlist.phone}}</span>
|
||
</view>
|
||
<view class="item" style="border: 0;">
|
||
<span>时间：</span>
|
||
<span class='addition'>请选择</span>
|
||
</view>
|
||
<view class="worditem">
|
||
<view class="today" @tap='taptoday(item,index)'
|
||
:style="todayindex==index?'background: #FEF9F8;border: 1px solid #F44B2F;color: #F44B2F;':''"
|
||
v-for="(item,index) in userlist.appointmentTimeList" :key="index">
|
||
<span class="todaytime">
|
||
{{item.week}}
|
||
</span>
|
||
<span class="time">{{item.healthConsultationDate}}</span>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pointout">
|
||
温馨提示：我们会尽快与您取得联系，您也可以进入“首页”-“在线客服”主动联系客服，谢谢！
|
||
</view>
|
||
<view class="remarks">
|
||
<span>咨询内容：</span>
|
||
<u-input v-model="updata.healthConsultationContent" type="textarea" :clearable='false' />
|
||
</view>
|
||
<view class="bottomitem">
|
||
<span>￥{{updata.totalPrice}}</span>
|
||
<view class="submit" @tap='buyshow=true'>确认</view>
|
||
</view>
|
||
<!-- 弹框 -->
|
||
<u-popup v-model="buyshow" mode="bottom" length="45%" border-radius="30" :closeable='true'>
|
||
<view class="payment">
|
||
请选择支付方式
|
||
</view>
|
||
<view class="chat">
|
||
<image src="/static/chat.png" mode=""></image>
|
||
<span>微信支付</span>
|
||
</view>
|
||
<view class="submits" @tap='buy'>
|
||
确认支付￥{{updata.totalPrice}}
|
||
</view>
|
||
</u-popup>
|
||
<u-toast ref="uToast" />
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import {
|
||
informationConfirmation,
|
||
addHealthConsultationOrder
|
||
} from '@/api/Informationconfirmation/index.js'
|
||
import {
|
||
appletGoodsOrderPay
|
||
} from '@/api/confirmOrder/index.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
openid: null,
|
||
buyshow: false,
|
||
price: 0,
|
||
userlist: {},
|
||
todayindex: 0,
|
||
updata: {
|
||
"orderChannel": "WECHAT_APPLET",
|
||
"patientId": null,
|
||
"phone": null,
|
||
"receiver": null,
|
||
"healthAppointDate": null,
|
||
"totalPrice": null,
|
||
"hospitalPersonId": null,
|
||
"healthConsultationContent": '',
|
||
"hospitalPersonName": null,
|
||
},
|
||
}
|
||
},
|
||
methods: {
|
||
taptoday(item, index) {
|
||
this.todayindex = index
|
||
this.updata.healthAppointDate = item.date
|
||
},
|
||
buy() {
|
||
var that = this
|
||
addHealthConsultationOrder(this.updata).then(res => {
|
||
if (res.code == 200) {
|
||
res.data.payType = "WECHAT_PAY"
|
||
res.data.paymentPrice = res.data.totalPrice
|
||
res.data.openid = this.openid
|
||
let id = res.data.id
|
||
appletGoodsOrderPay(res.data).then(response => {
|
||
if (response.code == 200) {
|
||
uni.requestPayment({
|
||
timeStamp: response.data.timeStamp,
|
||
nonceStr: response.data.nonceStr,
|
||
package: response.data.prepayId,
|
||
signType: response.data.signType,
|
||
paySign: response.data.paySign,
|
||
success: function(res) {
|
||
that.$refs.uToast.show({
|
||
title: '支付成功',
|
||
type: 'success',
|
||
duration: 1500,
|
||
url: `/pages/paysuccess/paysuccess`
|
||
})
|
||
},
|
||
fail: function(err) {
|
||
that.$refs.uToast.show({
|
||
title: '取消支付',
|
||
type: 'error',
|
||
duration: 1500,
|
||
url: `/pages/payorderDetails/payorderDetails?goodsOrderId=${id}`
|
||
})
|
||
}
|
||
});
|
||
} else {
|
||
that.$refs.uToast.show({
|
||
title: response.msg,
|
||
type: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
})
|
||
} else {
|
||
that.$refs.uToast.show({
|
||
title: res.msg,
|
||
type: 'error',
|
||
duration: 2000
|
||
})
|
||
}
|
||
})
|
||
},
|
||
},
|
||
onShow() {
|
||
var that = this
|
||
const value = uni.getStorageSync('patientId');
|
||
const value2 = uni.getStorageSync('openid');
|
||
if (value2) {
|
||
that.openid = value2
|
||
}
|
||
if (value) {
|
||
that.updata.patientId = value
|
||
informationConfirmation(value).then(res => {
|
||
that.userlist = res.data
|
||
that.updata.phone = res.data.phone
|
||
that.updata.receiver = res.data.patientName
|
||
that.updata.healthAppointDate = res.data.appointmentTimeList[0].date
|
||
})
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
var that = this
|
||
this.updata.hospitalPersonName = options.personName
|
||
this.updata.totalPrice = Number(options.price)
|
||
this.updata.hospitalPersonId = Number(options.hospitalPersonId)
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
.app {
|
||
font-size: 34rpx;
|
||
padding-top: 10rpx;
|
||
height: 100%;
|
||
-webkit-overflow-scrolling: touch;
|
||
|
||
.determine {
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
font-size: 32rpx;
|
||
width: 50%;
|
||
color: #F4F5F7;
|
||
background: #4C7BC9;
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
}
|
||
|
||
.user {
|
||
background: #FFFFFF;
|
||
width: 94%;
|
||
height: 600rpx;
|
||
margin: 10rpx auto;
|
||
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
|
||
border-radius: 20rpx;
|
||
line-height: 93rpx;
|
||
|
||
.addressitem {
|
||
width: 97%;
|
||
border-bottom: 1rpx solid #D8D4D4;
|
||
margin-left: 3%;
|
||
// height: 100%;
|
||
|
||
.leftaddress {
|
||
width: 15%;
|
||
height: 100%;
|
||
display: flex;
|
||
display: inline-block;
|
||
}
|
||
|
||
.addition {
|
||
color: #666666;
|
||
display: inline-block;
|
||
line-height: 50rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.item {
|
||
width: 97%;
|
||
border-bottom: 1rpx solid #D8D4D4;
|
||
margin-left: 3%;
|
||
|
||
.addition {
|
||
color: #666666;
|
||
line-height: 30rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.worditem {
|
||
display: flex;
|
||
width: 100%;
|
||
justify-content: flex-start;
|
||
flex-wrap: wrap;
|
||
|
||
.today {
|
||
width: 20%;
|
||
margin: 0 2.5% 0 2.5%;
|
||
margin-top: 20rpx;
|
||
height: 90rpx;
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
border: 1px solid #DADADA;
|
||
border-radius: 5rpx;
|
||
|
||
.time {
|
||
font-size: 26rpx;
|
||
display: block;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.todaytime {
|
||
padding-top: 5rpx;
|
||
font-size: 26rpx;
|
||
display: block;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.pointout{
|
||
color: #666666;
|
||
width: 94%;
|
||
font-size: 28rpx;
|
||
margin: 20rpx auto;
|
||
}
|
||
.remarks {
|
||
width: 94%;
|
||
margin: 10rpx auto;
|
||
font-size: 34rpx;
|
||
height: 440rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
padding: 30rpx 0 0 30rpx;
|
||
}
|
||
|
||
.bottomitem {
|
||
width: 100%;
|
||
height: 120rpx;
|
||
background: #FFFFFF;
|
||
bottom: 0;
|
||
position: fixed;
|
||
|
||
span {
|
||
font-size: 48rpx;
|
||
line-height: 120rpx;
|
||
color: #F44B2F;
|
||
margin: 0 0 0 30rpx;
|
||
}
|
||
|
||
.submit {
|
||
width: 186rpx;
|
||
height: 70rpx;
|
||
background: #F44B2F;
|
||
color: #FFFFFF;
|
||
border-radius: 30rpx;
|
||
line-height: 70rpx;
|
||
text-align: center;
|
||
font-size: 32rpx;
|
||
float: right;
|
||
margin: 25rpx 30rpx 0 0;
|
||
}
|
||
}
|
||
|
||
// 弹框支付
|
||
.payment {
|
||
width: 100%;
|
||
height: 130rpx;
|
||
font-size: 42rpx;
|
||
color: #000000;
|
||
line-height: 130rpx;
|
||
text-align: center;
|
||
border-bottom: 1rpx solid #D8D4D4;
|
||
}
|
||
|
||
.chat {
|
||
position: relative;
|
||
height: 200rpx;
|
||
|
||
span {
|
||
position: absolute;
|
||
top: 50rpx;
|
||
left: 180rpx;
|
||
line-height: 70rpx;
|
||
font-size: 42rpx;
|
||
color: #000000;
|
||
}
|
||
|
||
image {
|
||
position: absolute;
|
||
top: 50rpx;
|
||
left: 70rpx;
|
||
width: 80rpx;
|
||
height: 70rpx;
|
||
}
|
||
}
|
||
|
||
.submits {
|
||
background: #F44B2F;
|
||
width: 501rpx;
|
||
height: 71rpx;
|
||
line-height: 71rpx;
|
||
border-radius: 36rpx;
|
||
font-size: 34rpx;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
position: fixed;
|
||
bottom: 50rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
</style>
|