import DeleteOutlineOutlined from "@mui/icons-material/DeleteOutlineOutlined";
import EditOutlined from "@mui/icons-material/EditOutlined";
import { AdminActionIconButton, AdminRowActions } from "@/shared/ui/AdminListLayout.jsx";
import { DataTable } from "@/shared/ui/DataTable.jsx";
import { kindLabel } from "@/features/menus/constants.js";
import { createTextColumnFilter } from "@/shared/ui/tableFilters.js";

export function PermissionTable({ abilities, onEdit, onQueryChange, onRemove, permissions, query }) {
  if (!abilities.canLoadPermissions) {
    return null;
  }

  const columns = [
    {
      key: "name",
      label: "权限",
      width: "minmax(160px, 1fr)",
      filter: createTextColumnFilter({
        placeholder: "搜索权限、权限码",
        value: query,
        onChange: onQueryChange
      })
    },
    { key: "code", label: "编码", width: "minmax(180px, 1.2fr)", render: (permission) => <span className="muted">{permission.code}</span> },
    { key: "kind", label: "类型", width: "110px", render: (permission) => kindLabel(permission.kind) },
    {
      key: "description",
      label: "说明",
      width: "minmax(240px, 1.6fr)",
      render: (permission) => <span className="muted">{permission.description || "-"}</span>
    },
    {
      key: "actions",
      label: "操作",
      width: "120px",
      render: (permission) => (
        <AdminRowActions>
          {abilities.canUpdatePermission ? (
            <AdminActionIconButton label="编辑" onClick={() => onEdit(permission)}>
              <EditOutlined fontSize="inherit" />
            </AdminActionIconButton>
          ) : null}
          {abilities.canDeletePermission ? (
            <AdminActionIconButton label="删除" tone="danger" onClick={() => onRemove(permission)}>
              <DeleteOutlineOutlined fontSize="inherit" />
            </AdminActionIconButton>
          ) : null}
        </AdminRowActions>
      )
    }
  ];

  return (
    <DataTable
      columns={columns}
      items={permissions}
      minWidth="920px"
      rowKey={(permission) => permission.id}
    />
  );
}
