ykt-wxapp/pages/message/components/message-card/fill-description-card.vue

85 lines
2.1 KiB
Vue
Raw Normal View History

2026-01-20 13:21:50 +08:00
<template>
<view v-if="data" class="symptom-detail">
<view class="symptom-row">
<text class="label-text">患者</text>
<text class="content-text">{{ data.patient }}</text>
</view>
<view class="symptom-row">
<text class="label-text">病情描述</text>
<text class="content-text">{{ data.description }}</text>
</view>
<view v-if="data.diseases" class="symptom-row">
<text class="label-text">线下确诊疾病</text>
<text class="content-text">{{ data.diseases }}</text>
</view>
<view v-if="data.images && data.images.length" class="symptom-row" @click="previewImage()">
<text class="label-text">附件</text>
<text class="preview-btn">{{ data.images.length }} 点击查看</text>
</view>
</view>
</template>
<script setup>
import { computed } from 'vue';
const props = defineProps({
payload: {
type: Object,
default: () => ({})
}
});
const data = computed(() => {
try {
const extension = JSON.parse(props.payload.extension);
return {
patient: typeof extension.patient === 'string' ? extension.patient : '',
description: typeof extension.description === 'string' ? extension.description : '',
hasVisitedHospital: typeof extension.hasVisitedHospital === 'boolean' ? extension.hasVisitedHospital : false,
diseases: typeof extension.diseases === 'string' ? extension.diseases : '',
images: Array.isArray(extension.images) ? extension.images : [],
}
} catch (e) { }
return null
})
function previewImage() {
console.log('预览图片')
uni.previewImage({
urls: data.value.images
})
}
</script>
<style scpoed>
/* 病情描述样式 */
.symptom-detail {
min-width: 360rpx;
max-width: 600rpx;
}
.symptom-row {
padding: 4rpx 0;
line-height: 42rpx;
}
.label-text {
color: #999;
font-size: 28rpx;
}
.content-text {
color: #333;
font-size: 28rpx;
}
.preview-btn {
display: inline-block;
border: 1px solid;
color: #0074ff;
line-height: 36rpx;
font-size: 24rpx;
padding: 0 12rpx;
border-radius: 22rpx;
}
</style>