CGridTableRec + fields + page

pagine:
- Siti Web
- Operazioni
- Push...
This commit is contained in:
Paolo Arena
2021-09-19 20:07:28 +02:00
parent 622bd6943d
commit db4b06f67f
96 changed files with 2561 additions and 4328 deletions

View File

@@ -79,7 +79,7 @@ flat round color="white" icon="cancel" v-close-popup
<q-chip>
<q-avatar v-if="getWhereIcon(myevent.wherecode)">
<img
:src="`../../statics/images/avatar/` + getWhereIcon(myevent.wherecode)"
:src="`../../public/images/avatar/` + getWhereIcon(myevent.wherecode)"
alt="Località">
</q-avatar>
<q-avatar v-else color="blue" font-size="20px" text-color="white" icon="home">
@@ -831,7 +831,7 @@ size="md" type="a"
<q-chip>
<q-avatar v-if="getWhereIcon(event.wherecode)">
<img
:src="`../../statics/images/avatar/` + getWhereIcon(event.wherecode)"
:src="`../../public/images/avatar/` + getWhereIcon(event.wherecode)"
:alt="event.wherecode">
</q-avatar>
<q-avatar color="blue" font-size="20px" text-color="white" icon="home">

View File

@@ -1,4 +1,4 @@
import { defineComponent, PropType, ref, watch, toRef, onMounted } from 'vue'
import { defineComponent, PropType, ref, watch, toRef, onMounted, toRefs } from 'vue'
import { useI18n } from '@src/boot/i18n'
import { tools } from '../../store/Modules/tools'
@@ -81,12 +81,12 @@ export default defineComponent({
type: Object as PropType<IPagination>,
required: false,
default: () => {
return { sortBy: '', descending: false, page: 1, rowsNumber: 10, rowsPerPage: 10 }
return { sortBy: 'desc', descending: false, page: 1, rowsNumber: 10, rowsPerPage: 10 }
},
},
defaultnewrec: {
type: Function,
required: true,
required: false,
},
},
components: { CMyPopupEdit, CTitleBanner },
@@ -96,16 +96,18 @@ export default defineComponent({
const userStore = useUserStore()
const globalStore = useGlobalStore()
const mypagination = toRef(props, 'pagination')
const addRow = ref('Aggiungi')
const newRecordBool = ref(false)
const newRecord: any = ref({})
const savenewRec = ref(false)
const mytable = ref('')
const mytitle = ref('')
const mycolumns = ref([])
const colkey = ref('')
const mytable = toRef(props, 'prop_mytable')
const mytitle = toRef(props, 'prop_mytitle')
const mycolumns = toRef(props, 'prop_mycolumns')
const colkey = toRef(props, 'prop_colkey')
const search = ref('')
const tablesel = ref('')
@@ -138,8 +140,6 @@ export default defineComponent({
const mycodeid = toRef(props, 'prop_codeId')
const mypag = toRef(props, 'pagination')
// emulate 'SELECT count(*) FROM ...WHERE...'
function getRowsNumberCount(myfilter?: any) {
@@ -206,9 +206,9 @@ export default defineComponent({
emit('savefilter', myfilterand)
}
function onRequest(myprops: any) {
function onRequest() {
// console.log('onRequest', 'myfilter = ', myfilter)
const { page, rowsPerPage, rowsNumber, sortBy, descending } = myprops.pagination
const { page, rowsPerPage, rowsNumber, sortBy, descending } = mypagination.value
const myfilternow = myfilter.value
const myfilterandnow = myfilterand.value
@@ -235,9 +235,9 @@ export default defineComponent({
serverData.value = []
// fetch data from "server"
fetchFromServer(startRow, endRow, myfilternow, myfilterandnow, sortBy, descending).then((ris: any) => {
return fetchFromServer(startRow, endRow, myfilternow, myfilterandnow, sortBy, descending).then((ris: any) => {
myprops.pagination.rowsNumber = getRowsNumberCount(myfilter)
mypagination.value.rowsNumber = getRowsNumberCount(myfilter)
// clear out existing data and add new
if (returnedData.value === []) {
@@ -252,10 +252,10 @@ export default defineComponent({
// console.log('serverData', serverData)
// don't forfunction to update local pagination object
myprops.pagination.page = page
myprops.pagination.rowsPerPage = rowsPerPage
myprops.pagination.sortBy = sortBy
myprops.pagination.descending = descending
mypagination.value.page = page
mypagination.value.rowsPerPage = rowsPerPage
mypagination.value.sortBy = sortBy
mypagination.value.descending = descending
// console.log('pagination', pagination)
@@ -267,9 +267,7 @@ export default defineComponent({
function refresh_table() {
onRequest({
pagination: props.pagination
})
onRequest()
rowclicksel.value = null
}
@@ -410,18 +408,6 @@ export default defineComponent({
}
function created() {
console.log('created')
// serverData = mylist.slice() // [{ chiave: 'chiave1', valore: 'valore 1' }]
mytable.value = props.prop_mytable
mytitle.value = props.prop_mytitle
mycolumns.value = props.prop_mycolumns
colkey.value = props.prop_colkey
changeTable(false)
}
function updatedcol() {
// console.log('updatedcol')
if (mycolumns.value) {
@@ -444,7 +430,7 @@ export default defineComponent({
}
function getrows() {
return props.pagination.rowsNumber
return mypagination.value.rowsNumber
}
async function createNewRecordDialog() {
@@ -472,7 +458,7 @@ export default defineComponent({
async function createNewRecord() {
loading.value = true
const mydata = {
const mydata: any = {
table: mytable,
data: {}
}
@@ -487,7 +473,7 @@ export default defineComponent({
const data = await globalStore.saveTable(mydata)
serverData.value.push(data)
mypag.value.rowsNumber++
mypagination.value.rowsNumber++
loading.value = false
}
@@ -639,7 +625,7 @@ export default defineComponent({
}
function changefuncAct(newval: any) {
if (!disabilita) {
if (!disabilita()) {
tools.setCookie(tools.CAN_EDIT, newval)
}
}
@@ -733,7 +719,6 @@ export default defineComponent({
onMounted(mounted)
created()
return {
selItem,
@@ -773,6 +758,13 @@ export default defineComponent({
colExtra,
colclicksel,
selected,
mypagination,
loading,
onRequest,
serverData,
myfilter,
disabilita,
newRecordBool,
}
}
})

View File

@@ -12,10 +12,10 @@
flat
bordered
class="my-sticky-header-table"
:data="serverData"
:rows="serverData"
:columns="mycolumns"
:filter="myfilter"
v-model:pagination="pagination"
v-model:pagination="mypagination"
:row-key="colkey"
:loading="loading"
@request="onRequest"
@@ -137,7 +137,7 @@
<div :class="getclrow(props.row)">
<CMyPopupEdit
:canEdit="canEdit"
:disable="disabilita"
:disable="disabilita()"
:col="col"
v-model:row="props.row"
:field="col.field"
@@ -198,7 +198,7 @@
@click="colclicksel = mycol">
<CMyPopupEdit
:canEdit="true"
:disable="disabilita"
:disable="disabilita()"
view="field"
:col="mycol"
:showall="true"

View File

@@ -1,6 +1,6 @@
<template>
<div>
<q-parallax :src="getsrc" :height="tools.myheight_imgtitle(myheight, myheightmobile)">
<q-parallax :src="getsrc()" :height="tools.myheight_imgtitle(myheight, myheightmobile)">
<h1 class="text-white title" style="text-align: center" >{{title}}</h1>
<div v-if="legendinside" class="mylegendinside absolute-bottom custom-caption" style="text-align: center" v-html="legendinside"></div>
</q-parallax>

View File

@@ -180,18 +180,18 @@ export default defineComponent({
return visuValByType(myvalue.value)
}
function savefield(value: any, initialval: any) {
function savefield(value: any, initialval: any, myq: any) {
myvalue.value = value
setValDb(props.mykey, myvalue.value, props.type, props.serv, props.table, props.mysubkey, props.id)
setValDb(myq, props.mykey, myvalue.value, props.type, props.serv, props.table, props.mysubkey, props.id)
}
function savefieldboolean(value: any) {
function savefieldboolean($q: any, value: any) {
if (myvalue.value === undefined)
myvalue.value = 'true'
else
myvalue.value = value
setValDb(props.mykey, myvalue, props.type, props.serv, props.table, props.mysubkey, props.id)
setValDb($q, props.mykey, myvalue, props.type, props.serv, props.table, props.mysubkey, props.id)
}
function selectcountry({ name, iso2, dialCode }: { name: string, iso2: string, dialCode: string }) {
@@ -227,7 +227,7 @@ export default defineComponent({
onInput,
tools,
costanti,
myq: $q,
}
},
})

View File

@@ -109,7 +109,7 @@
<div v-else-if="type === costanti.FieldType.boolean">
<q-toggle
dark color="green" v-model="myvalue" :label="col.title"
@input="savefieldboolean"></q-toggle>
@input="savefieldboolean($q)"></q-toggle>
</div>
<div v-else>
<div v-html="myvalprinted()"></div>
@@ -120,19 +120,20 @@
v-model="myvalue"
:disable="col.disable"
:title="col.title"
@save="savefield"
@save="(val, initialValue) => savefield(val, initialValue, myq)"
buttons
v-slot="scope"
>
<div v-if="type === costanti.FieldType.boolean">
<q-checkbox v-model="myvalue" :label="col.title">
<q-checkbox v-model="scope.value" :label="col.title">
</q-checkbox>
<div v-html="visuValByType(myvalue)">
</div>
</div>
<div v-else-if="type === costanti.FieldType.string">
<q-input
v-model="myvalue"
v-model="scope.value"
autogrow
@keyup.enter.stop
autofocus>
@@ -141,16 +142,17 @@
</div>
<div v-else-if="type === costanti.FieldType.password">
<q-input
v-model="myvalue"
v-model="scope.value"
type="password"
@keyup.enter.stop
@keyup.enter="scope.set"
autofocus>
</q-input>
</div>
<div v-else-if="type === costanti.FieldType.number">
<q-input
v-model="myvalue" type="number"
v-model="scope.value" type="number"
@keyup.enter="scope.set"
autofocus>
</q-input>
@@ -194,6 +196,7 @@
:readonly="true"
rounded dense
debounce="1000"
@keyup.enter="scope.set"
:label="title">
<template v-slot:prepend>
@@ -246,7 +249,7 @@
<!--
<q-select
v-model="myvalue"
v-model="scope.value"
rounded
dense
outlined

View File

@@ -8,12 +8,10 @@ import { Footer } from '@/components/Footer'
import { CImgTitle } from '../CImgTitle/index'
import { CTitle } from '../CTitle/index'
import MixinsMetaTags from '../../mixins/mixin-metatags'
export default defineComponent({
name: 'CMyPage',
components: { Footer, CImgTitle, CTitle },
mixins: [MixinsMetaTags],
props: {
title: String,
mypath: {

View File

@@ -31,8 +31,8 @@
<div v-else>
<div v-if="!!title">
<CTitle
v-if="imgbackground" :imgbackground="imgbackground"
:headtitle="title" :sizes="sizes" :styleadd="styleadd"></CTitle>
v-if="imgbackground" :imgbackground="imgbackground"
:headtitle="title" :sizes="sizes" :styleadd="styleadd"></CTitle>
<div v-if="!imgbackground">
<CImgTitle v-if="img" :src="img" :title="title">
</CImgTitle>

View File

@@ -256,7 +256,6 @@
<!--</q-dialog>-->
</div>
myvalue: {{ myvalue}}
<q-popup-edit
v-if="canEdit && col.fieldtype !== costanti.FieldType.html"
v-model="myvalue"
@@ -265,16 +264,17 @@
buttons
persistent
@save="SaveValueInt"
@show="OpenEdit">
@show="OpenEdit"
v-slot="scope">
<div v-if="col.fieldtype === costanti.FieldType.boolean">
<q-checkbox v-model="myvalue" :label="col.title">
<q-checkbox v-model="scope.value" :label="col.title">
</q-checkbox>
{{ visuValByType(myvalue, col, row) }}
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.string">
<q-input
v-model="myvalue"
v-model="scope.value"
autogrow
@keyup.enter.stop
autofocus>
@@ -283,23 +283,23 @@
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.password">
<q-input
v-model="myvalue"
v-model="scope.value"
type="password"
@keyup.enter.stop
@keyup.enter="scope.set"
autofocus>
</q-input>
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.number">
<q-input
v-model="myvalue" type="number"
v-model="scope.value" type="number"
autofocus>
</q-input>
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.hours">
<q-input
v-model="myvalue" type="number"
v-model="scope.value" type="number"
autofocus>
</q-input>
@@ -334,14 +334,14 @@
<template v-slot:prepend>
<div style="font-size: 1rem;">
<vue-country-code
<!--<vue-country-code
:defaultCountry="myvalue"
:disabledFetchingCountry="true"
@onSelect="selectcountry"
:preferredCountries="tools.getprefCountries"
:dropdownOptions="{ disabledDialCode: true }">
</vue-country-code>
</vue-country-code>-->
</div>
</template>
</q-input>
@@ -352,7 +352,7 @@
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.intcode">
<vue-tel-input
<!-- <vue-tel-input
@country-changed="intcode_change"
:value="myvalue"
@input="oninput"
@@ -361,13 +361,14 @@
inputClasses="clCell"
wrapperClasses="clCellCode">
</vue-tel-input>
-->
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.multiselect">
<div>join: {{ col.jointable }}</div>
<q-select
v-model="myvalue"
v-model="scope.value"
rounded
outlined
multiple

View File

@@ -117,7 +117,7 @@ v-else class="cltexth3 text-center boldhigh"
<q-chip>
<q-avatar v-if="getWhereIcon(myevent.wherecode)">
<img
:src="`../../statics/images/avatar/` + getWhereIcon(myevent.wherecode)"
:src="`../../public/images/avatar/` + getWhereIcon(myevent.wherecode)"
alt="località">
</q-avatar>
<q-avatar

View File

@@ -56,7 +56,7 @@ h4 {
right: 0;
bottom: 0;
z-index: -1;
//background: #000 url(../../statics/images/cover.jpg) 50%;
//background: #000 url(../../public/images/cover.jpg) 50%;
background-size: cover
}

View File

@@ -51,6 +51,7 @@ export default defineComponent({
return {
getsrc,
getaltimg,
tools,
}
},
})

View File

@@ -1,28 +1,28 @@
<template>
<div>
<q-img
v-if="imgbackground" :src="getsrc" :alt="getaltimg"
:style="tools.styles_imgtitle(sizes)">
<div>
<q-img
v-if="imgbackground" :src="getsrc()" :alt="getaltimg()"
:style="tools.styles_imgtitle(sizes)">
<div class="absolute-bottom text-body1 text-center" :style="styleadd">
<h1 class="titletext" v-html="headtitle"></h1>
</div>
</q-img>
<div class="absolute-bottom text-body1 text-center" :style="styleadd">
<h1 class="titletext" v-html="headtitle"></h1>
</div>
</q-img>
<!--
<q-parallax :height="tools.myheight_imgtitle()" :width="tools.mywidth_imgtitle()">
<template v-slot:media>
<img :src="imgbackground" class="cltitlebg">
</template>
<h2 class="titletext">{{headtitle}}</h2>
</q-parallax>
-->
<!--
<q-parallax :height="tools.myheight_imgtitle()" :width="tools.mywidth_imgtitle()">
<template v-slot:media>
<img :src="imgbackground" class="cltitlebg">
</template>
<h2 class="titletext">{{headtitle}}</h2>
</q-parallax>
-->
</div>
</div>
</template>
<script lang="ts" src="./CTitle.ts">
</script>
<style lang="scss" scoped>
@import './CTitle.scss';
@import './CTitle.scss';
</style>

View File

@@ -1,6 +1,6 @@
<template>
<div>
<q-header reveal elevated :class="getClassColorHeader">
<q-header reveal elevated :class="getClassColorHeader()">
<q-toolbar
color="primary"
:glossy="$q.theme === 'mat'"
@@ -31,7 +31,7 @@
<q-btn
ripple
size="md"
id="newvers" v-if="isNewVersionAvailable" color="secondary" rounded icon="refresh"
id="newvers" v-if="isNewVersionAvailable()" color="secondary" rounded icon="refresh"
class="btnNewVersShow" @click="RefreshApp()" :label="t('notification.newVersionAvailable')">
</q-btn>