diff --git a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less index ee9d4de9..2ee5c20c 100644 --- a/Thermo.Active/wwwroot/assets/styles/base/dashboard.less +++ b/Thermo.Active/wwwroot/assets/styles/base/dashboard.less @@ -293,6 +293,7 @@ height: 100%; display: flex; flex-flow: column; + max-height: 836px; .recipe { @@ -301,6 +302,7 @@ display: flex; align-items: center; justify-content: center; + flex-shrink: 0; &::before { content: ""; @@ -361,11 +363,8 @@ font-size: 120px; font-weight: 300; } - } - } - } .pieces { @@ -377,4 +376,86 @@ } } } +} + +.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); + } + + +} + +.history-list { + height: 100%; + overflow-y: scroll; + margin-right: 8px; + margin-top: 2px; + ; } \ 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..11be4707 100644 --- a/Thermo.Active/wwwroot/assets/styles/style.css +++ b/Thermo.Active/wwwroot/assets/styles/style.css @@ -4367,6 +4367,7 @@ article .box .body { height: 100%; display: flex; flex-flow: column; + max-height: 836px; } .dashboard .third_col .recipe { height: 97px; @@ -4374,6 +4375,7 @@ article .box .body { display: flex; align-items: center; justify-content: center; + flex-shrink: 0; } .dashboard .third_col .recipe::before { content: ""; @@ -4433,6 +4435,72 @@ 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); +} +.history-list { + height: 100%; + overflow-y: scroll; + margin-right: 8px; + margin-top: 2px; +} .warmers { position: relative; } diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts index 63c85329..fe9be64e 100644 --- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts @@ -4,13 +4,15 @@ import Vue from "vue"; import keyboard from "./keyboard.vue"; import clock from "./clock.vue"; import combo from "./combo.vue" +import loadMore from "./loadMore/loadMore.vue"; export default { numeric, slider, keyboard, clock, - combo + combo, + loadMore } Vue.directive('focusOn', { diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.ts new file mode 100644 index 00000000..365e6447 --- /dev/null +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.ts @@ -0,0 +1,33 @@ +import Vue from 'vue'; +import { Prop, Component } from 'vue-property-decorator'; + +@Component({}) +export default class loadMoreItems extends Vue { + + observer = new IntersectionObserver(this.whenObservedChange, { threshold: 0.5 }) + + @Prop({ default: false }) + loading: boolean; + + visible: boolean = false; + + mounted() { + this.observer.observe(this.$el); + } + + beforeDestroy() { + this.observer.disconnect(); + } + + whenObservedChange(entries: IntersectionObserverEntry[]) { + for (const entry of entries) { + + if (entry.intersectionRatio > 0) { + this.$emit("onview"); + this.visible = false; + } + else + this.visible = true; + } + } +} \ No newline at end of file diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.vue new file mode 100644 index 00000000..40502236 --- /dev/null +++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/loadMore/loadMore.vue @@ -0,0 +1,14 @@ + + + \ No newline at end of file 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..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"; @@ -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,17 @@ export default class Dashboard extends Vue { return (this.$store.state as AppModel).prod.panel; } + get lastItem() { + 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() { @@ -52,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 0847154e..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,6 +148,13 @@ +
+ +
+
+ + +
@@ -157,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/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)}} - + 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 @@