- Fixed pagination not refreshing the data...

- Start creating single page of an Event
This commit is contained in:
Paolo Arena
2019-11-06 22:28:45 +01:00
parent 571e948d39
commit 7fe6b5fb6a
16 changed files with 112 additions and 96 deletions

View File

@@ -36,6 +36,7 @@ export default class CCard extends Vue {
name: '',
surname: '',
qualification: '',
usertelegram: '',
disciplines: '',
certifications: '',
img: '',

View File

@@ -22,16 +22,27 @@
<q-icon class="flex-icon" name="mobile_friendly"></q-icon>
<span class="q-mx-sm">{{myop.cell}}</span>
<q-btn fab-mini icon="fab fa-whatsapp"
color="green" type="a"
size="xs"
<div class="row justify-center q-gutter-xs ">
<q-btn v-if="myop.email" fab-mini icon="fas fa-envelope"
color="blue-grey-6" type="a"
size="xs"
:href="tools.getemailto(myop.email)" target="__blank">
</q-btn>
<q-btn v-if="tools.getHttpForWhatsapp(myop.cell)" fab-mini icon="fab fa-whatsapp"
color="green" type="a"
size="xs"
:href="tools.getHttpForWhatsapp(myop.cell)" target="__blank">
</q-btn>
:href="tools.getHttpForWhatsapp(myop.cell)" target="__blank">
</q-btn>
<q-btn v-if="tools.getHttpForTelegram(myop.usertelegram)" fab-mini icon="fab fa-telegram"
color="blue" type="a"
size="xs"
:href="tools.getHttpForTelegram(myop.usertelegram)" target="__blank">
</q-btn>
</div>
</div>
<div class="op__email">
<q-icon class="flex-icon" name="contact_mail"> </q-icon>&nbsp;
<q-icon class="flex-icon" name="contact_mail"></q-icon>&nbsp;
<a :href="tools.getemailto(myop.email)" target="_blank">{{myop.email}}
</a>
</div>

View File

@@ -1,5 +1,5 @@
import Vue from 'vue'
import { Component, Prop, Watch } from 'vue-property-decorator'
import { Component, Mixins, Prop, Watch } from 'vue-property-decorator'
import { CalendarStore, UserStore } from '@store'
import { Logo } from '../../components/logo/index'
@@ -31,16 +31,17 @@ import { lists } from '../../store/Modules/lists'
import { GlobalStore, MessageStore } from '../../store/Modules'
import { IMessagePage, IMessage, IIdentity, MsgDefault } from '../../model'
import MixinUsers from '../../mixins/mixin-users'
import { CDateTime } from '../CDateTime'
import MixinOperator from '../../mixins/mixin-operator'
import MixinEvents from '../../mixins/mixin-events'
import { CDateTime } from '../CDateTime'
import { CMyAvatar } from '../CMyAvatar'
@Component({
mixins: [MixinOperator, MixinUsers],
mixins: [MixinOperator, MixinUsers, MixinEvents],
name: 'CEventsCalendar',
components: { Logo, Footer, CTitle, CImgText, QDateTimeScroller, QDateScroller, CMySelect, CMyEditor, CDateTime, CMyAvatar }
})
export default class CEventsCalendar extends Vue {
export default class CEventsCalendar extends MixinEvents {
public $q
public $t: any
public calendarView = 'month'
@@ -48,6 +49,7 @@ export default class CEventsCalendar extends Vue {
public formDefault: IEvents = {
title: '',
details: '',
bodytext: '',
dateTimeStart: tools.getstrYYMMDDDateTime(tools.getDateNow()),
dateTimeEnd: tools.getstrYYMMDDDateTime(tools.getDateNow()),
icon: '',
@@ -284,9 +286,6 @@ export default class CEventsCalendar extends Vue {
return (CalendarStore.state.intervalRange.max - CalendarStore.state.intervalRange.min) * (1 / CalendarStore.state.intervalRangeStep)
}
get editable() {
return CalendarStore.state.editable
}
get containerStyle() {
const styles = { height: '' }
@@ -851,17 +850,6 @@ export default class CEventsCalendar extends Vue {
return await CalendarStore.actions.BookEvent(eventparam)
}
public isAlreadyBooked(eventparam: IEvents) {
return CalendarStore.getters.findEventBooked(eventparam, true)
}
public getImgEvent(event: IEvents) {
if (!!event.img)
return '../../statics/' + event.img
else
return '../../statics/images/noimg.png'
}
get getContribTypeArr() {
return CalendarStore.state.contribtype
}
@@ -874,15 +862,6 @@ export default class CEventsCalendar extends Vue {
return CalendarStore.state.wheres
}
public isShowPrice(event: IEvents) {
const rec = CalendarStore.getters.getContribtypeRec(event.contribtype)
return (rec) ? rec.showprice : true
}
public getContribtypeById(id) {
return CalendarStore.getters.getContribtypeById(id)
}
public createContribType(value) {
console.log('createContribType', value)
tools.createNewRecord(this, 'contribtype', { label: value }).then((myrec) => {
@@ -897,26 +876,6 @@ export default class CEventsCalendar extends Vue {
return this.dateFormatter.format(mydate)
}
public getPrice(event: IEvents) {
let myprice = (event.price > 0) ? event.price + ' €' : ''
myprice = (event.price === -1) ? this.$t('event.askinfo') : myprice
if (event.infoafterprice)
myprice += ' ' + event.infoafterprice
return myprice
}
public getWhereIcon(where) {
const whererec = CalendarStore.getters.getWhereRec(where)
return (whererec) ? whererec.whereicon : ''
}
public getWhereName(where) {
const whererec = CalendarStore.getters.getWhereRec(where)
return (whererec) ? whererec.placename : ''
}
public badgeClasses(eventparam, type) {
const cssColor = tools.isCssColor(eventparam.bgcolor)
const isHeader = type === 'header'
@@ -1027,22 +986,8 @@ export default class CEventsCalendar extends Vue {
return eventsloc
}
public isEventEnabled(myevent) {
// check if event is in the past
const datenow = tools.addDays(tools.getDateNow(), -1)
// console.log('datenow', datenow, 'end', myevent.dateTimeEnd)
return (new Date(myevent.dateTimeEnd) >= datenow)
}
public getTitleEv(event: IEvents) {
return (!!event.short_tit) ? event.short_tit : event.title
}
public getStyleByEvent(event: IEvents) {
if (event === this.myevent) {
return 'border: inset; border-color: darkblue; border-width: 3px; padding: 5px !important; '
}
}
}

View File

@@ -74,7 +74,7 @@
<q-avatar v-if="getWhereIcon(myevent.wherecode)">
<img :src="`../../statics/images/avatar/` + getWhereIcon(myevent.wherecode)">
</q-avatar>
<q-avatar color="blue" font-size="20px" text-color="white" icon="home">
<q-avatar v-else color="blue" font-size="20px" text-color="white" icon="home">
</q-avatar>
<span class="cal__teacher-content">{{getWhereName(myevent.wherecode)}}</span>
</q-chip>
@@ -528,8 +528,8 @@
<div class="listaev__align_chips">
<img :src="getImgEvent(event)"
@click="selectEvent(event)"
class="text-left padding_cell listaev__tdimg listaev__img cursor-pointer"
:style="getStyleByEvent(event)">
class="text-left padding_cell listaev__tdimg listaev__img cursor-pointer q-mx-sm"
:style="getStyleByEvent(event, event === myevent)">
<q-chip dense v-if="isAlreadyBooked(event)" class="cltexth4 chipbooked shadow-5 q-mb-md"
color="green" text-color="white"
icon="event_available">{{$t('cal.booked')}}
@@ -587,16 +587,25 @@
</q-btn>
<!-- altrimenti mostra solo Chip -->
<div v-else>
<div v-if="tools.isMobile()" class="cltexth3 text-center"
:style="`background-color: ${event.bgcolor} !important; color: white !important;`">
{{event.title}}
</div>
<q-chip v-else class="cltexth3 text-center"
:style="`background-color: ${event.bgcolor} !important; color: white !important;`"
text-color="white"
:icon="event.icon"
dense>{{event.title}}
</q-chip>
<q-btn size="md" type="a"
:to="`/event/` + event._id"
target="_blank"
:style="`background-color: ${event.bgcolor} !important; color: white !important;`"
ripple rounded
:label="event.title" :icon="event.icon"
:color="event.bgcolor" text-color="white" glossy>
</q-btn>
<!--<div v-if="tools.isMobile()" class="cltexth3 text-center"-->
<!--:style="`background-color: ${event.bgcolor} !important; color: white !important;`">-->
<!--{{event.title}}-->
<!--</div>-->
<!--<q-chip v-else class="cltexth3 text-center"-->
<!--:style="`background-color: ${event.bgcolor} !important; color: white !important;`"-->
<!--text-color="white"-->
<!--:icon="event.icon"-->
<!--dense>{{event.title}}-->
<!--</q-chip>-->
</div>
</div>

View File

@@ -180,6 +180,10 @@ export default class CGridTableRec extends Vue {
const startRow = (page - 1) * rowsPerPage
const endRow = startRow + fetchCount
console.log('startRow', startRow)
this.serverData = []
// fetch data from "server"
this.fetchFromServer(startRow, endRow, filter, sortBy, descending).then((ris) => {
@@ -189,12 +193,14 @@ export default class CGridTableRec extends Vue {
if (this.returnedData === []) {
this.serverData = []
} else {
if (this.serverData.length > 0)
this.serverData.splice(0, this.serverData.length, ...this.returnedData)
else
this.serverData = [...this.returnedData]
// if (this.serverData.length > 0)
// this.serverData.splice(0, this.serverData.length, ...this.returnedData)
// else
this.serverData = [...this.returnedData]
}
console.log('this.serverData', this.serverData)
// don't forget to update local pagination object
this.pagination.page = page
this.pagination.rowsPerPage = rowsPerPage
@@ -358,7 +364,7 @@ export default class CGridTableRec extends Vue {
// console.log('this.filter', this.filter)
this.onRequest({
pagination: this.pagination,
pagination: this.pagination
})
}

View File

@@ -42,6 +42,11 @@ export default class Footer extends Vue {
return GlobalStore.getters.getValueSettingsByKey('WHATSAPP_CELL')
}
get Telegram_UsernameHttp() {
return tools.getHttpForTelegram(GlobalStore.getters.getValueSettingsByKey('TELEGRAM_USERNAME'))
}
get FBPage() {
const fb = GlobalStore.getters.getValueSettingsByKey('URL_FACEBOOK')
return fb

View File

@@ -35,7 +35,9 @@
<span v-for="rec in getarrValDb('CONTACTS_EMAIL_CELL')">
{{ rec.name }}: {{ rec.phone }}
<a v-if="!!tools.getHttpForWhatsapp(rec.phone)" :href="tools.getHttpForWhatsapp(rec.phone)" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-whatsapp icon_contact links"></i></a>
<i aria-hidden="true" class="q-icon fab fa-whatsapp icon_contact links q-mx-xs"></i></a>
<a v-if="!!tools.getHttpForTelegram(rec.usertelegram)" :href="tools.getHttpForTelegram(rec.usertelegram)" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact links q-mx-xs"></i></a>
<br>
<i v-if="rec.email" aria-hidden="true"
class="q-icon fas fa-envelope q-mx-sm"></i> <a :href="`mailto:`+ rec.email "
@@ -68,6 +70,9 @@
<a v-if="!!Whatsapp_Cell" :href="ChatWhatsapp" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-whatsapp icon_contact links"></i></a>
<a v-if="!!Telegram_UsernameHttp" :href="Telegram_UsernameHttp" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact links"></i></a>
<!--<a href="" target="_blank"><i aria-hidden="true" class="q-icon fab fa-github"> </i></a>-->
<!--<a href="https://twitter.com/" target="_blank"><i aria-hidden="true" class="q-icon fab fa-twitter"> </i></a>-->