<template>
<div>
    <span align="center"><h2>Complete Order</h2></span><br>
    <el-table :data="tableData" stripe style="width: 100%">
        <el-table-column prop="order_no" label="Order No" sortable></el-table-column>
        <el-table-column prop="cust_marking" label="Customer Marking" sortable></el-table-column>
        <el-table-column prop="order_date" label="Order Date" sortable></el-table-column>
        <el-table-column prop="transfer_amount" label="Transfer Amount (RMB)" sortable></el-table-column>
        <el-table-column prop="status" label="Status"></el-table-column>
    </el-table><br><br>
    <div align="right">
        <el-pagination background layout="prev, pager, next" :total="30"></el-pagination>
    </div>
</div>
</template>

<script>
export default {
    data() {
      return {
        tableData: [{
          order_no: '001',
          cust_marking: 'CIEF/155ECE',
          order_date: '27/6/2018',
          transfer_amount: '1200',
          status: 'Complete',
        }, {
          order_no: '002',
          cust_marking: 'CIEF/143EDR',
          order_date: '23/6/2018',
          transfer_amount: '14000',
          status: 'Complete',
        }]
      }
    }
}
</script>