contentoh-components-library 21.4.75 → 21.4.78

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/assets/images/Icons/close.svg +8 -0
  2. package/dist/assets/images/Icons/edit.svg +8 -0
  3. package/dist/assets/images/Icons/save.svg +8 -0
  4. package/dist/components/atoms/ObservationFlag/ObservationFlag.stories.js +38 -0
  5. package/dist/components/atoms/ObservationFlag/index.js +52 -0
  6. package/dist/components/atoms/ObservationFlag/styles.js +18 -0
  7. package/dist/components/molecules/Phase/index.js +70 -16
  8. package/dist/components/molecules/ProductNameHeader/index.js +8 -3
  9. package/dist/components/organisms/DragAndDropPhases/index.js +166 -114
  10. package/dist/components/organisms/DragAndDropPhases/styles.js +1 -1
  11. package/dist/components/organisms/EditGroup/EditGroup.stories.js +5 -4
  12. package/dist/components/organisms/EditGroup/index.js +445 -127
  13. package/dist/components/organisms/EditGroup/styles.js +8 -16
  14. package/dist/components/organisms/FullProductNameHeader/index.js +3 -1
  15. package/dist/components/organisms/VersionSelector/index.js +101 -167
  16. package/dist/components/pages/RetailerProductEdition/index.js +60 -149
  17. package/package.json +2 -1
  18. package/src/assets/images/Icons/close.svg +8 -0
  19. package/src/assets/images/Icons/edit.svg +8 -0
  20. package/src/assets/images/Icons/save.svg +8 -0
  21. package/src/components/atoms/ObservationFlag/ObservationFlag.stories.js +20 -0
  22. package/src/components/atoms/ObservationFlag/index.js +33 -0
  23. package/src/components/atoms/ObservationFlag/styles.js +3 -0
  24. package/src/components/atoms/TabSection/index.js +1 -1
  25. package/src/components/molecules/Phase/index.js +112 -69
  26. package/src/components/molecules/ProductNameHeader/index.js +5 -1
  27. package/src/components/organisms/DragAndDropPhases/index.js +106 -75
  28. package/src/components/organisms/DragAndDropPhases/styles.js +27 -0
  29. package/src/components/organisms/EditGroup/EditGroup.stories.js +5 -4
  30. package/src/components/organisms/EditGroup/index.js +271 -108
  31. package/src/components/organisms/EditGroup/styles.js +102 -10
  32. package/src/components/organisms/FullProductNameHeader/index.js +2 -0
  33. package/src/components/organisms/VersionSelector/index.js +100 -99
  34. package/src/components/pages/RetailerProductEdition/index.js +18 -143
@@ -1,105 +1,106 @@
1
- import { Container } from "./styles";
2
- import axios from "axios";
3
- import { useEffect, useState } from "react";
4
- import { ScreenHeader } from "../../atoms/ScreenHeader";
5
- import { Button } from "../../atoms/GeneralButton";
6
- import addVersion from "../../../assets/images/versionSelector/addVersion.svg";
7
- import closeIcon from "../../../assets/images/versionSelector/closeVersionSelector.svg";
8
- import { GlobalColors, FontFamily } from "../../../global-files/variables";
9
- import { VersionItem } from "../../molecules/VersionItem";
10
- import { CreateVersion } from "../../organisms/CreateVersion";
11
- import { useCloseModal } from "../../../global-files/customHooks";
1
+ // import { Container } from "./styles";
2
+ // import axios from "axios";
3
+ // import { useEffect, useState } from "react";
4
+ // import { ScreenHeader } from "../../atoms/ScreenHeader";
5
+ // import { Button } from "../../atoms/GeneralButton";
6
+ // import addVersion from "../../../assets/images/versionSelector/addVersion.svg";
7
+ // import closeIcon from "../../../assets/images/versionSelector/closeVersionSelector.svg";
8
+ // import { GlobalColors } from "../../../../dist/global-files/variables";
9
+ // import { FontFamily } from "../../../global-files/variables";
10
+ // import { VersionItem } from "../../molecules/VersionItem";
11
+ // import { CreateVersion } from "../../organisms/CreateVersion";
12
+ // import { useCloseModal } from "../../../global-files/customHooks";
12
13
 
13
- export const VersionSelector = ({
14
- modalId,
15
- articleId,
16
- setVersion,
17
- companyName,
18
- currentVersion,
19
- setShowVersionSelector,
20
- jwt,
21
- }) => {
22
- const [versions, setVersions] = useState([]);
23
- const [showCreateVersion, setShowCreateVersion] =
24
- useCloseModal("create-version");
25
- const [reload, setReload] = useState(false);
14
+ // export const VersionSelector = ({
15
+ // modalId,
16
+ // articleId,
17
+ // setVersion,
18
+ // companyName,
19
+ // currentVersion,
20
+ // setShowVersionSelector,
21
+ // jwt,
22
+ // }) => {
23
+ // const [versions, setVersions] = useState([]);
24
+ // const [showCreateVersion, setShowCreateVersion] =
25
+ // useCloseModal("create-version");
26
+ // const [reload, setReload] = useState(false);
26
27
 
27
- const loadProductVersions = async (articleId) => {
28
- try {
29
- const response = await axios.get(
30
- `${process.env.REACT_APP_VERSIONS_ENDPOINT}?articleId=${articleId}&provider=true`,
31
- {
32
- headers: {
33
- Authorization: jwt,
34
- },
35
- }
36
- );
28
+ // const loadProductVersions = async (articleId) => {
29
+ // try {
30
+ // const response = await axios.get(
31
+ // `${process.env.REACT_APP_VERSIONS_ENDPOINT}?articleId=${articleId}&provider=true`,
32
+ // {
33
+ // headers: {
34
+ // Authorization: jwt,
35
+ // },
36
+ // }
37
+ // );
37
38
 
38
- const versionList = JSON.parse(response.data.body).data;
39
- setVersions(versionList);
40
- } catch (error) {
41
- console.log(error);
42
- }
43
- };
39
+ // const versionList = JSON.parse(response.data.body).data;
40
+ // setVersions(versionList);
41
+ // } catch (error) {
42
+ // console.log(error);
43
+ // }
44
+ // };
44
45
 
45
- useEffect(() => {
46
- const ac = new AbortController();
47
- loadProductVersions(articleId);
46
+ // useEffect(() => {
47
+ // const ac = new AbortController();
48
+ // loadProductVersions(articleId);
48
49
 
49
- return () => {
50
- setVersions([]);
51
- setShowCreateVersion(false);
52
- return () => ac.abort(); // Abort both fetches on unmount
53
- };
54
- }, [reload]);
50
+ // return () => {
51
+ // setVersions([]);
52
+ // setShowCreateVersion(false);
53
+ // return () => ac.abort(); // Abort both fetches on unmount
54
+ // };
55
+ // }, [reload]);
55
56
 
56
- return (
57
- <Container id={modalId}>
58
- <div className="versions-header">
59
- <ScreenHeader
60
- text={"Versión del producto"}
61
- headerType={"input-name-header"}
62
- color={GlobalColors.white}
63
- fontFamily={FontFamily.Lato}
64
- />
65
- <div className="buttons-container">
66
- <Button
67
- image={addVersion}
68
- buttonType={"circular-button"}
69
- onClick={() => setShowCreateVersion(true)}
70
- id="add-version"
71
- />
72
- <Button
73
- image={closeIcon}
74
- buttonType={"circular-button"}
75
- onClick={() => setShowVersionSelector(false)}
76
- id="close-button"
77
- />
78
- </div>
79
- </div>
80
- <div className="versions-container">
81
- {versions?.map((item) => (
82
- <VersionItem
83
- key={item.version}
84
- version={item.version}
85
- articleStatus={item.article_status}
86
- currentVersion={item.version === currentVersion}
87
- productOwner={companyName}
88
- setVersion={setVersion}
89
- timestamp={item.timestamp}
90
- />
91
- ))}
92
- </div>
93
- {showCreateVersion && (
94
- <CreateVersion
95
- articleId={articleId}
96
- version={currentVersion}
97
- versionsList={versions}
98
- setShowCreateVersion={setShowCreateVersion}
99
- realoadVersion={() => setReload(!reload)}
100
- jwt={jwt}
101
- />
102
- )}
103
- </Container>
104
- );
105
- };
57
+ // return (
58
+ // <Container id={modalId}>
59
+ // <div className="versions-header">
60
+ // <ScreenHeader
61
+ // text={"Versión del producto"}
62
+ // headerType={"input-name-header"}
63
+ // color={GlobalColors.white}
64
+ // fontFamily={FontFamily.Lato}
65
+ // />
66
+ // <div className="buttons-container">
67
+ // <Button
68
+ // image={addVersion}
69
+ // buttonType={"circular-button"}
70
+ // onClick={() => setShowCreateVersion(true)}
71
+ // id="add-version"
72
+ // />
73
+ // <Button
74
+ // image={closeIcon}
75
+ // buttonType={"circular-button"}
76
+ // onClick={() => setShowVersionSelector(false)}
77
+ // id="close-button"
78
+ // />
79
+ // </div>
80
+ // </div>
81
+ // <div className="versions-container">
82
+ // {versions?.map((item) => (
83
+ // <VersionItem
84
+ // key={item.version}
85
+ // version={item.version}
86
+ // articleStatus={item.article_status}
87
+ // currentVersion={item.version === currentVersion}
88
+ // productOwner={companyName}
89
+ // setVersion={setVersion}
90
+ // timestamp={item.timestamp}
91
+ // />
92
+ // ))}
93
+ // </div>
94
+ // {showCreateVersion && (
95
+ // <CreateVersion
96
+ // articleId={articleId}
97
+ // version={currentVersion}
98
+ // versionsList={versions}
99
+ // setShowCreateVersion={setShowCreateVersion}
100
+ // realoadVersion={() => setReload(!reload)}
101
+ // jwt={jwt}
102
+ // />
103
+ // )}
104
+ // </Container>
105
+ // );
106
+ // };
@@ -224,6 +224,7 @@ export const RetailerProductEdition = ({
224
224
  const [auditDescriptions, setAuditDescriptions] = useState([]);
225
225
  const [auditImages, setAuditImages] = useState([]);
226
226
  const [compare, setCompare] = useState(false);
227
+ const [observation,setObservation] = useState();
227
228
  const [valRejAll, setValRejAll] = useState(false);
228
229
 
229
230
  const [desc, setDesc] = useState([]);
@@ -452,7 +453,7 @@ export const RetailerProductEdition = ({
452
453
  }, [percentages]);
453
454
 
454
455
  useEffect(() => {
455
- getInputsData(services, activeRetailer, setDatasheets, setDescriptions);
456
+ //getInputsData(services, activeRetailer, setDatasheets, setDescriptions);
456
457
  auditableVersion && loadAuditableData();
457
458
  setActivePercentage(Math.round(activeRetailer?.percentage, 0));
458
459
  activeRetailer?.id &&
@@ -833,84 +834,6 @@ export const RetailerProductEdition = ({
833
834
  }
834
835
  };
835
836
 
836
- // const sendToFacilitator = async (result) => {
837
- // setLoading(true);
838
- // try {
839
- // let concept = getConcept(activeTab);
840
-
841
- // const productTemp = { ...product };
842
- // const evalStatus = retailerStatus;
843
- // const articleId = product.article.id_article;
844
- // const orderId = product.orderId;
845
-
846
- // // const body = {
847
- // // orderArticleRetailers: [
848
- // // { orderId, articleId, retailersIds: [activeRetailer.id] },
849
- // // ],
850
- // // isAproved: false,
851
- // // service: concept,
852
- // // };
853
-
854
- // const body = {
855
- // articleId: product.article.id_article,
856
- // orderId: product.orderId,
857
- // concept: concept,
858
- // result: result,
859
- // evalStatus: evalStatus,
860
- // retailerId: activeRetailer.id,
861
- // };
862
-
863
- // let res;
864
- // let message;
865
- // if (result) {
866
- // body.isAproved = result === "A";
867
- // res = await axios.put(
868
- // `${process.env.REACT_APP_EVALUATION_ENDPOINT}`,
869
- // body,
870
- // {
871
- // headers: {
872
- // Authorization: token,
873
- // },
874
- // }
875
- // );
876
- // console.log(JSON.parse(res.data.body), "res");
877
- // getServices();
878
- // } else {
879
- // const specialistDone = ["RC", "RA", "CA"].includes(evalStatus);
880
-
881
- // if (specialistDone) {
882
- // message = `${activeTab} enviada a facilitador`;
883
- // getSectionIcon();
884
- // } else if (["IE", "AC", "RP", "RCA"].includes(evalStatus)) {
885
- // message = "Evaluación enviada";
886
- // getSectionIcon();
887
- // }
888
- // res = await axios.put(
889
- // `${process.env.REACT_APP_EVALUATION_ENDPOINT}`,
890
- // body,
891
- // {
892
- // headers: {
893
- // Authorization: token,
894
- // },
895
- // }
896
- // );
897
- // }
898
- // if (res.data.statusCode === 200) {
899
- // const response = JSON.parse(res.data.body)?.successfulData;
900
- // const statusObject =
901
- // response[`${orderId}-${articleId}-${activeRetailer.id}`];
902
- // productTemp.status = statusObject["generalStatus"];
903
- // productTemp[`${concept}_status`] = statusObject[`${concept}Status`];
904
- // await loadData();
905
- // if (message) setMessage(message);
906
- // sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
907
- // setProduct(productTemp);
908
- // }
909
- // } catch (error) {
910
- // console.log(error);
911
- // }
912
- // setLoading(false);
913
- // };
914
837
  const sendToFacilitator = async (result) => {
915
838
  setLoading(true);
916
839
  try {
@@ -1300,70 +1223,6 @@ export const RetailerProductEdition = ({
1300
1223
  setSaving(loading);
1301
1224
  }, [loading]);
1302
1225
 
1303
- // const validateAll = async (result) => {
1304
- // try {
1305
- // setLoading(true);
1306
- // const evaluationArray = [];
1307
- // let conceptArray = ["description", "datasheet", "images"];
1308
- // switch (user.id_role) {
1309
- // case 4:
1310
- // conceptArray = ["description", "datasheet"];
1311
- // break;
1312
- // case 5:
1313
- // conceptArray = ["images"];
1314
- // break;
1315
-
1316
- // default:
1317
- // conceptArray = ["description", "datasheet", "images"];
1318
- // break;
1319
- // }
1320
-
1321
- // const isAproved = result === "A";
1322
- // const retailersIds = [];
1323
- // servicesData?.forEach((ret) => {
1324
- // if (!retailersIds.includes(ret.id_retailer))
1325
- // retailersIds.push(ret.id_retailer);
1326
- // });
1327
- // const body = {
1328
- // orderArticleRetailers: [
1329
- // {
1330
- // orderId: product.id_order ?? product.orderId,
1331
- // articleId: product.article.id_article,
1332
- // retailersIds,
1333
- // },
1334
- // ],
1335
- // isAproved,
1336
- // };
1337
- // conceptArray.forEach((concept) => {
1338
- // body.service = concept;
1339
- // evaluationArray.push(
1340
- // axios.put(`${process.env.REACT_APP_EVALUATION_ENDPOINT}`, body, {
1341
- // headers: {
1342
- // Authorization: token,
1343
- // },
1344
- // })
1345
- // );
1346
- // });
1347
-
1348
- // await Promise.all(evaluationArray);
1349
-
1350
- // const productTemp = product;
1351
- // productTemp.status = `${result}A`;
1352
- // productTemp.datasheet_status =
1353
- // productTemp.datasheet_status === "NA" ? "NA" : `${result}A`;
1354
- // productTemp.description_status =
1355
- // productTemp.description_status === "NA" ? "NA" : `${result}A`;
1356
- // productTemp.images_status =
1357
- // productTemp.images_status === "NA" ? "NA" : `${result}A`;
1358
- // sessionStorage.setItem("productSelected", JSON.stringify(productTemp));
1359
- // setProduct(productTemp);
1360
-
1361
- // await loadData();
1362
- // } catch (error) {
1363
- // console.log(error);
1364
- // }
1365
- // };
1366
-
1367
1226
  const validateAll = async (result) => {
1368
1227
  try {
1369
1228
  setLoading(true);
@@ -1423,6 +1282,21 @@ export const RetailerProductEdition = ({
1423
1282
  }
1424
1283
  };
1425
1284
 
1285
+ const getObservation = async () => {
1286
+ const response = await axios.get(
1287
+ `${process.env.REACT_APP_READ_OBSERVATION}?articleId=${product.article.id_article}&orderId=${product?.orderId}`,
1288
+ {
1289
+ headers: {
1290
+ Authorization: sessionStorage.getItem("jwt"),
1291
+ },
1292
+ }
1293
+ );
1294
+ const parseData = JSON.parse(response.data.body).data[0];
1295
+ setObservation( parseData.observations);
1296
+ };
1297
+ useEffect(() => {
1298
+ getObservation();
1299
+ }, []);
1426
1300
  return (
1427
1301
  <Container headerTop={headerTop}>
1428
1302
  <HeaderTop
@@ -1465,6 +1339,7 @@ export const RetailerProductEdition = ({
1465
1339
  <div className="product-information">
1466
1340
  <FullProductNameHeader
1467
1341
  headerData={product}
1342
+ productObservation= {observation}
1468
1343
  percent={activePercentage}
1469
1344
  activeRetailer={activeRetailer}
1470
1345
  servicesData={servicesData}