kts-component-invoice-operate 3.2.214 → 3.3.2

package/dist/Invoice/ui/digtal/Architecture/index.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import './index.less';
+import InvoiceController from "../../../InvoiceController";
 export interface RealEstateInfoProps {
     /**
      * 建筑服务地址数据
@@ -9,6 +10,11 @@ export interface RealEstateInfoProps {
      * 建筑服务地址数据字段名
      */
     fieldNames?: any;
+    onRegionalSelect?: (value: boolean) => void;
+    /** 点击了 */
+    onClickImportButton?: (e: InvoiceController) => void;
+    demo?: boolean;
+    region?: boolean;
 }
 /** 特殊信息-建筑服务 */
 declare const _default: React.FunctionComponent<RealEstateInfoProps>;

package/dist/index.esm.js

@@ -8,7 +8,7 @@ import { message as message$1, TableManual, Switch, AutoComplete as AutoComplete
 import classnames from 'classnames';
 import { Table } from 'kts-components-antd-x4-v4';
 import { render } from 'react-dom';
-import { DatePicker, Row as Row$1, Col as Col$1, Cascader, Input as Input$2, Select as Select$2 } from 'kts-components-antd-x4';
+import { DatePicker, Row as Row$1, Col as Col$1, Cascader, Input as Input$2, Select as Select$2, Button as Button$2 } from 'kts-components-antd-x4';
 import { Input as Input$3, NumberPicker } from '@formily/antd-components';
 import { createAsyncFormActions, FormEffectHooks, SchemaForm, FormButtonGroup, SchemaMarkupField } from '@formily/antd';
 
@@ -24529,21 +24529,59 @@ var MyNY = /*#__PURE__*/function (_React$Component4) {
 var css_248z$s = ".kts-invoice-operate-real-estate-info-digtal {\n  padding: 20px;\n  border-bottom: 2px solid #9F613E;\n  border-left: 2px solid #9F613E;\n  border-right: 2px solid #9F613E;\n}\n.kts-invoice-operate-real-estate-info-digtal .real-estate-info-digtal-label {\n  color: #9F613E;\n  font-weight: bold;\n}\n.kts-invoice-operate-real-estate-info-digtal .ktsAnt3x-row.ktsAnt3x-form-item {\n  margin-bottom: 0;\n}\n.kts-invoice-operate-real-estate-info-digtal .break-word {\n  word-break: break-word;\n}\n";
 styleInject(css_248z$s);
 
+var _g$4, _defs$6;
+
+function _extends$e() { _extends$e = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
+
+function SvgPlus$3(props) {
+  return /*#__PURE__*/createElement("svg", _extends$e({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 15,
+    fill: "none"
+  }, props), _g$4 || (_g$4 = /*#__PURE__*/createElement("g", {
+    clipPath: "url(#plus_svg__clip0_715_360)"
+  }, /*#__PURE__*/createElement("path", {
+    d: "M8 14.531A7.031 7.031 0 118 .468a7.031 7.031 0 010 14.063zm0-.937A6.094 6.094 0 108 1.406a6.094 6.094 0 000 12.188z"
+  }), /*#__PURE__*/createElement("path", {
+    d: "M4.25 7.969a.469.469 0 010-.938h7.5a.47.47 0 010 .938h-7.5z"
+  }), /*#__PURE__*/createElement("path", {
+    d: "M7.531 3.75a.469.469 0 01.938 0v7.5a.47.47 0 01-.938 0v-7.5z"
+  }))), _defs$6 || (_defs$6 = /*#__PURE__*/createElement("defs", null, /*#__PURE__*/createElement("clipPath", {
+    id: "plus_svg__clip0_715_360"
+  }, /*#__PURE__*/createElement("path", {
+    transform: "translate(.5)",
+    d: "M0 0h15v15H0z"
+  })))));
+}
+
 /** 特殊信息-建筑服务 */
 
 var Architecture = decorator(Form.create())(function (props) {
   /** 控制器 */
   var controller = Invoice.useInvoiceController();
-  var form = props.form;
+  var form = props.form,
+      onClickImportButton = props.onClickImportButton;
   var getFieldDecorator = form.getFieldDecorator;
   var model = controller.useMemo(function (s) {
     return s.model;
   }, []);
   var readOnly = React.useMemo(function () {
     return model === 'readOnly';
-  }, [model]); // 注册 form
+  }, [model]);
+
+  var _React$useState = React.useState( props.region),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      region = _React$useState2[0],
+      setRegion = _React$useState2[1]; // 注册 form
+
 
   controller.useForm('serviceDataDtoInfo', form);
+
+  var onSelectChange = function onSelectChange(value) {
+    setRegion(value === 'Y' ? true : false); // props.onRegionalSelect && props.onRegionalSelect(value);
+  };
+
   return /*#__PURE__*/React.createElement("div", {
     className: "kts-invoice-operate-real-estate-info-digtal"
   }, /*#__PURE__*/React.createElement("div", {
@@ -24610,6 +24648,7 @@ var Architecture = decorator(Form.create())(function (props) {
       message: '请选择跨地（市）标志'
     }]
   })(readOnly ? /*#__PURE__*/React.createElement(MyNY$1, null) : /*#__PURE__*/React.createElement(Select$2, {
+    onChange: onSelectChange,
     placeholder: "\u8BF7\u9009\u62E9",
     style: {
       width: '100%'
@@ -24618,7 +24657,58 @@ var Architecture = decorator(Form.create())(function (props) {
     value: 'Y'
   }, "\u662F"), /*#__PURE__*/React.createElement(Select$2.Option, {
     value: 'N'
-  }, "\u5426"))))), /*#__PURE__*/React.createElement(Col$1, {
+  }, "\u5426"))))), props.demo && region && /*#__PURE__*/React.createElement(Col$1, {
+    span: 6
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u6D89\u7A0E\u4E8B\u9879\u7F16\u53F7",
+    colon: false
+  }, getFieldDecorator('taxMatterNo', {
+    rules: readOnly ? [] : [{
+      required: true,
+      message: '请选择'
+    }, {
+      validator: function validator(_, value, callback) {
+        var constructAddress = form.getFieldValue('constructAddress');
+        var region = form.getFieldValue('division');
+        console.log(constructAddress.join(''), region);
+
+        if (constructAddress.join('') === region) {
+          callback();
+        } else {
+          callback('建筑服务发生地与税务事项地址不一致');
+        }
+      }
+    }]
+  })(readOnly ? /*#__PURE__*/React.createElement(MyDiv$4, null) : /*#__PURE__*/React.createElement(Input$2, {
+    autoComplete: "off",
+    disabled: true,
+    suffix: /*#__PURE__*/React.createElement(Button$2, {
+      type: 'link',
+      style: {
+        padding: 0,
+        width: 20,
+        height: '100%'
+      },
+      icon: /*#__PURE__*/React.createElement(Icon, {
+        component: SvgPlus$3
+      }),
+      onClick: function onClick() {
+        onClickImportButton && onClickImportButton(controller);
+      }
+    })
+  })))), props.demo && region && /*#__PURE__*/React.createElement(Col$1, {
+    span: 6,
+    style: {
+      display: 'none'
+    }
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: 'division',
+    colon: false
+  }, getFieldDecorator('division', {
+    rules: []
+  })(readOnly ? /*#__PURE__*/React.createElement(MyDiv$4, null) : /*#__PURE__*/React.createElement(Input$2, {
+    autoComplete: "off"
+  })))), /*#__PURE__*/React.createElement(Col$1, {
     span: 6
   }, /*#__PURE__*/React.createElement(Form.Item, {
     label: "\u5EFA\u7B51\u9879\u76EE\u540D\u79F0"
@@ -24737,7 +24827,13 @@ var MyNY$1 = /*#__PURE__*/function (_React$Component4) {
   }]);
 
   return MyNY;
-}(React.Component);
+}(React.Component); // function BuyerNameInput(props: InputProps & { fieldName: string; myform: WrappedFormUtils<any> }) {
+//     const { fieldName, myform: form } = props;
+//     if (props.readOnly) return <span className='digtal-stakeholder-form-text'>{props.value}</span>;
+//     return (
+//         <Input disabled={true} {...props} style={{ width: '100%', ...props.style }} />
+//     )
+// }
 
 var css_248z$t = ".kts-invoice-operate-goods-table-virtual .ktsAntX-table-body {\n  height: 280px;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table.ktsAntX-table-bordered > .ktsAntX-table-container > .ktsAntX-table-header > table > thead > tr > th {\n  padding: 0 10px;\n  height: 32px;\n  background: #f4f4f4;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table.ktsAntX-table-bordered > .ktsAntX-table-container > .ktsAntX-table-body > table > tbody > tr > td {\n  padding: 0;\n  height: 32px;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-body {\n  position: relative;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-body > table {\n  position: absolute;\n  left: 0;\n  top: 0;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-tbody {\n  position: relative;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-checkbox-wrapper .ktsAntX-checkbox-inner {\n  width: 16px;\n  height: 16px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n  top: 1px;\n}\n";
 styleInject(css_248z$t);

package/dist/index.js

@@ -24539,21 +24539,59 @@ var MyNY = /*#__PURE__*/function (_React$Component4) {
 var css_248z$s = ".kts-invoice-operate-real-estate-info-digtal {\n  padding: 20px;\n  border-bottom: 2px solid #9F613E;\n  border-left: 2px solid #9F613E;\n  border-right: 2px solid #9F613E;\n}\n.kts-invoice-operate-real-estate-info-digtal .real-estate-info-digtal-label {\n  color: #9F613E;\n  font-weight: bold;\n}\n.kts-invoice-operate-real-estate-info-digtal .ktsAnt3x-row.ktsAnt3x-form-item {\n  margin-bottom: 0;\n}\n.kts-invoice-operate-real-estate-info-digtal .break-word {\n  word-break: break-word;\n}\n";
 styleInject(css_248z$s);
 
+var _g$4, _defs$6;
+
+function _extends$e() { _extends$e = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
+
+function SvgPlus$3(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$e({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 15,
+    fill: "none"
+  }, props), _g$4 || (_g$4 = /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#plus_svg__clip0_715_360)"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M8 14.531A7.031 7.031 0 118 .468a7.031 7.031 0 010 14.063zm0-.937A6.094 6.094 0 108 1.406a6.094 6.094 0 000 12.188z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M4.25 7.969a.469.469 0 010-.938h7.5a.47.47 0 010 .938h-7.5z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M7.531 3.75a.469.469 0 01.938 0v7.5a.47.47 0 01-.938 0v-7.5z"
+  }))), _defs$6 || (_defs$6 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "plus_svg__clip0_715_360"
+  }, /*#__PURE__*/React.createElement("path", {
+    transform: "translate(.5)",
+    d: "M0 0h15v15H0z"
+  })))));
+}
+
 /** 特殊信息-建筑服务 */
 
 var Architecture = GreyReactBox.decorator(ktsComponentsAntdX3.Form.create())(function (props) {
   /** 控制器 */
   var controller = Invoice.useInvoiceController();
-  var form = props.form;
+  var form = props.form,
+      onClickImportButton = props.onClickImportButton;
   var getFieldDecorator = form.getFieldDecorator;
   var model = controller.useMemo(function (s) {
     return s.model;
   }, []);
   var readOnly = React__default['default'].useMemo(function () {
     return model === 'readOnly';
-  }, [model]); // 注册 form
+  }, [model]);
+
+  var _React$useState = React__default['default'].useState( props.region),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      region = _React$useState2[0],
+      setRegion = _React$useState2[1]; // 注册 form
+
 
   controller.useForm('serviceDataDtoInfo', form);
+
+  var onSelectChange = function onSelectChange(value) {
+    setRegion(value === 'Y' ? true : false); // props.onRegionalSelect && props.onRegionalSelect(value);
+  };
+
   return /*#__PURE__*/React__default['default'].createElement("div", {
     className: "kts-invoice-operate-real-estate-info-digtal"
   }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -24620,6 +24658,7 @@ var Architecture = GreyReactBox.decorator(ktsComponentsAntdX3.Form.create())(fun
       message: '请选择跨地（市）标志'
     }]
   })(readOnly ? /*#__PURE__*/React__default['default'].createElement(MyNY$1, null) : /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Select, {
+    onChange: onSelectChange,
     placeholder: "\u8BF7\u9009\u62E9",
     style: {
       width: '100%'
@@ -24628,7 +24667,58 @@ var Architecture = GreyReactBox.decorator(ktsComponentsAntdX3.Form.create())(fun
     value: 'Y'
   }, "\u662F"), /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Select.Option, {
     value: 'N'
-  }, "\u5426"))))), /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Col, {
+  }, "\u5426"))))), props.demo && region && /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Col, {
+    span: 6
+  }, /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX3.Form.Item, {
+    label: "\u6D89\u7A0E\u4E8B\u9879\u7F16\u53F7",
+    colon: false
+  }, getFieldDecorator('taxMatterNo', {
+    rules: readOnly ? [] : [{
+      required: true,
+      message: '请选择'
+    }, {
+      validator: function validator(_, value, callback) {
+        var constructAddress = form.getFieldValue('constructAddress');
+        var region = form.getFieldValue('division');
+        console.log(constructAddress.join(''), region);
+
+        if (constructAddress.join('') === region) {
+          callback();
+        } else {
+          callback('建筑服务发生地与税务事项地址不一致');
+        }
+      }
+    }]
+  })(readOnly ? /*#__PURE__*/React__default['default'].createElement(MyDiv$4, null) : /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Input, {
+    autoComplete: "off",
+    disabled: true,
+    suffix: /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Button, {
+      type: 'link',
+      style: {
+        padding: 0,
+        width: 20,
+        height: '100%'
+      },
+      icon: /*#__PURE__*/React__default['default'].createElement(Icon, {
+        component: SvgPlus$3
+      }),
+      onClick: function onClick() {
+        onClickImportButton && onClickImportButton(controller);
+      }
+    })
+  })))), props.demo && region && /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Col, {
+    span: 6,
+    style: {
+      display: 'none'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX3.Form.Item, {
+    label: 'division',
+    colon: false
+  }, getFieldDecorator('division', {
+    rules: []
+  })(readOnly ? /*#__PURE__*/React__default['default'].createElement(MyDiv$4, null) : /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Input, {
+    autoComplete: "off"
+  })))), /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX4.Col, {
     span: 6
   }, /*#__PURE__*/React__default['default'].createElement(ktsComponentsAntdX3.Form.Item, {
     label: "\u5EFA\u7B51\u9879\u76EE\u540D\u79F0"
@@ -24747,7 +24837,13 @@ var MyNY$1 = /*#__PURE__*/function (_React$Component4) {
   }]);
 
   return MyNY;
-}(React__default['default'].Component);
+}(React__default['default'].Component); // function BuyerNameInput(props: InputProps & { fieldName: string; myform: WrappedFormUtils<any> }) {
+//     const { fieldName, myform: form } = props;
+//     if (props.readOnly) return <span className='digtal-stakeholder-form-text'>{props.value}</span>;
+//     return (
+//         <Input disabled={true} {...props} style={{ width: '100%', ...props.style }} />
+//     )
+// }
 
 var css_248z$t = ".kts-invoice-operate-goods-table-virtual .ktsAntX-table-body {\n  height: 280px;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table.ktsAntX-table-bordered > .ktsAntX-table-container > .ktsAntX-table-header > table > thead > tr > th {\n  padding: 0 10px;\n  height: 32px;\n  background: #f4f4f4;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table.ktsAntX-table-bordered > .ktsAntX-table-container > .ktsAntX-table-body > table > tbody > tr > td {\n  padding: 0;\n  height: 32px;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-body {\n  position: relative;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-body > table {\n  position: absolute;\n  left: 0;\n  top: 0;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-table .ktsAntX-table-tbody {\n  position: relative;\n}\n.kts-invoice-operate-goods-table-virtual .ktsAntX-checkbox-wrapper .ktsAntX-checkbox-inner {\n  width: 16px;\n  height: 16px;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n  top: 1px;\n}\n";
 styleInject(css_248z$t);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kts-component-invoice-operate",
-  "version": "3.2.214",
+  "version": "3.3.2",
   "scripts": {
     "dev": "dumi dev --max-old-space-size=6096",
     "start": "dumi dev",

package/src/Invoice/Invoice-digtal/_test/architecture/index.tsx

@@ -2,21 +2,47 @@ import React from 'react';
 import Invoice from '../../..';
 import moment from 'moment';
 import 'antd/dist/antd.css';
-
+import { Button } from 'antd'
 export default () => {
 
     const controller = React.useMemo(() => new Invoice.InvoiceController(), []);
+    const [showDrawer, setShowDrawer] = React.useState(false);
 
     React.useEffect(() => {
         controller.run(async s => {
+            if (showDrawer) {
+                window.setTimeout(() => {
+                    controller.formList.get('serviceDataDtoInfo')?.setFieldsValue({
+                        taxMatterNo: ['北京','上海'][Math.round(Math.random())],
+                    })
+                    setShowDrawer(false)
+                }, 1000)
+            }
         })
-    }, [])
+    }, [showDrawer])
+    const onSave = async () => {
+        const formValues = await controller.validateFields();
+        console.log(formValues)
+    }
 
     return (
-        <Invoice
-            invoiceType='digtal'
-            controller={controller}
-            specialInfor={<Invoice.Architecture />}
-        />
+        <>
+            <Button onClick={onSave}>输出表单内容</Button>
+            <Invoice
+                invoiceType='digtal'
+                controller={controller}
+
+                specialInfor={
+                    <Invoice.Architecture
+                        addressOptions={[{ name: '北京' }]}
+                        demo={true}
+                        fieldNames={{
+                            label: 'name',
+                            value: 'name',
+                            children: 'children'
+                        }} onClickImportButton={() => setShowDrawer(true)} />
+                }
+            />
+        </>
     )
 };

package/src/Invoice/Invoice-digtal/_test/easiest/index.tsx

@@ -122,14 +122,16 @@ export default () => {
     }
     React.useEffect(() => {
         controller.run(async s => {
-            s.stakeholder.enables = ['taxAmount'];
-            s.priceIntegerDigit = 25;
-            s.calculatingDigits = 25;
+            s.goodsListState.isRecalculateWhenSwitchTax = true;
             s.goodsListState.isTaxIncluded = false;
-            s.goodsListState.amountExcludeTax = parseFloat(data?.invoiceAmount) || undefined;
-            s.goodsListState.amountIncludeTax = parseFloat(data?.totalAmount) || undefined;
-            s.goodsListState.amountTax = parseFloat(data?.taxAmount) || undefined;
-            s.goodsListState.goodsList = data?.detailList?.map(e => sToCi(e)) ?? [];
+            // s.stakeholder.enables = ['taxAmount'];
+            // s.priceIntegerDigit = 25;
+            // s.calculatingDigits = 25;
+            // s.goodsListState.isTaxIncluded = false;
+            // s.goodsListState.amountExcludeTax = parseFloat(data?.invoiceAmount) || undefined;
+            // s.goodsListState.amountIncludeTax = parseFloat(data?.totalAmount) || undefined;
+            // s.goodsListState.amountTax = parseFloat(data?.taxAmount) || undefined;
+            // s.goodsListState.goodsList = data?.detailList?.map(e => sToCi(e)) ?? [];
         })
     }, [controller])
     return (

package/src/Invoice/Invoice-digtal/index.md

@@ -1,7 +1,7 @@
 # 数电
 
-## 简单用法
-<code src="./_test/easiest/index.tsx"></code>
+<!-- ## 简单用法
+<code src="./_test/easiest/index.tsx"></code> -->
 
 ## 建筑服务
 <code src="./_test/architecture/index.tsx"></code>
@@ -38,5 +38,5 @@
 
 -->
 
-## 货物运输服务
-<code src="./_test/freight/index.tsx"></code> 
+<!-- ## 货物运输服务
+<code src="./_test/freight/index.tsx"></code>  -->

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

@@ -1,13 +1,16 @@
 
 import React from "react";
 import { decorator } from 'grey-react-box';
-import { Form } from 'kts-components-antd-x3';
+import { Form, } from 'kts-components-antd-x3';
 import { FormComponentProps } from 'kts-components-antd-x3/lib/form';
 import Invoice from '../../..';
 import './index.less';
-import { Cascader, Col, Input, Row, Select } from "kts-components-antd-x4";
+import { ReactComponent as PlusSvg } from './svg/plus.svg'
+import { Cascader, Col, Input, Row, Select, Button, } from "kts-components-antd-x4";
 import moment from "moment";
-
+import Icon from '@ant-design/icons';
+// import { WrappedFormUtils } from 'kts-components-antd-x3/lib/form/Form';
+import InvoiceController from "../../../InvoiceController";
 
 export interface RealEstateInfoProps {
     /**
@@ -19,6 +22,14 @@ export interface RealEstateInfoProps {
      * 建筑服务地址数据字段名
      */
     fieldNames?: any;
+
+    onRegionalSelect?: (value: boolean) => void;
+
+    /** 点击了 */
+    onClickImportButton?: (e: InvoiceController) => void;
+    //专门针对poc增加的参数，防止项目自动升级导致问题
+    demo?: boolean;
+    region?: boolean
 }
 
 /** 特殊信息-建筑服务 */
@@ -27,17 +38,20 @@ export default decorator<RealEstateInfoProps, FormComponentProps & RealEstateInf
     /** 控制器 */
     const controller = Invoice.useInvoiceController();
 
-    const { form } = props;
+    const { form, onClickImportButton } = props;
 
     const { getFieldDecorator } = form;
 
     const model = controller.useMemo(s => s.model, []);
 
     const readOnly = React.useMemo(() => model === 'readOnly', [model]);
-
+    const [region, setRegion] = React.useState(false || props.region);
     // 注册 form
     controller.useForm('serviceDataDtoInfo', form);
-
+    const onSelectChange = (value: string) => {
+        setRegion(value === 'Y' ? true : false);
+        // props.onRegionalSelect && props.onRegionalSelect(value);
+    }
     return (
         <div className="kts-invoice-operate-real-estate-info-digtal">
             <div className='real-estate-info-digtal-label' >特殊信息-建筑服务</div>
@@ -45,7 +59,7 @@ export default decorator<RealEstateInfoProps, FormComponentProps & RealEstateInf
                 <Col span={6} >
                     <Form.Item label='土地增值税项目编号' >
                         {getFieldDecorator('landNumber', {
-                             rules: [
+                            rules: [
                                 { max: 16, message: '最多16个字符' },
                             ]
                         })(
@@ -55,7 +69,7 @@ export default decorator<RealEstateInfoProps, FormComponentProps & RealEstateInf
                         )}
                     </Form.Item>
                 </Col>
-               
+
 
                 <Col span={6} >
                     <Form.Item label='建筑服务发生地' >
@@ -102,19 +116,75 @@ export default decorator<RealEstateInfoProps, FormComponentProps & RealEstateInf
                         })(
                             readOnly
                                 ? <MyNY />
-                                : <Select placeholder='请选择' style={{ width: '100%' }} >
+                                : <Select onChange={onSelectChange} placeholder='请选择' style={{ width: '100%' }} >
                                     <Select.Option value='Y'>是</Select.Option>
                                     <Select.Option value='N'>否</Select.Option>
                                 </Select>
                         )}
                     </Form.Item>
                 </Col>
+                {props.demo && region && <Col span={6} >
+                    <Form.Item label='涉税事项编号' colon={false}>
+                        {getFieldDecorator('taxMatterNo', {
+                            rules: readOnly ? [] : [
+                                { required: true, message: '请选择' },
+                                {
+                                    validator: (_, value, callback) => {
+                                        const constructAddress: string[] = form.getFieldValue('constructAddress');
+                                        const region = form.getFieldValue('division');
+                                        console.log(constructAddress.join(''), region)
+                                        if (constructAddress.join('') === region) {
+                                            callback();
+                                        } else {
+                                            callback('建筑服务发生地与税务事项地址不一致')
+                                        }
+                                    }
+                                }
+                            ]
+
+                        })(
+                            readOnly
+                                ? <MyDiv />
+                                : <Input
+                                    autoComplete="off"
+                                    disabled={true}
+                                    suffix={
+                                        <Button
+                                            type='link'
+                                            style={{ padding: 0, width: 20, height: '100%' }}
+                                            icon={<Icon component={PlusSvg} />}
+                                            onClick={() => { onClickImportButton && onClickImportButton(controller) }}
+                                        />
+                                    }
+                                />
+
+                        )}
+                    </Form.Item>
+                </Col>
+                }
+                {props.demo && region && <Col span={6} style={{ display: 'none' }}>
+                    <Form.Item label='division' colon={false}>
+                        {getFieldDecorator('division', {
+                            rules: []
+
+                        })(
+                            readOnly
+                                ? <MyDiv />
+                                : <Input
+                                    autoComplete="off"
+                                />
+
+                        )}
+                    </Form.Item>
+                </Col>
+                }
                 <Col span={6} >
                     <Form.Item label='建筑项目名称' >
-                        {getFieldDecorator('constructName', { rules: readOnly ? [] : [
+                        {getFieldDecorator('constructName', {
+                            rules: readOnly ? [] : [
                                 { required: true, message: '请输入建筑项目名称' },
                                 { max: 200, message: '建筑项目名称最多200个字符' },
-                                
+
                             ]
                         })(
                             readOnly
@@ -175,3 +245,15 @@ class MyNY extends React.Component<{ value?: 'Y' | 'N', style?: React.CSSPropert
     }
 }
 
+// function BuyerNameInput(props: InputProps & { fieldName: string; myform: WrappedFormUtils<any> }) {
+
+//     const { fieldName, myform: form } = props;
+
+
+//     if (props.readOnly) return <span className='digtal-stakeholder-form-text'>{props.value}</span>;
+
+//     return (
+
+//         <Input disabled={true} {...props} style={{ width: '100%', ...props.style }} />
+//     )
+// }

package/src/Invoice/ui/digtal/Architecture/svg/arrowDown.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
+  <path d="M2.94338 4.42663C3.03458 4.42662 3.12571 4.46481 3.19459 4.54096L5.99164 7.6327L8.78868 4.54096C8.92463 4.39067 9.14733 4.38824 9.28606 4.53554C9.4248 4.68285 9.42705 4.92408 9.29107 5.07437L6.24283 8.44378C6.17667 8.5169 6.08613 8.55811 5.99164 8.55811C5.89714 8.55811 5.80659 8.5169 5.74044 8.44378L2.69221 5.07437C2.55623 4.92408 2.55849 4.68285 2.69722 4.53554C2.76567 4.46287 2.85455 4.42665 2.94338 4.42663Z"/>
+</svg>

package/src/Invoice/ui/digtal/Architecture/svg/arrowUp.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13" fill="none">
+  <path d="M9.55662 8.57337C9.46542 8.57338 9.37429 8.53519 9.30541 8.45904L6.50836 5.3673L3.71132 8.45904C3.57537 8.60933 3.35267 8.61176 3.21394 8.46446C3.0752 8.31715 3.07295 8.07592 3.20893 7.92563L6.25717 4.55622C6.32333 4.4831 6.41387 4.44189 6.50836 4.44189C6.60286 4.44189 6.69341 4.4831 6.75956 4.55622L9.80779 7.92563C9.94377 8.07592 9.94151 8.31715 9.80278 8.46446C9.73433 8.53713 9.64545 8.57335 9.55662 8.57337Z"/>
+</svg>

package/src/Invoice/ui/digtal/Architecture/svg/plus.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 16 15" fill="none">
+  <g clip-path="url(#clip0_715_360)">
+    <path d="M8 14.5312C4.11687 14.5312 0.96875 11.3831 0.96875 7.5C0.96875 3.61687 4.11687 0.46875 8 0.46875C11.8831 0.46875 15.0312 3.61687 15.0312 7.5C15.0312 11.3831 11.8831 14.5312 8 14.5312ZM8 13.5938C11.3656 13.5938 14.0938 10.8656 14.0938 7.5C14.0938 4.13438 11.3656 1.40625 8 1.40625C4.63438 1.40625 1.90625 4.13438 1.90625 7.5C1.90625 10.8656 4.63438 13.5938 8 13.5938Z"/>
+    <path d="M4.25 7.96875C4.12568 7.96875 4.00645 7.91936 3.91854 7.83146C3.83064 7.74355 3.78125 7.62432 3.78125 7.5C3.78125 7.37568 3.83064 7.25645 3.91854 7.16854C4.00645 7.08064 4.12568 7.03125 4.25 7.03125H11.75C11.8743 7.03125 11.9935 7.08064 12.0815 7.16854C12.1694 7.25645 12.2188 7.37568 12.2188 7.5C12.2188 7.62432 12.1694 7.74355 12.0815 7.83146C11.9935 7.91936 11.8743 7.96875 11.75 7.96875H4.25Z"/>
+    <path d="M7.53125 3.75C7.53125 3.62568 7.58064 3.50645 7.66854 3.41854C7.75645 3.33064 7.87568 3.28125 8 3.28125C8.12432 3.28125 8.24355 3.33064 8.33146 3.41854C8.41936 3.50645 8.46875 3.62568 8.46875 3.75V11.25C8.46875 11.3743 8.41936 11.4935 8.33146 11.5815C8.24355 11.6694 8.12432 11.7188 8 11.7188C7.87568 11.7188 7.75645 11.6694 7.66854 11.5815C7.58064 11.4935 7.53125 11.3743 7.53125 11.25V3.75Z"/>
+  </g>
+  <defs>
+    <clipPath id="clip0_715_360">
+      <rect width="15" height="15" transform="translate(0.5)"/>
+    </clipPath>
+  </defs>
+</svg>