kts-component-invoice-operate 2.0.1 → 2.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kts-component-invoice-operate",
-  "version": "2.0.1",
+  "version": "2.0.4",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -30,6 +30,8 @@
     "classnames": "^2.3.1",
     "grey-react-box": "^0.2.20",
     "kts-components-antd-x3": "^3.26.20-5",
+    "kts-components-antd-x4": "^4.0.3",
+    "kts-xui": "^1.0.30",
     "mathjs": "^9.4.2",
     "next": "^11.0.1",
     "nzh": "^1.0.4",

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

@@ -10,29 +10,26 @@ export default interface IGood {
   /** 发票ID */
   id?: string;
 
-  /** 商品编码(我方) */
+  /** 商品编码(对方-购买方) */
   itemCode?: string;
 
-  /** 货物名称(我方) */
+  /** 货物名称(对方-购买方) */
   itemName?: string;
 
-  /** 单位(我方) */
+  /** 单位(对方-购买方) */
   unit?: string;
 
-  /** 货物规格型号(我方) */
+  /** 货物规格型号(对方-购买方) */
   itemModelName?: string;
 
-  /** 商品编码(对方) */
-  itemCodeOther?: string;
+  /** 商品编码(我方-销售) */
+  itemCodeSelf?: string;
 
-  /** 货物名称(对方) */
-  itemNameOther?: string;
+  /** 货物名称(我方-销售) */
+  itemNameSelf?: string;
 
-  /** 单位(对方) */
-  unitOther?: string;
-
-  /** 货物规格型号(对方) */
-  itemModelNameOther?: string;
+  /** 货物规格型号(我方-销售) */
+  itemModelNameSelf?: string;
 
   /** 数量 */
   quantity?: number;

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

@@ -6,5 +6,5 @@ export default class ProductComparison {
     onComply?: (e: IGood[]) => Promise<IGood[]>
 
     /** 更新对照表 */
-    onUpdateComparisonTable?: (e: IGood, values:any) => Promise<void>
+    // onUpdateComparisonTable?: (e: IGood, values:any) => Promise<void>
 }

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

@@ -40,10 +40,9 @@ class MyInvoiceController extends InvoiceController {
         return e.map(e => {
           return {
             ...e,
-            itemNameOther: e.itemName + '(他方)',
-            unitOther: e.unit + '(他方)',
-            itemModelNameOther: e.itemModelName + '(他方)',
-            itemCodeOther: e.itemCode + '(他方)',
+            itemName: e.itemNameSelf + '(他方)',
+            itemModelName: e.itemModelNameSelf + '(他方)',
+            itemCode: e.itemCodeSelf + '(他方)',
           }
         })
       }

package/src/Invoice/tools/itemName/index.ts

@@ -10,7 +10,6 @@ export interface ISN {
 
 /** 拆分全称加简称 */
 export const getSN = (value?: string): ISN | undefined => {
-    debugger;
     if (!value) return undefined;
     const arr = value.match(/\*[^*]+\*/);
     if (arr && arr[0]) {

package/src/Invoice/ui/AddComparisonDrawer/index.tsx

@@ -1,19 +1,13 @@
 
 import React from "react";
-import { Row, Col, Input, Drawer, Form, Checkbox, Button } from "kts-components-antd-x3";
-import { WrappedFormUtils } from "kts-components-antd-x3/lib/form/Form";
-import { FormComponentProps } from "kts-components-antd-x3/lib/form";
-import { decorator } from "grey-react-box";
+import { Row, Col, Input, Button } from "kts-components-antd-x3";
+import { Form, Drawer } from "kts-xui";
 import { Invoice } from "../../../";
 import { getSN } from "../../tools/itemName";
 
-const AddComparisonDrawer = decorator<{}, FormComponentProps>(
-    Form.create()
-)(props => {
+export default function AddComparisonDrawer() {
 
-    const { form } = props;
-
-    const { getFieldDecorator } = form;
+    const [form] = Form.useForm();
 
     /** 控制器 */
     const controller = Invoice.useInvoiceController();
@@ -35,24 +29,21 @@ const AddComparisonDrawer = decorator<{}, FormComponentProps>(
         controller.run(async s => {
             if (!good) return
 
-            const { err, values } = await validateFields(form);
-            if (err) return;
-
-            const shorthand = s.goodsListState.isMyShow ? getSN(good.itemName)?.shorthand : getSN(good.itemNameOther)?.shorthand;
-            good.itemCode = values.itemCode;
-            good.itemCodeOther = values.itemCodeOther;
-            good.itemName = shorthand ? `*${shorthand}*${values.itemName}` : values.itemName;
-            good.itemNameOther = shorthand ? `*${shorthand}*${values.itemNameOther}` : values.itemNameOther;
-            good.itemModelName = values.itemModelName;
-            good.itemModelNameOther = values.itemModelNameOther;
-            good.unit = values.unit;
-            good.unitOther = values.unitOther;
-            s.goodsListState.addComparisonIndex = undefined;
-            s.goodsListState.goodsList = [...s.goodsListState.goodsList]
-
-            if (s.goodsListState?.productComparison?.onUpdateComparisonTable && values.isUpdate) {
-                debugger
-                await s.goodsListState.productComparison.onUpdateComparisonTable(good, values);
+            try {
+                const values = await form.validateFields()
+                const shorthand = s.goodsListState.isMyShow ? getSN(good.itemNameSelf)?.shorthand : getSN(good.itemName)?.shorthand;
+
+                good.itemCode = values.itemCode;
+                good.itemCodeSelf = values.itemCodeSelf;
+                good.itemName = shorthand ? `*${shorthand}*${values.itemName}` : values.itemName;
+                good.itemNameSelf = shorthand ? `*${shorthand}*${values.itemNameSelf}` : values.itemNameSelf;
+                good.itemModelName = values.itemModelName;
+                good.itemModelNameSelf = values.itemModelNameSelf;
+
+                s.goodsListState.addComparisonIndex = undefined;
+                s.goodsListState.goodsList = [...s.goodsListState.goodsList];
+            } catch (error) {
+
             }
         })
     }, [form, good])
@@ -63,7 +54,7 @@ const AddComparisonDrawer = decorator<{}, FormComponentProps>(
             form.setFieldsValue({
                 ...good,
                 itemName: getSN(good.itemName)?.full,
-                itemNameOther: getSN(good.itemNameOther)?.full,
+                itemNameSelf: getSN(good.itemNameSelf)?.full,
             })
         }
     }, [good])
@@ -74,102 +65,71 @@ const AddComparisonDrawer = decorator<{}, FormComponentProps>(
             onClose={onClose}
             placement="right"
             title="添加商品对照"
-            visible={!!addComparisonIndex}
-            drawerStyle={{ display: 'flex', flexDirection: 'column' }}
-            bodyStyle={{ flex: 1, display: 'flex', flexDirection: 'column' }}
+            visible={!!good}
+            footer={
+                <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 10 }} >
+                    <Button type="primary" onClick={onSubmit} >提交</Button>
+                    <Button onClick={onClose} >取消</Button>
+                </div>
+            }
         >
-            <Form layout="vertical" style={{ flex: 1 }} >
-                <Row gutter={[8, 8]} >
-                    <Col span={12}>
-                        {getFieldDecorator('itemCode', {})(
-                            <Form.Item label="我方商品编码" >
+            {
+                !!good &&
+                <Form layout="vertical" style={{ flex: 1 }} form={form} >
+                    <Row gutter={[8, 8]} >
+                        <Col span={12}>
+                            <Form.Item
+                                name="itemCodeSelf"
+                                label="我方商品编码"
+                            >
                                 <Input />
                             </Form.Item>
-                        )}
-
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('itemCodeOther', {})(
-                            <Form.Item label="对方商品编码" >
+                        </Col>
+                        <Col span={12} >
+                            <Form.Item
+                                name="itemCode"
+                                label="对方商品编码"
+                            >
                                 <Input />
                             </Form.Item>
-                        )}
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('itemName', {
-                            rules: [{ required: true, message: "请输入我方商品名称" }]
-                        })(
-                            <Form.Item label="我方商品名称" >
+                        </Col>
+                        <Col span={12} >
+                            <Form.Item
+                                name="itemNameSelf"
+                                label="我方商品名称"
+                            >
                                 <Input />
                             </Form.Item>
-                        )}
-
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('itemNameOther', {
-                            rules: [{ required: true, message: "请输入对方商品名称" }]
-                        })(
-                            <Form.Item label="对方商品名称">
+                        </Col>
+                        <Col span={12} >
+                            <Form.Item
+                                name="itemName"
+                                label="对方商品名称"
+                            >
                                 <Input />
                             </Form.Item>
-                        )}
-                    </Col>
-                    <Col span={12} >
-                        <Form.Item label="我方规格型号">
-                            <Input />
-                        </Form.Item>
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('itemModelNameOther', {
-                            rules: [{ required: true, message: "请输入对方规格型号" }]
-                        })(
-                            <Form.Item label="对方规格型号">
+                        </Col>
+                        <Col span={12} >
+                            <Form.Item name='itemModelNameSelf' label="我方规格型号">
                                 <Input />
                             </Form.Item>
-                        )}
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('unit', {
-                            rules: [{ required: true, message: "请输入对方规格型号" }]
-                        })(
-                            <Form.Item label="我方计量单位"  >
+                        </Col>
+                        <Col span={12} >
+                            <Form.Item name="itemModelName" label="对方规格型号">
                                 <Input />
                             </Form.Item>
-                        )}
-                    </Col>
-                    <Col span={12} >
-                        {getFieldDecorator('unitOther', {
-                            rules: [{ required: true, message: "请输入对方计量单位" }]
-                        })(
-                            <Form.Item label="对方计量单位"  >
-                                <Input />
-                            </Form.Item>
-                        )}
-                    </Col>
-                    <Col span={24} >
-                        {getFieldDecorator('isUpdate', {
-                        })(
-                            <Form.Item >
-                                <Checkbox>更新到商品对照表中</Checkbox>
-                            </Form.Item>
-                        )}
-                    </Col>
-                </Row>
-            </Form>
-            <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 10 }} >
-                <Button type="primary" onClick={onSubmit} >提交</Button>
-                <Button onClick={onClose} >取消</Button>
-            </div>
+                        </Col>
+                    </Row>
+                </Form>
+            }
         </Drawer>
     )
-})
-
-export default AddComparisonDrawer;
-
-function validateFields(form: WrappedFormUtils<any>) {
-    return new Promise<{ err: any, values: any }>(resolve => {
-        form.validateFields((err, values) => {
-            resolve({ err, values })
-        })
-    })
-}
+}
+
+// function validateFields(form: WrappedFormUtils<any>) {
+//     return new Promise<{ err: any, values: any }>(resolve => {
+//         form.validateFields((err, values) => {
+//             resolve({ err, values })
+//         })
+//     })
+// }

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

@@ -291,7 +291,7 @@ const DrawerBody = (props: { defaultValue: IGood }) => {
         if (!good) return;
 
         good.itemName = setShorthand(good.itemName, values.shorthand);
-        good.itemNameOther = setShorthand(good.itemNameOther, values.shorthand);
+        good.itemNameSelf = setShorthand(good.itemNameSelf, values.shorthand);
         
         // const name = getItemName(good.itemName, values.shorthand);
         // good.itemName = getItemName(good.itemName, values.shorthand); // `*${values.shorthand}*${name}`;

package/src/Invoice/ui/GoodsList/hook/useColumns/autoFillFn/index.ts

@@ -452,12 +452,13 @@ export const onChangeItemName = async (controller: InvoiceController, form: Wrap
   controller.run(async s => {
     const value = form.getFieldsValue().itemName;
     const shorthand = getSN(value)?.shorthand ?? '';
+
     if (s.goodsListState.isMyShow) {
-      await controller.setEditGood({ itemName: value });
-      record.itemNameOther && await controller.setEditGood({ itemNameOther: setShorthand(record.itemNameOther, shorthand) });
-    } else {
-      await controller.setEditGood({ itemNameOther: value });
+      await controller.setEditGood({ itemNameSelf: value });
       record.itemName && await controller.setEditGood({ itemName: setShorthand(record.itemName, shorthand) });
+    } else {
+      await controller.setEditGood({ itemName: value });
+      record.itemNameSelf && await controller.setEditGood({ itemNameSelf: setShorthand(record.itemNameSelf, shorthand) });
     }
   })
 }

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

@@ -64,12 +64,12 @@ export default (form: WrappedFormUtils) => {
               <Form.Item>
                 <div style={{ display: 'flex' }} >
                   {getFieldDecorator('itemName', {
-                    initialValue: isMyShow ? record.itemName : record.itemNameOther,
+                    initialValue: isMyShow ? record.itemNameSelf : record.itemName,
                     rules: [{
                       validator: async (_, __, callback) => {
                         await controller.wait();
                         const value = controller.state.goodsListState.editGood;
-                        if (!value?.itemName && !value?.itemNameOther) {
+                        if (!value?.itemName && !value?.itemNameSelf) {
                           callback('货物名称不能为空');
                         } else {
                           return;
@@ -110,8 +110,8 @@ export default (form: WrappedFormUtils) => {
           } else {
             return (
               <MyItemNameDiv
-                valueT={formatSearch(record.itemName, searchValue)}
-                valueF={record.itemNameOther}
+                valueT={formatSearch(record.itemNameSelf, searchValue)}
+                valueF={formatSearch(record.itemName, searchValue)}
                 isMyShow={isMyShow}
               />
             )
@@ -130,12 +130,12 @@ export default (form: WrappedFormUtils) => {
             return (
               <Form.Item>
                 {getFieldDecorator('itemModelName', {
-                  initialValue: isMyShow ? editGood.itemModelName : editGood.itemModelNameOther,
+                  initialValue: isMyShow ? editGood.itemModelNameSelf : editGood.itemModelName,
                 })(
                   <MyInput
                     onChange={async () => {
                       await controller.wait()
-                      const key = isMyShow ? 'itemModelName' : 'itemModelNameOther';
+                      const key = isMyShow ? 'itemModelNameSelf' : 'itemModelName';
                       const value = {} as any;
                       value[key] = form.getFieldsValue().itemModelName;
                       controller.setEditGood(value);
@@ -146,13 +146,12 @@ export default (form: WrappedFormUtils) => {
             );
           } else {
             return (
-              <MyItemNameDiv 
-                valueT={formatSearch(record.itemModelName, searchValue)} 
-                valueF={formatSearch(record.itemModelNameOther, searchValue)} 
-                isMyShow={isMyShow} 
+              <MyItemNameDiv
+                valueT={formatSearch(record.itemModelNameSelf, searchValue)}
+                valueF={formatSearch(record.itemModelName, searchValue)}
+                isMyShow={isMyShow}
               />
             )
-            // return <span style={{ padding: '0 10px' }}>{formatSearch(value, searchValue)}</span>;
           }
         },
       },
@@ -182,7 +181,7 @@ export default (form: WrappedFormUtils) => {
               </Form.Item>
             );
           } else {
-            return <MyItemNameDiv valueT={record.unit} valueF={record.unitOther} isMyShow={isMyShow} />;
+            return record.unit;
           }
         },
       },
@@ -434,6 +433,7 @@ export default (form: WrappedFormUtils) => {
                     showArrow={false}
                     style={{ width: '100%' }}
                     onChange={() => {
+                      setChangeField('taxRate');
                       onChangeTaxRate(controller, form, record);
                     }}
                   >
@@ -463,7 +463,7 @@ export default (form: WrappedFormUtils) => {
           if (editGood?.$index === record.$index) {
             return getFieldDecorator('taxAmount', {
               initialValue: editGood.taxAmount,
-            })(<MyDiv />);
+            })(<MyDiv loading={isCipher(changeField, 'taxAmount')} />);
           } else {
             return <span style={{ padding: '0 10px' }}>{parseFloat(value).toFixed(2)}</span>;
           }
@@ -526,9 +526,18 @@ class MyInput extends React.Component<InputProps & { loading?: boolean }> {
   }
 }
 
-class MyDiv extends React.Component<{ value?: any }> {
+class MyDiv extends React.Component<{ value?: any, loading?: boolean }> {
+
   render() {
-    return <span style={{ padding: '0 10px' }}>{this.props.value}</span>;
+    if (this.props.loading) {
+      return (
+        <Spin size="small">
+          <span style={{ padding: '0 10px' }}>{this.props.value}</span>
+        </Spin>
+      )
+    } else {
+      return <span style={{ padding: '0 10px' }}>{this.props.value}</span>
+    }
   }
 }
 
@@ -560,10 +569,21 @@ class MyItemNameDiv extends React.Component<{ valueT?: React.ReactNode, valueF?:
     }
   }
 }
+
 /** 格式搜索结果 */
 function formatSearch(value?: string, search?: string) {
   if (!value || !search) return value;
 
-  const __html = value.split(new RegExp(search, 'g')).join(`<span class="kts-invoice-operate-goods-list-table-search-protrude" >${search}</span>`);
+  const __html = ucoding(value).split(new RegExp(ucoding(search), 'g')).map(e => dcoding(e)).join(`<span class="kts-invoice-operate-goods-list-table-search-protrude" >${search}</span>`);
   return <span dangerouslySetInnerHTML={{ __html }} />
 }
+
+/** 编码 */
+function ucoding(v: string): string {
+  return v.split('').map(e => `U${e.charCodeAt(0)}E`).join('');
+}
+
+/** 解码 */
+function dcoding(v: string): string {
+  return v.split('U').map(e => e ? String.fromCharCode(parseInt(e.replace('E', ''))) : '').join('');
+}

package/src/Invoice/ui/GoodsList/ui/BulkMenu/hooks/useCommodityComparisonButton/index.tsx

@@ -11,9 +11,7 @@ export default () => {
   const { onComply } = controller.useMemo(s => s.goodsListState.productComparison, [])
 
   /** 是否禁用 */
-  const disabled = controller.useMemo((s) => {
-    if (s.goodsListState.selectedGoodIndex.length <= 0) return true;
-  }, []);
+  const disabled = controller.useMemo(s => s.goodsListState.selectedGoodIndex.length <= 0, []);
 
   /** 点击了 */
   const onClick = React.useCallback(async () => {
@@ -36,7 +34,7 @@ export default () => {
         return {
           ...t,
           itemName: getSN(t.itemName)?.full,
-          itemNameOther: getSN(t.itemNameOther)?.full,
+          itemNameSelf: getSN(t.itemNameSelf)?.full,
         } as IGood
       }).filter(e => !!e) as IGood[]
 
@@ -44,21 +42,18 @@ export default () => {
       // 比对后的商品
       const newGoods = await s.goodsListState.productComparison.onComply(goods);
 
-      newGoods.filter(e => {
+      newGoods.forEach(e => {
         const vt = s.goodsListState.goodsMap.get(e.$index);
         if (!vt) return undefined;
 
         vt.itemName = e.itemName ? setShorthand(e.itemName, getSN(vt.itemName)?.shorthand) : vt.itemName;
-        vt.itemNameOther = e.itemNameOther ? setShorthand(e.itemNameOther, getSN(vt.itemNameOther)?.shorthand) : vt.itemNameOther;
-
-        vt.unit = e.unit ? e.unit : vt.unit;
-        vt.unitOther = e.unitOther ? e.unitOther : vt.unitOther;
-
+        vt.itemNameSelf = e.itemNameSelf ? setShorthand(e.itemNameSelf, getSN(vt.itemNameSelf)?.shorthand) : vt.itemNameSelf;
+        
         vt.itemModelName = e.itemModelName ? e.itemModelName : vt.itemModelName;
-        vt.itemModelNameOther = e.itemModelNameOther ? e.itemModelNameOther : vt.itemModelNameOther;
+        vt.itemModelNameSelf = e.itemModelNameSelf ? e.itemModelNameSelf : vt.itemModelNameSelf;
 
         vt.itemCode = e.itemCode ? e.itemCode : vt.itemCode;
-        vt.itemCodeOther = e.itemCodeOther ? e.itemCodeOther : vt.itemCodeOther;
+        vt.itemCodeSelf = e.itemCodeSelf ? e.itemCodeSelf : vt.itemCodeSelf;
       })
     })
   }, [])
@@ -74,7 +69,7 @@ export default () => {
         执行商品对照
       </Menu.Item>
     );
-  }, [])
+  }, [disabled, onClick, onComply])
 
   return { menuItem }
 };

package/src/Invoice/ui/ImportGoodsDrawer/index.tsx

@@ -107,17 +107,17 @@ const DrawerBody = () => {
 
                 // 导入FORM里
                 if (s.goodsListState.isMyShow) {
-                  s.goodsListState.form.setFieldsValue(editGood);
+                  s.goodsListState.form.setFieldsValue({
+                    ...editGood,
+                    itemName: editGood.itemNameSelf,
+                    itemModelName: editGood.itemModelNameSelf,
+                  });
                 } else {
                   s.goodsListState.form.setFieldsValue({
                     ...editGood,
-                    itemName: editGood.itemNameOther,
-                    unit: editGood.unitOther,
-                    itemModelName: editGood.itemModelNameOther,
                   });
                 }
 
-
                 s.goodsListState.importGoods.isVisibleDrawer = false;
 
                 s.goodsListState.isTaxIncluded
@@ -157,9 +157,9 @@ const getItemName = (record: any, editGood: IGood) => {
     return `*${shorthand}*${record.itemName}`;
   }
 
-  shorthand = getSN(editGood.itemNameOther)?.shorthand;
+  shorthand = getSN(editGood.itemName)?.shorthand;
   if (shorthand) {
-    return `*${shorthand}*${record.itemName}`;
+    return `*${shorthand}*${record.itemNameSelf}`;
   }
 
   return record.itemName;
@@ -167,14 +167,14 @@ const getItemName = (record: any, editGood: IGood) => {
 
 // 获取他方名称
 const getItemNameOther = (record: any, editGood: IGood) => {
-  if (!editGood.itemNameOther) return editGood.itemNameOther;
+  if (!editGood.itemName) return editGood.itemName;
 
   let shorthand;
 
   shorthand = record.shorthand;
   if (shorthand) {
-    return `*${shorthand}*${record.itemName}`;
+    return `*${shorthand}*${record.itemNameSelf}`;
   }
 
-  return record.itemNameOther;
+  return record.itemName;
 }