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

FEAT #48 remove md2 elements

parent d2ec54a5
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
apps/maarch_entreprise/Views/status-administration.component.html
+ 11
− 25
View file @ 13da37ae
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
{{lang.canBeSearched}} {{lang.canBeSearched}}
</mat-slide-toggle> </mat-slide-toggle>
<sup> <sup>
<i class="fa fa-question-circle" tooltip="{{lang.tooltipSearchStatus}}"></i> <i class="fa fa-question-circle" matTooltip="{{lang.matTooltipSearchStatus}}"></i>
</sup> </sup>
</div> </div>
<div class="col-sm-4" style="white-space:nowrap;"> <div class="col-sm-4" style="white-space:nowrap;">
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
{{lang.canBeModified}} {{lang.canBeModified}}
</mat-slide-toggle> </mat-slide-toggle>
<sup> <sup>
<i class="fa fa-question-circle" tooltip="{{lang.tooltipIndexStatus}}"></i> <i class="fa fa-question-circle" matTooltip="{{lang.matTooltipIndexStatus}}"></i>
</sup> </sup>
</div> </div>
<div class="col-sm-4" style="white-space:nowrap;"> <div class="col-sm-4" style="white-space:nowrap;">
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
{{lang.isFolderStatus}} {{lang.isFolderStatus}}
</mat-slide-toggle> </mat-slide-toggle>
<sup> <sup>
<i class="fa fa-question-circle" tooltip="{{lang.tooltipFolderStatus}}"></i> <i class="fa fa-question-circle" matTooltip="{{lang.matTooltipFolderStatus}}"></i>
</sup> </sup>
</div> </div>
</div> </div>
...@@ -54,33 +54,19 @@ ...@@ -54,33 +54,19 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<div class="col-sm-1"> <div class="col-sm-1">
<i class="fm {{status.img_filename}} fm-2x text-primary"></i> <mat-icon class="fm {{status.img_filename}} fm-2x" aria-hidden="true" color="primary"></mat-icon>
</div> </div>
<div class="col-sm-11"> <div class="col-sm-11">
<md2-select <mat-select [(ngModel)]="status.img_filename" placeholder="{{lang.imgRelated}}" id="status" name="status" required>
id="status" <mat-option *ngFor="let image of statusImages" [value]="image.image_name">
name="status" <i [ngClass]="[image.image_name.indexOf('fm') == 0 ? 'fm' : 'fa']" class="{{image.image_name}} fa-2x" color="primary"></i> {{image.image_name}}
placeholder="{{lang.imgRelated}}" </mat-option>
[(ngModel)]="status.img_filename" </mat-select>
required
#searchStatusIcon="ngModel">
<md2-select-header>
<mat-form-field>
<input matInput name="search"
type="text"
placeholder="Filtre"
[(ngModel)]="_search"
autocomplete="off"
(focusout)="clearSearch()"/>
</mat-form-field>
</md2-select-header>
<md2-option *ngFor="let image of statusImages | dataPipe : 'image_name' : _search" [value]="image.image_name"><i [ngClass]="[image.image_name.indexOf('fm') == 0 ? 'fm' : 'fa']" class="{{image.image_name}} fa-2x"></i> {{image.image_name}}</md2-option>
</md2-select>
</div> </div>
</div> </div>
<div class="col-sm-12 panel-body" style="text-align:center;"> <div class="col-sm-12 panel-body" style="text-align:center;">
<button class="btn btn-success" type="submit" [disabled]="!statusFormUp.form.valid">{{lang.validate}}</button> <button mat-raised-button color="accent" type="submit" [disabled]="!statusFormUp.form.valid">{{lang.validate}}</button>
<button class="btn btn-warning" routerLink='/administration/statuses'>{{lang.cancel}}</button> <button mat-raised-button routerLink='/administration/status'>{{lang.cancel}}</button>
</div> </div>
</form> </form>
</div> </div>
......
apps/maarch_entreprise/Views/statuses-administration.component.html
+ 50
− 44
View file @ 13da37ae
<div class="page-header"> <div class="page-header">
<h1>{{lang.administration}} {{lang.statuses}} <small>{{statuses.length}} {{lang.statuses}}</small></h1> <h1>{{lang.administration}} {{lang.statuses}}
<small>{{statuses.length}} {{lang.statuses}}</small>
</h1>
</div> </div>
<div *ngIf="loading"> <div *ngIf="loading">
<mat-spinner style="margin:auto;"></mat-spinner> <mat-spinner style="margin:auto;"></mat-spinner>
</div> </div>
<div *ngIf="!loading" class="container-fluid"> <div *ngIf="!loading" class="container-fluid">
<div class="col-md-12"> <div class="col-md-12">
<table id="statusTable" class="table table-hover table-condensed" [md2Data]="statuses | dataPipe : 'label_status' : search" #md2="md2DataTable" [sortBy]='label_status' [rowsPerPage]="10"> <div class="example-container">
<thead> <mat-grid-list cols="3" rowHeight="100px">
<tr> <mat-grid-tile>
<td colspan="2"> <mat-paginator #paginator [length]="100" [pageSize]="10" [pageSizeOptions]="[10, 25, 50, 100]">
<md2-pagination></md2-pagination> </mat-paginator>
</td> </mat-grid-tile>
<td style="text-align:right" colspan="2"> <mat-grid-tile></mat-grid-tile>
<mat-form-field> <mat-grid-tile>
<input matInput placeholder="{{lang.filterBy}} : {{lang.description}}" class="searchTable" [(ngModel)]="search" /> <mat-form-field>
</mat-form-field> <input matInput (keyup)="applyFilter($event.target.value)" placeholder="{{lang.filterBy}}">
&nbsp; </mat-form-field>
<a class="text-primary" style="cursor: pointer" routerLink="/administration/statuses/new" title="{{lang.addStatus}}"><i class="fa fa-check-circle fa-2x"></i><sup><i class="fa fa-plus"></i></sup></a> <button mat-mini-fab color="accent" matTooltip="{{lang.add}}" routerLink="/administration/status/new">
</td> <mat-icon class="fa fa-plus" aria-hidden="true"></mat-icon>
</tr> </button>
<tr> </mat-grid-tile>
<th md2SortBy="id" style="width:15%"><span>{{lang.imgRelated}}</span></th> </mat-grid-list>
<th md2SortBy="img_filename" style="width:20%"><span>{{lang.id}}</span></th> <mat-table #table [dataSource]="dataSource" matSort matSortActive="label_status" matSortDirection="asc">
<th md2SortBy="label_status" style="width:60%"><span>{{lang.description}}</span></th> <ng-container matColumnDef="img_filename">
<th style="width:5%">&nbsp;</th> <mat-header-cell *matHeaderCellDef>{{lang.imgRelated}}</mat-header-cell>
</tr> <mat-cell *matCellDef="let element" color="primary">
</thead> <mat-icon class="fm {{element.img_filename}} fm-2x" *ngIf="element.img_filename.indexOf('fm') == 0" aria-hidden="true"></mat-icon>
<tbody> <mat-icon class="fa {{element.img_filename}} fa-2x" *ngIf="element.img_filename.indexOf('fa') == 0" aria-hidden="true"></mat-icon>
<tr *ngFor="let status of md2.data"> </mat-cell>
<td style="text-align:center;vertical-align:middle;"> </ng-container>
<i class="fm {{status.img_filename}} fm-2x text-primary" *ngIf="status.img_filename.indexOf('fm') == 0"></i> <ng-container matColumnDef="id">
<i class="fa {{status.img_filename}} fa-2x text-primary" *ngIf="status.img_filename.indexOf('fa') == 0"></i> <mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.id}}</mat-header-cell>
</td> <mat-cell *matCellDef="let element"> {{element.id}} </mat-cell>
<td style="vertical-align:middle;">{{status.id}}</td> </ng-container>
<td style="vertical-align:middle;">{{status.label_status}}</td> <ng-container matColumnDef="label_status">
<td style="text-align:right;vertical-align:middle;"> <mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.description}}</mat-header-cell>
<div class="btn-group" role="group" aria-label="..."> <mat-cell *matCellDef="let element"> {{element.label_status}} </mat-cell>
<button routerLink="/administration/statuses/{{status.identifier}}" type="button" class="btn btn-default" title="{{lang.update}}"> </ng-container>
<a><i style="cursor:pointer" class="fa fa-edit"></i></a> <ng-container matColumnDef="identifier">
</button> <mat-header-cell *matHeaderCellDef></mat-header-cell>
<button type="button" class="btn btn-default" title="{{lang.delete}}" (click)="deleteStatus(status)"> <mat-cell *matCellDef="let element" style="text-align:right">
<a><i style="cursor:pointer;color: #D9534F" class="fa fa-trash"></i></a> <button mat-icon-button color="primary" matTooltip="{{lang.update}}" routerLink="/administration/status/{{element.identifier}}">
</button> <mat-icon class="fa fa-edit fa-2x" aria-hidden="true"></mat-icon>
</div> </button>
</td> <button mat-icon-button color="warn" matTooltip="{{lang.delete}}" (click)="deleteStatus(element)">
</tr> <mat-icon class="fa fa-trash fa-2x" aria-hidden="true"></mat-icon>
</tbody> </button>
</table> </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
</div>
</div> </div>
</div> </div>
apps/maarch_entreprise/js/angular/app/administration/statuses-administration.component.js
+ 21
− 3
View file @ 13da37ae
...@@ -13,6 +13,7 @@ var core_1 = require("@angular/core"); ...@@ -13,6 +13,7 @@ var core_1 = require("@angular/core");
var http_1 = require("@angular/common/http"); var http_1 = require("@angular/common/http");
var translate_component_1 = require("../translate.component"); var translate_component_1 = require("../translate.component");
var notification_service_1 = require("../notification.service"); var notification_service_1 = require("../notification.service");
var material_1 = require("@angular/material");
var StatusesAdministrationComponent = /** @class */ (function () { var StatusesAdministrationComponent = /** @class */ (function () {
function StatusesAdministrationComponent(http, notify) { function StatusesAdministrationComponent(http, notify) {
this.http = http; this.http = http;
...@@ -20,7 +21,14 @@ var StatusesAdministrationComponent = /** @class */ (function () { ...@@ -20,7 +21,14 @@ var StatusesAdministrationComponent = /** @class */ (function () {
this.lang = translate_component_1.LANG; this.lang = translate_component_1.LANG;
this.statuses = []; this.statuses = [];
this.loading = false; this.loading = false;
this.displayedColumns = ['img_filename', 'id', 'label_status', 'identifier'];
this.dataSource = new material_1.MatTableDataSource(this.statuses);
} }
StatusesAdministrationComponent.prototype.applyFilter = function (filterValue) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
this.dataSource.filter = filterValue;
};
StatusesAdministrationComponent.prototype.ngOnInit = function () { StatusesAdministrationComponent.prototype.ngOnInit = function () {
var _this = this; var _this = this;
this.coreUrl = angularGlobals.coreUrl; this.coreUrl = angularGlobals.coreUrl;
...@@ -29,11 +37,13 @@ var StatusesAdministrationComponent = /** @class */ (function () { ...@@ -29,11 +37,13 @@ var StatusesAdministrationComponent = /** @class */ (function () {
this.http.get(this.coreUrl + 'rest/statuses') this.http.get(this.coreUrl + 'rest/statuses')
.subscribe(function (data) { .subscribe(function (data) {
_this.statuses = data.statuses; _this.statuses = data.statuses;
setTimeout(function () {
$j("[md2sortby='label_status']").click();
}, 0);
_this.updateBreadcrumb(angularGlobals.applicationName); _this.updateBreadcrumb(angularGlobals.applicationName);
_this.loading = false; _this.loading = false;
setTimeout(function () {
_this.dataSource = new material_1.MatTableDataSource(_this.statuses);
_this.dataSource.paginator = _this.paginator;
_this.dataSource.sort = _this.sort;
}, 0);
}, function (err) { }, function (err) {
_this.notify.error(JSON.parse(err._body).errors); _this.notify.error(JSON.parse(err._body).errors);
}); });
...@@ -58,6 +68,14 @@ var StatusesAdministrationComponent = /** @class */ (function () { ...@@ -58,6 +68,14 @@ var StatusesAdministrationComponent = /** @class */ (function () {
}); });
} }
}; };
__decorate([
core_1.ViewChild(material_1.MatPaginator),
__metadata("design:type", material_1.MatPaginator)
], StatusesAdministrationComponent.prototype, "paginator", void 0);
__decorate([
core_1.ViewChild(material_1.MatSort),
__metadata("design:type", material_1.MatSort)
], StatusesAdministrationComponent.prototype, "sort", void 0);
StatusesAdministrationComponent = __decorate([ StatusesAdministrationComponent = __decorate([
core_1.Component({ core_1.Component({
templateUrl: angularGlobals['statuses-administrationView'], templateUrl: angularGlobals['statuses-administrationView'],
......
apps/maarch_entreprise/js/angular/app/administration/statuses-administration.component.ts
+ 31
− 6
View file @ 13da37ae
import { Component, OnInit } from '@angular/core'; import { Component, OnInit, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { Router, ActivatedRoute } from '@angular/router'; import { Router, ActivatedRoute } from '@angular/router';
import { LANG } from '../translate.component'; import { LANG } from '../translate.component';
import { NotificationService } from '../notification.service'; import { NotificationService } from '../notification.service';
import { MatPaginator,MatTableDataSource, MatSort } from '@angular/material';
declare function $j(selector: any) : any; declare function $j(selector: any) : any;
...@@ -17,11 +18,20 @@ export class StatusesAdministrationComponent implements OnInit { ...@@ -17,11 +18,20 @@ export class StatusesAdministrationComponent implements OnInit {
coreUrl : string; coreUrl : string;
lang : any = LANG; lang : any = LANG;
nbStatus : number; nbStatus: number;
statuses : any = []; statuses: Status[] = [];
loading : boolean = false; loading : boolean = false;
displayedColumns = ['img_filename','id','label_status','identifier'];
dataSource = new MatTableDataSource(this.statuses);
@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) { constructor(public http: HttpClient, private notify: NotificationService) {
} }
...@@ -36,11 +46,14 @@ export class StatusesAdministrationComponent implements OnInit { ...@@ -36,11 +46,14 @@ export class StatusesAdministrationComponent implements OnInit {
this.http.get(this.coreUrl + 'rest/statuses') this.http.get(this.coreUrl + 'rest/statuses')
.subscribe((data : any) => { .subscribe((data : any) => {
this.statuses = data.statuses; this.statuses = data.statuses;
setTimeout(() => {
$j("[md2sortby='label_status']").click();
}, 0);
this.updateBreadcrumb(angularGlobals.applicationName); this.updateBreadcrumb(angularGlobals.applicationName);
this.loading = false; this.loading = false;
setTimeout(() => {
this.dataSource = new MatTableDataSource(this.statuses);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}, 0);
}, (err) => { }, (err) => {
this.notify.error(JSON.parse(err._body).errors); this.notify.error(JSON.parse(err._body).errors);
}); });
...@@ -70,3 +83,15 @@ export class StatusesAdministrationComponent implements OnInit { ...@@ -70,3 +83,15 @@ export class StatusesAdministrationComponent implements OnInit {
} }
} }
export interface Status {
id: string;
can_be_modified: string;
can_be_searchead: string;
identifier: number;
img_filename: string;
is_folder_status: string;
is_system: string;
label_status: string;
maarch_module: 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