fix filtro multiselect

This commit is contained in:
Paolo Arena
2021-12-11 22:12:44 +01:00
parent cab0562de7
commit 48297094ae
13 changed files with 538 additions and 267 deletions

View File

@@ -47,6 +47,7 @@ export default defineComponent({
table: 'sectors',
key: 'idSector',
value: costanti.FILTER_TUTTI,
arrvalue: [],
type: costanti.FieldType.select,
},
{
@@ -54,6 +55,7 @@ export default defineComponent({
table: 'skills',
key: 'idSkill',
value: costanti.FILTER_TUTTI,
arrvalue: [],
type: costanti.FieldType.select,
},
{
@@ -62,12 +64,14 @@ export default defineComponent({
key: 'idCity',
value: costanti.FILTER_TUTTI,
type: costanti.FieldType.multiselect,
arrvalue: [costanti.FILTER_TUTTI],
},
{
label: 'Livello',
table: 'levels',
key: 'numLevel',
value: costanti.FILTER_TUTTI,
arrvalue: [],
type: costanti.FieldType.select,
},
{
@@ -75,6 +79,7 @@ export default defineComponent({
table: 'statusSkills',
key: 'idStatusSkill',
value: costanti.FILTER_TUTTI,
arrvalue: [],
type: costanti.FieldType.multiselect,
},

View File

@@ -19,9 +19,14 @@ $grayshadow: #555;
.myimg {
border-radius: 10px !important;
height: 200px;
cursor: pointer;
}
.myimg-modify {
cursor: grab;
}
.barwidth{
width: 250px !important;
}

View File

@@ -14,6 +14,10 @@ export default defineComponent({
type: Boolean,
required: true,
},
canModify: {
type: Boolean,
required: true,
},
single: {
type: Boolean,
required: false,
@@ -42,6 +46,9 @@ export default defineComponent({
const gallerylist = ref(<IImgGallery[]>[])
const maximizedToggle = ref(true)
const fullscreen = ref(false)
const fullscreensrc = ref('')
function isValid(myobj: any): boolean {
return (myobj && typeof myobj !== 'string' && typeof myobj !== 'undefined')
@@ -101,69 +108,77 @@ export default defineComponent({
}
function onDragEnter(e: any) {
// don't drop on other draggables
if (e.target.draggable !== true) {
e.target.classList.add('drag-enter')
if (props.canModify) {
// don't drop on other draggables
if (e.target.draggable !== true) {
e.target.classList.add('drag-enter')
}
}
}
function onDragLeave(e: any) {
e.target.classList.remove('drag-enter')
if (props.canModify) {
e.target.classList.remove('drag-enter')
}
}
function onDragOver(e: any) {
e.preventDefault()
if (props.canModify) {
e.preventDefault()
}
}
function onDrop(e: any) {
console.log('onDrop', e)
e.preventDefault()
if (props.canModify) {
console.log('onDrop', e)
e.preventDefault()
// don't drop on other draggables
if (e.target.draggable === true) {
return
}
if (gallerylist.value) {
const draggedId = e.dataTransfer.getData('text')
let dragout = ''
try {
dragout = e.target.parentNode.parentNode.parentNode.id
} catch (err) {
dragout = ''
}
const draggedEl = document.getElementById(draggedId)
console.log('draggedId', draggedId, 'draggedEl', draggedEl)
console.log('dragout', dragout)
// check if original parent node
if (draggedEl) {
if (draggedEl.parentNode === e.target) {
e.target.classList.remove('drag-enter')
return
}
}
const myindexIn = gallerylist.value.findIndex((rec: any) => rec._id === draggedId)
const myrecIn: IImgGallery = gallerylist.value[myindexIn]
let myrecOut: IImgGallery
const myindexout = gallerylist.value.findIndex((rec: any) => rec._id === dragout)
myrecOut = gallerylist.value[myindexout]
if (myindexIn === myindexout)
// don't drop on other draggables
if (e.target.draggable === true) {
return
}
if (gallerylist.value) {
const draggedId = e.dataTransfer.getData('text')
let dragout = ''
try {
dragout = e.target.parentNode.parentNode.parentNode.id
} catch (err) {
dragout = ''
}
const draggedEl = document.getElementById(draggedId)
console.log('draggedId', draggedId, 'draggedEl', draggedEl)
console.log('dragout', dragout)
// check if original parent node
if (draggedEl) {
if (draggedEl.parentNode === e.target) {
e.target.classList.remove('drag-enter')
return
}
}
const myindexIn = gallerylist.value.findIndex((rec: any) => rec._id === draggedId)
const myrecIn: IImgGallery = gallerylist.value[myindexIn]
let myrecOut: IImgGallery
const myindexout = gallerylist.value.findIndex((rec: any) => rec._id === dragout)
myrecOut = gallerylist.value[myindexout]
if (myindexIn === myindexout)
return
tools.array_move(gallerylist.value, myindexIn, myindexout)
tools.array_move(gallerylist.value, myindexIn, myindexout)
// make the exchange
// draggedEl.parentNode.removeChild(draggedEl)
// e.target.appendChild(draggedEl)
e.target.classList.remove('drag-enter')
// make the exchange
// draggedEl.parentNode.removeChild(draggedEl)
// e.target.appendChild(draggedEl)
e.target.classList.remove('drag-enter')
save()
save()
}
}
}
@@ -172,7 +187,10 @@ export default defineComponent({
}
function getclimg() {
return (props.edit || displayGall.value) ? 'myimg' : 'myimg-view'
let mycl = (props.edit || displayGall.value) ? 'myimg' : 'myimg-view'
if (props.canModify && props.edit)
mycl = mycl + ' myimg-modify'
return mycl
}
/*function getlastord() {
@@ -304,6 +322,11 @@ export default defineComponent({
return myurl
}
function ImgFullScreen(mygallery: IImgGallery) {
fullscreen.value = true
fullscreensrc.value = getfullname(mygallery)
}
onMounted(created)
return {
@@ -328,6 +351,9 @@ export default defineComponent({
maximizedToggle,
getUrl,
close,
ImgFullScreen,
fullscreen,
fullscreensrc,
}
}
})

View File

@@ -39,7 +39,7 @@
@dragover="onDragOver">
<q-card
:id="mygallery._id" :class="getclass()"
draggable="true"
:draggable="canModify"
@dragstart="onDragStart"
@drop="onDrop"
>
@@ -77,9 +77,11 @@
<q-card-actions align="center">
<q-btn
v-if="canModify"
flat round color="blue" icon="fas fa-copy" size="sm"
@click="copytoclipboard(mygallery)"></q-btn>
<q-btn
v-if="canModify"
flat round color="red" icon="fas fa-trash-alt" size="sm"
@click="deleteFile(mygallery)"></q-btn>
</q-card-actions>
@@ -147,25 +149,27 @@
>
<q-btn flat round dense icon="menu" class="q-mr-sm"/>
<q-btn
v-if="canModify"
flat round icon="fas fa-copy" size="sm"
@click="copytoclipboard(mygallery)"></q-btn>
<div>
Foto {{ index + 1 }}
</div>
<q-space></q-space>
<q-btn flat round color="red" icon="fas fa-trash-alt" @click="deleteFile(mygallery)"></q-btn>
<q-btn v-if="canModify" flat round color="red" icon="fas fa-trash-alt" @click="deleteFile(mygallery)"></q-btn>
</q-bar>
<q-card
:id="mygallery._id" :class="getclass()"
:data-ind="index"
draggable="true"
:draggable="canModify"
@dragstart="onDragStart"
@drop="onDrop"
>
<q-img
:src="getsrcimg(mygallery)"
:class="getclimg()"
@click="ImgFullScreen(mygallery)"
:alt="mygallery.alt">
<div v-if="mygallery.description" class="absolute-bottom text-shadow">
<!-- <div class="text-h6 text-trans">{{ mygallery.description }} </div> -->
@@ -196,7 +200,9 @@
</q-card>
</div>
</div>
<div class="q-pa-sm">
<div
v-if="canModify"
class="q-pa-sm">
<div class="q-gutter-sm " style="max-height: 200px; width: 208px;">
<q-uploader
label="Aggiungi Immagine"
@@ -215,15 +221,27 @@
</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-btn v-if="canModify" flat label="Annulla" color="primary" v-close-popup/>
<q-btn v-if="canModify" label="salva" color="primary" v-close-popup @click="save"/>
<q-btn v-if="!canModify" label="Chiudi" color="primary" v-close-popup/>
</q-card-actions>
</q-card-section>
</q-card>
</q-dialog>
<q-dialog
v-model="fullscreen"
:maximized="false"
transition-show="slide-up"
transition-hide="slide-down"
>
<q-card class="my-card">
<q-img v-if="fullscreensrc" alt="fullscreen" :src="fullscreensrc" @click="fullscreen = false"></q-img>
</q-card>
</q-dialog>
</template>
<script lang="ts" src="./CGallery.ts">

View File

@@ -207,6 +207,20 @@ export default defineComponent({
refresh()
}
function canModifyThisRec(rec: any) {
// console.log('rec', rec)
if (rec.hasOwnProperty('userId')) {
let userId = rec.userId
if (userId === userStore.my._id) {
// E' il mio, quindi modificalo
return true
}
}
return false
// if (userStore.isAdmin || userStore.isManager)
// return true
}
// emulate 'SELECT count(*) FROM ...WHERE...'
function getRowsNumberCount(myfilter?: any) {
@@ -244,11 +258,27 @@ export default defineComponent({
if (searchList.value) {
searchList.value.forEach((item: ISearchList) => {
let myarr: ISearchList
let objitem: any = {}
if (item.value > 0) {
let myarr: ISearchList
let objitem: any = {}
objitem[item.key] = item.value
filtersearch.push(objitem)
} else if (item.arrvalue.length > 0) {
const myarr = item.arrvalue.filter((value) => value > 0)
let arr2: any = []
myarr.forEach((myval) => {
let objitem2: any = {}
objitem2[item.key] = myval
arr2.push(objitem2)
})
let obj2: any = {
$or: arr2
}
if (arr2.length > 0)
filtersearch.push(obj2)
}
})
}
@@ -272,7 +302,7 @@ export default defineComponent({
params.codeId = mycodeid.value
// console.log('params', params)
console.log('props.extraparams', props.extraparams)
// console.log('props.extraparams', props.extraparams)
params = { ...params, ...props.extraparams }
@@ -1029,6 +1059,7 @@ export default defineComponent({
globalStore,
searchList,
searchval,
canModifyThisRec,
}
}
})

View File

@@ -146,7 +146,8 @@
<q-select
v-if="item.type === costanti.FieldType.multiselect"
v-model="item.value"
v-model="item.arrvalue"
@update:model-value="searchval"
rounded
outlined
multiple
@@ -158,7 +159,7 @@
:options="globalStore.getTableJoinByName(item.table)"
style="min-width: 150px"
:option-value="fieldsTable.getKeyByTable(item.table)"
@update:model-value="searchval">
>
<template v-slot:option="{ itemProps, opt, selected, toggleOption }">
<q-item v-bind="itemProps">
@@ -167,7 +168,7 @@
<q-item-label>{{ opt[fieldsTable.getLabelByTable(item.table)] }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-toggle :model-value="selected" @update:value="toggleOption(opt)"/>
<q-toggle :model-value="selected" @update:model-value="toggleOption(opt)"/>
</q-item-section>
</q-item>
</template>
@@ -230,9 +231,11 @@
<span class="ellipsis"> {{ props.row[col_title] }} </span>
<q-space/>
<q-btn
v-if="canModifyThisRec(props.row)"
flat round color="white" icon="fas fa-pencil-alt" size="sm"
@click="clickFunz(props.row, prop_mycolumns.find((rec) => rec.action === lists.MenuAction.CAN_EDIT_TABLE))"></q-btn>
<q-btn
v-if="canModifyThisRec(props.row)"
flat round color="white" icon="fas fa-trash-alt" size="sm"
@click="clickFunz(props.row, prop_mycolumns.find((rec) => rec.action === lists.MenuAction.DELETE_RECTABLE))"></q-btn>
</q-bar>
@@ -255,6 +258,7 @@
<CMyPopupEdit
:table="mytable"
:canEdit="canEdit"
:canModify="canModifyThisRec(props.row)"
:disable="disabilita()"
:mycol="col"
v-model:row="props.row"

View File

@@ -28,6 +28,11 @@ export default defineComponent({
required: false,
default: true,
},
canModify: {
type: Boolean,
required: false,
default: false,
},
},
setup(props, { emit }) {
const $q = useQuasar()

View File

@@ -38,8 +38,9 @@
</form>
</q-card-section>
<q-card-actions v-if="showButtons" align="center">
<q-btn flat :label="$t('dialog.ok')" color="primary" @click="saveval"></q-btn>
<q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup @click="annulla"></q-btn>
<q-btn v-if="canModify" flat :label="$t('dialog.ok')" color="primary" @click="saveval"></q-btn>
<q-btn v-if="canModify" flat :label="$t('dialog.cancel')" color="primary" v-close-popup @click="annulla"></q-btn>
<q-btn v-if="!canModify" :label="$t('dialog.ok')" color="primary" v-close-popup></q-btn>
</q-card-actions>
</q-card>

View File

@@ -45,6 +45,11 @@ export default defineComponent({
required: false,
default: false,
},
canModify: {
type: Boolean,
required: false,
default: false,
},
isInModif: {
type: Boolean,
required: false,

View File

@@ -77,7 +77,9 @@
<CGallery
:title="getTitleGall()"
:directory="getDirectoryGall()"
:imgGall="myvalue" :edit="isviewfield()"
:imgGall="myvalue"
:edit="isviewfield()"
:canModify="canModify"
@showandsave="Savedb">
</CGallery>
</div>
@@ -89,6 +91,7 @@
:directory="getDirectoryGall()"
:imgGall="[{ imagefile: myvalue }]"
:edit="isviewfield()"
:canModify="canModify"
:single="isFieldDb()"
@update:imgGall="changevalRec"
@showandsave="Savedb">
@@ -320,6 +323,7 @@
<CMyEditor
v-model:value="myvalue" :title="col.title" @keyup.enter.stop
:showButtons="false"
:canModify="canModify"
@update:value="changevalRec"
@showandsave="Savedb">
</CMyEditor>
@@ -333,6 +337,7 @@
<q-card-section>
<CMyEditor
v-if="visueditor" v-model:value="myvalue" :title="col.title" @keyup.enter.stop
:canModify="canModify"
@showandsave="Savedb" @annulla="visueditor=false">
</CMyEditor>

View File

@@ -485,6 +485,7 @@ export interface ISearchList {
label: string
table: string
key: string
arrvalue: any[]
value: any
type: number
}