<template>
    <div>
        <div>
            <div style="display: flex;align-items: center;margin-bottom: 10px;">
                <div style="width: 5px;height: 20px;background: #2d8cf0;margin-right: 8px;border-radius: 2px;"></div>
                <span style="font-size: 18px;color: #2d8cf0;">箱货动态</span>
            </div>
            <el-table
                :data="luHaiTongData.containerCargoInfos"
                border
                size="mini"
                :row-style="{height:'20px',padding:'0px',fontSize:'12px'}"
                :cell-style="{padding:'0px',fontSize:'12px'}"
                style="width: 100%">
                <el-table-column prop="containerNo" label="箱号" width="110" />
                <el-table-column label="尺寸/箱型" width="100" >
                    <template slot-scope="{ row }">{{row.size}}{{row.property}}</template>
                </el-table-column>
                <el-table-column prop="sealNo" label="封号" width="90" />
                <el-table-column prop="inOrOut" label="内/外点" width="70" />
                <el-table-column prop="getContainerDate" label="提箱时间" />
                <el-table-column prop="returnDate" label="返场时间" />
                <el-table-column prop="portDate" label="集港时间" />
                <el-table-column prop="containerWeight" label="箱皮重" width="80" />
                <el-table-column prop="payload" label="最大载荷" width="80" />
                <el-table-column prop="carNo" label="车号"/>
                <el-table-column prop="billNo" label="提单号"/>
                <el-table-column prop="vgmWeight" label="VGM重量" width="80" />
                <!--<el-table-column prop="containerCheckNo" label="箱检划拨号" width="90" />-->
                <!--<el-table-column prop="containerCheckDate" label="箱检有效期" width="90"/>-->
                <!--<el-table-column prop="stampNo" label="封条号"/>-->
            </el-table>
        </div>

        <div style="margin-top: 10px;">
            <div style="display: flex;align-items: center;margin-bottom: 10px;">
                <div style="width: 5px;height: 20px;background: #2d8cf0;margin-right: 8px;border-radius: 2px;"></div>
                <span style="font-size: 18px;color: #2d8cf0;">实际装货信息</span>
            </div>
            <el-table
                :data="luHaiTongData.loadingInfos"
                border
                size="mini"
                :row-style="{height:'20px',padding:'0px',fontSize:'12px'}"
                :cell-style="{padding:'0px',fontSize:'12px'}"
                style="width: 100%">
                <el-table-column prop="billNo" label="分提单号"/>
                <el-table-column prop="containerNo" label="箱号" />
                <el-table-column prop="size" label="尺寸" />
                <el-table-column prop="property" label="箱型" />
                <el-table-column prop="sealNo" label="铅封" />
                <el-table-column prop="number" label="实装件数" />
                <el-table-column prop="pack" label="包装方式"  />
                <el-table-column prop="weight" label="实装重量" />
                <el-table-column prop="vol" label="实装尺码" />
            </el-table>
        </div>

    </div>
</template>

<script>
    export default {
        props:{
            luHaiTongData:{
                type:Object,
                default: {}
            },
        },
        data(){
            return {

            }
        },
    }
</script>

<style scoped>

</style>
