wip

2026-03-26 17:40:24 +02:00
parent aa89484b64
commit 8b59f28125
15 changed files with 28 additions and 69 deletions
@@ -1,5 +1,6 @@
-import { IsEmail, IsOptional, IsString } from 'class-validator';
+import { IsEmail, IsString } from 'class-validator';
 import { ApiProperty } from '@nestjs/swagger';
+import { IsOptional } from '@/common/decorators/Validators';

 export class ContactAddressDto {
  @ApiProperty({ required: false, description: 'Billing address line 1' })
@@ -1,6 +1,7 @@
-import { IsBoolean, IsEmail, IsNotEmpty, IsOptional, IsString } from 'class-validator';
+import { IsBoolean, IsEmail, IsNotEmpty, IsString } from 'class-validator';
 import { ApiProperty } from '@nestjs/swagger';
 import { ContactAddressDto } from './ContactAddress.dto';
+import { IsOptional } from '@/common/decorators/Validators';

 export class EditCustomerDto extends ContactAddressDto {
  @ApiProperty({ required: true, description: 'Customer type' })
@@ -12,7 +12,7 @@ import CustomerDetailsDrawer from '@/containers/Drawers/CustomerDetailsDrawer';
 import VendorDetailsDrawer from '@/containers/Drawers/VendorDetailsDrawer';
 import InventoryAdjustmentDetailDrawer from '@/containers/Drawers/InventoryAdjustmentDetailDrawer';
 import CashflowTransactionDetailDrawer from '@/containers/Drawers/CashflowTransactionDetailDrawer';
-// import QuickCreateCustomerDrawer from '@/containers/Drawers/QuickCreateCustomerDrawer';
+import QuickCreateCustomerDrawer from '@/containers/Drawers/QuickCreateCustomerDrawer';
 import QuickCreateItemDrawer from '@/containers/Drawers/QuickCreateItemDrawer';
 import QuickWriteVendorDrawer from '@/containers/Drawers/QuickWriteVendorDrawer';
 import CreditNoteDetailDrawer from '@/containers/Drawers/CreditNoteDetailDrawer';
@@ -59,7 +59,7 @@ export default function DrawersContainer() {
      <CashflowTransactionDetailDrawer
        name={DRAWERS.CASHFLOW_TRNASACTION_DETAILS}
      />
-      {/* <QuickCreateCustomerDrawer name={DRAWERS.QUICK_CREATE_CUSTOMER} /> */}
+      <QuickCreateCustomerDrawer name={DRAWERS.QUICK_CREATE_CUSTOMER} />
      <QuickCreateItemDrawer name={DRAWERS.QUICK_CREATE_ITEM} />
      <QuickWriteVendorDrawer name={DRAWERS.QUICK_WRITE_VENDOR} />
      <CreditNoteDetailDrawer name={DRAWERS.CREDIT_NOTE_DETAILS} />
@@ -92,7 +92,6 @@ export function CustomerFormBasicSection({}) {
        />
      </FFormGroup>

-
      <Divider  style={{ margin: '20px 0' }} />

      {/*------------ Vendor email -----------*/}
@@ -6,15 +6,8 @@ import { css } from '@emotion/css';
 import { CustomerFloatingActions } from "./CustomerFloatingActions";
 import { CustomerFormSections } from "./CustomerFormFields";

-const customerFormSections = {
-  primary: 'primary',
-  financial: 'financial',
-  billingAddress: 'billingAddress',
-  shippingAddress: 'shippingAddress',
-  notes: 'notes',
-};
 export function CustomerFormContent() {
-  const [selectedTabId, setSelectedTabId] = useState(customerFormSections.primary);
+  const [selectedTabId, setSelectedTabId] = useState('primary');

  const handleTabChange = (tabId: string) => {
    const sectionId = String(tabId);
@@ -38,11 +31,11 @@ export function CustomerFormContent() {
            onChange={handleTabChange}
            className={css`position: sticky; top: 20px; .bp4-large > .bp4-tab{font-size: 14px;} `}
          >
-            <Tab id={customerFormSections.primary} title={'Basic'} />
-            <Tab id={customerFormSections.financial} title={'Financial'} />
-            <Tab id={customerFormSections.billingAddress} title={'Billing address'} />
-            <Tab id={customerFormSections.shippingAddress} title={'Ship address'} />
-            <Tab id={customerFormSections.notes} title={'Notes'} />
+            <Tab id={'primary'} title={'Basic'} />
+            <Tab id={'financial'} title={'Financial'} />
+            <Tab id={'billingAddress'} title={'Billing address'} />
+            <Tab id={'shippingAddress'} title={'Ship address'} />
+            <Tab id={'notes'} title={'Notes'} />
          </Tabs>

        <CustomerFormSections />
@@ -3,13 +3,11 @@ import intl from 'react-intl-universal';
 import { Formik, Form, FormikHelpers } from 'formik';
 import { Intent } from '@blueprintjs/core';
 import styled from 'styled-components';
-
 import { CreateCustomerForm, EditCustomerForm } from './CustomerForm.schema';
 import { compose, transformToForm, saveInvoke, parseBoolean } from '@/utils';
 import { useCustomerFormContext } from './CustomerFormProvider';
 import { defaultInitialValues } from './utils';
-
-import { AppToaster, Box } from '@/components';
+import { AppToaster } from '@/components';
 import { withCurrentOrganization } from '@/containers/Organization/withCurrentOrganization';
 import { CustomerFormContent } from './CustomerFormContent';

@@ -140,7 +138,6 @@ function CustomerFormFormikRoot({
      setSubmitting(false);
      saveInvoke(onSubmitError, values, formArgs, submitPayload);
    };
-
    if (isNewMode) {
      createCustomerMutate(formValues).then(onSuccess).catch(onError);
    } else {
@@ -150,7 +147,6 @@ function CustomerFormFormikRoot({
  };

  return (
-    <Box mx={'auto'} maxWidth={800}>
      <Formik<CustomerFormValues>
        validationSchema={isNewMode ? CreateCustomerForm : EditCustomerForm}
        initialValues={initialValues}
@@ -162,7 +158,6 @@ function CustomerFormFormikRoot({
          </CustomerFormFields>
        </Form>
      </Formik>
-      </Box>
  );
 }

@@ -171,7 +166,6 @@ const CustomerFormFields = styled.div`
  .bp6-form-content {
    min-width: 300px;
  }
-
  .bp4-form-group.bp4-inline label.bp4-label {
    min-width: 140px;
  }
@@ -2,9 +2,7 @@
 import React from 'react';
 import { useParams, useHistory } from 'react-router-dom';
 import styled from 'styled-components';
-
-import { DashboardCard, DashboardInsider } from '@/components';
-
+import { Box, DashboardCard, DashboardInsider } from '@/components';
 import { CustomerFormFormik } from './CustomerFormFormik';
 import {
  CustomerFormProvider,
@@ -49,10 +47,12 @@ export default function CustomerFormPage() {
  return (
    <CustomerFormProvider customerId={customerId}>
      <CustomerFormPageLoading>
+        <Box mx={'auto'} maxWidth={800}>
          <CustomerFormFormik
            onSubmitSuccess={handleSubmitSuccess}
            onCancel={handleFormCancel}
          />
+        </Box>
      </CustomerFormPageLoading>
    </CustomerFormProvider>
  );
@@ -53,34 +53,14 @@ function QuickCustomerFormDrawer({
  return (
    <CustomerFormProvider customerId={customerId}>
      <DrawerCustomerFormLoading>
-        <CustomerFormCard>
-          {/* <CustomerFormFormik
+          <CustomerFormFormik
            initialValues={{ first_name: displayName }}
            onSubmitSuccess={handleSubmitSuccess}
            onCancel={handleCancelForm}
-          /> */}
-        </CustomerFormCard>
+          />
      </DrawerCustomerFormLoading>
    </CustomerFormProvider>
  );
 }

 export default R.compose(withDrawerActions)(QuickCustomerFormDrawer);
-
-const CustomerFormCard = styled(Card)`
-  margin: 15px;
-  padding: 25px;
-  margin-bottom: calc(15px + 65px);
-
-  // ${CustomerFormHeaderPrimary} {
-  //   padding-top: 0;
-  // }
-  .page-form {
-    padding: 0;
-
-    &__floating-actions {
-      margin-left: -41px;
-      margin-right: -41px;
-    }
-  }
-`;
@@ -5,7 +5,7 @@ import { Dragzone, FormattedMessage as T } from '@/components';
 /**
 * Vendor Attachment Tab.
 */
-function VendorAttachmentTab() {
+export function VendorAttachmentTab() {
  return (
    <div>
      <Dragzone
@@ -17,5 +17,3 @@ function VendorAttachmentTab() {
    </div>
  );
 }
-
-export default VendorAttachmentTab;
@@ -28,7 +28,7 @@ import { useCurrentOrganization } from '@/hooks/state';
 /**
 * Vendor Finaniceal Panel Tab.
 */
-export default function VendorFinanicalPanelTab() {
+export function VendorFinanicalPanelTab() {
  const { currencies, branches } = useVendorFormContext();

  // Sets the primary branch to form.
@@ -7,7 +7,7 @@ import { FormattedMessage as T, FFormGroup, FInputGroup } from '@/components';
 /**
 * Vendor form  after primary section.
 */
-function VendorFormAfterPrimarySection() {
+export function VendorFormAfterPrimarySection() {
  return (
    <div className={'customer-form__after-primary-section-content'}>
      {/*------------ Vendor email -----------*/}
@@ -42,5 +42,3 @@ function VendorFormAfterPrimarySection() {
    </div>
  );
 }
-
-export default VendorFormAfterPrimarySection;
@@ -24,7 +24,7 @@ import { defaultInitialValues } from './utils';
 /**
 * Vendor form.
 */
-function VendorFormFormik({
+function VendorFormFormikBase({
  // #withCurrentOrganization
  organization: { base_currency },

@@ -131,4 +131,4 @@ const VendorFormFields = styled.div`
  }
 `;

-export default compose(withCurrentOrganization())(VendorFormFormik);
+export const VendorFormFormik = compose(withCurrentOrganization())(VendorFormFormikBase);
@@ -2,12 +2,9 @@
 import React from 'react';
 import styled from 'styled-components';
 import { useParams, useHistory } from 'react-router-dom';
-
-import '@/style/pages/Vendors/PageForm.scss';
-
 import { DashboardCard, DashboardInsider } from '@/components';
 import { VendorFormProvider, useVendorFormContext } from './VendorFormProvider';
-import VendorFormFormik from './VendorFormFormik';
+import { VendorFormFormik } from './VendorFormFormik';

 /**
 * Vendor form page loading wrapper.
@@ -26,7 +23,7 @@ function VendorFormPageLoading({ children }) {
 /**
 * Vendor form page.
 */
-export default function VendorFormPage() {
+export function VendorFormPage() {
  const history = useHistory();
  const { id } = useParams();

@@ -18,7 +18,7 @@ import { useAutofocus } from '@/hooks';
 /**
 * Vendor form primary section.
 */
-function VendorFormPrimarySection() {
+export function VendorFormPrimarySection() {
  const firstNameFieldRef = useAutofocus();

  return (
@@ -80,5 +80,3 @@ function VendorFormPrimarySection() {
    </div>
  );
 }
-
-export default VendorFormPrimarySection;
@@ -5,7 +5,7 @@ import classNames from 'classnames';
 import { Tabs, Tab } from '@blueprintjs/core';
 import { CLASSES } from '@/constants/classes';

-import VendorFinanicalPanelTab from './VendorFinanicalPanelTab';
+import { VendorFinanicalPanelTab } from './VendorFinanicalPanelTab';

 import CustomerAddressTabs from '@/containers/Customers/CustomerForm/CustomerAddressTabs';
 import CustomerNotePanel from '@/containers/Customers/CustomerForm/CustomerNotePanel';
@@ -13,7 +13,7 @@ import CustomerNotePanel from '@/containers/Customers/CustomerForm/CustomerNoteP
 /**
 * Vendor form tabs.
 */
-export default function VendorTabs() {
+export function VendorsTabs() {
  return (
    <div className={classNames(CLASSES.PAGE_FORM_TABS)}>
      <Tabs