import { h, Build, } from "@stencil/core";
import state from "../../../store";
import getStatusOptions from "../../../helpers/getStatusOptions";
import isAdmin from "../../../helpers/auth/isAdmin";
import isInternalTeam from "../../../helpers/auth/isInternalTeam";
import getInvoiceTypes from "../../../helpers/getInvoiceTypes";
export class AppJobList {
  constructor() {
    this.user = {};
    this.jobs = [];
    this.selectedIds = [];
    this.selectedJobs = [];
    this.selectAll = false;
    this.fetchData = {};
    this.showMap = false;
  }
  onSearchInput(event) {
    this.query = event.target.value;
  }
  async onSuccess(event) {
    var _a, _b;
    if (["addJob", "editJob"].includes((_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.endpoint))
      setTimeout(() => this.paginationEl.getResults(), 200);
    if (((_b = event === null || event === void 0 ? void 0 : event.detail) === null || _b === void 0 ? void 0 : _b.endpoint) !== "listJobs")
      return;
    setTimeout(() => {
      var _a;
      this.jobs = ((_a = this.paginationEl) === null || _a === void 0 ? void 0 : _a.results) || [];
    }, 200);
  }
  toggleSelect(event, job) {
    event.stopPropagation();
    event.preventDefault();
    this.selectedJobs = this.selectedJobs.includes(job)
      ? this.selectedJobs.filter((selectedJob) => job.id !== selectedJob.id)
      : [...new Set([...this.selectedJobs, job])];
    this.selectedIds = this.selectedIds.includes(job.id)
      ? this.selectedIds.filter((selectedId) => job.id !== selectedId)
      : [...new Set([...this.selectedIds, job.id])];
  }
  toggleSelectAll() {
    var _a, _b, _c;
    if ((_a = this.selectedIds) === null || _a === void 0 ? void 0 : _a.length) {
      this.selectedJobs = [];
      this.selectedIds = [];
      this.selectAll = false;
    }
    else {
      if ((_c = (_b = this.paginationEl) === null || _b === void 0 ? void 0 : _b.results) === null || _c === void 0 ? void 0 : _c.length) {
        this.selectedJobs = this.paginationEl.results;
        this.selectedIds = this.paginationEl.results.map((result) => result.id);
      }
    }
  }
  componentWillLoad() {
    var _a, _b, _c, _d, _e;
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return;
    const filter = (_a = state === null || state === void 0 ? void 0 : state.filters) === null || _a === void 0 ? void 0 : _a[location === null || location === void 0 ? void 0 : location.pathname];
    this.fetchData = {
      status: (filter === null || filter === void 0 ? void 0 : filter.status) ||
        (this.userId
          ? null
          : [
            "book",
            "evaluate",
            "claim",
            "mitigate",
            "monitor",
            "review",
            "imported",
          ]),
      locationId: (filter === null || filter === void 0 ? void 0 : filter.locationId) ||
        (this.userId
          ? null
          : ((_b = state === null || state === void 0 ? void 0 : state.claims) === null || _b === void 0 ? void 0 : _b.locationId) || ((_d = (_c = state === null || state === void 0 ? void 0 : state.profile) === null || _c === void 0 ? void 0 : _c.location) === null || _d === void 0 ? void 0 : _d.id)),
      userId: this.userId
        ? this.userId
        : isInternalTeam()
          ? null
          : (_e = state === null || state === void 0 ? void 0 : state.session) === null || _e === void 0 ? void 0 : _e.uid,
      serviceTypes: null,
      // tags: filter?.tags || null,
    };
  }
  render() {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
    const markers = (((_a = this.jobs) === null || _a === void 0 ? void 0 : _a.length) ? this.jobs : []).map((job) => {
      var _a, _b;
      return ({
        payload: { job },
        name: job === null || job === void 0 ? void 0 : job.title,
        icon: null,
        position: {
          lat: (_a = job === null || job === void 0 ? void 0 : job.address) === null || _a === void 0 ? void 0 : _a.lat,
          lng: (_b = job === null || job === void 0 ? void 0 : job.address) === null || _b === void 0 ? void 0 : _b.lng,
        },
      });
    });
    return [
      h("ion-content", { class: "truck-background" }, this.showMap && (h("fireenjin-map", { googleMapsKey: (_c = (_b = state === null || state === void 0 ? void 0 : state.config) === null || _b === void 0 ? void 0 : _b.firebase) === null || _c === void 0 ? void 0 : _c.apiKey, ref: (el) => (this.mapEl = el), markers: markers })), h("div", { style: {
          display: "flex",
          alignItems: "center",
          background: `linear-gradient(0deg, rgba(255, 255, 255,0) 37%, rgba(255, 255, 255,0.2) 92%)`,
        }, class: "ion-padding" }, h("fireenjin-search-bar", { style: {
          width: "100%",
        }, paginationEl: this.paginationEl, filters: [
          {
            name: "status",
            label: "Status",
            icon: "help-circle",
            multiple: true,
            options: getStatusOptions(),
            value: (_d = this.fetchData) === null || _d === void 0 ? void 0 : _d.status,
          },
          {
            name: "serviceTypes",
            label: "Type",
            icon: "reader",
            multiple: true,
            options: getInvoiceTypes(),
            value: (_e = this.fetchData) === null || _e === void 0 ? void 0 : _e.serviceTypes,
          },
          // {
          //   name: "tags",
          //   label: "Tags",
          //   icon: "pricetags",
          //   multiple: true,
          //   value: filter?.tags,
          //   options: [
          //     {
          //       label: "Imported",
          //       value: "imported",
          //     },
          //   ],
          // },
          ...(isAdmin()
            ? [
              {
                name: "locationId",
                label: "Location",
                icon: "business",
                options: ((_f = state === null || state === void 0 ? void 0 : state.locations) === null || _f === void 0 ? void 0 : _f.length)
                  ? state.locations.map((location) => ({
                    label: location.name,
                    value: location.id,
                  }))
                  : [],
                value: ((_g = this.fetchData) === null || _g === void 0 ? void 0 : _g.locationId) ||
                  (((_h = state === null || state === void 0 ? void 0 : state.claims) === null || _h === void 0 ? void 0 : _h.tester) && ((_k = (_j = state === null || state === void 0 ? void 0 : state.profile) === null || _j === void 0 ? void 0 : _j.location) === null || _k === void 0 ? void 0 : _k.id)
                    ? state.profile.location.id
                    : null),
              },
            ]
            : []),
        ] }), h("ion-button", { fill: "clear", onClick: () => (this.showMap = !this.showMap) }, h("ion-icon", { slot: "icon-only", name: "map" }))), h("fireenjin-pagination", { ref: (el) => (this.paginationEl = el), disableVirtualScroll: true, listEl: ({ result: job }) => (h("floodteam-item-job", { job: job })), endpoint: "listJobs", limit: 20, disableFetch: !((_l = state === null || state === void 0 ? void 0 : state.session) === null || _l === void 0 ? void 0 : _l.uid), fetchParams: { withPayables: true }, fetchData: this.fetchData, resultsKey: "jobs", query: this.query, removeDuplicates: true, name: "jobs" })),
      h("floodteam-navigation-footer", null, h("floodteam-title-bar", { disableUnderline: true, back: "/dashboard" }, h("ion-breadcrumbs", null, h("ion-breadcrumb", { href: "/jobs" }, h("ion-icon", { class: "ft-icon-style", slot: "start", name: "water" }), "Jobs")), h("ion-buttons", { slot: "end" }, isAdmin() && (h("ion-button", { title: "Import CSV", onClick: () => this.fireenjinTrigger.emit({
          name: "import",
          type: "jobs",
        }) }, h("ion-icon", { slot: "icon-only", name: "cloud-upload" }))), isAdmin() && (h("ion-button", { title: "Export CSV", onClick: () => {
          this.fireenjinTrigger.emit({
            name: "export",
            payload: (this.jobs || []).map((job) => {
              var _a;
              return ({
                id: (job === null || job === void 0 ? void 0 : job.id) || null,
                title: (job === null || job === void 0 ? void 0 : job.title) || null,
                address: ((_a = job === null || job === void 0 ? void 0 : job.address) === null || _a === void 0 ? void 0 : _a.full) || null,
              });
            }),
          });
        } }, h("ion-icon", { slot: "icon-only", name: "cloud-download" }))), h("ion-button", { slot: "end", fill: "solid", color: "primary", href: "/jobs/refer" }, "Add")))),
    ];
  }
  static get is() { return "app-job-list"; }
  static get originalStyleUrls() {
    return {
      "$": ["app-job-list.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["app-job-list.css"]
    };
  }
  static get properties() {
    return {
      "userId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "user-id",
        "reflect": false
      }
    };
  }
  static get states() {
    return {
      "user": {},
      "jobs": {},
      "query": {},
      "paginationEl": {},
      "selectedIds": {},
      "selectedJobs": {},
      "selectAll": {},
      "fetchData": {},
      "showMap": {}
    };
  }
  static get events() {
    return [{
        "method": "fireenjinTrigger",
        "name": "fireenjinTrigger",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": ""
        },
        "complexType": {
          "original": "FireEnjinTriggerInput",
          "resolved": "FireEnjinTriggerInput",
          "references": {
            "FireEnjinTriggerInput": {
              "location": "import",
              "path": "@fireenjin/sdk"
            }
          }
        }
      }];
  }
  static get listeners() {
    return [{
        "name": "ionInput",
        "method": "onSearchInput",
        "target": undefined,
        "capture": false,
        "passive": false
      }, {
        "name": "fireenjinSuccess",
        "method": "onSuccess",
        "target": "body",
        "capture": false,
        "passive": false
      }];
  }
}
