<template>
  <div style="margin:30px 20px 20px">
    <el-form class="form-header" :model="pageOption" ref="queryForm" label-position="right" label-width="auto"
      size="small">
      <el-row>
        <el-col :span="6">
          <el-form-item label="航班号" prop="fltNo">
            <el-input class="wid80" v-model="queryfltNo" placeholder="请输入航班号" maxlength="50" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="预审状态" prop="status">
            <el-select class="wid80" v-model="pageOption.status" clearable placeholder="不限">
              <el-option label="关闭" :value="0">
              </el-option>
              <el-option label="开启" :value="1">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="mb20" ref="preReviewOptions" style="font-size: 12px; font-weight: 700">
      <el-button type="primary" icon="el-icon-search" size="small" :loading="tableLoading" @click="preQuery(1)">搜 索
      </el-button>
      <el-button type="primary" icon="el-icon-plus" size="small" @click="dialogVisible = true">新增预审航班</el-button>
      <el-button type="primary" size="small" icon="el-icon-check" :disabled="selectData.length == 0"
        @click="preOption(1)">
        预审开启</el-button>
      <el-button type="primary" size="small" icon="el-icon-close" :disabled="selectData.length == 0"
        @click="preOption(0)">
        预审关闭</el-button>
      <el-button type="danger" icon="el-icon-delete" size="small" :disabled="selectData.length == 0"
        @click="preOption(2)">删 除
      </el-button>
    </div>
    <Tables ref="preFlight" ductName="preFlight" :selection="true" :selectFixed="false" :order='true'
      :height="tableHeight" :data="flightData" :headerData="tableHeaders" :page="pageOption.page" :pageSizes="[20]"
      :totalCount="total" :loading="tableLoading" @currentChange="currentChange"
      layout="total,prev, pager, next, jumper, ->" @tableSelect="tableSelection" @tableSelectAll="tableSelectAll">
    </Tables>
    <el-dialog title="新增预审航班" width="20%" :visible.sync="dialogVisible" :close-on-click-modal="false"
      :show-close="false" :append-to-body="true">
      <el-form ref="addForm" :model="newPre" label-width="auto" label-position="left" size="small" :rules="rules"
        @submit.native.prevent>
        <el-form-item label="航班号" prop="addFlitNo">
          <el-input type="textarea" v-model="fltNo" :rows="7" maxlength="255" show-word-limit placeholder="请输入航班号，用;分隔">
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button type="primary" :loading="loading" @click="submit">确 定</el-button>
        <el-button @click="close">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getpreAudit, addPreFlight, updatePreStatus } from '@/api/system/preReview.js'

export default {
  name: "PreReviewFlight",
  data() {
    return {
      pageOption: {
        fltNo: undefined,
        page: 1,
        size: 20
      },//查询条件
      tableHeaders: [
        {
          columnChineseName: "航班号",
          columnName: "fltNo",
          columnWidth: "",
          status: 1
        },
        {
          columnChineseName: "预审状态",
          columnName: "status",
          columnWidth: "",
          status: 1
        },
      ],//表头
      flightData: [],//表格数据
      selectData: [],//选中数据
      newPre: {
        addFlitNo: '',
      },//新增航班
      rules: {
        fltNo: [
          {
            required: true,
            message: "航班号不能为空",
            trigger: "blur",
          }
        ]
      },//表单规则
      dialogVisible: false,
      total: 0,
      tableHeight: null,
      loading: false,
      tableLoading: false,
    };
  },
  created() {
    this.preQuery(1)
  },
  activated() {
    if (this.flightData.length > 0) {
      this.preQuery()
    }
  },
  mounted() {
    this.tableHeight = window.innerHeight - this.$refs.preReviewOptions.offsetHeight - 300
  },
  methods: {
    //搜索
    preQuery(val) {
      this.tableLoading = true
      this.selectData = []
      if (val === 1) {
        this.pageOption.page = 1
      }
      getpreAudit(this.pageOption).then(res => {
        this.tableLoading = false
        if (res.code === 200) {
          this.flightData = res.data.list
          this.total = res.data.total
        } else {
          this.msgWarning(res.msg)
        }
      }).catch(err => {
        this.tableLoading = false
        console.log(err)
      })
    },
    //保存
    submit() {
      this.$refs["addForm"].validate(val => {
        if (val) {
          this.loading = true
          let fltList = []
          this.newPre.addFlitNo.split(';').forEach(item => {
            if (item != '') {
              fltList.push(item)
            }
          })
          addPreFlight(fltList).then(res => {
            this.loading = false
            if (res.code === 200) {
              this.msgSuccess('添加成功')
              this.close()
              this.preQuery(1)
            } else {
              this.msgWarning(res.msg)
            }
          }).catch(err => {
            this.loading = false
            console.log(err)
          })
        }
      })
    },
    //预审状态修改
    preOption(val) {
      this.$confirm(val === 2 ? '是否要删除？' : val === 0 ? '是否要关闭预审' : '是否要开启预审', '系统提示', {
        closeOnClickModal: false,
        confirmButtonText: '确定',
        cancelButtonText: "取消",
        type: 'warning'
      }).then(() => {
        let idList = []
        this.selectData.forEach(item => {
          idList.push(item.id)
        })
        updatePreStatus({ ids: idList, status: val }).then(res => {
          if (res.code === 200) {
            this.msgSuccess(val === 2 ? '删除成功' : val === 0 ? '关闭成功' : '开启成功')
            this.preQuery(1)
          } else {
            this.msgWarning(res.msg)
          }
        }).catch(err => {
          console.log(err)
        })
      }).catch()
    },
    //关闭弹窗
    close() {
      this.dialogVisible = false
      this.newPre.addFlitNo = ''
    },
    //翻页
    currentChange(val) {
      this.pageOption.page = val.page
    },
    //多选
    tableSelection(val) {
      this.selectData = val.selection
    },
    //全选
    tableSelectAll(val) {
      this.selectData = val
    },
  },
  computed: {
    queryfltNo: {
      get: function () {
        return this.pageOption.fltNo;
      },
      set: function (val) {
        this.pageOption.fltNo = this.upCase(val);
      },
    },
    fltNo: {
      get: function () {
        return this.newPre.addFlitNo;
      },
      set: function (val) {
        let reg = /^([0-9A-Za-z]{0,50}(\;[0-9a-zA-Z]{0,50})*)$/
        if (reg.test(val)) {
          this.newPre.addFlitNo = this.upCase(val);
        }
      },
    }
  }
};
</script>
<style rel="stylesheet/scss" lang="scss">
</style>