Arno Kaimbacher
3d8f2354cb
Some checks failed
build.yaml / feat: Enhance Dataset Edit Page with Unsaved Changes Indicator and Improved Structure (push) Failing after 0s
- Added a progress indicator for unsaved changes at the top of the dataset edit page. - Enhanced the title section with a dataset status badge and improved layout. - Introduced collapsible sections for better organization of form fields. - Improved notifications for success/error messages. - Refactored form fields into distinct sections: Basic Information, Licenses, Titles, Descriptions, Creators & Contributors, Additional Metadata, Geographic Coverage, and Files. - Enhanced loading spinner with a more visually appealing overlay. - Added new project validation logic in the backend with create and update validators.
54 lines
No EOL
1.9 KiB
Vue
54 lines
No EOL
1.9 KiB
Vue
<script lang="ts" setup>
|
|
import { LayoutService } from '@/Stores/layout';
|
|
import { StyleService } from '@/Stores/style.service';
|
|
import NavBar from '@/Components/NavBar.vue';
|
|
import AsideMenu from '@/Components/AsideMenu.vue';
|
|
import FooterBar from '@/Components/FooterBar.vue';
|
|
import NotificationToast from '@/Components/NotificationToast.vue';
|
|
|
|
const styleService = StyleService();
|
|
|
|
const layoutService = LayoutService();
|
|
|
|
const props = defineProps({
|
|
showAsideMenu: {
|
|
type: Boolean,
|
|
default: true // Set default value to true
|
|
},
|
|
hasProgressBar: {
|
|
type: Boolean,
|
|
default: false // New prop to indicate if progress bar is shown
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div :class="{
|
|
'dark': styleService.darkMode,
|
|
'overflow-hidden lg:overflow-visible': layoutService.isAsideMobileExpanded,
|
|
}">
|
|
<div :class="{
|
|
'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded,
|
|
'xl:pl-60': props.showAsideMenu==true,
|
|
'pt-14': !props.hasProgressBar,
|
|
'pt-24': props.hasProgressBar // Increased padding when progress bar is present (pt-14 + height of progress bar)
|
|
}"
|
|
class="min-h-screen w-screen transition-position lg:w-auto bg-gray-50 dark:bg-slate-800 dark:text-slate-100">
|
|
<NavBar
|
|
:class="{
|
|
'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded,
|
|
'top-10': props.hasProgressBar // Push NavBar down when progress bar is present
|
|
}"
|
|
:showBurger="props.showAsideMenu"
|
|
/>
|
|
<!-- Conditionally render AsideMenu based on showAsideMenu prop -->
|
|
<template v-if="showAsideMenu">
|
|
<AsideMenu />
|
|
</template>
|
|
<!-- slot for main content -->
|
|
<slot></slot>
|
|
<FooterBar />
|
|
</div>
|
|
</div>
|
|
<NotificationToast></NotificationToast>
|
|
</template> |