@jescon-technologies/react-native-ui-kit 0.0.3 → 0.0.5

package/src/Components/CVerificationCard.js

@@ -0,0 +1,2822 @@
+import {
+  View,
+  Text,
+  Dimensions,
+  TouchableOpacity,
+  ScrollView,
+} from 'react-native';
+import React, { useContext, useEffect, useState } from 'react';
+import {
+  CButtonShadow,
+  isNU,
+  isNUL,
+  isNUQ,
+} from '../CommonStyle/ComponentFunctions';
+import CTextHeader from '../Custom/TableComponent/CTextHeader';
+import { normalize } from '../CommonStyle/componentStyle';
+import { Global } from '../../../../../src/Common/Global';
+import { Icons } from '@jescon-technologies/react-native-ui-kit';;
+import moment from 'moment';
+import SCheckBox from '../StaticComponents/SCheckBox';
+import ContextBio from '../ContextAPI/ContextBio';
+import HHeading from '../HOC/HHeading';
+import STextInputNew from './STextInputNew';
+import { Menu, MenuOptions, MenuTrigger } from 'react-native-popup-menu';
+import CDropDownList from '../CustomComponents/CDropDownList';
+import SDatePicker from '../StaticComponents/SDatePicker';
+import { useNavigation } from '../Navigation/useNavigation';
+
+import { SwipeRow } from 'react-native-swipe-list-view';
+import HOCIcons from '../HOC/HOCIcons';
+import HSubHeading from './HSubHeading';
+import SOverlay from '../StaticComponents/SOverlay';
+import { APIURL } from '../../../../../src/Common/apiConstants';
+
+const CVerificationCard = ({ data, index, type, bgColor, sideColor, selectall, setSelectAll }) => {
+  const { invoiceData, setInvoiceData } = useContext(ContextBio);
+  const [leftAction, setLeftAction] = useState(false);
+  const [secondAction, setSecondAction] = useState(false);
+  const [rightAction, setRightAction] = useState(false);
+
+  const navigation = useNavigation();
+  useEffect(() => {
+    // Apply selectAll only when it's TRUE
+    if (selectall != undefined || selectall != null) {
+      console.log('Applying select all:', selectall);
+      console.log('Applying select all: true to index', index);
+      handleDataChange(index, Number(selectall), 'verification');
+    }
+    // When selectall === false, we do NOT touch this box.
+    // The user will handle it manually.
+  }, [selectall]);
+  // run only when selectall changes
+
+  const handleChange = (val) => {
+    handleDataChange(index, Number(val), 'verification');
+
+    // If user unselects any one manually, disable global selectAll
+    if (!val && typeof setSelectAll === 'function') {
+      setSelectAll(false);
+    }
+  };
+
+
+  /**
+   * Toggles the expand state of a specific section in the invoice data.
+   *
+   * - Clones the verification data.
+   * - Flips the 'expand' property for the given index.
+   * - Updates the state with the modified data.
+   *
+   * @param {number} index - Index of the section to toggle.
+   */
+  function handleToggleExpand(index) {
+    // Clone the data and update the specific index
+    const updatedData = [...invoiceData.verification];
+
+    // Toggle the 'expand' property of the specific section (index)
+    updatedData[index] = {
+      ...updatedData[index],
+      expand: !updatedData[index].expand,
+    };
+
+    // Update the state with the modified data
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+    }));
+  }
+
+  /**
+   * Updates a specific field in the invoice verification data.
+   *
+   * - Clones the current verification data.
+   * - Modifies the specified field at the given index.
+   * - Updates the state with the changed data and sets EditStatus to true.
+   *
+   * @param {number} sectionIndex - Index of the section to update.
+   * @param {*} val - New value for the specified field.
+   * @param {string} field - Field name to update.
+   */
+  // FIXME: Original working version without hrsustatus update
+  // function handleDataChange(sectionIndex, val, field) {
+  //   // Clone the data and update the specific index
+  //   const updatedData = [...invoiceData.verification];
+
+  //   const statusField = type === 'Y' ? 'flag' : 'editStatus';
+
+  //   // Update the object at the specific index
+  //   updatedData[sectionIndex] = {
+  //     ...updatedData[sectionIndex],
+  //     [field]: val,
+  //     [statusField]: 1,
+  //   };
+
+  //   console.log('updateddata%%%%%%%%%%%%%%%%%%%',updatedData)
+
+  //   // Update the state with the modified data
+  //   setInvoiceData(prevState => ({
+  //     ...prevState,
+  //     verification: updatedData,
+  //     EditStatus: true,
+  //   }));
+  // }
+
+  // FIXME: Added hrsustatus update
+  function handleDataChange(sectionIndex, val, field) {
+    setInvoiceData(prevState => {
+      const updatedData = [...prevState.verification];
+
+      const statusField = type === 'Y' ? 'flag' : 'editStatus';
+
+      let updatedSection = {
+        ...updatedData[sectionIndex],
+        [field]: val,
+        [statusField]: 1,
+      };
+
+      // Handle 'B' type case
+      if (type === 'B' && Array.isArray(updatedSection.details)) {
+        updatedSection.details = updatedSection.details.map(detail =>
+          detail.suoptiondetail === 22708
+            ? { ...detail, hrsustatus: 3 }
+            : detail
+        );
+      }
+
+      updatedData[sectionIndex] = updatedSection;
+
+      return {
+        ...prevState,
+        verification: updatedData,
+        EditStatus: true,
+      };
+    });
+  }
+
+
+  function handleDetailDataChange(sectionIndex, detailIndex, val, field) {
+    // Clone the data and update the specific section and detail
+    const updatedData = [...invoiceData.verification];
+
+    // Update the specific detail within the section
+    updatedData[sectionIndex].details[detailIndex] = {
+      ...updatedData[sectionIndex].details[detailIndex],
+      [field]: val,
+    };
+
+    // Update the state with the modified data
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateRequestNature(sectionIndex, val) {
+    const updatedData = [...invoiceData.verification];
+
+    // Update the requestnature and requestnaturename for the given section
+    updatedData[sectionIndex] = {
+      ...updatedData[sectionIndex],
+      requestnature: val.datavalue,
+      // requestnaturename: val.displayvalue,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateQualityNature(sectionIndex, detailIndex, val) {
+    const updatedData = [...invoiceData.verification];
+
+    updatedData[sectionIndex].details[detailIndex] = {
+      ...updatedData[sectionIndex].details[detailIndex],
+      qualitynature: val.datavalue,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateProductNature(sectionIndex, detailIndex, rawIndex, val) {
+    const updatedData = [...invoiceData.verification];
+
+    updatedData[sectionIndex].details[detailIndex].WorkorderProductDetail[
+      rawIndex
+    ] = {
+      ...updatedData[sectionIndex].details[detailIndex].WorkorderProductDetail[
+      rawIndex
+      ],
+      qualitynature: val.datavalue,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateByProductNature(sectionIndex, detailIndex, rawIndex, val) {
+    const updatedData = [...invoiceData.verification];
+
+    updatedData[sectionIndex].details[detailIndex].WorkorderByProductDetail[
+      rawIndex
+    ] = {
+      ...updatedData[sectionIndex].details[detailIndex]
+        .WorkorderByProductDetail[rawIndex],
+      // productnature: val.datavalue,
+      qualitynature: val.datavalue,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateProductReason(
+    sectionIndex,
+    detailIndex,
+    rawIndex,
+    val,
+    field,
+  ) {
+    const updatedData = [...invoiceData.verification];
+
+    updatedData[sectionIndex].details[detailIndex].WorkorderProductDetail[
+      rawIndex
+    ] = {
+      ...updatedData[sectionIndex].details[detailIndex].WorkorderProductDetail[
+      rawIndex
+      ],
+      [field]: val,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function updateByProductReason(
+    sectionIndex,
+    detailIndex,
+    rawIndex,
+    val,
+    field,
+  ) {
+    const updatedData = [...invoiceData.verification];
+
+    updatedData[sectionIndex].details[detailIndex].WorkorderByProductDetail[
+      rawIndex
+    ] = {
+      ...updatedData[sectionIndex].details[detailIndex]
+        .WorkorderByProductDetail[rawIndex],
+      [field]: val,
+      editStatus: 1,
+    };
+
+    // Set the updated data back to state
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+      EditStatus: true,
+    }));
+  }
+
+  function handleToggleExpandField(index, detailsIndex, field) {
+    // Clone the data and update the specific section of verification
+    const updatedData = [...invoiceData.verification];
+
+    // Check if detailsData exists and update the 'expand' property of the specific details section (detailsIndex)
+    const updatedDetailsData = [...updatedData[index].details];
+
+    if (updatedDetailsData && updatedDetailsData[detailsIndex] !== undefined) {
+      updatedDetailsData[detailsIndex] = {
+        ...updatedDetailsData[detailsIndex],
+        [field]: !updatedDetailsData[detailsIndex][field],
+      };
+    }
+
+    // Set the updated detailsData back into the verification data
+    updatedData[index] = {
+      ...updatedData[index],
+      details: updatedDetailsData,
+    };
+
+    // Update the state with the modified data
+    setInvoiceData(prevState => ({
+      ...prevState,
+      verification: updatedData,
+    }));
+  }
+
+  useEffect(() => {
+    console.log('verification card', JSON.stringify(invoiceData.verification));
+  }, [invoiceData]);
+
+  const renderLeftActions = () => (
+    <View
+      style={{
+        // flex: 1,
+        // width: normalize(100),
+        // backgroundColor: '#4caf50',
+        justifyContent: 'flex-start',
+        alignItems: 'flex-start',
+        borderTopLeftRadius: 10,
+        borderBottomLeftRadius: 10,
+        flexDirection: 'row',
+        paddingHorizontal: normalize(10),
+      }}>
+      {/* Marketing division */}
+      {/* <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(5)
+        }}
+        onPress={() => setLeftAction(prev => !prev)}
+      >
+        {!leftAction && <View style={{
+          backgroundColor: '#f4f5ae',
+          justifyContent: 'center',
+          alignItems: 'center',
+          ...CButtonShadow(),
+          borderRadius: normalize(5),
+          paddingHorizontal: normalize(3),
+          paddingVertical: normalize(5),
+          height: type == 'S' ? normalize(55) : normalize(38),
+          width: type == 'S' ? normalize(55) : normalize(38)
+        }}>
+          <HOCIcons.MaterialCommunityIcons
+            name={'office-building'}
+            size={type == 'S' ? normalize(24) : normalize(20)}
+            color={Global.AppTheme.primary_color}
+          />
+          <Text numberOfLines={1} style={{ fontSize: type == 'S' ? normalize(9) : normalize(8), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>Division</Text>
+        </View>
+        }
+        {leftAction &&
+          <View style={{
+            backgroundColor: '#f4f5ae',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...CButtonShadow(),
+            borderRadius: normalize(5),
+            paddingHorizontal: normalize(3),
+            paddingVertical: normalize(5),
+            height: type == 'S' ? normalize(55) : normalize(38),
+            width: type == 'S' ? normalize(55) : normalize(38)
+          }}>
+            <Text style={{ fontSize: normalize(9), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>{data?.marketingdivisionname}</Text>
+          </View>
+        }
+      </TouchableOpacity> */}
+      {/* Info */}
+      <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(35),
+        }}
+        onPress={() => {
+          navigation.navigate('CPurchaseDetails', {
+            productCode: data?.insuproduct || 0,
+          });
+          // setLeftAction(prev => !prev)
+        }}>
+        {!leftAction && (
+          <View
+            style={{
+              backgroundColor: '#f4f5ae',
+              justifyContent: 'center',
+              alignItems: 'center',
+              ...CButtonShadow(),
+              borderRadius: normalize(5),
+              paddingHorizontal: normalize(3),
+              paddingVertical: normalize(5),
+              height: normalize(38),
+              width: normalize(38),
+            }}>
+            <HOCIcons.Entypo
+              name={'info-with-circle'}
+              size={normalize(20)}
+              color={Global.AppTheme.primary_color}
+            />
+            <Text
+              numberOfLines={1}
+              style={{
+                fontSize: normalize(8),
+                fontWeight: 'bold',
+                color: Global.AppTheme.primary_color,
+              }}>
+              Info
+            </Text>
+          </View>
+        )}
+        {leftAction && (
+          <View
+            style={{
+              backgroundColor: '#f4f5ae',
+              justifyContent: 'center',
+              alignItems: 'center',
+              ...CButtonShadow(),
+              borderRadius: normalize(5),
+              paddingHorizontal: normalize(3),
+              paddingVertical: normalize(5),
+              height: normalize(38),
+              width: normalize(38),
+            }}>
+            <Text
+              style={{
+                fontSize: normalize(9),
+                fontWeight: 'bold',
+                color: Global.AppTheme.primary_color,
+              }}>
+              {data?.marketingdivisionname}
+            </Text>
+          </View>
+        )}
+      </TouchableOpacity>
+      {/* Report */}
+      <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(5),
+        }}
+        onPress={() => {
+          console.log('summary');
+          const pdfUrl = `${APIURL}fljrcommonbill/jrcommonbreport/AMAGDBI01.dbo.rnjrinsuproductdetail(${data?.insuproduct},${Global.userData.suuser})/0/ProductDetail`;
+
+          console.log('FeedBack Detail Report Loading....');
+          console.log('pdfurl', pdfUrl);
+          navigation.navigate('PDFScreen', {
+            pdfSource: pdfUrl,
+          });
+        }}>
+        {!secondAction && (
+          <View
+            style={{
+              backgroundColor: '#f5bfae',
+              justifyContent: 'center',
+              alignItems: 'center',
+              ...CButtonShadow(),
+              borderRadius: normalize(5),
+              paddingHorizontal: normalize(3),
+              paddingVertical: normalize(5),
+              height: normalize(38),
+              width: normalize(38),
+            }}>
+            <HOCIcons.MaterialCommunityIcons
+              name={'file-table-outline'}
+              size={normalize(20)}
+              color={Global.AppTheme.primary_color}
+            />
+            <Text
+              numberOfLines={1}
+              style={{
+                fontSize: normalize(8),
+                fontWeight: 'bold',
+                color: Global.AppTheme.primary_color,
+              }}>
+              Report
+            </Text>
+          </View>
+        )}
+        {secondAction && (
+          <View
+            style={{
+              backgroundColor: '#f5bfae',
+              justifyContent: 'center',
+              alignItems: 'center',
+              ...CButtonShadow(),
+              borderRadius: normalize(5),
+              paddingHorizontal: normalize(3),
+              paddingVertical: normalize(5),
+              height: normalize(38),
+              width: normalize(38),
+            }}>
+            <Text
+              style={{
+                fontSize: normalize(9),
+                fontWeight: 'bold',
+                color: Global.AppTheme.primary_color,
+              }}>
+              {data?.taxname}
+            </Text>
+          </View>
+        )}
+      </TouchableOpacity>
+      {/* Tax name */}
+      {/* <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(5)
+        }}
+        onPress={() => setSecondAction(prev => !prev)}
+      >
+        {!secondAction && <View style={{
+          backgroundColor: '#f5bfae',
+          justifyContent: 'center',
+          alignItems: 'center',
+          ...CButtonShadow(),
+          borderRadius: normalize(5),
+          paddingHorizontal: normalize(3),
+          paddingVertical: normalize(5),
+          height: type == 'S' ? normalize(55) : normalize(38),
+          width: type == 'S' ? normalize(55) : normalize(38)
+        }}>
+          <HOCIcons.MaterialCommunityIcons
+            name={'brightness-percent'}
+            size={type == 'S' ? normalize(24) : normalize(20)}
+            color={Global.AppTheme.primary_color}
+          />
+          <Text numberOfLines={1} style={{ fontSize: type == 'S' ? normalize(9) : normalize(8), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>Tax Name</Text>
+        </View>
+        }
+        {secondAction &&
+          <View style={{
+            backgroundColor: '#f5bfae',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...CButtonShadow(),
+            borderRadius: normalize(5),
+            paddingHorizontal: normalize(3),
+            paddingVertical: normalize(5),
+            height: type == 'S' ? normalize(55) : normalize(38),
+            width: type == 'S' ? normalize(55) : normalize(38)
+          }}>
+            <Text style={{ fontSize: normalize(9), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>{data?.taxname}</Text>
+          </View>
+        }
+      </TouchableOpacity> */}
+    </View>
+  );
+
+  const renderRightActions = () => (
+    <View
+      style={{
+        // flex: 1,
+        // width: normalize(100),
+        // backgroundColor: '#4caf50',
+        justifyContent: 'flex-start',
+        alignItems: 'flex-start',
+        borderTopLeftRadius: 10,
+        borderBottomLeftRadius: 10,
+        flexDirection: 'row',
+        paddingHorizontal: normalize(10),
+      }}>
+      {/* Report */}
+      {data.flag === 'F' || data.flag === 'U' || data.flag === 'E' ? (
+        <TouchableOpacity
+          style={{
+            // // flex: 1,
+            // width: normalize(100),
+            // // backgroundColor: '#4caf50',
+            // justifyContent: 'flex-start',
+            // alignItems: 'center',
+            // borderTopLeftRadius: 10,
+            // borderBottomLeftRadius: 10,
+            marginLeft: normalize(5),
+          }}
+          onPress={() => {
+            console.log('summary', JSON.stringify(data.flag));
+            const link =
+              data.flag === 'F'
+                ? 'jremr/jrcommonreport/rnjrintrtrslip(' +
+                data.intrtr +
+                ',' +
+                Global.userData.suuser +
+                ')/0/TransferSlip'
+                : data.flag === 'U'
+                  ? 'jremr/jrcommonreport/rnjrintrisslip(' +
+                  data.intris +
+                  ',' +
+                  Global.userData.suuser +
+                  ')/0/IssueSlip'
+                  : data.flag === 'E'
+                    ? 'jremr/jrcommonreport/rnjrintrisslip(' +
+                    data.intris +
+                    ',' +
+                    Global.userData.suuser +
+                    ')/0/IssueSlip'
+                    : null;
+            navigation.navigate('PdfPreview', {
+              headerblockstyle: { marginBottom: normalize(35) },
+              link: APIURL + link,
+            });
+          }}>
+          {!rightAction && (
+            <View
+              style={{
+                backgroundColor: '#a9e7f0',
+                justifyContent: 'center',
+                alignItems: 'center',
+                ...CButtonShadow(),
+                borderRadius: normalize(5),
+                paddingHorizontal: normalize(3),
+                paddingVertical: normalize(5),
+                height: type == 'S' ? normalize(55) : normalize(38),
+                width: type == 'S' ? normalize(55) : normalize(38),
+              }}>
+              <HOCIcons.MaterialCommunityIcons
+                name={'file-document-outline'}
+                size={type == 'S' ? normalize(24) : normalize(20)}
+                color={Global.AppTheme.primary_color}
+              />
+              <Text
+                numberOfLines={1}
+                style={{
+                  fontSize: type == 'S' ? normalize(9) : normalize(8),
+                  fontWeight: 'bold',
+                  color: Global.AppTheme.primary_color,
+                }}>
+                Report
+              </Text>
+            </View>
+          )}
+          {/* {rightAction &&
+          <View style={{
+            backgroundColor: '#aef5b4',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...CButtonShadow(),
+            borderRadius: normalize(5),
+            paddingHorizontal: normalize(3),
+            paddingVertical: normalize(5),
+            height: normalize(38),
+            width: normalize(38)
+          }}>
+            <Text style={{ fontSize: normalize(9), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>{data?.marketingdivisionname}</Text>
+          </View>
+        } */}
+        </TouchableOpacity>
+      ) : null}
+      {/* Supplier */}
+      <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(20),
+        }}
+        onPress={() => {
+          navigation.navigate('CSupplierList', {
+            productCode: data?.insuproduct,
+          });
+        }}>
+        {!rightAction && (
+          <View
+            style={{
+              backgroundColor: '#aef5b4',
+              justifyContent: 'center',
+              alignItems: 'center',
+              ...CButtonShadow(),
+              borderRadius: normalize(5),
+              paddingHorizontal: normalize(3),
+              paddingVertical: normalize(5),
+              height: type == 'S' ? normalize(55) : normalize(38),
+              width: type == 'S' ? normalize(55) : normalize(38),
+            }}>
+            <HOCIcons.MaterialCommunityIcons
+              name={'human-dolly'}
+              size={type == 'S' ? normalize(24) : normalize(20)}
+              color={Global.AppTheme.primary_color}
+            />
+            <Text
+              numberOfLines={1}
+              style={{
+                fontSize: type == 'S' ? normalize(9) : normalize(8),
+                fontWeight: 'bold',
+                color: Global.AppTheme.primary_color,
+              }}>
+              Supplier
+            </Text>
+          </View>
+        )}
+        {/* {rightAction &&
+          <View style={{
+            backgroundColor: '#aef5b4',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...CButtonShadow(),
+            borderRadius: normalize(5),
+            paddingHorizontal: normalize(3),
+            paddingVertical: normalize(5),
+            height: normalize(38),
+            width: normalize(38)
+          }}>
+            <Text style={{ fontSize: normalize(9), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>{data?.marketingdivisionname}</Text>
+          </View>
+        } */}
+      </TouchableOpacity>
+      {/* Tax name */}
+      {/* <TouchableOpacity
+        style={{
+          // // flex: 1,
+          // width: normalize(100),
+          // // backgroundColor: '#4caf50',
+          // justifyContent: 'flex-start',
+          // alignItems: 'center',
+          // borderTopLeftRadius: 10,
+          // borderBottomLeftRadius: 10,
+          marginLeft: normalize(5)
+        }}
+        onPress={() => setSecondAction(prev => !prev)}
+      >
+        {!secondAction && <View style={{
+          backgroundColor: '#f5bfae',
+          justifyContent: 'center',
+          alignItems: 'center',
+          ...CButtonShadow(),
+          borderRadius: normalize(5),
+          paddingHorizontal: normalize(3),
+          paddingVertical: normalize(5),
+          height: normalize(38),
+          width: normalize(38)
+        }}>
+          <HOCIcons.MaterialCommunityIcons
+            name={'brightness-percent'}
+            size={normalize(20)}
+            color={Global.AppTheme.primary_color}
+          />
+          <Text numberOfLines={1} style={{ fontSize: normalize(8), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>Tax Name</Text>
+        </View>
+        }
+        {secondAction &&
+          <View style={{
+            backgroundColor: '#f5bfae',
+            justifyContent: 'center',
+            alignItems: 'center',
+            ...CButtonShadow(),
+            borderRadius: normalize(5),
+            paddingHorizontal: normalize(3),
+            paddingVertical: normalize(5),
+            height: normalize(38),
+            width: normalize(38)
+          }}>
+            <Text style={{ fontSize: normalize(9), fontWeight: 'bold', color: Global.AppTheme.primary_color }}>{data?.taxname}</Text>
+          </View>
+        }
+      </TouchableOpacity> */}
+    </View>
+  );
+
+  return (
+    <View>
+      <SwipeRow
+        disableLeftSwipe={false}
+        disableRightSwipe={false}
+        leftOpenValue={190}
+        rightOpenValue={-190}
+        swipeToClosePercent={10}
+        swipeToOpenPercent={10}
+      >
+        {/* Hidden Row (Swipe Actions) */}
+        <View style={{ borderWidth: 0, flexDirection: 'row', justifyContent: 'space-between', minHeight: normalize(70) }}>
+          <View style={{ flex: 1, alignItems: 'flex-start' }}>
+            {renderLeftActions && renderLeftActions()}
+          </View>
+          <View style={{ flex: 1, alignItems: 'flex-end' }}>
+            {renderRightActions && renderRightActions()}
+          </View>
+        </View>
+
+        {/* Top card */}
+        <View
+          style={{
+            backgroundColor: bgColor ? bgColor : '#faeeeb',
+            marginHorizontal: normalize(10),
+            marginBottom: normalize(10),
+            borderRadius: normalize(5),
+            shadowColor: Global.AppTheme.primary_color,
+            shadowOffset: { width: 4, height: 4 },
+            shadowOpacity: 0.6,
+            shadowRadius: 10,
+            elevation: 8,
+            ...CButtonShadow(),
+          }}>
+          <View style={{ flexDirection: 'row', minHeight: normalize(40) }}>
+            <View
+              style={{
+                backgroundColor: isNUQ(data.color) ? data.color : '#870808',
+                width: normalize(10),
+                height: '100%',
+                borderStartStartRadius: normalize(5),
+                borderStartEndRadius: normalize(5),
+              }} />
+            <View style={{ padding: normalize(3) }}>
+              {/* Product name */}
+              {type != 'B' && isNUQ(data.productname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: type == 'S' ? normalize(11) : normalize(12),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'bold',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.productname}{' '}
+                  <Text>
+                    {data?.classificationname && `(${data.classificationname})`}
+                  </Text>
+                </Text>
+              ) : null}
+
+              {/* Product name, Quantity, Unit, Amount */}
+              {type == 'B' && isNUQ(data.productname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: normalize(12),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'bold',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.productname}{' '}
+                  <Text
+                    style={{
+                      fontSize: normalize(11),
+                      fontWeight: 'normal',
+                    }}>{` (Quantiy: ${data.quantity} Unit: ${data.unitname} Amount: ${data.amount})`}</Text>
+                </Text>
+              ) : null}
+
+              {/* Activity name */}
+              {(type == 'S' || type == 'B') && isNUQ(data.hrsuactivityname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: type == 'S' ? normalize(9) : normalize(10),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'normal',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.hrsuactivityname}
+                </Text>
+              ) : null}
+
+              {/* Procurement status detail name */}
+              {type == 'S' && isNUQ(data.procurementstatusdetailname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: type == 'S' ? normalize(9) : normalize(10),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'normal',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.procurementstatusdetailname}
+                </Text>
+              ) : null}
+
+              {/* Supplier name */}
+              {isNUQ(data.suppliername) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: normalize(10),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'bold',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.suppliername}
+                </Text>
+              ) : null}
+
+              {/* Transfer */}
+              {type == 'F' &&
+                isNUQ(data.susectiondetailstorename) &&
+                isNUQ(data.susectiondetailname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: normalize(9),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'bold',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  <Text
+                    style={{
+                      fontWeight: 'bold',
+                      fontSize: normalize(11),
+                    }}>
+                    FROM:{' '}
+                  </Text>
+                  {' ' + data.susectiondetailstorename + '  '}
+                  <Text
+                    style={{
+                      fontWeight: 'bold',
+                      fontSize: normalize(11),
+                    }}>
+                    TO:{' '}
+                  </Text>
+                  {' ' + data.susectiondetailname}
+                </Text>
+              ) : null}
+
+              {/* Supplier name */}
+              {type == 'Y' && isNUQ(data.sectiondetailname) ? (
+                <Text
+                  numberOfLines={1}
+                  style={{
+                    fontSize: normalize(10),
+                    paddingLeft: normalize(5),
+                    fontWeight: 'bold',
+                    color: Global.AppTheme.primary_color,
+                  }}>
+                  {data.sectiondetailname}
+                </Text>
+              ) : null}
+
+              {/* Section */}
+              <View
+                style={{
+                  flexDirection: 'row',
+                  width: Dimensions.get('screen').width * 0.95,
+                  justifyContent: 'space-between',
+                }}>
+                {/* Section */}
+                <View style={{ maxWidth: '75%' }}>
+                  <View style={{ flexDirection: 'row' }}>
+                    {/* Indent no */}
+                    {isNUQ(
+                      type == 'R'
+                        ? data.requestno
+                        : type == 'P'
+                          ? data.procurementno
+                          : type == 'Q'
+                            ? data.quotationno
+                            : type == 'O'
+                              ? data.purchaseorderno
+                              : type == 'F'
+                                ? data.transferno
+                                : type == 'W'
+                                  ? data.requestno
+                                  : type == 'V'
+                                    ? data.workorderno
+                                    : type == 'S'
+                                      ? data.workorderno
+                                      : type == 'B'
+                                        ? data.workorderno
+                                        : type == 'U'
+                                          ? data.issueno
+                                          : type == 'E'
+                                            ? data.issueno
+                                            : data.indentno,
+                    ) ? (
+                      <View
+                        style={{
+                          flexDirection: 'row',
+                          alignItems: 'center',
+                          paddingLeft: normalize(5),
+                        }}>
+                        <Icons.FontAwesome5
+                          name={'file-invoice'}
+                          size={normalize(11)}
+                          color={'#094485'}
+                        />
+                        <Text
+                          style={{
+                            fontSize: 10,
+                            color: '#555',
+                            marginLeft: normalize(5),
+                          }}>
+                          {type == 'R'
+                            ? data.requestno
+                            : type == 'P'
+                              ? data.procurementno
+                              : type == 'Q'
+                                ? data.quotationno
+                                : type == 'O'
+                                  ? data.purchaseorderno
+                                  : type == 'F'
+                                    ? data.transferno
+                                    : type == 'W'
+                                      ? data.requestno
+                                      : type == 'V'
+                                        ? data.workorderno
+                                        : type == 'S'
+                                          ? data.workorderno
+                                          : type == 'B'
+                                            ? data.workorderno
+                                            : type == 'U'
+                                              ? data.issueno
+                                              : type == 'E'
+                                                ? data.issueno
+                                                : data.indentno}
+                        </Text>
+                      </View>
+                    ) : null}
+
+                    {/* User */}
+                    {isNUQ(data.username) ? (
+                      <View
+                        style={{
+                          flexDirection: 'row',
+                          alignItems: 'center',
+                          paddingLeft: normalize(5),
+                        }}>
+                        <Icons.FontAwesome5
+                          name={'user-alt'}
+                          size={normalize(11)}
+                          color={'#094485'}
+                        />
+                        <Text
+                          numberOfLines={1}
+                          style={{
+                            fontSize: 10,
+                            color: '#555',
+                            marginLeft: normalize(5),
+                          }}>
+                          {data.username}
+                        </Text>
+                      </View>
+                    ) : null}
+                  </View>
+
+                  <View style={{ flexDirection: 'row' }}>
+                    {/* Date */}
+                    {isNUQ(data.entrydate) ? (
+                      <View
+                        style={{
+                          flexDirection: 'row',
+                          alignItems: 'center',
+                          paddingLeft: normalize(5),
+                        }}>
+                        <Icons.FontAwesome5
+                          name={'calendar-alt'}
+                          size={normalize(11)}
+                          color={'#094485'}
+                        />
+                        <Text
+                          style={{
+                            fontSize: 10,
+                            color: '#555',
+                            marginLeft: normalize(5),
+                          }}>
+                          {moment(data.entrydate).format('DD-MM-YYYY')}
+                        </Text>
+                      </View>
+                    ) : null}
+
+                    {/* Location */}
+                    {isNUQ(
+                      type == 'I'
+                        ? data.locationname
+                        : type == 'W'
+                          ? data.locationname
+                          : type == 'V'
+                            ? data.locationname
+                            : type == 'S'
+                              ? data.locationname
+                              : type == 'B'
+                                ? data.locationname
+                                : data.susectiondetailname,
+                    ) ? (
+                      <View
+                        style={{
+                          flexDirection: 'row',
+                          alignItems: 'center',
+                          paddingLeft: normalize(5),
+                          width: '60%',
+                          // backgroundColor:'green'
+                        }}>
+                        <Icons.FontAwesome5
+                          name={'map-marker-alt'}
+                          size={normalize(11)}
+                          color={'#094485'}
+                        />
+                        <Text
+                          numberOfLines={1}
+                          style={{
+                            fontSize: 10,
+                            color: '#555',
+                            marginLeft: normalize(5),
+                          }}>
+                          {type == 'I'
+                            ? data.locationname
+                            : type == 'W'
+                              ? data.locationname
+                              : type == 'V'
+                                ? data.locationname
+                                : type == 'S'
+                                  ? data.locationname
+                                  : type == 'B'
+                                    ? data.locationname
+                                    : data.susectiondetailname}
+                        </Text>
+                      </View>
+                    ) : null}
+                  </View>
+                </View>
+                {/* Section */}
+
+                {/* Check box and expand button bbbbbbbbbbbbbbbbbbbbddddddddddddddddd */}
+                <View
+                    style={{
+                      width: Dimensions.get('screen').width * 0.205,
+                      justifyContent: 'flex-end',
+                      alignItems: 'center',
+                      // borderWidth: 1,
+                      borderRadius: 5,
+                      borderColor: 'lightgrey',
+                      height: Dimensions.get('screen').height * 0.03,
+                      // backgroundColor: "red",
+                      flexDirection: 'row',
+                      position: 'relative',
+                    }}>
+                    {/* Product info */}
+                    {/* <TouchableOpacity onPress={() => {
+                navigation.navigate('CPurchaseDetails', {
+                  supplierCode: supplierdata?.insusupplier,
+                  productCode: invoiceData?.data[sectionIndex]?.productdetail[productIndex]?.insuproduct
+                });
+              }}>
+                <Icons.Entypo
+                  name={'info-with-circle'}
+                  size={normalize(19)}
+                  color={'#094485'}
+                />
+              </TouchableOpacity> */}
+                    {/* Expand button  ddddddddddddddddddddddddd*/}
+
+                    <View
+                      style={{
+                        position: 'absolute',
+                        right: 0,
+                        bottom: 0,
+                        flexDirection: 'row',
+                        justifyContent: 'flex-end',
+                        alignItems: 'flex-end',
+                        paddingRight: normalize(10),
+                        paddingBottom: normalize(10),
+                      }}>
+                      <TouchableOpacity
+                        style={{
+                          justifyContent: 'center',
+                          alignItems: 'center',
+                          padding: normalize(3),
+                        }}
+                        onPress={() => {
+                          console.log('toggle');
+                          handleToggleExpand(index);
+                        }}>
+                        <View
+                          style={{
+                            width: 25,
+                            height: 25,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                          }}>
+                          <Icons.FontAwesome5
+                            name={
+                              data.expand == false
+                                ? 'chevron-circle-up'
+                                : 'chevron-circle-down'
+                            }
+                            size={normalize(18)}
+                            color={'#094485'}
+                          />
+                        </View>
+                      </TouchableOpacity>
+                      {console.log('data.verification', data.verification)}
+                      {/* Check box */}
+                      <SCheckBox
+                        data={{
+                          value: data.verification ? true : false,
+                          size: 20,
+                        }}
+                        callBack={val => {
+                          console.log(val);
+                          handleDataChange(index, Number(val), 'verification');
+                          // handleChange(val)
+                        }}
+                      />
+                    </View>
+                </View>
+              </View>
+            </View>
+          </View>
+        </View>
+      </SwipeRow>
+      {/* Expanded section */}
+      {data.expand == false ? (
+        <View
+          style={{
+            backgroundColor: '#fff',
+            marginHorizontal: normalize(10),
+            marginBottom: normalize(10),
+            borderRadius: normalize(5),
+            shadowColor: Global.AppTheme.primary_color,
+            shadowOffset: { width: 4, height: 4 },
+            shadowOpacity: 0.6,
+            shadowRadius: 10,
+            elevation: 8,
+          }}>
+          {data.details != undefined
+            ? data.details.map((detailsdata, i) => (
+              <View
+                key={i}
+                style={{
+                  padding: normalize(5),
+                }}>
+                {/* Procurementstatus */}
+                {type != 'S' &&
+                  type != 'B' &&
+                  isNUQ(detailsdata.procurementstatusdetailname) ? (
+                  <View
+                    style={{
+                      flexDirection: 'row',
+                      alignItems: 'center',
+                      justifyContent: 'flex-start',
+                    }}>
+                    <HSubHeading
+                      styles={{
+                        iconname: 'file-invoice',
+                        bgcolor: '#f2efef',
+                        iconsize: 11,
+                        iconcolor: Global.AppTheme.primary_color,
+                        displaytext: detailsdata.procurementstatusdetailname,
+                        textsize: 10,
+                        textcolor: Global.AppTheme.primary_color,
+                      }}
+                      callBack={val =>
+                        val == undefined ? null : console.log(val)
+                      } />
+                    {/* Emergency status */}
+                    <View
+                      style={{
+                        marginLeft: normalize(5),
+                      }}>
+                      <HOCIcons.Octicons
+                        name={'alert'}
+                        size={normalize(14)}
+                        color={
+                          detailsdata?.emergencystatus == 1
+                            ? '#ce2029'
+                            : '#088a06'
+                        }
+                      />
+                    </View>
+                    {/* Remarks */}
+                    <View
+                      style={{
+                        marginLeft: normalize(5),
+                      }}>
+                      <SOverlay
+                        size={14}
+                        iconcolor={'#094485'}
+                        value={''}
+                        onChangeText={val => {
+                          type != 'B'
+                            ? handleDataChange(index, val, 'reason')
+                            : console.log('reason', val);
+                        }}
+                      />
+                    </View>
+                  </View>
+                ) : null}
+
+                {/* Status,Activity,Product */}
+                {(type == 'S' || type == 'B') &&
+                  isNUQ(detailsdata.hrsustatusname) &&
+                  isNUQ(detailsdata.hrsuactivitydetailname) &&
+                  isNUQ(detailsdata.stageproductname) ? (
+                  <View
+                    style={{
+                      flexDirection: 'row',
+                      alignItems: 'center',
+                      justifyContent: 'flex-start',
+                    }}>
+                    <HSubHeading
+                      styles={{
+                        iconname: 'file-invoice',
+                        bgcolor: '#f2efef',
+                        iconsize: 11,
+                        iconcolor: Global.AppTheme.primary_color,
+                        displaytext: `${detailsdata.hrsustatusname} | ${detailsdata.hrsuactivitydetailname} | ${detailsdata.stageproductname}`,
+                        textsize: 10,
+                        textcolor: Global.AppTheme.primary_color,
+                      }}
+                      callBack={val =>
+                        val == undefined ? null : console.log(val)
+                      } />
+                    {/* Remarks */}
+                    {type == 'S' ||
+                      (type == 'B' && (
+                        <View
+                          style={{
+                            marginLeft: normalize(5),
+                          }}>
+                          <SOverlay
+                            size={14}
+                            iconcolor={'#094485'}
+                            value={''}
+                            onChangeText={val => {
+                              type != 'B'
+                                ? handleDataChange(index, val, 'reason')
+                                : handleDataChange(index, val, `reason${i}`);
+                            }}
+                          />
+                        </View>
+                      ))}
+                  </View>
+                ) : null}
+
+                {type == 'B' && detailsdata.suoptiondetail == 22708 ? (
+                  <View
+                    style={{
+                      marginHorizontal: normalize(10),
+                      position: 'absolute',
+                      right: normalize(0),
+                      top: normalize(26),
+                    }}>
+                    <Text
+                      style={{
+                        fontSize: normalize(8),
+                        fontWeight: 'bold',
+                        color: 'green',
+                      }}>
+                      COMPLETED
+                    </Text>
+                  </View>
+                ) : null}
+
+                {type == 'X' ? (
+                  <View
+                    style={{
+                      flexDirection: 'row',
+                      paddingVertical: normalize(2),
+                      alignItems: 'center',
+                    }}>
+                    {/* Dropdown */}
+                    <View
+                      style={{
+                        alignItems: 'center',
+                        width: 115,
+                        flexDirection: 'row',
+                        justifyContent: 'space-between',
+                        marginRight: normalize(10),
+                      }}>
+                      {/* Make Text clickable to open the dropdown */}
+                      <Menu>
+                        <MenuTrigger
+                          customStyles={{
+                            triggerWrapper: {
+                              borderWidth: 0,
+                              // width: normalize(25),
+                              justifyContent: 'center',
+                              alignItems: 'center',
+                            },
+                          }}>
+                          {/* Text that when clicked opens the dropdown */}
+                          <View
+                            style={{
+                              justifyContent: 'space-between',
+                              alignItems: 'center',
+                              flexDirection: 'row',
+                              borderWidth: 1,
+                              borderColor: '#gray',
+                              borderRadius: 5,
+                              paddingHorizontal: normalize(10),
+                              paddingVertical: normalize(5),
+                              marginBottom: normalize(5),
+                              minWidth: normalize(100),
+                            }}>
+                            <Text
+                              style={{
+                                color: 'gray',
+                                fontSize: normalize(13),
+                                fontWeight: 'bold',
+                                marginRight: normalize(10),
+                              }}>
+                              {data.requestnature == 'D'
+                                ? 'DIRECT'
+                                : 'REORDER'}
+                            </Text>
+                            <Icons.FontAwesome5
+                              name="chevron-down"
+                              size={13}
+                              color="gray"
+                            />
+                          </View>
+                        </MenuTrigger>
+                        <MenuOptions>
+                          <CDropDownList
+                            dropdownarray={data.dropdowndata}
+                            callback={val => {
+                              updateRequestNature(index, val);
+                            }}
+                          />
+                        </MenuOptions>
+                      </Menu>
+                    </View>
+                    {/* Date */}
+                    <View
+                      style={{
+                        marginLeft: normalize(10),
+                        alignItems: 'center',
+                      }}>
+                      <SDatePicker
+                        table={true}
+                        data={{
+                          itemwidth: Dimensions.get('screen').width * 0.38,
+                          displaytext: '',
+                          justifyContent: 'flex-start',
+                          elevation: 3,
+                          borderWidth: 1,
+                          //backgroundColor: 'rgba(161, 188, 196,0.2)',
+                          height: Dimensions.get('screen').height * 0.035,
+                          iconcolor: '#094485',
+                          padding: normalize(10),
+                        }}
+                        fontWeight={'bold'}
+                        passingDate={
+                          detailsdata.deliverabledate != undefined &&
+                            detailsdata.deliverabledate != null &&
+                            detailsdata.deliverabledate != ''
+                            ? detailsdata.deliverabledate
+                            : new Date()
+                        }
+                        onChangeData={val => {
+                          console.log(
+                            'dateeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee',
+                            val,
+                          );
+                          handleDetailDataChange(
+                            index,
+                            i,
+                            val,
+                            'deliverabledate',
+                          );
+                        }}
+                      />
+                    </View>
+                  </View>
+                ) : null}
+
+                {
+                  // Dropdown
+                  type == 'B' ? (
+                    <View
+                      style={{
+                        alignItems: 'center',
+                        width: 115,
+                        flexDirection: 'row',
+                        justifyContent: 'space-between',
+                        marginRight: normalize(10),
+                        marginTop: normalize(3),
+                      }}>
+                      {/* Make Text clickable to open the dropdown */}
+                      <Menu>
+                        <MenuTrigger
+                          customStyles={{
+                            triggerWrapper: {
+                              borderWidth: 0,
+                              // width: normalize(25),
+                              justifyContent: 'center',
+                              alignItems: 'center',
+                            },
+                          }}>
+                          {/* Text that when clicked opens the dropdown */}
+                          <View
+                            style={{
+                              justifyContent: 'space-between',
+                              alignItems: 'center',
+                              flexDirection: 'row',
+                              borderWidth: 1,
+                              borderColor: '#gray',
+                              borderRadius: 5,
+                              paddingHorizontal: normalize(10),
+                              paddingVertical: normalize(5),
+                              marginBottom: normalize(5),
+                              minWidth: normalize(100),
+                            }}>
+                            <Text
+                              style={{
+                                color: 'gray',
+                                fontSize: normalize(13),
+                                fontWeight: 'bold',
+                                marginRight: normalize(10),
+                              }}>
+                              {detailsdata.qualitynature == 'G'
+                                ? 'GOOD'
+                                : detailsdata.qualitynature == 'B'
+                                  ? 'BAD'
+                                  : 'NOT BAD'}
+                            </Text>
+                            <Icons.FontAwesome5
+                              name="chevron-down"
+                              size={13}
+                              color="gray"
+                            />
+                          </View>
+                        </MenuTrigger>
+                        <MenuOptions>
+                          <CDropDownList
+                            dropdownarray={detailsdata.dropdown}
+                            callback={val => {
+                              updateQualityNature(index, i, val);
+                            }}
+                          />
+                        </MenuOptions>
+                      </Menu>
+                    </View>
+                  ) : null
+                }
+
+                <ScrollView horizontal={true}>
+                  <View style={{ flexDirection: 'row' }}>
+                    {/* Quantity */}
+                    {isNU(detailsdata.quantity) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Quantity'}
+                          widthArr={Dimensions.get('screen').width * 0.2}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.2,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.quantity}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Changed Quantity */}
+                    {type == 'Y' && isNU(detailsdata.adjustqty) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Quantity'}
+                          widthArr={Dimensions.get('screen').width * 0.2}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.2,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.adjustqty}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Changed Selling Price */}
+                    {type == 'Y' && isNU(detailsdata.sellingprice) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Selling Price'}
+                          widthArr={Dimensions.get('screen').width * 0.2}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.2,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.sellingprice}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Changed MRP */}
+                    {type == 'Y' && isNU(detailsdata.mrp) ? (
+                      <View>
+                        <CTextHeader
+                          text={'MRP'}
+                          widthArr={Dimensions.get('screen').width * 0.2}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.2,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.mrp}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Current stock */}
+                    {isNU(detailsdata.currentstock) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Current Stock'}
+                          widthArr={Dimensions.get('screen').width * 0.2}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.2,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.currentstock}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Emergency statys */}
+                    {/* {isNU(detailsdata.emergencystatus) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Emargency Status'}
+                          widthArr={Dimensions.get('screen').width * 0.25}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.25,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          {detailsdata.emergencystatus == 1 ? (
+                            <Icons.MaterialCommunityIcons
+                              name={'check'}
+                              size={normalize(16)}
+                              color={'#094485'}
+                            />
+                          ) : (
+                            <Icons.MaterialCommunityIcons
+                              name={'window-close'}
+                              size={normalize(16)}
+                              color={'#094485'}
+                            />
+                          )}
+                        </View>
+                      </View>
+                    ) : null} */}
+
+                    {/* Brand name */}
+                    {isNU(detailsdata.brandname) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Brand Name'}
+                          widthArr={Dimensions.get('screen').width * 0.21}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.21,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{
+                              fontSize: normalize(11),
+                            }}>
+                            {detailsdata.brandname}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Unit name */}
+                    {isNUQ(detailsdata.unitname) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Unit Name'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.unitname}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Packing name */}
+                    {type != 'X' && isNUQ(detailsdata.packingname) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Packing Name'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.packingname}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Packing name */}
+                    {type == 'X' && isNUQ(detailsdata.packingqty) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Packing Quantity'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.packingqty}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Packing no */}
+                    {isNUQ(detailsdata.packingno) && data.flag != 'F' ? (
+                      <View>
+                        <CTextHeader
+                          text={'Packing No'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.packingno}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Rate */}
+                    {isNUQ(detailsdata.rate) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Rate'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.rate}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+
+                    {/* Amount */}
+                    {isNUQ(detailsdata.amount) ? (
+                      <View>
+                        <CTextHeader
+                          text={'Amount'}
+                          widthArr={Dimensions.get('screen').width * 0.205}
+                          bgColor={'rgba(184, 184, 191,0.3)'}
+                          color={'#094485'}
+                          borderColor={'#f5f5f5'}
+                          marginHorizontal={normalize(2)}
+                          borderRadius={5}
+                          elevation={0}
+                          fontSize={normalize(10)}
+                        />
+                        <View
+                          style={{
+                            width: Dimensions.get('screen').width * 0.205,
+                            justifyContent: 'center',
+                            alignItems: 'center',
+                            borderWidth: 1,
+                            borderRadius: 5,
+                            borderColor: 'lightgrey',
+                            height: Dimensions.get('screen').height * 0.03,
+                          }}>
+                          <Text
+                            numberOfLines={1}
+                            style={{ fontSize: normalize(11) }}>
+                            {detailsdata.amount}
+                          </Text>
+                        </View>
+                      </View>
+                    ) : null}
+                  </View>
+                </ScrollView>
+
+                {/* Requirement */}
+                {isNUQ(detailsdata.requirement) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Requirement
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {detailsdata.requirement}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Remarks */}
+                {isNUQ(detailsdata.remarks) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Remarks
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {detailsdata.remarks}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Description */}
+                {isNUQ(detailsdata.quotationdescription) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Description
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {detailsdata.quotationdescription}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Description */}
+                {isNUQ(data.productdescription) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Description
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {data.productdescription}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Description */}
+                {isNUQ(data.indentdescription) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Description
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {data.indentdescription}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Description */}
+                {isNUQ(data.quotationdescription) ? (
+                  <View>
+                    <Text
+                      style={{
+                        textDecorationLine: 'underline',
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      Description
+                    </Text>
+                    <Text
+                      style={{
+                        fontSize: normalize(10),
+                        fontStyle: 'italic',
+                        color: '#555',
+                      }}>
+                      {data.quotationdescription}
+                    </Text>
+                  </View>
+                ) : null}
+
+                {/* Reason type B */}
+                {/* {type == 'B' ? (
+                  <View style={{ paddingVertical: normalize(5) }}>
+                    <CTextHeader
+                      text={type != 'X' ? 'Reason' : 'Remarks'}
+                      widthArr={Dimensions.get('screen').width * 0.9}
+                      bgColor={'rgba(184, 184, 191,0.3)'}
+                      color={'#094485'}
+                      borderColor={'white'}
+                      marginHorizontal={normalize(2)}
+                      borderRadius={5}
+                      elevation={0}
+                      fontSize={normalize(10)}
+                    />
+                    <STextInputNew
+                      data={{
+                        borderWidth: 1,
+                        value: data.reason || '',
+                        borderColor: 'lightgrey',
+                        elevation: 0,
+                        borderRadius: 5,
+                        fontWeight: 'normal',
+                        color: 'black',
+                        itemwidth: Dimensions.get('screen').width * 0.9,
+                        paddingTop: 5,
+                        paddingBottom: 5,
+                        height: Dimensions.get('screen').height * 0.034,
+                        textAlign: 'center',
+                        marginTop: normalize(2),
+                        marginHorizontal: normalize(2),
+                        fontSize: normalize(10),
+                        placeholder:
+                          type != 'X'
+                            ? 'Reason for verification...'
+                            : 'Please enter your remarks here...',
+                      }}
+                      callBack={val => {
+                        handleDataChange(index, val, `reason${i}`);
+                      }}
+                    />
+                  </View>
+                ) : null} */}
+
+                {/* Raw material card */}
+                {type == 'B' ? (
+                  <View>
+                    {isNUL(detailsdata?.WorkorderProductDetail) ? (
+                      <View style={{ marginBottom: normalize(5) }}>
+                        <HHeading
+                          styles={{
+                            iconname: 'box-open',
+                            bgcolor: '#f2efef',
+                            iconsize: 14,
+                            iconcolor: Global.AppTheme.primary_color,
+                            displaytext: 'RAW MATERIAL',
+                            textsize: 13,
+                            textcolor: Global.AppTheme.primary_color,
+                          }}
+                          callBack={val => {
+                            handleToggleExpandField(
+                              index,
+                              i,
+                              'wrkorprodetail',
+                            );
+                            // val == undefined ? null : console.log(val)
+                          }} />
+                      </View>
+                    ) : null}
+                    {!detailsdata?.wrkorprodetail &&
+                      detailsdata?.WorkorderProductDetail.map(
+                        (rawMaterial, rawIndex) => (
+                          <View key={rawIndex}>
+                            <View
+                              style={{
+                                backgroundColor: '#ebf1fa',
+                                marginHorizontal: normalize(10),
+                                marginBottom: normalize(10),
+                                borderRadius: normalize(5),
+                                shadowColor: Global.AppTheme.primary_color,
+                                shadowOffset: { width: 4, height: 4 },
+                                shadowOpacity: 0.6,
+                                shadowRadius: 10,
+                                elevation: 8,
+                              }}>
+                              <View style={{ flexDirection: 'row' }}>
+                                <View
+                                  style={{
+                                    backgroundColor: '#083787',
+                                    width: normalize(10),
+                                    height: '100%',
+                                    borderStartStartRadius: normalize(5),
+                                    borderStartEndRadius: normalize(5),
+                                  }} />
+                                <View style={{ padding: normalize(3) }}>
+                                  {/* Product name */}
+                                  {isNUQ(rawMaterial.productname) ? (
+                                    <Text
+                                      numberOfLines={1}
+                                      style={{
+                                        fontSize: normalize(12),
+                                        paddingLeft: normalize(5),
+                                        fontWeight: 'bold',
+                                        color: Global.AppTheme.primary_color,
+                                      }}>
+                                      {rawMaterial.productname}
+                                    </Text>
+                                  ) : null}
+
+                                  {/* Section */}
+                                  <View
+                                    style={{
+                                      flexDirection: 'row',
+                                      width: '95%',
+                                      justifyContent: 'space-between',
+                                    }}>
+                                    {/* Section */}
+                                    <View
+                                      style={{
+                                        flexDirection: 'row',
+                                        justifyContent: 'space-between',
+                                        alignItems: 'flex-start',
+                                      }}>
+                                      <View
+                                        style={{
+                                          flexDirection: 'row',
+                                          marginRight: normalize(15),
+                                        }}>
+                                        {/* Quantity */}
+                                        {isNUQ(rawMaterial.quantity) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Quantity :{' '}
+                                              {rawMaterial.quantity}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+
+                                        {/* Amount */}
+                                        {isNUQ(rawMaterial.amount) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Amount : {rawMaterial.amount}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+
+                                        {/* Unit name */}
+                                        {isNUQ(rawMaterial.unitname) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Unit : {rawMaterial.unitname}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+                                      </View>
+                                    </View>
+                                  </View>
+                                  <View
+                                    style={{
+                                      paddingVertical: normalize(5),
+                                      flexDirection: 'row',
+                                      alignItems: 'flex-start',
+                                    }}>
+                                    {/* Reason */}
+                                    <View style={{ marginRight: normalize(5) }}>
+                                      {/* <CTextHeader
+                                      text={type != 'X' ? 'Reason' : 'Remarks'}
+                                      widthArr={
+                                        Dimensions.get('screen').width * 0.9
+                                      }
+                                      bgColor={'rgba(184, 184, 191,0.3)'}
+                                      color={'#094485'}
+                                      borderColor={'white'}
+                                      marginHorizontal={normalize(2)}
+                                      borderRadius={5}
+                                      elevation={0}
+                                      fontSize={normalize(10)}
+                                    /> */}
+                                      <STextInputNew
+                                        data={{
+                                          borderWidth: 1,
+                                          value: rawIndex.usedreason || '',
+                                          borderColor: 'lightgrey',
+                                          elevation: 0,
+                                          borderRadius: 5,
+                                          fontWeight: 'normal',
+                                          color: 'black',
+                                          itemwidth:
+                                            Dimensions.get('screen').width *
+                                            0.58,
+                                          paddingTop: 5,
+                                          paddingBottom: 5,
+                                          height:
+                                            Dimensions.get('screen').height *
+                                            0.034,
+                                          textAlign: 'center',
+                                          marginTop: normalize(2),
+                                          marginHorizontal: normalize(2),
+                                          fontSize: normalize(10),
+                                          placeholder:
+                                            type != 'X'
+                                              ? 'Reason for verification...'
+                                              : 'Please enter your remarks here...',
+                                        }}
+                                        callBack={val => {
+                                          updateProductReason(
+                                            index,
+                                            i,
+                                            rawIndex,
+                                            val,
+                                            'usedreason',
+                                          );
+                                        }}
+                                      />
+                                    </View>
+
+                                    {/* Dropdown */}
+                                    <View
+                                      style={{
+                                        alignItems: 'center',
+                                        width: 70,
+                                        flexDirection: 'row',
+                                        justifyContent: 'space-between',
+                                      }}>
+                                      {/* Make Text clickable to open the dropdown */}
+                                      <Menu>
+                                        <MenuTrigger
+                                          customStyles={{
+                                            triggerWrapper: {
+                                              borderWidth: 0,
+                                              // width: normalize(25),
+                                              justifyContent: 'center',
+                                              alignItems: 'center',
+                                            },
+                                          }}>
+                                          {/* Text that when clicked opens the dropdown */}
+                                          <View
+                                            style={{
+                                              justifyContent: 'space-between',
+                                              alignItems: 'center',
+                                              flexDirection: 'row',
+                                              borderWidth: 1,
+                                              borderColor: '#gray',
+                                              borderRadius: 5,
+                                              paddingHorizontal:
+                                                normalize(10),
+                                              paddingVertical: normalize(5),
+                                              marginBottom: normalize(5),
+                                              minWidth: normalize(70),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                color: 'gray',
+                                                fontSize: normalize(11),
+                                                fontWeight: 'bold',
+                                                marginRight: normalize(10),
+                                              }}>
+                                              {rawMaterial.qualitynature ==
+                                                'G'
+                                                ? 'GOOD'
+                                                : rawMaterial.qualitynature ==
+                                                  'B'
+                                                  ? 'BAD'
+                                                  : 'NOT BAD'}
+                                            </Text>
+                                            <Icons.FontAwesome5
+                                              name="chevron-down"
+                                              size={13}
+                                              color="gray"
+                                            />
+                                          </View>
+                                        </MenuTrigger>
+                                        <MenuOptions>
+                                          <CDropDownList
+                                            dropdownarray={
+                                              rawMaterial.dropdown
+                                            }
+                                            callback={val => {
+                                              updateProductNature(
+                                                index,
+                                                i,
+                                                rawIndex,
+                                                val,
+                                              );
+                                            }}
+                                          />
+                                        </MenuOptions>
+                                      </Menu>
+                                    </View>
+                                  </View>
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        ),
+                      )}
+                  </View>
+                ) : null}
+
+                {/* By Product card */}
+                {type == 'B' ? (
+                  <View>
+                    {isNUL(detailsdata?.WorkorderByProductDetail) ? (
+                      <View style={{ marginBottom: normalize(5) }}>
+                        <HHeading
+                          styles={{
+                            iconname: 'box-open',
+                            bgcolor: '#f2efef',
+                            iconsize: 14,
+                            iconcolor: Global.AppTheme.primary_color,
+                            displaytext: 'BY PRODUCT',
+                            textsize: 13,
+                            textcolor: Global.AppTheme.primary_color,
+                          }}
+                          callBack={val => {
+                            handleToggleExpandField(
+                              index,
+                              i,
+                              'wrkorbyprodetail',
+                            );
+                            // val == undefined ? null : console.log(val)
+                          }} />
+                      </View>
+                    ) : null}
+                    {!detailsdata.wrkorbyprodetail &&
+                      detailsdata?.WorkorderByProductDetail.map(
+                        (rawMaterial, rawIndex) => (
+                          <View key={rawIndex}>
+                            <View
+                              style={{
+                                backgroundColor: '#faeeeb',
+                                marginHorizontal: normalize(10),
+                                marginBottom: normalize(10),
+                                borderRadius: normalize(5),
+                                shadowColor: Global.AppTheme.primary_color,
+                                shadowOffset: { width: 4, height: 4 },
+                                shadowOpacity: 0.6,
+                                shadowRadius: 10,
+                                elevation: 8,
+                              }}>
+                              <View style={{ flexDirection: 'row' }}>
+                                <View
+                                  style={{
+                                    backgroundColor: '#870808',
+                                    width: normalize(10),
+                                    height: '100%',
+                                    borderStartStartRadius: normalize(5),
+                                    borderStartEndRadius: normalize(5),
+                                  }} />
+                                <View style={{ padding: normalize(3) }}>
+                                  {/* Product name */}
+                                  {isNUQ(rawMaterial.productname) ? (
+                                    <Text
+                                      numberOfLines={1}
+                                      style={{
+                                        fontSize: normalize(12),
+                                        paddingLeft: normalize(5),
+                                        fontWeight: 'bold',
+                                        color: Global.AppTheme.primary_color,
+                                      }}>
+                                      {rawMaterial.productname}
+                                    </Text>
+                                  ) : null}
+
+                                  {/* Section */}
+                                  <View
+                                    style={{
+                                      flexDirection: 'row',
+                                      width: '95%',
+                                      justifyContent: 'space-between',
+                                    }}>
+                                    {/* Section */}
+                                    <View
+                                      style={{
+                                        flexDirection: 'row',
+                                        justifyContent: 'space-between',
+                                        alignItems: 'flex-start',
+                                      }}>
+                                      <View
+                                        style={{
+                                          flexDirection: 'row',
+                                          marginRight: normalize(15),
+                                        }}>
+                                        {/* Quantity */}
+                                        {isNUQ(rawMaterial.quantity) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Quantity :{' '}
+                                              {rawMaterial.quantity}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+
+                                        {/* Amount */}
+                                        {isNUQ(rawMaterial.amount) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Amount : {rawMaterial.amount}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+
+                                        {/* Unit name */}
+                                        {isNUQ(rawMaterial.unitname) ? (
+                                          <View
+                                            style={{
+                                              flexDirection: 'row',
+                                              alignItems: 'center',
+                                              paddingLeft: normalize(5),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                fontSize: 10,
+                                                color: '#555',
+                                                marginLeft: normalize(5),
+                                              }}>
+                                              Unit : {rawMaterial.unitname}
+                                            </Text>
+                                          </View>
+                                        ) : null}
+                                      </View>
+                                    </View>
+                                  </View>
+                                  <View
+                                    style={{
+                                      paddingVertical: normalize(5),
+                                      flexDirection: 'row',
+                                      alignItems: 'flex-start',
+                                    }}>
+                                    {/* Reason */}
+                                    <View style={{ marginRight: normalize(5) }}>
+                                      {/* <CTextHeader
+                                      text={type != 'X' ? 'Reason' : 'Remarks'}
+                                      widthArr={
+                                        Dimensions.get('screen').width * 0.9
+                                      }
+                                      bgColor={'rgba(184, 184, 191,0.3)'}
+                                      color={'#094485'}
+                                      borderColor={'white'}
+                                      marginHorizontal={normalize(2)}
+                                      borderRadius={5}
+                                      elevation={0}
+                                      fontSize={normalize(10)}
+                                    /> */}
+                                      <STextInputNew
+                                        data={{
+                                          borderWidth: 1,
+                                          value: rawIndex.usedreason || '',
+                                          borderColor: 'lightgrey',
+                                          elevation: 0,
+                                          borderRadius: 5,
+                                          fontWeight: 'normal',
+                                          color: 'black',
+                                          itemwidth:
+                                            Dimensions.get('screen').width *
+                                            0.58,
+                                          paddingTop: 5,
+                                          paddingBottom: 5,
+                                          height:
+                                            Dimensions.get('screen').height *
+                                            0.034,
+                                          textAlign: 'center',
+                                          marginTop: normalize(2),
+                                          marginHorizontal: normalize(2),
+                                          fontSize: normalize(10),
+                                          placeholder:
+                                            type != 'X'
+                                              ? 'Reason for verification...'
+                                              : 'Please enter your remarks here...',
+                                        }}
+                                        callBack={val => {
+                                          updateByProductReason(
+                                            index,
+                                            i,
+                                            rawIndex,
+                                            val,
+                                            'usedreason',
+                                          );
+                                        }}
+                                      />
+                                    </View>
+
+                                    {/* Dropdown */}
+                                    <View
+                                      style={{
+                                        alignItems: 'center',
+                                        width: 70,
+                                        flexDirection: 'row',
+                                        justifyContent: 'space-between',
+                                      }}>
+                                      {/* Make Text clickable to open the dropdown */}
+                                      <Menu>
+                                        <MenuTrigger
+                                          customStyles={{
+                                            triggerWrapper: {
+                                              borderWidth: 0,
+                                              // width: normalize(25),
+                                              justifyContent: 'center',
+                                              alignItems: 'center',
+                                            },
+                                          }}>
+                                          {/* Text that when clicked opens the dropdown */}
+                                          <View
+                                            style={{
+                                              justifyContent: 'space-between',
+                                              alignItems: 'center',
+                                              flexDirection: 'row',
+                                              borderWidth: 1,
+                                              borderColor: '#gray',
+                                              borderRadius: 5,
+                                              paddingHorizontal:
+                                                normalize(10),
+                                              paddingVertical: normalize(5),
+                                              marginBottom: normalize(5),
+                                              minWidth: normalize(70),
+                                            }}>
+                                            <Text
+                                              style={{
+                                                color: 'gray',
+                                                fontSize: normalize(11),
+                                                fontWeight: 'bold',
+                                                marginRight: normalize(10),
+                                              }}>
+                                              {rawMaterial.qualitynature ==
+                                                'G'
+                                                ? 'GOOD'
+                                                : rawMaterial.qualitynature ==
+                                                  'B'
+                                                  ? 'BAD'
+                                                  : 'NOT BAD'}
+                                            </Text>
+                                            <Icons.FontAwesome5
+                                              name="chevron-down"
+                                              size={13}
+                                              color="gray"
+                                            />
+                                          </View>
+                                        </MenuTrigger>
+                                        <MenuOptions>
+                                          <CDropDownList
+                                            dropdownarray={
+                                              rawMaterial.dropdown
+                                            }
+                                            callback={val => {
+                                              updateByProductNature(
+                                                index,
+                                                i,
+                                                rawIndex,
+                                                val,
+                                              );
+                                            }}
+                                          />
+                                        </MenuOptions>
+                                      </Menu>
+                                    </View>
+                                  </View>
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                        ),
+                      )}
+                  </View>
+                ) : null}
+              </View>
+            ))
+            : null}
+
+          {/* Reason */}
+          {/* {type != 'B' ? (
+            <View style={{ padding: normalize(5) }}>
+              <CTextHeader
+                text={type != 'X' ? 'Reason' : 'Remarks'}
+                widthArr={Dimensions.get('screen').width * 0.9}
+                bgColor={'rgba(184, 184, 191,0.3)'}
+                color={'#094485'}
+                borderColor={'white'}
+                marginHorizontal={normalize(2)}
+                borderRadius={5}
+                elevation={0}
+                fontSize={normalize(10)}
+              />
+              <STextInputNew
+                data={{
+                  borderWidth: 1,
+                  value: data.reason || '',
+                  borderColor: 'lightgrey',
+                  elevation: 0,
+                  borderRadius: 5,
+                  fontWeight: 'normal',
+                  color: 'black',
+                  itemwidth: Dimensions.get('screen').width * 0.9,
+                  paddingTop: 5,
+                  paddingBottom: 5,
+                  height: Dimensions.get('screen').height * 0.034,
+                  textAlign: 'center',
+                  marginTop: normalize(2),
+                  marginHorizontal: normalize(2),
+                  fontSize: normalize(10),
+                  placeholder:
+                    type != 'X'
+                      ? 'Reason for verification...'
+                      : 'Please enter your remarks here...',
+                }}
+                callBack={val => {
+                  handleDataChange(index, val, 'reason');
+                }}
+              />
+            </View>
+          ) : null} */}
+        </View>
+      ) : null}
+    </View>
+  );
+};
+
+export default CVerificationCard;