@ldquocc/dynamic-form 0.0.9 → 0.0.10

package/src/lib/shared/models/common/file-config.model.ts

@@ -1,22 +0,0 @@
-export interface ApiFileConfig {
-  // Upload url để upload file đến máy chủ.
-  uploadUrl: string;
-
-  // Delete url để xóa file khỏi máy chủ.
-  deleteUrl: string;
-
-  uploadByPath?: boolean;
-
-  uploadPath?: string;
-
-  isOriginName?: boolean;
-
-  // Custom upload theo mimeTypes.
-  perMimeTypeConfig?: Record<
-    string,
-    {
-      uploadUrl?: string;
-      buildFormData?: (file: File, extraParams?: Record<string, any>) => FormData;
-    }
-  >;
-}

package/src/lib/shared/models/common/obj-field.model.ts

@@ -1,68 +0,0 @@
-import { RawColumn, TableCellTypeEnum } from './table-models';
-import { BaseField } from '../fields/field.model';
-
-export class ObjField {
-  required!: number;
-  componentUI!: string;
-  appliedFields?: string[];
-  allowShare: number = 0;
-  allowView?: number;
-  allowSort?: number;
-  allowStatistic?: number;
-  code!: string;
-  createdAt!: string;
-  dataType!: string;
-  id!: string;
-  name!: string;
-  nameEn!: string;
-  objClassCode!: string;
-  objClassSubCode!: string;
-  codeOnDb?: string;
-  value?: any;
-  apiURL?: string;
-  seqNum?: number;
-  parentCode?: string;
-  parentCondition?: string;
-  parentApiBindValue!: string;
-  preventEdit?: number;
-  minSize?: number;
-  maxSize?: number;
-  minValue?: string;
-  maxValue?: string;
-  validateRegex?: string;
-  extra?: string; // JSON string khi parse sẽ thành Extra model.
-  note?: string;
-  transportType?: any;
-  iconData?: string;
-  objTypeGroupCode?: string;
-  viewType?: string;
-}
-
-interface FieldFormConfig {
-  formTypes: string[]; // mảng string động, từng giá trị là tên key truy cập cấu hình ở prop configs bên dưới.
-  configs: Record<string, BaseField<any>>; // config theo key formType.
-}
-
-export interface Extra {
-  // form.
-  form?: FieldFormConfig;
-
-  // table.
-  table?: Partial<RawColumn> & {
-    cellType: TableCellTypeEnum;
-    seqNum: number;
-    valueConfig?: {
-      params: string[];
-      body: string;
-    };
-    subValueConfig?: {
-      params: string[];
-      body: string;
-    };
-    dateFormat: string;
-  };
-  // ..........................
-
-  // chart.
-  // ..........................
-}

package/src/lib/shared/models/common/object-storage.model.ts

@@ -1,15 +0,0 @@
-export interface ObjectStorage {
-  id: string;
-  uid?: string; // Để xem là phần tử nào trong mảng NzUploadFile
-  name?: string;
-  contentType?: string;
-  size?: number;
-  bucket?: string;
-  isDir?: boolean;
-  createdAt?: string;
-  updatedAt?: string;
-  path?: string;
-  isPublic?: boolean;
-  originalName?: string;
-  nameAlias?: string;
-}

package/src/lib/shared/models/common/table-models.ts

@@ -1,16 +0,0 @@
-export enum TableCellTypeEnum {
-  ACTION = 'action',
-  CHECK = 'check',
-  SUBTEXT = 'subtext',
-  IMAGE = 'image',
-  BADGE = 'badge',
-  INDEX = 'index',
-  TEXT = 'text',
-  ICON_TEXT = 'icon-text',
-  SWAP_FUNC = 'swap',
-  EMPTY = 'empty',
-}
-
-export interface RawColumn {
-  [key: string]: any;
-}

package/src/lib/shared/models/fields/date/base-date-field.model.ts

@@ -1,52 +0,0 @@
-import { FormControl } from '@angular/forms';
-import { BaseField } from '../field.model';
-import { DATE_FIELD_TYPES } from '../../../consts/fields';
-import { ControlTypeEnum } from '../../../enums/controls';
-
-export type DateFieldType = (typeof DATE_FIELD_TYPES)[number];
-
-/**
- * Interface base chung cho Các dạng Date.
- */
-export abstract class BaseDateField<K> extends BaseField<K> {
-  // Dạng date hiển thị.
-  format: string;
-
-  // Cho phép chọn ngày quá khứ?
-  allowPastDates?: boolean;
-
-  // Cho phép chọn ngày tương lai?
-  allowFutureDates?: boolean;
-
-  /**
-   * Props validation chung cho các dạng Date.
-   */
-
-  constructor(init: Partial<BaseDateField<K>>) {
-    super(init);
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở Date.
-     */
-    this.controlType = ControlTypeEnum.Date;
-
-    this.allowPastDates = true;
-    this.allowFutureDates = true;
-    this.format = 'dd-MM-yyyy';
-
-    // this.value = undefined;
-
-    Object.assign(this, init);
-  }
-
-  // Tạo Form Control cho Input Field.
-  override toFormControl(): FormControl {
-    const commonValidators = this.getCommonValidators();
-    const customValidators = this.getCustomValidators();
-    return new FormControl(this.value ?? '', [...commonValidators, ...customValidators]);
-  }
-
-  abstract override getDefaultValue(): K;
-
-  abstract override toFormValue(modelValue: unknown): K;
-}

package/src/lib/shared/models/fields/date/date-picker-field.model.ts

@@ -1,43 +0,0 @@
-import { DatePickerOutputValueTypeEnum } from '../../../enums/common';
-import { FieldTypeEnum } from '../../../enums/fields';
-import { normalizeToDate } from '../../../utils/date';
-import { DatePickerOutputValueType } from '../../common';
-import { BaseDateField } from './base-date-field.model';
-
-const DEFAULT_DATE_PICKER_VALUE = '';
-
-/**
- * Interface của Date type là Picker.
- */
-export class DatePickerField extends BaseDateField<string | Date | null> {
-  // Dữ liệu sẽ gửi từ form khi submit.
-  outputAs!: DatePickerOutputValueType;
-
-  // Custom function to disable dates
-  disabledDateFn?: (current: Date) => boolean;
-
-  constructor(init: Partial<DatePickerField>) {
-    super(init);
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở Date picker.
-     */
-    this.type = FieldTypeEnum.DatePicker;
-    this.value = DEFAULT_DATE_PICKER_VALUE;
-    this.initialValue = DEFAULT_DATE_PICKER_VALUE;
-    this.outputAs = DatePickerOutputValueTypeEnum.String;
-    Object.assign(this, init);
-  }
-
-  override getDefaultValue(): string | Date {
-    return DEFAULT_DATE_PICKER_VALUE;
-  }
-
-  override toFormValue(modelValue: unknown): Date | null {
-    const value = modelValue as string | Date;
-
-    if (!value) return null;
-
-    return normalizeToDate(value);
-  }
-}

package/src/lib/shared/models/fields/date/date-range-field.model.ts

@@ -1,52 +0,0 @@
-import { DateRangeOutputValueTypeEnum } from "../../../enums/common";
-import { FieldTypeEnum } from "../../../enums/fields";
-import { normalizeToDate } from "../../../utils/date";
-import { DateRangeOutputValueType } from "../../common";
-import { BaseDateField } from "./base-date-field.model";
-
-const DEFAULT_DATE_RANGE_VALUE: string[] | Date[] = [];
-
-/**
- * Interface của Date type là Range.
- */
-export class DateRangeField extends BaseDateField<string | string[] | Date[]> {
-  // Dữ liệu sẽ gửi từ form khi submit.
-  outputAs!: DateRangeOutputValueType;
-
-  // Placeholder cho Date range (mảng gồm ngày bắt đầu và kết thúc)
-  placeholders?: string[];
-
-  constructor(init: Partial<DateRangeField>) {
-    super(init);
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở Date range.
-     */
-    this.type = FieldTypeEnum.DateRange;
-    this.value = DEFAULT_DATE_RANGE_VALUE;
-    this.initialValue = DEFAULT_DATE_RANGE_VALUE;
-    this.outputAs = DateRangeOutputValueTypeEnum.StringArray;
-    Object.assign(this, init);
-  }
-
-  override getDefaultValue(): string[] | Date[] {
-    return DEFAULT_DATE_RANGE_VALUE;
-  }
-
-  override toFormValue(modelValue: unknown): string[] | Date[] {
-    let value = modelValue as string | string[] | Date[];
-
-    if (typeof value === "string") {
-      value = value.split(",").map((dateStr) => dateStr.trim());
-    }
-
-    let dateRange: Date[] = [];
-
-    if (value?.length === 2) {
-      const startDate = normalizeToDate(value[0]);
-      const endDate = normalizeToDate(value[1]);
-      if (startDate && endDate) dateRange = [startDate, endDate];
-    }
-    return dateRange;
-  }
-}

package/src/lib/shared/models/fields/field-grid.model.ts

@@ -1,10 +0,0 @@
-import { EmbeddedProperty } from "ng-zorro-antd/grid";
-
-export interface FieldGrid {
-  xs?: string | number | EmbeddedProperty | null;
-  sm?: string | number | EmbeddedProperty | null;
-  md?: string | number | EmbeddedProperty | null;
-  lg?: string | number | EmbeddedProperty | null;
-  xl?: string | number | EmbeddedProperty | null;
-  xxl?: string | number | EmbeddedProperty | null;
-}

package/src/lib/shared/models/fields/field-group.model.ts

@@ -1,50 +0,0 @@
-import { TemplateRef } from '@angular/core';
-import { BaseField } from './field.model';
-
-// Dữ liệu sau khi đã tiến hành xử lý gom nhóm từ fields và groups.
-export class GroupedFields {
-  noGroup: BaseField<any>[];
-  grouped: {
-    group: FieldGroup;
-    fields: BaseField<any>[];
-  }[];
-
-  constructor(init: Partial<GroupedFields>) {
-    this.noGroup = [];
-    this.grouped = [];
-
-    Object.assign(this, init);
-  }
-}
-
-// Đại diện cho 1 group.
-export class FieldGroup {
-  // Nhãn của nhóm field.
-  label!: string;
-
-  // Mã nhóm field.
-  code!: string;
-
-  template?: TemplateRef<any>;
-
-  // Thứ tự hiển thị nhóm field.
-  order!: number;
-
-  // Có mở sẵn collapse hay không?
-  isActive: boolean;
-
-  showArrow: boolean;
-
-  required: boolean;
-
-  disabled: boolean;
-
-  constructor(init: Partial<FieldGroup>) {
-    this.isActive = false;
-    this.showArrow = true;
-    this.disabled = false;
-    this.required = false;
-
-    Object.assign(this, init);
-  }
-}

package/src/lib/shared/models/fields/field-user-config.model.ts

@@ -1,8 +0,0 @@
-export interface FieldUserConfig {
-  // Tại form public, cho phép người dùng bật/tắt required của một field đang thao tác.
-  allowOverrideRequired?: boolean;
-
-  // Sau này có thể mở rộng thêm:
-  // allowToggleVisibility?: boolean;
-  // allowToggleReadonly?: boolean;
-}

package/src/lib/shared/models/fields/field.model.ts

@@ -1,184 +0,0 @@
-import { FormControl, ValidatorFn, Validators } from "@angular/forms";
-import { FIELD_TYPES } from "../../consts/fields";
-import { matchFieldsValidator } from "../../utils/validators/custom-validators";
-import { FieldGrid } from "./field-grid.model";
-import { NzLabelAlignType } from "ng-zorro-antd/form";
-import {
-  CommonValidaterEnum,
-  CustomValidaterEnum,
-} from "../../enums/validators";
-import { ControlType } from "../controls";
-import { FormMode } from "../form";
-import { FormModeEnum } from "../../enums/form";
-import { uuidGenerator } from "../../utils/common";
-import { ViewMode } from "../common";
-import { ViewModeEnum } from "../../enums/common";
-import { FieldUserConfig } from "../fields/field-user-config.model";
-
-/**
- * typeof FIELD_TYPES[number] có nghĩa là:
-    - FIELD_TYPES là readonly ['input', 'select', 'checkbox']
-    - FIELD_TYPES[number] = FIELD_TYPES[0] | FIELD_TYPES[1] | ... = 'input' | 'select' | 'checkbox'
-    => FieldType = 'input' | 'select' | 'checkbox'
-*/
-export type FieldType = (typeof FIELD_TYPES)[number];
-
-/**
- * Abstract class chung cho Field.
- */
-export abstract class BaseField<T> {
-  id: string;
-
-  // Giá trị Binding với Reactive Form dùng ở formControlName.
-  key!: string;
-
-  // Nhãn hiển thị tên của Field.
-  label!: string;
-
-  // Giá trị của Field.
-  value?: T;
-
-  // Giá trị ban đầu để reset.
-  initialValue?: T;
-
-  // Giá gốc từ model.
-  modelValue?: T;
-
-  // Loại Field: input-text, single-select,...
-  type!: FieldType;
-
-  // Loại control: input, select,... gom nhóm các dạng field.
-  controlType!: ControlType;
-
-  // Nhãn hint.
-  placeholder?: string;
-
-  // Hiển thị text khi hover.
-  tooltip?: string;
-
-  /** Props validation chung */
-  required: boolean;
-
-  /** Props validation custom chung */
-  matchField?: string;
-
-  icon?: string;
-
-  // Custom error message theo validation props.
-  errorMessages?: Record<string, string>;
-
-  // Grid layout của Field.
-  grid: FieldGrid;
-
-  // Grid layout của Label nằm trong Field.
-  labelGrid: FieldGrid;
-
-  // Vị trí của Label khi ở trong một khối cụ thể.
-  labelAlign: NzLabelAlignType;
-
-  // Grid layout của Control nằm trong Field.
-  controlGrid: FieldGrid;
-
-  // Ẩn field và không thao tác bất kì gì liên quan.
-  isHidden: boolean;
-
-  // Vô hiệu hóa field.
-  isDisabled: boolean;
-
-  // Đánh dấu giá trị của field sẽ cần cho field khác có thuộc tính dependsOn.
-  isParent: boolean;
-
-  // Cho phép gán first data ở cả mode add hoặc edit hay không.
-  allowSetValue: FormMode[];
-
-  // Gom nhóm field theo mã của nhóm. Mã này sẽ config theo code của FieldGroup model và config ở FE.
-  groupCode?: string; // Không thuộc nhóm thì bỏ trống hoặc điền None.
-
-  // Mode view: form (view theo control được disable) hoặc text (chỉ hiện thị text có thể là paragraph). Riêng upload thì không áp dụng vì không phân biệt control.
-  viewMode: ViewMode;
-
-  // Nhãn phu hiển thị tên của Field.
-  sublabel?: string;
-
-  // Thứ tự hiển thị của field
-  seqNum: number = 0;
-
-  // Cho phép field phát sự kiện change khi thay đổi giá trị.
-  enableFieldChange: boolean;
-
-  // Cấu hình các tính năng cho phép người dùng tự thay đổi trên field
-  userConfigs?: FieldUserConfig;
-
-  constructor(init?: Partial<BaseField<T>>) {
-    if (!init?.key || !init?.label) {
-      throw new Error("key, label, and type are required");
-    }
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở BaseField.
-     */
-    this.id = uuidGenerator();
-    this.required = false;
-    this.grid = { xs: 24 };
-    this.labelGrid = { xs: 24 };
-    this.controlGrid = { xs: 24 };
-    this.labelAlign = "left";
-    this.isHidden = false;
-    this.isDisabled = false;
-    this.isParent = false;
-    this.allowSetValue = [
-      FormModeEnum.Add,
-      FormModeEnum.Edit,
-      FormModeEnum.View,
-    ];
-    this.viewMode = ViewModeEnum.form;
-    this.enableFieldChange = false;
-
-    Object.assign(this, init);
-  }
-
-  // Tạo control cho từng loại field.
-  abstract toFormControl(): FormControl;
-
-  // Default value ban đầu cho từng loại field.
-  abstract getDefaultValue(): T;
-
-  abstract toFormValue(modelValue: unknown): T;
-
-  // Tạo các validate chung cho các props ở abstract. this khi gọi trong class con sẽ đại diện cho đối tượng tạo từ class đó.
-  protected getCommonValidators(): ValidatorFn[] {
-    const validators: ValidatorFn[] = [];
-
-    if (this.required) validators.push(Validators.required);
-
-    return validators;
-  }
-
-  // Tạo các validate custom chung cho các props ở abstract. this khi gọi trong class con sẽ đại diện cho đối tượng tạo từ class đó.
-  protected getCustomValidators(): ValidatorFn[] {
-    const validators: ValidatorFn[] = [];
-
-    if (this.matchField) validators.push(matchFieldsValidator(this.matchField));
-
-    return validators;
-  }
-
-  getErrorMessage(
-    errorKey: string,
-    errorValue: any,
-    allFields: BaseField<any>[],
-  ): string {
-    if (errorKey === CommonValidaterEnum.Required) {
-      return `${this.label || "Trường này"} là bắt buộc`;
-    }
-
-    if (errorKey === CustomValidaterEnum.MatchField) {
-      const matchKey = this.matchField;
-      const targetLabel =
-        allFields.find((f) => f.key === matchKey)?.label || matchKey;
-      return `${this.label} không khớp với ${targetLabel}`;
-    }
-
-    return "";
-  }
-}

package/src/lib/shared/models/fields/input/input-field.model.ts

@@ -1,111 +0,0 @@
-import { FormControl, ValidatorFn, Validators } from '@angular/forms';
-import { INPUT_FIELD_TYPES } from '../../../consts/fields/input-field.const';
-import { BaseField } from '../field.model';
-import { noLeadingSpaceValidator } from '../../../utils/validators/custom-validators';
-import { resolvePattern } from '../../../utils/validators/pattern';
-import { CommonValidaterEnum, CustomValidaterEnum } from '../../../enums/validators';
-import {
-  getDefaultMaxLengthErrorMessage,
-  getDefaultMinLengthErrorMessage,
-  getDefaultPatternErrorMessage,
-  getLeadingSpaceErrorMessage,
-} from '../../../utils/validators';
-import { ControlTypeEnum } from '../../../enums/controls';
-import { Suffix } from '../../common/common.model';
-
-/**
- * typeof FIELD_TYPES[number] có nghĩa là:
-    - INPUT_FIELD_TYPES là readonly ['text','email','password','number']
-    - INPUT_FIELD_TYPES[number] = INPUT_FIELD_TYPES[0] | INPUT_FIELD_TYPES[1] | ... = 'text' | 'email' | ...
-    => FieldType = 'input' | 'select' | 'checkbox'
-*/
-export type InputFieldType = (typeof INPUT_FIELD_TYPES)[number];
-
-const DEFAULT_INPUT_VALUE = '';
-
-/**
- * Interface base chung cho Các dạng Input Field.
- */
-export abstract class InputBaseField extends BaseField<string> {
-  suffixes: Suffix[];
-
-  /**
-   * Props validation chung cho các dạng Input.
-   */
-  // Độ dài tối thiểu của chuỗi nhập vào.
-  minLength?: number;
-  // Độ dài tối đa của chuỗi nhập vào.
-  maxLength?: number;
-  // Theo mẫu regex hoặc đối tượng RegExr
-  pattern?: string | RegExp;
-
-  isCurrency: boolean;
-
-  constructor(init: Partial<InputBaseField>) {
-    super(init);
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở Input.
-     */
-    this.controlType = ControlTypeEnum.Input;
-    this.value = DEFAULT_INPUT_VALUE;
-    this.initialValue = DEFAULT_INPUT_VALUE;
-    this.suffixes = [];
-    this.isCurrency = false;
-
-    Object.assign(this, init);
-  }
-
-  // Mảng ValidatorFn các validation chung được hỗ trợ sẵn bởi Reactive form của angular cho Input.
-  protected getInputCommonValidators(): ValidatorFn[] {
-    const validators = this.getCommonValidators();
-
-    if (this.minLength) validators.push(Validators.minLength(this.minLength));
-    if (this.maxLength) validators.push(Validators.maxLength(this.maxLength));
-    if (this.pattern) {
-      const resolvePatternResult = resolvePattern(this.pattern);
-      if (resolvePatternResult?.type !== 'unknown')
-        validators.push(Validators.pattern(resolvePatternResult.value));
-    }
-
-    return validators;
-  }
-
-  // Mảng ValidatorFn các custom validation có thể dùng cho Input.
-  protected getInputCustomValidators(): ValidatorFn[] {
-    const validators = this.getCustomValidators();
-
-    validators.push(noLeadingSpaceValidator());
-
-    return validators;
-  }
-
-  // Tạo Form Control cho Input Field.
-  override toFormControl(): FormControl {
-    const commonValidators = this.getInputCommonValidators();
-    const customValidators = this.getInputCustomValidators();
-    return new FormControl(this.value ?? '', [...commonValidators, ...customValidators]);
-  }
-
-  // Giá trị mặc định.
-  override getDefaultValue(): string {
-    return DEFAULT_INPUT_VALUE;
-  }
-
-  override toFormValue(modelValue: unknown): string {
-    return String(modelValue);
-  }
-
-  override getErrorMessage(errorKey: string, errorValue: any, allFields: BaseField<any>[]): string {
-    if (errorKey === CommonValidaterEnum.Pattern) {
-      if (this.pattern) return getDefaultPatternErrorMessage(this.label, this.pattern);
-    }
-    if (errorKey === CommonValidaterEnum.MinLength)
-      return getDefaultMinLengthErrorMessage(this.label, errorValue);
-    if (errorKey === CommonValidaterEnum.MaxLength)
-      return getDefaultMaxLengthErrorMessage(this.label, errorValue);
-    if (errorKey === CustomValidaterEnum.LeadingSpace)
-      return getLeadingSpaceErrorMessage(this.label);
-    return super.getErrorMessage(errorKey, errorValue, allFields);
-  }
-}

package/src/lib/shared/models/fields/input/input-formatted-field.model.ts

@@ -1,38 +0,0 @@
-import { FormControl } from "@angular/forms";
-import { FieldTypeEnum } from "../../../enums/fields";
-import { InputBaseField } from "./input-field.model";
-import { NumericPreset } from "../../../enums/fields/input-formatted-field.enum";
-import AutoNumeric from "@zeedhi/autonumeric";
-
-/**
- * Interface của Input Field dạng format.
- */
-export class InputFormattedField extends InputBaseField {
-  // Kiểu định dạng số.
-  format: NumericPreset;
-
-  // Option cho autoNumeric. Có thê custom với dạng format là custom và truyền options từ ngoài vào.
-  autoNumericOptions?: Partial<AutoNumeric.Options>;
-
-  constructor(init: Partial<InputFormattedField>) {
-    super(init);
-
-    /**
-     * Gán giá trị cho các props cần giá trị mặc định ở InputFormatted.
-     */
-    this.type = FieldTypeEnum.InputFormatted;
-    this.format = NumericPreset.Integer;
-
-    Object.assign(this, init);
-  }
-
-  // Tạo Form Control cho Input Formatted Field.
-  override toFormControl(): FormControl {
-    const commonValidators = this.getInputCommonValidators();
-    const customValidators = this.getInputCustomValidators();
-    return new FormControl(this.value ?? "", [
-      ...commonValidators,
-      ...customValidators,
-    ]);
-  }
-}