imm-element-ui 1.4.0 → 1.4.2

package/lib/am/am.component.d.ts

@@ -4,6 +4,7 @@ import { FormOptions } from '../form/form/form.component';
 import { SearchOptions } from '../search/search/search.component';
 import { ConfirmationService, MessageService } from 'primeng/api';
 import { ActivatedRoute, Router } from '@angular/router';
+import { LoadingService } from '../service/loading.service';
 import * as i0 from "@angular/core";
 export interface Param {
     id?: number;
@@ -146,10 +147,10 @@ export declare class AmComponent {
     searchPrm: Search;
     exportPrm: Search;
     tamplate: Deal;
-    isLoading: import("@angular/core").WritableSignal<boolean>;
     http: HttpClient;
     messageService: MessageService;
     confirmationService: ConfirmationService;
+    loadingService: LoadingService;
     route: ActivatedRoute;
     router: Router;
     constructor();

package/lib/form/form-type/image.type.d.ts

@@ -42,6 +42,8 @@ export declare class ImageComponent {
     props: ImageProps;
     imageList: string[];
     deleteHooks: Observable<any>[];
+    loading: boolean;
+    counter: number;
     constructor(http: HttpClient, action: ActionService, renderer: Renderer2, datePipe: DatePipe);
     choose(event: any, callback: any): void;
     uploadImage(file: File): Observable<any>;
@@ -53,6 +55,8 @@ export declare class ImageComponent {
     handleHookChange(): void;
     handleDisabled(): void;
     ajustedImage(event: any): void;
+    initLoading(counter: number): void;
+    updateLoading(fu: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ImageComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ImageComponent, "form-image", never, { "field": { "alias": "field"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/grid/grid/grid.component.d.ts

@@ -256,10 +256,10 @@ export declare class GridComponent {
     rawPrm?: Search;
     deleteEmit: import("@angular/core").OutputEmitterRef<number[]>;
     addEmit: import("@angular/core").OutputEmitterRef<void>;
-    addType: import("@angular/core").InputSignal<"select" | "none" | "handle" | undefined>;
+    addType: import("@angular/core").InputSignal<"none" | "handle" | "select" | undefined>;
     selectData: import("@angular/core").InputSignal<any[] | undefined>;
     showAct: import("@angular/core").InputSignal<boolean>;
-    actPos: import("@angular/core").InputSignal<"top" | "bottom">;
+    actPos: import("@angular/core").InputSignal<"bottom" | "top">;
     authLevel: import("@angular/core").InputSignal<number>;
     http: HttpClient;
     renderer: Renderer2;

package/lib/loading/loading.component.d.ts

@@ -0,0 +1,9 @@
+import { LoadingService } from '../service/loading.service';
+import * as i0 from "@angular/core";
+export declare class LoadingComponent {
+    private loadingService;
+    visible: import("@angular/core").Signal<boolean>;
+    constructor(loadingService: LoadingService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<LoadingComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LoadingComponent, "custom-loading", never, {}, {}, never, never, true, never>;
+}

package/lib/service/loading.service.d.ts

@@ -0,0 +1,11 @@
+import { Subject } from 'rxjs';
+import * as i0 from "@angular/core";
+export declare class LoadingService {
+    loading: import("@angular/core").WritableSignal<boolean>;
+    loading$: Subject<boolean>;
+    constructor();
+    setLoading(loading: boolean): void;
+    getLoading(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LoadingService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<LoadingService>;
+}

package/lib/steps/steps.component.d.ts

@@ -13,7 +13,7 @@ export declare class StepsComponent {
     needSelfAdjusting: import("@angular/core").InputSignal<boolean>;
     steps: import("@angular/core").InputSignal<Step[] | undefined>;
     displaySteps: import("@angular/core").Signal<Step[]>;
-    excludeValues: import("@angular/core").WritableSignal<(number | "end" | "start")[]>;
+    excludeValues: import("@angular/core").WritableSignal<(number | "start" | "end")[]>;
     current: import("@angular/core").InputSignal<number>;
     i18n: I18nService;
     change: import("@angular/core").OutputEmitterRef<number>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "imm-element-ui",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "peerDependencies": {
     "@angular/common": "^18.2.0",
     "@angular/core": "^18.2.0"

package/public-api.d.ts

@@ -14,11 +14,13 @@ export * from './lib/import/import.component';
 export * from './lib/log/log.component';
 export * from './lib/row-selector/row-selector.component';
 export * from './lib/share/utils';
+export * from './lib/service/loading.service';
 export * from './lib/service/action.service';
 export * from './lib/service/i18n.service';
 export * from './lib/service/themeConfig.service';
 export * from './lib/page-form/page-form.component';
 export * from './lib/page-grid-list/page-grid-list.component';
+export * from './lib/loading/loading.component';
 export * from './lib/steps/steps.component';
 export * from './lib/row-selector/row-selector.component';
 export * from './lib/search/search/search.component';

package/src/lib/loading/loading.component.scss

@@ -0,0 +1,31 @@
+.mask {
+	position: fixed;
+	top: 0;
+	left: 0;
+	height: 100vh;
+	width: 100vw;
+	z-index: 9998;
+}
+.progress {
+	position: fixed;
+	top: 35vh;
+	left: 50vw;
+	height: 5rem;
+	width: 5rem;
+	border-radius: 0.5rem;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	z-index: 9999;
+}
+
+:host ::ng-deep .custom-spinner .p-progress-spinner-circle {
+	animation: custom-progress-spinner-dash 3s ease-in-out infinite, custom-progress-spinner-color 12s ease-in-out infinite;
+}
+
+@keyframes custom-progress-spinner-color {
+	100%,
+	0% {
+		stroke: #fff;
+	}
+}

package/src/lib/styles/styles.scss

@@ -1,232 +1,232 @@
-:host ::ng-deep {
-	.p-disabled,
-	.p-component:disabled {
-		opacity: 1;
-	}
-	.p-inputtext {
-		border-width: 0;
-		border-radius: 0;
-		box-shadow: none;
-		background: #ffffff;
-		padding: 0;
-	}
-	.p-inputtext:not(.ng-valid).ng-dirty {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.p-inputtext:not(:disabled):hover {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.p-inputtext:not(:disabled).ng-hovered {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.p-inputtext:focus {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.ng-hovered .p-autocomplete-input:not(.p-disabled) {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.p-select-label {
-		padding: 0;
-	}
-	.p-select {
-		border-width: 0;
-		border-radius: 0;
-		box-shadow: none;
-		background: #ffffff;
-		.p-select-dropdown {
-			display: none;
-		}
-		.p-select-clear-icon {
-			display: none;
-		}
-	}
-	.p-select:not(.ng-valid).ng-dirty {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.p-select-open {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-select-dropdown {
-			display: flex;
-		}
-		.p-select-clear-icon {
-			display: flex;
-		}
-	}
-	.p-select:hover {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-select-dropdown {
-			display: flex;
-		}
-		.p-select-clear-icon {
-			display: flex;
-		}
-	}
-	.p-select.ng-hovered {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-select-dropdown {
-			display: flex;
-		}
-		.p-select-clear-icon {
-			display: flex;
-		}
-	}
-	.p-multiselect-label {
-		padding: 0;
-	}
-	.p-multiselect {
-		border-width: 0;
-		border-radius: 0;
-		background: #ffffff;
-		box-shadow: none;
-		.p-multiselect-dropdown {
-			display: none;
-		}
-	}
-	.p-multiselect:not(.ng-valid).ng-dirty {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.p-multiselect-open {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-multiselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-multiselect:not(.p-disabled).p-focus {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-multiselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-multiselect:not(.p-disabled):hover {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-multiselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-multiselect:not(.p-disabled).ng-hovered {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-multiselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-textarea {
-		border-radius: 0;
-		box-shadow: none;
-		padding: 0;
-		background: #ffffff;
-		resize: none;
-	}
-	.p-textarea:not(.ng-valid).ng-dirty {
-		background: var(--p-red-200) !important;
-		border: 1px solid var(--p-red-500) !important;
-	}
-	.p-textarea:not(:disabled):hover {
-		border: 1px solid var(--p-primary-color);
-		resize: vertical;
-	}
-	.p-textarea:not(:disabled).ng-hovered {
-		border: 1px solid var(--p-primary-color);
-		resize: vertical;
-	}
-	.p-textarea:focus {
-		border: 1px solid var(--p-primary-color);
-		resize: vertical;
-	}
-	.p-treeselect-label {
-		padding: 0;
-	}
-	.p-treeselect {
-		border-width: 0;
-		border-radius: 0;
-		box-shadow: none;
-		background: #ffffff;
-		.p-treeselect-dropdown {
-			display: none;
-		}
-	}
-	.ng-invalid.ng-dirty > .p-treeselect {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.p-treeselect-open {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-treeselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-treeselect:not(.p-disabled).p-focus {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-treeselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-treeselect:not(.p-disabled):hover {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-treeselect-dropdown {
-			display: flex;
-		}
-	}
-	.ng-hovered > .p-treeselect:not(.p-disabled) {
-		border-bottom: 1px solid var(--p-primary-color);
-		.p-treeselect-dropdown {
-			display: flex;
-		}
-	}
-	.p-menubar {
-		border-width: 0;
-		padding: 0;
-	}
-	.p-menubar-submenu {
-		z-index: 3;
-	}
-	.p-fileupload-advanced {
-		border-width: 0;
-		border-radius: 0;
-		background-color: #ffffff;
-	}
-	.p-fileupload-header {
-		padding: 0;
-	}
-	.p-fileupload-content {
-		padding: 0;
-		display: block;
-		border-width: 0;
-	}
-	.p-inputnumber:not(.ng-valid).ng-dirty > .p-inputtext {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.p-inputnumber.ng-hovered:not(.p-disabled) > .p-inputtext {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.ng-invalid.ng-dirty > .p-datepicker .p-inputtext {
-		background: var(--p-red-200) !important;
-		border-bottom: 1px solid var(--p-red-500) !important;
-	}
-	.ng-hovered > .p-datepicker:not(.p-disabled) .p-inputtext {
-		border-bottom: 1px solid var(--p-primary-color);
-	}
-	.cm-editor {
-		border: 1px solid #cbd5e1;
-	}
-	.cm-editor.cm-focused {
-		outline: none !important;
-		border: 1px solid var(--p-primary-color);
-	}
-	.cm-editor:hover {
-		border: 1px solid var(--p-primary-color);
-	}
-	.cm-editor.ng-hovered {
-		border: 1px solid var(--p-primary-color);
-	}
-	.cm-gutters {
-		background-color: #fff;
-		border: 'none';
-	}
-	.cm-activeLineGutter {
-		background-color: #fff;
-	}
-}
+:host ::ng-deep {
+	.p-disabled,
+	.p-component:disabled {
+		opacity: 1;
+	}
+	.p-inputtext {
+		border-width: 0;
+		border-radius: 0;
+		box-shadow: none;
+		background: #ffffff;
+		padding: 0;
+	}
+	.p-inputtext:not(.ng-valid).ng-dirty {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.p-inputtext:not(:disabled):hover {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.p-inputtext:not(:disabled).ng-hovered {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.p-inputtext:focus {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.ng-hovered .p-autocomplete-input:not(.p-disabled) {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.p-select-label {
+		padding: 0;
+	}
+	.p-select {
+		border-width: 0;
+		border-radius: 0;
+		box-shadow: none;
+		background: #ffffff;
+		.p-select-dropdown {
+			display: none;
+		}
+		.p-select-clear-icon {
+			display: none;
+		}
+	}
+	.p-select:not(.ng-valid).ng-dirty {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.p-select-open {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-select-dropdown {
+			display: flex;
+		}
+		.p-select-clear-icon {
+			display: flex;
+		}
+	}
+	.p-select:hover {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-select-dropdown {
+			display: flex;
+		}
+		.p-select-clear-icon {
+			display: flex;
+		}
+	}
+	.p-select.ng-hovered {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-select-dropdown {
+			display: flex;
+		}
+		.p-select-clear-icon {
+			display: flex;
+		}
+	}
+	.p-multiselect-label {
+		padding: 0;
+	}
+	.p-multiselect {
+		border-width: 0;
+		border-radius: 0;
+		background: #ffffff;
+		box-shadow: none;
+		.p-multiselect-dropdown {
+			display: none;
+		}
+	}
+	.p-multiselect:not(.ng-valid).ng-dirty {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.p-multiselect-open {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-multiselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-multiselect:not(.p-disabled).p-focus {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-multiselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-multiselect:not(.p-disabled):hover {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-multiselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-multiselect:not(.p-disabled).ng-hovered {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-multiselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-textarea {
+		border-radius: 0;
+		box-shadow: none;
+		padding: 0 0.25rem;
+		background: #ffffff;
+		resize: none;
+	}
+	.p-textarea:not(.ng-valid).ng-dirty {
+		background: var(--p-red-200) !important;
+		border: 1px solid var(--p-red-500) !important;
+	}
+	.p-textarea:not(:disabled):hover {
+		border: 1px solid var(--p-primary-color);
+		resize: vertical;
+	}
+	.p-textarea:not(:disabled).ng-hovered {
+		border: 1px solid var(--p-primary-color);
+		resize: vertical;
+	}
+	.p-textarea:focus {
+		border: 1px solid var(--p-primary-color);
+		resize: vertical;
+	}
+	.p-treeselect-label {
+		padding: 0;
+	}
+	.p-treeselect {
+		border-width: 0;
+		border-radius: 0;
+		box-shadow: none;
+		background: #ffffff;
+		.p-treeselect-dropdown {
+			display: none;
+		}
+	}
+	.ng-invalid.ng-dirty > .p-treeselect {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.p-treeselect-open {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-treeselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-treeselect:not(.p-disabled).p-focus {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-treeselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-treeselect:not(.p-disabled):hover {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-treeselect-dropdown {
+			display: flex;
+		}
+	}
+	.ng-hovered > .p-treeselect:not(.p-disabled) {
+		border-bottom: 1px solid var(--p-primary-color);
+		.p-treeselect-dropdown {
+			display: flex;
+		}
+	}
+	.p-menubar {
+		border-width: 0;
+		padding: 0;
+	}
+	.p-menubar-submenu {
+		z-index: 3;
+	}
+	.p-fileupload-advanced {
+		border-width: 0;
+		border-radius: 0;
+		background-color: #ffffff;
+	}
+	.p-fileupload-header {
+		padding: 0;
+	}
+	.p-fileupload-content {
+		padding: 0;
+		display: block;
+		border-width: 0;
+	}
+	.p-inputnumber:not(.ng-valid).ng-dirty > .p-inputtext {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.p-inputnumber.ng-hovered:not(.p-disabled) > .p-inputtext {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.ng-invalid.ng-dirty > .p-datepicker .p-inputtext {
+		background: var(--p-red-200) !important;
+		border-bottom: 1px solid var(--p-red-500) !important;
+	}
+	.ng-hovered > .p-datepicker:not(.p-disabled) .p-inputtext {
+		border-bottom: 1px solid var(--p-primary-color);
+	}
+	.cm-editor {
+		border: 1px solid #cbd5e1;
+	}
+	.cm-editor.cm-focused {
+		outline: none !important;
+		border: 1px solid var(--p-primary-color);
+	}
+	.cm-editor:hover {
+		border: 1px solid var(--p-primary-color);
+	}
+	.cm-editor.ng-hovered {
+		border: 1px solid var(--p-primary-color);
+	}
+	.cm-gutters {
+		background-color: #fff;
+		border: 'none';
+	}
+	.cm-activeLineGutter {
+		background-color: #fff;
+	}
+}