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

finalmente la backdrop

Browse Source
This commit is contained in:
Paolo Possanzini
2018-03-29 16:22:01 +02:00
parent d6111c53d4
commit becec17029
5 changed files with 65 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/plc-softkeys.less
+11
View File
@@ -23,6 +23,7 @@
left: 0;
right: 0;
bottom: 0;
z-index:1;
background-color: rgba(255, 255, 255, 0.2);
}
&>div.waiting::after {
@@ -139,6 +140,16 @@
height: 42px;
}
}
&.opened{
border: 2px solid #4b4b4b;
position: absolute;
z-index: 4;
.detail section {
height: 42px;
}
}
position: relative;
width: 184px;
height: 70px;
Step/wwwroot/assets/styles/style.css
+9
View File
@@ -1496,6 +1496,7 @@ footer .container button.big:before {
left: 0;
right: 0;
bottom: 0;
z-index: 1;
background-color: rgba(255, 255, 255, 0.2);
}
#plc-softkeys-container > div.waiting::after {
@@ -1613,6 +1614,14 @@ footer .container button.big:before {
.soft-key.selected .detail section {
height: 42px;
}
.soft-key.opened {
border: 2px solid #4b4b4b;
position: absolute;
z-index: 4;
}
.soft-key.opened .detail section {
height: 42px;
}
.soft-key .menu-container {
width: 360px;
top: 80px;
Step/wwwroot/src/modules/plc-softkeys.ts
+19 -6
View File
@@ -12,21 +12,25 @@ export default class softKeys extends Vue {
public selectedSection: number = 1;
public selectedMenuItem: number = 0;
public selectedSoftKey: any = null;
public waitingForStart: boolean = false;
public disabled: boolean = false;
public selectedPositionTop: string = "0";
public selectedPositionLeft: string = "0";
public selectSection(value: number) {
this.selectedSection = value;
}
public getSoftKeyStatus(id: number) : boolean{
public getSoftKeyStatus(id: number): boolean {
var sk = this.$store.getters.getSoftKeyStatus(id);
if (sk)
return sk.Value;
return false;
}
public getSoftKeyActive(id: number) : boolean{
public getSoftKeyActive(id: number): boolean {
var sk = this.$store.getters.getSoftKeyStatus(id);
if (sk)
return sk.Active;
@@ -41,11 +45,20 @@ export default class softKeys extends Vue {
return (this.$store.state as AppModel).machineInfo.softKeys[value];
}
public toggleMenu(value: number) {
if (this.selectedMenuItem == value)
public toggleMenu(value: any) {
if (this.selectedMenuItem == value.id) {
this.selectedMenuItem = null;
else
this.selectedMenuItem = value;
this.selectedSoftKey = null;
}
else {
this.selectedMenuItem = value.id;
this.selectedSoftKey = value;
}
}
public setSoftKeyPosition(sk: any) {
this.selectedPositionLeft = sk.offsetLeft + "px";
this.selectedPositionTop = (sk.offsetTop + 104) + "px";
}
public softKeyChanged(id: number) {
Step/wwwroot/src/modules/plc-softkeys.vue
+23 -14
View File
@@ -12,21 +12,30 @@
</header>
<div class="title" >{{'maint_' + selectedSection | localize('maint_' + selectedSection) }}</div>
<section class="scrollable">
<div v-for="b in sectionButtons(selectedSection)" :key="b.id">
<group-soft-key v-if="b.type==2" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
:selected="false"
:subkeys="b.subKeys"
@click="toggleMenu(b.id)"
:menu-opened="b.id == selectedMenuItem"
:class="{opened: b.id == selectedMenuItem}"
@subkeyClick="softKeyChanged"></group-soft-key>
<on-off-soft-key v-if="b.type==0" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
:disabled="true"
:checked="getSoftKeyStatus(b.id)"
@checkChanged="softKeyChanged(b.id)"></on-off-soft-key>
<procedure-soft-key v-if="b.type==1" :title="'softkey_' + b.id | localize('softkey_' + b.id)" ></procedure-soft-key>
</div>
<group-soft-key v-for="b in sectionButtons(selectedSection)" :key="b.id"
v-if="b.type==2" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
:selected="false"
:subkeys="b.subKeys"
@position="setSoftKeyPosition"
@click="toggleMenu(b)"></group-soft-key>
<on-off-soft-key v-for="b in sectionButtons(selectedSection)" :key="b.id"
v-if="b.type==0" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
:disabled="true"
:checked="getSoftKeyStatus(b.id)"
@checkChanged="softKeyChanged(b.id)"></on-off-soft-key>
<procedure-soft-key v-for="b in sectionButtons(selectedSection)" :key="b.id"
v-if="b.type==1" :title="'softkey_' + b.id | localize('softkey_' + b.id)" ></procedure-soft-key>
</section>
<group-soft-key v-if="selectedSoftKey!=null"
:title="'softkey_' + selectedSoftKey.id | localize('softkey_' + selectedSoftKey.id)"
style="position:absolute"
:selected="false"
:subkeys="selectedSoftKey.subKeys"
@click="toggleMenu(selectedSoftKey)"
:style="{ top: selectedPositionTop , left: selectedPositionLeft}"
:menu-opened="selectedSoftKey.id == selectedMenuItem"
:class="{opened: selectedSoftKey.id == selectedMenuItem}"
@subkeyClick="softKeyChanged"></group-soft-key>
<div class="softkeys-backdrop" v-if="selectedMenuItem"></div>
</div>
<div class="waiting-button" :class="{waiting : waitingForStart}"></div>
Step/wwwroot/src/modules/under-the-hood/soft-key1.vue
+3 -2
View File
@@ -1,5 +1,5 @@
<template>
<div class="soft-key" :class="{menuopened: menuOpened, disabled: disabled, selected: selected}">
<div class="soft-key" ref="sk" :class="{menuopened: menuOpened, disabled: disabled, selected: selected}">
<header>{{title}}</header>
<div class="detail">
<button class="star" :class="{active: starred}"><i class="fa fa-star"></i></button>
@@ -23,7 +23,7 @@ export default {
subkeys: {},
menuOpened: { default: false },
disabled: {default: false},
selected: { default: false },
selected: { default: false }
},
computed: {
keys() {
@@ -40,6 +40,7 @@ export default {
},
toggleMenu() {
this.$emit("click");
this.$emit("position", this.$refs.sk);
},
sendSubKey(id) {
this.$emit("subkeyClick", id);