contentoh-components-library 21.2.7 → 21.2.8

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

@@ -72,7 +72,7 @@ var FullProductNameHeader = function FullProductNameHeader(_ref) {
           feature: "Prov",
           value: headerData === null || headerData === void 0 ? void 0 : (_headerData$article4 = headerData.article) === null || _headerData$article4 === void 0 ? void 0 : _headerData$article4.company_name
         }, {
-          feature: "UPC",
+          feature: "SKU",
           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, {

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

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.DashboardDeafult = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
+var _ = require(".");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _default = {
+  title: "Components/pages/Dashboard",
+  component: _.Dashboard
+};
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Dashboard, (0, _objectSpread2.default)({}, args));
+};
+
+var DashboardDeafult = Template.bind({});
+exports.DashboardDeafult = DashboardDeafult;
+DashboardDeafult.args = {};

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

@@ -0,0 +1,292 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Dashboard = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
+var _styles = require("./styles");
+
+var _MetricCard = require("../../atoms/MetricCard");
+
+var _DashboardMetric = require("../../organisms/DashboardMetric");
+
+var _react = require("react");
+
+var _Loading = require("../../atoms/Loading");
+
+var _axios = _interopRequireDefault(require("axios"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var Dashboard = function Dashboard() {
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      metricsData = _useState2[0],
+      setMetricsData = _useState2[1];
+
+  var _useState3 = (0, _react.useState)({}),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      productsByStatus = _useState4[0],
+      setProductsByStatus = _useState4[1];
+
+  var _useState5 = (0, _react.useState)([]),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      requiredProducts = _useState6[0],
+      setRequiredProducts = _useState6[1];
+
+  var _useState7 = (0, _react.useState)({
+    retailerId: null,
+    startDate: null,
+    endDate: null
+  }),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      orderByStatus = _useState8[0],
+      setOrderByStatus = _useState8[1];
+
+  var _useState9 = (0, _react.useState)({
+    retailerId: null,
+    startDate: null,
+    endDate: null
+  }),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      orderByRequired = _useState10[0],
+      setOrderByRequired = _useState10[1];
+
+  var _useState11 = (0, _react.useState)({}),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      retailers = _useState12[0],
+      setRetailers = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(true),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      loading = _useState14[0],
+      setLoading = _useState14[1];
+
+  var loadProductVersions = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(queryObject) {
+      var byStatus,
+          retailerId,
+          startDate,
+          endDate,
+          query,
+          endpoint,
+          response,
+          _args = arguments;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              byStatus = _args.length > 1 && _args[1] !== undefined ? _args[1] : false;
+              retailerId = queryObject.retailerId, startDate = queryObject.startDate, endDate = queryObject.endDate;
+              query = "retailerId=".concat(retailerId, "&startDate=").concat(startDate, "&endDate=").concat(endDate);
+              endpoint = byStatus ? process.env.REACT_APP_READ_ORDERS_BY_STATUS : process.env.REACT_APP_READ_REQUIRED_ORDERS;
+              _context.prev = 4;
+              _context.next = 7;
+              return _axios.default.get("".concat(endpoint, "?").concat(query));
+
+            case 7:
+              response = _context.sent;
+              return _context.abrupt("return", JSON.parse(response.data.body));
+
+            case 11:
+              _context.prev = 11;
+              _context.t0 = _context["catch"](4);
+              console.log(_context.t0);
+
+            case 14:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[4, 11]]);
+    }));
+
+    return function loadProductVersions(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var getRetailers = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+      var retailersResponse, parsed, retailers;
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _context2.next = 2;
+              return _axios.default.get("".concat(process.env.REACT_APP_RETAILER_ENDPOINT), {
+                headers: {
+                  Authorization: sessionStorage.getItem("jwt")
+                }
+              });
+
+            case 2:
+              retailersResponse = _context2.sent;
+              parsed = JSON.parse(retailersResponse.data.body).data;
+              retailers = Object.keys(parsed).map(function (key) {
+                if (key.includes('The Home Depot')) return parsed[key];
+              }).filter(function (f) {
+                return f;
+              });
+              setRetailers(retailers);
+
+            case 6:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    return function getRetailers() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  var loadProductsByStatus = /*#__PURE__*/function () {
+    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(orderByStatus) {
+      var _yield$loadProductVer, orders, fullData, total, R, ACA, PA, inProcess;
+
+      return _regenerator.default.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              _context3.next = 2;
+              return loadProductVersions(orderByStatus, true);
+
+            case 2:
+              _yield$loadProductVer = _context3.sent;
+              orders = _yield$loadProductVer.orders;
+              fullData = _yield$loadProductVer.fullData;
+              total = fullData.total, R = fullData.R, ACA = fullData.ACA, PA = fullData.PA;
+              inProcess = Object.keys(fullData).reduce(function (prev, curr) {
+                return !['total', 'ACA', 'PA', 'R'].includes(curr) ? prev + fullData[curr] : prev;
+              }, 0);
+              setMetricsData([{
+                label: "Productos totales",
+                value: total
+              }, {
+                label: "Productos sin asignar",
+                value: PA + R
+              }, {
+                label: "Productos en proceso",
+                value: inProcess
+              }, {
+                label: "Productos terminados",
+                value: ACA
+              }]);
+              setProductsByStatus(orders);
+
+            case 9:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+
+    return function loadProductsByStatus(_x2) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+
+  var loadRequiredProducts = /*#__PURE__*/function () {
+    var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(orderByRequired) {
+      var _yield$loadProductVer2, dates;
+
+      return _regenerator.default.wrap(function _callee4$(_context4) {
+        while (1) {
+          switch (_context4.prev = _context4.next) {
+            case 0:
+              _context4.next = 2;
+              return loadProductVersions(orderByRequired);
+
+            case 2:
+              _yield$loadProductVer2 = _context4.sent;
+              dates = _yield$loadProductVer2.dates;
+              setRequiredProducts(dates);
+
+            case 5:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4);
+    }));
+
+    return function loadRequiredProducts(_x3) {
+      return _ref4.apply(this, arguments);
+    };
+  }();
+
+  (0, _react.useEffect)(function () {
+    var today = new Date();
+    var firstWeekDay = today.getDate() - today.getDay();
+    var startDate = "".concat(today.getFullYear(), "-").concat(today.getMonth() + 1, "-").concat(firstWeekDay);
+    var endDate = "".concat(today.getFullYear(), "-").concat(today.getMonth() + 1, "-").concat(today.getDate());
+    var queryObject = {
+      retailerId: "58",
+      startDate: startDate,
+      endDate: endDate
+    };
+    setOrderByStatus(queryObject);
+    setOrderByRequired(queryObject);
+    getRetailers();
+    loadProductsByStatus(queryObject);
+    loadRequiredProducts(queryObject);
+  }, []);
+  (0, _react.useEffect)(function () {
+    (orderByRequired === null || orderByRequired === void 0 ? void 0 : orderByRequired.retailerId) && (orderByStatus === null || orderByStatus === void 0 ? void 0 : orderByStatus.retailerId) && metricsData.length > 0 && setLoading(false);
+  }, [orderByRequired, orderByStatus, metricsData]);
+  return loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.Loading, {}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "metric-cards",
+      children: metricsData.map(function (metric, index) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MetricCard.MetricCard, {
+          label: metric.label,
+          number: metric.value
+        }, "".concat(index, "-").concat(metric.value));
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "metrics-main-container",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_DashboardMetric.DashboardMetric, {
+        label: "Productos por estatus",
+        description: "Revisa el avance individual de cada estatus, utiliza los filtros para encontrar información precisa.",
+        dataObject: productsByStatus,
+        retailerSelected: orderByStatus.retailerId,
+        retailers: retailers,
+        queryObject: orderByStatus,
+        setQueryObject: function setQueryObject(evt) {
+          loadProductsByStatus(evt);
+          setOrderByStatus(evt);
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DashboardMetric.DashboardMetric, {
+        label: "Productos solicitados",
+        description: "Filtra los productos solicitados por fecha y alcance para revisar rápidamente el flujo de trabajo.",
+        dataObject: requiredProducts,
+        type: "line",
+        indexAxis: "x",
+        scale: "x",
+        displayScale: true,
+        retailers: retailers,
+        retailerSelected: orderByRequired.retailerId,
+        queryObject: orderByRequired,
+        setQueryObject: function setQueryObject(evt) {
+          loadRequiredProducts(evt);
+          setOrderByRequired(evt);
+        }
+      })]
+    })]
+  });
+};
+
+exports.Dashboard = Dashboard;

package/dist/components/pages/Dashboard/styles.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Container = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject;
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 30px;\n  .metric-cards {\n    display: flex;\n\n    > * + * {\n      margin-left: 10px;\n    }\n\n    & + * {\n      margin-top: 10px;\n    }\n  }\n\n  .metrics-main-container {\n    display: flex;\n\n    > * + * {\n      margin-left: 10px;\n    }\n  }\n"])));
+
+exports.Container = Container;

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

@@ -36,146 +36,98 @@ ProviderProductEditionDefault.args = {
   category: 846,
   version: 2,
   productSelected: {
-    articleStatus: "ACA",
-    version: 5,
-    missing: {},
+    orderId: 2446,
+    article_status: "AP",
+    datasheet_status: "AP",
+    description_status: "AP",
+    images_status: "ACA",
+    prio: "none",
+    version: 2,
+    brand: null,
     article: {
-      category: "Materiales de Construcción|Impermeabilizantes y Recubrimientos|Selladores",
-      company_name: "SIKA MEXICANA S.A. DE C.V.",
-      company_id: 383,
-      id_category: "2249",
-      id_article: 29457,
-      name: "SIKA TECHO FRESCO SUPER 15",
-      upc: "111187"
+      category: "Organizadores y Closets|Accesorios de Lavandería|Organizadores de Lavandería",
+      company_name: "WOMEX SA DE CV",
+      id_company: 424,
+      country: null,
+      id_category: "2522",
+      id_article: 78773,
+      name: "RACK PARA ROPA DOBLE NEGRO",
+      upc: "168462"
     },
-    asignations: [],
     retailers: [{
       id: 58,
-      name: "The Home Depot Golden",
-      country: "México",
-      id_region: 1,
-      active: 1
-    }, {
-      id: 59,
-      name: "The Home Depot Platinum",
-      country: "México",
-      id_region: 1,
-      active: 1
-    }, {
-      id: 61,
-      name: "Home Depot TAB",
-      country: "México",
-      id_region: 1,
-      active: 1
+      name: "The Home Depot Golden"
     }],
-    percentage: 33.35,
+    services: {
+      datasheets: 1,
+      descriptions: 1,
+      images: 1
+    },
+    statusByRetailer: {
+      58: {
+        datasheet: "AP",
+        description: "AP",
+        images: "ACA"
+      }
+    },
+    retailersWithService: ["58"],
+    id_article: 78773,
     retailersAvailable: [{
       id: 58,
-      name: "The Home Depot Golden",
-      country: "México",
-      id_region: 1,
-      active: 1
-    }, {
-      id: 59,
-      name: "The Home Depot Platinum",
-      country: "México",
-      id_region: 1,
-      active: 1
-    }, {
-      id: 61,
-      name: "Home Depot TAB",
-      country: "México",
-      id_region: 1,
-      active: 1
-    }],
-    upc: "111187",
-    name: "SIKA TECHO FRESCO SUPER 15",
-    categoryName: "Materiales de Construcción|Impermeabilizantes y Recubrimientos|Selladores",
-    id_category: "2249",
-    id_article: 29457,
-    services: [{
-      id_article: 29457,
-      service: "datasheet",
-      quantity: 1,
-      price: 0,
-      id_user: 1237,
-      datasheet_common: null,
-      discount: null
+      name: "The Home Depot Golden"
     }]
   },
   productToEdit: {
-    idCategory: "2249",
-    ArticleId: 29457,
-    product: [{
-      articleStatus: "ACA",
-      version: 5,
-      missing: {},
+    ArticleId: 78773,
+    idCategory: "2522",
+    product: {
+      orderId: 2446,
+      article_status: "AP",
+      datasheet_status: "AP",
+      description_status: "AP",
+      images_status: "ACA",
+      prio: "none",
+      version: 2,
+      brand: null,
       article: {
-        category: "Materiales de Construcción|Impermeabilizantes y Recubrimientos|Selladores",
-        company_name: "SIKA MEXICANA S.A. DE C.V.",
-        company_id: 383,
-        id_category: "2249",
-        id_article: 29457,
-        name: "SIKA TECHO FRESCO SUPER 15",
-        upc: "111187"
+        category: "Organizadores y Closets|Accesorios de Lavandería|Organizadores de Lavandería",
+        company_name: "WOMEX SA DE CV",
+        id_company: 424,
+        country: null,
+        id_category: "2522",
+        id_article: 78773,
+        name: "RACK PARA ROPA DOBLE NEGRO",
+        upc: "168462"
       },
-      asignations: [],
       retailers: [{
         id: 58,
-        name: "The Home Depot Golden",
-        country: "México",
-        id_region: 1,
-        active: 1
-      }, {
-        id: 59,
-        name: "The Home Depot Platinum",
-        country: "México",
-        id_region: 1,
-        active: 1
-      }, {
-        id: 61,
-        name: "Home Depot TAB",
-        country: "México",
-        id_region: 1,
-        active: 1
+        name: "The Home Depot Golden"
       }],
-      percentage: 33.35,
+      services: {
+        datasheets: 1,
+        descriptions: 1,
+        images: 1
+      },
+      statusByRetailer: {
+        58: {
+          datasheet: "AP",
+          description: "AP",
+          images: "ACA"
+        }
+      },
+      retailersWithService: ["58"],
+      id_article: 78773,
       retailersAvailable: [{
         id: 58,
-        name: "The Home Depot Golden",
-        country: "México",
-        id_region: 1,
-        active: 1
-      }, {
-        id: 59,
-        name: "The Home Depot Platinum",
-        country: "México",
-        id_region: 1,
-        active: 1
-      }, {
-        id: 61,
-        name: "Home Depot TAB",
-        country: "México",
-        id_region: 1,
-        active: 1
-      }],
-      upc: "111187",
-      name: "SIKA TECHO FRESCO SUPER 15",
-      categoryName: "Materiales de Construcción|Impermeabilizantes y Recubrimientos|Selladores",
-      id_category: "2249",
-      id_article: 29457,
-      services: [{
-        id_article: 29457,
-        service: "datasheet",
-        quantity: 1,
-        price: 0,
-        id_user: 1237,
-        datasheet_common: null,
-        discount: null
+        name: "The Home Depot Golden"
       }]
-    }]
+    }
+  },
+  location: {
+    state: {
+      origin: "Contentoh"
+    }
   },
-  location: {},
   user: {
     id_user: 1237,
     name: "The Home",