- migliorata la grafica dell'aggiungi elemento.
This commit is contained in:
Surya Paolo
@@ -459,4 +459,43 @@ h1 {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.elementor-btn {
|
||||
border-radius: 12px;
|
||||
transition: all 0.2s ease;
|
||||
&:hover {
|
||||
background-color: rgba($primary, 0.1);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
&:active {
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
// Migliora il look delle espansioni
|
||||
.q-expansion-item {
|
||||
&__content {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Risposta mobile
|
||||
@media (max-width: 600px) {
|
||||
.elementor-btn {
|
||||
q-icon {
|
||||
size: 32px;
|
||||
}
|
||||
.text-caption {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my-stacked-btn .q-btn__label {
|
||||
white-space: normal;
|
||||
line-height: 1.4;
|
||||
font-size: 0.85em;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -31,11 +31,8 @@ import { useProducts } from '@src/store/Products';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CMyElemAdd',
|
||||
components: {
|
||||
},
|
||||
emits: [
|
||||
'AddedNewElem',
|
||||
],
|
||||
components: {},
|
||||
emits: ['AddedNewElem'],
|
||||
props: {
|
||||
myelem: {
|
||||
type: Object as PropType<IMyElem>,
|
||||
@@ -76,6 +73,16 @@ export default defineComponent({
|
||||
const catalogStore = useCatalogStore();
|
||||
const router = useRouter();
|
||||
|
||||
const sections = computed(() => [
|
||||
{ label: 'Principali', icon: 'fas fa-eye', items: shared_consts.TypesElem },
|
||||
{ label: 'Gestione', icon: 'fas fa-cog', items: shared_consts.TypesElemAdmin },
|
||||
{
|
||||
label: 'Avanzati',
|
||||
icon: 'fas fa-star',
|
||||
items: shared_consts.TypesElemAdminTools,
|
||||
},
|
||||
]);
|
||||
|
||||
const { setmeta, getsrcbyimg } = MixinMetaTags();
|
||||
const { setValDb, getValDb } = MixinBase();
|
||||
|
||||
@@ -107,7 +114,6 @@ export default defineComponent({
|
||||
|
||||
const selectedClasses = ref(<any>[]);
|
||||
|
||||
|
||||
async function addNewElem(elemsel: any, direz: number) {
|
||||
// Nascondi la visualizzazione di aggiunta (presumo sia una variabile reattiva)
|
||||
visuadd.value = false;
|
||||
@@ -148,7 +154,7 @@ export default defineComponent({
|
||||
let sectionId = '';
|
||||
let rowId = '';
|
||||
|
||||
console.log('sectionId', sectionId, 'rowId', rowId)
|
||||
console.log('sectionId', sectionId, 'rowId', rowId);
|
||||
|
||||
// Aggiungi un nuovo elemento alla sezione o riga usando il metodo preparato
|
||||
const newrec = await globalStore.prepareAddNewElem(
|
||||
@@ -157,7 +163,7 @@ export default defineComponent({
|
||||
t,
|
||||
myelem,
|
||||
props.myElemParent,
|
||||
newtype.value,
|
||||
newtype.value
|
||||
);
|
||||
|
||||
// Emitti l'evento per la selezione del nuovo elemento
|
||||
@@ -167,7 +173,6 @@ export default defineComponent({
|
||||
// emit('updateAll', newrec);
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
tools,
|
||||
shared_consts,
|
||||
@@ -191,6 +196,7 @@ export default defineComponent({
|
||||
Products,
|
||||
globalStore,
|
||||
myel,
|
||||
sections,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
@@ -1,107 +1,46 @@
|
||||
<template>
|
||||
<div>
|
||||
<q-card class="">
|
||||
<q-bar
|
||||
dense
|
||||
class="bg-primary text-white"
|
||||
>
|
||||
<q-card class="shadow-6 rounded-lg" style="overflow: hidden">
|
||||
<!-- Barra superiore -->
|
||||
<q-bar class="bg-primary text-white">
|
||||
Aggiungi Elemento:
|
||||
<q-space />
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
color="white"
|
||||
icon="close"
|
||||
v-close-popup
|
||||
></q-btn>
|
||||
<q-btn flat round icon="close" v-close-popup />
|
||||
</q-bar>
|
||||
|
||||
<div class="q-pa-md row justify-center">
|
||||
<div style="width: 100%; max-width: 600px">
|
||||
<q-list
|
||||
padding
|
||||
bordered
|
||||
class="rounded-borders"
|
||||
>
|
||||
<!-- Contenuto principale -->
|
||||
<div class="q-pa-sm row justify-center">
|
||||
<div style="width: 100%; max-width: 350px">
|
||||
<q-list padding bordered class="rounded-borders shadow-sm">
|
||||
<!-- Sezioni generate dinamicamente -->
|
||||
<q-expansion-item
|
||||
label="Principali"
|
||||
icon="fas fa-eye"
|
||||
dense
|
||||
dense-toggle
|
||||
v-for="(sec, i) in sections"
|
||||
:key="sec.label"
|
||||
:label="sec.label"
|
||||
:icon="sec.icon"
|
||||
:default-opened="i === 0"
|
||||
expand-separator
|
||||
default-opened
|
||||
header-class="text-subtitle1 text-weight-bold"
|
||||
>
|
||||
<div class="row q-pa-sm">
|
||||
<div class="row q-pa-xs" v-if="enableAdd">
|
||||
<div
|
||||
v-for="(rec, index) in shared_consts.TypesElem"
|
||||
:key="index"
|
||||
class="col-6 q-pa-xs"
|
||||
v-for="(rec, idx) in sec.items"
|
||||
:key="idx"
|
||||
class="col-6"
|
||||
>
|
||||
<q-btn
|
||||
v-if="enableAdd"
|
||||
flat
|
||||
no-caps
|
||||
stack
|
||||
class="elementor-btn full-width q-py-sm q-px-sm my-stacked-btn"
|
||||
:icon="rec.icon"
|
||||
:label="rec.label"
|
||||
color="primary"
|
||||
class="full-width uniform-button q-px-sm"
|
||||
text-color="primary"
|
||||
@click="
|
||||
newtype = rec.value;
|
||||
addNewElem(myel, direzadd);
|
||||
"
|
||||
>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
<q-expansion-item
|
||||
dense
|
||||
dense-toggle
|
||||
expand-separator
|
||||
label="Gestione"
|
||||
icon="fas fa-cog"
|
||||
>
|
||||
<div class="row q-pa-sm">
|
||||
<div
|
||||
v-for="(rec, index) in shared_consts.TypesElemAdmin"
|
||||
:key="index"
|
||||
class="col-6 q-pa-xs"
|
||||
>
|
||||
<q-btn
|
||||
v-if="enableAdd"
|
||||
:label="rec.label"
|
||||
color="primary"
|
||||
class="full-width uniform-button q-px-sm"
|
||||
@click="
|
||||
newtype = rec.value;
|
||||
addNewElem(myel, direzadd);
|
||||
"
|
||||
>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
<q-expansion-item
|
||||
dense
|
||||
dense-toggle
|
||||
expand-separator
|
||||
label="Avanzati"
|
||||
icon="fas fa-star"
|
||||
>
|
||||
<div class="row q-pa-sm">
|
||||
<div
|
||||
v-for="(rec, index) in shared_consts.TypesElemAdminTools"
|
||||
:key="index"
|
||||
class="col-6 q-pa-sm"
|
||||
>
|
||||
<q-btn
|
||||
v-if="enableAdd"
|
||||
:label="rec.label"
|
||||
color="primary"
|
||||
class="full-width uniform-button q-px-sm"
|
||||
@click="
|
||||
newtype = rec.value;
|
||||
addNewElem(myel, direzadd);
|
||||
"
|
||||
>
|
||||
</q-btn>
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-expansion-item>
|
||||
|
||||
Reference in New Issue
Block a user