Files
InvoiceShelf/resources/scripts-v2/features/company/settings/components/CustomFieldDropdown.vue
Darko Gjorgjijoski a46cca5cd8 Complete scripts-v2 TypeScript migration — all imports resolved,
build passes

Create all missing components (modals, dropdowns, icons, tabs, mail
drivers, customer partials), fix all @/scripts/ imports to @v2/,
wire up vite entry point and blade template. 382 files, 48883 lines.

- 27 settings components: modals (tax, payment, custom field, note,
  category, role, exchange rate, unit, mail test), dropdowns (6),
  customization tabs (4), mail driver forms (4)
- 22 icon components: 5 utility icons, 4 dashboard icons, 13 editor
  toolbar icons with typed barrel export
- 3 customer components: info, chart placeholder, custom fields single
- Fixed usePopper composable, client/format-money import patterns
- Zero remaining @/scripts/ imports in scripts-v2/

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-04 09:30:00 +02:00

89 lines
2.3 KiB
Vue

<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import { useDialogStore } from '@v2/stores/dialog.store'
import { useUserStore } from '@v2/stores/user.store'
import { useModalStore } from '@v2/stores/modal.store'
import { customFieldService } from '@v2/api/services/custom-field.service'
const ABILITIES = {
EDIT_CUSTOM_FIELDS: 'edit-custom-field',
DELETE_CUSTOM_FIELDS: 'delete-custom-field',
} as const
interface CustomFieldRow {
id: number
name: string
[key: string]: unknown
}
const props = defineProps<{
row: CustomFieldRow
table?: { refresh: () => void } | null
loadData?: (() => void) | null
}>()
const dialogStore = useDialogStore()
const { t } = useI18n()
const userStore = useUserStore()
const modalStore = useModalStore()
async function editCustomField(id: number): Promise<void> {
modalStore.openModal({
title: t('settings.custom_fields.edit_custom_field'),
componentName: 'CustomFieldModal',
size: 'sm',
data: id,
refreshData: props.loadData ?? undefined,
})
}
async function removeCustomField(id: number): Promise<void> {
dialogStore
.openDialog({
title: t('general.are_you_sure'),
message: t('settings.custom_fields.custom_field_confirm_delete'),
yesLabel: t('general.ok'),
noLabel: t('general.cancel'),
variant: 'danger',
hideNoButton: false,
size: 'lg',
})
.then(async (res: boolean) => {
if (res) {
await customFieldService.delete(id)
props.loadData?.()
}
})
}
</script>
<template>
<BaseDropdown>
<template #activator>
<BaseIcon name="EllipsisHorizontalIcon" class="h-5 text-muted" />
</template>
<BaseDropdownItem
v-if="userStore.hasAbilities(ABILITIES.EDIT_CUSTOM_FIELDS)"
@click="editCustomField(row.id)"
>
<BaseIcon
name="PencilIcon"
class="w-5 h-5 mr-3 text-subtle group-hover:text-muted"
/>
{{ $t('general.edit') }}
</BaseDropdownItem>
<BaseDropdownItem
v-if="userStore.hasAbilities(ABILITIES.DELETE_CUSTOM_FIELDS)"
@click="removeCustomField(row.id)"
>
<BaseIcon
name="TrashIcon"
class="w-5 h-5 mr-3 text-subtle group-hover:text-muted"
/>
{{ $t('general.delete') }}
</BaseDropdownItem>
</BaseDropdown>
</template>