diff --git a/docs/docs.txt b/docs/docs.txt new file mode 100644 index 0000000..a795997 --- /dev/null +++ b/docs/docs.txt @@ -0,0 +1,6 @@ +xs 576px Extra small sized window +sm 768px Small sized window +md 992px Medium-sized window +lg 1200px Large sized window +xl Infinite Extra large sized window + diff --git a/package.json b/package.json index 8311ec7..d0192e6 100644 --- a/package.json +++ b/package.json @@ -85,6 +85,7 @@ "jest": "^23.6.0", "json-loader": "^0.5.4", "node-sass": "^4.11.0", + "postcss-loader": "^3.0.0", "quasar-cli": "^0.17.20", "sass-loader": "^7.1.0", "strip-ansi": "=3.0.1", diff --git a/quasar.conf.js b/quasar.conf.js index c07c054..e148d2f 100644 --- a/quasar.conf.js +++ b/quasar.conf.js @@ -146,6 +146,7 @@ module.exports = function (ctx) { 'QSpinnerGears', 'QDatetime', 'QSlideTransition', + 'QTable', ], directives: [ 'Ripple', diff --git a/src/components/categories/SingleCat/SingleCat.scss b/src/components/categories/SingleCat/SingleCat.scss new file mode 100644 index 0000000..d966e35 --- /dev/null +++ b/src/components/categories/SingleCat/SingleCat.scss @@ -0,0 +1,17 @@ +#appsinglecat { + color: white; + font-size: 1.2rem; + display: flex; + margin: 2px; + padding: 3px; + border: 2px; + background-color: #3b5998; +} + +.mycols{ + padding: 1px; + margin: 2px; + border-color: #d50000; + border-style: outset; + background-color: green; +} diff --git a/src/components/categories/SingleCat/SingleCat.ts b/src/components/categories/SingleCat/SingleCat.ts new file mode 100644 index 0000000..900000c --- /dev/null +++ b/src/components/categories/SingleCat/SingleCat.ts @@ -0,0 +1,23 @@ +import Vue from 'vue' +import { Component, Prop } from 'vue-property-decorator' + +require('./SingleCat.scss') + +import { ICategory } from '../../../model/index' + +@Component({ + +}) +export default class SingleCat extends Vue { + @Prop({required: true}) itemcat: ICategory + + + created() { + + } + + remove() { + + } + +} diff --git a/src/components/categories/SingleCat/SingleCat.vue b/src/components/categories/SingleCat/SingleCat.vue new file mode 100644 index 0000000..fbcc2ed --- /dev/null +++ b/src/components/categories/SingleCat/SingleCat.vue @@ -0,0 +1,19 @@ + + + diff --git a/src/components/categories/SingleCat/index.ts b/src/components/categories/SingleCat/index.ts new file mode 100644 index 0000000..afa4a14 --- /dev/null +++ b/src/components/categories/SingleCat/index.ts @@ -0,0 +1 @@ +export {default as SingleCat} from './SingleCat.vue' diff --git a/src/components/categories/category/category.ts b/src/components/categories/category/category.ts index b387e4e..f5806cf 100644 --- a/src/components/categories/category/category.ts +++ b/src/components/categories/category/category.ts @@ -1,47 +1,145 @@ import Vue from 'vue' -import { Component } from 'vue-property-decorator' +import { Component, Watch } from 'vue-property-decorator' + +import { SingleCat } from '@components' +import { ICategory } from '@src/model' require('./category.scss') -@Component({}) +@Component({ + components: { SingleCat } +}) export default class Category extends Vue { + $q: any + filter: boolean = false + title: string = '' category: string = '' - categories_arr: any[] = null + categories_loc: any[] = [{}] + categories_arr: any[] = [{}] + selected: any [] = [] + selectedSecond: any [] = [] + + data: any [] = [{ + id: 0, + descr_it: 'Frozen Yogurt', + descr_en: '', + descr_es: '' + }, + { + id: 1, + descr_it: 'Secondo', + descr_en: '', + descr_es: '' + }] + + columns: any [] = [ + { + name: 'descr_it', + required: true, + label: 'IT', + align: 'left', + field: 'descr_it', + sortable: true, + classes: 'my-class', + }, + { + name: 'descr_en', + label: 'EN', + align: 'left', + field: 'descr_en', + sortable: true, + classes: 'my-class', + }, + { + name: 'descr_es', + label: 'ES', + align: 'left', + field: 'descr_es', + sortable: true, + classes: 'my-class', + } + ] + + @Watch('categories_loc') valueChanged() { + this.updatetable() + } + created() { this.loadCat() } async loadCat() { - await this.$db.categories.toArray().then(ris => this.categories_arr = ris) + await this.$db.categories.toArray().then(ris => this.categories_loc = ris) this.updatetable() } + initcat() { + + const objcat: ICategory = { + descr_it: '', + descr_en: '', + descr_es: '' + } + return objcat + + } + async insertCategory() { + const objcat = this.initcat() + let myid = 0 - const mycat = this.category + objcat.descr_it = this.category + // Add to Indexdb - await this.$db.categories.add( - { descr_it: mycat } + await this.$db.categories.add(objcat ).then(ris => { myid = ris }) - // created_at: new Date(), + objcat.id = myid // Add into the memory - this.categories_arr.push({ descr_it: mycat, id: myid }) + this.categories_loc.push(objcat) + + // empty the field + this.category = '' + } + + async deleteCategory(myarrobj) { + + await myarrobj.forEach(myobj => { + + if (myobj.id !== undefined) { + console.log('KEY = ', myobj.id) + + // Delete item + let deleteCount = this.$db.categories + .where('id').equals(myobj.id) + .delete() + + console.log('deleteCount = ', deleteCount) + if (deleteCount > 0) { + // Remove into the memory + this.categories_loc.slice(this.categories_loc.indexOf(myobj), 1) + + this.updatetable() + + return deleteCount + } + } + }) - this.updatetable() } updatetable() { this.filterCategories() + this.categories_arr = [...this.categories_loc] } @@ -55,13 +153,48 @@ export default class Category extends Vue { .then((response) => { Promise.all(response.map(key => key)) .then((myarr) => { - this.categories_arr = [...myarr] - return this.categories_arr + this.categories_loc = [...myarr] + return this.categories_loc }) }) } else { - return this.categories_arr + return this.categories_loc } } + deleteRow() { + console.log('SEL = ', this.selectedSecond) + + const seldel = [...this.selectedSecond] + if (this.deleteCategory(this.selectedSecond)) { + this.$q.notify({ + color: 'primary', + icon: 'delete', + message: `Deleted ` + (seldel.length.toString()) + ' item' + }) + + + } + + } + + /* + await db.transaction('rw', [db.friends], async () => { + const friend = await db.friends.get(1); + ++friend.age; + await db.friends.put(friend); + }); + */ + + async modify() { + // esempio da sistemare + await this.$db.transaction('rw', [this.$db.categories], async () => { + const friend = await this.$db.get(1) + ++friend.age + await this.$db.put(friend) + }) + + } + + } diff --git a/src/components/categories/category/category.vue b/src/components/categories/category/category.vue index be70f04..9cce5a3 100644 --- a/src/components/categories/category/category.vue +++ b/src/components/categories/category/category.vue @@ -1,16 +1,59 @@