From 602eb6bc20509c0b73821cb08bdc6e910c4c7d79 Mon Sep 17 00:00:00 2001 From: Paolo Arena Date: Sun, 3 Feb 2019 14:40:20 +0100 Subject: [PATCH] - fix: updated from Store to Component: using Watch with 'immediate' parameters! @Watch('todos_changed', { immediate: true, deep: true }) --- src/components/todos/todo/todo.ts | 32 ++++++++++--- src/components/todos/todo/todo.vue | 3 ++ src/globalroutines/indexdb.js | 49 +++++++++++++------ src/model/Todos.ts | 2 + src/store/Modules/Todos.ts | 77 ++++++++++++++++++++++++------ src/store/Modules/UserStore.ts | 9 ++-- 6 files changed, 133 insertions(+), 39 deletions(-) diff --git a/src/components/todos/todo/todo.ts b/src/components/todos/todo/todo.ts index ccb4c9a..65286f6 100644 --- a/src/components/todos/todo/todo.ts +++ b/src/components/todos/todo/todo.ts @@ -41,7 +41,7 @@ export default class Todo extends Vue { itemDragStart: any = null itemDragEnd: any = null selrowid: number = 0 - todos_global: ITodo[] = [] + todos_global: any // @Prop({ required: false }) category: string @@ -53,13 +53,34 @@ export default class Todo extends Vue { console.log('drag = ' + this.drag) } + @Watch('$route', { immediate: true, deep: true }) + onUrlChange(newVal: any) { + // Some action + } + + @Watch('$route.params.category') changecat() { // console.log('changecat') this.load() } - @Watch('todos_global') refresh() { - console.log('Todos.state.todos CHANGED!') + get todos_changed() { + return Todos.state.todos_changed + } + + @Watch('todos_changed', { immediate: true, deep: true }) + changetodos_changed(value: string, oldValue: string) { + console.log('Todos.state.todos_changed CHANGED!', value, oldValue) + this.updatetable(true) + } + + get testPao() { + return Todos.state.testpao + } + + @Watch('testPao', { immediate: true, deep: true }) + changedTestpao(value: string, oldValue: string) { + console.log('testpao CHANGED', value, oldValue) this.updatetable(true) } @@ -258,13 +279,11 @@ export default class Todo extends Vue { // console.log('Array PRIOR:', this.arrPrior) } - async load() { - this.todos_global = Todos.state.todos + this.todos_global = Todos.state.todos_changed this.todos_arr = [...Todos.state.todos] - // Set last category selected localStorage.setItem(rescodes.localStorage.categorySel, this.getCategory()) @@ -494,7 +513,6 @@ export default class Todo extends Vue { // Delete item await globalroutines(this, 'delete', 'todos', null, id) .then((ris) => { - console.log('UpdateTable', ris) mythis.updatetable() }).catch((error) => { console.log('err: ', error) diff --git a/src/components/todos/todo/todo.vue b/src/components/todos/todo/todo.vue index 3b86c9e..2320df1 100644 --- a/src/components/todos/todo/todo.vue +++ b/src/components/todos/todo/todo.vue @@ -35,6 +35,9 @@ :after="[{icon: 'arrow_forward', content: true, handler () {}}]" v-on:keyup.enter="insertTodo"/> + + +
diff --git a/src/globalroutines/indexdb.js b/src/globalroutines/indexdb.js index 1f10377..3e5f52c 100644 --- a/src/globalroutines/indexdb.js +++ b/src/globalroutines/indexdb.js @@ -1,6 +1,6 @@ import store from '../store' import _ from 'lodash' -import { UserStore } from '@modules' +import { UserStore, Todos } from '@store' import { i18n } from '../plugins/i18n' import {idbKeyval as storage} from '../js/storage.js'; @@ -26,39 +26,58 @@ function writeConfigIndexDb(context, data) { } -async function readfromIndexDbToStateTodos(context) { +async function readfromIndexDbToStateTodos(context, table) { console.log('*** read from IndexDb to state.todos') - return await storage.getalldata('todos') - .then(ristodos => { - console.log('&&&&&&& readfromIndexDbToStateTodos OK: Num RECORD: ', ristodos.length) - console.log('ristodos:', ristodos) - UserStore.state.todos = [...ristodos] + return await storage.getalldata(table) + .then(records => { + console.log('PRIMA:', Todos.state.todos) + console.log('&&&&&&& readfromIndexDbToStateTodos OK: Num RECORD: ', records.length) + console.log(' records:', records) + if (table === 'todos') { + Todos.state.todos = [...records] + console.log('DOPO:', Todos.state.todos) + Todos.state.todos_changed++ + console.log('Todos.state.todos_changed:', Todos.state.todos_changed) + + setTimeout(testfunc2, 3000) + + + } }).catch((error) => { console.log('err: ', error) }) } -export default async (context, cmd, table, datakey, id) => { +function consolelogpao(str, str2 = '', str3 = '') { + console.log(str, str2, str3) + // Todos.mutations.setTestpao(str + str2 + str3) +} + +function testfunc2 () { + consolelogpao('testfunc2') + Todos.mutations.setTodos_changed() + Todos.mutations.setTestpao(Todos.state.todos_changed) + consolelogpao('testfunc2: Todos.state.todos_changed:', Todos.state.todos_changed) +} + +export default async (context, cmd, table, datakey = null, id = '') => { if (cmd === 'loadapp') { // ****** LOAD APP AL CARICAMENTO ! ******* return saveConfigIndexDb(context, datakey) - - if ('indexedDB' in window) { - if (!UserStore.state.networkDataReceived) { - return await readfromIndexDbToStateTodos(context) - } - } - } else if (cmd === 'write') { return await storage.setdata(table, datakey) + } else if (cmd === 'updateinMemory') { + return await readfromIndexDbToStateTodos(context, table) } else if (cmd === 'readall') { return await storage.getalldata(table) } else if (cmd === 'read') { return await storage.getdata(table, id) } else if (cmd === 'delete') { return await storage.deletedata(table, id) + } else if (cmd === 'log') { + consolelogpao(table) } } diff --git a/src/model/Todos.ts b/src/model/Todos.ts index 9868c8b..414fce5 100644 --- a/src/model/Todos.ts +++ b/src/model/Todos.ts @@ -21,4 +21,6 @@ export interface ITodosState { visuOnlyUncompleted: boolean networkDataReceived: boolean todos: ITodo[] + todos_changed: number + testpao: String } diff --git a/src/store/Modules/Todos.ts b/src/store/Modules/Todos.ts index f118f93..729c53a 100644 --- a/src/store/Modules/Todos.ts +++ b/src/store/Modules/Todos.ts @@ -1,15 +1,18 @@ -import { ITodo, ITodosState } from 'model' +import { IGlobalState, ITodo, ITodosState } from 'model' import { storeBuilder } from './Store/Store' import Api from '@api' import { rescodes } from './rescodes' -import { UserStore } from '@store' +import { Todos, UserStore } from '@store' +import globalroutines from './../../globalroutines/index' const state: ITodosState = { visuOnlyUncompleted: false, networkDataReceived: false, - todos: [] + todos: [], + todos_changed: 1, + testpao: 'Test' } const b = storeBuilder.module('TodosModule', state) @@ -29,8 +32,26 @@ namespace Getters { namespace Mutations { + function setTestpao(state: ITodosState, testpao: String) { + state.testpao = testpao + } + + function setTodos_changed(state: ITodosState) { + state.todos_changed++ + } + + export const mutations = { + setTestpao: b.commit(setTestpao), + setTodos_changed: b.commit(setTodos_changed), + } + } +function consolelogpao(strlog, strlog2 = '', strlog3 = '') { + globalroutines(null, 'log', strlog + strlog2 + strlog3, null) +} + + namespace Actions { function json2array(json) { @@ -67,14 +88,42 @@ namespace Actions { }) .catch((error) => { if (process.env.DEV) { - console.log('ERROREEEEEEEEE') + console.log('dbLoadTodo ERRORE', error) console.log(error) } + // If error network connection, take the data from IndexedDb + return rescodes.ERR_GENERICO }) + if (!Todos.state.networkDataReceived) { + console.log('NETWORK UNREACHABLE ! (Error in fetch)') + consolelogpao('NETWORK UNREACHABLE ! (Error in fetch)') + // Read all data from IndexedDB Store into Memory + await globalroutines(null, 'updateinMemory', 'todos', null) + .then(() => { + testfunc() + }) + } + } + function aspettansec(numsec) { + return new Promise(function (resolve, reject) { + setTimeout(function () { + resolve('anything') + }, numsec) + }) + } + + async function testfunc() { + while (true) { + consolelogpao('testfunc') + // Todos.mutations.setTodos_changed() + Todos.state.todos_changed++ + console.log('Todos.state.todos_changed:', Todos.state.todos_changed) + await aspettansec(5000) + } } async function dbSaveTodo(context, itemtodo: ITodo) { @@ -90,12 +139,12 @@ namespace Actions { console.log('ITEM', newItem) if (method === 'POST') { state.todos.push(newItem) - // } else if (method === 'PATCH') { - // state.todos.map(item => { - // if (item._id === newItem._id) { - // return newItem - // } - // }) + // } else if (method === 'PATCH') { + // state.todos.map(item => { + // if (item._id === newItem._id) { + // return newItem + // } + // }) } @@ -109,7 +158,7 @@ namespace Actions { const token = UserStore.state.idToken let res = await Api.SendReq(call, UserStore.state.lang, token, method, itemtodo) - .then( function(response) { + .then(function (response) { if (response) return response.json() else @@ -129,7 +178,7 @@ namespace Actions { }) .catch((error) => { if (process.env.DEV) { - console.log('ERROREEEEEEEEE') + console.log('ERRORE FETCH', 'dbInsertSaveTodo', method) console.log(error) } return rescodes.ERR_GENERICO @@ -154,7 +203,7 @@ namespace Actions { }) .catch((error) => { if (process.env.DEV) { - console.log('ERROREEEEEEEEE', error) + console.log('ERRORE FETCH', 'dbDeleteTodo') } return rescodes.ERR_GENERICO }) @@ -187,7 +236,7 @@ const TodosModule = { return stateGetter() }, getters: Getters.getters, - // mutations: Mutations.mutations, + mutations: Mutations.mutations, actions: Actions.actions } diff --git a/src/store/Modules/UserStore.ts b/src/store/Modules/UserStore.ts index fec8e17..633dec3 100644 --- a/src/store/Modules/UserStore.ts +++ b/src/store/Modules/UserStore.ts @@ -7,6 +7,7 @@ import router from '@router' import { serv_constants } from '../Modules/serv_constants' import { rescodes } from '../Modules/rescodes' import { GlobalStore, UserStore, Todos } from '@store' +import globalroutines from './../../globalroutines/index' const bcrypt = require('bcryptjs') @@ -348,7 +349,7 @@ namespace Actions { }) .catch((error) => { if (process.env.DEV) { - console.log('ERROREEEEEEEEE') + console.log('signup ERROREEEEEEEEE') console.log(error) } Mutations.mutations.setServerCode(rescodes.ERR_GENERICO) @@ -450,8 +451,7 @@ namespace Actions { }) .catch((error) => { if (process.env.DEV) { - console.log('ERROREEEEEEEEE') - console.log(error) + console.log('signin ERRORE', error) } Mutations.mutations.setServerCode(rescodes.ERR_GENERICO) return rescodes.ERR_GENERICO @@ -497,8 +497,11 @@ namespace Actions { GlobalStore.mutations.setCategorySel(localStorage.getItem(rescodes.localStorage.categorySel)) Todos.actions.dbLoadTodo() + + } + async function autologin (context) { try { console.log('*** Autologin ***')