<template>
<view class="detailPages">
<view class="head-back">
<view class="userName">
<view class="name">
{{userInfo.licencePlate}}
</view>
<view class="jiashiyuan">
驾驶员：{{userInfo.driver}}
</view>
<view class="discharge">
<view class="icon">
<img src="/static/baishijz.png" alt="" />
</view>
<view class="time">
出车时间：{{userInfo.drivingTime}}
</view>
</view>
<view class="discharge" v-if="userInfo.status === 3">
<view class="icon">
<img src="/static/baishijz.png" alt="" />
</view>
<view class="time">
回院时间：{{userInfo.drivingEndTime || ''}}
</view>
</view>
</view>
<!-- 急救信息 -->
<view class="head-center">
<view class="head-center-item">
<view class="item-title">
急救任务：{{userInfo.orderNo}}
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
医生
</view>
<view class="name">
<view v-if="!type">{{userInfo.doctorName}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.doctorName" :border="true" :type="text" />
</view>
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
护士
</view>
<view class="name">
<!-- {{userInfo.nurseName}} -->
<view v-if="!type">{{userInfo.nurseName}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.nurseName" :border="true" :type="text" />
</view>
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user" style="width: 200rpx;">
患者地址
</view>
<view class="name">
<view v-if="!type">{{userInfo.address}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.address" :border="true" :type="text" />
</view>
</view>
</view>
</view>
<!-- 第二段 -->
<view class="head-center" style="margin-top: 30rpx;">
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
送往医院
</view>
<view class="name">
<!-- {{userInfo.hospital}} -->
<view v-if="!type">{{userInfo.hospital}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.hospital" :border="true" :type="text" />
</view>
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
来电号码
</view>
<view class="name">
<view v-if="!type">{{userInfo.phone}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.phone" :border="true" :type="text" />
</view>
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
病情类型
</view>
<view class="name">
<!-- {{userInfo.bruiseType}} -->
<view v-if="!type">{{userInfo.bruiseType}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.bruiseType" :border="true" :type="text" />
</view>
</view>
</view>
<view class="head-center-item">
<view class="item-title-flex">
<view class="user">
病情等级
</view>
<view class="name">
<view v-if="!type">{{userInfo.bruiseLevel}}</view>
<u-input placeholder-style="input-placeholder" v-else v-model="userInfo.bruiseLevel" border-color="#eee" :focus="true" :border="true" :type="text" />
</view>
</view>
</view>
</view>
<view class="bottom" v-if="!type && userInfo.status !== 3">
<button type="default" class="button" @click="editExtractBtn">修改</button>
</view>
<view class="bottom" v-if="type ===1">
<button type="default" class="button" @click="extractBtn">确认</button>
</view>
</view>
</view>
</template>
<script>
import {request} from '../../request/request.js'
export default {
data(){
return {
id:'',
userInfo:{},
type:null
}
},
onLoad({id}) {
this.id = id
this.getUserInfo(id)
},
methods:{
// 确认
async extractBtn(){
const data = this.userInfo
delete data.drivingTime
await request({url:'/dispatchOrder/update',method:'POST',data})
this.type = null
uni.navigateBack({
delta: 1 // 返回的页面数，1表示返回上一级页面
});
},
// 修改
editExtractBtn(){
this.type = 1
},
// 获取信息
async getUserInfo(id){
this.userInfo = await request({url:`/dispatchOrder/taskParticulars/${id}`})
}
}
}
</script>
<style scoped lang="scss">
::v-deep input {
text-align: right !important;
color: #656565 !important;
margin-right: -18rpx;
font-size: 30rpx !important;
}
.detailPages{
width: 100vw;
height: 100vh;
background-color: #eee;
.head-center {
background-color: #FFFFFF;
.head-center-item{
width: 100%;
height: 88rpx;
background: #FFFFFF;
padding: 0 30rpx;
.item-title{
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: 400;
font-size: 30rpx;
color: #999999;
line-height: 88rpx;
border-bottom: 2rpx solid #D7D7D7;
}
.item-title-flex{
display: flex;
justify-content: space-between;
align-items: center;
height: 100%;
margin-right: 50rpx;
.user{
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: 400;
font-size: 30rpx;
color: #1B1B20;
}
.name{
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: 400;
font-size: 30rpx;
color: #656565;
}
}
}
}
.bottom{
margin-top: 50rpx;
height: 200rpx;
background-color: #FFFFFF;
display: flex;
align-items: center;
.button{
width: 721rpx;
height: 100rpx;
line-height: 100rpx;
background: #5581FF;
box-shadow: 8rpx 0rpx 16rpx 0rpx #2385FF;
border-radius: 44rpx 44rpx 44rpx 44rpx;
color: #FFFFFF;
}
}
.head-back{
width: 100%;
height: 350rpx;
background: url('/static/tuceng.png') no-repeat center ;
background-size: 100% 100%;
.discharge{
display: flex;
align-items: center;
margin-top: 20rpx;
.icon{
width: 40rpx;
height: 40rpx;
margin-right: 20rpx;
img {
height: 100%;
width: 100%;
}
}
.time {
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: 400;
font-size: 22rpx;
color: #F9F9F9;
// line-height: 40rpx;
}
}
.userName{
padding: 20rpx;
padding-left: 40rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
.name{
margin-top: 30rpx;
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
// line-height: 20rpx;
}
.jiashiyuan{
margin-top: 20rpx;
font-weight: 400;
font-size: 26rpx;
color: #FFFFFF;
// line-height: 20rpx;
}
}
}
}
</style>