+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.scss
new file mode 100644
index 0000000..05fa790
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.scss
@@ -0,0 +1,19 @@
+.department-documentart {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-template-rows: 0 minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label" "attributes";
+}
+
+
+.documentart {
+ grid-area: attributes;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.ts b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.ts
new file mode 100644
index 0000000..b8879e1
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-documentart/department-documentart.component.ts
@@ -0,0 +1,28 @@
+
+
+import { Component, OnInit, Input } from '@angular/core';
+import { AppBaseEntityWrapper } from '@app_services/app.baseentity.wrapper';
+import { AppDataService } from '@app_services/app.data.service';
+import { Department } from '@app_models/basedata/department';
+import { DepartmentDataService } from '@app_modules/department/department-data.service';
+
+@Component({
+ selector: 'app-department-documentart',
+ templateUrl: './department-documentart.component.html',
+ styleUrls: ['./department-documentart.component.scss']
+})
+
+export class DepartmentDocumentartsComponent implements OnInit {
+
+ @Input() public departmentDetails: AppBaseEntityWrapper
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.scss
new file mode 100644
index 0000000..192008c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.scss
@@ -0,0 +1,23 @@
+.department-windreamsearch-windreamindex{
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: auto minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label label" "toolbar grid";
+}
+
+.grid {
+ grid-area: grid;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+ // padding-bottom: 6px;
+}
+
+.toolbar {
+ grid-area: toolbar;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.spec.ts b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.spec.ts
new file mode 100644
index 0000000..1e3e321
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-index/department-windream-index.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DepartmentWindreamIndexComponent } from './department-windream-index.component';
+
+describe('DepartmentWindreamIndexComponent', () => {
+ let component: DepartmentWindreamIndexComponent;
+ let fixture: ComponentFixture
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.scss
new file mode 100644
index 0000000..192008c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.scss
@@ -0,0 +1,23 @@
+.department-windreamsearch-windreamindex{
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: auto minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label label" "toolbar grid";
+}
+
+.grid {
+ grid-area: grid;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+ // padding-bottom: 6px;
+}
+
+.toolbar {
+ grid-area: toolbar;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.spec.ts b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.spec.ts
new file mode 100644
index 0000000..030ac44
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search-item/department-windream-search-item.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { DepartmentWindreamSearchItemComponent } from './department-windream-search-item.component';
+
+
+describe('DepartmentWindreamIndexComponent', () => {
+ let component: DepartmentWindreamSearchItemComponent;
+ let fixture: ComponentFixture
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.scss
new file mode 100644
index 0000000..15a776e
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.scss
@@ -0,0 +1,23 @@
+.department-windreamsearch {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: auto minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label label" "toolbar grid";
+}
+
+.grid {
+ grid-area: grid;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+ // padding-bottom: 6px;
+}
+
+.toolbar {
+ grid-area: toolbar;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.spec.ts b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.spec.ts
new file mode 100644
index 0000000..8ae40b5
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-detail/department-windream-search/department-windream-search.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DepartmentWindreamSearchComponent } from './department-windream-search.component';
+
+describe('DepartmentWindreamSearchComponent', () => {
+ let component: DepartmentWindreamSearchComponent;
+ let fixture: ComponentFixture
+
+
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.scss
new file mode 100644
index 0000000..4393ad5
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.scss
@@ -0,0 +1,39 @@
+.DepartmentList {
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-rows: auto minmax(0, 1fr); // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-row-gap: 7px;
+ grid-template-areas:
+ 'filter'
+ 'grid';
+}
+
+
+.FilterComponent {
+ grid-area: filter; // grid area: auto height 1fr width
+ margin: 0 0 0 0;
+}
+
+
+.card {
+ grid-area: grid;
+ width: 100%;
+ padding: 0px;
+ margin: 0;
+ border-radius: 0px;
+ box-shadow: none;
+}
+
+.gridDepartment {
+ position: absolute; // position absolut ist hier zwingend! Die position ist absolut innerhalb mehrerer parent divs und darf sich NICHT über diese hinausstrecken.
+ height: 100%;
+ width: 100%;
+ padding-left: 1px;
+ padding-right: 1px;
+ padding-bottom: 1px;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.ts b/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.ts
new file mode 100644
index 0000000..9294269
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department-list/department-list.component.ts
@@ -0,0 +1,59 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { Department } from '@app_models/basedata/department';
+import { AppBaseEntityListWrapper } from '@app_services/app.baseentitylist.wrapper';
+import { AppDataService } from '@app_services/app.data.service';
+import { DepartmentDataService } from '../department-data.service';
+import { ColumnConfigList } from '@app_core/components/grid-config/columnconfiglist';
+import { LocaleService } from '@app_core/services/localization/locale.service';
+import { Globals } from '@app_core/services/globals';
+import { ColumnConfig, EN_SortOrder } from '@app_core/components/grid-config/columnconfig';
+
+@Component({
+ selector: 'app-department-list',
+ templateUrl: './department-list.component.html',
+ styleUrls: ['./department-list.component.scss']
+})
+export class DepartmentListComponent implements OnInit {
+ @Input() public dataSource: AppBaseEntityListWrapper
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department.component.scss b/ClientApp/staff-db-ui/src/app/modules/department/department.component.scss
new file mode 100644
index 0000000..90683e3
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department.component.scss
@@ -0,0 +1,22 @@
+.DepartmentComponent {
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-rows: minmax(0, 1fr) auto; // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-template-areas: 'list''details';
+ grid-column-gap: 5px;
+ grid-row-gap: 5px;
+}
+
+.DepartmentListComponent {
+ grid-area: list;
+}
+
+.DepartmentDetailsComponent {
+ grid-area: details;
+ z-index: 10;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department.component.ts b/ClientApp/staff-db-ui/src/app/modules/department/department.component.ts
new file mode 100644
index 0000000..f0d3953
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department.component.ts
@@ -0,0 +1,18 @@
+import { Component, OnInit } from '@angular/core';
+import { DepartmentDataService } from './department-data.service';
+
+@Component({
+ selector: 'app-department',
+ templateUrl: './department.component.html',
+ styleUrls: ['./department.component.scss']
+})
+export class DepartmentComponent implements OnInit {
+
+ constructor(
+ public departmentDataService: DepartmentDataService
+ ) { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department.module.ts b/ClientApp/staff-db-ui/src/app/modules/department/department.module.ts
new file mode 100644
index 0000000..9bb8f89
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department.module.ts
@@ -0,0 +1,57 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { AngularMaterialModule } from '@app_core/components/angular-material.module';
+import { DxButtonModule, DxDataGridModule, DxFileUploaderModule, DxPieChartModule, DxTemplateModule, DxTooltipModule } from 'devextreme-angular';
+import { DepartmentContentComponent } from './department-detail/department-content/department-content.component';
+import { DepartmentDetailComponent } from './department-detail/department-detail.component';
+import { DepartmentDocumentartsComponent as DepartmentDocumentArtComponent } from './department-detail/department-documentart/department-documentart.component';
+import { DepartmentWindreamIndexPopupeditComponent } from './department-detail/department-windream-index/department-windream-index-popupedit/department-windream-index-popupedit.component';
+import { DepartmentWindreamIndexComponent } from './department-detail/department-windream-index/department-windream-index.component';
+import { DepartmentWindreamSearchItemPopupeditComponent } from './department-detail/department-windream-search-item/department-windream-search-item-popupedit.component/department-windream-search-item-popupedit.component';
+import { DepartmentWindreamSearchItemComponent } from './department-detail/department-windream-search-item/department-windream-search-item.component';
+import { DepartmentWindreamSearchPopupeditComponent } from './department-detail/department-windream-search/department-windream-search-popupedit/department-windream-search-popupedit.component';
+import { DepartmentWindreamSearchComponent } from './department-detail/department-windream-search/department-windream-search.component';
+import { SelectDepartmentPopupComponent } from './department-detail/department-windream-search/select-department-popup/select-department-popup.component';
+import { DepartmentFilterComponent } from './department-list/department-filter/department-filter.component';
+import { DepartmentListComponent } from './department-list/department-list.component';
+import { DepartmentComponent } from './department.component';
+import { DepartmentRoutingModule } from './department.routing.module';
+import { HenselSelectionComponent } from '@app_core/components/hensel-selection/hensel-selection.component';
+import { HenselInputComponent } from '@app_core/components/hensel-input/hensel-input.component';
+
+
+@NgModule({
+ declarations: [
+ DepartmentComponent,
+ DepartmentListComponent,
+ DepartmentDetailComponent,
+ DepartmentFilterComponent,
+ DepartmentContentComponent,
+ DepartmentWindreamSearchComponent,
+ DepartmentWindreamSearchPopupeditComponent,
+ DepartmentWindreamSearchItemComponent,
+ DepartmentWindreamSearchItemPopupeditComponent,
+ DepartmentWindreamIndexComponent,
+ DepartmentDocumentArtComponent,
+ DepartmentWindreamIndexPopupeditComponent,
+ SelectDepartmentPopupComponent
+ ],
+ imports: [
+ CommonModule,
+ DepartmentRoutingModule,
+ AngularMaterialModule,
+ DxDataGridModule,
+ FormsModule,
+ HenselSelectionComponent,
+ HenselInputComponent,
+ DxFileUploaderModule,
+ DxButtonModule,
+ DxTooltipModule,
+ DxTemplateModule,
+ DxPieChartModule,
+ ],
+ providers: [],
+ exports: []
+})
+export class DepartmentModule { }
diff --git a/ClientApp/staff-db-ui/src/app/modules/department/department.routing.module.ts b/ClientApp/staff-db-ui/src/app/modules/department/department.routing.module.ts
new file mode 100644
index 0000000..7e2514a
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/department/department.routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { DepartmentComponent } from './department.component';
+import { AuthGuard } from '@app_core/services/authguard';
+
+const routes: Routes = [
+ {
+ path: '**',
+ component: DepartmentComponent,
+ canActivate: [AuthGuard]
+ },
+];
+
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class DepartmentRoutingModule { }
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/Page1.drawio b/ClientApp/staff-db-ui/src/app/modules/employee/Page1.drawio
new file mode 100644
index 0000000..057d656
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/Page1.drawio
@@ -0,0 +1,160 @@
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.scss b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.scss
new file mode 100644
index 0000000..cb3da64
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.scss
@@ -0,0 +1,20 @@
+.employee-attribute {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label""attributes";
+}
+
+
+.attributes {
+ grid-area: attributes;
+ height: 100%;
+ width: calc(100% - 28px);
+ margin-left: 28px;
+}
+
+.label {
+ grid-area: label;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.ts
new file mode 100644
index 0000000..2dcf40c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-attribute/employee-attribute.component.ts
@@ -0,0 +1,24 @@
+
+
+import { Component, OnInit, Input } from '@angular/core';
+import { AppBaseEntityWrapper } from '@app_services/app.baseentity.wrapper';
+import { Employee } from '@app_models/employee';
+import { AppDataService } from '@app_services/app.data.service';
+
+@Component({
+ selector: 'app-employee-attribute',
+ templateUrl: './employee-attribute.component.html',
+ styleUrls: ['./employee-attribute.component.scss']
+})
+export class EmployeeAttributeComponent implements OnInit {
+
+ @Input() public employeeDetails: AppBaseEntityWrapper
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.scss b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.scss
new file mode 100644
index 0000000..2492105
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.scss
@@ -0,0 +1,23 @@
+.employee-department {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: auto minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ grid-template-areas: "label label" "toolbar grid";
+}
+
+.grid {
+ grid-area: grid;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+ // padding-bottom: 6px;
+}
+
+.toolbar {
+ grid-area: toolbar;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.ts
new file mode 100644
index 0000000..98aa67c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-department/employee-department.component.ts
@@ -0,0 +1,103 @@
+
+
+import { Component, Input, OnInit } from '@angular/core';
+import { EN_EmployeeRang, EN_EmployeeStatus } from '@app_consts';
+import { Employee } from '@app_models/employee';
+import { EmployeeToDepartment } from '@app_models/employee-to-department';
+import { EmployeeToWebApp } from '@app_models/employee-to-webapp';
+import { EmployeeDataService } from '@app_modules/employee/employee-data.service';
+import { AppBaseEntityWrapper } from '@app_services/app.baseentity.wrapper';
+import { AppBaseEntityListWrapper } from '@app_services/app.baseentitylist.wrapper';
+import { AppDataService } from '@app_services/app.data.service';
+import { EmployeeToDepartmentPopupeditComponent } from './employee-department.popupedit/employee-department.popupedit.component';
+import { MatDialogService } from '@app_core/services/mat-dialog.service';
+import { ColumnConfigList } from '@app_core/components/grid-config/columnconfiglist';
+import { LocaleService } from '@app_core/services/localization/locale.service';
+import { Globals } from '@app_core/services/globals';
+import { ColumnConfig, EN_SortOrder } from '@app_core/components/grid-config/columnconfig';
+
+@Component({
+ selector: 'app-employee-department',
+ templateUrl: './employee-department.component.html',
+ styleUrls: ['./employee-department.component.scss']
+})
+
+export class EmployeeDepartmentComponent implements OnInit {
+
+ @Input() employeeDepartmentList: AppBaseEntityListWrapper
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.scss b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.scss
new file mode 100644
index 0000000..1d9bd55
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.scss
@@ -0,0 +1,24 @@
+.employee-webapp {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-columns: auto minmax(0, 1fr); // column relationship
+ grid-template-rows: auto minmax(1px, 1fr); // auto auto auto auto auto auto auto auto auto; // row relationships
+ // grid-template-areas: "label""toolbar""grid";
+ grid-template-areas: "label label" "toolbar grid";
+ }
+
+.grid {
+ grid-area: grid;
+ height: 100%;
+ width: 100%;
+}
+
+.label {
+ grid-area: label;
+ // padding-bottom: 6px;
+}
+
+.toolbar {
+ grid-area: toolbar;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.ts
new file mode 100644
index 0000000..8693e5c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-detail/employee-webapp/employee-webapp.component.ts
@@ -0,0 +1,124 @@
+
+
+import * as keycode from '@angular/cdk/keycodes';
+import { Component, HostListener, Input, OnInit } from '@angular/core';
+import { EN_EmployeeStatus } from '@app_consts';
+import { ColumnConfig, EN_SortOrder } from '@app_core/components/grid-config/columnconfig';
+import { ColumnConfigList } from '@app_core/components/grid-config/columnconfiglist';
+import { Globals } from '@app_core/services/globals';
+import { LocaleService } from '@app_core/services/localization/locale.service';
+import { MatDialogService } from '@app_core/services/mat-dialog.service';
+import { Employee } from '@app_models/employee';
+import { EmployeeToDepartment } from '@app_models/employee-to-department';
+import { EmployeeToWebApp } from '@app_models/employee-to-webapp';
+import { EmployeeDataService } from '@app_modules/employee/employee-data.service';
+import { AppBaseEntityWrapper } from '@app_services/app.baseentity.wrapper';
+import { AppBaseEntityListWrapper } from '@app_services/app.baseentitylist.wrapper';
+import { AppDataService } from '@app_services/app.data.service';
+import { EmployeeToWebAppPopupeditComponent } from './employee-webapp.popupedit/employee-webapp.popupedit.component';
+
+
+@Component({
+ selector: 'app-employee-webapp',
+ templateUrl: './employee-webapp.component.html',
+ styleUrls: ['./employee-webapp.component.scss']
+})
+
+export class EmployeeWebappComponent implements OnInit {
+
+ public get employeeWebappList(): AppBaseEntityListWrapper
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.scss b/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.scss
new file mode 100644
index 0000000..8ec9070
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.scss
@@ -0,0 +1,38 @@
+.EmployeeList {
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-rows: auto minmax(0, 1fr); // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-row-gap: 7px;
+ grid-template-areas:
+ 'filter'
+ 'grid';
+}
+
+.FilterComponent {
+ grid-area: filter; // grid area: auto height 1fr width
+ margin: 0 0 0 0;
+}
+
+
+.card {
+ grid-area: grid;
+ width: 100%;
+ padding: 0px;
+ margin: 0;
+ border-radius: 0px;
+ box-shadow: none;
+}
+
+.gridEmployee {
+ position: absolute; // position absolut ist hier zwingend! Die position ist absolut innerhalb mehrerer parent divs und darf sich NICHT über diese hinausstrecken.
+ height: 100%;
+ width: 100%;
+ padding-left: 1px;
+ padding-right: 1px;
+ padding-bottom: 1px;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.ts
new file mode 100644
index 0000000..3464163
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee-list/employee-list.component.ts
@@ -0,0 +1,80 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ColumnConfigList } from '@app_core/components/grid-config/columnconfiglist';
+import { Globals } from '@app_core/services/globals';
+import { LocaleService } from '@app_core/services/localization/locale.service';
+import { Employee } from '@app_models/employee';
+import { AppBaseEntityListWrapper } from '@app_services/app.baseentitylist.wrapper';
+import { AppDataService } from '@app_services/app.data.service';
+import { EmployeeDataService } from '../employee-data.service';
+import { ColumnConfig, EN_Alignment, EN_SortOrder } from '@app_core/components/grid-config/columnconfig';
+
+@Component({
+ selector: 'app-employee-list',
+ templateUrl: './employee-list.component.html',
+ styleUrls: ['./employee-list.component.scss']
+})
+export class EmployeeListComponent implements OnInit {
+ @Input() public dataSource: AppBaseEntityListWrapper
+ {{cell.value | number:'1.0-0':culture}}
+
+
+ {{cell.value | number:'1.1-1':culture}}
+
+
+ {{cell.value | number:'1.2-2':culture}}
+
+
+ {{cell.value | number:'1.3-3':culture}}
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.scss b/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.scss
new file mode 100644
index 0000000..c990dc3
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.scss
@@ -0,0 +1,22 @@
+.EmployeeComponent {
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-rows: minmax(0, 1fr) auto; // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-template-areas: 'list''details';
+ grid-column-gap: 5px;
+ grid-row-gap: 5px;
+}
+
+.EmployeeListComponent {
+ grid-area: list;
+}
+
+.EmployeeDetailsComponent {
+ grid-area: details;
+ z-index: 10;
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.ts
new file mode 100644
index 0000000..26c0382
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee.component.ts
@@ -0,0 +1,18 @@
+import { Component, OnInit } from '@angular/core';
+import { EmployeeDataService } from './employee-data.service';
+
+@Component({
+ selector: 'app-employee',
+ templateUrl: './employee.component.html',
+ styleUrls: ['./employee.component.scss']
+})
+export class EmployeeComponent implements OnInit {
+
+ constructor(
+ public employeeDataService: EmployeeDataService
+ ) { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee.module.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee.module.ts
new file mode 100644
index 0000000..c139822
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee.module.ts
@@ -0,0 +1,59 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+
+import { FormsModule } from '@angular/forms';
+import { AngularMaterialModule } from '@app_core/components/angular-material.module';
+import { DxButtonModule, DxDataGridModule, DxFileUploaderModule, DxPieChartModule, DxTemplateModule, DxTooltipModule } from 'devextreme-angular';
+import { EmployeeAttributeComponent } from './employee-detail/employee-attribute/employee-attribute.component';
+import { EmployeeContentComponent } from './employee-detail/employee-content/employee-content.component';
+import { EmployeeDepartmentComponent } from './employee-detail/employee-department/employee-department.component';
+import { EmployeeToDepartmentPopupeditComponent } from './employee-detail/employee-department/employee-department.popupedit/employee-department.popupedit.component';
+import { EmployeeDetailComponent } from './employee-detail/employee-detail.component';
+import { EmployeeWebappComponent } from './employee-detail/employee-webapp/employee-webapp.component';
+import { EmployeeToWebAppPopupeditComponent } from './employee-detail/employee-webapp/employee-webapp.popupedit/employee-webapp.popupedit.component';
+import { EmployeeFilterComponent } from './employee-list/employee-filter/employee-filter.component';
+import { EmployeeListComponent } from './employee-list/employee-list.component';
+import { EmployeeComponent } from './employee.component';
+import { EmployeeRoutingModule } from './employee.routing.module';
+import { HenselSelectionComponent } from '@app_core/components/hensel-selection/hensel-selection.component';
+import { HenselInputComponent } from '@app_core/components/hensel-input/hensel-input.component';
+import { NgxMaskDirective, NgxMaskPipe } from 'ngx-mask';
+import { HenselMaskDecimalDirective } from '@app_core/directives/hensel-decimal.directive';
+import { HenselValidator } from '@app_core/validators/hensel-validator.directive';
+
+
+@NgModule({
+ declarations: [
+ EmployeeComponent,
+ EmployeeListComponent,
+ EmployeeContentComponent,
+ EmployeeAttributeComponent,
+ EmployeeDetailComponent,
+ EmployeeFilterComponent,
+ EmployeeWebappComponent,
+ EmployeeDepartmentComponent,
+ EmployeeToDepartmentPopupeditComponent,
+ EmployeeToWebAppPopupeditComponent
+ ],
+ imports: [
+ CommonModule,
+ EmployeeRoutingModule,
+ AngularMaterialModule,
+ DxDataGridModule,
+ FormsModule,
+ HenselSelectionComponent,
+ HenselInputComponent,
+ HenselMaskDecimalDirective,
+ HenselValidator,
+ DxFileUploaderModule,
+ DxButtonModule,
+ DxTooltipModule,
+ DxTemplateModule,
+ DxPieChartModule,
+ NgxMaskDirective,
+ NgxMaskPipe,
+ ],
+ providers: [],
+ exports: []
+})
+export class EmployeeModule { }
diff --git a/ClientApp/staff-db-ui/src/app/modules/employee/employee.routing.module.ts b/ClientApp/staff-db-ui/src/app/modules/employee/employee.routing.module.ts
new file mode 100644
index 0000000..c97529c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/modules/employee/employee.routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { EmployeeComponent } from './employee.component';
+import { AuthGuard } from '@app_core/services/authguard';
+
+const routes: Routes = [
+ {
+ path: '**',
+ component: EmployeeComponent,
+ canActivate: [AuthGuard]
+ },
+];
+
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class EmployeeRoutingModule { }
diff --git a/ClientApp/staff-db-ui/src/app/shared/app.consts.ts b/ClientApp/staff-db-ui/src/app/shared/app.consts.ts
new file mode 100644
index 0000000..4f59b41
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/app.consts.ts
@@ -0,0 +1,97 @@
+import { IENVIRONMENT } from '@app_core/injection-tokens';
+import { ACCOUNT_PAGE, IAppPage, LOGIN_PAGE } from '@app_core/services/globals';
+
+export const SUPPORTED_LANGUAGES = ['de', 'en'];
+
+declare const environment: IENVIRONMENT;
+export const APP_TITLE: string = environment['APP_TITLE'] ?? 'StaffDB';
+export const cnst_DefaultCulture = environment.culture ?? 'de-DE';
+export const cnst_DefaultLanguage = environment.language ?? 'de';
+
+// page description, wich is used for routing as well for preparing routings menus and intern for page loading
+export const APP_PAGES: IAppPage[] = [
+ {
+ caption: 'Mitarbeiter',
+ path: 'employee',
+ loadChildren: () => import('@app_modules/employee/employee.module').then(m => m.EmployeeModule),
+ icon: '',
+ messageCaption: 'Employee',
+ },
+ {
+ caption: 'Abteilungen',
+ path: 'departments',
+ loadChildren: () => import('@app_modules/department/department.module').then(m => m.DepartmentModule),
+ icon: '',
+ messageCaption: 'Department',
+ },
+ ACCOUNT_PAGE,
+ LOGIN_PAGE,
+];
+
+// named constants to access the arry APP_PAGES
+
+export const enum EN_AppPages {
+ Employee = 0,
+ Department = 1,
+ Settings = 2,
+ Login = 3,
+}
+
+// named constants with numbers of http requests of data loading for every page for maintain of spinner
+
+export const enum EN_HttpQueriesCount4Page {
+ Employee = 1,
+ Department = 1,
+ Login = 10, //no of quires in load stammdata
+}
+
+export function getPageIndex(page: string): number {
+ return APP_PAGES.findIndex((pg) => pg.path === page);
+}
+
+
+export enum EN_AppEntities {
+ //-- base data entities
+ Employee = 'employee',
+ CostCentre = 'costcentre',
+ Vendor = 'vendor',
+ EmployeeStatus = 'employeestatus',
+ Rang = 'rang',
+ DocumentArt = 'documentart',
+ Project = 'project',
+ Department = 'department',
+ WindreamSearch = 'windreamsearch',
+ WindreamIndex = 'windreamindex',
+ WindreamIndexToWindreamSearchToDepartment = 'windreamindextowindreamsearchtodepartment',
+ WindreamSearchToDepartment = 'windreamsearchtodepartment',
+ WindreamSearchItemToWindreamSearchToDepartment = 'windreamsearchitemtowindreamsearchtodepartment',
+ WindreamSearchItem = 'windreamsearchitem',
+ DocumentArtToDepartment = 'documentarttodepartment',
+ EmployeeToDepartment = 'employeetodepartment',
+ EmployeeToWebapp = 'employeetowebapp',
+ WebApp = 'webapp',
+ WebAppRole = 'webapprole',
+ WebAppToDepartment = 'webapptodepartment',
+ WebAppToWebAppRole = 'webapptowebapprole',
+ EmployeeAttribute = 'employeeattribute',
+ EmployeeToAttribute = 'employeetoattribute',
+ WebAppAdditionalRole = 'webappadditionalrole',
+ WebAppToWebAppAdditionalRole = 'webapptowebappadditionalrole',
+ WindreamSearchToDepartmentCopyWindreamTile = 'windreamSearchToDepartment/CopyWindreamTile',
+ DepartmentCopyWindreamTiles = 'department/copyWindreamTiles',
+ Subsidiary = 'Subsidiary'
+}
+
+
+export enum EN_EmployeeStatus {
+ MainFunction = 1,
+ AdditionalFunction = 2,
+}
+
+
+export enum EN_EmployeeRang {
+ Mitarbeiter = 4,
+}
+
+
+export const cnst_LoadedEntitiesExpiresInMs = 30000; //30s
diff --git a/ClientApp/staff-db-ui/src/app/shared/app.types.ts b/ClientApp/staff-db-ui/src/app/shared/app.types.ts
new file mode 100644
index 0000000..ca858dd
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/app.types.ts
@@ -0,0 +1,4 @@
+import { BaseEntityCallBack, ErrorCallBack } from '@app_core/models/generics/baseentity';
+
+export declare type AppBaseEntityCallBack = BaseEntityCallBack;
+export declare type AppErrorCallBack = ErrorCallBack;
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/at.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/at.svg
new file mode 100644
index 0000000..99f7814
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/at.svg
@@ -0,0 +1,5 @@
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/au.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/au.svg
new file mode 100644
index 0000000..9ba68fb
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/au.svg
@@ -0,0 +1,24 @@
+
+
\ No newline at end of file
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/de.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/de.svg
new file mode 100644
index 0000000..834f82f
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/de.svg
@@ -0,0 +1,5 @@
+
\ No newline at end of file
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/fr.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/fr.svg
new file mode 100644
index 0000000..a4bded5
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/fr.svg
@@ -0,0 +1,2 @@
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/gb.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/gb.svg
new file mode 100644
index 0000000..56487b0
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/gb.svg
@@ -0,0 +1,16 @@
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/ko.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/ko.svg
new file mode 100644
index 0000000..dbec9be
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/ko.svg
@@ -0,0 +1,13 @@
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/my.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/my.svg
new file mode 100644
index 0000000..79cebc2
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/my.svg
@@ -0,0 +1,11 @@
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/us.svg b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/us.svg
new file mode 100644
index 0000000..c31e895
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/flags/us.svg
@@ -0,0 +1,26 @@
+
+
\ No newline at end of file
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_bright.ico b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_bright.ico
new file mode 100644
index 0000000..bc6c2d1
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_bright.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color.ico b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color.ico
new file mode 100644
index 0000000..d65b48a
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color3d.ico b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color3d.ico
new file mode 100644
index 0000000..917acf3
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_color3d.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_red.ico b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_red.ico
new file mode 100644
index 0000000..7e7f832
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_red.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_white.ico b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_white.ico
new file mode 100644
index 0000000..ff4f496
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/assets/icons/hr-logo_white.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/json/package.json b/ClientApp/staff-db-ui/src/app/shared/core/assets/json/package.json
new file mode 100644
index 0000000..8c13a75
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/json/package.json
@@ -0,0 +1,54 @@
+{
+ "name": "@hensel-recycling/hr-core",
+ "version": "14.2.3",
+ "scripts": {
+ "ng": "ng",
+ "start": "ng serve",
+ "build": "ng build",
+ "watch": "ng build --watch --configuration development",
+ "test": "ng test",
+ "lint": "ng lint",
+ "e2e": "ng e2e",
+ "reinstall:packages": "rm -rf node_modules dist && npm cache clean --force && rm package-lock.json && npm install",
+ "win_reinstall:packages": "rd /s /q node_modules && npm cache clean --force && del package-lock.json && npm install",
+ "add_pwa": "ng add @angular/pwa@latest"
+ },
+ "peerDependencies": {
+ "@angular/cdk": "^14.1.0",
+ "@angular/common": "^14.1.0",
+ "@angular/core": "^14.1.0",
+ "@angular/forms": "^14.1.0",
+ "@angular/material": "^14.1.0",
+ "@angular/platform-browser-dynamic": "^14.1.0",
+ "@angular/router": "^14.1.0",
+ "@angular/service-worker": "^14.1.1",
+ "@ngx-translate/core": "latest",
+ "@sentry/angular": "latest",
+ "angular-in-memory-web-api": "^0.14.0",
+ "devextreme": "latest",
+ "devextreme-angular": "latest",
+ "moment": "latest",
+ "ngx-device-detector": "^4.0.1",
+ "ngx-spinner": "^14.0.0",
+ "ngx-translate-multi-http-loader": "^8.0.2",
+ "ngx-webcam": "latest",
+ "rxjs": "latest",
+ "zone.js": "latest"
+ },
+ "devDependencies": {
+ "@angular-devkit/build-angular": "^14.1.0",
+ "@angular/cli": "^14.1.0",
+ "@angular/compiler-cli": "^14.1.0",
+ "@angular/language-service": "^14.1.0",
+ "@types/node": "latest",
+ "codelyzer": "latest",
+ "ng-packagr": "^14.2.0",
+ "ts-node": "latest",
+ "tslint": "latest",
+ "typescript": "^4.8.3"
+ },
+ "keywords": [
+ "hr-core"
+ ],
+ "author": "itentwicklung@hensel-recycling.com"
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/de.json b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/de.json
new file mode 100644
index 0000000..22588e9
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/de.json
@@ -0,0 +1,110 @@
+{
+ "core.btn.ok": "Ok",
+ "core.btn.yes": "Ja",
+ "core.btn.no": "Nein",
+ "core.btn.cancel": "Abbrechen",
+ "core.btn.apply": "Übernehmen",
+ "core.btn.reset": "Reset",
+ "core.hint.reset": "Zurücksetzen",
+ "core.hint.undo": "Änderungen verwerfen",
+ "core.btn.undo": "Verwerfen",
+ "core.btn.search": "Suchen",
+
+ "core.dropdown-option.all": "< Alle >",
+ "core.dropdown-option.none": "< Keine >",
+
+ "core.caption.login": "Login",
+ "core.caption.hidepassword": "Hide password",
+ "core.caption.registration": "Anmeldung",
+ "core.caption.logout": "Logout",
+ "core.caption.config": "Einstellungen",
+ "core.caption.version": "Version",
+ "core.caption.username": "Benutzername",
+ "core.caption.password": "Passwort",
+ "core.caption.account": "Konto",
+ "core.caption.all": "Alle",
+ "core.caption.none": "Keine",
+ "core.caption.serverinfo-pollinginterval": "Abstang für Erneuerung von Serverver Info (Sek., 0-nie)",
+
+ "core.msg.saving": "Speichern {{value}}...",
+ "core.msg.saved": "Gespeichert {{value}}",
+ "core.msg.loading": "Laden {{value}}...",
+ "core.msg.loaded": "Geladen {{value}}: {{count}}",
+ "core.msg.loggedon": "Benutzeranmeldung für {{value}} war erfolgreich",
+ "core.msg.renewJWT": "Versuche zu verlängern von JWT",
+ "core.msg.waitingconnecton": "Warte auf Verbindung...",
+ "core.msg.checkuser": "Benutzer wird überprüft...",
+ "core.msg.greeting": "Hallo",
+ "core.msg.update": "Bitte aktualisieren!",
+ "core.hint.update": "Klicke um die Version zu aktualisieren",
+
+ "core.error.loading": "Fehler beim Laden von {{value}}",
+ "core.error.saving": "Fehler beim Speichern von {{value}}",
+ "core.error.deleting": "Fehler beim Löschen von {{value}}",
+ "core.error.nouserrole": "Keine Benutzerrole ist zugewiesen!",
+ "core.error.logon": "Anmeldung ist fehlgeschlagen!",
+ "core.error.logonnotpossible": "{{value}}Anmeldung ist nicht möglich!",
+ "core.error.disclaimernotconfirmed": "Haftungsausschluss muss bestätigt werden!",
+
+ "core.msgbox.header.cancel": "{{value}}",
+ "core.msgbox.body.cancel": "Sollen Änderungen gespeichert werden?",
+ "core.msgbox.header.delete": "{{value}}",
+ "core.msgbox.body.delete": "Soll {{value}} gelöscht werden?",
+ "core.msgbox.header.connect": "Verbindungsaufbau",
+ "core.msgbox.body.connect": "Keine Verbindung zum Server kann aufgebaut werden. Bitte wenden sie sich an IT-Entwicklung",
+
+ "core.grid.nodata": "Keine Daten vorhanden",
+ "core.hdatepicker.dateoutofrange": "Das Datum ist ausser zulässigem Bereich",
+
+ "core.hensel-selection.nohits": "Keine Treffer gefunden",
+ "core.hensel-selection.selectedfirst": "Selektierte zuerst",
+ "core.hensel-selection.processlist": "Liste bearbeiten",
+ "core.hensel-selection.inputminsybols": "Für Auswahl mind. {{value}} Zeichen eingeben",
+
+ "core.hwebcam.delete": "Foto löschen",
+ "core.hwebcam.takepicture": "Foto aufnehmen",
+
+ "core.footer.status": "Status",
+ "core.footer.noconnection": "Keine Verbindung ist vorhanden !!!",
+ "core.footer.lastloading": "Letzte Datenabruf",
+ "core.footer.loginexpires": "Anmeldung läuft ab in",
+ "core.footer.days": "Tag(e)",
+ "core.footer.hours": "Std.",
+ "core.footer.mins": "Min.",
+ "core.footer.secs": "Sek.",
+
+ "core.account.caption.price": "Preis",
+ "core.account.caption.weight" : "Gewicht",
+
+ "core.caption.date": "Datum",
+ "core.caption.user": "Benutzer",
+ "core.caption.role": "Rolle",
+ "core.caption.myaccount": "Mein Konto",
+ "core.caption.disclaimer": "Haftungsausschluss",
+
+ "core.caption.addsettings" : "Admineinstellungen",
+ "core.caption.showstatusbar" : "Statuszeile anzeigen",
+ "core.caption.showids" : "Ids anzeigen",
+ "core.caption.language" : "Sprache",
+ "core.caption.regionformat" : "Regionales Format",
+ "core.caption.name": "Name",
+ "core.caption.userloginname": "Benutzername",
+
+ "core.caption.country-ge": "Deutschland",
+ "core.caption.country-at": "Österrecih",
+ "core.caption.country-gb": "Grossbritanien",
+ "core.caption.country-us": "United States",
+ "core.caption.country-au": "Australien",
+ "core.caption.country-fr": "Frankreich",
+ "core.caption.country-kr": "Korea",
+ "core.caption.country-my": "Malaysia",
+
+ "core.caption.lang-ge": "Deutsch",
+ "core.caption.lang-at": "Deutsch",
+ "core.caption.lang-gb": "Englisch",
+ "core.caption.lang-us": "Englisch",
+ "core.caption.lang-au": "Englisch",
+ "core.caption.lang-fr": "Französisch",
+ "core.caption.lang-kr": "Koreanisch",
+ "core.caption.lang-my": "Malaiisch"
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/en.json b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/en.json
new file mode 100644
index 0000000..d47f49c
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/en.json
@@ -0,0 +1,110 @@
+{
+ "core.btn.ok": "Ok",
+ "core.btn.yes": "Yes",
+ "core.btn.no": "No",
+ "core.btn.cancel": "Cancel",
+ "core.btn.apply": "Apply",
+ "core.btn.reset": "Reset",
+ "core.hint.reset": "Reset",
+ "core.hint.undo": "Discard changes",
+ "core.btn.undo": "Discard",
+ "core.btn.search": "Search",
+
+ "core.dropdown-option.all": "< All >",
+ "core.dropdown-option.none": "< None >",
+
+ "core.caption.login": "Login",
+ "core.caption.hidepassword": "Hide password",
+ "core.caption.registration": "Log in",
+ "core.caption.logout": "Logout",
+ "core.caption.config": "Configuration",
+ "core.caption.version": "Version",
+ "core.caption.username": "Username",
+ "core.caption.password": "Password",
+ "core.caption.account": "Account",
+ "core.caption.all": "All",
+ "core.caption.none": "None",
+ "core.caption.serverinfo-pollinginterval": "Interval to refresh of Serverver Info (sec., 0-never)",
+
+ "core.msg.saving": "Saving {{value}}...",
+ "core.msg.saved": "Saved {{value}}",
+ "core.msg.loading": "Loading {{value}}...",
+ "core.msg.loaded": "Loaded {{value}}: {{count}}",
+ "core.msg.loggedon": "Logon for {{value}} succeeded",
+ "core.msg.renewJWT": "Try to renew JWT",
+ "core.msg.waitingconnecton": "Waiting connection...",
+ "core.msg.checkuser": "Check user...",
+ "core.msg.greeting": "Hello",
+ "core.msg.update": "Please update!",
+ "core.hint.update": "Click to update the version",
+
+ "core.error.loading": "Error during loading of {{value}}",
+ "core.error.saving": "Error during saving of {{value}}",
+ "core.error.deleting": "Error during deleting of {{value}}",
+ "core.error.nouserrole": "User is assigned no role!",
+ "core.error.logon": "Logon failed!",
+ "core.error.logonnotpossible": "{{value}}Logon is not possible!",
+ "core.error.disclaimernotconfirmed": "Disclaimer must be confirmed!",
+
+ "core.msgbox.header.cancel": "{{value}}",
+ "core.msgbox.body.cancel": "Save changes?",
+ "core.msgbox.header.delete": "{{value}}",
+ "core.msgbox.body.delete": "Delete {{value}}?",
+ "core.msgbox.header.connect": "Establish connection",
+ "core.msgbox.body.connect": "The server connot be connected. Please contact IT-Development",
+
+ "core.grid.nodata": "No data",
+ "core.hdatepicker.dateoutofrange": "The date is out of range",
+
+ "core.hensel-selection.nohits": "No hits",
+ "core.hensel-selection.selectedfirst": "Selected first",
+ "core.hensel-selection.processlist": "Edit list",
+ "core.hensel-selection.inputminsybols": "For selection input at least {{value}} symbols",
+
+ "core.hwebcam.delete": "Delete picture",
+ "core.hwebcam.takepicture": "Take picture",
+
+ "core.footer.status": "Status",
+ "core.footer.noconnection": "No connectoin to the server !!!",
+ "core.footer.lastloading": "Last Dataloading",
+ "core.footer.loginexpires": "Login expires in",
+ "core.footer.days": "Day(s)",
+ "core.footer.hours": "Hr(s)",
+ "core.footer.mins": "Min(s)",
+ "core.footer.secs": "Sec(s)",
+
+ "core.account.caption.price": "Price",
+ "core.account.caption.weight" : "Weight",
+
+ "core.caption.date": "Date",
+ "core.caption.user": "User",
+ "core.caption.role": "Role",
+ "core.caption.myaccount": "My Account",
+ "core.caption.disclaimer": "Disclaimer",
+
+ "core.caption.addsettings" : "Admin Settings",
+ "core.caption.showstatusbar" : "Show Statusbar",
+ "core.caption.showids" : "Show Ids",
+ "core.caption.language" : "Language",
+ "core.caption.regionformat" : "Regional Format",
+ "core.caption.name": "Name",
+ "core.caption.userloginname": "Loginname",
+
+ "core.caption.country-ge": "Germany",
+ "core.caption.country-at": "Austria",
+ "core.caption.country-gb": "United Kingdom",
+ "core.caption.country-us": "United States",
+ "core.caption.country-au": "Australia",
+ "core.caption.country-fr": "France",
+ "core.caption.country-kr": "Korea",
+ "core.caption.country-my": "Malaysia",
+
+ "core.caption.lang-ge": "German",
+ "core.caption.lang-at": "German",
+ "core.caption.lang-gb": "English",
+ "core.caption.lang-us": "English",
+ "core.caption.lang-au": "English",
+ "core.caption.lang-fr": "French",
+ "core.caption.lang-kr": "Korean",
+ "core.caption.lang-my": "Malay"
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/fr.json b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/fr.json
new file mode 100644
index 0000000..a3ab918
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/assets/translate-core/fr.json
@@ -0,0 +1,107 @@
+{
+ "core.btn.ok": "Ok",
+ "core.btn.yes": "Yes",
+ "core.btn.no": "No",
+ "core.btn.cancel": "Cancel",
+ "core.btn.apply": "Accept",
+ "core.btn.reset": "Reset",
+ "core.hint.reset": "Reset",
+ "core.btn.search": "Search",
+
+ "core.dropdown-option.all": "< All >",
+ "core.dropdown-option.none": "< None >",
+
+ "core.caption.login": "Login",
+ "core.caption.registration": "Log in",
+ "core.caption.logout": "Logout",
+ "core.caption.config": "Configuration",
+ "core.caption.version": "Version",
+ "core.caption.username": "Username",
+ "core.caption.password": "Password",
+ "core.caption.account": "Account",
+ "core.caption.all": "All",
+ "core.caption.none": "None",
+ "core.caption.serverinfo-pollinginterval": "Interval to refresh of Serverver Info (sec., 0-never)",
+
+ "core.msg.saving": "Saving {{value}}...",
+ "core.msg.saved": "Saved {{value}}",
+ "core.msg.loading": "Loading {{value}}...",
+ "core.msg.loaded": "Loaded {{value}}: {{count}}",
+ "core.msg.loggedon": "Logon for {{value}} succeeded",
+ "core.msg.renewJWT": "Try to renew JWT",
+ "core.msg.waitingconnecton": "Waiting connection...",
+ "core.msg.checkuser": "Check user...",
+ "core.msg.greeting": "Hello",
+ "core.msg.update": "Please update!",
+ "core.hint.update": "Click to update the version",
+
+ "core.error.loading": "Error during loading of {{value}}",
+ "core.error.saving": "Error during saving of {{value}}",
+ "core.error.deleting": "Error during deleting of {{value}}",
+ "core.error.nouserrole": "User is assigned no role!",
+ "core.error.logon": "Logon failed!",
+ "core.error.logonnotpossible": "{{value}}Logon is not possible!",
+ "core.error.disclaimernotconfirmed": "Disclaimer must be confirmed!",
+
+ "core.msgbox.header.cancel": "Cancelling of processing of {{value}}",
+ "core.msgbox.body.cancel": "{{value}} was changed. Should changes be saved?",
+ "core-confirmmsgheader_delete": "Deleting of {{value}}",
+ "core.msgbox.body.delete": "Should {{value}} be deleted?",
+ "core-confirmmsgheader_connect": "Establish connection",
+ "core.msgbox.body.connect": "The server connot be connected. Please contact IT-Development",
+
+ "core.grid.nodata": "No data",
+ "core.hdatepicker.dateoutofrange": "The date is out of range",
+
+ "core.hensel-selection.nohits": "No hits",
+ "core.hensel-selection.selectedfirst": "Selected first",
+ "core.hensel-selection.processlist": "Edit list",
+ "core.hensel-selection.inputminsybols": "For selection input at least {{value}} symbols",
+
+ "core.hwebcam.takepicture": "Take picture",
+ "core.hwebcam.delete": "Delete picture",
+
+ "core.footer.status": "Status",
+ "core.footer.noconnection": "No connectoin to the server !!!",
+ "core.footer.lastloading": "Last Dataloading",
+ "core.footer.loginexpires": "Login expires in",
+ "core.footer.days": "Day(s)",
+ "core.footer.hours": "Hr(s)",
+ "core.footer.mins": "Min(s)",
+ "core.footer.secs": "Sec(s)",
+
+ "core.account.caption.price": "Price",
+ "core.account.caption.weight" : "Weight",
+
+ "core.caption.date": "Date",
+ "core.caption.user": "User",
+ "core.caption.role": "Role",
+ "core.caption.myaccount": "My Account",
+ "core.caption.disclaimer": "Disclaimer",
+
+ "core.caption.addsettings" : "Admin Settings",
+ "core.caption.showstatusbar" : "Show Statusbar",
+ "core.caption.showids" : "Show Ids",
+ "core.caption.language" : "Language",
+ "core.caption.regionformat" : "Regional Format",
+ "core.caption.name": "Name",
+ "core.caption.userloginname": "Loginname",
+
+ "core.caption.country-ge": "Germany",
+ "core.caption.country-at": "Austria",
+ "core.caption.country-gb": "United Kingdom",
+ "core.caption.country-us": "United States",
+ "core.caption.country-au": "Australia",
+ "core.caption.country-fr": "France",
+ "core.caption.country-kr": "Korea",
+ "core.caption.country-my": "Malaysia",
+
+ "core.caption.lang-ge": "German",
+ "core.caption.lang-at": "German",
+ "core.caption.lang-gb": "English",
+ "core.caption.lang-us": "English",
+ "core.caption.lang-au": "English",
+ "core.caption.lang-fr": "French",
+ "core.caption.lang-kr": "Korean",
+ "core.caption.lang-my": "Malay"
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/account/account-routing.module.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account-routing.module.ts
new file mode 100644
index 0000000..24c9026
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { AuthGuard } from '../../services/authguard';
+import { AccountComponent } from './account.component';
+
+
+const routes: Routes = [
+ {
+ path: '',
+ component: AccountComponent,
+ canActivate: [AuthGuard]
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class AccountRoutingModule { }
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.html b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.html
new file mode 100644
index 0000000..5b93632
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.html
@@ -0,0 +1,86 @@
+
+
+
+
+
+ {{'core.caption.myaccount' | translate}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{'core.caption.addsettings' | translate}}
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.scss
new file mode 100644
index 0000000..eb15301
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.scss
@@ -0,0 +1,149 @@
+.ConfigContainer {
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-rows: auto auto minmax(0, 1fr);
+ grid-template-columns: minmax(0, 1fr);
+ grid-template-areas:
+ "profile"
+ "other-settings"
+ "admin-settings"
+ ;
+ overflow: hidden;
+ grid-gap: 0.9em;
+}
+
+.profile {
+ grid-area: profile;
+}
+
+.admin-settings {
+ grid-area: admin-settings;
+ height: fit-content;
+}
+
+.other-settings {
+ grid-area: other-settings;
+}
+
+.admin-content{
+ display: grid;
+ grid-template-columns: 250px 1fr;
+ grid-template-areas: "admin-std admin-custom";
+ grid-gap: 0.5em;
+ column-gap: 2em;
+ overflow: hidden;
+}
+
+.admin-custom {
+ grid-area: admin-custom;
+}
+
+.setting-card {
+ margin-left: 1px;
+ margin-right: 2px !important;
+ margin-top: 1px;
+ margin-bottom: 1px;
+}
+
+.abstand {
+ margin-bottom: 10px;
+}
+
+.logout {
+ margin-left: auto;
+ font-size: large;
+ padding-right: 15px !important;
+ padding-left: 15px !important;}
+
+.logout-icon {
+ vertical-align: middle;
+ margin-right: 10px;
+}
+
+.profile-content {
+ width: 100%;
+ height: calc(100% - 38px);
+ display: grid;
+ grid-template-rows: auto auto auto;
+ grid-template-columns: 250px auto 1fr;
+ grid-template-areas:
+ "user-name culture_section profile-custom"
+ "user-loginname culture_section profile-custom"
+ "language culture_section profile-custom";
+ overflow: hidden;
+ grid-gap: 0.5em;
+ column-gap: 2em;
+}
+
+.profile-custom {
+ grid-area: profile-custom;
+}
+
+.user-name {
+ grid-area: user-name;
+}
+
+.user-loginname {
+ grid-area: user-loginname;
+}
+
+.culture_section {
+ grid-area: culture_section;
+ width: 100%;
+ height: 100%;
+ display: grid;
+ grid-template-rows: repeat(4, auto);
+ grid-template-columns: 1fr 1fr;
+ grid-template-areas:
+ "culture culture"
+ "sample-date-capt sample-date"
+ "sample-weight-capt sample-weight"
+ "sample-price-capt sample-price";
+ overflow: hidden;
+ grid-gap: 0.5em;
+ column-gap: 1em;
+}
+
+
+.culture {
+ grid-area: culture;
+ width: 250px;
+}
+
+.user-name {
+ grid-area: user-name;
+}
+
+.sample-date-capt {
+ grid-area: sample-date-capt;
+}
+
+.sample-date {
+ grid-area: sample-date;
+}
+
+.sample-weight-capt {
+ grid-area: sample-weight-capt;
+}
+
+.sample-weight {
+ grid-area: sample-weight;
+}
+
+.sample-price-capt {
+ grid-area: sample-price-capt;
+}
+
+.sample-price {
+ grid-area: sample-price;
+}
+
+
+.language {
+ grid-area: language;
+}
+
+::ng-deep .ConfigContainer .mat-card-header-text {
+ margin-left: 0px;
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.ts
new file mode 100644
index 0000000..6854aec
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.component.ts
@@ -0,0 +1,80 @@
+import { Component, inject, Inject, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { SUPPORTED_CULTURES_TOKEN, SUPPORTED_LANGUAGES_TOKEN } from '../..//injection-tokens';
+import * as Cnst from '../../consts';
+import { Globals } from '../../services/globals';
+import { CoreUser } from '../../models/coreuser';
+import { AuthorizeService } from '../../services/authorize.service';
+import { RepositoryService } from '../../services/http/repository.service';
+import { LocaleService } from '../../services/localization/locale.service';
+import { ServerInfoService } from '../../services/serverinfo.service';
+import * as Utils from '../../utils';
+
+@Component({
+ selector: 'app-account',
+ templateUrl: './account.component.html',
+ styleUrls: ['./account.component.scss']
+})
+export class AccountComponent implements OnInit {
+ public noneCaption: string = Cnst.EN_DropDownConst4Filter.NoneCaption;
+ public noneValue: number = Cnst.EN_DropDownConst4Filter.NoneValueInt;
+ public webAppIdList: number[] = [];
+ public usedCultures: Cnst.SupportedCulture[];
+ public usedLanguages: Cnst.SupportedLanguage[];
+ public today: Date;
+ public currencySymbol: string;
+ public get user(): CoreUser {
+ return this.authService.user;
+ }
+
+ public globals: Globals = inject(Globals);
+ protected router: Router = inject(Router);
+
+ public authService: AuthorizeService = inject(AuthorizeService);
+ public serverInfoService: ServerInfoService = inject(ServerInfoService);
+ public localeService: LocaleService = inject(LocaleService);
+ protected repositoryService: RepositoryService = inject(RepositoryService);
+ protected APP_SUPPORTED_CULTURES: string[] = inject(SUPPORTED_CULTURES_TOKEN);
+ protected APP_SUPPORTED_LANGUAGES: string[] = inject(SUPPORTED_LANGUAGES_TOKEN);
+
+
+ constructor(
+ ) {
+ }
+
+
+ ngOnInit() {
+ this.usedLanguages = Cnst.SUPPORTED_LANGUAGES.filter((lang: Cnst.SupportedLanguage) => Utils.isLanguageSupported(lang.langCode, this.APP_SUPPORTED_LANGUAGES));
+ this.usedCultures = Cnst.SUPPORTED_CULTURES.filter((cltr: Cnst.SupportedCulture) => Utils.isCultureSupported(cltr.culture, this.APP_SUPPORTED_CULTURES));
+ this.today = Utils.today();
+ this.currencySymbol = Utils.getCurrencySymbol(this.localeService.currentCulture);
+ }
+
+ logout() {
+ this.authService.logout(true);
+ }
+
+ setLocale(culture: string) {
+ this.localeService.currentCulture = culture;
+ this.currencySymbol = Utils.getCurrencySymbol(this.localeService.currentCulture);
+ this.saveCultureLanguage();
+ }
+
+ setLangauge(lang: string) {
+ this.localeService.currentLanguage = lang;
+ this.saveCultureLanguage();
+ }
+
+
+ saveCultureLanguage() {
+ this.user.culture = this.localeService.currentCulture;
+ this.user.language = this.localeService.currentLanguage;
+ this.user.save(this.repositoryService, null, null, null, 'culture');
+ }
+
+
+ goHome() {
+ this.router.navigate(['/' + this.globals.mainPage.path]);
+ }
+
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.module.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.module.ts
new file mode 100644
index 0000000..e9f9ec2
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/account/account.module.ts
@@ -0,0 +1,31 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { AccountRoutingModule } from './account-routing.module';
+import { AccountComponent } from './account.component';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { DxDataGridModule } from 'devextreme-angular';
+import { DxoSearchPanelModule } from 'devextreme-angular/ui/nested';
+import { TranslateModule } from '@ngx-translate/core';
+import { AngularMaterialModule } from '../angular-material.module';
+import { HenselSelectionComponent } from '../hensel-selection/hensel-selection.component';
+import { HenselInputComponent } from '../hensel-input/hensel-input.component';
+
+
+@NgModule({
+ declarations: [AccountComponent],
+ imports: [
+ CommonModule,
+ AccountRoutingModule,
+ AngularMaterialModule,
+ ReactiveFormsModule,
+ FormsModule,
+ DxDataGridModule,
+ DxoSearchPanelModule,
+ HenselSelectionComponent,
+ HenselInputComponent,
+ TranslateModule
+ ],
+ exports: [AccountComponent]
+})
+export class AccountModule { }
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material-index.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material-index.ts
new file mode 100644
index 0000000..c3e96ac
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material-index.ts
@@ -0,0 +1,53 @@
+export {
+ MatLegacyOptionSelectionChange as MatOptionSelectionChange,
+ _countGroupLabelsBeforeLegacyOption as _countGroupLabelsBeforeOption,
+ _getLegacyOptionScrollPosition as _getOptionScrollPosition
+} from '@angular/material/legacy-core';
+export {
+ MatLegacyAutocomplete as MatAutocomplete,
+ MatLegacyAutocompleteTrigger as MatAutocompleteTrigger,
+ MatLegacyAutocompleteModule as MatAutocompleteModule
+} from '@angular/material/legacy-autocomplete';
+export { MatNativeDateModule } from '@angular/material/core';
+export { MatToolbarModule } from '@angular/material/toolbar';
+export { MatButtonToggleModule } from '@angular/material/button-toggle';
+export {
+ MatLegacySnackBarModule as MatSnackBarModule,
+ MatLegacySnackBar as MatSnackBar,
+ MatLegacySnackBarConfig as MatSnackBarConfig,
+ MatLegacySnackBarHorizontalPosition as MatSnackBarHorizontalPosition,
+ MatLegacySnackBarRef as MatSnackBarRef,
+ MatLegacySnackBarVerticalPosition as MatSnackBarVerticalPosition,
+ LegacyTextOnlySnackBar as TextOnlySnackBar
+} from '@angular/material/legacy-snack-bar';
+export { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
+export { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
+export { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+export {
+ MatLegacyDialogModule as MatDialogModule,
+ MatLegacyDialogRef as MatDialogRef,
+ MatLegacyDialog as MatDialog,
+ MatLegacyDialogConfig as MatDialogConfig,
+ MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA
+ } from '@angular/material/legacy-dialog';
+export { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+export { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
+export { MatLegacyPaginatorModule as MatPaginatorModule } from '@angular/material/legacy-paginator';
+export { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
+export { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+export { MatDatepickerModule } from '@angular/material/datepicker';
+export { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+export { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+export {
+ MatLegacyFormFieldModule as MatFormFieldModule,
+ MatLegacyFormField as MatFormField,
+ MAT_LEGACY_FORM_FIELD_DEFAULT_OPTIONS as MAT_FORM_FIELD_DEFAULT_OPTIONS
+} from '@angular/material/legacy-form-field';
+export { MatGridListModule } from '@angular/material/grid-list';
+export { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
+export { MatBadgeModule } from '@angular/material/badge';
+export { MatSidenavModule } from '@angular/material/sidenav';
+export { MatIconModule } from '@angular/material/icon';
+export { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio';
+export { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
+export { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material.module.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material.module.ts
new file mode 100644
index 0000000..14dd105
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/angular-material.module.ts
@@ -0,0 +1,100 @@
+import { NgModule } from '@angular/core';
+/*import {
+ MatAutocompleteModule, MatBadgeModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+ MatDialogModule, MatFormFieldModule, MatGridListModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatPaginatorModule,
+ MatProgressSpinnerModule, MatRadioModule, MatSelectModule, MatSidenavModule, MatSnackBarModule, MatTableModule, MatTabsModule, MatToolbarModule, MatTooltipModule
+} from './angular-material-index';
+*/
+import { CommonModule } from '@angular/common';
+import { MatNativeDateModule } from '@angular/material/core';
+import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
+import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
+import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
+import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
+import { MatLegacyPaginatorModule as MatPaginatorModule } from '@angular/material/legacy-paginator';
+import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
+import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
+import { MatGridListModule } from '@angular/material/grid-list';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
+import { MatBadgeModule } from '@angular/material/badge';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatIconModule } from '@angular/material/icon';
+import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio';
+import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
+import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
+
+@NgModule({
+/* imports: [
+ MatSnackBarModule,
+ MatTabsModule,
+ MatMenuModule,
+ CommonModule,
+ MatButtonModule,
+ MatToolbarModule,
+ MatIconModule,
+ MatSidenavModule,
+ MatBadgeModule,
+ MatListModule,
+ MatGridListModule,
+ MatFormFieldModule,
+ MatInputModule,
+ MatSelectModule,
+ MatRadioModule,
+ MatDatepickerModule,
+ MatNativeDateModule,
+ MatChipsModule,
+ MatTooltipModule,
+ MatTableModule,
+ MatPaginatorModule,
+ MatCardModule,
+ MatCheckboxModule,
+ MatDialogModule,
+ MatAutocompleteModule,
+ MatButtonToggleModule
+
+ // NgxMatSelectSearchModule
+ ],*/
+ exports: [
+ MatSnackBarModule,
+ MatTabsModule,
+ MatMenuModule,
+ MatButtonModule,
+ MatToolbarModule,
+ MatIconModule,
+ MatSidenavModule,
+ MatBadgeModule,
+ MatListModule,
+ MatGridListModule,
+ MatInputModule,
+ MatFormFieldModule,
+ MatSelectModule,
+ MatRadioModule,
+ MatDatepickerModule,
+ MatChipsModule,
+ MatTooltipModule,
+ MatTableModule,
+ MatPaginatorModule,
+ MatCardModule,
+ MatProgressSpinnerModule,
+ MatCheckboxModule,
+ MatDialogModule,
+ MatAutocompleteModule,
+ MatButtonToggleModule
+ // NgxMatSelectSearchModule
+ ],
+ providers: [
+ MatDatepickerModule,
+ ]
+})
+
+export class AngularMaterialModule { }
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfig.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfig.ts
new file mode 100644
index 0000000..6fa59f9
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfig.ts
@@ -0,0 +1,80 @@
+import { Column } from 'devextreme/ui/data_grid';
+
+export interface ILookup {
+ dataSource: any;
+ valueExpr: string;
+ displayExpr: string;
+}
+
+export const enum EN_Alignment {
+ right = 'right',
+ left = 'left',
+ center = 'center',
+}
+
+export const enum EN_SortOrder {
+ asc = 'asc',
+ desc = 'desc',
+}
+
+
+export type Type_FractionDigits = null | -1 | 0 | 1 | 2 | 3 | 4 | 5 | 6;
+export type Type_Datentyp = string | number | Date;
+
+export class ColumnConfig {
+ allowSorting = true;
+ allowEditing = true;
+ private _sortIndex: number;
+ public get sortIndex(): number {
+ return this._sortIndex;
+ }
+ public set sortIndex(value: number) {
+ this._sortIndex = value;
+ if (!this.sortOrder) this.sortOrder = EN_SortOrder.asc;
+ }
+ sortOrder: EN_SortOrder;
+ alignment: EN_Alignment;
+ cellTemplate: string;
+ visible: boolean = true;
+ visibleIndex: number;
+ fixed: boolean = false;
+ headerCellTemplate: string;
+ width: string;
+ name: string;
+ minWidth: number;
+ _widthFactor: number = 1;
+ allowHeaderFiltering: boolean = false;
+ allowFiltering: boolean = true;
+ dataType: string;
+ groupIndex: number;
+ cssClass: string;
+ subColumns: ColumnConfig[] = [];
+
+ lookup: ILookup;
+ format: any;
+ calculateCellValue: Function;
+ calculateDisplayValue: Function | string;
+ calculateGroupValue: Function | string;
+ calculateSortValue: Function | string;
+ customizeText: Function | string;
+
+
+ public get widthFactor(): number {
+ return this.groupIndex !== undefined ? 0 : this._widthFactor;
+ }
+
+ public set widthFactor(v: number) {
+ this._widthFactor = v;
+ if (this._widthFactor < 0) this.width = '' + (- this._widthFactor) + 'px';
+ else this.width = this._widthFactor + '%';
+ }
+
+
+ constructor(public caption: string = '', public dataField: string = '', widthFactor: number = 1, fractionDigits?: Type_FractionDigits) {
+ if (fractionDigits || fractionDigits === 0) {
+ if (fractionDigits >= 0) this.cellTemplate = 'numberTemplate_' + fractionDigits;
+ this.alignment = EN_Alignment.right;
+ }
+ this.widthFactor = widthFactor;
+ }
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfiglist.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfiglist.ts
new file mode 100644
index 0000000..c511a3e
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/grid-config/columnconfiglist.ts
@@ -0,0 +1,138 @@
+import { GridExportButtonWidth } from '../../consts';
+import { ColumnConfig, EN_Alignment, EN_SortOrder, Type_FractionDigits } from './columnconfig';
+
+
+export interface SortInfo {
+ caption: string;
+ sortIndex: number;
+ sortOrder: EN_SortOrder;
+}
+
+
+export class ColumnConfigList {
+ public overHeaders: ColumnConfig[] = [];
+ private _columns: ColumnConfig[] = [];
+ public get columns(): ColumnConfig[] {
+ return this._columns;
+ }
+ public set columns(value: ColumnConfig[]) {
+ this._columns = value;
+ this.exportWasAdded = false;
+ }
+
+ public withExport: boolean = true;
+ public curOverHeader: ColumnConfig;
+ private exportWasAdded: boolean = false;
+
+ constructor() {
+ }
+
+ clear() {
+ this.overHeaders = [];
+ this.columns = [];
+ }
+
+ add(caption: string = '', dataField?: string, widthFactor: number = 1): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor);
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addCurrency(caption: string = '', dataField?: string, widthFactor: number = 1, fractionDigits: Type_FractionDigits = 0): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor, fractionDigits);
+ column.cellTemplate = 'currencyTemnplate_' + fractionDigits;
+
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addNumber(caption: string = '', dataField?: string, widthFactor: number = 1, fractionDigits: Type_FractionDigits = 0): ColumnConfig {
+ if (dataField && dataField.slice(-2) === 'Id') fractionDigits = -1;
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor, fractionDigits);
+ column.dataType = 'number';
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addId(caption: string = '', dataField?: string, widthFactor: number = 1, fractionDigits: Type_FractionDigits = -1): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor, fractionDigits);
+ column.dataType = 'number';
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addBoolean(caption: string = '', dataField?: string, widthFactor: number = 1): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor);
+ column.dataType = 'boolean';
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addDate(caption: string = '', dataField?: string, widthFactor: number = 1): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor);
+ column.dataType = 'date';
+ column.alignment = EN_Alignment.center;
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ addDateTime(caption: string = '', dataField?: string, widthFactor: number = 1): ColumnConfig {
+ const column: ColumnConfig = new ColumnConfig(caption, dataField, widthFactor);
+ column.dataType = 'datetime';
+ column.alignment = EN_Alignment.center;
+ return this.addColumn(column, dataField === undefined);
+ }
+
+ private addColumn(column: ColumnConfig, overheader: boolean = false): ColumnConfig {
+ const arColums: ColumnConfig[] = overheader ? this.overHeaders : this.columns;
+ if (overheader) {
+ column.alignment = EN_Alignment.center;
+ this.curOverHeader = column;
+ } else {
+ if (this.curOverHeader) this.curOverHeader.subColumns.push(column);
+ }
+ arColums.push(column);
+ return column;
+ }
+
+ //autorecalc after each add
+ recalcWidth(addAdditionalColumnForExport: boolean = true) { //Calculate the weighted width based on the widthFactor.
+ if (this.withExport && this.columns[this.columns.length - 1].alignment === EN_Alignment.right && !this.exportWasAdded && addAdditionalColumnForExport) {
+ this.add('', '', -GridExportButtonWidth); //last column for export
+ }
+ this.exportWasAdded = true;
+
+ const totalWidthFactor: number = this.columns.reduce((sum, col) => sum + (col.visible && col.widthFactor > 0 ? col.widthFactor : 0), 0);
+ if (totalWidthFactor === 0) return;
+ const widthFactor_1percent: number = 100 / totalWidthFactor; //The total value may be max 100%; buffer - 0.01
+
+ let countPosWidth = 0;
+ this.columns.forEach(col => {
+ if (col.visible && col.widthFactor > 0) {
+ col.widthFactor = this.roundToTwo(col.widthFactor * widthFactor_1percent);
+ countPosWidth++;
+ }
+ });
+ const delta = (100 - this.columns.reduce((sum, col) => sum + (col.visible && col.widthFactor > 0 ? col.widthFactor : 0), 0));
+
+ for (let i = this.columns.length - 1; i >= 0; i--) {
+ if (this.columns[i].visible && this.columns[i].widthFactor > 0) {
+ this.columns[i].widthFactor += delta;
+ break;
+ }
+ }
+ }
+
+ roundToTwo(num: number, places = 2): number {
+ return Math.round((num + Number.EPSILON) * Math.pow(10, places)) / Math.pow(10, places);
+ }
+
+ public setSorting(sortInfos: SortInfo[]) {
+ for (let inx = 0; inx < this.columns.length; inx++) {
+ const col = Object.assign(new ColumnConfig(), this.columns[inx]);
+ const sortInfo = sortInfos.find(el => el.caption === col.caption);
+ if (sortInfo) {
+ col.sortIndex = sortInfo.sortIndex;
+ col.sortOrder = sortInfo.sortOrder;
+ } else {
+ col.sortIndex = undefined;
+ col.sortOrder = undefined;
+ }
+ this.columns[inx] = col;
+ }
+ }
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.html b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.html
new file mode 100644
index 0000000..ca3ee3e
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.html
@@ -0,0 +1,46 @@
+
+
+
+
+ {{'core.caption.date' | translate}}:
+ {{today | date:'shortDate'}}
+ {{'core.account.caption.weight' | translate}}:
+ {{0.74 | number:'1.3-3'}} kg
+ {{'core.account.caption.price' | translate}}:
+ {{44357.00 | currency:currencySymbol:"symbol":"1.2-2"}}
+
+
+
+ {{'core.caption.showstatusbar' | translate}}
+
+
+ {{'core.caption.showids' | translate}}
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.scss
new file mode 100644
index 0000000..71a0bdf
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.scss
@@ -0,0 +1,282 @@
+@import 'hr-core-consts';
+
+.HRD_datetimepicker {
+ padding-top: 1px;
+ position: relative;
+ width: 100%;
+ height: auto;
+ // align-items: baseline;
+ // padding-bottom: 10px;
+ display: grid;
+ grid-template-columns: minmax(1px, 1fr);
+ grid-template-rows: minmax(auto, 0.65em) 1fr; //0.65em //10px
+ grid-template-areas: "dx-datebox-label""dxDateBox"
+}
+
+.dxDateBox {
+ grid-area: dxDateBox;
+ background-color: transparent;
+ display: block;
+ // height: 28px;
+}
+
+.dx-icon {
+ font-size: 24px;
+}
+
+// ::ng-deep .dx-show-clear-button .dx-icon-clear {
+// color: #000;
+// background-color: white;
+// /* background-color: #c2c2c2de; */
+// border-radius: 50%;
+// position: absolute;
+// top: 50%;
+// margin-top: -9px;
+// width: 16px;
+// height: 16px;
+// background-position: 0 0;
+// background-size: 16px 16px;
+// padding: 0;
+// font-size: 10px;
+// /* text-align: center; */
+// /* line-height: 10px; */
+// }
+
+::ng-deep .HRD_datetimepicker .dx-dropdowneditor-button .dx-button-content {
+ position: absolute;
+ left: -4px;
+}
+
+::ng-deep .HRD_datetimepicker .dx-state-disabled .dx-dropdowneditor-button .dx-button-content {
+ height: 100%;
+ display: table-cell;
+ color: grey;
+ background-color: #0000;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+::ng-deep .HRD_datetimepicker .dx-texteditor-input {
+ height: auto;
+ padding-top: 6.3px !important;
+ padding-bottom: 5.1px !important;
+ margin: 0;
+ background-color: #0000;
+ font-size: 14px;
+ color: unset;
+}
+
+
+.dx-state-disabled .dx-widget,
+.dx-state-disabled.dx-widget {
+ opacity: unset; //$hrColor-Alpha_Disabled;
+ color: rgba(0, 0, 0, $hrColor-Alpha_Disabled);
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -webkit-touch-callout: none;
+ cursor: default;
+ background-image: linear-gradient(to right, rgba(0, 0, 0, .42) 0, rgba(0, 0, 0, .42) 33%, transparent 0);
+ background-position: bottom;
+ background-size: 4px 1px;
+ background-repeat: repeat-x
+}
+
+.dx-datebox-label {
+ grid-area: dx-datebox-label;
+ color: rgba(0, 0, 0, 0.54);
+ top: 1.25em;
+ left: 0;
+ font-family: Roboto, "Helvetica Neue", sans-serif;
+ font-size: 10px;
+ pointer-events: none;
+ // width: 133.33333%;
+ white-space: nowrap;
+ display: block;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ cursor: default;
+ font-stretch: 100%;
+ font-weight: 400;
+ text-size-adjust: 100%;
+ visibility: visible;
+
+}
+
+::ng-deep .HRD_datetimepicker .dx-texteditor.dx-state-focused:before {
+ border-bottom: grey;
+ border-width: 1px;
+ outline-width: 0em;
+ transform: translateY(-1.34375em) scale(.75);
+}
+
+::ng-deep .dx-calendar-cell.dx-calendar-selected-date span,
+.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today span {
+ color: #fff;
+ background-color: $hrColor-DarkBlue;
+ font-weight: 400;
+}
+
+::ng-deep .dx-calendar-navigator .dx-button {
+ height: 100%;
+ display: table-cell;
+ background-color: #0000;
+ color: $hrColor-DarkBlue;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+
+::ng-deep .dx-datebox-wrapper-calendar .dx-button
+// ::ng-deep .dx-datebox-wrapper-calendar .dx-timeview-hourarrow
+// ::ng-deep .dx-datebox-wrapper-calendar .dx-timeview-minutearrow
+ {
+ color: $hrColor-DarkBlue;
+}
+
+::ng-deep .dx-datebox-wrapper-calendar .dx-button-today {
+ color: $hrColor-Red;
+}
+
+
+::ng-deep .dx-datebox-wrapper-calendar .dx-calendar-cell.dx-calendar-today {
+ font-weight: 900;
+ color: $hrColor-LightBlue;
+}
+
+
+
+::ng-deep .dx-show-clear-button .dx-clear-button-area {
+ width: 16px;
+ min-width: 16px;
+ right: -15px;
+}
+
+::ng-deep .dx-calendar-navigator-previous-month.dx-button .dx-icon,
+::ng-deep .dx-calendar-navigator-previous-view.dx-button .dx-icon {
+ color: $hrColor-DarkBlue;
+}
+
+::ng-deep .dx-calendar-navigator-next-month.dx-button .dx-icon,
+::ng-deep .dx-calendar-navigator-next-view.dx-button .dx-icon {
+ color: $hrColor-DarkBlue;
+}
+
+::ng-deep .dx-texteditor.dx-editor-underlined.dx-state-disabled:after,
+::ng-deep .dx-texteditor.dx-editor-underlined.dx-state-readonly.dx-state-hover:after,
+::ng-deep .dx-texteditor.dx-editor-underlined.dx-state-readonly:after {
+ border-bottom-style: none;
+}
+
+//-------------------------------
+::ng-deep .dx-placeholder {
+ color: rgba(0, 0, 0, 0.54);
+ font-size: 14px;
+}
+
+.hs_label_invalid,
+::ng-deep .dx-invalid .dx-placeholder,
+::ng-deep .hs_label_invalid .dx-placeholder {
+ color: rgb(244, 67, 54);
+}
+
+
+
+// ::ng-deep .dx-state-focused .dx-placeholder {
+// color: red;
+// }
+
+
+::ng-deep .HRD_datetimepicker .dx-state-focused .dx-dropdowneditor-input-wrapper {
+ padding-bottom: 2px;
+}
+
+::ng-deep .dx-dropdowneditor-input-wrapper,
+::ng-deep .dx-state-disabled .dx-dropdowneditor-input-wrapper {
+ padding-bottom: 1px;
+}
+
+::ng-deep .dx-texteditor.dx-editor-underlined.dx-state-hover:after {
+ border-bottom: 1px solid rgba(0, 0, 0, .42);
+}
+
+::ng-deep .HRD_datetimepicker .dx-texteditor.dx-editor-underlined.dx-state-focused:after {
+ border-bottom: 2px solid rgb(120, 183, 229);
+}
+
+::ng-deep .HRD_datetimepicker .dx-texteditor.dx-editor-underlined.dx-invalid:after,
+::ng-deep .HRD_datetimepicker .dx-texteditor.dx-editor-underlined.hs_label_invalid:after {
+ border-bottom-color: rgb(244, 67, 54);
+}
+
+
+.dx-invalid.dx-texteditor.dx-state-focused:before {
+ border: 0px none;
+}
+
+.hs_label {
+ margin-top: -3px;
+ // height: 0.84375em;
+ height: 0.864em;
+ transform: scale(0.75) perspective(100px) translateZ(0.001px);
+ // transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px);
+ width: 133.33333%;
+ margin-left: -17%;
+ font-size: 14px;
+ overflow: inherit;
+}
+
+// ::ng-deep .dx-state-focused .dx-placeholder {
+// width: 133.33333%;
+// }
+
+
+.hs_label_focused {
+ color: rgb(120, 183, 229);
+}
+
+
+::ng-deep .HRD_datetimepicker .dx-invalid-message>.dx-overlay-content {
+ transform: none !important;
+ padding: 0 !important;
+ top: 21px !important;
+ background: white;
+ font-size: .85em;
+ color: rgb(244, 67, 54);
+}
+
+::ng-deep .HRD_datetimepicker .dx-icon-close {
+ font-size: 14px;
+ font-family: Material Icons;
+}
+
+::ng-deep .HRD_datetimepicker .dx-state-disabled .dx-icon-close {
+ color: rgba(11, 58, 98, 0.4);
+}
+
+::ng-deep .HRD_datetimepicker .dx-icon-event {
+ // color: rgba(11, 58, 98, 0.84); //$hrColor-DarkBlue
+ color: rgba(0, 0, 0, 0.54);
+
+}
+
+::ng-deep .HRD_datetimepicker .dx-state-disabled .dx-icon-event {
+ color: rgba(0, 0, 0, 0.26);
+}
+
+::ng-deep .HRD_datetimepicker .dx-icon-close:before {
+ content: "\e5cd";
+}
+
+::ng-deep .HRD_datetimepicker .dx-editor-underlined .dx-texteditor-buttons-container>.dx-button.dx-button-mode-text {
+ margin: 0;
+}
+
+::ng-deep .HRD_datetimepicker .dx-invalid.dx-texteditor.dx-show-invalid-badge .dx-texteditor-input-container:after {
+ display: none;
+}
+
+
+// ::ng-deep .HRD_datetimepicker .dx-texteditor.dx-editor-underlined .dx-placeholder::before,
+// ::ng-deep .HRD_datetimepicker .dx-texteditor.dx-editor-underlined .dx-texteditor-input {
+// padding: 5.6px 0 5px; //allign top of dx-input box to mat-input
+// }
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.spec.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.spec.ts
new file mode 100644
index 0000000..06c3571
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-date-time-picker/hensel-date-time-picker.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HenselDateTimePickerComponent } from './hensel-date-time-picker.component';
+
+describe('HenselDateTimePickerComponent', () => {
+ let component: HenselDateTimePickerComponent;
+ let fixture: ComponentFixture
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.scss
new file mode 100644
index 0000000..eae15f5
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.scss
@@ -0,0 +1,110 @@
+@import 'hr-core-consts';
+
+
+.hensel-dnd {
+ height: calc(100% - 4px);
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ position: relative;
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-rows: auto minmax(0, 1fr); // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+ grid-column-gap: 0px;
+ grid-template-areas: "caption""dnd"
+}
+
+.dnd-title {
+ grid-area: caption;
+ padding-bottom: 10px;
+}
+
+.font-disabled {
+ color: rgba(0, 0, 0, 0.54)
+}
+
+.font-enabled {
+ color: rgba(0, 0, 0, 0.87);
+ font-weight: bold;
+}
+
+
+.dnd-upload-container {
+ grid-area: dnd;
+ cursor: default;
+ height: calc(100% - 4px);
+ border-radius: $hrBorder-radius-big;
+ background-color: rgba(198, 231, 253, 0.3);
+}
+
+.dnd-upload-container-disabled {
+ opacity: 0.6;
+ background-color: transparent;
+ border: 2px dashed gray;
+}
+
+.dnd-upload-container-disabled-btn {
+ opacity: 1;
+ background-color: transparent;
+ border: 2px dashed gray;
+}
+
+.dnd-upload-container-enabled {
+ opacity: 0.8;
+ border: 2px dashed #1C8ADB;
+}
+
+.dnd-upload-container-enabled-btn {
+ opacity: 1;
+ border: 2px dashed #1C8ADB;
+}
+
+.dnd-upload-container-enabled:hover {
+ cursor: pointer;
+ opacity: 1;
+}
+
+
+.dnd-upload-icon {
+ width: auto;
+ height: auto;
+ opacity: inherit;
+ cursor: inherit;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.dnd-upload-button {
+ cursor: pointer;
+}
+
+
+.overlay {
+ /* Height & width depends on how you want to reveal the overlay (see JS below) */
+ height: calc(100% - 72px);
+ margin-top: 47px;
+ margin-bottom: 25px;
+ width: 0;
+ position: fixed;
+ /* Stay in place */
+ z-index: 1;
+ /* Sit on top */
+ left: 0;
+ top: 0;
+ background-color: #9ecbec;
+ /* Black fallback color */
+ background-color: #9ecbec;
+ /* Black w/opacity */
+ opacity: 0.8;
+ overflow-x: hidden;
+ /* Disable horizontal scroll */
+ transition: 0.1s;
+ /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.ts
new file mode 100644
index 0000000..08dc26b
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-drag-n-drop/hensel-drag-n-drop.component.ts
@@ -0,0 +1,111 @@
+import { AfterViewInit, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
+
+@Component({
+ selector: 'app-hensel-drag-n-drop',
+ templateUrl: './hensel-drag-n-drop.component.html',
+ styleUrls: ['./hensel-drag-n-drop.component.scss']
+})
+export class HenselDragNDropComponent implements OnInit {
+
+ @Input() accept: string = '.jpg,.png';
+ @Input() multiple: boolean = true;
+ @Input() caption: string;
+ @Input() captionClass: string = '';
+ @Input() buttonText: string;
+ @Input() icon: string = 'cloud_upload';
+ @Input() iconSizePrc: number = 1;
+ @Input() onFileUpload: (any) => void;
+ @Input() title: string;
+ @Input() button: string = '';
+ @Input() disabled: boolean = false;
+ @Input() uploadAsBase64: boolean = false;
+ @Input() onStartingUpload: (any) => void;
+ @Input() onStartingUploadAsync: () => Promise
+ {{caption}}
+
+
+
+
+
+
+ {{icon}}
+
+
+
+ {{hint | translate}}
+
+
+
+
+ {{ cell.column.caption | translate}}
+
+ {{'core.hensel-selection.nohits' | translate}}
+
+ {{'core.hensel-selection.inputminsybols' | translate: {value: minFilterLength4Search} }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{'core.caption.all' | translate}}
+
+ {{'core.hensel-selection.selectedfirst' | translate}}
+ {{'core.btn.apply' | translate}}
+ {{'core.btn.cancel' | translate}}
+
+
+
+
+
+
+ {{displayIconFn(item.link)}}
+ {{ item[displayExpr] }}
+
+
+
+ {{displayIconFn(item.link)}}
+ {{ item[displayExpr] }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.scss
new file mode 100644
index 0000000..333d055
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.scss
@@ -0,0 +1,83 @@
+@import 'hr-core-consts';
+
+
+.btn-question-picture {
+ width: 160px;
+ height: 50px;
+ background-color: white;
+ color: $hrColor-DarkBlue;
+}
+
+.webcam-grid {
+ height: 100%;
+ width: 100%;
+ display: grid;
+ position: relative;
+ grid-template-rows: auto minmax(0, 1fr);
+ grid-template-columns: 0px auto minmax(0, 1fr);
+ grid-template-areas:
+ ". webcam-container snapshot ."
+ ". arrow-take-picture btn-delete .";
+ grid-gap: 15px;
+}
+
+
+
+.no-photo-icon {
+ // font-size: 250px;
+ opacity: 20%;
+}
+
+.snapshot {
+ margin-left: 35px;
+ grid-area: snapshot;
+}
+
+.webcam_button_icons{
+ padding-right: 5px;
+}
+
+
+.webcam-container {
+ grid-area: webcam-container;
+}
+
+.btn-delete {
+ margin-left: 35px;
+ grid-area: btn-delete;
+ width: 160px;
+ height: 50px;
+ background-color: white;
+ color: $hrColor-DarkBlue;
+}
+
+.snapshot,
+.webcam-container {
+ padding: 2px;
+ // margin-left: 4px;
+}
+
+.arrow-take-picture {
+ grid-area: arrow-take-picture;
+ width: 160px;
+ height: 50px;
+ background-color: white;
+ color: $hrColor-DarkBlue;
+}
+
+.DeleteButton {
+ // color: $hrColor-Green;
+ // color: $hrColor-DarkBlue;
+ // position: absolute;
+ // top: 0px;
+ // left: 100%;
+ // transform: translate(-40px);
+ position: absolute;
+ top: 12px;
+ right: 20px;
+}
+
+.DeleteIcon {
+ font-size: 40px;
+ color: white;
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.ts
new file mode 100644
index 0000000..1979d6e
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/hensel-webcam/hensel-webcam.component.ts
@@ -0,0 +1,58 @@
+import { Component, EventEmitter, Input, OnDestroy, Output, ViewChild } from '@angular/core';
+import { WebcamComponent, WebcamImage } from 'ngx-webcam';
+import { Observable, Subject } from 'rxjs';
+import { HenselTranslateService } from '../../services/localization/hensel-translate.service';
+
+@Component({
+ // tslint:disable-next-line:component-selector
+ selector: 'hensel-webcam',
+ templateUrl: 'hensel-webcam.component.html',
+ styleUrls: ['hensel-webcam.component.scss'],
+})
+
+export class HenselWebcamComponent implements OnDestroy {
+ @ViewChild(WebcamComponent) webCam: WebcamComponent;
+ @Output() public pictureTaken = new EventEmitter();
+ @Input() public picture: string;
+ @Input() public canDelete: boolean = true;
+ @Input() public disabled: boolean = false;
+ @Input() public size: number = 250;
+
+
+ public videoOptions: MediaTrackConstraints = {
+ width: { ideal: this.size }, // must be same size
+ height: { ideal: this.size }, // must be same size (look html) TODO: Input width/height
+ };
+
+ public get isInitialized(): boolean {
+ return this.webCam?.videoInitialized ?? false;
+ }
+
+ // webcam snapshot trigger
+ private trigger: Subject
+ ![]()
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.scss
new file mode 100644
index 0000000..a695c9f
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.scss
@@ -0,0 +1,80 @@
+@import 'hr-core-consts';
+
+.divFooter {
+ background-color: $hrColor-DarkBlue;
+ // position: absolute;
+ flex-direction: row;
+ box-sizing: border-box;
+ // display: flex;
+ // top: 8em;
+ width: 100%; //99.4%;
+ padding: 5px;
+ // margin: 0 5px 0 5px;
+ font-size: 10px;
+ font-weight: 500;
+ text-align: left;
+ border-radius: $hrBorder-radius-small $hrBorder-radius-small;
+}
+
+.divFooter>a, span {
+ color: white;
+}
+
+.data {
+ padding-left: 5px;
+ padding-right: 10px !important;
+ color: $hrColor-LightBlueMain !important;
+}
+
+.data1 {
+ padding-left: 5px !important;
+ padding-right: 2px !important;
+ color: $hrColor-LightBlueMain !important;
+}
+
+/*
+ * ----------------------------------------
+ * animation slide-top
+ * ----------------------------------------
+ */
+/*
+.slide-top {
+ -webkit-animation: slide-top 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
+ animation: slide-top 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
+ animation-delay: 3s;
+}
+
+@-webkit-keyframes slide-top {
+ 0% {
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+
+ 50% {
+ -webkit-transform: translateY(-50px);
+ transform: translateY(-50px);
+ }
+
+ 100% {
+ -webkit-transform: translateY(-102px);
+ transform: translateY(-102px);
+ }
+}
+
+@keyframes slide-top {
+ 0% {
+ -webkit-transform: translateY(0);
+ transform: translateY(0);
+ }
+
+ 50% {
+ -webkit-transform: translateY(-50px);
+ transform: translateY(-50px);
+ }
+
+ 100% {
+ -webkit-transform: translateY(-102px);
+ transform: translateY(-102px);
+ }
+}
+*/
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.ts
new file mode 100644
index 0000000..585cff7
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/footer/footer.component.ts
@@ -0,0 +1,64 @@
+import { HttpClient } from '@angular/common/http';
+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { Globals } from '../../../services/globals';
+import { AuthorizeService } from '../../../services/authorize.service';
+import { ServerInfoService } from '../../../services/serverinfo.service';
+import { now } from '../../../utils';
+
+const
+ second = 1000,
+ minute = second * 60,
+ hour = minute * 60,
+ day = hour * 24;
+
+@Component({
+ selector: 'app-footer',
+ templateUrl: './footer.component.html',
+ styleUrls: ['./footer.component.scss']
+})
+
+export class FooterComponent implements OnInit, OnDestroy {
+ counter: any;
+
+ days: number;
+ hours: number;
+ mins: number;
+ secs: number;
+ public package_json;
+ public coreVersion: string;
+ public devextremeVersion: string;
+
+ constructor(
+ public globals: Globals,
+ public serverInfoService: ServerInfoService,
+ public authService: AuthorizeService,
+ private http: HttpClient
+ ) {
+ this.counter = setInterval(() => this.updateTimer(), 1000);
+ }
+
+ updateTimer = () => {
+ if (!this.authService.useJWT || !this.authService.HR_JWT) return;
+ let distance = this.authService.HR_JWT?.expiresAt?.valueOf() - now();
+ if (distance < -3 * second) return;
+ if (distance < 0) distance = 0;
+
+ this.days = Math.floor(distance / day);
+ this.hours = this.days > 0 ? 0 : Math.floor((distance % day) / hour);
+ this.mins = this.days > 0 || this.hours > 1 ? 0 : Math.floor((distance % hour) / minute);
+ this.secs = this.days > 0 || this.hours > 0 || this.mins > 1 ? 0 : Math.floor((distance % minute) / second);
+ }
+
+ ngOnInit() {
+ this.http.get('../../../assets/json/package.json').subscribe((data) => {
+ this.package_json = data;
+ this.coreVersion = this.package_json?.version;
+ this.devextremeVersion = !this.package_json?.peerDependencies || !this.package_json?.peerDependencies['devextreme-angular'] ? undefined : this.package_json?.peerDependencies['devextreme-angular']
+ this.devextremeVersion = this.devextremeVersion ?? this.package_json?.dependencies['devextreme-angular'];
+ });
+ }
+
+ ngOnDestroy(): void {
+ clearInterval(this.counter);
+ }
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/favicon.ico b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/favicon.ico
new file mode 100644
index 0000000..d65b48a
Binary files /dev/null and b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/favicon.ico differ
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/header.component.html b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/header.component.html
new file mode 100644
index 0000000..1039d82
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/header/header.component.html
@@ -0,0 +1,33 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.scss b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.scss
new file mode 100644
index 0000000..9168305
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.scss
@@ -0,0 +1,56 @@
+mat-sidenav-container,
+mat-sidenav-content,
+mat-sidenav {
+ height: 100%;
+}
+
+mat-sidenav {
+ width: 300px;
+}
+
+main {
+ padding: 5px;
+}
+
+.layout-wrapper {
+ height: 100%;
+}
+
+.flex-wrapper {
+ height: 100%;
+}
+
+.HeaderMainFooterComponent {
+ padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
+ margin: 0; // see above
+ overflow: hidden; // overflow hidden => all "to big" child components are hidden
+ display: grid; // we define a grid
+ width: 100%; // 100 % view width (hardware screen)
+ height: 100%; // 100% view height
+ grid-template-areas:
+ 'head'
+ 'main'
+ 'foot'; // 3 Rows
+ grid-template-rows: auto minmax(0, 1fr) auto; // row relationships
+ grid-template-columns: minmax(0, 1fr); // column relationship
+}
+
+.HeaderComponent {
+ margin: 0 5px 0 5px; // padding around the header
+// padding: 5px; // padding around the header
+ top: 0; // component + padding = top line
+ left: 0; // component + padding = left line
+ right: 0; // component + padding = right line
+ // ==> with these 3 informations we knew that the component will be stretched at the top of the view
+ grid-area: head; // grid area: auto height 1fr width
+}
+
+.MainComponent {
+ grid-area: main;
+ overflow: hidden;
+}
+
+.FooterComponent {
+ grid-area: foot;
+ margin: 0 5px 0 5px;
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.ts
new file mode 100644
index 0000000..bf39d57
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit, Input } from '@angular/core';
+
+@Component({
+ selector: 'app-layout',
+ templateUrl: './layout.component.html',
+ styleUrls: ['./layout.component.scss']
+})
+export class LayoutComponent implements OnInit {
+ @Input() title: string;
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.module.ts b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.module.ts
new file mode 100644
index 0000000..e24926b
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/layout.module.ts
@@ -0,0 +1,21 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { AngularMaterialModule } from '../angular-material.module';
+import { TranslateModule } from '@ngx-translate/core';
+import { FooterComponent } from './footer/footer.component';
+import { HeaderComponent } from './header/header.component';
+import { LayoutComponent } from './layout.component';
+import { SidenavListComponent } from './sidenav-list/sidenav-list.component';
+
+@NgModule({
+ declarations: [LayoutComponent, FooterComponent, HeaderComponent, SidenavListComponent],
+ imports: [
+ CommonModule,
+ AngularMaterialModule,
+ TranslateModule.forChild(),
+ RouterModule,
+ ],
+ exports: [LayoutComponent, FooterComponent, HeaderComponent, SidenavListComponent]
+})
+export class LayoutModule { }
diff --git a/ClientApp/staff-db-ui/src/app/shared/core/components/layout/sidenav-list/sidenav-list.component.html b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/sidenav-list/sidenav-list.component.html
new file mode 100644
index 0000000..faa89fa
--- /dev/null
+++ b/ClientApp/staff-db-ui/src/app/shared/core/components/layout/sidenav-list/sidenav-list.component.html
@@ -0,0 +1,14 @@
+
+
+
+ {{title}}
+
+
+
+ {{'core.msg.greeting' | translate}} {{this.authorizationService.user?.name}}!
+
+
+
+
+
+
+ {{'core.msg.waitingconnecton' | translate}}
+
+
+
+
+
+
+
+ {{'core.msg.checkuser' | translate}}
+
+
+
+
+
+