kts-component-invoice-operate 3.2.78 → 3.2.80

package/src/Invoice/InvoiceController/InvoiceControllerState/index.ts

@@ -2,19 +2,20 @@ import GoodsListState from './GoodsListState';
 import BuyerState from './BuyerState';
 import Stakeholder from './Stakeholder';
 import { IInvoiceTypeModalProps } from '../../../InvoiceTypeModal';
+import { TaxClassificationProps } from '../../../TaxClassificationCodeModal';
 import AutoComplete from './AutoComplete';
 
 export default class InvoiceControllerState {
 
-  /** 
-   * 组件模式 
+  /**
+   * 组件模式
    * prefab 预制
    * readOnly 只读
    * */
   model: 'default' | 'prefab' | 'readOnly' = 'default';
 
-  /** 
-   * 企业类型 
+  /**
+   * 企业类型
    * 01 一般纳税人
    * 05 转登记纳税人
    * 04 代开企业
@@ -57,4 +58,8 @@ export default class InvoiceControllerState {
 
   /** 自动补全 */
   autoComplete = new AutoComplete();
+  /**
+   * 商品税收分类编码窗口
+   * */
+  taxClassificationProps?: TaxClassificationProps;
 }

package/src/Invoice/ui/default/EndowCodeDrawer/index.tsx

@@ -16,6 +16,7 @@ import {
   FormEffectHooks,
 } from '@formily/antd';
 import './index.less';
+import TaxClassificationCodeModal from "../../../../TaxClassificationCodeModal";
 
 const { TreeNode } = Tree;
 const { confirm } = Modal;
@@ -86,9 +87,11 @@ const DrawerBody = (props: { defaultValue: IGood }) => {
 
   const actions = React.useMemo(() => createAsyncFormActions(), []);
 
+  const taxClassificationProps = controller.useMemo(s => s.taxClassificationProps, []);
+
   /** 免税类型 是否需要 */
   const isTaxFreeTypeNeeded = controller.useMemo(s => s.goodsListState.endowCode.isTaxFreeTypeNeeded, []);
-  
+
   /** 税率 是否禁用 */
   const readOnlyTaxRate = controller.useMemo(s => {
     if (s.goodsListState.endowCode.getReadOnlyTaxRate) {
@@ -288,6 +291,117 @@ const DrawerBody = (props: { defaultValue: IGood }) => {
     )
   }, [controller, actions])
 
+  /** 税收分类编码 选择组件3 */
+  const ShowSearch3 = React.useCallback(props => {
+    const [open, setOpen] = React.useState(false);
+
+    const [list, setList] = React.useState<any>([]);
+
+    const onSearch = React.useCallback(async (value: any = null) => {
+      if(value){
+        const arr = await controller.state.goodsListState.endowCode.onSearchTaxClassificationCode(value?.target?.value);
+        const list: any[] = arr.map((item: any)=> {
+          return {
+            ...item,
+            title: `${item.productName} ${item.taxCategoryCode}`,
+            key: item.taxCategoryCode,
+            isLeaf: true
+          }
+        });
+        setList(list);
+      } else {
+        await onLoad();
+      }
+    }, []);
+
+    const onLoad = React.useCallback(async (value?: any) => {
+      const arr = await controller.state.goodsListState.endowCode.onLoadTaxClassificationCode(value?.taxCategoryCode);
+      const data: any[] = arr.map((item: any)=> {
+        return {
+          ...item,
+          title: `${item.productName} ${item.taxCategoryCode}`,
+          key: item.taxCategoryCode
+        }
+      });
+
+      const treeData = optimizeTreeData(data);
+
+      if(value?.key) {
+        setList((origin: any)=> {
+          updateTreeData(origin, value.key, treeData)
+        });
+      } else {
+        setList(treeData);
+      }
+      return [];
+    }, []);
+
+    const onClick = React.useCallback(async () => {
+      await onLoad();
+      setOpen(true);
+    }, []);
+
+    const onSelect = React.useCallback((key: any, info: any) => {
+      actions.setFieldState('taxClassificationCode', async s => {
+        s.value = info.node.taxCategoryCode
+      });
+
+      actions.setFieldState('productName', async (s) => {
+        s.value = info.node.productName
+      });
+
+      actions.setFieldState('shorthand', async (s) => {
+        s.value = info.node.shorthand
+      });
+      actions.setFieldState('taxRate', async s => {
+        s.value = info.node.taxRate
+      });
+      setOpen(false);
+    }, [controller, actions]);
+
+    const optimizeTreeData = (data: any): any => {
+      return data.map((item: any)=> {
+        return {
+          ...item,
+          selectable: item?.hzx === 'N',
+          isLeaf: item?.hzx === 'N'
+        }
+      });
+    }
+
+    const updateTreeData = (list: any, key: React.Key, children: any): any => {
+      return list.map((node: any) => {
+        if (node.key === key) {
+          return {
+            ...node,
+            children
+          };
+        }
+        if (node.children) {
+          return {
+            ...node,
+            children: updateTreeData(node.children, key, children)
+          };
+        }
+        return node;
+      });
+    }
+
+    return (
+      <>
+        <InputAntd readOnly onClick={onClick} value={props.value} />
+        <TaxClassificationCodeModal
+          list={list}
+          open={open}
+          onSelect={onSelect}
+          onCancel={()=> {setOpen(false)}}
+          onSearch={onSearch}
+          onLoad={onLoad}
+        />
+      </>
+    )
+  }, [controller])
+
   // 是否享受优惠政策
   const [favouredPolicyMark, setFavouredPolicyMark] = React.useState<number>(0);
 
@@ -351,7 +465,7 @@ const DrawerBody = (props: { defaultValue: IGood }) => {
   }, [controller]);
 
   return (
-    <SchemaForm actions={actions} previewPlaceholder=" "  components={{ ...components, showSearch: !!controller.state.goodsListState.endowCode.getTaxCategoryCodeTree ? ShowSearch2 : ShowSearch }} effects={effects}>
+    <SchemaForm actions={actions} previewPlaceholder=" "  components={{ ...components, showSearch: !!controller.state.goodsListState.endowCode.onLoadTaxClassificationCode() ? ShowSearch3 : ShowSearch }} effects={effects}>
       <FormButtonGroup>
         <Field
           name="taxClassificationCode"
@@ -361,6 +475,13 @@ const DrawerBody = (props: { defaultValue: IGood }) => {
           default={defaultValue?.taxClassificationCode}
           x-rules={[{ message: '请选择税收分类编码', required: true }]}
         />
+        <Field
+          name="productName"
+          type="string"
+          readOnly
+          default={defaultValue?.productName}
+          title="税收分类名称"
+        />
         <Field
           name="shorthand"
           type="string"

package/src/Invoice/ui/default/GoodsList/hook/useColumns/index.tsx

@@ -477,7 +477,7 @@ export default (form: WrappedFormUtils) => {
         dataIndex: 'taxRate',
         key: 'taxRate',
         align: 'right',
-        width: 70,
+        width: 75,
         render: (value: string, record: IGood) => {
           if (editGood?.$index === record.$index) {
             return (

package/src/Invoice/ui/digtal/Sign/index.tsx

@@ -27,12 +27,18 @@ export default decorator<IBuyerProps, IBuyerProps & FormComponentProps>(Form.cre
 
     const model = controller.useMemo(s => s.model, []);
 
+    /** 禁用字段 */
     const disableds = controller.useMemo(s => s.stakeholder.disableds || [], []);
 
+    /** 启用字段 */
+    const enables = controller.useMemo(s => s.stakeholder.enables || [], []);
+
     const readOnly = React.useMemo(() => model === 'readOnly', [model]);
 
     const isReadOnly = React.useCallback(field => disableds.indexOf(field) >= 0, [disableds])
 
+    const isEnables = React.useCallback(field => enables.indexOf(field) >= 0, [enables])
+
     // 注册 form
     controller.useForm('sign', form);
 
@@ -47,7 +53,11 @@ export default decorator<IBuyerProps, IBuyerProps & FormComponentProps>(Form.cre
                     <div>
                         {getFieldDecorator('remarks', {
                             initialValue: props.defaultRemark
-                        })(<MyDiv />)}
+                        })(
+                            isEnables('remarks')
+                                ? <Input.TextArea placeholder='请输入' style={{ height: '100%' }} />
+                                : <MyDiv />
+                        )}
                     </div>
                 </div>
                 <Form layout='inline' className='digtal-readOnly-form' >

package/src/TaxClassificationCodeModal/_test/easiest/index.tsx

@@ -0,0 +1,178 @@
+import React from 'react';
+import { TaxClassificationModal } from '../../..';
+import { Button } from 'kts-xui';
+import TaxClassificationCodeModal from "@/TaxClassificationCodeModal";
+
+export default () => {
+
+  const [open, setOpen] = React.useState(false);
+
+  const [list, setList] = React.useState<any>([]);
+
+  const updateTreeData = (list: any, key: React.Key, children: any): any => {
+    const demo = list.map((node: any) => {
+      if (node.key === key) {
+        return {
+          ...node,
+          children,
+        };
+      }
+      if (node.children) {
+        return {
+          ...node,
+          children: updateTreeData(node.children, key, children),
+        };
+      }
+      return node;
+    });
+    setList(demo);
+  }
+
+  const onSearch = React.useCallback(async (value: any = null) => {
+    const arr = [
+      {
+        "id": "3a4eae5278cd428f975d4da278fd18eb",
+        "taxCategoryCode": "3000000000000000000",
+        "productName": "销售服务",
+        "shorthand": "销售服务",
+        "specification": null,
+        "createTime": "Tue Jun 20 14:56:46 CST 2023",
+        "status": 1,
+        "versionCode": "48.0",
+        "version": "32.0",
+        "startTime": "20190401",
+        "endTime": null,
+        "cargo": null,
+        "desc": null,
+        "taxRate": "13",
+        "keyword": "",
+        "summarizedItem": "Y",
+        "countCode": null,
+        "customsItem": null,
+        "updateTime": "Tue Jun 20 14:56:46 CST 2023"
+      },
+      {
+        "id": "3a4eae5278cd428f975d4da278fd18eb",
+        "taxCategoryCode": "410000000000000000",
+        "productName": "手机服务",
+        "shorthand": "手机服务",
+        "specification": null,
+        "createTime": "Tue Jun 20 14:56:46 CST 2023",
+        "status": 1,
+        "versionCode": "48.0",
+        "version": "32.0",
+        "startTime": "20190401",
+        "endTime": null,
+        "cargo": null,
+        "desc": null,
+        "taxRate": "13",
+        "keyword": "",
+        "summarizedItem": "Y",
+        "countCode": null,
+        "customsItem": null,
+        "updateTime": "Tue Jun 20 14:56:46 CST 2023"
+      }
+    ];
+    const list: any[] = arr.map((item: any)=> {
+      const data = {
+        ...item,
+        title: `${item.productName} ${item.taxCategoryCode}`,
+        key: item.taxCategoryCode,
+      }
+      if(value?.target?.value) {
+        data.isLeaf = true;
+      } else {
+        data.selectable = false
+      }
+      return data
+    });
+    setList(list);
+  }, []);
+
+  const onLoad = React.useCallback(async (value?: any) => {
+    const arr = [
+      {
+        "id": "3a4eae5278cd428f975d4da278fd18eb",
+        "taxCategoryCode": "00000100000000000000",
+        "productName": "子任务1",
+        "shorthand": "销售服务",
+        "specification": null,
+        "createTime": "Tue Jun 20 14:56:46 CST 2023",
+        "status": 1,
+        "versionCode": "48.0",
+        "version": "32.0",
+        "startTime": "20190401",
+        "endTime": null,
+        "cargo": null,
+        "desc": null,
+        "taxRate": "13",
+        "keyword": "",
+        "summarizedItem": "Y",
+        "countCode": null,
+        "customsItem": null,
+        "updateTime": "Tue Jun 20 14:56:46 CST 2023"
+      },
+      {
+        "id": "3a4eae5278cd428f975d4da278fd18eb",
+        "taxCategoryCode": "000002000000000000",
+        "productName": "子任务2",
+        "shorthand": "手机服务",
+        "specification": null,
+        "createTime": "Tue Jun 20 14:56:46 CST 2023",
+        "status": 1,
+        "versionCode": "48.0",
+        "version": "32.0",
+        "startTime": "20190401",
+        "endTime": null,
+        "cargo": null,
+        "desc": null,
+        "taxRate": "13",
+        "keyword": "",
+        "summarizedItem": "Y",
+        "countCode": null,
+        "customsItem": null,
+        "updateTime": "Tue Jun 20 14:56:46 CST 2023"
+      }
+    ];
+    const data: any[] = arr.map((item: any)=> {
+      return {
+        ...item,
+        title: `${item.productName} ${item.taxCategoryCode}`,
+        key: item.taxCategoryCode,
+        selectable: false
+      }
+    });
+
+    if(value?.key) {
+      setList((origin: any)=> {
+        updateTreeData(origin, value.key, data)
+      });
+    } else {
+      setList(data);
+    }
+    return [];
+  }, []);
+
+  const onClick = React.useCallback(async () => {
+    await onLoad();
+    setOpen(true);
+  }, []);
+
+  const onSelect = React.useCallback((key: any, info: any) => {
+    setOpen(false);
+  }, []);
+
+    return (
+        <>
+            <Button onClick={onClick} >打开</Button>
+            <TaxClassificationCodeModal
+              list={list}
+              open={open}
+              onSelect={onSelect}
+              onCancel={()=> {setOpen(false)}}
+              onSearch={onSearch}
+              onLoad={onLoad}
+            />
+        </>
+    )
+};

package/src/TaxClassificationCodeModal/index.md

@@ -0,0 +1,6 @@
+# TaxClassificationCodeModal
+
+## 简单用法
+<code src="./_test/easiest/index.tsx" ></code>
+
+<API name="API" exports='["default"]' src="./index.tsx" ></API>

package/src/TaxClassificationCodeModal/index.tsx

@@ -0,0 +1,67 @@
+
+import React from "react";
+import { Drawer, Input, Tree, Form } from "kts-xui";
+import { Icon } from "kts-components-antd-x3";
+import {IFormValues} from "@/InvoiceTypeModal";
+
+export interface TaxClassificationProps {
+
+    /** 是否开启 */
+    open?: boolean;
+
+    /** 数据 */
+    list?: any[];
+
+    /** 点击了取消 */
+    onCancel?: () => void;
+
+    /** 点击了选择 */
+    onSelect?: (key: any, info: any) => void;
+
+    /** 点击了加载 */
+    onLoad: (value: any) => Promise<any[]>;
+
+    /** 点击了搜索 */
+    onSearch?: (value?: any) => void;
+}
+
+export default function TaxClassificationModal(props: TaxClassificationProps) {
+    const [form] = Form.useForm<IFormValues>();
+
+    React.useEffect(() => {
+      if (!props.open) {
+        setTimeout(()=> {
+          form.resetFields();
+        }, 500)
+      }
+    }, [form, props.open])
+
+    return (
+      <Drawer
+        title="商品和服务税收分类编码"
+        placement="right"
+        open={props.open}
+        width={503}
+        onClose={props.onCancel}
+      >
+        <Form
+          form={form}
+        >
+          <Form.Item name='search'>
+            <Input
+              placeholder="请输入税收分类编码、税收分类名称进行检索"
+              onChange={props.onSearch}
+            />
+          </Form.Item>
+          <Form.Item name='tree'>
+            <Tree
+              onSelect={props.onSelect}
+              loadData={props.onLoad}
+              treeData={props.list}
+              switcherIcon={<Icon type="down" />}
+            />
+          </Form.Item>
+        </Form>
+      </Drawer>
+    )
+}

package/src/index.ts

@@ -7,3 +7,6 @@ export type { default as IGood } from './Invoice/InvoiceController/InvoiceContro
 
 export { default as InvoiceTypeModal } from './InvoiceTypeModal';
 export type { IInvoiceTypeModalProps } from './InvoiceTypeModal';
+
+export { default as TaxClassificationModal } from './TaxClassificationCodeModal';
+export type { TaxClassificationProps } from './TaxClassificationCodeModal';