(function (paw, utils) {
  function PawEmployeeList(
    finder,
    $filtersHolder,
    $datagridHolder,
    settings,
    localization
  ) {
    this.finder = finder;
    this.$filtersHolder = $filtersHolder;
    this.$datagridHolder = $datagridHolder;
    this.data = null;

    this.gridDraw = -1;

    this.settings = paw.lang.append(
      {
        gridUrl: undefined,
        subjectSearchUrl: undefined,
        employeeFilterDataUrl: undefined,
      },
      settings || {}
    );
    this.localization = paw.lang.append(
      {
        title: "@Loc.Title",
        search: "@Loc.SearchFilter",
        searchPlaceholder: "@Loc.SearchPlaceholder",
        address: "@Loc.Address",
        all: "@Loc.All",
        dateFrom: "@Loc.DateFrom",
        dateTo: "@Loc.DateTo",
        dateFormat: "@Loc.DateFormat",
        fullName: "@Loc.DateFormat",
        worker: "@Loc.DateFormat",
        job: "@Loc.DateFormat",
        address: "@Loc.DateFormat",
        post: "@Loc.DateFormat",
        tax: "@Loc.DateFormat",
        regNo: "@Loc.DateFormat",
        active: "@Loc.DateFormat",
        employmentStatuses: "@Loc.EmploymentStatuses",
        workingPlaces: "@Loc.WorkingPlaces",
      },
      localization || {}
    );

    this.classifications = [];
    this.selectedSubject = null;
    this.filterData = null;
    this.fetchMethod = "GET";
    this.fixedColumns = 2;
  }

  PawEmployeeList.prototype.ajax = function (url) {
    var self = this;
    return {
      method: "GET",
      url: url,
      data: function (d) {
        self.gridDraw = d.draw;
        return self.datagridFilters(d);
      },
      dataSrc: function (json) {
        json.draw = json.draw || self.gridDraw;
        json.recordsTotal = json.totalItems;
        json.recordsFiltered = json.totalItems;
        return json.items;
      },
    };
  };

  PawEmployeeList.prototype.getId = function () {
    return "paw-document-finder";
  };

  PawEmployeeList.prototype.gridColumnsDef = function () {
    return [
      {
        label: "",
        width: "100px",
        def: {
          data: "fullName",
          name: "fullName",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
          render: function (val, a, entity) {
            return entity.profilePhoto
              ? `<img class="paw-ui-trans-image-circle" src="${entity.profilePhoto}" />`
              : `<div class="paw-ui-trans-avatar-circle">${entity.avatar}</div>`;
          },
        },
      },
      {
        label: this.localization.fullName,
        width: "200px",
        url: window.location.origin + window.location.pathname + "?id=",
        def: {
          data: "fullName",
          name: "fullName",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
          render: $.fn.dataTable.render.link("worker"),
        },
      },
      {
        label: this.localization.worker,
        width: "200px",
        def: {
          data: "worker",
          name: "worker",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.department,
        width: "200px",
        def: {
          data: "department",
          name: "department",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.job,
        width: "200px",
        def: {
          data: "job",
          name: "job",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.address,
        width: "200px",
        def: {
          data: "address",
          name: "address",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.post,
        width: "200px",
        def: {
          data: "post",
          name: "post",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.tax,
        width: "200px",
        def: {
          data: "taxId",
          name: "taxId",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.regNo,
        width: "200px",
        def: {
          data: "regNo",
          name: "regNo",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
        },
      },
      {
        label: this.localization.status,
        width: "200px",
        def: {
          data: "active",
          name: "active",
          filtertype: "text",
          orderable: false,
          filtertype: "text",
          render: function (val, a, entity) {
            return entity.active
              ? '<span class="fa fa-check paw-ui-trans-status-success"></span>'
              : '<span class="fa fa-times paw-ui-trans-status-error"></span>';
          },
        },
      },
    ];
  };

  PawEmployeeList.prototype.datagridFilters = function (d) {
    d.Keywords = this.data.search;
    console.log("??", this.data.workingStatuses);
    let params = {
      keywords: this.data.search,
      sortColumn: "AcWorker",
      sortOrder: "asc",
      start: d.start,
      length: d.length,
      draw: d.draw,
    };
    return (
      qparams(params).substring(1) +
      this.arrayQparams("employmentStatuses", this.data.employmentStatuses) +
      this.arrayQparams("workingPlaces", this.data.workingPlaces) +
      this.arrayQparams("departments", this.data.departments) +
      this.arrayQparams("workingStatuses", this.data.workingStatuses)
    );
  };

  PawEmployeeList.prototype.arrayQparams = function (key, data) {
    if (!utils.value.isSet(data)) {
      return "";
    }
    var qparams = "";
    utils.iterable.iterate(data, function (v, i) {
      qparams += key + "=" + v + (i < data.length - 1 ? "&" : "");
    });
    return qparams.length > 0 ? "&" + qparams : "";
  };

  PawEmployeeList.prototype.filtersDef = function () {
    var self = this;

    var employmentStatusesOptions = "";
    utils.iterable.iterate(
      this.filterData.employmentStatuses,
      function (status) {
        employmentStatusesOptions +=
          "<option value='" + status.name + "'>" + status.name + "</option>";
      }
    );
    var workingPlacesOptions = "";
    utils.iterable.iterate(
      this.filterData.workingPlaces,
      function (workingPlace) {
        workingPlacesOptions +=
          "<option value='" +
          workingPlace.name +
          "'>" +
          workingPlace.name +
          "</option>";
      }
    );
    var departmentOptions = "";
    utils.iterable.iterate(this.filterData.departments, function (department) {
      departmentOptions +=
        "<option value='" +
        department.name +
        "'>" +
        department.name +
        "</option>";
    });
    var workingStatusesOptions = "";
    utils.iterable.iterate(
      [
        {
          value: "T",
          label: this.localization.active,
        },
        {
          value: "F",
          label: this.localization.inactive,
        },
      ],
      function (status) {
        workingStatusesOptions +=
          "<option value='" + status.value + "'>" + status.label + "</option>";
      }
    );
    console.log("OPTS", departmentOptions);

    var filters = [
      {
        id: "search",
        pinned: true,
        label: this.localization.search,
        ignoreStoreValue: false,
        markup:
          '<div class="paw-holder-rel"><input id="search" class="form-control paw-finder-input" type="text" placeholder="' +
          this.localization.searchPlaceholder +
          '" autocomplete="off" data-field-search /> <div class="paw-abs paw-abs-right paw-abs-middle paw-transform-y-middle paw-alpha-50 p-r-3x"><span class="fa fa-search"></span></div></div>',
        inputField: function ($elt, data) {
          return new paw.com.Input(
            $elt,
            "search",
            data,
            undefined,
            function () {
              return self.onFilterChange();
            }
          );
        },
      },
      {
        id: "employmentStatuses",
        pinned: true,
        label: this.localization.employmentStatuses,
        markup:
          '<select id="employmentStatuses" class="form-control selectpicker" type="text" autocomplete="off" multiple="multiple" data-live-search="true" title="' +
          this.localization.all +
          '" data-custom-class="paw-finder-select" data-field-employment-statuses>' +
          employmentStatusesOptions +
          "</select>",
        inputField: function ($elt, data) {
          return new paw.com.Input(
            $elt,
            "employmentStatuses",
            data,
            {
              settings: {
                container: "body",
              },
            },
            function () {
              return self.onFilterChange();
            }
          );
        },
      },
      {
        id: "workingPlaces",
        pinned: true,
        label: this.localization.workingPlaces,
        markup:
          '<select id="workingPlaces" class="form-control selectpicker" type="text" autocomplete="off" multiple="multiple" data-live-search="true" title="' +
          this.localization.all +
          '" data-custom-class="paw-finder-select" data-field-working-places>' +
          workingPlacesOptions +
          "</select>",
        inputField: function ($elt, data) {
          return new paw.com.Input(
            $elt,
            "workingPlaces",
            data,
            {
              settings: {
                container: "body",
              },
            },
            function () {
              return self.onFilterChange();
            }
          );
        },
      },
      {
        id: "departments",
        pinned: true,
        label: this.localization.department,
        markup:
          '<select id="departments" class="form-control selectpicker" type="text" autocomplete="off" multiple="multiple" data-live-search="true" title="' +
          this.localization.all +
          '" data-custom-class="paw-finder-select" data-field-working-places>' +
          departmentOptions +
          "</select>",
        inputField: function ($elt, data) {
          return new paw.com.Input(
            $elt,
            "departments",
            data,
            {
              settings: {
                container: "body",
              },
            },
            function () {
              return self.onFilterChange();
            }
          );
        },
      },
      {
        id: "workingStatuses",
        pinned: true,
        label: this.localization.status,
        markup:
          '<select id="workingStatuses" class="form-control selectpicker" type="text" autocomplete="off" multiple="multiple" title="' +
          this.localization.all +
          '" data-custom-class="paw-finder-select" data-field-working-places>' +
          workingStatusesOptions +
          "</select>",
        inputField: function ($elt, data) {
          return new paw.com.Input(
            $elt,
            "workingStatuses",
            data,
            {
              settings: {
                container: "body",
              },
            },
            function () {
              return self.onFilterChange();
            }
          );
        },
      },
    ];
    return filters;
  };

  PawEmployeeList.prototype.onFilterChange = function () {
    this.finder.find();
  };

  PawEmployeeList.prototype.init = function () {
    return this.fetchEmployeeListFilterData();
  };

  PawEmployeeList.prototype.destroy = function () {};

  PawEmployeeList.prototype.fetchEmployeeListFilterData = function () {
    var self = this;
    return utils.async
      .get(this.settings.employeeFilterDataUrl)
      .then(function (filterData) {
        self.filterData = filterData;
      });
  };

  PawEmployeeList.prototype.resetValues = function () {
    return {
      search: "",
      employmentStatuses: null,
      workingPlaces: null,
      departments: null,
      workingStatuses: null,
    };
  };

  paw.mod.employeeList.EmployeeList = PawEmployeeList;
})(paw, paw.utils);
