caoyuanye
/
html-template


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
							<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="../../layui/css/layui.css">
  <link rel="stylesheet" href="../../c_style/css.css">
  <link rel="stylesheet" href="../../c_style/shop.css">
</head>
<body>
<div class="shop-container">
  <div class="shop-container-title">
    <i class="icon-danhao mr10"></i>
    单号：SO20093299903376
    <span class="ml20 shop-container-title-state">待确认</span>
  </div>
  <div class="shop-container-info-box">
    <div class="shop-container-info-item">
      <h4>订单信息</h4>
      <div class="shop-container-info-item-message">
        <span>状态</span>
        <p>状态</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>下单人</span>
        <p>张丹娜</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>下单时间</span>
        <p>2020-10-02 12:12:13</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>订单备注</span>
        <p>山东省济南市历下区舜华路街道长了换行展示很长很长就换行</p>
      </div>
    </div>
    <div class="shop-container-info-item">
      <h4>收货人信息</h4>
      <div class="shop-container-info-item-message">
        <span>收货人</span>
        <p>状态</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>手机号码</span>
        <p>张丹娜</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>地址</span>
        <p>山东省济南市历下区舜华路街道长了换行展示很长很长就换行</p>
      </div>
    </div>
    <div class="shop-container-info-item">
      <h4>配送信息</h4>
      <div class="shop-container-info-item-message">
        <span>配送方式</span>
        <p>状态</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>配送时效</span>
        <p>张丹娜</p>
      </div>
    </div>
    <div class="shop-container-info-item">
      <h4>付款信息</h4>
      <div class="shop-container-info-item-message">
        <span>付款方式</span>
        <p>状态</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>付款时间</span>
        <p>张丹娜</p>
      </div>
      <div class="shop-container-info-item-message">
        <span>实付金额</span>
        <p>2020-10-02 12:12:13</p>
      </div>
    </div>
  </div>
  <div class="shop-container-title">
    <i class="icon-danhao mr10"></i>
    张庄汽配店
  </div>
  <div class="shop-container-table-box">
    <table>
      <colgroup>
        <col width="8%">
        <col width="15%">
        <col width="20%">
        <col width="10%">
        <col width="10%">
        <col width="10%">
        <col width="15%">
      </colgroup>
      <thead>
      <tr>
        <th>图片</th>
        <th>品牌/名称/供应商编码</th>
        <th>规格型号/出厂编码</th>
        <th>价格</th>
        <th>数量</th>
        <th>实际发货数量</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>
          <img
            src="https://upload.jianshu.io/users/upload_avatars/14368237/e85f3cbe-9fc7-46e1-b43e-eaa734694690.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/90/h/90/format/webp"
            alt="">
        </td>
        <td>
          <div class="td-containe">
            <p>品牌/名称</p>
            <span>2218-18MMX25M</span>
          </div>
        </td>
        <td>
          <div class="td-containe">
            <span>2218-18MMX25M</span>
            <span>2218-18MMX25M</span>
          </div>
        </td>
        <td>
          <span><span class="rmb-title">￥400.00</span>（单位）</span>
        </td>
        <td>
          <span>2</span>
        </td>
        <td>
          <div class="td-containe">
            <span>1</span>
          </div>
        </td>
      </tr>
      </tbody>
    </table>
    <div class="table-operation2">
      <div class="right-oper">
        <div class="table-operation2-item">
          <span class="ml10">共选商品 <span class="color-orange">3</span>种，总数量<span class="color-orange">3</span></span>
          <span class="ml10">合计金额 <b class="color-orange">￥111111</b></span>
        </div>
        <div class="table-operation2-item">
          <span class="ml10">共选商品 <span class="color-orange">3</span>种，总数量<span class="color-orange">3</span></span>
          <span class="ml10">合计金额 <b class="color-orange">￥111111</b></span>
        </div>
      </div>
    </div>
  </div>

</div>
</body>
</html>