- Booking Event (with email to user and admin)

- Cancel Event (with email to user and admin) - Store into mongodb
2019-10-05 20:02:25 +02:00
parent 3ed8c7116b
commit 0d6312ecda
34 changed files with 852 additions and 172 deletions
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
  "dependencies": {
    "@babel/plugin-transform-runtime": "^7.4.0",
    "@babel/runtime": "^7.0.0",
-    "@quasar/extras": "^1.3.1",
+    "@quasar/extras": "^1.3.2",
    "@types/vuelidate": "^0.7.0",
    "@vue/eslint-config-standard": "^4.0.0",
    "acorn": "^6.0.0",
@@ -50,7 +50,7 @@
    "normalize.css": "^8.0.0",
    "npm": "^6.10.1",
    "nprogress": "^0.2.0",
-    "quasar": "^1.1.0",
+    "quasar": "^1.1.6",
    "quasar-extras": "^2.0.8",
    "register-service-worker": "^1.0.0",
    "vee-validate": "^2.1.2",
@@ -85,7 +85,8 @@
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-syntax-import-meta": "^7.2.0",
    "@babel/preset-env": "^7.4.2",
-    "@quasar/app": "^1.0.6",
+    "@quasar/app": "^1.1.2",
+    "@quasar/quasar-app-extension-colorize": "^1.0.0-alpha.1",
    "@quasar/quasar-app-extension-typescript": "^1.0.0-alpha.11",
    "@types/dotenv": "^4.0.3",
    "@types/jest": "^23.1.4",
--- a/src/App.scss
+++ b/src/App.scss
@@ -1,3 +1,44 @@
+body {
+  font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  color: #a7a7a7;
+  line-height: 1.5;
+  //font-size: 1rem;
+}
+
+html {
+  font-size: 100%; // default font size (browser 16) -> (10 62.5%)
+}
+
+p {
+  font-size: 125%; // default font size (browser 16) -> (10 62.5%)
+  margin: 0 0 8px;
+}
+
+$grayshadow: #555;
+
+$graytext: #555;
+
+$textcol: blue;
+$textcol_scuro: darkblue;
+$heightBtn: 100%;
+
+.flex-item {
+  // background-color: #d5e2eb;
+  display: flex;
+  padding: 2px;
+  margin: 2px;
+  margin-left: 3px;
+  margin-right: 3px;
+  color: #000;
+  font-size: 1rem;
+  height: $heightBtn;
+  line-height: $heightBtn;
+  vertical-align: middle;
+  //flex: 0 0 100%;
+}
+
 .fade-enter-active, .fade-leave-active {
  transition: opacity .2s;
 }
@@ -40,7 +81,8 @@
  }
 }

-.my-notif-class {
+
+.my-notif-class{
  font-weight: bold;
 }

@@ -53,15 +95,14 @@
 .lowperc {
  color: red;
 }
-
 .medperc {
  color: blue;
 }
-
 .highperc {
  color: green;
 }

+
 .hide-if-small {
  @media (max-width: 600px) {
    display: none;
@@ -74,24 +115,200 @@
  }
 }

-.tothebottomfixed {
-  left: 0;
-  right: 0;
-  position: fixed;
-  z-index: 9999;
-  box-sizing: border-box;
-  overflow: hidden;
-  margin: 0 auto;
-  bottom: 10px;
+.links, .links a {
+  text-shadow: 1px 1px 1px #555 !important;
+  // font-weight: bold;
+  color: cornflowerblue !important;
+}
+.links:hover {
+  color: white !important;
 }

-.tothetop {
-  left: 0;
-  right: 0;
-  position: fixed;
-  z-index: 9999;
-  box-sizing: border-box;
-  overflow: hidden;
-  margin: 0 auto;
-  top: 20px;
+.text-subtitle1 {
+  font-size: 1.35rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  text-shadow: .25 .25rem .5rem $grayshadow;
+  letter-spacing: .00937em;
+  &.big {
+    font-size: 1.5rem;
+  }
+}
+
+.text-subtitle2 {
+  font-size: 1.15rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+  text-shadow: .25rem .25rem .5rem $grayshadow;
+}
+
+.text-subtitle3 {
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+}
+
+
+@media (max-width: 718px) {
+  // PER VERSIONE MOBILE
+
+  p {
+    font-size: 100%; // default font size (browser 16) -> (10 62.5%)
+    font-family: "Abyssinica SIL", serif;
+    text-justify: auto;
+    margin: 0 0 4px;
+  }
+
+  .text-subtitle1 {
+    font-size: 1.25rem;
+  }
+  .text-subtitle2 {
+    font-size: 1rem;
+  }
+  .text-subtitle3 {
+    font-size: 0.75rem;
+  }
+
+  .cltexth3 {
+    font-size: 1.25rem;
+  }
+
+  .text-big{
+    font-size: 1.25rem;
+  }
+
+}
+
+.my-card {
+  width: 100%;
+  max-width: 350px;
+  min-width: 300px;
+  padding: 1rem 1rem;
+
+  box-shadow: none;
+}
+
+.text-trans {
+  opacity: 0.9;
+  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
+  filter: alpha(opacity=90);
+}
+
+.text-spacetrans {
+  padding: 0 !important;
+  background: rgba(0,0,0,0.3) !important;
+  border-radius: 30px !important;
+}
+
+.text-shadow {
+  text-shadow: .15rem .15rem .15rem $grayshadow;
+}
+
+.citazione{
+  font-size: 0.75rem;
+  font-family: "Lucida Calligraphy", serif;
+}
+
+.cltexth3, .cltexth2, .cltexth4 {
+  font-size: 1.25rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .01em;
+  text-align: center !important;
+}
+
+.cltexth4 {
+  font-size: 1rem;
+}
+
+.cltexth2 {
+  font-size: 1.5rem;
+}
+
+.boldhigh, .boldop, .text-big{
+  font-weight: 500;
+  text-shadow: .05rem .05rem .05rem $grayshadow;
+}
+.boldop{
+  color: darkblue;
+}
+
+.text-big{
+  font-size: 1.5rem;
+}
+
+
+
+.center_to_image{
+  position: absolute;
+  left: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 100%;
+  text-align: center;
+}
+
+
+.center_img {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.padding_cell {
+  padding: 0.75rem 0.5rem;
+}
+
+@media (max-width: 3000px) {
+  .q-parallax__media > img {
+    max-height: 550px !important;
+    min-width:inherit !important;
+    min-height: inherit !important;
+  }
+}
+
+@media (max-width: 1000px) {
+  .q-parallax__media  > img {
+    max-height: 500px !important;
+    min-width:inherit !important;
+    min-height: inherit !important;
+  }
+}
+
+@media (max-width: 800px) {
+  .q-parallax__media > img {
+    max-height: 450px !important;
+    min-width:inherit !important;
+    min-height: inherit !important;
+  }
+}
+
+
+@media (max-width: 718px) {
+  .q-parallax__media > img {
+    max-height: 450px !important;
+    min-height: inherit !important;
+    min-width:100% !important;
+  }
+}
+
+// preloading images:
+@media screen {
+  div#preloader {
+    position: absolute;
+    left: -9999px;
+    top:  -9999px;
+  }
+  div#preloader img {
+    display: block;
+  }
+}
+@media print {
+  div#preloader,
+  div#preloader img {
+    visibility: hidden;
+    display: none;
+  }
 }
--- a/src/App.ts
+++ b/src/App.ts
@@ -7,10 +7,14 @@ import { Header } from './components/Header'

 import globalroutines from './globalroutines/index'
 import { GlobalStore } from './store/Modules'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { BannerCookies, CPreloadImages } from '@components'
+import { static_data } from '@src/db/static_data'

@Component({
  components: {
-    appHeader: Header
+    appHeader: Header,
+    BannerCookies, CPreloadImages
  },
  router
 })
@@ -47,7 +51,7 @@ export default class App extends Vue {
    // console.log('window.location.href', window.location.href)

    let chiamaautologin = true
-    this.listaRoutingNoLogin.forEach(mystr => {
+    this.listaRoutingNoLogin.forEach((mystr) => {
      if (window.location.href.includes(mystr)) {
        chiamaautologin = false
      }
@@ -59,9 +63,9 @@ export default class App extends Vue {
        .then((loadstorage) => {
          if (loadstorage) {

-            if (UserStore.state.lang !== '') {
+            if (toolsext.getLocale() !== '') {
              // console.log('SETLOCALE :', this.$i18n.locale)
-              this.$i18n.locale = UserStore.state.lang    // Set Lang
+              this.$i18n.locale = toolsext.getLocale()    // Set Lang
            } else {
              UserStore.mutations.setlang(this.$i18n.locale)
            }
@@ -81,5 +85,7 @@ export default class App extends Vue {

  }

-
+  get static_data() {
+    return static_data
+  }
 }
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,6 +5,10 @@
                <app-header></app-header>
                <q-ajax-bar></q-ajax-bar>

+                <CPreloadImages :arrimg="static_data.preLoadImages">
+                </CPreloadImages>
+
+
                <q-page-container>
                    <transition name="fade" mode="out-in">
                        <router-view/>
@@ -12,6 +16,7 @@
                </q-page-container>
            </q-layout>
        </div>
+        <BannerCookies urlInfo="/policy"></BannerCookies>
    </div>
 </template>
 <script lang="ts" src="./App.ts">
--- a/src/components/CImgText/CImgText.ts
+++ b/src/components/CImgText/CImgText.ts
@@ -25,6 +25,7 @@ import { Screen } from 'quasar'
 })
 export default class CImgText extends Vue {
  @Prop({ required: false, default: '' }) public src: string
+  @Prop({ required: false, default: '' }) public src2: string
  @Prop({ required: false, default: 'myclimg' }) public class1: string
  @Prop({ required: false, default: '' }) public style1: string
 }
--- a/src/components/CImgText/CImgText.vue
+++ b/src/components/CImgText/CImgText.vue
@@ -4,6 +4,7 @@
            <div class="row items-start q-col-gutter-xs imgtext">
                <div class="imgtext__img">
                    <img v-if="src" :src="src" class="myclimg" :style="style1">
+                    <img v-if="src2" :src="src2" class="myclimg" :style="style1">
                    <div class="section_text">
                    <slot></slot>
                    </div>
--- a/src/components/Footer/Footer.vue
+++ b/src/components/Footer/Footer.vue
@@ -10,7 +10,7 @@
                    <!--</span>-->


-                    <FormNewsletter v-if="static_data.SHOW_NEWSLETTER" :idwebsite="tools.appid()"
+                    <FormNewsletter v-if="static_data.functionality.SHOW_NEWSLETTER" :idwebsite="tools.appid()"
                                    :locale="tools.getLocale()">
                    </FormNewsletter>

@@ -52,7 +52,7 @@
                    </div>

                    <p class="text-center">
-                        <router-link v-if="static_data.SHOW_ONLY_POLICY" to="/policy"><span class="footer_link">{{$t('privacy_policy')}}</span></router-link>
+                        <router-link v-if="static_data.functionality.SHOW_ONLY_POLICY" to="/policy"><span class="footer_link">{{$t('privacy_policy')}}</span></router-link>
                    </p>

                </div>
--- a/src/components/FormNewsletter/FormNewsletter.vue
+++ b/src/components/FormNewsletter/FormNewsletter.vue
@@ -41,7 +41,7 @@

                </q-input>

-                <router-link to="/policy"><span class="news_link">$t('newsletter.acceptlicense')</span></router-link>
+                <router-link to="/policy"><span class="news_link">{{$t('privacy_policy')}}</span></router-link>

                <q-toggle dark v-model="accept" :label="$t('newsletter.acceptlicense')"/>

--- a/src/components/Header/Header.scss
+++ b/src/components/Header/Header.scss
@@ -286,3 +286,12 @@ canvas {
  display: inline-block;
  padding: 4px 2px;
 }
+
+.text-user {
+  text-shadow: .05rem .05rem .15rem #fff;
+  background-color: limegreen;
+  border-radius: 1rem !important;
+  text-align: center;
+  margin: 1px;
+  margin-bottom: 5px;
+}
--- a/src/components/Header/Header.ts
+++ b/src/components/Header/Header.ts
@@ -68,12 +68,12 @@ export default class Header extends Vue {
  }

  // -------------------------------------------------------------------------
-  // QUASAR Example using event to open drawer from another component or page
+  // QUASAR Example using myevent to open drawer from another component or page
  // -------------------------------------------------------------------------
  // (1) This code is inside layout file that have a drawer
  //     if this.leftDrawerOpen is true, drawer is displayed

-  // (2) Listen for an event in created
+  // (2) Listen for an myevent in created
  /*    created(){
        this.$root.$on("openLeftDrawer", this.openLeftDrawercb);
      },
@@ -85,7 +85,7 @@ export default class Header extends Vue {
      }
    }

-    // (4) In another component or page, emit the event!
+    // (4) In another component or page, emit the myevent!
    //     Call the method when clicking button etc.
    methods: {
      openLeftDrawer() {
@@ -160,7 +160,7 @@ export default class Header extends Vue {

      const color = (value === 'online') ? 'positive' : 'warning'

-      if (this.static_data.SHOW_IF_IS_SERVER_CONNECTION) {
+      if (this.static_data.functionality.SHOW_IF_IS_SERVER_CONNECTION) {

        if (!!oldValue) {
          tools.showNotif(this.$q, this.$t('connection') + ` ${value}`, {
@@ -314,6 +314,12 @@ export default class Header extends Vue {
  get Username() {
    return UserStore.state.username
  }
+  get Name() {
+    return UserStore.state.name
+  }
+  get Surname() {
+    return UserStore.state.surname
+  }

  get Verificato() {
    return UserStore.state.verified_email
--- a/src/components/Header/Header.vue
+++ b/src/components/Header/Header.vue
@@ -58,7 +58,7 @@
                -->

                <q-btn
-                        v-if="!isonline && static_data.SHOW_IF_IS_SERVER_CONNECTION"
+                        v-if="!isonline && static_data.functionality.SHOW_IF_IS_SERVER_CONNECTION"
                        flat
                        dense
                        round
@@ -102,7 +102,7 @@
                    <label>{{ $t('msg.hello') }}</label> <span v-model="prova"></span> !
                </div>-->

-                <q-btn v-if="static_data.SHOW_USER_MENU" dense flat round icon="menu" @click="right = !right">
+                <q-btn v-if="static_data.functionality.SHOW_USER_MENU" dense flat round icon="menu" @click="right = !right">
                </q-btn>

            </q-toolbar>
@@ -121,16 +121,16 @@

        </q-drawer>

-        <q-drawer v-if="static_data.SHOW_USER_MENU" v-model="right" side="right" overlay bordered>
+        <q-drawer v-if="static_data.functionality.SHOW_USER_MENU" v-model="right" side="right" overlay bordered>
            <div id="profile">
                <q-img class="absolute-top" src="../../statics/images/landing_first_section.png"
                       style="height: 150px">
-                    <div class="absolute-bottom bg-transparent text-black">
+                    <div class="absolute-bottom bg-transparent text-black center_img">

-                        <q-avatar class="q-mb-sm">
+                        <q-avatar class="q-mb-sm center_img">
                            <img src="../../statics/images/avatar-1.svg">
                        </q-avatar>
-                        <div v-if="Username" class="text-weight-bold">{{ Username }}</div>
+                        <div v-if="Username" class="text-weight-bold text-user">{{ Username }} - {{ Name }}</div>
                        <div v-else class="text-italic">{{ $t('user.loggati') }}</div>

                        <!--<span class="text-white" v-if="Verificato"> {{$t('reg.verificato')}} </span>-->
--- a/src/db/static_data.ts
+++ b/src/db/static_data.ts
@@ -2,7 +2,7 @@ import { Todos, Projects, UserStore } from '@store'
 import globalroutines from '../globalroutines/index'

 import Quasar, { date, Screen } from 'quasar'
-import { IListRoutes, ILang, IMenuList, IProject, ITodo, Privacy, IPerson } from '../model/index'
+import { IListRoutes, ILang, IMenuList, IProject, ITodo, Privacy, IPerson, IFunctionality } from '../model/index'
 import { RouteNames } from '../router/route-names'

 const ds_operatori: IPerson[] = [
@@ -40,14 +40,19 @@ const lang_available: ILang[] = [
  // { label: 'German', icon: 'fa-flag-de', value: 'de', image: '../statics/images/de.png', short: 'DE' },
 ]

-export const static_data = {
+const functionality: IFunctionality = {
  SHOW_USER_MENU: true,
  SHOW_IF_IS_SERVER_CONNECTION: false,
  ENABLE_TODOS_LOADING: true,
  ENABLE_PROJECTS_LOADING: true,
  SHOW_NEWSLETTER: false,
  SHOW_ONLY_POLICY: false,
+  EVENTS_CAN_BOOKING: false

+}
+
+export const static_data = {
+  functionality,
  ds_operatori,
  lang_available,
  arrLangUsed
--- a/src/model/Calendar.ts
+++ b/src/model/Calendar.ts
@@ -1,5 +1,6 @@

 export interface IEvents {
+  _id?: any
  time?: string
  duration?: number
  duration2?: number
@@ -18,9 +19,23 @@ export interface IEvents {
  avatar2?: string
  infoextra?: string
  linkpdf?: string
+  nobookable?: boolean
+}
+
+export interface IBookedEvent {
+  id_bookedevent?: any
+  numpeople: number
+  infoevent: string
+  msgbooking: string
+  datebooked?: Date
+  booked: boolean
 }

 export interface ICalendarState {
+  editable: boolean
+  eventlist: IEvents[]
+  bookedevent: IBookedEvent[]
+  // ---------------
  titlebarHeight: number
  locale: string,
  maxDays: number,
--- a/src/model/GlobalStore.ts
+++ b/src/model/GlobalStore.ts
@@ -139,6 +139,7 @@ export interface ITimeLineEntry {
  image2?: string
  image3?: string
  image4?: string
+  video?: string
  side: string
  link_url?: string
  link_url_lang?: IAllLang
@@ -166,6 +167,7 @@ export interface IColl {
  date: string
  subtitle?: IAllLang
  img: string
+  img2?: string
  linkagg?: string
  linkagg_type?: number
  width?: number
@@ -176,3 +178,19 @@ export interface ICollaborations {
  withwhom_title: IAllLang
  list: IColl[]
 }
+
+export interface IParamDialog {
+  param1?: any
+  param2?: any
+  param3?: any
+}
+
+export interface IFunctionality {
+  SHOW_USER_MENU?: boolean
+  SHOW_IF_IS_SERVER_CONNECTION?: boolean
+  ENABLE_TODOS_LOADING?: boolean
+  ENABLE_PROJECTS_LOADING?: boolean
+  SHOW_NEWSLETTER?: boolean
+  SHOW_ONLY_POLICY?: boolean
+  EVENTS_CAN_BOOKING?: false
+}
--- a/src/model/UserStore.ts
+++ b/src/model/UserStore.ts
@@ -3,6 +3,8 @@ import { IToken } from 'model/other'
 export const DefaultUser = <IUserState>{
  email: '',
  username: '',
+  name: '',
+  surname: '',
  password: '',
  lang: 'it'
 }
@@ -11,6 +13,8 @@ export interface IUserState {
  userId?: string
  email?: string
  username?: string
+  name?: string
+  surname?: string
  password?: string
  lang?: string
  repeatPassword?: string
--- a/src/model/index.ts
+++ b/src/model/index.ts
@@ -1,3 +1,5 @@
+import { IBookingState } from '@src/model/BookingStore'
+
 export * from './UserStore'
 export * from './GlobalStore'
 export * from './signin-option'
@@ -11,3 +13,4 @@ export * from './Projects'

 export * from './Calendar'
 export * from './Estimate'
+export * from './BookingStore'
--- a/src/model/signup-option.ts
+++ b/src/model/signup-option.ts
@@ -2,6 +2,8 @@
 export interface ISignupOptions {
  email?: string
  username: string
+  name?: string
+  surname?: string
  password?: string
  lang?: string
  repeatPassword?: string
--- a/src/root/home/home.scss
+++ b/src/root/home/home.scss
@@ -1,13 +1,3 @@
-body {
-  font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  color: #a7a7a7;
-  line-height: 1.5;
-  //font-size: 1rem;
-}
-
-$grayshadow: #555;

 .testo-banda {
  //background: -webkit-gradient(linear, left top, left bottom, from(#3144f0), to(transparent));
@@ -15,9 +5,18 @@ $grayshadow: #555;
  //background: rgba(0, 0, 0, .6)
 }

+$grayshadow: #555;
+
+$textcol: blue;
+$textcol_scuro: darkblue;
+
 p {
-  margin: 0 0 16px;
-  text-shadow: 2px 2px 4px $grayshadow;
+  margin: 0 0 1.25rem;
+  //text-shadow: .125rem .125rem .25rem $grayshadow;
+}
+
+h4 {
+  font-size: 1.25rem;
 }

 .mycard {
@@ -28,7 +27,7 @@ p {
 }

 .landing_background {
-  background: #000 url(../../statics/images/cover.jpg) no-repeat 50% fixed;
+  background: #000 url(../../statics/images/foto1.jpg) no-repeat 50% fixed;
  background-size: cover
 }

@@ -42,8 +41,51 @@ p {
  //padding: 0 16px
 }

+.intro {
+  display: flex;
+  justify-content: space-between;
+  align-items: stretch;
+  /* flex-flow: row nowrap; */
+
+  padding: 1.25rem 0 1.25rem 0;
+  margin: .125rem;
+
+  * {
+    width: 100%;
+    flex: 1;
+    margin-left: auto;
+    margin-right: auto;
+  }
+
+  &__associazione {
+    min-width: 350px;
+  }
+
+  &__comeassociarsi{
+    min-width: 350px;
+  }
+}
+
+.subtitle {
+  font-weight: 600;
+  text-align: center;
+  letter-spacing: 0.125rem;
+  text-transform: uppercase;
+  font-size: 1rem;
+}
+
 .landing > section.padding {
-  padding: 90px 16px
+  padding: 5.62rem 1rem;
+}
+
+.landing > section.padding_testo {
+  padding-top: 1.25rem;
+  padding-bottom: 1rem;
+}
+
+.landing > section.padding_gallery {
+  padding-top: 3.125rem;
+  padding-bottom: 5.625rem;
 }

 .landing > section > div {
@@ -59,7 +101,7 @@ p {
 }

 .landing__toolbar .q-btn {
-  border-radius: 0 0 5px 5px;
+  border-radius: 0 0 .315rem .315rem;
  -ms-flex-item-align: stretch;
  align-self: stretch
 }
@@ -73,7 +115,7 @@ p {
 }

 .landing__arrow {
-  bottom: 25px;
+  bottom: 1.5rem;
  opacity: .4
 }

@@ -83,24 +125,24 @@ p {
 }

 .landing__logo {
-  width: 150px;
-  height: 150px;
-  margin-top: 21px;
+  width: 9.40rem;
+  height: 9.40rem;
+  margin-top: 1.315rem;
  //-webkit-animation: logo-rotate 240s linear infinite;
  //animation: logo-rotate 240s linear infinite
 }

 .landing__features .q-icon {
-  font-size: 64px
+  font-size: 4rem
 }

 h4 {
  line-height: 1.5;
-  text-shadow: 4px 4px 8px $grayshadow;
+  text-shadow: .25rem .25rem .5rem $grayshadow;
 }

 .landing__features h4, .landing__features h6 {
-  margin: 26px 0
+  margin: 1rem 0
 }

 .landing__features p {
@@ -111,19 +153,22 @@ h4 {

 .landing__footer {
  //background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, rgba(0, 0, 0, .1)), to(#000));
-  background: linear-gradient(180deg, rgba(0, 0, 0, .8) 75%, #FFF);
-  padding-top: 72px !important;
-  padding-bottom: 72px !important
+  background: linear-gradient(180deg, rgba(0, 0, 0, .8) 95%, #FFF);
+  padding-top: 4.5rem !important;
+  padding-bottom: 4.5rem !important;
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
+  color: #9f9f9f;
 }

 .icon_contact:hover {
  color: blue;
  border-color: white;
-  border-width: 1px;
+  border-width: .0625rem;
 }

 .landing__footer .doc-link {
-  color: #fff
+  color: $textcol;
 }

 .landing__footer .doc-link:hover {
@@ -147,7 +192,7 @@ h4 {
 }

 .q-col-gutter-sm {
-  padding: 50px 50px;
+  padding: 3.125rem 3.125rem;
  //margin-left: -48px
 }

@@ -187,7 +232,7 @@ body.mobile .landing:before {

 .home {
  //background-color: rgb(250, 250, 250);
-  padding: 5px;
+  padding: 3.125rem;
  display: flex;
  //flex-wrap: nowrap;
  flex-direction: column;
@@ -196,17 +241,17 @@ body.mobile .landing:before {
 }

 .btn-start {
-  margin: 5px;
+  margin: 3.125rem;
 }

 .shadow {
  //color: white;
-  text-shadow: 2px 2px 4px $grayshadow;
+  text-shadow: 0.125rem 0.125rem 0.25rem $grayshadow;
 }

 .shadow-max {
  //color: white;
-  text-shadow: 4px 4px 8px $grayshadow;
+  text-shadow: .25rem .25rem .5rem $grayshadow;
 }

 .text-h1 {
@@ -227,45 +272,26 @@ body.mobile .landing:before {
  font-weight: 700;
 }

-.text-subtitle1 {
-  font-size: 1.35rem;
-  font-weight: 400;
-  line-height: 1.75rem;
-  text-shadow: 4px 4px 8px $grayshadow;
-  letter-spacing: .00937em;
-  &.big {
-    font-size: 1.5rem;
-  }
-}
-
-.text-subtitle2 {
-  font-size: 1.15rem;
+.text-vers{
+  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.75rem;
  letter-spacing: .00937em;
-  text-shadow: 4px 4px 8px $grayshadow;
-}
-
-.text-subtitle3 {
-  font-size: 1rem;
-  font-weight: 400;
-  line-height: 1.75rem;
-  letter-spacing: .00937em;
-  text-shadow: 2px 2px 4px $grayshadow;
+  text-shadow: .25rem .25rem .5rem $grayshadow;
 }

 .homep-cover-img-1 {
-  background: #000 url(../../statics/images/cover.jpg) no-repeat 50% fixed;
+  background: #000 url(../../statics/images/foto1.jpg) no-repeat 50% fixed;
  //transition: background-image 1s ease-in-out;
 }

 .homep-cover-img-2 {
-  background: #000 url(../../statics/images/hand_people.jpg) no-repeat 50% fixed;
+  background: #000 url(../../statics/images/foto2.jpg) no-repeat 50% fixed;
  //transition: background-image 1s ease-in-out;
 }

 .homep-cover-img-3 {
-  background: #000 url(../../statics/images/cibo_sano.jpg) no-repeat 50% fixed;
+  background: #000 url(../../statics/images/foto3.jpg) no-repeat 50% fixed;
  //transition: background-image 1s ease-in-out;
 }

@@ -274,19 +300,19 @@ body.mobile .landing:before {
 }

 .landing__footer-icons {
-  font-size: 28px
+  font-size: 1.75rem
 }

 .landing__footer-icons a {
-  margin: 0 8px 8px;
+  margin: 0 .5rem .5rem;
  text-decoration: none;
  outline: 0;
-  color: #fff;
+  color: $textcol;
  transition: color .28s
 }

 .landing__footer-icons a:hover {
-  color: #e0e0e0
+  color: $textcol_scuro;
 }

 .doc-img {
@@ -295,12 +321,12 @@ body.mobile .landing:before {

 .mylist {
  background: #3fdaff;
-  padding-left: 20px;
+  padding-left: 1.25rem;
 }

 .clgutter {
-  margin-top: 20px;
-  padding: 10px;
+  margin-top: 1.25rem;
+  padding: .62rem;
 }

 .carousel_img_3 {
@@ -321,35 +347,44 @@ body.mobile .landing:before {
    height: 7vh
  }
  .clgutter {
-    margin-top: 0px;
-    padding: 0px;
+    margin-top: 0;
+    padding: 0;
  }
  .landing__hero .text-h1 {
    font-size: 3rem;
    line-height: 3.05rem;
-    margin-bottom: 24px
+    margin-bottom: 1.5rem
  }

  .landing > section.padding {
-    padding: 40px 16px
-    //padding-bottom: 90px
+    padding: 2.5rem 1rem;
+  }
+
+  .landing > section.padding_testo {
+    padding-top: 1.25rem;
+    padding-bottom: 1rem;
+  }
+
+  .landing > section.padding_gallery {
+    padding-top: 3.125rem;
+    padding-bottom: 5.625rem;
  }

  .landing__features h4, .landing__features h6 {
-    margin: 20px 0
+    margin: 1.25rem 0
  }

  h4 {
    line-height: 1.4;
-    text-shadow: 4px 4px 8px $grayshadow;
+    text-shadow: 0.25rem 0.25rem 0.5rem $grayshadow;
  }

  .landing .feature-item {
    text-align: center;
-    margin-top: 20px;
+    margin-top: 1.25rem;
  }
  .landing__hero-content {
-    padding-bottom: 180px
+    padding-bottom: 11.25rem;
  }
  .landing__hero-btns {
    -webkit-box-pack: center;
@@ -358,17 +393,14 @@ body.mobile .landing:before {
  }

  .q-col-gutter-sm {
-    padding: 10px 5px;
+    padding: .625rem .315rem;
  }

  .text-subtitle1 {
    font-size: 1.25rem;
  }
-  .text-subtitle2 {
-    font-size: 1rem;
-  }
-  .text-subtitle3 {
-    font-size: 0.75rem;
+  .text-vers{
+    font-size: 0.6rem;
  }

  .carousel_img_3 {
@@ -382,8 +414,25 @@ body.mobile .landing:before {

 .custom-caption {
  text-align: center;
-  padding: 12px;
-  color: white;
+  padding: .75rem;
+  color: $textcol;
  background-color: rgba(0, 0, 0, .3);
 }

+.mycontacts {
+  color: gray;
+  letter-spacing: 0.078rem;
+}
+
+.mycontacts_title {
+  text-shadow: 0.125rem 0.125rem 0.125rem #555;
+  font-weight: bold;
+  color: #999;
+  letter-spacing: 0.125rem;
+}
+
+.mycontacts_text {
+  color: #999;
+  letter-spacing: 0.093rem;
+}
+
--- a/src/root/home/home.ts
+++ b/src/root/home/home.ts
@@ -4,8 +4,12 @@ import { GlobalStore, UserStore } from '@store'

 import { Logo } from '../../components/logo'

+import { Footer } from '../../components/Footer'
+
 import VueScrollReveal from 'vue-scroll-reveal'
 import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { Screen } from 'quasar'

 Vue.use(VueScrollReveal, {
  class: 'v-scroll-reveal', // A CSS class applied to elements with the v-scroll-reveal directive; useful for animation overrides.
@@ -21,7 +25,7 @@ Vue.use(VueScrollReveal, {
 })

@Component({
-  components: { Logo }
+  components: { Logo, Footer }
 })
 export default class Home extends Vue {
  public text: string = ''
--- a/src/root/home/home.vue
+++ b/src/root/home/home.vue
@@ -402,6 +402,8 @@
            <q-page-scroller position="bottom-right" :scroll-offset="850" :offset="[18, 18]" style="opacity: 0.3">
                <q-btn fab icon="keyboard_arrow_up" color="accent" />
            </q-page-scroller>
+
+	    <Footer></Footer>
        </div>

    </q-page>
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -7,6 +7,7 @@ import { ProgressBar } from '@src/store/Modules/Interface'
 import { isEqual } from 'lodash'
 import { UserStore } from '@store'
 import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'

 Vue.use(VueRouter)
 /*
@@ -16,7 +17,7 @@ Vue.use(VueRouter)

 const Router = new VueRouter({
  scrollBehavior: () => ({ x: 0, y: 0 } as PositionResult),
-  routes: cfgrouter.routes,
+  routes: cfgrouter.getmenu(),

  // Leave these as is and change from quasar.conf.js instead!
  // quasar.conf.js -> build -> vueRouterMode
--- a/src/router/route-config.ts
+++ b/src/router/route-config.ts
@@ -1,11 +1,13 @@
 import { RouteConfig, Route, RouteRecord } from 'vue-router/types'

 import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'

 import auth from '../middleware/auth'
 import { GlobalStore, Projects, Todos, UserStore } from '@store'
 import { RouteNames } from '@src/router/route-names'
 import { IListRoutes, IMenuList } from '@src/model'
+import { static_data } from '@src/db/static_data'

 interface IMyMeta {
  title?: string,
--- a/src/statics/i18n.js
+++ b/src/statics/i18n.js
@@ -9,6 +9,7 @@ const msgglobal = {
      delete: 'Elimina',
      cancel: 'Annulla',
      today: 'Oggi',
+      book: 'Prenota',
      msg: {
        titledeleteTask: 'Elimina Task',
        deleteTask: "Vuoi Eliminare {mytodo}?"
@@ -49,6 +50,8 @@ const msgglobal = {
      richiesto: 'Campo Richiesto',
      email: 'Email',
      username: 'Nome Utente',
+      name: 'Nome',
+      surname: 'Cognome',
      username_login: 'Nome Utente o email',
      password: 'Password',
      repeatPassword: 'Ripeti password',
@@ -151,6 +154,13 @@ const msgglobal = {
      themebgcolor: 'Tema Colore Sfondo'
    },
    cal: {
+      booked: 'Prenotato',
+      booked_error: 'Prenotazione non avvenuta. Riprovare più tardi',
+      booking: 'Prenota Evento',
+      titlebooking: 'Prenotazione',
+      cancelbooking: 'Cancella Prenotazione',
+      canceledbooking: 'Prenotazione Cancellata',
+      cancelederrorbooking: 'Cancellazione non effettuata, Riprovare più tardi',
      event: 'Evento',
      starttime: 'Dalle',
      endtime: 'alle',
@@ -164,7 +174,11 @@ const msgglobal = {
      infoextra: 'Date e Ora Extra:',
      alldayevent: 'Tutto il giorno',
      eventstartdatetime: 'Data e Ora Inizio Evento',
-      enterEndDateTime: 'Data e Ora Fine Evento'
+      enterEndDateTime: 'Data e Ora Fine Evento',
+      selnumpeople: 'Partecipanti',
+      msgbooking: 'Messaggio da inviare',
+      bookingtextdefault: 'Mi prenoto all\'evento',
+      bookingtextdefault_of: 'di'
    },
    newsletter: {
      title: 'Desideri ricevere la nostra Newsletter?',
@@ -191,6 +205,7 @@ const msgglobal = {
      delete: 'Borrar',
      cancel: 'Cancelar',
      today: 'Hoy',
+      book: 'Reserva',
      msg: {
        titledeleteTask: 'Borrar Tarea',
        deleteTask: 'Quieres borrar {mytodo}?'
@@ -231,6 +246,8 @@ const msgglobal = {
      richiesto: 'Campo requerido',
      email: 'Email',
      username: 'Nombre usuario',
+      name: 'Nombre',
+      surname: 'Apellido',
      username_login: 'Nombre usuario o email',
      password: 'contraseña',
      repeatPassword: 'Repetir contraseña',
@@ -327,6 +344,13 @@ const msgglobal = {
      themebgcolor: 'Tema Colores Fondo'
    },
    cal: {
+      booked: 'Reservado',
+      booked_error: 'Reserva fallida. Intenta nuevamente más tarde',
+      booking: 'Reserva Evento',
+      titlebooking: 'Reserva',
+      cancelbooking: 'Cancelar Reserva',
+      canceledbooking: 'Reserva Cancelada',
+      cancelederrorbooking: 'Cancelación no realizada, intente nuevamente más tarde',
      event: 'Evento',
      starttime: 'Inicio',
      endtime: 'fin',
@@ -340,7 +364,11 @@ const msgglobal = {
      infoextra: 'Fecha y Hora Extras:',
      alldayevent: 'Todo el dia',
      eventstartdatetime: 'Evento de inicio de fecha y hora',
-      enterEndDateTime: 'Fecha y hora del evento final'
+      enterEndDateTime: 'Fecha y hora del evento final',
+      selnumpeople: 'Partecipantes',
+      msgbooking: 'Mensaje para enviar',
+      bookingtextdefault: 'Reservo el evento',
+      bookingtextdefault_of: 'de',
    },
    newsletter: {
      title: '¿Desea recibir nuestro boletín informativo?',
@@ -367,6 +395,7 @@ const msgglobal = {
      delete: 'Supprimer',
      cancel: 'annuler',
      today: 'Aujourd\'hui',
+      book: 'Réserve',
      msg: {
        titledeleteTask: 'Supprimer la tâche',
        deleteTask: 'Voulez-vous supprimer {mytodo}?'
@@ -406,6 +435,8 @@ const msgglobal = {
      richiesto: 'Champ obligatoire',
      email: 'Email',
      username: 'Nom d\'utilisateur',
+      name: 'Nom',
+      surname: 'Prénom',
      username_login: 'Nom d\'utilisateur ou email',
      password: 'mot de passe',
      repeatPassword: 'Répéter le mot de passe',
@@ -502,6 +533,13 @@ const msgglobal = {
      themebgcolor: 'Tema Colores Fondo'
    },
    cal: {
+      booked: 'Réservé',
+      booked_error: 'La réservation a échoué. Réessayez plus tard',
+      booking: 'Réserver l\'événement',
+      titlebooking: 'Réservation',
+      cancelbooking: 'Annuler la réservation',
+      canceledbooking: 'Réservation annulée',
+      cancelederrorbooking: 'Annulation non effectuée, réessayez plus tard',
      event: 'événement',
      starttime: 'Accueil',
      endtime: 'fin',
@@ -515,7 +553,11 @@ const msgglobal = {
      infoextra: 'Extras Date et heure:',
      alldayevent: 'Toute la journée',
      eventstartdatetime: 'Date de début et heure de l\'événement',
-      enterEndDateTime: 'Date et heure de l\'événement final'
+      enterEndDateTime: 'Date et heure de l\'événement final',
+      selnumpeople: 'Participants',
+      msgbooking: 'Message à envoyer',
+      bookingtextdefault: 'Je réserve l\'événement',
+      bookingtextdefault_of: 'du',
    },
    newsletter: {
      title: 'Souhaitez-vous recevoir notre newsletter?',
@@ -542,6 +584,7 @@ const msgglobal = {
      delete: 'Delete',
      cancel: 'Cancel',
      today: 'Today',
+      book: 'Book',
      msg: {
        titledeleteTask: 'Delete Task',
        deleteTask: 'Delete Task {mytodo}?'
@@ -582,6 +625,8 @@ const msgglobal = {
      email: 'Email',
      username_login: 'Username or email',
      username: 'Username',
+      name: 'Name',
+      surname: 'Surname',
      password: 'Password',
      repeatPassword: 'Repeat password',
      terms: "I agree with the terms and conditions",
@@ -676,6 +721,13 @@ const msgglobal = {
      themebgcolor: 'Theme Color Background'
    },
    cal: {
+      booked: 'Booked',
+      booked_error: 'Reservation failed. Try again later',
+      booking: 'Book the Event',
+      titlebooking: 'Reservation',
+      cancelbooking: 'Cancel Reservation',
+      canceledbooking: 'Booking cancelled',
+      cancelederrorbooking: 'Cancellation unsuccessfully, try again later',
      event: 'Event',
      starttime: 'From',
      endtime: 'to',
@@ -687,9 +739,13 @@ const msgglobal = {
      enterdate: 'Enter date',
      details: 'Details',
      infoextra: 'Extra Info DateTime',
-      alldayevent: 'All-Day event',
+      alldayevent: 'All-Day myevent',
      eventstartdatetime: 'Event start date and time',
-      enterEndDateTime: 'Event end date and time'
+      enterEndDateTime: 'Event end date and time',
+      selnumpeople: 'Participants',
+      msgbooking: 'Message to send',
+      bookingtextdefault: 'I book the event',
+      bookingtextdefault_of: 'of',
    },
    newsletter: {
      title: 'Would you like to receive our Newsletter?',
@@ -716,6 +772,7 @@ const msgglobal = {
      delete: 'Delete',
      cancel: 'Cancel',
      today: 'Today',
+      book: 'Book',
      msg: {
        titledeleteTask: 'Delete Task',
        deleteTask: 'Delete Task {mytodo}?'
@@ -757,6 +814,8 @@ const msgglobal = {
      email: 'Email',
      username_login: 'Username or email',
      username: 'Username',
+      name: 'Name',
+      surname: 'Surname',
      password: 'Password',
      repeatPassword: 'Repeat password',
      terms: "I agree with the terms and conditions",
@@ -852,6 +911,13 @@ const msgglobal = {
      themebgcolor: 'Theme Color Background'
    },
    cal: {
+      booked: 'Booked',
+      booked_error: 'Reservation failed. Try again later',
+      booking: 'Book the Event',
+      titlebooking: 'Reservation',
+      cancelbooking: 'Cancel Reservation',
+      canceledbooking: 'Booking cancelled',
+      cancelederrorbooking: 'Cancellation unsuccessfully, try again later',
      event: 'Event',
      starttime: 'From',
      endtime: 'to',
@@ -863,9 +929,13 @@ const msgglobal = {
      enterdate: 'Enter date',
      details: 'Details',
      infoextra: 'Extra Info DateTime',
-      alldayevent: 'All-Day event',
+      alldayevent: 'All-Day myevent',
      eventstartdatetime: 'Event start date and time',
-      enterEndDateTime: 'Event end date and time'
+      enterEndDateTime: 'Event end date and time',
+      selnumpeople: 'Participants',
+      msgbooking: 'Message to send',
+      bookingtextdefault: 'I book the event',
+      bookingtextdefault_of: 'of',
    },
    newsletter: {
      title: 'Would you like to receive our Newsletter?',
--- a/src/store/Modules/Projects.ts
+++ b/src/store/Modules/Projects.ts
@@ -274,7 +274,7 @@ namespace Actions {

  async function dbLoad(context, { checkPending, onlyiffirsttime }) {

-    if (!static_data.ENABLE_PROJECTS_LOADING)
+    if (!static_data.functionality.ENABLE_PROJECTS_LOADING)
      return null

    if (onlyiffirsttime) {
@@ -442,7 +442,6 @@ namespace Actions {
    modify: b.dispatch(modify),
    ActionCutPaste: b.dispatch(ActionCutPaste)
  }
-
 }

 // Module
--- a/src/store/Modules/Store/calendar/CalendarStore.ts
+++ b/src/store/Modules/Store/calendar/CalendarStore.ts
@@ -1,5 +1,5 @@
 import Api from '@api'
-import { ICalendarState } from 'model'
+import { IBookedEvent, ICalendarState, IEvents } from 'model'
 import { ILinkReg, IResult, IIdToken, IToken } from 'model/other'
 import { storeBuilder } from '../Store'

@@ -8,9 +8,15 @@ import { tools } from '../../tools'

 import translate from '../../../../globalroutines/util'
 import * as Types from '../../../Api/ApiTypes'
+import { db_data } from '@src/db/db_data'
+import { UserStore } from '@store'

 // State
 const state: ICalendarState = {
+  editable: false,
+  eventlist: [],
+  bookedevent: [],
+  // ---------------
  titlebarHeight: 0,
  locale: 'it-IT',
  maxDays: 1,
@@ -24,7 +30,7 @@ const state: ICalendarState = {
  noScroll: false,
  showMonthLabel: false,
  showWorkWeeks: false,
-  intervalRange: {min: 9, max: 23},
+  intervalRange: { min: 9, max: 23 },
  intervalRangeStep: 1,
  intervalHeight: 35,
  resourceHeight: 60,
@@ -39,19 +45,15 @@ const stateGetter = b.state()

 namespace Getters {

-  // const lang = b.read((state) => {
-  //   if (state.lang !== '') {
-  //     return state.lang
-  //   } else {
-  //     return process.env.LANG_DEFAULT
-  //   }
-  // }, 'lang')
-  //
-  // export const getters = {
-  //   get lang() {
-  //     return lang()
-  //   },
-  // }
+  const findEventBooked = b.read((mystate: ICalendarState) => (myevent: IEvents, isconfirmed: boolean) => {
+    return mystate.bookedevent.find((bookedevent) => (bookedevent.id_bookedevent === myevent._id) && ((isconfirmed && bookedevent.booked) || (!isconfirmed)))
+  }, 'findEventBooked')
+
+  export const getters = {
+    get findEventBooked() {
+      return findEventBooked()
+    }
+  }

 }

@@ -67,6 +69,104 @@ namespace Mutations {
 }

 namespace Actions {
+  async function loadAfterLogin(context) {
+    // Load local data
+    state.editable = db_data.userdata.calendar_editable
+    state.eventlist = db_data.events
+    // state.bookedevent = db_data.userdata.bookedevent
+
+    // Load local data
+    console.log('CALENDAR loadAfterLogin', 'userid=', UserStore.state.userId)
+
+    let ris = null
+
+    ris = await Api.SendReq('/booking/' + UserStore.state.userId + '/' + process.env.APP_ID, 'GET', null)
+      .then((res) => {
+        if (res.data.bookedevent) {
+          state.bookedevent = res.data.bookedevent
+        } else {
+          state.bookedevent = []
+        }
+      })
+      .catch((error) => {
+        console.log('error dbLoad', error)
+        // UserStore.mutations.setErrorCatch(error)
+        return new Types.AxiosError(serv_constants.RIS_CODE_ERR, null, tools.ERR_GENERICO, error)
+      })
+
+    return ris
+
+  }
+
+  function getparambyevent(bookevent) {
+    return {
+      id_bookedevent: bookevent.id_bookedevent,
+      infoevent: bookevent.infoevent,
+      numpeople: bookevent.numpeople,
+      msgbooking: bookevent.msgbooking,
+      datebooked: bookevent.datebooked,
+      userId: UserStore.state.userId,
+      booked: bookevent.booked,
+    }
+  }
+
+  async function BookEvent(context, bookevent: IBookedEvent) {
+    console.log('BookEvent', bookevent)
+
+    const param = getparambyevent(bookevent)
+
+    return await Api.SendReq('/booking', 'POST', param)
+      .then((res) => {
+        if (res.status === 200) {
+          if (res.data.code === serv_constants.RIS_CODE_OK) {
+            state.bookedevent.push(bookevent)
+            return true
+          }
+        }
+        return false
+      })
+      .catch((error) => {
+        console.error(error)
+        return false
+      })
+
+  }
+
+  async function CancelBookingEvent(context, event: IEvents) {
+    console.log('CALSTORE: CancelBookingEvent', event)
+
+    const myeventtoCancel = state.bookedevent.find((eventbooked) => (eventbooked.id_bookedevent === event._id))
+
+    const param = getparambyevent(myeventtoCancel)
+    param.booked = false // Cancel Booking
+
+    return await Api.SendReq('/booking', 'POST', param)
+      .then((res) => {
+        if (res.status === 200) {
+          if (res.data.code === serv_constants.RIS_CODE_OK) {
+
+            state.bookedevent = state.bookedevent.filter((eventbooked) => (eventbooked.id_bookedevent !== event._id))
+
+            return true
+          }
+        }
+        return false
+
+      })
+      .catch((error) => {
+        console.error(error)
+        // UserStore.mutations.setErrorCatch(error)
+        return false
+      })
+
+
+  }
+
+  export const actions = {
+    loadAfterLogin: b.dispatch(loadAfterLogin),
+    BookEvent: b.dispatch(BookEvent),
+    CancelBookingEvent: b.dispatch(CancelBookingEvent)
+  }

  // async function resetpwd(context, paramquery: ICalendarState) {
  // }
@@ -80,9 +180,9 @@ namespace Actions {
 const CalendarModule = {
  get state() {
    return stateGetter()
-  }
-  // actions: Actions.actions,
-  // getters: Getters.getters,
+  },
+  actions: Actions.actions,
+  getters: Getters.getters
  // mutations: Mutations.mutations
 }

--- a/src/store/Modules/Todos.ts
+++ b/src/store/Modules/Todos.ts
@@ -253,7 +253,7 @@ namespace Actions {

  async function dbLoad(context, { checkPending }) {

-    if (!static_data.ENABLE_PROJECTS_LOADING)
+    if (!static_data.functionality.ENABLE_PROJECTS_LOADING)
      return null

    console.log('dbLoad', nametable, checkPending, 'userid=', UserStore.state.userId)
--- a/src/store/Modules/UserStore.ts
+++ b/src/store/Modules/UserStore.ts
@@ -7,9 +7,11 @@ import router from '@router'
 import { serv_constants } from '../Modules/serv_constants'
 import { tools } from '../Modules/tools'
 import { toolsext } from '@src/store/Modules/toolsext'
-import { GlobalStore, UserStore, Todos, Projects } from '@store'
+import { GlobalStore, UserStore, Todos, Projects, BookingStore, CalendarStore } from '@store'
 import globalroutines from './../../globalroutines/index'

+import { static_data } from '@src/db/static_data'
+
 import translate from './../../globalroutines/util'
 import * as Types from '@src/store/Api/ApiTypes'

@@ -20,6 +22,8 @@ const state: IUserState = {
  userId: '',
  email: '',
  username: '',
+  name: '',
+  surname: '',
  password: '',
  lang: process.env.LANG_DEFAULT,
  repeatPassword: '',
@@ -108,6 +112,8 @@ namespace Mutations {
  function authUser(state: IUserState, data: IUserState) {
    state.userId = data.userId
    state.username = data.username
+    state.name = data.name
+    state.surname = data.surname
    if (data.verified_email) {
      state.verified_email = data.verified_email
    }
@@ -176,6 +182,8 @@ namespace Mutations {
  function clearAuthData(state: IUserState) {
    state.userId = ''
    state.username = ''
+    state.name = ''
+    state.surname = ''
    resetArrToken(state.tokens)
    state.x_auth_token = ''
    state.verified_email = false
@@ -221,7 +229,6 @@ namespace Mutations {
    setErrorCatch: b.commit(setErrorCatch),
    getMsgError: b.commit(getMsgError)
  }
-
 }

 namespace Actions {
@@ -318,6 +325,8 @@ namespace Actions {
          email: authData.email,
          password: String(hashedPassword),
          username: authData.username,
+          name: authData.name,
+          surname: authData.surname,
        }

        console.log(usertosend)
@@ -336,6 +345,8 @@ namespace Actions {
            if (res.status === 200) {
              const userId = newuser._id
              const username = authData.username
+              const name = authData.name
+              const surname = authData.surname
              if (process.env.DEV) {
                console.log('USERNAME = ' + username)
                console.log('IDUSER= ' + userId)
@@ -344,6 +355,8 @@ namespace Actions {
              Mutations.mutations.authUser({
                userId,
                username,
+                name,
+                surname,
                verified_email: false
              })

@@ -353,6 +366,8 @@ namespace Actions {
              localStorage.setItem(tools.localStorage.lang, state.lang)
              localStorage.setItem(tools.localStorage.userId, userId)
              localStorage.setItem(tools.localStorage.username, username)
+              localStorage.setItem(tools.localStorage.name, name)
+              localStorage.setItem(tools.localStorage.surname, surname)
              localStorage.setItem(tools.localStorage.token, state.x_auth_token)
              localStorage.setItem(tools.localStorage.expirationDate, expirationDate.toString())
              localStorage.setItem(tools.localStorage.verified_email, String(false))
@@ -438,11 +453,15 @@ namespace Actions {
          if (myuser) {
            const userId = myuser.userId
            const username = authData.username
+            const name = myuser.name
+            const surname = myuser.surname
            const verified_email = myuser.verified_email

            Mutations.mutations.authUser({
              userId,
              username,
+              name,
+              surname,
              verified_email
            })

@@ -452,6 +471,8 @@ namespace Actions {
            localStorage.setItem(tools.localStorage.lang, state.lang)
            localStorage.setItem(tools.localStorage.userId, userId)
            localStorage.setItem(tools.localStorage.username, username)
+            localStorage.setItem(tools.localStorage.name, name)
+            localStorage.setItem(tools.localStorage.surname, surname)
            localStorage.setItem(tools.localStorage.token, state.x_auth_token)
            localStorage.setItem(tools.localStorage.expirationDate, expirationDate.toString())
            localStorage.setItem(tools.localStorage.isLogged, String(true))
@@ -486,6 +507,8 @@ namespace Actions {
    localStorage.removeItem(tools.localStorage.token)
    localStorage.removeItem(tools.localStorage.userId)
    localStorage.removeItem(tools.localStorage.username)
+    localStorage.removeItem(tools.localStorage.name)
+    localStorage.removeItem(tools.localStorage.surname)
    localStorage.removeItem(tools.localStorage.isLogged)
    // localStorage.removeItem(rescodes.localStorage.leftDrawerOpen)
    localStorage.removeItem(tools.localStorage.verified_email)
@@ -512,6 +535,7 @@ namespace Actions {
  }

  async function setGlobal(isLogged: boolean) {
+    // console.log('setGlobal')
    // state.isLogged = true
    state.isLogged = isLogged
    if (isLogged) {
@@ -522,12 +546,17 @@ namespace Actions {
      GlobalStore.actions.checkUpdates()
    }

-    return await GlobalStore.actions.loadAfterLogin()
-      .then(() => {
-        return Todos.actions.dbLoad({ checkPending: true })
-      }).then(() => {
-        return Projects.actions.dbLoad({ checkPending: true, onlyiffirsttime: true })
-      })
+    const p = await BookingStore.actions.loadAfterLogin()
+    const p2 = await CalendarStore.actions.loadAfterLogin()
+
+    const p3 = await GlobalStore.actions.loadAfterLogin()
+
+    if (static_data.functionality.ENABLE_TODOS_LOADING)
+      await Todos.actions.dbLoad({ checkPending: true })
+
+    if (static_data.functionality.ENABLE_PROJECTS_LOADING)
+      await Projects.actions.dbLoad({ checkPending: true, onlyiffirsttime: true })
+
  }

  async function autologin_FromLocalStorage(context) {
@@ -547,6 +576,8 @@ namespace Actions {
        if (now < expirationDate) {
          const userId = String(localStorage.getItem(tools.localStorage.userId))
          const username = String(localStorage.getItem(tools.localStorage.username))
+          const name = String(localStorage.getItem(tools.localStorage.name))
+          const surname = String(localStorage.getItem(tools.localStorage.surname))
          const verified_email = localStorage.getItem(tools.localStorage.verified_email) === 'true'

          GlobalStore.state.wasAlreadySubOnDb = localStorage.getItem(tools.localStorage.wasAlreadySubOnDb) === 'true'
@@ -558,6 +589,8 @@ namespace Actions {
          Mutations.mutations.authUser({
            userId,
            username,
+            name,
+            surname,
            verified_email
          })

--- a/src/store/Modules/costanti.ts
+++ b/src/store/Modules/costanti.ts
@@ -10,5 +10,9 @@ export const costanti = {
  CONFIG_ID_STATE_CONN: '2',
  CONFIG_ID_SHOW_TYPE_TODOS: '3',

+  FuncDialog: {
+    CANCEL_BOOKING: 1
+  },
+
  MAX_PHASES: 5,
 }
--- a/src/store/Modules/index.ts
+++ b/src/store/Modules/index.ts
@@ -1,5 +1,6 @@
 export {storeBuilder} from './Store/Store'
 export {default as GlobalStore} from './GlobalStore'
+export {default as BookingStore} from './BookingStore'
 export {default as UserStore} from './UserStore'
 export {default as Todos} from './Todos'
 export {default as Projects} from './Projects'
--- a/src/store/Modules/tools.ts
+++ b/src/store/Modules/tools.ts
@@ -1,10 +1,10 @@
-import { Todos, Projects, UserStore } from '@store'
+import { Todos, Projects, UserStore, CalendarStore } from '@store'
 import globalroutines from './../../globalroutines/index'
 import { costanti } from './costanti'
 import { toolsext } from './toolsext'
 import { translation } from './translation'
 import Quasar, { date, Screen } from 'quasar'
-import { ICollaborations, IListRoutes, IMenuList, IProject, ITodo, Privacy } from '@src/model'
+import { ICollaborations, IListRoutes, IMenuList, IParamDialog, IProject, ITodo, Privacy } from '@src/model'
 import * as ApiTables from '@src/store/Modules/ApiTables'
 import translate from '@src/globalroutines/util'
 import { RouteNames } from '@src/router/route-names'
@@ -55,6 +55,8 @@ export const tools = {
    userId: 'uid',
    token: 'tk',
    username: 'uname',
+    name: 'nm',
+    surname: 'sn',
    lang: 'lg'
  },

@@ -70,6 +72,35 @@ export const tools = {
    COMPLETED: 10
  },

+  SelectListNumPeople: [
+    {
+      id: 1,
+      label: '1',
+      value: 1
+    },
+    {
+      id: 2,
+      label: '2',
+      value: 2
+    },
+    {
+      id: 3,
+      label: '3',
+      value: 3
+    },
+    {
+      id: 4,
+      label: '4',
+      value: 4
+    },
+    {
+      id: 5,
+      label: '5',
+      value: 5
+    },
+  ]
+  ,
+
  selectPhase: {
    it: [
      {
@@ -1267,8 +1298,48 @@ export const tools = {
      result.push(json[key])
    })
    return result
+  },
+
+  executefunc(myself: any, myfunc: number, par: IParamDialog) {
+    if (myfunc === costanti.FuncDialog.CANCEL_BOOKING) {
+      console.log(' ENTRATO ! CancelBookingEvent ')
+      CalendarStore.actions.CancelBookingEvent(par.param1).then(ris => {
+        if (ris)
+          tools.showPositiveNotif(myself.$q, myself.$t('cal.canceledbooking') + ' "' + par.param1.title + '"')
+        else
+          tools.showNegativeNotif(myself.$q, myself.$t('cal.cancelederrorbooking'))
+      })
    }
-  ,
+  },
+
+  async askConfirm($q: any, mytitle, mytext, ok, cancel, myself: any, funcok: number, funccancel: number, par: IParamDialog) {
+    return $q.dialog({
+      message: mytext,
+      ok: {
+        label: ok,
+        push: true
+      },
+      title: mytitle,
+      cancel: true,
+      persistent: false
+    }).onOk(() => {
+      console.log('OK')
+      tools.executefunc(myself, funcok, par)
+      return true
+    }).onCancel(() => {
+      console.log('CANCEL')
+      tools.executefunc(myself, funccancel, par)
+      return false
+    })
+  },
+
+  showPositiveNotif(q: any, msg) {
+    tools.showNotif(q, msg, { color: 'positive', icon: 'notifications' })
+  },
+
+  showNegativeNotif(q: any, msg) {
+    tools.showNotif(q, msg, { color: 'negative', icon: 'notifications' })
+  },

  showNotif(q: any, msg, data ?: INotify | null
  ) {
@@ -1728,7 +1799,6 @@ export const tools = {

  },

-
  heightgallery() {
    if (Screen.width < 400) {
      return '200px'
@@ -1993,10 +2063,19 @@ export const tools = {
      return { path: '', file: fileimg }
    }

+  },
+
+  convertHTMLtoText(myhtml) {
+    let msg = myhtml
+    msg = msg.replace('&quot;', '"')
+    msg = msg.replace('&gt;', '>')
+    msg = msg.replace('&lt;', '<')
+    msg = msg.replace('&amp;', '&')
+    msg = msg.replace('<br>', '\n')
+
+    return msg
  }

-
-
 // getLocale() {
  //   if (navigator.languages && navigator.languages.length > 0) {
  //     return navigator.languages[0]
--- a/src/store/Modules/toolsext.ts
+++ b/src/store/Modules/toolsext.ts
@@ -27,7 +27,7 @@ export const func_tools = {

  getDateStr(mydate) {
    const DateFormatter = new Intl.DateTimeFormat(func_tools.getLocale() || void 0, {
-      weekday: 'long',
+      weekday: 'short',
      day: 'numeric',
      month: 'long',
      year: 'numeric'
--- a/src/views/login/signup/signup-validate.ts
+++ b/src/views/login/signup/signup-validate.ts
@@ -19,6 +19,12 @@ export const validations = {
          registereduser,
          required
        },
+        name: {
+          required
+        },
+        surname: {
+          required
+        },
        email: {
          email,
          registeredemail,
--- a/src/views/login/signup/signup.ts
+++ b/src/views/login/signup/signup.ts
@@ -30,9 +30,11 @@ export default class Signup extends Vue {
  public signup: ISignupOptions = {
    email: process.env.TEST_EMAIL || '',
    username: process.env.TEST_USERNAME || '',
+    name: process.env.TEST_NAME || '',
+    surname: process.env.TEST_SURNAME || '',
    password: process.env.TEST_PASSWORD || '',
    repeatPassword: process.env.TEST_PASSWORD || '',
-    terms: process.env.PROD ? false : true
+    terms: !process.env.PROD
  }

  public created() {
@@ -107,6 +109,9 @@ export default class Signup extends Vue {
      } else if (cosa === 'username') {
        // console.log(item);
        if (!item.isUnique) { return this.$t('reg.err.duplicate_username') }
+      } else if ((cosa === 'name') || (cosa === 'surname')) {
+        // console.log(item);
+
      }

      if (!item.complexity) { return this.$t('reg.err.complexity') }
--- a/src/views/login/signup/signup.vue
+++ b/src/views/login/signup/signup.vue
@@ -41,6 +41,38 @@

            </q-input>

+            <q-input
+                    v-model="signup.name"
+                    rounded outlined
+                    @blur="$v.signup.name.$touch"
+                    :error="$v.signup.name.$error"
+                    bottom-slots
+                    debounce="1000"
+                    :error-message="errorMsg('name', $v.signup.name)"
+                    :label="$t('reg.name')">
+
+                <template v-slot:prepend>
+                    <q-icon name="person"/>
+                </template>
+
+            </q-input>
+
+            <q-input
+                    v-model="signup.surname"
+                    rounded outlined
+                    @blur="$v.signup.surname.$touch"
+                    :error="$v.signup.surname.$error"
+                    bottom-slots
+                    debounce="1000"
+                    :error-message="errorMsg('surname', $v.signup.surname)"
+                    :label="$t('reg.surname')">
+
+                <template v-slot:prepend>
+                    <q-icon name="person"/>
+                </template>
+
+            </q-input>
+
            <q-input
                    v-model="signup.password"
                    type="password"