store/resources/js/pages/admin/system/setting/Index.vue

54 lines
2.1 KiB
Vue

<script setup lang="ts">
import { Head } from '@inertiajs/vue3';
import { ref } from 'vue';
import { SettingSection as SettingSectionConst } from '@/constants/setting-section';
import { useCan } from '@/composables/useCan';
import SettingLayout from '@/layouts/SettingLayout.vue';
import type {
HomepageSettingsData,
HrSettingsData,
MarketplaceSettingsData,
SettingSection,
SocialMediaSettingsData,
SystemSettingsData,
} from '@/types/setting';
import HomepageSection from './form/HomepageSection.vue';
import HrSection from './form/HrSection.vue';
import MarketplaceSection from './form/MarketplaceSection.vue';
import SocialMediaSection from './form/SocialMediaSection.vue';
import SystemSection from './form/SystemSection.vue';
defineProps<{
system: SystemSettingsData;
socialMedia: SocialMediaSettingsData;
marketplace: MarketplaceSettingsData;
hr: HrSettingsData;
homepage: HomepageSettingsData;
hasPendingMarketplaceVerification: boolean;
canUpdateSystem: boolean;
canUpdateSocialMedia: boolean;
canUpdateMarketplace: boolean;
canUpdateHr: boolean;
canUpdateHomepage: boolean;
}>();
const { hasRole } = useCan();
const activeSection = ref<SettingSection>(
hasRole('admin-toko') ? SettingSectionConst.MARKETPLACE : SettingSectionConst.SYSTEM
);
</script>
<template>
<Head title="Pengaturan" />
<SettingLayout v-model:section="activeSection">
<SystemSection v-if="activeSection === SettingSectionConst.SYSTEM" :data="system" :can-update="canUpdateSystem" />
<HomepageSection v-else-if="activeSection === SettingSectionConst.HOMEPAGE" :data="homepage" :can-update="canUpdateHomepage" />
<SocialMediaSection v-else-if="activeSection === SettingSectionConst.SOCIAL" :data="socialMedia" :can-update="canUpdateSocialMedia" />
<MarketplaceSection v-else-if="activeSection === SettingSectionConst.MARKETPLACE" :data="marketplace" :has-pending-verification="hasPendingMarketplaceVerification" :can-update="canUpdateMarketplace" />
<HrSection v-else-if="activeSection === SettingSectionConst.HR" :data="hr" :can-update="canUpdateHr" />
</SettingLayout>
</template>