fixed CGallery

This commit is contained in:
Paolo Arena
2021-11-22 18:28:45 +01:00
parent ae62860d51
commit e6ea3206a9
8 changed files with 127 additions and 102 deletions

View File

@@ -58,16 +58,17 @@ export default defineComponent({
console.log('created cgallery') console.log('created cgallery')
if (isValid(props.imgGall)) { if (isValid(props.imgGall)) {
// @ts-ignore // @ts-ignore
gallerylist.value = props.imgGall let myarr: any = props.imgGall
gallerylist.value = []
if (myarr) {
myarr.forEach((pic: any) => {
if (pic.imagefile)
gallerylist.value.push(pic)
})
}
} else { } else {
gallerylist.value = [ gallerylist.value = [
{ ]
_id: '',
imagefile: 'noimg.png',
order: 0,
alt: '',
description: '(nessuna foto)'
}]
} }
} }
@@ -210,7 +211,7 @@ export default defineComponent({
} }
function uploaded(info: any) { function uploaded(info: any) {
console.log(info) console.log('uploaded', info)
if (gallerylist.value) { if (gallerylist.value) {
for (const file of info.files) { for (const file of info.files) {
gallerylist.value.push({ imagefile: file.name, order: getlastord() }) gallerylist.value.push({ imagefile: file.name, order: getlastord() })
@@ -218,6 +219,8 @@ export default defineComponent({
if (!props.single) if (!props.single)
save() save()
console.log('gallerylist', gallerylist.value)
} }
} }
@@ -270,21 +273,27 @@ export default defineComponent({
} }
function save() { function save() {
console.log('CGallery save')
if (gallerylist.value.length > 0) { if (gallerylist.value.length > 0) {
if (!props.single) { if (!props.single) {
emit('showandsave', gallerylist.value) emit('showandsave', gallerylist.value)
} else { } else {
emit('showandsave', gallerylist.value[0].imagefile) emit('showandsave', gallerylist.value[0].imagefile)
} }
} else {
emit('showandsave', '')
} }
} }
function close() { function close() {
save() return ''
} }
function getsrcimg(gallerylistery: any) { function getsrcimg(gallerylistery: any) {
if (!gallerylistery.imagefile) {
return 'images/noimg.png';
}
if (gallerylistery) { if (gallerylistery) {
if (tools.getextfile(gallerylistery.imagefile) === 'pdf') if (tools.getextfile(gallerylistery.imagefile) === 'pdf')
return 'images/images/pdf.jpg' return 'images/images/pdf.jpg'

View File

@@ -20,81 +20,89 @@
</div> </div>
</div> </div>
<div v-else> <div v-else>
<div class=" row"> <div v-if="getnumimages() <= 0">
<!--<q-draggable-rows <q-btn
v-model="order">--> flat round color="blue" icon="fas fa-tools" size="md"
@click="apri"></q-btn>
</div>
<div v-else>
<div class=" row">
<!--<q-draggable-rows
v-model="order">-->
<div v-for="(mygallery, index) in getlistimages()" :key="index"> <div v-for="(mygallery, index) in getlistimages()" :key="index">
<div mygallery : {{ mygallery}}
class="q-pa-sm q-gutter-sm" <div
@dragenter="onDragEnter" class="q-pa-sm q-gutter-sm"
@dragleave="onDragLeave" @dragenter="onDragEnter"
@dragleave="onDragLeave"
@dragover="onDragOver"> @dragover="onDragOver">
<q-card <q-card
:id="mygallery._id" :class="getclass()" :id="mygallery._id" :class="getclass()"
draggable="true" draggable="true"
@dragstart="onDragStart" @dragstart="onDragStart"
@drop="onDrop" @drop="onDrop"
> >
<q-img <q-img
:src="getsrcimg(mygallery)" :src="getsrcimg(mygallery)"
:class="getclimg()" :class="getclimg()"
:alt="mygallery.alt"> :alt="mygallery.alt">
<div class="absolute-bottom text-shadow"> <div class="absolute-bottom text-shadow">
<!-- <div class="text-h6 text-trans">{{ mygallery.description }} </div> --> <!-- <div class="text-h6 text-trans">{{ mygallery.description }} </div> -->
<div class="text-subtitle-carica text-trans">{{ mygallery.description }}</div> <div class="text-subtitle-carica text-trans">{{ mygallery.description }}</div>
</div> </div>
</q-img> </q-img>
<q-field <q-field
stack-label stack-label
dense dense
label="FileName"> label="FileName">
<template v-slot:control> <template v-slot:control>
<div class="self-center full-width no-outline" tabindex="0">{{ mygallery.imagefile }}</div> <div class="self-center full-width no-outline" tabindex="0">{{ mygallery.imagefile }}</div>
</template> </template>
</q-field> </q-field>
<q-input <q-input
v-model="mygallery.description" v-model="mygallery.description"
dense dense
:label="$t('proj.longdescr')" :label="$t('proj.longdescr')"
@keyup.enter.stop @keyup.enter.stop
@update:model-value="save" @update:model-value="save"
debounce="1000" debounce="1000"
autofocus> autofocus>
</q-input> </q-input>
<q-card-actions align="center"> <q-card-actions align="center">
<q-btn <q-btn
flat round color="blue" icon="fas fa-copy" size="sm" flat round color="blue" icon="fas fa-copy" size="sm"
@click="copytoclipboard(mygallery)"></q-btn> @click="copytoclipboard(mygallery)"></q-btn>
<q-btn <q-btn
flat round color="red" icon="fas fa-trash-alt" size="sm" flat round color="red" icon="fas fa-trash-alt" size="sm"
@click="deleteFile(mygallery)"></q-btn> @click="deleteFile(mygallery)"></q-btn>
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</div>
</div> </div>
</div> <div class="q-pa-sm">
<div class="q-pa-sm"> <div v-if="edit" class="q-gutter-sm " style="max-height: 200px; width: 208px;">
<div v-if="edit" class="q-gutter-sm " style="max-height: 200px; width: 208px;"> <q-uploader
<q-uploader label="Aggiungi Immagine"
label="Aggiungi Immagine o PDF" accept=".jpg, image/*, .pdf"
accept=".jpg, image/*, .pdf" :url="getUrl()"
:url="getUrl()" :headers="tools.getheaders()"
:headers="tools.getheaders()" :max-file-size="2000000"
:max-file-size="2000000" multiple
multiple auto-upload
auto-upload hide-upload-btn
hide-upload-btn no-thumbnails
no-thumbnails @uploaded="uploaded"
@uploaded="uploaded" style="width: 208px"
style="width: 208px" ></q-uploader>
></q-uploader> </div>
</div> </div>
</div> </div>
</div> </div>
@@ -108,7 +116,7 @@
> >
<q-card> <q-card>
<q-bar class="bg-primary text-white"> <q-bar class="bg-primary text-white">
<q-space /> <q-space/>
<q-btn dense flat icon="minimize" @click="maximizedToggle = false" :disable="!maximizedToggle"> <q-btn dense flat icon="minimize" @click="maximizedToggle = false" :disable="!maximizedToggle">
<q-tooltip v-if="maximizedToggle" class="bg-white text-primary">Minimize</q-tooltip> <q-tooltip v-if="maximizedToggle" class="bg-white text-primary">Minimize</q-tooltip>
@@ -116,7 +124,7 @@
<q-btn dense flat icon="crop_square" @click="maximizedToggle = true" :disable="maximizedToggle"> <q-btn dense flat icon="crop_square" @click="maximizedToggle = true" :disable="maximizedToggle">
<q-tooltip v-if="!maximizedToggle" class="bg-white text-primary">Maximize</q-tooltip> <q-tooltip v-if="!maximizedToggle" class="bg-white text-primary">Maximize</q-tooltip>
</q-btn> </q-btn>
<q-btn dense flat icon="close" v-close-popup @click="close"> <q-btn dense flat icon="close" v-close-popup>
<q-tooltip class="bg-white text-primary">Close</q-tooltip> <q-tooltip class="bg-white text-primary">Close</q-tooltip>
</q-btn> </q-btn>
</q-bar> </q-bar>
@@ -170,14 +178,14 @@
autofocus> autofocus>
</q-input> </q-input>
<q-card-actions align="center"> <q-card-actions align="center">
<q-btn <q-btn
flat round color="blue" icon="fas fa-copy" size="sm" flat round color="blue" icon="fas fa-copy" size="sm"
@click="copytoclipboard(mygallery)"></q-btn> @click="copytoclipboard(mygallery)"></q-btn>
<q-btn <q-btn
flat round color="red" icon="fas fa-trash-alt" size="sm" flat round color="red" icon="fas fa-trash-alt" size="sm"
@click="deleteFile(mygallery)"></q-btn> @click="deleteFile(mygallery)"></q-btn>
</q-card-actions> </q-card-actions>
</q-card-section> </q-card-section>
</q-card> </q-card>
@@ -186,7 +194,7 @@
<div class="q-pa-sm"> <div class="q-pa-sm">
<div class="q-gutter-sm " style="max-height: 200px; width: 208px;"> <div class="q-gutter-sm " style="max-height: 200px; width: 208px;">
<q-uploader <q-uploader
label="Aggiungi Immagine o PDF" label="Aggiungi Immagine"
accept=".jpg, image/*, .pdf" accept=".jpg, image/*, .pdf"
:url="getUrl()" :url="getUrl()"
:headers="tools.getheaders()" :headers="tools.getheaders()"
@@ -202,6 +210,11 @@
</div> </div>
</div> </div>
<q-card-actions align="right">
<q-btn flat label="Annulla" color="primary" v-close-popup />
<q-btn label="salva" color="primary" v-close-popup @click="save"/>
</q-card-actions>
</q-card-section> </q-card-section>
</q-card> </q-card>
</q-dialog> </q-dialog>

View File

@@ -363,7 +363,7 @@ export default defineComponent({
function showandsel(row: any, col: any, newval: any, valinitial: any) { function showandsel(row: any, col: any, newval: any, valinitial: any) {
// console.log('showandsel', row, col, newval) console.log('showandsel CGridTable', row, col, newval)
rowsel = row rowsel = row
colsel.value = col colsel.value = col
idsel = row._id idsel = row._id

View File

@@ -7,6 +7,7 @@ import { tools } from '@store/Modules/tools'
import { costanti } from '@costanti' import { costanti } from '@costanti'
import { CMyPopupEdit } from '@/components/CMyPopupEdit' import { CMyPopupEdit } from '@/components/CMyPopupEdit'
import { IColGridTable } from 'model' import { IColGridTable } from 'model'
import MixinBase from '@/mixins/mixin-base'
export default defineComponent({ export default defineComponent({
@@ -84,6 +85,15 @@ export default defineComponent({
const col = ref(<IColGridTable> { name: 'test' }) const col = ref(<IColGridTable> { name: 'test' })
const row = ref({}) const row = ref({})
const { setValDb, getValDb } = MixinBase()
function showandsel(row: any, col: any, newval: any, valinitial: any) {
console.log('showandsel CMyFieldDb', row, col, newval)
if (newval !== valinitial)
setValDb($q, props.mykey, newval, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey)
}
return { return {
tools, tools,
costanti, costanti,
@@ -91,6 +101,7 @@ export default defineComponent({
globalStore, globalStore,
col, col,
row, row,
showandsel,
} }
}, },
}) })

View File

@@ -39,6 +39,7 @@
:mycol="col" :mycol="col"
v-model:row="row" v-model:row="row"
minuteinterval="1" minuteinterval="1"
@showandsave="showandsel"
> >
</CMyPopupEdit> </CMyPopupEdit>

View File

@@ -20,6 +20,7 @@ import MixinUsers from '@/mixins/mixin-users'
export default defineComponent({ export default defineComponent({
name: 'CMyPopupEdit', name: 'CMyPopupEdit',
emits: ['showandsave', 'update:row', 'show', 'save', 'annulla'],
props: { props: {
title: { title: {
type: String, type: String,
@@ -250,14 +251,7 @@ export default defineComponent({
myvalue.value = { myvalue.value = {
title: 'Galleria', title: 'Galleria',
directory: 'none', directory: 'none',
list: [ list: []
{
_id: '',
imagefile: 'noimg.png',
order: 0,
alt: '',
description: '(nessuna foto)'
}]
} }
} }
} }
@@ -336,6 +330,7 @@ export default defineComponent({
function Savedb(newVal: any, valinitial: any) { function Savedb(newVal: any, valinitial: any) {
console.log('Savedb')
if (col.value.fieldtype === costanti.FieldType.boolean) { if (col.value.fieldtype === costanti.FieldType.boolean) {
// console.log('myvalue', myvalue, newVal, myvalueprec) // console.log('myvalue', myvalue, newVal, myvalueprec)

View File

@@ -85,7 +85,6 @@
<div v-else-if="col.fieldtype === costanti.FieldType.listimages"> <div v-else-if="col.fieldtype === costanti.FieldType.listimages">
gall1: gall1:
<CGallery <CGallery
v-if="myvalue"
:title="getTitleGall()" :title="getTitleGall()"
:directory="getDirectoryGall()" :directory="getDirectoryGall()"
:imgGall="myvalue" :edit="isviewfield()" :imgGall="myvalue" :edit="isviewfield()"
@@ -99,7 +98,6 @@
<div v-if="canEdit"> <div v-if="canEdit">
gall2: gall2:
<CGallery <CGallery
v-if="myvalue"
:title="getTitleGall()" :title="getTitleGall()"
:directory="getDirectoryGall()" :directory="getDirectoryGall()"
:imgGall="myvalue" :edit="isviewfield()" :imgGall="myvalue" :edit="isviewfield()"
@@ -184,7 +182,6 @@
<div v-if="col.fieldtype === costanti.FieldType.listimages"> <div v-if="col.fieldtype === costanti.FieldType.listimages">
gall3: gall3:
<CGallery <CGallery
v-if="myvalue"
:title="getTitleGall()" :title="getTitleGall()"
:directory="getDirectoryGall()" :directory="getDirectoryGall()"
:imgGall="myvalue" :edit="isviewfield()" :imgGall="myvalue" :edit="isviewfield()"
@@ -193,9 +190,8 @@
</CGallery> </CGallery>
</div> </div>
<div v-else-if="col.fieldtype === costanti.FieldType.image"> <div v-else-if="col.fieldtype === costanti.FieldType.image">
gall4:
<CGallery <CGallery
v-if="myvalue"
:title="getTitleGall()" :title="getTitleGall()"
:directory="getDirectoryGall()" :directory="getDirectoryGall()"
:single="isFieldDb()" :single="isFieldDb()"

View File

@@ -839,7 +839,7 @@ export const useGlobalStore = defineStore('GlobalStore', {
async DeleteFile({ filename }: {filename: string}) { async DeleteFile({ filename }: {filename: string}) {
console.log('DeleteFile', filename) console.log('DeleteFile', filename)
return Api.SendReq('/delfile', 'DELETE', { filename }) return Api.SendReq(`/delfile/${tools.getvers()}/`, 'DELETE', { filename })
.then((res) => { .then((res) => {
if (res.status === 200) { if (res.status === 200) {
if (res.data.code === serv_constants.RIS_CODE_OK) { if (res.data.code === serv_constants.RIS_CODE_OK) {