<template>
  <div>
    <el-dialog
      :title="title"
      :close-on-click-modal="false"
      v-dialogDrag
      width="1300px"
      height="500px"
      @close="close"
      @keyup.enter.native=""
      :visible.sync="visible">
      <div v-if="isShow">
        <el-radio-group v-model="checkType" size="small" @input="changeProjectType">
          <el-radio-button label="1">评估项目</el-radio-button>
          <el-radio-button label="2">会计项目</el-radio-button>
        </el-radio-group>
      </div>
      <div v-if="checkType === '1'" style="height: calc(100% - 80px);">
          <el-form size="small" :inline="true" class="query-form" ref="searchFormPG" :model="searchFormPG" @submit.native.prevent>
            <!-- 搜索框-->
            <el-form-item label="项目名称" prop="name">
              <el-input size="small" v-model="searchFormPG.name" placeholder="请输入项目名称" clearable></el-input>
            </el-form-item>
            <el-form-item label="项目编号" prop="no">
              <el-input size="small" v-model="searchFormPG.no" placeholder="请输入项目编号" clearable></el-input>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="listPG()" size="small" icon="el-icon-search">查询</el-button>
              <el-button @click="resetSearchPG()" size="small" icon="el-icon-refresh-right">重置</el-button>
            </el-form-item>
          </el-form>
          <vxe-table
            border="inner"
            auto-resize
            resizable
            height="400px"
            :loading="loading"
            size="small"
            ref="programTablePG"
            show-header-overflow
            show-overflow
            highlight-hover-row
            :menu-config="{}"
            :print-config="{}"
            @sort-change=""
            :sort-config="{remote:true}"
            :data="dataListPG"
            :row-config="{isCurrent: true}"
            :radio-config="{trigger: 'row'}">
            <vxe-column type="seq" width="60" title="序号"></vxe-column>
            <vxe-column type="radio" width="40px"></vxe-column>
            <vxe-column min-width="230px" title="项目名称" field="name" align="center"></vxe-column>
            <vxe-column min-width="80px" title="项目编号" field="no" align="center"></vxe-column>
            <vxe-column min-width="150px" title="合同名称" field="contractName" align="center"></vxe-column>
            <vxe-column min-width="90px" title="登记人" field="createBy" align="center"></vxe-column>
            <vxe-column min-width="110px" title="创建时间" field="createDate" align="center"></vxe-column>

          </vxe-table>
          <vxe-pager
            background
            size="small"
            :current-page="tablePagePG.currentPage"
            :page-size="tablePagePG.pageSize"
            :total="tablePagePG.total"
            :page-sizes="[10, 20, 100, 1000, {label: '全量数据', value: 1000000}]"
            :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
            @page-change="currentChangeHandlePG">
          </vxe-pager>
      </div>
      <div v-if="checkType === '2'" style="height: calc(100% - 80px);">
          <el-form size="small" :inline="true" class="query-form" ref="searchFormXG" :model="searchFormXG" @submit.native.prevent>
            <!-- 搜索框-->
            <el-form-item label="项目名称" prop="projectName">
              <el-input size="small" v-model="searchFormXG.projectName" placeholder="请输入项目名称" clearable></el-input>
            </el-form-item>
            <el-form-item label="项目编号" prop="projectNumber">
              <el-input size="small" v-model="searchFormXG.projectNumber" placeholder="请输入项目编号" clearable></el-input>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="listXG()" size="small" icon="el-icon-search">查询</el-button>
              <el-button @click="resetSearchXG()" size="small" icon="el-icon-refresh-right">重置</el-button>
            </el-form-item>
          </el-form>

          <vxe-table
            border="inner"
            auto-resize
            resizable
            height="400px"
            :loading="loading"
            size="small"
            ref="projectTableXG"
            show-header-overflow
            show-overflow
            highlight-hover-row
            :menu-config="{}"
            :print-config="{}"
            @sort-change=""
            :sort-config="{remote:true}"
            :data="dataListXG"
            :row-config="{isCurrent: true}"
            :radio-config="{trigger: 'row'}"
          >
            <vxe-column type="seq" width="60" title="序号"></vxe-column>
            <vxe-column type="radio" width="40px"></vxe-column>
            <vxe-column min-width="230" align="center" title="项目名称" field="projectName"></vxe-column>
            <vxe-column min-width="160" align="center" title="项目编号" field="projectNumber"></vxe-column>
            <vxe-column min-width="160" align="center" title="合同名称" field="contractName"></vxe-column>
            <vxe-column min-width="160" align="center" title="创建人" field="createBy.name"></vxe-column>
            <vxe-column min-width="160" align="center" title="创建时间" field="createDate"></vxe-column>

          </vxe-table>
          <vxe-pager
            background
            size="small"
            :current-page="tablePageXG.currentPage"
            :page-size="tablePageXG.pageSize"
            :total="tablePageXG.total"
            :page-sizes="[10, 20, 100, 1000, {label: '全量数据', value: 1000000}]"
            :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
            @page-change="currentChangeHandleXG">
          </vxe-pager>
      </div>
      <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="close()" icon="el-icon-circle-close">关闭</el-button>
      <el-button size="small" type="primary" v-if="method != 'view'" @click="getProgram()" icon="el-icon-circle-check" v-noMoreClick>确定</el-button>
    </span>
    </el-dialog>
  </div>
</template>

<script>
  import ProjectRecordsServiceXG from '@/api/cw/projectRecords/ProjectRecordsService'
  import ProgramProjectServicePG from '@/api/program/ProgramProjectListInfoService'
  export default {
    data () {
      return {
        title: '项目选择',
        method: '',
        visible: false,
        loading: false,
        tablePageXG: {
          total: 0,
          currentPage: 1,
          pageSize: 10,
          orders: []
        },
        dataListXG: [],
        searchFormXG: {
          name: '',
          no: '',
          createBy: '',
          projectMasterName: '',
          projectNumber: '',
          projectName: '',
          createDates: [],
          status: ''
        },
        tablePagePG: {
          total: 0,
          currentPage: 1,
          pageSize: 10,
          orders: []
        },
        dataListPG: [],
        searchFormPG: {
          name: '',
          no: '',
          createBy: ''
        },
        checkType: '',
        isShow: true
      }
    },
    projectRecordsServiceXG: null,
    programProjectServicePG: null,
    created () {
      this.projectRecordsServiceXG = new ProjectRecordsServiceXG()
      this.programProjectServicePG = new ProgramProjectServicePG()
    },
    components: {
    },
    methods: {
      /**
       * @param checkType
       *  1. 默认展示评估项目数据，隐藏评估、会计项目选择框
       *  2. 默认展示会计项目数据，隐藏评估、会计项目选择框
       *  3. 显示评估、会计项目选择框
       */
      init (checkType) {
        this.visible = true
        if (checkType === '1') {
          this.isShow = false
          this.checkType = '1'
          this.listPG()
        } else if (checkType === '2') {
          this.isShow = false
          this.checkType = '2'
          this.listXG()
        } else {
          this.isShow = true
          this.checkType = '1'
          this.listPG()
        }
      },
      // 表单提交
      getProgram () {
        let row
        if (this.checkType === '1') {
          if (this.commonJS.isEmpty(this.$refs.programTablePG.getRadioRecord())) {
            this.$message.error('请至少选择一条数据')
            return
          }
          row = this.$refs.programTablePG.getRadioRecord()
        } else {
          if (this.commonJS.isEmpty(this.$refs.projectTableXG.getRadioRecord())) {
            this.$message.error('请至少选择一条数据')
            return
          }
          row = this.$refs.projectTableXG.getRadioRecord()
          row.name = row.projectName
        }
        if (this.checkType === '1') {
          row.ptype = '1'
        }
        if (this.checkType === '2') {
          row.ptype = '2'
        }
        this.close()
        this.$emit('getProgram', row)
      },
      listXG () {
        this.loading = true
        this.searchFormXG.status = '5'
        this.projectRecordsServiceXG.list2({
          'current': this.tablePageXG.currentPage,
          'size': this.tablePageXG.pageSize,
          'orders': this.tablePageXG.orders,
          ...this.searchFormXG
        }).then(({data}) => {
          this.dataListXG = data.records
          this.tablePageXG.total = data.total
          this.loading = false
        })
      },
      // 当前页
      currentChangeHandleXG ({currentPage, pageSize}) {
        this.tablePageXG.currentPage = currentPage
        this.tablePageXG.pageSize = pageSize
        this.listXG()
      },
      resetSearchXG () {
        this.$refs.searchFormXG.resetFields()
        this.listXG()
      },
      listPG () {
        this.loading = true
        this.searchFormPG.status = '5'
        this.programProjectServicePG.list2({
          'current': this.tablePagePG.currentPage,
          'size': this.tablePagePG.pageSize,
          'orders': this.tablePagePG.orders,
          ...this.searchFormPG
        }).then(({data}) => {
          this.dataListPG = data.records
          this.tablePagePG.total = data.total
          this.loading = false
        })
      },
      // 当前页
      currentChangeHandlePG ({currentPage, pageSize}) {
        this.tablePagePG.currentPage = currentPage
        this.tablePagePG.pageSize = pageSize
        this.listPG()
      },
      resetSearchPG () {
        this.$refs.searchFormPG.resetFields()
        this.listPG()
      },
      close () {
        this.visible = false
      },
      changeProjectType () {
        if (this.checkType === '1') {
          this.listPG()
        }
        if (this.checkType === '2') {
          this.listXG()
        }
      }
    }
  }
</script>
<style>
  .messageZindex {
    z-index:9999 !important;
  }
</style>
