kola-web
2 weeks ago
13 changed files with 466 additions and 24 deletions
@ -0,0 +1,7 @@
@@ -0,0 +1,7 @@
|
||||
{ |
||||
"navigationBarTitleText": "就诊记录详情页", |
||||
"navigationBarBackgroundColor": "#F6F6F6", |
||||
"usingComponents": { |
||||
"van-icon": "@vant/weapp/icon/index" |
||||
} |
||||
} |
||||
@ -0,0 +1,196 @@
@@ -0,0 +1,196 @@
|
||||
page { |
||||
background-color: #f6f6f6; |
||||
} |
||||
.page { |
||||
padding: 32rpx 32rpx 120rpx; |
||||
.banner { |
||||
padding: 28rpx 32rpx; |
||||
border-radius: 24rpx; |
||||
background-color: #fff; |
||||
.b-header { |
||||
margin-bottom: 24rpx; |
||||
font-size: 36rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
font-weight: bold; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 24rpx; |
||||
margin-left: -32rpx; |
||||
&::before { |
||||
content: ''; |
||||
width: 8rpx; |
||||
height: 36rpx; |
||||
border-radius: 0 8rpx 8rpx 0; |
||||
background: rgba(22, 121, 203, 1); |
||||
} |
||||
} |
||||
.row { |
||||
display: flex; |
||||
gap: 32rpx; |
||||
&:last-of-type { |
||||
margin-top: 22rpx; |
||||
} |
||||
.icon { |
||||
flex-shrink: 0; |
||||
width: 96rpx; |
||||
height: 96rpx; |
||||
} |
||||
.col { |
||||
.name { |
||||
font-size: 32rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
} |
||||
.date { |
||||
margin-top: 12rpx; |
||||
font-size: 40rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
font-weight: bold; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.switch-wrap { |
||||
margin-top: 32rpx; |
||||
padding: 28rpx 32rpx; |
||||
border-radius: 24rpx; |
||||
background-color: #fff; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
.name { |
||||
font-size: 32rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
} |
||||
.switch { |
||||
transform: scale(0.8); |
||||
} |
||||
} |
||||
.photos { |
||||
margin-top: 32rpx; |
||||
padding: 28rpx 32rpx; |
||||
border-radius: 24rpx; |
||||
background-color: #fff; |
||||
.p-header { |
||||
font-size: 36rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
font-weight: bold; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 24rpx; |
||||
margin-left: -32rpx; |
||||
&::before { |
||||
content: ''; |
||||
width: 8rpx; |
||||
height: 36rpx; |
||||
border-radius: 0 8rpx 8rpx 0; |
||||
background: rgba(22, 121, 203, 1); |
||||
} |
||||
} |
||||
.p-container { |
||||
margin-top: 24rpx; |
||||
display: grid; |
||||
grid-template-columns: repeat(2, 1fr); |
||||
gap: 22rpx; |
||||
.photo { |
||||
display: block; |
||||
width: 100%; |
||||
height: 168rpx; |
||||
border-radius: 16rpx; |
||||
} |
||||
} |
||||
} |
||||
.container { |
||||
margin-top: 32rpx; |
||||
padding: 0 32rpx 28rpx; |
||||
border-radius: 24rpx; |
||||
background-color: #fff; |
||||
.row { |
||||
padding-top: 32rpx; |
||||
border-bottom: 1px solid rgba(34, 34, 34, 0.08); |
||||
&:last-of-type { |
||||
border: none; |
||||
} |
||||
.name { |
||||
font-size: 36rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
font-weight: bold; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 24rpx; |
||||
margin-left: -32rpx; |
||||
&::before { |
||||
content: ''; |
||||
width: 8rpx; |
||||
height: 36rpx; |
||||
border-radius: 0 8rpx 8rpx 0; |
||||
background: rgba(22, 121, 203, 1); |
||||
} |
||||
} |
||||
.content { |
||||
margin-top: 16rpx; |
||||
padding-bottom: 28rpx; |
||||
font-size: 36rpx; |
||||
color: rgba(34, 34, 34, 1); |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 16rpx; |
||||
.icon { |
||||
width: 32rpx; |
||||
height: 37rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.footer { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
.col { |
||||
flex: 1; |
||||
padding: 50rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
gap: 12rpx; |
||||
.icon { |
||||
width: 44rpx; |
||||
height: 44rpx; |
||||
} |
||||
.name { |
||||
font-size: 36rpx; |
||||
color: #222222; |
||||
&.name1 { |
||||
color: rgba(22, 121, 203, 1); |
||||
} |
||||
} |
||||
} |
||||
.line { |
||||
width: 1px; |
||||
height: 36rpx; |
||||
background: rgba(34, 34, 34, 0.1); |
||||
} |
||||
} |
||||
} |
||||
|
||||
#drug-page { |
||||
.banner { |
||||
.b-header::before { |
||||
background: rgba(89, 86, 233, 1); |
||||
} |
||||
} |
||||
.photos { |
||||
.p-header::before { |
||||
background: rgba(89, 86, 233, 1); |
||||
} |
||||
} |
||||
.container { |
||||
.name::before { |
||||
background: rgba(89, 86, 233, 1); |
||||
} |
||||
} |
||||
.footer { |
||||
.name1 { |
||||
color: rgba(89, 86, 233, 1); |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,175 @@
@@ -0,0 +1,175 @@
|
||||
const app = getApp<IAppOption>() |
||||
|
||||
Page({ |
||||
data: { |
||||
id: 0, |
||||
visitDate: '', |
||||
nextVisitDate: '', |
||||
displayIgG4Value: '' as string | number | null, |
||||
medicationsLabel: '', |
||||
oralHormoneDosageMg: '' as string | number | null, |
||||
immunosuppressantLabel: '', |
||||
reminderEnabled: 2, |
||||
imageGroups: [] as { type: string; label: string; list: string[] }[], |
||||
change: 0, |
||||
|
||||
// 枚举
|
||||
medicationsMap: {} as Record<number, string>, |
||||
immunosuppressantMap: {} as Record<number, string>, |
||||
imageTypeLabels: {} as Record<string, string>, |
||||
|
||||
patientId: '', |
||||
}, |
||||
|
||||
onLoad(options: any) { |
||||
app.waitLogin().then(() => { |
||||
app.mpBehavior({ PageName: 'PG_PatientRecordDetail', detailId: String(options.id) }) |
||||
this.getEnums().then(() => { |
||||
if (options.id) { |
||||
this.setData({ id: Number(options.id), patientId: options.pid }) |
||||
this.getDetail() |
||||
this.getReminderConfig() |
||||
} |
||||
}) |
||||
}) |
||||
}, |
||||
onShow() { |
||||
if (typeof this.__loaded === 'undefined') { |
||||
this.__loaded = true |
||||
return |
||||
} |
||||
this.getDetail() |
||||
this.getReminderConfig() |
||||
}, |
||||
|
||||
// ========== API ==========
|
||||
|
||||
getEnums(): Promise<void> { |
||||
return wx |
||||
.ajax({ |
||||
method: 'GET', |
||||
url: '?r=igg4/medical-visit/get-enums', |
||||
}) |
||||
.then((res: any) => { |
||||
if (!res) return |
||||
const medicationsMap: Record<number, string> = {} |
||||
for (const item of res.medicationsUsed || []) { |
||||
medicationsMap[item.value] = item.label |
||||
} |
||||
const immunosuppressantMap: Record<number, string> = {} |
||||
for (const item of res.immunosuppressantName || []) { |
||||
immunosuppressantMap[item.value] = item.label |
||||
} |
||||
const imageTypeLabels: Record<string, string> = {} |
||||
for (const item of res.imageType || []) { |
||||
imageTypeLabels[item.value] = item.label |
||||
} |
||||
this.setData({ medicationsMap, immunosuppressantMap, imageTypeLabels }) |
||||
}) |
||||
}, |
||||
|
||||
getDetail() { |
||||
wx.ajax({ |
||||
method: 'GET', |
||||
url: '?r=igg4/doctor/medical-visit/detail', |
||||
data: { id: this.data.id, patientId: this.data.patientId }, |
||||
}).then((res: any) => { |
||||
if (!res) return |
||||
const { medicationsMap, immunosuppressantMap, imageTypeLabels } = this.data |
||||
const medicationsLabel = (res.medicationsUsed || []) |
||||
.map((id: number) => { |
||||
if (id === 99 && res.medicationsUsedOtherText) return `其他：${res.medicationsUsedOtherText}` |
||||
if (id === 99) return '' |
||||
return medicationsMap[id] |
||||
}) |
||||
.filter(Boolean) |
||||
.join('、') |
||||
const immunosuppressantLabel = (res.immunosuppressantName || []) |
||||
.map((id: number) => { |
||||
if (id === 99 && res.immunosuppressantNameOtherText) return `其他：${res.immunosuppressantNameOtherText}` |
||||
if (id === 99) return '' |
||||
return immunosuppressantMap[id] |
||||
}) |
||||
.filter(Boolean) |
||||
.join('、') |
||||
|
||||
const imageGroups: { type: string; label: string; list: string[] }[] = [] |
||||
const images = res.images || {} |
||||
for (const type of Object.keys(imageTypeLabels)) { |
||||
const list = (images[type] || []).map((img: any) => img.maskedImageUrl || img.imageUrl) |
||||
if (list.length) { |
||||
imageGroups.push({ type, label: imageTypeLabels[type], list }) |
||||
} |
||||
} |
||||
|
||||
this.setData({ |
||||
visitDate: res.visitDate || '', |
||||
nextVisitDate: res.nextVisitDate || '', |
||||
displayIgG4Value: res.displayIgG4Value, |
||||
medicationsLabel, |
||||
oralHormoneDosageMg: res.oralHormoneDosageMg, |
||||
immunosuppressantLabel, |
||||
imageGroups, |
||||
change: res.change, |
||||
}) |
||||
}) |
||||
}, |
||||
|
||||
getReminderConfig() { |
||||
wx.ajax({ |
||||
method: 'GET', |
||||
url: '?r=igg4/medical-visit/get-reminder-config', |
||||
}).then((res: any) => { |
||||
if (!res) return |
||||
this.setData({ reminderEnabled: res.reminderEnabled || 2 }) |
||||
}) |
||||
}, |
||||
|
||||
saveReminderConfig(e: any) { |
||||
const val = e.detail.value ? 1 : 2 |
||||
this.setData({ reminderEnabled: val }) |
||||
wx.ajax({ |
||||
method: 'POST', |
||||
url: '?r=igg4/medical-visit/save-reminder-config', |
||||
data: { reminderEnabled: val }, |
||||
}) |
||||
}, |
||||
|
||||
// ========== 操作 ==========
|
||||
|
||||
handleDelete() { |
||||
wx.showModal({ |
||||
title: `删除${this.data.visitDate || ''}记录`, |
||||
content: `删除后将无法恢复`, |
||||
confirmText: '确认删除', |
||||
confirmColor: '#ee0a24', |
||||
success: (res) => { |
||||
if (!res.confirm) return |
||||
wx.ajax({ |
||||
method: 'POST', |
||||
url: '?r=igg4/medical-visit/delete', |
||||
data: { id: this.data.id }, |
||||
}).then((res: any) => { |
||||
if (!res) return |
||||
wx.navigateBack() |
||||
}) |
||||
}, |
||||
}) |
||||
}, |
||||
|
||||
handleEdit() { |
||||
wx.navigateTo({ url: `/gift/pages/record/index?id=${this.data.id}` }) |
||||
}, |
||||
|
||||
handlePreviewImage(e: any) { |
||||
const { url, type } = e.currentTarget.dataset |
||||
const group = this.data.imageGroups.find((g) => g.type === type) |
||||
if (!group) return |
||||
wx.previewImage({ |
||||
current: url, |
||||
urls: group.list, |
||||
}) |
||||
}, |
||||
}) |
||||
|
||||
export {} |
||||
@ -0,0 +1,53 @@
@@ -0,0 +1,53 @@
|
||||
<view class="page" id="{{theme === 'DRUG' && 'drug-page'}}"> |
||||
<view class="banner"> |
||||
<view class="b-header">就诊时间</view> |
||||
<view class="row"> |
||||
<!-- <image class="icon" src="{{imageUrl}}{{theme === 'DRUG' ? 'icon137' : 'icon121'}}.png?t={{Timestamp}}"></image> --> |
||||
<view class="col"> |
||||
<view class="name">我的本次就诊时间</view> |
||||
<view class="date">{{visitDate || '--'}}</view> |
||||
</view> |
||||
</view> |
||||
<view class="row"> |
||||
<!-- <image class="icon" src="{{imageUrl}}{{theme === 'DRUG' ? 'icon138' : 'icon122'}}.png?t={{Timestamp}}"></image> --> |
||||
<view class="col"> |
||||
<view class="name">我的下次就诊时间</view> |
||||
<view class="date">{{nextVisitDate || '--'}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="photos" wx:for="{{imageGroups}}" wx:key="type"> |
||||
<view class="p-header">{{item.label}}</view> |
||||
<view class="p-container"> |
||||
<image |
||||
class="photo" |
||||
wx:for="{{item.list}}" |
||||
wx:key="*this" |
||||
wx:for-item="imgUrl" |
||||
src="{{imgUrl}}" |
||||
mode="aspectFill" |
||||
bind:tap="handlePreviewImage" |
||||
data-url="{{imgUrl}}" |
||||
data-type="{{item.type}}" |
||||
></image> |
||||
</view> |
||||
</view> |
||||
<view class="container"> |
||||
<view class="row" wx:if="{{displayIgG4Value !== null && displayIgG4Value !== ''}}"> |
||||
<view class="name">IgG4值</view> |
||||
<view class="content">{{displayIgG4Value}} mg/dL</view> |
||||
</view> |
||||
<view class="row" wx:if="{{medicationsLabel}}"> |
||||
<view class="name">本次就诊已使用的药物</view> |
||||
<view class="content">{{medicationsLabel}}</view> |
||||
</view> |
||||
<view class="row" wx:if="{{oralHormoneDosageMg !== null && oralHormoneDosageMg !== ''}}"> |
||||
<view class="name">最近一周，每日激素使用剂量</view> |
||||
<view class="content">{{oralHormoneDosageMg}}mg/天</view> |
||||
</view> |
||||
<view class="row" wx:if="{{immunosuppressantLabel}}"> |
||||
<view class="name">正在使用的免疫抑制剂名称</view> |
||||
<view class="content">{{immunosuppressantLabel}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
Loading…
Reference in new issue