Egalware/cms_thermo_active
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI preheating complete

Browse Source
This commit is contained in:
Samuele E. Locatelli
2020-10-03 16:25:46 +02:00
parent 164ffffc95
commit dfc2eca2c2
9 changed files with 193 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Thermo.Active.Utils/languages/IT.xml
+3 -1
View File
@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Automatically generated by nicola.carminati: 2020-10-02 -->
<!-- Automatically generated by nicola.carminati: 2020-10-03 -->
<root>
<language_it>Italiano</language_it>
<header_maintainance_request>Effettuare manutenzione</header_maintainance_request>
@@ -308,4 +308,6 @@
<gauge_potenza>Potenza</gauge_potenza>
<gauge_vuoto>Vuoto</gauge_vuoto>
<gauge_aria>Aria</gauge_aria>
<lbl_btn_preheating_all>Seleziona tutti i giorni</lbl_btn_preheating_all>
<lbl_btn_preheating_non>Deseleziona tutti i giorni</lbl_btn_preheating_non>
</root>
Thermo.Active.Utils/languages/en.xml
+3 -1
View File
@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Automatically generated by nicola.carminati: 2020-10-02 -->
<!-- Automatically generated by nicola.carminati: 2020-10-03 -->
<root>
<language_it>English</language_it>
<header_maintainance_request>Maintenance request</header_maintainance_request>
@@ -308,4 +308,6 @@
<gauge_potenza>Power</gauge_potenza>
<gauge_vuoto>Vacuum</gauge_vuoto>
<gauge_aria>Air</gauge_aria>
<lbl_btn_preheating_all>Select All Days</lbl_btn_preheating_all>
<lbl_btn_preheating_non>Deselect All Days</lbl_btn_preheating_non>
</root>
Thermo.Active/wwwroot/assets/styles/base/progrprerisc.less
+25 -18
View File
@@ -7,7 +7,7 @@
.modal.progr-preriscaldo-info {
margin-top: 200px;
height: 565px;
height: 690px;
header {
padding-left: 31px;
@@ -18,6 +18,10 @@
color: darkblue;
}
footer{
background-color: #ffffff;
}
section.body {
overflow: hidden;
@@ -32,24 +36,12 @@
aside {
margin: 14px;
justify-content: start;
align-items: center;
button {
width: 197px;
height: 48px;
object-fit: contain;
border-radius: 2px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
border: solid 1px #001e48;
background-image: linear-gradient(to bottom, #1756ad, #002680);
font-size: 18px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: white;
margin: auto;
width: 300px;
margin-bottom: 20px;
}
}
@@ -98,7 +90,11 @@
box-shadow: none;
background-color: white;
color: black;
font-size: 20px;
font-size: 20px;
&:disabled{
color: #818a8f!important;
background-color:white!important;
}
}
.selected {
@@ -157,6 +153,11 @@
background-color: #002680;
color: white;
}
&:disabled{
color: #818a8f!important;
background-color: #bbbcbc;
}
}
}
@@ -179,6 +180,12 @@
letter-spacing: normal;
text-align: center;
color: white;
&:disabled{
background-image: none;
color: #818a8f;
background-color: #42494e!important;
}
}
.active {
Thermo.Active/wwwroot/assets/styles/style.css
+21 -17
View File
@@ -5172,7 +5172,7 @@ article .box .body {
}
.modal.progr-preriscaldo-info {
margin-top: 200px;
height: 565px;
height: 690px;
}
.modal.progr-preriscaldo-info header {
padding-left: 31px;
@@ -5182,6 +5182,9 @@ article .box .body {
font-weight: bold;
color: darkblue;
}
.modal.progr-preriscaldo-info footer {
background-color: #ffffff;
}
.modal.progr-preriscaldo-info section.body {
overflow: hidden;
}
@@ -5195,24 +5198,12 @@ article .box .body {
}
.modal.progr-preriscaldo-info section.body section aside {
margin: 14px;
justify-content: start;
align-items: center;
}
.modal.progr-preriscaldo-info section.body section aside button {
width: 197px;
height: 48px;
object-fit: contain;
border-radius: 2px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
border: solid 1px #001e48;
background-image: linear-gradient(to bottom, #1756ad, #002680);
font-size: 18px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
line-height: normal;
letter-spacing: normal;
text-align: center;
color: white;
margin: auto;
width: 300px;
margin-bottom: 20px;
}
.modal.progr-preriscaldo-info section.body section .specific {
margin: 0;
@@ -5258,6 +5249,10 @@ article .box .body {
color: black;
font-size: 20px;
}
.modal.progr-preriscaldo-info section.body section .specific div .clock button:disabled {
color: #818a8f !important;
background-color: white!important;
}
.modal.progr-preriscaldo-info section.body section .specific div .clock .selected {
background-color: #002680;
color: white;
@@ -5300,6 +5295,10 @@ article .box .body {
background-color: #002680;
color: white;
}
.modal.progr-preriscaldo-info section.body section .specific div div.ampm button:disabled {
color: #818a8f !important;
background-color: #bbbcbc;
}
.modal.progr-preriscaldo-info section.body section .specific div button {
border: none;
width: 130px;
@@ -5317,6 +5316,11 @@ article .box .body {
text-align: center;
color: white;
}
.modal.progr-preriscaldo-info section.body section .specific div button:disabled {
background-image: none;
color: #818a8f;
background-color: #42494e !important;
}
.modal.progr-preriscaldo-info section.body section .specific div .active {
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.43);
background-image: linear-gradient(to bottom, #42494e 0%, #818a8f 98%);
Thermo.Active/wwwroot/src/app_modules_thermo/programmazione-preriscaldo/components/programmazione-preriscaldo.ts
+71 -8
View File
@@ -7,6 +7,8 @@ import { appModelActions } from "@/store/app.store";
import moment from "moment";
import { AppModel } from "@/store";
import { Watch } from "vue-property-decorator";
import { preheatingService } from "@/services/preheatingService";
import { awaiter } from "@/_base";
@Component({
components: {
@@ -16,35 +18,87 @@ import { Watch } from "vue-property-decorator";
})
export default class ProgrammazionePreriscaldo extends Vue {
enabling: boolean = true;
risc: boolean = true;
termo: boolean = true;
block: boolean = false;
availabledays = null;
active: string = "";
meridian: string = "--";
minutes= 0;
hours= 0;
currentLang = 'en';
configuration = null;
UIavailable = false;
mounted(){
async mounted(){
this.availabledays = moment.localeData('en').weekdays();
this.currentLang = this.currentAppLanguage;
await this.reloadData();
}
async reloadData(){
let result = await awaiter(preheatingService.GetConfiguration());
this.configuration = result;
let time = this.configuration[0].time.split(":");
if(time[0]< 12){
this.hours = time[0];
this.meridian = 'AM';
}
else
{
this.hours = time[0]-12;
this.meridian = 'PM';
}
this.minutes = time[1];
this.UIavailable = true;
}
async conferma(){
this.UIavailable = false;
await awaiter(preheatingService.UpdateConfiguration(this.configuration));
await this.reloadData();
}
public get currentAppLanguage(){
return (this.$store.state as AppModel).localization.currentLanguage;
}
public selectedDay(name){
if(!this.configuration)
return false;
let result = this.configuration.find(x => x.day === name);
if(result)
return result.enabled;
}
public selectunselectDay(name){
if(!this.configuration)
return;
let result = this.configuration.find(x => x.day === name);
if(result)
result.enabled = !result.enabled;
}
@Watch('currentAppLanguage',{deep:true})
public languageChanged(){
this.currentLang = this.currentAppLanguage;
}
@Watch('meridian',{deep:true})
@Watch('minutes',{deep:true})
@Watch('hours',{deep:true})
public timeChanged(){
if(!this.configuration)
return;
let minutestoset = this.minutes;
let hourstoset = this.hours;
if(this.meridian == 'PM')
hourstoset = hourstoset+12;
this.configuration.forEach(function(part, index, theArray) {
theArray[index].time = ('0' + hourstoset).slice(-2) + ":" + ('0' + minutestoset).slice(-2) +":00";
});
}
getDaysFromName(name) {
return moment().day(name).locale(this.currentLang).format("dddd");
}
@@ -57,7 +111,16 @@ export default class ProgrammazionePreriscaldo extends Vue {
appModelActions.ShowPreDashboard(this.$store);
}
enebleAll(){
this.configuration.forEach(function(part, index, theArray) {
theArray[index].enabled = true;
});
}
disableAll(){
this.configuration.forEach(function(part, index, theArray) {
theArray[index].enabled = false;
});
}
isSelectedMinutes(index) {
return index == this.minutes;
}
Thermo.Active/wwwroot/src/app_modules_thermo/programmazione-preriscaldo/components/programmazione-preriscaldo.vue
+21 -19
View File
@@ -6,10 +6,6 @@
>
<section>
<aside class="scrollable auto">
<div class="input-area">
<label>Abilitazione</label>
<toggle-button v-model="enabling"></toggle-button>
</div>
<!--<hr />
<div class="input-area">
<label>Riscaldi</label>
@@ -23,15 +19,14 @@
<label>Blocca schermo</label>
<toggle-button v-model="block"></toggle-button>
</div>-->
<button @click="showPreDashboard()">Mostra countdown</button>
<button class="btn btn-success" :disabled="!UIavailable" @click="enebleAll()">{{'lbl_btn_preheating_all'|localize('Abilita tutti')}}</button>
<button class="btn btn-success" :disabled="!UIavailable" @click="disableAll()">{{'lbl_btn_preheating_non'|localize('Disabilita tutti')}}</button>
<!--<button @click="showPreDashboard()">Mostra countdown</button>-->
</aside>
<hr />
<div class="specific">
<div v-if="availabledays">
<button v-for="a in availabledays" :key="'btn'+a">{{getDaysFromName(a)}}</button>
</div>
<div>
<v-time-picker format="ampm" ></v-time-picker>
<button :disabled="!UIavailable" v-for="a in availabledays" :key="'btn'+a" :class="{'active':selectedDay(a)}" @click="selectunselectDay(a)" >{{getDaysFromName(a)}}</button>
</div>
<div>
<div>
@@ -39,28 +34,24 @@
<label>{{meridian}}</label>
</div>
<div class="clock">
<button v-for="index in 12" :key="index"
<button v-for="index in 12" :key="index"
@click="selectHours(index -1)"
:class="{'selected':isSelectedHours(index -1)}"
:disabled="!UIavailable"
:style="{transform: 'translateY(125px) rotate('+getSinlePositionAngle(12,(index -1))+'deg) translateY(-125px) rotate(-'+getSinlePositionAngle(12,(index -1))+'deg)'}"
>{{(index -1)}}</button>
<span></span>
</div>
<div class="ampm">
<button @click="meridian='AM'" :class="{'selected':(meridian=='AM')}" >AM</button>
<button @click="meridian='PM'" :class="{'selected':(meridian=='PM')}">PM</button>
<button @click="meridian='AM'" :class="{'selected':(meridian=='AM')}" :disabled="!UIavailable" >AM</button>
<button @click="meridian='PM'" :class="{'selected':(meridian=='PM')}" :disabled="!UIavailable" >PM</button>
</div>
<div class="clock second">
<button v-for="index in 12" :key="index"
<button v-for="index in 12" :key="index"
@click="selectMinutes((index -1) * 5)"
:class="{'selected':isSelectedMinutes((index -1) * 5)}"
:disabled="!UIavailable"
:style="{transform: 'translateY(125px) rotate('+getSinlePositionAngle(12,(index -1))+'deg) translateY(-125px) rotate(-'+getSinlePositionAngle(12,(index -1))+'deg)'}"
>{{(index -1) * 5}}</button>
<span></span>
@@ -68,6 +59,17 @@
</div>
</div>
</section>
<footer>
<button
class="btn"
@click="reloadData()"
>{{'cancel' | localize('Annulla')}}</button>
<button
class="btn btn-success"
@click="conferma()"
:disabled="!UIavailable"
>{{'confirm' | localize('Conferma')}}</button>
</footer>
</modal>
</div>
</template>
Thermo.Active/wwwroot/src/modules/app-footer.vue
+19 -16
View File
@@ -28,6 +28,25 @@
:class="{ big:(isInPath('production') || isInMainPage()) && !state.isMainViewLiftedUp}"
></button>
<button
@click="showDashboard"
:title="'footer_tooltip_dashboard' | localize('Dashboard')"
:disabled="false"
v-if="true"
class="oval clock"
:class="{ big:isInPath('clock') && !state.isMainViewLiftedUp}"
></button>
<button
@click="openProgram('/progrprerisc')"
:title="'footer_tooltip_progr_prerisc' | localize('Programmazione Preriscaldo')"
:disabled="false"
v-if="true"
class="oval progrprerisc"
:class="{ big:isInPath('progrprerisc') && !state.isMainViewLiftedUp}"
></button>
<!-- <button @click="openProgram('/tooling')" :title="'footer_tooltip_tooling' | localize('Tooling')"
:disabled="!isAreaEnabled('tooling')" v-if="isAreaVisible('tooling')" class="oval tools-manager" :class="{ big:isInPath('tooling') && !state.isMainViewLiftedUp}"></button>-->
@@ -49,23 +68,7 @@
:class="{ big:isInPath('alarms') && !state.isMainViewLiftedUp}"
></button>
<button
@click="openProgram('/progrprerisc')"
:title="'footer_tooltip_progr_prerisc' | localize('Programmazione Preriscaldo')"
:disabled="false"
v-if="true"
class="oval progrprerisc"
:class="{ big:isInPath('progrprerisc') && !state.isMainViewLiftedUp}"
></button>
<button
@click="showDashboard"
:title="'footer_tooltip_dashboard' | localize('Dashboard')"
:disabled="false"
v-if="true"
class="oval clock"
:class="{ big:isInPath('clock') && !state.isMainViewLiftedUp}"
></button>
<button @click="openProgram('/users')" :title="'footer_tooltip_users' | localize('Users-Manager')"
:disabled="!isAreaEnabled('users')" v-if="isAreaVisible('users')" class="oval users" :class="{ big:isInPath('users') && !state.isMainViewLiftedUp}"></button>
Thermo.Active/wwwroot/src/services/PreHeatingService.ts
+24
View File
@@ -0,0 +1,24 @@
import { baseRestService } from "../_base/baseRestService";
import { CONFIGURATION } from "@/config";
import { warmersActions } from "@/store/warmers.store";
import { store } from "@/store";
import Warmers from "@/app_modules_thermo/setup/riscaldi/components/base-components/warmers";
export class PreheatingService extends baseRestService {
BASE_URL = async () => (await CONFIGURATION).api.apiServerUrl + "api/SchedTask/";
async GetConfiguration() {
let result = await this.Get((await this.BASE_URL()) + "current");
return result;
}
async UpdateConfiguration(model: any) {
let result = await this.Put<any>((await this.BASE_URL()) + "update", model, true);
return result;
}
}
export const preheatingService = new PreheatingService();
Thermo.Active/wwwroot/src/services/hub.ts
+6
View File
@@ -106,6 +106,7 @@ export class Hub {
// qui i NUOVI metodi NUOVI dal server (Recipe, gauges) da completare lato HUB
this._hub.client.recipeFullData = Hub.recipeFullData;
this._hub.client.setpointHmiInvalid = Hub.setpointHmiInvalid;
this._hub.client.recipeOverData = Hub.recipeOverData;
this._hub.client.recipeChangedData = Hub.recipeChangedData;
this._hub.client.prodInfoData = Hub.prodData;
@@ -179,6 +180,11 @@ export class Hub {
recipeActions.setCurrent(store, data, true);
}
public static setpointHmiInvalid(data) {
console.log("setpointHmiInvalid");
}
public static recipeOverData(data) {
recipeActions.setOverview(store, data);
}