- caaloghi, categorie
This commit is contained in:
Surya Paolo
@@ -4,14 +4,14 @@ $heightBtn: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.container{
|
||||
.container {
|
||||
margin-top: 4px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.prod_trov{
|
||||
.prod_trov {
|
||||
font-style: italic;
|
||||
color: blue;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.fixed-group {
|
||||
@@ -19,7 +19,36 @@ $heightBtn: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: #ffffff; /* Customize the background color as needed */
|
||||
z-index: 1000; /* Adjust the z-index to ensure it's above other elements */
|
||||
background-color: #ffffff;
|
||||
/* Customize the background color as needed */
|
||||
z-index: 1000;
|
||||
/* Adjust the z-index to ensure it's above other elements */
|
||||
transition: all 1s ease;
|
||||
}
|
||||
|
||||
|
||||
// Underline like a href
|
||||
.category {
|
||||
color: darkblue;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 19px;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.category_sel {
|
||||
color: white !important;
|
||||
background: #5c8ef4 !important;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.category-title{
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
color: black;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
@@ -28,7 +28,7 @@ export default defineComponent({
|
||||
const { t } = useI18n()
|
||||
|
||||
const search = ref('')
|
||||
|
||||
|
||||
const filter = ref(<any>{
|
||||
author: '',
|
||||
publisher: '',
|
||||
@@ -121,12 +121,12 @@ export default defineComponent({
|
||||
|
||||
// Use a regular expression to match whole words
|
||||
let codeMatch = new RegExp(`\\b${lowerSearchText}\\b`, 'i');
|
||||
let nameMatch = new RegExp(`\\b${lowerSearchText}`, 'i');
|
||||
let nameMatch = new RegExp(`\\b(?=.*\\b${lowerSearchText.split(/\s+/).map(word => `(${word})\\b`).join('.*\\b')}\\b)`, 'i');
|
||||
|
||||
// Check if any word in lowerName starts with lowerSearchText
|
||||
let anyWordStartsWithSearch = lowerName.split(/\s+/).some(word => nameMatch.test(word));
|
||||
// Check if all words in lowerSearchText are present in lowerName
|
||||
let allWordsPresent = lowerSearchText.split(/\s+/).every(word => new RegExp(`\\b${word}\\b`, 'i').test(lowerName));
|
||||
|
||||
return (codeMatch.test(product.productInfo.code!) || anyWordStartsWithSearch) && hasCategoria && productgassel;
|
||||
return (codeMatch.test(product.productInfo.code!) || allWordsPresent) && hasCategoria && productgassel;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -4,51 +4,7 @@
|
||||
<q-spinner v-if="!loadpage" color="primary" size="3em" :thickness="2" />
|
||||
</div>
|
||||
<div v-if="loadpage" class="panel">
|
||||
<div v-if="true">
|
||||
<!--<CSelectUserActive></CSelectUserActive>-->
|
||||
<!-- <div class="text-center text-h7 text-blue">Filtra Prodotti per:</div>
|
||||
<div class="text-center">
|
||||
<q-btn-toggle
|
||||
v-model="cosa"
|
||||
push
|
||||
:size="tools.isMobile() ? '0.75rem' : '1rem'"
|
||||
rounded
|
||||
glossy
|
||||
toggle-color="primary"
|
||||
:options="[
|
||||
{ value: shared_consts.PROD.GAS, slot: 'gas' },
|
||||
{ value: shared_consts.PROD.BOTTEGA, slot: 'bottega' },
|
||||
]"
|
||||
>
|
||||
<template v-slot:tutti>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="text-center">
|
||||
{{ t('ecomm.tutti') }}
|
||||
</div>
|
||||
<q-icon right name="fas fa-check-square" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:gas>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="text-center">
|
||||
{{ t('gas.ordina_sul_gas') }}
|
||||
</div>
|
||||
<q-icon right name="fas fa-user-friends" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:bottega>
|
||||
<div class="row items-center no-wrap">
|
||||
<div class="text-center">
|
||||
{{ t('gas.bottega') }}
|
||||
</div>
|
||||
<q-icon right name="fas fa-store" />
|
||||
</div>
|
||||
</template>
|
||||
</q-btn-toggle>
|
||||
</div> -->
|
||||
</div>
|
||||
<div v-if="true"></div>
|
||||
|
||||
<div class="container">
|
||||
<q-slide-transition>
|
||||
@@ -163,9 +119,19 @@
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="row q-gutter-xs justify-center q-mx-auto">
|
||||
<div class="category-title">Categorie</div>
|
||||
<div class="row q-gutter-xs justify-center q-mx-auto bg-blue-1">
|
||||
<div v-for="(reccat, index) in getCatProds()" :key="index">
|
||||
<q-btn
|
||||
<span
|
||||
:class="{
|
||||
category: true,
|
||||
category_sel: cat === reccat.value,
|
||||
}"
|
||||
@click="cat = reccat.value"
|
||||
>{{ reccat.label }}
|
||||
</span>
|
||||
|
|
||||
<!--<q-btn
|
||||
:push="cat === reccat.value"
|
||||
dense
|
||||
:size="tools.isMobile() ? '0.70rem' : '1rem'"
|
||||
@@ -176,7 +142,7 @@
|
||||
:label="reccat.label"
|
||||
@click="cat = reccat.value"
|
||||
>
|
||||
</q-btn>
|
||||
</q-btn>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center q-py-sm prod_trov">
|
||||
@@ -264,6 +230,13 @@
|
||||
:id="product._id"
|
||||
:complete="false"
|
||||
:cosa="cosa"
|
||||
:options="{
|
||||
show_short_descr: false,
|
||||
show_price: false,
|
||||
show_cat: false,
|
||||
quante_col: 'c2',
|
||||
in_3d: false,
|
||||
}"
|
||||
/>
|
||||
<CProductCard
|
||||
v-else-if="product.active || show_hide"
|
||||
|
||||
@@ -3,7 +3,18 @@
|
||||
<div class="panel">
|
||||
<div class="container">
|
||||
<div class="row justify-center">
|
||||
<CCatalogoCard :id="id" :cosa="cosa" :complete="true"/>
|
||||
<CCatalogoCard
|
||||
:id="id"
|
||||
:cosa="cosa"
|
||||
:complete="true"
|
||||
:options="{
|
||||
show_short_descr: true,
|
||||
show_price: true,
|
||||
show_cat: true,
|
||||
quante_col: 'c1',
|
||||
in_3d: true,
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -11,7 +22,6 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./catalogoInfo.ts">
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
Reference in New Issue
Block a user