forked from verdnatura/salix-front
fix: refs #7717 fix order sections
This commit is contained in:
parent
3dc2ac8bac
commit
3f76b5496a
|
@ -28,7 +28,7 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
|
|||
delete params.filter;
|
||||
store.userParams = { ...params, ...store.userParams };
|
||||
store.userFilter = { ...filter, ...store.userFilter };
|
||||
if (filter.order) store.order = filter.order;
|
||||
if (filter?.order) store.order = filter.order;
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import axios from 'axios';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
import CatalogItem from 'components/ui/CatalogItem.vue';
|
||||
|
@ -9,10 +10,15 @@ import OrderCatalogFilter from 'pages/Order/Card/OrderCatalogFilter.vue';
|
|||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const tags = ref([]);
|
||||
|
||||
onMounted(() => (stateStore.rightDrawer = true));
|
||||
onMounted(() => {
|
||||
stateStore.rightDrawer = true;
|
||||
checkOrderConfirmation();
|
||||
});
|
||||
onUnmounted(() => (stateStore.rightDrawer = false));
|
||||
|
||||
const catalogParams = {
|
||||
|
@ -20,7 +26,12 @@ const catalogParams = {
|
|||
orderBy: JSON.stringify({ field: 'relevancy DESC, name', way: 'ASC', isTag: false }),
|
||||
};
|
||||
|
||||
const tags = ref([]);
|
||||
async function checkOrderConfirmation() {
|
||||
const response = await axios.get(`Orders/${route.params.id}`);
|
||||
if (response.data.isConfirmed === 1) {
|
||||
router.push(`/order/${route.params.id}/line`);
|
||||
}
|
||||
}
|
||||
|
||||
function extractTags(items) {
|
||||
const resultTags = [];
|
||||
|
@ -60,7 +71,7 @@ function extractValueTags(items) {
|
|||
:redirect="false"
|
||||
url="Orders/CatalogFilter"
|
||||
:label="t('Search items')"
|
||||
:info="t('You can search orders by reference')"
|
||||
:info="t('You can search items by name or id')"
|
||||
/>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
|
@ -78,7 +89,6 @@ function extractValueTags(items) {
|
|||
url="Orders/CatalogFilter"
|
||||
:limit="50"
|
||||
:user-params="catalogParams"
|
||||
auto-load
|
||||
@on-fetch="extractTags"
|
||||
:update-router="false"
|
||||
>
|
||||
|
@ -116,3 +126,8 @@ function extractValueTags(items) {
|
|||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
You can search items by name or id: Puedes buscar items por nombre o id
|
||||
</i18n>
|
||||
|
|
|
@ -102,7 +102,8 @@ function exprBuilder(param, value) {
|
|||
case 'typeFk':
|
||||
return { [param]: value };
|
||||
case 'search':
|
||||
return { 'i.name': { like: `%${value}%` } };
|
||||
if (/^\d+$/.test(value)) return { 'i.id': value };
|
||||
else return { 'i.name': { like: `%${value}%` } };
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -5,10 +5,12 @@ import { useI18n } from 'vue-i18n';
|
|||
import axios from 'axios';
|
||||
import { useRoute } from 'vue-router';
|
||||
import useNotify from 'composables/useNotify';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const { notify } = useNotify();
|
||||
const emit = defineEmits(['added']);
|
||||
const route = useRoute();
|
||||
const props = defineProps({
|
||||
prices: {
|
||||
type: Array,
|
||||
|
@ -16,9 +18,8 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['added']);
|
||||
|
||||
const fields = ref((props.prices || []).map((item) => ({ ...item, quantity: 0 })));
|
||||
const descriptorData = useArrayData('orderData');
|
||||
|
||||
const addToOrder = async () => {
|
||||
const items = (fields.value || []).filter((item) => Number(item.quantity) > 0);
|
||||
|
@ -28,19 +29,20 @@ const addToOrder = async () => {
|
|||
});
|
||||
notify(t('globals.dataSaved'), 'positive');
|
||||
emit('added');
|
||||
descriptorData.fetch({});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="container order-catalog-item q-pb-md">
|
||||
<div class="container order-catalog-item q-pa-md">
|
||||
<QForm @submit="addToOrder">
|
||||
<QMarkupTable class="shadow-0">
|
||||
<tbody>
|
||||
<tr v-for="item in fields" :key="item.warehouse">
|
||||
<td class="text-bold q-py-lg">
|
||||
<td class="text-bold q-pr-md td" style="width: 35%">
|
||||
{{ item.warehouse }}
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<td class="text-right" style="width: 35%">
|
||||
<span
|
||||
class="link"
|
||||
@click="
|
||||
|
@ -75,8 +77,11 @@ const addToOrder = async () => {
|
|||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
max-width: 448px;
|
||||
width: 100%;
|
||||
// .container {
|
||||
// max-width: 768px;
|
||||
// width: 100%;
|
||||
// }
|
||||
.td {
|
||||
width: 200px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -4,13 +4,13 @@ import { useRoute } from 'vue-router';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import { toCurrency, toDate } from 'src/filters';
|
||||
import { useState } from 'src/composables/useState';
|
||||
|
||||
import useCardDescription from 'src/composables/useCardDescription';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
import CardDescriptor from 'components/ui/CardDescriptor.vue';
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import OrderDescriptorMenu from 'pages/Order/Card/OrderDescriptorMenu.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import OrderDescriptorMenu from 'pages/Order/Card/OrderDescriptorMenu.vue';
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
const DEFAULT_ITEMS = 0;
|
||||
|
||||
|
@ -25,6 +25,8 @@ const $props = defineProps({
|
|||
const route = useRoute();
|
||||
const state = useState();
|
||||
const { t } = useI18n();
|
||||
const data = ref(useCardDescription());
|
||||
const getTotalRef = ref();
|
||||
|
||||
const entityId = computed(() => {
|
||||
return $props.id || route.params.id;
|
||||
|
@ -57,11 +59,11 @@ const filter = {
|
|||
],
|
||||
};
|
||||
|
||||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => {
|
||||
if (!entity) return;
|
||||
getTotalRef.value && getTotalRef.value.fetch();
|
||||
data.value = useCardDescription(entity?.client?.name, entity?.id);
|
||||
state.set('OrderDescriptor', entity);
|
||||
state.set('orderData', entity);
|
||||
};
|
||||
|
||||
const getConfirmationValue = (isConfirmed) => {
|
||||
|
@ -69,10 +71,15 @@ const getConfirmationValue = (isConfirmed) => {
|
|||
};
|
||||
|
||||
const total = ref(null);
|
||||
|
||||
function ticketFilter(order) {
|
||||
return JSON.stringify({ id: order.id });
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
ref="getTotalRef"
|
||||
:url="`Orders/${entityId}/getTotal`"
|
||||
@on-fetch="(response) => (total = response)"
|
||||
auto-load
|
||||
|
@ -120,7 +127,7 @@ const total = ref(null);
|
|||
color="primary"
|
||||
:to="{
|
||||
name: 'TicketList',
|
||||
query: { params: JSON.stringify({ orderFk: entity.id }) },
|
||||
query: { table: ticketFilter(entity) },
|
||||
}"
|
||||
>
|
||||
<QTooltip>{{ t('order.summary.orderTicketList') }}</QTooltip>
|
||||
|
|
|
@ -64,11 +64,14 @@ const fetchOrderDetails = (order) => {
|
|||
};
|
||||
|
||||
const orderMapper = (order) => {
|
||||
return {
|
||||
const mappedOrder = {
|
||||
addressId: order.addressFk,
|
||||
agencyModeId: order.agencyModeFk,
|
||||
landed: new Date(order.landed).toISOString(),
|
||||
};
|
||||
if (order.agencyModeFk !== null && order.agencyModeFk !== undefined) {
|
||||
mappedOrder.agencyModeId = order.agencyModeFk;
|
||||
}
|
||||
return mappedOrder;
|
||||
};
|
||||
const orderFilter = {
|
||||
include: [
|
||||
|
@ -184,7 +187,19 @@ const onClientChange = async (clientId) => {
|
|||
option-value="agencyModeFk"
|
||||
option-label="agencyMode"
|
||||
hide-selected
|
||||
:disable="!agencyList?.length"
|
||||
:disable="!agencyList?.length && data.isConfirmed === 1"
|
||||
clearable
|
||||
emit-value
|
||||
map-options
|
||||
:model-value="
|
||||
!data.isConfirmed &&
|
||||
agencyList?.length &&
|
||||
agencyList.some(
|
||||
(agency) => agency.agencyModeFk === data.agency_id
|
||||
)
|
||||
? data.agencyModeFk
|
||||
: null
|
||||
"
|
||||
>
|
||||
</VnSelect>
|
||||
</VnRow>
|
||||
|
|
|
@ -61,6 +61,13 @@ const lineFilter = ref({
|
|||
fields: ['id', 'name'],
|
||||
},
|
||||
},
|
||||
{
|
||||
relation: 'order',
|
||||
scope: {
|
||||
fields: ['id', 'isConfirmed'],
|
||||
where: { id: route.params.id },
|
||||
},
|
||||
},
|
||||
],
|
||||
where: { orderFk: route.params.id },
|
||||
});
|
||||
|
@ -157,8 +164,9 @@ const columns = computed(() => [
|
|||
name: 'tableActions',
|
||||
actions: [
|
||||
{
|
||||
title: t('delete'),
|
||||
title: t('Delete'),
|
||||
icon: 'delete',
|
||||
show: (row) => !row.order.isConfirmed,
|
||||
action: (row) => confirmRemove(row),
|
||||
isPrimary: true,
|
||||
},
|
||||
|
@ -281,6 +289,15 @@ watch(
|
|||
<template #column-amount="{ row }">
|
||||
{{ toCurrency(row.quantity * row.price) }}
|
||||
</template>
|
||||
<template #column-tableActions="{ row }">
|
||||
<QIcon
|
||||
v-if="row.order?.isConfirmed === 0"
|
||||
name="delete"
|
||||
icon="delete"
|
||||
@click="confirmRemove(row)"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
</VnTable>
|
||||
</div>
|
||||
<QPageSticky :offset="[20, 20]" v-if="!order?.isConfirmed" style="z-index: 2">
|
||||
|
|
|
@ -10,14 +10,16 @@ import FetchData from 'components/FetchData.vue';
|
|||
import VnLv from 'components/ui/VnLv.vue';
|
||||
import CardList from 'components/ui/CardList.vue';
|
||||
import FetchedTags from 'components/ui/FetchedTags.vue';
|
||||
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { dashIfEmpty } from 'src/filters';
|
||||
import { onMounted } from 'vue';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
const volumeSummary = ref(null);
|
||||
const volumeRef = ref();
|
||||
const stateStore = useStateStore();
|
||||
const volumeFilter = ref({
|
||||
include: [
|
||||
{
|
||||
|
@ -46,6 +48,7 @@ watch(
|
|||
volumeRef.value.fetch();
|
||||
}
|
||||
);
|
||||
onMounted(() => (stateStore.rightDrawer = false));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -63,9 +66,6 @@ watch(
|
|||
{{ t('globals.noResults') }}
|
||||
</div>
|
||||
<QCard v-else class="order-volume-summary q-pa-lg">
|
||||
<p class="header text-right block">
|
||||
{{ t('summary') }}
|
||||
</p>
|
||||
<VnLv :label="t('total')" :value="`${volumeSummary?.totalVolume} m³`" />
|
||||
<VnLv
|
||||
:label="t('boxes')"
|
||||
|
|
Loading…
Reference in New Issue