import { r as registerInstance, d as createEvent, B as Build, h } from './index-33e43734.js';
import { t as toastController, p as popoverController } from './overlays-85a0d940.js';
import { s as state } from './store-97abe726.js';
import './ionic-global-bd76bde2.js';
import './helpers-7e937ffa.js';
import './index-91eb4513.js';
import './getCache-f7c123d8.js';
import './_commonjsHelpers-4ed75ef8.js';
import './logic-88140d62.js';
import './index-964da72a.js';

const modalSearchUsersCss = "modal-search-users .banner{background-color:var(--ion-color-secondary)}modal-search-users h1{color:#fff}modal-search-users p{margin:0 0 15px 0;color:rgba(255, 255, 255, 0.8);font-weight:normal}@media only screen and (max-width: 800px){.modal-search-users{--width:100%;--max-width:auto}}";

let ModalSearchUsers = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.floodteamCloseModal = createEvent(this, "floodteamCloseModal", 7);
    this.fireenjinFetch = createEvent(this, "fireenjinFetch", 7);
    var _a, _b;
    this.steps = ["search", "team", "recent"];
    this.heading = "Search or Add User";
    this.payModels = [];
    this.team = [];
    this.loading = false;
    this.fetchData = {
      locationId: (_b = (_a = state === null || state === void 0 ? void 0 : state.profile) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.id,
    };
    this.selectedIds = [];
  }
  onReset(event) {
    var _a;
    if (((_a = event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "editJob") {
      const modalEl = document.querySelector("ion-modal.modal-edit-job");
      if (modalEl === null || modalEl === void 0 ? void 0 : modalEl.dismiss) {
        modalEl.dismiss();
      }
    }
  }
  async onSuccess(event) {
    var _a, _b, _c, _d;
    if (((_a = event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "editJob") {
      const photoCarouselModalEl = document.querySelector("ion-modal.modal-edit-job");
      if (photoCarouselModalEl === null || photoCarouselModalEl === void 0 ? void 0 : photoCarouselModalEl.dismiss) {
        await photoCarouselModalEl.dismiss();
        this.presentToast();
      }
    }
    else if (((_b = event.detail) === null || _b === void 0 ? void 0 : _b.endpoint) === "listUsers") {
      this.team = ((_d = (_c = event.detail) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.users) ? event.detail.data.users : [];
    }
  }
  onTabClick(tabName) {
    console.log(tabName);
  }
  async presentToast() {
    const toast = await toastController.create({
      message: `Job has been edited successfully!`,
      duration: 2000,
    });
    toast.present();
  }
  toggleSelect(event, user) {
    event.stopPropagation();
    event.preventDefault();
    this.selectedIds = this.selectedIds.includes(user.id)
      ? this.selectedIds.filter((selectedId) => user.id !== selectedId)
      : [...new Set([...this.selectedIds, user.id])];
  }
  async openPopover(event, user) {
    event.preventDefault();
    event.stopPropagation();
    const popover = await popoverController.create({
      component: "popover-user",
      cssClass: "popover-user-wrapper",
      componentProps: { user },
      event,
    });
    return await popover.present();
  }
  async save() {
    var _a, _b;
    if (!((_a = this.selectedIds) === null || _a === void 0 ? void 0 : _a.length))
      return;
    this.loading = true;
    for (const userId of this.selectedIds) {
      this.fireenjinFetch.emit({
        endpoint: "addUserToJob",
        params: {
          data: {
            userId,
            jobId: (_b = this.job) === null || _b === void 0 ? void 0 : _b.id,
          },
        },
      });
    }
    this.loading = false;
    this.floodteamCloseModal.emit();
  }
  componentDidLoad() {
    var _a, _b;
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return;
    this.fireenjinFetch.emit({
      endpoint: "listUsers",
      params: {
        data: {
          locationId: (_b = (_a = state === null || state === void 0 ? void 0 : state.profile) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.id,
          limit: 15,
          type: "staff",
        },
      },
    });
  }
  render() {
    var _a, _b;
    return [
      h("ion-header", null, h("ion-toolbar", null, h("ion-title", null, this.heading), h("ion-buttons", { slot: "end" }, h("ion-button", { onClick: () => this.save(), color: "primary", fill: "solid" }, "Save"), h("ion-button", { onClick: () => this.floodteamCloseModal.emit() }, h("ion-icon", { slot: "icon-only", name: "close-circle-outline" }))))),
      h("ion-content", { class: { "ion-padding": true, "is-loading": this.loading } }, h("fireenjin-search-bar", { ref: (el) => (this.filterBarEl = el), paginationEl: this.paginationEl, filters: [
          {
            name: "tags",
            label: "Tags",
            icon: "pricetags",
            multiple: true,
            options: [
              {
                label: "Imported",
                value: "imported",
              },
              {
                label: "Referral",
                value: "referral",
              },
              {
                label: "Plumber",
                value: "plumber",
              },
              {
                label: "Staff",
                value: "staff",
              },
              {
                label: "Agent",
                value: "agent",
              },
              {
                label: "Property Manager",
                value: "property manager",
              },
              {
                label: "PEU",
                value: "peu",
              },
              {
                label: "CSV Import",
                value: "csvImport",
              },
            ],
          },
          {
            name: "locationId",
            label: "Location",
            icon: "business",
            options: [
              ...((state === null || state === void 0 ? void 0 : state.locations)
                ? state.locations.map((location) => ({
                  label: location.name,
                  value: location.id,
                }))
                : []),
              {
                label: "On Job",
                value: null,
              },
            ],
            value: (_b = (_a = state === null || state === void 0 ? void 0 : state.profile) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.id,
          },
        ] }), h("fireenjin-pagination", { display: "list", ref: (el) => (this.paginationEl = el), disableVirtualScroll: true, listEl: ({ result: user }) => (h("ion-item", null, h("ion-checkbox", { slot: "start", checked: this.selectedIds.includes(user.id), onClick: (event) => this.toggleSelect(event, user) }), h("fireenjin-avatar", { src: user.photo, style: { marginRight: "15px" }, initials: `${(user === null || user === void 0 ? void 0 : user.firstName) ? user.firstName.charAt(0) : ""}${(user === null || user === void 0 ? void 0 : user.lastName) ? user.lastName.charAt(0) : ""}` }), h("ion-label", null, h("h4", null, (user === null || user === void 0 ? void 0 : user.firstName) || "", " ", (user === null || user === void 0 ? void 0 : user.lastName) || ""), (user === null || user === void 0 ? void 0 : user.tags)
          ? user.tags.map((tag) => h("ion-chip", null, tag))
          : null), h("ion-button", { fill: "clear", slot: "end", color: "medium", onClick: (event) => this.openPopover(event, user) }, h("ion-icon", { name: "ellipsis-vertical", slot: "icon-only" })))), endpoint: "listUsers", fetchData: this.fetchData, limit: 24, resultsKey: "users", removeDuplicates: true })),
    ];
  }
};
ModalSearchUsers.style = modalSearchUsersCss;

export { ModalSearchUsers as modal_search_users };

//# sourceMappingURL=modal-search-users.entry.js.map