Updated Project calculation for hours and progress.

src/components/CProgress/CProgress.scss

@@ -27,10 +27,15 @@ $heightBtn: 100%;
 
 .cpr-progrbar-item {
   //height: 10px
-  padding-top: 7px;
+  margin-top: 11px;
+  margin-bottom: 11px;
   height:15px;
 }
 
+.cpr-slider-item {
+  //height: 10px
+}
+
 .cpr-percProgress {
   padding-top: 3px;
   color: #888;

src/components/CProgress/CProgress.ts

@@ -10,6 +10,7 @@ import { tools } from '@src/store/Modules/tools'
 export default class CProgress extends Vue {
   public cpr_colProgress: string = 'blue'
   public cpr_percProgress: string = 'cpr-percProgress'
+  public progressvalinternal: number = 0
 
   @Watch('progressval')
   public changeprogress() {
@@ -18,9 +19,21 @@ export default class CProgress extends Vue {
 
   @Prop({ required: true }) public progressval: number
   @Prop() public descr: string
+  @Prop({ default: false }) public slider: boolean
+
+  @Watch('progressval')
+  public valchanged(value) {
+    this.progressvalinternal = value
+  }
 
   public updateclasses() {
-    this.cpr_colProgress = tools.getProgressColor(this.progressval)
+    this.cpr_colProgress = tools.getProgressColor(this.progressvalinternal)
+  }
+
+  public setchange(value) {
+    this.progressvalinternal = value
+    console.log('setchange', this.progressvalinternal)
+    this.$emit('input', this.progressvalinternal)
   }
 
   get getdescr() {

src/components/CProgress/CProgress.vue

@@ -1,7 +1,16 @@
 <template>
     <div>
         <div class="flex-item progress-item shadow-1">
+            <q-slider v-if="slider" label
+                      class="cpr-slider-item"
+                      :value="progressval"
+                      :min="0"
+                      :max="100"
+                      @change="setchange"
+                      :step="5">
+            </q-slider>
             <q-linear-progress
+                    v-else
                     stripe
                     rounded
                     :value="progressval / 100"

src/components/todos/SingleTodo/SingleTodo.ts

@@ -74,7 +74,7 @@ export default class SingleTodo extends Vue {
     console.log('itemtodo.hoursplanned', this.itemtodo.hoursplanned)
     this.watchupdate('hoursplanned')
   }
-  @Watch('itemtodo.status', { immediate: true, deep: true }) public valueChangedstatus() {
+  @Watch('itemtodo.status') public valueChangedstatus() {
     console.log('itemtodo.status', this.itemtodo.status)
     this.watchupdate('status')
   }
@@ -125,6 +125,7 @@ export default class SingleTodo extends Vue {
   }
 
   public watchupdate(field = '') {
+    console.log('watchupdate', field)
     this.$emit('eventupdate', {myitem: this.itemtodo, field } )
     this.updateicon()
   }
@@ -398,7 +399,7 @@ export default class SingleTodo extends Vue {
 
   public aggiornaProgress(value, initialval) {
     if (value !== initialval) {
-      this.itemtodo.progress = value
+      this.itemtodo.progress = parseInt(value, 10)
       this.updatedata('progress')
       this.deselectAndExitEdit()
     }

src/store/Modules/ApiTables.ts

@@ -383,9 +383,7 @@ export async function table_ModifyRecord(nametable, myitem, listFieldsToChange,
   console.log('--> table_ModifyRecord', nametable, myitem.descr)
 
   if ((field === 'status') && (nametable === 'todos') && (myitem.status === tools.Status.COMPLETED)) {
-    console.log('AAAAAAAAAAAAAAAAAAAAAAAA  ', myitem.completed_at)
     myitem.completed_at = tools.getDateNow()
-    console.log('   DOPO ', myitem.completed_at)
   }
 
   const myobjsaved = tools.jsonCopy(myitem)
@@ -397,44 +395,28 @@ export async function table_ModifyRecord(nametable, myitem, listFieldsToChange,
     return
   }
 
-  console.log(' 0-> ')
-
-  console.log('myobjsaved.completed_at', myobjsaved.completed_at)
-  console.log('miorec.completed_at', miorec.completed_at)
-
-  console.log('miorec', miorec.descr, miorec.id_prev, nametable)
-  console.log('status', miorec.status, myobjsaved.status)
-
-  console.log(' 3-> ')
-
   listFieldsToChange.forEach((myfield) => {
     setmodifiedIfchanged(miorec, myobjsaved, myfield)
   })
 
   if (miorec.modified) {
-    console.log('    ' + nametable + ' MODIFICATO! ', miorec.descr, miorec.pos, 'SALVALO SULLA IndexedDB')
+    // console.log('    ' + nametable + ' MODIFICATO! ', miorec.descr, miorec.pos, 'SALVALO SULLA IndexedDB')
     miorec.modify_at = tools.getDateNow()
     miorec.modified = false
 
-    console.log(' 0)  ARR MIOREC PRIMA ', miorec.completed_at, miorec)
-
     // 1) Permit to Update the Views
     tools.notifyarraychanged(miorec)
 
-    console.log(' 1)  MIOREC CALL WRITE: ', miorec.completed_at, miorec)
-
     // 2) Modify on IndexedDb
     return globalroutines(null, 'write', nametable, miorec)
       .then((ris) => {
 
-        console.log(' 2)  MIOREC !: ', miorec.completed_at)
-
         // 3) Modify on the Server (call)
         return Sync_SaveItem(nametable, 'PATCH', miorec)
 
       })
-  } else {
+  // } else {
-    console.log('      ', miorec.descr, 'NON MODIF!')
+    //   console.log('      ', miorec.descr, 'NON MODIF!')
   }
 }
 
@@ -452,4 +434,3 @@ export function table_DeleteRecord(nametable, myobjtrov, id) {
   Sync_DeleteItem(nametable, myobjtrov, id)
   
 }
-

src/store/Modules/GlobalStore.ts

@@ -151,7 +151,7 @@ namespace Getters {
         level_child: 0.5
       })
 
-      addRoute(arrroutes,{ route: '/projects/' + tools.FIRST_PROJ, faIcon: 'fa fa-list-alt', materialIcon: 'next_week', name: 'pages.Projects',
+      addRoute(arrroutes,{ route: '/projects/' + process.env.PROJECT_ID_MAIN, faIcon: 'fa fa-list-alt', materialIcon: 'next_week', name: 'pages.Projects',
         routes2: listaprojects,
         level_parent: 0,
         level_child: 0.5

src/store/Modules/Projects.ts

@@ -13,7 +13,7 @@ const nametable = 'projects'
 
 // import _ from 'lodash'
 
-const state: IProjectsState = {
+const stateglob: IProjectsState = {
   showtype: costanti.ShowTypeTask.SHOW_LAST_N_COMPLETED,
   projects: [],
   insidePending: false,
@@ -22,19 +22,14 @@ const state: IProjectsState = {
 
 const listFieldsToChange: string [] = ['descr', 'longdescr', 'hoursplanned', 'hoursworked', 'id_parent', 'status', 'category', 'expiring_at', 'priority', 'id_prev', 'pos', 'enableExpiring', 'progress', 'live_url', 'test_url', 'begin_development', 'begin_test']
 
-const b = storeBuilder.module<IProjectsState>('Projects', state)
+const b = storeBuilder.module<IProjectsState>('Projects', stateglob)
 const stateGetter = b.state()
 
-// function getindexbycategory(category: string) {
-//   return state.categories.indexOf(category)
-// }
-
 function getarrByCategory(category: string) {
-  // const indcat = state.categories.indexOf(category)
+  if (!stateglob.projects) {
-  if (!state.projects) {
     return []
   }
-  return state.projects
+  return stateglob.projects
 }
 
 function initcat() {
@@ -89,7 +84,7 @@ namespace Getters {
   const listaprojects = b.read((state: IProjectsState) => (): IMenuList[] => {
     if (state.projects) {
       // console.log('state.projects', state.projects)
-      const listaproj = tools.mapSort(state.projects.filter((proj) => proj.id_parent === tools.FIRST_PROJ))
+      const listaproj = tools.mapSort(state.projects.filter((proj) => proj.id_parent === process.env.PROJECT_ID_MAIN))
       const myarr: IMenuList[] = []
       for (const proj of listaproj) {
         myarr.push({nametranslate: '', description: proj.descr, idelem: proj._id})
@@ -102,12 +97,12 @@ namespace Getters {
   }, 'listaprojects')
 
   const getDescrById = b.read((state: IProjectsState) => (id: string): string => {
-    if (id === tools.FIRST_PROJ)
+    if (id === process.env.PROJECT_ID_MAIN)
       return 'Projects'
     if (state.projects) {
-      const item = state.projects.find((item) => item._id === id)
+      const itemtrov = state.projects.find((item) => item._id === id)
-      if (!!item)
+      if (!!itemtrov)
-        return item.descr
+        return itemtrov.descr
     }
 
     return ''
@@ -115,9 +110,10 @@ namespace Getters {
 
   const getParentById = b.read((state: IProjectsState) => (id: string): string => {
     if (state.projects) {
-      const item = state.projects.find((item) => item._id === id)
+      const itemfound = state.projects.find((item) => item._id === id)
-      if (!!item)
+      if (!!itemfound) {
-        return item.id_parent
+        return itemfound.id_parent
+      }
     }
 
     return ''
@@ -193,7 +189,7 @@ namespace Actions {
   async function dbLoad(context, { checkPending, onlyiffirsttime }) {
 
     if (onlyiffirsttime) {
-      if (state.projects.length > 0) {
+      if (stateglob.projects.length > 0) {
         // if already set, then exit.
         return false
       }
@@ -208,18 +204,18 @@ namespace Actions {
     const ris = await Api.SendReq('/projects/' + UserStore.state.userId, 'GET', null)
       .then((res) => {
         if (res.data.projects) {  // console.log('RISULTANTE CATEGORIES DAL SERVER = ', res.data.categories)
-          state.projects = res.data.projects
+          stateglob.projects = res.data.projects
         } else {
-          state.projects = []
+          stateglob.projects = []
         }
 
-        state.showtype = parseInt(GlobalStore.getters.getConfigStringbyId({
+        stateglob.showtype = parseInt(GlobalStore.getters.getConfigStringbyId({
           id: costanti.CONFIG_ID_SHOW_TYPE_TODOS,
           default: costanti.ShowTypeTask.SHOW_LAST_N_COMPLETED
         }), 10)
 
         if (process.env.DEBUG === '1') {
-          console.log('dbLoad', 'state.projects', state.projects)
+          console.log('dbLoad', 'state.projects', stateglob.projects)
         }
 
         return res
@@ -307,7 +303,7 @@ namespace Actions {
   }
 
   async function swapElems(context, itemdragend: IDrag) {
-    console.log('PROJECT swapElems', itemdragend, state.projects)
+    console.log('PROJECT swapElems', itemdragend, stateglob.projects)
 
     const myarr = Getters.getters.items_dacompletare(itemdragend.id_proj)
 

src/store/Modules/Todos.ts

@@ -251,6 +251,7 @@ namespace Actions {
     const myarr = gettodosByCategory(cat)
 
     const myobjtrov = tools.getElemById(myarr, idobj)
+    if (!!myobjtrov) {
 
       console.log('myobjtrov', myobjtrov.descr)
 
@@ -266,6 +267,7 @@ namespace Actions {
         ApiTables.table_DeleteRecord(nametable, myobjtrov, idobj)
       }
     }
+  }
 
   async function dbInsert(context, { myobj, atfirst }) {
 

src/store/Modules/tools.ts

@@ -25,7 +25,7 @@ export const tools = {
 
   NUMSEC_CHECKUPDATE: 20000,
 
-  FIRST_PROJ: '__PROJECTS',
+  FIRST_PROJ: '5ca8f17fcd40dc5012f53346',
 
   WHAT_TODO: 1,
   WHAT_PROJECT: 2,
@@ -1258,7 +1258,6 @@ export const tools = {
 
   getDateNow() {
     const mydate = new Date()
-    console.log('mydate', mydate)
     return mydate
   }
   ,

src/views/projects/proj-list/proj-list.ts

@@ -40,7 +40,7 @@ export default class ProjList extends Vue {
   public service: any
   public scrollable = true
   public dragname: string = 'second'
-  public idProjAtt: string = tools.FIRST_PROJ
+  public idProjAtt: string = process.env.PROJECT_ID_MAIN
   public idProjParentAtt: string = ''
   public splitterModel = 50 // start at 50%
   public itemproj: IProject = null
@@ -59,6 +59,10 @@ export default class ProjList extends Vue {
     ctodo: CTodo
   }
 
+  get getidProjParentAtt() {
+    return this.idProjParentAtt
+  }
+
   public watchupdatetodo(field = '') {
     console.log('watchupdate', field)
     this.$emit('eventupdate', {myitem: this.itemtodosel, field } )
@@ -68,6 +72,12 @@ export default class ProjList extends Vue {
     return '/projects/' + this.idProjParentAtt
   }
 
+  public selproj() {
+    this.deselectAllRowsproj(null, false, false)
+    this.deselectAllRowstodo(null, false, false)
+    this.setidsel(this.idProjAtt)
+  }
+
   get tools() {
     return tools
   }
@@ -89,25 +99,23 @@ export default class ProjList extends Vue {
     return tools.listOptionShowTask[UserStore.state.lang]
   }
 
-  get descrParent() {
-    return Projects.getters.getDescrById(this.idProjParentAtt)
-  }
-
   get descrProject() {
     return Projects.getters.getDescrById(this.idProjAtt)
   }
 
-  // get ProjectsCount() {
-  //   return Projects.getters.ProjectsCount(this.idProjParentAtt)
-  // }
-
   @Getter('items_dacompletare', { namespace })
   public items_dacompletare: (state: IProjectsState, id_parent: string) => IProject[]
 
+  @Watch('items_dacompletare')
+  public changeitems() {
+    this.idProjParentAtt = Projects.getters.getParentById(this.idProjAtt)
+  }
+
   @Watch('$route.params.idProj')
   public changeparent() {
     this.idProjAtt = this.$route.params.idProj
     this.idProjParentAtt = Projects.getters.getParentById(this.idProjAtt)
+    this.selproj()
   }
 
   @Watch('itemsel.progressCalc')
@@ -164,6 +172,8 @@ export default class ProjList extends Vue {
     this.idProjAtt = this.$route.params.idProj
     this.idProjParentAtt = Projects.getters.getParentById(this.idProjAtt)
 
+    console.log('this.idProjParentAtt', this.idProjParentAtt, 'idproj', this.idProjAtt, 'params' , this.$route.params)
+
     tools.touchmove(this.scrollable)
   }
 
@@ -346,4 +356,14 @@ export default class ProjList extends Vue {
 
   }
 
+  get getCalcTodoHoursWorked() {
+    if (this.itemtodosel.hoursplanned <= 0) {
+      return 0
+    }
+    const myperc = Math.round(this.itemtodosel.hoursworked / this.itemtodosel.hoursplanned * 100)
+
+    return myperc
+
+  }
+
 }

src/views/projects/proj-list/proj-list.vue

@@ -11,9 +11,11 @@
                     <div>
                         <div class="divtitlecat clMain">
                             <div class="flex-container clMain">
-                                <q-btn v-if="!!idProjParentAtt" size="sm" push color="secondary" round
+                                <q-btn v-if="!!getidProjParentAtt" size="sm" push color="secondary" round
                                        icon="arrow_back"
-                                       :to="getrouteup"/>
+                                       :to="getrouteup">
+
+                                </q-btn>
                                 <div class="flex-item categorytitle shadow-4">{{descrProject | capitalize}}</div>
                                 <div class="flex-item">
                                     <q-btn push
@@ -130,12 +132,12 @@
                             <div class="flex-item itemdescr">
                                 <q-input
                                         ref="input"
+                                        readonly
                                         v-model="itemsel.hoursworked"
                                         type="number"
                                         rounded outlined
                                         :label="$t('proj.hoursworked')"
-                                        debounce="500"
+                                        debounce="500"></q-input>
-                                />
                                 <CProgress descr="" :progressval="getCalcHoursWorked"></CProgress>
                             </div>
                             <q-icon class="flex-item flex-icon" name="watch_later"/>
@@ -143,11 +145,13 @@
                                 <q-input
                                         ref="input"
                                         type="number"
+                                        readonly
                                         v-model="itemsel.hoursplanned"
                                         rounded outlined
                                         :label="$t('proj.hoursplanned')"
-                                        debounce="500"
+                                        debounce="500">
-                                />
+
+                                </q-input>
                                 <CProgress :descr="$t('proj.progresstask')"
                                            :progressval="itemsel.progressCalc"></CProgress>
                             </div>
@@ -213,7 +217,7 @@
                                     debounce="500">
 
                             </q-input>
-                            <CProgress descr="" :progressval="getCalcHoursWorked"></CProgress>
+                            <CProgress descr="" :progressval="getCalcTodoHoursWorked"></CProgress>
                         </div>
                         <q-icon class="flex-item flex-icon" name="watch_later"/>
                         <div class="flex-item itemdata content-center">
@@ -226,8 +230,10 @@
                                     debounce="500">
 
                             </q-input>
+
                             <CProgress :descr="$t('proj.progresstask')"
-                                       :progressval="itemtodosel.progressCalc"></CProgress>
+                                       :progressval="itemtodosel.progress"
+                                        :slider="true" @input="itemtodosel.progress = arguments[0]"></CProgress>
                         </div>
                     </div>
                     <div class="flex-container clMain">