ps-toolkit-ui 0.0.211 → 0.0.212

package/src/lib/components/table/table.component.ts

@@ -1,180 +0,0 @@
-import {Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild} from '@angular/core';
-import {Router} from '@angular/router';
-import {TableClass} from '../../classes/table.class';
-import {InputType, Method, TableCollType, TableOptionType} from '../../classes/enum.class';
-import {InputClass} from '../../classes/form.class';
-import {RequestClass} from '../../classes/request.class';
-import * as $ from 'jquery';
-import {ConfirmComponent} from '../confirm/confirm.component';
-import {ModalClass} from '../../classes/modal.class';
-
-@Component({
-  selector: 'lib-table',
-  templateUrl: './table.component.html',
-  styleUrls: ['./table.component.css']
-})
-export class TableComponent implements OnInit{
-  @Input()
-  table: TableClass;
-  @Output()
-  changeRows = new EventEmitter<object>();
-  get type(): typeof InputType{ return InputType; }
-  get tableOptionType(): typeof TableOptionType{ return TableOptionType; }
-  get colType(): typeof TableCollType{ return TableCollType; }
-  @ViewChild('rows') rows: ElementRef;
-  @ViewChild('tableDiv') tableDiv: ElementRef;
-  @ViewChild('exportDropDown') exportDropDown: ElementRef;
-  @ViewChild('confirm') confirm: ConfirmComponent;
-  loadIcon: InputClass;
-  sizeIcon: InputClass;
-  select: InputClass = null;
-  optDelete: InputClass;
-  reload: InputClass;
-  maximum: InputClass;
-  export: InputClass = null;
-  constructor(public router: Router) {
-  }
-  itemsWidth = 0;
-  options: InputClass[];
-  ngOnInit(): void {
-    // if (this.app.isReport){
-    //   this.table.perPage = -1;
-    //   this.table.extraButtons = false;
-    //   this.table.displayLabel = false;
-    //   this.table.isReport = true;
-    //   this.table.permissions.Accesses = ['List'];
-    //   this.table.permissions.Options = [];
-    //   this.table.cols.forEach(x => x.sort = false);
-    //   this.table.onLoad = () => {
-    //     setTimeout(() => {
-    //       window.print();
-    //     }, 500);
-    //   };
-    // }
-    this.loadIcon = new InputClass(this.table.environment, null, 'LoadIcon');
-    this.sizeIcon = new InputClass(this.table.environment, null, 'SizeIcon');
-    if (this.table.hasChildren){
-      this.table.cols.forEach(x => x.sort = false);
-    }
-    this.itemsWidth = this.table.cols.reduce((a, {percent}) => a + percent, 0);
-    this.reload = new InputClass(this.table.environment, this.table.l, 'Reload', 'fa-duotone fa-sync-alt', InputType.Icon, 'm-h-5');
-    this.maximum = new InputClass(this.table.environment, this.table.l, 'Maximum', 'fa-duotone fa-expand-arrows-alt', InputType.Icon, 'm-h-5');
-    this.optDelete = new InputClass(this.table.environment, this.table.l, 'Delete', 'fa-duotone fa-trash', InputType.Icon, 'red h-25 m-h-5 d-ib va-m f-u');
-    for (const c of this.table.cols.filter(x => x.withSearch)){
-      c.search = new InputClass(this.table.environment, this.table.l, c.name,
-        null, c.type === TableCollType.Date ? InputType.Date : InputType.Text, 'h-25 table-search');
-      c.search.displayLabel = false;
-      c.search.onChange = () => {
-        this.table.load();
-      };
-    }
-    if (this.table.sortable){
-      this.table.perPage = -1;
-      this.table.onLoad = () => {
-        this.setSortable();
-      };
-    }
-    this.table.set(this.changeRows);
-    if (this.table.searchForm){
-      this.table.searchForm.displayLabel = false;
-      this.table.searchForm.inputs.forEach(x => {
-        x.required = false;
-        x.displayLabel = false;
-        x.withClear = true;
-        x.class = x.class + ' h-30';
-        x.onChange = () => {
-          this.table.load();
-        };
-      });
-    }
-    this.options = this.getOptions();
-    this.reload.onClick = () => {
-      this.table.load(this.reload);
-    };
-    this.maximum.onClick = () => {
-      $(this.tableDiv.nativeElement).toggleClass('maximum');
-      this.maximum.icon = this.maximum.name === 'Minimum' ? 'fa-duotone fa-expand-arrows-alt' : 'fa-duotone fa-compress-arrows-alt';
-      this.maximum.name = this.maximum.name === 'Minimum' ? 'Maximum' : 'Minimum';
-    };
-    this.optDelete.onClick = (i) => {
-      if (this.table.form){
-        this.table.form.clear();
-      }
-      const data = {
-        ids: this.table.rows.filter(x => x.selected).map(x => x.id)
-      };
-      this.confirm.show(this.table.l('DeleteConfirm'), this.table.url + '/Delete/' + 0, data, () => {
-        this.table.load(null);
-      });
-    };
-    this.table.showConfirm = (l: string, url: string, data, accept: (btn: InputClass) => void) => {
-      this.confirm.show(l, url, data, accept);
-    };
-  }
-  allSelected(): boolean{
-    return this.table.rows.filter(x => !x.selected).length === 0;
-  }
-  isSelected(): boolean{
-    return this.table.rows.filter(x => x.selected).length > 0;
-  }
-  selectAll(): void{
-    if (this.table.rows.filter(x => !x.selected).length === 0){
-      this.table.rows.forEach(x => x.selected = false);
-    }else{
-      this.table.rows.forEach(x => x.selected = true);
-    }
-  }
-  getOptions(): InputClass[]{
-    return [];
-  }
-  setSortable(): void{
-    setTimeout(() => {
-      // @ts-ignore
-      $(this.rows.nativeElement).sortable({
-        axis: 'y',
-        items: 'tr',
-        update: () => {
-          const data = [];
-          // @ts-ignore
-          $(this.rows.nativeElement).sortable('toArray').forEach(x => data.push(x));
-          new RequestClass(this.table.l).send(this.table.url + 'Sort', Method.Post, {Ids: data}, null, () => {
-            if (this.table.onSort){
-              this.table.onSort();
-            }
-          });
-        }
-      }).disableSelection();
-    }, 500);
-  }
-  getRows(): any[]{
-    const c = this.table.rows.filter(x => !x.Data.ParentId);
-    c.forEach((x, i) => x.RowNum = c.length - i + 1);
-    return c;
-  }
-  // getOptionModals(): InputClass[]{
-  //   const modals = [];
-  //   for (const [key, value] of Object.entries(this.table.optionActions)) {
-  //     if (this.table.optionActions[key].modal){
-  //       modals.push(this.table.optionActions[key].modal);
-  //     }
-  //   }
-  //   return modals;
-  // }
-  onChangeRows(e): void{
-    return this.changeRows.emit(e);
-  }
-  onConfirmShow(e): void{
-    this.confirm.show(this.table.l('DeleteConfirm'), this.table.url + 'Delete/' + e.id, null, e.accept);
-  }
-  changeSort(e, s: string): void{
-    if ($(e.target).closest('.header-search').hasClass('header-search')){
-      return;
-    }
-    this.table.sortType = this.table.sort === s ? this.table.sortType === 'ASC' ? 'DESC' : 'ASC' : 'ASC';
-    this.table.sort = s;
-    this.table.load();
-  }
-  getModals(): ModalClass[]{
-    return this.table.optionsActions.filter(x => x instanceof ModalClass);
-  }
-}

package/src/lib/components/tooltip/tooltip.component.css

@@ -1,159 +0,0 @@
-[data-tooltip] {
-  width: 100%;
-  height: 100%;
-  position: relative;
-  z-index: 10;
-}
-
-/* Positioning and visibility settings of the tooltip */
-[data-tooltip]:before,
-[data-tooltip]:after {
-  position: absolute;
-  visibility: hidden;
-  opacity: 0;
-  left: 50%;
-  bottom: calc(100% + 5px);
-  pointer-events: none;
-  transition: 0.2s;
-  will-change: transform;
-}
-
-/* The actual tooltip with a dynamic width */
-[data-tooltip]:before {
-  content: attr(data-tooltip);
-  padding: 0 10px;
-  line-height: 30px;
-  min-width: 50px;
-  max-width: 300px;
-  width: max-content;
-  width: -moz-max-content;
-  border-radius: 5px;
-  font-size: 13px;
-  background-color: var(--black);
-  color: #fff;
-  text-align: center;
-  white-space: pre-wrap;
-  z-index: 6;
-  transform: translate(-50%, -5px) scale(0.5);
-}
-
-/* Tooltip arrow */
-[data-tooltip]:after {
-  content: '';
-  border-style: solid;
-  border-width: 5px 5px 0px 5px;
-  border-color: var(--black);
-  transition-duration: 0s; /* If the mouse leaves the element,
-                              the transition effects for the
-                              tooltip arrow are "turned off" */
-  transform-origin: top;   /* Orientation setting for the
-                              slide-down effect */
-  transform: translateX(-50%) scaleY(0);
-}
-
-/* Tooltip becomes visible at hover */
-[data-tooltip]:hover:before,
-[data-tooltip]:hover:after {
-  visibility: visible;
-  opacity: 1;
-}
-/* Scales from 0.5 to 1 -> grow effect */
-[data-tooltip]:hover:before {
-  transition-delay: 0.3s;
-  transform: translate(-50%, -5px) scale(1);
-}
-/* Slide down effect only on mouseenter (NOT on mouseleave) */
-[data-tooltip]:hover:after {
-  transition-delay: 0.5s; /* Starting after the grow effect */
-  transition-duration: 0.2s;
-  transform: translateX(-50%) scaleY(1);
-}
-/*
-  That's it.
-*/
-
-
-
-
-
-
-/*
-  If you want some adjustability
-  here are some orientation settings you can use:
-*/
-
-/* LEFT */
-/* Tooltip + arrow */
-[data-tooltip-location="left"]:before,
-[data-tooltip-location="left"]:after {
-  left: auto;
-  right: calc(100% + 5px);
-  bottom: 50%;
-}
-
-/* Tooltip */
-[data-tooltip-location="left"]:before {
-  transform: translate(-5px, 50%) scale(0.5);
-}
-[data-tooltip-location="left"]:hover:before {
-  transform: translate(-5px, 50%) scale(1);
-}
-
-/* Arrow */
-[data-tooltip-location="left"]:after {
-  border-width: 5px 0px 5px 5px;
-  border-color: transparent transparent transparent rgba(55, 64, 70, 0.9);
-  transform-origin: left;
-  transform: translateY(50%) scaleX(0);
-}
-[data-tooltip-location="left"]:hover:after {
-  transform: translateY(50%) scaleX(1);
-}
-
-
-
-/* RIGHT */
-[data-tooltip-location="right"]:before,
-[data-tooltip-location="right"]:after {
-  left: calc(100% + 5px);
-  bottom: 50%;
-}
-
-[data-tooltip-location="right"]:before {
-  transform: translate(5px, 50%) scale(0.5);
-}
-[data-tooltip-location="right"]:hover:before {
-  transform: translate(5px, 50%) scale(1);
-}
-
-[data-tooltip-location="right"]:after {
-  border-width: 5px 5px 5px 0px;
-  border-color: transparent rgba(55, 64, 70, 0.9) transparent transparent;
-  transform-origin: right;
-  transform: translateY(50%) scaleX(0);
-}
-[data-tooltip-location="right"]:hover:after {
-  transform: translateY(50%) scaleX(1);
-}
-
-
-
-/* BOTTOM */
-[data-tooltip-location="bottom"]:before,
-[data-tooltip-location="bottom"]:after {
-  top: calc(100% + 5px);
-  bottom: auto;
-}
-
-[data-tooltip-location="bottom"]:before {
-  transform: translate(-50%, 5px) scale(0.5);
-}
-[data-tooltip-location="bottom"]:hover:before {
-  transform: translate(-50%, 5px) scale(1);
-}
-
-[data-tooltip-location="bottom"]:after {
-  border-width: 0px 5px 5px 5px;
-  border-color: transparent transparent rgba(55, 64, 70, 0.9) transparent;
-  transform-origin: bottom;
-}

package/src/lib/components/tooltip/tooltip.component.html

@@ -1 +0,0 @@
-<div [attr.data-tooltip-location]="position" [attr.data-tooltip]="text"></div>

package/src/lib/components/tooltip/tooltip.component.ts

@@ -1,15 +0,0 @@
-import {Component, Input} from '@angular/core';
-
-@Component({
-  selector: 'lib-tooltip',
-  templateUrl: './tooltip.component.html',
-  styleUrls: ['./tooltip.component.css']
-})
-export class TooltipComponent{
-  @Input()
-  text: string;
-  @Input()
-  position = 'bottom';
-  constructor(){
-  }
-}

package/src/lib/ps-toolkit-ui.module.ts

@@ -1,94 +0,0 @@
-import {ModuleWithProviders, NgModule} from '@angular/core';
-import {PsToolkitUiConfigService} from './services/config.service';
-import {AccordionComponent} from './components/accordion/accordion.component';
-import {FooterComponent} from './components/footer/footer.component';
-import {HeaderComponent} from './components/header/header.component';
-import {ModalComponent} from './components/modal/modal.component';
-import {SidebarItemComponent} from './components/sidebar/item/sidebar.item.component';
-import {SidebarComponent} from './components/sidebar/sidebar.component';
-import {StepsComponent} from './components/steps/steps.component';
-import {SubHeaderComponent} from './components/header/sub/sub.header.component';
-import {TableLoadingComponent} from './components/table/loading/table.loading.component';
-import {TablePaginationComponent} from './components/table/pagination/table.pagination.component';
-import {TableRowComponent} from './components/table/row/table.row.component';
-import {TableComponent} from './components/table/table.component';
-import {TooltipComponent} from './components/tooltip/tooltip.component';
-import {FormBankCardComponent} from './components/form/bank-card/form.bank-card.component';
-import {FormButtonComponent} from './components/form/button/form.button.component';
-import {FormCheckboxComponent} from './components/form/checkbox/form.checkbox.component';
-import {FormDateComponent} from './components/form/date/form.date.component';
-import {FormDatetimeComponent} from './components/form/datetime/form.datetime.component';
-import {FormFileComponent} from './components/form/file/form.file.component';
-import {FormIconComponent} from './components/form/icon/form.icon.component';
-import {FormComponent} from './components/form/index/form.component';
-import {FormLabelComponent} from './components/form/label/form.label.component';
-import {FormPlaqueSelectComponent} from './components/form/plaque/select/form.plaque.select.component';
-import {FormPlaqueComponent} from './components/form/plaque/form.plaque.component';
-import {FormRadioComponent} from './components/form/radio/form.radio.component';
-import {FormSelectItemComponent} from './components/form/select/item/form.select.item.component';
-import {FormSelectComponent} from './components/form/select/form.select.component';
-import {FormTableComponent} from './components/form/table/form.table.component';
-import {FormTextareaComponent} from './components/form/textarea/form.textarea.component';
-import {FormTextboxComponent} from './components/form/textbox/form.textbox.component';
-import {FormTimeComponent} from './components/form/time/form.time.component';
-import {FormTreeItemComponent} from './components/form/tree/item/form.tree.item.component';
-import {FormTreeComponent} from './components/form/tree/form.tree.component';
-import {AlertComponent} from './components/alert/alert.component';
-import {ConfirmComponent} from './components/confirm/confirm.component';
-import {NotfoundComponent} from './components/notfound/notfound.component';
-import {FormFingerComponent} from './components/form/finger/form.finger.component';
-import {FormCarSearchComponent} from './components/form/car/search/form.car.search.component';
-import {FormCarComponent} from './components/form/car/form.car.component';
-import {TableReportComponent} from './components/table/report/table.report.component';
-import {RouterModule} from '@angular/router';
-import {FormsModule} from '@angular/forms';
-import {CommonModule} from '@angular/common';
-import {SafeStylePipe} from './classes/safestyle.class';
-import {LoginComponent} from './components/login/login.component';
-import {LoadingComponent} from './components/loading/loading.component';
-import {NotificationComponent} from './components/notification/notification.component';
-import {LayoutComponent} from './components/layout/layout.component';
-import {FormHiddenComponent} from './components/form/hidden/form.hidden.component';
-import {CalendarComponent} from './components/calendar/calendar.component';
-import {ClockComponent} from './components/clock/clock.component';
-import {ChartComponent} from './components/chart/chart.component';
-
-@NgModule({
-  declarations: [
-    FormSelectItemComponent, FormCheckboxComponent, TablePaginationComponent, FormBankCardComponent, SidebarItemComponent, SidebarComponent,
-    FormDateComponent, FormPlaqueSelectComponent, TableLoadingComponent, FormTreeItemComponent, FormTextboxComponent, FormTextareaComponent,
-    FormIconComponent, FormButtonComponent, FormDatetimeComponent, FormPlaqueComponent, SubHeaderComponent, FooterComponent, StepsComponent,
-    FormFileComponent, FormSelectComponent, FormTableComponent, FormLabelComponent, AccordionComponent, FormRadioComponent, HeaderComponent,
-    TooltipComponent, ConfirmComponent, TableComponent, ModalComponent, FormComponent, TableRowComponent, FormTreeComponent, AlertComponent,
-    FormTimeComponent, NotfoundComponent, FormFingerComponent, FormCarSearchComponent, FormCarComponent, TableReportComponent,
-    SafeStylePipe, LoginComponent, LoadingComponent, NotificationComponent, LayoutComponent, FormHiddenComponent, CalendarComponent,
-    ClockComponent, ChartComponent
-  ],
-  imports: [
-    CommonModule,
-    RouterModule,
-    FormsModule
-  ],
-  providers: [],
-  exports: [
-    FormSelectItemComponent, FormCheckboxComponent, TablePaginationComponent, FormBankCardComponent, SidebarItemComponent, SidebarComponent,
-    FormDateComponent, FormPlaqueSelectComponent, TableLoadingComponent, FormTreeItemComponent, FormTextboxComponent, FormTextareaComponent,
-    FormIconComponent, FormButtonComponent, FormDatetimeComponent, FormPlaqueComponent, SubHeaderComponent, FooterComponent, StepsComponent,
-    FormFileComponent, FormSelectComponent, FormTableComponent, FormLabelComponent, AccordionComponent, FormRadioComponent, HeaderComponent,
-    TooltipComponent, ConfirmComponent, TableComponent, ModalComponent, FormComponent, TableRowComponent, FormTreeComponent, AlertComponent,
-    FormTimeComponent, NotfoundComponent, FormFingerComponent, FormCarSearchComponent, FormCarComponent, TableReportComponent,
-    LoginComponent, LoadingComponent, NotificationComponent, LayoutComponent, FormHiddenComponent, CalendarComponent,
-    ClockComponent, ChartComponent
-  ]
-})
-export class PsToolkitUiModule {
-  static forRoot(config: any): ModuleWithProviders<PsToolkitUiModule> {
-    return {
-      ngModule: PsToolkitUiModule,
-      providers: [
-        {provide: PsToolkitUiConfigService, useValue: config }
-      ]
-    };
-  }
-}
-

package/src/lib/services/config.service.ts

@@ -1,8 +0,0 @@
-import {Inject} from '@angular/core';
-
-export class PsToolkitUiConfigService{
-  constructor(@Inject('environment') public environment: any,
-              @Inject('strings') public strings: any,
-              @Inject('currentLang') public currentLang: string) {
-  }
-}

package/src/test.ts

@@ -1,26 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
-    keys(): string[];
-    <T>(id: string): T;
-  };
-};
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting()
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

package/tsconfig.lib.json

@@ -1,25 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "target": "es2015",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": [],
-    "lib": [
-      "dom",
-      "es2018"
-    ]
-  },
-  "angularCompilerOptions": {
-    "skipTemplateCodegen": true,
-    "strictMetadataEmit": true,
-    "enableResourceInlining": true
-  },
-  "exclude": [
-    "src/test.ts",
-    "**/*.spec.ts"
-  ]
-}

package/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "enableIvy": false
-  }
-}

package/tsconfig.spec.json

@@ -1,17 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "files": [
-    "src/test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}

package/tslint.json

@@ -1,17 +0,0 @@
-{
-  "extends": "../../tslint.json",
-  "rules": {
-    "directive-selector": [
-      true,
-      "attribute",
-      "lib",
-      "camelCase"
-    ],
-    "component-selector": [
-      true,
-      "element",
-      "lib",
-      "kebab-case"
-    ]
-  }
-}