import React, { useMemo } from 'react';
import Like from "../../../info/service/like";
import { getServiceTime } from "../../../utils";
import { formatAmount, locales } from '@pisell/utils';
import CollapsibleList from "../../../components/collapsibleList";
import { renderBundles } from "../../../components/collapsibleList/utils";
import { Alert, Button } from 'antd';
import Actions from "../actions";
import "./index.less";
import { Iconfont } from '@pisell/materials';
var getName = function getName(name, locale) {
  return name[locale] || name['original'] || name['en'] || '';
};
var sortResources = function sortResources(service) {
  var _service$product_reso, _service$_extend;
  var origin = ((_service$product_reso = service.product_resource) === null || _service$product_reso === void 0 ? void 0 : _service$product_reso.resources) || [];
  var list = ((_service$_extend = service._extend) === null || _service$_extend === void 0 ? void 0 : _service$_extend.resource) || {};

  // 先按照 b 的顺序遍历并填充 c
  var processedKeys = new Set();
  var res = [];
  origin.forEach(function (item) {
    var key = item.id;
    if (list[key]) {
      res.push(list[key]);
      processedKeys.add(key); // 记录已经处理过的 key
    }
  });

  // 将 a 中未出现在 b 中的项追加到 c 的最后
  Object.keys(list).forEach(function (key) {
    var keyNum = Number(key);
    if (!processedKeys.has(keyNum)) {
      res.push(list[keyNum]); // 添加未处理过的项
    }
  });
  return res;
};
var ServiceItem = function ServiceItem(_ref) {
  var _d$_extend3, _d$_extend4, _d$_extend6, _d$_extend7, _d$_extend8, _d$_extend9, _d$_extend10, _d$_extend$relation_d;
  var d = _ref.d,
    handleEditService = _ref.handleEditService,
    state = _ref.state,
    handleLike = _ref.handleLike,
    errorMessage = _ref.errorMessage,
    handleDeleteService = _ref.handleDeleteService;
  var isDiscount = useMemo(function () {
    var _d$_extend, _d$_extend2;
    return Number((_d$_extend = d._extend) === null || _d$_extend === void 0 ? void 0 : _d$_extend.total) != Number((_d$_extend2 = d._extend) === null || _d$_extend2 === void 0 ? void 0 : _d$_extend2.origin_total);
  }, [(_d$_extend3 = d._extend) === null || _d$_extend3 === void 0 ? void 0 : _d$_extend3.total, (_d$_extend4 = d._extend) === null || _d$_extend4 === void 0 ? void 0 : _d$_extend4.origin_total]);
  var renderResources = useMemo(function () {
    if (state.renderType == 'eventBooking') {
      return null;
    }
    var resourcesOriginMap = state.service.resourcesOriginMap || {};
    var list = sortResources(d);
    return list
    // 过滤掉没有选择的
    .filter(function (item) {
      return item.length;
    }).map(function (item) {
      var _d$product_resource, _first$metadata;
      var resourceGroupName = '';
      var resourceNames = '';
      var first = item === null || item === void 0 ? void 0 : item[0];
      // 资源分类
      var resourceGroup = (_d$product_resource = d.product_resource) === null || _d$product_resource === void 0 || (_d$product_resource = _d$product_resource.resources) === null || _d$product_resource === void 0 ? void 0 : _d$product_resource.find(function (t) {
        return t.id === (first === null || first === void 0 ? void 0 : first.form_id);
      });
      var showLike = (resourceGroup === null || resourceGroup === void 0 ? void 0 : resourceGroup.select_type.min) === 1 && (resourceGroup === null || resourceGroup === void 0 ? void 0 : resourceGroup.select_type.max) === 1 && (resourceGroup === null || resourceGroup === void 0 ? void 0 : resourceGroup.type) === 'single';
      if (first !== null && first !== void 0 && (_first$metadata = first.metadata) !== null && _first$metadata !== void 0 && _first$metadata.form_name) {
        var _first$metadata2;
        resourceGroupName = first === null || first === void 0 || (_first$metadata2 = first.metadata) === null || _first$metadata2 === void 0 ? void 0 : _first$metadata2.form_name;
        // 所选资源的名称
        resourceNames = item.map(function (v) {
          var _v$metadata;
          return v === null || v === void 0 || (_v$metadata = v.metadata) === null || _v$metadata === void 0 ? void 0 : _v$metadata.resource_name;
        }).join(', ');
      } else {
        resourceGroupName = resourceGroup === null || resourceGroup === void 0 ? void 0 : resourceGroup.title;

        // 所选资源的名称
        resourceNames = item.map(function (v) {
          var _resourcesOriginMap$v;
          return (_resourcesOriginMap$v = resourcesOriginMap[v.relation_id]) === null || _resourcesOriginMap$v === void 0 ? void 0 : _resourcesOriginMap$v.main_field;
        }).join(', ');
      }
      var showGroupName = (list === null || list === void 0 ? void 0 : list.length) > 1;
      return /*#__PURE__*/React.createElement("div", {
        className: "pisell-lowcode__booking-service-item-technician"
      }, showGroupName ? /*#__PURE__*/React.createElement("span", {
        style: {
          marginRight: '4px'
        }
      }, resourceGroupName, ":") : null, showLike ? /*#__PURE__*/React.createElement(Like, {
        style: {
          margin: '0 4px 0 0'
        },
        status: item[0].like_status,
        onChange: function onChange(e) {
          handleLike(e, d, item[0]);
        }
      }) : null, resourceNames);
    });
  }, [d, state.service.resourcesOriginMap, state.renderType]);
  var renderUser = useMemo(function () {
    var _d$_extend5, _d$capacity;
    var list = ((_d$_extend5 = d._extend) === null || _d$_extend5 === void 0 ? void 0 : _d$_extend5.capacity) || [];
    if (((_d$capacity = d.capacity) === null || _d$capacity === void 0 ? void 0 : _d$capacity.type) === 'custom') {
      return /*#__PURE__*/React.createElement("div", {
        className: ""
      }, list.map(function (user) {
        return /*#__PURE__*/React.createElement("div", {
          className: "pisell-lowcode__booking-service-item-technician",
          key: user.id
        }, /*#__PURE__*/React.createElement("span", {
          style: {
            marginRight: '4px'
          }
        }, getName(user.name, state.locale), ":"), /*#__PURE__*/React.createElement("span", null, user.value || 0));
      }));
    }
    return null;
  }, [d, state.locale]);
  return /*#__PURE__*/React.createElement("div", {
    key: d._id,
    className: "pisell-lowcode__booking-service-item",
    onClick: function onClick() {
      handleEditService(d);
    }
  }, !state.channelDisabledEdit && /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-delete",
    onClick: function onClick(e) {
      e.stopPropagation();
      handleDeleteService(d);
    }
  }, /*#__PURE__*/React.createElement(Button, {
    type: "text",
    icon: /*#__PURE__*/React.createElement(Iconfont, {
      type: "pisell2-trash-01"
    })
  })), d.id || d.isCustomItem ? /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-title"
  }, d.title) : null, d._extend && state.renderType !== 'eventBooking' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-date"
  }, getServiceTime(d, state.date.value)), renderResources) : null, (((_d$_extend6 = d._extend) === null || _d$_extend6 === void 0 || (_d$_extend6 = _d$_extend6.other) === null || _d$_extend6 === void 0 ? void 0 : _d$_extend6.bundle) || []).length ? /*#__PURE__*/React.createElement(CollapsibleList, {
    border: true,
    list: ((_d$_extend7 = d._extend) === null || _d$_extend7 === void 0 || (_d$_extend7 = _d$_extend7.other) === null || _d$_extend7 === void 0 ? void 0 : _d$_extend7.bundle) || [],
    renderItem: function renderItem(item) {
      return renderBundles(item, state.amountSymbol);
    }
  }) : null, d.id || d.isCustomItem ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-price-wrap"
  }, /*#__PURE__*/React.createElement("span", {
    className: "pisell-lowcode__booking-service-item-price"
  }, formatAmount((_d$_extend8 = d._extend) === null || _d$_extend8 === void 0 ? void 0 : _d$_extend8.total, 2, state.amountSymbol)), isDiscount ? /*#__PURE__*/React.createElement("span", {
    className: "pisell-lowcode__booking-service-item-original-price"
  }, formatAmount(d._extend.origin_total, 2, state.amountSymbol)) : null)) : null, isDiscount && (_d$_extend9 = d._extend) !== null && _d$_extend9 !== void 0 && _d$_extend9.discount_reason ? /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-discount-reason"
  }, /*#__PURE__*/React.createElement("span", null, locales.getText('pisell2.text.discount-reason'), ":"), ' ', (_d$_extend10 = d._extend) === null || _d$_extend10 === void 0 ? void 0 : _d$_extend10.discount_reason) : null, renderUser, (_d$_extend$relation_d = d._extend.relation_details) !== null && _d$_extend$relation_d !== void 0 && _d$_extend$relation_d.length ? /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-relation-details"
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__booking-service-item-title"
  }, locales.getText('page.booking.text.sales')), d._extend.relation_details.map(function (item, index) {
    return /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__booking-service-item-relation-detail",
      key: item.id
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__booking-service-item-relation-detail-title"
    }, item.product_title), /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__booking-service-item-relation-detail-info"
    }, /*#__PURE__*/React.createElement("span", {
      className: "pisell-lowcode__booking-service-item-relation-detail-info-price"
    }, formatAmount(item.payment_price, 2, state.amountSymbol)), /*#__PURE__*/React.createElement("span", {
      className: "pisell-lowcode__booking-service-item-relation-detail-info-unit"
    }, "x"), /*#__PURE__*/React.createElement("span", {
      className: "pisell-lowcode__booking-service-item-relation-detail-info-quantity"
    }, item.product_quantity)));
  })) : null, /*#__PURE__*/React.createElement(Actions, {
    currentService: d
  }), errorMessage ? /*#__PURE__*/React.createElement(Alert, {
    message: errorMessage,
    type: "warning",
    showIcon: true,
    className: "pisell-lowcode__booking-service-item-error"
  }) : null);
};
export default ServiceItem;