49 lines
1.8 KiB
Vue
49 lines
1.8 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;
|
|
}>();
|
|
|
|
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" />
|
|
<HomepageSection v-else-if="activeSection === SettingSectionConst.HOMEPAGE" :data="homepage" />
|
|
<SocialMediaSection v-else-if="activeSection === SettingSectionConst.SOCIAL" :data="socialMedia" />
|
|
<MarketplaceSection v-else-if="activeSection === SettingSectionConst.MARKETPLACE" :data="marketplace" :has-pending-verification="hasPendingMarketplaceVerification" />
|
|
<HrSection v-else-if="activeSection === SettingSectionConst.HR" :data="hr" />
|
|
</SettingLayout>
|
|
</template>
|