From 6a92dbeca8e58ab724229f13c7c52527f49cde59 Mon Sep 17 00:00:00 2001 From: Paolo Arena Date: Fri, 12 Jul 2019 18:23:16 +0200 Subject: [PATCH] Creating Estimate Page --- package.json | 16 +-- quasar.conf.js | 12 ++ src/App.scss | 28 +++- src/model/Estimate.ts | 17 +++ src/model/index.ts | 1 + src/router/route-config.ts | 5 + src/store/Modules/tools.ts | 3 +- src/views/pages/estimate/estimate.scss | 26 ++++ src/views/pages/estimate/estimate.ts | 183 +++++++++++++++++++++++++ src/views/pages/estimate/estimate.vue | 48 +++++++ src/views/pages/estimate/index.ts | 1 + 11 files changed, 328 insertions(+), 12 deletions(-) create mode 100644 src/model/Estimate.ts create mode 100644 src/views/pages/estimate/estimate.scss create mode 100644 src/views/pages/estimate/estimate.ts create mode 100644 src/views/pages/estimate/estimate.vue create mode 100644 src/views/pages/estimate/index.ts diff --git a/package.json b/package.json index eaca40a..5e6f566 100755 --- a/package.json +++ b/package.json @@ -28,12 +28,12 @@ "dependencies": { "@babel/plugin-transform-runtime": "^7.4.0", "@babel/runtime": "^7.0.0", - "@quasar/extras": "^1.1.2", + "@quasar/extras": "^1.2.0", "@types/vuelidate": "^0.7.0", "@vue/eslint-config-standard": "^4.0.0", "acorn": "^6.0.0", "autoprefixer": "^9.5.0", - "axios": "^0.18.0", + "axios": "^0.19.0", "babel-eslint": "^10.0.1", "bcrypt-nodejs": "0.0.3", "bcryptjs": "^2.4.3", @@ -44,13 +44,13 @@ "graphql": "^0.13.2", "graphql-tag": "^2.8.0", "gsap": "^2.0.2", - "jquery": "^3.3.1", + "jquery": "^3.4.1", "js-cookie": "^2.2.0", "localforage": "^1.7.3", "normalize.css": "^8.0.0", - "npm": "^6.9.0", + "npm": "^6.10.1", "nprogress": "^0.2.0", - "quasar": "^1.0.0-beta.21", + "quasar": "^1.0.4", "quasar-extras": "^2.0.8", "register-service-worker": "^1.0.0", "vee-validate": "^2.1.2", @@ -85,7 +85,7 @@ "@babel/plugin-syntax-dynamic-import": "^7.2.0", "@babel/plugin-syntax-import-meta": "^7.2.0", "@babel/preset-env": "^7.4.2", - "@quasar/app": "^1.0.0-beta.22", + "@quasar/app": "^1.0.4", "@quasar/quasar-app-extension-typescript": "^1.0.0-alpha.11", "@types/dotenv": "^4.0.3", "@types/jest": "^23.1.4", @@ -98,8 +98,8 @@ "@vue/cli-plugin-e2e-cypress": "^3.0.1", "@vue/cli-plugin-pwa": "^3.0.1", "@vue/cli-plugin-typescript": "^3.0.1", - "@vue/cli-plugin-unit-jest": "^3.5.3", - "@vue/cli-service": "^3.0.1", + "@vue/cli-plugin-unit-jest": "^3.9.0", + "@vue/cli-service": "^3.9.2", "@vue/test-utils": "^1.0.0-beta.20", "babel-core": "^7.0.0-bridge.0", "babel-jest": "^24.5.0", diff --git a/quasar.conf.js b/quasar.conf.js index 4b46c4e..efab0d7 100644 --- a/quasar.conf.js +++ b/quasar.conf.js @@ -134,11 +134,17 @@ module.exports = function (ctx) { 'QToolbarTitle', 'QBtn', 'QBtnDropdown', + 'QColor', 'QIcon', 'QList', 'QItemLabel', 'QItem', 'QCard', + 'QMarkupTable', + 'QSpace', + 'QDialog', + 'QBadge', + 'QForm', 'QCardSection', 'QCardActions', 'QField', @@ -173,6 +179,12 @@ module.exports = function (ctx) { 'QImg', 'QSplitter', 'QRating', + 'QParallax', + 'QTab', + 'QTabs', + 'QTabPanels', + 'QTabPanel', + 'QTree', 'QSeparator' ], directives: [ diff --git a/src/App.scss b/src/App.scss index bb8b4f2..1e94840 100644 --- a/src/App.scss +++ b/src/App.scss @@ -40,8 +40,7 @@ } } - -.my-notif-class{ +.my-notif-class { font-weight: bold; } @@ -54,14 +53,15 @@ .lowperc { color: red; } + .medperc { color: blue; } + .highperc { color: green; } - .hide-if-small { @media (max-width: 600px) { display: none; @@ -73,3 +73,25 @@ max-width: 22px; } } + +.tothebottomfixed { + left: 0; + right: 0; + position: fixed; + z-index: 9999; + box-sizing: border-box; + overflow: hidden; + margin: 0 auto; + bottom: 10px; +} + +.tothetop { + left: 0; + right: 0; + position: fixed; + z-index: 9999; + box-sizing: border-box; + overflow: hidden; + margin: 0 auto; + top: 20px; +} diff --git a/src/model/Estimate.ts b/src/model/Estimate.ts new file mode 100644 index 0000000..ee2e547 --- /dev/null +++ b/src/model/Estimate.ts @@ -0,0 +1,17 @@ +import { tools } from '@src/store/Modules/tools' +import { toolsext } from '@src/store/Modules/toolsext' + +export interface IEstimate { + id: number + title: string + advanced?: boolean + description?: string + viewlist?: number[] + listsel?: number + qtaName?: string + icon?: string + numpag?: number + qta?: number + price: number + checksel?: boolean +} diff --git a/src/model/index.ts b/src/model/index.ts index 0f2cd7c..dcb8eb8 100644 --- a/src/model/index.ts +++ b/src/model/index.ts @@ -10,3 +10,4 @@ export * from './Todos' export * from './Projects' export * from './Calendar' +export * from './Estimate' diff --git a/src/router/route-config.ts b/src/router/route-config.ts index 9f30a1b..f0e0058 100644 --- a/src/router/route-config.ts +++ b/src/router/route-config.ts @@ -88,6 +88,11 @@ export const cfgrouter = { name: 'Categories', component: () => import('@/views/admin/testp1/testp1.vue') }, + { + path: '/estimate', + name: 'Estimate', + component: () => import('@/views/pages/estimate/estimate.vue') + }, { path: '/offline', name: 'Offline', diff --git a/src/store/Modules/tools.ts b/src/store/Modules/tools.ts index 1260fac..00cf4dc 100644 --- a/src/store/Modules/tools.ts +++ b/src/store/Modules/tools.ts @@ -10,7 +10,6 @@ import translate from '@src/globalroutines/util' import { RouteNames } from '@src/router/route-names' import { lists } from './lists' -import { shen } from '@src/database/shen' export interface INotify { color?: string | 'primary' @@ -38,6 +37,8 @@ export const tools = { WHAT_TODO: 1, WHAT_PROJECT: 2, + languageid: 5, + arrLangUsed: ['enUs', 'it', 'es'], SERVKEY_VERS: 'vers', diff --git a/src/views/pages/estimate/estimate.scss b/src/views/pages/estimate/estimate.scss new file mode 100644 index 0000000..6c1fb51 --- /dev/null +++ b/src/views/pages/estimate/estimate.scss @@ -0,0 +1,26 @@ +.est{ + margin: 5px; + padding: 5px; + + &__price { + color: blue; + } + + &__totale_text { + padding: 2px; + font-size: 1.15rem; + color: blue; + } + + &__totale_numpag { + padding: 2px; + font-size: 1.15rem; + color: red; + } + + &__totale_price { + padding: 2px; + font-size: 1.15rem; + color: green; + } +} diff --git a/src/views/pages/estimate/estimate.ts b/src/views/pages/estimate/estimate.ts new file mode 100644 index 0000000..7d92d61 --- /dev/null +++ b/src/views/pages/estimate/estimate.ts @@ -0,0 +1,183 @@ +import Vue from 'vue' +import { Component, Watch } from 'vue-property-decorator' +import { IEstimate } from '@src/model' +import { tools } from '@src/store/Modules/tools' + +@Component({}) +export default class Estimate extends Vue { + public arrEstimate: IEstimate[] = [] + + public arrEstimateit: IEstimate[] = [ + { + id: 1, + title: 'Pagina Web Base', description: 'Incluso nel prezzo:
' + + '- 5 pagine principali: Home principale con testo + slideshow di immagini, Chi siamo, Dove Siamo, Contatti
' + + '- Possibilità di modificare in maniera autonoma i testi delle pagine (Sito Dinamico)
' + + '- Galleria d\'immagini Slideshow ' + + '- Certificato SSL / HTTPS di sicurezza incluso
' + + '- GDPR privacy e cookie
' + + '- Posizionamento motori di ricerca
', + price: 250, + advanced: false, + qta: 1, + icon: 'web', + numpag: 5, + viewlist: null, + checksel: true + }, + { + id: 9, + title: 'Hosting Base Dominio WWW (Servizio Esterno)', + description: 'Servizio di Hosting linux base + Database Mysql + Servizio Mail + Dominio', + advanced: false, + icon: 'home', + price: 80, + qta: 1, + numpag: 0, + viewlist: null, + checksel: false + }, + { + id: 2, + title: '+ 5 Pagine Aggiuntive', + description: 'Inserisci il numero di pagine che si vuole creare', + advanced: false, + price: 50, + qta: 1, + numpag: 5, + icon: 'description', + viewlist: null, + checksel: false + }, + { + id: 3, + title: '+ 10 Pagine Aggiuntive', + description: 'pagine aggiuntive da creare', + price: 85, + qta: 1, + numpag: 10, + icon: 'description', + viewlist: null, + checksel: false + }, + { + id: 4, + title: '+ 20 Pagine Aggiuntive', + description: 'pagine aggiuntive da creare', + advanced: false, + price: 140, + qta: 1, + numpag: 20, + icon: 'description', + viewlist: null, + checksel: false + }, + { + id: tools.languageid, + title: '+ 1 Lingua Aggiuntiva (con testi già tradotti)', + description: 'Inserimento di 1 lingua straniera nel sito. Comprende le pagine selezionate', + advanced: false, + icon: 'language', + price: 10, + qta: 1, + numpag: 0, + viewlist: null, + checksel: false + }, + { + id: 8, + title: 'Gestione Newsletter integrata con MailChimp', + advanced: true, + description: 'All\'interno del sito l\'utente potrà lasciare la propria email e nome, e verrà inviata a MailChimp (Account Gratuito)', + icon: 'contact_mail', + price: 50, + qta: 1, + numpag: 0, + viewlist: null, + checksel: false + }, + { + id: 6, + title: 'Calendario Eventi', + advanced: true, + description: 'Visualizzazione Mensile e Settimanale di un calendario Eventi Personalizzato', + icon: 'event', + price: 100, + qta: 1, + numpag: 0, + viewlist: null, + checksel: false + }, + { + id: 7, + title: 'Galleria Immagini Personalizzata', + advanced: true, + description: 'Possibilità di aggiungere/eliminare foto autonomamente dalla galleria Immagini (Richiede Hosting Base)', + icon: 'perm_media', + price: 100, + qta: 1, + numpag: 0, + viewlist: null, + checksel: false + } + // { + // id: 7, + // title: 'Servizio di Assistenza e modifica pagine (dal 2° anno)', + // description: '', + // icon: 'perm_media', + // price: 100, + // qta: 1, + // numpag: 0, + // viewlist: null, + // checksel: false + // }, + ] + + public mounted() { + this.arrEstimate = this.arrEstimateit + } + + public getPrice(rec: IEstimate) { + if (rec.id === tools.languageid) { + return rec.price * this.getNumpagTotal() + } else { + return rec.price + } + } + + public getNumpagTotal() { + let numpag = 0 + let rec: IEstimate = null + + for (rec of this.arrEstimateit) { + if (rec.checksel) { + numpag += rec.numpag + } + } + + return numpag + } + + public getTotal() { + let tot = 0 + let rec: IEstimate = null + + const numpagtot = this.getNumpagTotal() + + for (rec of this.arrEstimateit) { + if (rec.checksel) + tot += this.getPrice(rec) * rec.qta + } + + return tot + } + + public getColor(rec) { + if (rec.advanced) { + return 'red' + } else { + return 'blue' + } + } + +} diff --git a/src/views/pages/estimate/estimate.vue b/src/views/pages/estimate/estimate.vue new file mode 100644 index 0000000..3e51a98 --- /dev/null +++ b/src/views/pages/estimate/estimate.vue @@ -0,0 +1,48 @@ + + + + diff --git a/src/views/pages/estimate/index.ts b/src/views/pages/estimate/index.ts new file mode 100644 index 0000000..2594d34 --- /dev/null +++ b/src/views/pages/estimate/index.ts @@ -0,0 +1 @@ +export {default as estimate} from './estimate.vue'