Fix scada
This commit is contained in:
Lucio Maranta
2019-06-25 16:56:56 +02:00
parent 09be892704
commit eda1e7fc43
9 changed files with 141 additions and 24 deletions
Binary file not shown.
@@ -119,7 +119,7 @@ namespace Step.Controllers.WebApi
[Route("data"), HttpPost]
public IHttpActionResult GetAlarmsData(int pageSize)
public IHttpActionResult GetAlarmsData(int pageSize)
{
using (AlarmsController alarmController = new AlarmsController())
{
@@ -43,9 +43,41 @@
input[type=number]{
border: solid 1px #ccc;
}
input[type=number]:disabled{
border: solid 1px #FFFFFF;
}
.input-group{
display: flex;
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
/* display: none; <- Crashes Chrome on hover */
-webkit-appearance: none;
margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
}
.input-group-append{
display: flex;
margin-left: 0px;
align-items: center;
justify-content: center;
}
.appended-btn {
position: relative;
z-index: 2;
background-image: linear-gradient(to bottom, @button-success-color-from, @button-success-color-to);
color: white;
border: #001e48 1px solid;
&:active {
background-image: linear-gradient(to bottom, @button-success-color-to, @button-success-color-from) !important;
box-shadow: inset @button-shadow;
border: #001e48 1px solid !important;
color: #8eb5e2
}
}
}
}
+29
View File
@@ -19654,6 +19654,35 @@ footer .container button.big:before {
.card-scada-production .card-scada-prod-body input[type=number]:disabled {
border: solid 1px #FFFFFF;
}
.card-scada-production .card-scada-prod-body .input-group {
display: flex;
}
.card-scada-production .card-scada-prod-body .input-group input::-webkit-outer-spin-button,
.card-scada-production .card-scada-prod-body .input-group input::-webkit-inner-spin-button {
/* display: none; <- Crashes Chrome on hover */
-webkit-appearance: none;
margin: 0;
/* <-- Apparently some margin are still there even though it's hidden */
}
.card-scada-production .card-scada-prod-body .input-group-append {
display: flex;
margin-left: 0px;
align-items: center;
justify-content: center;
}
.card-scada-production .card-scada-prod-body .appended-btn {
position: relative;
z-index: 2;
background-image: linear-gradient(to bottom, #1756ad, #002680);
color: white;
border: #001e48 1px solid;
}
.card-scada-production .card-scada-prod-body .appended-btn:active {
background-image: linear-gradient(to bottom, #002680, #1756ad) !important;
box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.4);
border: #001e48 1px solid !important;
color: #8eb5e2;
}
.scada-container {
height: 100%;
width: 100%;
@@ -151,6 +151,7 @@ export default class AlarmHistory extends Vue {
this.$options.filters.localize("modal_confirm_delete_alarms", "Confermi la cancellazione di tutti gli allarmi salvati?"),
async () => {
await awaiter(alarmsService.DeleteAlarms())
this.filterChanged("","")
}, null);
}
@@ -64,8 +64,12 @@ export default class CardScadaProduction extends Vue {
await scadaService.SendButtonValue(this.scadaId, itemId);
}
async sendInputValue(itemId: number, value: any) {
await scadaService.SendInputValue(this.scadaId, itemId, value);
async sendInputValue(item:any, value: any) {
item.value.notUpdated = true;
item.value.oldVal = item.value.value;
await scadaService.SendInputValue(this.scadaId, item.id, value);
item.value.notUpdated = false;
}
mounted() {
@@ -78,4 +82,15 @@ export default class CardScadaProduction extends Vue {
e.returnValue = false;
return false;
}
onFocus(item){
item.value.oldVal = item.value.value;
item.value.notUpdated = false;
}
onBlur(item){
if(!item.value.notUpdated)
item.value.value = item.value.oldVal;
}
}
@@ -60,25 +60,48 @@
}"
>{{item.label.textContent}}</div>
<input
type="number"
class="form-control"
@change="sendInputValue(item.id, item.value.value)"
v-for="(item, idx) in inputs(layer)"
:key="'inp_' + idx"
:style="{ top: `${item.position.y}px`,
left: `${item.position.x}px`,
width: `${item.size.x}px`,
height: `${item.size.y}px`,
textAlign: item.label.textAlign,
backgroundColor: item.label.backgroundColor,
color: item.label.textColor,
fontSize: `${item.label.textSize}px`
}"
:disabled="!item.value.isEnabled"
v-model="item.value.value"
<!-- Input box -->
<div class="input-group"
:key="'inp_' + idx"
v-for="(item, idx) in inputs(layer)"
:style="{
top: `${item.position.y}px`,
left: `${item.position.x}px`
}"
>
<input
type="number"
v-model="item.value.value"
class="form-control"
:key="'inp_' + idx"
:disabled="!item.value.isEnabled"
@focus="onFocus(item)"
@blur="onBlur(item)"
@keyup.enter="sendInputValue(item, item.value.value)"
:style="{
top: `${item.position.y}px`,
left: `${item.position.x}px`,
width: `${item.size.x - item.size.y}px`,
height: `${item.size.y}px`,
textAlign: item.label.textAlign,
backgroundColor: item.label.backgroundColor,
color: item.label.textColor,
fontSize: `${item.label.textSize}px`
}"
>
<div
v-if="item.status.action == 'WRITE'"
class="input-group-append">
<button class="appended-btn"
@mousedown="sendInputValue(item, item.value.value)"
:style="{
width: `${item.size.y + 3}px`,
height: `${item.size.y + 3}px`}">
<i class="fa fa-arrow-right"></i>
</button>
</div>
</div>
</div>
</div>
</div>
@@ -23,7 +23,7 @@ export default class Scada extends Vue {
}
@Prop()
currentScadaId:number ;
currentScadaId: number ;
public selectTab(value: number) {
// this.currentScadaId = value;
@@ -99,8 +99,11 @@ export default class Scada extends Vue {
await scadaService.SendButtonValue(this.currentScadaId, itemId);
}
async sendInputValue(itemId: number, value: any) {
await scadaService.SendInputValue(this.currentScadaId, itemId, value);
async sendInputValue(item: any, value: any) {
item.value.updated = false;
item.value.oldVal = item.value.value;
await scadaService.SendInputValue(this.currentScadaId, item.id, value);
item.value.updated = true;
}
async mounted() {
@@ -122,4 +125,15 @@ export default class Scada extends Vue {
e.returnValue = false;
return false;
}
onFocus(item){
item.value.oldVal = item.value.value;
item.value.updated = true;
}
onBlur(item){
if(item.value.updated)
item.value.value = item.value.oldVal;
}
}
@@ -140,6 +140,9 @@ export default class DoughnutChartAnimated extends Vue {
}
getEmptyStroke(radius, value) {
if(value > 100)
value = 100;
// If value is equal to 100, remove 0.05 in order to fix gap between internal line & intervals semicircle
let pct = value == 100 ? 0.745 : 0.75
// Perimeter of circumferences * blank pct