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

production table

Browse Source
This commit is contained in:
Alessandro
2019-03-06 17:17:46 +01:00
parent 92b4471655
commit bbc940e60f
5 changed files with 157 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/card.less
+69 -30
View File
@@ -2003,6 +2003,7 @@
table-layout: fixed;
width: 100%;
border-collapse: collapse;
border: solid 1px @color-label-grey;
}
thead{
border-bottom: solid 2px @color-label-grey;
@@ -2111,7 +2112,7 @@
}
tbody{
display: block;
height: 598px;
height: 560px;
width: 1431px;
tr{
// cursor: pointer;
@@ -2128,6 +2129,9 @@
&.red{
color: @color-scarlet;
}
&.black{
color: black;
}
}
td:last-child{
width: 16px;
@@ -2140,38 +2144,73 @@
}
}
}
.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;
}
tfoot {
width: 100%;
bottom: 0;
}
tr{
width: 100%;
display: table;
}
tfoot tr td{
height: 64px;
width: 100%;
font-size: 18px;
color: @color-darkish-blue;
position: relative;
bottom:0;
border-top: solid 2px @color-silver;
td{
padding: 0;
text-align: center;
}
div.group-label-button{
text-align: center;
margin: 8px 0 8px 0;
button{
width: 60px;
padding: 0px;
}
.freespace{
width: 60px;
display: inline-block;
margin: 0 8px;
}
}
}
// .pagination {
// display: inline-block;
// }
.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 {
// 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:hover:not(.active) {
background-color: @color-whitegrey;
}
// .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;
// }
.body-left-center-left{
width: 360px;
height: 616px;
Step/wwwroot/assets/styles/style.css
+33 -24
View File
@@ -8426,6 +8426,7 @@ footer .container button.big:before {
table-layout: fixed;
width: 100%;
border-collapse: collapse;
border: solid 1px #979797;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container thead {
border-bottom: solid 2px #979797;
@@ -8470,7 +8471,7 @@ footer .container button.big:before {
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tbody {
display: block;
height: 598px;
height: 560px;
width: 1431px;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tbody tr {
@@ -8489,6 +8490,9 @@ footer .container button.big:before {
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tbody tr td.red {
color: #d0021b;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tbody tr td.black {
color: black;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tbody tr td:last-child {
width: 16px;
display: flex;
@@ -8498,34 +8502,39 @@ footer .container button.big:before {
color: #fff;
font-weight: 600;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination {
display: inline-block;
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot {
width: 100%;
bottom: 0;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination button {
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tr {
width: 100%;
display: table;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot tr td {
height: 64px;
width: 100%;
font-size: 18px;
color: #002680;
position: relative;
bottom: 0;
border-top: solid 2px #bbbcbc;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot tr td td {
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;
text-align: center;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination button:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot tr td div.group-label-button {
text-align: center;
margin: 8px 0 8px 0;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination button:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot tr td div.group-label-button button {
width: 60px;
padding: 0px;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination button.active {
background-color: #878787;
color: #fff;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .pagination button:hover:not(.active) {
background-color: #dddddd;
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container tfoot tr td div.group-label-button .freespace {
width: 60px;
display: inline-block;
margin: 0 8px;
}
.card-report-production .reports-box-body-left .body-left-center .body-left-center-container .body-left-center-left {
width: 360px;
Step/wwwroot/src/app_modules/reports/components/card-report-production.ts
+33 -9
View File
@@ -60,7 +60,8 @@ export default class CardReportProduction extends Vue {
users: Array<any> = [];
ctx: any = null;
selectedPage = 1;
paginationData: { firstDate: any, pages: number } = {firstDate: new Date(), pages: 6};
visiblePages = 3;
paginationData: { firstDate: any, pages: number } = {firstDate: new Date(), pages: 0};
// ctx: any = document.getElementById("myBarChart");
// dataPieces: server.reportData = (this.$store.getters as ReportGetters).getReportData();
@@ -88,6 +89,21 @@ export default class CardReportProduction extends Vue {
return { min: min, max: max, count: (max - min) }
}
get freeSpaseMinus() {
if(this.selectedPage - (this.visiblePages + 1) < 0)
return ((this.selectedPage - (this.visiblePages + 1)) * (-1));
return 0;
}
get freeSpasePlus() {
if(!this.paginationData || !this.paginationData.pages)
return 0;
if(this.paginationData.pages - this.selectedPage <= this.visiblePages)
return (this.visiblePages - (this.paginationData.pages - this.selectedPage))
return 0;
}
get currentUser() {
return this.$store.state.currentUser;
}
@@ -100,7 +116,7 @@ export default class CardReportProduction extends Vue {
@Watch("filter", { deep: true })
async filterChanged(n, o) {
let result = await awaiter(reportService.ProgramsReport(this.filter.nameProgram, this.filter.interval));
let result = await awaiter(reportService.ProgramsReport(9,this.selectedPage,this.filter.nameProgram, this.filter.interval));
this.paginationData.pages = result.pages;
}
@@ -111,7 +127,8 @@ export default class CardReportProduction 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.filter.multiUser.push(this.currentUser.username);
await reportService.ProgramsReport(this.filter.nameProgram,this.filter.interval);
let result = await awaiter(reportService.ProgramsReport(9,this.selectedPage,this.filter.nameProgram, this.filter.interval));
this.paginationData.pages = result.pages;
this.ctx = this.$refs.bar;
// this.buildChart();
this.buildGage();
@@ -187,13 +204,20 @@ export default class CardReportProduction extends Vue {
}
let myBarChart = new Chart(this.ctx, {
type: 'bar',
data: {labels: ["January", "February", "March", "April", "May", "June", "July", "August"],
datasets: [
{
data: [65, 59, 80, 81, 56, 55, 40, 70]
}
]},
data: [{x:'2016-12-25', y:20}, {x:'2016-12-26', y:10}],
options: options
});
}
colorDeviation(deviation){
if(deviation.startsWith("+")){
return "red";
}
else if(deviation.startsWith("-")){
return "green";
}
else{
return "grey";
}
}
}
Step/wwwroot/src/app_modules/reports/components/card-report-production.vue
+18 -3
View File
@@ -78,18 +78,33 @@
<td :style="{width:(100/visibleColumns.length)+'%'}" v-if="isVisible('EffectiveTime')">{{p.actualT}}</td>
<td :style="{width:(100/visibleColumns.length)+'%'}" v-if="isVisible('AverageTime')">{{p.averageT}}</td>
<td :style="{width:(100/visibleColumns.length)+'%'}" v-if="isVisible('TheoreticalTime')">{{p.theoricT}}</td>
<td :style="{width:(100/visibleColumns.length)+'%'}" v-if="isVisible('Deviation')" :class="{'green': false, 'red': true}">{{p.deviation}}</td>
<td :style="{width:(100/visibleColumns.length)+'%'}" v-if="isVisible('Deviation')" :class="{'green': colorDeviation(p.deviation) == 'green', 'red': colorDeviation(p.deviation) == 'red', 'black': colorDeviation(p.deviation) == 'black'}">{{p.deviation}}</td>
<td></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<div class="group-label-button">
<button class="btn" @click="selectPage(paginator.min)"><i class="fa fa-angle-double-left"></i></button>
<div class="freespace" v-for="(p, idx) in freeSpaseMinus" :key="'fakeMinus' + idx" >&nbsp;</div>
<button class="btn" :class="{'btn-success': selectedPage == paginator.min + p}"
v-for="(p, idx) in paginator.count" :key="'page' + idx"
@click="selectPage(paginator.min + p)">{{paginator.min + p}}</button>
<div class="freespace" v-for="(p, idx) in freeSpasePlus" :key="'fakePlus' + idx" >&nbsp;</div>
<button class="btn" @click="selectPage(paginator.max)"><i class="fa fa-angle-double-right"></i></button>
</div>
</td>
</tr>
</tfoot>
</table>
<div class="pagination">
<!-- <div class="pagination">
<button @click="selectPage(selectedPage-1)"><i class="fa fa-angle-double-left"></i></button>
<button class="page" :class="{active: selectedPage == paginator.min + p}"
v-for="(p, idx) in paginator.count" :key="'page' + idx"
@click="selectPage(paginator.min + p)">{{paginator.min + p}}</button>
<button @click="selectPage(selectedPage+1)"><i class="fa fa-angle-double-right"></i></button>
</div>
</div> -->
</div>
</div>
<div class="body-left-center" v-if="selectDiagram">
Step/wwwroot/src/services/reportService.ts
+4 -2
View File
@@ -30,15 +30,17 @@ export class ReportService extends baseRestService {
return await this.Post<any>('/api/report/timeLine',filter,true);
}
async ProgramsReport(name: string, filterInterval: Array<Date>): Promise<any> {
async ProgramsReport(pageSize: number, page: number, name: string, filterInterval: Array<Date>): Promise<any> {
let filter = {
pageSize: pageSize,
page: page,
name: name,
startDate: filterInterval[0],
endDate: filterInterval[1]
}
let result = await this.Post<any>('/api/report/programs', filter, true);
reportActions.updateReportTableProduction(store,result.occurrences);
return result.occurrences;
return result;
}