0
0
Fork 0

Merge pull request '#7014 refactor <module>Main.vue' (!476) from 7014-RefactorQDrawer into dev

Reviewed-on: verdnatura/salix-front#476
Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
Jon Elias 2024-07-24 05:17:13 +00:00
commit 19fa5a294d
41 changed files with 81 additions and 292 deletions

View File

@ -1,8 +1,16 @@
<script setup> <script setup>
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
import { onMounted } from 'vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const $props = defineProps({
leftDrawer: {
type: Boolean,
default: true,
},
});
onMounted(() => (stateStore.leftDrawer = $props.leftDrawer));
</script> </script>
<template> <template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,18 +0,0 @@
<script setup>
import LeftMenu from 'src/components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,18 +0,0 @@
<script setup>
import LeftMenu from 'src/components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,18 +0,0 @@
<script setup>
import LeftMenu from 'src/components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,19 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
import { onMounted } from 'vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
const stateStore = useStateStore();
onMounted(() => (stateStore.leftDrawer = false));
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -1,17 +0,0 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import LeftMenu from 'src/components/LeftMenu.vue';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

View File

@ -2,9 +2,9 @@
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { computed } from 'vue'; import { computed } from 'vue';
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
import ZoneDescriptor from './ZoneDescriptor.vue'; import ZoneDescriptor from './ZoneDescriptor.vue';
import ZoneSearchbar from './ZoneSearchbar.vue';
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
@ -33,5 +33,9 @@ const searchBarDataKeys = {
:search-make-fetch="searchbarMakeFetch" :search-make-fetch="searchbarMakeFetch"
:searchbar-label="t('list.searchZone')" :searchbar-label="t('list.searchZone')"
:searchbar-info="t('list.searchInfo')" :searchbar-info="t('list.searchInfo')"
/> >
<template #searchbar>
<ZoneSearchbar />
</template>
</VnCard>
</template> </template>

View File

@ -1,11 +1,8 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import LeftMenu from 'src/components/LeftMenu.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore();
const exprBuilder = (param, value) => { const exprBuilder = (param, value) => {
switch (param) { switch (param) {
@ -49,12 +46,4 @@ const exprBuilder = (param, value) => {
:info="t('list.searchInfo')" :info="t('list.searchInfo')"
custom-route-redirect-name="ZoneSummary" custom-route-redirect-name="ZoneSummary"
/> />
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template> </template>

View File

@ -3,6 +3,7 @@ import { ref } from 'vue';
import ZoneDeliveryPanel from './ZoneDeliveryPanel.vue'; import ZoneDeliveryPanel from './ZoneDeliveryPanel.vue';
import ZoneCalendarGrid from './ZoneCalendarGrid.vue'; import ZoneCalendarGrid from './ZoneCalendarGrid.vue';
import RightMenu from 'src/components/common/RightMenu.vue'; import RightMenu from 'src/components/common/RightMenu.vue';
import ZoneSearchbar from './Card/ZoneSearchbar.vue';
const firstDay = ref(null); const firstDay = ref(null);
const lastDay = ref(null); const lastDay = ref(null);
@ -10,6 +11,7 @@ const events = ref([]);
</script> </script>
<template> <template>
<ZoneSearchbar />
<RightMenu> <RightMenu>
<template #right-panel> <template #right-panel>
<ZoneDeliveryPanel /> <ZoneDeliveryPanel />

View File

@ -15,6 +15,7 @@ import { useStateStore } from 'stores/useStateStore';
import axios from 'axios'; import axios from 'axios';
import RightMenu from 'src/components/common/RightMenu.vue'; import RightMenu from 'src/components/common/RightMenu.vue';
import ZoneFilterPanel from './ZoneFilterPanel.vue'; import ZoneFilterPanel from './ZoneFilterPanel.vue';
import ZoneSearchbar from './Card/ZoneSearchbar.vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
@ -87,6 +88,7 @@ onMounted(() => (stateStore.rightDrawer = true));
</script> </script>
<template> <template>
<ZoneSearchbar />
<RightMenu> <RightMenu>
<template #right-panel> <template #right-panel>
<ZoneFilterPanel data-key="ZoneList" :expr-builder="exprBuilder" /> <ZoneFilterPanel data-key="ZoneList" :expr-builder="exprBuilder" />

View File

@ -7,6 +7,7 @@ import FetchData from 'components/FetchData.vue';
import { toDateFormat } from 'src/filters/date.js'; import { toDateFormat } from 'src/filters/date.js';
import { useWeekdayStore } from 'src/stores/useWeekdayStore'; import { useWeekdayStore } from 'src/stores/useWeekdayStore';
import ZoneSearchbar from './Card/ZoneSearchbar.vue';
const { t } = useI18n(); const { t } = useI18n();
const weekdayStore = useWeekdayStore(); const weekdayStore = useWeekdayStore();
@ -52,6 +53,7 @@ onMounted(() => weekdayStore.initStore());
@on-fetch="(data) => (details = data)" @on-fetch="(data) => (details = data)"
auto-load auto-load
/> />
<ZoneSearchbar />
<VnSubToolbar /> <VnSubToolbar />
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QCard class="full-width q-pa-md"> <QCard class="full-width q-pa-md">

View File

@ -29,7 +29,7 @@ export default {
{ {
path: '', path: '',
name: 'SupplierMain', name: 'SupplierMain',
component: () => import('src/pages/Supplier/SupplierMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'SupplierList' }, redirect: { name: 'SupplierList' },
children: [ children: [
{ {

View File

@ -34,7 +34,7 @@ export default {
{ {
path: '', path: '',
name: 'AccountMain', name: 'AccountMain',
component: () => import('src/pages/Account/AccountMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'AccountList' }, redirect: { name: 'AccountList' },
children: [ children: [
{ {

View File

@ -26,7 +26,7 @@ export default {
{ {
name: 'ClaimMain', name: 'ClaimMain',
path: '', path: '',
component: () => import('src/pages/Claim/ClaimMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'ClaimList' }, redirect: { name: 'ClaimList' },
children: [ children: [
{ {

View File

@ -38,7 +38,7 @@ export default {
{ {
path: '', path: '',
name: 'CustomerMain', name: 'CustomerMain',
component: () => import('src/pages/Customer/CustomerMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'CustomerList' }, redirect: { name: 'CustomerList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'EntryMain', name: 'EntryMain',
component: () => import('src/pages/Entry/EntryMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'EntryList' }, redirect: { name: 'EntryList' },
children: [ children: [
{ {

View File

@ -25,7 +25,7 @@ export default {
{ {
path: '', path: '',
name: 'InvoiceInMain', name: 'InvoiceInMain',
component: () => import('src/pages/InvoiceIn/InvoiceInMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'InvoiceInList' }, redirect: { name: 'InvoiceInList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'InvoiceOutMain', name: 'InvoiceOutMain',
component: () => import('src/pages/InvoiceOut/InvoiceOutMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'InvoiceOutList' }, redirect: { name: 'InvoiceOutList' },
children: [ children: [
{ {

View File

@ -35,7 +35,7 @@ export default {
{ {
path: '', path: '',
name: 'ItemMain', name: 'ItemMain',
component: () => import('src/pages/Item/ItemMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'ItemList' }, redirect: { name: 'ItemList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'MonitorMain', name: 'MonitorMain',
component: () => import('src/pages/Monitor/MonitorMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'MonitorList' }, redirect: { name: 'MonitorList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'OrderMain', name: 'OrderMain',
component: () => import('src/pages/Order/OrderMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'OrderList' }, redirect: { name: 'OrderList' },
children: [ children: [
{ {

View File

@ -18,7 +18,10 @@ export default {
{ {
path: '/route', path: '/route',
name: 'RouteMain', name: 'RouteMain',
component: () => import('src/pages/Route/RouteMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
props: {
leftDrawer: false,
},
redirect: { name: 'RouteList' }, redirect: { name: 'RouteList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'ShelvingMain', name: 'ShelvingMain',
component: () => import('src/pages/Shelving/ShelvingMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'ShelvingList' }, redirect: { name: 'ShelvingList' },
children: [ children: [
{ {

View File

@ -35,7 +35,7 @@ export default {
{ {
name: 'TicketMain', name: 'TicketMain',
path: '', path: '',
component: () => import('src/pages/Ticket/TicketMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'TicketList' }, redirect: { name: 'TicketList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '', path: '',
name: 'TravelMain', name: 'TravelMain',
component: () => import('src/pages/Travel/TravelMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'TravelList' }, redirect: { name: 'TravelList' },
children: [ children: [
{ {

View File

@ -18,7 +18,7 @@ export default {
{ {
path: '/wagon', path: '/wagon',
name: 'WagonMain', name: 'WagonMain',
component: () => import('src/pages/Wagon/WagonMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'WagonList' }, redirect: { name: 'WagonList' },
children: [ children: [
{ {
@ -62,7 +62,7 @@ export default {
{ {
path: '/wagon/type', path: '/wagon/type',
name: 'WagonTypeMain', name: 'WagonTypeMain',
component: () => import('src/pages/Wagon/WagonMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'WagonTypeList' }, redirect: { name: 'WagonTypeList' },
children: [ children: [
{ {

View File

@ -31,7 +31,7 @@ export default {
{ {
path: '', path: '',
name: 'WorkerMain', name: 'WorkerMain',
component: () => import('src/pages/Worker/WorkerMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'WorkerList' }, redirect: { name: 'WorkerList' },
children: [ children: [
{ {

View File

@ -29,7 +29,7 @@ export default {
{ {
path: '/zone', path: '/zone',
name: 'ZoneMain', name: 'ZoneMain',
component: () => import('src/pages/Zone/ZoneMain.vue'), component: () => import('src/components/common/VnSectionMain.vue'),
redirect: { name: 'ZoneList' }, redirect: { name: 'ZoneList' },
children: [ children: [
{ {

View File

@ -0,0 +1,15 @@
describe('ZoneDeliveryDays', () => {
beforeEach(() => {
cy.login('developer');
cy.viewport(1920, 1080);
cy.visit(`/#/zone/delivery-days`);
});
it('should query for the day', () => {
cy.get('.q-form > .q-btn > .q-btn__content').click();
cy.get('.q-notification__message').should(
'have.text',
'No service for the specified zone'
);
});
});

View File

@ -0,0 +1,15 @@
describe('ZoneList', () => {
beforeEach(() => {
cy.viewport(1920, 1080);
cy.login('developer');
cy.visit(`/#/zone/list`);
});
it('should open the details', () => {
cy.get(':nth-child(1) > .text-right > .material-symbols-outlined').click();
});
it('should redirect to summary', () => {
cy.waitForElement('.q-page');
cy.get('tbody > :nth-child(1)').click();
});
});

View File

@ -0,0 +1,9 @@
describe('ZoneUpcomingDeliveries', () => {
beforeEach(() => {
cy.login('developer');
cy.viewport(1920, 1080);
cy.visit(`/#/zone/upcoming-deliveries`);
});
it('should show the page', () => {});
});