chache/pages/accident-detail/index.wxml

<view class="content data-v-a4079225" wx:if="{{a}}">
  <view class="background data-v-a4079225"></view>
  <view class="content-title data-v-a4079225">车辆历史报告</view>
  <view class="sub-title data-v-a4079225">中国汽车流通协会发起建设</view>
  <view class="order-detail data-v-a4079225">
    <view class="detail-item data-v-a4079225">
      <view class="label data-v-a4079225">VIN车架号：</view>
      <view class="value data-v-a4079225">{{b}}</view>
    </view>
    <view class="detail-item data-v-a4079225">
      <view class="label data-v-a4079225">订单编号：</view>
      <view class="value data-v-a4079225">{{c}}</view>
    </view>
    <view class="detail-item data-v-a4079225">
      <view class="label data-v-a4079225">报告时间：</view>
      <view class="value data-v-a4079225">{{d}}</view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">基本信息</text>
    </view>
    <view class="vehicle-info data-v-a4079225">
      <view class="item data-v-a4079225" wx:for="{{e}}" wx:key="c">
        <view class="title data-v-a4079225">{{item.a}}</view>
        <view class="value data-v-a4079225">{{item.b}}</view>
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">车况排查</text>
    </view>
    <view class="ckpc-content data-v-a4079225">
      <view class="item data-v-a4079225" wx:for="{{f}}" wx:key="g">
        <image
          class="icon data-v-a4079225"
          mode="aspectFit"
          src="{{item.a}}"
        ></image>
        <text class="name data-v-a4079225">{{item.b}}</text>
        <text class="status normal data-v-a4079225" wx:if="{{item.c}}"
          >正常</text
        >
        <text class="status unidentified data-v-a4079225" wx:if="{{item.d}}"
          >无法确定</text
        >
        <text class="status doubt data-v-a4079225" wx:if="{{item.e}}"
          >疑似</text
        >
        <text class="status error data-v-a4079225" wx:if="{{item.f}}"
          >异常</text
        >
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">综合车况评级</text>
    </view>
    <view class="grade-info data-v-a4079225">
      <image
        class="grade-img data-v-a4079225"
        src="/static/images/icon_excellent.jpg"
        wx:if="{{g}}"
      ></image>
      <image
        class="grade-img data-v-a4079225"
        src="/static/images/icon_good.jpg"
        wx:if="{{h}}"
      ></image>
      <image
        class="grade-img data-v-a4079225"
        src="/static/images/icon_average.jpg"
        wx:if="{{i}}"
      ></image>
      <image
        class="grade-img data-v-a4079225"
        src="/static/images/icon_poor.jpg"
        wx:if="{{j}}"
      ></image>
      <view class="explain data-v-a4079225">
        车况评级分为四种：优秀、良好、中等、较差。车况评级结果仅供参考，请谨慎使用。
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">排查明细</text>
    </view>
    <view class="vehicle-detail data-v-a4079225">
      <uni-collapse
        bind:__l="__l"
        class="data-v-a4079225"
        uI="a4079225-0"
        uS="{{['d']}}"
      >
        <uni-collapse-item
          bind:__l="__l"
          class="data-v-a4079225"
          uI="{{item.f}}"
          uP="{{item.g}}"
          uS="{{['title','d']}}"
          wx:for="{{k}}"
          wx:key="e"
        >
          <view class="part-title data-v-a4079225" slot="title">
            <view class="title data-v-a4079225">{{item.a}}</view>
            <view class="value data-v-a4079225">
              <text class="{{['data-v-a4079225',item.c&&'count']}}"
                >{{item.b}}</text
              >
              项
            </view>
          </view>
          <view
            class="part-list data-v-a4079225"
            wx:for="{{item.d}}"
            wx:for-item="partItem"
            wx:key="c"
          >
            <view class="part-item data-v-a4079225">
              <view class="label data-v-a4079225"> 部件名 </view>
              <view class="value data-v-a4079225">{{partItem.a}}</view>
            </view>
            <view class="part-item data-v-a4079225">
              <view class="label data-v-a4079225"> 类型 </view>
              <view class="value data-v-a4079225">{{partItem.b}}</view>
            </view>
            <view class="divider data-v-a4079225"></view>
          </view>
        </uni-collapse-item>
      </uni-collapse>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">碰撞部位</text>
      <view class="suffix data-v-a4079225">
        <image
          class="data-v-a4079225"
          src="/static/svgs/icon_normal.svg"
        ></image>
        <text class="data-v-a4079225">正常</text>
        <image
          class="data-v-a4079225"
          src="/static/svgs/icon_warning_2.svg"
        ></image>
        <text class="data-v-a4079225">异常</text>
      </view>
    </view>
    <view class="part-content data-v-a4079225">
      <view class="part-left data-v-a4079225">
        <view
          class="part-left-item data-v-a4079225"
          wx:for="{{l}}"
          wx:for-item="value"
          wx:key="d"
        >
          <image
            class="data-v-a4079225"
            src="/static/svgs/icon_normal.svg"
            wx:if="{{value.a}}"
          ></image>
          <image
            class="data-v-a4079225"
            src="/static/svgs/icon_warning_2.svg"
            wx:if="{{value.b}}"
          ></image>
          <text class="data-v-a4079225">{{value.c}}</text>
        </view>
      </view>
      <view class="part-right data-v-a4079225">
        <image
          class="pic data-v-a4079225"
          src="/static/images/pic_vehicle.jpg"
        ></image>
        <view
          class="position left data-v-a4079225"
          style="top: 110rpx; left: -20rpx"
          wx:if="{{m}}"
        >
          <view class="name data-v-a4079225">前方左侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position left data-v-a4079225"
          style="top: 350rpx; left: -20rpx"
          wx:if="{{n}}"
        >
          <view class="name data-v-a4079225">中间左侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position left data-v-a4079225"
          style="bottom: 100rpx; left: -20rpx"
          wx:if="{{o}}"
        >
          <view class="name data-v-a4079225">后方左侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position right data-v-a4079225"
          style="top: 110rpx; right: -20rpx"
          wx:if="{{p}}"
        >
          <view class="name data-v-a4079225">前方右侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position right data-v-a4079225"
          style="top: 350rpx; right: -20rpx"
          wx:if="{{q}}"
        >
          <view class="name data-v-a4079225">中间右侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position right data-v-a4079225"
          style="bottom: 260rpx; right: 10rpx"
          wx:if="{{r}}"
        >
          <view class="name data-v-a4079225">底部</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position right data-v-a4079225"
          style="bottom: 100rpx; right: -20rpx"
          wx:if="{{s}}"
        >
          <view class="name data-v-a4079225">后方右侧</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position right data-v-a4079225"
          style="top: 450rpx; left: 190rpx"
          wx:if="{{t}}"
        >
          <view class="name data-v-a4079225">顶部</view>
          <view class="horizontal-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position top data-v-a4079225"
          style="top: 20rpx; left: 175rpx"
          wx:if="{{v}}"
        >
          <view class="name data-v-a4079225">正前方</view>
          <view class="vertical-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position top data-v-a4079225"
          style="top: 140rpx; left: 190rpx"
          wx:if="{{w}}"
        >
          <view class="name data-v-a4079225">内部</view>
          <view class="vertical-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position bottom data-v-a4079225"
          style="bottom: 30rpx; left: 180rpx"
          wx:if="{{x}}"
        >
          <view class="name data-v-a4079225">正后方</view>
          <view class="vertical-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
        <view
          class="position bottom data-v-a4079225"
          style="bottom: -20rpx; right: 20rpx"
          wx:if="{{y}}"
        >
          <view class="name data-v-a4079225">其他</view>
          <view class="vertical-line data-v-a4079225"></view>
          <view class="icon data-v-a4079225"></view>
        </view>
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">保险信息</text>
    </view>
    <view class="insurance-content data-v-a4079225">
      <view class="tips data-v-a4079225">
        *
        若当前交强险或商业险未在保，但当前断缴时长不超过一个月时，不纳入断缴统计记录中。
      </view>
      <view class="top-content data-v-a4079225">
        <view class="item data-v-a4079225" wx:for="{{z}}" wx:key="f">
          <image class="icon data-v-a4079225" src="{{item.a}}"></image>
          <text class="name data-v-a4079225">{{item.b}}</text>
          <text class="status normal data-v-a4079225" wx:if="{{item.c}}"
            >正常</text
          >
          <text class="status warning data-v-a4079225" wx:if="{{item.d}}"
            >异常</text
          >
          <text class="status unknown data-v-a4079225" wx:if="{{item.e}}"
            >未知</text
          >
        </view>
      </view>
      <view class="divider data-v-a4079225"></view>
      <view class="bottom-content data-v-a4079225">
        <view class="item data-v-a4079225" wx:for="{{A}}" wx:key="c">
          <view class="title data-v-a4079225">{{item.a}}</view>
          <view class="value data-v-a4079225">{{item.b}}</view>
        </view>
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">出险明细</text>
    </view>
    <view class="insurance-detail data-v-a4079225">
      <view class="top-content data-v-a4079225">
        <view class="item data-v-a4079225">
          <view class="count data-v-a4079225">{{B}}</view>
          <view class="info data-v-a4079225">维修总次数(次)</view>
        </view>
        <view class="item data-v-a4079225">
          <view class="count data-v-a4079225">{{C}}</view>
          <view class="info data-v-a4079225">维修总金额(元)</view>
        </view>
      </view>
      <view class="insurance-list data-v-a4079225">
        <view class="insurance-item data-v-a4079225" wx:for="{{D}}" wx:key="e">
          <view class="title data-v-a4079225">
            <view class="dot data-v-a4079225"></view>
            <view class="date data-v-a4079225">{{item.a}}</view>
            <view class="status data-v-a4079225">（{{item.b}}）</view>
            <view class="money data-v-a4079225">{{item.c}}元</view>
          </view>
          <view class="records data-v-a4079225">
            <view class="record-title data-v-a4079225">
              <view class="value data-v-a4079225" style="width: 40%"
                >维修名称</view
              >
              <view class="value data-v-a4079225">维修类型</view>
              <view class="value data-v-a4079225">件数</view>
            </view>
            <view
              class="record-item data-v-a4079225"
              wx:for="{{item.d}}"
              wx:for-item="listItem"
              wx:key="f"
            >
              <view
                class="value data-v-a4079225"
                style="width: 40%; padding: 0 10rpx"
                >{{listItem.a}}</view
              >
              <view class="value data-v-a4079225">
                <text class="data-v-a4079225" wx:if="{{listItem.b}}">更换</text>
                <text class="data-v-a4079225" wx:elif="{{listItem.c}}"
                  >维修</text
                >
                <text class="data-v-a4079225" wx:elif="{{listItem.d}}"
                  >其他</text
                >
                <text class="data-v-a4079225" wx:else>-</text>
              </view>
              <view class="value data-v-a4079225">{{listItem.e}}</view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">车况评级说明</text>
    </view>
    <view class="intro data-v-a4079225" style="margin-top: 20rpx">
      （1）优秀：外观无可见瑕疵和喷漆修复等记录；内饰无磨损维修记录；动力系统、机械部位运行正常且无维修；按时保养且记录完整；电子系统无任何故障
    </view>
    <view class="intro data-v-a4079225">
      （2）良好：外观局部有1-2处损伤记录；内饰有1-2
      处磨损维修记录；动力系统正常且无维修；机械部位运行正常有部分维修或更换记录；电子设备及模块使用正常
    </view>
    <view class="intro data-v-a4079225">
      （3）中等：外观局部有3-5处损伤记录；内饰有5-
      10处磨损维修记录；动力系统有维修记录；结构件有轻微异常记录
    </view>
    <view class="intro data-v-a4079225">
      （4）较差：外观局部有5处以上损伤记录；内饰有
      10处以上磨损记录；动力系统有3次以上维修记录或发动机变速箱有维修记录；大灯框架/水箱框架更换或变形；机械部位运行存在严重异常或有大修记录
    </view>
  </view>
  <view class="card data-v-a4079225">
    <view class="card-title data-v-a4079225">
      <image
        class="icon-title data-v-a4079225"
        src="/static/images/icon_title.png"
      ></image>
      <text class="data-v-a4079225">免责声明</text>
    </view>
    <view class="disclaimer data-v-a4079225">{{E}}</view>
  </view>
  <divider bind:__l="__l" class="data-v-a4079225" uI="a4079225-2"></divider>
  <float-back-to-top
    bind:__l="__l"
    class="data-v-a4079225"
    uI="a4079225-3"
    uP="{{F}}"
    wx:if="{{F}}"
  ></float-back-to-top>
  <float-share
    bind:__l="__l"
    class="data-v-a4079225"
    uI="a4079225-4"
  ></float-share>
</view>