cloud-ide-academics 0.0.1 → 0.0.3

package/fesm2022/cloud-ide-academics-class-program-term-create.component-B5sVQbaC.mjs

@@ -0,0 +1,578 @@
+import * as i0 from '@angular/core';
+import { inject, DestroyRef, signal, Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
+import { Router, ActivatedRoute } from '@angular/router';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { NotificationService, ConfirmationService, CideInputComponent, CideTextareaComponent, CideEleButtonComponent, CideIconComponent, CideSelectComponent } from 'cloud-ide-element';
+import { AppStateHelperService } from 'cloud-ide-layout';
+import { ENTITY_SERVICE_TOKEN } from 'cloud-ide-shared';
+import { b as CideLytClassProgramBranchService, C as CideLytProgramClassService } from './cloud-ide-academics-cloud-ide-academics-Czexp3pk.mjs';
+import { C as CideLytClassProgramTermService } from './cloud-ide-academics-class-program-term.service-BW4PJQEM.mjs';
+import { generateObjectFromString } from 'cloud-ide-lms-model';
+
+class ClassProgramTermCreateComponent {
+    // Dependency injection
+    destroyRef = inject(DestroyRef);
+    fb = inject(FormBuilder);
+    entityService = inject(ENTITY_SERVICE_TOKEN);
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    appState = inject(AppStateHelperService);
+    notificationService = inject(NotificationService);
+    confirmationService = inject(ConfirmationService);
+    classProgramBranchService = inject(CideLytClassProgramBranchService);
+    programClassService = inject(CideLytProgramClassService);
+    classProgramTermService = inject(CideLytClassProgramTermService);
+    classProgramTermForm;
+    loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    error = signal(null, ...(ngDevMode ? [{ debugName: "error" }] : []));
+    // Class program term information from route
+    classProgramTermId = signal('', ...(ngDevMode ? [{ debugName: "classProgramTermId" }] : []));
+    isEditMode = signal(false, ...(ngDevMode ? [{ debugName: "isEditMode" }] : []));
+    isViewMode = signal(false, ...(ngDevMode ? [{ debugName: "isViewMode" }] : []));
+    // Data signals
+    programClasses = signal([], ...(ngDevMode ? [{ debugName: "programClasses" }] : []));
+    classProgramBranches = signal([], ...(ngDevMode ? [{ debugName: "classProgramBranches" }] : []));
+    // Options for dropdowns
+    programClassOptions = signal([], ...(ngDevMode ? [{ debugName: "programClassOptions" }] : []));
+    branchOptions = signal([], ...(ngDevMode ? [{ debugName: "branchOptions" }] : []));
+    parentTermOptions = signal([], ...(ngDevMode ? [{ debugName: "parentTermOptions" }] : []));
+    // Route parameters
+    acabrnId = signal(null, ...(ngDevMode ? [{ debugName: "acabrnId" }] : []));
+    acacpmId = signal(null, ...(ngDevMode ? [{ debugName: "acacpmId" }] : []));
+    // Date constraints
+    endDateMinDate = signal('', ...(ngDevMode ? [{ debugName: "endDateMinDate" }] : []));
+    constructor() {
+        this.classProgramTermForm = this.fb.group({
+            // Basic Class Program Term Information
+            acapt_code: ['', [Validators.required]],
+            acapt_name: ['', [Validators.required]],
+            acapt_description: [''],
+            acapt_class_program_id_acacpm: ['', [Validators.required]],
+            acapt_class_program_branch_id_acabrn: ['', [Validators.required]],
+            acapt_parent_class_prog_term_acapt: [''],
+            acapt_start_date: [''],
+            acapt_end_date: [''],
+            acapt_isactive: [true],
+            acapt_islocked: [false]
+        });
+    }
+    ngOnInit() {
+        this.initializeComponent();
+        this.setupFormSubscriptions();
+    }
+    /**
+     * Setup form subscriptions for dependent dropdowns
+     */
+    setupFormSubscriptions() {
+        // Watch for program class changes to filter branches
+        this.classProgramTermForm.get('acapt_class_program_id_acacpm')?.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(programClassId => {
+            if (programClassId) {
+                this.loadBranchesForProgramClass(programClassId);
+                // Clear branch selection when program class changes
+                this.classProgramTermForm.patchValue({
+                    acapt_class_program_branch_id_acabrn: ''
+                });
+            }
+            else {
+                this.branchOptions.set([]);
+            }
+        });
+        // Watch for branch changes to determine parent term
+        this.classProgramTermForm.get('acapt_class_program_branch_id_acabrn')?.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(branchId => {
+            if (branchId) {
+                this.determineParentTerm(branchId);
+            }
+            else {
+                // Clear parent term when branch is cleared
+                this.classProgramTermForm.patchValue({
+                    acapt_parent_class_prog_term_acapt: ''
+                });
+            }
+        });
+        // Watch for parent term changes to set date constraints
+        this.classProgramTermForm.get('acapt_parent_class_prog_term_acapt')?.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(parentTermId => {
+            this.loadParentTermDetails(parentTermId);
+        });
+        // Watch for start date changes to set minimum date for end date
+        this.classProgramTermForm.get('acapt_start_date')?.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(startDate => {
+            this.updateEndDateMinDate(startDate);
+        });
+    }
+    /**
+     * Initialize component
+     */
+    initializeComponent() {
+        // Check route parameters to determine mode
+        this.checkRouteParams();
+        const url = this.router.url;
+        const queryParams = this.route.snapshot.queryParams;
+        if (url.includes('/view/')) {
+            this.isViewMode.set(true);
+            this.loadClassProgramTermForView(queryParams);
+        }
+        else if (url.includes('/edit/')) {
+            this.isEditMode.set(true);
+            this.loadClassProgramTermForEdit(queryParams);
+        }
+        else {
+            // Create mode
+            this.isEditMode.set(false);
+            this.isViewMode.set(false);
+        }
+        // Load dropdown options
+        this.loadDropdownOptions();
+    }
+    /**
+     * 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 Create 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 term for viewing
+     */
+    loadClassProgramTermForView(queryParams) {
+        // Implementation for view mode
+        this.classProgramTermForm.disable();
+    }
+    /**
+     * Load class program term for editing
+     */
+    loadClassProgramTermForEdit(queryParams) {
+        // Implementation for edit mode
+    }
+    /**
+     * Load dropdown options
+     */
+    loadDropdownOptions() {
+        // Load program classes
+        this.loadProgramClasses();
+        // Load branches
+        this.loadClassProgramBranches();
+    }
+    /**
+     * Load program classes
+     */
+    loadProgramClasses() {
+        this.programClassService.getProgramClassList({ pagination: false })
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                console.log('✅ Program classes loaded:', response);
+                if (response?.success && response.data) {
+                    this.programClassOptions.set(response.data);
+                    // Pre-select program class if provided in route
+                    const acacpmId = this.acacpmId();
+                    if (acacpmId) {
+                        this.classProgramTermForm.patchValue({
+                            acapt_class_program_id_acacpm: acacpmId
+                        });
+                    }
+                }
+                else {
+                    console.warn('⚠️ No program class data received');
+                    this.programClassOptions.set([]);
+                }
+            },
+            error: (error) => {
+                console.error('❌ Error loading program classes:', error);
+                this.programClassOptions.set([]);
+            }
+        });
+    }
+    /**
+     * Load class program branches
+     */
+    loadClassProgramBranches() {
+        const acacpmId = this.acacpmId();
+        if (acacpmId) {
+            this.loadBranchesForProgramClass(acacpmId);
+        }
+    }
+    /**
+     * Load branches for a specific program class
+     */
+    loadBranchesForProgramClass(programClassId) {
+        const payload = {
+            pagination: false,
+            pageIndex: 0,
+            pageSize: 100,
+            acabrn_class_program_id_acacpm: programClassId
+        };
+        this.classProgramBranchService.getClassProgramBranchList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                console.log('✅ Class program branches loaded for program class:', programClassId, response);
+                if (response?.success && response.data) {
+                    this.branchOptions.set(response.data);
+                    // Pre-select branch if provided in route and not already set
+                    const acabrnId = this.acabrnId();
+                    const currentBranchId = this.classProgramTermForm.get('acapt_class_program_branch_id_acabrn')?.value;
+                    if (acabrnId && !currentBranchId) {
+                        this.classProgramTermForm.patchValue({
+                            acapt_class_program_branch_id_acabrn: acabrnId
+                        });
+                    }
+                }
+                else {
+                    console.warn('⚠️ No branch data received');
+                    this.branchOptions.set([]);
+                }
+            },
+            error: (error) => {
+                console.error('❌ Error loading branches:', error);
+                this.branchOptions.set([]);
+            }
+        });
+    }
+    /**
+     * Determine parent term based on selected branch
+     * This method will be called internally when branch is selected
+     */
+    determineParentTerm(branchId) {
+        // Find the selected branch from the options
+        const selectedBranch = this.branchOptions().find(branch => branch._id === branchId);
+        if (selectedBranch) {
+            console.log('🏢 Determining parent term for branch:', selectedBranch.acabrn_name);
+            // Load existing terms for this branch to find potential parent terms
+            this.loadParentTermsForBranch(branchId);
+        }
+    }
+    /**
+     * Load parent terms for a specific branch
+     */
+    loadParentTermsForBranch(branchId) {
+        // TODO: Implement API call to get existing terms for the branch
+        // This will help determine which terms can be parent terms
+        console.log('🏢 Loading parent terms for branch:', branchId);
+        // Example implementation - replace with actual API call
+        // const payload = {
+        //   acabrn_id: branchId,
+        //   pagination: false
+        // };
+        // this.classProgramTermService.getClassProgramTermList(payload)
+        //   .pipe(takeUntilDestroyed(this.destroyRef))
+        //   .subscribe({
+        //     next: (response) => {
+        //       if (response?.success && response.data) {
+        //         // Filter terms that can be parent terms (e.g., terms without parent)
+        //         const parentTerms = response.data.filter(term => !term.acapt_parent_class_prog_term_acapt);
+        //         this.parentTermOptions.set(parentTerms);
+        //       }
+        //     },
+        //     error: (error) => {
+        //       console.error('❌ Error loading parent terms:', error);
+        //       this.parentTermOptions.set([]);
+        //     }
+        //   });
+        // For now, set empty array
+        this.parentTermOptions.set([]);
+    }
+    /**
+     * Load parent term details for date validation
+     * This method will be called when a parent term is selected
+     */
+    loadParentTermDetails(parentTermId) {
+        if (!parentTermId) {
+            // Clear date constraints when no parent is selected
+            this.clearDateConstraints();
+            return;
+        }
+        // TODO: Implement API call to get parent term details
+        // For now, we'll use mock data or implement based on your API
+        console.log('🏢 Loading parent term details for ID:', parentTermId);
+        // Example implementation - replace with actual API call
+        // this.classProgramTermService.getClassProgramTermById({ _id: parentTermId })
+        //   .pipe(takeUntilDestroyed(this.destroyRef))
+        //   .subscribe({
+        //     next: (response) => {
+        //       if (response?.success && response.data) {
+        //         const parentTerm = response.data;
+        //         this.setDateConstraints(parentTerm.acapt_start_date, parentTerm.acapt_end_date);
+        //       }
+        //     },
+        //     error: (error) => {
+        //       console.error('❌ Error loading parent term details:', error);
+        //     }
+        //   });
+    }
+    /**
+     * Set date constraints based on parent term dates
+     */
+    setDateConstraints(parentStartDate, parentEndDate) {
+        console.log('🏢 Setting date constraints:', { parentStartDate, parentEndDate });
+        // Update form validation to ensure child dates are within parent range
+        const startDateControl = this.classProgramTermForm.get('acapt_start_date');
+        const endDateControl = this.classProgramTermForm.get('acapt_end_date');
+        if (startDateControl && endDateControl) {
+            // Add custom validators for date range
+            startDateControl.setValidators([
+                this.dateRangeValidator(parentStartDate, parentEndDate, 'start')
+            ]);
+            endDateControl.setValidators([
+                this.dateRangeValidator(parentStartDate, parentEndDate, 'end')
+            ]);
+            // Update validation
+            startDateControl.updateValueAndValidity();
+            endDateControl.updateValueAndValidity();
+        }
+    }
+    /**
+     * Clear date constraints when no parent is selected
+     */
+    clearDateConstraints() {
+        const startDateControl = this.classProgramTermForm.get('acapt_start_date');
+        const endDateControl = this.classProgramTermForm.get('acapt_end_date');
+        if (startDateControl && endDateControl) {
+            // Remove custom validators
+            startDateControl.clearValidators();
+            endDateControl.clearValidators();
+            // Update validation
+            startDateControl.updateValueAndValidity();
+            endDateControl.updateValueAndValidity();
+        }
+    }
+    /**
+     * Custom validator for date range constraints
+     */
+    dateRangeValidator(parentStartDate, parentEndDate, dateType) {
+        return (control) => {
+            if (!control.value || !parentStartDate || !parentEndDate) {
+                return null; // No validation if no date or parent dates
+            }
+            const selectedDate = new Date(control.value);
+            const parentStart = new Date(parentStartDate);
+            const parentEnd = new Date(parentEndDate);
+            if (dateType === 'start') {
+                // Start date should be >= parent start date and < parent end date
+                if (selectedDate < parentStart || selectedDate >= parentEnd) {
+                    return {
+                        dateRangeError: {
+                            message: `Start date must be between ${parentStartDate} and ${parentEndDate}`
+                        }
+                    };
+                }
+            }
+            else if (dateType === 'end') {
+                // End date should be > parent start date and <= parent end date
+                if (selectedDate <= parentStart || selectedDate > parentEnd) {
+                    return {
+                        dateRangeError: {
+                            message: `End date must be between ${parentStartDate} and ${parentEndDate}`
+                        }
+                    };
+                }
+            }
+            return null; // Valid
+        };
+    }
+    /**
+     * Update minimum date for end date based on start date
+     */
+    updateEndDateMinDate(startDate) {
+        if (startDate) {
+            // Set the minimum date for end date to be the start date
+            this.endDateMinDate.set(startDate);
+            // If end date is already set and is before the new start date, clear it
+            const endDate = this.classProgramTermForm.get('acapt_end_date')?.value;
+            if (endDate && endDate < startDate) {
+                this.classProgramTermForm.patchValue({
+                    acapt_end_date: ''
+                });
+            }
+            console.log('🏢 Updated end date minimum date to:', startDate);
+        }
+        else {
+            // Clear minimum date constraint if no start date
+            this.endDateMinDate.set('');
+        }
+    }
+    onSubmit() {
+        if (this.isViewMode()) {
+            this.router.navigate(['/control-panel/program-term-section-management']);
+            return;
+        }
+        if (this.classProgramTermForm.invalid) {
+            this.notificationService.error('Please fill in all required fields correctly.');
+            this.markFormGroupTouched();
+            return;
+        }
+        this.loading.set(true);
+        this.error.set(null);
+        const formData = this.classProgramTermForm.value;
+        console.log('Class Program Term Form Data:', formData);
+        // Prepare payload for API call
+        const payload = {
+            acapt_code: formData.acapt_code,
+            acapt_name: formData.acapt_name,
+            acapt_class_program_id_acacpm: formData.acapt_class_program_id_acacpm,
+            acapt_class_prg_branch_acabrn: formData.acapt_class_program_branch_id_acabrn,
+            acapt_parent_class_prog_term_acapt: formData.acapt_parent_class_prog_term_acapt || null,
+            acapt_start_date: formData.acapt_start_date,
+            acapt_end_date: formData.acapt_end_date,
+            acapt_isactive: formData.acapt_isactive,
+            acapt_islocked: formData.acapt_islocked
+        };
+        // Add _id for edit mode
+        if (this.isEditMode() && this.classProgramTermId()) {
+            payload._id = this.classProgramTermId();
+        }
+        console.log('API Payload:', payload);
+        // Make API call
+        this.classProgramTermService.saveClassProgramTerm(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                console.log('✅ Class program term saved successfully:', response);
+                if (response?.success) {
+                    const action = this.isEditMode() ? 'updated' : 'created';
+                    this.notificationService.success(`Class program term has been ${action} successfully.`);
+                    this.router.navigate(['/control-panel/program-term-section-management']);
+                }
+                else {
+                    this.error.set(response?.message || 'Failed to save class program term');
+                    this.notificationService.error(response?.message || 'Failed to save class program term');
+                }
+                this.loading.set(false);
+            },
+            error: (error) => {
+                console.error('❌ Error saving class program term:', error);
+                this.error.set('Failed to save class program term');
+                this.notificationService.error('Failed to save class program term. Please try again.');
+                this.loading.set(false);
+            }
+        });
+    }
+    /**
+     * Mark all form controls as touched to trigger validation display
+     */
+    markFormGroupTouched() {
+        Object.keys(this.classProgramTermForm.controls).forEach(key => {
+            const control = this.classProgramTermForm.get(key);
+            control?.markAsTouched();
+        });
+    }
+    resetForm() {
+        this.classProgramTermForm.reset({
+            acapt_isactive: true,
+            acapt_islocked: false
+        });
+        // Clear options when form is reset
+        this.branchOptions.set([]);
+        this.parentTermOptions.set([]);
+        // Clear date constraints
+        this.clearDateConstraints();
+        this.endDateMinDate.set('');
+    }
+    /**
+     * Go back to class program term list
+     */
+    goBackToClassProgramTermList() {
+        this.router.navigate(['/control-panel/program-term-section-management']);
+    }
+    /**
+     * Cancel form and optionally navigate back
+     */
+    cancelForm() {
+        if (this.isEditMode()) {
+            this.goBackToClassProgramTermList();
+        }
+        else {
+            this.resetForm();
+        }
+    }
+    /**
+     * Get page title based on mode
+     */
+    getPageTitle() {
+        if (this.isViewMode())
+            return 'View Class Program Term';
+        return this.isEditMode() ? 'Edit Class Program Term' : 'Create New Class Program Term';
+    }
+    /**
+     * Handle Active card click to toggle checkbox
+     */
+    onActiveCardClick() {
+        if (this.isViewMode()) {
+            return; // Don't allow changes in view mode
+        }
+        const currentValue = this.classProgramTermForm.get('acapt_isactive')?.value;
+        this.classProgramTermForm.patchValue({
+            acapt_isactive: !currentValue
+        });
+    }
+    /**
+     * Handle Locked card click to toggle checkbox
+     */
+    onLockedCardClick() {
+        if (this.isViewMode()) {
+            return; // Don't allow changes in view mode
+        }
+        const currentValue = this.classProgramTermForm.get('acapt_islocked')?.value;
+        this.classProgramTermForm.patchValue({
+            acapt_islocked: !currentValue
+        });
+    }
+    /**
+     * Cleanup when component is destroyed
+     */
+    ngOnDestroy() {
+        console.log('🧹 ClassProgramTermCreateComponent: Cleaning up component state');
+        // Reset all signals to their initial state
+        this.loading.set(false);
+        this.error.set(null);
+        this.classProgramTermId.set('');
+        this.isEditMode.set(false);
+        this.programClassOptions.set([]);
+        this.branchOptions.set([]);
+        this.parentTermOptions.set([]);
+        // Reset form to initial state
+        this.resetForm();
+        console.log('🧹 ClassProgramTermCreateComponent: Component state cleaned up');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ClassProgramTermCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: ClassProgramTermCreateComponent, isStandalone: true, selector: "cide-academics-class-program-term-create", ngImport: i0, template: "<!-- \r\n  CLASS PROGRAM TERM MASTER FORM\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"classProgramTermForm\"\r\n    [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n\r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-orange-600 tw-w-5 tw-h-5\">schedule</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ getPageTitle() }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div\r\n            class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          <!-- Class Program Term Information -->\r\n          <div class=\"tw-space-y-6\">\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <cide-ele-input label=\"Term Code *\" formControlName=\"acapt_code\" placeholder=\"e.g., T1, T2, T3\"\r\n                size=\"md\" leadingIcon=\"code\">\r\n              </cide-ele-input>\r\n\r\n              <cide-ele-input label=\"Term Name *\" formControlName=\"acapt_name\"\r\n                placeholder=\"e.g., First Term, Second Term\" size=\"md\" leadingIcon=\"schedule\">\r\n              </cide-ele-input>\r\n            </div>\r\n\r\n            <div>\r\n              <cide-ele-textarea label=\"Description\" formControlName=\"acapt_description\"\r\n                placeholder=\"Enter detailed description of the term...\" rows=\"3\" size=\"md\">\r\n              </cide-ele-textarea>\r\n            </div>\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <cide-ele-input id=\"acapt_start_date\" label=\"Start Date\" formControlName=\"acapt_start_date\" type=\"date\"\r\n                size=\"md\" leadingIcon=\"event\">\r\n              </cide-ele-input>\r\n\r\n              <cide-ele-input id=\"acapt_end_date\" label=\"End Date\" formControlName=\"acapt_end_date\" type=\"date\"\r\n                [min]=\"endDateMinDate()\" size=\"md\" leadingIcon=\"event\">\r\n              </cide-ele-input>\r\n            </div>\r\n\r\n            <div class=\"tw-p-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\r\n              <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-text-blue-500\"></cide-ele-icon>\r\n                <span class=\"tw-text-sm tw-text-blue-700\">\r\n                  Sequence will be automatically managed through drag-and-drop on the listing page\r\n                </span>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Program Class *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acapt_class_program_id_acacpm\" \r\n                  placeholder=\"Select program class\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acacpm_alise_title\" \r\n                  [options]=\"programClassOptions()\">\r\n                </cide-ele-select>\r\n              </div>\r\n\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program Branch *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acapt_class_program_branch_id_acabrn\" \r\n                  placeholder=\"Select branch\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acabrn_name\" \r\n                  [options]=\"branchOptions()\">\r\n                </cide-ele-select>\r\n              </div>\r\n            </div>\r\n\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div\r\n                class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                [class.tw-opacity-60]=\"isViewMode()\"\r\n                (click)=\"onActiveCardClick()\">\r\n                <cide-ele-input formControlName=\"acapt_isactive\" type=\"checkbox\" size=\"md\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this term</span>\r\n                </div>\r\n              </div>\r\n\r\n              <div\r\n                class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                [class.tw-opacity-60]=\"isViewMode()\"\r\n                (click)=\"onLockedCardClick()\">\r\n                <cide-ele-input formControlName=\"acapt_islocked\" type=\"checkbox\" size=\"md\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <!-- Error Display -->\r\n        @if (error()) {\r\n        <div class=\"tw-mt-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-lg\">\r\n          <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n            <cide-ele-icon variant=\"red\" size=\"sm\">error</cide-ele-icon>\r\n            <span class=\"tw-text-sm tw-font-medium tw-text-red-800\">{{ error() }}</span>\r\n          </div>\r\n        </div>\r\n        }\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Actions -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n        <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n            [disabled]=\"loading()\">\r\n            Reset Form\r\n          </button>\r\n\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\r\n            [disabled]=\"loading()\">\r\n            Cancel\r\n          </button>\r\n\r\n          <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || classProgramTermForm.invalid\"\r\n            [loading]=\"loading()\" leftIcon=\"save\">\r\n            {{ isEditMode() ? 'Update Class Program Term' : 'Create Class Program Term' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</div>\r\n\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", 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: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { 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"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: ClassProgramTermCreateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cide-academics-class-program-term-create', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        CideInputComponent,
+                        CideTextareaComponent,
+                        CideEleButtonComponent,
+                        CideIconComponent,
+                        CideSelectComponent
+                    ], template: "<!-- \r\n  CLASS PROGRAM TERM MASTER FORM\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"classProgramTermForm\"\r\n    [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n\r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-orange-600 tw-w-5 tw-h-5\">schedule</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ getPageTitle() }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div\r\n            class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          <!-- Class Program Term Information -->\r\n          <div class=\"tw-space-y-6\">\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <cide-ele-input label=\"Term Code *\" formControlName=\"acapt_code\" placeholder=\"e.g., T1, T2, T3\"\r\n                size=\"md\" leadingIcon=\"code\">\r\n              </cide-ele-input>\r\n\r\n              <cide-ele-input label=\"Term Name *\" formControlName=\"acapt_name\"\r\n                placeholder=\"e.g., First Term, Second Term\" size=\"md\" leadingIcon=\"schedule\">\r\n              </cide-ele-input>\r\n            </div>\r\n\r\n            <div>\r\n              <cide-ele-textarea label=\"Description\" formControlName=\"acapt_description\"\r\n                placeholder=\"Enter detailed description of the term...\" rows=\"3\" size=\"md\">\r\n              </cide-ele-textarea>\r\n            </div>\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <cide-ele-input id=\"acapt_start_date\" label=\"Start Date\" formControlName=\"acapt_start_date\" type=\"date\"\r\n                size=\"md\" leadingIcon=\"event\">\r\n              </cide-ele-input>\r\n\r\n              <cide-ele-input id=\"acapt_end_date\" label=\"End Date\" formControlName=\"acapt_end_date\" type=\"date\"\r\n                [min]=\"endDateMinDate()\" size=\"md\" leadingIcon=\"event\">\r\n              </cide-ele-input>\r\n            </div>\r\n\r\n            <div class=\"tw-p-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\r\n              <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-text-blue-500\"></cide-ele-icon>\r\n                <span class=\"tw-text-sm tw-text-blue-700\">\r\n                  Sequence will be automatically managed through drag-and-drop on the listing page\r\n                </span>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Program Class *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acapt_class_program_id_acacpm\" \r\n                  placeholder=\"Select program class\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acacpm_alise_title\" \r\n                  [options]=\"programClassOptions()\">\r\n                </cide-ele-select>\r\n              </div>\r\n\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program Branch *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acapt_class_program_branch_id_acabrn\" \r\n                  placeholder=\"Select branch\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acabrn_name\" \r\n                  [options]=\"branchOptions()\">\r\n                </cide-ele-select>\r\n              </div>\r\n            </div>\r\n\r\n\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div\r\n                class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                [class.tw-opacity-60]=\"isViewMode()\"\r\n                (click)=\"onActiveCardClick()\">\r\n                <cide-ele-input formControlName=\"acapt_isactive\" type=\"checkbox\" size=\"md\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this term</span>\r\n                </div>\r\n              </div>\r\n\r\n              <div\r\n                class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                [class.tw-opacity-60]=\"isViewMode()\"\r\n                (click)=\"onLockedCardClick()\">\r\n                <cide-ele-input formControlName=\"acapt_islocked\" type=\"checkbox\" size=\"md\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\n        <!-- Error Display -->\r\n        @if (error()) {\r\n        <div class=\"tw-mt-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-lg\">\r\n          <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n            <cide-ele-icon variant=\"red\" size=\"sm\">error</cide-ele-icon>\r\n            <span class=\"tw-text-sm tw-font-medium tw-text-red-800\">{{ error() }}</span>\r\n          </div>\r\n        </div>\r\n        }\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Actions -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n        <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n            [disabled]=\"loading()\">\r\n            Reset Form\r\n          </button>\r\n\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\r\n            [disabled]=\"loading()\">\r\n            Cancel\r\n          </button>\r\n\r\n          <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || classProgramTermForm.invalid\"\r\n            [loading]=\"loading()\" leftIcon=\"save\">\r\n            {{ isEditMode() ? 'Update Class Program Term' : 'Create Class Program Term' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</div>\r\n\r\n" }]
+        }], ctorParameters: () => [] });
+
+export { ClassProgramTermCreateComponent };
+//# sourceMappingURL=cloud-ide-academics-class-program-term-create.component-B5sVQbaC.mjs.map