import "./chunk-SKZXPA6D.js";
import "./chunk-5IIA45LM.js";
import {
  ClientDatatableComponent
} from "./chunk-3RTU34A3.js";
import "./chunk-YWQICJL7.js";
import "./chunk-BP5JJWGC.js";
import {
  MonacoEditorModule
} from "./chunk-62OL73TD.js";
import "./chunk-IGGXREIH.js";
import {
  ToastrService
} from "./chunk-2YLAF7RI.js";
import {
  CommonSharedModule,
  DynamicFontSizeDirective,
  Store
} from "./chunk-7NQGM4EA.js";
import {
  DefaultValueAccessor,
  FormBuilder,
  FormControlName,
  FormGroupDirective,
  NgControlStatus,
  NgControlStatusGroup,
  NumberValueAccessor,
  ReactiveFormsModule,
  TranslatePipe,
  TranslateService,
  Validators,
  ɵNgNoValidate
} from "./chunk-NLYGDKUR.js";
import {
  animate,
  style,
  transition,
  trigger
} from "./chunk-ZEL7H2AL.js";
import {
  ActivatedRoute,
  GridApiService,
  Router
} from "./chunk-P7K2QEDI.js";
import {
  Location,
  NgClass,
  NgIf,
  Title,
  ɵsetClassDebugInfo,
  ɵɵStandaloneFeature,
  ɵɵadvance,
  ɵɵdefineComponent,
  ɵɵdirectiveInject,
  ɵɵelement,
  ɵɵelementEnd,
  ɵɵelementStart,
  ɵɵgetCurrentView,
  ɵɵlistener,
  ɵɵloadQuery,
  ɵɵnextContext,
  ɵɵpipe,
  ɵɵpipeBind1,
  ɵɵproperty,
  ɵɵpropertyInterpolate,
  ɵɵpureFunction1,
  ɵɵqueryRefresh,
  ɵɵresetView,
  ɵɵrestoreView,
  ɵɵsanitizeUrl,
  ɵɵtemplate,
  ɵɵtext,
  ɵɵtextInterpolate,
  ɵɵtextInterpolate1,
  ɵɵviewQuery
} from "./chunk-GKZIWABI.js";
import {
  __spreadValues
} from "./chunk-CVWHNZRK.js";

// src/app/@lcp-framework/pages/carousel/carousel.component.ts
var _c0 = ["monacoEditor"];
var _c1 = (a0) => ({ "is-invalid": a0 });
var _c2 = (a0) => ({ "border-red-500": a0 });
function CarouselComponent_div_24_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 22);
    \u0275\u0275text(1);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    const ctx_r0 = \u0275\u0275nextContext();
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.getErrorMessage("name"), " ");
  }
}
function CarouselComponent_div_31_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 22);
    \u0275\u0275text(1);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    const ctx_r0 = \u0275\u0275nextContext();
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.getErrorMessage("slug"), " ");
  }
}
function CarouselComponent_div_38_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 22);
    \u0275\u0275text(1);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    const ctx_r0 = \u0275\u0275nextContext();
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.getErrorMessage("description"), " ");
  }
}
function CarouselComponent_div_41_div_23_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 57);
    \u0275\u0275text(1);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    const ctx_r0 = \u0275\u0275nextContext(2);
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.getLineItemErrorMessage("name"), " ");
  }
}
function CarouselComponent_div_41_div_36_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 57);
    \u0275\u0275text(1);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    const ctx_r0 = \u0275\u0275nextContext(2);
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.getLineItemErrorMessage("slug"), " ");
  }
}
function CarouselComponent_div_41_div_49_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 8)(1, "label", 58);
    \u0275\u0275text(2, "Image Preview");
    \u0275\u0275elementEnd();
    \u0275\u0275element(3, "img", 59);
    \u0275\u0275elementEnd();
  }
  if (rf & 2) {
    let tmp_2_0;
    const ctx_r0 = \u0275\u0275nextContext(2);
    \u0275\u0275advance(3);
    \u0275\u0275property("src", ctx_r0.previewImageUrl || ((tmp_2_0 = ctx_r0.lineItemForm.get("image_url")) == null ? null : tmp_2_0.value), \u0275\u0275sanitizeUrl);
  }
}
function CarouselComponent_div_41_Template(rf, ctx) {
  if (rf & 1) {
    const _r2 = \u0275\u0275getCurrentView();
    \u0275\u0275elementStart(0, "div", 23);
    \u0275\u0275element(1, "div", 24);
    \u0275\u0275elementStart(2, "div", 25)(3, "div", 26)(4, "div", 27)(5, "div", 28)(6, "h3", 29);
    \u0275\u0275text(7);
    \u0275\u0275pipe(8, "translate");
    \u0275\u0275pipe(9, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(10, "button", 30);
    \u0275\u0275listener("click", function CarouselComponent_div_41_Template_button_click_10_listener() {
      \u0275\u0275restoreView(_r2);
      const ctx_r0 = \u0275\u0275nextContext();
      return \u0275\u0275resetView(ctx_r0.cancelLineItemEdit());
    });
    \u0275\u0275elementStart(11, "span", 31);
    \u0275\u0275text(12, "Close");
    \u0275\u0275elementEnd();
    \u0275\u0275element(13, "i", 32);
    \u0275\u0275elementEnd()()();
    \u0275\u0275elementStart(14, "div", 33)(15, "form", 34);
    \u0275\u0275listener("ngSubmit", function CarouselComponent_div_41_Template_form_ngSubmit_15_listener() {
      \u0275\u0275restoreView(_r2);
      const ctx_r0 = \u0275\u0275nextContext();
      return \u0275\u0275resetView(ctx_r0.onLineItemSubmit());
    });
    \u0275\u0275elementStart(16, "div", 35)(17, "div", 36)(18, "label", 37);
    \u0275\u0275text(19);
    \u0275\u0275pipe(20, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(21, "div", 38);
    \u0275\u0275element(22, "input", 39);
    \u0275\u0275template(23, CarouselComponent_div_41_div_23_Template, 2, 1, "div", 40);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(24, "div", 36)(25, "label", 41);
    \u0275\u0275text(26);
    \u0275\u0275pipe(27, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(28, "div", 38);
    \u0275\u0275element(29, "input", 42);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(30, "div", 36)(31, "label", 43);
    \u0275\u0275text(32);
    \u0275\u0275pipe(33, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(34, "div", 38);
    \u0275\u0275element(35, "input", 44);
    \u0275\u0275template(36, CarouselComponent_div_41_div_36_Template, 2, 1, "div", 40);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(37, "div", 36)(38, "label", 45);
    \u0275\u0275text(39);
    \u0275\u0275pipe(40, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(41, "div", 38);
    \u0275\u0275element(42, "input", 46);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(43, "div", 36)(44, "label", 47);
    \u0275\u0275text(45);
    \u0275\u0275pipe(46, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(47, "div", 38)(48, "input", 48);
    \u0275\u0275listener("change", function CarouselComponent_div_41_Template_input_change_48_listener($event) {
      \u0275\u0275restoreView(_r2);
      const ctx_r0 = \u0275\u0275nextContext();
      return \u0275\u0275resetView(ctx_r0.onImageChange($event));
    });
    \u0275\u0275elementEnd()();
    \u0275\u0275template(49, CarouselComponent_div_41_div_49_Template, 4, 1, "div", 49);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(50, "div", 36)(51, "label", 50);
    \u0275\u0275text(52);
    \u0275\u0275pipe(53, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(54, "div", 38);
    \u0275\u0275element(55, "input", 51);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(56, "div", 36)(57, "label", 52);
    \u0275\u0275text(58);
    \u0275\u0275pipe(59, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(60, "div", 38);
    \u0275\u0275element(61, "input", 53);
    \u0275\u0275elementEnd()();
    \u0275\u0275elementStart(62, "div", 54)(63, "button", 55);
    \u0275\u0275listener("click", function CarouselComponent_div_41_Template_button_click_63_listener() {
      \u0275\u0275restoreView(_r2);
      const ctx_r0 = \u0275\u0275nextContext();
      return \u0275\u0275resetView(ctx_r0.cancelLineItemEdit());
    });
    \u0275\u0275text(64);
    \u0275\u0275pipe(65, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(66, "button", 56);
    \u0275\u0275text(67);
    \u0275\u0275pipe(68, "translate");
    \u0275\u0275pipe(69, "translate");
    \u0275\u0275elementEnd()()()()()()();
  }
  if (rf & 2) {
    let tmp_12_0;
    const ctx_r0 = \u0275\u0275nextContext();
    \u0275\u0275advance(7);
    \u0275\u0275textInterpolate1(" ", ctx_r0.editingItemIndex !== -1 ? \u0275\u0275pipeBind1(8, 17, "title_edit_carousel_template_line_item") : \u0275\u0275pipeBind1(9, 19, "title_add_carousel_template_line_item"), " ");
    \u0275\u0275advance(8);
    \u0275\u0275property("formGroup", ctx_r0.lineItemForm);
    \u0275\u0275advance(4);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(20, 21, "form_label_name"), " ");
    \u0275\u0275advance(3);
    \u0275\u0275property("ngClass", \u0275\u0275pureFunction1(41, _c2, ctx_r0.isLineItemFieldInvalid("name")));
    \u0275\u0275advance();
    \u0275\u0275property("ngIf", ctx_r0.isLineItemFieldInvalid("name"));
    \u0275\u0275advance(3);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(27, 23, "form_label_description"), " ");
    \u0275\u0275advance(6);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(33, 25, "form_label_slug"), " ");
    \u0275\u0275advance(3);
    \u0275\u0275property("ngClass", \u0275\u0275pureFunction1(43, _c2, ctx_r0.isLineItemFieldInvalid("slug")));
    \u0275\u0275advance();
    \u0275\u0275property("ngIf", ctx_r0.isLineItemFieldInvalid("slug"));
    \u0275\u0275advance(3);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(40, 27, "form_label_order_no"), " ");
    \u0275\u0275advance(6);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(46, 29, "carousel_label_image_url"), " ");
    \u0275\u0275advance(4);
    \u0275\u0275property("ngIf", ctx_r0.previewImageUrl || ((tmp_12_0 = ctx_r0.lineItemForm.get("image_url")) == null ? null : tmp_12_0.value));
    \u0275\u0275advance(3);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(53, 31, "carousel_label_video_url"), " ");
    \u0275\u0275advance(6);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(59, 33, "carousel_label_clickable_link"), " ");
    \u0275\u0275advance(6);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(65, 35, "cancel"), " ");
    \u0275\u0275advance(2);
    \u0275\u0275property("disabled", ctx_r0.lineItemForm.invalid);
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", ctx_r0.editingItemIndex !== -1 ? \u0275\u0275pipeBind1(68, 37, "update") : \u0275\u0275pipeBind1(69, 39, "add"), " ");
  }
}
var _CarouselComponent = class _CarouselComponent {
  constructor(fb, gridApiService, toastr, route, router, storeData, translate, titleService, location) {
    this.fb = fb;
    this.gridApiService = gridApiService;
    this.toastr = toastr;
    this.route = route;
    this.router = router;
    this.storeData = storeData;
    this.translate = translate;
    this.titleService = titleService;
    this.location = location;
    this._originalItems = [];
    this.previewImageUrl = null;
    this.items = [];
    this.id = null;
    this.editTitle = false;
    this.submitted = false;
    this.tables_list = [];
    this.redirect_url = "carousel_template";
    this.selectedItem = null;
    this.editingItemIndex = -1;
    this.isItemModalOpen = false;
    this.showEmailProcessSlug = false;
    this.itemsTableConfig = {
      columns: [
        { key: "name", label: "Item Name", sortable: true, searchable: true },
        { key: "description", label: "Description", sortable: true, searchable: true },
        { key: "slug", label: "Slug", sortable: true, searchable: false },
        { key: "image_url", label: "Image URL", sortable: true, searchable: false },
        { key: "video_url", label: "Video URL", sortable: true, searchable: false },
        { key: "clickable_link", label: "Clickable Link", sortable: true, searchable: false },
        { key: "order_no", label: "Order No", sortable: true, searchable: false },
        {
          key: "actions",
          label: "Actions",
          type: "button",
          actions: [
            {
              icon: "fa-solid fa-edit",
              onClick: (item) => this.editLineItem(item),
              class: "mr-4",
              tooltip: "Edit Item"
            },
            {
              icon: "fa-solid fa-trash",
              onClick: (item) => this.removeLineItem(item),
              class: "",
              tooltip: "Delete Item"
            }
          ]
        }
      ],
      pageSizes: [5, 10, 25, 50],
      defaultPageSize: 5,
      searchable: true,
      headerConfig: {
        title: "Carousel Template Line Items",
        showHeader: true,
        addButton: {
          show: true,
          label: "Add New",
          icon: "fa-solid fa-plus",
          onClick: () => this.initNewLineItem(),
          disabled: false,
          class: "btn-primary flex items-center rounded-md border border-[#e0e6ed] px-4 py-2 font-semibold dark:border-[#253b5c] dark:bg-[#1b2e4b] dark:text-white-dark"
        },
        enableFilter: true,
        enableColumnSelector: true,
        enableExport: true
      }
    };
    this.insert_json_schema = {
      action: ["insert", "insert"],
      table: ["carousel_templates", "carousel_template_line_items"],
      table_mapping: ["table1", "table2"],
      data: { table1: [], table2: [] }
    };
    this.update_json_schema = {
      action: ["update", "hard_delete", "insert"],
      table: ["carousel_templates", "carousel_template_line_items", "carousel_template_line_items"],
      table_mapping: ["table1", "table2", "table3"],
      data: { table1: [], table3: [] },
      conditions: {
        table1: [],
        table2: []
      }
    };
  }
  ngOnInit() {
    this.id = this.route.snapshot.params["id"] || null;
    this.initForm();
    this.fetchAllTables();
    if (!this.id) {
      this.editTitle = false;
    } else {
      this.editTitle = true;
      this.loadData(this.id);
    }
    this.titleChange();
  }
  // CarouselTemplate Component
  get itemsData() {
    return this.form.get("items").controls.map((control) => control.value);
  }
  // CarouselTemplate Component - onItemsDataChange
  onItemsDataChange(data) {
    const items = this.form.get("items");
    items.clear();
    const itemsToUse = !data || data.length === 0 ? this._originalItems : data;
    itemsToUse.forEach((item) => {
      items.push(this.fb.group({
        name: [item.name, Validators.required],
        description: [item.description],
        slug: [item.slug, Validators.required],
        image_url: [item.image_url],
        // Image URL for upload
        video_url: [item.video_url],
        clickable_link: [item.clickable_link],
        order_no: [item.order_no, [Validators.required, Validators.min(0)]]
      }));
    });
  }
  isLineItemFieldInvalid(fieldName) {
    const field = this.lineItemForm?.get(fieldName);
    return field ? field.invalid && (field.touched || this.submitted) : false;
  }
  // Handle Image Upload
  // Handle Image Upload
  onImageChange(event) {
    const file = event.target.files[0];
    if (file) {
      const reader = new FileReader();
      reader.onload = () => {
        this.lineItemForm.patchValue({
          image_url: reader.result
        });
        this.previewImageUrl = reader.result;
      };
      reader.readAsDataURL(file);
    }
  }
  onLineItemSubmit() {
    if (this.lineItemForm.valid) {
      const itemsArray = this.form.get("items");
      const formValue = this.lineItemForm.value;
      if (!this.previewImageUrl && formValue.image_url) {
        formValue.image_url = formValue.image_url;
      } else if (this.previewImageUrl) {
        formValue.image_url = this.previewImageUrl;
      }
      if (!formValue.image_url) {
        formValue.image_url = this.selectedItem.image_url;
      }
      if (this.editingItemIndex !== -1) {
        itemsArray.at(this.editingItemIndex).patchValue(formValue);
        this._originalItems[this.editingItemIndex] = __spreadValues(__spreadValues({}, this._originalItems[this.editingItemIndex]), formValue);
      } else {
        itemsArray.push(this.fb.group(formValue));
        this._originalItems.push(__spreadValues({}, formValue));
      }
      this.isItemModalOpen = false;
      this.cancelLineItemEdit();
    }
  }
  getLineItemErrorMessage(fieldName) {
    const field = this.lineItemForm.get(fieldName);
    if (field) {
      if (field.hasError("required")) {
        return "required_message";
      }
      if (field.hasError("maxlength")) {
        return `Maximum length exceeded (${field.errors?.["maxlength"].requiredLength} characters allowed)`;
      }
      if (field.hasError("min")) {
        return `Minimum value is ${field.errors?.["min"].min}`;
      }
    }
    return "";
  }
  // CarouselTemplate Component - Methods to handle Edit and Delete
  editLineItem(index) {
    this.previewImageUrl = null;
    this.selectedItem = index;
    this.editingItemIndex = this.itemsData.findIndex((i) => i === index);
    this.lineItemForm.patchValue(index);
    this.isItemModalOpen = true;
  }
  cancelLineItemEdit() {
    this.selectedItem = null;
    this.editingItemIndex = -1;
    this.lineItemForm.reset();
    this.isItemModalOpen = false;
  }
  removeLineItem(item) {
    const items = this.form.get("items");
    const index = items.controls.findIndex((control) => control.value.name === item.name);
    if (index !== -1) {
      items.removeAt(index);
      this._originalItems.splice(index, 1);
      this.toastr.success("Item removed successfully", "Success");
    } else {
      this.toastr.warning(`Item with name: ${item.name} not found.`, "Warning");
    }
  }
  isFieldInvalid(fieldName) {
    const field = this.form.get(fieldName);
    return field ? field.invalid && (field.touched || this.submitted) : false;
  }
  getErrorMessage(fieldName) {
    const field = this.form.get(fieldName);
    if (field) {
      if (field.hasError("required")) {
        return "required_message";
      }
      if (field.hasError("maxlength")) {
        return `Maximum length exceeded (${field.errors?.["maxlength"].requiredLength} characters allowed)`;
      }
      if (field.hasError("min")) {
        return `Minimum value is ${field.errors?.["min"].min}`;
      }
      if (field.hasError("viewMandatory")) {
        return '"view" option is mandatory';
      }
    }
    return "";
  }
  isItemFieldInvalid(index, fieldName) {
    const items = this.form.get("items");
    const field = items.at(index).get(fieldName);
    return field ? field.invalid && (field.touched || this.submitted) : false;
  }
  initForm() {
    this.form = this.fb.group({
      name: ["", [Validators.required, Validators.maxLength(100)]],
      slug: ["", [Validators.required, Validators.maxLength(100)]],
      description: [""],
      status_id: [1],
      items: this.fb.array([])
    });
    this.initLineItemForm();
  }
  initLineItemForm() {
    this.lineItemForm = this.fb.group({
      name: ["", [Validators.required, Validators.maxLength(255)]],
      description: [""],
      slug: ["", Validators.required],
      // For image upload
      image_url: [""],
      // For image upload
      video_url: [""],
      clickable_link: [""],
      order_no: ["", [Validators.required, Validators.min(0)]]
    });
  }
  initNewLineItem() {
    this.editingItemIndex = -1;
    this.selectedItem = {};
    this.lineItemForm.reset();
    this.isItemModalOpen = true;
    this.previewImageUrl = null;
  }
  toggleEmailProcessSlug(value) {
    this.showEmailProcessSlug = value;
  }
  titleChange() {
    const title = this.editTitle ? "Edit Carousel Template" : "Add Carousel Template";
    this.titleService.setTitle(title);
  }
  fetchAllTables() {
    this.gridApiService.getAllTables().subscribe((response) => {
      if (response.status && response.code === 200) {
        this.tables_list = response.data;
      }
    }, (error) => {
      this.toastr.error("Error fetching tables", "Error");
    });
  }
  loadData(id) {
    const params = {
      company_id: 1,
      print_query: true,
      primary_table: "carousel_templates",
      start_index: 0,
      limit_range: 1,
      sort_columns: [["carousel_templates.id", "desc"]],
      search_all: [
        {
          column_name: "carousel_templates.uuid",
          value: id,
          operator: "="
        }
      ],
      select_columns: [
        ["carousel_templates.*"],
        [
          "CASE WHEN COUNT(carousel_template_line_items.id) = 0 THEN null ELSE COALESCE(Json_agg(DISTINCT jsonb_build_object('slug',carousel_template_line_items.slug,'name', carousel_template_line_items.name, 'description', carousel_template_line_items.description, 'image_url', carousel_template_line_items.image_url, 'video_url', carousel_template_line_items.video_url, 'clickable_link', carousel_template_line_items.clickable_link, 'order_no', carousel_template_line_items.order_no))) END",
          "items"
        ]
      ],
      includes: [
        {
          table_name: "carousel_template_line_items",
          join_type: "LEFT",
          join_condition: `carousel_templates.id = carousel_template_line_items.carousel_template_id`
        }
      ],
      group_by: ["carousel_templates.id"]
    };
    this.gridApiService.getAllList(params).subscribe((response) => {
      if (response.status && response.code === 200) {
        const entity = response.data.records[0];
        this.form.patchValue({
          name: entity.name,
          slug: entity.slug,
          description: entity.description,
          status_id: entity.status_id
        });
        const lineItems = this.form.get("items");
        if (entity.items && entity.items.length > 0) {
          entity.items.forEach((item) => {
            this.previewImageUrl = item.image_url;
            lineItems.push(this.fb.group({
              slug: [item.slug, Validators.required],
              name: [item.name, Validators.required],
              description: [item.description],
              image_url: [item.image_url],
              // Image URL for upload
              video_url: [item.video_url],
              clickable_link: [item.clickable_link],
              order_no: [item.order_no, [Validators.required, Validators.min(0)]]
            }));
          });
        }
      }
    }, (error) => {
      this.toastr.error("Error loading carousel template data", "Error");
    });
  }
  onSubmit() {
    this.submitted = true;
    if (this.form.invalid) {
      return;
    }
    const formData = this.form.value;
    const payload = this.id ? this.getEditParams(formData, this.id) : this.getAddParams(formData);
    this.gridApiService.executeRecords(payload).subscribe((response) => {
      if (response.status && response.code === 200) {
        const successMessage = this.translate.instant(this.id ? "record_updated_successfully" : "record_inserted_successfully");
        this.toastr.success(successMessage);
        this.router.navigate([this.redirect_url]);
      } else {
        this.toastr.error(response.message, "Error");
      }
    }, (error) => {
      this.toastr.error("Error submitting form", "Error");
    });
  }
  getAddParams(formData) {
    const master = [
      {
        name: formData.name,
        slug: formData.slug,
        description: formData.description,
        status_id: formData.status_id
      }
    ];
    if (formData.items && formData.items.length > 0) {
      const items = formData.items.map((item) => ({
        carousel_template_id: "@table1.id",
        name: item.name,
        slug: item.slug,
        description: item.description,
        image_url: item.image_url,
        video_url: item.video_url,
        clickable_link: item.clickable_link,
        order_no: item.order_no
      }));
      this.insert_json_schema.data["table2"] = items;
    }
    this.insert_json_schema.data["table1"] = master;
    return this.insert_json_schema;
  }
  getEditParams(formData, id) {
    const master = [
      {
        name: formData.name,
        slug: formData.slug,
        description: formData.description,
        status_id: formData.status_id
      }
    ];
    this.update_json_schema.data["table1"] = master;
    this.update_json_schema.conditions["table1"] = [{ uuid: id }];
    this.update_json_schema.conditions["table2"] = [{ carousel_template_id: "@table1.id" }];
    if (formData.items && formData.items.length > 0) {
      const items = formData.items.map((item) => ({
        carousel_template_id: "@table1.id",
        name: item.name,
        slug: item.slug,
        description: item.description,
        image_url: item.image_url,
        video_url: item.video_url,
        clickable_link: item.clickable_link,
        order_no: item.order_no
      }));
      this.update_json_schema.data["table3"] = items;
    }
    return this.update_json_schema;
  }
};
_CarouselComponent.\u0275fac = function CarouselComponent_Factory(t) {
  return new (t || _CarouselComponent)(\u0275\u0275directiveInject(FormBuilder), \u0275\u0275directiveInject(GridApiService), \u0275\u0275directiveInject(ToastrService), \u0275\u0275directiveInject(ActivatedRoute), \u0275\u0275directiveInject(Router), \u0275\u0275directiveInject(Store), \u0275\u0275directiveInject(TranslateService), \u0275\u0275directiveInject(Title), \u0275\u0275directiveInject(Location));
};
_CarouselComponent.\u0275cmp = /* @__PURE__ */ \u0275\u0275defineComponent({ type: _CarouselComponent, selectors: [["app-carousel"]], viewQuery: function CarouselComponent_Query(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275viewQuery(_c0, 5);
  }
  if (rf & 2) {
    let _t;
    \u0275\u0275queryRefresh(_t = \u0275\u0275loadQuery()) && (ctx.monacoEditor = _t.first);
  }
}, standalone: true, features: [\u0275\u0275StandaloneFeature], decls: 42, vars: 46, consts: [[3, "formGroup"], [1, "panel"], [1, "flex", "flex-wrap", "justify-between"], [1, "text-md", "font-bold", "uppercase"], [1, "relative", "inline-flex", "align-middle"], ["appDynamicFontSize", "body", "type", "button", 1, "btn", "btn-danger", "mr-5", "ltr:rounded-r", "rtl:rounded-l", 3, "click"], ["appDynamicFontSize", "body", "type", "button", 1, "btn", "btn-outline-secondary", "ltr:rounded-r", "rtl:rounded-l", 3, "click", "disabled"], [1, "my-3", "border-[#e0e6ed]", "dark:border-[#1b2e4b]"], [1, "mt-2"], [1, "flex", "flex-col", "justify-between"], [1, "grid", "grid-cols-1", "gap-2", "sm:grid-cols-2"], [1, "mt-0"], ["for", "name", 1, "required-mark", "mb-2", "block", "font-medium"], ["id", "name", "type", "text", "formControlName", "name", 1, "form-input", "w-full", 3, "placeholder", "ngClass"], ["class", "invalid-feedback mt-1 text-danger", 4, "ngIf"], ["for", "slug", 1, "required-mark", "mb-2", "block", "font-medium"], ["id", "slug", "type", "text", "formControlName", "slug", 1, "form-input", "w-full", 3, "placeholder", "ngClass"], ["for", "description", 1, "required-mark", "mb-2", "block", "font-medium"], ["id", "description", "type", "text", "formControlName", "description", 1, "form-input", "w-full", 3, "placeholder", "ngClass"], [1, "panel", "mt-5"], [3, "dataChange", "data", "config"], ["class", "fixed inset-0 z-50 overflow-y-auto", 4, "ngIf"], [1, "invalid-feedback", "mt-1", "text-danger"], [1, "fixed", "inset-0", "z-50", "overflow-y-auto"], [1, "fixed", "inset-0", "bg-black/50", "transition-opacity", "dark:bg-black/70"], [1, "flex", "min-h-screen", "items-center", "justify-center", "p-2", "sm:p-4"], [1, "relative", "w-full", "max-w-4xl", "transform", "overflow-hidden", "rounded-lg", "bg-white", "shadow-xl", "transition-all", "dark:border", "dark:border-gray-700", "dark:bg-gray-800"], [1, "border-b", "bg-gray-50", "px-4", "py-3", "dark:border-gray-700", "dark:bg-gray-900", "sm:px-6"], [1, "flex", "items-center", "justify-between"], [1, "text-base", "font-medium", "text-gray-900", "dark:text-gray-100", "sm:text-lg"], ["type", "button", 1, "rounded-md", "p-2", "text-gray-400", "hover:text-gray-900", "focus:outline-none", "focus:ring-2", "focus:ring-blue-500", "dark:hover:text-gray-100", 3, "click"], [1, "sr-only"], [1, "fa-solid", "fa-xmark"], [1, "px-4", "py-4", "sm:px-6"], [1, "space-y-6", 3, "ngSubmit", "formGroup"], [1, "grid", "grid-cols-1", "gap-x-4", "gap-y-6", "sm:grid-cols-2", "lg:grid-cols-3"], [1, "col-span-1"], ["for", "name", 1, "required-mark", "form-label"], [1, "mt-1"], ["id", "name", "type", "text", "formControlName", "name", 1, "form-input", "w-full", 3, "ngClass"], ["class", "mt-1 text-sm text-red-600 dark:text-red-400", 4, "ngIf"], ["for", "description", 1, "form-label"], ["id", "description", "type", "text", "formControlName", "description", 1, "form-input", "w-full"], ["for", "slug", 1, "required-mark", "form-label"], ["id", "slug", "type", "text", "formControlName", "slug", 1, "form-input", "w-full", 3, "ngClass"], ["for", "order_no", 1, "required-mark", "form-label"], ["id", "order_no", "type", "number", "formControlName", "order_no", 1, "form-input", "w-full"], ["for", "image_url", 1, "form-label"], ["id", "image_url", "type", "file", "accept", "image/*", 1, "form-input", "w-full", 3, "change"], ["class", "mt-2", 4, "ngIf"], ["for", "video_url", 1, "form-label"], ["id", "video_url", "type", "text", "formControlName", "video_url", 1, "form-input", "w-full"], ["for", "clickable_link", 1, "form-label"], ["id", "clickable_link", "type", "text", "formControlName", "clickable_link", 1, "form-input", "w-full"], [1, "sticky", "bottom-0", "flex", "justify-end", "space-x-4", "border-t", "border-gray-200", "bg-white", "px-4", "py-3", "dark:border-gray-700", "dark:bg-gray-800"], ["type", "button", 1, "btn", "rounded-md", "border", "border-gray-300", "bg-white", "px-4", "py-2", "text-sm", "font-medium", "text-gray-700", "shadow-sm", "hover:bg-gray-50", "focus:outline-none", "focus:ring-2", "focus:ring-blue-500", "dark:border-gray-600", "dark:bg-gray-700", "dark:text-gray-300", "dark:hover:bg-gray-600", 3, "click"], ["type", "submit", 1, "btn", "rounded-md", "bg-blue-600", "px-4", "py-2", "text-sm", "font-medium", "text-white", "shadow-sm", "hover:bg-blue-700", "focus:outline-none", "focus:ring-2", "focus:ring-blue-500", "dark:bg-blue-700", "dark:hover:bg-blue-600", 3, "disabled"], [1, "mt-1", "text-sm", "text-red-600", "dark:text-red-400"], ["for", "image_preview", 1, "form-label"], ["alt", "Image Preview", 1, "mt-2", "h-32", "w-32", "object-cover", 3, "src"]], template: function CarouselComponent_Template(rf, ctx) {
  if (rf & 1) {
    \u0275\u0275elementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "div", 3);
    \u0275\u0275text(4);
    \u0275\u0275pipe(5, "translate");
    \u0275\u0275pipe(6, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(7, "div", 4)(8, "button", 5);
    \u0275\u0275listener("click", function CarouselComponent_Template_button_click_8_listener() {
      return ctx.location.back();
    });
    \u0275\u0275text(9);
    \u0275\u0275pipe(10, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(11, "button", 6);
    \u0275\u0275listener("click", function CarouselComponent_Template_button_click_11_listener() {
      return ctx.onSubmit();
    });
    \u0275\u0275text(12);
    \u0275\u0275pipe(13, "translate");
    \u0275\u0275elementEnd()()();
    \u0275\u0275element(14, "hr", 7);
    \u0275\u0275elementStart(15, "div", 8)(16, "div", 9)(17, "div", 10)(18, "div", 11)(19, "label", 12);
    \u0275\u0275text(20);
    \u0275\u0275pipe(21, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275element(22, "input", 13);
    \u0275\u0275pipe(23, "translate");
    \u0275\u0275template(24, CarouselComponent_div_24_Template, 2, 1, "div", 14);
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(25, "div", 11)(26, "label", 15);
    \u0275\u0275text(27);
    \u0275\u0275pipe(28, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275element(29, "input", 16);
    \u0275\u0275pipe(30, "translate");
    \u0275\u0275template(31, CarouselComponent_div_31_Template, 2, 1, "div", 14);
    \u0275\u0275elementEnd();
    \u0275\u0275elementStart(32, "div", 11)(33, "label", 17);
    \u0275\u0275text(34);
    \u0275\u0275pipe(35, "translate");
    \u0275\u0275elementEnd();
    \u0275\u0275element(36, "input", 18);
    \u0275\u0275pipe(37, "translate");
    \u0275\u0275template(38, CarouselComponent_div_38_Template, 2, 1, "div", 14);
    \u0275\u0275elementEnd()()()()();
    \u0275\u0275elementStart(39, "div", 19)(40, "app-client-datatable", 20);
    \u0275\u0275listener("dataChange", function CarouselComponent_Template_app_client_datatable_dataChange_40_listener($event) {
      return ctx.onItemsDataChange($event);
    });
    \u0275\u0275elementEnd()()();
    \u0275\u0275template(41, CarouselComponent_div_41_Template, 70, 45, "div", 21);
  }
  if (rf & 2) {
    \u0275\u0275property("formGroup", ctx.form);
    \u0275\u0275advance(4);
    \u0275\u0275textInterpolate1(" ", ctx.editTitle ? \u0275\u0275pipeBind1(5, 20, "title_edit_carousel_template") : \u0275\u0275pipeBind1(6, 22, "title_add_carousel_template"), " ");
    \u0275\u0275advance(5);
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(10, 24, "back"), " ");
    \u0275\u0275advance(2);
    \u0275\u0275property("disabled", ctx.form.invalid);
    \u0275\u0275advance();
    \u0275\u0275textInterpolate1(" ", \u0275\u0275pipeBind1(13, 26, "submit"), " ");
    \u0275\u0275advance(8);
    \u0275\u0275textInterpolate(\u0275\u0275pipeBind1(21, 28, "form_label_name"));
    \u0275\u0275advance(2);
    \u0275\u0275propertyInterpolate("placeholder", \u0275\u0275pipeBind1(23, 30, "form_label_name_placeholder"));
    \u0275\u0275property("ngClass", \u0275\u0275pureFunction1(40, _c1, ctx.isFieldInvalid("name")));
    \u0275\u0275advance(2);
    \u0275\u0275property("ngIf", ctx.isFieldInvalid("name"));
    \u0275\u0275advance(3);
    \u0275\u0275textInterpolate(\u0275\u0275pipeBind1(28, 32, "form_label_slug"));
    \u0275\u0275advance(2);
    \u0275\u0275propertyInterpolate("placeholder", \u0275\u0275pipeBind1(30, 34, "form_label_slug_placeholder"));
    \u0275\u0275property("ngClass", \u0275\u0275pureFunction1(42, _c1, ctx.isFieldInvalid("slug")));
    \u0275\u0275advance(2);
    \u0275\u0275property("ngIf", ctx.isFieldInvalid("slug"));
    \u0275\u0275advance(3);
    \u0275\u0275textInterpolate(\u0275\u0275pipeBind1(35, 36, "form_label_description"));
    \u0275\u0275advance(2);
    \u0275\u0275propertyInterpolate("placeholder", \u0275\u0275pipeBind1(37, 38, "form_label_description_placeholder"));
    \u0275\u0275property("ngClass", \u0275\u0275pureFunction1(44, _c1, ctx.isFieldInvalid("description")));
    \u0275\u0275advance(2);
    \u0275\u0275property("ngIf", ctx.isFieldInvalid("description"));
    \u0275\u0275advance(2);
    \u0275\u0275property("data", ctx.itemsData)("config", ctx.itemsTableConfig);
    \u0275\u0275advance();
    \u0275\u0275property("ngIf", ctx.isItemModalOpen);
  }
}, dependencies: [CommonSharedModule, NgClass, NgIf, \u0275NgNoValidate, DefaultValueAccessor, NumberValueAccessor, NgControlStatus, NgControlStatusGroup, DynamicFontSizeDirective, TranslatePipe, MonacoEditorModule, ReactiveFormsModule, FormGroupDirective, FormControlName, ClientDatatableComponent], data: { animation: [
  trigger("toggleAnimation", [
    transition(":enter", [style({ opacity: 0, transform: "scale(0.95)" }), animate("100ms ease-out", style({ opacity: 1, transform: "scale(1)" }))]),
    transition(":leave", [animate("75ms", style({ opacity: 0, transform: "scale(0.95)" }))])
  ])
] } });
var CarouselComponent = _CarouselComponent;
(() => {
  (typeof ngDevMode === "undefined" || ngDevMode) && \u0275setClassDebugInfo(CarouselComponent, { className: "CarouselComponent", filePath: "src\\app\\@lcp-framework\\pages\\carousel\\carousel.component.ts", lineNumber: 31 });
})();
export {
  CarouselComponent
};
//# sourceMappingURL=chunk-Q6R6G37K.js.map
