- fix: update on Insert

- fix: update on Edit

src/components/todos/todo/todo.ts

@@ -38,6 +38,7 @@ export default class Todo extends Vue {
   itemDragStart: any = null
   itemDragEnd: any = null
   selrowid: number = 0
+  todos_global: ITodo[] = []
 
   // @Prop({ required: false }) category: string
 
@@ -54,6 +55,11 @@ export default class Todo extends Vue {
     this.load()
   }
 
+  @Watch('todos_global') refresh() {
+    console.log('Todos.state.todos CHANGED!')
+    this.updatetable(true)
+  }
+
   getCategory() {
     return this.$route.params.category
     // return this.category
@@ -252,6 +258,9 @@ export default class Todo extends Vue {
 
   async load() {
 
+    this.todos_global = Todos.state.todos
+    this.todos_arr = [...Todos.state.todos]
+
 
     // Set last category selected
     localStorage.setItem(rescodes.localStorage.categorySel, this.getCategory())
@@ -273,9 +282,21 @@ export default class Todo extends Vue {
 
   }
 
+  copy(o) {
+    var output, v, key
+    output = Array.isArray(o) ? [] : {}
+    for (key in o) {
+      v = o[key]
+      output[key] = (typeof v === 'object') ? this.copy(v) : v
+    }
+    return output
+  }
+
   initcat() {
 
-    const mydateexp = new Date().setDate((new Date()).getDate() + 1)
+
+    let mydatenow = new Date().getDate()
+    let mydateexp = new Date().getDate() + 10
 
     console.log('User:' + UserStore.state.userId)
 
@@ -285,9 +306,9 @@ export default class Todo extends Vue {
       descr: '',
       priority: rescodes.Todos.PRIORITY_NORMAL,
       completed: false,
-      created_at: new Date(),
-      modify_at: new Date(),
-      completed_at: null,
+      created_at: mydatenow,
+      modify_at: mydatenow,
+      completed_at: 0,
       category: '',
       expiring_at: mydateexp,
       enableExpiring: false,
@@ -297,7 +318,7 @@ export default class Todo extends Vue {
       modified: true,
       progress: 0
     }
-    return objtodo
+    return this.copy(objtodo)
 
   }
 
@@ -479,11 +500,21 @@ export default class Todo extends Vue {
   }
 
   async updatetable(refresh: boolean = false) {
-    await this.filtertodos(refresh)
+    console.log('updatetable')
+
+    return await Todos.actions.getTodosByCategory(this.getCategory())
+      .then(arrtemp => {
+
+        arrtemp = _.orderBy(arrtemp, ['completed', 'priority', 'pos'], ['asc', 'desc', 'asc'])
+
+        this.updateLinkedList(true, arrtemp)
+
+        this.todos_arr = [...arrtemp]  // make copy
+      })
   }
 
   clearArr() {
-    this.todos_arr = []
+    // this.todos_arr = []
   }
 
   existArr(x) {
@@ -542,21 +573,6 @@ export default class Todo extends Vue {
 
   }
 
-  async filtertodos(refresh: boolean = false) {
-    console.log('filtertodos')
-
-    return await Todos.actions.getTodosByCategory(this.getCategory())
-      .then(arrtemp => {
-
-        arrtemp = _.orderBy(arrtemp, ['completed', 'priority', 'pos'], ['asc', 'desc', 'asc'])
-
-        this.updateLinkedList(true, arrtemp)
-
-        this.todos_arr = [...arrtemp]  // make copy
-      })
-
-  }
-
   sortarr(arr, field) {
 
     return arr.slice().sort(function (a, b) {
@@ -650,7 +666,7 @@ export default class Todo extends Vue {
 
         this.modifyField(miorec, myobj, 'descr')
         if (this.modifyField(miorec, myobj, 'completed'))
-          miorec.completed_at = new Date()
+          miorec.completed_at = new Date().getDate()
 
         this.modifyField(miorec, myobj, 'category')
         this.modifyField(miorec, myobj, 'expiring_at')
@@ -663,7 +679,7 @@ export default class Todo extends Vue {
 
 
         if (miorec.modified) {
-          miorec.modify_at = new Date()
+          miorec.modify_at = new Date().getDate()
 
           // this.logelem('modify', miorec)
 
@@ -679,4 +695,20 @@ export default class Todo extends Vue {
       })
   }
 
+  clicktest () {
+    console.log('clicktest!')
+
+    const objtodo = this.initcat()
+    objtodo.descr = 'PROVA'
+    objtodo.category = this.getCategory()
+    Todos.state.todos.push(objtodo)
+
+    console.log('Todos.state.todos', Todos.state.todos)
+  }
+
+  clicktest2 () {
+    this.updatetable(false)
+    console.log('Todos.state.todos', Todos.state.todos)
+  }
+
 }

src/components/todos/todo/todo.vue

@@ -35,6 +35,14 @@
                      :after="[{icon: 'arrow_forward', content: true, handler () {}}]"
                      v-on:keyup.enter="insertTodo"/>
 
+            <div class="flex-item btn-item">
+            <q-btn class="mybtn" round color="" icon="lock" @click="clicktest()"></q-btn>
+            </div>
+
+            <div class="flex-item btn-item">
+                <q-btn class="mybtn" round color="" icon="person" @click="clicktest2()"></q-btn>
+            </div>
+
         </div>
     </q-page>
 

src/globalroutines/indexdb.js

@@ -32,7 +32,8 @@ async function readfromIndexDbToStateTodos(context) {
   return await storage.getalldata('todos')
     .then(ristodos => {
       console.log('&&&&&&& readfromIndexDbToStateTodos OK: Num RECORD: ', ristodos.length)
-      UserStore.state.todos = ristodos
+      console.log('ristodos:', ristodos)
+      UserStore.state.todos = [...ristodos]
     }).catch((error) => {
     console.log('err: ', error)
   })

src/js/storage.js

@@ -53,7 +53,7 @@ export let idbKeyval = (() => {
         console.log('store', store, 'key', key)
         req = store.get(key);
       });
-      console.log('RISFINALE!', req.result)
+      // console.log('RISFINALE!', req.result)
       return req.result;
     },
     async getalldata(table) {

src/statics/js/storage.js

@@ -1,4 +1,4 @@
-let let idbKeyval = (() => {
+let idbKeyval = (() => {
   let db;
 
   function getDB() {
@@ -52,7 +52,7 @@ let let idbKeyval = (() => {
         console.log('store', store, 'key', key)
         req = store.get(key);
       });
-      console.log('RISFINALE!', req.result)
+      // console.log('RISFINALE!', req.result)
       return req.result;
     },
     async getalldata(table) {

src/store/Modules/Todos.ts

@@ -57,7 +57,8 @@ namespace Actions {
       }).then((resData) => {
         state.networkDataReceived = true
 
-        state.todos = resData.todos
+        console.log('******* UPDATE TODOS.STATE.TODOS !:', resData.todos)
+        state.todos = [...resData.todos]
 
         // After Login will store into the indexedDb...
 
@@ -84,6 +85,21 @@ namespace Actions {
     return await dbInsertSaveTodo(context, itemtodo, 'POST')
   }
 
+  function UpdateNewIdFromDB(oldItem, newItem, method) {
+    console.log('PRIMA state.todos', state.todos)
+    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
+        }
+      })
+    }
+    console.log('DOPO state.todos', state.todos)
+  }
+
   async function dbInsertSaveTodo(context, itemtodo: ITodo, method) {
     console.log('dbInsertSaveTodo', itemtodo, method)
     let call = process.env.MONGODB_HOST + '/todos/' + itemtodo._id
@@ -91,8 +107,23 @@ namespace Actions {
     const token = UserStore.state.idToken
 
     let res = await Api.SendReq(call, UserStore.state.lang, token, method, itemtodo)
-      .then(function (res) {
-        return rescodes.OK
+      .then( function(response) {
+        if (response)
+          return response.json()
+        else
+          return null
+      }).then(newItem => {
+        console.log('RESDATA =', newItem)
+        if (newItem) {
+          const newId = newItem._id
+
+          if (method === 'PATCH') {
+            newItem = newItem.todo
+          }
+
+          // Update ID on local
+          UpdateNewIdFromDB(itemtodo, newItem, method)
+        }
       })
       .catch((error) => {
         if (process.env.DEV) {
@@ -102,7 +133,6 @@ namespace Actions {
         return rescodes.ERR_GENERICO
       })
 
-
     return res
   }