<template>
<div class="associated-order">
     <h1 class="title">
       关联订单-{{orderDetails.orderNo}}
     </h1>
  <el-divider></el-divider>
  <orde-details-form  :details ="orderDetails" ></orde-details-form>
  <el-divider></el-divider>
  <el-form inline label-width="100px">
    <el-form-item label="订单号"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="唛头"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="商品类型"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="商品名称"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="运输方式"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="出货渠道"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="客户名称"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="客户手机号"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item label="商品特性"><div class="content">
      <el-input></el-input>
    </div></el-form-item>
    <el-form-item><div class="content">
      <el-button>查询</el-button>
      <el-button>重置</el-button>
    </div></el-form-item>
  </el-form>
  <el-divider></el-divider>
   <div style="display: flex;align-items: center;">
     <h1 class="title">
       已加入关联订单列表
     </h1>
       <div style="flex: 1;margin-left: 20px;">
         <el-button type="primary">批量移出</el-button>
       </div>
     <div>
       <el-button type="primary">添加关联订单</el-button>
     </div>
   </div>
   <el-table>
     <el-table-column
       type="selection"
       width="55">
     </el-table-column>
     <el-table-column label="序号"></el-table-column>
     <el-table-column label="订单号"></el-table-column>
     <el-table-column label="唛头"></el-table-column>
     <el-table-column label="商品名列表"></el-table-column>
     <el-table-column label="货物特性"></el-table-column>
     <el-table-column label="货物材质"></el-table-column>
     <el-table-column label="货物数据"></el-table-column>
     <el-table-column label="入仓时间"></el-table-column>
     <el-table-column label="状态"></el-table-column>
     <el-table-column label="操作人"></el-table-column>
     <el-table-column label="操作时间"></el-table-column>
     <el-table-column label="操作"></el-table-column>
   </el-table>
</div>
</template>

<script>
//关联订单
import ordeDetailsForm from "@/views/ecw/order/components/ordeDetailsForm";
import {getOrder} from "@/api/ecw/order";

export default {
  name: "associatedOrder",
  props:{
    orderId:[String,Boolean]
  },
  components:{
    ordeDetailsForm
  },
  data(){
    return {
      orderDetails:{}
    }
  },
  created() {
    getOrder(this.orderId).then( r =>{
      if(r.code === 0){
        this.orderDetails = r.data;
      }
    })
  },
}
</script>

<style scoped lang="scss">
.associated-order{
  padding: 20px;
  box-sizing: border-box;
  .title{
    font-size: 30px;
    font-weight: 600;
  }
}
</style>
