Update company list

docker-compose.yml

@@ -1,15 +1,7 @@
 version: "3.1"
 
 services:
-  database:
+  cre.backend:
-    image: mysql
-    command: --default-authentication-plugin=mysql_native_password
-    environment:
-      MYSQL_ROOT_PASSWORD: "pass"
-      MYSQL_DATABASE: "cre"
-    ports:
-      - "3307:3306"
-  backend:
     image: registry.fyloz.dev:5443/colorrecipesexplorer/backend:latest
     environment:
       spring_profiles_active: "mysql,debug"
@@ -23,6 +15,14 @@ services:
     volumes:
       - cre_data:/usr/bin/cre/data
       - cre_config:/usr/bin/cre/config
+  cre.database:
+    image: mysql
+    command: --default-authentication-plugin=mysql_native_password
+    environment:
+      MYSQL_ROOT_PASSWORD: "pass"
+      MYSQL_DATABASE: "cre"
+    ports:
+      - "3307:3306"
 
 volumes:
   cre_data:

src/app/modules/company/company.module.ts

@@ -5,6 +5,9 @@ import { AddComponent } from './pages/add/add.component';
 import { EditComponent } from './pages/edit/edit.component';
 import {CompanyRoutingModule} from "./company-routing.module";
 import {SharedModule} from "../shared/shared.module";
+import {CreActionBarModule} from '../shared/components/action-bar/action-bar.module'
+import {CreButtonsModule} from '../shared/components/buttons/buttons.module'
+import {CreTablesModule} from '../shared/components/tables/tables.module'
 
 
 
@@ -13,7 +16,10 @@ import {SharedModule} from "../shared/shared.module";
   imports: [
     CommonModule,
     CompanyRoutingModule,
-    SharedModule
+    SharedModule,
+    CreActionBarModule,
+    CreButtonsModule,
+    CreTablesModule
   ]
 })
 export class CompanyModule { }

src/app/modules/company/pages/list/list.component.html

@@ -1,12 +1,26 @@
+<cre-action-bar [reverse]="true">
+  <cre-action-group>
+    <cre-accent-button routerLink="/catalog/company/add">Ajouter</cre-accent-button>
+  </cre-action-group>
+</cre-action-bar>
+
 <cre-warning-alert *ngIf="companiesEmpty">
   <p>Il n'y a actuellement aucune bannière enregistrée dans le système.</p>
   <p *ngIf="hasEditPermission">Vous pouvez en créer une <b><a routerLink="/catalog/company/add">ici</a></b>.</p>
 </cre-warning-alert>
 
-<cre-entity-list
+<cre-table *ngIf="!companiesEmpty" class="mx-auto" [dataSource]="companies$ | async" [columns]="columns">
-  [entities$]="companies$"
+  <ng-container matColumnDef="name">
-  [columns]="columns"
+    <th mat-header-cell *matHeaderCellDef>Nom</th>
-  [buttons]="buttons"
+    <td mat-cell *matCellDef="let company">{{company.name}}</td>
-  addLink="/catalog/company/add"
+  </ng-container>
-  addPermission="EDIT_COMPANIES">
+
-</cre-entity-list>
+  <ng-container matColumnDef="editButton">
+    <th mat-header-cell *matHeaderCellDef></th>
+    <td mat-cell *matCellDef="let company; let i = index">
+      <cre-accent-button [creInteractiveCell]="i" routerLink="/catalog/company/edit/{{company.id}}">
+        Modifier
+      </cre-accent-button>
+    </td>
+  </ng-container>
+</cre-table>

src/app/modules/company/pages/list/list.component.ts

@@ -5,8 +5,8 @@ import {Permission} from '../../../shared/model/user'
 import {ActivatedRoute, Router} from '@angular/router'
 import {ErrorService} from '../../../shared/service/error.service'
 import {AppState} from '../../../shared/app-state'
-import {map, tap} from "rxjs/operators";
+import {tap} from 'rxjs/operators'
-import {AccountService} from "../../../accounts/services/account.service";
+import {AccountService} from '../../../accounts/services/account.service'
 
 @Component({
   selector: 'cre-list',
@@ -14,10 +14,12 @@ import {AccountService} from "../../../accounts/services/account.service";
   styleUrls: ['./list.component.sass']
 })
 export class ListComponent extends ErrorHandlingComponent {
-  companies$ = this.companyService.all
+  companies$ = this.companyService.all.pipe(tap(companies => this.companiesEmpty = companies.length <= 0))
-  columns = [
+
-    {def: 'name', title: 'Nom', valueFn: c => c.name}
+  // columns = [
-  ]
+  //   {def: 'name', title: 'Nom', valueFn: c => c.name}
+  // ]
+  columns = ['name', 'editButton']
   buttons = [{
     text: 'Modifier',
     linkFn: t => `/catalog/company/edit/${t.id}`,
@@ -36,8 +38,6 @@ export class ListComponent extends ErrorHandlingComponent {
   ) {
     super(errorService, activatedRoute, router)
     this.appState.title = 'Bannières'
-
-    this.companies$.pipe(tap(companies => this.companiesEmpty = companies.length <= 0))
   }
 
   get hasEditPermission(): boolean {

src/app/modules/shared/shared.module.ts

@@ -38,6 +38,7 @@ import {VarDirective} from './directives/var.directive'
 import {CreColorPreview} from './components/color-preview/color-preview'
 import {CreDialogsModule} from './components/dialogs/dialogs.module'
 import {CreAlertsModule} from './components/alerts/alerts.module';
+import {CreActionBarModule} from './components/action-bar/action-bar.module'
 
 @NgModule({
   declarations: [VarDirective, HeaderComponent, UserMenuComponent, LabeledIconComponent, ConfirmBoxComponent, PermissionsListComponent, PermissionsFieldComponent, NavComponent, EntityListComponent, EntityAddComponent, EntityEditComponent, FileButtonComponent, GlobalAlertHandlerComponent, SliderFieldComponent, LoadingWheelComponent, CreColorPreview],