<template>
  <div>
    <Modal
      transfer
      title="政府采购计划"
      v-model="dialogVisible"
      width="60">
      <template>
        <xy-table :table-item="table" highlight-current-row :list="data" @cellClick="cellClick">
          <template #btns></template>
        </xy-table>

        <div style="display: flex;justify-content: center;margin-top: 10px;">
          <el-pagination
            small
            layout="prev, pager, next"
            :total="total"
            @current-change="e => {
              select.page = e
              getData()
            }">
          </el-pagination>
        </div>
      </template>
      <template #footer>
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </template>
    </Modal>
  </div>
</template>

<script>
import { index } from "@/api/govPlane"
export default {
  data() {
    return {
      dialogVisible: false,

      isLoading: false,
      total: 0,
      data: [],
      table: [
        {
          prop: "department.name",
          label: "责任科室",
          width: 160,
        },
        {
          prop: "name",
          label: "项目名称",
          width: 180,
        },
        {
          prop: "content",
          label: "项目内容",
          minWidth: 220,
          align: "left",
        },
        {
          prop: "plan_money",
          label: "采购预算",
          width: 160,
          align: "right",
          formatter: (cell, data, value) => {
            return `¥ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
          },
        },
        {
          prop: "public_plane_date",
          label: "采购意向公开计划时间",
          width: 190,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
        {
          prop: "public_act_date",
          label: "采购意向公开实际时间",
          width: 190,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
        {
          prop: "invite_plane_date",
          label: "招标文件挂网计划时间",
          width: 190,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
        {
          prop: "invite_act_date",
          label: "招标文件挂网实际时间",
          width: 190,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
        {
          prop: "open_plane_date",
          label: "项目开标计划时间",
          width: 180,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
        {
          prop: "open_act_date",
          label: "项目开标实际时间",
          width: 180,
          formatter: (cell, data, value) => {
            return this.$moment(new Date(value)).format("YYYY年MM月DD");
          },
        },
      ],
      select: {
        page: 1,
        page_size: 10,
        keyword: ''
      },


      selected: {}
    }
  },
  methods: {
    show() {
      this.dialogVisible = true
    },
    hide() {
      this.dialogVisible = false
    },
    setSelected (gov_plane_id) {
      this.selected = this.data.find(i => i.id === gov_plane_id)
    },

    unique (arr) {
      const res= new Map()
      return arr.filter((a)=> !res.has(a.id) && res.set(a.id,1))
    },

    async getData() {
      this.isLoading = true
      const res = await index(this.select)
      this.data = res.data
      this.total = res.total
      this.isLoading = false
    },

    selectionChange(selection) {
      this.selected = selection
    },
    confirm () {
      this.$emit('selected', this.selected)
      this.hide()
    },

    cellClick (row) {
      this.selected = row
    }

  },
  computed: {},
  watch: {
    dialogVisible(newVal) {
      if (newVal) {
        this.getData()
      }
    }
  }
}
</script>

<style scoped lang="scss">
</style>
