78 lines
2.0 KiB
Vue
78 lines
2.0 KiB
Vue
<template>
|
|
<NavBar/>
|
|
|
|
<div v-if="isLoading">
|
|
<LoadingComponent/>
|
|
</div>
|
|
<div v-else>
|
|
<div v-if="isForm">
|
|
<MainForm
|
|
v-if="order == undefined || order.MZN_Bufor==1"
|
|
/>
|
|
<ConfirmedForm v-else-if="order.MZN_Bufor==0"/>
|
|
</div>
|
|
<OrdersSelector class="box is-shadowless" v-else-if="isOrders"
|
|
/>
|
|
</div>
|
|
<ConfirmationModal v-show="showConfirmationModal" @close="showConfirmationModal = false" @confirm="closeConfirmationModal" :order-uuid="uuid"></ConfirmationModal>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import '@/assets/base.css'
|
|
import { useContractorsStore } from '@/stores/contractors.store'
|
|
import { storeToRefs } from 'pinia'
|
|
import { useCategoriesStore } from '@/stores/categories.store'
|
|
import { useOrdersStore } from '@/stores/orders.store'
|
|
import { useSiteControlStore } from '@/stores/siteControl.store'
|
|
|
|
const contractorsStore = useContractorsStore();
|
|
const categoriesStore = useCategoriesStore();
|
|
const ordersStore = useOrdersStore();
|
|
const siteControlStore = useSiteControlStore();
|
|
const contractors = storeToRefs(contractorsStore).contractors;
|
|
const contractor = storeToRefs(contractorsStore).contractor;
|
|
const categories = storeToRefs(categoriesStore).categories;
|
|
|
|
const { uuid, order } = storeToRefs(ordersStore);
|
|
|
|
const { isForm, isOrders, showConfirmationModal, isLoading } = storeToRefs(siteControlStore);
|
|
|
|
async function fetchData() {
|
|
await categoriesStore.fetchCategories();
|
|
await contractorsStore.fetchContractors();
|
|
isLoading.value = false;
|
|
}
|
|
|
|
function closeConfirmationModal() {
|
|
showConfirmationModal.value = false;
|
|
if (uuid.value != undefined) {
|
|
isLoading.value = true;
|
|
ordersStore.loadOrder(uuid.value, true, contractor, contractors, categories);
|
|
}
|
|
}
|
|
|
|
siteControlStore.checkTheme();
|
|
fetchData();
|
|
</script>
|
|
|
|
<style>
|
|
@media screen and (min-width: 500px) {
|
|
.box {
|
|
--bulma-box-padding: 1.5rem;
|
|
}
|
|
}
|
|
@media screen and (max-width: 500px) {
|
|
.box {
|
|
--bulma-box-padding: 0.75rem;
|
|
}
|
|
}
|
|
|
|
:root {
|
|
min-height: 100vh;
|
|
}
|
|
|
|
body {
|
|
min-height: 100vh;
|
|
}
|
|
</style>
|