From 72aa243b516d466b6d8f3f96c11645f381baa654 Mon Sep 17 00:00:00 2001 From: = Date: Mon, 13 Jul 2020 17:52:44 +0200 Subject: [PATCH 1/4] fix labels duration --- .../processo/components/gantt/gantt-component.vue | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt-component.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt-component.vue index 30da27d5..a8edbe76 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt-component.vue +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt-component.vue @@ -18,7 +18,7 @@ - + {{value.label | localize(value.label)}} - + Date: Mon, 13 Jul 2020 18:52:01 +0200 Subject: [PATCH 2/4] items lavorati... last --- .../wwwroot/assets/styles/base/dashboard.less | 72 +++++++++++++++++++ Thermo.Active/wwwroot/assets/styles/style.css | 60 ++++++++++++++++ .../dashboard/base-components/item.ts | 12 ++++ .../dashboard/base-components/item.vue | 69 ++++++++++++++++++ .../app_modules_thermo/dashboard/dashboard.ts | 8 ++- .../dashboard/dashboard.vue | 1 + 6 files changed, 221 insertions(+), 1 deletion(-) create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.ts create mode 100644 Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.vue diff --git a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less index ee9d4de9..238288e6 100644 --- a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less +++ b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less @@ -377,4 +377,76 @@ } } } +} + +.history-item { + + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: flex-end; + + .body { + display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr 25px; + width: 630px; + align-items: center; + height: 84px; + background-color: #e8e8e8; + border-bottom: 1px solid #4b4b4b; + } + + .subitems { + + width: 630px; + + .row { + display: grid; + grid-template-columns: 1fr 1fr 1fr; + height: 60px; + margin-left: 151px; + width: calc(100% - 151px - 25px); + background-color: #e8e8e8; + border-bottom: 1px solid #4b4b4b; + } + } + + label { + text-align: right; + font-size: 54px; + font-weight: 500; + } + + .col { + display: flex; + flex-flow: column; + align-items: center; + justify-content: space-evenly; + height: 100%; + + small { + font-size: 12px; + font-weight: 500; + text-transform: uppercase; + text-align: center; + } + + span { + font-size: 25px; + font-weight: 500px; + } + + i { + font-size: 32px; + cursor: pointer; + } + } + + button.trash { + border-radius: 25px; + width: 50px; + height: 50px; + border: 2px solid #4b4b4b; + box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.5); + } } \ No newline at end of file diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css index 5bcf45dc..9f74a0ec 100644 --- a/Thermo.Active/wwwroot/assets/styles/style.css +++ b/Thermo.Active/wwwroot/assets/styles/style.css @@ -4433,6 +4433,66 @@ article .box .body { margin-top: 10px; height: calc(100% - 78px); } +.history-item { + display: flex; + flex-flow: column nowrap; + align-items: center; + justify-content: flex-end; +} +.history-item .body { + display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr 25px; + width: 630px; + align-items: center; + height: 84px; + background-color: #e8e8e8; + border-bottom: 1px solid #4b4b4b; +} +.history-item .subitems { + width: 630px; +} +.history-item .subitems .row { + display: grid; + grid-template-columns: 1fr 1fr 1fr; + height: 60px; + margin-left: 151px; + width: calc(100% - 151px - 25px); + background-color: #e8e8e8; + border-bottom: 1px solid #4b4b4b; +} +.history-item label { + text-align: right; + font-size: 54px; + font-weight: 500; +} +.history-item .col { + display: flex; + flex-flow: column; + align-items: center; + justify-content: space-evenly; + height: 100%; +} +.history-item .col small { + font-size: 12px; + font-weight: 500; + text-transform: uppercase; + text-align: center; +} +.history-item .col span { + font-size: 25px; + font-weight: 500px; +} +.history-item .col i { + font-size: 32px; + cursor: pointer; +} +.history-item button.trash { + border-radius: 25px; + width: 50px; + height: 50px; + border: 2px solid #4b4b4b; + box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.5); +} .warmers { position: relative; } diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.ts new file mode 100644 index 00000000..3ff4d325 --- /dev/null +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.ts @@ -0,0 +1,12 @@ +import Component from "vue-class-component"; +import Vue from "vue"; +import { Prop } from "vue-property-decorator"; + +@Component({}) +export default class Item extends Vue { + + @Prop() + value: Prod.IProd; + + showDetails: boolean = false; +} \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.vue new file mode 100644 index 00000000..b6173af5 --- /dev/null +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/item.vue @@ -0,0 +1,69 @@ + + \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts index 7512fed8..455a26be 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts @@ -11,6 +11,7 @@ import gauge from "./base-components/gauge.vue"; import { prodService } from '@/services/prodService'; import moment from 'moment'; import stats from "./base-components/stats.vue"; +import hitem from "./base-components/item.vue"; @Component({ components: { @@ -18,7 +19,8 @@ import stats from "./base-components/stats.vue"; archInterface: ArchInterface, alarmList, gauge, - stats + stats, + hitem } }) export default class Dashboard extends Vue { @@ -28,6 +30,10 @@ export default class Dashboard extends Vue { return (this.$store.state as AppModel).prod.panel; } + get lastItem() { + return (this.$store.state as AppModel).prod.prod; + } + now = moment(); get elapsed() { diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue index 0847154e..3b21225a 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue @@ -148,6 +148,7 @@ + From 50cd9a4acd6158e93a2f1f103f892f3db213e413 Mon Sep 17 00:00:00 2001 From: = Date: Tue, 14 Jul 2020 12:48:32 +0200 Subject: [PATCH 3/4] timeline animations --- Thermo.Active/wwwroot/assets/styles/base/dashboard.less | 3 --- .../app_modules_thermo/processo/components/gantt/gantt.vue | 5 +++-- .../app_modules_thermo/processo/components/gantt/timeline.ts | 3 +++ .../processo/components/gantt/timeline.vue | 5 ++++- 4 files changed, 10 insertions(+), 6 deletions(-) diff --git a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less index 238288e6..b45756cc 100644 --- a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less +++ b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less @@ -361,11 +361,8 @@ font-size: 120px; font-weight: 300; } - } - } - } .pieces { diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt.vue index 11233090..f3aac95c 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt.vue +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/gantt.vue @@ -50,8 +50,9 @@ diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.ts index 314d76da..63b3a0f8 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.ts +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.ts @@ -17,4 +17,7 @@ export default class timeline extends Vue { @Prop({ default: 0 }) position: number; + @Prop({ default: .5 }) + speed: number; + } \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.vue index 68a3aa08..0efd447e 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.vue +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/gantt/timeline.vue @@ -1,6 +1,9 @@ + + \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts index 455a26be..d1ccdbeb 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts @@ -1,6 +1,6 @@ import Vue from 'vue'; import Component from 'vue-class-component'; -import { Prop } from 'vue-property-decorator'; +import { Prop, Watch } from 'vue-property-decorator'; import { messageService } from '@/_base'; import AppRibbon from "@/components/app-ribbon.vue"; import { alarmList } from "@/app_modules/alarms"; @@ -34,6 +34,13 @@ export default class Dashboard extends Vue { return (this.$store.state as AppModel).prod.prod; } + @Watch("lastItem", { deep: true }) + async lastitemChanged(n: Prod.IProd, o) { + this.items.splice(0, 0, ...await prodService.History(n.numDone - 1, 1)); + } + + items: Prod.IProd[] = []; + now = moment(); get elapsed() { @@ -58,6 +65,17 @@ export default class Dashboard extends Vue { } + loading = false; + async loadMore() { + if (this.loading) return; + this.loading = true; + + let min = Math.min(this.lastItem.numDone, ... this.items.map(i => i.numDone)); + + this.items.push(...await prodService.History(min - 1)); + this.loading = false; + } + getColor(nome, cognome) { return getColorFromName(nome, cognome); } diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue index 3b21225a..2b6a2d78 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.vue @@ -148,7 +148,13 @@ - +
+ +
+
+ + +
@@ -158,6 +164,10 @@ grid-column-end: -1; width: 100%; } + +.current-item { + margin-right: 24px; +} \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/services/prodService.ts b/Thermo.Active/wwwroot/src/services/prodService.ts index ec1f6ceb..ef7b58e8 100644 --- a/Thermo.Active/wwwroot/src/services/prodService.ts +++ b/Thermo.Active/wwwroot/src/services/prodService.ts @@ -19,5 +19,10 @@ export class ProdService extends baseRestService { return result; } + async History(from: number, count: number = 20) { + let result = await this.Get((await this.BASE_URL()) + `history?indexStart=${from}&numRecord=${count}`, true); + return result; + } + } export const prodService = new ProdService(); \ No newline at end of file