<template>
  <section class="history">

    <ai-search-bar>
      <template #left>
        <el-button type="primary" icon="iconfont iconEdit" @click="$router.push({hash:'#makeup',query:{}})">补录</el-button>
      </template>
      <template #right>
        <el-input size="small" placeholder="请输入届次" v-model="search.name" clearable
                  v-throttle="() => {page.current = 1, getList()}"/>
      </template>
    </ai-search-bar>
    <ai-table :tableData="tableData" :col-configs="colConfigs" :isShowPagination="false" @getList="getList">
      <el-table-column slot="options" label="操作" align="center">
        <template slot-scope="{ row }">
          <el-button type="text" @click="handleEdit(row.id)">编辑</el-button>
          <el-button type="text" @click="handleDelete(row.id)">删除</el-button>
        </template>
      </el-table-column>
    </ai-table>
  </section>
</template>

<script>
export default {
  name: "history",
  inject: {
    permissions: {},
    instance: {},
    dict: {}
  },
  data() {
    return {
      search: {
        name: '',
      },
      tableData: []
    }
  },
  computed: {
    colConfigs() {
      return [
        {prop: 'sessionTime', label: '届次', align: 'left'},
        {prop: 'changeTime', label: '换届日期', align: 'center'},
        {prop: 'createTime', label: '操作时间', align: 'center'},
        {prop: 'createUserName', label: '操作人', align: 'center'},
        {slot: 'options'},
      ]
    },
    oid: v => v.$attrs.selected.id
  },
  methods: {
    handleEdit(id) {
      this.$router.push({hash: "#makeup", query: {id}})
    },
    handleDelete(id) {
      this.$confirm("是否要删除该条届次记录?").then(() => {
        this.instance.post("/app/apporganizationgeneralelection/delete", null, {
          params: {id}
        }).then(res => {
          if (res?.code == 0) {
            this.$message.success("删除成功!")
            this.getList()
          }
        })
      }).catch(() => 0)
    },
    getList() {
      const {oid: organizationId} = this
      this.instance.post("/app/apporganizationgeneralelection/list", null, {
        params: {...this.search, organizationId}
      }).then(res => {
        if (res?.data) {
          this.tableData = res.data
        }
      })
    }
  },
  created() {
    this.getList()
  },
}
</script>

<style lang="scss" scope>
.history {
  padding-top: 0 !important;
  background-color: #FFF !important;
}
</style>
