<!--
  @description: 专家库-抽取项目-添加项目弹框
  @Modifier: qrf
  @routerPath:
  @date: 2020/10/26
-->
<template>
  <el-dialog :visible.sync="dialogData.dialog" title="选择项目">
    <el-form :model="searchForm" inline>
      <el-form-item label="项目名称">
        <el-input v-model="searchForm.tenderName" />
      </el-form-item>
      <el-form-item label="项目编号">
        <el-input v-model="searchForm.tenderNo" />
      </el-form-item>
      <div class="fr">
        <el-button type="primary" @click="search('searchForm')">
          搜索
        </el-button>
        <el-button plain type="info" @click="resetForm('searchForm')">
          重置
        </el-button>
      </div>
    </el-form>
    <el-table
      v-loading="loading"
      :data="projectData"
      class="tableLimit"
      size="mini"
      highlight-current-row
      @selection-change="currentChange"
    >
      <el-table-column type="selection" />
      <el-table-column label="序号" type="index" />
      <el-table-column label="项目名称" prop="tenderName" />
      <el-table-column label="项目编号" prop="tenderNo" />
      <el-table-column label="标段名称" prop="packName" />
      <el-table-column label="标段编号" prop="packNo" />
    </el-table>
    <!--分页组件-->
    <pagination :pagination-data="paginationData" @change="loadData" />
    <div slot="footer" class="dialog-footer" style="text-align: center">
      <el-button type="primary" @click="ensure">
        确 定
      </el-button>
      <el-button @click="dialogData.dialog = false">
        取 消
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
/* api */
import { getTenderAndPackageList } from '@/api/expert/extractExpert/extractExpert'
/* 公共参数方法*/
import { filterObj } from '@/assets/js/utils'
/* 分页组件*/
import pagination from '@comp/common/pagination/pagination'

export default {
  name: 'AddEtractProjectDialog',
  components: {
    pagination
  },
  props: {
    dialogData: {
      type: Object,
      default: function() {
        return
      }
    }
  },
  data() {
    return {
      loading: true,
      // 搜索数据
      searchForm: {
        tenderName: '', // 项目名称
        tenderNo: '' // 项目编号
      },
      paginationData: {
        pageNo: 1,
        pageSize: 10,
        total: 0
      },
      // 表数据
      projectData: [],
      currentData: {}// 当前选择的信息
      // totalPage: 0
    }
  },
  watch: {
    'dialogData.dialog'(val) {
      if (val) {
        this.searchForm.tenderNo = ''
        this.searchForm.tenderName = ''
        this.loadData()
      }
    }
  },
  methods: {
    // 当前选择的信息
    currentChange(val) {
      this.currentData = val
    },
    // 初始化数据
    loadData() {
      const params = this.getQueryParams()// 查询条件
      params.departRoleName = '10'
      // const data = this.searchForm
      getTenderAndPackageList(params).then((res) => {
        this.loading = false
        this.projectData = res.data.records
        this.paginationData.total = res.data.total
      }).catch(() => {
        this.loading = false
      })
    },
    // 查询条件
    getQueryParams() {
      const param = Object.assign({}, this.searchForm)
      param.pageNo = this.paginationData.pageNo
      param.pageSize = this.paginationData.pageSize
      return filterObj(param)
    },
    // 搜索重置
    resetForm(formName) {
      this.searchForm.tenderNo = ''
      this.searchForm.tenderName = ''
      this.paginationData.pageNo = 1
      this.paginationData.pageSize = 10
      this.loadData()
    },
    // 搜索
    search() {
      this.paginationData.page = 1
      this.paginationData.pageSize = 10
      this.loadData()
    },
    ensure() {
      if (this.currentData) {
        const data = this.currentData
        this.$emit('extractProjectDialogInfo', data)
        this.dialogData.dialog = false
      } else {
        this.$message({
          message: `请选择${this.title}`,
          type: 'warning'
        })
      }
    }
  }
}
</script>
