kts-component-invoice-operate 3.2.166 → 3.2.168

package/src/Invoice/_test/invoiceType/index.tsx

@@ -1,59 +1,59 @@
-import React from 'react';
-import { Input } from 'kts-components-antd-x3';
-import { Invoice } from '../../..';
-import { WrappedFormUtils } from 'kts-components-antd-x3/lib/form/Form';
-
-export default () => {
-
-  const renderExpand = React.useCallback((form: WrappedFormUtils<any>) => {
-    return (
-      <div style={{ textAlign: 'right' }} >
-        <label>收票邮箱:</label>
-        {form.getFieldDecorator('email', {
-        })(
-          <Input style={{ width: 200 }} size="small" />
-        )}
-      </div>
-    )
-  }, [])
-
-  // 配置 发票种类
-  const typeOption = React.useMemo(() => {
-    return [
-      {
-        title: '发票1',
-        value: [
-          { id: 'buyerName', label: '购买方名称', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
-          { id: 'buyerNo', label: '购买方纳税人识别号', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
-          { id: 'buyerAddress', label: '购买方地址及电话', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
-          { id: 'buyerBank', label: '购买方开户行及账号', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
-        ]
-      },
-      {
-        title: '发票2',
-        value: [
-          { id: 'buyerName', label: '购买方名称', node: <Input size="small" />, options: { rules: [] } },
-          { id: 'buyerNo', label: '购买方纳税人识别号', node: <Input size="small" />, options: { rules: [] } },
-          { id: 'buyerAddress', label: '购买方地址及电话', node: <Input size="small" />, options: { rules: [] } },
-          { id: 'buyerBank', label: '购买方开户行及账号', node: <Input size="small" />, options: { rules: [] } },
-        ]
-      },
-    ]
-  }, [])
-
-  // 选中的 种类索引
-  const [index, setIndex] = React.useState(1);
-
-  return (
-    <Invoice
-      invoiceHeader={
-        <Invoice.InvoiceHeader
-          renderExpand={renderExpand}
-          typeOptionIndex={index}
-          typeOption={typeOption}
-          onChangeTypeOption={e => { setIndex(e) }}
-        />}
-      buyer={<Invoice.Buyer formItem={typeOption[index].value} />}
-    />
-  );
-};
+import React from 'react';
+import { Input } from 'kts-components-antd-x3';
+import { Invoice } from '../../..';
+import { WrappedFormUtils } from 'kts-components-antd-x3/lib/form/Form';
+
+export default () => {
+
+  const renderExpand = React.useCallback((form: WrappedFormUtils<any>) => {
+    return (
+      <div style={{ textAlign: 'right' }} >
+        <label>收票邮箱:</label>
+        {form.getFieldDecorator('email', {
+        })(
+          <Input style={{ width: 200 }} size="small" />
+        )}
+      </div>
+    )
+  }, [])
+
+  // 配置 发票种类
+  const typeOption = React.useMemo(() => {
+    return [
+      {
+        title: '发票1',
+        value: [
+          { id: 'buyerName', label: '购买方名称', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
+          { id: 'buyerNo', label: '购买方纳税人识别号', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
+          { id: 'buyerAddress', label: '购买方地址及电话', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
+          { id: 'buyerBank', label: '购买方开户行及账号', node: <Input size="small" />, options: { rules: [{ required: true, message: '不能为空' }] } },
+        ]
+      },
+      {
+        title: '发票2',
+        value: [
+          { id: 'buyerName', label: '购买方名称', node: <Input size="small" />, options: { rules: [] } },
+          { id: 'buyerNo', label: '购买方纳税人识别号', node: <Input size="small" />, options: { rules: [] } },
+          { id: 'buyerAddress', label: '购买方地址及电话', node: <Input size="small" />, options: { rules: [] } },
+          { id: 'buyerBank', label: '购买方开户行及账号', node: <Input size="small" />, options: { rules: [] } },
+        ]
+      },
+    ]
+  }, [])
+
+  // 选中的 种类索引
+  const [index, setIndex] = React.useState(1);
+
+  return (
+    <Invoice
+      invoiceHeader={
+        <Invoice.InvoiceHeader
+          renderExpand={renderExpand}
+          typeOptionIndex={index}
+          typeOption={typeOption}
+          onChangeTypeOption={e => { setIndex(e) }}
+        />}
+      buyer={<Invoice.Buyer formItem={typeOption[index].value} />}
+    />
+  );
+};

package/src/Invoice/_test/isInvoiceNo/index.tsx

@@ -1,12 +1,12 @@
-import React from 'react';
-import Invoice from '../../';
-
-const InvoiceHeader = Invoice.InvoiceHeader;
-
-export default () => {
-  return (
-    <Invoice
-      invoiceHeader={<InvoiceHeader isInvoiceNo={false} />} // 隐藏发票单据编号
-    />
-  );
-};
+import React from 'react';
+import Invoice from '../../';
+
+const InvoiceHeader = Invoice.InvoiceHeader;
+
+export default () => {
+  return (
+    <Invoice
+      invoiceHeader={<InvoiceHeader isInvoiceNo={false} />} // 隐藏发票单据编号
+    />
+  );
+};

package/src/Invoice/_test/replaceHead/index.tsx

@@ -1,22 +1,22 @@
-import React from 'react';
-import { Button } from 'kts-components-antd-x3';
-import Invoice from '../../';
-
-const useInvoiceController = Invoice.useInvoiceController;
-
-export default () => {
-  return <Invoice invoiceHeader={<InvoiceHeader />} />;
-};
-
-const InvoiceHeader = () => {
-  const controller = useInvoiceController();
-
-  return (
-    <div>
-      新的表头
-      <Button type="link">
-        更新
-      </Button>
-    </div>
-  );
-};
+import React from 'react';
+import { Button } from 'kts-components-antd-x3';
+import Invoice from '../../';
+
+const useInvoiceController = Invoice.useInvoiceController;
+
+export default () => {
+  return <Invoice invoiceHeader={<InvoiceHeader />} />;
+};
+
+const InvoiceHeader = () => {
+  const controller = useInvoiceController();
+
+  return (
+    <div>
+      新的表头
+      <Button type="link">
+        更新
+      </Button>
+    </div>
+  );
+};

package/src/Invoice/_test/retrieveData/index.tsx

@@ -1,22 +1,22 @@
-
-import React from 'react';
-import { Button } from 'kts-components-antd-x3';
-import Invoice from '../../';
-
-const Buyer = Invoice.Buyer
-
-export default () => {
-
-  const controller = React.useMemo(() => new Invoice.InvoiceController, [])
-
-  const onClick = React.useCallback(async () => {
-    console.log('===> 当前组件状态', await controller.validateFields());
-  }, []);
-
-  return (
-    <div>
-      <Button onClick={onClick} style={{ marginBottom: 10 }}>获取数据</Button>
-      <Invoice invoiceType='digtal' controller={controller}/>
-    </div>
-  );
-};
+
+import React from 'react';
+import { Button } from 'kts-components-antd-x3';
+import Invoice from '../../';
+
+const Buyer = Invoice.Buyer
+
+export default () => {
+
+  const controller = React.useMemo(() => new Invoice.InvoiceController, [])
+
+  const onClick = React.useCallback(async () => {
+    console.log('===> 当前组件状态', await controller.validateFields());
+  }, []);
+
+  return (
+    <div>
+      <Button onClick={onClick} style={{ marginBottom: 10 }}>获取数据</Button>
+      <Invoice invoiceType='digtal' controller={controller}/>
+    </div>
+  );
+};

package/src/Invoice/_test/seller/index.tsx

@@ -1,28 +1,28 @@
-import React from 'react';
-import { AutoComplete, Input, Icon } from 'kts-components-antd-x3';
-import { Invoice } from '../../..';
-
-export default () => {
-
-  const formRender = React.useMemo(() => {
-    return new Map([
-      ['sellerBank', () => {
-        return (
-          <AutoComplete
-            size="small"
-            style={{ width: '100%' }}
-            dataSource={['销售方开户行及账号1', '销售方开户行及账号2', '销售方开户行及账号3']}
-          >
-            <Input suffix={<Icon type="down" />} />
-          </AutoComplete>
-        )
-      }]
-    ])
-  }, [])
-
-  return (
-    <div>
-      <Invoice seller={<Invoice.Seller formRender={formRender} />} />
-    </div>
-  );
-};
+import React from 'react';
+import { AutoComplete, Input, Icon } from 'kts-components-antd-x3';
+import { Invoice } from '../../..';
+
+export default () => {
+
+  const formRender = React.useMemo(() => {
+    return new Map([
+      ['sellerBank', () => {
+        return (
+          <AutoComplete
+            size="small"
+            style={{ width: '100%' }}
+            dataSource={['销售方开户行及账号1', '销售方开户行及账号2', '销售方开户行及账号3']}
+          >
+            <Input suffix={<Icon type="down" />} />
+          </AutoComplete>
+        )
+      }]
+    ])
+  }, [])
+
+  return (
+    <div>
+      <Invoice seller={<Invoice.Seller formRender={formRender} />} />
+    </div>
+  );
+};

package/src/Invoice/_test/setDataSource/index.tsx

@@ -1,73 +1,73 @@
-import React from 'react';
-import Invoice from '../..';
-
-const InvoiceController = Invoice.InvoiceController;
-
-export default () => {
-  const controller = React.useMemo(() => new MyInvoiceController(), []);
-  return (
-    <div>
-      <Invoice controller={controller} />
-    </div>
-  );
-};
-
-/**
- * 继承 InvoiceController 并重写需要重写的方法
- */
-class MyInvoiceController extends InvoiceController {
-
-  constructor() {
-    super();
-    this.state.autoComplete.onItemNameSearch = async text => {
-      return [
-        {
-          "itemName": "呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵",
-          "taxClassificationCode": "1010112070000000000",
-          "itemModelName": null,
-          "shorthand": "蔬菜",
-          "taxRate": undefined
-        },
-        {
-          "itemName": "呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵",
-          "taxClassificationCode": "1010112070000000000",
-          "itemModelName": null,
-          "shorthand": "蔬菜",
-          "taxRate": undefined
-        },
-        {
-          "itemName": "稻谷",
-          "taxClassificationCode": "1010101040000000000",
-          "itemModelName": null,
-          "shorthand": "谷物",
-          "taxRate": 3
-        },
-        {
-          "itemName": "苹果",
-          "taxClassificationCode": "1090111090000000000",
-          "itemModelName": null,
-          "shorthand": "小型起重设备",
-          "taxRate": null
-        },
-        {
-          "itemName": "银丝",
-          "taxClassificationCode": "1080411120000000000",
-          "itemModelName": null,
-          "shorthand": "金属制品",
-          "taxRate": 3
-        },
-        {
-          "itemName": "布料",
-          "taxClassificationCode": "1100101011100000000",
-          "itemModelName": null,
-          "shorthand": "发电",
-          "taxRate": 2
-        },
-      ].slice() as any
-    }
-  }
-
-  updateInvoiceNo = this.pipeline(async s => {
-    return '--';
-  })
-}
+import React from 'react';
+import Invoice from '../..';
+
+const InvoiceController = Invoice.InvoiceController;
+
+export default () => {
+  const controller = React.useMemo(() => new MyInvoiceController(), []);
+  return (
+    <div>
+      <Invoice controller={controller} />
+    </div>
+  );
+};
+
+/**
+ * 继承 InvoiceController 并重写需要重写的方法
+ */
+class MyInvoiceController extends InvoiceController {
+
+  constructor() {
+    super();
+    this.state.autoComplete.onItemNameSearch = async text => {
+      return [
+        {
+          "itemName": "呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵",
+          "taxClassificationCode": "1010112070000000000",
+          "itemModelName": null,
+          "shorthand": "蔬菜",
+          "taxRate": undefined
+        },
+        {
+          "itemName": "呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵呵",
+          "taxClassificationCode": "1010112070000000000",
+          "itemModelName": null,
+          "shorthand": "蔬菜",
+          "taxRate": undefined
+        },
+        {
+          "itemName": "稻谷",
+          "taxClassificationCode": "1010101040000000000",
+          "itemModelName": null,
+          "shorthand": "谷物",
+          "taxRate": 3
+        },
+        {
+          "itemName": "苹果",
+          "taxClassificationCode": "1090111090000000000",
+          "itemModelName": null,
+          "shorthand": "小型起重设备",
+          "taxRate": null
+        },
+        {
+          "itemName": "银丝",
+          "taxClassificationCode": "1080411120000000000",
+          "itemModelName": null,
+          "shorthand": "金属制品",
+          "taxRate": 3
+        },
+        {
+          "itemName": "布料",
+          "taxClassificationCode": "1100101011100000000",
+          "itemModelName": null,
+          "shorthand": "发电",
+          "taxRate": 2
+        },
+      ].slice() as any
+    }
+  }
+
+  updateInvoiceNo = this.pipeline(async s => {
+    return '--';
+  })
+}

package/src/Invoice/_test/unit/index.tsx

@@ -1,19 +1,19 @@
-import React from 'react';
-import { Invoice } from '../../..';
-
-export default () => {
-  const controller = React.useMemo(() => new Invoice.InvoiceController(), []);
-
-  React.useEffect(() => {
-    controller.pipeline(async (s) => {
-      s.goodsListState.unitList = ['个', '吨', '米'];
-      s.goodsListState.taxRateList = [1, 2, 3, 4, 5, 80];
-    })();
-  }, []);
-
-  return (
-    <div>
-      <Invoice controller={controller} />
-    </div>
-  );
-};
+import React from 'react';
+import { Invoice } from '../../..';
+
+export default () => {
+  const controller = React.useMemo(() => new Invoice.InvoiceController(), []);
+
+  React.useEffect(() => {
+    controller.pipeline(async (s) => {
+      s.goodsListState.unitList = ['个', '吨', '米'];
+      s.goodsListState.taxRateList = [1, 2, 3, 4, 5, 80];
+    })();
+  }, []);
+
+  return (
+    <div>
+      <Invoice controller={controller} />
+    </div>
+  );
+};

package/src/Invoice/index.less

@@ -1,32 +1,32 @@
-.kts-invoice-operate {
-  border   : 1px solid #dcdcdc;
-  font-size: 12px;
-  position: relative;
-
-  &>* {
-    border-bottom: 1px solid #dcdcdc;
-
-    &:last-child {
-      border-bottom: none;
-    }
-  }
-}
-
-.kts-invoice-operate-digtal {
-
-  font-family: PingFang SC;
-  font-size  : 14px;
-  position: relative;
-
-  .kts-invoice-operate-digtal-cont {
-    border: 2px solid #9F613E;
-
-    &>* {
-      border-bottom: 2px solid #9F613E;
-
-      &:last-child {
-        border-bottom: none;
-      }
-    }
-  }
+.kts-invoice-operate {
+  border   : 1px solid #dcdcdc;
+  font-size: 12px;
+  position: relative;
+
+  &>* {
+    border-bottom: 1px solid #dcdcdc;
+
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+}
+
+.kts-invoice-operate-digtal {
+
+  font-family: PingFang SC;
+  font-size  : 14px;
+  position: relative;
+
+  .kts-invoice-operate-digtal-cont {
+    border: 2px solid #9F613E;
+
+    &>* {
+      border-bottom: 2px solid #9F613E;
+
+      &:last-child {
+        border-bottom: none;
+      }
+    }
+  }
 }

package/src/Invoice/index.md

@@ -1,56 +1,56 @@
-# 默认
-
-## 简单用法
-<code src="./_test/easiest/index.tsx"></code>
-
-## 设置为草稿，设置默认参数 扩展按钮
-<code src="./_test/draft/index.tsx" title="类似的操作,请查看API" ></code>
-
-## 设置购买方名称搜索 
-<code src="./_test/buyerNameSearch/index.tsx"></code>
-
-## 设置扣除额（差额征税）
-<code src="./_test/deduction/index.tsx"></code>
-
-## 设置单位列表、税率列表
-<code src="./_test/unit/index.tsx" ></code>
-
-## 发票头类型设置和购买方信息配置
-<code src="./_test/invoiceType/index.tsx" ></code>
-
-## 隐藏发票单据编号
-<code src="./_test/isInvoiceNo/index.tsx" title="通过InvoiceHeader.isInvoiceNo" ></code>
-
-## 替换发票头 UI
-<code src="./_test/replaceHead/index.tsx" title="其他UI的替换类型,请查看API" ></code>
-
-## 子表格
-<code src="./_test/children/index.tsx" title="其他UI的替换类型,请查看API" ></code>
-
-## 销售方 预设、自动补全、禁用
-<code src="./_test/seller/index.tsx"></code>
-
-## 点击按钮获取方法
-<code src="./_test/retrieveData/index.tsx" title="查看 Console" ></code>
-
-## 扩展货物操作按钮
-<code src="./_test/goodsMenuExpand/index.tsx" title="查看 Console" ></code>
-
-## 设置数据源 获取发票单据编号
-<code src="./_test/setDataSource/index.tsx" ></code>
-
-## 设置数据源 导入购买方
-<code src="./_test/importBuyer/index.tsx"></code>
-
-## 设置数据源 导入货物
-<code src="./_test/importGoods/index.tsx"></code>
-
-## 设置数据源 赋码 税收分类编码列表
-<code src="./_test/endowCode/index.tsx"></code>
-
-<API name="Invoice 发票组件 API" exports='["default"]' src="./index.tsx" ></API>
-<API name="InvoiceHeader 发票头 API" exports='["default"]' src="./ui/default/InvoiceHeader/index.tsx"></API>
-<API name="GoodsList 商品列表 API" exports='["default"]' src="./ui/default/GoodsList/index.tsx"></API>
-<API name="Buyer 购买方 API" exports='["default"]' src="./ui/default/Buyer/index.tsx"></API>
-<API name="Seller 销售方 API" exports='["default"]' src="./ui/default/Seller/index.tsx"></API>
-<API name="Sign 落款 API" exports='["default"]' src="./ui/default/Sign/index.tsx"></API>
+# 默认
+
+## 简单用法
+<code src="./_test/easiest/index.tsx"></code>
+
+## 设置为草稿，设置默认参数 扩展按钮
+<code src="./_test/draft/index.tsx" title="类似的操作,请查看API" ></code>
+
+## 设置购买方名称搜索 
+<code src="./_test/buyerNameSearch/index.tsx"></code>
+
+## 设置扣除额（差额征税）
+<code src="./_test/deduction/index.tsx"></code>
+
+## 设置单位列表、税率列表
+<code src="./_test/unit/index.tsx" ></code>
+
+## 发票头类型设置和购买方信息配置
+<code src="./_test/invoiceType/index.tsx" ></code>
+
+## 隐藏发票单据编号
+<code src="./_test/isInvoiceNo/index.tsx" title="通过InvoiceHeader.isInvoiceNo" ></code>
+
+## 替换发票头 UI
+<code src="./_test/replaceHead/index.tsx" title="其他UI的替换类型,请查看API" ></code>
+
+## 子表格
+<code src="./_test/children/index.tsx" title="其他UI的替换类型,请查看API" ></code>
+
+## 销售方 预设、自动补全、禁用
+<code src="./_test/seller/index.tsx"></code>
+
+## 点击按钮获取方法
+<code src="./_test/retrieveData/index.tsx" title="查看 Console" ></code>
+
+## 扩展货物操作按钮
+<code src="./_test/goodsMenuExpand/index.tsx" title="查看 Console" ></code>
+
+## 设置数据源 获取发票单据编号
+<code src="./_test/setDataSource/index.tsx" ></code>
+
+## 设置数据源 导入购买方
+<code src="./_test/importBuyer/index.tsx"></code>
+
+## 设置数据源 导入货物
+<code src="./_test/importGoods/index.tsx"></code>
+
+## 设置数据源 赋码 税收分类编码列表
+<code src="./_test/endowCode/index.tsx"></code>
+
+<API name="Invoice 发票组件 API" exports='["default"]' src="./index.tsx" ></API>
+<API name="InvoiceHeader 发票头 API" exports='["default"]' src="./ui/default/InvoiceHeader/index.tsx"></API>
+<API name="GoodsList 商品列表 API" exports='["default"]' src="./ui/default/GoodsList/index.tsx"></API>
+<API name="Buyer 购买方 API" exports='["default"]' src="./ui/default/Buyer/index.tsx"></API>
+<API name="Seller 销售方 API" exports='["default"]' src="./ui/default/Seller/index.tsx"></API>
+<API name="Sign 落款 API" exports='["default"]' src="./ui/default/Sign/index.tsx"></API>