From 83420447d344552b7a6d8882c6d98b7a51918b69 Mon Sep 17 00:00:00 2001 From: Paolo Arena Date: Sun, 27 Jan 2019 19:09:48 +0100 Subject: [PATCH] - fix it: Order List Todo - Split Todo List by Priority and by Completed - Animation drag --- quasar.conf.js | 1 + .../todos/SingleTodo/SingleTodo.scss | 69 ++- src/components/todos/SingleTodo/SingleTodo.ts | 90 +++- .../todos/SingleTodo/SingleTodo.vue | 43 +- src/components/todos/todo/todo.scss | 23 +- src/components/todos/todo/todo.ts | 446 +++++++++++++++--- src/components/todos/todo/todo.vue | 30 +- src/model/Todos.ts | 7 +- src/statics/freeplanet-logo-full.svg | 24 +- src/store/Modules/rescodes.ts | 56 ++- 10 files changed, 651 insertions(+), 138 deletions(-) diff --git a/quasar.conf.js b/quasar.conf.js index 8183b7e..b284689 100644 --- a/quasar.conf.js +++ b/quasar.conf.js @@ -149,6 +149,7 @@ module.exports = function (ctx) { 'QDatetime', 'QSlideTransition', 'QTable', + 'QContextMenu', ], directives: [ 'Ripple', diff --git a/src/components/todos/SingleTodo/SingleTodo.scss b/src/components/todos/SingleTodo/SingleTodo.scss index 01852da..f5e4ab2 100644 --- a/src/components/todos/SingleTodo/SingleTodo.scss +++ b/src/components/todos/SingleTodo/SingleTodo.scss @@ -1,17 +1,29 @@ + .flex-item{ - background-color: #d5e2eb; - padding: 1px; - margin: 1px; + // background-color: #d5e2eb; + padding: 0px; + margin: 0px; color: #000; font-size: 0.85rem; flex: 1 1 auto; } + .flex-container2 { - flex-flow: row nowrap; + flex-flow: row; justify-content: space-between; } +.flex-container2:hover { + background-color: rgba(240, 240, 240, 0.7); +} + +.rowselected { + border: 1px solid rgba(255, 0, 0, 0.5); + background-color: rgba(49, 68, 240, 0.7) !important; +} + + .btn-item { max-width: 24px; } @@ -24,12 +36,38 @@ height: 36px; line-height: 36px; text-align: center; + // background-color: #ff4081; + font-size: 0.75rem; +} + +.todo-menu { + +} + +.pos-item-popover { + max-width: 24px; + min-width: 24px; + padding: 0px; + text-align: center; + vertical-align: middle; + display: inline-block; + height: 100%; + color: #555; +} + + +.pos-item:hover { + cursor: pointer; } .priority-item-popover { max-width: 24px; min-width: 24px; padding: 0px; + text-align: center; + vertical-align: middle; + display: inline-block; + height: 100% } .priority-item { @@ -55,6 +93,7 @@ visibility: initial; } +/* @media screen and (max-width: 600px) { .data-item { display: none; @@ -62,21 +101,28 @@ content: ""; } } - +*/ .div_descr { // background-color: green; + margin: 2px; + padding: 2px; flex: 2 1 auto; } +.div_descr:hover { + border: 1px solid rgba(125, 255, 125, 0.5); + padding: 1px; +} + .appsingletodo { color: black; font-size: 1.0rem; // display: flex; margin: 1px; - padding: 2px; - border: 1px; + padding: 1px; + border: 0px; background-color: #e1ebed; } @@ -110,6 +156,11 @@ } -.icon_completed:hover { - color: darkgreen; +.icon_completed { + color: rgb(178, 235, 225); } + +.status_completed { + color:rgba(49, 68, 240, 0.7);; +} + diff --git a/src/components/todos/SingleTodo/SingleTodo.ts b/src/components/todos/SingleTodo/SingleTodo.ts index 3d118c3..000731b 100644 --- a/src/components/todos/SingleTodo/SingleTodo.ts +++ b/src/components/todos/SingleTodo/SingleTodo.ts @@ -11,24 +11,90 @@ import { ITodo } from '../../../model/index' }) export default class SingleTodo extends Vue { public selectPriority: [] = [] + public menuPopupTodo: [] = [] public iconCompleted: string = '' + public classCompleted: string = '' + public classDescr: string = '' + public classExpiring: string = '' + public classExpiringEx: string = '' public iconPriority: string = '' public popover: boolean = false + public popover_menu: boolean = false + public classRow: string = '' + public sel: boolean = false $q: any - @Prop({required: true}) itemtodo: ITodo + @Prop({ required: true }) itemtodo: ITodo + @Watch('itemtodo.completed') valueChanged() { this.$emit('eventupdate', this.itemtodo) + this.updateicon() } + @Watch('itemtodo.expiring_at') valueChanged2() { this.$emit('eventupdate', this.itemtodo) } + @Watch('itemtodo.priority') valueChanged3() { this.$emit('eventupdate', this.itemtodo) + this.updateicon() } - setCompleted () { + updateClasses() { + this.classCompleted = 'priority-item-popover' + this.classDescr = 'flex-item div_descr' + this.classExpiring = 'flex-item data-item' + this.classExpiringEx = '' + if (this.itemtodo.completed) { + this.classCompleted += ' icon_completed' + this.classDescr += ' status_completed' + this.classExpiring += ' status_completed' + this.classExpiringEx += ' status_completed' + } + + } + + created() { + this.updateicon() + + this.updateClasses() + + this.selectPriority = rescodes.selectPriority[UserStore.state.lang] + this.menuPopupTodo = rescodes.menuPopupTodo[UserStore.state.lang] + + + } + + getClassRow() { + return 'row flex-container2 ' + this.classRow + } + + clickRiga () { + this.sel = false + if (this.classRow !== 'rowselected') { + this.sel = true + } else { + this.sel = false + } + this.$emit('click', this.itemtodo) + + this.classRow = 'rowselected' + + this.updateClasses() + } + + mouseUp() { + + if (this.sel) { + this.classRow = 'rowselected' + } else { + this.classRow = '' + } + + } + + setCompleted() { // console.log('setCompleted') this.itemtodo.completed = !this.itemtodo.completed @@ -38,10 +104,12 @@ export default class SingleTodo extends Vue { } updatedata() { + console.log('calling this.$emit(eventupdate)') this.$emit('eventupdate', this.itemtodo) } - updateicon () { + updateicon() { + console.log('updateicon') if (this.itemtodo.completed) this.iconCompleted = 'check_circle' else @@ -57,23 +125,25 @@ export default class SingleTodo extends Vue { } - created() { - this.updateicon() - - this.selectPriority = rescodes.selectPriority[UserStore.state.lang] + removeitem(id) { + this.$emit('deleteitem', id) } - remove(id) { - this.$emit('event', id) + clickMenu(action) { + console.log('click menu: ', action) + if (action === rescodes.MenuAction.DELETE) + this.removeitem(this.itemtodo.id) } - setPriority (newpriority) { + setPriority(newpriority) { this.itemtodo.priority = newpriority this.updatedata() + this.updateicon() + // this.$q.notify('setPriority: ' + elem) } } diff --git a/src/components/todos/SingleTodo/SingleTodo.vue b/src/components/todos/SingleTodo/SingleTodo.vue index fef32df..3538068 100644 --- a/src/components/todos/SingleTodo/SingleTodo.vue +++ b/src/components/todos/SingleTodo/SingleTodo.vue @@ -1,6 +1,29 @@ diff --git a/src/components/todos/todo/todo.scss b/src/components/todos/todo/todo.scss index a706668..5cd1acb 100644 --- a/src/components/todos/todo/todo.scss +++ b/src/components/todos/todo/todo.scss @@ -1,8 +1,8 @@ .flex-container{ - background-color: #ccc; + background-color: rgb(250, 250, 250); padding: 5px; display: flex; - flex-flow: row nowrap; + flex-flow: row; justify-content: space-between; } @@ -11,3 +11,22 @@ .mycard { visibility: hidden; } + +.myitemdrag { + padding: 2px; + margin-top: 4px; + border: solid 1px #ccc; + transition: all .4s; +} + +.myitemdrag-enter, .myitemdrag-leave-active { + opacity: 0; +} + +.drag { + background-color: green; +} + +.dragArea { + min-height: 10px; +} diff --git a/src/components/todos/todo/todo.ts b/src/components/todos/todo/todo.ts index 08b55f2..ab472d5 100644 --- a/src/components/todos/todo/todo.ts +++ b/src/components/todos/todo/todo.ts @@ -1,5 +1,5 @@ import Vue from 'vue' -import { Component, Watch } from 'vue-property-decorator' +import { Component, Prop, Watch } from 'vue-property-decorator' import { SingleTodo } from '@components' import { ITodo } from '@src/model' @@ -12,6 +12,8 @@ import _ from 'lodash' import draggable from 'vuedraggable' +import $ from 'jquery' + @Component({ components: { SingleTodo, draggable } }) @@ -21,10 +23,19 @@ export default class Todo extends Vue { filter: boolean = false title: string = '' todo: string = '' - todos_arr: any[] = [{}] + todos_arr: ITodo[] = [] drag: boolean = true startpos: number = 0 - endpos: number = 0 + listPriorityLabel: number[] = [] + arrPrior: number[] = [] + prioritySel: number = 0 + itemDragStart: any = null + itemDragEnd: any = null + selrowid: number = 0 + + $refs: { + single: SingleTodo[] + } @Watch('drag') changedrag() { console.log('drag = ' + this.drag) @@ -34,54 +45,163 @@ export default class Todo extends Vue { console.log('Change... ' + param) } + getmyid(id) { + return 'row' + id + } + + getrefbyid(id) { + return 'single' + id + } + + + getelem(indelem, arr: ITodo[] = this.todos_arr) { + return (indelem >= 0) && (indelem < arr.length) ? arr[indelem] : null + } + + getLastElem() { + if (this.todos_arr.length > 0) + return this.todos_arr[this.todos_arr.length - 1] + else + return null + } + + getFirstelem() { + return this.todos_arr[this.todos_arr.length - 1] + } + onStart() { + this.startpos = 0 + this.itemDragStart = null } - getpos(indelem) { - return this.todos_arr[indelem].pos + async updateLinkedList(init: boolean, arr: ITodo[] = this.todos_arr) { + + console.log('updateLinkedList', this.todos_arr) + + let idprev = -1 + let idnext = -1 + let pos = 1 + if (arr.length > 0) { + idprev = arr[0].id_prev + idnext = arr[0].id_next + } + await arr.forEach((elem, index) => { + if (index === 0) { + idprev = rescodes.LIST_START + } else { + const elemprev = this.getelem(index - 1, arr) + idprev = elemprev.id + } + if (index === arr.length - 1) { + idnext = rescodes.LIST_END + } else { + const elemnext = this.getelem(index + 1, arr) + idnext = elemnext.id + } + + elem.modified = ((elem.id_prev !== idprev) || (elem.id_next !== idnext) || (elem.pos !== pos)) ? true : elem.modified + elem.id_prev = idprev + elem.id_next = idnext + elem.pos = pos + if (init) { + elem.modified = false + } + + pos++ + + this.logelem('updateLinked', elem) + + }) } - onEnd(myvar) { - let oldpos = this.getpos(myvar.oldIndex) - let newpos = this.getpos(myvar.newIndex) + logelem(mystr, elem) { + console.log(mystr, 'elem [', elem.id, '] ', elem.descr, ' Pr(', this.getPriorityByInd(elem.priority), ') [', elem.id_prev, '-', elem.id_next, '] modif=', elem.modified) + } - console.log('onEnd old = ' + oldpos + ' new = ' + newpos) - if (myvar.oldIndex < myvar.newIndex) { - // c'è spazio - newpos = oldpos - 1 - if (newpos <= 0) - newpos = 1 + haveSamePriority(ind1, ind2) { + let elem1 = this.getelem(ind1) + let elem2 = this.getelem(ind2) + + if ((elem1 !== null) && (elem2 !== null)) { + if (elem1.priority === elem2.priority) { + return elem1.priority + } else { + // if different priority then take the first + return elem1.priority + } } else { - newpos = newpos + 1 + return (elem1 != null) ? elem1.priority : ((elem2 != null) ? elem2.priority : null) } - console.log('newpos = ' + newpos) + return -1 + } - if (newpos >= 0) { - let myobj = this.todos_arr[myvar.oldIndex] - console.log('posprec = ' + myobj.pos) - myobj.pos = newpos - this.modify(myobj) + async onEnd(itemdragend) { + console.log('newindex=', itemdragend.newIndex, 'oldindex=', itemdragend.oldIndex) + let myobj = this.getelem(itemdragend.newIndex) + + const indini = itemdragend.newIndex - 1 + const indfine = itemdragend.newIndex + 1 + console.log('indini', indini, 'indfine', indfine) + // If the newIndex is between another priority, then change priority + let newpriority = this.haveSamePriority(indini, indfine) + if (newpriority != null && newpriority >= 0) { + myobj.modified = (myobj.priority !== newpriority) ? true : myobj.modified + myobj.priority = newpriority + console.log('NewPriority: ', newpriority) } + + await this.updateLinkedList(false) + + // Updated only elements modified + await this.updateModifyRecords(true) + + } + + async updateModifyRecords(refresh: boolean = false) { + let update = false + await this.todos_arr.forEach((elem: ITodo) => { + if (elem.modified) { + this.modify(elem, false) + update = true + } + }) + + if (update) + await this.updatetable(refresh) } created() { - this.loadCat() + this.load() } - showlistaTodos(nomelista = '') { - - // console.log('todos_arr: ') - this.todos_arr.forEach((todo, key) => { - console.log('Todo n"' + key + ': ' + todo) + setarrPriority() { + this.arrPrior = [] + const arr = rescodes.selectPriority[UserStore.state.lang] + arr.forEach(rec => { + this.arrPrior.push(rec.value) }) + console.log('Array PRIOR:', this.arrPrior) } - loadCat() { - this.updatetable() + + async load() { + for (let todosKey in rescodes.Todos) { + this.listPriorityLabel.push(rescodes.Todos[todosKey]) + } + console.log('Priority:' + this.listPriorityLabel) + this.setarrPriority() + this.clearArr() + + await this.updatetable() + + this.todos_arr.forEach((elem, index) => { + this.logelem('LOAD ' + index, elem) + }) + } initcat() { @@ -91,40 +211,50 @@ export default class Todo extends Vue { const objtodo: ITodo = { userId: UserStore.state.userId, descr: '', - pos: -1, priority: rescodes.Todos.PRIORITY_NORMAL, completed: false, created_at: new Date(), modify_at: new Date(), - expiring_at: mydateexp + expiring_at: mydateexp, + id_prev: 0, + id_next: 0, + pos: 0, + modified: true } return objtodo } - getLastPos() { - let max = 0 - this.todos_arr.forEach(myobj => { - if (myobj.pos > max) - max = myobj.pos - }) - - return max + 1 - + getPriorityByInd(index) { + const arr = rescodes.selectPriority[UserStore.state.lang] + for (let rec of arr) { + if (rec.value === index) + return rec.label + } + return '' } async insertTodo() { const objtodo = this.initcat() - let myid = 0 objtodo.descr = this.todo - objtodo.pos = this.getLastPos() + const lastelem = this.getLastList() + objtodo.id_prev = (lastelem !== null) ? lastelem.id : rescodes.LIST_START + objtodo.id_next = rescodes.LIST_END + objtodo.pos = (lastelem !== null) ? lastelem.pos + 1 : 1 + objtodo.modified = true // Add to Indexdb await this.$db.todos.add(objtodo - ).then(() => { - this.updatetable() + ).then((id) => { + console.log('*** IDNEW = ', id) + if (lastelem !== null) { + lastelem.id_next = id + lastelem.modified = true + this.modify(lastelem, false) + } + this.modify(objtodo, true) }).catch(err => { console.log('Errore: ' + err.message) }) @@ -133,37 +263,123 @@ export default class Todo extends Vue { this.todo = '' } - getobjbyid(id) { - let myobjtrov = null - this.todos_arr.forEach(myobj => { - if (myobj.id === id) - myobjtrov = myobj - }) + getElemById(id, lista = this.todos_arr) { + let myobj: ITodo + for (myobj of lista) { + if (myobj.id === id) { + return myobj + } + } - return myobjtrov + return null } - deleteitem(id) { - // console.log('deleteitem: KEY = ', id) + async deleteitem(id) { + console.log('deleteitem: KEY = ', id) - let myobjtrov = this.getobjbyid(id) + let myobjtrov = this.getElemById(id) if (myobjtrov !== null) { + let myobjprev = this.getElemById(myobjtrov.id_prev) + let myobjnext = this.getElemById(myobjtrov.id_next) + + if (myobjprev !== null) { + myobjprev.id_next = myobjtrov.id_next + myobjprev.modified = true + this.modify(myobjprev, false) + } + + if (myobjnext !== null) { + myobjnext.id_prev = myobjtrov.id_prev + myobjnext.modified = true + this.modify(myobjnext, false) + } + + console.log('ENTRATO') + const mythis = this // Delete item - this.$db.todos + await this.$db.todos .where('id').equals(id) .delete() .then(() => { - this.updatetable() + console.log('UpdateTable') + mythis.updatetable() + }).catch((error) => { + console.log('err: ', error) }) } + + console.log('FINE deleteitem') } - async updatetable() { - await this.filtertodos() + async updatetable(refresh: boolean = false) { + await this.filtertodos(refresh) } - async filtertodos() { + clearArr() { + this.todos_arr = [] + } + + existArr(x) { + return x = (typeof x !== 'undefined' && x instanceof Array) ? x : [] + } + + getFirstList(arrlist) { + let elem: ITodo + for (elem of arrlist) { + if (elem.id_prev === rescodes.LIST_START) { + return elem + } + } + return null + } + + getLastList(arrlist = this.todos_arr) { + let elem: ITodo + for (elem of arrlist) { + if (elem.id_next === rescodes.LIST_END) { + return elem + } + } + return null + } + + setArrayFinale(arrris) { + + // Sort List: + let myarr = [] + + let current = this.getFirstList(arrris) + let currentprec = current + + if (current !== null) + myarr.push(current) + + let index = -1 + while (current !== null && current.id_next !== rescodes.LIST_END && index < arrris.length) { + this.logelem('current : ', current) + console.log('id_next', current.id_next) + // let changed = (prior !== elem.priority) ? true : false + current = this.getElemById(current.id_next, arrris) + if (current === null) + break + if (current.id === currentprec.id) + break + myarr.push(current) + currentprec = current + this.logelem('current AFTER : ', current) + index++ + } + + return myarr + + + } + + async filtertodos(refresh: boolean = false) { + console.log('filtertodos') + + let arrtemp = [] if (this.filter) { // #Todo If need to filter the output database ... @@ -173,46 +389,124 @@ export default class Todo extends Vue { .then((response) => { Promise.all(response.map(key => key)) .then((ristodos) => { - this.todos_arr = ristodos + arrtemp = ristodos }) }) } else { - await this.$db.todos .where('userId').equals(UserStore.state.userId) - .toArray().then(ristodos => { - this.todos_arr = ristodos + arrtemp = ristodos }) - this.todos_arr = _.orderBy(this.todos_arr, ['completed', 'priority', 'pos'], ['asc', 'desc', 'asc']) + arrtemp = _.orderBy(arrtemp, ['completed', 'priority', 'pos'], ['asc', 'desc', 'asc']) } - this.todos_arr.map((item, index) => { - item.pos = (index * 2) + 1 - }) + this.updateLinkedList(true, arrtemp) + + // set array + // arrtemp = this.setArrayFinale(arrtemp) + + this.todos_arr = [...arrtemp] // make copy + + return [] } + sortarr(arr, field) { + + return arr.slice().sort(function(a, b) { + return a[field] - b[field] + }) + + // let ind1 = -1 + // let val1 = -1 + // for (let x = 0; x <= arr.length; x++) { + // if (x[field] < ind1) { + // val11 = x[field] + // ind1 = x + // } + // for (let y: ITodo = null of arr) { + // + // } + // } + } + updateitem(myobj) { console.log('updateitem') - this.modify(myobj) + this.modify(myobj, true) + } + + // inactiveAllButtons() { + // let divs = this.$children.filter(function (child) { + // return child.$attrs['component-type'] === 'my-custom-button' + // }) + // divs.forEach(i => { + // divs[i].isActive = false + // }) + // } + // + + clickRiga(item) { + console.log('ClickRiga : ', item) + + for (let i = 0; i < this.$refs.single.length; i++) { + // @ts-ignore + this.$refs.single[i].classRow = '' + } + + // // Disattiva quella precedente + // if (this.selrowid > 0) { + // $('#' + this.getrefbyid(this.selrowid) + ' div').removeClass('rowselected') + // } + // + if (this.selrowid !== item.id) { + this.selrowid = item.id + } else { + // was already selected, so deselected + this.selrowid = -1 + } + } + + // updateRow(rec: ITodo) { + // let index = -1 + // // get index + // this.$refs.single.forEach( (singletodo: SingleTodo) => { + // if (singletodo.itemtodo.id === rec.id) + // index = -1 + // }) + // + // } + + modifyField(recOut, recIn, field) { + if (recOut[field] !== recIn[field]) { + recOut.modified = true + recOut[field] = recIn[field] + } } - async modify(myobj) { + async modify(myobj: ITodo, update: boolean) { await this.$db.transaction('rw', [this.$db.todos], async () => { const miorec = await this.$db.todos.get(myobj.id) - miorec.modify_at = new Date() - miorec.completed = myobj.completed - miorec.expiring_at = myobj.expiring_at - miorec.priority = myobj.priority - miorec.pos = myobj.pos + this.modifyField(miorec, myobj, 'completed') + this.modifyField(miorec, myobj, 'expiring_at') + this.modifyField(miorec, myobj, 'priority') + this.modifyField(miorec, myobj, 'id_prev') + this.modifyField(miorec, myobj, 'id_next') + this.modifyField(miorec, myobj, 'pos') - await this.$db.todos.put(miorec) + if (miorec.modified) { + miorec.modify_at = new Date() - this.updatetable() + this.logelem('modify', miorec) + + await this.$db.todos.put(miorec) + + if (update) + await this.updatetable(false) + } }) } diff --git a/src/components/todos/todo/todo.vue b/src/components/todos/todo/todo.vue index 1ef1da6..d31ee32 100644 --- a/src/components/todos/todo/todo.vue +++ b/src/components/todos/todo/todo.vue @@ -8,17 +8,27 @@ v-on:keyup.enter="insertTodo"/> -
- - - - - - -
+
{{ prior = 0 }}
+
+
+ + +
- +
+ +
+ + +
{{ prior = mytodo.priority }}
+
+ + +
+
diff --git a/src/model/Todos.ts b/src/model/Todos.ts index 0234d12..94771a8 100644 --- a/src/model/Todos.ts +++ b/src/model/Todos.ts @@ -1,13 +1,16 @@ export interface ITodo { id?: number, userId: string - pos: number, descr?: string, priority: number, completed: boolean, created_at: any, modify_at: any, - expiring_at: any + expiring_at: any, + id_prev?: number, + id_next?: number, + modified?: boolean, + pos?: number } export interface ITodosState { diff --git a/src/statics/freeplanet-logo-full.svg b/src/statics/freeplanet-logo-full.svg index 5ea13e2..763ad10 100644 --- a/src/statics/freeplanet-logo-full.svg +++ b/src/statics/freeplanet-logo-full.svg @@ -452,31 +452,31 @@ style="fill:none;stroke:#ffffff;stroke-miterlimit:1;stroke-opacity:0" /> - - - - + + + + - - - - + + + + - + - + - + - + diff --git a/src/store/Modules/rescodes.ts b/src/store/Modules/rescodes.ts index 1c90661..6dfd9d7 100644 --- a/src/store/Modules/rescodes.ts +++ b/src/store/Modules/rescodes.ts @@ -5,6 +5,9 @@ export const rescodes = { DUPLICATE_EMAIL_ID: 11000, DUPLICATE_USERNAME_ID: 11100, + LIST_END: 10000000, + LIST_START: 0, + localStorage: { verifiedEmail: 'vf', isLogged: 'ilog', @@ -16,9 +19,13 @@ export const rescodes = { }, Todos: { - PRIORITY_NORMAL: 0, - PRIORITY_HIGH: 1, - PRIORITY_LOW: -1 + PRIORITY_HIGH: 2, + PRIORITY_NORMAL: 1, + PRIORITY_LOW: 0 + }, + + MenuAction: { + DELETE: 100 }, @@ -27,41 +34,72 @@ export const rescodes = { { id: 1, label: 'Alta', - value: 1, + value: 2, icon: 'expand_less' }, { id: 2, label: 'Normale', - value: 0, + value: 1, icon: 'remove' }, { id: 3, label: 'Bassa', - value: -1, + value: 0, icon: 'expand_more' }], 'enUk': [ { id: 1, label: 'High', - value: 1, + value: 2, icon: 'expand_less' }, { id: 2, label: 'Normal', - value: 0, + value: 1, icon: 'remove' }, { id: 3, label: 'Low', - value: -1, + value: 0, icon: 'expand_more' }] + }, + + menuPopupTodo: { + 'it': [ + { + id: 1, + label: 'Cancella', + value: 100, // DELETE + icon: 'delete' + }, + { + id: 2, + label: 'Attiva...', + value: 101, // ATTIVA + icon: 'expand_more' + } + ], + 'enUk': [ + { + id: 1, + label: 'Delete', + value: 100, // DELETE + icon: 'trash' + }, + { + id: 2, + label: 'Attiva...', + value: 101, // ATTIVA + icon: 'sun' + } + ] }