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

ui page

Browse Source
This commit is contained in:
Alessandro
2019-01-15 11:10:48 +01:00
parent 2998a7851a
commit a255f70da7
4 changed files with 135 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/alarms.less
+91 -95
View File
@@ -740,108 +740,104 @@
table-layout: fixed;
width: 100%;
border-collapse: collapse;
}
thead{
}
thead{
border-bottom: solid 2px @color-label-grey;
}
thead tr{
}
thead tr{
width: 1225px;
}
thead tr th{
height: 46px;
}
tr:nth-child(even) {background: #dddddd}
tr:nth-child(odd) {background: #FFF}
}
thead tr th{
height: 46px;
}
tr:nth-child(even) {background: #dddddd}
tr:nth-child(odd) {background: #FFF}
th:nth-child(1), td:nth-child(1){
width:50px;
max-width: 50px;
text-align: left;
padding-left: 5px;
}
th:nth-child(1), td:nth-child(1){
width:50px;
max-width: 50px;
text-align: left;
padding-left: 5px;
}
th:nth-child(2), td:nth-child(2){
width:50px;
max-width:50px;
}
th:nth-child(3), td:nth-child(3){
width:300px;
max-width:300px;
}
th:nth-child(4), td:nth-child(4){
width:300px;
max-width:300px;
}
th:nth-child(5),td:nth-child(5){
width:100px;
max-width:100px;
}
th:nth-child(6), td:nth-child(6){
width:100px;
max-width: 100px;
}
th, td{
overflow: hidden;
div{
overflow: hidden;
th:nth-child(2), td:nth-child(2){
width:50px;
max-width:50px;
}
th:nth-child(3), td:nth-child(3){
width:300px;
max-width:300px;
}
th:nth-child(4), td:nth-child(4){
width:300px;
max-width:300px;
}
th:nth-child(5),td:nth-child(5){
width:100px;
max-width:100px;
}
th:nth-child(6), td:nth-child(6){
width:100px;
max-width: 100px;
}
th, td{
overflow: hidden;
div{
overflow: hidden;
max-height: 64px;
}
}
}
tbody{
display: block;
height: 597px;
width: 1241px;
tr{
cursor: pointer;
height: 64px;
padding: 10px;
td{
text-align: center;
}
tbody{
display: block;
height: 631px;
width: 1241px;
tr{
cursor: pointer;
height: 64px;
padding: 10px;
td{
text-align: center;
}
&.selected{
background-color: rgba(23, 145, 255, 0.75);
color: @color-white;
}
}
&.selected{
background-color: rgba(23, 145, 255, 0.75);
color: @color-white;
}
tr{
width: 100%;
display: table;
}
// thead{
// width: 1241px;
// }
// tbody{
// width: 1241px;
// min-height: 680px;
// }
// tr{
// min-height: 64px;
// }
// td, th {
// text-align: center;
// // padding: 8px;
// height: 64px;
// font-size: 14px;
// line-height: 1.43;
// color: @color-greyish-brown;
// }
// td{
// min-height: 64px;
// }
// thead tr th{
// font-size: 14px;
// line-height: 1.43;
// font-weight: 600;
// color: @color-greyish-brown;
// background-color: @color-background-white;
// }
// tr:nth-child(even) {
// background-color: @color-white4;
// }
// tr:nth-child(odd){
// background-color: @color-clear-blue-30;
// }
}
}
tr{
width: 100%;
display: table;
}
.pagination {
display: inline-block;
}
.pagination button {
padding: 0;
border: none;
background: none;
color: @color-black-40;
float: left;
padding: 8px 16px;
text-decoration: none;
border: 1px solid @color-whitegrey;
margin: 0 4px;
}
.pagination button:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.pagination button:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.pagination button.active {
background-color: @color-warm-grey;
color: @color-white;
}
.pagination button:hover:not(.active) {background-color: @color-whitegrey;}
}
}
Step/wwwroot/assets/styles/style.css
+30 -1
View File
@@ -4308,7 +4308,7 @@ footer .container button.big:before {
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table tbody {
display: block;
height: 631px;
height: 597px;
width: 1241px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table tbody tr {
@@ -4327,6 +4327,35 @@ footer .container button.big:before {
width: 100%;
display: table;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination {
display: inline-block;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination button {
padding: 0;
border: none;
background: none;
color: rgba(0, 0, 0, 0.4);
float: left;
padding: 8px 16px;
text-decoration: none;
border: 1px solid #dddddd;
margin: 0 4px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination button:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination button:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination button.active {
background-color: #878787;
color: #fff;
}
.alarm-history-container .alarm-history-body .alarm-history-body-left .alarm-history-table .pagination button:hover:not(.active) {
background-color: #dddddd;
}
.alarm-history-container .alarm-history-body .alarm-disable-box-right {
width: 496px;
height: 760px;
Step/wwwroot/src/app_modules/alarms/components/alarm-history.ts
+7
View File
@@ -68,6 +68,7 @@ export default class AlarmHistory extends Vue {
newAttach: any = null;
newNote: any = {};
enableModifyNote = true;
selectedPage = 1;
// get filteredAttaches() {
// return this.attaches.filter((v, idx) => idx < this.limitationList);
// }
@@ -108,6 +109,8 @@ export default class AlarmHistory extends Vue {
})
this.data = await alarmsService.getAlarms(this.filter.title, arraySourceFilter, arrayUserFilter, from, to, 0, 100);
this.paginationData = await alarmsService.getAlarmsData();
console.log(this.paginationData);
}
async mounted() {
@@ -115,6 +118,7 @@ export default class AlarmHistory extends Vue {
this.users = await loginService.getAllUsers();
this.users.unshift({id: -1, username: this.$options.filters.localize("alarm_history_users_not_user", "Nessun utente")});
this.paginationData = await alarmsService.getAlarmsData();
console.log(this.paginationData);
}
async onChange(e) {
@@ -283,4 +287,7 @@ export default class AlarmHistory extends Vue {
else
$('.checkboxesU').removeClass('checkboxesViewUser');
}
public selectPage(page) {
this.selectedPage = page;
}
}
Step/wwwroot/src/app_modules/alarms/components/alarm-history.vue
+7
View File
@@ -122,6 +122,13 @@
</tr>
</tbody>
</table>
<div class="pagination">
<button><i class="fa fa-angle-double-left"></i></button>
<button class="page" :class="{active: selectedPage == 1}" @click="selectPage(1)">1</button>
<button class="page" :class="{active: selectedPage == 2}" @click="selectPage(2)">2</button>
<button class="page" :class="{active: selectedPage == 3}" @click="selectPage(3)">3</button>
<button><i class="fa fa-angle-double-right"></i></button>
</div>
</div>
</div>
<div class="alarm-history-body-right">