fix layout axes and process aux production

This commit is contained in:
Alessandro Francia
2018-07-04 15:03:06 +02:00
parent d4463e5692
commit cf596edd16
5 changed files with 46 additions and 17 deletions
+20 -6
View File
@@ -527,8 +527,9 @@
width: 100%;
display: flex;
flex-flow: column;
overflow: auto;
.axes{
height: 32px;
min-height: 32px;
width: 100%;
display: flex;
flex-flow: row;
@@ -546,7 +547,6 @@
width: 136px;
height: 32px;
border-radius: 2px;
background-color: @color-white4;
display: flex;
justify-content: flex-end;
align-items: center;
@@ -555,9 +555,18 @@
padding-right: 8px;
}
}
.axes:nth-child(odd) .number{
background-color: @color-white4;
}
.axes:nth-child(even) .number{
background-color: @color-clear-blue-30;
}
.axes:first-child{
margin-top: 16px;
}
.axes:last-child{
margin-bottom: 16px;
}
}
.second-box-axes{
width: 100%;
@@ -885,11 +894,9 @@
color: @color-greyish-brown;
line-height: 1.78px;
text-align: justify;
cursor: pointer;
label{
cursor: pointer;
font-size: 18px;
margin-left: 24px;
margin-left: 36px;
}
}
.row:nth-child(odd){
@@ -920,4 +927,11 @@
}
}
}
}
/* larghezza quando gli assi in card axes in production sono maggiori di 5 dopo scrollbar*/
.first-box-axes.scrollable .axes{
.number.width-number{
overflow: visible;
width: 128px;
}
}
+20 -5
View File
@@ -3845,10 +3845,11 @@ footer .container button.big:before {
width: 100%;
display: flex;
flex-flow: column;
overflow: auto;
}
.card-axes-production .first-box-axes .axes,
.card-axes-production .second-box-axes .axes {
height: 32px;
min-height: 32px;
width: 100%;
display: flex;
flex-flow: row;
@@ -3869,7 +3870,6 @@ footer .container button.big:before {
width: 136px;
height: 32px;
border-radius: 2px;
background-color: #f3f3f3;
display: flex;
justify-content: flex-end;
align-items: center;
@@ -3877,10 +3877,22 @@ footer .container button.big:before {
color: #4b4b4b;
padding-right: 8px;
}
.card-axes-production .first-box-axes .axes:nth-child(odd) .number,
.card-axes-production .second-box-axes .axes:nth-child(odd) .number {
background-color: #f3f3f3;
}
.card-axes-production .first-box-axes .axes:nth-child(even) .number,
.card-axes-production .second-box-axes .axes:nth-child(even) .number {
background-color: rgba(23, 145, 255, 0.3);
}
.card-axes-production .first-box-axes .axes:first-child,
.card-axes-production .second-box-axes .axes:first-child {
margin-top: 16px;
}
.card-axes-production .first-box-axes .axes:last-child,
.card-axes-production .second-box-axes .axes:last-child {
margin-bottom: 16px;
}
.card-axes-production .second-box-axes {
width: 100%;
height: 257px;
@@ -4204,12 +4216,10 @@ footer .container button.big:before {
color: #4b4b4b;
line-height: 1.78px;
text-align: justify;
cursor: pointer;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row label {
cursor: pointer;
font-size: 18px;
margin-left: 24px;
margin-left: 36px;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row:nth-child(odd) {
background-color: rgba(23, 145, 255, 0.3);
@@ -4235,6 +4245,11 @@ footer .container button.big:before {
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row.selected label {
margin: 12px;
}
/* larghezza quando gli assi in card axes in production sono maggiori di 5 dopo scrollbar*/
.first-box-axes.scrollable .axes .number.width-number {
overflow: visible;
width: 128px;
}
@keyframes selectedanimation {
0% {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
@@ -1,12 +1,12 @@
<template>
<!-- <div class="test-container"> -->
<div class="card-axes-production">
<div class="first-box-axes">
<div class="first-box-axes scrollable">
<div class="axes" v-for="a in axes" :key="a.id">
<div class="variable">
{{a.name}}
</div>
<div class="number">
<div class="number" :class="{'width-number': axes.length > 5}">
{{numberX}}
</div>
</div>
@@ -21,13 +21,13 @@
<button class="tab" :class="{'active': enableFileSections}" @click="selectTab('FileSections')">Sezioni File</button>
</div>
<div class="content-box" v-if="enableIsoLines">
<div class="row" :class="{selected: rowSelected == '1'}" @click="selectRow('1')">
<div class="row" :class="{selected: true}">
<div class="triangle"></div><label>Lorem ipsum dolor sit amet, consectetur.</label>
</div>
<div class="row" :class="{selected: rowSelected == '2'}" @click="selectRow('2')">
<div class="row">
<div class="triangle"></div><label>Sed do eiusmod tempor incididunt ut.</label>
</div>
<div class="row" :class="{selected: rowSelected == '3'}" @click="selectRow('3')">
<div class="row">
<div class="triangle"></div><label>Magna aliqua ut enim ad minim veniam.</label>
</div>
</div>
@@ -1,6 +1,6 @@
<template>
<div class="process-selection-maintenance" v-if="processes.length > 1 && checkSecurityEnabled('processCmd')">
<div class="process" v-for="p in processes" :key="p.id" :class="{selected: p.id == selectedProcess, 'small': p.id != selectedProcess, 'error' : p.isInAlarm}" @click="selectProcess(p.id)" :title="'process_tooltip_select' | localize('Select NC-Process %d',p.id)">
<div class="process" v-for="p in processes" :key="p.id" v-if="p.type == 'AUX'" :class="{selected: p.id == selectedProcess, 'small': p.id != selectedProcess, 'error' : p.isInAlarm}" @click="selectProcess(p.id)" :title="'process_tooltip_select' | localize('Select NC-Process %d',p.id)">
<span>{{p.id}}</span>
<!-- <small v-if="p.type == 'AUX'">AUX</small> -->
</div>