contentoh-components-library 21.4.42 → 21.4.45

package/src/components/organisms/InputGroup/index.js

@@ -3,6 +3,7 @@ import { ScreenHeader } from "../../atoms/ScreenHeader";
 import { TagAndInput } from "../../molecules/TagAndInput";
 import { BoxOnboarding } from "../BoxOnboarding";
 import { Box } from "../Box";
+import { useEffect } from "react";
 
 export const InputGroup = ({
   inputGroup = {},
@@ -19,11 +20,11 @@ export const InputGroup = ({
   dinamicHeight,
   compare,
   groupData = [],
-  isShowbox
+  isShowbox,
+  setUpdatedBoxData
 }) => {
-
-  console.log('groupData: ', typeof groupData);
-  console.log('groupData: ', groupData);
+  console.log("groupData: ", typeof groupData);
+  console.log("groupData: ", groupData);
   const inputTypeValue = (type) => {
     switch (type) {
       case "Booleano":
@@ -36,123 +37,133 @@ export const InputGroup = ({
   };
 
   const isOnboarding = () => {
-    const contentBoxAttribute = groupData.find(({dataGroup}) => dataGroup === 'Caja')
-    if(contentBoxAttribute) {
-      console.log('content box attribute');
+    const contentBoxAttribute = groupData.find(
+      ({ dataGroup }) => dataGroup === "Caja"
+    );
+    if (contentBoxAttribute) {
+      console.log("content box attribute");
     } else {
-      console.log('dont content box attribute');
+      console.log("dont content box attribute");
     }
     return contentBoxAttribute;
-  }
-  
+  };
 
   const isEquals = (dataInputsVal, auditInputsVal) => {
     const result = dataInputsVal === auditInputsVal;
+    console.log("Input Val",dataInputsVal)
     return result;
   };
-
-  return (
+  return inputGroup.groupId !== "16" ? (
     <>
-    <Container
-      className={
-        activeSection === "Ficha técnica"
-          ? "datasheets-layout"
-          : "descriptions-layout"
-      }
-    >
-      {inputGroup?.dataGroup && (
-        <ScreenHeader
-          headerType={"retailer-name-header"}
-          text={inputGroup?.dataGroup}
-        />
-      )}
-      <div className="inputs-container">
-        {inputGroup?.inputs?.map((input, index) =>
-          activeSection === "Ficha técnica" ? (
-            <>
-            
-            <TagAndInput
-              key={
-                index +
-                "-" +
-                dataInputs[input]?.value +
-                "-" +
-                dataInputs[input]?.id +
-                "-" +
-                compare
-              }
-              //disabled={input === 40001}
-              disabled={false}
-              inputId={dataInputs[input]?.id}
-              version={version}
-              inputType={inputTypeValue(dataInputs[input]?.type)}
-              label={
-                dataInputs[input]?.name +
-                (dataInputs[input]?.required ? "*" : "")
-              }
-              value={
-                compare ? auditInputs[input]?.value : dataInputs[input]?.value
-              }
-              inputPlaceHolder={input?.placeholder}
-              articleId={articleId}
-              isRequired={dataInputs[input]?.required}
-              updatedDatasheets={updatedDatasheets}
-              setUpdatedDatasheets={setUpdatedDatasheets}
-              maxChar={
-                dataInputs[input]?.max_chars
-                  ? dataInputs[input]?.max_chars
-                  : 999
-              }
-              optionList={dataInputs[input]?.option_list}
-              description={dataInputs[input]?.description}
-              showTooltip={true}
-              auditClass={
-                compare &&
-                !isEquals(dataInputs[input].value, auditInputs[input].value)
-                  ? "audit-class"
-                  : ""
-              }
-            />
-            </>
-            
-          ) : (
-            <TagAndInput
-              key={index + "-" + input?.value + "-" + compare}
-              inputId={input.id}
-              index={index}
-              inputType={"textarea"}
-              label={input?.name + (input.required ? "*" : "")}
-              value={
-                compare ? auditInputGroup?.inputs[index]?.value : input?.value
-              }
-              isRequired={input.required}
-              maxChar={input.max_chars}
-              inputPlaceHolder={input?.placeholder}
-              updatedDescriptions={updatedDescriptions}
-              setUpdatedDescriptions={setUpdatedDescriptions}
-              articleId={articleId}
-              version={version}
-              dinamicHeight={dinamicHeight}
-              description={input?.description}
-              showTooltip={true}
-              auditClass={
-                compare &&
-                !isEquals(input?.value, auditInputGroup?.inputs[index]?.value)
-                  ? "audit-class"
-                  : ""
-              }
-            />            
-          )
+      <Container
+        className={
+          activeSection === "Ficha técnica"
+            ? "datasheets-layout"
+            : "descriptions-layout"
+        }
+      >
+        {inputGroup?.dataGroup && (
+          <ScreenHeader
+            headerType={"retailer-name-header"}
+            text={`${inputGroup.groupId} - ${inputGroup?.dataGroup}`}
+          />
         )}
-      </div>
-    </Container>
-    <Container className={
-        activeSection === "Ficha técnica"
-          ? "datasheets-layout"
-          : "descriptions-layout"
-      }>
-      { isShowbox && isOnboarding && <Box/>}
-    </Container>
+        <div className="inputs-container">
+          {inputGroup?.inputs?.map((input, index) =>
+            activeSection === "Ficha técnica" ? (
+              <>
+                <TagAndInput
+                  key={
+                    index +
+                    "-" +
+                    dataInputs[input]?.value +
+                    "-" +
+                    dataInputs[input]?.id +
+                    "-" +
+                    compare
+                  }
+                  //disabled={input === 40001}
+                  disabled={false}
+                  inputId={dataInputs[input]?.id}
+                  version={version}
+                  inputType={inputTypeValue(dataInputs[input]?.type)}
+                  label={
+                    dataInputs[input]?.name +
+                    (dataInputs[input]?.required ? "*" : "")
+                  }
+                  value={
+                    compare
+                      ? auditInputs[input]?.value
+                      : dataInputs[input]?.value
+                  }
+                  inputPlaceHolder={input?.placeholder}
+                  articleId={articleId}
+                  isRequired={dataInputs[input]?.required}
+                  updatedDatasheets={updatedDatasheets}
+                  setUpdatedDatasheets={setUpdatedDatasheets}
+                  maxChar={
+                    dataInputs[input]?.max_chars
+                      ? dataInputs[input]?.max_chars
+                      : 999
+                  }
+                  optionList={dataInputs[input]?.option_list}
+                  description={dataInputs[input]?.description}
+                  showTooltip={true}
+                  auditClass={
+                    compare &&
+                    !isEquals(dataInputs[input].value, auditInputs[input].value)
+                      ? "audit-class"
+                      : ""
+                  }
+                />
+              </>
+            ) : (
+              <TagAndInput
+                key={index + "-" + input?.value + "-" + compare}
+                inputId={input.id}
+                index={index}
+                inputType={"textarea"}
+                label={input?.name + (input.required ? "*" : "")}
+                value={
+                  compare ? auditInputGroup?.inputs[index]?.value : input?.value
+                }
+                isRequired={input.required}
+                maxChar={input.max_chars}
+                inputPlaceHolder={input?.placeholder}
+                updatedDescriptions={updatedDescriptions}
+                setUpdatedDescriptions={setUpdatedDescriptions}
+                articleId={articleId}
+                version={version}
+                dinamicHeight={dinamicHeight}
+                description={input?.description}
+                showTooltip={true}
+                auditClass={
+                  compare &&
+                  !isEquals(input?.value, auditInputGroup?.inputs[index]?.value)
+                    ? "audit-class"
+                    : ""
+                }
+              />
+            )
+          )}
+        </div>
+      </Container>
     </>
+  ) : (
+    isShowbox && (
+      <Container
+        className={
+          activeSection === "Ficha técnica"
+            ? "datasheets-layout"
+            : "descriptions-layout"
+        }
+      >
+        <Box
+          inputGroup={inputGroup}
+          dataInputs={dataInputs}
+          onChange={setUpdatedBoxData}
+        />
+      </Container>
+    )
   );
 };

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

@@ -42,6 +42,7 @@ import { useCloseModal } from "../../../global-files/customHooks";
 import { createMessage, sendMessage } from "../RetailerProductEdition/utils";
 import { Modal } from "../../organisms/Modal";
 import { ButtonV2 } from "../../atoms/ButtonV2";
+import { Box } from "../../organisms/Box";
 
 const reducerImages = (state, action) => {
   let { values, attrForImgs, inputsByRetailer } = state;
@@ -143,6 +144,7 @@ export const ProviderProductEdition = ({
   const [datasheets, setDatasheets] = useState([]);
   const [images, setImages] = useReducer(reducerImages, {});
   const [showModal, setShowModal] = useState(false);
+  const [boxData, setBoxData] = useState();
   const { getRootProps, getInputProps } = useDropzone({
     accept: "image/*",
     noKeyboard: true,
@@ -680,11 +682,14 @@ export const ProviderProductEdition = ({
   };
 
   const saveDatasheets = async () => {
+    
     setLoading(true);
     const dataObject = {
       articleId: product?.id_article,
       articleData: updatedDatasheets,
+      boxData,
     };
+    console.log("boxData guardado", boxData);
     if (product?.orderId) dataObject["orderId"] = product?.orderId;
     try {
       const res = await axios.put(
@@ -703,7 +708,8 @@ export const ProviderProductEdition = ({
       }
     } catch (error) {
       console.log(error);
-    }
+    } 
+    console.log(dataObject)
   };
 
   const updateImages = useCallback(async () => {
@@ -1453,21 +1459,28 @@ export const ProviderProductEdition = ({
                 )}
                 {activeTab === "Ficha técnica" &&
                   (product?.datasheet_status !== "NS" ? (
-                    datasheets[0]?.data?.map((dataGroup, index) => (
-                      <InputGroup
-                        key={index + "-" + activeRetailer.name}
-                        articleId={product.id_article}
-                        version={version}
-                        activeSection={activeTab}
-                        inputGroup={dataGroup}
-                        dataInputs={datasheets[1]}
-                        updatedDatasheets={updatedDatasheets}
-                        setUpdatedDatasheets={setUpdatedDatasheets}
-                        isShowbox={true}
-                        groupData = { services[0][activeRetailer.id].data }
-                        //enableActions={enableActions(product.version_status)} ADD THIS VALIDATION
-                      />
-                    ))
+                    <div>
+                      {datasheets[0]?.data?.map((dataGroup, index) => (
+                        <InputGroup
+                          key={index + "-" + activeRetailer.name}
+                          articleId={product.id_article}
+                          version={version}
+                          activeSection={activeTab}
+                          inputGroup={dataGroup}
+                          dataInputs={datasheets[1]}
+                          updatedDatasheets={updatedDatasheets}
+                          setUpdatedDatasheets={setUpdatedDatasheets}
+                          isShowbox={true}
+                          groupData={services[0][activeRetailer.id].data}
+                          setUpdatedBoxData={(e) => {
+                            setBoxData(e);
+                            console.log("UNO",e);
+                          }}
+                          index={index}
+                          //enableActions={enableActions(product.version_status)} ADD THIS VALIDATION
+                        ></InputGroup>
+                      ))}
+                    </div>
                   ) : (
                     <ScreenHeader
                       text={"No cuentas con este servicio"}