Skip to content
Snippets Groups Projects
Commit 546b8c8e authored by Alex ORLUC's avatar Alex ORLUC
Browse files

FEAT #46 remove md2 elements

parent c75c238e
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
apps/maarch_entreprise/Views/historyBatch-administration.component.html
+ 60
− 67
View file @ 546b8c8e
<div class="page-header">
<h1>{{lang.administration}} {{lang.historyBatch}} <small>{{data.length}} {{lang.entries}}</small></h1>
<h1>{{lang.administration}} {{lang.historyBatch}}
<small>{{data.length}} {{lang.entries}}</small>
</h1>
</div>
<div *ngIf="loading">
<mat-spinner style="margin:auto;"></mat-spinner>
</div>
<div *ngIf="!loading" class="container-fluid">
<div class="col-md-12">
<table id="usersTable" class="table table-hover table-condensed" [md2Data]="data | dataPipe : 'info' : search | dataPipe : 'user_id' : filterUser | dataPipe : 'event_type' : filterEventType"
#md2="md2DataTable" [sortBy]='event_date' [rowsPerPage]="10">
<thead>
<tr>
<td colspan="5">
<md2-pagination></md2-pagination>
</td>
<td style="text-align:right;">
<md2-datepicker name="mindate" placeholder="{{lang.dataOfMonth}} :" type="month" [(ngModel)]="minDate" #minDateControl="ngModel"
(change)="refreshHistory()">
</md2-datepicker>
<div class="example-container">
<mat-grid-list cols="3" rowHeight="100px">
<mat-grid-tile>
<mat-paginator #paginator [length]="100" [pageSize]="10" [pageSizeOptions]="[10, 25, 50, 100]">
</mat-paginator>
</mat-grid-tile>
<mat-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput (keyup)="applyFilter($event.target.value)" placeholder="{{lang.filterBy}}">
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
<mat-table #table [dataSource]="dataSource" matSort matSortActive="event_date" matSortDirection="desc">
<ng-container matColumnDef="batch_id">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.id}}</mat-header-cell>
<mat-cell *matCellDef="let element">{{element.batch_id}}</mat-cell>
</ng-container>
<ng-container matColumnDef="event_date">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.date}}</mat-header-cell>
<mat-cell *matCellDef="let element">{{element.event_date | date : "dd/MM/y HH:mm"}}</mat-cell>
</ng-container>
<ng-container matColumnDef="total_processed">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.totalProcessed}}</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.total_processed}} </mat-cell>
</ng-container>
<ng-container matColumnDef="total_errors">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.totalErrors}}</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.total_errors}} </mat-cell>
</ng-container>
<ng-container matColumnDef="info">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.description}}</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.info}} </mat-cell>
</ng-container>
<ng-container matColumnDef="module_name">
<mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.module}}</mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.module_name}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
</td>
</tr>
<tr class="filters">
<td colspan="6">
<md2-accordion>
<md2-accordion-tab>
<md2-accordion-header class="text-primary">{{lang.filterBy}} : </md2-accordion-header>
<div class="panel panel-default">
<div class="panel-body">
<div class="col-sm-4">
<mat-form-field>
<input matInput placeholder="{{lang.desc}}" [(ngModel)]="search" />
</mat-form-field>
</div>
<div class="col-sm-4">
<md2-select placeholder="Module cible" [(ngModel)]="filterModule" #filterUsersSelect="ngModel" style="padding:0px;padding-top: 15px;">
<md2-select-header>
<mat-form-field>
<input matInput name="search" type="text" placeholder="Filtre" [(ngModel)]="_search" autocomplete="off" />
</mat-form-field>
</md2-select-header>
<md2-option style="font-style:italic;color:grey;">{{lang.noSelection}}</md2-option>
<md2-option *ngFor="let filter of filterModules | dataPipe : 'module_name' : _search" [value]="filter.module_name">{{filter.module_name}}</md2-option>
</md2-select>
</div>
<div class="col-sm-4">
</div>
</div>
</div>
</md2-accordion-tab>
</md2-accordion>
</td>
</tr>
<tr>
<th md2SortBy="batch_id" style="width:5%;">{{lang.id}}</th>
<th md2SortBy="event_date" style="width:15%;">{{lang.date}}</th>
<th md2SortBy="total_processed" style="width:15%;">{{lang.totalProcessed}}</th>
<th md2SortBy="total_errors" style="width:15%;">{{lang.totalErrors}}</th>
<th md2SortBy="info" style="width:40%;">{{lang.desc}}</th>
<th md2SortBy="module_name" style="width:10%;">{{lang.module}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let history of md2.data">
<td style="vertical-align:middle;">{{history.batch_id}}</td>
<td style="vertical-align:middle;">{{history.event_date | date : "dd/MM/y HH:mm"}}</td>
<td style="vertical-align:middle;">{{history.total_processed}}</td>
<td style="vertical-align:middle;">{{history.total_errors}}</td>
<td style="vertical-align:middle;">{{history.info}}</td>
<td style="vertical-align:middle;">{{history.module_name}}</td>
</tr>
</tbody>
</table>
<mat-grid-list cols="3" rowHeight="100px">
<mat-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
</mat-grid-tile>
<mat-grid-tile>
<mat-form-field>
<input matInput [(ngModel)]="minDate" [matDatepicker]="picker" placeholder="Depuis" (dateChange)="refreshHistory($event)">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker startView="month" [startAt]="minDate"></mat-datepicker>
</mat-form-field>
</mat-grid-tile>
</mat-grid-list>
</div>
</div>
</div>
</div>
\ No newline at end of file
apps/maarch_entreprise/js/angular/app/administration/historyBatch-administration.component.js
+ 22
− 8
View file @ 546b8c8e
......@@ -13,22 +13,25 @@ var core_1 = require("@angular/core");
var http_1 = require("@angular/common/http");
var translate_component_1 = require("../translate.component");
var notification_service_1 = require("../notification.service");
var material_1 = require("@angular/material");
var HistoryBatchAdministrationComponent = /** @class */ (function () {
function HistoryBatchAdministrationComponent(http, notify) {
this.http = http;
this.notify = notify;
this.lang = translate_component_1.LANG;
this.search = null;
this._search = '';
this.filterModules = [];
this.filterModule = '';
this.filterByDate = '';
this.loading = false;
this.data = [];
this.CurrentYear = new Date().getFullYear();
this.currentMonth = new Date().getMonth() + 1;
this.minDate = new Date();
this.displayedColumns = ['batch_id', 'event_date', 'total_processed', 'total_errors', 'info', 'module_name'];
this.dataSource = new material_1.MatTableDataSource(this.data);
}
HistoryBatchAdministrationComponent.prototype.applyFilter = function (filterValue) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
this.dataSource.filter = filterValue;
};
HistoryBatchAdministrationComponent.prototype.updateBreadcrumb = function (applicationName) {
if ($j('#ariane')[0]) {
$j('#ariane')[0].innerHTML = "<a href='index.php?reinit=true'>" + applicationName + "</a> > <a onclick='location.hash = \"/administration\"' style='cursor: pointer'>" + this.lang.administration + "</a> > " + this.lang.historyBatch;
......@@ -44,10 +47,11 @@ var HistoryBatchAdministrationComponent = /** @class */ (function () {
this.http.get(this.coreUrl + 'rest/administration/historyBatch/eventDate/' + this.minDate.toJSON())
.subscribe(function (data) {
_this.data = data.historyList;
_this.filterModules = data.filters.modules;
_this.loading = false;
setTimeout(function () {
$j("[md2sortby='event_date']").click().click();
_this.dataSource = new material_1.MatTableDataSource(_this.data);
_this.dataSource.paginator = _this.paginator;
_this.dataSource.sort = _this.sort;
}, 0);
}, function (err) {
console.log(err);
......@@ -59,12 +63,22 @@ var HistoryBatchAdministrationComponent = /** @class */ (function () {
this.http.get(this.coreUrl + 'rest/administration/historyBatch/eventDate/' + this.minDate.toJSON())
.subscribe(function (data) {
_this.data = data.historyList;
_this.filterModules = data.filters.modules;
_this.dataSource = new material_1.MatTableDataSource(_this.data);
_this.dataSource.paginator = _this.paginator;
_this.dataSource.sort = _this.sort;
}, function (err) {
console.log(err);
location.href = "index.php";
});
};
__decorate([
core_1.ViewChild(material_1.MatPaginator),
__metadata("design:type", material_1.MatPaginator)
], HistoryBatchAdministrationComponent.prototype, "paginator", void 0);
__decorate([
core_1.ViewChild(material_1.MatSort),
__metadata("design:type", material_1.MatSort)
], HistoryBatchAdministrationComponent.prototype, "sort", void 0);
HistoryBatchAdministrationComponent = __decorate([
core_1.Component({
templateUrl: angularGlobals["historyBatch-administrationView"],
......
apps/maarch_entreprise/js/angular/app/administration/historyBatch-administration.component.ts
+ 31
− 18
View file @ 546b8c8e
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { LANG } from '../translate.component';
import { NotificationService } from '../notification.service';
import { MatPaginator, MatTableDataSource, MatSort } from '@angular/material';
import {MatDatepickerInputEvent} from '@angular/material/datepicker';
declare function $j(selector: any) : any;
......@@ -17,20 +19,23 @@ declare var angularGlobals : any;
export class HistoryBatchAdministrationComponent implements OnInit {
coreUrl : string;
lang : any = LANG;
search : string = null;
_search : string = '';
filterModules : any = [];
filterModule : string = '';
filterByDate : string = '';
loading : boolean = false;
data : any = [];
CurrentYear : number = new Date().getFullYear();
currentMonth : number = new Date().getMonth()+1;
minDate : Date = new Date();
data: HistoryBatch[] = [];
CurrentYear: number = new Date().getFullYear();
currentMonth: number = new Date().getMonth() + 1;
minDate: Date = new Date();
displayedColumns = ['batch_id','event_date', 'total_processed', 'total_errors', 'info', 'module_name'];
dataSource = new MatTableDataSource(this.data);
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
this.dataSource.filter = filterValue;
}
constructor(public http: HttpClient, private notify: NotificationService) {
}
......@@ -53,11 +58,11 @@ export class HistoryBatchAdministrationComponent implements OnInit {
this.http.get(this.coreUrl + 'rest/administration/historyBatch/eventDate/'+this.minDate.toJSON())
.subscribe((data:any) => {
this.data = data.historyList;
this.filterModules = data.filters.modules;
this.loading = false;
setTimeout(() => {
$j("[md2sortby='event_date']").click().click();
this.dataSource = new MatTableDataSource(this.data);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}, 0);
}, (err) => {
console.log(err);
......@@ -69,12 +74,20 @@ export class HistoryBatchAdministrationComponent implements OnInit {
this.http.get(this.coreUrl + 'rest/administration/historyBatch/eventDate/'+this.minDate.toJSON())
.subscribe((data:any) => {
this.data = data.historyList;
this.filterModules = data.filters.modules;
this.dataSource = new MatTableDataSource(this.data);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}, (err) => {
console.log(err);
location.href = "index.php";
});
}
}
export interface HistoryBatch {
batch_id: number;
event_date: Date;
total_processed: string;
total_errors: string;
info: string;
module_name: string;
}
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment