|
|
|
@ -3,6 +3,7 @@ |
|
|
|
<view class="title"> 平车信息 </view> |
|
|
|
<view |
|
|
|
class="car-box bor-left-lv" |
|
|
|
v-if="car" |
|
|
|
:class="{ |
|
|
|
'bor-left-lv': car.carStatus === 0, |
|
|
|
'bor-left-zhan': car.carStatus === 1, |
|
|
|
@ -10,6 +11,7 @@ |
|
|
|
'bor-left-dian': car.carStatus === 3, |
|
|
|
'bor-left-li': car.carStatus === 4, |
|
|
|
}" |
|
|
|
@click="openDetail" |
|
|
|
> |
|
|
|
<view class="car-title flex items-center"> |
|
|
|
<view class="car-no">{{ car.carNo }}</view> |
|
|
|
@ -47,38 +49,66 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="title"> 时间轴 </view> |
|
|
|
<view class="time-line-box"></view> |
|
|
|
<view class="time-line-box"> |
|
|
|
<view class="flex" v-for="(step, stepIndex) in stepList" :key="step.stepId"> |
|
|
|
<view class="time-line-left flex flex-col items-center"> |
|
|
|
<view class="time-line-cir" :class="step.type === 1 ? 'green' : step.type === 2 ? 'blue' : ''"></view> |
|
|
|
<view |
|
|
|
class="time-line-bor" |
|
|
|
v-if="stepIndex !== stepList.length - 1" |
|
|
|
:class="step.type === 1 ? 'green-bg' : step.type === 2 ? 'blue-bg' : ''" |
|
|
|
></view> |
|
|
|
</view> |
|
|
|
<view class="time-line-right flex-1" style="margin-top: -16rpx"> |
|
|
|
<view class="w-full name-status flex justify-between"> |
|
|
|
<view :class="step.type === 1 ? 'green' : step.type === 2 ? 'blue' : ''"> |
|
|
|
{{ step.stepName }} |
|
|
|
</view> |
|
|
|
<view :class="step.type === 1 ? 'green' : step.type === 2 ? 'blue' : ''"> |
|
|
|
<!-- {{ step.type }} --> |
|
|
|
{{ step.type === 0 ? '未开始' : step.type === 1 ? '待确认' : '已结束' }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="w-full time-status flex justify-between"> |
|
|
|
<view class="flex items-center" :class="step.type === 1 ? 'green' : step.type === 2 ? 'blue' : ''"> |
|
|
|
<!-- {{ step.stepName }} --> |
|
|
|
<img src="@/static/news/logo2xg.png" v-if="step.type === 2" style="width: 32rpx; height: 32rpx; margin-right: 8rpx" alt="" /> |
|
|
|
<img src="@/static/news/logo2x.png" v-else style="width: 32rpx; height: 32rpx; margin-right: 8rpx" alt="" /> |
|
|
|
{{ step.startTime ? $moment(+step.startTime).format('YYYY-MM-DD HH:mm') : '未知' }} |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<!-- {{ step.type }} --> |
|
|
|
<u-icon size="32" name="edit-pen" :color="step.type === 1 ? '#00c767' : step.type === 2 ? '#4f8bff' : ''"></u-icon> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { mapMutations } from 'vuex'; |
|
|
|
export default { |
|
|
|
name: 'detail', |
|
|
|
components: {}, |
|
|
|
props: {}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
car: { |
|
|
|
age: null, |
|
|
|
carId: '1', |
|
|
|
carNo: '1001', |
|
|
|
carStatus: 0, |
|
|
|
doctorId: '0', |
|
|
|
doctorName: null, |
|
|
|
firstAidId: '1601126216004542464', |
|
|
|
gender: null, |
|
|
|
medicalHistoryList: ['家族史', '心脏病', '高血压'], |
|
|
|
name: '', |
|
|
|
idcard: '123123444403142235', |
|
|
|
nursesId: '1', |
|
|
|
nursesName: '张野', |
|
|
|
}, |
|
|
|
car: null, |
|
|
|
status: 0, |
|
|
|
stepList: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: {}, |
|
|
|
methods: { |
|
|
|
...mapMutations('carbasics', ['setFirstAidId', 'setDetailValueType']), |
|
|
|
// 查看病历填写详情 |
|
|
|
openDetail() { |
|
|
|
this.setFirstAidId(this.car.firstAidId); |
|
|
|
this.setDetailValueType(this.car.demonstrate); |
|
|
|
uni.navigateTo({ url: `/pages/patientLine/patientLine?caseType=${0}` }); |
|
|
|
}, |
|
|
|
async getSteps() { |
|
|
|
try { |
|
|
|
const params = { firstAidId: this.car.firstAidId }; |
|
|
|
@ -92,7 +122,9 @@ export default { |
|
|
|
watch: {}, |
|
|
|
|
|
|
|
// 页面周期函数--监听页面加载 |
|
|
|
onLoad() { |
|
|
|
onLoad(options) { |
|
|
|
console.log('options: ', options); |
|
|
|
this.car = JSON.parse(options.info); |
|
|
|
this.getSteps(); |
|
|
|
}, |
|
|
|
// 页面周期函数--监听页面初次渲染完成0 |
|
|
|
@ -115,9 +147,53 @@ export default { |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.blue-bg { |
|
|
|
background: #4f8bff !important; |
|
|
|
} |
|
|
|
.green-bg { |
|
|
|
background: #00c767 !important; |
|
|
|
} |
|
|
|
.blue { |
|
|
|
color: #4f8bff !important; |
|
|
|
border-color: #4f8bff !important; |
|
|
|
} |
|
|
|
.green { |
|
|
|
color: #00c767 !important; |
|
|
|
border-color: #00c767 !important; |
|
|
|
} |
|
|
|
.name-status { |
|
|
|
font-size: 32rpx; |
|
|
|
font-family: OPPOSans-Bold, OPPOSans; |
|
|
|
font-weight: bold; |
|
|
|
color: #a3acbf; |
|
|
|
} |
|
|
|
.time-status { |
|
|
|
margin-top: 12rpx; |
|
|
|
font-size: 24rpx; |
|
|
|
font-family: OPPOSans-Medium, OPPOSans; |
|
|
|
font-weight: 500; |
|
|
|
color: #a3acbf; |
|
|
|
} |
|
|
|
.time-line-left { |
|
|
|
margin-right: 24rpx; |
|
|
|
} |
|
|
|
.time-line-cir { |
|
|
|
width: 8px; |
|
|
|
height: 8px; |
|
|
|
border: 4rpx solid #a3acbf; |
|
|
|
border-radius: 50%; |
|
|
|
opacity: 1; |
|
|
|
} |
|
|
|
.time-line-bor { |
|
|
|
width: 4rpx; |
|
|
|
height: 112rpx; |
|
|
|
background: #a3acbf; |
|
|
|
opacity: 1; |
|
|
|
} |
|
|
|
.time-line-box { |
|
|
|
margin-right: 24rpx; |
|
|
|
width: calc(100% - 64rpx); |
|
|
|
height: 100rpx; |
|
|
|
/* height: 100rpx; */ |
|
|
|
margin: 32rpx; |
|
|
|
padding: 32rpx; |
|
|
|
background: #ffffff; |
|
|
|
|
