128 lines
3.1 KiB
Vue
128 lines
3.1 KiB
Vue
<template>
|
|
<div class="calendar-navigation">
|
|
<Tabs :value="defaultTab" v-if="companyStore.currentCompany == 'Sprinklers Northwest'">
|
|
<TabList>
|
|
<Tab value="0">Bids</Tab>
|
|
<Tab value="1">Projects</Tab>
|
|
<Tab value="2">Service</Tab>
|
|
<Tab value="6">Warranties</Tab>
|
|
</TabList>
|
|
<TabPanels>
|
|
<TabPanel header="Bids" value="0">
|
|
<ScheduleBid />
|
|
</TabPanel>
|
|
<TabPanel header="Projects" value="1">
|
|
<SNWProjectCalendar />
|
|
</TabPanel>
|
|
<TabPanel header="Service" value="2">
|
|
<div class="coming-soon">
|
|
<p>Service feature coming soon!</p>
|
|
</div>
|
|
</TabPanel>
|
|
<TabPanel header="Warranties" value="6">
|
|
<div class="coming-soon">
|
|
<p>Warranties Calendar coming soon!</p>
|
|
</div>
|
|
</TabPanel>
|
|
</TabPanels>
|
|
</Tabs>
|
|
<Tabs v-else :value="defaultTab">
|
|
<TabList>
|
|
<Tab value="0">Bids</Tab>
|
|
<Tab value="1">Projects</Tab>
|
|
<Tab value="2">Service</Tab>
|
|
<Tab value="3">Warranties</Tab>
|
|
</TabList>
|
|
<TabPanels>
|
|
<TabPanel header="Bids" value="0">
|
|
<ScheduleBid />
|
|
</TabPanel>
|
|
<TabPanel header="Projects" value="1">
|
|
<div class="coming-soon">
|
|
<p>Calendar Coming Soon!</p>
|
|
</div>
|
|
</TabPanel>
|
|
<TabPanel header="Service" value="2">
|
|
<div class="coming-soon">
|
|
<p>Calendar Coming Soon!</p>
|
|
</div>
|
|
</TabPanel>
|
|
<TabPanel header="Service" value="2">
|
|
<div class="coming-soon">
|
|
<p>Calendar Coming Soon!</p>
|
|
</div>
|
|
</TabPanel>
|
|
<TabPanel header="Warranties" value="3">
|
|
<p>Calendar Coming Soon!</p>
|
|
</TabPanel>
|
|
</TabPanels>
|
|
</Tabs>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue';
|
|
import Tab from 'primevue/tab';
|
|
import Tabs from 'primevue/tabs';
|
|
import TabList from 'primevue/tablist';
|
|
import TabPanel from 'primevue/tabpanel';
|
|
import TabPanels from 'primevue/tabpanels';
|
|
import ScheduleBid from '../calendar/bids/ScheduleBid.vue';
|
|
import SNWProjectCalendar from './jobs/SNWProjectCalendar.vue';
|
|
import { useNotificationStore } from '../../stores/notifications-primevue';
|
|
import { useCompanyStore } from '../../stores/company';
|
|
import { useRoute } from 'vue-router';
|
|
|
|
const companyStore = useCompanyStore();
|
|
const route = useRoute();
|
|
|
|
const defaultTab = ref('0');
|
|
|
|
const mappedTabs = {
|
|
'bid': '0',
|
|
'projects': '1',
|
|
'service': '2',
|
|
'warranties': companyStore.currentCompany == 'Sprinklers Northwest' ? '6' : '3'
|
|
};
|
|
|
|
onMounted(() => {
|
|
// Check for route query parameter to set default tab
|
|
if (route.query.tab) {
|
|
defaultTab.value = mappedTabs[route.query.tab] || '0';
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
.calendar-navigation {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.calendar-navigation :deep(.p-tabs) {
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.calendar-navigation :deep(.p-tabpanels) {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.calendar-navigation :deep(.p-tabpanel) {
|
|
height: 100%;
|
|
}
|
|
|
|
.coming-soon {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 400px;
|
|
color: var(--theme-text-muted);
|
|
font-size: 1.2rem;
|
|
}
|
|
</style>
|