路泰科技体检小程序UI设计新版本
1
wwl
5 天以前 a6cdbcfe28fcc40ebb4919f57d60fb20122e8e57
pages/history/history.vue
@@ -15,25 +15,27 @@
         <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>
            <image class="record-image" :src="item.image || img"></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>
              <text class="record-status" :class="{ pending: item.status === '待体检', completed: item.status !== '待体检' }">{{ item.status }}</text>
                  </view>
                  <view class="record-detail">
                     <text class="detail-text">共{{ item.items.length }}项: {{ item.items.join(' | ') }}</text>
              <text class="detail-text">共{{ item.items.length || 0}}项: {{ item.items.join(' | ') }}</text>
                  </view>
                  <view class="record-time">
                     <text class="time-text">体检时间: {{ item.time }}</text>
              <text class="time-text">体检时间: {{ formatTime(item.time) }}</text>
                  </view>
                  <view class="record-price">
                     <text class="price-symbol">¥</text>
                     <text class="price-value">{{ item.price }}</text>
              <text class="price-value">{{ item.price || 0 }}</text>
                  </view>
               </view>
        </view>
        <view v-if="records.length === 0" class="empty-view">
          <text class="empty-text">暂无问诊记录</text>
            </view>
         </view>
      </scroll-view>
@@ -41,48 +43,67 @@
</template>
<script>
import { getwenzhenxinxi } from "@/api/system/report";
   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'
      img: 'https://ai-public.mastergo.com/ai/img_res/27bcf0acb95aa0120114fecacce5bf5c.jpg', // 默认图片
      records: [],
      idCard: ''
    };
               },
               {
                  title: '父母体检套餐',
                  status: '待体检',
                  items: ['血常规', '心电图', '尿常规', '胸部CT', '血脂', '血糖', '血压', '肝脏检查'],
                  time: '2025-02-13 09:30',
                  price: '1250.00',
                  image: 'https://ai-public.mastergo.com/ai/img_res/abc0b357072bacea915b011713877481.jpg'
  onLoad(option) {
    console.log('history.vue onLoad 参数:', option);
    if (option.cusIdCard) {
      this.idCard = decodeURIComponent(option.cusIdCard);
      console.log('解析后的身份证号:', this.idCard);
      this.getRecords();
    } else {
      uni.showToast({
        title: '身份证号未传递',
        icon: 'none'
      });
    }
               },
               {
                  title: '入职体检',
                  status: '已完成',
                  items: ['血常规', '心电图', '尿常规', '胸部CT', '血脂'],
                  time: '2024-02-15 09:30',
                  price: '380.00',
                  image: 'https://ai-public.mastergo.com/ai/img_res/7410d9b377dca1af453b5cd576e38144.jpg'
  methods: {
    formatTime(isoTime) {
      if (!isoTime) return '';
      const date = new Date(isoTime);
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, '0');
      const day = String(date.getDate()).padStart(2, '0');
      const hours = String(date.getHours()).padStart(2, '0');
      const minutes = String(date.getMinutes()).padStart(2, '0');
      const seconds = String(date.getSeconds()).padStart(2, '0');
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    },
    getRecords() {
      getwenzhenxinxi({ idCard: this.idCard }).then(res => {
        console.log('getwenzhenxinxi 响应:', res);
        if (res.code === 200) {
          this.records = res.data || [];
        } else {
          uni.showToast({
            title: res.msg || '获取问诊记录失败',
            icon: 'none'
          });
               }
            ]
      }).catch(err => {
        console.error('getwenzhenxinxi 错误:', err);
        uni.showToast({
          title: err.message || '网络错误,请稍后重试',
          icon: 'none'
        });
      });
         }
         }
         }
};
</script>
<style>
   page {
      height: 100%;
      background-color: #f5f5f5;
   }
<style scoped>
   .page {
      height: 100%;
  background-color: #f5f5f5;
      display: flex;
      flex-direction: column;
   }
@@ -202,4 +223,14 @@
      color: #ff6b00;
      font-weight: 500;
   }
.empty-view {
  text-align: center;
  padding: 50rpx;
}
.empty-text {
  font-size: 28rpx;
  color: #999;
}
</style>