cloud-ide-academics 0.0.21 → 0.0.24

package/fesm2022/cloud-ide-academics-class-program-term-list.component-BaFtTKcS.mjs

@@ -0,0 +1,639 @@
+import * as i0 from '@angular/core';
+import { inject, DestroyRef, viewChild, computed, signal, Component } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i1$1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { Router, ActivatedRoute } from '@angular/router';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { NotificationService, ConfirmationService, CideEleDataGridComponent, CideIconComponent, CideEleButtonComponent, CideEleDropdownComponent, CideSelectComponent } from 'cloud-ide-element';
+import { AppStateHelperService, CideLytSharedWrapperComponent } from 'cloud-ide-layout';
+import { AcaClassPrgBranchListPayload, MClassProgramTerm, generateObjectFromString } from 'cloud-ide-lms-model';
+import { C as CideLytClassProgramTermService } from './cloud-ide-academics-class-program-term.service-BW4PJQEM.mjs';
+import { CLASS_PROGRAM_MASTER_SERVICE_TOKEN } from 'cloud-ide-shared';
+import { b as CideLytClassProgramBranchService } from './cloud-ide-academics-cloud-ide-academics-DxRzuyxa.mjs';
+
+class ClassProgramTermListComponent {
+    // Dependency injection
+    destroyRef = inject(DestroyRef);
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    appState = inject(AppStateHelperService);
+    notificationService = inject(NotificationService);
+    confirmationService = inject(ConfirmationService);
+    classProgramTermService = inject(CideLytClassProgramTermService);
+    classProgramMasterService = inject(CLASS_PROGRAM_MASTER_SERVICE_TOKEN);
+    classProgramBranchService = inject(CideLytClassProgramBranchService);
+    // Modern ViewChild signals for template renderers (Angular 20 approach)
+    classProgramTermDetailsRendererTemplate = viewChild.required('classProgramTermDetailsRendererTemplate');
+    classProgramTermStatusRendererTemplate = viewChild.required('classProgramTermStatusRendererTemplate');
+    actionsDropdownRendererTemplate = viewChild.required('actionsDropdownRendererTemplate');
+    // Computed template renderers for grid
+    templateRenderers = computed(() => ({
+        classProgramTermDetailsRenderer: this.classProgramTermDetailsRendererTemplate(),
+        classProgramTermStatusRenderer: this.classProgramTermStatusRendererTemplate(),
+        actionsDropdownRenderer: this.actionsDropdownRendererTemplate()
+    }), ...(ngDevMode ? [{ debugName: "templateRenderers" }] : []));
+    // Make Math available in template
+    Math = Math;
+    // Signals for reactive state management
+    classProgramTerms = signal([], ...(ngDevMode ? [{ debugName: "classProgramTerms" }] : []));
+    loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    error = signal(null, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    selectedItems = signal([], ...(ngDevMode ? [{ debugName: "selectedItems" }] : []));
+    searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : []));
+    acabrnId = signal(null, ...(ngDevMode ? [{ debugName: "acabrnId" }] : []));
+    acacpmId = signal(null, ...(ngDevMode ? [{ debugName: "acacpmId" }] : []));
+    // Class program and branch dropdown signals
+    classProgramMasters = signal([], ...(ngDevMode ? [{ debugName: "classProgramMasters" }] : []));
+    classProgramMastersLoading = signal(false, ...(ngDevMode ? [{ debugName: "classProgramMastersLoading" }] : []));
+    selectedClassProgram = signal(null, ...(ngDevMode ? [{ debugName: "selectedClassProgram" }] : []));
+    classProgramBranches = signal([], ...(ngDevMode ? [{ debugName: "classProgramBranches" }] : []));
+    classProgramBranchesLoading = signal(false, ...(ngDevMode ? [{ debugName: "classProgramBranchesLoading" }] : []));
+    selectedProgramClassId = signal(null, ...(ngDevMode ? [{ debugName: "selectedProgramClassId" }] : []));
+    selectedBranchId = signal(null, ...(ngDevMode ? [{ debugName: "selectedBranchId" }] : []));
+    // Program term dropdown signals
+    classProgramTermsForDropdown = signal([], ...(ngDevMode ? [{ debugName: "classProgramTermsForDropdown" }] : []));
+    classProgramTermsLoadingForDropdown = signal(false, ...(ngDevMode ? [{ debugName: "classProgramTermsLoadingForDropdown" }] : []));
+    selectedTermId = signal(null, ...(ngDevMode ? [{ debugName: "selectedTermId" }] : []));
+    // Signal for breadcrumb data that will be passed to shared wrapper
+    breadcrumbData = signal([], ...(ngDevMode ? [{ debugName: "breadcrumbData" }] : []));
+    // Computed signals for dropdown options
+    classProgramMastersOptions = computed(() => this.classProgramMasters(), ...(ngDevMode ? [{ debugName: "classProgramMastersOptions" }] : []));
+    classProgramTermsOptions = computed(() => this.classProgramTermsForDropdown(), ...(ngDevMode ? [{ debugName: "classProgramTermsOptions" }] : []));
+    // Computed signal to check if branch dropdown should be shown
+    showBranchDropdown = computed(() => {
+        const selectedProgram = this.selectedClassProgram();
+        if (!selectedProgram)
+            return false;
+        const generalMaster = selectedProgram.acacpm_class_program_id_sygms;
+        if (!generalMaster || typeof generalMaster !== 'object')
+            return false;
+        let config;
+        if ('sygms_configuration' in generalMaster) {
+            const configValue = generalMaster.sygms_configuration;
+            if (typeof configValue === 'string') {
+                try {
+                    config = JSON.parse(configValue);
+                }
+                catch {
+                    return false;
+                }
+            }
+            else if (typeof configValue === 'object' && configValue !== null) {
+                config = configValue;
+            }
+        }
+        return config?.branchType === true;
+    }, ...(ngDevMode ? [{ debugName: "showBranchDropdown" }] : []));
+    // Derived list filtered by searchTerm
+    filteredClassProgramTerms = computed(() => {
+        const q = (this.searchTerm() || '').toLowerCase().trim();
+        const items = this.classProgramTerms() || [];
+        if (!q)
+            return items;
+        return items.filter(cpt => {
+            const name = (cpt.acapt_name || '').toLowerCase();
+            const code = (cpt.acapt_code || '').toLowerCase();
+            const description = (cpt.acapt_description || '').toLowerCase();
+            return name.includes(q) || code.includes(q) || description.includes(q);
+        });
+    }, ...(ngDevMode ? [{ debugName: "filteredClassProgramTerms" }] : []));
+    // Grid configuration signal
+    gridConfig = signal({
+        id: 'class-program-term-list-grid',
+        columns: [
+            {
+                key: 'details',
+                header: 'Term Details',
+                type: 'custom',
+                width: 'auto',
+                truncate: true,
+                align: 'left',
+                renderer: 'classProgramTermDetailsRenderer'
+            },
+            {
+                key: 'acapt_code',
+                header: 'Code',
+                type: 'text',
+                width: '120px',
+                truncate: true,
+                align: 'left'
+            },
+            {
+                key: 'acapt_class_program_id_acacpm',
+                header: 'Program Class',
+                type: 'custom',
+                width: '200px',
+                truncate: true,
+                align: 'left',
+                renderer: 'programClassRenderer'
+            },
+            {
+                key: 'acapt_parent_class_prog_term_acapt',
+                header: 'Parent Term',
+                type: 'custom',
+                width: '180px',
+                truncate: true,
+                align: 'left',
+                renderer: 'parentTermRenderer'
+            },
+            {
+                key: 'acapt_isactive',
+                header: 'Status',
+                type: 'custom',
+                width: '120px',
+                truncate: false,
+                align: 'center',
+                renderer: 'classProgramTermStatusRenderer'
+            },
+            {
+                key: 'actions',
+                header: '',
+                type: 'custom',
+                width: '150px',
+                truncate: false,
+                align: 'center',
+                renderer: 'actionsDropdownRenderer'
+            }
+        ],
+        data: [],
+        trackBy: '_id',
+        pagination: {
+            enabled: true,
+            pageSize: 10,
+            pageSizeOptions: [10, 25, 50, 100],
+            showQuickJump: true,
+            showPageInfo: true,
+            showRefresh: true
+        },
+        search: {
+            enabled: true,
+            placeholder: 'Search class program terms...',
+            searchableColumns: ['acapt_name', 'acapt_code', 'acapt_description'],
+            debounceMs: 300
+        },
+        loading: {
+            useDefer: true,
+            skeletonRows: 5,
+            showOverlay: false
+        },
+        scroll: {
+            enabled: true,
+            stickyHeader: true,
+            virtualScroll: false,
+            rowHeight: 50
+        },
+        fullHeight: true,
+        responsive: true,
+        striped: false,
+        bordered: true,
+        compact: false,
+        tableClass: 'tw-table-fixed tw-w-full tw-rounded-none'
+    }, ...(ngDevMode ? [{ debugName: "gridConfig" }] : []));
+    /**
+     * Get action dropdown items
+     */
+    getActionDropdownItems(classProgramTerm) {
+        const items = [
+            {
+                id: 'view',
+                label: 'View Details',
+                icon: 'visibility',
+                iconColor: 'tw-text-gray-400',
+                textColor: 'tw-text-gray-700'
+            },
+            {
+                id: 'edit',
+                label: 'Edit Term',
+                icon: 'edit',
+                iconColor: 'tw-text-blue-400',
+                textColor: 'tw-text-blue-700'
+            },
+            {
+                id: 'toggleStatus',
+                label: classProgramTerm.acapt_isactive ? 'Deactivate' : 'Activate',
+                icon: classProgramTerm.acapt_isactive ? 'toggle_off' : 'toggle_on',
+                iconColor: classProgramTerm.acapt_isactive ? 'tw-text-orange-400' : 'tw-text-green-400',
+                textColor: classProgramTerm.acapt_isactive ? 'tw-text-orange-700' : 'tw-text-green-700'
+            },
+            {
+                id: 'delete',
+                label: 'Delete',
+                icon: 'delete',
+                iconColor: 'tw-text-red-400',
+                textColor: 'tw-text-red-700'
+            }
+        ];
+        return items;
+    }
+    /**
+     * Handle dropdown item click
+     */
+    onDropdownItemClick(item, classProgramTerm) {
+        switch (item.id) {
+            case 'view':
+                this.viewClassProgramTerm(classProgramTerm);
+                break;
+            case 'edit':
+                this.editClassProgramTerm(classProgramTerm);
+                break;
+            case 'toggleStatus':
+                this.toggleClassProgramTermStatus(classProgramTerm);
+                break;
+            case 'delete':
+                this.deleteClassProgramTerm(classProgramTerm);
+                break;
+        }
+    }
+    ngOnInit() {
+        this.initializeBreadcrumbData();
+        this.checkRouteParams();
+        this.loadClassProgramMasters();
+        this.loadClassProgramTerms();
+    }
+    /**
+     * Initialize breadcrumb data for list view
+     */
+    initializeBreadcrumbData() {
+        this.breadcrumbData.set([
+            {
+                id: 'list',
+                label: 'List',
+                icon: 'list',
+                url: undefined
+            }
+        ]);
+    }
+    /**
+     * Load class program masters for dropdown
+     */
+    loadClassProgramMasters() {
+        this.classProgramMastersLoading.set(true);
+        const payload = {
+            pagination: false,
+            acacpm_isactive: true
+        };
+        this.classProgramMasterService.getClassProgramMasterList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                if (response?.success && response.data) {
+                    this.classProgramMasters.set(response.data);
+                }
+                else {
+                    this.classProgramMasters.set([]);
+                }
+                this.classProgramMastersLoading.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error loading class program masters:', error);
+                this.classProgramMasters.set([]);
+                this.classProgramMastersLoading.set(false);
+            }
+        });
+    }
+    /**
+     * Handle class program selection change
+     */
+    onClassProgramChange(programClassId) {
+        const programId = typeof programClassId === 'string' ? programClassId : (programClassId ? String(programClassId) : null);
+        console.log('🔄 Class Program changed:', programId);
+        this.selectedProgramClassId.set(programId);
+        this.acacpmId.set(programId);
+        if (programId) {
+            const selectedProgram = this.classProgramMasters().find(p => p._id === programId);
+            this.selectedClassProgram.set(selectedProgram || null);
+            // Load branches if branchType is configured
+            if (this.showBranchDropdown()) {
+                this.loadClassProgramBranches(programId);
+            }
+            else {
+                this.classProgramBranches.set([]);
+                this.selectedBranchId.set(null);
+                this.acabrnId.set(null);
+                // Load program terms directly if no branch dropdown
+                this.loadClassProgramTermsForDropdown(programId);
+            }
+        }
+        else {
+            this.selectedClassProgram.set(null);
+            this.classProgramBranches.set([]);
+            this.selectedBranchId.set(null);
+            this.acabrnId.set(null);
+            this.classProgramTermsForDropdown.set([]);
+            this.selectedTermId.set(null);
+        }
+        this.loadClassProgramTerms();
+    }
+    /**
+     * Load class program branches
+     */
+    loadClassProgramBranches(classProgramId) {
+        this.classProgramBranchesLoading.set(true);
+        const payload = new AcaClassPrgBranchListPayload({
+            acabrn_class_program_id_acacpm: classProgramId,
+            pagination: false
+        });
+        this.classProgramBranchService.getClassProgramBranchList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                if (response?.success && response.data) {
+                    this.classProgramBranches.set(response.data);
+                    // Load program terms for dropdown when branches are loaded
+                    if (this.selectedProgramClassId()) {
+                        // Will be triggered when user selects a branch
+                    }
+                }
+                else {
+                    this.classProgramBranches.set([]);
+                }
+                this.classProgramBranchesLoading.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error loading class program branches:', error);
+                this.classProgramBranches.set([]);
+                this.classProgramBranchesLoading.set(false);
+            }
+        });
+    }
+    /**
+     * Handle branch selection change
+     */
+    onBranchChange(branchId) {
+        const branch = typeof branchId === 'string' ? branchId : (branchId ? String(branchId) : null);
+        console.log('🔄 Branch changed:', branch);
+        this.selectedBranchId.set(branch);
+        this.acabrnId.set(branch);
+        // Load program terms for dropdown when branch changes
+        if (branch && this.selectedProgramClassId()) {
+            this.loadClassProgramTermsForDropdown(this.selectedProgramClassId(), branch);
+        }
+        else {
+            this.classProgramTermsForDropdown.set([]);
+            this.selectedTermId.set(null);
+        }
+        this.loadClassProgramTerms();
+    }
+    /**
+     * Load class program terms for dropdown (filtered by class program and branch)
+     */
+    loadClassProgramTermsForDropdown(classProgramId, branchId) {
+        this.classProgramTermsLoadingForDropdown.set(true);
+        const payload = new MClassProgramTerm({
+            pageIndex: 0,
+            pageSize: 1000,
+            query: "",
+            sort: {
+                key: 'acapt_name',
+                order: 'asc'
+            },
+            acapt_class_prg_branch_acabrn: branchId || "",
+        });
+        this.classProgramTermService.getClassProgramTermList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                if (response?.success && response.data) {
+                    // Filter by class program ID if provided
+                    let terms = response.data;
+                    if (classProgramId) {
+                        terms = terms.filter(term => term.acapt_class_program_id_acacpm?._id === classProgramId ||
+                            (typeof term.acapt_class_program_id_acacpm === 'string' && term.acapt_class_program_id_acacpm === classProgramId));
+                    }
+                    this.classProgramTermsForDropdown.set(terms);
+                }
+                else {
+                    this.classProgramTermsForDropdown.set([]);
+                }
+                this.classProgramTermsLoadingForDropdown.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error loading class program terms for dropdown:', error);
+                this.classProgramTermsForDropdown.set([]);
+                this.classProgramTermsLoadingForDropdown.set(false);
+            }
+        });
+    }
+    /**
+     * Handle program term selection change
+     */
+    onTermChange(termId) {
+        const term = typeof termId === 'string' ? termId : (termId ? String(termId) : null);
+        console.log('🔄 Program Term changed:', term);
+        this.selectedTermId.set(term);
+        // Filter the main list by selected term if needed
+        // For now, we'll just store the selection
+    }
+    /**
+     * Handle class program master search
+     */
+    onClassProgramMasterSearch(event) {
+        // Trigger loading if needed
+        if (event && event.query) {
+            // Could implement search functionality here if needed
+        }
+    }
+    /**
+     * Check route parameters for acabrn_id and acacpm_id
+     */
+    checkRouteParams() {
+        this.route.params.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(params => {
+            const queryParams = params['query'];
+            console.log('🏢 Route params:', params, 'queryParams:', queryParams);
+            if (queryParams) {
+                // Query parameters passed (following page-controls pattern)
+                const queryData = generateObjectFromString(queryParams);
+                console.log('🏢 Class Program Term params from route:', queryData);
+                if (queryData?.acabrn_id) {
+                    this.acabrnId.set(queryData.acabrn_id);
+                    console.log('🏢 Branch ID from route:', queryData.acabrn_id);
+                }
+                if (queryData?.acacpm_id) {
+                    this.acacpmId.set(queryData.acacpm_id);
+                    console.log('🏢 Class Program ID from route:', queryData.acacpm_id);
+                }
+            }
+        });
+    }
+    /**
+     * Load class program terms data
+     */
+    loadClassProgramTerms() {
+        this.loading.set(true);
+        this.error.set(null);
+        // Add filter parameters if available
+        const acabrnId = this.acabrnId();
+        const acacpmId = this.acacpmId();
+        const payload = new MClassProgramTerm({
+            pageIndex: 0,
+            pageSize: 100,
+            query: this.searchTerm() || "",
+            sort: {
+                key: 'acapt_name',
+                order: 'asc'
+            },
+            acapt_class_prg_branch_acabrn: acabrnId || "",
+        });
+        this.classProgramTermService.getClassProgramTermList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                if (response?.success && response.data) {
+                    console.log('📚 Class program terms loaded:', response.data);
+                    this.classProgramTerms.set(response.data);
+                    this.updateGridData();
+                    this.notificationService.success(`Loaded ${response.data.length} class program term(s) successfully.`);
+                }
+                else {
+                    console.warn('⚠️ No class program term data received');
+                    this.classProgramTerms.set([]);
+                    this.updateGridData();
+                    this.notificationService.warning('No class program terms found.');
+                }
+                this.loading.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error loading class program terms:', error);
+                this.error.set('Failed to load class program terms');
+                this.loading.set(false);
+                this.notificationService.error('Failed to load class program terms');
+            }
+        });
+    }
+    /**
+     * Update grid data
+     */
+    updateGridData() {
+        this.gridConfig.update(config => ({
+            ...config,
+            data: this.filteredClassProgramTerms()
+        }));
+    }
+    /**
+     * Handle grid events
+     */
+    onGridEvent(event) {
+        switch (event.type) {
+            case 'pageChange':
+                if (event.data && typeof event.data === 'object' && 'pageIndex' in event.data && 'pageSize' in event.data) {
+                    this.loadClassProgramTerms();
+                }
+                break;
+            case 'search':
+                this.searchTerm.set(event.data);
+                this.updateGridData();
+                break;
+            case 'refresh':
+                this.loadClassProgramTerms();
+                break;
+        }
+    }
+    /**
+     * Create new class program term
+     */
+    createClassProgramTerm() {
+        this.router.navigate(['/control-panel/program-term-management/create']);
+    }
+    /**
+     * View class program term details
+     */
+    viewClassProgramTerm(classProgramTerm) {
+        this.router.navigate(['/control-panel/class-program-term/view', classProgramTerm._id]);
+    }
+    /**
+     * Edit class program term
+     */
+    editClassProgramTerm(classProgramTerm) {
+        this.router.navigate(['/control-panel/class-program-term/edit', classProgramTerm._id]);
+    }
+    /**
+     * Delete class program term
+     */
+    deleteClassProgramTerm(classProgramTerm) {
+        this.confirmationService.confirmDelete(classProgramTerm.acapt_name).then((confirmed) => {
+            if (confirmed) {
+                this.loading.set(true);
+                const payload = {
+                    acapt_id: classProgramTerm._id
+                };
+                this.classProgramTermService.deleteClassProgramTerm(payload)
+                    .pipe(takeUntilDestroyed(this.destroyRef))
+                    .subscribe({
+                    next: (response) => {
+                        if (response?.success) {
+                            this.classProgramTerms.update(terms => terms.filter(cpt => cpt._id !== classProgramTerm._id));
+                            this.updateGridData();
+                            this.notificationService.success('Class program term deleted successfully.');
+                        }
+                        else {
+                            this.notificationService.error('Failed to delete class program term.');
+                        }
+                        this.loading.set(false);
+                    },
+                    error: (error) => {
+                        console.error('❌ Error deleting class program term:', error);
+                        this.notificationService.error('Failed to delete class program term.');
+                        this.loading.set(false);
+                    }
+                });
+            }
+        });
+    }
+    /**
+     * Toggle class program term status
+     */
+    toggleClassProgramTermStatus(classProgramTerm) {
+        this.loading.set(true);
+        const payload = {
+            acapt_id: classProgramTerm._id
+        };
+        this.classProgramTermService.toggleClassProgramTermStatus(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                if (response?.success) {
+                    this.classProgramTerms.update(terms => terms.map(cpt => cpt._id === classProgramTerm._id
+                        ? { ...cpt, acapt_isactive: !cpt.acapt_isactive }
+                        : cpt));
+                    this.updateGridData();
+                    this.notificationService.success(`Class program term ${classProgramTerm.acapt_isactive ? 'deactivated' : 'activated'} successfully.`);
+                }
+                else {
+                    this.notificationService.error('Failed to toggle class program term status.');
+                }
+                this.loading.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error toggling class program term status:', error);
+                this.notificationService.error('Failed to toggle class program term status.');
+                this.loading.set(false);
+            }
+        });
+    }
+    /**
+     * Refresh data
+     */
+    refreshData() {
+        this.loadClassProgramTerms();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ClassProgramTermListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: ClassProgramTermListComponent, isStandalone: true, selector: "cide-academics-class-program-term-list", viewQueries: [{ propertyName: "classProgramTermDetailsRendererTemplate", first: true, predicate: ["classProgramTermDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "classProgramTermStatusRendererTemplate", first: true, predicate: ["classProgramTermStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Class Program Term Management Container -->\r\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'class_program_term' }\"\r\n  [breadcrumb_data]=\"breadcrumbData()\">\r\n  \r\n  <!-- Action Buttons in Breadcrumb Area -->\r\n  <div breadcrumb-actions>\r\n    <button cideEleButton type=\"button\" variant=\"primary\" size=\"sm\" leftIcon=\"add\" (btnClick)=\"createClassProgramTerm()\">\r\n      Create Class Program Term\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"tw-flex tw-flex-col tw-w-full tw-h-full\">\r\n\r\n  <!-- Filter Section -->\r\n  <div class=\"tw-flex-shrink-0 tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n    <div class=\"tw-flex tw-items-center tw-gap-4\">\r\n      <div class=\"tw-w-64\">\r\n        <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Class Program</label>\r\n        <cide-ele-select\r\n          [options]=\"classProgramMastersOptions()\"\r\n          [ngModel]=\"selectedProgramClassId() || ''\"\r\n          (ngModelChange)=\"onClassProgramChange($event)\"\r\n          placeholder=\"Select Class Program\"\r\n          valueKey=\"_id\"\r\n          labelKey=\"acacpm_alise_title\"\r\n          [loading]=\"classProgramMastersLoading()\"\r\n          [searchable]=\"true\"\r\n          (searchChange)=\"onClassProgramMasterSearch($event)\">\r\n        </cide-ele-select>\r\n      </div>\r\n      \r\n      @if (showBranchDropdown()) {\r\n        <div class=\"tw-w-64\">\r\n          <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Specialization</label>\r\n          <cide-ele-select\r\n            [options]=\"classProgramBranches()\"\r\n            [ngModel]=\"selectedBranchId() || ''\"\r\n            (ngModelChange)=\"onBranchChange($event)\"\r\n            placeholder=\"Select Specialization\"\r\n            valueKey=\"_id\"\r\n            labelKey=\"acabrn_name\"\r\n            [loading]=\"classProgramBranchesLoading()\">\r\n          </cide-ele-select>\r\n        </div>\r\n      }\r\n      \r\n      @if (selectedProgramClassId() && (!showBranchDropdown() || selectedBranchId())) {\r\n        <div class=\"tw-w-64\">\r\n          <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Program Term</label>\r\n          <cide-ele-select\r\n            [options]=\"classProgramTermsOptions()\"\r\n            [ngModel]=\"selectedTermId() || ''\"\r\n            (ngModelChange)=\"onTermChange($event)\"\r\n            placeholder=\"Select Program Term\"\r\n            valueKey=\"_id\"\r\n            labelKey=\"acapt_name\"\r\n            [loading]=\"classProgramTermsLoadingForDropdown()\">\r\n          </cide-ele-select>\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Data Grid Section -->\r\n  <div class=\"tw-flex-1 tw-min-h-0 tw-p-0\">\r\n    <cide-ele-data-grid\r\n      [config]=\"gridConfig()\"\r\n      [templateRenderers]=\"templateRenderers()\"\r\n      (gridEvent)=\"onGridEvent($event)\">\r\n    </cide-ele-data-grid>\r\n  </div>\r\n</div>\r\n</cide-lyt-shared-wrapper>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #classProgramTermDetailsRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <div class=\"tw-flex tw-items-center tw-space-x-3\">\r\n    <div class=\"tw-flex-shrink-0\">\r\n      <div class=\"tw-w-10 tw-h-10 tw-bg-orange-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center\">\r\n        <cide-ele-icon class=\"tw-text-orange-600 tw-w-5 tw-h-5\">schedule</cide-ele-icon>\r\n      </div>\r\n    </div>\r\n    <div class=\"tw-min-w-0 tw-flex-1\">\r\n      <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate tw-m-0\">\r\n        {{ item.acapt_name }}\r\n      </h6>\r\n      <p class=\"tw-text-xs tw-text-gray-500 tw-truncate tw-m-0\">\r\n        {{ item.acapt_description }}\r\n      </p>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #classProgramTermStatusRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n    @if (item.acapt_iscurrent) {\r\n    <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\r\n      <cide-ele-icon class=\"tw-w-3 tw-h-3 tw-mr-1\">star</cide-ele-icon>\r\n      Current\r\n    </span>\r\n    }\r\n    @if (item.acapt_islocked) {\r\n    <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-yellow-100 tw-text-yellow-800\">\r\n      <cide-ele-icon class=\"tw-w-3 tw-h-3 tw-mr-1\">lock</cide-ele-icon>\r\n      Locked\r\n    </span>\r\n    }\r\n    <span [ngClass]=\"{\r\n      'tw-bg-green-100 tw-text-green-800': item.acapt_isactive,\r\n      'tw-bg-red-100 tw-text-red-800': !item.acapt_isactive\r\n    }\" class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium\">\r\n      <cide-ele-icon [ngClass]=\"{\r\n        'tw-text-green-600': item.acapt_isactive,\r\n        'tw-text-red-600': !item.acapt_isactive\r\n      }\" class=\"tw-w-3 tw-h-3 tw-mr-1\">\r\n        {{ item.acapt_isactive ? 'check_circle' : 'cancel' }}\r\n      </cide-ele-icon>\r\n      {{ item.acapt_isactive ? 'Active' : 'Inactive' }}\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <cide-ele-dropdown\r\n    [items]=\"getActionDropdownItems(item)\"\r\n    (itemClick)=\"onDropdownItemClick($event, item)\"\r\n    [config]=\"{\r\n      triggerIcon: 'more_vert',\r\n      triggerSize: 'sm',\r\n      usePortal: true\r\n    }\"\r\n    size=\"sm\"\r\n    variant=\"ghost\"\r\n    icon=\"more_vert\">\r\n  </cide-ele-dropdown>\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ClassProgramTermListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cide-academics-class-program-term-list', standalone: true, imports: [
+                        CommonModule,
+                        FormsModule,
+                        CideEleDataGridComponent,
+                        CideIconComponent,
+                        CideEleButtonComponent,
+                        CideEleDropdownComponent,
+                        CideSelectComponent,
+                        CideLytSharedWrapperComponent
+                    ], template: "<!-- Class Program Term Management Container -->\r\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'class_program_term' }\"\r\n  [breadcrumb_data]=\"breadcrumbData()\">\r\n  \r\n  <!-- Action Buttons in Breadcrumb Area -->\r\n  <div breadcrumb-actions>\r\n    <button cideEleButton type=\"button\" variant=\"primary\" size=\"sm\" leftIcon=\"add\" (btnClick)=\"createClassProgramTerm()\">\r\n      Create Class Program Term\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"tw-flex tw-flex-col tw-w-full tw-h-full\">\r\n\r\n  <!-- Filter Section -->\r\n  <div class=\"tw-flex-shrink-0 tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n    <div class=\"tw-flex tw-items-center tw-gap-4\">\r\n      <div class=\"tw-w-64\">\r\n        <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Class Program</label>\r\n        <cide-ele-select\r\n          [options]=\"classProgramMastersOptions()\"\r\n          [ngModel]=\"selectedProgramClassId() || ''\"\r\n          (ngModelChange)=\"onClassProgramChange($event)\"\r\n          placeholder=\"Select Class Program\"\r\n          valueKey=\"_id\"\r\n          labelKey=\"acacpm_alise_title\"\r\n          [loading]=\"classProgramMastersLoading()\"\r\n          [searchable]=\"true\"\r\n          (searchChange)=\"onClassProgramMasterSearch($event)\">\r\n        </cide-ele-select>\r\n      </div>\r\n      \r\n      @if (showBranchDropdown()) {\r\n        <div class=\"tw-w-64\">\r\n          <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Specialization</label>\r\n          <cide-ele-select\r\n            [options]=\"classProgramBranches()\"\r\n            [ngModel]=\"selectedBranchId() || ''\"\r\n            (ngModelChange)=\"onBranchChange($event)\"\r\n            placeholder=\"Select Specialization\"\r\n            valueKey=\"_id\"\r\n            labelKey=\"acabrn_name\"\r\n            [loading]=\"classProgramBranchesLoading()\">\r\n          </cide-ele-select>\r\n        </div>\r\n      }\r\n      \r\n      @if (selectedProgramClassId() && (!showBranchDropdown() || selectedBranchId())) {\r\n        <div class=\"tw-w-64\">\r\n          <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 tw-mb-2\">Program Term</label>\r\n          <cide-ele-select\r\n            [options]=\"classProgramTermsOptions()\"\r\n            [ngModel]=\"selectedTermId() || ''\"\r\n            (ngModelChange)=\"onTermChange($event)\"\r\n            placeholder=\"Select Program Term\"\r\n            valueKey=\"_id\"\r\n            labelKey=\"acapt_name\"\r\n            [loading]=\"classProgramTermsLoadingForDropdown()\">\r\n          </cide-ele-select>\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Data Grid Section -->\r\n  <div class=\"tw-flex-1 tw-min-h-0 tw-p-0\">\r\n    <cide-ele-data-grid\r\n      [config]=\"gridConfig()\"\r\n      [templateRenderers]=\"templateRenderers()\"\r\n      (gridEvent)=\"onGridEvent($event)\">\r\n    </cide-ele-data-grid>\r\n  </div>\r\n</div>\r\n</cide-lyt-shared-wrapper>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #classProgramTermDetailsRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <div class=\"tw-flex tw-items-center tw-space-x-3\">\r\n    <div class=\"tw-flex-shrink-0\">\r\n      <div class=\"tw-w-10 tw-h-10 tw-bg-orange-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center\">\r\n        <cide-ele-icon class=\"tw-text-orange-600 tw-w-5 tw-h-5\">schedule</cide-ele-icon>\r\n      </div>\r\n    </div>\r\n    <div class=\"tw-min-w-0 tw-flex-1\">\r\n      <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate tw-m-0\">\r\n        {{ item.acapt_name }}\r\n      </h6>\r\n      <p class=\"tw-text-xs tw-text-gray-500 tw-truncate tw-m-0\">\r\n        {{ item.acapt_description }}\r\n      </p>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #classProgramTermStatusRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n    @if (item.acapt_iscurrent) {\r\n    <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\r\n      <cide-ele-icon class=\"tw-w-3 tw-h-3 tw-mr-1\">star</cide-ele-icon>\r\n      Current\r\n    </span>\r\n    }\r\n    @if (item.acapt_islocked) {\r\n    <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-yellow-100 tw-text-yellow-800\">\r\n      <cide-ele-icon class=\"tw-w-3 tw-h-3 tw-mr-1\">lock</cide-ele-icon>\r\n      Locked\r\n    </span>\r\n    }\r\n    <span [ngClass]=\"{\r\n      'tw-bg-green-100 tw-text-green-800': item.acapt_isactive,\r\n      'tw-bg-red-100 tw-text-red-800': !item.acapt_isactive\r\n    }\" class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium\">\r\n      <cide-ele-icon [ngClass]=\"{\r\n        'tw-text-green-600': item.acapt_isactive,\r\n        'tw-text-red-600': !item.acapt_isactive\r\n      }\" class=\"tw-w-3 tw-h-3 tw-mr-1\">\r\n        {{ item.acapt_isactive ? 'check_circle' : 'cancel' }}\r\n      </cide-ele-icon>\r\n      {{ item.acapt_isactive ? 'Active' : 'Inactive' }}\r\n    </span>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-value=\"value\" let-item=\"item\" let-column=\"column\">\r\n  <cide-ele-dropdown\r\n    [items]=\"getActionDropdownItems(item)\"\r\n    (itemClick)=\"onDropdownItemClick($event, item)\"\r\n    [config]=\"{\r\n      triggerIcon: 'more_vert',\r\n      triggerSize: 'sm',\r\n      usePortal: true\r\n    }\"\r\n    size=\"sm\"\r\n    variant=\"ghost\"\r\n    icon=\"more_vert\">\r\n  </cide-ele-dropdown>\r\n</ng-template>\r\n" }]
+        }] });
+
+export { ClassProgramTermListComponent };
+//# sourceMappingURL=cloud-ide-academics-class-program-term-list.component-BaFtTKcS.mjs.map