@acorex/modules 19.2.4 → 19.2.5

package/fesm2022/acorex-modules-organization-managment-org-chart.page-CTHNSn2n.mjs

@@ -0,0 +1,505 @@
+import { AXPanViewDirective } from '@acorex/cdk/pan-view';
+import * as i3 from '@acorex/components/button';
+import { AXButtonModule } from '@acorex/components/button';
+import * as i5 from '@acorex/components/decorators';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
+import { AXLoadingModule } from '@acorex/components/loading';
+import * as i2 from '@acorex/components/menu';
+import { AXContextMenuComponent, AXMenuModule } from '@acorex/components/menu';
+import * as i4 from '@acorex/core/translation';
+import { AXTranslationService, AXTranslationModule } from '@acorex/core/translation';
+import { AXPSimplePageLayout } from '@acorex/platform/themes/default';
+import { AXPLayoutThemeService, AXPThemeLayoutBlockComponent, AXPThemeLayoutHeaderTemplateComponent, AXPThemeLayoutActionsComponent, AXPThemeLayoutPageSecondaryActionsComponent, AXPThemeLayoutPagePrimaryActionsComponent } from '@acorex/platform/themes/shared';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { inject, Injectable, viewChild, NgZone, ViewContainerRef, signal, afterNextRender, Component, ChangeDetectionStrategy } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { AXLoadingDialogService } from '@acorex/components/loading-dialog';
+import { AXPExportService } from '@acorex/platform/common';
+import * as i6 from '@acorex/components/breadcrumbs';
+import { AXBreadcrumbsModule } from '@acorex/components/breadcrumbs';
+import { RootConfig } from './acorex-modules-organization-managment.mjs';
+
+class AXMOrgChartPrintService {
+    constructor() {
+        this.loadingDialog = inject(AXLoadingDialogService);
+        this.exportService = inject(AXPExportService);
+        this.translationService = inject(AXTranslationService);
+    }
+    async printChart(element) {
+        const d = this.loadingDialog.show({
+            title: 'Printing Organization Chart...',
+            mode: 'determinate',
+            progressColor: 'primary',
+            progressValue: 0,
+            status: '0/10',
+            text: 'Initializing print process...',
+            buttons: [
+                {
+                    text: 'Cancel',
+                    color: 'danger',
+                    onClick: () => {
+                        d.close();
+                    },
+                },
+            ],
+        });
+        try {
+            // Step 1: Start Process
+            await this.HandleStep(d, await this.translateStatements('preparing-document'), 10, '1/10');
+            const chartElement = element;
+            const { originalStyles, modifiedStyles } = this.expandChart(chartElement);
+            // Step 2: Render the Chart
+            await this.HandleStep(d, await this.translateStatements('rendering-chart-image'), 25, '2.5/10');
+            const canvasBlob = await this.exportService.generateBlobFromElement(chartElement, {
+                popup: true,
+                bgcolor: 'transparent',
+                scale: 2,
+                quality: 1,
+                height: Number.parseInt(modifiedStyles.modifiedHeight),
+                width: Number.parseInt(modifiedStyles.modifiedWidth),
+            });
+            // Step 3: Finalizing Image Processing
+            await this.HandleStep(d, await this.translateStatements('finalizing-image-processing'), 50, '5/10');
+            this.restoreChartStyles(chartElement, originalStyles);
+            // Step 4: Download Image
+            await this.HandleStep(d, await this.translateStatements('downloading-image'), 75, '7.5/10');
+            this.exportService.download(canvasBlob, 'org-chart.png');
+            // Step 5: Completion
+            await this.HandleStep(d, await this.translateStatements('process-complete'), 100, '10/10');
+            // Close the dialog after a short delay
+            setTimeout(() => d.close(), 1500);
+        }
+        catch (err) {
+            console.error('Error capturing chart:', err);
+            await this.HandleStep(d, await this.translateStatements('failed-to-generate-chart-image'), 100, 'Error', 'danger');
+            d.close();
+        }
+    }
+    /**
+     * Expands the chart temporarily to capture the full view.
+     */
+    expandChart(chartElement) {
+        const originalStyles = {
+            originalOverflow: chartElement.style.overflow,
+            originalWidth: chartElement.style.width,
+            originalHeight: chartElement.style.height,
+        };
+        const modifiedStyles = {
+            modifiedOverflow: 'visible',
+            modifiedWidth: `${chartElement.scrollWidth}px`,
+            modifiedHeight: `${chartElement.scrollHeight}px`,
+        };
+        chartElement.style.overflow = modifiedStyles.modifiedOverflow;
+        chartElement.style.width = modifiedStyles.modifiedWidth;
+        chartElement.style.height = modifiedStyles.modifiedHeight;
+        return { originalStyles, modifiedStyles };
+    }
+    /**
+     * Restores chart styles after capturing.
+     */
+    restoreChartStyles(chartElement, originalStyles) {
+        chartElement.style.overflow = originalStyles.originalOverflow;
+        chartElement.style.width = originalStyles.originalWidth;
+        chartElement.style.height = originalStyles.originalHeight;
+    }
+    /**
+     * Handles updating the progress dialog step.
+     */
+    async HandleStep(dialog, text, progress, status, color = 'primary') {
+        return new Promise((resolve) => {
+            dialog.setProgressColor(color);
+            dialog.setProgressText(text);
+            dialog.setProgressValue(progress);
+            dialog.setProgressStatus(status);
+            resolve();
+        });
+    }
+    async translateStatements(key) {
+        return (await this.translationService.translateAsync(key, { scope: 'organization-management' })) + '...';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMOrgChartPrintService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMOrgChartPrintService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMOrgChartPrintService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+var AXMOrganizationNodeType;
+(function (AXMOrganizationNodeType) {
+    AXMOrganizationNodeType["Company"] = "Company";
+    AXMOrganizationNodeType["Location"] = "Location";
+    AXMOrganizationNodeType["BusinessUnit"] = "BusinessUnit";
+    AXMOrganizationNodeType["Role"] = "Role";
+    AXMOrganizationNodeType["Person"] = "Person"; // Employee
+})(AXMOrganizationNodeType || (AXMOrganizationNodeType = {}));
+const AXM_ALLOWED_CHILD_NODES = {
+    [AXMOrganizationNodeType.Company]: [AXMOrganizationNodeType.Location, AXMOrganizationNodeType.BusinessUnit],
+    [AXMOrganizationNodeType.Location]: [AXMOrganizationNodeType.Location, AXMOrganizationNodeType.BusinessUnit],
+    [AXMOrganizationNodeType.BusinessUnit]: [AXMOrganizationNodeType.BusinessUnit, AXMOrganizationNodeType.Role],
+    [AXMOrganizationNodeType.Role]: [AXMOrganizationNodeType.Person],
+    [AXMOrganizationNodeType.Person]: [] // No children allowed
+};
+const AXM_ORGANIZATION_DATA = {
+    id: '1',
+    title: 'CEO',
+    subtitle: 'Chief Executive Officer',
+    description: 'Responsible for the overall success of the',
+    icon: 'fa-user-tie',
+    children: [
+        {
+            id: '2',
+            title: 'CTO',
+            subtitle: 'Chief Technology Officer',
+            //description: 'Leads the technology team and innovation.',
+            icon: 'fa-microchip',
+            children: [
+                {
+                    id: '3',
+                    title: 'Engineering Director',
+                    subtitle: 'Director of Engineering',
+                    description: 'Oversees all engineering teams.',
+                    icon: 'fa-cogs',
+                    children: [
+                        {
+                            id: '4',
+                            title: 'Dev Manager',
+                            subtitle: 'Development Manager',
+                            description: 'Manages the development team.',
+                            icon: 'fa-code',
+                            children: [
+                                {
+                                    id: '5',
+                                    title: 'Frontend Team Lead',
+                                    subtitle: 'Leads frontend developers',
+                                    description: 'Manages the frontend development efforts.',
+                                    icon: 'fa-paint-brush',
+                                },
+                                {
+                                    id: '6',
+                                    title: 'Backend Team Lead',
+                                    subtitle: 'Leads backend developers',
+                                    description: 'Manages the backend development efforts.',
+                                    icon: 'fa-database',
+                                },
+                            ],
+                        },
+                        {
+                            id: '7',
+                            title: 'QA Manager',
+                            subtitle: 'Quality Assurance Manager',
+                            description: 'Ensures product quality.',
+                            icon: 'fa-check-circle',
+                            children: [
+                                {
+                                    id: '8',
+                                    title: 'QA Engineer',
+                                    subtitle: 'Quality Assurance Engineer',
+                                    description: 'Tests and ensures software quality.',
+                                    icon: 'fa-bug',
+                                },
+                            ],
+                        },
+                    ],
+                },
+                {
+                    id: '9',
+                    title: 'Security Manager',
+                    subtitle: 'Security & Compliance',
+                    description: 'Ensures security policies and compliance.',
+                    icon: 'fa-shield-alt',
+                },
+            ],
+        },
+        {
+            id: '10',
+            title: 'CFO',
+            subtitle: 'Chief Financial Officer',
+            description: 'Manages the financial health of the organization.',
+            icon: 'fa-chart-line',
+            children: [
+                {
+                    id: '11',
+                    title: 'Finance Manager',
+                    subtitle: 'Oversees financial operations',
+                    description: 'Handles budgets, financial planning, and reporting.',
+                    icon: 'fa-money-bill-wave',
+                },
+                {
+                    id: '12',
+                    title: 'Accounting Manager',
+                    subtitle: 'Manages accounting team',
+                    description: 'Ensures financial accuracy and compliance.',
+                    icon: 'fa-calculator',
+                },
+            ],
+        },
+        {
+            id: '13',
+            title: 'COO',
+            subtitle: 'Chief Operating Officer',
+            description: 'Oversees daily business operations.',
+            icon: 'fa-briefcase',
+            children: [
+                {
+                    id: '14',
+                    title: 'HR Manager',
+                    subtitle: 'Human Resources Manager',
+                    description: 'Manages recruitment and employee relations.',
+                    icon: 'fa-users',
+                },
+                {
+                    id: '15',
+                    title: 'Operations Manager',
+                    subtitle: 'Leads business operations',
+                    description: 'Oversees operational efficiency and process improvements.',
+                    icon: 'fa-industry',
+                },
+            ],
+        },
+        {
+            id: '16',
+            title: 'CMO',
+            subtitle: 'Chief Marketing Officer',
+            description: 'Leads marketing and brand strategy.',
+            icon: 'fa-bullhorn',
+            children: [
+                {
+                    id: '17',
+                    title: 'Marketing Manager',
+                    subtitle: 'Oversees marketing team',
+                    description: 'Handles branding, campaigns, and customer engagement.',
+                    icon: 'fa-ad',
+                },
+                {
+                    id: '18',
+                    title: 'Sales Director',
+                    subtitle: 'Leads sales initiatives',
+                    description: 'Drives revenue and sales growth.',
+                    icon: 'fa-handshake',
+                    children: [
+                        {
+                            id: '19',
+                            title: 'Sales Manager',
+                            subtitle: 'Manages sales team',
+                            description: 'Oversees sales operations and targets.',
+                            icon: 'fa-shopping-cart',
+                        },
+                    ],
+                },
+            ],
+        },
+    ],
+};
+
+class AXMOrgChartPage {
+    constructor() {
+        this.layout = inject(AXPLayoutThemeService);
+        this.rootConfig = RootConfig;
+        this.nodeTemplate = viewChild.required('nodeTemplate');
+        this.treeContainer = viewChild.required('chart');
+        this.parent = viewChild.required('parent');
+        this.contextMenu = viewChild(AXContextMenuComponent);
+        this.ngzone = inject(NgZone);
+        this.viewContainerRef = inject(ViewContainerRef);
+        this.chartPrintService = inject(AXMOrgChartPrintService);
+        this.DATA = AXM_ORGANIZATION_DATA;
+        this.NODE_STROKE_COLOR = 'rgba(var(--ax-sys-color-primary-400))';
+        this.LINK_STROKE_WIDTH = 1;
+        this.isFullscreen = signal(false);
+        this.panX = signal(0);
+        this.panY = signal(0);
+        this.panZoomLevel = signal(100);
+        this.#initialize = afterNextRender(async () => {
+            this.d3 = await import('d3');
+            this.createChart(this.treeContainer().nativeElement, this.DATA);
+        });
+    }
+    #initialize;
+    // eff = effect(() => console.log(this.panX(), this.panY()));
+    zoomIn() {
+        this.panZoomLevel.update((prev) => prev + 5);
+    }
+    zoomOut() {
+        this.panZoomLevel.update((prev) => prev - 5);
+    }
+    zoomReset() {
+        this.panX.set(1);
+        this.panY.set(1);
+        this.panX.set(0);
+        this.panY.set(0);
+        this.panZoomLevel.set(100);
+    }
+    toggleFullscreen() {
+        if (this.isFullscreen()) {
+            document.exitFullscreen();
+            this.isFullscreen.set(false);
+        }
+        else {
+            this.parent().nativeElement.requestFullscreen();
+            this.isFullscreen.set(true);
+        }
+    }
+    calculateMaxDepth(node) {
+        if (!node.children || node.children.length === 0 || node.isExpanded === false) {
+            return 1; // Base case: no children or node is collapsed
+        }
+        return 1 + Math.max(...node.children.map((child) => this.calculateMaxDepth(child)));
+    }
+    calculateMaxBreadth(node) {
+        if (!node.children || node.children.length === 0 || node.isExpanded === false) {
+            return 1; // Base case: no children or node is collapsed
+        }
+        return node.children.reduce((acc, child) => acc + this.calculateMaxBreadth(child), 0);
+    }
+    createChart(el, data) {
+        this.ngzone.runOutsideAngular(() => {
+            // Constants for node dimensions and spacing
+            const NODE_WIDTH_BASE = 240; // Base width for each node
+            const NODE_HEIGHT_BASE = 120; // Base height for each node
+            const HORIZONTAL_SPACING = 25; // Horizontal spacing between nodes
+            const VERTICAL_SPACING = 50; // Vertical spacing between levels
+            // Clear existing SVG and create a new one
+            this.clearChart(el);
+            const newSvg = this.d3.select(el).append('svg');
+            // Create a hierarchy from the data
+            const root = this.d3.hierarchy(data);
+            // Filter out collapsed nodes and their descendants
+            root.descendants().forEach((node) => {
+                if (node.data.isExpanded === false) {
+                    node.children = undefined; // Remove children for collapsed nodes
+                }
+            });
+            // Create a tree layout
+            const treeLayout = this.d3
+                .tree()
+                .nodeSize([NODE_WIDTH_BASE + HORIZONTAL_SPACING, NODE_HEIGHT_BASE + VERTICAL_SPACING]);
+            // Generate the tree nodes and links
+            treeLayout(root);
+            // Calculate the bounds of the tree
+            let minX = Infinity, maxX = -Infinity, minY = Infinity, maxY = -Infinity;
+            root.descendants().forEach((d) => {
+                if (d.x < minX)
+                    minX = d.x;
+                if (d.x > maxX)
+                    maxX = d.x;
+                if (d.y < minY)
+                    minY = d.y;
+                if (d.y > maxY)
+                    maxY = d.y;
+            });
+            // Calculate SVG dimensions based on tree bounds
+            const CONTAINER_WIDTH = maxX - minX + NODE_WIDTH_BASE + 2 * HORIZONTAL_SPACING;
+            const CONTAINER_HEIGHT = maxY - minY + NODE_HEIGHT_BASE + 2 * VERTICAL_SPACING;
+            // Set SVG dimensions
+            newSvg.attr('width', CONTAINER_WIDTH).attr('height', CONTAINER_HEIGHT);
+            // Adjust the transform of the <g> element to center the tree
+            const g = newSvg
+                .append('g')
+                .attr('transform', `translate(${-minX + NODE_WIDTH_BASE / 2 + HORIZONTAL_SPACING / 2}, ${-minY + NODE_HEIGHT_BASE / 2 + VERTICAL_SPACING / 2})`);
+            // Create links (lines with 90-degree angles)
+            const link = g
+                .selectAll('.link')
+                .data(root.links())
+                .enter()
+                .append('path')
+                .attr('class', 'link')
+                .attr('d', (d) => {
+                const source = d.source;
+                const target = d.target;
+                return `M${source.x},${source.y}V${(source.y + target.y) / 2}H${target.x}V${target.y - 10}`;
+            })
+                .attr('fill', 'none')
+                .attr('stroke', this.NODE_STROKE_COLOR)
+                .attr('stroke-width', this.LINK_STROKE_WIDTH)
+                .attr('from', (d) => `node-${d.source.data.id}`)
+                .attr('to', (d) => `node-${d.target.data.id}`);
+            // Create nodes
+            const node = g
+                .selectAll('.axp-org-chart-node')
+                .data(root.descendants())
+                .enter()
+                .append('foreignObject')
+                .attr('class', 'axp-org-chart-node')
+                .attr('node', (d) => `node-${d.data.id}`) // Unique ID for each node
+                .attr('x', (d) => d.x - NODE_WIDTH_BASE / 2) // Use d.x (D3 node property)
+                .attr('y', (d) => d.y - NODE_HEIGHT_BASE / 2 + 10) // Use d.y (D3 node property)
+                .attr('width', NODE_WIDTH_BASE)
+                .attr('height', NODE_HEIGHT_BASE)
+                .each((d) => this.renderNodeTemplate(d.data, d.x, d.y));
+            // Refresh context menu
+            this.contextMenu()?.refresh();
+        });
+    }
+    renderNodeTemplate(data, x, y) {
+        const viewRef = this.viewContainerRef.createEmbeddedView(this.nodeTemplate(), {
+            $implicit: data, // Pass the node data to the template
+        });
+        // Select node using unique ID
+        const nodeElement = this.d3.select(this.treeContainer().nativeElement).select(`[node="node-${data.id}"]`); // Select by unique ID instead of position
+        const element = nodeElement.node();
+        if (element) {
+            element.appendChild(viewRef.rootNodes[0]);
+        }
+    }
+    toggleNode(data) {
+        data.isExpanded = data.isExpanded === undefined ? false : !data.isExpanded;
+        this.createChart(this.treeContainer().nativeElement, this.DATA); // Re-render the chart
+    }
+    clearChart(el) {
+        this.d3.select(el).select('svg').remove();
+        this.viewContainerRef.clear();
+    }
+    handleContextMenuOnOpening(e) {
+        const items = [
+            { name: 'add', text: 'Add New Departpent', color: 'primary', icon: 'fa-light fa-plus' },
+            {
+                name: 'remove',
+                text: 'Remove',
+                color: 'danger',
+                icon: 'fa-light fa-trash-can',
+            },
+        ];
+        e.items.push(...items);
+    }
+    printChart() {
+        this.chartPrintService.printChart(this.treeContainer().nativeElement);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMOrgChartPage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXMOrgChartPage, isStandalone: true, selector: "ng-component", providers: [], viewQueries: [{ propertyName: "nodeTemplate", first: true, predicate: ["nodeTemplate"], descendants: true, isSignal: true }, { propertyName: "treeContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "parent", first: true, predicate: ["parent"], descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: AXContextMenuComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<axp-layout-simple-page *translate=\"let t\">\n  <axp-layout-header>\n    <axp-layout-title> {{t(rootConfig.entities.chart.title) | async}} </axp-layout-title>\n\n    <axp-layout-description> Clear and dynamic view of your organization's structure </axp-layout-description>\n\n    <axp-layout-actions>\n      <axp-layout-actions-primary> </axp-layout-actions-primary>\n\n      <axp-layout-actions-secondary>\n        <ax-button-item [text]=\"(t('print') | async)!\" (onClick)=\"printChart()\">\n          <ax-prefix>\n            <ax-icon [icon]=\"'fa-solid fa-print'\"> </ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n      </axp-layout-actions-secondary>\n    </axp-layout-actions>\n\n\n    <axp-layout-breadcrumbs>\n      <ax-breadcrumbs [class.ax-hidden]=\"layout.isSmall()\">\n        <ng-template #divider>\n          <i class=\"fa-regular fa-slash-forward\"></i>\n        </ng-template>\n        <ax-breadcrumbs-item>\n          Home\n        </ax-breadcrumbs-item>\n        <ax-breadcrumbs-item>\n          Organization\n        </ax-breadcrumbs-item>\n      </ax-breadcrumbs>\n    </axp-layout-breadcrumbs>\n  </axp-layout-header>\n\n  <axp-layout-content>\n    <div class=\"ax-h-[calc(100vh-190px)]\" #parent id=\"parent\">\n      <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [(zoom)]=\"panZoomLevel\" wrapperClasses=\"h\"></div>\n      <div class=\"ax-absolute ax-bottom-2 ax-right-2 ax-z-10 ax-flex ax-gap-2\">\n        <ax-button (onClick)=\"zoomOut()\">\n          <ax-icon class=\"fa-solid fa-minus\"> </ax-icon>\n        </ax-button>\n        <ax-button [text]=\"panZoomLevel()\" (onClick)=\"zoomReset()\"></ax-button>\n        <ax-button (onClick)=\"zoomIn()\">\n          <ax-icon class=\"fa-solid fa-add\"> </ax-icon>\n        </ax-button>\n        <ax-button (onClick)=\"toggleFullscreen()\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"isFullscreen()? 'fa-compress' : 'fa-expand'\"></i>\n          </ax-icon>\n        </ax-button>\n      </div>\n    </div>\n\n    <ax-context-menu [target]=\"'.axp-org-chart-node'\" [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n      (onOpening)=\"handleContextMenuOnOpening($event)\">\n    </ax-context-menu>\n  </axp-layout-content>\n</axp-layout-simple-page>\n<div #chart class=\"chart-container ax-border\"></div>\n\n<!-- <ax-chart nodeTemplate=\"nodeTemplate\" nodes=\"nodes\"></ax-chart> -->\n\n<ng-template #nodeTemplate let-data>\n  <div\n    class=\"ax-border ax-select-none ax-shadow-md ax-border-primary-500 ax-text-primary-800 ax-rounded-md ax-bg-white ax-flex ax-flex-col ax-overflow-hidden\">\n    <div class=\"ax-bg-primary-400 ax-text-on-primary ax-px-4 ax-py-2 ax-h-full ax-cursor-pointer hover:ax-brightness-90\"\n      [class.ax-rounded-b-none]=\"data.description\" (dblclick)=\"toggleNode(data)\">\n      <div class=\"ax-flex ax-gap-3 ax-items-center ax-justify-between ax-h-full\">\n        <ax-icon><i class=\"fa-light fa-lg\" [class]=\"data.icon\"></i></ax-icon>\n        <div class=\"ax-flex ax-flex-col ax-gap-1\">\n          <div class=\"ax-text-xs ax-font-bold\">{{ data.title }}</div>\n          @if (data.subtitle) {\n          <div class=\"ax-text-xs\">{{ data.subtitle }}</div>\n          }\n        </div>\n        @if (data.children && data.children.length > 0) {\n        <div class=\"ax-flex ax-justify-center ax-items-center\" (click)=\"toggleNode(data)\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"data.isExpanded === false ? 'fa-chevron-down' : 'fa-chevron-up'\"></i></ax-icon>\n        </div>\n        }@else {\n        <span></span>\n        }\n      </div>\n    </div>\n    @if(data.description) {\n    <div class=\"ax-text-xs ax-break-words ax-px-4 ax-py-2 ax-text-default dark:ax-text-on-ghost\">\n      {{ data.description }}\n    </div>\n    }\n  </div>\n</ng-template>", styles: [".axp-org-chart-node{overflow:visible;white-space:nowrap;display:flex;align-items:center;justify-content:center}#parent:fullscreen{background-color:rgba(var(--axp-brand-color))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: RouterModule }, { kind: "component", type: 
+                //
+                AXPSimplePageLayout, selector: "axp-layout-simple-page" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-layout-content,     axp-layout-header-container,    axp-layout-footer-container,    axp-layout-side-container,    axp-layout-sections,    axp-layout-section-container,    axp-layout-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title,     axp-layout-nav-button,     axp-layout-description,     axp-layout-toolbar,    axp-layout-title-bar,    axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: AXPThemeLayoutHeaderTemplateComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutActionsComponent, selector: "axp-layout-actions" }, { kind: "component", type: AXPThemeLayoutPageSecondaryActionsComponent, selector: "axp-layout-actions-secondary" }, { kind: "component", type: AXPThemeLayoutPagePrimaryActionsComponent, selector: "axp-layout-actions-primary" }, { kind: "ngmodule", type: 
+                //
+                AXMenuModule }, { kind: "component", type: i2.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "items", "target"], outputs: ["onItemClick", "onOpening"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i3.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i3.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i5.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i5.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "directive", type: AXPanViewDirective, selector: "[axPanView]", inputs: ["zoomStep", "minZoom", "maxZoom", "disablePan", "disableZoom", "wrapperClasses", "panX", "panY", "zoom"], outputs: ["panXChange", "panYChange", "zoomChange", "positionChange"], exportAs: ["axPanView"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "component", type: i6.AXBreadCrumbsComponent, selector: "ax-breadcrumbs" }, { kind: "component", type: i6.AXBreadCrumbsItemComponent, selector: "ax-breadcrumbs-item", inputs: ["disabled", "active"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXMOrgChartPage, decorators: [{
+            type: Component,
+            args: [{ imports: [
+                        CommonModule,
+                        RouterModule,
+                        //
+                        AXPSimplePageLayout,
+                        AXPThemeLayoutBlockComponent,
+                        AXPThemeLayoutHeaderTemplateComponent,
+                        AXPThemeLayoutActionsComponent,
+                        AXPThemeLayoutPageSecondaryActionsComponent,
+                        AXPThemeLayoutPagePrimaryActionsComponent,
+                        //
+                        AXMenuModule,
+                        AXButtonModule,
+                        AXDropdownButtonModule,
+                        AXTranslationModule,
+                        AXDecoratorModule,
+                        AXPanViewDirective,
+                        AXLoadingModule,
+                        AXBreadcrumbsModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [], template: "<axp-layout-simple-page *translate=\"let t\">\n  <axp-layout-header>\n    <axp-layout-title> {{t(rootConfig.entities.chart.title) | async}} </axp-layout-title>\n\n    <axp-layout-description> Clear and dynamic view of your organization's structure </axp-layout-description>\n\n    <axp-layout-actions>\n      <axp-layout-actions-primary> </axp-layout-actions-primary>\n\n      <axp-layout-actions-secondary>\n        <ax-button-item [text]=\"(t('print') | async)!\" (onClick)=\"printChart()\">\n          <ax-prefix>\n            <ax-icon [icon]=\"'fa-solid fa-print'\"> </ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n      </axp-layout-actions-secondary>\n    </axp-layout-actions>\n\n\n    <axp-layout-breadcrumbs>\n      <ax-breadcrumbs [class.ax-hidden]=\"layout.isSmall()\">\n        <ng-template #divider>\n          <i class=\"fa-regular fa-slash-forward\"></i>\n        </ng-template>\n        <ax-breadcrumbs-item>\n          Home\n        </ax-breadcrumbs-item>\n        <ax-breadcrumbs-item>\n          Organization\n        </ax-breadcrumbs-item>\n      </ax-breadcrumbs>\n    </axp-layout-breadcrumbs>\n  </axp-layout-header>\n\n  <axp-layout-content>\n    <div class=\"ax-h-[calc(100vh-190px)]\" #parent id=\"parent\">\n      <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [(zoom)]=\"panZoomLevel\" wrapperClasses=\"h\"></div>\n      <div class=\"ax-absolute ax-bottom-2 ax-right-2 ax-z-10 ax-flex ax-gap-2\">\n        <ax-button (onClick)=\"zoomOut()\">\n          <ax-icon class=\"fa-solid fa-minus\"> </ax-icon>\n        </ax-button>\n        <ax-button [text]=\"panZoomLevel()\" (onClick)=\"zoomReset()\"></ax-button>\n        <ax-button (onClick)=\"zoomIn()\">\n          <ax-icon class=\"fa-solid fa-add\"> </ax-icon>\n        </ax-button>\n        <ax-button (onClick)=\"toggleFullscreen()\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"isFullscreen()? 'fa-compress' : 'fa-expand'\"></i>\n          </ax-icon>\n        </ax-button>\n      </div>\n    </div>\n\n    <ax-context-menu [target]=\"'.axp-org-chart-node'\" [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n      (onOpening)=\"handleContextMenuOnOpening($event)\">\n    </ax-context-menu>\n  </axp-layout-content>\n</axp-layout-simple-page>\n<div #chart class=\"chart-container ax-border\"></div>\n\n<!-- <ax-chart nodeTemplate=\"nodeTemplate\" nodes=\"nodes\"></ax-chart> -->\n\n<ng-template #nodeTemplate let-data>\n  <div\n    class=\"ax-border ax-select-none ax-shadow-md ax-border-primary-500 ax-text-primary-800 ax-rounded-md ax-bg-white ax-flex ax-flex-col ax-overflow-hidden\">\n    <div class=\"ax-bg-primary-400 ax-text-on-primary ax-px-4 ax-py-2 ax-h-full ax-cursor-pointer hover:ax-brightness-90\"\n      [class.ax-rounded-b-none]=\"data.description\" (dblclick)=\"toggleNode(data)\">\n      <div class=\"ax-flex ax-gap-3 ax-items-center ax-justify-between ax-h-full\">\n        <ax-icon><i class=\"fa-light fa-lg\" [class]=\"data.icon\"></i></ax-icon>\n        <div class=\"ax-flex ax-flex-col ax-gap-1\">\n          <div class=\"ax-text-xs ax-font-bold\">{{ data.title }}</div>\n          @if (data.subtitle) {\n          <div class=\"ax-text-xs\">{{ data.subtitle }}</div>\n          }\n        </div>\n        @if (data.children && data.children.length > 0) {\n        <div class=\"ax-flex ax-justify-center ax-items-center\" (click)=\"toggleNode(data)\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"data.isExpanded === false ? 'fa-chevron-down' : 'fa-chevron-up'\"></i></ax-icon>\n        </div>\n        }@else {\n        <span></span>\n        }\n      </div>\n    </div>\n    @if(data.description) {\n    <div class=\"ax-text-xs ax-break-words ax-px-4 ax-py-2 ax-text-default dark:ax-text-on-ghost\">\n      {{ data.description }}\n    </div>\n    }\n  </div>\n</ng-template>", styles: [".axp-org-chart-node{overflow:visible;white-space:nowrap;display:flex;align-items:center;justify-content:center}#parent:fullscreen{background-color:rgba(var(--axp-brand-color))}\n"] }]
+        }] });
+
+export { AXMOrgChartPage };
+//# sourceMappingURL=acorex-modules-organization-managment-org-chart.page-CTHNSn2n.mjs.map

package/fesm2022/acorex-modules-organization-managment-org-chart.page-CTHNSn2n.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"acorex-modules-organization-managment-org-chart.page-CTHNSn2n.mjs","sources":["../../../../libs/modules/organization-managment/src/lib/features/organization-chart/org-chart-print.service.ts","../../../../libs/modules/organization-managment/src/lib/features/organization-chart/org-chart.type.ts","../../../../libs/modules/organization-managment/src/lib/features/organization-chart/org-chart.page.ts","../../../../libs/modules/organization-managment/src/lib/features/organization-chart/org-chart.page.html"],"sourcesContent":["import { AXStyleColorType } from '@acorex/components/common';\nimport { AXDialogRef, AXLoadingDialogService } from '@acorex/components/loading-dialog';\nimport { AXTranslationService } from '@acorex/core/translation';\nimport { AXPExportService } from '@acorex/platform/common';\nimport { inject, Injectable } from '@angular/core';\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class AXMOrgChartPrintService {\n  private loadingDialog = inject(AXLoadingDialogService);\n  private exportService = inject(AXPExportService);\n  private translationService = inject(AXTranslationService);\n\n  async printChart(element: HTMLElement): Promise<void> {\n    const d = this.loadingDialog.show({\n      title: 'Printing Organization Chart...',\n      mode: 'determinate',\n      progressColor: 'primary',\n      progressValue: 0,\n      status: '0/10',\n      text: 'Initializing print process...',\n      buttons: [\n        {\n          text: 'Cancel',\n          color: 'danger',\n          onClick: () => {\n            d.close();\n          },\n        },\n      ],\n    });\n\n    try {\n      // Step 1: Start Process\n      await this.HandleStep(d, await this.translateStatements('preparing-document'), 10, '1/10');\n      const chartElement = element;\n      const { originalStyles, modifiedStyles } = this.expandChart(chartElement);\n\n      // Step 2: Render the Chart\n      await this.HandleStep(d, await this.translateStatements('rendering-chart-image'), 25, '2.5/10');\n      const canvasBlob = await this.exportService.generateBlobFromElement(chartElement, {\n        popup: true,\n        bgcolor: 'transparent',\n        scale: 2,\n        quality: 1,\n        height: Number.parseInt(modifiedStyles.modifiedHeight),\n        width: Number.parseInt(modifiedStyles.modifiedWidth),\n      });\n\n      // Step 3: Finalizing Image Processing\n      await this.HandleStep(d, await this.translateStatements('finalizing-image-processing'), 50, '5/10');\n      this.restoreChartStyles(chartElement, originalStyles);\n\n      // Step 4: Download Image\n      await this.HandleStep(d, await this.translateStatements('downloading-image'), 75, '7.5/10');\n      this.exportService.download(canvasBlob, 'org-chart.png');\n\n      // Step 5: Completion\n      await this.HandleStep(d, await this.translateStatements('process-complete'), 100, '10/10');\n\n      // Close the dialog after a short delay\n      setTimeout(() => d.close(), 1500);\n    } catch (err) {\n      console.error('Error capturing chart:', err);\n      await this.HandleStep(\n        d,\n        await this.translateStatements('failed-to-generate-chart-image'),\n        100,\n        'Error',\n        'danger'\n      );\n      d.close();\n    }\n  }\n\n  /**\n   * Expands the chart temporarily to capture the full view.\n   */\n  private expandChart(chartElement: HTMLElement): {\n    originalStyles: {\n      originalOverflow: string;\n      originalWidth: string;\n      originalHeight: string;\n    };\n    modifiedStyles: {\n      modifiedOverflow: string;\n      modifiedWidth: string;\n      modifiedHeight: string;\n    };\n  } {\n    const originalStyles = {\n      originalOverflow: chartElement.style.overflow,\n      originalWidth: chartElement.style.width,\n      originalHeight: chartElement.style.height,\n    };\n\n    const modifiedStyles = {\n      modifiedOverflow: 'visible',\n      modifiedWidth: `${chartElement.scrollWidth}px`,\n      modifiedHeight: `${chartElement.scrollHeight}px`,\n    };\n\n    chartElement.style.overflow = modifiedStyles.modifiedOverflow;\n    chartElement.style.width = modifiedStyles.modifiedWidth;\n    chartElement.style.height = modifiedStyles.modifiedHeight;\n\n    return { originalStyles, modifiedStyles };\n  }\n\n  /**\n   * Restores chart styles after capturing.\n   */\n  private restoreChartStyles(\n    chartElement: HTMLElement,\n    originalStyles: { originalOverflow: string; originalWidth: string; originalHeight: string }\n  ): void {\n    chartElement.style.overflow = originalStyles.originalOverflow;\n    chartElement.style.width = originalStyles.originalWidth;\n    chartElement.style.height = originalStyles.originalHeight;\n  }\n\n  /**\n   * Handles updating the progress dialog step.\n   */\n  private async HandleStep(\n    dialog: AXDialogRef,\n    text: string,\n    progress: number,\n    status: string,\n    color: AXStyleColorType = 'primary'\n  ): Promise<void> {\n    return new Promise((resolve) => {\n      dialog.setProgressColor(color);\n      dialog.setProgressText(text);\n      dialog.setProgressValue(progress);\n      dialog.setProgressStatus(status);\n      resolve();\n    });\n  }\n\n  private async translateStatements(key: string): Promise<string> {\n    return (await this.translationService.translateAsync(key, { scope: 'organization-management' })) + '...';\n  }\n}\n","export enum AXMOrganizationNodeType {\n  Company = 'Company', // Company\n  Location = 'Location', // Country, State, City\n  BusinessUnit = 'BusinessUnit', // Division, Department, Branch\n  Role = 'Role', // Position\n  Person = 'Person' // Employee\n}\n\n\nexport const AXM_ALLOWED_CHILD_NODES: Record<AXMOrganizationNodeType, AXMOrganizationNodeType[]> = {\n  [AXMOrganizationNodeType.Company]: [AXMOrganizationNodeType.Location, AXMOrganizationNodeType.BusinessUnit],\n  [AXMOrganizationNodeType.Location]: [AXMOrganizationNodeType.Location, AXMOrganizationNodeType.BusinessUnit],\n  [AXMOrganizationNodeType.BusinessUnit]: [AXMOrganizationNodeType.BusinessUnit, AXMOrganizationNodeType.Role],\n  [AXMOrganizationNodeType.Role]: [AXMOrganizationNodeType.Person],\n  [AXMOrganizationNodeType.Person]: [] // No children allowed\n};\n\n\nexport interface AXMOrganizationNode {\n  id: string; // Unique identifier for the node\n  title: string,// Title of the node\n  subtitle?: string;\n  description?: string | null,// Description of the node\n  icon?: string;\n  isExpanded?: boolean; // Add this property\n  children?: AXMOrganizationNode[];\n  type?: AXMOrganizationNodeType; // Type of the node\n  parentId?: string | null; // ID of the parent node (null for root)\n  entity?: {\n    id: string; // ID of the linked entity\n    source: string; // Source of the linked entity (e.g., 'OrganizationManagement.Branch', 'OrganizationManagement.Department', etc.)\n  }\n\n  metadata?: Record<string, any>; // Additional metadata (e.g., roles, counts, etc.)\n}\n\n\nexport const AXM_ORGANIZATION_DATA: AXMOrganizationNode = {\n  id: '1',\n  title: 'CEO',\n  subtitle: 'Chief Executive Officer',\n  description: 'Responsible for the overall success of the',\n  icon: 'fa-user-tie',\n  children: [\n    {\n      id: '2',\n      title: 'CTO',\n      subtitle: 'Chief Technology Officer',\n      //description: 'Leads the technology team and innovation.',\n      icon: 'fa-microchip',\n      children: [\n        {\n          id: '3',\n          title: 'Engineering Director',\n          subtitle: 'Director of Engineering',\n          description: 'Oversees all engineering teams.',\n          icon: 'fa-cogs',\n          children: [\n            {\n              id: '4',\n              title: 'Dev Manager',\n              subtitle: 'Development Manager',\n              description: 'Manages the development team.',\n              icon: 'fa-code',\n              children: [\n                {\n                  id: '5',\n                  title: 'Frontend Team Lead',\n                  subtitle: 'Leads frontend developers',\n                  description: 'Manages the frontend development efforts.',\n                  icon: 'fa-paint-brush',\n                },\n                {\n                  id: '6',\n                  title: 'Backend Team Lead',\n                  subtitle: 'Leads backend developers',\n                  description: 'Manages the backend development efforts.',\n                  icon: 'fa-database',\n                },\n              ],\n            },\n            {\n              id: '7',\n              title: 'QA Manager',\n              subtitle: 'Quality Assurance Manager',\n              description: 'Ensures product quality.',\n              icon: 'fa-check-circle',\n              children: [\n                {\n                  id: '8',\n                  title: 'QA Engineer',\n                  subtitle: 'Quality Assurance Engineer',\n                  description: 'Tests and ensures software quality.',\n                  icon: 'fa-bug',\n                },\n              ],\n            },\n          ],\n        },\n        {\n          id: '9',\n          title: 'Security Manager',\n          subtitle: 'Security & Compliance',\n          description: 'Ensures security policies and compliance.',\n          icon: 'fa-shield-alt',\n        },\n      ],\n    },\n    {\n      id: '10',\n      title: 'CFO',\n      subtitle: 'Chief Financial Officer',\n      description: 'Manages the financial health of the organization.',\n      icon: 'fa-chart-line',\n      children: [\n        {\n          id: '11',\n          title: 'Finance Manager',\n          subtitle: 'Oversees financial operations',\n          description: 'Handles budgets, financial planning, and reporting.',\n          icon: 'fa-money-bill-wave',\n        },\n        {\n          id: '12',\n          title: 'Accounting Manager',\n          subtitle: 'Manages accounting team',\n          description: 'Ensures financial accuracy and compliance.',\n          icon: 'fa-calculator',\n        },\n      ],\n    },\n    {\n      id: '13',\n      title: 'COO',\n      subtitle: 'Chief Operating Officer',\n      description: 'Oversees daily business operations.',\n      icon: 'fa-briefcase',\n      children: [\n        {\n          id: '14',\n          title: 'HR Manager',\n          subtitle: 'Human Resources Manager',\n          description: 'Manages recruitment and employee relations.',\n          icon: 'fa-users',\n        },\n        {\n          id: '15',\n          title: 'Operations Manager',\n          subtitle: 'Leads business operations',\n          description: 'Oversees operational efficiency and process improvements.',\n          icon: 'fa-industry',\n        },\n      ],\n    },\n    {\n      id: '16',\n      title: 'CMO',\n      subtitle: 'Chief Marketing Officer',\n      description: 'Leads marketing and brand strategy.',\n      icon: 'fa-bullhorn',\n      children: [\n        {\n          id: '17',\n          title: 'Marketing Manager',\n          subtitle: 'Oversees marketing team',\n          description: 'Handles branding, campaigns, and customer engagement.',\n          icon: 'fa-ad',\n        },\n        {\n          id: '18',\n          title: 'Sales Director',\n          subtitle: 'Leads sales initiatives',\n          description: 'Drives revenue and sales growth.',\n          icon: 'fa-handshake',\n          children: [\n            {\n              id: '19',\n              title: 'Sales Manager',\n              subtitle: 'Manages sales team',\n              description: 'Oversees sales operations and targets.',\n              icon: 'fa-shopping-cart',\n            },\n          ],\n        },\n      ],\n    },\n  ],\n};\n","import { AXPanViewDirective } from '@acorex/cdk/pan-view';\nimport { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXDropdownButtonModule } from '@acorex/components/dropdown-button';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { AXContextMenuComponent, AXContextMenuOpeningEvent, AXMenuItem, AXMenuModule } from '@acorex/components/menu';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { AXPSimplePageLayout } from '@acorex/platform/themes/default';\nimport {\n  AXPLayoutThemeService,\n  AXPThemeLayoutActionsComponent,\n  AXPThemeLayoutBlockComponent,\n  AXPThemeLayoutHeaderTemplateComponent,\n  AXPThemeLayoutPagePrimaryActionsComponent,\n  AXPThemeLayoutPageSecondaryActionsComponent,\n} from '@acorex/platform/themes/shared';\nimport { CommonModule } from '@angular/common';\nimport {\n  afterNextRender,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  inject,\n  NgZone,\n  signal,\n  TemplateRef,\n  viewChild,\n  ViewContainerRef,\n} from '@angular/core';\nimport { RouterModule } from '@angular/router';\nimport { AXMOrgChartPrintService } from './org-chart-print.service';\nimport { AXM_ORGANIZATION_DATA, AXMOrganizationNode } from './org-chart.type';\nimport { AXBreadcrumbsModule } from '@acorex/components/breadcrumbs';\nimport { RootConfig } from '../../const';\n\n@Component({\n  templateUrl: './org-chart.page.html',\n  styleUrls: ['./org-chart.page.scss'],\n  imports: [\n    CommonModule,\n    RouterModule,\n    //\n    AXPSimplePageLayout,\n    AXPThemeLayoutBlockComponent,\n    AXPThemeLayoutHeaderTemplateComponent,\n    AXPThemeLayoutActionsComponent,\n    AXPThemeLayoutPageSecondaryActionsComponent,\n    AXPThemeLayoutPagePrimaryActionsComponent,\n    //\n    AXMenuModule,\n    AXButtonModule,\n    AXDropdownButtonModule,\n    AXTranslationModule,\n    AXDecoratorModule,\n    AXPanViewDirective,\n    AXLoadingModule,\n    AXBreadcrumbsModule\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [],\n})\nexport class AXMOrgChartPage {\n\n  protected readonly layout = inject(AXPLayoutThemeService);\n  protected readonly rootConfig = RootConfig;\n\n  private d3!: typeof import('d3');\n\n  private nodeTemplate = viewChild.required<TemplateRef<any>>('nodeTemplate');\n  private treeContainer = viewChild.required<ElementRef<HTMLDivElement>>('chart');\n  private parent = viewChild.required<ElementRef<HTMLDivElement>>('parent');\n  private contextMenu = viewChild(AXContextMenuComponent);\n\n  private ngzone = inject(NgZone);\n  private viewContainerRef = inject(ViewContainerRef);\n  private chartPrintService = inject(AXMOrgChartPrintService);\n\n  private readonly DATA = AXM_ORGANIZATION_DATA;\n  private readonly NODE_STROKE_COLOR = 'rgba(var(--ax-sys-color-primary-400))';\n  private readonly LINK_STROKE_WIDTH = 1;\n\n  protected isFullscreen = signal(false);\n  protected panX = signal(0);\n  protected panY = signal(0);\n  protected panZoomLevel = signal(100);\n\n  #initialize = afterNextRender(async () => {\n    this.d3 = await import('d3');\n    this.createChart(this.treeContainer().nativeElement, this.DATA);\n  });\n\n  // eff = effect(() => console.log(this.panX(), this.panY()));\n\n  protected zoomIn() {\n    this.panZoomLevel.update((prev) => prev + 5);\n  }\n  protected zoomOut() {\n    this.panZoomLevel.update((prev) => prev - 5);\n  }\n  protected zoomReset() {\n    this.panX.set(1);\n    this.panY.set(1);\n    this.panX.set(0);\n    this.panY.set(0);\n    this.panZoomLevel.set(100);\n  }\n  protected toggleFullscreen() {\n    if (this.isFullscreen()) {\n      document.exitFullscreen();\n      this.isFullscreen.set(false);\n    } else {\n      this.parent().nativeElement.requestFullscreen();\n      this.isFullscreen.set(true);\n    }\n  }\n\n  private calculateMaxDepth(node: AXMOrganizationNode): number {\n    if (!node.children || node.children.length === 0 || node.isExpanded === false) {\n      return 1; // Base case: no children or node is collapsed\n    }\n    return 1 + Math.max(...node.children.map((child) => this.calculateMaxDepth(child)));\n  }\n\n  private calculateMaxBreadth(node: AXMOrganizationNode): number {\n    if (!node.children || node.children.length === 0 || node.isExpanded === false) {\n      return 1; // Base case: no children or node is collapsed\n    }\n    return node.children.reduce((acc, child) => acc + this.calculateMaxBreadth(child), 0);\n  }\n\n  createChart(el: Element, data: AXMOrganizationNode): void {\n    this.ngzone.runOutsideAngular(() => {\n      // Constants for node dimensions and spacing\n      const NODE_WIDTH_BASE = 240; // Base width for each node\n      const NODE_HEIGHT_BASE = 120; // Base height for each node\n      const HORIZONTAL_SPACING = 25; // Horizontal spacing between nodes\n      const VERTICAL_SPACING = 50; // Vertical spacing between levels\n\n      // Clear existing SVG and create a new one\n      this.clearChart(el);\n      const newSvg = this.d3.select(el).append('svg');\n\n      // Create a hierarchy from the data\n      const root = this.d3.hierarchy(data);\n\n      // Filter out collapsed nodes and their descendants\n      root.descendants().forEach((node: any) => {\n        if (node.data.isExpanded === false) {\n          node.children = undefined; // Remove children for collapsed nodes\n        }\n      });\n\n      // Create a tree layout\n      const treeLayout = this.d3\n        .tree<AXMOrganizationNode>()\n        .nodeSize([NODE_WIDTH_BASE + HORIZONTAL_SPACING, NODE_HEIGHT_BASE + VERTICAL_SPACING]);\n\n      // Generate the tree nodes and links\n      treeLayout(root);\n\n      // Calculate the bounds of the tree\n      let minX = Infinity,\n        maxX = -Infinity,\n        minY = Infinity,\n        maxY = -Infinity;\n      root.descendants().forEach((d: any) => {\n        if (d.x < minX) minX = d.x;\n        if (d.x > maxX) maxX = d.x;\n        if (d.y < minY) minY = d.y;\n        if (d.y > maxY) maxY = d.y;\n      });\n\n      // Calculate SVG dimensions based on tree bounds\n      const CONTAINER_WIDTH = maxX - minX + NODE_WIDTH_BASE + 2 * HORIZONTAL_SPACING;\n      const CONTAINER_HEIGHT = maxY - minY + NODE_HEIGHT_BASE + 2 * VERTICAL_SPACING;\n\n      // Set SVG dimensions\n      newSvg.attr('width', CONTAINER_WIDTH).attr('height', CONTAINER_HEIGHT);\n\n      // Adjust the transform of the <g> element to center the tree\n      const g = newSvg\n        .append('g')\n        .attr(\n          'transform',\n          `translate(${-minX + NODE_WIDTH_BASE / 2 + HORIZONTAL_SPACING / 2}, ${-minY + NODE_HEIGHT_BASE / 2 + VERTICAL_SPACING / 2\n          })`\n        );\n\n      // Create links (lines with 90-degree angles)\n      const link = g\n        .selectAll('.link')\n        .data(root.links())\n        .enter()\n        .append('path')\n        .attr('class', 'link')\n        .attr('d', (d: any) => {\n          const source = d.source;\n          const target = d.target;\n          return `M${source.x},${source.y}V${(source.y + target.y) / 2}H${target.x}V${target.y - 10}`;\n        })\n        .attr('fill', 'none')\n        .attr('stroke', this.NODE_STROKE_COLOR)\n        .attr('stroke-width', this.LINK_STROKE_WIDTH)\n        .attr('from', (d: any) => `node-${d.source.data.id}`)\n        .attr('to', (d: any) => `node-${d.target.data.id}`);\n\n      // Create nodes\n      const node = g\n        .selectAll('.axp-org-chart-node')\n        .data(root.descendants())\n        .enter()\n        .append('foreignObject')\n        .attr('class', 'axp-org-chart-node')\n        .attr('node', (d: any) => `node-${d.data.id}`) // Unique ID for each node\n        .attr('x', (d: any) => d.x - NODE_WIDTH_BASE / 2) // Use d.x (D3 node property)\n        .attr('y', (d: any) => d.y - NODE_HEIGHT_BASE / 2 + 10) // Use d.y (D3 node property)\n        .attr('width', NODE_WIDTH_BASE)\n        .attr('height', NODE_HEIGHT_BASE)\n        .each((d: any) => this.renderNodeTemplate(d.data, d.x, d.y));\n\n      // Refresh context menu\n      this.contextMenu()?.refresh();\n    });\n  }\n\n  private renderNodeTemplate(data: AXMOrganizationNode, x: number, y: number): void {\n    const viewRef = this.viewContainerRef.createEmbeddedView(this.nodeTemplate(), {\n      $implicit: data, // Pass the node data to the template\n    });\n\n    // Select node using unique ID\n    const nodeElement = this.d3.select(this.treeContainer().nativeElement).select(`[node=\"node-${data.id}\"]`); // Select by unique ID instead of position\n\n    const element = nodeElement.node() as HTMLElement | null;\n    if (element) {\n      element.appendChild(viewRef.rootNodes[0]);\n    }\n  }\n\n  protected toggleNode(data: AXMOrganizationNode) {\n    data.isExpanded = data.isExpanded === undefined ? false : !data.isExpanded;\n    this.createChart(this.treeContainer().nativeElement, this.DATA); // Re-render the chart\n  }\n\n  private clearChart(el: Element): void {\n    this.d3.select(el).select('svg').remove();\n    this.viewContainerRef.clear();\n  }\n\n  protected handleContextMenuOnOpening(e: AXContextMenuOpeningEvent) {\n    const items: AXMenuItem[] = [\n      { name: 'add', text: 'Add New Departpent', color: 'primary', icon: 'fa-light fa-plus' },\n\n      {\n        name: 'remove',\n        text: 'Remove',\n        color: 'danger',\n        icon: 'fa-light fa-trash-can',\n      },\n    ];\n    e.items.push(...items);\n  }\n\n  protected printChart() {\n    this.chartPrintService.printChart(this.treeContainer().nativeElement);\n  }\n}\n","<axp-layout-simple-page *translate=\"let t\">\n  <axp-layout-header>\n    <axp-layout-title> {{t(rootConfig.entities.chart.title) | async}} </axp-layout-title>\n\n    <axp-layout-description> Clear and dynamic view of your organization's structure </axp-layout-description>\n\n    <axp-layout-actions>\n      <axp-layout-actions-primary> </axp-layout-actions-primary>\n\n      <axp-layout-actions-secondary>\n        <ax-button-item [text]=\"(t('print') | async)!\" (onClick)=\"printChart()\">\n          <ax-prefix>\n            <ax-icon [icon]=\"'fa-solid fa-print'\"> </ax-icon>\n          </ax-prefix>\n        </ax-button-item>\n      </axp-layout-actions-secondary>\n    </axp-layout-actions>\n\n\n    <axp-layout-breadcrumbs>\n      <ax-breadcrumbs [class.ax-hidden]=\"layout.isSmall()\">\n        <ng-template #divider>\n          <i class=\"fa-regular fa-slash-forward\"></i>\n        </ng-template>\n        <ax-breadcrumbs-item>\n          Home\n        </ax-breadcrumbs-item>\n        <ax-breadcrumbs-item>\n          Organization\n        </ax-breadcrumbs-item>\n      </ax-breadcrumbs>\n    </axp-layout-breadcrumbs>\n  </axp-layout-header>\n\n  <axp-layout-content>\n    <div class=\"ax-h-[calc(100vh-190px)]\" #parent id=\"parent\">\n      <div #chart axPanView [(panX)]=\"panX\" [(panY)]=\"panY\" [(zoom)]=\"panZoomLevel\" wrapperClasses=\"h\"></div>\n      <div class=\"ax-absolute ax-bottom-2 ax-right-2 ax-z-10 ax-flex ax-gap-2\">\n        <ax-button (onClick)=\"zoomOut()\">\n          <ax-icon class=\"fa-solid fa-minus\"> </ax-icon>\n        </ax-button>\n        <ax-button [text]=\"panZoomLevel()\" (onClick)=\"zoomReset()\"></ax-button>\n        <ax-button (onClick)=\"zoomIn()\">\n          <ax-icon class=\"fa-solid fa-add\"> </ax-icon>\n        </ax-button>\n        <ax-button (onClick)=\"toggleFullscreen()\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"isFullscreen()? 'fa-compress' : 'fa-expand'\"></i>\n          </ax-icon>\n        </ax-button>\n      </div>\n    </div>\n\n    <ax-context-menu [target]=\"'.axp-org-chart-node'\" [orientation]=\"'vertical'\" [closeOn]=\"'leave'\"\n      (onOpening)=\"handleContextMenuOnOpening($event)\">\n    </ax-context-menu>\n  </axp-layout-content>\n</axp-layout-simple-page>\n<div #chart class=\"chart-container ax-border\"></div>\n\n<!-- <ax-chart nodeTemplate=\"nodeTemplate\" nodes=\"nodes\"></ax-chart> -->\n\n<ng-template #nodeTemplate let-data>\n  <div\n    class=\"ax-border ax-select-none ax-shadow-md ax-border-primary-500 ax-text-primary-800 ax-rounded-md ax-bg-white ax-flex ax-flex-col ax-overflow-hidden\">\n    <div class=\"ax-bg-primary-400 ax-text-on-primary ax-px-4 ax-py-2 ax-h-full ax-cursor-pointer hover:ax-brightness-90\"\n      [class.ax-rounded-b-none]=\"data.description\" (dblclick)=\"toggleNode(data)\">\n      <div class=\"ax-flex ax-gap-3 ax-items-center ax-justify-between ax-h-full\">\n        <ax-icon><i class=\"fa-light fa-lg\" [class]=\"data.icon\"></i></ax-icon>\n        <div class=\"ax-flex ax-flex-col ax-gap-1\">\n          <div class=\"ax-text-xs ax-font-bold\">{{ data.title }}</div>\n          @if (data.subtitle) {\n          <div class=\"ax-text-xs\">{{ data.subtitle }}</div>\n          }\n        </div>\n        @if (data.children && data.children.length > 0) {\n        <div class=\"ax-flex ax-justify-center ax-items-center\" (click)=\"toggleNode(data)\">\n          <ax-icon>\n            <i class=\"fa-solid\" [class]=\"data.isExpanded === false ? 'fa-chevron-down' : 'fa-chevron-up'\"></i></ax-icon>\n        </div>\n        }@else {\n        <span></span>\n        }\n      </div>\n    </div>\n    @if(data.description) {\n    <div class=\"ax-text-xs ax-break-words ax-px-4 ax-py-2 ax-text-default dark:ax-text-on-ghost\">\n      {{ data.description }}\n    </div>\n    }\n  </div>\n</ng-template>"],"names":[],"mappings":"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"}