contentoh-components-library 21.0.92 → 21.0.97

package/dist/components/atoms/AsignationOption/index.js

@@ -19,6 +19,10 @@ var _requestToTeam = _interopRequireDefault(require("../../../assets/images/asig
 
 var _availableIcon = _interopRequireDefault(require("../../../assets/images/asignationOptions/availableIcon.svg"));
 
+var _data = require("../../../global-files/data");
+
+var _StatusTag = require("../StatusTag");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var AsignationOption = function AsignationOption(_ref) {
@@ -31,7 +35,27 @@ var AsignationOption = function AsignationOption(_ref) {
       team = _ref.team,
       onClick = _ref.onClick,
       btnOnClick = _ref.btnOnClick,
-      active = _ref.active;
+      active = _ref.active,
+      services = _ref.services;
+
+  var getStatus = function getStatus() {
+    var servCad = "";
+    services.forEach(function (srv) {
+      return servCad += srv;
+    });
+
+    switch (servCad) {
+      case "NANANA":
+        return "NA";
+
+      case "RECEIVEDRECEIVEDRECEIVED":
+        return "RECEIVED";
+
+      default:
+        return (0, _data.getNewStatus)(services);
+    }
+  };
+
   var iconsAsignation = {
     assigned: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
       onClick: btnOnClick,
@@ -68,7 +92,12 @@ var AsignationOption = function AsignationOption(_ref) {
         className: "team-label",
         children: team
       })]
-    }), asignationType && iconsAsignation[asignationType], active && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    }), asignationType && iconsAsignation[asignationType], services && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "status-container",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StatusTag.StatusTag, {
+        statusType: getStatus()
+      })
+    }), active && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "green-circle"
     })]
   });

package/dist/components/atoms/AsignationOption/styles.js

@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  border-radius: 3px;\n  padding: 5px;\n\n  .profile-image,\n  .medium-image {\n    & + * {\n      margin-left: 15px;\n    }\n  }\n\n  .labels-container {\n    font-family: ", ";\n    font-weight: 500;\n    font-size: 14px;\n    line-height: 16px;\n\n    .name-label,\n    .team-label {\n      inline-size: 100px;\n      overflow: hidden;\n    }\n\n    .name-label {\n      color: ", ";\n    }\n\n    .team-label {\n      color: ", ";\n    }\n\n    & + * {\n      margin-left: 11px;\n    }\n  }\n\n  .green-circle {\n    background-color: ", ";\n    width: 20px;\n    height: 20px;\n    border-radius: 50%;\n  }\n\n  button {\n    background-color: transparent;\n    cursor: pointer;\n    border: none;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  & + * {\n    margin-top: 10px;\n  }\n"])), _variables.FontFamily.AvenirNext, _variables.GlobalColors.s5, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.s3);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  border-radius: 3px;\n  padding: 5px;\n\n  .profile-image,\n  .medium-image {\n    & + * {\n      margin-left: 15px;\n    }\n  }\n\n  .labels-container {\n    font-family: ", ";\n    font-weight: 500;\n    font-size: 14px;\n    line-height: 16px;\n\n    .name-label,\n    .team-label {\n      inline-size: 100px;\n      overflow: hidden;\n    }\n\n    .name-label {\n      color: ", ";\n    }\n\n    .team-label {\n      color: ", ";\n    }\n\n    & + * {\n      margin-left: 11px;\n    }\n  }\n\n  .status-container {\n    & + * {\n      margin-left: 10px;\n    }\n  }\n\n  .green-circle {\n    background-color: ", ";\n    width: 20px;\n    height: 20px;\n    border-radius: 50%;\n  }\n\n  button {\n    background-color: transparent;\n    cursor: pointer;\n    border: none;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  & + * {\n    margin-top: 10px;\n  }\n"])), _variables.FontFamily.AvenirNext, _variables.GlobalColors.s5, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.s3);
 
 exports.Container = Container;

package/dist/components/atoms/InputFormatter/index.js

@@ -99,7 +99,7 @@ var InputFormatter = function InputFormatter(_ref) {
     setCharsCounter(h.getLength() - 1);
     value = valueFormater(value);
     var idInput = inputId;
-    var dataSave = updatedDescriptions.slice();
+    var dataSave = updatedDescriptions === null || updatedDescriptions === void 0 ? void 0 : updatedDescriptions.slice();
 
     if (dataSave.length > 0) {
       if (dataSave.filter(function (e) {

package/dist/components/atoms/StatusTag/styles.js

@@ -15,6 +15,6 @@ var _variables = require("../../../global-files/variables");
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  padding: 0 10px;\n  height: 20px;\n  background-color: ", ";\n  border-radius: 3px;\n\n  p {\n    text-align: center;\n    color: ", ";\n    font-family: ", ";\n    font-size: 12px;\n    line-height: 20px;\n  }\n\n  &.status-As,\n  &.status-P,\n  &.status-IN_PROGRESS,\n  &.status-QF {\n    background-color: ", ";\n  }\n\n  &.status-Pr,\n  &.status-Rr {\n    background-color: ", ";\n  }\n\n  &.status-AA,\n  &.status-AP,\n  &.status-AC,\n  &.status-AF {\n    background-color: ", ";\n  }\n\n  &.status-RA,\n  &.status-RF,\n  &.status-RP,\n  &.status-RC {\n    background-color: ", ";\n  }\n\n  &.status-Dat,\n  &.status-Dsc,\n  &.status-Imgs {\n    background-color: ", ";\n  }\n\n  &.status-Ex {\n    background-color: ", ";\n  }\n\n  &.status-DDI {\n    background-color: ", ";\n  }\n\n  &.status-GLD {\n    background-color: ", ";\n  }\n\n  &.status-TAB {\n    background-color: ", ";\n  }\n\n  &.status-Pt {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.oval-form {\n    border-radius: 10px;\n  }\n"])), _variables.GlobalColors.s3, _variables.GlobalColors.white, _variables.FontFamily.Lato, _variables.GlobalColors.in_progress, _variables.GlobalColors.reception, _variables.GlobalColors.finished, _variables.GlobalColors.rejected_status, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.original_purpura, _variables.GlobalColors.in_progress, _variables.GlobalColors.deep_gray, _variables.GlobalColors.s2, _variables.GlobalColors.s4);
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  padding: 0 10px;\n  height: 20px;\n  background-color: ", ";\n  border-radius: 3px;\n\n  p {\n    text-align: center;\n    color: ", ";\n    font-family: ", ";\n    font-size: 12px;\n    line-height: 20px;\n  }\n\n  &.status-As,\n  &.status-P,\n  &.status-IN_PROGRESS,\n  &.status-QF {\n    background-color: ", ";\n  }\n\n  &.status-Pr,\n  &.status-Rr,\n  &.status-Rc {\n    background-color: ", ";\n  }\n\n  &.status-AA,\n  &.status-AP,\n  &.status-AC,\n  &.status-AF {\n    background-color: ", ";\n  }\n\n  &.status-RA,\n  &.status-RF,\n  &.status-RP,\n  &.status-RC {\n    background-color: ", ";\n  }\n\n  &.status-Dat,\n  &.status-Dsc,\n  &.status-Imgs {\n    background-color: ", ";\n  }\n\n  &.status-Ex {\n    background-color: ", ";\n  }\n\n  &.status-DDI {\n    background-color: ", ";\n  }\n\n  &.status-GLD {\n    background-color: ", ";\n  }\n\n  &.status-TAB {\n    background-color: ", ";\n  }\n\n  &.status-Pt {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.oval-form {\n    border-radius: 10px;\n  }\n"])), _variables.GlobalColors.s3, _variables.GlobalColors.white, _variables.FontFamily.Lato, _variables.GlobalColors.in_progress, _variables.GlobalColors.reception, _variables.GlobalColors.finished, _variables.GlobalColors.rejected_status, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.original_purpura, _variables.GlobalColors.in_progress, _variables.GlobalColors.deep_gray, _variables.GlobalColors.s2, _variables.GlobalColors.s4);
 
 exports.Container = Container;

package/dist/components/molecules/RetailerSelector/index.js

@@ -24,7 +24,8 @@ var _jsxRuntime = require("react/jsx-runtime");
 var RetailerSelector = function RetailerSelector(_ref) {
   var retailers = _ref.retailers,
       activeRetailer = _ref.activeRetailer,
-      setActiveRetailer = _ref.setActiveRetailer;
+      setActiveRetailer = _ref.setActiveRetailer,
+      showStatus = _ref.showStatus;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -64,12 +65,14 @@ var RetailerSelector = function RetailerSelector(_ref) {
           asignationType: null,
           name: retailer === null || retailer === void 0 ? void 0 : retailer.name,
           team: retailer === null || retailer === void 0 ? void 0 : retailer.team,
+          services: retailer === null || retailer === void 0 ? void 0 : retailer.services,
           onClick: function onClick() {
             setActiveRetailer(retailer);
             document.removeEventListener("click", closeRetailersPanel, false);
             setRetailersPanel(false);
           },
-          active: retailer.id === activeRetailer.id
+          active: retailer.id === activeRetailer.id,
+          showStatus: showStatus
         }, "".concat(index, "-").concat(retailer === null || retailer === void 0 ? void 0 : retailer.name));
       })
     })]

package/dist/components/molecules/StatusAsignationInfo/index.js

@@ -83,7 +83,7 @@ var StatusAsignationInfo = function StatusAsignationInfo(_ref) {
       onClick: onClickSave
     }), imagesSection && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "images-buttons",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
+      children: [showSaveButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
         buttonType: "circular-button delete-button",
         onClick: function onClick() {
           askToDeleteImages && askToDeleteImages();

package/dist/components/organisms/FullProductNameHeader/index.js

@@ -1,10 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FullProductNameHeader = void 0;
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
 
 var _ProductNameHeader = require("../../molecules/ProductNameHeader");
@@ -13,6 +17,8 @@ var _FeaturesBar = require("../../molecules/FeaturesBar");
 
 var _AvatarAndValidation = require("../../molecules/AvatarAndValidation");
 
+var _react = require("react");
+
 var _jsxRuntime = require("react/jsx-runtime");
 
 var FullProductNameHeader = function FullProductNameHeader(_ref) {
@@ -24,7 +30,28 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
       setActiveRetailer = _ref.setActiveRetailer,
       showValidationButtons = _ref.showValidationButtons,
       approve = _ref.approve,
-      reject = _ref.reject;
+      reject = _ref.reject,
+      servicesData = _ref.servicesData;
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      retailers = _useState2[0],
+      setRetailers = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    var rtls = (headerData === null || headerData === void 0 ? void 0 : headerData.retailers) || (headerData === null || headerData === void 0 ? void 0 : headerData.retailersAvailable);
+    servicesData && rtls.forEach(function (rt) {
+      var element = [];
+      servicesData.forEach(function (sd) {
+        if (sd.id_retailer === rt.id) {
+          element.push(sd.status ? sd.status : "RECEIVED");
+        } else element.push("NA");
+
+        rt["services"] = element;
+      });
+    });
+    setRetailers(rtls);
+  }, [servicesData]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ProductNameHeader.ProductNameHeader, {
       productName: (headerData === null || headerData === void 0 ? void 0 : (_headerData$article = headerData.article) === null || _headerData$article === void 0 ? void 0 : _headerData$article.name) || (headerData === null || headerData === void 0 ? void 0 : headerData.name),
@@ -46,7 +73,7 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
           value: (headerData === null || headerData === void 0 ? void 0 : (_headerData$article5 = headerData.article) === null || _headerData$article5 === void 0 ? void 0 : _headerData$article5.upc) || (headerData === null || headerData === void 0 ? void 0 : headerData.upc)
         }]
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_AvatarAndValidation.AvatarAndValidation, {
-        retailers: (headerData === null || headerData === void 0 ? void 0 : headerData.retailers) || (headerData === null || headerData === void 0 ? void 0 : headerData.retailersAvailable),
+        retailers: retailers,
         avatarData: headerData === null || headerData === void 0 ? void 0 : headerData.avatarData,
         validation: headerData === null || headerData === void 0 ? void 0 : headerData.validation,
         activeRetailer: activeRetailer,

package/dist/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js

@@ -36,126 +36,56 @@ ProviderProductEditionDefault.args = {
   category: 846,
   version: 2,
   productSelected: {
-    orderId: 7,
-    id_category: "684",
-    status: "RECEPTION",
-    datasheet_status: null,
-    prio: "none",
-    version: 4,
-    description_status: null,
-    images_status: null,
-    brand: null,
-    missing: {
-      datasheet: 33,
-      descriptions: 14,
-      images: 3
-    },
-    article: {
-      category: "SALUD Y BELLEZA|CUIDADO BUCAL|PASTAS DENTALES Y ASEO BUCAL",
-      company_name: "COMPANY DEV",
-      id_category: "684",
-      id_article: 33249,
-      name: "Crema dental ",
-      timestamp: "2022-06-14T23:24:08.000Z",
-      upc: "232435"
-    },
-    retailers: [{
-      id: 4,
-      name: "Walmart Super y Superama"
-    }, {
-      id: 9,
-      name: "Amazon"
-    }, {
-      id: 1013,
-      name: "Cencosud Colombia"
-    }, {
-      id: 2005,
-      name: "ClubCo"
-    }],
-    services: {
-      datasheets: 1,
-      descriptions: 1,
-      images: 1
-    },
+    id_article: 35319,
+    id_category: "2146",
+    name: "FOCO LED A19 (60W) LUZ AMARILLA",
+    upc: "120873",
+    timestamp: "2022-06-14T15:31:50.000Z",
+    status: "NULL",
+    categoryName: "ILUMINACIÓN|FOCOS|LEDS",
+    asignations: [],
+    version: 2,
+    version_status: "AA",
     retailersAvailable: [{
-      id: 4,
-      name: "Walmart Super y Superama"
-    }, {
-      id: 9,
-      name: "Amazon"
-    }, {
-      id: 1013,
-      name: "Cencosud Colombia"
-    }, {
-      id: 2005,
-      name: "ClubCo"
+      id: 58,
+      name: "The Home Depot Golden",
+      country: "México",
+      id_region: 1,
+      active: 1
     }],
-    id_article: 33249,
-    categoryName: "SALUD Y BELLEZA|CUIDADO BUCAL|PASTAS DENTALES Y ASEO BUCAL",
-    version_status: "RECEPTION"
+    missing: {
+      datasheet: 33,
+      description: 0,
+      image: 23
+    }
   },
   productToEdit: {
-    ArticleId: 33249,
-    idCategory: "684",
-    product: {
-      orderId: 7,
-      id_category: "684",
-      status: "RECEPTION",
-      datasheet_status: null,
-      prio: "none",
-      version: 4,
-      description_status: null,
-      images_status: null,
-      brand: null,
-      missing: {
-        datasheet: 33,
-        descriptions: 14,
-        images: 3
-      },
-      article: {
-        category: "SALUD Y BELLEZA|CUIDADO BUCAL|PASTAS DENTALES Y ASEO BUCAL",
-        company_name: "COMPANY DEV",
-        id_category: "684",
-        id_article: 33249,
-        name: "Crema dental ",
-        timestamp: "2022-06-14T23:24:08.000Z",
-        upc: "232435"
-      },
-      retailers: [{
-        id: 4,
-        name: "Walmart Super y Superama"
-      }, {
-        id: 9,
-        name: "Amazon"
-      }, {
-        id: 1013,
-        name: "Cencosud Colombia"
-      }, {
-        id: 2005,
-        name: "ClubCo"
-      }],
-      services: {
-        datasheets: 1,
-        descriptions: 1,
-        images: 1
-      },
+    idCategory: "2146",
+    ArticleId: 35319,
+    product: [{
+      id_article: 35319,
+      id_category: "2146",
+      name: "FOCO LED A19 (60W) LUZ AMARILLA",
+      upc: "120873",
+      timestamp: "2022-06-14T15:31:50.000Z",
+      status: "NULL",
+      categoryName: "ILUMINACIÓN|FOCOS|LEDS",
+      asignations: [],
+      version: 2,
+      version_status: "AA",
       retailersAvailable: [{
-        id: 4,
-        name: "Walmart Super y Superama"
-      }, {
-        id: 9,
-        name: "Amazon"
-      }, {
-        id: 1013,
-        name: "Cencosud Colombia"
-      }, {
-        id: 2005,
-        name: "ClubCo"
+        id: 58,
+        name: "The Home Depot Golden",
+        country: "México",
+        id_region: 1,
+        active: 1
       }],
-      id_article: 33249,
-      categoryName: "SALUD Y BELLEZA|CUIDADO BUCAL|PASTAS DENTALES Y ASEO BUCAL",
-      version_status: "RECEPTION"
-    }
+      missing: {
+        datasheet: 33,
+        description: 0,
+        image: 23
+      }
+    }]
   },
   location: {
     product: {

package/dist/components/pages/ProviderProductEdition/index.js

@@ -110,6 +110,14 @@ var reducerImages = function reducerImages(state, action) {
         values: values
       });
 
+    case "deleteImage":
+      values = values.filter(function (value) {
+        return action.selectedImages.indexOf(value) === -1;
+      });
+      return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, state), {}, {
+        values: values
+      });
+
     default:
       return state;
   }
@@ -131,7 +139,7 @@ var myBucket = new _awsSdk.default.S3({
 });
 
 var ProviderProductEdition = function ProviderProductEdition(_ref) {
-  var _product$retailers, _product$retailersAva, _location$state, _product$services2, _datasheets$, _datasheets$$data;
+  var _product$retailers, _product$retailersAva, _location$state, _datasheets$, _datasheets$$data;
 
   var tabsSections = _ref.tabsSections,
       _ref$productSelected = _ref.productSelected,
@@ -446,6 +454,11 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
       socketType = _useState80[0],
       setSocketType = _useState80[1];
 
+  var _useState81 = (0, _react.useState)(loading),
+      _useState82 = (0, _slicedToArray2.default)(_useState81, 2),
+      saving = _useState82[0],
+      setSaving = _useState82[1];
+
   (0, _react.useEffect)(function () {
     checkAll && setSelectedImages(images.values);
   }, [checkAll]);
@@ -469,7 +482,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
 
               setImages({
                 action: "init",
-                init: JSON.parse(sessionStorage.getItem("imagesList")) || services[2]
+                init: services[2]
               });
               if (((_services$ = services[2]) === null || _services$ === void 0 ? void 0 : (_services$$values = _services$.values) === null || _services$$values === void 0 ? void 0 : _services$$values.length) > 0) setActiveImage(0);
               setActiveRetailer(product.retailers ? product.retailers[0] : product.retailersAvailable[0]);
@@ -696,7 +709,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
   var thumbs = function thumbs() {
     var _images$imageType, _images$imagePackagin, _images$values;
 
-    var imageInputs = socketType.slice();
+    var imageInputs = socketType === null || socketType === void 0 ? void 0 : socketType.slice();
     var imageType = images === null || images === void 0 ? void 0 : (_images$imageType = images.imageType) === null || _images$imageType === void 0 ? void 0 : _images$imageType.map(function (e) {
       return {
         value: e === null || e === void 0 ? void 0 : e.id,
@@ -903,18 +916,19 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
             }
 
             if (!(valid && (duplicated === null || duplicated === void 0 ? void 0 : duplicated.length) === 0)) {
-              _context8.next = 30;
+              _context8.next = 31;
               break;
             }
 
-            _context8.prev = 10;
+            setLoading(true);
+            _context8.prev = 11;
             data === null || data === void 0 ? void 0 : (_data$articleData3 = data.articleData) === null || _data$articleData3 === void 0 ? void 0 : _data$articleData3.forEach(function (e) {
               e.uuid = (0, _uuid.v4)();
             });
             setDataImages(data);
 
             if (!((data === null || data === void 0 ? void 0 : (_data$articleData4 = data.articleData) === null || _data$articleData4 === void 0 ? void 0 : _data$articleData4.length) > 0)) {
-              _context8.next = 22;
+              _context8.next = 23;
               break;
             }
 
@@ -930,40 +944,40 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
               };
               promiseArray.push(myBucket.putObject(params).promise());
             });
-            _context8.next = 19;
+            _context8.next = 20;
             return Promise.all(promiseArray);
 
-          case 19:
+          case 20:
             setImagesUploaded(true);
-            _context8.next = 23;
+            _context8.next = 24;
             break;
 
-          case 22:
+          case 23:
             setImagesUploaded(true);
 
-          case 23:
-            _context8.next = 28;
+          case 24:
+            _context8.next = 29;
             break;
 
-          case 25:
-            _context8.prev = 25;
-            _context8.t0 = _context8["catch"](10);
+          case 26:
+            _context8.prev = 26;
+            _context8.t0 = _context8["catch"](11);
             console.log(_context8.t0); // setMainLoading(false);
 
-          case 28:
-            _context8.next = 31;
+          case 29:
+            _context8.next = 32;
             break;
 
-          case 30:
+          case 31:
             // setMainLoading(false);
             setMessage("Completa los campos que solicita cada una de la imágenes o hay imágenes con el mismo tipo de toma.\nRecuerda hay campos obligatorios y no podras avanzar si no estan completos.");
 
-          case 31:
+          case 32:
           case "end":
             return _context8.stop();
         }
       }
-    }, _callee8, null, [[10, 25]]);
+    }, _callee8, null, [[11, 26]]);
   })), [images, imagesUploaded]);
   (0, _react.useEffect)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9() {
     return _regenerator.default.wrap(function _callee9$(_context9) {
@@ -971,11 +985,10 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
         switch (_context9.prev = _context9.next) {
           case 0:
             if (!imagesUploaded) {
-              _context9.next = 14;
+              _context9.next = 13;
               break;
             }
 
-            setLoading(true);
             dataImages.articleData = dataImages === null || dataImages === void 0 ? void 0 : dataImages.articleData.map(function (e) {
               delete e.src;
               e.imageID = e.image_id;
@@ -984,32 +997,32 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
               if (product !== null && product !== void 0 && product.orderId) e["orderId"] = product === null || product === void 0 ? void 0 : product.orderId;
               return e;
             });
-            _context9.prev = 3;
-            _context9.next = 6;
+            _context9.prev = 2;
+            _context9.next = 5;
             return _axios.default.put("".concat(process.env.REACT_APP_ARTICLE_DATA_ENDPOINT, "?image=true&version=").concat(version), dataImages, {
               headers: {
                 Authorization: token
               }
             });
 
-          case 6:
+          case 5:
             setMessage("Imágenes guardadas con éxito");
             sessionStorage.removeItem("imagesList");
             loadData();
-            _context9.next = 14;
+            _context9.next = 13;
             break;
 
-          case 11:
-            _context9.prev = 11;
-            _context9.t0 = _context9["catch"](3);
+          case 10:
+            _context9.prev = 10;
+            _context9.t0 = _context9["catch"](2);
             console.log(_context9.t0);
 
-          case 14:
+          case 13:
           case "end":
             return _context9.stop();
         }
       }
-    }, _callee9, null, [[3, 11]]);
+    }, _callee9, null, [[2, 10]]);
   })), [dataImages, imagesUploaded]);
 
   var evaluationFinished = function evaluationFinished(userId, tab, statusArray) {// const srv = servicesData.filter((serv) => serv.service === getConcept(tab));
@@ -1274,7 +1287,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
   }();
 
   var getRequired = function getRequired(services) {
-    var _services$4, _services$4$inputs;
+    var _services$4, _services$4$retailerM, _services$5, _services$5$inputs;
 
     var objetcTemp = {};
     var datasheetServicesArray = Object.values(services[0]);
@@ -1308,8 +1321,18 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
       });
     });
     objetcTemp["Descripción"] = desInputsRequired;
-    var requiredImages = (_services$4 = services[2]) === null || _services$4 === void 0 ? void 0 : (_services$4$inputs = _services$4.inputs) === null || _services$4$inputs === void 0 ? void 0 : _services$4$inputs.filter(function (e) {
-      return e.required;
+    var retailersRequested = [];
+    (_services$4 = services[2]) === null || _services$4 === void 0 ? void 0 : (_services$4$retailerM = _services$4.retailerMandatories) === null || _services$4$retailerM === void 0 ? void 0 : _services$4$retailerM.forEach(function (retMan) {
+      return retMan.forEach(function (rm) {
+        return retailersRequested.push(rm);
+      });
+    });
+    var requiredImages = (_services$5 = services[2]) === null || _services$5 === void 0 ? void 0 : (_services$5$inputs = _services$5.inputs) === null || _services$5$inputs === void 0 ? void 0 : _services$5$inputs.filter(function (e) {
+      return e.required === 1 && retailersRequested.filter(function (ret) {
+        return ret.id_image === e.id && servicesData.filter(function (srv) {
+          return srv.id_retailer === ret.id_retailer;
+        }).length > 0;
+      }).length > 0;
     });
     var requiredCounter = 0;
     requiredImages === null || requiredImages === void 0 ? void 0 : requiredImages.forEach(function (req) {
@@ -1445,7 +1468,6 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
 
   var deleteImages = function deleteImages() {
     setLoading(true);
-    var imagesTemp = images;
     var values = images.values;
     var imgsInBack = [];
     selectedImages.forEach(function (selectedImg) {
@@ -1454,12 +1476,13 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
     var imgsLeft = values.filter(function (value) {
       return selectedImages.indexOf(value) === -1;
     });
-    imagesTemp.values = imgsLeft;
 
     if (imgsInBack.length > 0) {
+      var _product$article4;
+
       var data = {
-        articleId: product.article.id_article,
-        deleteImages: selectedImages
+        articleId: (product === null || product === void 0 ? void 0 : product.id_article) || (product === null || product === void 0 ? void 0 : (_product$article4 = product.article) === null || _product$article4 === void 0 ? void 0 : _product$article4.id_article),
+        deleteImages: imgsInBack
       };
 
       try {
@@ -1473,8 +1496,13 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
       }
     }
 
-    sessionStorage.setItem("imagesList", JSON.stringify(imagesTemp));
-    loadData();
+    setImages({
+      action: "deleteImage",
+      selectedImages: selectedImages
+    });
+    setTimeout(function () {
+      setLoading(false);
+    }, 500);
     setMessage("");
     setComponentsArray([]);
   };
@@ -1695,6 +1723,9 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
     return true;
   };
 
+  (0, _react.useEffect)(function () {
+    setSaving(loading);
+  }, [loading]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     headerTop: headerTop,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderTop.HeaderTop, {
@@ -1808,15 +1839,15 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
           onClickSave: function onClickSave() {
             switch (activeTab) {
               case "Descripción":
-                saveDescriptions();
+                !saving && saveDescriptions();
                 break;
 
               case "Ficha técnica":
-                saveDatasheets();
+                !saving && saveDatasheets();
                 break;
 
               case "Imágenes":
-                updateImages();
+                !saving && updateImages();
                 break;
 
               default:
@@ -1826,7 +1857,7 @@ var ProviderProductEdition = function ProviderProductEdition(_ref) {
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: "services-information-container " + (imageLayout && activeTab === "Imágenes" ? "image-services" : ""),
           children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-            children: [!imageLayout && activeTab === "Imágenes" && (product === null || product === void 0 ? void 0 : (_product$services2 = product.services) === null || _product$services2 === void 0 ? void 0 : _product$services2.images) === 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GalleryHeader.GalleryHeader, {
+            children: [!imageLayout && activeTab === "Imágenes" && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GalleryHeader.GalleryHeader, {
               setSelectedImages: setSelectedImages,
               checkAll: checkAll,
               setCheckAll: setCheckAll