gather/pages/DetailsOfRefund1/DetailsOfRefund.wxml

<view class="DetailsOfRefund">
  <view class="result-box box">
    <view class="result">
      <view class="title">退款成功1</view>
      <view class="desc">已完成退款，具体到账时间请查询支付宝</view>
    </view>
    <view class="result">
    <view class="title-box">
      <view class="title small">退款成功</view>
      <view class="price">￥21</view>
    </view>
      <view class="desc">已完成退款，具体到账时间请查询支付宝</view>
    </view>
  </view>

  <view class="oprate-box box">
      <view class="item">
        <image class="icon" src="../../images/icon/del-icon.png" mode=""/>
        <view class="label">
          删除订单
        </view>
      </view>
      <!-- <button class='item' open-type="contact" >
        <image class="icon" src="../../images/icon/chat-icon.png" mode=""/>
        <view class="label">
          联系商家
        </view>
     </button>
      <view class="item" >
        <image class="icon" src="../../images/icon/buy-icon.png" mode=""/>
        <view class="label">
          再次购买
        </view>
      </view> -->
    </view>

    <view class="process-box box">
      <view class="sub-title">退款流程</view>
      
      <view class="step-box">
        <view class="step-item" wx:for="{{4}}">
          <view class="point {{index == 0?'active':''}}"></view>
          <view class="line"></view>
          <view class="title">退款成功</view>
          <view class="desc">已完成退款，具体到账时间请查询支付宝</view>
          <view class="time">2024-12-13 11：12：30</view>
          <view class="img-list" wx:if="{{index == 3}}">
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
            <view class="img"></view>
          </view>
        </view>
      </view>

    </view>

    <view class="refund-goods box">
      <view class="title-box">
        <view class="title">退款商品</view>
        <view class="price">退款金额：￥21</view>
      </view>
      <view class="good-list">
        <view class="good-item">
          <view class="img"></view>
          <view class="info">
            <view class="good-name">赶海季生鲜大闸蟹</view>
            <view class="desc">规格：5kg，盒</view>
            <view class="price">单价：￥1.8</view>
          </view>
          <view class="price-box">
            <view class="price">￥103.95</view>
            <view class="num">x1</view>
          </view>
        </view>
        <view class="good-item">
          <view class="img"></view>
          <view class="info">
            <view class="good-name">赶海季生鲜大闸蟹</view>
            <view class="desc">规格：5kg，盒</view>
            <view class="price">单价：￥1.8</view>
          </view>
          <view class="price-box">
            <view class="price">￥103.95</view>
            <view class="num">x1</view>
          </view>
        </view>
        <view class="good-item">
          <view class="img"></view>
          <view class="info">
            <view class="good-name">赶海季生鲜大闸蟹</view>
            <view class="desc">规格：5kg，盒</view>
            <view class="price">单价：￥1.8</view>
          </view>
          <view class="price-box">
            <view class="price">￥103.95</view>
            <view class="num">x1</view>
          </view>
        </view>

      </view>
        <view class="open-btn">
          展开（共7件） <image class="arrow" src="../../images/icon/black-down-arrow.png" mode=""/>
        </view>
    </view>

    <view class="goods-info box">
      <view class="item">
        <view class="label">商品金额</view>
        <view class="value">￥54.00</view>
      </view>
      <view class="item">
        <view class="label">运费（快递）</view>
        <view class="value">￥54.00</view>
      </view>
      <view class="item">
        <view class="label">积分（1400）</view>
        <view class="value">￥54.00</view>
      </view>
      <view class="total">
        <view class="label">总计：</view>
        <view class="value">￥54.00</view>
      </view>
    </view>

    <view class="order-info box">
      <view class="title">订单信息</view>
      <view class="item">
        <view class="label">订单编号</view>
        <view class="value-box">
          <view class="value">1867402054587256856</view>
          <image class="icon" src="../../images/icon/copy.png" mode=""/>
        </view>
      </view>
      <view class="item">
        <view class="label">售后编号</view>
        <view class="value-box">
          <view class="value">1867402054587256856</view>
          <image class="icon" src="../../images/icon/copy.png" mode=""/>
        </view>
      </view>
      <view class="item">
        <view class="label">申请时间</view>
        <view class="value">1867402054587256856</view>
      </view>
      <view class="item">
        <view class="label">服务类型</view>
        <view class="value">仅退款</view>
      </view>
      <view class="item">
        <view class="label">申请原因</view>
        <view class="value">实物与图片不符合</view>
      </view>
    </view>

</view>