<template>
  <div>
    <el-dialog
      title="货物配舱"
      width="80%"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <el-divider content-position="left">已选货物信息</el-divider>
      <el-table
        :data="tableData"
        size="mini"
        height="200"
        max-height="200"
        border
        stripe
        style="width: 100%"
      >
        <el-table-column type="index" label="序号" align="center">
        </el-table-column>
        <el-table-column
          v-for="(item, index) in cargoHeader"
          header-align="center"
          align="center"
          :prop="item.value"
          :label="item.name"
          :key="index"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
      </el-table>
      <el-divider content-position="left">可配置航班信息</el-divider>
      <el-table
        :data="fltData"
        size="mini"
        height="200"
        max-height="200"
        border
        stripe
        style="width: 100%"
      >
        <el-table-column type="index" label="序号" align="center">
        </el-table-column>
        <el-table-column
          v-for="(item, index) in fltHeader"
          header-align="center"
          align="center"
          :prop="item.value"
          :label="item.name"
          :key="index"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
      </el-table>
      <el-form
        ref="form"
        label-width="auto"
        style="width: 400px; margin: 30px auto"
      >
        <el-form-item label="航班号">
          <el-input
            v-model="fltNo"
            size="medium"
            placeholder="请输入航班号"
            style="width: 350px"
          ></el-input>
        </el-form-item>
        <el-form-item label="航班日期:">
          <el-date-picker
            v-model="formData.fltDate"
            type="date"
            placeholder="选择日期"
            value-format="yyyy-MM-dd"
            size="medium"
            style="width: 350px"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="dialogBeforeClose">取 消</el-button>
        <el-button type="primary" @click="submit">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { findAllFltDataApi } from "@/api/findAllFltData";
export default {
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
    tableData: {
      type: Array,
      default: null,
    },
  },
  data() {
    return {
      formData: { fltNo: "" },
      fltSelect:{
         limitStart: 0, //当前条数【代表第几条数据 +1开始】
          pageNum: 1,
          limitSize: -1, //一页显示多少条数据
          fltDateStart: undefined, //航班日期开始
          fltDateEnd: undefined, //航班日期结束
          typeId: undefined, //航班类型
          statusId: '83937', //航班状态
          flightKindId: undefined, //航班种类
          fltNo: undefined //航班号，要大写
      },
      cargoHeader: [
        { name: "口岸代码", value: "portName" },
        { name: "运单号", value: "waybillNo" },
        { name: "货物状态", value: "statusName" },
        { name: "站点", value: "siteName" },
        { name: "申报类型", value: "typeName" },
        { name: "URSA", value: "ursa" },
        { name: "实际重量", value: "actualWeight" },
        { name: "件数", value: "qty" },
        { name: "品名描述", value: "nameDescription" },
        { name: "是否自动", value: "cargoRulesStatus" },
        { name: "创建人", value: "createUserName" },
        { name: "创建时间", value: "createTime" },
      ],
      fltHeader: [
        { name: "航班日期", value: "fltDate" },
        { name: "航班号", value: "fltNo" },
        { name: "航班路线", value: "route" },
        { name: "航班类型", value: "typeName" },
        { name: "总重量", value: "totalWeight" },
        { name: "额外增重百分比", value: "extraWeightPercent" },
        { name: "已配重量", value: "alloctedWeight" },
        { name: "配舱优先级", value: "priorityRuleName" },
        { name: "是否开启高地价", value: "highLowPriceFlg" },
        { name: "航班起飞时间", value: "takeOffTime" },
        { name: "创建人", value: "createUserName" },
        { name: "创建时间", value: "createTime" },
      ],
      fltData: [],
    };
  },
  methods: {
    submit() {
      this.$emit("dialogBeforeClose", false);
    },
    dialogBeforeClose() {
      this.$emit("dialogBeforeClose", false);
    },
  },
  watch:{
  },
  computed: {
    fltNo: {
      get: function () {
        return this.formData.fltNo;
      },
      set: function (val) {
        this.formData.fltNo = val.toUpperCase();
      },
    },
  },
};
</script>

<style>
</style>