Merge remote-tracking branch 'CMS/feature/sottocofano' into feature/sottocofano
This commit is contained in:
-4
@@ -1,9 +1,5 @@
|
||||
@import "../../../../variable.less";
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.log-assi-table {
|
||||
width: 1384px;
|
||||
height: 886px;
|
||||
|
||||
+1
-3
@@ -1,7 +1,5 @@
|
||||
@import "../../../variable.less";
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
.column-page-header {
|
||||
width: 672px;
|
||||
|
||||
+18
-2
@@ -1,9 +1,25 @@
|
||||
@import "../../../variable.less";
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
|
||||
.button-details {
|
||||
width: 93px;
|
||||
padding: 14px 0px 13px 0px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
background-image: linear-gradient(to bottom, #818a8f 0%, #42494e 98%);
|
||||
cursor: pointer;
|
||||
> label {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.log-ciclo-automatico-table {
|
||||
tbody tr:nth-child(odd) {
|
||||
background-color: @fill-under-grey-3-2;
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="main-container">
|
||||
<div class="column-page">
|
||||
<div class="column-page-one-column">
|
||||
<LogCicloAutomaticoTable></LogCicloAutomaticoTable>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+21
-177
@@ -1,186 +1,30 @@
|
||||
@import "../../../../variable.less";
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
.date {
|
||||
width: 212px;
|
||||
}
|
||||
|
||||
.log-ciclo-automatico-table {
|
||||
width: 1384px;
|
||||
height: 886px;
|
||||
margin: 20px 20px 0 20px;
|
||||
thead {
|
||||
height: 34px;
|
||||
opacity: 0.5;
|
||||
background-color: @fill-under-grey-1-2;
|
||||
}
|
||||
th {
|
||||
display: inline-block;
|
||||
}
|
||||
tbody {
|
||||
overflow-y: scroll;
|
||||
height: 752px;
|
||||
tr {
|
||||
display: inline-block;
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
float: left;
|
||||
&-inner {
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
margin: 34px 26px 0 0;
|
||||
padding: 0 2px 0 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.date-ciclo {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 149px 12px 9px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
color: @white;
|
||||
text-align: left !important;
|
||||
float: left;
|
||||
&-inner {
|
||||
width: 177px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 0px 10px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
text-align: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.class-ciclo {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 36px 12px 0px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 35px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 0px 47px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.recipe-ciclo {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 108px 12px 0px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 121px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 0px 51px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.message-ciclo {
|
||||
width: 114px;
|
||||
height: 12px;
|
||||
margin: 10px 0px 12px 0px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
text-align: left !important;
|
||||
color: @white;
|
||||
&-inner {
|
||||
.message {
|
||||
width: 751px;
|
||||
height: 64px;
|
||||
margin: 18px 0px 0px 50px;
|
||||
}
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
text-align: initial;
|
||||
color: @very-light-pink;
|
||||
th,
|
||||
td {
|
||||
&.ciclo-date {
|
||||
width: 212px;
|
||||
max-width: 212px;
|
||||
}
|
||||
&.ciclo-message {
|
||||
width: 751px;
|
||||
max-width: 751px;
|
||||
}
|
||||
&.ciclo-recipe {
|
||||
width: 171px;
|
||||
max-width: 171px;
|
||||
}
|
||||
}
|
||||
|
||||
.button-details {
|
||||
width: 99px;
|
||||
float: right;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 14px 0px 13px 0px;
|
||||
margin: 8px 8px 8px 8px;
|
||||
object-fit: contain;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
background-image: linear-gradient(to bottom, #818a8f 0%, #42494e 98%);
|
||||
cursor: pointer;
|
||||
&-label {
|
||||
width: 62px;
|
||||
height: 21px;
|
||||
object-fit: contain;
|
||||
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+20
-31
@@ -1,40 +1,29 @@
|
||||
<template>
|
||||
<div>
|
||||
<table class="log-ciclo-automatico-table">
|
||||
<div class="one-column-table-container scrollable">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="date-ciclo">Date</th>
|
||||
<th class="class-ciclo">Class</th>
|
||||
<th class="recipe-ciclo">Recipe</th>
|
||||
<th class="message-ciclo">Message</th>
|
||||
<th class="ciclo-date">Date</th>
|
||||
<th>Class</th>
|
||||
<th class="ciclo-recipe">Recipe</th>
|
||||
<th class="ciclo-message">Message</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, i) of rowData" :key="i" class="tr-inner">
|
||||
<td>
|
||||
<span class="date-ciclo-inner">
|
||||
{{ item.date }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="class-ciclo-inner">
|
||||
{{ item.class }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="recipe-ciclo-inner">
|
||||
{{ item.recipe }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="message-ciclo-inner">
|
||||
{{ item.message }}
|
||||
</span>
|
||||
<span class="button-details" @click="goToDetails()">
|
||||
<span class="button-details-label">Details</span>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<template v-for="(item, idx) in rowData">
|
||||
<tr :key="`c-${idx}`">
|
||||
<td>{{ item.date }}</td>
|
||||
<td>{{ item.class }}</td>
|
||||
<td>{{ item.recipe }}</td>
|
||||
<td>{{ item.message }}</td>
|
||||
<td>
|
||||
<span class="button-details">
|
||||
<label>Details</label>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="main-container">
|
||||
<div class="column-page">
|
||||
<div class="column-page-one-column">
|
||||
<LogMisurazioniTable></LogMisurazioniTable>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+14
-154
@@ -1,163 +1,23 @@
|
||||
@import "../../../../variable.less";
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.log-misurazioni-table {
|
||||
width: 1384px;
|
||||
height: 886px;
|
||||
margin: 20px 20px 0 20px;
|
||||
thead {
|
||||
height: 34px;
|
||||
opacity: 0.5;
|
||||
background-color: @fill-under-grey-1-2;
|
||||
th,
|
||||
td {
|
||||
&.misurazioni-value {
|
||||
width: 322px;
|
||||
max-width: 322px;
|
||||
}
|
||||
th {
|
||||
display: inline-block;
|
||||
&.misurazioni-recipe {
|
||||
width: 539px;
|
||||
max-width: 539px;
|
||||
}
|
||||
tbody tr:nth-child(odd) {
|
||||
background-color: @fill-under-grey-3-2;
|
||||
&.misurazioni-date {
|
||||
width: 313px;
|
||||
max-width: 313px;
|
||||
}
|
||||
tbody tr:nth-child(even) {
|
||||
background-color: @fill-under-grey-1-2;
|
||||
}
|
||||
tbody {
|
||||
overflow-y: scroll;
|
||||
height: 752px;
|
||||
tr {
|
||||
display: inline-block;
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
float: left;
|
||||
&-inner {
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
margin: 34px 26px 0 0;
|
||||
padding: 0 2px 0 10px;
|
||||
}
|
||||
}
|
||||
&.misurazioni-type {
|
||||
width: 187px;
|
||||
max-width:187px;
|
||||
}
|
||||
}
|
||||
|
||||
.date-misurazioni {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0px 12px 9px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
color: @white;
|
||||
text-align: left !important;
|
||||
float: left;
|
||||
&-inner {
|
||||
width: 164px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 10px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: left !important;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.recipe-misurazioni {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0px 12px 267px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: left;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 121px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 139px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center !important;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.type-misurazioni {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0 12px 448px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: left !important;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 48px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 410px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.value-misurazioni {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 268px 12px 124px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: left !important;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 253px;
|
||||
height: 16px;
|
||||
margin: 24px 69px 24px 142px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
text-align: initial;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
+10
-10
@@ -1,33 +1,33 @@
|
||||
<template>
|
||||
<div>
|
||||
<table class="log-misurazioni-table">
|
||||
<div class="one-column-table-container scrollable">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="date-misurazioni">Date</th>
|
||||
<th class="recipe-misurazioni">Recipe</th>
|
||||
<th class="type-misurazioni">Type</th>
|
||||
<th class="value-misurazioni">Value</th>
|
||||
<th class="misurazioni-date">Date</th>
|
||||
<th class="misurazioni-recipe">Recipe</th>
|
||||
<th class="misurazioni-type">Type</th>
|
||||
<th class="misurazioni-value">Value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, i) of rowData" :key="i" class="tr-inner">
|
||||
<td>
|
||||
<span class="date-misurazioni-inner">
|
||||
<span>
|
||||
{{ item.date }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="recipe-misurazioni-inner">
|
||||
<span>
|
||||
{{ item.recipe }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="type-misurazioni-inner">
|
||||
<span>
|
||||
{{ item.type }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="value-misurazioni-inner">
|
||||
<span>
|
||||
{{ item.value }}
|
||||
</span>
|
||||
</td>
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="main-container">
|
||||
<div class="column-page">
|
||||
<div class="column-page-one-column">
|
||||
<RiscaldiTable></RiscaldiTable>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+32
-229
@@ -1,268 +1,71 @@
|
||||
@import "../../../../variable.less";
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.riscaldi-table {
|
||||
width: 1384px;
|
||||
height: 886px;
|
||||
margin: 20px 20px 0 20px;
|
||||
thead {
|
||||
height: 34px;
|
||||
opacity: 0.5;
|
||||
background-color: @fill-under-grey-1-2;
|
||||
th,
|
||||
td {
|
||||
&.riscaldi-status {
|
||||
width: 435px;
|
||||
max-width: 435px;
|
||||
padding: 0 0 0 38px;
|
||||
}
|
||||
th {
|
||||
display: inline-block;
|
||||
&.riscaldi-set {
|
||||
width: 378px;
|
||||
max-width: 378px;
|
||||
}
|
||||
tbody {
|
||||
overflow-y: scroll;
|
||||
height: 752px;
|
||||
tr:nth-child(odd) {
|
||||
background-color: @fill-under-grey-3-2;
|
||||
}
|
||||
tr {
|
||||
display: inline-block;
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
|
||||
&-inner {
|
||||
width: 1358px;
|
||||
height: 64px;
|
||||
margin: 34px 26px 0 0;
|
||||
padding: 0 2px 0 10px;
|
||||
}
|
||||
}
|
||||
&.riscaldi-cell-id {
|
||||
width: 254px;
|
||||
max-width: 254px;
|
||||
}
|
||||
&.riscaldi-current {
|
||||
width: 308px;
|
||||
max-width: 308px;
|
||||
}
|
||||
}
|
||||
|
||||
.cell-id {
|
||||
height: 16px;
|
||||
margin: 10px 0px 12px 9px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: left;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
&-inner {
|
||||
width: 6px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 10px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.current {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0px 12px 173px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 44px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 216px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.set {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0px 12px 226px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @white;
|
||||
&-inner {
|
||||
width: 21px;
|
||||
height: 16px;
|
||||
margin: 24px 0px 24px 260px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
width: 63px;
|
||||
height: 12px;
|
||||
margin: 10px 0 12px 325px;
|
||||
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: 0.86;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
float: left;
|
||||
color: @white;
|
||||
}
|
||||
|
||||
.button-details {
|
||||
width: 93px;
|
||||
float: right;
|
||||
padding: 14px 0px 13px 0px;
|
||||
margin: 8px 8px 8px 8px;
|
||||
object-fit: contain;
|
||||
.status-buttons {
|
||||
padding: 3px 16px;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
background-image: linear-gradient(to bottom, #818a8f 0%, #42494e 98%);
|
||||
cursor: pointer;
|
||||
&-label {
|
||||
width: 62px;
|
||||
height: 21px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
label {
|
||||
margin: 3px 16px 3px 16px;
|
||||
}
|
||||
|
||||
.ok-button {
|
||||
width: 55px;
|
||||
height: 25px;
|
||||
margin: 20px 263px 19px 336px;
|
||||
padding: 3px 16px;
|
||||
border-radius: 2px;
|
||||
background-color: @booger;
|
||||
&-label {
|
||||
width: 23px;
|
||||
height: 19px;
|
||||
> label {
|
||||
text-shadow: 0 0 4px @black-50;
|
||||
margin: 3px 16px 3px 16px;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.broken-button {
|
||||
width: 87px;
|
||||
height: 25px;
|
||||
margin: 20px 247px 19px 320px;
|
||||
padding: 3px 16px;
|
||||
border-radius: 2px;
|
||||
background-color: @scarlet;
|
||||
&-label {
|
||||
width: 55px;
|
||||
height: 19px;
|
||||
margin: 3px 16px 3px 16px;
|
||||
text-shadow: 0 0 4px @black-50;
|
||||
|
||||
> label {
|
||||
text-shadow: 0 0 4px rgb(0 0 0 / 50%);
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.error-button {
|
||||
width: 96px;
|
||||
height: 25px;
|
||||
margin: 20px 243px 19px 315px;
|
||||
padding: 3px 16px;
|
||||
border-radius: 2px;
|
||||
background-color: @scarlet;
|
||||
&-label {
|
||||
width: 64px;
|
||||
height: 19px;
|
||||
margin: 3px 16px 3px 16px;
|
||||
> label {
|
||||
text-shadow: 0 0 4px @black-50;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.warning-button {
|
||||
width: 96px;
|
||||
height: 25px;
|
||||
margin: 20px 243px 19px 315px;
|
||||
padding: 3px 16px;
|
||||
border-radius: 2px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background-color: @macaroni-and-cheese;
|
||||
&-label {
|
||||
width: 79px;
|
||||
height: 19px;
|
||||
> label {
|
||||
margin: 3px 0px 3px 0px;
|
||||
text-shadow: 0 0 4px @black-50;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
text-align: center;
|
||||
color: @very-light-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.status-container {
|
||||
width: 126px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
+45
-26
@@ -1,50 +1,69 @@
|
||||
<template>
|
||||
<div>
|
||||
<table class="riscaldi-table">
|
||||
<div class="one-column-table-container scrollable">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="cell-id">Cell ID</th>
|
||||
<th class="current">Current</th>
|
||||
<th class="set">Set</th>
|
||||
<th class="status">Status</th>
|
||||
<th class="riscaldi-cell-id">Cell ID</th>
|
||||
<th class="riscaldi-current">Current</th>
|
||||
<th class="riscaldi-set">Set</th>
|
||||
<th class="riscaldi-status">Status</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, i) of rowData" :key="i" class="tr-inner">
|
||||
<tr v-for="(item, i) of rowData" :key="i">
|
||||
<td>
|
||||
<span class="cell-id-inner">
|
||||
<span>
|
||||
{{ item.cellId }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="current-inner">
|
||||
<span>
|
||||
{{ item.current }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="set-inner">
|
||||
<span>
|
||||
{{ item.set }}
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="status-inner">
|
||||
<span v-if="item.status === 'ok'" class="ok-button status-ok">
|
||||
<span class="ok-button-label">OK</span>
|
||||
</span>
|
||||
<span v-else-if="item.status === 'broken'" class="broken-button">
|
||||
<span class="broken-button-label">Broken</span>
|
||||
</span>
|
||||
<span v-else-if="item.status === 'error 23'" class="error-button">
|
||||
<span class="error-button-label">Error 23</span>
|
||||
</span>
|
||||
<span v-else-if="item.status === 'error 12'" class="error-button">
|
||||
<span class="error-button-label">Error 12</span>
|
||||
</span>
|
||||
<span class="status-container">
|
||||
<span
|
||||
v-else-if="item.status === 'warning 3'"
|
||||
class="warning-button"
|
||||
v-if="item.status === 'ok'"
|
||||
class="status-buttons ok-button status-ok"
|
||||
>
|
||||
<span class="warning-button-label">Warning 3</span>
|
||||
<label>OK</label>
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span class="status-container">
|
||||
<span
|
||||
v-if="item.status === 'broken'"
|
||||
class="status-buttons broken-button"
|
||||
>
|
||||
<label>Broken</label>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
v-if="item.status === 'error 23'"
|
||||
class="status-buttons error-button"
|
||||
>
|
||||
<label>Error 23</label>
|
||||
</span>
|
||||
<span
|
||||
v-if="item.status === 'error 12'"
|
||||
class="status-buttons error-button"
|
||||
>
|
||||
<label>Error 12</label>
|
||||
</span>
|
||||
<span class="status-container">
|
||||
<span
|
||||
v-if="item.status === 'warning 3'"
|
||||
class="status-buttons warning-button"
|
||||
>
|
||||
<label>Warning 3</label>
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
@click="go('io')"
|
||||
:class="{white: this.value == 'io'}"
|
||||
>{{'i-o' | localize("I/O")}}</div>
|
||||
<!-- <div
|
||||
<div
|
||||
class="rettangle"
|
||||
@click="go('log-ciclo-automatico')"
|
||||
:class="{white: this.value == 'log-ciclo-automatico'}"
|
||||
@@ -15,16 +15,16 @@
|
||||
@click="go('log-misurazioni')"
|
||||
:class="{white: this.value == 'log-misurazioni'}"
|
||||
>{{'log-misurazioni' | localize("Log misurazioni")}}</div>
|
||||
<div
|
||||
<!-- <div
|
||||
class="rettangle"
|
||||
@click="go('assi')"
|
||||
:class="{white: this.value == 'assi'}"
|
||||
>{{'log-assi' | localize('Log assi')}}</div>
|
||||
>{{'log-assi' | localize('Log assi')}}</div> -->
|
||||
<div
|
||||
class="rettangle"
|
||||
@click="go('riscaldi')"
|
||||
:class="{white: this.value == 'riscaldi'}"
|
||||
>{{'riscaldi' | localize("Riscaldi")}}</div>-->
|
||||
>{{'riscaldi' | localize("Riscaldi")}}</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="less">
|
||||
|
||||
@@ -128,6 +128,27 @@
|
||||
grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
|
||||
}
|
||||
|
||||
.column-page-one-column {
|
||||
grid-row: 2;
|
||||
grid-column: 2;
|
||||
width: 1384px;
|
||||
height: 885px;
|
||||
border-top: @white 2px solid;
|
||||
background-color: @fill-under-grey-2-2;
|
||||
display: grid;
|
||||
> table {
|
||||
margin: 20px 0 0 20px
|
||||
}
|
||||
}
|
||||
|
||||
.one-column-table-container {
|
||||
height: 800px;
|
||||
margin: 20px 0 0 20px;
|
||||
> table {
|
||||
width: -webkit-fill-available;
|
||||
}
|
||||
}
|
||||
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user