import { computed, defineComponent } from 'vue';
import type { PropType } from 'vue';
import BusinessTableActionCell, { type BusinessTableAction } from '@/components/custom/business-table-action-cell';
import { $t } from '@/locales';

export default defineComponent({
  name: 'MenuOperateCell',
  props: {
    row: {
      type: Object as PropType<Api.SystemManage.Menu>,
      required: true
    },
    onEdit: {
      type: Function as PropType<(row: Api.SystemManage.Menu) => void>,
      required: true
    },
    onAddChild: {
      type: Function as PropType<(row: Api.SystemManage.Menu) => void>,
      required: true
    },
    onDelete: {
      type: Function as PropType<(row: Api.SystemManage.Menu) => Promise<void>>,
      required: true
    }
  },
  setup(props) {
    const actions = computed<BusinessTableAction[]>(() => {
      const list: BusinessTableAction[] = [
        {
          key: 'edit',
          label: $t('common.edit'),
          buttonType: 'primary',
          onClick: () => props.onEdit(props.row)
        }
      ];

      if (props.row.type !== 3) {
        list.push({
          key: 'addChild',
          label: $t('page.system.menu.addChildMenu'),
          buttonType: 'primary',
          onClick: () => props.onAddChild(props.row)
        });
      }

      list.push({
        key: 'delete',
        label: $t('common.delete'),
        buttonType: 'danger',
        onClick: () => props.onDelete(props.row)
      });

      return list;
    });

    return () => <BusinessTableActionCell actions={actions.value} />;
  }
});
