- Finish to fix IOperators

- Fixit Date not change correctly

src/common/shared_vuejs.ts

@@ -27,7 +27,7 @@ export const shared_consts = {
   },
 
   fieldsUserToChange() {
-    return ['username', 'email', 'name', 'surname', 'perm', 'date_reg', 'verified_email', 'img', 'ipaddr', 'lasttimeonline']
+    return ['username', 'email', 'cell', 'name', 'surname', 'perm', 'date_reg', 'verified_email', 'img', 'ipaddr', 'lasttimeonline']
   }
 
 }

src/components/CBook/CBook.ts

@@ -3,7 +3,7 @@ import { Component, Prop, Watch } from 'vue-property-decorator'
 
 import { tools } from '../../store/Modules/tools'
 import { toolsext } from '@src/store/Modules/toolsext'
-import { IPerson } from '../../model/GlobalStore'
+import { IOperators } from '../../model/GlobalStore'
 
 @Component({
   name: 'CBook',
@@ -21,7 +21,7 @@ export default class CBook extends Vue {
     this.tab = 'two'
   }
 
-  @Prop({ required: true }) public op: IPerson
+  @Prop({ required: true }) public op: IOperators
 
   get tools() {
     return tools
@@ -35,9 +35,9 @@ export default class CBook extends Vue {
         index: 0,
         tab: '',
         name: '',
-        sub1: '',
+        qualification: '',
         sub2: '',
-        sub3: '',
+        certifications: '',
         img: '',
         cell: '',
         email: '',

src/components/CBook/CBook.vue

@@ -3,7 +3,7 @@
         <q-img :src="myop.img" class="myimg">
             <div class="absolute-bottom text-spacetrans text-shadow">
                 <div class="text-h6 text-trans">{{myop.name}}</div>
-                <div class="text-subtitle-carica text-trans">{{myop.sub1}}</div>
+                <div class="text-subtitle-carica text-trans">{{myop.qualification}}</div>
             </div>
         </q-img>
 
@@ -16,8 +16,8 @@
 
         <q-tab-panels v-model="tab" animated>
             <q-tab-panel name="one">
-                <div class="text-subtitle-carica">{{myop.sub2}}</div>
+                <div class="text-subtitle-carica">{{myop.disciplines}}</div>
-                <div v-if="myop.sub3" class="text-subtitle-certificato">{{myop.sub3}}</div>
+                <div v-if="myop.certifications" class="text-subtitle-certificato">{{myop.certifications}}</div>
                 <div class="op__cell">
                     <q-icon class="flex-icon" name="mobile_friendly"></q-icon>
                     {{myop.cell}}
@@ -33,7 +33,7 @@
         </q-tab-panels>
 
         <!--<q-card-section>-->
-        <!--<div class="text-subtitle3">{{myop.sub2}}</div>-->
+        <!--<div class="text-subtitle3">{{myop.disciplines}}</div>-->
         <!--{{myop.info}}-->
         <!--</q-card-section>-->
     </q-card>

src/components/CCard/CCard.ts

@@ -3,7 +3,7 @@ import { Component, Prop, Watch } from 'vue-property-decorator'
 
 import { tools } from '../../store/Modules/tools'
 import { toolsext } from '@src/store/Modules/toolsext'
-import { IPerson } from '../../model/GlobalStore'
+import { IOperators } from '../../model/GlobalStore'
 
 @Component({
   name: 'CCard',
@@ -16,28 +16,28 @@ import { IPerson } from '../../model/GlobalStore'
 
 export default class CCard extends Vue {
   @Prop({ required: true, default: 'one' }) public tab
+  @Prop({ required: true }) public op: IOperators
 
   public clicca() {
     this.tab = 'two'
   }
 
-  @Prop({ required: true }) public op: IPerson
-
   get tools() {
     return tools
   }
 
-  get myop() {
+  get myop(): IOperators {
     if (!!this.op) {
       return this.op
     } else {
       return {
-        index: 0,
         tab: '',
+        username: '',
         name: '',
-        sub1: '',
+        surname: '',
-        sub2: '',
+        qualification: '',
-        sub3: '',
+        disciplines: '',
+        certifications: '',
         img: '',
         cell: '',
         email: '',

src/components/CCard/CCard.vue

@@ -1,9 +1,9 @@
 <template>
     <q-card class="my-card text-center">
-        <q-img :src="myop.img" class="myimg">
+        <q-img :src="`statics/images/` + myop.img" class="myimg">
             <div class="absolute-bottom text-spacetrans text-shadow">
-                <div class="text-h6 text-trans">{{myop.name}}</div>
+                <div class="text-h6 text-trans">{{myop.name}} {{myop.surname}}</div>
-                <div class="text-subtitle-carica text-trans">{{myop.sub1}}</div>
+                <div class="text-subtitle-carica text-trans">{{myop.qualification}}</div>
             </div>
         </q-img>
 
@@ -16,8 +16,8 @@
 
         <q-tab-panels v-model="tab" animated>
             <q-tab-panel name="one">
-                <div class="text-subtitle-carica">{{myop.sub2}}</div>
+                <div class="text-subtitle-carica">{{myop.disciplines}}</div>
-                <div v-if="myop.sub3" class="text-subtitle-certificato">{{myop.sub3}}</div>
+                <div v-if="myop.certifications" class="text-subtitle-certificato">{{myop.certifications}}</div>
                 <div class="op__cell">
                     <q-icon class="flex-icon" name="mobile_friendly"></q-icon>
                     {{myop.cell}}
@@ -45,7 +45,7 @@
         </q-tab-panels>
 
         <!--<q-card-section>-->
-        <!--<div class="text-subtitle3">{{myop.sub2}}</div>-->
+        <!--<div class="text-subtitle3">{{myop.disciplines}}</div>-->
         <!--{{myop.info}}-->
         <!--</q-card-section>-->
     </q-card>

src/components/CDateTime/CDateTime.ts

@@ -15,7 +15,8 @@ import MixinBase from '../../mixins/mixin-base'
 export default class CDateTime extends Vue {
   public $q
   public $t
-  @Prop() public value!: Date
+  @Prop({ required: false, default: null }) public value: Date
+  @Prop({ required: false, default: null }) public valueDate: Date
   @Prop({ required: true, default: 'Val:' }) public label: string
   @Prop({ required: false, default: '' }) public data_class!: string
   @Prop({ required: false, default: true }) public canEdit!: boolean
@@ -33,22 +34,36 @@ export default class CDateTime extends Vue {
     return 'calendar_comp ' + this.data_class
   }
 
-  @Watch('showDateTimeScroller')
+  // @Watch('showDateTimeScroller')
+
   public Opening() {
-    if (this.showDateTimeScroller) {
+    // console.log('Opening', 'myvalue', this.myvalue, 'value', this.value)
-      this.saveit = false
+    this.saveit = false
-      this.valueprec = this.myvalue
+    this.valueprec = this.myvalue
-      this.$emit('show')
+    this.$emit('show')
-    } else {
+  }
-      if (!this.saveit) {
+
-        if (this.myvalue !== this.valueprec) {
+  public Closing() {
-          this.myvalue = this.valueprec
+    // console.log('Closing')
-          tools.showNeutralNotif(this.$q, this.$t('db.reccanceled'))
+    if (!this.saveit) {
-        }
+      if (this.myvalue !== this.valueprec) {
+        this.myvalue = this.valueprec
+        tools.showNeutralNotif(this.$q, this.$t('db.reccanceled'))
       }
     }
   }
 
+  @Watch('valueDate')
+  public changevalueDate() {
+    this.myvalue = tools.getstrYYMMDDDateTime(this.valueDate)
+    // console.log('changevalueDate myvalue', this.myvalue)
+  }
+  @Watch('value')
+  public changevalue() {
+    this.myvalue = this.value
+    // console.log('changevalue myvalue', this.myvalue)
+  }
+
   public savetoclose() {
     this.saveit = true
     this.showDateTimeScroller = false
@@ -74,13 +89,17 @@ export default class CDateTime extends Vue {
     return CalendarStore.state.locale
   }
 
-  public mounted() {
+  public created() {
-    this.myvalue = this.value
+    if (this.value !== null)
-    console.log('myvalue', this.myvalue)
+      this.myvalue = this.value
+    else
+      this.myvalue = tools.getstrYYMMDDDateTime(this.valueDate)
+
+    // console.log('myvalue', this.myvalue)
   }
 
   public changeval(newval) {
-    // console.log('changeval', newval)
+    // console.log('changeval', newval, 'value=', this.value, 'myvalue=', this.myvalue)
     this.$emit('update:value', newval)
   }
 

src/components/CDateTime/CDateTime.vue

@@ -37,11 +37,11 @@
             </template>
             <template v-slot:append>
                 <q-icon v-if="canEdit" name="event" class="cursor-pointer">
-                    <q-popup-proxy v-model="showDateTimeScroller">
+                    <q-popup-proxy v-model="showDateTimeScroller" @before-show="Opening" @before-hide="Closing">
 
                         <q-date-time-scroller
                                 v-model="myvalue"
-                                :locale="locale"
+                                :locale="toolsext.getLocale()"
                                 :hour24-format="true"
                                 :rounded-borders="true"
                                 border-color="#2196f3"

src/components/CEventsCalendar/CEventsCalendar.scss

@@ -175,7 +175,7 @@ $graytext: #555;
   }
 
   &__img {
-    padding: 0.5rem !important;
+    padding: 0.25rem !important;
     float: left;
     width: 150px;
     height: 150px;
@@ -189,6 +189,14 @@ $graytext: #555;
     }
   }
 
+  &__img:hover {
+    transition: transform .2s;
+    transform: scale(1.05);
+    border: inset;
+    border-color: blue;
+    border-width: 1px;
+  }
+
 }
 
 @media (max-width: 718px) {
@@ -246,6 +254,20 @@ $graytext: #555;
   }
 }
 
+.chipmodif {
+
+  position: absolute;
+  margin-top: -10px;
+  overflow: hidden;
+  z-index: 9999;
+  box-sizing: border-box;
+  right: 0;
+  @media (max-width: 400px) {
+    position: initial;
+    right: initial;
+  }
+}
+
 .windowcol {
   background-color: #ffffff;
           // background: radial-gradient(circle, #ffffff 0%, #94dbfb 100%)

src/components/CEventsCalendar/CEventsCalendar.ts

@@ -32,9 +32,10 @@ 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'
 
 @Component({
-  mixins: [MixinUsers],
+  mixins: [MixinOperator, MixinUsers],
   name: 'CEventsCalendar',
   components: { Logo, Footer, CTitle, CImgText, QDateTimeScroller, QDateScroller, CMySelect, CMyEditor, CDateTime }
 })
@@ -399,6 +400,14 @@ export default class CEventsCalendar extends Vue {
     // console.log('showEvent - FINE ' + myevent)
   }
 
+  public selectEvent(eventparam: IEvents) {
+    if (this.myevent === eventparam)
+      this.myevent = null
+    else
+      this.myevent = eventparam
+
+  }
+
   public onDateChanged(mydate) {
     this.calendarView = 'day'
   }
@@ -1019,4 +1028,10 @@ export default class CEventsCalendar extends Vue {
   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; '
+    }
+  }
 }

src/components/CEventsCalendar/CEventsCalendar.vue

@@ -16,7 +16,7 @@
                                @click="deleteEvent(myevent)"></q-btn>
                         <q-btn v-if="editable" flat round color="white" icon="edit" v-close-popup
                                @click="editEvent(myevent)"></q-btn>
-                        <q-btn flat round color="white" icon="cancel" v-close-popup></q-btn>
+                        <q-btn flat round color="white" icon="cancel" v-close-popup @click="myevent = null; displayEvent = false"></q-btn>
                     </q-toolbar>
                     <q-card-section class="inset-shadow">
                         <q-img :src="getImgEvent(myevent)"
@@ -41,17 +41,17 @@
                                 <span class="cal__teacher-content">
                                     <q-chip>
                                         <q-avatar>
-                                            <img :src="getImgByUsername(myevent.teacher)">
+                                            <img :src="getImgTeacherByUsername(myevent.teacher)">
                                         </q-avatar>
-                                        <span class="cal__teacher-content">{{getUserByUsername(myevent.teacher)}}</span>
+                                        <span class="cal__teacher-content">{{getTeacherByUsername(myevent.teacher)}}</span>
                                     </q-chip>
-                                    <span v-if="getImgByUsername(myevent.teacher2) && isValidUsername(myevent.teacher2)"
+                                    <span v-if="getImgTeacherByUsername(myevent.teacher2) && isValidUsername(myevent.teacher2)"
                                           class="margin_avatar2"></span>
-                                    <q-chip v-if="getImgByUsername(myevent.teacher2) && isValidUsername(myevent.teacher2)">
+                                    <q-chip v-if="getImgTeacherByUsername(myevent.teacher2) && isValidUsername(myevent.teacher2)">
                                         <q-avatar>
-                                            <img :src="getImgByUsername(myevent.teacher2)">
+                                            <img :src="getImgTeacherByUsername(myevent.teacher2)">
                                         </q-avatar>
-                                        <span class="cal__teacher-content">{{getUserByUsername(myevent.teacher2)}}</span>
+                                        <span class="cal__teacher-content">{{getTeacherByUsername(myevent.teacher2)}}</span>
                                     </q-chip>
                                 </span>
                             </div>
@@ -114,7 +114,7 @@
                             <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')"
-                                     ></q-input>
+                            ></q-input>
 
                             <q-input color="grey-1" v-model="eventForm.title" autofocus
                                      :input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `"
@@ -281,7 +281,8 @@
                                         </div>
 
                                         <q-input v-model="bookEventForm.msgbooking" :label="$t('cal.msgbooking')+':'"
-                                                 autogrow>
+                                                 type="textarea" debounce="500"
+                                        >
                                         </q-input>
                                     </q-card-section>
                                 </q-card>
@@ -342,7 +343,7 @@
                                 <q-card class="text-white windowcol">
                                     <q-card-section>
                                         <q-input v-model="askInfoForm.message" :label="$t('cal.msgbooking')+':'"
-                                                 autogrow>
+                                                 autofocus debounce="500" type="textarea">
                                         </q-input>
                                     </q-card-section>
                                 </q-card>
@@ -432,7 +433,6 @@
                             <q-badge
                                     :key="index"
                                     style="width: 100%; cursor: pointer;"
-                                    class=""
                                     :class="badgeClasses(event, 'day')"
                                     :style="badgeStyles(event, 'day')"
                                     @click.stop.prevent="showEvent(event)"
@@ -446,7 +446,7 @@
                                 <span class="">{{ getTitleEv(event) }}</span>
                             </q-badge>
                             <div class="text-center"><img :src="getImgEvent(event)"
-                                 class="text-center listaev__tdimg_small">
+                                                          class="text-center listaev__tdimg_small">
                             </div>
                         </template>
                     </template>
@@ -512,21 +512,33 @@
                 <tbody>
                 <tr v-for="(event, index) in getEventList()" class="listaev listaev__table">
                     <td :class="clEvent(event)">
-                        <p class="listaev__align_chips">
+                        <div class="listaev__align_chips">
                             <img :src="getImgEvent(event)"
-                                 class="text-left padding_cell listaev__tdimg listaev__img">
+                                 @click="selectEvent(event)"
+                                 class="text-left padding_cell listaev__tdimg listaev__img cursor-pointer"
+                                :style="getStyleByEvent(event)">
                             <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')}}
                             </q-chip>
 
+                            <q-chip v-if="event === myevent && !displayEvent && editable" class="text-center shadow-5 glossy bg-blue chipmodif">
+                                <q-btn v-if="editable" flat round color="white" icon="fas fa-copy"
+                                       @click="duplicateEvent(myevent)"></q-btn>
+                                <q-btn v-if="editable" flat round color="white" icon="delete"
+                                       @click="deleteEvent(myevent)"></q-btn>
+                                <q-btn v-if="editable" flat round color="white" icon="edit"
+                                       @click="editEvent(myevent)"></q-btn>
+                                <q-btn flat round color="white" icon="cancel" @click="selectEvent(null)"></q-btn>
+                            </q-chip>
                             <q-chip v-if="event.news" class="cltexth4 chipnews shadow-5 glossy text-right" color="red"
                                     text-color="white" icon-right="star" icon="star" dense
                                     style="">
                                 {{$t('event.news')}}
                             </q-chip>
 
-                        </p>
+                        </div>
+
                         <div class="listaev__date listaev__align_center_mobile">
                             <span v-html="tools.getstrDateTimeEvent(mythis(), event, true)"></span>
                         </div>
@@ -568,16 +580,17 @@
 
                                 <q-chip>
                                     <q-avatar>
-                                        <img :src="getImgByUsername(event.teacher)">
+                                        <img :src="getImgTeacherByUsername(event.teacher)">
                                     </q-avatar>
-                                    <span class="cal__teacher-content">{{getUserByUsername(event.teacher)}}</span>
+                                    <span class="cal__teacher-content">{{getTeacherByUsername(event.teacher)}}</span>
                                 </q-chip>
-                                <span v-if="getImgByUsername(event.teacher2) && isValidUsername(event.teacher2)" class="margin_avatar2"></span>
+                                <span v-if="getImgTeacherByUsername(event.teacher2) && isValidUsername(event.teacher2)"
-                                <q-chip v-if="getImgByUsername(event.teacher2) && isValidUsername(event.teacher2)">
+                                      class="margin_avatar2"></span>
+                                <q-chip v-if="getImgTeacherByUsername(event.teacher2) && isValidUsername(event.teacher2)">
                                     <q-avatar>
-                                        <img :src="getImgByUsername(event.teacher2)">
+                                        <img :src="getImgTeacherByUsername(event.teacher2)">
                                     </q-avatar>
-                                    <span class="cal__teacher-content">{{getUserByUsername(event.teacher2)}}</span>
+                                    <span class="cal__teacher-content">{{getTeacherByUsername(event.teacher2)}}</span>
                                 </q-chip>
 
                                 <span v-if="event.wherecode" class="">

src/components/CGridTableRec/CGridTableRec.ts

@@ -21,7 +21,7 @@ import { CMyChipList } from '../CMyChipList'
 export default class CGridTableRec extends Vue {
   @Prop({ required: false }) public prop_mytable: string
   @Prop({ required: true }) public prop_mytitle: string
-  @Prop({ required: false, default: [] }) public prop_mycolumns: any[]
+  @Prop({ required: false, default: null }) public prop_mycolumns: any[]
   @Prop({ required: false, default: '' }) public prop_colkey: string
   @Prop({ required: false, default: '' }) public nodataLabel: string
   @Prop({ required: false, default: '' }) public noresultLabel: string
@@ -57,17 +57,13 @@ export default class CGridTableRec extends Vue {
   public filter: string = ''
   public rowsel: any
   public dark: boolean = true
-  public funcActivated = []
+  public canEdit: boolean = false
 
   public returnedData
   public returnedCount
   public colVisib: any[] = []
   public colExtra: any[] = []
 
-  get canEdit() {
-    return this.funcActivated.includes(lists.MenuAction.CAN_EDIT_TABLE)
-  }
-
   get lists() {
     return lists
   }
@@ -79,7 +75,7 @@ export default class CGridTableRec extends Vue {
   }
 
   public selItem(item, col: IColGridTable) {
-    // console.log('item', item)
+    console.log('selItem', item)
     this.rowsel = item
     this.idsel = item._id
     this.colsel = col
@@ -317,6 +313,11 @@ export default class CGridTableRec extends Vue {
   }
 
   public mounted() {
+
+    this.canEdit = tools.getCookie(tools.CAN_EDIT) === 'true'
+
+    this.tablesel = tools.getCookie('tablesel')
+
     this.changeTable(false)
 
   }
@@ -382,25 +383,34 @@ export default class CGridTableRec extends Vue {
         return '[]'
       } else {
         let mystr = tools.firstchars(val, tools.MAX_CHARACTERS)
-        if (val.length > tools.MAX_CHARACTERS)
+        if (val) {
-          mystr += '...'
+          if (val.length > tools.MAX_CHARACTERS)
+            mystr += '...'
+        } else {
+          return val
+        }
         return mystr
       }
     }
   }
 
+  public changeCol(newval) {
+    tools.setCookie(this.mytable, this.colVisib.join('|'))
+  }
+
   public changeTable(mysel) {
-    // console.log('changeTable')
+    if (this.tablesel === undefined || this.tablesel === '')
+      return
+
+    console.log('changeTable mysel=', mysel, 'tablesel', this.tablesel)
 
     let mytab = null
     if (this.tablesList) {
-      if (!this.tablesel) {
-        this.tablesel = this.tablesList[1].value
-      }
-
       mytab = this.tablesList.find((rec) => rec.value === this.tablesel)
     }
 
+    console.log('this.tablesel', this.tablesel)
+
     if (mytab) {
       this.mytitle = mytab.label
       this.colkey = mytab.colkey
@@ -416,7 +426,17 @@ export default class CGridTableRec extends Vue {
       this.mytable = mytab.value
     }
 
+    tools.setCookie('tablesel', this.tablesel)
+
     this.updatedcol()
+
+    if (!!this.mytable) {
+      const myselcol = tools.getCookie(this.mytable)
+      if (!!myselcol && myselcol.length > 0) {
+        this.colVisib = myselcol.split('|')
+      }
+    }
+
     this.refresh()
   }
 
@@ -429,8 +449,11 @@ export default class CGridTableRec extends Vue {
   }
 
   public doSearch() {
-
     this.refresh()
   }
 
+  public changefuncAct(newval) {
+    tools.setCookie(tools.CAN_EDIT, newval)
+  }
+
 }

src/components/CGridTableRec/CGridTableRec.vue

@@ -35,13 +35,14 @@
 
                 <!--<p style="color:red"> Rows: {{ getrows }}</p>-->
 
-                <q-input v-model="search" filled dense type="search" hint="Search" v-on:keyup.enter="doSearch">
+                <q-input v-model="search" filled dense type="search" debounce="500" hint="Search" v-on:keyup.enter="doSearch">
                     <template v-slot:after>
                         <q-btn v-if="mytable" label="" color="primary" @click="refresh" icon="search"></q-btn>
                     </template>
                 </q-input>
-                <q-toggle v-if="mytable" v-model="funcActivated" :val="lists.MenuAction.CAN_EDIT_TABLE" class="q-mx-sm"
+                <q-toggle v-if="mytable" v-model="canEdit" :val="lists.MenuAction.CAN_EDIT_TABLE" class="q-mx-sm"
-                          :label="$t('grid.editvalues')"></q-toggle>
+                          :label="$t('grid.editvalues')" @input="changefuncAct"
+                ></q-toggle>
 
                 <q-btn v-if="mytable" flat dense color="primary" :disable="loading || !canEdit"
                        :label="$t('grid.addrecord')"
@@ -64,7 +65,8 @@
                         map-options
                         :options="mycolumns"
                         option-value="name"
-                        style="min-width: 150px">
+                        style="min-width: 150px"
+                        @input="changeCol">
 
                 </q-select>
 
@@ -94,7 +96,8 @@
                             <CDateTime
                                     :label="col.label"
                                     class="cursor-pointer"
-                                    :value.sync="props.row[col.name]"
+                                    :valueDate="props.row[col.name]"
+                                    :readonly="false"
                                     :dense="true"
                                     :canEdit="canEdit"
                                     @savetoclose="SaveValue"
@@ -145,13 +148,33 @@
                             </q-popup-edit>
                         </div>
                     </div>
-                    <div v-else>
+                    <div v-else-if="col.fieldtype === tools.FieldType.string">
                         <div :class="getclassCol(col)">
                             {{ visuValByType(col, props.row[col.name]) }}
                             <q-popup-edit v-if="canEdit" v-model="props.row[col.name]" :disable="col.disable"
                                           :title="col.title" buttons
                                           @save="SaveValue" @show="selItem(props.row, col)">
-                                <q-input v-model="props.row[col.name]"/>
+                                <q-input v-model="props.row[col.name]"
+                                         autofocus
+                                >
+
+                                </q-input>
+
+                            </q-popup-edit>
+                        </div>
+                    </div>
+                    <div v-else-if="col.fieldtype === tools.FieldType.html">
+                        <div :class="getclassCol(col)">
+                            {{ visuValByType(col, props.row[col.name]) }}
+                            <q-popup-edit v-if="canEdit" v-model="props.row[col.name]" :disable="col.disable"
+                                          :title="col.title" buttons
+                                          @save="SaveValue" @show="selItem(props.row, col)">
+                                <q-input v-model="props.row[col.name]"
+                                         autofocus
+                                         @keyup.enter.stop
+                                         type="textarea">
+
+                                </q-input>
 
                             </q-popup-edit>
                         </div>

src/components/CMySelect/CMySelect.ts

@@ -3,7 +3,7 @@ import { Component, Prop, Watch } from 'vue-property-decorator'
 
 import { tools } from '../../store/Modules/tools'
 import { toolsext } from '@src/store/Modules/toolsext'
-import { IPerson } from '../../model/GlobalStore'
+import { IOperators } from '../../model/GlobalStore'
 
 @Component({
   name: 'CMySelect'

src/mixins/mixin-users.ts

@@ -1,7 +1,6 @@
 import Vue from 'vue'
 import { GlobalStore, UserStore, MessageStore } from '../store/Modules'
 
-
 import Component from 'vue-class-component'
 import { func_tools } from '../store/Modules/toolsext'
 import { tools } from '../store/Modules/tools'

src/model/Calendar.ts

@@ -1,3 +1,4 @@
+import { IOperators } from '@src/model/GlobalStore'
 
 export interface IEvents {
   _id?: any
@@ -41,18 +42,6 @@ export interface IBookedEvent {
   booked: boolean
 }
 
-export interface IOperators {
-  username: string
-  cell: string
-  webpage?: string
-  img: string
-  skype?: string
-  days_working?: string
-  facebook?: string
-  disciplines?: string
-  offers?: string
-}
-
 export interface IWheres {
   code: string
   placename: string
@@ -75,7 +64,6 @@ export interface IBookedEventPage {
   state: EState
 }
 
-
 export interface ICalendarState {
   editable: boolean
   eventlist: IEvents[]

src/model/GlobalStore.ts

@@ -98,21 +98,22 @@ export interface IListRoutes {
   separator?: boolean
 }
 
-export interface IPerson {
+export interface IOperators {
-  index?: number
+  username: string
-  tab?: string
   name: string
-  sub1: string
+  surname: string
-  sub2?: string
-  sub3?: string
-  img: string
-  cell?: string
   email?: string
+  qualification?: string
+  disciplines?: string
+  certifications?: string
+  img?: string
+  cell?: string
   paginaweb?: string
   paginafb?: string
   intro?: string
   info?: string
   vario?: string
+  tab?: string
 }
 
 export interface IPreloadImages {

src/model/UserStore.ts

@@ -5,7 +5,23 @@ export const DefaultUser: IUserFields = {
   username: '',
   name: '',
   surname: '',
-  password: ''
+  password: '',
+  profile: {
+    img: ''
+  }
+}
+
+const enum ESexType {
+  None = 0,
+  Male = 1,
+  Female = 2
+}
+
+export interface IUserProfile {
+  img?: string
+  cell?: string
+  dateofbirth?: Date
+  sex?: ESexType
 }
 
 export interface IUserFields {
@@ -17,10 +33,10 @@ export interface IUserFields {
   password?: string
   ipaddr?: string
   perm?: number
-  img?: string
   verified_email?: boolean
   tokens?: IToken[]
   lasttimeonline?: Date
+  profile?: IUserProfile
 }
 
 /*

src/statics/i18n.js

@@ -91,7 +91,7 @@ const msgglobal = {
       incorso: 'Registrazione in corso...',
       richiesto: 'Campo Richiesto',
       email: 'Email',
-      cell: 'Móvil',
+      cell: 'Telefono',
       img: 'Immagine',
       date_reg: 'Data Reg.',
       perm: 'Permessi',
@@ -128,6 +128,16 @@ const msgglobal = {
 
       }
     },
+    op: {
+      qualification: 'Qualifica',
+      disciplines: 'Discipline',
+      certifications: 'Certificazioni',
+      intro: 'Introduzione',
+      info: 'Biografia',
+      webpage: 'Pagina Web',
+      days_working: 'Giorni Lavorativi',
+      facebook: 'Pagina Facebook',
+    },
     login: {
       page_title: 'Login',
       incorso: 'Login in corso',
@@ -253,7 +263,8 @@ const msgglobal = {
       short_tit: 'Titolo Breve',
       title: 'Titolo',
       details: 'Dettagli',
-      date: 'Data',
+      dateTimeStart: 'Data Inizio',
+      dateTimeEnd: 'Data Fine',
       bgcolor: 'Colore Sfondo',
       days: 'Giorni',
       icon: 'Icona',
@@ -385,7 +396,7 @@ const msgglobal = {
       incorso: 'Registro en curso...',
       richiesto: 'Campo requerido',
       email: 'Email',
-      cell: 'Telefono',
+      cell: 'Móvil',
       img: 'File image',
       date_reg: 'Fecha Reg.',
       perm: 'Permisos',
@@ -415,6 +426,16 @@ const msgglobal = {
         sameaspassword: 'Las contraseñas deben ser idénticas',
       }
     },
+    op: {
+      qualification: 'Calificación',
+      disciplines: 'Disciplinas',
+      certifications: 'Certificaciones',
+      intro: 'Introducción',
+      info: 'Biografia',
+      webpage: 'Página web',
+      days_working: 'Días laborables',
+      facebook: 'Página de Facebook',
+    },
     login: {
       page_title: 'Login',
       incorso: 'Login en curso',
@@ -538,7 +559,8 @@ const msgglobal = {
       short_tit: 'Título Corto',
       title: 'Título',
       details: 'Detalles',
-      date: 'Fecha',
+      dateTimeStart: 'Fecha de Inicio',
+      dateTimeEnd: 'Fecha Final',
       bgcolor: 'Color de fondo',
       days: 'Días',
       icon: 'Icono',
@@ -699,6 +721,16 @@ const msgglobal = {
         sameaspassword: 'Les mots de passe doivent être identiques',
       }
     },
+    op: {
+      qualification: 'Qualification',
+      disciplines: 'Disciplines',
+      certifications: 'Certifications',
+      intro: 'Introduction',
+      info: 'Biographie',
+      webpage: 'Page Web',
+      days_working: 'Jours ouvrés',
+      facebook: 'Page Facebook',
+    },
     login: {
       page_title: 'Login',
       incorso: 'Connexion en cours',
@@ -822,7 +854,8 @@ const msgglobal = {
       short_tit: 'Titre abrégé\'',
       title: 'Titre',
       details: 'Détails',
-      date: 'Date',
+      dateTimeStart: 'Data Initiale',
+      dateTimeEnd: 'Date de fin',
       bgcolor: 'Couleur de fond',
       days: 'Journées',
       icon: 'Icône',
@@ -983,6 +1016,16 @@ const msgglobal = {
         sameaspassword: 'Passwords must be identical',
       }
     },
+    op: {
+      qualification: 'Qualification',
+      disciplines: 'Disciplines',
+      certifications: 'Certifications',
+      intro: 'Introduction',
+      info: 'Biography',
+      webpage: 'Web Page',
+      days_working: 'Working Days',
+      facebook: 'Facebook Page',
+    },
     login: {
       incorso: 'Login...',
       enter: 'Login',
@@ -1105,7 +1148,8 @@ const msgglobal = {
       short_tit: 'Short Title',
       title: 'Title',
       details: 'Details',
-      date: 'Date',
+      dateTimeStart: 'Date Start',
+      dateTimeEnd: 'Date End',
       bgcolor: 'Background color',
       days: 'Days',
       icon: 'Icon',
@@ -1267,6 +1311,16 @@ const msgglobal = {
         sameaspassword: 'Passwords must be identical',
       }
     },
+    op: {
+      qualification: 'Qualification',
+      disciplines: 'Disciplines',
+      certifications: 'Certifications',
+      intro: 'Introduction',
+      info: 'Biography',
+      webpage: 'Web Page',
+      days_working: 'Working Days',
+      facebook: 'Facebook Page',
+    },
     login: {
       page_title: 'Login',
       incorso: 'Login...',
@@ -1390,7 +1444,8 @@ const msgglobal = {
       short_tit: 'Short Title',
       title: 'Title',
       details: 'Details',
-      date: 'Date',
+      dateTimeStart: 'Date Start',
+      dateTimeEnd: 'Date End',
       bgcolor: 'Background color',
       days: 'Days',
       icon: 'Icon',

src/store/Modules/Store/calendar/CalendarStore.ts

@@ -9,8 +9,9 @@ import { tools } from '../../tools'
 import translate from '../../../../globalroutines/util'
 import * as Types from '../../../Api/ApiTypes'
 import { db_data } from '@src/db/db_data'
-import { GlobalStore, UserStore } from '@store'
+import { CalendarStore, GlobalStore, UserStore } from '@store'
 import { lists } from '@src/store/Modules/lists'
+import { IUserState } from '@src/model'
 
 // State
 const state: ICalendarState = {
@@ -77,6 +78,24 @@ namespace Getters {
 
   }, 'getContribtypeRec')
 
+  const getOperatorByUsername = b.read((mystate: ICalendarState) => (username) => {
+    const ctrec = mystate.operators.find((rec) => rec.username === username)
+    return (ctrec)
+
+  }, 'getOperatorByUsername')
+
+  const getImgTeacherByUsername = b.read((mystate: ICalendarState) => (username): string => {
+    if (username === '')
+      return 'images/avatar/avatar3_small.png'
+    // Check if is this User!
+    const myop = CalendarStore.getters.getOperatorByUsername(username)
+    if (myop && !!myop.img && myop.img !== '' && myop.img !== 'undefined') {
+      return myop.img
+    } else {
+      return 'images/avatar/avatar3_small.png'
+    }
+  }, 'getImgTeacherByUsername')
+
   const getContribtypeById = b.read((mystate: ICalendarState) => (id) => {
     const ctrec = mystate.contribtype.find((mycontr) => mycontr._id === id)
     return (ctrec) ? ctrec.label : ''
@@ -109,6 +128,12 @@ namespace Getters {
     },
     get getContribtypeRecByLabel() {
       return getContribtypeRecByLabel()
+    },
+    get getOperatorByUsername() {
+      return getOperatorByUsername()
+    },
+    get getImgTeacherByUsername() {
+      return getImgTeacherByUsername()
     }
   }
 }

src/store/Modules/UserStore.ts

@@ -30,7 +30,10 @@ const state: IUserState = {
     surname: '',
     password: '',
     tokens: [],
-    verified_email: false
+    verified_email: false,
+    profile: {
+      img: ''
+    }
   },
   lang: process.env.LANG_DEFAULT,
   repeatPassword: '',
@@ -143,8 +146,8 @@ namespace Getters {
       return 'images/avatar/avatar3_small.png'
     // Check if is this User!
     const myrec = UserStore.getters.getUserByUsername(username)
-    if (myrec && !!myrec.img && myrec.img !== '' && myrec.img !== 'undefined') {
+    if (myrec && myrec.profile && !!myrec.profile.img && myrec.profile.img !== '' && myrec.profile.img !== 'undefined') {
-      return myrec.img
+      return myrec.profile.img
     } else {
       return 'images/avatar/avatar3_small.png'
     }
@@ -561,7 +564,7 @@ namespace Actions {
             localStorage.setItem(tools.localStorage.name, myuser.name)
             localStorage.setItem(tools.localStorage.surname, myuser.surname)
             localStorage.setItem(tools.localStorage.perm, String(myuser.perm) || '')
-            localStorage.setItem(tools.localStorage.img, String(myuser.img) || '')
+            localStorage.setItem(tools.localStorage.img, String(myuser.profile.img) || '')
             localStorage.setItem(tools.localStorage.token, state.x_auth_token)
             localStorage.setItem(tools.localStorage.expirationDate, expirationDate.toString())
             localStorage.setItem(tools.localStorage.isLogged, String(true))
@@ -685,7 +688,7 @@ namespace Actions {
             surname,
             verified_email,
             perm,
-            img
+            profile: { img }
           })
 
           isLogged = true

src/store/Modules/fieldsTable.ts

@@ -59,12 +59,19 @@ const colTablePermission = [
 
 const colTableOperator = [
   AddCol({ name: 'username', label_trans: 'reg.username' }),
-  // AddCol({ name: 'name', label_trans: 'reg.name' }),
+  AddCol({ name: 'name', label_trans: 'reg.name' }),
-  // AddCol({ name: 'surname', label_trans: 'reg.surname' }),
+  AddCol({ name: 'surname', label_trans: 'reg.surname' }),
-  // AddCol({ name: 'webpage', label_trans: 'reg.webpage' }),
+  AddCol({ name: 'email', label_trans: 'reg.email' }),
-  // AddCol({ name: 'email', label_trans: 'reg.email' }),
+  AddCol({ name: 'img', label_trans: 'event.img' }),
-  // AddCol({ name: 'cell', label_trans: 'reg.cell' }),
+  AddCol({ name: 'cell', label_trans: 'reg.cell' }),
-  // AddCol({ name: 'img', label_trans: 'reg.img' }),
+  AddCol({ name: 'qualification', label_trans: 'op.qualification' }),
+  AddCol({ name: 'disciplines', label_trans: 'op.disciplines' }),
+  AddCol({ name: 'certifications', label_trans: 'op.certifications' }),
+  AddCol({ name: 'intro', label_trans: 'op.intro' , fieldtype: tools.FieldType.html }),
+  AddCol({ name: 'info', label_trans: 'op.info', fieldtype: tools.FieldType.html }),
+  AddCol({ name: 'webpage', label_trans: 'op.webpage' }),
+  AddCol({ name: 'days_working', label_trans: 'op.days_working' }),
+  AddCol({ name: 'facebook', label_trans: 'op.facebook' }),
   AddCol(DeleteRec)]
 
 const colTableEvents = [
@@ -74,7 +81,7 @@ const colTableEvents = [
   AddCol({ name: 'title', label_trans: 'event.title' }),
   AddCol({ name: 'details', label_trans: 'event.details' }),
   AddCol({ name: 'dateTimeStart', label_trans: 'event.dateTimeStart', fieldtype: tools.FieldType.date }),
-  AddCol({ name: 'dateTimeEnd', label_trans: 'event.dateTimeEnd' }),
+  AddCol({ name: 'dateTimeEnd', label_trans: 'event.dateTimeEnd', fieldtype: tools.FieldType.date }),
   AddCol({ name: 'bgcolor', label_trans: 'event.bgcolor' }),
   AddCol({ name: 'icon', label_trans: 'event.icon' }),
   AddCol({ name: 'img_small', label_trans: 'event.img_small' }),
@@ -214,6 +221,7 @@ export const fieldsTable = {
     AddCol({ name: 'name', label_trans: 'reg.name' }),
     AddCol({ name: 'surname', label_trans: 'reg.surname' }),
     AddCol({ name: 'email', label_trans: 'reg.email' }),
+    AddCol({ name: 'cell', label_trans: 'reg.cell' }),
     AddCol({ name: 'date_reg', label_trans: 'reg.date_reg', fieldtype: tools.FieldType.date }),
     AddCol({ name: 'perm', label_trans: 'reg.perm', fieldtype: tools.FieldType.binary, jointable: 'permissions' }),
     AddCol({ name: 'img', label_trans: 'reg.img', sortable: false }),

src/store/Modules/tools.ts

@@ -30,6 +30,10 @@ import { dom } from 'quasar'
 
 const { height, width } = dom
 
+import Cookies from 'js-cookie'
+
+const TokenKey = 'Admin-Token'
+
 export interface INotify {
   color?: string | 'primary'
   textColor?: string
@@ -37,6 +41,8 @@ export interface INotify {
 }
 
 export const tools = {
+  CAN_EDIT: 'q-ce',
+
   listBestColor: [
     'blue',
     'green',
@@ -117,7 +123,8 @@ export const tools = {
     boolean: 1,
     date: 2,
     string: 4,
-    binary: 8
+    binary: 8,
+    html: 16
   },
 
   SelectListNumPeople: [
@@ -2544,6 +2551,19 @@ export const tools = {
       return this.listBestColor[index]
     else
       return 'primary'
+  },
+  getCookie(mytok) {
+    const ris = Cookies.get(mytok)
+    console.log('getToken', ris)
+    return ris
+  },
+
+  setCookie(mytok, value: string) {
+    return Cookies.set(mytok, value)
+  },
+
+  removeCookie(mytok) {
+    return Cookies.remove(mytok)
   }
 
 // getLocale() {

src/utils/auth.ts

@@ -2,14 +2,14 @@ import Cookies from 'js-cookie'
 
 const TokenKey = 'Admin-Token'
 
-export function getToken() {
+export function getCookie() {
   return Cookies.get(TokenKey)
 }
 
-export function setToken(token: string) {
+export function setCookie(token: string) {
   return Cookies.set(TokenKey, token)
 }
 
-export function removeToken() {
+export function removeCookie() {
   return Cookies.remove(TokenKey)
 }