@include('css')
<style>
    * {
        box-sizing: border-box;
    }

    .row {
        display: flex;
        flex-direction: row;
    }

    .column {
        display: flex;
        flex-direction: column;
    }

    .bothSide {
        justify-content: space-between;
    }

    .avarage {
        justify-content: space-around;
    }

    .rowCenter {
        justify-content: center;
    }

    .verCenter {
        align-items: center;
    }

    .order-page {
        padding: 20px;
    }

    .layui-form-label {
        width: 95px;
        white-space: nowrap;
    }

    .layui-input-block {
        margin-left: 95px;
    }

    .layui-card {
        box-shadow: none;
        margin-bottom: 0;
    }
</style>

<section class="order-page">
    <div class="layui-card">
        <div class="layui-card-header">基本信息</div>
        <div class="layui-card-body">
            <div class="layui-inline">
                <label class="layui-form-label">订单编号：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">SM202210120001SM202210120001</div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">订单状态：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">U72622-18587454747</div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">公司名称：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">Samsung company Samsung company</div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">客户编码：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">U72622-18587454747</div>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">联系人：</label>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">习近平</div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-card">
        <div class="layui-card-header">商品信息</div>
        <div class="layui-card-body">
            <div id="list"></div>
        </div>
    </div>
</section>


<script type="text/javascript" src="/assets/libs/layui/layui.js?v={{time()}}"></script>
<script>
  layui.use(['form', 'table', 'laydate'], function () {
    var $ = layui.$;
    var form = layui.form;
    var table = layui.table;


    window.IndexController = {
      init: function () {
        this.created(this).render(this).handleBind(this);
      },
      created: function () {

        return this;
      },
      render: function () {
        table.render({
          elem: '#list',
          url: '/admin/api/orderList',
          method: 'GET',
          cols: [[
            {type: 'numbers', fixed: true,title:'序号',width: 60},
            {field: 'goods_id', title: 'SKUID', width: 120},
            {field: 'goods_name', title: '商品型号', width: 120},
            {field: 'purchase_name', title: '标准品牌', width: 120},
            {field: 'other_amount', title: '供应商', width: 120},
            {field: 'other_amount', title: '供应商物料唯一编码', width: 160},
            {field: 'other_amount', title: '供应商物料品牌', width: 160},
            {field: 'other_amount', title: '采购员', width: 120},
            {field: 'other_amount', title: '币种', width: 120},
            {field: 'other_amount', title: '单价', width: 120},
            {field: 'goods_price', title: '数量', width: 120},
            {field: 'goods_price', title: '小计', width: 120},
            {field: 'goods_price', title: '折扣', width: 120},
            {field: 'goods_price', title: '其他费用', width: 120},
            {field: 'other_amount', title: '合计', width: 120},
            {field: 'other_amount', title: '货期', width: 120},
            {field: 'other_amount', title: '批次', width: 120},
            {field: 'other_amount', title: '客户备注', width: 120},
            {field: 'other_amount', title: '售后类型', width: 120},
            {field: 'other_amount', title: '售后数量', width: 120},
            {field: 'other_amount', title: '售后单价', width: 120},
            {field: 'other_amount', title: '售后金额', width: 120}
          ]],
          parseData: LayUiTableParseData,
          page: true,
          size: 'sm',
          cellMinWidth: 80,
          defaultToolbar: ['filter'],
          limit: 15,
          limits: [15, 50, 100, 200],
          done: function (res, curr, count) {
            layui.form.render();
          }
        });

        return this;
      },
      handleBind: function () {

        return this;
      }
    }

    IndexController.init();
  });
</script>
@include('js')