wxappb2b/GuangZuan/miniprogram/mCircle/pages/contrast/index.wxml

<!-- top-view -->
<view class="top-view">
  <!-- 导航栏 -->
  <van-nav-bar custom-style="background-color: #E92020">
    <van-icon slot="left" name="arrow-left" size="25px" color="white" bind:click="backToParent"/>
    <text slot="title" style="color: white;">钻石比对</text>
  </van-nav-bar>

  <!-- 图片区域 -->
  <view class="image-view">
    <!-- 空白处 -->
    <view style="width: 80px;"></view>
    
    <view class="item-image-view" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">
      <!-- 图片 -->
      <van-image src="https://img.yzcdn.cn/vant/cat.jpeg" width="50" height="50"></van-image>
      <!-- 商品编号 -->
      <text class="goodsno">{{itm.goodsno}}</text>
    </view>
  </view>
</view>

 <!-- 内容区域 -->
<view class="container">
  <!-- 重量 -->
  <view class="item weight">
    <text class="title">重量</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.weight}}ct</text>
  </view>

  <!-- 价格 -->
  <view class="item price">
    <text class="title">价格</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">￥{{itm.price}}</text>
  </view>

  <!-- 克拉单价 -->
  <view class="item priceper">
    <text class="title">克拉单价</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">￥{{itm.priceper}}</text>
  </view>

  <!-- 市场价 -->
  <view class="item marketprice">
    <text class="title">市场价</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">￥{{itm.marketprice}}</text>
  </view>

  <!-- 仓库 -->
  <view class="item warehousenamedisplay">
    <text class="title">仓库</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.warehousenamedisplay}}</text>
  </view>

  <!-- 卖家 -->
  <view class="item sellusername">
    <text class="title">卖家</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.sellusername}}</text>
  </view>

  <!-- 形状 -->
  <view class="item zsshapetypedisplay">
    <text class="title">形状</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zsshapetypedisplay}}</text>
  </view>

  <!-- 颜色 -->
  <view class="item zscolortype1display">
    <text class="title">颜色</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zscolortype1display}}</text>
  </view>

  <!-- 净度 -->
  <view class="item zsclaritytype1display">
    <text class="title">净度</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zsclaritytype1display}}</text>
  </view>

  <!-- 切工 -->
  <view class="item zscuttype1display">
    <text class="title">切工</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zscuttype1display}}</text>
  </view>

  <!-- 对称 -->
  <view class="item zsfluorescencetype1display">
    <text class="title">对称</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zsfluorescencetype1display}}</text>
  </view>

  <!-- 荧光 -->
  <view class="item zspolishtype1display">
    <text class="title">荧光</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zspolishtype1display}}</text>
  </view>

  <!-- 尺寸 -->
  <view class="item sizedisplay">
    <text class="title">尺寸</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.sizedisplay}}</text>
  </view>

  <!-- 证书 -->
  <view class="item zscerttypedisplay">
    <text class="title">证书</text>
    <text class="value" wx:for="{{values}}" wx:for-index="idx" wx:for-item="itm" wx:key="idx">{{itm.zscerttypedisplay}}</text>
  </view>
</view>