++ If press DELETE or BACKSPACE and is blank description, delete the Todos.

- fix: if offline, doesn't save to cache??  if I refresh page, the data disappear
- ++ field to the percent progress
- fix: Refreshing 2 times the array todos.. because there is a filter

src/components/todos/SubMenus/SubMenus.scss

@@ -3,7 +3,7 @@
 
 }
 
-.item-menu{
+.item-menu {
   font-size: 1rem;
 }
 
@@ -11,6 +11,7 @@
   cursor: pointer;
 }
 
-.menuProgress {
-
+.menuInputProgress > div:nth-child(2) > div > input {
+  min-width: 30px;
+  width: 30px;
 }

src/components/todos/SubMenus/SubMenus.ts

@@ -2,8 +2,8 @@ import Vue from 'vue'
 import { Component, Prop } from 'vue-property-decorator'
 
 import { ITodo } from '../../../model/index'
-import { rescodes } from "@src/store/Modules/rescodes"
-import { UserStore } from "@store"
+import { rescodes } from '@src/store/Modules/rescodes'
+import { UserStore } from '@store'
 
 
 @Component({
@@ -14,7 +14,7 @@ export default class SubMenus extends Vue {
   public selectPriority: [] = rescodes.selectPriority[UserStore.state.lang]
 
   @Prop({ required: false }) menuPopupTodo: any[]
-  @Prop({ required: false }) itemtodo: ITodo[]
+  @Prop({ required: false }) itemtodo: ITodo
   $q: any
 
   clickMenu (field) {
@@ -25,6 +25,15 @@ export default class SubMenus extends Vue {
     this.$emit('setPriority', field)
   }
 
+  KeychangeProgress (e) {
+    if (this.itemtodo.progress > 100) {
+      this.itemtodo.progress = 100
+    }
+    if (this.itemtodo.progress < 0) {
+      this.itemtodo.progress = 0
+    }
+  }
+
   create () {
     this.selectPriority = rescodes.selectPriority[UserStore.state.lang]
 

src/components/todos/SubMenus/SubMenus.vue

@@ -18,14 +18,28 @@
                     </q-item-side>
 
                     <q-item-main v-if="field.value === 120">
-                        <q-slider :class="$parent.menuProgress" v-model="itemtodo.progress" :min="0" :max="100"/>
+                        <q-slider :class="$parent.menuProgress" v-model="itemtodo.progress" :min="0" :max="100"
+                                  :step="5"/>
+
                     </q-item-main>
-                    <q-item-side v-if="field.value === 120">
-                        <div :class="$parent.percProgress">
-                            {{$parent.percentageProgress}}%
+                    <q-item-side v-if="field.value === 120" >
+                        <div>
+                                <q-input v-model="itemtodo.progress"
+                                         class="menuInputProgress"
+                                         type="number"
+                                         suffix="%"
+                                         @change="val => { model = val }"
+                                         @keydown="KeychangeProgress"
+                                />
                         </div>
                     </q-item-side>
 
+                    <!--<q-item-side right v-if="field.value === 120">-->
+                    <!--<div :class="$parent.percProgress">-->
+                    <!--{{$parent.percentageProgress}}%-->
+                    <!--</div>-->
+                    <!--</q-item-side>-->
+
                 </q-item>
                 <q-item v-if="(field.value === 100)" :icon="field.icon" v-close-overlay
                         @click.native="clickMenu(field.value)">
@@ -61,6 +75,6 @@
 <script lang="ts" src="./SubMenus.ts">
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
     @import './SubMenus.scss';
 </style>