Add resetForms, refactoring Errors
This commit is contained in:
parent
decc83b4c2
commit
9aea7f3bc5
@ -28,18 +28,19 @@ const productQuantity = ref(0);
|
|||||||
const productAlert = ref(false);
|
const productAlert = ref(false);
|
||||||
const productStockLimit = ref(null);
|
const productStockLimit = ref(null);
|
||||||
const base64Image = ref(null);
|
const base64Image = ref(null);
|
||||||
const registerErrors = ref({name:'',description:'',quantity:'',alert_enabled:'',stock_limit:'',image:'',warehouses:''});
|
|
||||||
const modifyErrors = ref({name:'',description:'',quantity:'',alert_enabled:'',stock_limit:'',image:'',warehouses:''});
|
|
||||||
const editingRows = ref([]);
|
|
||||||
const selectedWarehouses = ref([]);
|
const selectedWarehouses = ref([]);
|
||||||
|
|
||||||
|
const registerErrors = ref({});
|
||||||
|
const modifyErrors = ref({});
|
||||||
|
const editingRows = ref([]);
|
||||||
const warehouses = ref([]);
|
const warehouses = ref([]);
|
||||||
|
|
||||||
async function create_product() {
|
async function create_product() {
|
||||||
registerErrors.value = {name:'',description:'',quantity:'',alert_enabled:'',stock_limit:'',warehouses:''};
|
|
||||||
if (productAlert.value && !productStockLimit.value) {
|
if (productAlert.value && !productStockLimit.value) {
|
||||||
registerErrors.value.stock_limit = 'Veuillez renseigner une limite de stock.';
|
registerErrors.value.stock_limit = 'Veuillez renseigner une limite de stock.';
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
registerErrors.value = {};
|
||||||
try {
|
try {
|
||||||
await createProduct({
|
await createProduct({
|
||||||
name: productName.value,
|
name: productName.value,
|
||||||
@ -53,6 +54,7 @@ async function create_product() {
|
|||||||
warehouses.value = await getWarehouses();
|
warehouses.value = await getWarehouses();
|
||||||
products.value = await getProducts();
|
products.value = await getProducts();
|
||||||
products.value = enrichProducts();
|
products.value = enrichProducts();
|
||||||
|
resetForms();
|
||||||
toast.add({ severity: 'success', life: 2500, summary:`${productName.value} crée`});
|
toast.add({ severity: 'success', life: 2500, summary:`${productName.value} crée`});
|
||||||
} catch (error){
|
} catch (error){
|
||||||
if (error.response && error.response.data) {
|
if (error.response && error.response.data) {
|
||||||
@ -60,34 +62,32 @@ async function create_product() {
|
|||||||
if (data.detail) {
|
if (data.detail) {
|
||||||
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: data.detail });
|
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: data.detail });
|
||||||
}
|
}
|
||||||
if (data.name) {
|
registerErrors.value = {
|
||||||
registerErrors.value.name = data.name[0];
|
name: data.name ? data.name[0] : "",
|
||||||
}
|
description: data.description ? data.description[0]: "",
|
||||||
if (data.description) {
|
quantity: data.quantity ? data.quantity[0] : "",
|
||||||
registerErrors.value.description = data.description[0];
|
alert_enabled: data.alert_enabled ? data.alert_enabled[0] : "",
|
||||||
}
|
stock_limit: data.stock_limit ? data.stock_limit[0] : "",
|
||||||
if (data.quantity) {
|
image: data.image ? data.image[0] : "",
|
||||||
registerErrors.value.quantity = data.quantity[0];
|
warehouses: data.warehouses ? data.warehouses[0] : "",
|
||||||
}
|
|
||||||
if (data.alert_enabled) {
|
|
||||||
registerErrors.value.alert_enabled = data.alert_enabled[0];
|
|
||||||
}
|
|
||||||
if (data.stock_limit) {
|
|
||||||
registerErrors.value.stock_limit = data.stock_limit[0];
|
|
||||||
}
|
|
||||||
if (data.image) {
|
|
||||||
registerErrors.value.image = data.image[0];
|
|
||||||
}
|
|
||||||
if (data.warehouses) {
|
|
||||||
registerErrors.value.warehouses = data.warehouses[0];
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: 'Une erreur est survenue.' });
|
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: 'Une erreur est survenue.' });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function resetForms() {
|
||||||
|
productName.value = '';
|
||||||
|
productDescription.value = '';
|
||||||
|
productQuantity.value = 0;
|
||||||
|
productAlert.value = false;
|
||||||
|
productStockLimit.value = null;
|
||||||
|
base64Image.value = null;
|
||||||
|
selectedWarehouses.value = [];
|
||||||
|
};
|
||||||
|
|
||||||
async function onRowEditSave(event) {
|
async function onRowEditSave(event) {
|
||||||
modifyErrors.value = { name: '', description: '', quantity: '', alert_enabled: '', stock_limit: '', image: '', warehouses: '' };
|
|
||||||
if (event && event.data) {
|
if (event && event.data) {
|
||||||
let {newData, index} = event;
|
let {newData, index} = event;
|
||||||
products.value[index] = newData;
|
products.value[index] = newData;
|
||||||
@ -97,6 +97,7 @@ async function onRowEditSave(event) {
|
|||||||
toast.add({ severity: 'error', life: 2500, summary: 'Error', detail: 'Aucune donnée n\'a été modifiée.' });
|
toast.add({ severity: 'error', life: 2500, summary: 'Error', detail: 'Aucune donnée n\'a été modifiée.' });
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
modifyErrors.value[newData.id] = {};
|
||||||
try {
|
try {
|
||||||
await modifyProduct({
|
await modifyProduct({
|
||||||
id: newData.id,
|
id: newData.id,
|
||||||
@ -116,27 +117,15 @@ async function onRowEditSave(event) {
|
|||||||
if (data.detail) {
|
if (data.detail) {
|
||||||
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: data.detail });
|
toast.add({ severity: 'error',life: 2500, summary: 'Erreur', detail: data.detail });
|
||||||
}
|
}
|
||||||
if (data.name) {
|
modifyErrors.value[newData.id] = {
|
||||||
modifyErrors.value.name = data.name[0];
|
name: data.name ? data.name[0] : "",
|
||||||
}
|
description: data.description ? data.description[0]: "",
|
||||||
if (data.description) {
|
quantity: data.quantity ? data.quantity[0] : "",
|
||||||
modifyErrors.value.description = data.description[0];
|
alert_enabled: data.alert_enabled ? data.alert_enabled[0] : "",
|
||||||
}
|
stock_limit: data.stock_limit ? data.stock_limit[0] : "",
|
||||||
if (data.quantity) {
|
image: data.image ? data.image[0] : "",
|
||||||
modifyErrors.value.quantity = data.quantity[0];
|
warehouses: data.warehouses ? data.warehouses[0] : "",
|
||||||
}
|
};
|
||||||
if (data.alert_enabled) {
|
|
||||||
modifyErrors.value.alert_enabled = data.alert_enabled[0];
|
|
||||||
}
|
|
||||||
if (data.stock_limit) {
|
|
||||||
modifyErrors.value.stock_limit = data.stock_limit[0];
|
|
||||||
}
|
|
||||||
if (data.image) {
|
|
||||||
modifyErrors.value.image = data.image[0];
|
|
||||||
}
|
|
||||||
if (data.warehouses) {
|
|
||||||
modifyErrors.value.warehouses = data.warehouses[0];
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
toast.add({ severity: 'error', life: 2500, summary: 'Erreur', detail: 'Une erreur est survenue.' });
|
toast.add({ severity: 'error', life: 2500, summary: 'Erreur', detail: 'Une erreur est survenue.' });
|
||||||
}
|
}
|
||||||
@ -341,6 +330,7 @@ try {
|
|||||||
optionLabel="name"
|
optionLabel="name"
|
||||||
placeholder="Sélectionner un entrepôt"
|
placeholder="Sélectionner un entrepôt"
|
||||||
display="chip"
|
display="chip"
|
||||||
|
:invalid="!!registerErrors.warehouses"
|
||||||
></MultiSelect>
|
></MultiSelect>
|
||||||
</InputGroup>
|
</InputGroup>
|
||||||
</div>
|
</div>
|
||||||
@ -418,8 +408,8 @@ try {
|
|||||||
|
|
||||||
<Column field="name" header="Name" editor="true" sortable>
|
<Column field="name" header="Name" editor="true" sortable>
|
||||||
<template #body="slotProps">
|
<template #body="slotProps">
|
||||||
<span v-if="!modifyErrors.name">{{ slotProps.data.name }}</span>
|
<span v-if="!modifyErrors[slotProps.data.id]?.name">{{ slotProps.data.name }}</span>
|
||||||
<p-message v-if="modifyErrors.name" severity="error">{{ modifyErrors.name }}</p-message>
|
<p-message v-if="modifyErrors[slotProps.data.id]?.name" severity="error">{{ modifyErrors[slotProps.data.id].name }}</p-message>
|
||||||
</template>
|
</template>
|
||||||
<template #editor="slotProps">
|
<template #editor="slotProps">
|
||||||
<InputText v-model="slotProps.data.name" fluid />
|
<InputText v-model="slotProps.data.name" fluid />
|
||||||
@ -428,10 +418,10 @@ try {
|
|||||||
|
|
||||||
<Column field="description" header="Description" editor="true">
|
<Column field="description" header="Description" editor="true">
|
||||||
<template #body="slotProps">
|
<template #body="slotProps">
|
||||||
<span v-if="!modifyErrors.description" :title="slotProps.data.description">
|
<span v-if="!modifyErrors[slotProps.data.id]?.description" :title="slotProps.data.description">
|
||||||
{{ truncate(slotProps.data.description, 50) }}
|
{{ truncate(slotProps.data.description, 50) }}
|
||||||
</span>
|
</span>
|
||||||
<p-message v-if="modifyErrors.description" severity="error">{{ modifyErrors.description }}</p-message>
|
<p-message v-if="modifyErrors[slotProps.data.id]?.description" severity="error">{{ modifyErrors[slotProps.data.id].description }}</p-message>
|
||||||
</template>
|
</template>
|
||||||
<template #editor="slotProps">
|
<template #editor="slotProps">
|
||||||
<InputText v-model="slotProps.data.description" fluid />
|
<InputText v-model="slotProps.data.description" fluid />
|
||||||
@ -440,11 +430,11 @@ try {
|
|||||||
|
|
||||||
<Column field="quantity" header="Quantity" editor="true" sortable>
|
<Column field="quantity" header="Quantity" editor="true" sortable>
|
||||||
<template #body="slotProps">
|
<template #body="slotProps">
|
||||||
<Badge v-if="!modifyErrors.quantity"
|
<Badge v-if="!modifyErrors[slotProps.data.id]?.quantity"
|
||||||
:value="slotProps.data.quantity"
|
:value="slotProps.data.quantity"
|
||||||
:severity="stockSeverity(slotProps.data)"
|
:severity="stockSeverity(slotProps.data)"
|
||||||
/>
|
/>
|
||||||
<p-message v-if="modifyErrors.quantity" severity="error">{{ modifyErrors.quantity }}</p-message>
|
<p-message v-if="modifyErrors[slotProps.data.id]?.quantity" severity="error">{{ modifyErrors[slotProps.data.id].quantity }}</p-message>
|
||||||
</template>
|
</template>
|
||||||
<template #editor="slotProps">
|
<template #editor="slotProps">
|
||||||
<InputNumber v-model="slotProps.data.quantity" fluid />
|
<InputNumber v-model="slotProps.data.quantity" fluid />
|
||||||
@ -452,10 +442,10 @@ try {
|
|||||||
</Column>
|
</Column>
|
||||||
<Column header="Entrepôt" editor="true" sortable>
|
<Column header="Entrepôt" editor="true" sortable>
|
||||||
<template #body="slotProps">
|
<template #body="slotProps">
|
||||||
<span v-if="!modifyErrors.warehouses" v-for="warehouse in slotProps.data.warehouses" :key="warehouse.id">
|
<span v-if="!modifyErrors[slotProps.data.id]?.warehouses" v-for="warehouse in slotProps.data.warehouses" :key="warehouse.id">
|
||||||
{{ warehouse.name }}({{ warehouse.actual_capacity }}/{{ warehouse.max_capacity }}),
|
{{ warehouse.name }}({{ warehouse.actual_capacity }}/{{ warehouse.max_capacity }}),
|
||||||
</span>
|
</span>
|
||||||
<p-message v-if="modifyErrors.warehouses" severity="error">{{ modifyErrors.warehouses }}</p-message>
|
<p-message v-if="modifyErrors[slotProps.data.id]?.warehouses" severity="error">{{ modifyErrors[slotProps.data.id].warehouses }}</p-message>
|
||||||
</template>
|
</template>
|
||||||
<template #editor="slotProps">
|
<template #editor="slotProps">
|
||||||
<MultiSelect
|
<MultiSelect
|
||||||
@ -463,7 +453,7 @@ try {
|
|||||||
:options="warehouses"
|
:options="warehouses"
|
||||||
optionLabel="name"
|
optionLabel="name"
|
||||||
placeholder="Sélectionner un entrepôt"
|
placeholder="Sélectionner un entrepôt"
|
||||||
|
:invalid="!!modifyErrors[slotProps.data.id]?.warehouses"
|
||||||
></MultiSelect>
|
></MultiSelect>
|
||||||
</template>
|
</template>
|
||||||
</Column>
|
</Column>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user