/*
 * @description:  选择专项
 */
<template>
  <div>
    <EMSTable
      ref="projectTable"
      :params="searchForm"
      :action="action"
      :columns="columns"
      highlight-row
      :rowClickHandle="onRowClick"
    >
      <Form ref="searchForm" slot="search-bar" label-position="top" inline>
        <FormItem label="项目编码">
          <Input v-model="searchForm.projectCode" type="text" placeholder="请输入"></Input>
        </FormItem>
        <FormItem label="项目名称">
          <Input v-model="searchForm.projectName" type="text" placeholder="请输入"></Input>
        </FormItem>
      </Form>
      <div slot="handle-bar">
        <Button type="warning" icon="ios-search" @click.native="search">查询</Button>
        <Button type="info" icon="ios-refresh" @click.native="reset">重置</Button>
      </div>
    </EMSTable>
  </div>
</template>
<script>
export default {
  name: "SelectProject",
  props: {
    title: {
      type: String,
      default() {
        return "请选择项目";
      }
    },
    bizLineCode: {
      type: String,
      default: "GF"
    },
    buCode: {
      type: String,
      default: "B18"
    },
    budgetYear: {
      type: String,
      default: ""
    },
    empId: {
      type: String,
      default: "",
      required: true
    },
    subcategoryCode: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      action: `/ems/ems-base-application/projectManage/queryForPageYear?bizLineCode=${this.bizLineCode}&budgetYear=${this.budgetYear}&subcategoryCode=${this.subcategoryCode}`,
      searchForm: {
        projectCode: "",
        projectName: "",
        bizLineCode: this.bizLineCode,
        buCode: this.buCode,
        budgetYear: this.budgetYear,
        empId: this.empId,
        subcategoryCode: this.subcategoryCode
      },
      columns: [
        {
          title: "BU编码",
          key: "buCode",
          width: 180
        },
        {
          title: "项目名称",
          minWidth: 180,
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {
                  class: "ivu-table-cell ivu-table-cell-ellipsis",
                  title: params.row.projectName
                }
              },
              params.row.projectName
            );
          }
        },
        {
          title: "项目编码",
          key: "projectCode",
          width: 180
        },
        {
          title: "是否有效",
          width: 110,
          render: (h, params) => {
            return params.row.isValidity
              ? h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: params.row.isValidity == "Y" ? "warning" : "error"
                    }
                  },
                  params.row.isValidity == "Y" ? "有效" : "无效"
                )
              : null;
          }
        }
      ]
    };
  },
  created: function() {
    this.$emit("SetTitle", this.title);
  },
  mounted: function() {
    this.$emit("SetPageSize", window.innerWidth * 0.85);
  },
  methods: {
    search(page = 1) {
      this.$refs.projectTable.load(this.searchForm, page);
    },
    reset() {
      this.searchForm.projectName = "";
      this.searchForm.projectCode = "";
      this.search();
    },
    onRowClick(selected, index) {
      this.$emit("Close", selected);
    }
  }
};
</script>
<style lang="less" scoped>
</style>