Prescription.vue
5.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<template>
<view class="flexA topbg" v-if="props.showTopState">
<image src="/static/images/pic.png" mode="scaleToFill" />
<view>{{ proxy.$h.optObjectValue(props.order === 'Prescription' ? 'state' : 'renewExamineState', props.order === 'Prescription' ? PrescriptionDetail?.formOrderState : PrescriptionDetail?.state) }}</view>
</view>
<view class="Prescription">
<view class="Prescription-title flexC" v-if="props.title">{{ props.title }}</view>
<template v-if="!['success'].includes(props.isRenew)">
<view class="text mb24">问诊病情</view>
<view class="text mb24">{{ PrescriptionDetail?.supplement || '病情描述' }}</view>
</template>
<template v-if="![null, undefined, ''].includes(PrescriptionDetail?.renewRemark) && ['success'].includes(props.isRenew)">
<view class="text mb24">续方原因</view>
<view class="text mb24">{{ PrescriptionDetail?.renewRemark }}</view>
</template>
<view class="text mb24">处方药:</view>
<view class="list">
<view class="flexJ" v-for="(_, index) in props.isRenew === 'err' ? PrescriptionDetail?.drugList : PrescriptionDetail?.renewDrugList" :key="index" style="margin-bottom: 42rpx">
<view>
<view class="blacktext" style="margin-bottom: 8rpx">{{ _.name || '' }}</view>
<view class="graytext">{{ _.des || '' }}</view>
</view>
<view>
<view class="blacktext" style="margin-bottom: 8rpx">¥{{ _.amount || 0 }}</view>
<view class="graytext">x{{ _.num || 0 }}</view>
</view>
</view>
</view>
<view>
<view class="text">处方单证明</view>
<view class="flexW">
<template v-if="typeof PrescriptionDetail?.prescriptionFile === 'string'">
<template v-for="_ in PrescriptionDetail?.prescriptionFile.split(',')">
<image :src="proxy.$h.downFile(_)" mode="aspectFill" @click="proxy.$h.previewImage(proxy.$h.downFile(_))" class="zmimg" />
</template>
</template>
</view>
</view>
<view class="flexJ mb24">
<view class="text">总金额</view>
<view class="blacktext">¥{{ amount || 0 }}</view>
</view>
<!-- <view class="flexJ mb24">
<view class="text">运费</view>
<view class="blacktext">¥0</view>
</view> -->
<view class="flexJ mb24" v-if="![null, undefined, '0', ''].includes(PrescriptionDetail?.pid)">
<view class="text">复诊时间</view>
<view class="graytext">{{ PrescriptionDetail?.createTime }}</view>
</view>
<view class="flexJ mb24">
<view class="text">开具时间</view>
<view class="graytext">{{ PrescriptionDetail?.prescriptionFormDate }}</view>
</view>
<template v-if="props.showStep !== 'err' && ![0, '0', 4, '4'].includes(PrescriptionDetail?.formOrderState)">
<view class="flexJ mb24">
<view class="text">快递单号</view>
<view class="graytext">
{{ ![null, undefined, ''].includes(PrescriptionDetail?.expressNo as any) ? PrescriptionDetail?.expressNo : '未填写快递号' }}
<text class="text" v-if="![null, undefined, ''].includes(PrescriptionDetail?.expressNo as any)" @click="proxy.$h.copyText(PrescriptionDetail?.expressNo)">复制</text>
</view>
</view>
<view class="flexJ mb24">
<view class="text">物流状态</view>
<view class="graytext">{{ proxy.$h.optObjectValue('state', props.PrescriptionDetail?.formOrderState) }}</view>
</view>
</template>
</view>
</template>
<script setup lang="ts">
import type { PrescriptionDetailType } from '../../../types'
import { ref, getCurrentInstance, ComponentPublicInstance, computed } from 'vue'
const { proxy } = getCurrentInstance() as { proxy: ComponentPublicInstance }
interface IProps {
bg: string
title?: string
PrescriptionDetail?: PrescriptionDetailType
isRenew: string
showTopState: boolean
showStep?: string
order?: string
}
const props = withDefaults(defineProps<IProps>(), {
bg: '#fff',
isRenew: 'err',
showTopState: true,
showStep: 'success',
order: 'xf'
})
const amount = computed(() => {
const list = props.isRenew === 'err' ? props.PrescriptionDetail?.drugList : props.PrescriptionDetail?.renewDrugList
return Array.isArray(list) && list.length && list.reduce((acc, item) => acc + parseFloat(item.amount) * item.num, 0)
})
const CustomBackground = ref(props.bg)
</script>
<style lang="scss" scoped>
.topbg {
box-sizing: border-box;
padding: 38rpx 32rpx;
background: #0cb9d3;
color: #ffffff;
font-size: 40rpx;
font-weight: 700;
image {
width: 52rpx;
height: 52rpx;
margin-right: 16rpx;
}
}
.Prescription {
box-sizing: border-box;
padding: 72rpx 32rpx 0;
background: v-bind(CustomBackground);
border-radius: 24rpx 24rpx 0 0;
&-title {
color: #323233;
font-size: 34rpx;
font-weight: 700;
margin-bottom: 48rpx;
margin-top: -40rpx;
}
.zmimg {
width: 210rpx;
height: 210rpx;
border-radius: 24rpx;
margin-right: 16rpx;
}
.mb24 {
margin-bottom: 24rpx;
}
.text {
color: #323233;
font-size: 28rpx;
font-weight: 700;
}
.blacktext {
color: #323233;
font-size: 30rpx;
font-weight: 700;
}
.graytext {
color: #999999;
font-size: 24rpx;
font-weight: 700;
}
.list {
box-sizing: border-box;
padding: 34rpx 28rpx;
background: #f8f8fa;
margin-bottom: 32rpx;
}
}
</style>