mirror of
https://github.com/InvoiceShelf/InvoiceShelf.git
synced 2026-04-16 09:44:06 +00:00
345bfde306
CompanyModulesController attaches a translated display_name to each module before returning the list. ModuleSettingsController gains a translateSchema() helper that resolves section titles and field labels against the host app's i18n store before sending the schema to the frontend, so module authors can keep their 'my_module::settings.field' keys and users still see localized strings. Per-module settings now open in an inline ModuleSettingsModal rather than routing to a standalone page. The modal reuses BaseSchemaForm for rendering, so the whole interaction takes place in-context next to the module card the user clicked — no navigation, no loss of place. CompanyModuleCard displays the translated display_name instead of the raw slug and emits open-settings with the module payload; the parent view hands that to the modal store.
59 lines
1.6 KiB
Vue
59 lines
1.6 KiB
Vue
<template>
|
|
<div
|
|
class="
|
|
flex flex-col p-6 rounded-lg border border-line-default bg-surface-secondary
|
|
shadow-sm hover:shadow-md transition-shadow
|
|
"
|
|
>
|
|
<div class="flex items-start justify-between gap-3">
|
|
<div class="flex items-center gap-3">
|
|
<div class="
|
|
shrink-0 h-10 w-10 rounded-lg bg-primary-50 text-primary-600
|
|
flex items-center justify-center
|
|
">
|
|
<BaseIcon :name="iconName" class="h-5 w-5" />
|
|
</div>
|
|
<div>
|
|
<h3 class="text-base font-semibold text-heading">{{ data.display_name }}</h3>
|
|
<p class="text-xs text-muted">{{ $t('modules.version') }} {{ data.version }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-6 flex items-center justify-end">
|
|
<BaseButton
|
|
v-if="data.has_settings"
|
|
size="sm"
|
|
variant="primary-outline"
|
|
@click="emit('open-settings', data)"
|
|
>
|
|
<template #left="slotProps">
|
|
<BaseIcon name="CogIcon" :class="slotProps.class" />
|
|
</template>
|
|
{{ $t('modules.settings.open') }}
|
|
</BaseButton>
|
|
<span v-else class="text-xs text-subtle italic">
|
|
{{ $t('modules.settings.none') }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import type { CompanyModuleSummary } from '../store'
|
|
|
|
interface Props {
|
|
data: CompanyModuleSummary
|
|
}
|
|
|
|
const props = defineProps<Props>()
|
|
const emit = defineEmits<{
|
|
(e: 'open-settings', module: CompanyModuleSummary): void
|
|
}>()
|
|
|
|
const iconName = computed<string>(() => {
|
|
return props.data.menu?.icon ?? 'PuzzlePieceIcon'
|
|
})
|
|
</script>
|