surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

++ Animation fixed in Home pic.

Browse Source 
++"Dark Mode"
This commit is contained in:
Surya Paolo
2022-11-23 23:57:21 +01:00
parent 46bf74e9e2
commit fab0dbbb72
17 changed files with 722 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/CMyEditElem/CMyEditElem.ts
View File

@@ -2,7 +2,7 @@ import {
defineComponent, onMounted, PropType, ref, toRef, watch,
} from 'vue'
import { IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
import { IElemText, IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
import { useGlobalStore } from '@store/globalStore'
import { CImgTitle } from '@/components/CImgTitle'
@@ -74,6 +74,7 @@ export default defineComponent({
const slide = ref(0)
const slide2 = ref(0)
const tabCard = ref('card0')
const tabElemsText = ref('elem0')
const arrPages = ref([] as any[])
const disableSave = ref(true)
const enableEdit = ref(true)
@@ -202,6 +203,14 @@ export default defineComponent({
modifElem()
}
function addNewElemText() {
if (!myel.value.elemsText)
myel.value.elemsText = []
myel.value.elemsText.push({ _id: objectId(), text: '', color: '#ffffff', class: '', size: '', anim: { name: 'FadeIn', clduration: '', cldelay: '', timingtype: 'ease-in-out'} })
modifElem()
}
function getClass() {
let mycl = ''
if (props.myelem.align === shared_consts.ALIGNTYPE.CEHTER) {
@@ -222,10 +231,15 @@ export default defineComponent({
return false
}
function delRecCard(idcard: string, myel: IMyElem) {
function delRecCard(id: string, myel: IMyElem) {
//
if (myel.listcards)
myel.listcards = myel.listcards.filter((card: IMyCard) => card._id !== idcard)
if (props.myelem.type === shared_consts.ELEMTYPE.CARD) {
if (myel.listcards)
myel.listcards = myel.listcards.filter((card: IMyCard) => card._id !== id)
} else if (props.myelem.type === shared_consts.ELEMTYPE.IMGPOSTER) {
if (myel.elemsText)
myel.elemsText = myel.elemsText.filter((rec: IElemText) => rec._id !== id)
}
}
@@ -238,6 +252,14 @@ export default defineComponent({
}
})
}
} else if (props.myelem.type === shared_consts.ELEMTYPE.IMGPOSTER) {
if (props.myelem.elemsText) {
props.myelem.elemsText.forEach((rec: IElemText) => {
if (recpass._id === rec._id) {
rec.text = myval
}
})
}
} else if ((props.myelem.type === shared_consts.ELEMTYPE.IMGTITLE) ||
(props.myelem.type === shared_consts.ELEMTYPE.IMAGE)) {
myel.value.image = myval
@@ -290,6 +312,7 @@ export default defineComponent({
dupElem,
enableEdit,
addNewCard,
addNewElemText,
arrPages,
costanti,
delRecCard,
@@ -297,6 +320,7 @@ export default defineComponent({
updateElem,
showAnimation,
tabCard,
tabElemsText,
}
},

151
src/components/CMyEditElem/CMyEditElem.vue
View File

@@ -471,7 +471,7 @@
table="myelems"
:id="myel._id"
:rec="myel"
field="container3"
field="img"
@update:model-value="modifElem"
:canEdit="true"
:canModify="true"
@@ -499,65 +499,100 @@
</q-input>
</div>
<q-input
label="Titolo"
class="fa-border"
@update:model-value="modifElem"
v-model="myel.container"
filled
v-on:keyup.enter="saveElem"
<q-btn
rounded
dense
color="primary"
label="Testo"
icon="fas fa-plus"
@click="addNewElemText"
>
</q-input>
<CSelectColor
style="min-width: 150px"
v-model="myel.color"
@update:model-value="modifElem"
title="Col Titolo"
</q-btn>
<q-tabs
v-model="tabElemsText"
dense
class="text-grey"
active-color="primary"
indicator-color="primary"
align="justify"
narrow-indicator
>
</CSelectColor>
<q-input
label="Sottotitolo"
class="fa-border"
@update:model-value="modifElem"
v-model="myel.container2"
filled
v-on:keyup.enter="saveElem"
>
</q-input>
<CSelectColor
style="min-width: 150px"
v-model="myel.colorsub"
@update:model-value="modifElem"
title="Col Sottotitolo"
>
</CSelectColor>
</div>
<CSelectAnimation
v-if="enableEdit && showAnimation"
v-model="myel.anim2"
@update:model-value="modifElem"
label="Animaz SottoTitolo"
>
</CSelectAnimation>
<div class="row">
<q-input
label="Classe Title"
class="fa-border"
@update:model-value="modifElem"
v-model="myel.class4"
filled
v-on:keyup.enter="saveElem"
>
</q-input>
<q-input
label="Classe SubTitle"
class="fa-border"
@update:model-value="modifElem"
v-model="myel.class3"
filled
v-on:keyup.enter="saveElem"
>
</q-input>
<q-tab
v-for="(rec, ind) in myel.elemsText"
:key="ind"
:name="`elem` + ind"
:label="`Testo ` + (ind + 1)"
icon="fas fa-pencil-alt"
/>
</q-tabs>
<q-tab-panels v-model="tabElemsText" animated>
<q-tab-panel
v-for="(rec, ind) in myel.elemsText"
:key="ind"
:name="`elem` + ind"
>
<div v-if="enableEdit" class="column bordered q-ma-xs">
<q-bar class="bg-primary text-white">
Elem {{ ind + 1 }}
<q-space />
<q-btn
icon="fas fa-trash-alt"
color="negative"
dense
flat
size="sm"
@click="delRecCard(rec._id, myel)"
>
</q-btn>
</q-bar>
<div v-if="enableEdit" class="row">
<CSelectColor
v-if="enableEdit"
style="min-width: 150px"
v-model="rec.color"
@update:model-value="modifElem"
title="Col Titolo"
>
</CSelectColor>
<CSelectFontSize
v-if="enableEdit"
style="min-width: 200px"
v-model="rec.size"
@update:model-value="modifElem"
title="Font Titolo"
>
</CSelectFontSize>
</div>
<q-input
label="Classe:"
@update:model-value="modifElem"
v-model="rec.class"
filled
v-on:keyup.enter="saveElem"
>
</q-input>
<CMyEditor
v-model:value="rec.text"
title="Contenuto:"
@keyup.enter.stop
:showButtons="false"
:canModify="true"
@update:value="modifElem"
@showandsave="saveElem"
>
</CMyEditor>
<CSelectAnimation
v-if="enableEdit && showAnimation"
v-model="rec.anim"
@update:model-value="modifElem"
label="Animazione"
>
</CSelectAnimation>
</div>
</q-tab-panel>
</q-tab-panels>
</div>
</div>
<div v-else-if="myel.type === shared_consts.ELEMTYPE.HTML">