diff --git a/package.json b/package.json index 3f1140f9..77d235cc 100755 --- a/package.json +++ b/package.json @@ -22,55 +22,55 @@ "generate-sw": "workbox generateSW workbox-config.js" }, "dependencies": { - "@quasar/extras": "^1.15.2", + "@quasar/extras": "^1.15.5", "@quasar/quasar-ui-qcalendar": "^4.0.0-beta.13", "@vue-leaflet/vue-leaflet": "^0.6.1", - "@vue/compat": "^3.2.38", - "@vue/compiler-sfc": "^3.2.38", + "@vue/compat": "^3.2.45", + "@vue/compiler-sfc": "^3.2.45", "@vue/eslint-config-standard": "7.0.0", - "@vuelidate/core": "^2.0.0-alpha.44", - "@vuelidate/validators": "^2.0.0-alpha.31", - "acorn": "^8.8.0", - "autoprefixer": "^10.4.8", - "axios": "^0.27.2", + "@vuelidate/core": "^2.0.0", + "@vuelidate/validators": "^2.0.0", + "acorn": "^8.8.1", + "autoprefixer": "^10.4.13", + "axios": "^1.1.3", "bcryptjs": "^2.4.3", "chart.js": "^3.9.1", - "core-js": "^3.25.0", - "date-fns": "^2.29.2", - "dotenv": "^16.0.2", - "echarts": "^5.3.3", + "core-js": "^3.26.0", + "date-fns": "^2.29.3", + "dotenv": "^16.0.3", + "echarts": "^5.4.0", "eslint-plugin-quasar": "^1.1.0", "eslint-plugin-standard": "^5.0.0", "graphql": "^16.6.0", "graphql-tag": "^2.12.6", - "gsap": "^3.11.1", + "gsap": "^3.11.3", "jquery": "^3.6.1", "js-cookie": "^3.0.1", "localforage": "^1.10.0", "lodash": "^4.17.21", "normalize.css": "^8.0.1", - "npm": "^8.19.1", + "npm": "^9.1.1", "nprogress": "^0.2.0", - "pinia": "^2.0.22", + "pinia": "^2.0.23", "prerender-spa-plugin": "^3.4.0", - "quasar": "^2.7.7", + "quasar": "^2.10.1", "quasar-extras": "^2.0.9", "register-service-worker": "^1.7.2", - "vee-validate": "^4.6.7", - "vue": "^3.2.38", + "vee-validate": "^4.7.2", + "vue": "^3.2.45", "vue-chart-3": "^3.1.8", "vue-class-component": "^8.0.0-rc.1", "vue-country-code": "^1.1.3", "vue-echarts": "^6.2.3", "vue-i18n": "^9.2.2", "vue-idb": "^0.2.0", - "vue-loader": "^17.0.0", + "vue-loader": "^17.0.1", "vue-property-decorator": "^10.0.0-rc.3", - "vue-router": "^4.1.5", + "vue-router": "^4.1.6", "vue-scroll-reveal": "^1.0.11", "vue-svgicon": "^4.0.0-alpha.3", "vue2-dragula": "^2.5.5", - "vuex": "^4.0.2", + "vuex": "^4.1.0", "vuex-router-sync": "^6.0.0-rc.1" }, "devDependencies": { @@ -78,41 +78,41 @@ "@types/bcryptjs": "^2.4.2", "@types/dotenv": "^8.2.0", "@types/googlemaps": "^3.43.3", - "@types/jest": "^29.0.0", + "@types/jest": "^29.2.2", "@types/js-cookie": "^3.0.2", - "@types/node": "18.7.15", + "@types/node": "18.11.9", "@types/nprogress": "^0.2.0", "@types/vue-tel-input": "^2.1.2", "@types/vuelidate": "^0.7.15", - "@typescript-eslint/eslint-plugin": "^5.36.2", - "@typescript-eslint/parser": "^5.36.2", - "eslint": "^8.23.0", + "@typescript-eslint/eslint-plugin": "^5.42.1", + "@typescript-eslint/parser": "^5.42.1", + "eslint": "^8.27.0", "eslint-config-prettier": "^8.5.0", "eslint-plugin-import": "^2.26.0", "eslint-plugin-node": "^11.1.0", - "eslint-plugin-promise": "^6.0.1", - "eslint-plugin-vue": "^9.4.0", + "eslint-plugin-promise": "^6.1.1", + "eslint-plugin-vue": "^9.7.0", "file-loader": "^6.2.0", "html-webpack-plugin": "^5.5.0", "http-proxy-middleware": "^2.0.6", - "jest": "^29.0.2", + "jest": "^29.3.1", "json-loader": "^0.5.7", "node-sass": "7.0.1", - "npm-check-updates": "^16.1.0", + "npm-check-updates": "^16.3.25", "optimize-css-assets-webpack-plugin": "^6.0.1", - "postcss": "^8.4.16", + "postcss": "^8.4.19", "postcss-loader": "^7.0.1", - "sass-loader": "^13.0.2", + "sass-loader": "^13.2.0", "strip-ansi": "=7.0.1", - "ts-jest": "^28.0.8", - "ts-loader": "^9.3.1", + "ts-jest": "^29.0.3", + "ts-loader": "^9.4.1", "tslint": "^6.1.3", "tslint-config-standard": "^9.0.0", "tslint-loader": "^3.5.4", - "typescript": "^4.8.2", + "typescript": "^4.8.4", "vue-cli-plugin-element-ui": "^1.1.4", "vueify": "^9.4.1", - "webpack": "^5.74.0", + "webpack": "^5.75.0", "workbox-webpack-plugin": "^6.5.4" }, "browser": { diff --git a/public/images/nuda_e_cruda.jpeg b/public/images/nuda_e_cruda.jpeg new file mode 100644 index 00000000..d7912a1e Binary files /dev/null and b/public/images/nuda_e_cruda.jpeg differ diff --git a/src/common/axios.ts b/src/common/axios.ts index 34a52d71..77de501d 100755 --- a/src/common/axios.ts +++ b/src/common/axios.ts @@ -49,7 +49,7 @@ export function UseAxios(router: any) { // VueRouter if (response) { if (response.status === 401 && handle(response.status, exclude)) { - const location: string = response.headers.location || response.headers.Location + const location: string | undefined = response.headers.location || response.headers.Location if (location) { const redirectTo = `/${location}` diff --git a/src/common/shared_vuejs.ts b/src/common/shared_vuejs.ts index 3ea6eb0f..4c547bab 100755 --- a/src/common/shared_vuejs.ts +++ b/src/common/shared_vuejs.ts @@ -1204,6 +1204,10 @@ export const shared_consts = { value: 30, label: 'Immagine', }, + { + value: 35, + label: 'Immagine da Caricare', + }, { value: 40, label: 'Separatore', @@ -1262,6 +1266,7 @@ export const shared_consts = { TEXT: 10, HTML: 20, IMAGE: 30, + IMAGEUPLOAD: 35, SEPARATOR: 40, VIDEO: 50, PAGE: 55, @@ -1283,6 +1288,7 @@ export const shared_consts = { RIGHT: 3, }, + getStatusStr(status: number) { const trovatorec = this.OrderStatusStr.find((rec) => rec.value === status) return (trovatorec) ? trovatorec.label : '' diff --git a/src/components/CMyEditElem/CMyEditElem.scss b/src/components/CMyEditElem/CMyEditElem.scss new file mode 100755 index 00000000..b01a253d --- /dev/null +++ b/src/components/CMyEditElem/CMyEditElem.scss @@ -0,0 +1,482 @@ + +.testo-banda { + //background: -webkit-gradient(linear, left top, left bottom, from(#3144f0), to(transparent)); + //background: linear-gradient(180deg, #3144f0, transparent); + //background: rgba(0, 0, 0, .6) +} + +$grayshadow: #555; + +$textcol: blue; +$textcol_scuro: darkblue; + +p { + margin: 0 0 1.25rem; + //text-shadow: .125rem .125rem .25rem $grayshadow; +} + +h4 { + font-size: 1.25rem; +} + +.mycard { + visibility: hidden; +} + +.landing { +} + +.landing_background { + background: #000 url(../../../public/images/foto1.jpg) no-repeat 50% fixed; + background-size: cover +} + +.landing > section { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + //padding: 0 16px +} + +.intro { + display: flex; + justify-content: space-between; + align-items: stretch; + /* flex-flow: row nowrap; */ + + padding: 1.25rem 0 1.25rem 0; + margin: .125rem; + + * { + width: 100%; + flex: 1; + margin-left: auto; + margin-right: auto; + } + + &__associazione { + min-width: 350px; + } + + &__comeassociarsi { + min-width: 350px; + } +} + +.subtitle { + font-weight: 600; + text-align: center; + letter-spacing: 0.125rem; + text-transform: uppercase; + font-size: 1rem; +} + +.landing > section.padding { + padding: 5.62rem 1rem; +} + +.landing > section.padding_testo { + padding-top: 1.25rem; + padding-bottom: 1rem; +} + +.landing > section.padding_gallery { + padding-top: 3.125rem; + padding-bottom: 5.625rem; +} + +.landing > section > div { + position: relative; + width: 100% +} + +.maxwidth1200 { + max-width: 1200px; +} + +.landing__toolbar { + background: -webkit-gradient(linear, left top, left bottom, from(#000), to(transparent)); + background: linear-gradient(180deg, #000, transparent); + padding: 0 !important +} + +.landing__toolbar .q-btn { + border-radius: 0 0 .315rem .315rem; + -ms-flex-item-align: stretch; + align-self: stretch +} + +.landing__hero { + min-height: 50vh +} + +.landing__header { + height: 18vh +} + +.landing__arrow { + bottom: 1.5rem; + opacity: .4 +} + +.landing__front { + background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(15%, rgba(0, 0, 0, .6))); + background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .6) 15%) +} + +.landing__logo { + width: 9.40rem; + height: 9.40rem; + margin-top: 1.315rem; + //-webkit-animation: logo-rotate 240s linear infinite; + //animation: logo-rotate 240s linear infinite +} + +.landing__features .q-icon { + font-size: 4rem +} + +h4 { + line-height: 1.5; + text-shadow: .25rem .25rem .5rem $grayshadow; +} + +.landing__features h4, .landing__features h6 { + margin: 1rem 0 +} + +.landing__features p { + opacity: .7; + font-size: 1rem; + line-height: 1.5; +} + +.landing__footer { + //background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, rgba(0, 0, 0, .1)), to(#000)); + background: linear-gradient(180deg, rgba(0, 0, 0, .8) 95%, #FFF); + padding-top: 4.5rem !important; + padding-bottom: 4.5rem !important; + padding-left: 1.25rem; + padding-right: 1.25rem; + color: #9f9f9f; +} + +.icon_contact:hover { + color: blue; + border-color: white; + border-width: .0625rem; +} + +.landing__footer .doc-link { + color: $textcol; +} + +.landing__footer .doc-link:hover { + opacity: .8 +} + +.landing__swirl-bg { + background-repeat: no-repeat !important; + background-position: top; + background-size: contain !important; + background-image: url(../../../public/images/landing_first_section.png) !important +} + +.feat-descr { + font-size: 1.15rem; +} + +.feat-descr:hover { + transition: opacity 0.5s ease-in-out; + opacity: 0.9; +} + +.q-col-gutter-sm { + padding: 3.125rem 3.125rem; + //margin-left: -48px +} + +body.mobile .landing { + //background: unset +} + +body.mobile .landing:before { + content: ""; + position: fixed; + top: 0; + height: 100vh; + left: 0; + right: 0; + bottom: 0; + z-index: -1; + //background: #000 url(../../public/images/cover.jpg) 50%; + + background-size: cover +} + +/* +@-webkit-keyframes logo-rotate { + to { + -webkit-transform: rotate(-1turn); + transform: rotate(-1turn) + } +} + +@keyframes logo-rotate { + to { + -webkit-transform: rotate(-1turn); + transform: rotate(-1turn) + } +} +*/ + +.home { + //background-color: rgb(250, 250, 250); + padding: 3.125rem; + display: flex; + //flex-wrap: nowrap; + flex-direction: column; + align-items: center; + justify-content: space-between; +} + +.btn-start { + margin: 3.125rem; +} + +.shadow { + //color: white; + text-shadow: 0.125rem 0.125rem 0.25rem $grayshadow; +} + +.text-h1, h1 { + font-size: 3rem; + font-weight: bold; + line-height: 3rem; + letter-spacing: -.01562em; + margin-bottom: 8px !important; +} + +.text-h2 { + font-size: 3.75rem; + font-weight: 300; + line-height: 3.75rem; + letter-spacing: -.00833em; +} + +.text-weight-bold { + font-weight: 700; +} + +.text-vers { + font-size: 0.75rem; + font-weight: 400; + line-height: 1.75rem; + letter-spacing: .00937em; + text-shadow: .25rem .25rem .5rem $grayshadow; +} + +.homep-cover-img-1 { + background: #000 url(../../../public/images/foto1.jpg) no-repeat 50% fixed; + //transition: background-image 1s ease-in-out; +} + +.homep-cover-img-2 { + background: #000 url(../../../public/images/foto2.jpg) no-repeat 50% fixed; + //transition: background-image 1s ease-in-out; +} + +.homep-cover-img-3 { + background: #000 url(../../../public/images/foto3.jpg) no-repeat 50% fixed; + //transition: background-image 1s ease-in-out; +} + +.homep-cover-img.hide-filter:before { + opacity: 0 +} + +.landing__footer-icons { + font-size: 1.75rem +} + +.landing__footer-icons a { + margin: 0 .5rem .5rem; + text-decoration: none; + outline: 0; + color: $textcol; + transition: color .28s +} + +.landing__footer-icons a:hover { + color: $textcol_scuro; +} + +.doc-img { + max-width: 100%; +} + +.mylist { + background: #3fdaff; + padding-left: 1.25rem; +} + +.clgutter { + margin-top: 1.25rem; + padding: .62rem; +} + +.carousel_img_3 { + //background-image: url(../../public/images/cibo_sano.jpg); + background-size: cover !important; + background-position: 50% center !important; + background-repeat: no-repeat !important; +} + +@media (max-width: 718px) { + // PER VERSIONE MOBILE + + .landing__hero { + text-align: center + } + .landing__header { + height: 7vh + } + .clgutter { + margin-top: 0; + padding: 0; + } + .landing__hero .text-h1, h1 { + font-size: 2rem; + line-height: 2.05rem; + margin-bottom: 1.25rem + } + + .landing > section.padding { + padding: 2.5rem 1rem; + } + + .landing > section.padding_testo { + padding-top: 1.25rem; + padding-bottom: 1rem; + } + + .landing > section.padding_gallery { + padding-top: 3.125rem; + padding-bottom: 5.625rem; + + max-width: 800px; + } + + .landing > section.padding_gallery > div { + padding-top: 3.125rem; + padding-bottom: 5.625rem; + + } + + .landing__features h4, .landing__features h6 { + margin: 1.25rem 0 + } + + h4 { + line-height: 1.4; + text-shadow: 0.25rem 0.25rem 0.5rem $grayshadow; + } + + .landing .feature-item { + text-align: center; + margin-top: 1.25rem; + } + .landing__hero-content { + padding-bottom: 11.25rem; + } + .landing__hero2-content { + padding-bottom: 7.25rem; + } + .landing__hero-btns { + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center + } + + .q-col-gutter-sm { + padding: .625rem .315rem; + } + + .text-subtitle1 { + font-size: 1.25rem; + } + .text-vers { + font-size: 0.6rem; + } + +} + +.custom-caption { + text-align: center; + padding: .75rem; + color: $textcol; + background-color: rgba(0, 0, 0, .3); +} + +.sfondo-grigio { + padding: 1rem; + color: $textcol; + background-color: rgba(0, 0, 0, .35); +} + +.mycontacts { + color: gray; + letter-spacing: 0.078rem; +} + +.mycontacts_title { + text-shadow: 0.125rem 0.125rem 0.125rem #555; + font-weight: bold; + color: #999; + letter-spacing: 0.125rem; +} + +.mycontacts_text { + color: #999; + letter-spacing: 0.093rem; +} + +.clEditDiv { + border: #c8c9cb solid 2px; + padding: 2px; +} + +.clEditNotActive { + background-color: #e6e6e6; +} + +.clEdit { + border: #f69f09 solid 2px; + padding: 2px; +} + +.clEdit:hover { + border: #11f609 solid 2px; + cursor: pointer; +} + +.align_center { + text-align: center; +} + +.align_right { + text-align: right; +} + +.align_left { + text-align: left; +} + +.flex3 { + display: flex; + justify-content: space-between; + background-color: green; +} diff --git a/src/components/CMyEditElem/CMyEditElem.ts b/src/components/CMyEditElem/CMyEditElem.ts new file mode 100755 index 00000000..82dbed2a --- /dev/null +++ b/src/components/CMyEditElem/CMyEditElem.ts @@ -0,0 +1,259 @@ +import { + defineComponent, onMounted, PropType, ref, toRef, watch, +} from 'vue' + +import { ILabelValue, IMyElem, IMyPage, IOperators } from '@src/model' +import { useGlobalStore } from '@store/globalStore' + +import { CImgTitle } from '../CImgTitle/index' +import { CTitle } from '@/components/CTitle/index' +import { tools } from '@store/Modules/tools' +import { shared_consts } from '@/common/shared_vuejs' +import { LandingFooter } from '@/components/LandingFooter' +import { COpenStreetMap } from '@src/components/COpenStreetMap' +import { CCardCarousel } from '@src/components/CCardCarousel' +import { CMyPage } from '@src/components/CMyPage' +import { CMyPageIntro } from '@src/components/CMyPageIntro' +import { CEventsCalendar } from '@src/components/CEventsCalendar' +import { CMyEditor } from '@src/components/CMyEditor' +import { CMyFieldRec } from '@src/components/CMyFieldRec' +import { CSelectColor } from '@src/components/CSelectColor' +import { CSelectFontSize } from '@src/components/CSelectFontSize' + +import MixinMetaTags from '@/mixins/mixin-metatags' +import MixinBase from '@/mixins/mixin-base' +import { useQuasar } from 'quasar' +import { useI18n } from '@/boot/i18n' +import { emitKeypressEvents } from 'readline' +import { costanti } from '@costanti' + + +export default defineComponent({ + name: 'CMyEditElem', + components: { CImgTitle, CTitle, LandingFooter, CEventsCalendar, + CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec, + CSelectColor, CSelectFontSize }, + emits: ['saveElem'], + props: { + myelem: { + type: Object as PropType, + required: true, + }, + path: { + type: String, + required: false, + default: '', + }, + editOn: { + type: Boolean, + required: false, + default: false, + }, + addOn: { + type: Boolean, + required: false, + default: false, + }, + }, + setup(props, { emit }) { + const globalStore = useGlobalStore() + + const { setmeta, getsrcbyimg } = MixinMetaTags() + const { setValDb, getValDb } = MixinBase() + + + const $q = useQuasar() + const { t } = useI18n() + + const animare = ref(0) + const slide = ref(0) + const slide2 = ref(0) + const arrPages = ref([] as any[]) + const disableSave = ref(true) + const enableEdit = ref(true) + const elemChanged = ref(false) + const enableAdd = ref(true) + + const neworder = ref(0) + + const myel = toRef(props, 'myelem') + const newtype = ref('') + + watch(() => myel.value.order, (value, oldval) => { + mounted() + }) + + function getArrDisciplines() { + return globalStore.disciplines.filter((rec: any) => rec.showinhome) + } + + function getheightgallery() { + if (tools.isMobile()) + return '400px' + else + return '600px' + } + + function saveElem(exit?: boolean) { + // Save Elem record + const myelem = props.myelem + myelem.order = neworder.value + globalStore.saveMyElem($q, t, myelem).then((ris) => { + if (ris) { + // OK + disableSave.value = true + emit('saveElem', myelem) + if (exit) + elemChanged.value = false + } + }) + } + + function addNewElem(order?: number) { + + const newrec: IMyElem = { + _id: undefined, + type: newtype.value, + path: props.myelem.path, + order: order ? order : 1000, + active: true, + container: '' + } + + if (newrec.type === shared_consts.ELEMTYPE.CAROUSEL_IMGS) { + newrec.container2 = '8' + newrec.height = 600 + } else if (newrec.type === shared_consts.ELEMTYPE.CARD) { + newrec.class2 = 'row justify-center' + } + + + globalStore.addNewElem($q, t, newrec) + } + + function dupElem(order?: number) { + + const newrec = props.myelem + + newrec._id = undefined + newrec.order = order ? order : newrec.order! + 10 + + globalStore.addNewElem($q, t, newrec) + } + + function delElem() { + $q.dialog({ + message: 'Eliminare ' + props.myelem.container + ' ?', + html: true, + ok: { + label: 'Elimina', + push: true, + }, + title: '', + cancel: true, + persistent: false, + }).onOk(async () => { + + // Save Elem record + await globalStore.delMyElem($q, t, props.myelem).then((ris) => { + if (ris) { + // OK + disableSave.value = true + } + }) + }) + + } + + function modifElem(value: any) { + disableSave.value = false + elemChanged.value = true + } + + function mounted() { + neworder.value = props.myelem.order + + arrPages.value = [] + arrPages.value.push({label: '[Vuoto]', path: ''}) + for (const page of globalStore.mypage) { + + const rec = { + // @ts-ignore + label: page.title, + // @ts-ignore + value: page.path + } + arrPages.value.push(rec) + } + + if (props.myelem) + newtype.value = props.myelem.type + } + + function clickOnElem() { + if (props.editOn) { + } + } + + function addNewCard() { + if (!myel.value.listcards) + myel.value.listcards = [] + myel.value.listcards.push({ imagefile: '', alt: '', description: '' }) + modifElem(true) + } + + function getClass() { + let mycl = '' + if (props.myelem.align === shared_consts.ALIGNTYPE.CEHTER) { + mycl += ' align_center' + } else if (props.myelem.align === shared_consts.ALIGNTYPE.RIGHT) { + mycl += ' align_right' + } else if (props.myelem.align === shared_consts.ALIGNTYPE.LEFT) { + mycl += ' align_left' + } + + return mycl + } + + function showFit() { + if (props.myelem.type) + return [shared_consts.ELEMTYPE.TEXT].includes(props.myelem.type) + else + return false + } + + onMounted(mounted) + + return { + tools, + shared_consts, + getArrDisciplines, + getheightgallery, + slide, + slide2, + animare, + setmeta, + getsrcbyimg, + saveElem, + myel, + disableSave, + modifElem, + delElem, + addNewElem, + newtype, + neworder, + elemChanged, + enableAdd, + clickOnElem, + getClass, + showFit, + getValDb, + dupElem, + enableEdit, + addNewCard, + arrPages, + costanti, + } + }, + +}) diff --git a/src/components/CMyEditElem/CMyEditElem.vue b/src/components/CMyEditElem/CMyEditElem.vue new file mode 100755 index 00000000..68719b10 --- /dev/null +++ b/src/components/CMyEditElem/CMyEditElem.vue @@ -0,0 +1,647 @@ + + + + diff --git a/src/components/CMyEditElem/index.ts b/src/components/CMyEditElem/index.ts new file mode 100755 index 00000000..52a088ff --- /dev/null +++ b/src/components/CMyEditElem/index.ts @@ -0,0 +1 @@ +export { default as CMyEditElem } from './CMyEditElem.vue' diff --git a/src/components/CMyElem/CMyElem.scss b/src/components/CMyElem/CMyElem.scss index 7318763c..b01a253d 100755 --- a/src/components/CMyElem/CMyElem.scss +++ b/src/components/CMyElem/CMyElem.scss @@ -474,3 +474,9 @@ body.mobile .landing:before { .align_left { text-align: left; } + +.flex3 { + display: flex; + justify-content: space-between; + background-color: green; +} diff --git a/src/components/CMyElem/CMyElem.ts b/src/components/CMyElem/CMyElem.ts index e02f932b..e0532799 100755 --- a/src/components/CMyElem/CMyElem.ts +++ b/src/components/CMyElem/CMyElem.ts @@ -2,7 +2,7 @@ import { defineComponent, onMounted, PropType, ref, toRef, watch, } from 'vue' -import { IMyElem, IMyPage, IOperators } from '@src/model' +import { IMyCard, IMyElem, IMyPage, IOperators } from '@src/model' import { useGlobalStore } from '@store/globalStore' import { CImgTitle } from '../CImgTitle/index' @@ -17,15 +17,21 @@ import { CMyPageIntro } from '@src/components/CMyPageIntro' import { CEventsCalendar } from '@src/components/CEventsCalendar' import { CMyEditor } from '@src/components/CMyEditor' import { CMyFieldRec } from '@src/components/CMyFieldRec' +import { CSelectColor } from '@src/components/CSelectColor' +import { CSelectFontSize } from '@src/components/CSelectFontSize' import MixinMetaTags from '@/mixins/mixin-metatags' +import MixinBase from '@/mixins/mixin-base' import { useQuasar } from 'quasar' import { useI18n } from '@/boot/i18n' export default defineComponent({ name: 'CMyElem', - components: { CImgTitle, CTitle, LandingFooter, CEventsCalendar, CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec }, + components: { CImgTitle, CTitle, LandingFooter, CEventsCalendar, + CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec, + CSelectColor, CSelectFontSize }, + emits: ['selElemClick'], props: { myelem: { type: Object as PropType, @@ -47,10 +53,12 @@ export default defineComponent({ default: false, }, }, - setup(props) { + setup(props, { emit }) { const globalStore = useGlobalStore() const { setmeta, getsrcbyimg } = MixinMetaTags() + const { setValDb, getValDb } = MixinBase() + const $q = useQuasar() const { t } = useI18n() @@ -115,6 +123,16 @@ export default defineComponent({ globalStore.addNewElem($q, t, newrec) } + function dupElem(order?: number) { + + const newrec = props.myelem + + newrec._id = undefined + newrec.order = order ? order : newrec.order! + 10 + + globalStore.addNewElem($q, t, newrec) + } + function delElem() { $q.dialog({ message: 'Eliminare ' + props.myelem.container + ' ?', @@ -153,6 +171,7 @@ export default defineComponent({ function clickOnElem() { if (props.editOn) { enableEdit.value = true + emit('selElemClick', props.myelem) } } @@ -166,9 +185,24 @@ export default defineComponent({ mycl += ' align_left' } + if (props.myelem.class2) + mycl += ' ' + props.myelem.class2 + return mycl } + function getImgFileByElem(elem: IMyElem, reccard?: IMyCard) { + if (elem) { + if (elem.type === shared_consts.ELEMTYPE.CARD) { + return 'upload/pages/' + elem.path + '/' + reccard!.imagefile + } else if (elem.type === shared_consts.ELEMTYPE.IMAGE) { + return 'upload/pages/' + elem.path + '/' + elem.container + } else { + return 'upload/pages/' + elem.path + '/' + elem.image + } + } + } + function showFit() { if (props.myelem.type) return [shared_consts.ELEMTYPE.TEXT].includes(props.myelem.type) @@ -201,6 +235,9 @@ export default defineComponent({ clickOnElem, getClass, showFit, + getValDb, + dupElem, + getImgFileByElem, } }, diff --git a/src/components/CMyElem/CMyElem.vue b/src/components/CMyElem/CMyElem.vue index 1a59b3d5..4b45f01a 100755 --- a/src/components/CMyElem/CMyElem.vue +++ b/src/components/CMyElem/CMyElem.vue @@ -1,125 +1,48 @@ diff --git a/src/components/CMyPage/CMyPage.ts b/src/components/CMyPage/CMyPage.ts index 0ea694d0..c9ed60e2 100755 --- a/src/components/CMyPage/CMyPage.ts +++ b/src/components/CMyPage/CMyPage.ts @@ -62,9 +62,9 @@ export default defineComponent({ if (mypath.value !== '') rec.value = await globalStore.loadPage('/' + mypath.value) }) - // onMounted(load) + onMounted(load) - load() + // load() return { rec, globalStore diff --git a/src/components/CMyPageElem/CMyPageElem.ts b/src/components/CMyPageElem/CMyPageElem.ts index 496c204b..74e089b5 100755 --- a/src/components/CMyPageElem/CMyPageElem.ts +++ b/src/components/CMyPageElem/CMyPageElem.ts @@ -7,6 +7,7 @@ import { IMyElem, IMyPage } from '@src/model' import { useGlobalStore } from '@store/globalStore' import { LandingFooter } from '@/components/LandingFooter' import { CMyElem } from '@/components/CMyElem' +import { CMyEditElem } from '@/components/CMyEditElem' import { CImgTitle } from '../CImgTitle/index' import { CTitle } from '../CTitle/index' @@ -17,7 +18,7 @@ import { shared_consts } from '@/common/shared_vuejs' export default defineComponent({ name: 'CMyPageElem', - components: { LandingFooter, CImgTitle, CTitle, CMyElem }, + components: { LandingFooter, CImgTitle, CTitle, CMyElem, CMyEditElem }, props: { title: String, mypath: { @@ -61,6 +62,7 @@ export default defineComponent({ const editOn = ref(false) const addOn = ref(false) + const selElem = ref({} as IMyElem) const myelemVoid = ref({active: true, type: shared_consts.ELEMTYPE.TEXT, container: '...', path: mypathin.value} as IMyElem) const globalStore = useGlobalStore() @@ -76,6 +78,11 @@ export default defineComponent({ const load = async (): Promise => { // console.log('load', mypathin.value) if (mypathin.value !== '') rec.value = await globalStore.loadPage('/' + mypathin.value) + + editOn.value = tools.getCookie('EDIT_' + mypathin.value) === '-1' ? true : false + if (mypathin.value === 'home') + editOn.value = false + console.log('getcookie: ', editOn.value, mypathin.value) } watch(() => props.mypath, async (to: string, from: string) => { @@ -84,6 +91,19 @@ export default defineComponent({ }) + function selElemClick(myelem: IMyElem) { + selElem.value = myelem + } + + function saveElem(myelem: IMyElem) { + // + } + + function changeVisuDrawer() { + console.log('changeVisuDrawer') + tools.setCookie('EDIT_' + mypathin.value, editOn.value ? '-1' : '0') + } + onMounted(load) return { @@ -94,6 +114,10 @@ export default defineComponent({ tools, shared_consts, myelemVoid, + selElemClick, + selElem, + saveElem, + changeVisuDrawer, } }, diff --git a/src/components/CMyPageElem/CMyPageElem.vue b/src/components/CMyPageElem/CMyPageElem.vue index ea3a79d9..74538a73 100755 --- a/src/components/CMyPageElem/CMyPageElem.vue +++ b/src/components/CMyPageElem/CMyPageElem.vue @@ -1,26 +1,44 @@