xinda-miniprogram/src/pages/d_noteDiff/index.wxml

<navbar fixed title="照片对比" custom-style="background:{{background}}">
  <van-icon name="arrow-left" slot="left" size="18px" color="#000" bind:tap="handleBack" />
</navbar>

<view class="page" style="padding-top:{{pageTop+20}}px;">
  <view class="page-tip">
    <image class="icon" src="{{imageUrl}}icon154.png?t={{Timestamp}}"></image>
    <view class="content">
      您可以同时选择多个日期，系统将按时间顺序排列照片。点击右上角按钮可预览并保存生成的对比长图。
    </view>
  </view>
  <view class="form">
    <view class="form-item">
      <view class="title">选择对比角度</view>
      <picker mode="selector" range="{{angleList}}" range-key="name" value="{{0}}" bindchange="onAngleChange">
        <view class="select">
          <view class="content {{photoAngleName ? '' : 'placeholder'}}">{{photoAngleName || '请选择对比角度'}}</view>
          <van-icon class="more" name="arrow-down" />
        </view>
      </picker>
    </view>
    <view class="form-item">
      <view class="title">选择对比日期(可多选)</view>
      <view class="multiple">
        <view class="item active baseline" wx:if="{{baseline}}">
          {{baseline.recordDate}}
          <image class="icon" src="{{imageUrl}}icon169.png?t={{Timestamp}}"></image>
        </view>
        <view
          class="item {{item.isSelected ? 'active' : ''}}"
          wx:for="{{nonBaselineList}}"
          wx:key="recordId"
          data-record-id="{{item.recordId}}"
          bind:tap="onDateSelect"
        >{{item.recordDate}}</view>
      </view>
    </view>
  </view>
  <view class="container" wx:if="{{comparePhotos.length > 0}}">
    <view class="title">
      {{photoAngleName}}时间线对比
      <view class="date">生成日期:{{comparePhotos[0].recordDate}}</view>
    </view>
    <view class="card" wx:for="{{comparePhotos}}" wx:key="recordId">
      <view class="aside">
        <view class="circle"></view>
        <view class="line-bottom"></view>
      </view>
      <view class="c-container">
        <view class="c-header">
          <view class="date">{{item.isBaseline === 1 ? '基准照片' : '对比照片'}} {{item.recordDate}}</view>
        </view>
        <view class="tags">
          <view wx:if="{{item.isBaseline === 1}}" class="tag tag1">基准照片</view>
          <view class="tag tag2" wx:if="{{item.treatmentCount > 0}}">替妥尤单抗:{{item.treatmentCount >= 9 ? '>8' : item.treatmentCount}}</view>
        </view>
        <view class="photo-card">
          <image class="photo" src="{{item.photoUrl}}" mode="aspectFill"></image>
          <view class="row" wx:if="{{item.leftEye != null || item.rightEye != null || item.interorbitalDistance != null}}">
            <view class="col">
              <view class="name">右眼</view>
              <view class="content">
                <view class="num">{{item.rightEye != null ? item.rightEye : '--'}}</view>
                <view class="sub">MM</view>
              </view>
            </view>
            <view class="col">
              <view class="name">眶间距</view>
              <view class="content">
                <view class="num">{{item.interorbitalDistance != null ? item.interorbitalDistance : '--'}}</view>
                <view class="sub">MM</view>
              </view>
            </view>
            <view class="col">
              <view class="name">左眼</view>
              <view class="content">
                <view class="num">{{item.leftEye != null ? item.leftEye : '--'}}</view>
                <view class="sub">MM</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
  <view class="footer-fixed" wx:if="{{comparePhotos.length > 0}}">
    <view class="btn1" bind:tap="handleEdit">生成对比图</view>
  </view>
</view>