<template>
    <div>
        <div class="mrg-b">
          <!--<drop-filter :columns="wholeLabels" :storeKey="storeKey" :storeLabels="storeLables" @doFilter="labels => storeLables = labels"></drop-filter>-->
            <el-table
            ref="table"
            stripe
            border
            :max-height="tableMaxHeight"
            :data="tableData"
            :filteredLabels="storeLables"
            style="width: 100%">
            <table-column
                label="装车单号"
                prop="ldNo">
            </table-column>
            <table-column
                label="订单状态">
                <template slot-scope="scope">
                  <p>{{ $utils.keyMatcher(scope.row.headerStatus, $keys.stockOut.loadingList.headerStatus).name }}</p>
                </template>
            </table-column>
            <table-column
                label="装车单类型">
                <template slot-scope="scope">
                    {{ $utils.keyMatcher(scope.row.ldType, $keys.stockOut.loadingList.ldType).name }}
                </template>
            </table-column>
            <table-column
                label="车型"
                prop="vehicleType">
                <template slot-scope="scope">
                    {{ $utils.keyMatcher(scope.row.vehicleType, $keys.platform.vehicleType).name }}
                </template>
            </table-column>
            <table-column
                label="车牌号"
                prop="vehicleNo">
            </table-column>
            <table-column
                label="驾驶员"
                prop="driver">
            </table-column>
            <table-column
                label="预计装车时间">
                <template slot-scope="scope">
                    <p>从：{{scope.row.fmLdTime}}</p>
                    <p>到：{{scope.row.toLdTime}}</p>
                </template>
            </table-column>
            <table-column
                label="装车交接人"
                prop="deliverOp">
            </table-column>
            <table-column
                label="装车交接时间"
                prop="deliverTime">
            </table-column>
            <table-column
                label="月台"
                prop="dockCode">
            </table-column>
            <table-column
                label="发运订单"
                prop="soNo">
            </table-column>
            <table-column
                label="物流单号"
                prop="logisticNo">
            </table-column>
            <table-column
                label="出库单类型"
                prop="soType">
                <template slot-scope="scope">
                    {{ $utils.keyMatcher(scope.row.soType, $keys.stockOut.soType).name }}
                </template>
            </table-column>
            <table-column
                label="出库单状态"
                prop="soStatus">
                <template slot-scope="scope">
                    {{ $utils.keyMatcher(scope.row.soStatus, $keys.storageTasks.soStatus).name }}
                </template>
            </table-column>
            <table-column
                label="商品">
                <template slot-scope="scope">
                  <p>{{scope.row.skuCode}}</p>
                  <p>{{scope.row.skuName}}</p>
                </template>
            </table-column>
            <table-column
                label="包装单位"
                prop="uom">
            </table-column>
            <table-column
                label="发货数"
                prop="qtyUom">
            </table-column>
            <table-column
                label="重量(吨)"
                prop="weight">
            </table-column>
            <table-column
                label="体积"
                prop="cubic">
            </table-column>
            <table-column
                label="发货时间"
                prop="shipTime">
            </table-column>
            <table-column
                label="收货人">
                <template slot-scope="scope">
                  <p>{{scope.row.consigneeCode}}</p>
                  <p>{{scope.row.consigneeName}}</p>
                </template>
            </table-column>
            <table-column
                label="联系人"
                prop="contactName">
            </table-column>
            <table-column
                label="联系人电话"
                prop="consigneeTel">
            </table-column>
            <table-column
                label="联系人地址"
                prop="consigneeAddr">
            </table-column>
            </el-table>
            </div>
            <div>
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[10, 20, 50, 100]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
            </el-pagination>
        </div>
    </div>
</template>
<script>
export default {
  data () {
    return {

      storeKey: 'ldDetail'
    }
  },
  props: {
    tableData: {
      type: Array,
      default: () => []
    },
    total: Number,
    currentPage: Number,
    pageSize: Number,
  },
  methods: {

    // 当前页码
    handleCurrentChange (currentPage) {
      const query = { 'page.currentPage': currentPage, 'page.limitCount': this.pageSize }
      this.$emit('getList', query)
    },

    // 每页显示条数
    handleSizeChange (pageSize) {
      const query = { 'page.currentPage': this.currentPage, 'page.limitCount': pageSize }
      this.$emit('getList', query)
    },
  }
}
</script>
<style lang="scss" scoped>
    .mrg-b{
        margin-bottom: 20px;
    }
    .mrg-l{
        margin-left:10px;
    }
    .blue{
      cursor:pointer;
      color:#0682ea
    }
</style>
