perf: add contact phone number in invoice header (#3427)

1f4e5f6d · papapatrick · GitHub · ce2e926d · 1f4e5f6d · 1f4e5f6d
Commit 1f4e5f6d authored Dec 19, 2024 by papapatrick Committed by GitHub Dec 19, 2024
8 changed files
--- a/packages/global/support/user/team/type.d.ts
+++ b/packages/global/support/user/team/type.d.ts
@@ -101,6 +101,7 @@ export type TeamInvoiceHeaderType = {
  bankName?: string;
  bankAccount?: string;
  needSpecialInvoice: boolean;
+  contactPhone: string;
  emailAddress: string;
 };

--- a/packages/web/i18n/en/account_bill.json
+++ b/packages/web/i18n/en/account_bill.json
@@ -9,6 +9,8 @@
  "company_phone": "Company phone number",
  "completed": "Completed",
  "confirm": "confirm",
+  "contact_phone": "Contact phone number",
+  "contact_phone_void": "Contact phone number format error",
  "default_header": "Default header",
  "detail": "Details",
  "email_address": "Email address",
@@ -45,7 +47,8 @@
  "time": "time",
  "type": "type",
  "unit_code": "unified credit code",
+  "unit_code_void": "Unified credit code format error",
  "update": "renew",
  "yes": "yes",
  "yuan": "¥{{amount}}"
 }
\ No newline at end of file
--- a/packages/web/i18n/zh-CN/account_bill.json
+++ b/packages/web/i18n/zh-CN/account_bill.json
@@ -11,6 +11,8 @@
  "confirm": "确认",
  "default_header": "默认抬头",
  "detail": "详情",
+  "contact_phone": "联系电话",
+  "contact_phone_void": "联系电话格式错误",
  "email_address": "邮箱地址",
  "extra_ai_points": "额外 AI 积分",
  "extra_dataset_size": "额外知识库容量",
@@ -45,6 +47,7 @@
  "time": "时间",
  "type": "类型",
  "unit_code": "统一信用代码",
+  "unit_code_void": "统一信用代码格式错误",
  "update": "更新",
  "yes": "是",
  "yuan": "{{amount}}元"

--- a/packages/web/i18n/zh-Hant/account_bill.json
+++ b/packages/web/i18n/zh-Hant/account_bill.json
@@ -9,6 +9,8 @@
  "company_phone": "公司電話",
  "completed": "已完成",
  "confirm": "確認",
+  "contact_phone": "聯絡電話",
+  "contact_phone_void": "聯絡電話格式錯誤",
  "default_header": "預設抬頭",
  "detail": "詳情",
  "email_address": "郵件地址",
@@ -45,7 +47,8 @@
  "time": "時間",
  "type": "類型",
  "unit_code": "統一信用代碼",
+  "unit_code_void": "統一信用代碼格式錯誤",
  "update": "更新",
  "yes": "是",
  "yuan": "{{amount}}元"
 }
\ No newline at end of file
--- a/packages/web/i18n/zh-Hant/common.json
+++ b/packages/web/i18n/zh-Hant/common.json
@@ -841,6 +841,7 @@
  "dataset.Create Folder": "建立資料夾",
  "dataset.Create manual collection": "建立手動資料集",
  "dataset.Delete Dataset Error": "刪除知識庫錯誤",
+  "dataset.Edit API Service": "編輯 API 檔案介面",
  "dataset.Edit Folder": "編輯資料夾",
  "dataset.Edit Info": "編輯資訊",
  "dataset.Export": "匯出",

--- a/projects/app/src/pages/account/bill/components/ApplyInvoiceModal.tsx
+++ b/projects/app/src/pages/account/bill/components/ApplyInvoiceModal.tsx
@@ -97,6 +97,7 @@ const ApplyInvoiceModal = ({ onClose }: { onClose: () => void }) => {
      bankName: '',
      bankAccount: '',
      needSpecialInvoice: false,
+      contactPhone: '',
      emailAddress: ''
    }
  });
@@ -117,7 +118,7 @@ const ApplyInvoiceModal = ({ onClose }: { onClose: () => void }) => {
      isOpen={true}
      isCentered
      iconSrc="/imgs/modal/invoice.svg"
-      minHeight={'42.25rem'}
+      minHeight={isOpenSettleModal ? '46.4rem' : '42.25rem'}
      w={'43rem'}
      onClose={onClose}
      isLoading={isLoading}
@@ -235,7 +236,7 @@ const ApplyInvoiceModal = ({ onClose }: { onClose: () => void }) => {
          </Box>
          <MyBox isLoading={isLoadingHeader}>
            <Flex justify={'center'}>
-              <InvoiceHeaderSingleForm inputForm={inputForm} />
+              <InvoiceHeaderSingleForm inputForm={inputForm} required />
            </Flex>
          </MyBox>
          <Flex

--- a/projects/app/src/pages/account/bill/components/InvoiceHeaderForm.tsx
+++ b/projects/app/src/pages/account/bill/components/InvoiceHeaderForm.tsx
@@ -9,9 +9,11 @@ import { UseFormReturn, useForm } from 'react-hook-form';
 import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
 export const InvoiceHeaderSingleForm = ({
-  inputForm
+  inputForm,
+  required = false
 }: {
  inputForm: UseFormReturn<TeamInvoiceHeaderType, any>;
+  required?: boolean;
 }) => {
  const { t } = useTranslation();
@@ -38,11 +40,11 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required>{t('account_bill:organization_name')}</FormLabel>
+          <FormLabel required={required}>{t('account_bill:organization_name')}</FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:organization_name')}
-            {...register('teamName', { required: true })}
+            {...register('teamName', { required })}
          />
        </Flex>
        <Flex
@@ -50,11 +52,14 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required>{t('account_bill:unit_code')}</FormLabel>
+          <FormLabel required={required}>{t('account_bill:unit_code')}</FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:unit_code')}
-            {...register('unifiedCreditCode', { required: true })}
+            {...register('unifiedCreditCode', {
+              required,
+              pattern: { value: /^[A-Z0-9]{18}$/, message: t('account_bill:unit_code_void') }
+            })}
          />
        </Flex>
        <Flex
@@ -62,11 +67,13 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required={!!needSpecialInvoice}>{t('account_bill:company_address')}</FormLabel>
+          <FormLabel required={!!needSpecialInvoice && required}>
+            {t('account_bill:company_address')}
+          </FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:company_address')}
-            {...register('companyAddress', { required: !!needSpecialInvoice })}
+            {...register('companyAddress', { required: !!needSpecialInvoice && required })}
          />
        </Flex>
        <Flex
@@ -74,11 +81,13 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required={!!needSpecialInvoice}>{t('account_bill:company_phone')}</FormLabel>
+          <FormLabel required={!!needSpecialInvoice && required}>
+            {t('account_bill:company_phone')}
+          </FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:company_phone')}
-            {...register('companyPhone', { required: !!needSpecialInvoice })}
+            {...register('companyPhone', { required: !!needSpecialInvoice && required })}
          />
        </Flex>
        <Flex
@@ -86,11 +95,13 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required={!!needSpecialInvoice}>{t('account_bill:bank_name')}</FormLabel>
+          <FormLabel required={!!needSpecialInvoice && required}>
+            {t('account_bill:bank_name')}
+          </FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:bank_name')}
-            {...register('bankName', { required: !!needSpecialInvoice })}
+            {...register('bankName', { required: !!needSpecialInvoice && required })}
          />
        </Flex>
        <Flex
@@ -98,11 +109,13 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required={!!needSpecialInvoice}>{t('account_bill:bank_account')}</FormLabel>
+          <FormLabel required={!!needSpecialInvoice && required}>
+            {t('account_bill:bank_account')}
+          </FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:bank_account')}
-            {...register('bankAccount', { required: !!needSpecialInvoice })}
+            {...register('bankAccount', { required: !!needSpecialInvoice && required })}
          />
        </Flex>
        <Flex
@@ -110,7 +123,7 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required>{t('account_bill:need_special_invoice')}</FormLabel>
+          <FormLabel required={required}>{t('account_bill:need_special_invoice')}</FormLabel>
          {/* @ts-ignore */}
          <RadioGroup
            value={`${needSpecialInvoice}`}
@@ -137,12 +150,31 @@ export const InvoiceHeaderSingleForm = ({
          alignItems={['flex-start', 'center']}
          flexDir={['column', 'row']}
        >
-          <FormLabel required>{t('account_bill:email_address')}</FormLabel>
+          <FormLabel required={required}>{t('account_bill:contact_phone')}</FormLabel>
+          <Input
+            {...styles}
+            placeholder={t('account_bill:contact_phone')}
+            {...register('contactPhone', {
+              required,
+              pattern: {
+                value:
+                  /^(?:\+?\d{1,3}[- ]?)?(?:\(\d{1,4}\)|\d{1,4})?[- ]?\d{1,4}[- ]?\d{1,4}[- ]?\d{1,9}$/,
+                message: t('account_bill:contact_phone_void')
+              }
+            })}
+          />
+        </Flex>
+        <Flex
+          justify={'space-between'}
+          alignItems={['flex-start', 'center']}
+          flexDir={['column', 'row']}
+        >
+          <FormLabel required={required}>{t('account_bill:email_address')}</FormLabel>
          <Input
            {...styles}
            placeholder={t('account_bill:email_address')}
            {...register('emailAddress', {
-              required: true,
+              required,
              pattern: {
                value: /(^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$)/,
                message: t('user:password.email_phone_error')
@@ -165,7 +197,8 @@ const InvoiceHeaderForm = () => {
      bankName: '',
      bankAccount: '',
      needSpecialInvoice: false,
-      emailAddress: ''
+      emailAddress: '',
+      contactPhone: ''
    }
  });

--- a/projects/app/src/pages/account/bill/components/InvoiceTable.tsx
+++ b/projects/app/src/pages/account/bill/components/InvoiceTable.tsx
@@ -163,6 +163,7 @@ function InvoiceDetailModal({
            label={t('account_bill:need_special_invoice')}
            value={invoice.needSpecialInvoice ? t('account_bill:yes') : t('account_bill:no')}
          />
+          <LabelItem label={t('account_bill:contact_phone')} value={invoice.contactPhone} />
          <LabelItem label={t('account_bill:email_address')} value={invoice.emailAddress} />
        </Flex>
      </ModalBody>