- Table of Disciplines #101

- Insert Facebook bar to the Site #97

src/components/CCardDiscipline/CCardDiscipline.scss

@@ -0,0 +1,84 @@
+$heightBtn: 100%;
+$grayshadow: #555;
+
+.text-subtitle-carica {
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+  text-shadow: .1rem .1rem .1rem $grayshadow;
+}
+
+.text-subtitle-certificato {
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+@media (max-width: 718px) {
+  // PER VERSIONE MOBILE
+  .text-subtitle-carica {
+    font-size: 1rem;
+  }
+}
+
+.my-card-discipline {
+  width: 100%;
+  max-width: 350px;
+  min-width: 300px;
+  padding: 1rem 1rem;
+
+  box-shadow: none;
+  border-radius: 20px;
+  margin: 1rem 1rem;
+  transition: transform .2s ease-out;
+}
+
+.my-card-discipline:hover {
+  transition: transform .2s ease-in;
+  transform: scale(1.03);
+}
+
+.disc {
+  text-align: center !important;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+  text-shadow: .1rem .1rem .1rem $grayshadow;
+
+  &__title {
+    //color: white;
+    text-shadow: .125rem .125rem .125rem #2d2260;
+  }
+
+  &__cell {
+    font-size: 1rem;
+    color: red;
+  }
+
+  &__email {
+    font-size: 1rem;
+    color: #3b5998;
+  }
+
+  &__description {
+    font-size: 1rem;
+    color: #000000;
+  }
+
+  &__email a {
+    text-decoration: none;
+  }
+
+}
+
+.myimg {
+  border-radius: 30px !important;
+  margin: 30px auto 10px;
+}
+
+.q-img {
+  &__image {
+    border-radius: 30px !important;
+  }
+}

src/components/CCardDiscipline/CCardDiscipline.ts

@@ -0,0 +1,21 @@
+import Vue from 'vue'
+import { Component, Prop, Watch } from 'vue-property-decorator'
+
+import { tools } from '../../store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { IDiscipline } from '../../model'
+import MixinBase from '../../mixins/mixin-base'
+
+@Component({
+  mixins: [MixinBase],
+  name: 'CCardDiscipline'
+})
+
+export default class CCardDiscipline extends Vue {
+  @Prop({ required: true }) public discipline: IDiscipline
+
+  public getNextLesson(typol) {
+    // Get next lesson
+    return ''
+  }
+}

src/components/CCardDiscipline/CCardDiscipline.vue

@@ -0,0 +1,35 @@
+<template>
+    <q-card class="my-card-discipline text-center fa-border inset-shadow">
+        <q-img :src="`statics/` + discipline.img_small" class="myimg">
+            <div class="absolute-bottom text-spacetrans">
+                <q-btn rounded :to="discipline.linkpage">
+                    <div class="text-h4 text-trans disc__title shadow-max">{{discipline.label}}</div>
+                </q-btn>
+            </div>
+        </q-img>
+
+        <q-card-section>
+            <div class="disc__description">{{discipline.description}}</div>
+        </q-card-section>
+
+        <q-card-section v-if="getNextLesson(discipline.typol_code)">
+            <i class="icon ion-calendar"></i> Prossima Lezione:
+            <div class="disc__description">{{getNextLesson(discipline.typol_code)}}</div>
+        </q-card-section>
+
+        <q-btn rounded size="sm" color="primary" :to="discipline.linkpage">Leggi tutto</q-btn>
+
+
+        <!--<q-card-section>-->
+        <!--<div class="text-subtitle3">{{myop.disciplines}}</div>-->
+        <!--{{myop.info}}-->
+        <!--</q-card-section>-->
+    </q-card>
+</template>
+
+<script lang="ts" src="./CCardDiscipline.ts">
+</script>
+
+<style lang="scss" scoped>
+    @import './CCardDiscipline.scss';
+</style>

src/components/CCardDiscipline/index.ts

@@ -0,0 +1 @@
+export {default as CCardDiscipline} from './CCardDiscipline.vue'

src/components/CEventsCalendar/CEventsCalendar.ts

@@ -890,6 +890,10 @@ export default class CEventsCalendar extends MixinEvents {
     return CalendarStore.state.wheres
   }
 
+  get getDisciplines() {
+    return GlobalStore.state.disciplines
+  }
+
   public createContribType(value) {
     console.log('createContribType', value)
     tools.createNewRecord(this, 'contribtype', { label: value }).then((myrec) => {

src/components/CEventsCalendar/CEventsCalendar.vue

@@ -122,6 +122,12 @@
                             v-if="contextDay"
                             ref='myevent'
                             class="q-gutter-sm">
+
+                        <CMySelect :label="$t('event.typol')" :value.sync="eventForm.typol" optval="typol_code"
+                                   optlab="label"
+                                   :options="getDisciplines" :useinput="false">
+                        </CMySelect>
+
                         <q-input color="grey-1" v-model="eventForm.short_tit" autofocus
                                  :input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `"
                                  borderless rounded dense :label="$t('event.short_tit')"
@@ -133,6 +139,7 @@
                                  :rules="[v => v && v.length > 0 || $t('event.notempty')]"></q-input>
 
 
+
                         <q-tabs
                                 v-model="tabeditor"
                                 dense

src/components/CFacebookFrame/CFacebookFrame.ts

@@ -0,0 +1,25 @@
+import Vue from 'vue'
+import { Component, Prop, Watch } from 'vue-property-decorator'
+import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+
+import { date } from 'quasar'
+import { CalendarStore } from '../../store/Modules'
+import MixinBase from '../../mixins/mixin-base'
+
+@Component({
+  name: 'CFacebookFrame',
+  mixins: [MixinBase]
+})
+
+export default class CFacebookFrame extends Vue {
+  public $q
+  public $t
+  @Prop({ required: true }) public urlfbpage: string
+  @Prop({ required: true }) public title: string
+  @Prop({ required: false, default: '' }) public myclass: string
+
+  public geturlfbpageEncoded() {
+    return encodeURIComponent(this.urlfbpage)
+  }
+}

src/components/CFacebookFrame/CFacebookFrame.vue

@@ -0,0 +1,22 @@
+<template>
+    <div v-if="urlfbpage" :class="myclass">
+        <!--<div class="fb-page" :data-href="urlfbpage" data-tabs="timeline"-->
+        <!--data-width="" data-height="" data-small-header="false" data-adapt-container-width="true"-->
+        <!--data-hide-cover="false" data-show-facepile="true">-->
+        <!--<blockquote :cite="urlfbpage" class="fb-xfbml-parse-ignore"><a-->
+        <!--:href="urlfbpage">{{title}}</a>-->
+        <!--</blockquote>-->
+        <!--</div>-->
+
+        <iframe :src="`https://www.facebook.com/plugins/page.php?href=`+geturlfbpageEncoded()+`&tabs=timeline&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId=164292303671962`"
+                width="340" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0"
+                allowTransparency="true" allow="encrypted-media"></iframe>
+    </div>
+</template>
+
+<script lang="ts" src="./CFacebookFrame.ts">
+</script>
+
+<style lang="scss" scoped>
+    @import './CFacebookFrame.scss';
+</style>

src/components/CFacebookFrame/index.ts

@@ -0,0 +1 @@
+export {default as CFacebookFrame} from './CFacebookFrame.vue'

src/components/CGridTableRec/CGridTableRec.ts

@@ -97,7 +97,7 @@ export default class CGridTableRec extends Vue {
   }
 
   public SaveValue(newVal, valinitial) {
-    console.log('SaveValue', newVal, 'rowsel', this.rowsel)
+    // console.log('SaveValue', newVal, 'rowsel', this.rowsel)
 
     // Update value in table memory
     if (this.colsel.subfield !== '') {

src/components/CMyPopupEdit/CMyPopupEdit.ts

@@ -52,13 +52,13 @@ export default class CMyPopupEdit extends Vue {
   }
 
   public OpenEdit() {
-    console.log('OpenEdit')
+    // console.log('OpenEdit')
     this.$emit('show')
   }
 
   public SaveValueInt(newVal, valinitial) {
 
-    console.log('SaveValueInt', newVal)
+    // console.log('SaveValueInt', newVal)
 
     // Update value in table memory
     if (this.subfield !== '') {

src/components/Header/Header.vue

@@ -128,7 +128,6 @@
 
         </q-drawer>
 
-
         <!-- USER BAR -->
         <q-drawer v-if="static_data.functionality.SHOW_USER_MENU" v-model="rightDrawerOpen" side="right" elevated>
             <div id="profile">

src/components/index.ts

@@ -3,6 +3,7 @@ export * from './todos'
 export * from './logo'
 export * from './CProgress'
 export * from './CCard'
+export * from './CCardDiscipline'
 export * from './CBook'
 export * from './CMyPage'
 export * from './CTitle'
@@ -25,4 +26,5 @@ export * from './BannerCookies'
 export * from './PagePolicy'
 export * from './FormNewsletter'
 export * from './CGridTableRec'
+export * from './CFacebookFrame'
 export * from './Shen/CTesseraElettronica'

src/model/GlobalStore.ts

@@ -34,6 +34,25 @@ export interface ISettings {
   value_num?: number
 }
 
+export interface ITeachUname {
+  username?: string
+}
+
+export interface IDiscipline {
+  typol_code?: string
+  order?: number
+  label?: string
+  description?: string
+  linkpage?: string
+  color?: string
+  icon?: string
+  img_small?: string
+  showinhome?: boolean
+  showinnewsletter?: boolean
+  img?: string
+  teachers?: ITeachUname[]
+}
+
 export interface ITestp1 {
   contatore: number
   mioarray: ICfgServer[]
@@ -76,6 +95,7 @@ export interface IGlobalState {
   arrConfig: IConfig[]
   lastaction: IAction
   settings: ISettings[],
+  disciplines: IDiscipline[],
 }
 
 export interface IMenuList {

src/store/Modules/GlobalStore.ts

@@ -68,7 +68,8 @@ const state: IGlobalState = {
     type: 0,
     _id: 0
   },
-  settings: []
+  settings: [],
+  disciplines: []
 }
 
 async function getConfig(id) {
@@ -163,6 +164,8 @@ namespace Getters {
       return CalendarStore.state.wheres
     else if (table === 'contribtype')
       return CalendarStore.state.contribtype
+    else if (table === 'disciplines')
+      return GlobalStore.state.disciplines
     else if (table === 'bookings')
       return CalendarStore.state.bookedevent
     else if (table === 'users')
@@ -690,6 +693,7 @@ namespace Actions {
         CalendarStore.state.wheres = (res.data.wheres) ? res.data.wheres : []
         CalendarStore.state.contribtype = (res.data.contribtype) ? res.data.contribtype : []
         GlobalStore.state.settings = (res.data.settings) ? [...res.data.settings] : []
+        GlobalStore.state.disciplines = (res.data.disciplines) ? [...res.data.disciplines] : []
 
         CalendarStore.state.editable = UserStore.state.isAdmin || UserStore.state.isManager
 

src/store/Modules/fieldsTable.ts

@@ -53,6 +53,22 @@ const colcontribtype = [
   AddCol(DeleteRec)
 ]
 
+const coldisciplines = [
+  AddCol({ name: 'typol_code', label_trans: 'disc.typol_code' }),
+  AddCol({ name: 'order', label_trans: 'disc.order', fieldtype: tools.FieldType.number  }),
+  AddCol({ name: 'label', label_trans: 'event.title' }),
+  AddCol({ name: 'description', label_trans: 'proj.longdescr' }),
+  AddCol({ name: 'linkpage', label_trans: 'event.linkpage' }),
+  AddCol({ name: 'color', label_trans: 'event.color' }),
+  AddCol({ name: 'icon', label_trans: 'event.icon' }),
+  AddCol({ name: 'img', label_trans: 'event.img' }),
+  AddCol({ name: 'img_small', label_trans: 'event.img_small' }),
+  AddCol({ name: 'showinhome', label_trans: 'event.showinhome', fieldtype: tools.FieldType.boolean }),
+  AddCol({ name: 'showinnewsletter', label_trans: 'event.showinnewsletter', fieldtype: tools.FieldType.boolean }),
+  AddCol({ name: 'teachers', label_trans: 'event.teacher', fieldtype: tools.FieldType.multiselect, jointable: 'operators' }),
+  AddCol(DeleteRec)
+]
+
 const colsettings = [
   AddCol({ name: 'key', label_trans: 'col.label' }),
   AddCol({ name: 'type', label_trans: 'col.type', fieldtype: tools.FieldType.select, jointable: 'fieldstype' }),
@@ -88,7 +104,7 @@ const colTableOperator = [
 
 const colTableEvents = [
   AddCol({ name: '_id', label_trans: 'event._id' }),
-  AddCol({ name: 'typol', label_trans: 'event.typol' }),
+  AddCol({ name: 'typol', label_trans: 'event.typol', fieldtype: tools.FieldType.select, jointable: 'disciplines' }),
   AddCol({ name: 'short_tit', label_trans: 'event.short_tit' }),
   AddCol({ name: 'title', label_trans: 'event.title' }),
   AddCol({ name: 'details', label_trans: 'event.details', fieldtype: tools.FieldType.html }),
@@ -244,6 +260,13 @@ export const fieldsTable = {
       colkey: '_id',
       collabel: 'label'
     },
+    {
+      value: 'disciplines',
+      label: 'Discipline',
+      columns: coldisciplines,
+      colkey: '_id',
+      collabel: 'label'
+    },
     {
       value: 'permissions',
       label: 'Permessi',
@@ -264,7 +287,7 @@ export const fieldsTable = {
       columns: colsettings,
       colkey: 'key',
       collabel: 'key'
-    },
+    }
   ],
 
   // IColGridTable

src/store/Modules/tools.ts

@@ -132,6 +132,7 @@ export const tools = {
     select: 32,
     number: 64,
     typeinrec: 128,
+    multiselect: 256,
   },
 
   FieldTypeArr: [
@@ -2526,6 +2527,35 @@ export const tools = {
     return mythis.$q.screen.width
   },
 
+  getwidthscale(mythis, mywidth, maxwidth) {
+    if (this.isMobile()) {
+      return mywidth
+    } else {
+      let myw = mywidth + ((this.getwidth(mythis) - mywidth - 300) * 0.4)
+      if (myw > maxwidth)
+        myw = maxwidth
+
+      return myw
+    }
+  },
+
+  getheightbywidth(mythis, mywidth, myheight, maxwidth) {
+    const myw = this.getwidthscale(mythis, mywidth, maxwidth)
+    return myw * (myheight / mywidth)
+  },
+
+  getheightscale(mythis, myheight, maxheight) {
+    if (this.isMobile()) {
+      return myheight
+    } else {
+      let myh = myheight + ((this.getheight(mythis) - myheight) * 0.3)
+      if (myh > maxheight)
+        myh = maxheight
+
+      return myh
+    }
+  },
+
   isIsoDate(str) {
     if (!/\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/.test(str)) return false
     const d = new Date(str)

src/views/admin/cfgServer/cfgServer.ts

@@ -52,7 +52,7 @@ export default class CfgServer extends Vue {
   }
 
   public SaveValue(newVal, valinitial) {
-    console.log('SaveValue', newVal, 'selected', this.selected)
+    // console.log('SaveValue', newVal, 'selected', this.selected)
 
     const mydata = {
       chiave: this.keysel,