<template>
  <v-card class="pa-5 card-box">
    <div class="text-end">
      <v-btn prepend-icon="mdi-plus" color="primary" @click="handleAdd">{{ $t('common.add') }}</v-btn>
    </div>
    <v-data-table
      :headers="headers"
      :items="items"
      hide-default-header
      height="70vh"
      item-value="id"
    >
      <template #bottom></template>
      <template v-slot:item.actions="{ item }">
        <v-btn color="primary" variant="text" @click="handleEdit(item)">{{ $t('common.edit') }}</v-btn>
        <v-btn color="primary" variant="text" @click="handleDelete(item)">{{ $t('common.delete') }}</v-btn>
      </template>
    </v-data-table>
    <CtPagination
      :total="total"
      :page="query.pageNo"
      :limit="query.pageSize"
      @handleChange="handleChangePage"
    ></CtPagination>
  </v-card>
</template>

<script setup>
defineOptions({ name: 'system-post-index'})
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { timesTampChange } from '@/utils/date'
import { useI18n } from '@/hooks/web/useI18n'
import { getEnterprisePostPage, deleteEnterprisePost } from '@/api/recruit/enterprise/system/post'
import Confirm from '@/plugins/confirm'
import Snackbar from '@/plugins/snackbar'

const { t } = useI18n()
const router = useRouter()
const total = ref(10)
const items = ref([])
const query = ref({
  pageNo: 1,
  pageSize: 10
})

const headers = [
  { title: '岗位名称', key: 'nameCn' },
  { title: '英文名称', key: 'nameEn' },
  { title: '岗位缩写', key: 'code' },
  { title: '显示顺序', key: 'sort' },
  { title: '状态', key: 'status', value: item => item.status === '1' ? '停用' : '正常'},
  { title: '备注', key: 'remark' },
  { title: '更新时间', key: 'updateTime', value: item => timesTampChange(item.updateTime)},
  { title: t('common.actions'), key: 'actions' }
]

const getList = async () => {
  const res = await getEnterprisePostPage(query.value)
  items.value = res.list
  total.value = res.total
}
getList()

const handleChangePage = (e) => {
  query.value.pageNo = e
  getList()
}

const handleAdd = () => {
  router.push('/recruit/enterprise/systemManagement/postManagement/add')
}

const handleEdit = (item) => {
  if (!item.id) return
  router.push(`/recruit/enterprise/systemManagement/postManagement/edit?id=${item.id}`)
}

const handleDelete = ({ id }) => {
  Confirm(t('common.confirmTitle'), '是否确认删除此项内容？').then(async () => {
    await deleteEnterprisePost(id)
    Snackbar.success(t('common.delMsg'))
    getList()
  })
}
</script>

<style scoped lang="scss">

</style>
