import { h } from 'vue'
import ArtButtonMore from '@/components/core/forms/art-button-more/index.vue'
import { ElTag } from 'element-plus'
import { $t } from '@/locales'
import { getRoleStatusMeta } from './rolePage.helpers'

function createRoleMoreActions() {
  return [
    {
      key: 'scope-menu',
      label: $t('pages.system.role.actions.scopeMenu'),
      icon: 'ri:layout-2-line',
      auth: 'edit'
    },
    {
      key: 'scope-pda',
      label: $t('pages.system.role.actions.scopePda'),
      icon: 'ri:smartphone-line',
      auth: 'edit'
    },
    {
      key: 'scope-matnr',
      label: $t('pages.system.role.actions.scopeMatnr'),
      icon: 'ri:archive-line',
      auth: 'edit'
    },
    {
      key: 'scope-warehouse',
      label: $t('pages.system.role.actions.scopeWarehouse'),
      icon: 'ri:store-2-line',
      auth: 'edit'
    },
    {
      key: 'edit',
      label: $t('pages.system.role.actions.edit'),
      icon: 'ri:edit-2-line',
      auth: 'edit'
    },
    {
      key: 'delete',
      label: $t('pages.system.role.actions.delete'),
      icon: 'ri:delete-bin-4-line',
      color: '#f56c6c',
      auth: 'delete'
    }
  ]
}

function createTextColumn(prop, label, minWidth, extra = {}) {
  return {
    prop,
    label,
    minWidth,
    showOverflowTooltip: true,
    ...extra
  }
}

function createTagColumn(prop, label, width, resolveMeta) {
  return {
    prop,
    label,
    width,
    formatter: (row) => {
      const statusMeta = resolveMeta(row)
      return h(ElTag, { type: statusMeta.type, effect: 'light' }, () => statusMeta.text)
    }
  }
}

export function createRoleTableColumns(handleActionClick) {
  return [
    { type: 'selection', width: 52, fixed: 'left' },
    createTextColumn('name', $t('pages.system.role.table.name'), 140),
    createTextColumn('code', $t('pages.system.role.table.code'), 140),
    createTextColumn('memo', $t('pages.system.role.table.memo'), 180),
    createTagColumn('status', $t('pages.system.role.table.status'), 120, (row) => getRoleStatusMeta(row.statusBool ?? row.status)),
    createTextColumn('updateTimeText', $t('pages.system.role.table.updateTime'), 180, {
      sortable: true,
      formatter: (row) => row.updateTimeText || '-'
    }),
    createTextColumn('createTimeText', $t('pages.system.role.table.createTime'), 180, {
      sortable: true,
      formatter: (row) => row.createTimeText || '-'
    }),
    {
      prop: 'operation',
      label: $t('pages.system.role.table.operation'),
      width: 120,
      align: 'center',
      fixed: 'right',
      formatter: (row) =>
        h(ArtButtonMore, {
          list: createRoleMoreActions(),
          onClick: (item) => handleActionClick(item, row)
        })
    }
  ]
}