<template>
  <a-modal
    :class="$style.mainModal"
    :body-style="bodyStyle"
    :title="title"
    :destroy-on-close="true"
    :visible="visible"
    :width="modalWidth"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <!-- 列表 -->
    <sd-data-table-ex
      ref="SJMXDataTable"
      form-id="iamAuditProject"
      data-url="api/xcoa-mobile/v1/iamauditproject/myProjectList"
      :pagination="{ pageSize: 10 }"
      :check-type="'radio'"
      :columns="columns"
      show-selection
      :process-res="processRes"
      @onChange="onChange"
    >
    </sd-data-table-ex>
  </a-modal>
</template>

<script>
import moment from 'moment'
import components from './_import-components/audit-select-project-import'
const columns = [
  {
    title: '序号',
    dataIndex: 'sortNumber',
    width: '20%',
    customRender: (text, record, index) => `${index + 1}`,
  },

  {
    title: '项目标题',
    dataIndex: 'projectTitle',
  },
]
export default {
  name: 'AuditSelectProject',
  metaInfo: {
    title: '项目选择器',
  },
  components: {
    ...components,
  },
  props: {
    // 弹出窗标题
    title: {
      type: String,
      default: '项目选择器',
    },
    // 弹出窗宽度
    modalWidth: {
      type: String,
      default: '1200px',
    },
    // 弹出窗显示参数
    visible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      bodyStyle: {
        // padding: 0,
      },
      // 列表展示用
      columns,
      expand: false,

      period: [],
    }
  },
  methods: {
    moment,

    processRes(data) {
      let index = 0
      data.data.forEach((item) => {
        item.id = this.$refs.SJMXDataTable.localPagination.current + '-' + index
        index++
      })
      return data
    },
    handleOk(e) {
      this.$parent.visibleP = !this.$parent.visibleP
      // 列表选择事件，返回选择的数据
      this.$emit(
        'listPSelected',
        this.$refs.SJMXDataTable.getSelectedRowKeys(),
        this.$refs.SJMXDataTable.getSelectedRows()
      )
    },
    handleCancel(e) {
      this.$parent.visibleP = !this.$parent.visibleP
    },
    // 翻页操作
    onChange(pagination, filters, sorter) {
      this.pageSize = pagination.pageSize
      this.startPosition = (pagination.current - 1) * pagination.pageSize
    },
    // 开启关闭
    searchedClick() {
      this.expand = false
    },
  },
}
</script>

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