wutian-miniprogram/src/pages/cases/index.wxml

<view class="page">
  <view class="header">
    <view class="navbar">
      <view class="nav active">我的病历</view>
      <view class="nav">
        公开病历
        <van-icon name="question" color="rgba(224, 224, 224, 1)" />
      </view>
      <view class="nav">
        优质病历
        <van-icon name="question" color="rgba(224, 224, 224, 1)" />
      </view>
    </view>
    <view class="search">
      <image class="icon" src="/images/icon-search.png"></image>
      <input class="input" placeholder-class="place-input" type="text" placeholder="支持档案编号、医生姓名进行搜索" />
    </view>
    <view class="form">
      <view class="row">
        <view class="label">状态</view>
        <view class="picker-content">
          <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
          <van-icon name="arrow-down" />
        </view>
      </view>
      <view class="row">
        <view class="label">医院</view>
        <view class="picker-content">
          <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
          <van-icon name="arrow-down" />
        </view>
      </view>
      <view class="row">
        <view class="label">创建</view>
        <picker class="picker">
          <view class="picker-content">
            <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
            <van-icon name="arrow-down" />
          </view>
        </picker>
      </view>
      <view class="row">
        <view class="label">更新</view>
        <picker class="picker">
          <view class="picker-content">
            <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
            <van-icon name="arrow-down" />
          </view>
        </picker>
      </view>
      <view class="row">
        <view class="label">标签</view>
        <view class="picker-content">
          <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
          <van-icon name="arrow-down" />
        </view>
      </view>
      <view class="row">
        <view class="label">地区</view>
        <picker class="picker">
          <view class="picker-content">
            <view class="content">全全部全部全部全部全部全部全部全部全部全部部</view>
            <van-icon name="arrow-down" />
          </view>
        </picker>
      </view>
    </view>
    <view class="station">
      <view class="wrap">
        <view class="item">
          <radio class="radio"></radio>
          驳回
        </view>
        <view class="item">
          <radio class="radio"></radio>
          优质
        </view>
        <view class="item">
          <radio class="radio"></radio>
          公开
        </view>
      </view>
      <view class="fold">
        收起
        <van-icon class="v-icon" name="arrow-down" />
      </view>
    </view>
  </view>
  <view class="sort-line">
    <view class="wrap">
      <view class="btn active">更新时间排序</view>
      <view class="btn">提交时间排序</view>
    </view>
    <radio class="feedback" color="rgba(0, 180, 197, 1)">待我反馈</radio>
  </view>
  <view class="list">
    <view class="list-total">共有290条病历</view>
    <view class="list-item" bind:tap="handleDetail">
      <image
        class="quality"
        src="https://pic1.zhimg.com/50/v2-dcfbab1219ae4f7a7a6db168bb1580a2_720w.jpg?source=2c26e567"
        mode="scaleToFill"
      ></image>
      <view class="li-header">
        <view class="wrap">
          <view class="id">ID:2024020913049204001</view>
          <view class="status status1">讨论中</view>
          <view class="status status3">已公开</view>
        </view>
        <view class="option">···</view>
      </view>
      <view class="li-row">
        <view class="label">提交时间</view>
        <view class="content">2024-02-09 12:04:23</view>
      </view>
      <view class="li-row">
        <view class="label">提交人</view>
        <view class="content">
          王军
          <text class="line">|</text>
          四川大学华西医院 副主任医师
        </view>
      </view>
      <view class="li-row">
        <view class="label">标签</view>
        <view class="tags">
          <view class="tag">心律失常</view>
          <view class="tag">心律失常</view>
          <view class="tag">心律失常</view>
        </view>
      </view>
      <view class="photos">
        <image
          class="photo"
          src="https://pic1.zhimg.com/50/v2-dcfbab1219ae4f7a7a6db168bb1580a2_720w.jpg?source=2c26e567"
          bind:tap="handleImagePreview"
          data-url="https://pic1.zhimg.com/50/v2-dcfbab1219ae4f7a7a6db168bb1580a2_720w.jpg?source=2c26e567"
        ></image>
        <image
          class="photo"
          src="https://pic1.zhimg.com/50/v2-dcfbab1219ae4f7a7a6db168bb1580a2_720w.jpg?source=2c26e567"
        ></image>
      </view>
      <view class="li-row">
        <view class="label">更新时间</view>
        <view class="content">
          2024-02-09 12:04:23
          <view class="new">new</view>
          <view class="reject">已驳回</view>
        </view>
      </view>
      <view class="li-row">
        <view class="label">反馈人</view>
        <view class="content">
          王军
          <text class="line">|</text>
          四川大学华西医院 副主任医师
        </view>
      </view>
    </view>
  </view>
  <view class="empty-1">
    <image class="e-img" src="/images/empty-1.png"></image>
    <view class="e-tip">没有找到您搜索的医院哦！</view>
  </view>
  <view class="empty-2">
    <image class="e-img" src="/images/empty-2.png"></image>
    <view class="e-tip">没有找到您搜索的医院哦！</view>
  </view>
</view>

<van-popup show="{{ show1 }}" position="bottom" bind:close="onClose" z-index="10000" round closeable>
  <view class="popup1">
    <view class="title">病历状态</view>
    <view class="scroll">
      <view class="list">
        <view class="list-item active">全部</view>
        <view class="list-item">新病历</view>
        <view class="list-item">讨论中</view>
        <view class="list-item">已归档</view>
        <view class="list-item">已归档</view>
      </view>
    </view>
    <view class="submit">保存</view>
  </view>
</van-popup>

<van-popup show="{{ show2 }}" position="bottom" bind:close="onClose" z-index="10000" round closeable>
  <view class="popup2">
    <view class="title">选择医院</view>
    <view class="search">
      <image class="icon" src="/images/icon-search.png"></image>
      <input class="input" placeholder-class="place-input" type="text" placeholder="支持档案编号、医生姓名进行搜索" />
    </view>
    <view class="scroll">
      <view class="list">
        <view class="list-item active">
          <view class="hostipal">
            中山大学附属第一医院
            <view class="tag">三甲</view>
          </view>
          <view class="site">广东省广州市越秀区中山二路58号</view>
        </view>
        <view class="list-item">
          <view class="hostipal">
            中山大学附属第一医院
            <view class="tag">三甲</view>
          </view>
          <view class="site">广东省广州市越秀区中山二路58号</view>
        </view>
      </view>
    </view>
  </view>
</van-popup>

<van-popup
  show="{{ show3 }}"
  style="--popup-close-icon-color: #283031"
  position="bottom"
  round
  closeable
  bind:close="onClose"
  z-index="10000"
>
  <view class="popup3">
    <view class="title">选择标签</view>
    <view class="tags">
      <view class="tag active">瓣膜病</view>
      <view class="tag">心律失常</view>
      <view class="tag">心衰</view>
      <view class="tag">心肌病</view>
    </view>
    <view class="submit">保存</view>
  </view>
</van-popup>