/*
 * @description: 选择差旅事前申请单
 */
<template>
  <div>
    <EMSTableNew
      ref="emsTable"
      :action="action"
      :params="searchForm"
      :columnsFn="codeColumns"
      :highlight-row="true"
      :rowClickHandle="rowClick"
    >
      <Form
        ref="searchForm"
        slot="search-bar"
        inline
        :labelWidth="80"
        style="margin-top:15px"
        :model="searchForm"
      >
        <Row>
          <Col span="8">
          <FormItem
            prop="claimNo"
            label="申请单号"
          >
            <Input
              v-model="searchForm.claimNo"
              type="text"
              placeholder="请输入"
            ></Input>
          </FormItem>
          </Col>
          <Col span="16">
          <div class="search_btns ivu-form-item">
            <Button
              type="warning"
              @click.native="search"
            >
              查询
            </Button>
            <Button @click.native="reset">
              重置
            </Button>
          </div>
          </Col>
        </Row>
      </Form>
    </EMSTableNew>
  </div>
</template>
<script>
export default {
  name: 'SelectBizTripApply',
  directives: {},
  props: {
    title: {
      type: String,
      default() {
        return '请选择事前申请单';
      }
    },
    action: {
      type: String,
      default: '/ems/bill-service/travel-fee-before/queryBizTripPaForPage'
    },
    emplId: {
      type: String,
      default: ''
    },
    actualOrgDept: {
      type: String,
      default: ''
    },
    relationStatus: {
      type: String,
      default: 'N'
    }
  },
  data() {
    return {
      searchForm: {
        claimNo: '',
        emplId: this.emplId,
        actualOrgDept: this.actualOrgDept,
        relationStatus: this.relationStatus
      }
    };
  },
  created: function() {
    this.$emit('SetTitle', this.title);
  },
  methods: {
    // 获取成本中心
    codeColumns() {
      return [
        {
          title: '申请单号',
          align: 'left',
          key: 'claimNo',
          resizable: true,
          width: 200
        },
        {
          title: '出差人',
          key: 'empName',
          resizable: true,
          align: 'left'
        },
        {
          title: '职务',
          key: 'empJobName',
          resizable: true,
          align: 'left'
        },
        {
          title: '出发地',
          key: 'departureAreaName',
          resizable: true,
          align: 'left'
        },
        {
          title: '目的地',
          key: 'destinationName',
          align: 'left'
        }
      ];
    },
    search(page = 1) {
      this.$refs.emsTable.load(this.searchForm, page);
    },
    reset() {
      this.searchForm.claimNo = '';
      this.search(1);
    },
    rowClick(selection) {
      if (selection) {
        this.$emit('Close', selection);
      }
    }
  }
};
</script>