41 lines
1.2 KiB
JavaScript
41 lines
1.2 KiB
JavaScript
import { ref, computed } from 'https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.prod.js';
|
|
import { usePlannerState } from '../../services/planner-state-service.js';
|
|
|
|
export default {
|
|
name: 'PlannerLayout',
|
|
setup() {
|
|
const { state, methods } = usePlannerState();
|
|
|
|
const leftDrawer = ref(false);
|
|
const filterDrawer = ref(false);
|
|
|
|
const rightDrawer = computed({
|
|
get: () => !!state.selectedAgent,
|
|
set: (value) => {
|
|
if (!value) {
|
|
state.selectedAgent = null;
|
|
state.selectedDate = null;
|
|
}
|
|
}
|
|
});
|
|
|
|
const editMode = computed(() => state.selectedDate ? 'assignment' : 'profile');
|
|
|
|
return {
|
|
state,
|
|
methods,
|
|
leftDrawer,
|
|
filterDrawer,
|
|
rightDrawer,
|
|
editMode,
|
|
};
|
|
},
|
|
template: `
|
|
<q-layout view="hHh Lpr fFf" class="planner-layout">
|
|
<planner-header @toggle-left-drawer="leftDrawer = !leftDrawer" />
|
|
<planner-settings-drawer v-model="leftDrawer" />
|
|
<planner-filter-drawer v-model="filterDrawer" />
|
|
<planner-edit-drawer v-model="rightDrawer" :mode="editMode" />
|
|
<q-page-container><planner-grid @toggle-filter-drawer="filterDrawer = !filterDrawer" /></q-page-container>
|
|
</q-layout>`
|
|
}; |