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

graphics production

Browse Source
This commit is contained in:
Alessandro Francia
2018-07-02 12:26:11 +02:00
parent 8a1b866c7d
commit 7db3fb3f97
6 changed files with 118 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/card.less
+46 -6
View File
@@ -845,6 +845,7 @@
border-radius: 2px;
box-shadow: 0 1px 2px 0 @color-black-40;
display: flex;
flex-flow: column;
.tabs{
height: 64px;
width:100%;
@@ -870,12 +871,51 @@
.tab:last-child{
border: none;
}
.content-box{
height: calc(~'100% - 30px');
background-color: red;
width: 100%;
display: flex;
}
}
.content-box{
height: calc(~'100% - 64px');
width: 100%;
display: flex;
flex-flow: column;
.row{
width: 464px;
height: 32px;
display: flex;
align-items: center;
color: @color-greyish-brown;
line-height: 1.78px;
text-align: justify;
cursor: pointer;
label{
cursor: pointer;
font-size: 18px;
margin-left: 24px;
}
}
.row:nth-child(odd){
background-color: @color-clear-blue-30;
}
.row:nth-child(even){
background-color: @color-white4;
}
.row:first-child{
margin-top: 16px;
}
.row.selected{
.triangle{
margin-left: 16px;
width: 0;
height: 0;
border-top: 6px solid transparent;
border-left: 8px solid @color-white;
border-bottom: 6px solid transparent;
}
background-color: @color-clear-blue-75;
color: @color-white;
label{
margin: 12px;
}
}
}
}
}
Step/wwwroot/assets/styles/base/colors.less
+2
View File
@@ -32,6 +32,8 @@
@color-darkish-blue: #002680;
@color-darkish-blue-two: #004990;
@color-clear-blue: #1791ff;
@color-clear-blue-30: rgba(23,145,255,0.3);
@color-clear-blue-75: rgba(23,145,255,0.75);
@color-perrywinkle: #8eb5e2;
@color-white: #fff;
@color-input-light: #4b4b4b;
Step/wwwroot/assets/styles/base/production.less
+4
View File
@@ -185,6 +185,10 @@
font-weight: 600;
cursor: default;
}
&.error{
color: @color-white;
background-color: @color-scarlet;
}
}
}
Step/wwwroot/assets/styles/style.css
+47 -3
View File
@@ -4125,6 +4125,7 @@ footer .container button.big:before {
border-radius: 2px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
display: flex;
flex-flow: column;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .tabs {
height: 64px;
@@ -4152,11 +4153,50 @@ footer .container button.big:before {
.card-job-production .card-job-production-body .card-job-production-body-bottom .tabs .tab:last-child {
border: none;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .tabs .content-box {
height: calc(100% - 30px);
background-color: red;
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box {
height: calc(100% - 64px);
width: 100%;
display: flex;
flex-flow: column;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row {
width: 464px;
height: 32px;
display: flex;
align-items: center;
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;
}
.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);
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row:nth-child(even) {
background-color: #f3f3f3;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row:first-child {
margin-top: 16px;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row.selected {
background-color: rgba(23, 145, 255, 0.75);
color: #fff;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row.selected .triangle {
margin-left: 16px;
width: 0;
height: 0;
border-top: 6px solid transparent;
border-left: 8px solid #fff;
border-bottom: 6px solid transparent;
}
.card-job-production .card-job-production-body .card-job-production-body-bottom .content-box .row.selected label {
margin: 12px;
}
@keyframes selectedanimation {
0% {
@@ -9812,6 +9852,10 @@ footer .container button.big:before {
font-weight: 600;
cursor: default;
}
.process-selection-maintenance .process.error {
color: #fff;
background-color: #d0021b;
}
.create-queue-container {
height: 100%;
width: 100%;
Step/wwwroot/src/modules/base-components/cards/card-job-production.vue
+18 -3
View File
@@ -1,5 +1,5 @@
<template>
<!-- <div class="test-container"> -->
<div class="test-container">
<div class="card-job-production">
<div class="card-job-production-header">
<div class="title">
@@ -21,19 +21,31 @@
<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="triangle"></div><label>Lorem ipsum dolor sit amet, consectetur.</label>
</div>
<div class="row" :class="{selected: rowSelected == '2'}" @click="selectRow('2')">
<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="triangle"></div><label>Magna aliqua ut enim ad minim veniam.</label>
</div>
</div>
<div class="content-box" v-if="enableFileSections">
</div>
</div>
</div>
</div>
<!-- </div> -->
</div>
</template>
<script>
export default {
data: function(){
return{
enableIsoLines: true,
enableFileSections: false
enableFileSections: false,
rowSelected: ""
}
},
methods:{
@@ -50,6 +62,9 @@ export default {
this.enableIsoLines = true;
this.enableFileSections = false;
}
},
selectRow(row){
this.rowSelected = row;
}
}
}
Step/wwwroot/src/modules/base-components/cards/process-selection-maintenance.vue
+1 -1
View File
@@ -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}" @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" :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>