import { r as registerInstance, d as createEvent, B as Build, h } from './index-33e43734.js';
import { s as state } from './store-729235b6.js';
import './index-91eb4513.js';
import './getCache-f7c123d8.js';
import './_commonjsHelpers-cca61ea8.js';
import './logic-2eecfe1e.js';
import './index-964da72a.js';

const modalPayCalculatorCss = "modal-pay-calculator floodteam-graph,modal-pay-calculator floodteam-graph canvas{display:table-cell;min-width:150px;min-height:150px;margin:auto}";

let ModalPayCalculator = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.floodteamCloseModal = createEvent(this, "floodteamCloseModal", 7);
    this.fireenjinFetch = createEvent(this, "fireenjinFetch", 7);
    this.colors = ["#3e95cd", "#8e5ea2", "#3cba9f", "#e8c3b9", "#c45850"];
    this.payModels = [];
    this.amount = 0;
    this.disableAmount = false;
    this.disableReferral = false;
    this.hasReferral = false;
    this.payables = [];
    this.totalPercentage = 0;
  }
  onChange(event) {
    var _a;
    if (event.target.name === "payModelId") {
      this.payModelId = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value;
      this.selectedPayModel = this.payModels.find((payModel) => payModel.id === this.payModelId);
      console.log(event, this.payModels, this.selectedPayModel);
    }
    else if (event.target.name === "received") {
      this.amount = event.target.value;
    }
    else if (event.target.name === "referral") {
      this.hasReferral = event.target.checked;
    }
    this.calculatePayables();
  }
  onSuccess(event) {
    var _a, _b, _c, _d, _e, _f;
    if (((_a = event === null || event === void 0 ? void 0 : event.detail) === null || _a === void 0 ? void 0 : _a.endpoint) === "findJob") {
      this.hasReferral = !!((_c = (_b = state === null || state === void 0 ? void 0 : state.job) === null || _b === void 0 ? void 0 : _b.referral) === null || _c === void 0 ? void 0 : _c.id);
    }
    else if (((_d = event === null || event === void 0 ? void 0 : event.detail) === null || _d === void 0 ? void 0 : _d.endpoint) === "listPayModels") {
      this.payModels = ((_f = (_e = event === null || event === void 0 ? void 0 : event.detail) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.payModels)
        ? event.detail.data.payModels
        : [];
      if (this.payModelId) {
        this.selectedPayModel = this.payModels.find((payModel) => payModel.id === this.payModelId);
        console.log(this.selectedPayModel);
        this.calculatePayables();
      }
    }
  }
  onReset() {
    this.floodteamCloseModal.emit({});
  }
  onSubmit() {
    this.floodteamCloseModal.emit({});
  }
  formatUSD(amount) {
    const formatter = new Intl.NumberFormat("en-US", {
      style: "currency",
      currency: "USD",
      minimumFractionDigits: 2,
    });
    return formatter.format(amount ? amount : 0);
  }
  calculatePayables() {
    if (!this.selectedPayModel)
      return;
    let totalPercentage = 0;
    this.payables = this.selectedPayModel.payouts.map((payout, index) => {
      var _a;
      const percentage = this.hasReferral && ((_a = payout === null || payout === void 0 ? void 0 : payout.percentages) === null || _a === void 0 ? void 0 : _a.hasReferral)
        ? payout.percentages.hasReferral
        : payout.percentages.default;
      totalPercentage += percentage;
      return {
        percentage,
        role: payout === null || payout === void 0 ? void 0 : payout.role,
        amount: percentage * this.amount,
        color: this.mixColor(this.colors, index),
      };
    });
    this.totalPercentage = totalPercentage;
  }
  shadeColor(col, amt) {
    let usePound = false;
    if (col[0] === "#") {
      col = col.slice(1);
      usePound = true;
    }
    const num = parseInt(col, 16);
    let r = (num >> 16) + amt;
    if (r > 255) {
      r = 255;
    }
    else if (r < 0) {
      r = 0;
    }
    let b = ((num >> 8) & 0x00ff) + amt;
    if (b > 255) {
      b = 255;
    }
    else if (b < 0) {
      b = 0;
    }
    let g = (num & 0x0000ff) + amt;
    if (g > 255) {
      g = 255;
    }
    else if (g < 0) {
      g = 0;
    }
    return (usePound ? "#" : "") + (g | (b << 8) | (r << 16)).toString(16);
  }
  mixColor(colorPallet, index) {
    if (colorPallet[index]) {
      return colorPallet[index];
    }
    else {
      const goesInto = Math.floor(index / colorPallet.length);
      const darkenPercent = goesInto * 30;
      const colorIndex = index - goesInto * colorPallet.length;
      return this.shadeColor(colorPallet[colorIndex], darkenPercent);
    }
  }
  async fetchData() {
    this.fireenjinFetch.emit({
      endpoint: "findJob",
      params: {
        id: this.jobId,
        withPayments: true,
        withUsers: true,
        withSites: false,
        withPayModel: true,
        withPhotos: true,
        withPayables: false,
        withReadings: false,
      },
    });
  }
  componentDidLoad() {
    var _a;
    if (!(Build === null || Build === void 0 ? void 0 : Build.isBrowser))
      return;
    if (((_a = this.payModels) === null || _a === void 0 ? void 0 : _a.length) && this.payModelId) {
      this.selectedPayModel = this.payModels[this.payModelId];
      setTimeout(() => {
        this.calculatePayables();
      }, 200);
    }
  }
  render() {
    return (h("ion-content", { class: "ion-padding" }, h("fireenjin-form", { submitButton: "Approve Payables", endpoint: "generatePayables" }, h("ion-grid", null, h("ion-row", null, h("ion-col", { size: "12", sizeMd: "7" }, h("ion-grid", null, h("ion-row", null, h("ion-col", null, h("fireenjin-input", { disabled: !!this.disableAmount, name: "received", label: "Amount Received", type: "tel", value: this.amount })), h("ion-col", null, h("fireenjin-select", { label: "Pay Model", name: "payModelId", endpoint: "listPayModels", resultsKey: "payModels", limit: 100, value: this.payModelId })), h("ion-col", null, h("ion-item", null, h("ion-label", null, "Has Referral"), h("ion-toggle", { name: "referral", disabled: this.disableReferral, checked: this.hasReferral }))), h("ion-col", { class: "graph-col" }, h("fireenjin-graph", { type: "pie", datasets: [
        {
          backgroundColor: this.payables.map((payable) => payable.color),
          data: this.payables.map((payable) => payable.amount),
        },
      ] }))))), h("ion-col", { size: "12", sizeMd: "5" }, h("ion-list", null, this.payables.map((payable) => {
      var _a;
      return (h("ion-item", null, h("ion-label", null, h("h2", null, ((_a = payable === null || payable === void 0 ? void 0 : payable.role) === null || _a === void 0 ? void 0 : _a.name)
        ? payable.role.name
        : "No Role Name..."), h("p", { style: {
          color: payable.color,
        } }, h("b", null, this.formatUSD(payable.amount)), " @", " ", payable.percentage * 100, " %")), h("ion-badge", { color: "success" })));
    }))))))));
  }
};
ModalPayCalculator.style = modalPayCalculatorCss;

export { ModalPayCalculator as modal_pay_calculator };

//# sourceMappingURL=modal-pay-calculator.entry.js.map