<template>
|
<view class="page">
|
<!-- <view class="nav-bar">
|
<view class="nav-left">
|
<uni-icons type="left" size="20" color="#333"></uni-icons>
|
<text class="nav-title">问诊记录</text>
|
</view>
|
<view class="nav-right">
|
<uni-icons type="more-filled" size="20" color="#333"></uni-icons>
|
<uni-icons type="camera-filled" size="20" color="#333"></uni-icons>
|
</view>
|
</view> -->
|
|
<scroll-view class="content" scroll-y>
|
<view class="record-list">
|
<view class="record-item" v-for="(item, index) in records" :key="index">
|
<view class="record-left">
|
<image class="record-image" :src="item.image" mode="aspectFill"></image>
|
</view>
|
<view class="record-right">
|
<view class="record-header">
|
<text class="record-title">{{ item.title }}</text>
|
<text
|
:class="['record-status', item.status === '待体检' ? 'pending' : 'completed']">{{ item.status }}</text>
|
</view>
|
<view class="record-detail">
|
<text class="detail-text">共{{ item.items.length }}项: {{ item.items.join(' | ') }}</text>
|
</view>
|
<view class="record-time">
|
<text class="time-text">体检时间: {{ item.time }}</text>
|
</view>
|
<view class="record-price">
|
<text class="price-symbol">¥</text>
|
<text class="price-value">{{ item.price }}</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
records: [
|
{
|
title: '入职体检',
|
status: '待体检',
|
items: ['血常规', '心电图', '尿常规', '胸部CT', '血脂', '血糖', '肝脏检查'],
|
time: '2025-02-13 09:30',
|
price: '450.00',
|
image: 'https://ai-public.mastergo.com/ai/img_res/27bcf0acb95aa0120114fecacce5bf5c.jpg'
|
},
|
{
|
title: '父母体检套餐',
|
status: '待体检',
|
items: ['血常规', '心电图', '尿常规', '胸部CT', '血脂', '血糖', '血压', '肝脏检查'],
|
time: '2025-02-13 09:30',
|
price: '1250.00',
|
image: 'https://ai-public.mastergo.com/ai/img_res/abc0b357072bacea915b011713877481.jpg'
|
},
|
{
|
title: '入职体检',
|
status: '已完成',
|
items: ['血常规', '心电图', '尿常规', '胸部CT', '血脂'],
|
time: '2024-02-15 09:30',
|
price: '380.00',
|
image: 'https://ai-public.mastergo.com/ai/img_res/7410d9b377dca1af453b5cd576e38144.jpg'
|
}
|
]
|
}
|
}
|
}
|
</script>
|
|
<style>
|
page {
|
height: 100%;
|
background-color: #f5f5f5;
|
}
|
|
.page {
|
height: 100%;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.nav-bar {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding: 0 32rpx;
|
height: 88rpx;
|
background-color: #fff;
|
flex-shrink: 0;
|
}
|
|
.nav-left {
|
display: flex;
|
align-items: center;
|
}
|
|
.nav-title {
|
font-size: 16px;
|
color: #333;
|
margin-left: 16rpx;
|
font-weight: 500;
|
}
|
|
.nav-right {
|
display: flex;
|
align-items: center;
|
gap: 32rpx;
|
}
|
|
.content {
|
flex: 1;
|
overflow: auto;
|
}
|
|
.record-list {
|
padding: 24rpx;
|
}
|
|
.record-item {
|
display: flex;
|
background-color: #fff;
|
border-radius: 12rpx;
|
padding: 24rpx;
|
margin-bottom: 24rpx;
|
}
|
|
.record-image {
|
width: 120rpx;
|
height: 120rpx;
|
border-radius: 8rpx;
|
}
|
|
.record-right {
|
flex: 1;
|
margin-left: 24rpx;
|
}
|
|
.record-header {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 16rpx;
|
}
|
|
.record-title {
|
font-size: 16px;
|
color: #333;
|
font-weight: 500;
|
}
|
|
.record-status {
|
font-size: 14px;
|
}
|
|
.pending {
|
color: #1890ff;
|
}
|
|
.completed {
|
color: #999;
|
}
|
|
.record-detail {
|
margin-bottom: 16rpx;
|
}
|
|
.detail-text {
|
font-size: 14px;
|
color: #666;
|
line-height: 1.4;
|
}
|
|
.record-time {
|
margin-bottom: 16rpx;
|
}
|
|
.time-text {
|
font-size: 14px;
|
color: #666;
|
}
|
|
.record-price {
|
display: flex;
|
align-items: baseline;
|
}
|
|
.price-symbol {
|
font-size: 14px;
|
color: #ff6b00;
|
}
|
|
.price-value {
|
font-size: 20px;
|
color: #ff6b00;
|
font-weight: 500;
|
}
|
</style>
|