import React, { ReactElement, useEffect } from 'react';
import Head from 'next/head'
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import dayjs from "dayjs";
import {useAppDispatch, useAppSelector} from "../../stores/hooks";
import {useRouter} from "next/router";
import { fetch } from '../../stores/organizations/organizationsSlice'
import {saveFile} from "../../helpers/fileSaver";
import dataFormatter from '../../helpers/dataFormatter';
import ImageField from "../../components/ImageField";
import LayoutAuthenticated from "../../layouts/Authenticated";
import {getPageTitle} from "../../config";
import SectionTitleLineWithButton from "../../components/SectionTitleLineWithButton";
import SectionMain from "../../components/SectionMain";
import CardBox from "../../components/CardBox";
import BaseButton from "../../components/BaseButton";
import BaseDivider from "../../components/BaseDivider";
import {mdiChartTimelineVariant} from "@mdi/js";
import {SwitchField} from "../../components/SwitchField";
import FormField from "../../components/FormField";

import {hasPermission} from "../../helpers/userPermissions";


const OrganizationsView = () => {
    const router = useRouter()
    const dispatch = useAppDispatch()
    const { organizations } = useAppSelector((state) => state.organizations)
    
    const { currentUser } = useAppSelector((state) => state.auth);
    

    const { id } = router.query;
    
    function removeLastCharacter(str) {
      console.log(str,`str`)
      return str.slice(0, -1);
    }

    useEffect(() => {
        dispatch(fetch({ id }));
    }, [dispatch, id]);


    return (
      <>
          <Head>
              <title>{getPageTitle('View organizations')}</title>
          </Head>
          <SectionMain>
            <SectionTitleLineWithButton icon={mdiChartTimelineVariant} title={removeLastCharacter('View organizations')} main>
                <BaseButton
                  color='info'
                  label='Edit'
                  href={`/organizations/organizations-edit/?id=${id}`}
                />
            </SectionTitleLineWithButton>
            <CardBox>
            

              
                <div className={'mb-4'}>
                    <p className={'block font-bold mb-2'}>Name</p>
                    <p>{organizations?.name}</p>
                </div>
              

              

              

              

              

              

              

              

              

              

              

              

              
              

                
                <>
                    <p className={'block font-bold mb-2'}>Users Organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                <th>First Name</th>
                                
                                
                                
                                <th>Last Name</th>
                                
                                
                                
                                <th>Phone Number</th>
                                
                                
                                
                                <th>E-Mail</th>
                                
                                
                                
                                <th>Disabled</th>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.users_organizations && Array.isArray(organizations.users_organizations) &&
                              organizations.users_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/users/users-view/?id=${item.id}`)}>
                                    
                                    
                                    <td data-label="firstName">
                                        { item.firstName }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="lastName">
                                        { item.lastName }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="phoneNumber">
                                        { item.phoneNumber }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="email">
                                        { item.email }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="disabled">
                                        { dataFormatter.booleanFormatter(item.disabled) }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.users_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                
                
                
                <>
                    <p className={'block font-bold mb-2'}>Organization_memberships Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>OrganizationRole</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                                
                                <th>JoinedAt</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.organization_memberships_organization && Array.isArray(organizations.organization_memberships_organization) &&
                              organizations.organization_memberships_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/organization_memberships/organization_memberships-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="org_role">
                                        { item.org_role }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="joined_at">
                                        { dataFormatter.dateTimeFormatter(item.joined_at) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.organization_memberships_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Tax_rates Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>TaxName</th>
                                
                                
                                
                                <th>RatePercent</th>
                                
                                
                                
                                <th>Default</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.tax_rates_organization && Array.isArray(organizations.tax_rates_organization) &&
                              organizations.tax_rates_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/tax_rates/tax_rates-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="rate_percent">
                                        { item.rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_default">
                                        { dataFormatter.booleanFormatter(item.is_default) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.tax_rates_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Payment_terms Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>PaymentTermsName</th>
                                
                                
                                
                                <th>DueDays</th>
                                
                                
                                
                                <th>Notes</th>
                                
                                
                                
                                <th>Default</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.payment_terms_organization && Array.isArray(organizations.payment_terms_organization) &&
                              organizations.payment_terms_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/payment_terms/payment_terms-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="due_days">
                                        { item.due_days }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="notes">
                                        { item.notes }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_default">
                                        { dataFormatter.booleanFormatter(item.is_default) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.payment_terms_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Numbering_sequences Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>DocumentType</th>
                                
                                
                                
                                <th>Prefix</th>
                                
                                
                                
                                <th>NextNumber</th>
                                
                                
                                
                                <th>Padding</th>
                                
                                
                                
                                <th>FormatHint</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.numbering_sequences_organization && Array.isArray(organizations.numbering_sequences_organization) &&
                              organizations.numbering_sequences_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/numbering_sequences/numbering_sequences-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="document_type">
                                        { item.document_type }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="prefix">
                                        { item.prefix }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="next_number">
                                        { item.next_number }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="padding">
                                        { item.padding }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="format_hint">
                                        { item.format_hint }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.numbering_sequences_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Clients Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>ClientName</th>
                                
                                
                                
                                <th>Company</th>
                                
                                
                                
                                <th>ContactName</th>
                                
                                
                                
                                <th>Email</th>
                                
                                
                                
                                <th>Phone</th>
                                
                                
                                
                                <th>Address</th>
                                
                                
                                
                                <th>City</th>
                                
                                
                                
                                <th>ICE</th>
                                
                                
                                
                                <th>IF</th>
                                
                                
                                
                                <th>RC</th>
                                
                                
                                
                                
                                
                                <th>Active</th>
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.clients_organization && Array.isArray(organizations.clients_organization) &&
                              organizations.clients_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/clients/clients-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="display_name">
                                        { item.display_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="company_name">
                                        { item.company_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="contact_name">
                                        { item.contact_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="email">
                                        { item.email }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="phone">
                                        { item.phone }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="address">
                                        { item.address }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="city">
                                        { item.city }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="ice">
                                        { item.ice }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="if_number">
                                        { item.if_number }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="rc">
                                        { item.rc }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.clients_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Suppliers Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>SupplierName</th>
                                
                                
                                
                                <th>Company</th>
                                
                                
                                
                                <th>ContactName</th>
                                
                                
                                
                                <th>Email</th>
                                
                                
                                
                                <th>Phone</th>
                                
                                
                                
                                <th>Address</th>
                                
                                
                                
                                <th>City</th>
                                
                                
                                
                                <th>ICE</th>
                                
                                
                                
                                <th>IF</th>
                                
                                
                                
                                <th>RC</th>
                                
                                
                                
                                <th>BankName</th>
                                
                                
                                
                                <th>BankAccount</th>
                                
                                
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.suppliers_organization && Array.isArray(organizations.suppliers_organization) &&
                              organizations.suppliers_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/suppliers/suppliers-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="display_name">
                                        { item.display_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="company_name">
                                        { item.company_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="contact_name">
                                        { item.contact_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="email">
                                        { item.email }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="phone">
                                        { item.phone }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="address">
                                        { item.address }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="city">
                                        { item.city }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="ice">
                                        { item.ice }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="if_number">
                                        { item.if_number }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="rc">
                                        { item.rc }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="bank_name">
                                        { item.bank_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="bank_account">
                                        { item.bank_account }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.suppliers_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Product_categories Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>CategoryName</th>
                                
                                
                                
                                <th>Description</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.product_categories_organization && Array.isArray(organizations.product_categories_organization) &&
                              organizations.product_categories_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/product_categories/product_categories-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="description">
                                        { item.description }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.product_categories_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Units Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>UnitName</th>
                                
                                
                                
                                <th>Symbol</th>
                                
                                
                                
                                <th>Precision</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.units_organization && Array.isArray(organizations.units_organization) &&
                              organizations.units_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/units/units-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="symbol">
                                        { item.symbol }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="precision">
                                        { item.precision }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.units_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Products Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>Code</th>
                                
                                
                                
                                <th>ProductName</th>
                                
                                
                                
                                
                                
                                
                                
                                <th>SalePriceHT</th>
                                
                                
                                
                                <th>PurchasePriceHT</th>
                                
                                
                                
                                
                                
                                <th>StockOnHand</th>
                                
                                
                                
                                <th>StockReserved</th>
                                
                                
                                
                                <th>ReorderLevel</th>
                                
                                
                                
                                <th>WeightedAvgCost</th>
                                
                                
                                
                                <th>TrackStock</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.products_organization && Array.isArray(organizations.products_organization) &&
                              organizations.products_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/products/products-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="sku">
                                        { item.sku }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="sale_price_ht">
                                        { item.sale_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="purchase_price_ht">
                                        { item.purchase_price_ht }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="stock_on_hand">
                                        { item.stock_on_hand }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="stock_reserved">
                                        { item.stock_reserved }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="reorder_level">
                                        { item.reorder_level }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="weighted_avg_cost">
                                        { item.weighted_avg_cost }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="track_stock">
                                        { dataFormatter.booleanFormatter(item.track_stock) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.products_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Warehouses Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>WarehouseName</th>
                                
                                
                                
                                <th>Address</th>
                                
                                
                                
                                <th>Default</th>
                                
                                
                                
                                <th>Active</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.warehouses_organization && Array.isArray(organizations.warehouses_organization) &&
                              organizations.warehouses_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/warehouses/warehouses-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="name">
                                        { item.name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="address">
                                        { item.address }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_default">
                                        { dataFormatter.booleanFormatter(item.is_default) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_active">
                                        { dataFormatter.booleanFormatter(item.is_active) }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.warehouses_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Quotes Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>QuoteNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                <th>IssueDate</th>
                                
                                
                                
                                <th>ValidUntil</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>SubtotalHT</th>
                                
                                
                                
                                <th>TaxTotal</th>
                                
                                
                                
                                <th>TotalTTC</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.quotes_organization && Array.isArray(organizations.quotes_organization) &&
                              organizations.quotes_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/quotes/quotes-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="quote_number">
                                        { item.quote_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="issue_date">
                                        { dataFormatter.dateTimeFormatter(item.issue_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="valid_until">
                                        { dataFormatter.dateTimeFormatter(item.valid_until) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="subtotal_ht">
                                        { item.subtotal_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_total">
                                        { item.tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="total_ttc">
                                        { item.total_ttc }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.quotes_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Quote_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                                
                                <th>UnitPriceHT</th>
                                
                                
                                
                                <th>DiscountPercent</th>
                                
                                
                                
                                <th>TaxRatePercent</th>
                                
                                
                                
                                <th>LineTotalHT</th>
                                
                                
                                
                                <th>LineTaxTotal</th>
                                
                                
                                
                                <th>LineTotalTTC</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.quote_items_organizations && Array.isArray(organizations.quote_items_organizations) &&
                              organizations.quote_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/quote_items/quote_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_price_ht">
                                        { item.unit_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="discount_percent">
                                        { item.discount_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_rate_percent">
                                        { item.tax_rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ht">
                                        { item.line_total_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_tax_total">
                                        { item.line_tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ttc">
                                        { item.line_total_ttc }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.quote_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Sales_orders Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>OrderNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>OrderDate</th>
                                
                                
                                
                                <th>ExpectedDeliveryDate</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>SubtotalHT</th>
                                
                                
                                
                                <th>TaxTotal</th>
                                
                                
                                
                                <th>TotalTTC</th>
                                
                                
                                
                                <th>StockReserved</th>
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.sales_orders_organization && Array.isArray(organizations.sales_orders_organization) &&
                              organizations.sales_orders_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/sales_orders/sales_orders-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="order_number">
                                        { item.order_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="order_date">
                                        { dataFormatter.dateTimeFormatter(item.order_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="expected_delivery_date">
                                        { dataFormatter.dateTimeFormatter(item.expected_delivery_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="subtotal_ht">
                                        { item.subtotal_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_total">
                                        { item.tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="total_ttc">
                                        { item.total_ttc }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="stock_reserved">
                                        { dataFormatter.booleanFormatter(item.stock_reserved) }
                                    </td>
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.sales_orders_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Sales_order_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                                
                                <th>UnitPriceHT</th>
                                
                                
                                
                                <th>DiscountPercent</th>
                                
                                
                                
                                <th>TaxRatePercent</th>
                                
                                
                                
                                <th>LineTotalHT</th>
                                
                                
                                
                                <th>LineTaxTotal</th>
                                
                                
                                
                                <th>LineTotalTTC</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.sales_order_items_organizations && Array.isArray(organizations.sales_order_items_organizations) &&
                              organizations.sales_order_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/sales_order_items/sales_order_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_price_ht">
                                        { item.unit_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="discount_percent">
                                        { item.discount_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_rate_percent">
                                        { item.tax_rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ht">
                                        { item.line_total_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_tax_total">
                                        { item.line_tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ttc">
                                        { item.line_total_ttc }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.sales_order_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Delivery_notes Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>DeliveryNoteNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>IssueDate</th>
                                
                                
                                
                                <th>DeliveredAt</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>Carrier</th>
                                
                                
                                
                                <th>TrackingReference</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.delivery_notes_organization && Array.isArray(organizations.delivery_notes_organization) &&
                              organizations.delivery_notes_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/delivery_notes/delivery_notes-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="delivery_note_number">
                                        { item.delivery_note_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="issue_date">
                                        { dataFormatter.dateTimeFormatter(item.issue_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="delivered_at">
                                        { dataFormatter.dateTimeFormatter(item.delivered_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="carrier_name">
                                        { item.carrier_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tracking_reference">
                                        { item.tracking_reference }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.delivery_notes_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Delivery_note_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.delivery_note_items_organizations && Array.isArray(organizations.delivery_note_items_organizations) &&
                              organizations.delivery_note_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/delivery_note_items/delivery_note_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.delivery_note_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Invoices Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>InvoiceNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>IssueDate</th>
                                
                                
                                
                                <th>DueDate</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>SubtotalHT</th>
                                
                                
                                
                                <th>TaxTotal</th>
                                
                                
                                
                                <th>TotalTTC</th>
                                
                                
                                
                                <th>AmountPaid</th>
                                
                                
                                
                                <th>ExportedtoAccounting</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.invoices_organization && Array.isArray(organizations.invoices_organization) &&
                              organizations.invoices_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/invoices/invoices-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="invoice_number">
                                        { item.invoice_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="issue_date">
                                        { dataFormatter.dateTimeFormatter(item.issue_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="due_date">
                                        { dataFormatter.dateTimeFormatter(item.due_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="subtotal_ht">
                                        { item.subtotal_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_total">
                                        { item.tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="total_ttc">
                                        { item.total_ttc }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="amount_paid">
                                        { item.amount_paid }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="is_exported_accounting">
                                        { dataFormatter.booleanFormatter(item.is_exported_accounting) }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.invoices_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Invoice_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                                
                                <th>UnitPriceHT</th>
                                
                                
                                
                                <th>DiscountPercent</th>
                                
                                
                                
                                <th>TaxRatePercent</th>
                                
                                
                                
                                <th>LineTotalHT</th>
                                
                                
                                
                                <th>LineTaxTotal</th>
                                
                                
                                
                                <th>LineTotalTTC</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.invoice_items_organizations && Array.isArray(organizations.invoice_items_organizations) &&
                              organizations.invoice_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/invoice_items/invoice_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_price_ht">
                                        { item.unit_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="discount_percent">
                                        { item.discount_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_rate_percent">
                                        { item.tax_rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ht">
                                        { item.line_total_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_tax_total">
                                        { item.line_tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ttc">
                                        { item.line_total_ttc }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.invoice_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Payments Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>PaymentDate</th>
                                
                                
                                
                                <th>Amount</th>
                                
                                
                                
                                <th>Method</th>
                                
                                
                                
                                <th>Reference</th>
                                
                                
                                
                                <th>Notes</th>
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.payments_organization && Array.isArray(organizations.payments_organization) &&
                              organizations.payments_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/payments/payments-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="payment_date">
                                        { dataFormatter.dateTimeFormatter(item.payment_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="amount">
                                        { item.amount }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="method">
                                        { item.method }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="reference">
                                        { item.reference }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="notes">
                                        { item.notes }
                                    </td>
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.payments_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Credit_notes Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>CreditNoteNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                <th>IssueDate</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>SubtotalHT</th>
                                
                                
                                
                                <th>TaxTotal</th>
                                
                                
                                
                                <th>TotalTTC</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.credit_notes_organization && Array.isArray(organizations.credit_notes_organization) &&
                              organizations.credit_notes_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/credit_notes/credit_notes-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="credit_note_number">
                                        { item.credit_note_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="issue_date">
                                        { dataFormatter.dateTimeFormatter(item.issue_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="subtotal_ht">
                                        { item.subtotal_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_total">
                                        { item.tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="total_ttc">
                                        { item.total_ttc }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.credit_notes_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Credit_note_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                                
                                <th>UnitPriceHT</th>
                                
                                
                                
                                <th>TaxRatePercent</th>
                                
                                
                                
                                <th>LineTotalHT</th>
                                
                                
                                
                                <th>LineTaxTotal</th>
                                
                                
                                
                                <th>LineTotalTTC</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.credit_note_items_organizations && Array.isArray(organizations.credit_note_items_organizations) &&
                              organizations.credit_note_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/credit_note_items/credit_note_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_price_ht">
                                        { item.unit_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_rate_percent">
                                        { item.tax_rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ht">
                                        { item.line_total_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_tax_total">
                                        { item.line_tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ttc">
                                        { item.line_total_ttc }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.credit_note_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Purchase_orders Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>PurchaseOrderNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                <th>OrderDate</th>
                                
                                
                                
                                <th>ExpectedReceiptDate</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>SubtotalHT</th>
                                
                                
                                
                                <th>TaxTotal</th>
                                
                                
                                
                                <th>TotalTTC</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.purchase_orders_organization && Array.isArray(organizations.purchase_orders_organization) &&
                              organizations.purchase_orders_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/purchase_orders/purchase_orders-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="purchase_order_number">
                                        { item.purchase_order_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="order_date">
                                        { dataFormatter.dateTimeFormatter(item.order_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="expected_receipt_date">
                                        { dataFormatter.dateTimeFormatter(item.expected_receipt_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="subtotal_ht">
                                        { item.subtotal_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_total">
                                        { item.tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="total_ttc">
                                        { item.total_ttc }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.purchase_orders_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Purchase_order_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>Designation</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>Unit</th>
                                
                                
                                
                                <th>UnitPriceHT</th>
                                
                                
                                
                                <th>TaxRatePercent</th>
                                
                                
                                
                                <th>LineTotalHT</th>
                                
                                
                                
                                <th>LineTaxTotal</th>
                                
                                
                                
                                <th>LineTotalTTC</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.purchase_order_items_organizations && Array.isArray(organizations.purchase_order_items_organizations) &&
                              organizations.purchase_order_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/purchase_order_items/purchase_order_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="designation">
                                        { item.designation }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_label">
                                        { item.unit_label }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_price_ht">
                                        { item.unit_price_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="tax_rate_percent">
                                        { item.tax_rate_percent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ht">
                                        { item.line_total_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_tax_total">
                                        { item.line_tax_total }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="line_total_ttc">
                                        { item.line_total_ttc }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.purchase_order_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Stock_receptions Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>ReceptionNumber</th>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>ReceivedAt</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.stock_receptions_organization && Array.isArray(organizations.stock_receptions_organization) &&
                              organizations.stock_receptions_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/stock_receptions/stock_receptions-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="reception_number">
                                        { item.reception_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="received_at">
                                        { dataFormatter.dateTimeFormatter(item.received_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.stock_receptions_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Stock_reception_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>QuantityReceived</th>
                                
                                
                                
                                <th>UnitCostHT</th>
                                
                                
                                
                                <th>ExpiryDate</th>
                                
                                
                                
                                <th>BatchCode</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.stock_reception_items_organizations && Array.isArray(organizations.stock_reception_items_organizations) &&
                              organizations.stock_reception_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/stock_reception_items/stock_reception_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="quantity_received">
                                        { item.quantity_received }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_cost_ht">
                                        { item.unit_cost_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="expiry_date">
                                        { dataFormatter.dateTimeFormatter(item.expiry_date) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="batch_code">
                                        { item.batch_code }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.stock_reception_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Stock_reservations Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>QuantityReserved</th>
                                
                                
                                
                                <th>ReservedAt</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.stock_reservations_organization && Array.isArray(organizations.stock_reservations_organization) &&
                              organizations.stock_reservations_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/stock_reservations/stock_reservations-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="quantity_reserved">
                                        { item.quantity_reserved }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="reserved_at">
                                        { dataFormatter.dateTimeFormatter(item.reserved_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.stock_reservations_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Stock_movements Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                
                                
                                <th>MovedAt</th>
                                
                                
                                
                                <th>MovementType</th>
                                
                                
                                
                                <th>Quantity</th>
                                
                                
                                
                                <th>UnitCostHT</th>
                                
                                
                                
                                <th>Reference</th>
                                
                                
                                
                                <th>Notes</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.stock_movements_organization && Array.isArray(organizations.stock_movements_organization) &&
                              organizations.stock_movements_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/stock_movements/stock_movements-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="moved_at">
                                        { dataFormatter.dateTimeFormatter(item.moved_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="movement_type">
                                        { item.movement_type }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity">
                                        { item.quantity }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="unit_cost_ht">
                                        { item.unit_cost_ht }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="reference">
                                        { item.reference }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="notes">
                                        { item.notes }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.stock_movements_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Inventory_counts Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>InventoryNumber</th>
                                
                                
                                
                                
                                
                                <th>StartedAt</th>
                                
                                
                                
                                <th>ClosedAt</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.inventory_counts_organization && Array.isArray(organizations.inventory_counts_organization) &&
                              organizations.inventory_counts_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/inventory_counts/inventory_counts-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="inventory_number">
                                        { item.inventory_number }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="started_at">
                                        { dataFormatter.dateTimeFormatter(item.started_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="closed_at">
                                        { dataFormatter.dateTimeFormatter(item.closed_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.inventory_counts_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Inventory_count_items organizations</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>SystemQuantity</th>
                                
                                
                                
                                <th>CountedQuantity</th>
                                
                                
                                
                                <th>Difference</th>
                                
                                
                                
                                <th>Notes</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.inventory_count_items_organizations && Array.isArray(organizations.inventory_count_items_organizations) &&
                              organizations.inventory_count_items_organizations.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/inventory_count_items/inventory_count_items-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="quantity_system">
                                        { item.quantity_system }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity_counted">
                                        { item.quantity_counted }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="quantity_diff">
                                        { item.quantity_diff }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="notes">
                                        { item.notes }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.inventory_count_items_organizations?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Import_jobs Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                <th>JobType</th>
                                
                                
                                
                                <th>Status</th>
                                
                                
                                
                                <th>StartedAt</th>
                                
                                
                                
                                <th>FinishedAt</th>
                                
                                
                                
                                
                                
                                
                                
                                <th>ProcessedCount</th>
                                
                                
                                
                                <th>ErrorCount</th>
                                
                                
                                
                                <th>Log</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.import_jobs_organization && Array.isArray(organizations.import_jobs_organization) &&
                              organizations.import_jobs_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/import_jobs/import_jobs-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    <td data-label="job_type">
                                        { item.job_type }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="status">
                                        { item.status }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="started_at">
                                        { dataFormatter.dateTimeFormatter(item.started_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="finished_at">
                                        { dataFormatter.dateTimeFormatter(item.finished_at) }
                                    </td>
                                    
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="processed_count">
                                        { item.processed_count }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="error_count">
                                        { item.error_count }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="log">
                                        { item.log }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.import_jobs_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                
                <>
                    <p className={'block font-bold mb-2'}>Audit_logs Organization</p>
                    <CardBox
                      className='mb-6 border border-gray-300 rounded overflow-hidden'
                      hasTable
                    >
                        <div className='overflow-x-auto'>
                            <table>
                            <thead>
                            <tr>
                                
                                
                                
                                
                                
                                
                                <th>EventAt</th>
                                
                                
                                
                                <th>Action</th>
                                
                                
                                
                                <th>Entity</th>
                                
                                
                                
                                <th>RecordReference</th>
                                
                                
                                
                                <th>IPAddress</th>
                                
                                
                                
                                <th>UserAgent</th>
                                
                                
                                
                                <th>Details</th>
                                
                                
                            </tr>
                            </thead>
                            <tbody>
                            {organizations.audit_logs_organization && Array.isArray(organizations.audit_logs_organization) &&
                              organizations.audit_logs_organization.map((item: any) => (
                                <tr key={item.id} onClick={() => router.push(`/audit_logs/audit_logs-view/?id=${item.id}`)}>
                                    
                                    
                                    
                                    
                                    
                                    
                                    <td data-label="event_at">
                                        { dataFormatter.dateTimeFormatter(item.event_at) }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="action">
                                        { item.action }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="entity_name">
                                        { item.entity_name }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="record_reference">
                                        { item.record_reference }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="ip_address">
                                        { item.ip_address }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="user_agent">
                                        { item.user_agent }
                                    </td>
                                    
                                    
                                    
                                    <td data-label="details">
                                        { item.details }
                                    </td>
                                    
                                    
                                </tr>
                              ))}
                            </tbody>
                        </table>
                        </div>
                        {!organizations?.audit_logs_organization?.length && <div className={'text-center py-4'}>No data</div>}
                    </CardBox>
                </>
                
                

                <BaseDivider />

                <BaseButton
                    color='info'
                    label='Back'
                    onClick={() => router.push('/organizations/organizations-list')}
                />
              </CardBox>
          </SectionMain>
      </>
    );
};

OrganizationsView.getLayout = function getLayout(page: ReactElement) {
    return (
      <LayoutAuthenticated
        
        permission={'READ_ORGANIZATIONS'}
        
      >
          {page}
      </LayoutAuthenticated>
    )
}

export default OrganizationsView;