forked from verdnatura/salix-front
Merge branch 'dev' into 6739-invoiceOut
This commit is contained in:
commit
059ec702c9
|
@ -13,6 +13,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
|
||||
### Added
|
||||
|
||||
- (Worker) => Se crea la sección Taquilla
|
||||
- (General) => Se mantiene el filtro lateral en cualquier parte de la seccíon.
|
||||
|
||||
### Fixed
|
||||
|
||||
- (General) => Se vuelven a mostrar los parámetros en la url al aplicar un filtro
|
||||
|
|
|
@ -29,7 +29,7 @@ module.exports = configure(function (/* ctx */) {
|
|||
// app boot file (/src/boot)
|
||||
// --> boot files are part of "main.js"
|
||||
// https://v2.quasar.dev/quasar-cli/boot-files
|
||||
boot: ['i18n', 'axios', 'vnDate', 'validations', 'quasar.defaults'],
|
||||
boot: ['i18n', 'axios', 'vnDate', 'validations', 'quasar', 'quasar.defaults'],
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
|
||||
css: ['app.scss'],
|
||||
|
|
|
@ -127,9 +127,10 @@ const onProvinceCreated = async ({ name }, formData) => {
|
|||
<CreateNewProvinceForm
|
||||
@on-data-saved="onProvinceCreated($event, data)"
|
||||
/>
|
||||
</template>
|
||||
</VnSelectDialog>
|
||||
<VnSelect
|
||||
</template> </VnSelectDialog
|
||||
></VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-xl"
|
||||
><VnSelect
|
||||
:label="t('Country')"
|
||||
:options="countriesOptions"
|
||||
hide-selected
|
||||
|
|
|
@ -156,9 +156,12 @@ const startFormWatcher = () => {
|
|||
|
||||
async function fetch() {
|
||||
try {
|
||||
const { data } = await axios.get($props.url, {
|
||||
let { data } = await axios.get($props.url, {
|
||||
params: { filter: JSON.stringify($props.filter) },
|
||||
});
|
||||
|
||||
if (Array.isArray(data)) data = data[0] ?? {};
|
||||
|
||||
state.set($props.model, data);
|
||||
originalData.value = data && JSON.parse(JSON.stringify(data));
|
||||
|
||||
|
|
|
@ -0,0 +1,55 @@
|
|||
<script setup>
|
||||
import { ref, onMounted, useSlots } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
|
||||
const slots = useSlots();
|
||||
const hasContent = ref(false);
|
||||
const rightPanel = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
rightPanel.value = document.querySelector('#right-panel');
|
||||
if (rightPanel.value.childNodes.length) hasContent.value = true;
|
||||
|
||||
// Check if there's content to display
|
||||
const observer = new MutationObserver(() => {
|
||||
hasContent.value = rightPanel.value.childNodes.length;
|
||||
});
|
||||
|
||||
if (rightPanel.value)
|
||||
observer.observe(rightPanel.value, {
|
||||
subtree: true,
|
||||
childList: true,
|
||||
attributes: true,
|
||||
});
|
||||
|
||||
if (!slots['right-panel'] && !hasContent.value) stateStore.rightDrawer = false;
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
<QBtn
|
||||
v-if="hasContent || $slots['right-panel']"
|
||||
flat
|
||||
@click="stateStore.toggleRightDrawer()"
|
||||
round
|
||||
dense
|
||||
icon="menu"
|
||||
>
|
||||
<QTooltip bottom anchor="bottom right">
|
||||
{{ t('globals.collapseMenu') }}
|
||||
</QTooltip>
|
||||
</QBtn>
|
||||
</div>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<div id="right-panel"></div>
|
||||
<slot v-if="!hasContent" name="right-panel" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
</template>
|
|
@ -1,13 +1,13 @@
|
|||
<script setup>
|
||||
import { onBeforeMount, computed } from 'vue';
|
||||
import { onBeforeMount, computed, watchEffect } from 'vue';
|
||||
import { useRoute, onBeforeRouteUpdate } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
import VnSubToolbar from '../ui/VnSubToolbar.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import RightMenu from 'components/common/RightMenu.vue';
|
||||
|
||||
const props = defineProps({
|
||||
dataKey: { type: String, required: true },
|
||||
|
@ -15,13 +15,13 @@ const props = defineProps({
|
|||
customUrl: { type: String, default: undefined },
|
||||
filter: { type: Object, default: () => {} },
|
||||
descriptor: { type: Object, required: true },
|
||||
searchbarDataKey: { type: String, default: undefined },
|
||||
searchbarUrl: { type: String, default: undefined },
|
||||
filterPanel: { type: Object, default: undefined },
|
||||
searchDataKey: { type: String, default: undefined },
|
||||
searchUrl: { type: String, default: undefined },
|
||||
searchbarLabel: { type: String, default: '' },
|
||||
searchbarInfo: { type: String, default: '' },
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const stateStore = useStateStore();
|
||||
const route = useRoute();
|
||||
const url = computed(() => {
|
||||
|
@ -47,26 +47,38 @@ if (props.baseUrl) {
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
watchEffect(() => {
|
||||
if (Array.isArray(arrayData.store.data))
|
||||
arrayData.store.data = arrayData.store.data[0];
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<Teleport
|
||||
to="#searchbar"
|
||||
v-if="stateStore.isHeaderMounted() && props.searchbarDataKey"
|
||||
>
|
||||
<VnSearchbar
|
||||
:data-key="props.searchbarDataKey"
|
||||
:url="props.searchbarUrl"
|
||||
:label="t(props.searchbarLabel)"
|
||||
:info="t(props.searchbarInfo)"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<component :is="descriptor" />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar" v-if="props.searchDataKey">
|
||||
<slot name="searchbar">
|
||||
<VnSearchbar
|
||||
:data-key="props.searchDataKey"
|
||||
:url="props.searchUrl"
|
||||
:label="props.searchbarLabel"
|
||||
:info="props.searchbarInfo"
|
||||
/>
|
||||
</slot>
|
||||
</Teleport>
|
||||
<slot v-else name="searchbar" />
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<component :is="descriptor" />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<RightMenu>
|
||||
<template #right-panel v-if="props.filterPanel">
|
||||
<component :is="props.filterPanel" :data-key="props.searchDataKey" />
|
||||
</template>
|
||||
</RightMenu>
|
||||
</template>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
|
|
@ -54,6 +54,13 @@ async function fetch() {
|
|||
emit('onFetch', Array.isArray(data) ? data[0] : data);
|
||||
isLoading.value = false;
|
||||
}
|
||||
|
||||
const showRedirectToSummaryIcon = computed(() => {
|
||||
const routeExists = route.matched.some(
|
||||
(route) => route.name === `${route.meta.moduleName}Summary`
|
||||
);
|
||||
return !isSummary.value && route.meta.moduleName && routeExists;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -64,7 +71,7 @@ async function fetch() {
|
|||
<div class="summaryHeader bg-primary q-pa-sm text-weight-bolder">
|
||||
<slot name="header-left">
|
||||
<router-link
|
||||
v-if="!isSummary && route.meta.moduleName"
|
||||
v-if="showRedirectToSummaryIcon"
|
||||
class="header link"
|
||||
:to="{
|
||||
name: `${route.meta.moduleName}Summary`,
|
||||
|
|
|
@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
|
|||
import { useArrayData } from 'composables/useArrayData';
|
||||
import { useRoute } from 'vue-router';
|
||||
import toDate from 'filters/toDate';
|
||||
|
||||
import useRedirect from 'src/composables/useRedirect';
|
||||
import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
@ -56,6 +56,7 @@ const arrayData = useArrayData(props.dataKey, {
|
|||
const route = useRoute();
|
||||
const store = arrayData.store;
|
||||
const userParams = ref({});
|
||||
const { navigate } = useRedirect();
|
||||
|
||||
onMounted(() => {
|
||||
if (props.params) userParams.value = JSON.parse(JSON.stringify(props.params));
|
||||
|
@ -92,6 +93,7 @@ async function search() {
|
|||
|
||||
isLoading.value = false;
|
||||
emit('search');
|
||||
navigate(store.data, {});
|
||||
}
|
||||
|
||||
async function reload() {
|
||||
|
@ -102,6 +104,7 @@ async function reload() {
|
|||
if (!props.showAll && !params.length) store.data = [];
|
||||
isLoading.value = false;
|
||||
emit('refresh');
|
||||
navigate(store.data, {});
|
||||
}
|
||||
|
||||
async function clearFilters() {
|
||||
|
@ -147,7 +150,7 @@ const customTags = computed(() =>
|
|||
|
||||
async function remove(key) {
|
||||
userParams.value[key] = null;
|
||||
await search();
|
||||
await arrayData.applyFilter({ params: userParams.value });
|
||||
emit('remove', key);
|
||||
}
|
||||
|
||||
|
|
|
@ -42,6 +42,10 @@ const props = defineProps({
|
|||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
keepOpts: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
offset: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
|
@ -76,6 +80,7 @@ const arrayData = useArrayData(props.dataKey, {
|
|||
order: props.order,
|
||||
userParams: props.userParams,
|
||||
exprBuilder: props.exprBuilder,
|
||||
keepOpts: props.keepOpts,
|
||||
});
|
||||
const store = arrayData.store;
|
||||
|
||||
|
|
|
@ -1,11 +1,13 @@
|
|||
<script setup>
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useQuasar } from 'quasar';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import useRedirect from 'src/composables/useRedirect';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const { t } = useI18n();
|
||||
|
||||
const props = defineProps({
|
||||
dataKey: {
|
||||
|
@ -65,10 +67,10 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
const arrayData = useArrayData(props.dataKey, { ...props });
|
||||
const { store } = arrayData;
|
||||
const searchText = ref('');
|
||||
const { navigate } = useRedirect();
|
||||
|
||||
onMounted(() => {
|
||||
const params = store.userParams;
|
||||
|
@ -81,37 +83,20 @@ async function search() {
|
|||
const staticParams = Object.entries(store.userParams).filter(
|
||||
([key, value]) => value && (props.staticParams || []).includes(key)
|
||||
);
|
||||
// const filter =props?.where? { where: JSON.parse(props.where) }: {}
|
||||
store.skip = 0;
|
||||
await arrayData.applyFilter({
|
||||
params: {
|
||||
// filter ,
|
||||
...Object.fromEntries(staticParams),
|
||||
search: searchText.value,
|
||||
},
|
||||
});
|
||||
|
||||
if (!props.redirect) return;
|
||||
|
||||
if (props.customRouteRedirectName)
|
||||
return router.push({
|
||||
name: props.customRouteRedirectName,
|
||||
params: { id: searchText.value },
|
||||
});
|
||||
|
||||
const { matched: matches } = router.currentRoute.value;
|
||||
const { path } = matches.at(-1);
|
||||
const [, moduleName] = path.split('/');
|
||||
|
||||
if (!store.data.length || store.data.length > 1)
|
||||
return router.push({ path: `/${moduleName}/list` });
|
||||
|
||||
const targetId = store.data[0].id;
|
||||
let targetUrl;
|
||||
|
||||
if (path.endsWith('/list')) targetUrl = path.replace('/list', `/${targetId}/summary`);
|
||||
if (path.endsWith('-list')) targetUrl = path.replace('-list', `/${targetId}/summary`);
|
||||
else if (path.includes(':id')) targetUrl = path.replace(':id', targetId);
|
||||
|
||||
await router.push({ path: targetUrl });
|
||||
navigate(store.data, {
|
||||
customRouteRedirectName: props.customRouteRedirectName,
|
||||
searchText: searchText.value,
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -120,7 +105,7 @@ async function search() {
|
|||
<VnInput
|
||||
id="searchbar"
|
||||
v-model="searchText"
|
||||
:placeholder="props.label"
|
||||
:placeholder="t(props.label)"
|
||||
dense
|
||||
standout
|
||||
autofocus
|
||||
|
@ -139,7 +124,7 @@ async function search() {
|
|||
name="info"
|
||||
class="cursor-info"
|
||||
>
|
||||
<QTooltip>{{ props.info }}</QTooltip>
|
||||
<QTooltip>{{ t(props.info) }}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
|
|
|
@ -47,7 +47,10 @@ export function useArrayData(key, userOptions) {
|
|||
if (isEmpty || !allowedOptions.includes(option)) continue;
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(store, option)) {
|
||||
store[option] = userOptions[option];
|
||||
const defaultOpts = userOptions[option];
|
||||
store[option] = userOptions.keepOpts?.includes(option)
|
||||
? Object.assign(defaultOpts, store[option])
|
||||
: defaultOpts;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
import { useRouter } from 'vue-router';
|
||||
|
||||
export default function useRedirect() {
|
||||
const router = useRouter();
|
||||
|
||||
const navigate = (data, { customRouteRedirectName, searchText }) => {
|
||||
if (customRouteRedirectName)
|
||||
return router.push({
|
||||
name: customRouteRedirectName,
|
||||
params: { id: searchText },
|
||||
});
|
||||
|
||||
const { matched: matches } = router.currentRoute.value;
|
||||
const { path } = matches.at(-1);
|
||||
|
||||
const to =
|
||||
data.length === 1
|
||||
? path.replace(/\/(list|:id)|-list/, `/${data[0].id}`)
|
||||
: path.replace(/:id.*/, '');
|
||||
|
||||
router.push({ path: to });
|
||||
};
|
||||
|
||||
return { navigate };
|
||||
}
|
|
@ -430,6 +430,7 @@ ticket:
|
|||
boxing: Boxing
|
||||
sms: Sms
|
||||
notes: Notes
|
||||
sale: Sale
|
||||
list:
|
||||
nickname: Nickname
|
||||
state: State
|
||||
|
@ -826,6 +827,7 @@ worker:
|
|||
log: Log
|
||||
calendar: Calendar
|
||||
timeControl: Time control
|
||||
locker: Locker
|
||||
list:
|
||||
name: Name
|
||||
email: Email
|
||||
|
@ -1234,12 +1236,10 @@ item/itemType:
|
|||
itemType: Item type
|
||||
basicData: Basic data
|
||||
summary: Summary
|
||||
zone:
|
||||
monitor:
|
||||
pageTitles:
|
||||
zones: Zone
|
||||
zonesList: Zones
|
||||
deliveryList: Delivery days
|
||||
upcomingList: Upcoming deliveries
|
||||
monitors: Monitors
|
||||
list: List
|
||||
components:
|
||||
topbar: {}
|
||||
itemsFilterPanel:
|
||||
|
|
|
@ -428,6 +428,7 @@ ticket:
|
|||
boxing: Encajado
|
||||
sms: Sms
|
||||
notes: Notas
|
||||
sale: Lineas del pedido
|
||||
list:
|
||||
nickname: Alias
|
||||
state: Estado
|
||||
|
@ -824,6 +825,7 @@ worker:
|
|||
log: Historial
|
||||
calendar: Calendario
|
||||
timeControl: Control de horario
|
||||
locker: Taquilla
|
||||
list:
|
||||
name: Nombre
|
||||
email: Email
|
||||
|
@ -1239,6 +1241,10 @@ zone:
|
|||
zonesList: Zonas
|
||||
deliveryList: Días de entrega
|
||||
upcomingList: Próximos repartos
|
||||
monitor:
|
||||
pageTitles:
|
||||
monitors: Monitores
|
||||
list: Listado
|
||||
components:
|
||||
topbar: {}
|
||||
itemsFilterPanel:
|
||||
|
|
|
@ -1,34 +1,14 @@
|
|||
<script setup>
|
||||
import { onMounted, watch } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
|
||||
import AgencyDescriptor from 'pages/Agency/Card/AgencyDescriptor.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const arrayData = useArrayData('Agency', {
|
||||
url: `Agencies/${route.params.id}`,
|
||||
});
|
||||
const { store } = arrayData;
|
||||
onMounted(async () => await arrayData.fetch({ append: false }));
|
||||
watch(
|
||||
() => route.params.id,
|
||||
async (newId) => {
|
||||
if (newId) {
|
||||
store.url = `Agencies/${newId}`;
|
||||
await arrayData.fetch({ append: false });
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Agency"
|
||||
base-url="Agencies"
|
||||
:descriptor="AgencyDescriptor"
|
||||
searchbar-data-key="AgencyList"
|
||||
searchbar-url="Agencies"
|
||||
search-data-key="AgencyList"
|
||||
search-url="Agencies"
|
||||
searchbar-label="agency.searchBar.label"
|
||||
searchbar-info="agency.searchBar.info"
|
||||
/>
|
||||
|
|
|
@ -15,8 +15,8 @@ const props = defineProps({
|
|||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const { params } = useRoute();
|
||||
const entityId = computed(() => props.id || params.id);
|
||||
const route = useRoute();
|
||||
const entityId = computed(() => props.id || route.params.id);
|
||||
const { store } = useArrayData('Parking');
|
||||
const card = computed(() => store.data);
|
||||
</script>
|
||||
|
|
|
@ -3,11 +3,9 @@ import { computed } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import FetchData from 'src/components/FetchData.vue';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
|
@ -15,9 +13,9 @@ const $props = defineProps({
|
|||
default: 0,
|
||||
},
|
||||
});
|
||||
const { params } = useRoute();
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
const entityId = computed(() => $props.id || params.id);
|
||||
const entityId = computed(() => $props.id || route.params.id);
|
||||
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
|
|
|
@ -201,30 +201,7 @@ async function post(query, params) {
|
|||
auto-load
|
||||
@on-fetch="(data) => (destinationTypes = data)"
|
||||
/>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
<QBtn
|
||||
flat
|
||||
@click="stateStore.toggleRightDrawer()"
|
||||
round
|
||||
dense
|
||||
icon="menu"
|
||||
>
|
||||
<QTooltip bottom anchor="bottom right">
|
||||
{{ t('globals.collapseMenu') }}
|
||||
</QTooltip>
|
||||
</QBtn>
|
||||
</div>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer
|
||||
v-model="stateStore.rightDrawer"
|
||||
side="right"
|
||||
:width="300"
|
||||
show-if-above
|
||||
v-if="claim"
|
||||
>
|
||||
<Teleport to="#right-panel" v-if="stateStore.isHeaderMounted() && claim">
|
||||
<QCard class="totalClaim q-my-md q-pa-sm no-box-shadow">
|
||||
{{ `${t('Total claimed')}: ${toCurrency(totalClaimed)}` }}
|
||||
</QCard>
|
||||
|
@ -274,7 +251,7 @@ async function post(query, params) {
|
|||
v-model="multiplicatorValue"
|
||||
/>
|
||||
</QCard>
|
||||
</QDrawer>
|
||||
</Teleport>
|
||||
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport>
|
||||
<CrudModel
|
||||
v-if="claim"
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ClaimDescriptor from './ClaimDescriptor.vue';
|
||||
import ClaimFilter from '../ClaimFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Claim"
|
||||
base-url="Claims"
|
||||
:descriptor="ClaimDescriptor"
|
||||
searchbar-data-key="ClaimList"
|
||||
searchbar-url="Claims/filter"
|
||||
:filter-panel="ClaimFilter"
|
||||
search-data-key="ClaimList"
|
||||
search-url="Claims/filter"
|
||||
searchbar-label="Search claim"
|
||||
searchbar-info="You can search by claim id or customer name"
|
||||
/>
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import CustomerDescriptor from './CustomerDescriptor.vue';
|
||||
import CustomerFilter from '../CustomerFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Client"
|
||||
base-url="Clients"
|
||||
:descriptor="CustomerDescriptor"
|
||||
searchbar-data-key="CustomerList"
|
||||
searchbar-url="Clients/filter"
|
||||
:filter-panel="CustomerFilter"
|
||||
search-data-key="CustomerList"
|
||||
search-url="Clients/filter"
|
||||
searchbar-label="Search customer"
|
||||
searchbar-info="You can search by customer id or name"
|
||||
/>
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import EntryDescriptor from './EntryDescriptor.vue';
|
||||
import EntryFilter from '../EntryFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Entry"
|
||||
base-url="Entries"
|
||||
:descriptor="EntryDescriptor"
|
||||
searchbar-data-key="EntryList"
|
||||
searchbar-url="Entries/filter"
|
||||
:filter-panel="EntryFilter"
|
||||
search-data-key="EntryList"
|
||||
search-url="Entries/filter"
|
||||
searchbar-label="Search entries"
|
||||
searchbar-info="You can search by entry reference"
|
||||
/>
|
||||
|
|
|
@ -3,14 +3,13 @@ import { ref, computed } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useQuasar } from 'quasar';
|
||||
import axios from 'axios';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import { downloadFile } from 'src/composables/downloadFile';
|
||||
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import FetchData from 'src/components/FetchData.vue';
|
||||
|
||||
import axios from 'axios';
|
||||
import VnRow from 'src/components/ui/VnRow.vue';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const route = useRoute();
|
||||
|
@ -181,7 +180,7 @@ async function upsert() {
|
|||
:auto-load="true"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
<VnRow>
|
||||
<VnSelect
|
||||
:label="t('supplierFk')"
|
||||
v-model="data.supplierFk"
|
||||
|
@ -208,8 +207,8 @@ async function upsert() {
|
|||
:label="t('Supplier ref')"
|
||||
v-model="data.supplierRef"
|
||||
/>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
</VnRow>
|
||||
<VnRow>
|
||||
<QInput
|
||||
:label="t('Expedition date')"
|
||||
v-model="data.issued"
|
||||
|
@ -264,8 +263,8 @@ async function upsert() {
|
|||
</QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
</VnRow>
|
||||
<VnRow>
|
||||
<QInput
|
||||
:label="t('Undeductible VAT')"
|
||||
v-model="data.deductibleExpenseFk"
|
||||
|
@ -318,8 +317,8 @@ async function upsert() {
|
|||
</QBtn>
|
||||
</template>
|
||||
</QInput>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
</VnRow>
|
||||
<VnRow>
|
||||
<QInput
|
||||
:label="t('Entry date')"
|
||||
v-model="data.bookEntried"
|
||||
|
@ -378,8 +377,8 @@ async function upsert() {
|
|||
</QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
</VnRow>
|
||||
<VnRow>
|
||||
<VnSelect
|
||||
:label="t('Currency')"
|
||||
v-model="data.currencyFk"
|
||||
|
@ -395,13 +394,8 @@ async function upsert() {
|
|||
option-value="id"
|
||||
option-label="code"
|
||||
/>
|
||||
</div>
|
||||
<div class="row q-gutter-md q-mb-md">
|
||||
<QCheckbox
|
||||
:label="t('invoiceIn.summary.booked')"
|
||||
v-model="data.isBooked"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<QCheckbox :label="t('invoiceIn.summary.booked')" v-model="data.isBooked" />
|
||||
</template>
|
||||
</FormModel>
|
||||
<QDialog ref="editDmsRef">
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import InvoiceInDescriptor from './InvoiceInDescriptor.vue';
|
||||
import InvoiceInFilter from '../InvoiceInFilter.vue';
|
||||
|
||||
const filter = {
|
||||
include: [
|
||||
|
@ -25,8 +26,9 @@ const filter = {
|
|||
base-url="InvoiceIns"
|
||||
:filter="filter"
|
||||
:descriptor="InvoiceInDescriptor"
|
||||
searchbar-data-key="InvoiceInList"
|
||||
searchbar-url="InvoiceIns/filter"
|
||||
:filter-panel="InvoiceInFilter"
|
||||
search-data-key="InvoiceInList"
|
||||
search-url="InvoiceIns/filter"
|
||||
searchbar-label="Search invoice"
|
||||
searchbar-info="You can search by invoice reference"
|
||||
/>
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import InvoiceOutFilter from '../InvoiceOutFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="InvoiceOut"
|
||||
base-url="InvoiceOuts"
|
||||
:descriptor="InvoiceOutDescriptor"
|
||||
searchbar-data-key="InvoiceOutList"
|
||||
searchbar-url="InvoiceOuts/filter"
|
||||
:filter-panel="InvoiceOutFilter"
|
||||
search-data-key="InvoiceOutList"
|
||||
search-url="InvoiceOuts/filter"
|
||||
searchbar-label="Search invoice"
|
||||
searchbar-info="You can search by invoice reference"
|
||||
/>
|
||||
|
|
|
@ -1,7 +1,17 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ItemDescriptor from './ItemDescriptor.vue';
|
||||
import ItemListFilter from '../ItemListFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard data-key="Item" base-url="Items" :descriptor="ItemDescriptor" />
|
||||
<VnCard
|
||||
data-key="Item"
|
||||
base-url="Items"
|
||||
:descriptor="ItemDescriptor"
|
||||
:filter-panel="ItemListFilter"
|
||||
search-data-key="ItemList"
|
||||
search-url="Items/filter"
|
||||
searchbar-label="searchbar.label"
|
||||
searchbar-info="searchbar.info"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
@ -457,6 +457,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
:limit="12"
|
||||
:expr-builder="exprBuilder"
|
||||
:user-params="params"
|
||||
:keep-opts="['userParams']"
|
||||
:offset="50"
|
||||
auto-load
|
||||
>
|
||||
|
|
|
@ -7,8 +7,7 @@ import VnLv from 'src/components/ui/VnLv.vue';
|
|||
import CardList from 'src/components/ui/CardList.vue';
|
||||
import ItemTypeSummary from 'src/pages/ItemType/Card/ItemTypeSummary.vue';
|
||||
import ItemTypeFilter from 'src/pages/ItemType/ItemTypeFilter.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
|
||||
import ItemTypeSearchbar from '../ItemType/ItemTypeSearchbar.vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
|
||||
|
@ -63,13 +62,7 @@ const exprBuilder = (param, value) => {
|
|||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="ItemTypeList"
|
||||
url="ItemTypes"
|
||||
:label="t('Search item type')"
|
||||
:info="t('Search itemType by id, name or code')"
|
||||
:expr-builder="exprBuilder"
|
||||
/>
|
||||
<ItemTypeSearchbar />
|
||||
</Teleport>
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
|
@ -132,11 +125,3 @@ const exprBuilder = (param, value) => {
|
|||
</QTooltip>
|
||||
</QPageSticky>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
New item type: Nueva familia
|
||||
Name: Nombre
|
||||
Search item type: Buscar familia
|
||||
Search itemType by id, name or code: Buscar familia por id, nombre o código
|
||||
</i18n>
|
||||
|
|
|
@ -78,3 +78,6 @@ itemTags:
|
|||
tag: Tag
|
||||
value: Value
|
||||
relevancy: Relevancy
|
||||
searchbar:
|
||||
label: Search item
|
||||
info: Search by item id
|
||||
|
|
|
@ -78,3 +78,6 @@ itemTags:
|
|||
tag: Etiqueta
|
||||
value: Valor
|
||||
relevancy: Relevancia
|
||||
searchbar:
|
||||
label: Buscar artículo
|
||||
info: Buscar por id de artículo
|
||||
|
|
|
@ -1,12 +1,20 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
|
||||
import ItemTypeDescriptor from 'src/pages/ItemType/Card/ItemTypeDescriptor.vue';
|
||||
import ItemTypeFilter from 'src/pages/ItemType/ItemTypeFilter.vue';
|
||||
import ItemTypeSearchbar from '../ItemTypeSearchbar.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="ItemTypeSummary"
|
||||
base-url="ItemTypes"
|
||||
:descriptor="ItemTypeDescriptor"
|
||||
/>
|
||||
:filter-panel="ItemTypeFilter"
|
||||
search-data-key="ItemTypeList"
|
||||
search-url="ItemTypes"
|
||||
>
|
||||
<template #searchbar>
|
||||
<ItemTypeSearchbar />
|
||||
</template>
|
||||
</VnCard>
|
||||
</template>
|
||||
|
|
|
@ -0,0 +1,19 @@
|
|||
<script setup>
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<VnSearchbar
|
||||
data-key="ItemTypeList"
|
||||
url="ItemTypes"
|
||||
:label="t('Search item type')"
|
||||
:info="t('Search itemType by id, name or code')"
|
||||
/>
|
||||
</template>
|
||||
<i18n>
|
||||
es:
|
||||
Search item type: Buscar familia
|
||||
Search itemType by id, name or code: Buscar familia por id, nombre o código
|
||||
</i18n>
|
|
@ -0,0 +1,88 @@
|
|||
<script setup>
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import SalesClientTable from './SalesClientsTable.vue';
|
||||
import SalesOrdersTable from './SalesOrdersTable.vue';
|
||||
import SalesTicketsTable from './SalesTicketsTable.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const stateStore = useStateStore();
|
||||
|
||||
const expanded = ref(true);
|
||||
|
||||
onMounted(async () => {
|
||||
stateStore.rightDrawer = true;
|
||||
});
|
||||
|
||||
onUnmounted(() => (stateStore.rightDrawer = false));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="SalesMonitorTickets"
|
||||
url="SalesMonitors/salesFilter"
|
||||
:redirect="false"
|
||||
:label="t('searchBar.label')"
|
||||
:info="t('searchBar.info')"
|
||||
/>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<QCard class="full-width q-mb-lg">
|
||||
<QExpansionItem v-model="expanded" dense :duration="150">
|
||||
<template v-if="!expanded" #header>
|
||||
<div class="row full-width">
|
||||
<span class="flex col text-body1">
|
||||
{{ t('salesMonitor.clientsOnWebsite') }}
|
||||
</span>
|
||||
<span class="flex col q-ml-xl text-body1">
|
||||
{{ t('salesMonitor.recentOrderActions') }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<div class="expansion-tables-container">
|
||||
<QCardSection class="col">
|
||||
<span class="flex col q-mb-sm text-body1">
|
||||
{{ t('salesMonitor.clientsOnWebsite') }}
|
||||
</span>
|
||||
<SalesClientTable />
|
||||
</QCardSection>
|
||||
<QCardSection class="col">
|
||||
<span class="flex col q-mb-sm text-body1">
|
||||
{{ t('salesMonitor.recentOrderActions') }}
|
||||
</span>
|
||||
<SalesOrdersTable />
|
||||
</QCardSection>
|
||||
</div>
|
||||
</template>
|
||||
</QExpansionItem>
|
||||
</QCard>
|
||||
<QCard class="full-width q-mb-lg">
|
||||
<QItem class="justify-between">
|
||||
<QItemLabel class="slider-container">
|
||||
<span class="text-body1"
|
||||
>{{ t('salesMonitor.ticketsMonitor') }}
|
||||
</span>
|
||||
<QCardSection class="col"><SalesTicketsTable /> </QCardSection>
|
||||
</QItemLabel>
|
||||
</QItem>
|
||||
</QCard>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.expansion-tables-container {
|
||||
display: flex;
|
||||
border-top: 1px solid $color-spacer;
|
||||
|
||||
@media (max-width: $breakpoint-md-max) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,18 @@
|
|||
<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>
|
|
@ -0,0 +1,219 @@
|
|||
<script setup>
|
||||
import { ref, computed, reactive, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
|
||||
import { toDateFormat } from 'src/filters/date.js';
|
||||
import { dashIfEmpty } from 'src/filters';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const paginateRef = ref(null);
|
||||
const workersActiveOptions = ref([]);
|
||||
const clientsOptions = ref([]);
|
||||
|
||||
const from = ref(Date.vnNew());
|
||||
const to = ref(Date.vnNew());
|
||||
|
||||
const dateRange = computed(() => {
|
||||
const minHour = new Date(from.value);
|
||||
minHour.setHours(0, 0, 0, 0);
|
||||
const maxHour = new Date(to.value);
|
||||
maxHour.setHours(23, 59, 59, 59);
|
||||
return [minHour, maxHour];
|
||||
});
|
||||
|
||||
const filter = reactive({
|
||||
where: {
|
||||
'v.stamp': {
|
||||
between: dateRange.value,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
watch(dateRange, (val) => {
|
||||
filter.where['v.stamp'].between = val;
|
||||
paginateRef.value.fetch();
|
||||
});
|
||||
|
||||
function exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'clientFk':
|
||||
return { [`c.id`]: value };
|
||||
case 'salesPersonFk':
|
||||
return { [`c.${param}`]: value };
|
||||
}
|
||||
}
|
||||
|
||||
const params = reactive({});
|
||||
|
||||
const applyColumnFilter = async (col) => {
|
||||
try {
|
||||
const paramKey = col.columnFilter?.filterParamKey || col.field;
|
||||
params[paramKey] = col.columnFilter.filterValue;
|
||||
await paginateRef.value.addFilter(null, params);
|
||||
} catch (err) {
|
||||
console.error('Error applying column filter', err);
|
||||
}
|
||||
};
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
label: t('salesClientsTable.date'),
|
||||
name: 'date',
|
||||
field: 'dated',
|
||||
align: 'left',
|
||||
columnFilter: null,
|
||||
sortable: true,
|
||||
format: (val) => toDateFormat(val),
|
||||
},
|
||||
{
|
||||
label: t('salesClientsTable.hour'),
|
||||
name: 'hour',
|
||||
field: 'hour',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
label: t('salesClientsTable.salesPerson'),
|
||||
name: 'salesPerson',
|
||||
field: 'salesPerson',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'salesPersonFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
attrs: {
|
||||
options: workersActiveOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
format: (val) => dashIfEmpty(val),
|
||||
},
|
||||
{
|
||||
label: t('salesClientsTable.client'),
|
||||
field: 'clientName',
|
||||
name: 'client',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'clientFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
attrs: {
|
||||
options: clientsOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
format: (val) => dashIfEmpty(val),
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{
|
||||
fields: ['id', 'nickname'],
|
||||
order: 'nickname ASC',
|
||||
where: { role: 'salesPerson' },
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (workersActiveOptions = data)"
|
||||
/>
|
||||
<FetchData
|
||||
url="Clients"
|
||||
:filter="{
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (clientsOptions = data)"
|
||||
/>
|
||||
<QCard style="max-height: 380px; overflow-y: scroll">
|
||||
<VnPaginate
|
||||
ref="paginateRef"
|
||||
data-key="SalesMonitorClients"
|
||||
url="SalesMonitors/clientsFilter"
|
||||
:order="['dated DESC', 'hour DESC']"
|
||||
:limit="6"
|
||||
:expr-builder="exprBuilder"
|
||||
:user-params="params"
|
||||
:filter="filter"
|
||||
:offset="50"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
row-key="id"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
class="full-width"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
>
|
||||
<template #top>
|
||||
<VnInputDate
|
||||
:label="t('salesClientsTable.from')"
|
||||
dense
|
||||
emit-date-format
|
||||
v-model="from"
|
||||
class="q-mr-lg"
|
||||
style="width: 150px"
|
||||
/>
|
||||
<VnInputDate
|
||||
:label="t('salesClientsTable.to')"
|
||||
dense
|
||||
emit-date-format
|
||||
v-model="to"
|
||||
style="width: 150px"
|
||||
/>
|
||||
</template>
|
||||
<template #top-row="{ cols }">
|
||||
<QTr>
|
||||
<QTd
|
||||
v-for="(col, index) in cols"
|
||||
:key="index"
|
||||
style="max-width: 100px"
|
||||
>
|
||||
<VnSelect
|
||||
:is="col.columnFilter.component"
|
||||
v-if="col.columnFilter"
|
||||
v-model="col.columnFilter.filterValue"
|
||||
v-bind="col.columnFilter.attrs"
|
||||
@update:model-value="applyColumnFilter(col)"
|
||||
dense
|
||||
/>
|
||||
</QTd>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body-cell-salesPerson="{ row }">
|
||||
<QTd>
|
||||
<span class="link">{{ row.salesPerson }}</span>
|
||||
<WorkerDescriptorProxy :id="row.salesPersonFk" dense />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-client="{ row }">
|
||||
<QTd>
|
||||
<span class="link">{{ row.clientName }}</span>
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</QCard>
|
||||
</template>
|
|
@ -0,0 +1,203 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
|
||||
import { toDateFormat, toDateTimeFormat } from 'src/filters/date.js';
|
||||
import { toCurrency } from 'src/filters';
|
||||
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||
import axios from 'axios';
|
||||
|
||||
const { t } = useI18n();
|
||||
const { openConfirmationModal } = useVnConfirm();
|
||||
|
||||
const router = useRouter();
|
||||
const paginateRef = ref(null);
|
||||
const workersActiveOptions = ref([]);
|
||||
const clientsOptions = ref([]);
|
||||
const selectedRows = ref([]);
|
||||
|
||||
const dateRange = (value) => {
|
||||
const minHour = new Date(value);
|
||||
minHour.setHours(0, 0, 0, 0);
|
||||
const maxHour = new Date(value);
|
||||
maxHour.setHours(23, 59, 59, 59);
|
||||
|
||||
return [minHour, maxHour];
|
||||
};
|
||||
|
||||
function exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'date_send':
|
||||
return {
|
||||
[`o.date_send`]: {
|
||||
between: dateRange(value),
|
||||
},
|
||||
};
|
||||
case 'clientFk':
|
||||
return { [`c.id`]: value };
|
||||
case 'salesPersonFk':
|
||||
return { [`c.${param}`]: value };
|
||||
}
|
||||
}
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
label: t('salesOrdersTable.date'),
|
||||
name: 'date',
|
||||
field: 'dated',
|
||||
align: 'left',
|
||||
columnFilter: null,
|
||||
},
|
||||
{
|
||||
label: t('salesOrdersTable.client'),
|
||||
name: 'client',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
label: t('salesOrdersTable.salesPerson'),
|
||||
name: 'salesPerson',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
},
|
||||
]);
|
||||
|
||||
const getBadgeColor = (date) => {
|
||||
const today = Date.vnNew();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
const orderLanded = new Date(date);
|
||||
orderLanded.setHours(0, 0, 0, 0);
|
||||
|
||||
const difference = today - orderLanded;
|
||||
|
||||
if (difference == 0) return 'warning';
|
||||
if (difference < 0) return 'success';
|
||||
if (difference > 0) return 'alert';
|
||||
};
|
||||
|
||||
const removeOrders = async () => {
|
||||
try {
|
||||
const selectedIds = selectedRows.value.map((row) => row.id);
|
||||
const params = { deletes: selectedIds };
|
||||
await axios.post('SalesMonitors/deleteOrders', params);
|
||||
selectedRows.value = [];
|
||||
await paginateRef.value.fetch();
|
||||
} catch (err) {
|
||||
console.error('Error deleting orders', err);
|
||||
}
|
||||
};
|
||||
|
||||
const redirectToOrderSummary = (orderId) => {
|
||||
const url = `#/order/${orderId}/summary`;
|
||||
window.open(url, '_blank');
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{
|
||||
fields: ['id', 'nickname'],
|
||||
order: 'nickname ASC',
|
||||
where: { role: 'salesPerson' },
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (workersActiveOptions = data)"
|
||||
/>
|
||||
<FetchData
|
||||
url="Clients"
|
||||
:filter="{
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (clientsOptions = data)"
|
||||
/>
|
||||
|
||||
<QCard style="max-height: 380px; overflow-y: scroll">
|
||||
<VnPaginate
|
||||
ref="paginateRef"
|
||||
data-key="SalesMonitorOrders"
|
||||
url="SalesMonitors/ordersFilter"
|
||||
order="date_make DESC"
|
||||
:limit="6"
|
||||
:expr-builder="exprBuilder"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
row-key="id"
|
||||
selection="multiple"
|
||||
v-model:selected="selectedRows"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
@row-click="(_, row) => redirectToOrderSummary(row.id)"
|
||||
>
|
||||
<template #top>
|
||||
<QBtn
|
||||
v-if="selectedRows.length > 0"
|
||||
icon="delete"
|
||||
size="md"
|
||||
color="primary"
|
||||
@click="
|
||||
openConfirmationModal(
|
||||
t('salesOrdersTable.deleteConfirmTitle'),
|
||||
t('salesOrdersTable.deleteConfirmMessage'),
|
||||
removeOrders
|
||||
)
|
||||
"
|
||||
>
|
||||
<QTooltip>{{ t('salesOrdersTable.delete') }}</QTooltip>
|
||||
</QBtn>
|
||||
</template>
|
||||
<template #body-cell-date="{ row }">
|
||||
<QTd>
|
||||
<QBadge
|
||||
:color="getBadgeColor(row.date_send)"
|
||||
text-color="black"
|
||||
class="q-ma-none q-mb-md"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ toDateFormat(row.date_send) }}
|
||||
</QBadge>
|
||||
<div>{{ toDateTimeFormat(row.date_make) }}</div>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-client="{ row }">
|
||||
<QTd>
|
||||
<div class="q-mb-md">
|
||||
<span class="link">{{ row.clientName }}</span>
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</div>
|
||||
<span> {{ row.agencyName }}</span>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-salesPerson="{ row }">
|
||||
<QTd>
|
||||
<div class="q-mb-md">
|
||||
<span class="link">{{ row.salesPerson }}</span>
|
||||
<WorkerDescriptorProxy :id="row.salesPersonFk" dense />
|
||||
</div>
|
||||
<span>{{ toCurrency(row.import) }}</span>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</QCard>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.q-td {
|
||||
color: gray;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,636 @@
|
|||
<script setup>
|
||||
import { ref, computed, onMounted, reactive, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
|
||||
import TicketDescriptorProxy from 'src/pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
|
||||
import ZoneDescriptorProxy from 'src/pages/Zone/Card/ZoneDescriptorProxy.vue';
|
||||
import TicketSummary from 'src/pages/Ticket/Card/TicketSummary.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import { toDateFormat, toTimeFormat } from 'src/filters/date.js';
|
||||
import { toCurrency } from 'src/filters';
|
||||
const DEFAULT_AUTO_REFRESH = 1000;
|
||||
const { t } = useI18n();
|
||||
const autoRefresh = ref(false);
|
||||
const router = useRouter();
|
||||
const paginateRef = ref(null);
|
||||
const workersActiveOptions = ref([]);
|
||||
const provincesOptions = ref([]);
|
||||
const statesOptions = ref([]);
|
||||
const zonesOptions = ref([]);
|
||||
const visibleColumns = ref([]);
|
||||
const allColumnNames = ref([]);
|
||||
const { viewSummary } = useSummaryDialog();
|
||||
|
||||
const dateRange = (value) => {
|
||||
const minHour = new Date(value);
|
||||
minHour.setHours(0, 0, 0, 0);
|
||||
const maxHour = new Date(value);
|
||||
maxHour.setHours(23, 59, 59, 59);
|
||||
|
||||
return [minHour, maxHour];
|
||||
};
|
||||
|
||||
function exprBuilder(param, value) {
|
||||
switch (param) {
|
||||
case 'stateFk':
|
||||
return { 'ts.stateFk': value };
|
||||
case 'salesPersonFk':
|
||||
return { 'c.salesPersonFk': value };
|
||||
case 'provinceFk':
|
||||
return { 'a.provinceFk': value };
|
||||
case 'theoreticalHour':
|
||||
return { 'z.hour': value };
|
||||
case 'practicalHour':
|
||||
return { 'zed.etc': value };
|
||||
case 'shippedDate':
|
||||
return {
|
||||
't.shipped': {
|
||||
between: dateRange(value),
|
||||
},
|
||||
};
|
||||
case 'nickname':
|
||||
return { [`t.nickname`]: { like: `%${value}%` } };
|
||||
case 'zoneFk':
|
||||
case 'totalWithVat':
|
||||
return { [`t.${param}`]: value };
|
||||
}
|
||||
}
|
||||
|
||||
const filter = { order: ['totalProblems DESC'] };
|
||||
let params = reactive({});
|
||||
|
||||
const applyColumnFilter = async (col) => {
|
||||
try {
|
||||
const paramKey = col.columnFilter?.filterParamKey || col.field;
|
||||
params[paramKey] = col.columnFilter.filterValue;
|
||||
await paginateRef.value.addFilter(null, params);
|
||||
} catch (err) {
|
||||
console.error('Error applying column filter', err);
|
||||
}
|
||||
};
|
||||
|
||||
const getInputEvents = (col) => {
|
||||
return col.columnFilter.type === 'select' || col.columnFilter.type === 'date'
|
||||
? { 'update:modelValue': () => applyColumnFilter(col) }
|
||||
: {
|
||||
'keyup.enter': () => applyColumnFilter(col),
|
||||
};
|
||||
};
|
||||
|
||||
const fetchParams = ($params = {}) => {
|
||||
const excludedParams = ['search', 'clientFk', 'orderFk', 'refFk', 'scopeDays'];
|
||||
|
||||
const hasExcludedParams = excludedParams.some((param) => {
|
||||
return $params && $params[param] != undefined;
|
||||
});
|
||||
const hasParams = Object.entries($params).length;
|
||||
if (!hasParams || !hasExcludedParams) $params.scopeDays = 1;
|
||||
|
||||
if (typeof $params.scopeDays === 'number') {
|
||||
const from = Date.vnNew();
|
||||
from.setHours(0, 0, 0, 0);
|
||||
|
||||
const to = new Date(from.getTime());
|
||||
to.setDate(to.getDate() + $params.scopeDays);
|
||||
to.setHours(23, 59, 59, 999);
|
||||
|
||||
Object.assign($params, { from, to });
|
||||
}
|
||||
return { tableOrder: 'totalProblems DESC', ...$params };
|
||||
};
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
label: t('salesTicketsTable.problems'),
|
||||
name: 'problems',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: null,
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.identifier'),
|
||||
name: 'identifier',
|
||||
field: 'id',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInput,
|
||||
type: 'text',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.client'),
|
||||
name: 'client',
|
||||
align: 'left',
|
||||
field: 'nickname',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInput,
|
||||
type: 'text',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.salesPerson'),
|
||||
name: 'salesPerson',
|
||||
field: 'userName',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'salesPersonFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
options: workersActiveOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.date'),
|
||||
name: 'date',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInputDate,
|
||||
filterParamKey: 'shippedDate',
|
||||
type: 'date',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.theoretical'),
|
||||
name: 'theoretical',
|
||||
field: 'zoneLanding',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
format: (val) => toTimeFormat(val),
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.practical'),
|
||||
name: 'practical',
|
||||
field: 'practicalHour',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInput,
|
||||
type: 'text',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.preparation'),
|
||||
name: 'preparation',
|
||||
field: 'shipped',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
format: (val) => toTimeFormat(val),
|
||||
},
|
||||
|
||||
{
|
||||
label: t('salesTicketsTable.province'),
|
||||
name: 'province',
|
||||
field: 'province',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'provinceFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
options: provincesOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.state'),
|
||||
name: 'state',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'stateFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
options: statesOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.isFragile'),
|
||||
name: 'isFragile',
|
||||
field: 'isFragile',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInput,
|
||||
type: 'text',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.zone'),
|
||||
name: 'zone',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnSelect,
|
||||
filterParamKey: 'zoneFk',
|
||||
type: 'select',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
options: zonesOptions.value,
|
||||
'option-value': 'id',
|
||||
'option-label': 'name',
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t('salesTicketsTable.total'),
|
||||
name: 'total',
|
||||
field: 'totalWithVat',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
columnFilter: {
|
||||
component: VnInput,
|
||||
type: 'text',
|
||||
filterValue: null,
|
||||
event: getInputEvents,
|
||||
attrs: {
|
||||
dense: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'rowActions',
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
},
|
||||
]);
|
||||
|
||||
const getBadgeAttrs = (date) => {
|
||||
let today = Date.vnNew();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
let timeTicket = new Date(date);
|
||||
timeTicket.setHours(0, 0, 0, 0);
|
||||
|
||||
let comparation = today - timeTicket;
|
||||
|
||||
if (comparation == 0) return { color: 'warning', 'text-color': 'black' };
|
||||
if (comparation < 0) return { color: 'success', 'text-color': 'black' };
|
||||
return { color: 'transparent', 'text-color': 'white' };
|
||||
};
|
||||
let refreshTimer = null;
|
||||
const autoRefreshHandler = (value) => {
|
||||
if (value)
|
||||
refreshTimer = setInterval(() => paginateRef.value.fetch(), DEFAULT_AUTO_REFRESH);
|
||||
else {
|
||||
clearInterval(refreshTimer);
|
||||
refreshTimer = null;
|
||||
}
|
||||
};
|
||||
const redirectToTicketSummary = (id) => {
|
||||
router.push({ name: 'TicketSummary', params: { id } });
|
||||
};
|
||||
|
||||
const stateColors = {
|
||||
notice: 'info',
|
||||
success: 'positive',
|
||||
warning: 'warning',
|
||||
alert: 'negative',
|
||||
};
|
||||
|
||||
const totalPriceColor = (ticket) => {
|
||||
const total = parseInt(ticket.totalWithVat);
|
||||
if (total > 0 && total < 50) return 'warning';
|
||||
};
|
||||
|
||||
const formatShippedDate = (date) => {
|
||||
if (!date) return '-';
|
||||
const split1 = date.split('T');
|
||||
const [year, month, day] = split1[0].split('-');
|
||||
const _date = new Date(year, month - 1, day);
|
||||
return toDateFormat(_date);
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
const filteredColumns = columns.value.filter((col) => col.name !== 'rowActions');
|
||||
allColumnNames.value = filteredColumns.map((col) => col.name);
|
||||
params = fetchParams();
|
||||
await paginateRef.value.addFilter(null, params);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{
|
||||
fields: ['id', 'nickname'],
|
||||
order: 'nickname ASC',
|
||||
where: { role: 'salesPerson' },
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (workersActiveOptions = data)"
|
||||
/>
|
||||
<FetchData
|
||||
url="Provinces"
|
||||
:filter="{
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (provincesOptions = data)"
|
||||
/>
|
||||
<FetchData
|
||||
url="States"
|
||||
:filter="{
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (statesOptions = data)"
|
||||
/>
|
||||
<FetchData
|
||||
url="Zones"
|
||||
:filter="{
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
}"
|
||||
auto-load
|
||||
@on-fetch="(data) => (zonesOptions = data)"
|
||||
/>
|
||||
<VnPaginate
|
||||
ref="paginateRef"
|
||||
data-key="SalesMonitorTickets"
|
||||
url="SalesMonitors/salesFilter"
|
||||
:filter="filter"
|
||||
:limit="20"
|
||||
:expr-builder="exprBuilder"
|
||||
:user-params="params"
|
||||
:offset="50"
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
row-key="id"
|
||||
:pagination="{ rowsPerPage: 0 }"
|
||||
:visible-columns="visibleColumns"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
@row-click="(_, row) => redirectToTicketSummary(row.id)"
|
||||
>
|
||||
<template #top>
|
||||
<TableVisibleColumns
|
||||
:all-columns="allColumnNames"
|
||||
table-code="ticketsMonitor"
|
||||
labels-traductions-path="salesTicketsTable"
|
||||
@on-config-saved="visibleColumns = [...$event, 'rowActions']"
|
||||
/>
|
||||
<QCheckbox
|
||||
v-model="autoRefresh"
|
||||
:label="t('salesTicketsTable.autoRefresh')"
|
||||
@update:model-value="autoRefreshHandler"
|
||||
/>
|
||||
</template>
|
||||
<template #top-row="{ cols }">
|
||||
<QTr>
|
||||
<QTd
|
||||
v-for="(col, index) in cols"
|
||||
:key="index"
|
||||
style="max-width: 100px"
|
||||
>
|
||||
<component
|
||||
:is="col.columnFilter.component"
|
||||
v-if="col.columnFilter"
|
||||
v-model="col.columnFilter.filterValue"
|
||||
v-bind="col.columnFilter.attrs"
|
||||
v-on="col.columnFilter.event(col)"
|
||||
dense
|
||||
style="padding-bottom: 0"
|
||||
/>
|
||||
</QTd>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body-cell-problems="{ row }">
|
||||
<QTd class="q-gutter-x-sm">
|
||||
<QIcon
|
||||
v-if="row.isTaxDataChecked === 0"
|
||||
name="vn:no036"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{
|
||||
t('salesTicketsTable.noVerifiedData')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.hasTicketRequest"
|
||||
name="vn:buyrequest"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{
|
||||
t('salesTicketsTable.purchaseRequest')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.itemShortage"
|
||||
name="vn:unavailable"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.notVisible') }}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.isFreezed"
|
||||
name="vn:frozen"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.clientFrozen') }}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.risk"
|
||||
name="vn:risk"
|
||||
:color="row.hasHighRisk ? 'negative' : 'primary'"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip
|
||||
>{{ t('salesTicketsTable.risk') }}:
|
||||
{{ row.risk }}</QTooltip
|
||||
>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.hasComponentLack"
|
||||
name="vn:components"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{
|
||||
t('salesTicketsTable.componentLack')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
v-if="row.isTooLittle"
|
||||
name="vn:isTooLittle"
|
||||
color="primary"
|
||||
size="xs"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.tooLittle') }}</QTooltip>
|
||||
</QIcon>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-identifier="{ row }">
|
||||
<QTd>
|
||||
<span class="link" @click.stop.prevent>{{ row.id }}</span>
|
||||
<TicketDescriptorProxy :id="row.id" />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-client="{ row }">
|
||||
<QTd @click.stop.prevent>
|
||||
<span class="link">{{ row.nickname }}</span>
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-salesPerson="{ row }">
|
||||
<QTd @click.stop.prevent>
|
||||
<span class="link">{{ row.userName }}</span>
|
||||
<WorkerDescriptorProxy :id="row.salesPersonFk" />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-date="{ row }">
|
||||
<QTd>
|
||||
<QBadge
|
||||
v-bind="getBadgeAttrs(row.shippedDate)"
|
||||
class="q-ma-none"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ formatShippedDate(row.shippedDate) }}
|
||||
</QBadge>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-state="{ row }">
|
||||
<QTd @click.stop.prevent>
|
||||
<div v-if="row.refFk">
|
||||
<span class="link">{{ row.refFk }}</span>
|
||||
<InvoiceOutDescriptorProxy :id="row.invoiceOutId" />
|
||||
</div>
|
||||
<QBadge
|
||||
v-else
|
||||
:color="stateColors[row.classColor] || 'transparent'"
|
||||
:text-color="stateColors[row.classColor] ? 'black' : 'white'"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ row.state }}
|
||||
</QBadge>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-isFragile="{ row }">
|
||||
<QTd>
|
||||
<QIcon
|
||||
v-if="row.isFragile"
|
||||
name="local_bar"
|
||||
color="primary"
|
||||
size="sm"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.isFragile') }}</QTooltip>
|
||||
</QIcon>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-zone="{ row }">
|
||||
<QTd @click.stop.prevent>
|
||||
<span class="link">{{ row.zoneName }}</span>
|
||||
<ZoneDescriptorProxy :id="row.zoneFk" />
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-total="{ row }">
|
||||
<QTd>
|
||||
<QBadge
|
||||
:color="totalPriceColor(row) || 'transparent'"
|
||||
:text-color="totalPriceColor(row) ? 'black' : 'white'"
|
||||
dense
|
||||
style="font-size: 14px"
|
||||
>
|
||||
{{ toCurrency(row.totalWithVat) }}
|
||||
</QBadge>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-rowActions="{ row }">
|
||||
<QTd @click.stop.prevent>
|
||||
<QBtn
|
||||
icon="vn:lines"
|
||||
color="primary"
|
||||
size="md"
|
||||
class="q-mr-sm"
|
||||
flat
|
||||
dense
|
||||
:to="{ name: 'TicketSale', params: { id: row.id } }"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.goToLines') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
icon="preview"
|
||||
color="primary"
|
||||
size="md"
|
||||
dense
|
||||
flat
|
||||
@click="viewSummary(row.id, TicketSummary)"
|
||||
>
|
||||
<QTooltip>{{ t('salesTicketsTable.preview') }}</QTooltip>
|
||||
</QBtn>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</template>
|
|
@ -0,0 +1,45 @@
|
|||
salesMonitor:
|
||||
clientsOnWebsite: Clients on website
|
||||
recentOrderActions: Recent order actions
|
||||
ticketsMonitor: Tickets monitor
|
||||
salesClientsTable:
|
||||
from: From
|
||||
to: To
|
||||
date: Date
|
||||
hour: Hour
|
||||
salesPerson: Salesperson
|
||||
client: Client
|
||||
salesOrdersTable:
|
||||
delete: Delete
|
||||
date: Date
|
||||
client: Client
|
||||
salesPerson: Salesperson
|
||||
deleteConfirmTitle: Delete selected elements
|
||||
deleteConfirmMessage: All the selected elements will be deleted. Are you sure you want to continue?
|
||||
salesTicketsTable:
|
||||
autoRefresh: Auto-refresh
|
||||
problems: Problems
|
||||
noVerifiedData: No verified data
|
||||
notVisible: Not visible
|
||||
purchaseRequest: Purchase request
|
||||
clientFrozen: Client frozen
|
||||
risk: Risk
|
||||
componentLack: Component lack
|
||||
tooLittle: Ticket too little
|
||||
identifier: Identifier
|
||||
client: Client
|
||||
salesPerson: Salesperson
|
||||
date: Date
|
||||
theoretical: Theoretical
|
||||
practical: Practical
|
||||
province: Province
|
||||
state: State
|
||||
isFragile: Is fragile
|
||||
zone: Zone
|
||||
goToLines: Go to lines
|
||||
preview: Preview
|
||||
total: Total
|
||||
preparation: Preparation
|
||||
searchBar:
|
||||
label: Search tickets
|
||||
info: Search tickets by id or alias
|
|
@ -0,0 +1,45 @@
|
|||
salesMonitor:
|
||||
clientsOnWebsite: Clientes activos en la web
|
||||
recentOrderActions: Acciones recientes en pedidos
|
||||
ticketsMonitor: Monitor de tickets
|
||||
salesClientsTable:
|
||||
from: Desde
|
||||
to: Hasta
|
||||
date: Fecha
|
||||
hour: Hora
|
||||
salesPerson: Comercial
|
||||
client: Cliente
|
||||
salesOrdersTable:
|
||||
delete: Eliminar
|
||||
date: Fecha
|
||||
client: Cliente
|
||||
salesPerson: Comercial
|
||||
deleteConfirmTitle: Eliminar los elementos seleccionados
|
||||
deleteConfirmMessage: Todos los elementos seleccionados serán eliminados. ¿Seguro que quieres continuar?
|
||||
salesTicketsTable:
|
||||
autoRefresh: Auto-refresco
|
||||
problems: Problemas
|
||||
noVerifiedData: Sin datos comprobados
|
||||
notVisible: No visible
|
||||
purchaseRequest: Petición de compra
|
||||
clientFrozen: Cliente congelado
|
||||
risk: Riesgo
|
||||
componentLack: Faltan componentes
|
||||
tooLittle: Ticket demasiado pequeño
|
||||
identifier: Identificador
|
||||
client: Cliente
|
||||
salesPerson: Comercial
|
||||
date: Fecha
|
||||
theoretical: Teórica
|
||||
practical: Práctica
|
||||
province: Provincia
|
||||
state: Estado
|
||||
isFragile: Es frágil
|
||||
zone: Zona
|
||||
goToLines: Ir a líneas
|
||||
preview: Vista previa
|
||||
total: Total
|
||||
preparation: Preparación
|
||||
searchBar:
|
||||
label: Buscar tickets
|
||||
info: Buscar tickets por identificador o alias
|
|
@ -1,7 +1,19 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import OrderDescriptor from 'pages/Order/Card/OrderDescriptor.vue';
|
||||
import OrderFilter from './OrderFilter.vue';
|
||||
import OrderSearchbar from './OrderSearchbar.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard data-key="Order" base-url="Orders" :descriptor="OrderDescriptor" />
|
||||
<VnCard
|
||||
data-key="Order"
|
||||
base-url="Orders"
|
||||
:descriptor="OrderDescriptor"
|
||||
:filter-panel="OrderFilter"
|
||||
search-data-key="OrderList"
|
||||
>
|
||||
<template #searchbar>
|
||||
<OrderSearchbar />
|
||||
</template>
|
||||
</VnCard>
|
||||
</template>
|
||||
|
|
|
@ -7,7 +7,6 @@ import { dashIfEmpty, toCurrency, toDateHourMinSec } from 'src/filters';
|
|||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import OrderSearchbar from 'pages/Order/Card/OrderSearchbar.vue';
|
||||
import FetchedTags from 'components/ui/FetchedTags.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
@ -53,10 +52,6 @@ const detailsColumns = ref([
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<OrderSearchbar />
|
||||
</Teleport>
|
||||
|
||||
<div class="q-pa-md">
|
||||
<CardSummary ref="summary" :url="`Orders/${entityId}/summary`">
|
||||
<template #header="{ entity }">
|
||||
|
@ -158,11 +153,7 @@ const detailsColumns = ref([
|
|||
<p class="header">
|
||||
{{ t('order.summary.details') }}
|
||||
</p>
|
||||
<QTable
|
||||
:columns="detailsColumns"
|
||||
:rows="entity?.rows"
|
||||
flat
|
||||
>
|
||||
<QTable :columns="detailsColumns" :rows="entity?.rows" flat>
|
||||
<template #header="props">
|
||||
<QTr :props="props">
|
||||
<QTh auto-width>{{ t('order.summary.item') }}</QTh>
|
||||
|
|
|
@ -61,6 +61,7 @@ function navigate(id) {
|
|||
:limit="20"
|
||||
:order="['landed DESC', 'clientFk', 'id DESC']"
|
||||
:user-params="{ showEmpty: false }"
|
||||
:keep-opts="['userParams']"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, computed } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
|
@ -10,7 +10,7 @@ import VnSelect from 'src/components/common/VnSelect.vue';
|
|||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const parkingId = route.params?.id || null;
|
||||
const parkingId = computed(() => route.params?.id || null);
|
||||
const sectors = ref([]);
|
||||
const sectorFilter = { fields: ['id', 'description'] };
|
||||
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ParkingDescriptor from 'pages/Parking/Card/ParkingDescriptor.vue';
|
||||
import ParkingFilter from 'pages/Parking/ParkingFilter.vue';
|
||||
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
|
@ -13,8 +14,9 @@ const filter = {
|
|||
base-url="Parkings"
|
||||
:filter="filter"
|
||||
:descriptor="ParkingDescriptor"
|
||||
searchbar-data-key="ParkingList"
|
||||
searchbar-url="Parkings"
|
||||
:filter-panel="ParkingFilter"
|
||||
search-data-key="ParkingList"
|
||||
search-url="Parkings"
|
||||
searchbar-label="parking.searchBar.label"
|
||||
searchbar-info="parking.searchBar.info"
|
||||
/>
|
||||
|
|
|
@ -15,10 +15,10 @@ const props = defineProps({
|
|||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const { params } = useRoute();
|
||||
const entityId = computed(() => props.id || params.id);
|
||||
const route = useRoute();
|
||||
const entityId = computed(() => props.id || route.params.id);
|
||||
const { store } = useArrayData('Parking');
|
||||
const card = computed(() => store.data);
|
||||
const parking = computed(() => store.data);
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
include: [{ relation: 'sector', scope: { fields: ['id', 'description'] } }],
|
||||
|
@ -29,11 +29,12 @@ const filter = {
|
|||
module="Parking"
|
||||
data-key="Parking"
|
||||
:url="`Parkings/${entityId}`"
|
||||
:title="card?.code"
|
||||
:subtitle="card?.id"
|
||||
:title="parking?.code"
|
||||
:subtitle="parking?.id"
|
||||
:filter="filter"
|
||||
@on-fetch="(data) => (parking = data)"
|
||||
>
|
||||
<template #body="{ entity: parking }">
|
||||
<template #body>
|
||||
<VnLv :label="t('globals.code')" :value="parking.code" />
|
||||
<VnLv :label="t('parking.pickingOrder')" :value="parking.pickingOrder" />
|
||||
<VnLv :label="t('parking.sector')" :value="parking.sector?.description" />
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { ref, computed } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
|
@ -14,7 +15,9 @@ const $props = defineProps({
|
|||
const router = useRoute();
|
||||
const { t } = useI18n();
|
||||
const entityId = computed(() => $props.id || router.params.id);
|
||||
const { store } = useArrayData('Parking');
|
||||
|
||||
const parking = ref(store.data);
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
include: [{ relation: 'sector', scope: { fields: ['id', 'description'] } }],
|
||||
|
@ -23,9 +26,13 @@ const filter = {
|
|||
|
||||
<template>
|
||||
<div class="q-pa-md">
|
||||
<CardSummary :url="`Parkings/${entityId}`" :filter="filter">
|
||||
<template #header="{ entity: parking }">{{ parking.code }}</template>
|
||||
<template #body="{ entity: parking }">
|
||||
<CardSummary
|
||||
:url="`Parkings/${entityId}`"
|
||||
:filter="filter"
|
||||
@on-fetch="(data) => (parking = data)"
|
||||
>
|
||||
<template #header>{{ parking.code }}</template>
|
||||
<template #body>
|
||||
<QCard class="vn-one">
|
||||
<QCardSection class="q-pa-none">
|
||||
<a
|
||||
|
|
|
@ -1,7 +1,19 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import RouteDescriptor from 'pages/Route/Card/RouteDescriptor.vue';
|
||||
import RouteFilter from './RouteFilter.vue';
|
||||
import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard data-key="Route" base-url="Routes" :descriptor="RouteDescriptor" />
|
||||
<VnCard
|
||||
data-key="Route"
|
||||
base-url="Routes"
|
||||
:descriptor="RouteDescriptor"
|
||||
:filter-panel="RouteFilter"
|
||||
search-data-key="RouteList"
|
||||
>
|
||||
<template #searchbar>
|
||||
<RouteSearchbar />
|
||||
</template>
|
||||
</VnCard>
|
||||
</template>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<script setup>
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import {useI18n} from "vue-i18n";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
|
||||
|
|
|
@ -10,7 +10,6 @@ import { dashIfEmpty, toCurrency, toDate, toHour } from 'src/filters';
|
|||
import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
|
||||
import { openBuscaman } from 'src/utils/buscaman';
|
||||
|
||||
const $props = defineProps({
|
||||
|
@ -118,11 +117,6 @@ const ticketColumns = ref([
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<RouteSearchbar />
|
||||
</Teleport>
|
||||
</template>
|
||||
<div class="q-pa-md full-width">
|
||||
<CardSummary
|
||||
ref="summary"
|
||||
|
|
|
@ -280,7 +280,7 @@ function navigateToRouteSummary(event, row) {
|
|||
<div class="table-actions">
|
||||
<QIcon
|
||||
name="preview"
|
||||
size="xs"
|
||||
size="sm"
|
||||
color="primary"
|
||||
@click.stop="
|
||||
viewSummary(
|
||||
|
|
|
@ -422,7 +422,7 @@ const openTicketsDialog = (id) => {
|
|||
<div class="flex items-center no-wrap table-actions">
|
||||
<QIcon
|
||||
name="vn:ticketAdd"
|
||||
size="xs"
|
||||
size="sm"
|
||||
color="primary"
|
||||
class="cursor-pointer"
|
||||
@click="openTicketsDialog(props?.row?.id)"
|
||||
|
@ -431,7 +431,7 @@ const openTicketsDialog = (id) => {
|
|||
</QIcon>
|
||||
<QIcon
|
||||
name="preview"
|
||||
size="xs"
|
||||
size="sm"
|
||||
color="primary"
|
||||
@click="
|
||||
viewSummary(props?.row?.id, RouteSummary)
|
||||
|
|
|
@ -242,7 +242,7 @@ function navigateToRoadmapSummary(event, row) {
|
|||
<div class="flex items-center table-actions">
|
||||
<QIcon
|
||||
name="preview"
|
||||
size="xs"
|
||||
size="sm"
|
||||
color="primary"
|
||||
@click.stop="
|
||||
viewSummary(
|
||||
|
|
|
@ -1,7 +1,19 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ShelvingDescriptor from 'pages/Shelving/Card/ShelvingDescriptor.vue';
|
||||
import ShelvingFilter from './ShelvingFilter.vue';
|
||||
import ShelvingSearchbar from './ShelvingSearchbar.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard data-key="Shelving" base-url="Shelvings" :descriptor="ShelvingDescriptor" />
|
||||
<VnCard
|
||||
data-key="Shelving"
|
||||
base-url="Shelvings"
|
||||
:descriptor="ShelvingDescriptor"
|
||||
:filter-panel="ShelvingFilter"
|
||||
search-data-key="ShelvingList"
|
||||
>
|
||||
<template #searchbar>
|
||||
<ShelvingSearchbar />
|
||||
</template>
|
||||
</VnCard>
|
||||
</template>
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import SupplierDescriptor from './SupplierDescriptor.vue';
|
||||
import SupplierListFilter from '../SupplierListFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Supplier"
|
||||
base-url="Suppliers"
|
||||
:descriptor="SupplierDescriptor"
|
||||
searchbar-data-key="SupplierList"
|
||||
searchbar-url="Suppliers/filter"
|
||||
:filter-panel="SupplierListFilter"
|
||||
search-data-key="SupplierList"
|
||||
search-url="Suppliers/filter"
|
||||
searchbar-label="Search suppliers"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import TicketDescriptor from './TicketDescriptor.vue';
|
||||
import TicketFilter from '../TicketFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Ticket"
|
||||
base-url="Tickets"
|
||||
:descriptor="TicketDescriptor"
|
||||
searchbar-data-key="TicketList"
|
||||
searchbar-url="Tickets/filter"
|
||||
:filter-panel="TicketFilter"
|
||||
search-data-key="TicketList"
|
||||
search-url="Tickets/filter"
|
||||
searchbar-label="Search ticket"
|
||||
searchbar-info="You can search by ticket id or alias"
|
||||
/>
|
||||
|
|
|
@ -0,0 +1 @@
|
|||
<template>Ticket sale</template>
|
|
@ -1,14 +1,16 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import WorkerDescriptor from './WorkerDescriptor.vue';
|
||||
import WorkerFilter from '../WorkerFilter.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard
|
||||
data-key="Worker"
|
||||
base-url="Workers"
|
||||
:descriptor="WorkerDescriptor"
|
||||
searchbar-data-key="WorkerList"
|
||||
searchbar-url="Workers/filter"
|
||||
:filter-panel="WorkerFilter"
|
||||
search-data-key="WorkerList"
|
||||
search-url="Workers/filter"
|
||||
searchbar-label="Search worker"
|
||||
searchbar-info="You can search by worker id or name"
|
||||
/>
|
||||
|
|
|
@ -0,0 +1,64 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import axios from 'axios';
|
||||
import { useRole } from 'src/composables/useRole';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
|
||||
const { hasAny } = useRole();
|
||||
const { t } = useI18n();
|
||||
const fetchData = ref();
|
||||
const originaLockerId = ref();
|
||||
const lockers = ref([]);
|
||||
const { store } = useArrayData('Worker');
|
||||
const entityId = computed(() => useRoute().params.id);
|
||||
const filter = computed(() => ({
|
||||
where: {
|
||||
gender: store.data?.sex,
|
||||
or: [{ workerFk: null }, { workerFk: entityId.value }],
|
||||
},
|
||||
}));
|
||||
|
||||
const save = async (data) => {
|
||||
const lockerId = data.id ?? originaLockerId.value;
|
||||
const workerFk = lockerId == originaLockerId.value ? null : entityId.value;
|
||||
|
||||
await axios.patch(`Lockers/${lockerId}`, { workerFk });
|
||||
};
|
||||
|
||||
const init = async (data) => {
|
||||
await fetchData.value.fetch();
|
||||
originaLockerId.value = data.id;
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<FetchData
|
||||
ref="fetchData"
|
||||
url="Lockers/codes"
|
||||
:filter="filter"
|
||||
@on-fetch="(data) => (lockers = data)"
|
||||
/>
|
||||
<FormModel
|
||||
:url="`Workers/${entityId}/locker`"
|
||||
model="worker"
|
||||
auto-load
|
||||
:save-fn="save"
|
||||
@on-fetch="init"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<VnSelect
|
||||
:label="t('Locker')"
|
||||
v-model="data.id"
|
||||
:options="lockers"
|
||||
option-label="code"
|
||||
option-value="id"
|
||||
hide-selected
|
||||
:readonly="!hasAny(['productionBoss', 'hr'])"
|
||||
/>
|
||||
</template>
|
||||
</FormModel>
|
||||
</template>
|
|
@ -1,2 +1,3 @@
|
|||
Search worker: Buscar trabajador
|
||||
You can search by worker id or name: Puedes buscar por id o nombre del trabajador
|
||||
Locker: Taquilla
|
||||
|
|
|
@ -1,34 +1,24 @@
|
|||
<script setup>
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import { ref } from 'vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'src/components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import { QCheckbox } from 'quasar';
|
||||
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
const zoneFilter = {
|
||||
include: [
|
||||
{
|
||||
relation: 'agency',
|
||||
scope: {
|
||||
fields: ['name'],
|
||||
include: { relation: 'agencyModeFk', scope: { fields: ['id'] } },
|
||||
},
|
||||
},
|
||||
{ relation: 'sip', scope: { fields: ['extension', 'secret'] } },
|
||||
{ relation: 'department', scope: { include: { relation: 'department' } } },
|
||||
{ relation: 'client', scope: { fields: ['phone'] } },
|
||||
],
|
||||
};
|
||||
|
||||
const agencyFilter = {
|
||||
fields: ['id', 'name'],
|
||||
order: 'name ASC',
|
||||
limit: 30,
|
||||
};
|
||||
const agencyOptions = ref([]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -36,58 +26,90 @@ const agencyFilter = {
|
|||
:filter="agencyFilter"
|
||||
@on-fetch="(data) => (agencyOptions = data)"
|
||||
auto-load
|
||||
url="agencies"
|
||||
/>
|
||||
<FetchData
|
||||
:filter="zoneFilter"
|
||||
@on-fetch="(data) => (zoneOptions = data)"
|
||||
auto-load
|
||||
url="zones"
|
||||
url="AgencyModes/isActive"
|
||||
/>
|
||||
|
||||
<FormModel
|
||||
:filter="zoneFilter"
|
||||
:url="`zone/${route.params.id}/basic-data`"
|
||||
auto-load
|
||||
model="Zone"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<FormModel :url="`Zones/${route.params.id}`" auto-load model="zone">
|
||||
<template #form="{ data, validate }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput :label="t('Name')" clearable v-model="data.zone.name" />
|
||||
<VnInput :label="t('Name')" clearable v-model="data.name" />
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput v-model="data.agency.name" :label="t('Agency')" clearable />
|
||||
<VnInput v-model="data.zone.itemMaxSize" :label="t('Max m³')" clearable />
|
||||
<VnInput v-model="data.zone.m3Max" :label="t('Maximum m³')" clearable />
|
||||
<VnSelect
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.agencyModeFk"
|
||||
:rules="validate('zone.agencyModeFk')"
|
||||
:options="agencyOptions"
|
||||
:label="t('Agency')"
|
||||
emit-value
|
||||
map-options
|
||||
use-input
|
||||
hide-bottom-space
|
||||
/>
|
||||
<VnInput
|
||||
class="mw-10"
|
||||
v-model="data.itemMaxSize"
|
||||
:label="t('Max m³')"
|
||||
clearable
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
<VnInput
|
||||
class="mw-10"
|
||||
v-model="data.m3Max"
|
||||
:label="t('Maximum m³')"
|
||||
clearable
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.zone.travelingDays"
|
||||
v-model="data.travelingDays"
|
||||
:label="t('Traveling days')"
|
||||
clearable
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
<VnInput v-model="data.zone.hour" :label="t('Closing')" clearable />
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput v-model="data.zone.price" :label="t('Price')" clearable />
|
||||
<VnInput v-model="data.zone.bonus" :label="t('Bonus')" clearable />
|
||||
<VnInputTime v-model="data.hour" :label="t('Closing')" clearable />
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.zone.inflation"
|
||||
:label="t('Inflation')"
|
||||
v-model="data.price"
|
||||
:label="t('Price')"
|
||||
type="number"
|
||||
min="0"
|
||||
clearable
|
||||
/>
|
||||
<QCheckbox v-model="data.zone.isVolumetric" :label="t('Volumetric')" />
|
||||
<VnInput
|
||||
v-model="data.bonus"
|
||||
:label="t('Bonus')"
|
||||
type="number"
|
||||
min="0"
|
||||
clearable
|
||||
/>
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput v-model="data.inflation" :label="t('Inflation')" clearable />
|
||||
<QCheckbox
|
||||
v-model="data.isVolumetric"
|
||||
:label="t('Volumetric')"
|
||||
:toggle-indeterminate="false"
|
||||
/>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.mw-10 {
|
||||
max-width: 10vw;
|
||||
}
|
||||
</style>
|
||||
<i18n>
|
||||
es:
|
||||
Name: Nombre
|
||||
|
|
|
@ -1,6 +1,15 @@
|
|||
<script setup>
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ZoneDescriptor from './ZoneDescriptor.vue';
|
||||
</script>
|
||||
<template>
|
||||
<VnCard data-key="Zone" base-url="Zones" />
|
||||
<VnCard
|
||||
data-key="Zone"
|
||||
base-url="Zones"
|
||||
:descriptor="ZoneDescriptor"
|
||||
searchbar-data-key="ZoneList"
|
||||
searchbar-url="Zones/filter"
|
||||
searchbar-label="Search zones"
|
||||
searchbar-info="You can search by zone reference"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
@ -6,8 +6,10 @@ import { useI18n } from 'vue-i18n';
|
|||
import CardDescriptor from 'components/ui/CardDescriptor.vue';
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import { toTimeFormat } from 'src/filters/date';
|
||||
import { toCurrency } from 'filters/index';
|
||||
|
||||
import useCardDescription from 'src/composables/useCardDescription';
|
||||
import ZoneDescriptorMenuItems from './ZoneDescriptorMenuItems.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
|
@ -58,7 +60,7 @@ const setData = (entity) => {
|
|||
flat
|
||||
dense
|
||||
size="md"
|
||||
icon="preview"
|
||||
icon="vn:zone"
|
||||
color="white"
|
||||
class="link"
|
||||
:to="{ name: 'ZoneList' }"
|
||||
|
@ -68,29 +70,15 @@ const setData = (entity) => {
|
|||
</QTooltip>
|
||||
</QBtn>
|
||||
</template>
|
||||
<!-- <template #menu="{ entity }">
|
||||
<template #menu="{ entity }">
|
||||
<ZoneDescriptorMenuItems :zone="entity" />
|
||||
</template> -->
|
||||
</template>
|
||||
<template #body="{ entity }">
|
||||
{{ console.log('entity', entity) }}
|
||||
<VnLv :label="t('Agency')" :value="entity.agencyMode.name" />
|
||||
<VnLv :label="t('Closing hour')" :value="toTimeFormat(entity.hour)" />
|
||||
<VnLv :label="t('zoneing days')" :value="entity.zoneingDays" />
|
||||
<VnLv :label="t('Price')" :value="entity.price" />
|
||||
<VnLv :label="t('Bonus')" :value="entity.bonus" />
|
||||
<VnLv :label="t('summary.agency')" :value="entity.agencyMode.name" />
|
||||
<VnLv :label="t('summary.closeHour')" :value="toTimeFormat(entity.hour)" />
|
||||
<VnLv :label="t('summary.travelingDays')" :value="entity.travelingDays" />
|
||||
<VnLv :label="t('summary.price')" :value="toCurrency(entity.price)" />
|
||||
<VnLv :label="t('summary.bonus')" :value="toCurrency(entity.bonus)" />
|
||||
</template>
|
||||
</CardDescriptor>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Summary: Detalles
|
||||
The zone will be deleted: El envío será eliminado
|
||||
Do you want to delete this zone?: ¿Quieres eliminar este envío?
|
||||
All zones with current agency: Todos los envíos con la agencia actual
|
||||
Agency: Agencia
|
||||
Closing hour: Hora de cierre
|
||||
zoneing days: Días de viaje
|
||||
Price: Precio
|
||||
Bonus: Bonificación
|
||||
</i18n>
|
||||
|
|
|
@ -2,14 +2,16 @@
|
|||
import { ref, onMounted, computed } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { dashIfEmpty } from 'src/filters';
|
||||
import { getUrl } from 'src/composables/getUrl';
|
||||
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||
|
||||
import { getUrl } from 'src/composables/getUrl';
|
||||
import { toCurrency } from 'filters/index';
|
||||
import { toTimeFormat } from 'src/filters/date';
|
||||
import axios from 'axios';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
|
@ -23,71 +25,84 @@ const $props = defineProps({
|
|||
const entityId = computed(() => $props.id || route.params.id);
|
||||
const zoneUrl = ref();
|
||||
|
||||
onMounted(async () => {
|
||||
zoneUrl.value = (await getUrl('')) + `zone/${entityId.value}/`;
|
||||
const filter = computed(() => {
|
||||
const filter = {
|
||||
include: {
|
||||
relation: 'agencyMode',
|
||||
fields: ['name'],
|
||||
},
|
||||
where: {
|
||||
id: entityId,
|
||||
},
|
||||
};
|
||||
return filter;
|
||||
});
|
||||
|
||||
const filter = computed(() => {
|
||||
return { where: { id: entityId.value } };
|
||||
const columns = computed(() => [
|
||||
{
|
||||
label: t('summary.name'),
|
||||
name: 'name',
|
||||
field: 'warehouse',
|
||||
align: 'left',
|
||||
format: (val) => val.name,
|
||||
},
|
||||
]);
|
||||
const warehouses = ref([]);
|
||||
|
||||
const getWarehouses = async () => {
|
||||
const params = {
|
||||
filter: {
|
||||
include: {
|
||||
relation: 'warehouse',
|
||||
fields: ['name'],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const { data } = await axios.get(`Zones/${entityId.value}/warehouses`, { params });
|
||||
warehouses.value = data;
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
zoneUrl.value = (await getUrl('')) + `zone/${entityId.value}/`;
|
||||
await getWarehouses();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CardSummary
|
||||
data-key="zoneData"
|
||||
data-key="ZoneSummary"
|
||||
ref="summary"
|
||||
:url="`Zones/summary`"
|
||||
url="Zones/findOne"
|
||||
:filter="filter"
|
||||
>
|
||||
<template #header="{ entity }">
|
||||
<div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div>
|
||||
<div>#{{ entity.id }} - {{ entity.name }}</div>
|
||||
</template>
|
||||
<template #body="{ entity: zone }">
|
||||
<QCard class="vn-one">
|
||||
<VnTitle
|
||||
:url="zoneUrl + `basic-data`"
|
||||
:text="t('zone.summary.basicData')"
|
||||
/>
|
||||
<VnLv :label="t('zone.card.name')" :value="zone.user?.nickname" />
|
||||
<VnLv
|
||||
:label="t('zone.list.department')"
|
||||
:value="zone.department?.department?.name"
|
||||
/>
|
||||
<VnLv :label="t('zone.list.email')" :value="zone.user.email" copy />
|
||||
<VnLv :label="t('zone.summary.boss')" link>
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
v-if="zone.boss"
|
||||
:name="dashIfEmpty(zone.boss?.name)"
|
||||
:zone-id="zone.bossFk"
|
||||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :value="zone.mobileExtension">
|
||||
<template #label>
|
||||
{{ t('zone.summary.phoneExtension') }}
|
||||
<VnLinkPhone :phone-number="zone.mobileExtension" />
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :value="zone.phone">
|
||||
<template #label>
|
||||
{{ t('zone.summary.entPhone') }}
|
||||
<VnLinkPhone :phone-number="zone.phone" />
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('zone.summary.locker')" :value="zone.locker" />
|
||||
<VnTitle :url="zoneUrl + `basic-data`" :text="t('summary.basicData')" />
|
||||
<VnLv :label="t('summary.agency')" :value="zone.agencyMode?.name" />
|
||||
<VnLv :label="t('summary.price')" :value="toCurrency(zone.price)" />
|
||||
<VnLv :label="t('summary.bonus')" :value="toCurrency(zone.bonus)" />
|
||||
</QCard>
|
||||
<QCard class="vn-one">
|
||||
<VnTitle :text="t('zone.summary.userData')" />
|
||||
<VnLv :label="t('zone.summary.userId')" :value="zone.user.id" />
|
||||
<VnLv :label="t('zone.card.name')" :value="zone.user.nickname" />
|
||||
<VnLv :label="t('zone.summary.role')" :value="zone.user.role.name" />
|
||||
<VnLv :value="zone?.sip?.extension">
|
||||
<template #label>
|
||||
{{ t('zone.summary.sipExtension') }}
|
||||
<VnLinkPhone :phone-number="zone?.sip?.extension" />
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnTitle :url="zoneUrl + `basic-data`" :text="t('summary.basicData')" />
|
||||
<VnLv :label="t('summary.closeHour')" :value="toTimeFormat(zone.hour)" />
|
||||
<VnLv :label="t('summary.travelingDays')" :value="zone.travelingDays" />
|
||||
<QCheckbox
|
||||
:label="t('summary.volumetric')"
|
||||
v-model="zone.isVolumetric"
|
||||
:disable="true"
|
||||
/>
|
||||
</QCard>
|
||||
<QCard class="full-width">
|
||||
<VnTitle :url="zoneUrl + `warehouses`" :text="t('summary.warehouse')" />
|
||||
<QTable
|
||||
:columns="columns"
|
||||
:rows="warehouses"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
/>
|
||||
</QCard>
|
||||
</template>
|
||||
</CardSummary>
|
||||
|
|
|
@ -63,7 +63,7 @@ async function remove(row) {
|
|||
outline
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('zone.list.remove')"
|
||||
:label="t('list.remove')"
|
||||
@click.stop="remove(row)"
|
||||
color="primary"
|
||||
style="margin-top: 15px"
|
||||
|
|
|
@ -63,7 +63,7 @@ async function remove(row) {
|
|||
outline
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('zone.list.remove')"
|
||||
:label="t('list.remove')"
|
||||
@click.stop="remove(row)"
|
||||
color="primary"
|
||||
style="margin-top: 15px"
|
||||
|
|
|
@ -1,184 +1,114 @@
|
|||
<script setup>
|
||||
import { computed, onMounted, onUpdated, ref } from 'vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { QIcon, QInput, QItem, QItemSection, QSelect } from 'quasar';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
|
||||
onMounted(() => fetch());
|
||||
onUpdated(() => fetch());
|
||||
import VnInputTime from 'components/common/VnInputTime.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
|
||||
const newZoneForm = reactive({
|
||||
travelingDays: 0,
|
||||
price: 0.2,
|
||||
bonus: 0.2,
|
||||
hour: Date.vnNew(),
|
||||
isVolumetric: false,
|
||||
});
|
||||
const entityId = computed(() => $props.id || route.params.id);
|
||||
const warehousesOptions = ref([]);
|
||||
const agencyOptions = ref([]);
|
||||
|
||||
let zoneTypes = [];
|
||||
let originalData = {};
|
||||
const zone = ref({});
|
||||
const filteredZoneTypes = ref(zoneTypes);
|
||||
|
||||
async function onSubmit() {
|
||||
try {
|
||||
const params = {
|
||||
id: entityId.value,
|
||||
label: zone.value.label,
|
||||
plate: zone.value.plate,
|
||||
volume: zone.value.volume,
|
||||
typeFk: zone.value.typeFk,
|
||||
};
|
||||
await axios.patch('Zones', params).then((res) => {
|
||||
if (res.status == 200) router.push({ path: `/zone/list` });
|
||||
});
|
||||
} catch (error) {
|
||||
//
|
||||
}
|
||||
}
|
||||
|
||||
async function onReset() {
|
||||
if (entityId.value) {
|
||||
zone.value = { ...originalData };
|
||||
} else {
|
||||
zone.value = {};
|
||||
}
|
||||
}
|
||||
|
||||
async function fetch() {
|
||||
try {
|
||||
await axios.get('ZoneTypes').then(async (res) => {
|
||||
if (res.data) {
|
||||
filteredZoneTypes.value = zoneTypes = res.data;
|
||||
}
|
||||
});
|
||||
if (entityId.value) {
|
||||
await axios.get(`Zones/${entityId.value}`).then(async (res) => {
|
||||
const data = res.data;
|
||||
if (data) {
|
||||
zone.value.label = data.label;
|
||||
zone.value.plate = data.plate;
|
||||
zone.value.volume = data.volume;
|
||||
zone.value.typeFk = data.typeFk;
|
||||
originalData = { ...zone.value };
|
||||
}
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
//
|
||||
}
|
||||
}
|
||||
|
||||
function filterType(val, update) {
|
||||
update(() => {
|
||||
const needle = val.toLowerCase();
|
||||
filteredZoneTypes.value = zoneTypes.filter(
|
||||
(v) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
});
|
||||
}
|
||||
const redirectToZoneLocations = (_, { id }) => {
|
||||
router.push({ name: 'ZoneLocations', params: { id } });
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QPage class="q-pa-sm q-mx-xl">
|
||||
<QForm @submit="onSubmit()" @reset="onReset()" class="q-pa-sm">
|
||||
<QCard class="q-pa-md">
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
filled
|
||||
v-model="zone.label"
|
||||
:label="t('zone.create.name')"
|
||||
type="number"
|
||||
min="0"
|
||||
:rules="[(val) => !!val || t('zone.warnings.labelNotEmpty')]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
filled
|
||||
v-model="zone.plate"
|
||||
:label="t('zone.create.agency')"
|
||||
:rules="[(val) => !!val || t('zone.warnings.plateNotEmpty')]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
filled
|
||||
v-model="zone.volume"
|
||||
:label="t('zone.create.close')"
|
||||
type="number"
|
||||
min="0"
|
||||
:rules="[(val) => !!val || t('zone.warnings.volumeNotEmpty')]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QSelect
|
||||
filled
|
||||
v-model="zone.typeFk"
|
||||
use-input
|
||||
fill-input
|
||||
hide-selected
|
||||
input-debounce="0"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
:label="t('zone.create.price')"
|
||||
:options="filteredZoneTypes"
|
||||
:rules="[(val) => !!val || t('zone.warnings.typeNotEmpty')]"
|
||||
@filter="filterType"
|
||||
>
|
||||
<template v-if="zone.typeFk" #append>
|
||||
<QIcon
|
||||
name="cancel"
|
||||
@click.stop.prevent="zone.typeFk = null"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
<template #no-option>
|
||||
<QItem>
|
||||
<QItemSection class="text-grey">
|
||||
{{ t('zone.warnings.noData') }}
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
</QSelect>
|
||||
</div>
|
||||
</div>
|
||||
</QCard>
|
||||
<div class="q-mt-md">
|
||||
<QBtn :label="t('zone.type.submit')" type="submit" color="primary" />
|
||||
<QBtn
|
||||
:label="t('zone.type.reset')"
|
||||
type="reset"
|
||||
color="primary"
|
||||
flat
|
||||
class="q-ml-sm"
|
||||
/>
|
||||
</div>
|
||||
</QForm>
|
||||
<FetchData
|
||||
url="Warehouses"
|
||||
:filter="{ order: ['name'] }"
|
||||
@on-fetch="(data) => (warehousesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="AgencyModes/isActive"
|
||||
:filter="{ order: ['name'] }"
|
||||
@on-fetch="(data) => (agencyOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<FormModel
|
||||
url-create="Zones"
|
||||
model="Zones"
|
||||
:form-initial-data="newZoneForm"
|
||||
@on-data-saved="redirectToZoneLocations"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.name"
|
||||
:label="t('create.name')"
|
||||
:required="true"
|
||||
/>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnSelect
|
||||
:label="t('create.warehouse')"
|
||||
:options="warehousesOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.warehouseFk"
|
||||
/>
|
||||
<VnSelect
|
||||
:label="t('create.agency')"
|
||||
:options="agencyOptions"
|
||||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.agencyModeFk"
|
||||
:required="true"
|
||||
/>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.travelingDays"
|
||||
:label="t('create.travelingDays')"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
|
||||
<VnInputTime v-model="data.hour" :label="t('create.closingHour')" />
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<VnInput
|
||||
v-model="data.price"
|
||||
:label="t('create.price')"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
<VnInput
|
||||
v-model="data.bonus"
|
||||
:label="t('create.bonus')"
|
||||
type="number"
|
||||
min="0"
|
||||
/>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<QCheckbox
|
||||
:label="t('create.volumetric')"
|
||||
v-model="data.isVolumetric"
|
||||
:toggle-indeterminate="false"
|
||||
/>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.q-page {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.q-form {
|
||||
width: 70%;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
|
|||
import VnInput from 'components/common/VnInput.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
import VnSelectFilter from 'components/common/VnSelectFilter.vue';
|
||||
import VnSelect from 'components/common/VnSelect.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const props = defineProps({
|
||||
|
@ -17,37 +17,47 @@ const props = defineProps({
|
|||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const agencies = ref([]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="agencies"
|
||||
limit="30"
|
||||
@on-fetch="(data) => (agencies = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
<template #body="{ params }">
|
||||
<FetchData url="agencies" @on-fetch="(data) => (agencies = data)" auto-load />
|
||||
<VnFilterPanel
|
||||
:data-key="props.dataKey"
|
||||
:search-button="true"
|
||||
:hidden-tags="['search']"
|
||||
>
|
||||
<template #tags="{ tag }">
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ t(`filterPanel.${tag.label}`) }}: </strong>
|
||||
<span>{{ tag.value }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #body="{ params, searchFn }">
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput :label="t('Name')" v-model="params.name" is-outlined />
|
||||
<VnInput
|
||||
:label="t('filterPanel.name')"
|
||||
v-model="params.name"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnSelectFilter
|
||||
:label="t('Agency')"
|
||||
v-model="params.agencyModefK"
|
||||
<VnSelect
|
||||
:label="t('filterPanel.agencyModeFk')"
|
||||
v-model="params.agencyModeFk"
|
||||
:options="agencies"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
@input-value="agencies.fetch()"
|
||||
@update:model-value="searchFn()"
|
||||
dense
|
||||
outlined
|
||||
rounded
|
||||
>
|
||||
</VnSelectFilter>
|
||||
</VnSelect>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
|
|
|
@ -1,111 +1,219 @@
|
|||
<script setup>
|
||||
import axios from 'axios';
|
||||
import { useQuasar } from 'quasar';
|
||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { onMounted, computed } from 'vue';
|
||||
import { dashIfEmpty, toCurrency, toDate } from 'src/filters';
|
||||
|
||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||
import CardList from 'components/ui/CardList.vue';
|
||||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import FetchData from 'src/components/FetchData.vue';
|
||||
import ZoneSummary from 'src/pages/Zone/Card/ZoneSummary.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import ZoneFilterPanel from './ZoneFilterPanel.vue';
|
||||
|
||||
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
|
||||
import { toTimeFormat } from 'src/filters/date';
|
||||
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import axios from 'axios';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const arrayData = useArrayData('ZoneList');
|
||||
const store = arrayData.store;
|
||||
const router = useRouter();
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const router = useRouter();
|
||||
const { notify } = useNotify();
|
||||
const { viewSummary } = useSummaryDialog();
|
||||
const { openConfirmationModal } = useVnConfirm();
|
||||
|
||||
function navigate(id) {
|
||||
router.push({ path: `/zone/${id}/edit` });
|
||||
}
|
||||
const redirectToZoneSummary = (event, { id }) => {
|
||||
router.push({ name: 'ZoneSummary', params: { id } });
|
||||
};
|
||||
|
||||
function create() {
|
||||
function redirectToCreateView() {
|
||||
router.push({ path: `/zone/create` });
|
||||
}
|
||||
const columns = computed(() => [
|
||||
{
|
||||
name: 'ID',
|
||||
label: t('list.id'),
|
||||
field: (row) => row.id,
|
||||
sortable: true,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'name',
|
||||
label: t('list.name'),
|
||||
field: (row) => row.name,
|
||||
sortable: true,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'agency',
|
||||
label: t('list.agency'),
|
||||
field: (row) => row?.agencyMode?.name,
|
||||
sortable: true,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'close',
|
||||
label: t('list.close'),
|
||||
field: (row) => (row?.hour ? toTimeFormat(row?.hour) : '-'),
|
||||
sortable: true,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'price',
|
||||
label: t('list.price'),
|
||||
field: (row) => (row?.price ? toCurrency(row.price) : '-'),
|
||||
sortable: true,
|
||||
align: 'left',
|
||||
},
|
||||
{
|
||||
name: 'actions',
|
||||
label: '',
|
||||
sortable: false,
|
||||
align: 'right',
|
||||
},
|
||||
]);
|
||||
|
||||
async function remove(row) {
|
||||
try {
|
||||
await axios.delete(`Zones/${row.id}`).then(async () => {
|
||||
quasar.notify({
|
||||
message: t('zone.list.removeItem'),
|
||||
type: 'positive',
|
||||
});
|
||||
store.data.splice(store.data.indexOf(row), 1);
|
||||
});
|
||||
} catch (error) {
|
||||
//
|
||||
const exprBuilder = (param, value) => {
|
||||
switch (param) {
|
||||
case 'name':
|
||||
return {
|
||||
name: { like: `%${value}%` },
|
||||
};
|
||||
case 'code':
|
||||
return {
|
||||
code: { like: `%${value}%` },
|
||||
};
|
||||
case 'agencyModeFk':
|
||||
return {
|
||||
agencyModeFk: value,
|
||||
};
|
||||
case 'search':
|
||||
if (value) {
|
||||
if (!isNaN(value)) {
|
||||
return { id: value };
|
||||
} else {
|
||||
return {
|
||||
name: {
|
||||
like: `%${value}%`,
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
async function clone(id) {
|
||||
const { data } = await axios.post(`Zones/${id}/clone`);
|
||||
notify(t('globals.dataSaved'), 'positive');
|
||||
router.push({ name: 'ZoneBasicData', params: { id: data.id } });
|
||||
}
|
||||
const handleClone = (id) => {
|
||||
openConfirmationModal(
|
||||
t('list.confirmCloneTitle'),
|
||||
t('list.confirmCloneSubtitle'),
|
||||
() => clone(id)
|
||||
);
|
||||
};
|
||||
onMounted(async () => {
|
||||
stateStore.rightDrawer = true;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="/Agencies"
|
||||
@on-fetch="(data) => (agencyOptions = data)"
|
||||
:filter="{ fields: ['id', 'name'] }"
|
||||
auto-load
|
||||
/>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="ZoneList"
|
||||
url="Zones"
|
||||
:filter="{
|
||||
include: { relation: 'agencyMode', scope: { fields: ['name'] } },
|
||||
}"
|
||||
:expr-builder="exprBuilder"
|
||||
:label="t('list.searchZone')"
|
||||
:info="t('list.searchInfo')"
|
||||
/>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<ZoneFilterPanel data-key="ZoneList" :expr-builder="exprBuilder" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<div class="vn-card-list">
|
||||
<VnPaginate data-key="ZoneList" url="/Zones" order="id DESC" auto-load>
|
||||
<VnPaginate
|
||||
data-key="ZoneList"
|
||||
url="Zones"
|
||||
:filter="{
|
||||
include: { relation: 'agencyMode', scope: { fields: ['name'] } },
|
||||
}"
|
||||
:limit="20"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<CardList
|
||||
v-for="row of rows"
|
||||
:key="row.id"
|
||||
:title="(row.label || '').toString()"
|
||||
:id="row.id"
|
||||
@click="navigate(row.id)"
|
||||
>
|
||||
<template #list-items>
|
||||
<VnLv
|
||||
:label="t('zone.list.id')"
|
||||
:title-label="t('zone.list.id')"
|
||||
:value="row.id"
|
||||
/>
|
||||
<VnLv :label="t('zone.list.name')" :value="row?.name" />
|
||||
<VnLv
|
||||
:label="t('zone.list.agency')"
|
||||
:options="agencyOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
:value="row?.agencyFk"
|
||||
/>
|
||||
<VnLv
|
||||
:label="t('zone.list.close')"
|
||||
:value="toTimeFormat(row?.hour)"
|
||||
/>
|
||||
<VnLv :label="t('zone.list.price')" :value="row?.price" />
|
||||
</template>
|
||||
<template #actions>
|
||||
<QBtn
|
||||
:label="t('components.smartCard.openCard')"
|
||||
@click.stop="navigate(row.id)"
|
||||
outline
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('zone.list.openSummary')"
|
||||
@click.stop="viewSummary(row.id, ZoneSummary)"
|
||||
color="primary"
|
||||
style="margin-top: 15px"
|
||||
/>
|
||||
<!--AQUI PONER BOTÓN CLONAR-->
|
||||
<QBtn
|
||||
:label="t('zone.list.clone')"
|
||||
@click.stop="remove(row)"
|
||||
color="primary"
|
||||
style="margin-top: 15px"
|
||||
/>
|
||||
</template>
|
||||
</CardList>
|
||||
<div class="q-pa-md">
|
||||
<QTable
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
row-key="clientId"
|
||||
class="full-width"
|
||||
@row-click="redirectToZoneSummary"
|
||||
>
|
||||
<template #header="props">
|
||||
<QTr :props="props" class="bg">
|
||||
<QTh
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
>
|
||||
{{ t(col.label) }}
|
||||
<QTooltip v-if="col.tooltip">{{
|
||||
col.tooltip
|
||||
}}</QTooltip>
|
||||
</QTh>
|
||||
</QTr>
|
||||
</template>
|
||||
|
||||
<template #body-cell="props">
|
||||
<QTd :props="props">
|
||||
<QTr :props="props" class="cursor-pointer">
|
||||
{{ props.value }}
|
||||
</QTr>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-actions="props">
|
||||
<QTd :props="props" class="q-gutter-x-sm">
|
||||
<QIcon
|
||||
name="vn:clone"
|
||||
size="sm"
|
||||
color="primary"
|
||||
@click.stop="handleClone(props.row.id)"
|
||||
>
|
||||
<QTooltip>{{ t('globals.clone') }}</QTooltip>
|
||||
</QIcon>
|
||||
<QIcon
|
||||
name="preview"
|
||||
size="sm"
|
||||
color="primary"
|
||||
@click.stop="
|
||||
viewSummary(props.row.id, ZoneSummary)
|
||||
"
|
||||
>
|
||||
<QTooltip>{{ t('Preview') }}</QTooltip>
|
||||
</QIcon>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</div>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
<QPageSticky position="bottom-right" :offset="[18, 18]">
|
||||
<QBtn @click="create" fab icon="add" color="primary">
|
||||
<QTooltip>{{ t('zone.list.create') }}</QTooltip>
|
||||
<QBtn @click="redirectToCreateView()" fab icon="add" color="primary">
|
||||
<QTooltip>{{ t('list.create') }}</QTooltip>
|
||||
</QBtn>
|
||||
</QPageSticky>
|
||||
</QPage>
|
||||
|
|
|
@ -1,19 +1,42 @@
|
|||
zone:
|
||||
list:
|
||||
volume: Volume
|
||||
clone: Clone
|
||||
id: Id
|
||||
name: Name
|
||||
agency: Agency
|
||||
close: Close
|
||||
price: Price
|
||||
create: Create zone
|
||||
openSummary: Details
|
||||
create:
|
||||
name: Name
|
||||
agency: Agency
|
||||
close: Close
|
||||
price: Price
|
||||
type:
|
||||
submit: Save
|
||||
reset: Reset
|
||||
pageTitles:
|
||||
zones: Zone
|
||||
zonesList: Zones
|
||||
zoneCreate: Create zone
|
||||
deliveryList: Delivery days
|
||||
upcomingList: Upcoming deliveries
|
||||
list:
|
||||
clone: Clone
|
||||
id: Id
|
||||
name: Name
|
||||
agency: Agency
|
||||
close: Close
|
||||
price: Price
|
||||
create: Create zone
|
||||
openSummary: Details
|
||||
searchZone: Search zones
|
||||
searchInfo: Search zone by id or name
|
||||
confirmCloneTitle: All it's properties will be copied
|
||||
confirmCloneSubtitle: Do you want to clone this zone?
|
||||
create:
|
||||
name: Name
|
||||
warehouse: Warehouse
|
||||
agency: Agency
|
||||
travelingDays: Traveling days
|
||||
closingHour: Closing hour
|
||||
price: Price
|
||||
bonus: Bonus
|
||||
volumetric: Volumetric
|
||||
summary:
|
||||
agency: Agency
|
||||
price: Price
|
||||
basicData: Basic data
|
||||
bonus: Bonus
|
||||
closeHour: Close hour
|
||||
travelingDays: Traveling days
|
||||
volumetric: Volumetric
|
||||
warehouse: Warehouse
|
||||
name: Name
|
||||
filterPanel:
|
||||
name: Name
|
||||
agencyModeFk: Agency
|
||||
|
|
|
@ -1,19 +1,42 @@
|
|||
zone:
|
||||
list:
|
||||
volume: Volumen
|
||||
clone: Clonar
|
||||
id: Id
|
||||
name: Nombre
|
||||
agency: Agencia
|
||||
close: Cierre
|
||||
price: Precio
|
||||
create: Crear zona
|
||||
openSummary: Detalles
|
||||
create:
|
||||
name: Nombre
|
||||
agency: Agencia
|
||||
close: Cierre
|
||||
price: Precio
|
||||
type:
|
||||
submit: Guardar
|
||||
reset: Reiniciar
|
||||
pageTitles:
|
||||
zones: Zonas
|
||||
zonesList: Zonas
|
||||
zoneCreate: Nueva zona
|
||||
deliveryList: Días de entrega
|
||||
upcomingList: Próximos repartos
|
||||
list:
|
||||
clone: Clonar
|
||||
id: Id
|
||||
name: Nombre
|
||||
agency: Agencia
|
||||
close: Cierre
|
||||
price: Precio
|
||||
create: Crear zona
|
||||
openSummary: Detalles
|
||||
searchZone: Buscar zonas
|
||||
searchInfo: Buscar zonas por identificador o nombre
|
||||
confirmCloneTitle: Todas sus propiedades serán copiadas
|
||||
confirmCloneSubtitle: ¿Seguro que quieres clonar esta zona?
|
||||
create:
|
||||
name: Nombre
|
||||
warehouse: Almacén
|
||||
agency: Agencia
|
||||
travelingDays: Días de viaje
|
||||
closingHour: Hora de cierre
|
||||
price: Precio
|
||||
bonus: Bonificación
|
||||
volumetric: Volumétrico
|
||||
summary:
|
||||
agency: Agencia
|
||||
price: Precio
|
||||
basicData: Datos básicos
|
||||
bonus: Bonificación
|
||||
closeHour: Hora de cierre
|
||||
travelingDays: Días de viaje
|
||||
volumetric: Volumétrico
|
||||
warehouse: Almacén
|
||||
name: Nombre
|
||||
filterPanel:
|
||||
name: Nombre
|
||||
agencyModeFk: Agencia
|
||||
|
|
|
@ -18,6 +18,7 @@ import Parking from './parking';
|
|||
import Agency from './agency';
|
||||
import ItemType from './itemType';
|
||||
import Zone from './zone';
|
||||
import Monitor from './monitor';
|
||||
|
||||
export default [
|
||||
Item,
|
||||
|
@ -40,4 +41,5 @@ export default [
|
|||
Agency,
|
||||
ItemType,
|
||||
Zone,
|
||||
Monitor,
|
||||
];
|
||||
|
|
|
@ -0,0 +1,36 @@
|
|||
import { RouterView } from 'vue-router';
|
||||
|
||||
export default {
|
||||
path: '/monitor',
|
||||
name: 'Monitor',
|
||||
meta: {
|
||||
title: 'monitors',
|
||||
icon: 'grid_view',
|
||||
moduleName: 'Monitor',
|
||||
},
|
||||
component: RouterView,
|
||||
redirect: { name: 'MonitorMain' },
|
||||
menus: {
|
||||
main: ['MonitorList'],
|
||||
card: [],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'MonitorMain',
|
||||
component: () => import('src/pages/Monitor/MonitorMain.vue'),
|
||||
redirect: { name: 'MonitorList' },
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: 'MonitorList',
|
||||
meta: {
|
||||
title: 'list',
|
||||
icon: 'grid_view',
|
||||
},
|
||||
component: () => import('src/pages/Monitor/MonitorList.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
|
@ -12,7 +12,7 @@ export default {
|
|||
redirect: { name: 'TicketMain' },
|
||||
menus: {
|
||||
main: ['TicketList'],
|
||||
card: ['TicketBoxing', 'TicketSms'],
|
||||
card: ['TicketBoxing', 'TicketSms', 'TicketSale'],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
|
@ -66,6 +66,15 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Ticket/Card/TicketBasicData.vue'),
|
||||
},
|
||||
{
|
||||
name: 'TicketSale',
|
||||
path: 'sale',
|
||||
meta: {
|
||||
title: 'sale',
|
||||
icon: 'vn:lines',
|
||||
},
|
||||
component: () => import('src/pages/Ticket/Card/TicketSale.vue'),
|
||||
},
|
||||
{
|
||||
path: 'boxing',
|
||||
name: 'TicketBoxing',
|
||||
|
|
|
@ -22,6 +22,7 @@ export default {
|
|||
'WorkerCalendar',
|
||||
'WorkerDms',
|
||||
'WorkerTimeControl',
|
||||
'WorkerLocker',
|
||||
],
|
||||
departmentCard: ['BasicData'],
|
||||
},
|
||||
|
@ -167,6 +168,15 @@ export default {
|
|||
component: () =>
|
||||
import('src/pages/Worker/Card/WorkerTimeControl.vue'),
|
||||
},
|
||||
{
|
||||
name: 'WorkerLocker',
|
||||
path: 'locker',
|
||||
meta: {
|
||||
title: 'locker',
|
||||
icon: 'lock',
|
||||
},
|
||||
component: () => import('src/pages/Worker/Card/WorkerLocker.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
|
|
@ -11,58 +11,54 @@ export default {
|
|||
component: RouterView,
|
||||
redirect: { name: 'ZoneMain' },
|
||||
menus: {
|
||||
main: [
|
||||
/*'ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'*/
|
||||
],
|
||||
card: [
|
||||
//
|
||||
],
|
||||
main: ['ZoneList', 'ZoneDeliveryList', 'ZoneUpcomingList'],
|
||||
card: ['ZoneBasicData', 'ZoneHistory', 'ZoneLocations'],
|
||||
},
|
||||
children: [
|
||||
// {
|
||||
// path: '/zone',
|
||||
// name: 'ZoneMain',
|
||||
// component: () => import('src/pages/Zone/ZoneMain.vue'),
|
||||
// redirect: { name: 'ZoneList' },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'list',
|
||||
// name: 'ZoneList',
|
||||
// meta: {
|
||||
// title: 'zonesList',
|
||||
// icon: 'vn:zone',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneList.vue'),
|
||||
// },
|
||||
// {
|
||||
// path: 'create',
|
||||
// name: 'ZoneCreate',
|
||||
// meta: {
|
||||
// title: 'zoneCreate',
|
||||
// icon: 'create',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||
// },
|
||||
// {
|
||||
// path: ':id/edit',
|
||||
// name: 'ZoneEdit',
|
||||
// meta: {
|
||||
// title: 'zoneEdit',
|
||||
// icon: 'edit',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||
// },
|
||||
// {
|
||||
// path: 'counter',
|
||||
// name: 'ZoneCounter',
|
||||
// meta: {
|
||||
// title: 'zoneCounter',
|
||||
// icon: 'add_circle',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
path: '/zone',
|
||||
name: 'ZoneMain',
|
||||
component: () => import('src/pages/Zone/ZoneMain.vue'),
|
||||
redirect: { name: 'ZoneList' },
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: 'ZoneList',
|
||||
meta: {
|
||||
title: 'zonesList',
|
||||
icon: 'vn:zone',
|
||||
},
|
||||
component: () => import('src/pages/Zone/ZoneList.vue'),
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'ZoneCreate',
|
||||
meta: {
|
||||
title: 'zoneCreate',
|
||||
icon: 'create',
|
||||
},
|
||||
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||
},
|
||||
{
|
||||
path: ':id/edit',
|
||||
name: 'ZoneEdit',
|
||||
meta: {
|
||||
title: 'zoneEdit',
|
||||
icon: 'edit',
|
||||
},
|
||||
component: () => import('src/pages/Zone/ZoneCreate.vue'),
|
||||
},
|
||||
// {
|
||||
// path: 'counter',
|
||||
// name: 'ZoneCounter',
|
||||
// meta: {
|
||||
// title: 'zoneCounter',
|
||||
// icon: 'add_circle',
|
||||
// },
|
||||
// component: () => import('src/pages/Zone/ZoneCounter.vue'),
|
||||
// },
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'ZoneCard',
|
||||
path: ':id',
|
||||
|
@ -78,6 +74,34 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Zone/Card/ZoneSummary.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ZoneLocations',
|
||||
path: 'location',
|
||||
meta: {
|
||||
title: 'locations',
|
||||
icon: 'vn:greuge',
|
||||
},
|
||||
component: () => import('src/pages/Zone/Card/ZoneLocations.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ZoneBasicData',
|
||||
path: 'basic-data',
|
||||
meta: {
|
||||
title: 'basicData',
|
||||
icon: 'vn:settings',
|
||||
},
|
||||
component: () => import('src/pages/Zone/Card/ZoneBasicData.vue'),
|
||||
},
|
||||
{
|
||||
name: 'ZoneHistory',
|
||||
path: 'history',
|
||||
meta: {
|
||||
title: 'log',
|
||||
icon: 'history',
|
||||
},
|
||||
component: () => import('src/pages/Zone/Card/ZoneLog.vue'),
|
||||
},
|
||||
|
||||
// {
|
||||
// path: '/zone/delivery',
|
||||
// name: 'ZoneDeliveryMain',
|
||||
|
|
|
@ -18,6 +18,7 @@ import roadmap from 'src/router/modules/roadmap';
|
|||
import parking from 'src/router/modules/parking';
|
||||
import agency from 'src/router/modules/agency';
|
||||
import zone from 'src/router/modules/zone';
|
||||
import monitor from 'src/router/modules/monitor';
|
||||
|
||||
const routes = [
|
||||
{
|
||||
|
@ -65,6 +66,7 @@ const routes = [
|
|||
shelving,
|
||||
invoiceOut,
|
||||
invoiceIn,
|
||||
monitor,
|
||||
wagon,
|
||||
order,
|
||||
route,
|
||||
|
|
|
@ -15,6 +15,7 @@ export const useNavigationStore = defineStore('navigationStore', () => {
|
|||
'travel',
|
||||
'invoiceOut',
|
||||
'invoiceIn',
|
||||
'monitor',
|
||||
'supplier',
|
||||
'claim',
|
||||
'route',
|
||||
|
@ -31,7 +32,6 @@ export const useNavigationStore = defineStore('navigationStore', () => {
|
|||
for (const module of modules) {
|
||||
const moduleDef = routes.find((route) => toLowerCamel(route.name) === module);
|
||||
if (!moduleDef) continue;
|
||||
|
||||
const item = addMenuItem(module, moduleDef, modulesRoutes.value);
|
||||
if (!item) continue;
|
||||
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
const locationOptions = '[role="listbox"] > div.q-virtual-scroll__content > .q-item';
|
||||
describe('VnLocation', () => {
|
||||
const dialogInputs = '.q-dialog label input';
|
||||
describe('Create', () => {
|
||||
describe('Worker Create', () => {
|
||||
const inputLocation =
|
||||
'.q-form .q-card> :nth-child(3) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control';
|
||||
'.q-form .q-card > :nth-child(3) > .q-field > .q-field__inner > .q-field__control > .q-field__control-container';
|
||||
beforeEach(() => {
|
||||
cy.viewport(1280, 720);
|
||||
cy.login('developer');
|
||||
cy.visit('/#/worker/create');
|
||||
cy.visit('/#/worker/create', { timeout: 5000 });
|
||||
cy.waitForElement('.q-card');
|
||||
});
|
||||
it('Show all options', function () {
|
||||
|
@ -25,34 +25,35 @@ describe('VnLocation', () => {
|
|||
cy.get(inputLocation).clear();
|
||||
cy.get(inputLocation).type('ecuador');
|
||||
cy.get(locationOptions).should('have.length.at.least', 1);
|
||||
cy.get(`${locationOptions}:nth-child(1)`).click();
|
||||
cy.get(inputLocation + '> :nth-child(2) > .q-icon').click();
|
||||
cy.get(
|
||||
'.q-form .q-card > :nth-child(3) > .q-field > .q-field__inner > .q-field__control > :nth-child(3) > .q-icon'
|
||||
).click();
|
||||
});
|
||||
});
|
||||
describe('Fiscal-data', () => {
|
||||
beforeEach(() => {
|
||||
cy.viewport(1280, 720);
|
||||
cy.login('developer');
|
||||
cy.visit('/#/supplier/567/fiscal-data', { timeout: 2000 });
|
||||
cy.waitForElement('.q-card');
|
||||
cy.visit('/#/supplier/567/fiscal-data', { timeout: 7000 });
|
||||
cy.waitForElement('.q-form');
|
||||
});
|
||||
it('Create postCode', function () {
|
||||
cy.get(
|
||||
':nth-child(6) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(3) > .q-icon'
|
||||
':nth-child(6) > .q-field > .q-field__inner > .q-field__control > :nth-child(3) > .q-icon'
|
||||
).click();
|
||||
cy.get('.q-card > h1').should('have.text', 'New postcode');
|
||||
cy.get(dialogInputs).eq(0).clear('12');
|
||||
cy.get(dialogInputs).eq(0).type('1234453');
|
||||
cy.selectOption(
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(4) > :nth-child(2) > .q-field > .q-field__inner > .q-field__control ',
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(4) > .q-select > .q-field__inner > .q-field__control ',
|
||||
'Valencia'
|
||||
);
|
||||
cy.selectOption(
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(5) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control ',
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(5) > .q-select > .q-field__inner > .q-field__control ',
|
||||
'Province one'
|
||||
);
|
||||
cy.selectOption(
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(5) > :nth-child(2) > .q-field > .q-field__inner > .q-field__control ',
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(6) > .q-select > .q-field__inner > .q-field__control ',
|
||||
'España'
|
||||
);
|
||||
cy.get('.q-mt-lg > .q-btn--standard').click();
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('InvoiceInBasicData', () => {
|
||||
const selects = '.q-form .q-card>:nth-child(1) > :nth-child(1) > .q-field';
|
||||
const appendBtns = 'label button';
|
||||
const formInputs = '.q-form > .q-card input';
|
||||
const firstFormSelect = '.q-card > .vn-row:nth-child(1) > .q-select';
|
||||
const appendBtns = '.q-form label button';
|
||||
const dialogAppendBtns = '.q-dialog label button';
|
||||
const dialogInputs = '.q-dialog input';
|
||||
const dialogActionBtns = '.q-card__actions button';
|
||||
|
@ -12,15 +13,14 @@ describe('InvoiceInBasicData', () => {
|
|||
});
|
||||
|
||||
it('should edit the provideer and supplier ref', () => {
|
||||
cy.selectOption(selects, 'Bros');
|
||||
|
||||
cy.selectOption(firstFormSelect, 'Bros');
|
||||
cy.get('[title="Reset"]').click();
|
||||
cy.get(appendBtns).eq(0).click();
|
||||
cy.get('input').eq(2).type(4739);
|
||||
cy.get(formInputs).eq(1).type(4739);
|
||||
cy.saveCard();
|
||||
|
||||
cy.get(`${selects} input`).eq(0).invoke('val').should('eq', 'Plants nick');
|
||||
cy.get('input').eq(2).invoke('val').should('eq', '4739');
|
||||
cy.get(`${firstFormSelect} input`).invoke('val').should('eq', 'Plants nick');
|
||||
cy.get(formInputs).eq(1).invoke('val').should('eq', '4739');
|
||||
});
|
||||
|
||||
it('should edit the dms data', () => {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('InvoiceInDueDay', () => {
|
||||
const inputs = 'label input';
|
||||
const amountInput = 'tbody > tr:nth-child(1) td:nth-child(4)';
|
||||
const addBtn = '.q-page-sticky > div > .q-btn > .q-btn__content';
|
||||
|
||||
beforeEach(() => {
|
||||
|
@ -9,7 +9,7 @@ describe('InvoiceInDueDay', () => {
|
|||
});
|
||||
|
||||
it('should update the amount', () => {
|
||||
cy.get(inputs).eq(3).type(23);
|
||||
cy.get(amountInput).type('{selectall}{backspace}23');
|
||||
cy.saveCard();
|
||||
cy.get('.q-notification__message').should('have.text', 'Data saved');
|
||||
});
|
||||
|
|
|
@ -17,10 +17,7 @@ describe('InvoiceInIntrastat', () => {
|
|||
cy.saveCard();
|
||||
cy.visit(`/#/invoice-in/1/intrastat`);
|
||||
|
||||
cy.getValue(firstLineCode).should(
|
||||
'equal',
|
||||
'Plantas vivas: Esqueje/injerto, Vid'
|
||||
);
|
||||
cy.getValue(firstLineCode).should('equal', 'Plantas vivas: Esqueje/injerto, Vid');
|
||||
});
|
||||
|
||||
it('should add a new row', () => {
|
||||
|
@ -33,6 +30,6 @@ describe('InvoiceInIntrastat', () => {
|
|||
});
|
||||
|
||||
it('should remove the first line', () => {
|
||||
cy.removeRow(1);
|
||||
cy.removeRow(2);
|
||||
});
|
||||
});
|
||||
|
|
|
@ -29,7 +29,7 @@ describe('InvoiceInVat', () => {
|
|||
});
|
||||
|
||||
it('should remove the first line', () => {
|
||||
cy.removeRow(1);
|
||||
cy.removeRow(2);
|
||||
});
|
||||
|
||||
it('should throw an error if there are fields undefined', () => {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('Ticket descriptor', () => {
|
||||
const toCloneOpt = '.q-list > :nth-child(5)';
|
||||
const toCloneOpt = '[role="menu"] .q-list > :nth-child(5)';
|
||||
const warehouseValue = ':nth-child(1) > :nth-child(6) > .value > span';
|
||||
const summaryHeader = '.summaryHeader > div';
|
||||
|
||||
|
|
|
@ -0,0 +1,19 @@
|
|||
describe('WorkerList', () => {
|
||||
const workerId = 1109;
|
||||
const lockerCode = '201A';
|
||||
const input = '.q-card input';
|
||||
const firstOpt = '[role="listbox"] .q-item:nth-child(1)';
|
||||
beforeEach(() => {
|
||||
cy.viewport(1280, 720);
|
||||
cy.login('productionBoss');
|
||||
cy.visit(`/#/worker/${workerId}/locker`);
|
||||
});
|
||||
|
||||
it('should allocates a locker', () => {
|
||||
cy.get(input).click();
|
||||
cy.get(input).type(lockerCode);
|
||||
cy.get(firstOpt).click();
|
||||
cy.saveCard();
|
||||
cy.get(input).invoke('val').should('eq', lockerCode);
|
||||
});
|
||||
});
|
|
@ -1,62 +0,0 @@
|
|||
import { vi, describe, expect, it, beforeAll, afterEach, beforeEach } from 'vitest';
|
||||
import { createWrapper } from 'app/test/vitest/helper';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
// Probar a importar como plugin vue-router en archivo helper
|
||||
describe('VnSearchBar', () => {
|
||||
let vm;
|
||||
let wrapper;
|
||||
let pushSpy;
|
||||
|
||||
beforeAll(() => {
|
||||
wrapper = createWrapper(VnSearchbar, {
|
||||
propsData: {
|
||||
dataKey: 'CustomerList',
|
||||
label: 'Search customer',
|
||||
info: 'Info customer',
|
||||
},
|
||||
});
|
||||
vm = wrapper.vm;
|
||||
vm.router.currentRoute.value.matched = [
|
||||
{
|
||||
path: '/',
|
||||
},
|
||||
{
|
||||
path: '/customer',
|
||||
},
|
||||
{
|
||||
path: '/customer/:id',
|
||||
},
|
||||
{
|
||||
path: '/customer/:id/basic-data',
|
||||
},
|
||||
];
|
||||
|
||||
pushSpy = vi.spyOn(vm.router, 'push');
|
||||
vi.spyOn(vm.arrayData, 'applyFilter');
|
||||
});
|
||||
|
||||
beforeEach(() => (vm.store.data = [{ id: 1112, name: 'Trash' }]));
|
||||
afterEach(() => vi.clearAllMocks());
|
||||
|
||||
it('should be defined', async () => {
|
||||
expect(vm.searchText).toBeDefined();
|
||||
expect(vm.searchText).toEqual('');
|
||||
});
|
||||
|
||||
it('should redirect to list page if there are several results', async () => {
|
||||
vm.store.data.push({ id: 1, name: 'employee' });
|
||||
await vm.search();
|
||||
expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/list' });
|
||||
});
|
||||
|
||||
it('should redirect to list page if there is no results', async () => {
|
||||
vm.store.data.pop();
|
||||
await vm.search();
|
||||
expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/list' });
|
||||
});
|
||||
|
||||
it('should redirect to basic-data page if there is only one result', async () => {
|
||||
await vm.search();
|
||||
expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/1112/basic-data' });
|
||||
});
|
||||
});
|
|
@ -0,0 +1,52 @@
|
|||
import { vi, describe, expect, it, beforeEach, beforeAll } from 'vitest';
|
||||
import useRedirect from 'src/composables/useRedirect';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
vi.mock('vue-router');
|
||||
|
||||
describe('useRedirect', () => {
|
||||
useRouter.mockReturnValue({
|
||||
push: vi.fn(),
|
||||
currentRoute: {
|
||||
value: {
|
||||
matched: [
|
||||
{ path: '/' },
|
||||
{ path: '/customer' },
|
||||
{ path: '/customer/:id' },
|
||||
{ path: '/customer/:id/basic-data' },
|
||||
],
|
||||
},
|
||||
},
|
||||
});
|
||||
const data = [];
|
||||
let navigate;
|
||||
let spy;
|
||||
|
||||
beforeAll(() => {
|
||||
const { navigate: navigateFn } = useRedirect();
|
||||
navigate = navigateFn;
|
||||
spy = useRouter().push;
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
data.length = 0;
|
||||
spy.mockReset();
|
||||
});
|
||||
|
||||
it('should redirect to list page if there are several results', async () => {
|
||||
data.push({ id: 1, name: 'employee' }, { id: 2, name: 'boss' });
|
||||
navigate(data, {});
|
||||
expect(spy).toHaveBeenCalledWith({ path: '/customer/' });
|
||||
});
|
||||
|
||||
it('should redirect to list page if there is no results', async () => {
|
||||
navigate(data, {});
|
||||
expect(spy).toHaveBeenCalledWith({ path: '/customer/' });
|
||||
});
|
||||
|
||||
it('should redirect to basic-data page if there is only one result', async () => {
|
||||
data.push({ id: 1, name: 'employee' });
|
||||
navigate(data, {});
|
||||
expect(spy).toHaveBeenCalledWith({ path: '/customer/1/basic-data' });
|
||||
});
|
||||
});
|
Loading…
Reference in New Issue