import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemRoleApi } from '#/api';

import { useUserStore } from '@vben/stores';

import { $t } from '#/locales';

const userStore = useUserStore();
export function useFormSchema(): VbenFormSchema[] {
  return [
    {
      component: 'Input',
      fieldName: 'name',
      label: $t('system.role.roleName'),
      rules: 'required',
    },
    // {
    //   component: 'ApiTreeSelect',
    //   fieldName: 'pid',
    //   componentProps: {
    //     api: async () => {
    //       const { list } = await getRoleList(userStore?.userInfo?.org_id || '');
    //       return list;
    //     },
    //     class: 'w-full',
    //     childrenField: 'children',
    //     labelField: 'name',
    //     valueField: 'id',
    //   },
    //   label: $t('system.role.pid'),
    // },
    // {
    //   component: 'Textarea',
    //   fieldName: 'remark',
    //   label: $t('system.role.remark'),
    // },
    {
      component: 'Input',
      fieldName: 'menu_ids',
      formItemClass: 'items-start',
      label: $t('system.role.setPermissions'),
      modelPropName: 'modelValue',
    },
  ];
}

export function useColumns<T = SystemRoleApi.SystemRole>(
  onActionClick: OnActionClickFn<T>,
  onStatusChange?: (newStatus: any, row: T) => PromiseLike<boolean | undefined>,
): VxeTableGridOptions['columns'] {
  return [
    {
      field: 'name',
      title: $t('system.role.roleName'),
      treeNode: true,
      // width: 200,
    },
    {
      field: 'id',
      title: $t('system.role.id'),
      // width: 200,
    },
    {
      cellRender: {
        attrs: { beforeChange: onStatusChange },
        name: onStatusChange ? 'CellSwitch' : 'CellTag',
      },
      field: 'enabled',
      title: $t('system.role.status'),
      width: 100,
    },
    // {
    //   field: 'remark',
    //   minWidth: 100,
    //   title: $t('system.role.remark'),
    // },
    {
      field: 'created_at',
      title: $t('system.role.createTime'),
      width: 200,
    },
    {
      align: 'right',
      cellRender: {
        attrs: {
          nameField: 'name',
          // nameTitle: $t('system.role.name'),
          onClick: onActionClick,
        },
        name: 'CellOperation',
        options: [
          // {
          //   code: 'append',
          //   text: '新增下级',
          //   show: ({ type }: any) => {
          //     return (
          //       !(type === 2) && userStore.buttonPermissions.includes('addRole')
          //     );
          //   },
          // },
          {
            code: 'edit',
            show: () => {
              return userStore.buttonPermissions.includes('editRole');
            },
          }, // 默认的编辑按钮
          {
            code: 'delete',
            show: () => {
              return userStore.buttonPermissions.includes('deleteRole');
            },
          }, // 默认的删除按钮
        ],
      },
      field: 'operation',
      fixed: 'right',
      title: $t('system.role.operation'),
      headerAlign: 'center',
      showOverflow: false,
      width: 200,
      // width: 130,
    },
  ];
}
