路泰科技体检小程序UI设计新版本
1
wwl
5 天以前 a6cdbcfe28fcc40ebb4919f57d60fb20122e8e57
pagesA/ReportOverview/ReportOverview.vue
@@ -13,180 +13,79 @@
         <scroll-view class="content" scroll-y>
            <view class="report-list">
               <view v-for="(item, index) in reportList" :key="index" class="report-item">
          <view v-for="(item, index) in reportList" :key="index" class="report-item"  @click="ReportDetails(item.tjNumber)">
                  <view class="report-header">
                     <view class="user-info">
                        <text class="name">李*蕊</text>
                        <text class="code">体检码:{{ item.code }}</text>
                <text class="name">{{ item.cusName || '未知姓名' }}</text>
                <text class="code">体检码:{{ item.tjNumber }}</text>
                     </view>
                     <text class="status">已完成</text>
              <text class="status">{{item.status}}</text>
                  </view>
                  <view class="report-info">
                     <text class="age-gender">{{ item.age }}岁 | {{ item.gender }}</text>
                     <text class="date">{{ item.date }}</text>
              <text class="age-gender">{{ item.age }}岁 | {{ item.cusSex ? '女' : '男' }}</text>
              <text class="date">{{ item.createTime }}</text>
                  </view>
                  <view class="hospital">
                     <text>泾川县人民医院健康体检中心</text>
              <text>{{ item.hospital || '泾川县人民医院健康体检中心' }}</text>
                  </view>
               </view>
            </view>
         </scroll-view>
         <view class="footer">
<!--      <view class="footer">
            <button class="upload-btn">
               <!-- <uni-icons type="camera-filled" size="16" color="#666666" /> -->
               <text>拍照上传</text>
            </button>
            <button class="compare-btn" type="primary"  @click="ReportDetails()">
               <text >报告对比</text>
            </button>
         </view>
      </view>
      <!-- 查找结果/历史结果 -->
      <!-- <div class="report">
         <view :class="(showType == 0 ? 'active' : 'report_sty')" @tap="switchTab" data-index="0">
            <div>
               <img class="report_img" src="https://ltpeis.xaltjdkj.cn:5502/static/chazhaobaogao.png" alt="">
            </div>
            <div class="report_sty1">
               <span class="report_txt1">历史结果</span>
               <span class="report_txt2">手机号/体检号等绑定结果</span>
            </div>
         </view>
         <view :class="(showType == 1 ? 'active' : 'report_sty')" @tap="switchTab" data-index="1">
            <div @click="ComparisonReport">
               <div>
                  <img class="report_img" src="https://ltpeis.xaltjdkj.cn:5502/static/duibibaogao.png" alt="">
               </div>
               <div class="report_sty1">
                  <span class="report_txt1">对比结果</span>
                  <span class="report_txt2">历史结果数据对比</span>
               </div>
            </div>
         </view>
      </div>
      <!-- 结果卡片 -->
      <!--<view class="padding-l" v-for="(item,index) in reportlist" :key="index">
         <div class="card" @click="ReportDetails(item.report.tjNumber)">
            <div class="card_sty">
               <div class="card_left">
                  <span class="card_left_txt1">{{item.customer.cusName}}</span>
                  <span class="card_left_txt2">{{item.customer.cusSex ? "女" :"男" }}</span>
               </div>
               <div class="card_right">
                  <div class="card_right1">
                     <span class="card_right_txt1">{{item.report.createTime}}</span>
                     <span class="card_right_txt2">泾川县人民医院体检中心</span>
                     <span class="card_right_txt3">体检号:{{item.report.tjNumber}}</span>
                  </div>
                  <div class="card_right2">
                     <span class="card_right_txt4">体</span>
                     <span class="card_right_txt4">检</span>
                     <span class="card_right_txt4">报</span>
                     <span class="card_right_txt4">告</span>
                  </div>
               </div>
            </div>
         </div>
      </view> -->
      <!-- <div class="warm">
         <text>温馨提示:如需下载或打印结果,请使用电脑访问:www.xaltjdkj.com</text>
      </div> -->
   </view>
  </view>
</template>
<script>
   import {
      getReportList,
   } from "@/api/system/report";
   import {
      getWxInfo
   } from '@/api/login'
import { getReportList } from "@/api/system/report";
   export default {
      name: 'App',
      data() {
         return {
            reportList: [{
                  code: '612554755105',
                  age: 35,
                  gender: '女',
                  date: '2025-02-15'
      reportList: [],
      cusIdCard: '',
    };
               },
               {
                  code: '612554755105',
                  age: 35,
                  gender: '女',
                  date: '2024-08-21'
               },
               {
                  code: '612554755105',
                  age: 35,
                  gender: '女',
                  date: '2023-05-15'
               },
               {
                  code: '612554755105',
                  age: 35,
                  gender: '女',
                  date: '2022-08-21'
               }
            ]
         }
      },
      //生命周期方法 —— 页面加载时
      onLoad() {
  onLoad(options) {
    this.cusIdCard = options.cusIdCard || '';
    if (this.cusIdCard) {
         this.getList();
    } else {
      this.$modal.showToast('缺少身份证号参数');
    }
      },
      methods: {
         /** 查询体检报告列表 */
         getList() {
            //获取登录的用户的手机号 ------待完成
            getWxInfo().then(res => {
               let cusPhone = res.data.phone;
               getReportList(cusPhone).then((response) => {
      getReportList(this.cusIdCard).then((response) => {
                  if (response.data) {
                     this.reportlist = response.data;
                     console.log(this.reportlist);
                     this.reportlist.forEach(item => {
                        this.tjNumber = item.report.tjNumber
                     })
          this.reportList = response.data;
          console.log('报告列表:', this.reportList);
                  } else {
                     this.$modal.showToast("还未生成体检报告")
          this.$modal.showToast('还未生成体检报告');
                  }
      }).catch(err => {
        console.error('获取报告列表失败:', err);
        this.$modal.showToast('获取报告列表失败');
               });
            })
         },
         switchTab: function(event) {
            this.showType = event.currentTarget.dataset.index;
         },
         //跳转
         ComparisonReport() {
            this.$modal.showToast("该项功能正在建设中")
            // uni.navigateTo({
            //    url: '/pagesA/ComparisonReport/ComparisonReport'
            // })
         },
         ReportDetails(item) {
            let tjNumber = item
            uni.navigateTo({
               url: `/pagesA/ReportDetails/ReportDetails?tjNumber=${tjNumber}`
            })
              url: `/pagesA/ReportDetails/ReportDetails?tjNum=${encodeURIComponent(item)}`
            });
         }
      }
   }
};
</script>
<style lang="scss">
@@ -205,31 +104,6 @@
      flex-shrink: 0;
      background-color: #ffffff;
      padding-bottom: 20rpx;
   }
   .nav-bar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 20rpx 32rpx;
   }
   .left {
      display: flex;
      align-items: center;
   }
   .title {
      margin-left: 16rpx;
      font-size: 16px;
      font-weight: 500;
      color: #333333;
   }
   .right {
      display: flex;
      align-items: center;
      gap: 32rpx;
   }
   .search-bar {
@@ -286,7 +160,6 @@
      justify-content: space-between;
      align-items: center;
      margin-bottom: 24rpx;
   }
   .user-info {