refactor: no product on service work & select all search
This commit is contained in:
parent
446015a795
commit
f56c5591cc
2 changed files with 112 additions and 64 deletions
|
|
@ -81,38 +81,47 @@ const showOverlay = ref(false);
|
|||
@mouseleave="showOverlay = false"
|
||||
@click.stop="$emit('view')"
|
||||
>
|
||||
<q-img id="profile-view" v-if="img" :src="img" :ratio="1">
|
||||
<template #error>
|
||||
<q-img
|
||||
v-if="fallbackImg"
|
||||
:src="fallbackImg"
|
||||
:ratio="1"
|
||||
style="background-color: transparent"
|
||||
>
|
||||
<template #error>
|
||||
<div
|
||||
class="full-width full-height flex items-center justify-center"
|
||||
:style="{
|
||||
background: `${bgColor || 'var(--brand-1)'}`,
|
||||
color: `${color || 'white'}`,
|
||||
}"
|
||||
>
|
||||
<q-icon :name="icon || 'mdi-account'" />
|
||||
</div>
|
||||
</template>
|
||||
</q-img>
|
||||
<div
|
||||
v-else
|
||||
class="full-width full-height flex items-center justify-center"
|
||||
:style="{
|
||||
background: `${bgColor || 'var(--brand-1)'}`,
|
||||
color: `${color || 'white'}`,
|
||||
}"
|
||||
>
|
||||
<q-icon :name="icon || 'mdi-account'" />
|
||||
</div>
|
||||
</template>
|
||||
</q-img>
|
||||
<div
|
||||
v-if="img"
|
||||
class="full-width full-height"
|
||||
:style="{
|
||||
background: `${bgColor || 'var(--brand-1)'}`,
|
||||
color: `${color || 'white'}`,
|
||||
}"
|
||||
>
|
||||
<q-img id="profile-view" :src="img" :ratio="1">
|
||||
<template #error>
|
||||
<q-img
|
||||
v-if="fallbackImg"
|
||||
:src="fallbackImg"
|
||||
:ratio="1"
|
||||
style="background-color: transparent"
|
||||
>
|
||||
<template #error>
|
||||
<div
|
||||
class="full-width full-height flex items-center justify-center"
|
||||
:style="{
|
||||
background: `${bgColor || 'var(--brand-1)'}`,
|
||||
color: `${color || 'white'}`,
|
||||
}"
|
||||
>
|
||||
<q-icon :name="icon || 'mdi-account'" />
|
||||
</div>
|
||||
</template>
|
||||
</q-img>
|
||||
<div
|
||||
v-else
|
||||
class="full-width full-height flex items-center justify-center"
|
||||
:style="{
|
||||
background: `${bgColor || 'var(--brand-1)'}`,
|
||||
color: `${color || 'white'}`,
|
||||
}"
|
||||
>
|
||||
<q-icon :name="icon || 'mdi-account'" />
|
||||
</div>
|
||||
</template>
|
||||
</q-img>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="full-width full-height flex items-center justify-center"
|
||||
|
|
|
|||
|
|
@ -497,6 +497,24 @@ async function searchProduct(isAdd: boolean = true) {
|
|||
flowStore.rotate();
|
||||
}
|
||||
|
||||
function selectAllProduct(list: ProductList[]) {
|
||||
list
|
||||
?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.forEach((i) => {
|
||||
const productExists = selectProduct.value.some(
|
||||
(product) => product.id === i.id,
|
||||
);
|
||||
if (!productExists) {
|
||||
selectProduct.value.push({ ...i });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function fetchListOfOptionBranch() {
|
||||
const uid = getUserId();
|
||||
const role = getRole();
|
||||
|
|
@ -3799,47 +3817,61 @@ watch(
|
|||
}
|
||||
"
|
||||
>
|
||||
<div class="full-width q-pa-lg">
|
||||
<div class="row items-center justify-between q-mb-md">
|
||||
<div
|
||||
class="full-width q-pa-lg column"
|
||||
:class="
|
||||
resultSearchProduct?.length === 0 || productIsAdd?.length === 0
|
||||
? 'full-height no-wrap'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="row items-center justify-between q-mb-md"
|
||||
v-if="productIsAdd?.length !== 0"
|
||||
>
|
||||
<q-checkbox
|
||||
:label="$t('selectAll')"
|
||||
:model-value="
|
||||
selectProduct.length ===
|
||||
productIsAdd?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).length
|
||||
"
|
||||
@click="
|
||||
() => {
|
||||
if (
|
||||
selectProduct.length ===
|
||||
!!inputSearchProductAndService
|
||||
? selectProduct.length ===
|
||||
resultSearchProduct?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).length
|
||||
: selectProduct.length ===
|
||||
productIsAdd?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).length
|
||||
"
|
||||
@click="
|
||||
() => {
|
||||
if (
|
||||
!!inputSearchProductAndService
|
||||
? selectProduct.length ===
|
||||
resultSearchProduct?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).length
|
||||
: selectProduct.length ===
|
||||
productIsAdd?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}).length
|
||||
) {
|
||||
selectProduct = [];
|
||||
} else {
|
||||
productIsAdd
|
||||
?.filter((i) => {
|
||||
if (i.status === 'INACTIVE') {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.forEach((i) => {
|
||||
const productExists = selectProduct.some(
|
||||
(product) => product.id === i.id,
|
||||
);
|
||||
if (!productExists) {
|
||||
selectProduct.push({ ...i });
|
||||
}
|
||||
});
|
||||
!!inputSearchProductAndService
|
||||
? resultSearchProduct && selectAllProduct(resultSearchProduct)
|
||||
: productIsAdd && selectAllProduct(productIsAdd);
|
||||
}
|
||||
}
|
||||
"
|
||||
|
|
@ -3863,10 +3895,17 @@ watch(
|
|||
</div>
|
||||
|
||||
<div
|
||||
class="flex col justify-center items-center"
|
||||
v-if="resultSearchProduct?.length === 0"
|
||||
class="flex col justify-center items-center col"
|
||||
v-if="resultSearchProduct?.length === 0 || productIsAdd?.length === 0"
|
||||
>
|
||||
<NoData notFound />
|
||||
<NoData
|
||||
:notFound="resultSearchProduct?.length === 0"
|
||||
:text="
|
||||
productIsAdd?.length === 0
|
||||
? $t('productService.product.noProduct')
|
||||
: ''
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div v-else class="row q-col-gutter-md">
|
||||
<div
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue