<template>
  <div :class="$style.selectproject">
    <audit-advanced-query
      :expand="expand"
      :search-data="formData"
      :ref-name="searchform"
      :search-style="{ height: 'auto', left: '21px', top: '105px' }"
      :search-fun="handleSearch"
      @searchedClick="searchedClick"
    >
      <template>
        <a-col :span="12">
          <a-form-model-item :label="'项目名称'" prop="projectTitle">
            <a-input v-model="formData.projectTitle" allow-clear />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item :label="'项目编号'" prop="projectCode">
            <a-input v-model="formData.projectCode" allow-clear />
          </a-form-model-item>
        </a-col>
        <!-- <a-col :span="8">
          <a-form-model-item label="年度" prop="year">
            <a-date-picker
              v-model="formData.year"
              mode="year"
              picker="YYYY"
              format="YYYY"
              :allow-clear="false"
              placeholder="选择年度"
              :input-read-only="true"
              :value="year"
              :open="endOpen"
              @panelChange="yearChange"
              @openChange="handleEndOpenChange"
            ></a-date-picker>
          </a-form-model-item>
        </a-col> -->
      </template>
    </audit-advanced-query>
    <!-- 列表 -->
    <sd-data-table-ex
      ref="WBDataTable"
      :show-advance-btn="true"
      form-id="iamExternalProject"
      page-id="audit/externalProject/iamExternalProject"
      :pagination="{ pageSize: 10 }"
      :filter-expressions="filterExpressions"
      :check-type="'radio'"
      :columns="columns"
      :show-advance-query="true"
      :search-fields="['projectTitle', 'inspectionOrg', 'inspectionType']"
      show-selection
      :process-res="processRes"
      :custom-row="
        (record, index) => {
          return {
            on: {
              dblclick: () => {
                fndblclick(record, index)
              },
            },
          }
        }
      "
      @searchbtnClick="searchbtnClick"
      @onChange="onChange"
    >
    </sd-data-table-ex>
  </div>
</template>

<script>
import moment from 'moment'
import auditAdvancedQueryMixins from '../../components/audit-advanced-query-mixins'
import auditAdvancedQuery from '../../components/audit-advanced-query.vue'
import components from './_import-components/audit-wb-selectproject-import'
const columns = [
  {
    title: '序号',
    customRender: (text, record, index) => `${index + 1}`,
    width: '80px',
  },
  {
    title: '项目名称',
    dataIndex: 'projectTitle',
    scopedSlots: { customRender: 'islink' },
    width: '35%',
  },
  {
    title: '项目编号',
    dataIndex: 'projectCode',
    width: '15%',
    defaultSortOrder: 'desc',
  },
  {
    title: '外部检查机构',
    dataIndex: 'inspectionOrg',
    sdHidden: true,
  },
  {
    title: '被检查机构',
    dataIndex: 'auditedUnitNames',
  },
  {
    title: '外部项目联系人',
    dataIndex: 'linkMan',
  },
  {
    title: '被检查类型',
    dataIndex: 'auditedUnitIds',
    sdHidden: true,
  },
  {
    title: '创建时间',
    dataIndex: 'creationTime',
    sdHidden: true,
  },
]
export default {
  name: 'AuditWbSelectproject',
  metaInfo: {
    title: '外部项目',
  },
  components: {
    ...components,
    auditAdvancedQuery,
  },
  mixins: [auditAdvancedQueryMixins],
  data() {
    return {
      formData: {
        projectTitle: '',
        projectCode: '',
        year: '',
      },
      columns,

      // 高级搜索
      searchform: 'searchform',
      expand: false,
      // 列表展示过滤条件
      filterExpressions: [
        {
          dataType: 'int',
          name: 'releaseType',
          op: 'eq',
          intValue: 1,
        },
      ],
      period: [],
      endOpen: false,
      year: null,
    }
  },
  created() {
    this.year = moment(new Date())
    this.formData.year = moment(new Date()).format('YYYY')
  },
  methods: {
    fndblclick(record, index) {
      this.$emit('listSelected', [record], index)
    },
    moment,
    yearChange(value) {
      this.year = value
      this.formData.year = value
      if (document.getElementsByClassName('ant-calendar-picker-container').length > 0) {
        document.getElementsByClassName('ant-calendar-picker-container')[0].style.display = 'none'
      }
      // this.searchYear = moment(value).format('YYYY')
      // this.yearShow = false
    },
    handleEndOpenChange(open) {
      this.endOpen = open
    },
    // 弹出日历和关闭日历的回调
    openChange(status) {
      // status是打开或关闭的状态
      if (status) {
        this.yearShow = true
      } else {
        this.yearShow = false
      }
    },
    processRes(data) {
      let index = 0
      data.data.forEach((item) => {
        item.id = this.$refs.SJMXDataTable.localPagination.current + '-' + index
        index++
      })
      return data
    },

    // 翻页操作
    onChange(pagination, filters, sorter) {
      this.pageSize = pagination.pageSize
      this.startPosition = (pagination.current - 1) * pagination.pageSize
    },
    // 开启关闭
    searchedClick() {
      this.expand = false
    },
    handleSearch() {
      const formData = this.formData
      // 获取当前表格过滤条件
      this.filterExpressions = [
        {
          dataType: 'int',
          name: 'releaseType',
          op: 'eq',
          intValue: 1,
        },
      ]
      // 获取高级搜索的数据
      // 开始修改
      if (formData !== null) {
        // 项目名称
        if (this.formData.projectTitle) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'projectTitle',
            op: 'like',
            stringValue: `${this.formData.projectTitle}`,
          })
        }
        // 档案编号
        if (this.formData.projectCode) {
          this.filterExpressions.push({
            dataType: 'str',
            name: 'projectCode',
            op: 'like',
            stringValue: `${this.formData.projectCode}`,
          })
        }
        // // 档案编号
        // if (this.formData.year) {
        //   debugger
        //   // 开始时间
        //   var startTime = new Date(this.formData.year + '-01-01 00:00:00').getTime()
        //   // 结束时间
        //   var endTime = new Date(this.formData.year + '-12-31 23:59:59').getTime()
        //   this.filterExpressions.push({
        //     dataType: 'long',
        //     name: 'creationTime',
        //     op: 'ge',
        //     longValue: `${startTime}`,
        //   })
        //   this.filterExpressions.push({
        //     dataType: 'long',
        //     name: 'creationTime',
        //     op: 'le',
        //     longValue: `${endTime}`,
        //   })
        // }
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.selectproject {
  :global(.ant-calendar-picker) {
    width: calc(100% + 33px);
  }
}
</style>
