fix layout
This commit is contained in:
Alessandro Francia
@@ -448,9 +448,10 @@
|
||||
|
||||
.softkeys-prefered{
|
||||
width: 480px;
|
||||
height: 64px;
|
||||
min-height: 64px;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
align-items: center;
|
||||
background-color: @color-white3;
|
||||
position: relative;
|
||||
.star{
|
||||
@@ -568,7 +569,7 @@
|
||||
}
|
||||
|
||||
.card-axes-production{
|
||||
height: 488px;
|
||||
height: 558px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px 0 @color-black-40;
|
||||
@@ -576,7 +577,7 @@
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
.first-box-axes, .second-box-axes{
|
||||
height: 231px;
|
||||
height: 264px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
@@ -623,7 +624,7 @@
|
||||
}
|
||||
.second-box-axes{
|
||||
width: 100%;
|
||||
height: 257px;
|
||||
height: 294px;
|
||||
.tabs{
|
||||
height: 30px;
|
||||
width:100%;
|
||||
@@ -1056,7 +1057,6 @@
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* larghezza quando gli assi in card axes in production sono maggiori di 5 dopo scrollbar*/
|
||||
.first-box-axes.scrollable .axes{
|
||||
.number.width-number{
|
||||
@@ -1070,7 +1070,7 @@
|
||||
top: 80px;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
left: -90px;
|
||||
left: calc(~"50% - 193px");
|
||||
justify-content: center;
|
||||
z-index: 100;
|
||||
transform: translateZ(0);
|
||||
@@ -1110,6 +1110,7 @@
|
||||
background-color: @color-white3;
|
||||
position: relative;
|
||||
padding: 7px;
|
||||
box-shadow: 0 1px 2px 0 @color-black-40;
|
||||
button {
|
||||
background-image: linear-gradient(to bottom,@color-nice-blue,@color-darkish-blue);
|
||||
width: 60px;
|
||||
@@ -1148,4 +1149,8 @@
|
||||
|
||||
.width-100{
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.width-body-bottom{
|
||||
width: 1000px !important;
|
||||
}
|
||||
@@ -792,13 +792,20 @@ sans-serif;
|
||||
top: calc(~'50%' - @modal-load-program-height /2);
|
||||
left: calc(~'50%' - @modal-load-program-width /2);
|
||||
background-color: @color-background-white;
|
||||
|
||||
header{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 24px;
|
||||
height: 81px;
|
||||
font-size: 20px;
|
||||
color: @color-darkish-blue;
|
||||
}
|
||||
.modal-load-program-header{
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
font-size: 20px;
|
||||
color: @color-darkish-blue;
|
||||
// .title{
|
||||
// height: 81px;
|
||||
// display: flex;
|
||||
@@ -839,7 +846,7 @@ sans-serif;
|
||||
}
|
||||
}
|
||||
.modal-load-program-body{
|
||||
height: calc(~'100% - 240px');
|
||||
height: 631px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
|
||||
@@ -103,14 +103,14 @@
|
||||
width:232px;
|
||||
margin-right:8px;
|
||||
.setting-top{
|
||||
height: 488px;
|
||||
height: 558px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
margin-top: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.setting-bottom{
|
||||
height: 352px;
|
||||
height: 353px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
margin-top: 8px;
|
||||
|
||||
@@ -740,13 +740,19 @@
|
||||
left: calc(50% - 904px);
|
||||
background-color: #fff;
|
||||
}
|
||||
.modal.modal-load-program header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 24px;
|
||||
height: 81px;
|
||||
font-size: 20px;
|
||||
color: #002680;
|
||||
}
|
||||
.modal.modal-load-program .modal-load-program-header {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
font-size: 20px;
|
||||
color: #002680;
|
||||
}
|
||||
.modal.modal-load-program .modal-load-program-header .box-search {
|
||||
width: 100%;
|
||||
@@ -783,7 +789,7 @@
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
.modal.modal-load-program .modal-load-program-body {
|
||||
height: calc(100% - 240px);
|
||||
height: 631px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
@@ -3959,9 +3965,10 @@ footer .container button.big:before {
|
||||
}
|
||||
.softkeys-prefered {
|
||||
width: 480px;
|
||||
height: 64px;
|
||||
min-height: 64px;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
align-items: center;
|
||||
background-color: #dfdfdf;
|
||||
position: relative;
|
||||
}
|
||||
@@ -4062,7 +4069,7 @@ footer .container button.big:before {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
.card-axes-production {
|
||||
height: 488px;
|
||||
height: 558px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
@@ -4072,7 +4079,7 @@ footer .container button.big:before {
|
||||
}
|
||||
.card-axes-production .first-box-axes,
|
||||
.card-axes-production .second-box-axes {
|
||||
height: 231px;
|
||||
height: 264px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
@@ -4126,7 +4133,7 @@ footer .container button.big:before {
|
||||
}
|
||||
.card-axes-production .second-box-axes {
|
||||
width: 100%;
|
||||
height: 257px;
|
||||
height: 294px;
|
||||
}
|
||||
.card-axes-production .second-box-axes .tabs {
|
||||
height: 30px;
|
||||
@@ -4554,7 +4561,7 @@ footer .container button.big:before {
|
||||
top: 80px;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
left: -90px;
|
||||
left: calc(50% - 193px);
|
||||
justify-content: center;
|
||||
z-index: 100;
|
||||
transform: translateZ(0);
|
||||
@@ -4592,6 +4599,7 @@ footer .container button.big:before {
|
||||
background-color: #dfdfdf;
|
||||
position: relative;
|
||||
padding: 7px;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.menu-container .menu button {
|
||||
background-image: linear-gradient(to bottom, #1756ad, #002680);
|
||||
@@ -4629,6 +4637,9 @@ footer .container button.big:before {
|
||||
.width-100 {
|
||||
width: 100% !important;
|
||||
}
|
||||
.width-body-bottom {
|
||||
width: 1000px !important;
|
||||
}
|
||||
@keyframes selectedanimation {
|
||||
0% {
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
@@ -10209,14 +10220,14 @@ footer .container button.big:before {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.production-container .production-box .production-left-box .box-left .settings .setting-top {
|
||||
height: 488px;
|
||||
height: 558px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
margin-top: 16px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.production-container .production-box .production-left-box .box-left .settings .setting-bottom {
|
||||
height: 352px;
|
||||
height: 353px;
|
||||
width: 232px;
|
||||
border-radius: 2px;
|
||||
margin-top: 8px;
|
||||
|
||||
@@ -70,10 +70,10 @@
|
||||
{{'production_softkeys_prefered_header_title' | localize("Softkeys preferite")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-softkeys-prefered-body">
|
||||
<div class="box-softkeys-prefered-body scrollable" ref="scrollable">
|
||||
<softkeys-prefered type="button"></softkeys-prefered>
|
||||
<softkeys-prefered type="boolean"></softkeys-prefered>
|
||||
<softkeys-prefered type="pushbutton"></softkeys-prefered>
|
||||
<softkeys-prefered :vertical-index="selectedPositionTop" @position="test($event)" type="pushbutton"></softkeys-prefered>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -91,12 +91,14 @@ export default {
|
||||
components:{
|
||||
softkeysPrefered, headProduction, cardAxesProduction, processSelectionMaintenance, cardProductionCms
|
||||
},
|
||||
props:["sk"],
|
||||
data: function(){
|
||||
return {
|
||||
activeCms: true,
|
||||
activeCnc: false,
|
||||
headsR: [],
|
||||
selectedHead: null
|
||||
selectedHead: null,
|
||||
selectedPositionTop: 0
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
@@ -167,6 +169,10 @@ export default {
|
||||
if (r) return r.value;
|
||||
return false;
|
||||
},
|
||||
test(arg1){
|
||||
debugger
|
||||
this.selectedPositionTop = (arg1.offsetTop - (this.$refs.scrollable).scrollTop - (this.$refs.scrollable).offsetTop - (this.$refs.scrollable).offsetHeight + 134);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -6,7 +6,7 @@
|
||||
<div class="variable">
|
||||
{{a.name}}
|
||||
</div>
|
||||
<div class="number" :class="{'width-number': axes.length > 5}">
|
||||
<div class="number" :class="{'width-number': axes.length > 6}">
|
||||
{{numberX}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -89,13 +89,115 @@
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
C
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-box" v-if="enableGoto">
|
||||
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
X
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberX}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
Y
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberY}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
Z
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberZ}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
A
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberA}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
B
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
C
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-box" v-if="enableErr">
|
||||
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
X
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberX}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
Y
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberY}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
Z
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberZ}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
A
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberA}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
B
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="axes">
|
||||
<div class="variable">
|
||||
C
|
||||
</div>
|
||||
<div class="number">
|
||||
{{numberB}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<div class="card-job-production-body-top">
|
||||
<img src="../../../../assets/images/job_poduction_image.png">
|
||||
</div>
|
||||
<div class="card-job-production-body-bottom" :class="{'width-100':noQueue}">
|
||||
<div class="card-job-production-body-bottom" :class="{'width-body-bottom':noQueue}">
|
||||
<div class="tabs">
|
||||
<button class="tab" :class="{'active': enableIsoLines}" @click="selectTab('IsoLines')">Linee ISO</button>
|
||||
<button class="tab" :class="{'active': enableFileSections}" @click="selectTab('FileSections')">Sezioni File</button>
|
||||
|
||||
@@ -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" 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)">
|
||||
<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>
|
||||
|
||||
@@ -124,6 +124,9 @@ export default {
|
||||
return this.subkeys[value];
|
||||
},
|
||||
toggleMenu() {
|
||||
debugger
|
||||
this.$emit("click");
|
||||
this.$emit("position", this.$el);
|
||||
if(this.menuOpened){
|
||||
this.menuOpened = false;
|
||||
}
|
||||
|
||||
@@ -61,8 +61,8 @@
|
||||
</template>
|
||||
<script>
|
||||
import Modal from "src/modules/base-components/modal.vue";
|
||||
// import { ModalHelper } from "../modules/base-components/ModalHelper.ts";
|
||||
// import { Factory, MessageService } from '../_base';
|
||||
import { ModalHelper } from "src/modules/base-components/ModalHelper.ts";
|
||||
import { Factory, MessageService } from '../../_base';
|
||||
// import { MaintenanceService } from "../services/maintenanceService";
|
||||
// import { store } from "src/store";
|
||||
// import { maintenanceActions } from "../store/maintenance.store";
|
||||
@@ -83,6 +83,10 @@ export default {
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
close() {
|
||||
Factory.Get(MessageService).deleteChannel("esc_pressed");
|
||||
ModalHelper.HideModal();
|
||||
},
|
||||
selectElementSecond(){
|
||||
this.enableSecondColumn = true;
|
||||
this.selectedFolder = {};
|
||||
|
||||
Reference in New Issue
Block a user