kts-component-invoice-operate 3.2.215 → 3.2.217

package/src/InvoiceTypeModal/index.tsx

@@ -1,162 +1,162 @@
-
-import React from "react";
-import { Col, Form, Modal, Radio, Row, Select } from "kts-xui";
-import { DefaultOptionType } from "kts-components-antd-x4/lib/select";
-import './index.less';
-
-export interface IFormValues {
-
-    /** 开票种类 */
-    billingType: 'digital' | 'taxation';
-
-    /** 特定业务 */
-    business?: any;
-
-    /** 选择票类 */
-    invoiceType?: any;
-}
-
-export interface IInvoiceTypeModalProps {
-
-    /** 是否禁用 */
-    isDisabled?: boolean;
-
-    /** 窗口标题 */
-    modalTitle?: string;
-
-    /** 是否开启 */
-    open?: boolean;
-
-    /** 点击了确认 */
-    onOk?: (values: IFormValues) => void;
-
-    /** 点击了取消 */
-    onCancel?: () => void;
-
-    /** 切换了 开票种类 */
-    onChange?: (e: 'digital' | 'taxation') => void;
-    
-    /** 切换了 发票类型 */
-    onInvoiceTypeChange?: (e: any) => void;
-
-    /** 禁用列表 */
-    disableds?: ('billingType' | 'invoiceType' | 'business')[];
-
-    /** 选择票类 选项 */
-    invoiceTypeOptions?: DefaultOptionType[];
-
-    /** 特定业务 选项 */
-    businessOptions?: DefaultOptionType[];
-
-    /** 票类默认值 */
-    defaultInvoiceType?: any;
-
-    /** 特定业务默认值 */
-    defaultBusiness?: any;
-
-    /** 开票种类 默认值 */
-    defaultBillingType?: 'digital' | 'taxation';
-}
-
-export default function InvoiceTypeModal(props: IInvoiceTypeModalProps) {
-
-    const { disableds = [] } = props;
-
-    const [formValues, setValues] = React.useState<IFormValues>({ billingType: props.defaultBillingType || 'digital' });
-
-    const [form] = Form.useForm<IFormValues>();
-
-    const onConfirm = React.useCallback(async () => {
-        const values = await form.validateFields();
-        props.onOk && props.onOk(values);
-    }, [props.onOk, form])
-
-    const onChangeBillingType = React.useCallback(e => {
-        props.onChange && props.onChange(e.target.value);
-        form.setFieldsValue({ invoiceType: null, business: null });
-        setValues(form.getFieldsValue());
-    }, [props.onChange, form])
-    const onInvoiceTypeChange = React.useCallback(value => {
-        props.onInvoiceTypeChange && props.onInvoiceTypeChange(value);
-        form.setFieldsValue({ business: null });
-        setValues(form.getFieldsValue());
-    }, [props.onInvoiceTypeChange, form])
-    React.useEffect(() => {
-        if (props.open) {
-            const values = {
-                billingType: props.defaultBillingType || 'digital',
-                invoiceType: props.defaultInvoiceType,
-                business: props.defaultBusiness,
-            }
-
-            form.resetFields();
-            form.setFieldsValue(values);
-            setValues(values);
-        }
-    }, [props.open, props.defaultBillingType, props.defaultBusiness, props.defaultInvoiceType, form])
-
-    return (
-        <Modal
-            title={props.modalTitle || "选择开具信息"}
-            open={props.open}
-            onOk={onConfirm}
-            onCancel={props.onCancel}
-            okText='确定'
-            cancelText='取消'
-        >
-            <Form
-                form={form}
-                layout="vertical"
-                style={{ paddingTop: 20 }}
-                onValuesChange={(_, e) => { setValues(e) }}
-            >
-                <Row gutter={[16, 16]}>
-                    <Col span={24} >
-                        <Form.Item name='billingType' >
-                            <Radio.Group
-                                size='large'
-                                className="goods-list-digtal-reselect-invoice-typeModal-radio"
-                                optionType="button"
-                                disabled={disableds.indexOf('billingType') >= 0}
-                                onChange={onChangeBillingType}
-                                options={[
-                                    { label: '数电发票', value: 'digital' },
-                                    { label: '税控发票', value: 'taxation' },
-                                ]}
-                            />
-                        </Form.Item>
-                    </Col>
-
-                    <Col span={12} >
-                        <Form.Item
-                            name='invoiceType'
-                            label="选择票类"
-                            rules={[{ required: true, message: '选择票类必填' }]}
-                        >
-                            <Select
-                                size='large'
-                                allowClear
-                                placeholder="请选择（必填项）"
-                                disabled={disableds.indexOf('invoiceType') >= 0}
-                                options={props.invoiceTypeOptions}
-                                onChange={onInvoiceTypeChange}
-                            />
-                        </Form.Item>
-                    </Col>
-
-                    <Col span={12} >
-                        <Form.Item name='business' label="特定业务">
-                            <Select
-                                size='large'
-                                allowClear
-                                placeholder="请选择（非必填项）"
-                                disabled={disableds.indexOf('business') >= 0 || !formValues.invoiceType}
-                                options={props.businessOptions}
-                            />
-                        </Form.Item>
-                    </Col>
-                </Row>
-            </Form>
-        </Modal>
-    )
+
+import React from "react";
+import { Col, Form, Modal, Radio, Row, Select } from "kts-xui";
+import { DefaultOptionType } from "kts-components-antd-x4/lib/select";
+import './index.less';
+
+export interface IFormValues {
+
+    /** 开票种类 */
+    billingType: 'digital' | 'taxation';
+
+    /** 特定业务 */
+    business?: any;
+
+    /** 选择票类 */
+    invoiceType?: any;
+}
+
+export interface IInvoiceTypeModalProps {
+
+    /** 是否禁用 */
+    isDisabled?: boolean;
+
+    /** 窗口标题 */
+    modalTitle?: string;
+
+    /** 是否开启 */
+    open?: boolean;
+
+    /** 点击了确认 */
+    onOk?: (values: IFormValues) => void;
+
+    /** 点击了取消 */
+    onCancel?: () => void;
+
+    /** 切换了 开票种类 */
+    onChange?: (e: 'digital' | 'taxation') => void;
+    
+    /** 切换了 发票类型 */
+    onInvoiceTypeChange?: (e: any) => void;
+
+    /** 禁用列表 */
+    disableds?: ('billingType' | 'invoiceType' | 'business')[];
+
+    /** 选择票类 选项 */
+    invoiceTypeOptions?: DefaultOptionType[];
+
+    /** 特定业务 选项 */
+    businessOptions?: DefaultOptionType[];
+
+    /** 票类默认值 */
+    defaultInvoiceType?: any;
+
+    /** 特定业务默认值 */
+    defaultBusiness?: any;
+
+    /** 开票种类 默认值 */
+    defaultBillingType?: 'digital' | 'taxation';
+}
+
+export default function InvoiceTypeModal(props: IInvoiceTypeModalProps) {
+
+    const { disableds = [] } = props;
+
+    const [formValues, setValues] = React.useState<IFormValues>({ billingType: props.defaultBillingType || 'digital' });
+
+    const [form] = Form.useForm<IFormValues>();
+
+    const onConfirm = React.useCallback(async () => {
+        const values = await form.validateFields();
+        props.onOk && props.onOk(values);
+    }, [props.onOk, form])
+
+    const onChangeBillingType = React.useCallback(e => {
+        props.onChange && props.onChange(e.target.value);
+        form.setFieldsValue({ invoiceType: null, business: null });
+        setValues(form.getFieldsValue());
+    }, [props.onChange, form])
+    const onInvoiceTypeChange = React.useCallback(value => {
+        props.onInvoiceTypeChange && props.onInvoiceTypeChange(value);
+        form.setFieldsValue({ business: null });
+        setValues(form.getFieldsValue());
+    }, [props.onInvoiceTypeChange, form])
+    React.useEffect(() => {
+        if (props.open) {
+            const values = {
+                billingType: props.defaultBillingType || 'digital',
+                invoiceType: props.defaultInvoiceType,
+                business: props.defaultBusiness,
+            }
+
+            form.resetFields();
+            form.setFieldsValue(values);
+            setValues(values);
+        }
+    }, [props.open, props.defaultBillingType, props.defaultBusiness, props.defaultInvoiceType, form])
+
+    return (
+        <Modal
+            title={props.modalTitle || "选择开具信息"}
+            open={props.open}
+            onOk={onConfirm}
+            onCancel={props.onCancel}
+            okText='确定'
+            cancelText='取消'
+        >
+            <Form
+                form={form}
+                layout="vertical"
+                style={{ paddingTop: 20 }}
+                onValuesChange={(_, e) => { setValues(e) }}
+            >
+                <Row gutter={[16, 16]}>
+                    <Col span={24} >
+                        <Form.Item name='billingType' >
+                            <Radio.Group
+                                size='large'
+                                className="goods-list-digtal-reselect-invoice-typeModal-radio"
+                                optionType="button"
+                                disabled={disableds.indexOf('billingType') >= 0}
+                                onChange={onChangeBillingType}
+                                options={[
+                                    { label: '数电发票', value: 'digital' },
+                                    { label: '税控发票', value: 'taxation' },
+                                ]}
+                            />
+                        </Form.Item>
+                    </Col>
+
+                    <Col span={12} >
+                        <Form.Item
+                            name='invoiceType'
+                            label="选择票类"
+                            rules={[{ required: true, message: '选择票类必填' }]}
+                        >
+                            <Select
+                                size='large'
+                                allowClear
+                                placeholder="请选择（必填项）"
+                                disabled={disableds.indexOf('invoiceType') >= 0}
+                                options={props.invoiceTypeOptions}
+                                onChange={onInvoiceTypeChange}
+                            />
+                        </Form.Item>
+                    </Col>
+
+                    <Col span={12} >
+                        <Form.Item name='business' label="特定业务">
+                            <Select
+                                size='large'
+                                allowClear
+                                placeholder="请选择（非必填项）"
+                                disabled={disableds.indexOf('business') >= 0 || !formValues.invoiceType}
+                                options={props.businessOptions}
+                            />
+                        </Form.Item>
+                    </Col>
+                </Row>
+            </Form>
+        </Modal>
+    )
 }