Conversione in Typescript completata.

Manca ancora qualche errore.

src/components/HelloWorld.ts

@@ -0,0 +1,13 @@
+import { Component, Vue } from 'vue-property-decorator';
+import WithRender from './hello-world.html';
+
+
+/*
+@WithRender
+@Component
+export default class HelloWorld extends Vue {
+
+}
+
+
+*/

src/components/hello-world.html

@@ -0,0 +1,29 @@
+<div class="hello">
+    <h1>{{ msg }}</h1>
+    <p>
+        For guide and recipes on how to configure / customize this project,<br>
+        check out the
+        <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
+    </p>
+    <h3>Installed CLI Plugins</h3>
+    <ul>
+        <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
+        <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
+    </ul>
+    <h3>Essential Links</h3>
+    <ul>
+        <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
+        <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
+        <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
+        <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
+        <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
+    </ul>
+    <h3>Ecosystem</h3>
+    <ul>
+        <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
+        <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
+        <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
+        <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
+        <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
+    </ul>
+</div>

src/components/layout/drawer/drawer.vue

@@ -51,6 +51,7 @@
           Forms: {
             routes: [
               {route: '/prec', faIcon: 'fa fa-search', materialIcon: 'search', name: 'Prec'},
+              {route: '/simpleform', faIcon: 'fa fa-search', materialIcon: 'search', name: 'Simpleform'},
               { route: '/embeeded', faIcon: 'fa fa-check', materialIcon: 'check', name: 'Embeeded validations' },
               //{ route: '/advanced-form-one', faIcon: 'fa fa-hdd-o', materialIcon: 'filter_1', name: 'Adv. Form One' }
             ],

src/components/views/auth/old_signin.vue

@@ -1,102 +0,0 @@
-<template>
-  <div id="signin">
-    <div class="signin-form">
-      <form @submit.prevent="onSubmit">
-        <div class="input">
-          <label for="email">Mail</label>
-          <input
-                  type="email"
-                  id="email"
-                  v-model="email">
-        </div>
-        <div class="input">
-          <label for="password">Password</label>
-          <input
-                  type="password"
-                  id="password"
-                  v-model="password">
-        </div>
-        <div class="submit">
-          <button type="submit">Submit</button>
-        </div>
-      </form>
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    data () {
-      return {
-        email: '',
-        password: ''
-      }
-    },
-    methods: {
-      onSubmit () {
-        const formData = {
-          email: this.email,
-          password: this.password,
-        }
-        console.log(formData)
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .signin-form {
-    width: 400px;
-    margin: 30px auto;
-    border: 1px solid #eee;
-    padding: 20px;
-    box-shadow: 0 2px 3px #ccc;
-  }
-
-  .input {
-    margin: 10px auto;
-  }
-
-  .input label {
-    display: block;
-    color: #4e4e4e;
-    margin-bottom: 6px;
-  }
-
-  .input input {
-    font: inherit;
-    width: 100%;
-    padding: 6px 12px;
-    box-sizing: border-box;
-    border: 1px solid #ccc;
-  }
-
-  .input input:focus {
-    outline: none;
-    border: 1px solid #521751;
-    background-color: #eee;
-  }
-
-  .submit button {
-    border: 1px solid #521751;
-    color: #521751;
-    padding: 10px 20px;
-    font: inherit;
-    cursor: pointer;
-  }
-
-  .submit button:hover,
-  .submit button:active {
-    background-color: #521751;
-    color: white;
-  }
-
-  .submit button[disabled],
-  .submit button[disabled]:hover,
-  .submit button[disabled]:active {
-    border: 1px solid #ccc;
-    background-color: transparent;
-    color: #ccc;
-    cursor: not-allowed;
-  }
-</style>

src/components/views/form/_examples/advancedFormOne/advancedFormOne.vue

@@ -50,7 +50,7 @@
 </template>
 <script type="text/javascript">
   import { required } from 'vuelidate/lib/validators'
-  import eInput from '../embeeded/eInput.vue'
+  import eInput from '../../embeeded/eInput.vue'
   import cardUserData from './cardUserData.vue'
   //import cardDataTable from './cardDataTable.vue'
   export default {

src/components/views/login/requestresetpwd.vue

@@ -0,0 +1,124 @@
+<template>
+    <div class="mypanel">
+
+        <div v-if="!emailinviata">
+            <q-alert color="primary q-title" style="text-align: center;">
+                {{ $t('reset.title_reset_pwd')}}
+            </q-alert>
+            <br>
+
+            <q-field
+                    :error="$v.form.email.$error"
+                    :error-label="`${errorMsg('email', $v.form.email)}`"
+            >
+                <q-input
+                        v-model="form.email"
+                        :value="form.email"
+                        autocomplete="email"
+                        @change="val => { form.email = val }"
+                        :before="[{icon: 'mail', handler () {}}]"
+                        @blur="$v.form.email.$touch"
+                        :error="$v.form.email.$error"
+                        :float-label="$t('reg.email')"
+                />
+            </q-field>
+
+            <div align="center">
+                <q-btn rounded size="lg" color="primary" @click="submit" :disable="$v.$error">
+                    {{$t('login.send_reset_pwd')}}
+                </q-btn>
+            </div>
+
+        </div>
+        <div v-else>
+            <q-alert color="primary q-title" style="text-align: center;">
+                {{ $t('reset.email_sent')}}
+            </q-alert>
+            <br>
+
+            <div>
+                {{ $t('reset.check_email')}}
+            </div>
+
+        </div>
+
+
+    </div>
+</template>
+
+<script>
+
+  import {mapActions} from 'vuex'
+  import * as types from '../../../store/mutation-types'
+  import {Errori_MongoDb} from '../../../store/modules/user'
+
+  import {serv_constants} from '../../../store/modules/serv_constants';
+
+
+  export default {
+    data() {
+      return {
+        risultato: '',
+        riscode: 0,
+        emailsent: false,
+        form: {
+          email: '',
+          tokenforgot: 0,
+        },
+      }
+    },
+    created() {
+      this.load();
+    },
+    computed: {
+      emailinviata: function () {
+        return this.emailsent
+      },
+    },
+    validations: {
+      form: {
+        email: {
+          required, email,
+        },
+      }
+    },
+    methods: {
+      ...mapActions("user", {
+        requestresetpwd: types.USER_REQUESTRESETPWD,
+      }),
+    },
+    submit() {
+      this.$v.form.$touch();
+
+      if (this.$v.form.$error) {
+        this.showNotif(this.$t('reg.err.errore_generico'));
+        return
+      }
+
+      this.$q.loading.show({message: this.$t('reset.incorso')});
+
+      this.tokenforgot = '';
+
+      console.log(this.form);
+      this.requestresetpwd(this.form)
+        .then((ris) => {
+          if (ris.code === serv_constants.RIS_CODE_OK)
+            this.emailsent = true;
+          this.$q.loading.hide();
+        }).catch(error => {
+        console.log("ERROR = " + error);
+        this.$q.loading.hide();
+      });
+
+    }
+  }
+
+</script>
+
+<style scoped>
+    .mypanel {
+        padding: 10px;
+        margin: 10px;
+
+    }
+</style>

src/components/views/login/signin.vue

@@ -16,6 +16,7 @@
             >
                 <q-input
                         :value="form.username"
+                        autocomplete="username"
                         @change="val => { form.username = val }"
                         :before="[{icon: 'person', handler () {}}]"
                         @blur="$v.form.username.$touch"
@@ -37,6 +38,10 @@
                 />
             </q-field>
 
+            <div>
+                <a :href="getlinkforgetpwd">{{$t('reg.forgetpassword')}}</a>
+            </div>
+
             <br>
 
             <div align="center">
@@ -88,6 +93,9 @@
       env() {
         return env
       },
+      getlinkforgetpwd () {
+        return "/requestresetpwd";
+      },
     },
     validations: {
       isAsync: true,

src/components/views/login/updatepassword.vue

@@ -0,0 +1,133 @@
+<template>
+    <div class="mypanel">
+
+        <div v-if="!emailinviata">
+            <q-alert color="primary q-title" style="text-align: center;">
+                {{ $t('reset.title_update_pwd')}}
+            </q-alert>
+            <br>
+
+            <q-field
+                    :error="$v.form.password.$error"
+                    :error-label="`${errorMsg('password', $v.form.password)}`"
+            >
+                <q-input
+                        v-model="form.password"
+                        :before="[{icon: 'vpn_key', handler () {}}]"
+                        @blur="$v.form.password.$touch"
+                        :error="$v.form.password.$error"
+                        :float-label="$t('reg.password')"
+                />
+            </q-field>
+
+            <q-field
+                    :error="$v.form.repeatPassword.$error"
+                    :error-label="`${errorMsg('repeatpassword', $v.form.repeatPassword)}`"
+            >
+                <q-input
+                        v-model="form.repeatPassword"
+                        :before="[{icon: 'vpn_key', handler () {}}]"
+                        @blur="$v.form.repeatPassword.$touch"
+                        :error="$v.form.repeatPassword.$error"
+                        :float-label="$t('reg.repeatPassword')"
+                />
+            </q-field>
+
+            <div align="center">
+                <q-btn rounded size="lg" color="primary" @click="submit" :disable="$v.$error">
+                    {{$t('reset.update_password')}}
+                </q-btn>
+            </div>
+
+        </div>
+        <div v-else>
+            <q-alert color="primary q-title" style="text-align: center;">
+                {{ $t('reset.email_sent')}}
+            </q-alert>
+            <br>
+
+            <div>
+                {{ $t('reset.check_email')}}
+            </div>
+
+        </div>
+
+
+    </div>
+</template>
+
+<script>
+
+  import {mapActions} from 'vuex'
+  import * as types from '../../../store/mutation-types'
+  import {Errori_MongoDb} from '../../../store/modules/user'
+
+  import {serv_constants} from '../../../store/modules/serv_constants';
+
+
+  export default {
+    data() {
+      return {
+        risultato: '',
+        riscode: 0,
+        emailsent: false,
+        form: {
+          email: '',
+          tokenforgot: 0,
+        },
+      }
+    },
+    created() {
+      this.load();
+    },
+    computed: {
+      emailinviata: function () {
+        return this.emailsent
+      },
+    },
+    validations: {
+      form: {
+        email: {
+          required, email,
+        },
+      }
+    },
+    methods: {
+      ...mapActions("user", {
+        updatepwd: types.USER_UPDATEPWD,
+      }),
+    },
+    submit() {
+      this.$v.form.$touch();
+
+      if (this.$v.form.$error) {
+        this.showNotif(this.$t('reg.err.errore_generico'));
+        return
+      }
+
+      this.$q.loading.show({message: this.$t('reset.incorso')});
+
+      this.tokenforgot = '';
+
+      console.log(this.form);
+      this.updatepwd(this.form)
+        .then((ris) => {
+          this.emailsent = ris.updatepwd;
+          this.$q.loading.hide();
+        }).catch(error => {
+        console.log("ERROR = " + error);
+        this.$q.loading.hide();
+      });
+
+    }
+  }
+
+</script>
+
+<style scoped>
+    .mypanel {
+        padding: 10px;
+        margin: 10px;
+
+    }
+</style>