@jswork/react-ant-resource-form 1.0.20 → 1.0.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -0
- package/dist/main.cjs.js +1 -1
- package/dist/main.cjs.js.map +1 -1
- package/dist/main.d.mts +1 -0
- package/dist/main.d.ts +1 -0
- package/dist/main.esm.js +1 -1
- package/dist/main.esm.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/style.css.map +1 -1
- package/dist/style.scss +7 -3
- package/package.json +1 -1
- package/src/index.tsx +6 -3
- package/src/style.scss +7 -3
package/README.md
CHANGED
|
@@ -5,3 +5,11 @@
|
|
|
5
5
|
```shell
|
|
6
6
|
yarn add @jswork/react-ant-resource-form
|
|
7
7
|
```
|
|
8
|
+
|
|
9
|
+
## setup
|
|
10
|
+
```ts
|
|
11
|
+
import { config as niceFormConfig } from '@ebay/nice-form-react';
|
|
12
|
+
import antdAdapter from '@ebay/nice-form-react/adapters/antdAdapter';
|
|
13
|
+
|
|
14
|
+
niceFormConfig.addAdapter(antdAdapter);
|
|
15
|
+
```
|
package/dist/main.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var E=Object.defineProperty;var S=Object.getOwnPropertySymbols;var
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var E=Object.defineProperty;var S=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var k=(a,s,e)=>s in a?E(a,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[s]=e,d=(a,s)=>{for(var e in s||(s={}))b.call(s,e)&&k(a,e,s[e]);if(S)for(var e of S(s))y.call(s,e)&&k(a,e,s[e]);return a};var u=(a,s)=>E(a,"name",{value:s,configurable:!0});var w=(a,s)=>{var e={};for(var t in a)b.call(a,t)&&s.indexOf(t)<0&&(e[t]=a[t]);if(a!=null&&S)for(var t of S(a))s.indexOf(t)<0&&y.call(a,t)&&(e[t]=a[t]);return e};var h=(a,s,e)=>k(a,typeof s!="symbol"?s+"":s,e);var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _antd = require('antd');var _reactantformschema = require('@jswork/react-ant-form-schema'); var _reactantformschema2 = _interopRequireDefault(_reactantformschema);var _icons = require('@ant-design/icons');var V={"zh-CN":{create:"\u521B\u5EFA",update:"\u4FDD\u5B58",create_title:"\u521B\u5EFA",update_title:"\u66F4\u65B0",create_success:"\u521B\u5EFA\u6210\u529F",update_success:"\u66F4\u65B0\u6210\u529F",submit:"\u63D0\u4EA4",back:"\u8FD4\u56DE"},"en-US":{create:"Create",update:"Save",create_title:"Create",update_title:"Update",create_success:"Create success",update_success:"Update success",submit:"Submit",back:"Back"}};var _next = require('@jswork/next'); var _next2 = _interopRequireDefault(_next);var _reactrouterdom = require('react-router-dom');var _fastdeepequal = require('fast-deep-equal'); var _fastdeepequal2 = _interopRequireDefault(_fastdeepequal);var F="react-ant-resource-form",p,v=(p=class extends _react.Component{constructor(e){var t;super(e);h(this,"formRef",_react2.default.createRef());h(this,"_isMounted",!1);h(this,"_initialValues",null);h(this,"handleBack",u(()=>{history.back()},"handleBack"));h(this,"setInitialValues",u(e=>{var t;this._initialValues=e||((t=this.formInstance)==null?void 0:t.getFieldsValue())||{}},"setInitialValues"));h(this,"handleFinish",u(e=>{let{params:t,name:i}=this.props,r=`${i}_update`,o=`${i}_create`;if(this.isEdit){let l=d({id:t.id},e),m=this.handleStateRequest({stage:"update",payload:l});_next2.default.$api[r](m).then(c=>{_antd.message.success(this.t("update_success")),this.handleStateResponse({stage:"update",data:c})}).finally(()=>{this.setState({loading:!1}),this.setInitialValues(),this.handleValuesChange(null,this._initialValues)})}else{let l=d({},e),m=this.handleStateRequest({stage:"create",payload:l});_next2.default.$api[o](m).then(c=>{var f;_antd.message.success(this.t("create_success")),this.handleStateResponse({stage:"create",data:c}),(f=this.formInstance)==null||f.resetFields(),history.back()}).finally(()=>this.setState({loading:!1}))}},"handleFinish"));h(this,"handleKeydown",u(e=>{var r;let{disableHotkeySave:t}=this.props;(e.ctrlKey||e.metaKey)&&(e.key==="s"||e.key==="S")&&(e.preventDefault(),t||(r=this.formInstance)==null||r.submit())},"handleKeydown"));h(this,"handleValuesChange",u((e,t)=>{this.setState({touched:!_fastdeepequal2.default.call(void 0, this._initialValues,t)})},"handleValuesChange"));this.state={loading:!1,touched:!1},this.handleStateRequest=this.handleStateRequest.bind(this),this.handleStateResponse=this.handleStateResponse.bind(this),this.initDetailIfNeeded=this.initDetailIfNeeded.bind(this),(t=e.onInit)==null||t.call(e,this)}get isEdit(){let{params:e}=this.props;return!!(e!=null&&e.id)}get canSave(){let{touched:e,loading:t}=this.state;return this.isEdit?e&&!t:!t}get titleView(){let{title:e}=this.props,t=e||(this.isEdit?this.t("update_title"):this.t("create_title"));return _react2.default.createElement(_antd.Space,null,t,_react2.default.createElement("span",null,this.touchedView))}get touchedView(){return this.isEdit&&this.state.touched?_react2.default.createElement("em",{style:{color:"#f60"}},_react2.default.createElement(_icons.DiffOutlined,null)):null}get extraView(){let{extra:e,backText:t,backProps:i}=this.props;return e||_react2.default.createElement(_antd.Button,d({size:"small",icon:_react2.default.createElement(_icons.ArrowLeftOutlined,null),onClick:this.handleBack},i),t||this.t("back"))}get childrenView(){let{okText:e,backText:t,okProps:i,backProps:r,children:o}=this.props,l=e||(this.isEdit?this.t("update"):this.t("create"));return o||_react2.default.createElement(_antd.Space,null,_react2.default.createElement(_antd.Button,d({disabled:!this.canSave,htmlType:"submit",type:"primary",icon:_react2.default.createElement(_icons.SaveOutlined,null)},i),l||this.t("submit")),_react2.default.createElement(_antd.Button,d({icon:_react2.default.createElement(_icons.ArrowLeftOutlined,null),onClick:this.handleBack},r),t||this.t("back")))}get formInstance(){var e;return(e=this.formRef)==null?void 0:e.current}t(e){let{lang:t}=this.props;return V[t][e]}handleStateRequest(e){var t,i;return this.setState({loading:!0}),((i=(t=this.props).transformRequest)==null?void 0:i.call(t,e))||e.payload}handleStateResponse(e){var i,r,o,l;let{name:t}=this.props;return this.setState({loading:!1}),(r=(i=_next2.default.$event)==null?void 0:i.emit)==null||r.call(i,`${t}:refetch`),((l=(o=this.props).transformResponse)==null?void 0:l.call(o,e))||e.data}componentDidMount(){this._isMounted=!0,window.addEventListener("keydown",this.handleKeydown),this.initDetailIfNeeded()}componentDidUpdate(e){var r,o;let t=(r=e.params)==null?void 0:r.id,i=(o=this.props.params)==null?void 0:o.id;t!==i&&this.initDetailIfNeeded()}componentWillUnmount(){window.removeEventListener("keydown",this.handleKeydown),this._isMounted=!1}initDetailIfNeeded(){let{params:e,name:t}=this.props,i=`${t}_show`;if(this.isEdit){let r={id:e.id},o=this.handleStateRequest({stage:"show",payload:r});_next2.default.$api[i](o).then(l=>{var c,f;if(!this._isMounted)return;let m=this.handleStateResponse({stage:"show",data:l});(f=(c=this.formInstance)==null?void 0:c.setFieldsValue)==null||f.call(c,m)}).finally(()=>{this.setState({loading:!1}),this.setInitialValues()})}else this.setInitialValues()}render(){let g=this.props,{className:e,name:t,meta:i,children:r,lang:o,title:l,extra:m,size:c,okText:f,backText:H,okProps:W,backProps:j,classNames:N,params:G,transformRequest:J,transformResponse:Q,disableHotkeySave:X,blocker:q,onInit:Y}=g,D=w(g,["className","name","meta","children","lang","title","extra","size","okText","backText","okProps","backProps","classNames","params","transformRequest","transformResponse","disableHotkeySave","blocker","onInit"]);return _react2.default.createElement(_antd.Card,{title:this.titleView,extra:this.extraView,size:c,classNames:N,"data-component":F,"data-blocker":q,className:_classnames2.default.call(void 0, F,e)},_react2.default.createElement(_antd.Spin,{spinning:this.state.loading},_react2.default.createElement(_reactantformschema2.default,d({meta:i,ref:this.formRef,onValuesChange:this.handleValuesChange,onFinish:this.handleFinish},D),this.childrenView)))}},u(p,"ReactAntResourceForm"),h(p,"defaultProps",{lang:"zh-CN",disableHotkeySave:!1}),p),U= exports.ReactAntResourceFormFc =u(a=>{let s=_reactrouterdom.useParams.call(void 0, );return _react2.default.createElement(v,d({params:s},a))},"ReactAntResourceFormFc"),A=v;var pe=A;exports.ReactAntResourceFormFc = U; exports.default = pe;
|
|
2
2
|
//# sourceMappingURL=main.cjs.js.map
|
package/dist/main.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/Users/ap7/github/react-ant-resource-form/packages/lib/dist/main.cjs.js","../src/index.tsx","../src/locales.ts"],"names":["API_FORM_LOCALES","create","update","create_title","update_title","create_success","update_success","submit","back","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","resourceEdit"],"mappings":"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","file":"/Users/ap7/github/react-ant-resource-form/packages/lib/dist/main.cjs.js","sourcesContent":[null,"// import noop from '@jswork/noop';\nimport cx from 'classnames';\nimport React, { Component, FC } from 'react';\nimport { Button, ButtonProps, Card, CardProps, Space, message, Spin } from 'antd';\nimport type { FormInstance } from 'antd';\nimport ReactAntdFormSchema, { ReactAntdFormSchemaProps } from '@jswork/react-ant-form-schema';\nimport { ArrowLeftOutlined, DiffOutlined, SaveOutlined } from '@ant-design/icons';\nimport { API_FORM_LOCALES } from './locales';\nimport nx from '@jswork/next';\nimport { useParams } from 'react-router-dom';\nimport deepEqual from 'fast-deep-equal';\n\ndeclare global {\n interface NxStatic {\n $api: Record<string, any>;\n $event: any;\n }\n}\n\ntype StagePayload = {\n stage: 'show' | 'create' | 'update';\n payload: any;\n};\n\ntype StageData = {\n stage: 'show' | 'create' | 'update';\n data: any;\n};\n\nexport type ReactAntResourceFormProps = {\n lang?: string;\n loading?: boolean;\n okText?: string;\n backText?: string;\n params?: Record<string, any>;\n disableHotkeySave?: boolean;\n transformRequest?: (payload: StagePayload) => any;\n transformResponse?: (res: StageData) => any;\n okProps?: ButtonProps;\n backProps?: ButtonProps;\n classNames?: CardProps['classNames'];\n size?: CardProps['size'];\n extra?: CardProps['extra'];\n title?: CardProps['title'];\n onInit?: (ctx: ReactAntResourceForm) => void;\n} & ReactAntdFormSchemaProps;\n\ntype IState = {\n loading: boolean;\n touched: boolean;\n};\n\nconst CLASS_NAME = 'react-ant-resource-form';\n\n/**\n * 当前 card loading 不要直接使用，因为这个 loading 会导致 Card 里的 formRef 被设置成 null\n * 这个情况仅在 class component 里才会出现，function component 里不会：\n * 报错示例:\n *\n * this.formRef?: null\n * index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}\n * index.tsx:229 this.formRef?: null\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n };\n\n private formRef = React.createRef<FormInstance>(); // 注意类型\n private _isMounted = false;\n private _initialValues = null;\n\n get isEdit() {\n const { params } = this.props;\n return Boolean(params?.id);\n }\n\n get canSave() {\n const { touched, loading } = this.state;\n if (!this.isEdit) return loading === false;\n return touched === true && loading === false;\n }\n\n get titleView() {\n const { title } = this.props;\n const _title = title || (this.isEdit ? this.t('update_title') : this.t('create_title'));\n return (\n <Space>\n {_title}\n <span>{this.touchedView}</span>\n </Space>\n );\n }\n\n get touchedView() {\n if (!this.isEdit) return null;\n return this.state.touched ? (\n <em style={{ color: '#f60' }}>\n <DiffOutlined />\n </em>\n ) : null;\n }\n\n get extraView() {\n const { extra, backText, backProps } = this.props;\n if (extra) return extra;\n return (\n <Button size=\"small\" icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n );\n }\n\n get childrenView() {\n const { okText, backText, okProps, backProps, children } = this.props;\n const _okText = okText || (this.isEdit ? this.t('update') : this.t('create'));\n if (children) return children;\n\n return (\n <Space>\n <Button\n disabled={!this.canSave}\n htmlType=\"submit\"\n type=\"primary\"\n icon={<SaveOutlined />}\n {...okProps}>\n {_okText || this.t('submit')}\n </Button>\n <Button icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n </Space>\n );\n }\n\n get formInstance() {\n return this.formRef?.current;\n }\n\n constructor(props: ReactAntResourceFormProps) {\n super(props);\n this.state = {\n loading: false,\n touched: false,\n };\n\n this.handleStateRequest = this.handleStateRequest.bind(this);\n this.handleStateResponse = this.handleStateResponse.bind(this);\n this.initDetailIfNeeded = this.initDetailIfNeeded.bind(this);\n\n props.onInit?.(this);\n }\n\n private t(key: string) {\n const { lang } = this.props;\n return API_FORM_LOCALES[lang!][key];\n }\n\n private handleBack = () => {\n history.back();\n };\n\n private setInitialValues = (values?: any) => {\n this._initialValues = values || this.formInstance?.getFieldsValue() || {};\n };\n\n handleStateRequest(stagePayload: StagePayload) {\n this.setState({ loading: true });\n return this.props.transformRequest?.(stagePayload) || stagePayload.payload;\n }\n\n handleStateResponse(res: StageData) {\n const { name } = this.props;\n this.setState({ loading: false });\n nx.$event?.emit?.(`${name}:refetch`);\n return this.props.transformResponse?.(res) || res.data;\n }\n\n handleFinish = (values: any) => {\n const { params, name } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n message.success(this.t('update_success'));\n this.handleStateResponse({ stage: 'update', data: res });\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n this.handleValuesChange(null, this._initialValues);\n });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n message.success(this.t('create_success'));\n this.handleStateResponse({ stage: 'create', data: res });\n this.formInstance?.resetFields();\n history.back();\n })\n .finally(() => this.setState({ loading: false }));\n }\n };\n\n // hotkey save handler (replaces useKeyboardSave hook)\n handleKeydown = (e: KeyboardEvent) => {\n const { disableHotkeySave } = this.props;\n const isSave = (e.ctrlKey || e.metaKey) && (e.key === 's' || e.key === 'S');\n if (isSave) {\n e.preventDefault();\n if (!disableHotkeySave) {\n this.formInstance?.submit();\n }\n }\n };\n\n handleValuesChange = (_: any, allValues: any) => {\n this.setState({\n touched: deepEqual(this._initialValues, allValues) === false,\n });\n };\n\n componentDidMount() {\n this._isMounted = true;\n // attach hotkey listener\n window.addEventListener('keydown', this.handleKeydown);\n // initialize detail if editing\n this.initDetailIfNeeded();\n }\n\n componentDidUpdate(prevProps: ReactAntResourceFormProps) {\n const prevId = prevProps.params?.id;\n const curId = this.props.params?.id;\n // re-init when id changed or from create -> edit\n if (prevId !== curId) {\n this.initDetailIfNeeded();\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name } = this.props;\n const resourceShow = `${name}_show`;\n\n if (this.isEdit) {\n const payload = { id: params!.id };\n const _payload = this.handleStateRequest({ stage: 'show', payload });\n\n nx.$api[resourceShow](_payload)\n .then((res: any) => {\n if (!this._isMounted) return; // 👈 关键：防止操作已卸载组件\n const data = this.handleStateResponse({ stage: 'show', data: res });\n this.formInstance?.setFieldsValue?.(data);\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n });\n } else {\n this.setInitialValues();\n }\n }\n\n render() {\n const {\n className,\n name,\n meta,\n children,\n lang,\n title,\n extra,\n size,\n okText,\n backText,\n okProps,\n backProps,\n classNames,\n params,\n transformRequest,\n transformResponse,\n disableHotkeySave,\n onInit,\n ...rest\n } = this.props;\n\n return (\n <Card\n title={this.titleView}\n extra={this.extraView}\n size={size}\n classNames={classNames}\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}>\n <Spin spinning={this.state.loading}>\n <ReactAntdFormSchema\n meta={meta}\n ref={this.formRef}\n onValuesChange={this.handleValuesChange}\n onFinish={this.handleFinish}\n {...rest}>\n {this.childrenView}\n </ReactAntdFormSchema>\n </Spin>\n </Card>\n );\n }\n}\n\nconst ReactAntResourceFormFc: FC<ReactAntResourceFormProps> = (props) => {\n const params = useParams();\n return <ReactAntResourceForm params={params} {...props} />;\n};\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\n","export const API_FORM_LOCALES = {\n 'zh-CN': {\n create: '创建',\n update: '保存',\n create_title: '创建',\n update_title: '更新',\n create_success: '创建成功',\n update_success: '更新成功',\n submit: '提交',\n back: '返回',\n },\n 'en-US': {\n create: 'Create',\n update: 'Save',\n create_title: 'Create',\n update_title: 'Update',\n create_success: 'Create success',\n update_success: 'Update success',\n submit: 'Submit',\n back: 'Back',\n },\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["/Users/aric/github/react-ant-resource-form/packages/lib/dist/main.cjs.js","../src/index.tsx","../src/locales.ts"],"names":["API_FORM_LOCALES","create","update","create_title","update_title","create_success","update_success","submit","back","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","resourceEdit"],"mappings":"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","file":"/Users/aric/github/react-ant-resource-form/packages/lib/dist/main.cjs.js","sourcesContent":[null,"// import noop from '@jswork/noop';\nimport cx from 'classnames';\nimport React, { Component, FC } from 'react';\nimport { Button, ButtonProps, Card, CardProps, Space, message, Spin } from 'antd';\nimport type { FormInstance } from 'antd';\nimport ReactAntdFormSchema, { ReactAntdFormSchemaProps } from '@jswork/react-ant-form-schema';\nimport { ArrowLeftOutlined, DiffOutlined, SaveOutlined } from '@ant-design/icons';\nimport { API_FORM_LOCALES } from './locales';\nimport nx from '@jswork/next';\nimport { useParams } from 'react-router-dom';\nimport deepEqual from 'fast-deep-equal';\n\ndeclare global {\n interface NxStatic {\n $api: Record<string, any>;\n $event: any;\n }\n}\n\ntype StagePayload = {\n stage: 'show' | 'create' | 'update';\n payload: any;\n};\n\ntype StageData = {\n stage: 'show' | 'create' | 'update';\n data: any;\n};\n\nexport type ReactAntResourceFormProps = {\n lang?: string;\n loading?: boolean;\n okText?: string;\n backText?: string;\n params?: Record<string, any>;\n blocker?: boolean;\n disableHotkeySave?: boolean;\n transformRequest?: (payload: StagePayload) => any;\n transformResponse?: (res: StageData) => any;\n okProps?: ButtonProps;\n backProps?: ButtonProps;\n classNames?: CardProps['classNames'];\n size?: CardProps['size'];\n extra?: CardProps['extra'];\n title?: CardProps['title'];\n onInit?: (ctx: ReactAntResourceForm) => void;\n} & ReactAntdFormSchemaProps;\n\ntype IState = {\n loading: boolean;\n touched: boolean;\n};\n\nconst CLASS_NAME = 'react-ant-resource-form';\n\n/**\n * 当前 card loading 不要直接使用，因为这个 loading 会导致 Card 里的 formRef 被设置成 null\n * 这个情况仅在 class component 里才会出现，function component 里不会：\n * 报错示例:\n *\n * this.formRef?: null\n * index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}\n * index.tsx:229 this.formRef?: null\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n };\n\n private formRef = React.createRef<FormInstance>(); // 注意类型\n private _isMounted = false;\n private _initialValues = null;\n\n get isEdit() {\n const { params } = this.props;\n return Boolean(params?.id);\n }\n\n get canSave() {\n const { touched, loading } = this.state;\n if (!this.isEdit) return !loading;\n return touched && !loading;\n }\n\n get titleView() {\n const { title } = this.props;\n const _title = title || (this.isEdit ? this.t('update_title') : this.t('create_title'));\n return (\n <Space>\n {_title}\n <span>{this.touchedView}</span>\n </Space>\n );\n }\n\n get touchedView() {\n if (!this.isEdit) return null;\n return this.state.touched ? (\n <em style={{ color: '#f60' }}>\n <DiffOutlined />\n </em>\n ) : null;\n }\n\n get extraView() {\n const { extra, backText, backProps } = this.props;\n if (extra) return extra;\n return (\n <Button size=\"small\" icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n );\n }\n\n get childrenView() {\n const { okText, backText, okProps, backProps, children } = this.props;\n const _okText = okText || (this.isEdit ? this.t('update') : this.t('create'));\n if (children) return children;\n\n return (\n <Space>\n <Button\n disabled={!this.canSave}\n htmlType=\"submit\"\n type=\"primary\"\n icon={<SaveOutlined />}\n {...okProps}>\n {_okText || this.t('submit')}\n </Button>\n <Button icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n </Space>\n );\n }\n\n get formInstance() {\n return this.formRef?.current;\n }\n\n constructor(props: ReactAntResourceFormProps) {\n super(props);\n this.state = {\n loading: false,\n touched: false,\n };\n\n this.handleStateRequest = this.handleStateRequest.bind(this);\n this.handleStateResponse = this.handleStateResponse.bind(this);\n this.initDetailIfNeeded = this.initDetailIfNeeded.bind(this);\n\n props.onInit?.(this);\n }\n\n private t(key: string) {\n const { lang } = this.props;\n return API_FORM_LOCALES[lang!][key];\n }\n\n private handleBack = () => {\n history.back();\n };\n\n private setInitialValues = (values?: any) => {\n this._initialValues = values || this.formInstance?.getFieldsValue() || {};\n };\n\n handleStateRequest(stagePayload: StagePayload) {\n this.setState({ loading: true });\n return this.props.transformRequest?.(stagePayload) || stagePayload.payload;\n }\n\n handleStateResponse(res: StageData) {\n const { name } = this.props;\n this.setState({ loading: false });\n nx.$event?.emit?.(`${name}:refetch`);\n return this.props.transformResponse?.(res) || res.data;\n }\n\n handleFinish = (values: any) => {\n const { params, name } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n message.success(this.t('update_success'));\n this.handleStateResponse({ stage: 'update', data: res });\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n this.handleValuesChange(null, this._initialValues);\n });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n message.success(this.t('create_success'));\n this.handleStateResponse({ stage: 'create', data: res });\n this.formInstance?.resetFields();\n history.back();\n })\n .finally(() => this.setState({ loading: false }));\n }\n };\n\n // hotkey save handler (replaces useKeyboardSave hook)\n handleKeydown = (e: KeyboardEvent) => {\n const { disableHotkeySave } = this.props;\n const isSave = (e.ctrlKey || e.metaKey) && (e.key === 's' || e.key === 'S');\n if (isSave) {\n e.preventDefault();\n if (!disableHotkeySave) {\n this.formInstance?.submit();\n }\n }\n };\n\n handleValuesChange = (_: any, allValues: any) => {\n this.setState({\n touched: !deepEqual(this._initialValues, allValues),\n });\n };\n\n componentDidMount() {\n this._isMounted = true;\n // attach hotkey listener\n window.addEventListener('keydown', this.handleKeydown);\n // initialize detail if editing\n this.initDetailIfNeeded();\n }\n\n componentDidUpdate(prevProps: ReactAntResourceFormProps) {\n const prevId = prevProps.params?.id;\n const curId = this.props.params?.id;\n // re-init when id changed or from create -> edit\n if (prevId !== curId) {\n this.initDetailIfNeeded();\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name } = this.props;\n const resourceShow = `${name}_show`;\n\n if (this.isEdit) {\n const payload = { id: params!.id };\n const _payload = this.handleStateRequest({ stage: 'show', payload });\n\n nx.$api[resourceShow](_payload)\n .then((res: any) => {\n if (!this._isMounted) return; // 👈 关键：防止操作已卸载组件\n const data = this.handleStateResponse({ stage: 'show', data: res });\n this.formInstance?.setFieldsValue?.(data);\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n });\n } else {\n this.setInitialValues();\n }\n }\n\n render() {\n const {\n className,\n name,\n meta,\n children,\n lang,\n title,\n extra,\n size,\n okText,\n backText,\n okProps,\n backProps,\n classNames,\n params,\n transformRequest,\n transformResponse,\n disableHotkeySave,\n blocker,\n onInit,\n ...rest\n } = this.props;\n\n return (\n <Card\n title={this.titleView}\n extra={this.extraView}\n size={size}\n classNames={classNames}\n data-component={CLASS_NAME}\n data-blocker={blocker}\n className={cx(CLASS_NAME, className)}>\n <Spin spinning={this.state.loading}>\n <ReactAntdFormSchema\n meta={meta}\n ref={this.formRef}\n onValuesChange={this.handleValuesChange}\n onFinish={this.handleFinish}\n {...rest}>\n {this.childrenView}\n </ReactAntdFormSchema>\n </Spin>\n </Card>\n );\n }\n}\n\nconst ReactAntResourceFormFc: FC<ReactAntResourceFormProps> = (props) => {\n const params = useParams();\n return <ReactAntResourceForm params={params} {...props} />;\n};\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\n","export const API_FORM_LOCALES = {\n 'zh-CN': {\n create: '创建',\n update: '保存',\n create_title: '创建',\n update_title: '更新',\n create_success: '创建成功',\n update_success: '更新成功',\n submit: '提交',\n back: '返回',\n },\n 'en-US': {\n create: 'Create',\n update: 'Save',\n create_title: 'Create',\n update_title: 'Update',\n create_success: 'Create success',\n update_success: 'Update success',\n submit: 'Submit',\n back: 'Back',\n },\n};\n"]}
|
package/dist/main.d.mts
CHANGED
|
@@ -23,6 +23,7 @@ type ReactAntResourceFormProps = {
|
|
|
23
23
|
okText?: string;
|
|
24
24
|
backText?: string;
|
|
25
25
|
params?: Record<string, any>;
|
|
26
|
+
blocker?: boolean;
|
|
26
27
|
disableHotkeySave?: boolean;
|
|
27
28
|
transformRequest?: (payload: StagePayload) => any;
|
|
28
29
|
transformResponse?: (res: StageData) => any;
|
package/dist/main.d.ts
CHANGED
|
@@ -23,6 +23,7 @@ type ReactAntResourceFormProps = {
|
|
|
23
23
|
okText?: string;
|
|
24
24
|
backText?: string;
|
|
25
25
|
params?: Record<string, any>;
|
|
26
|
+
blocker?: boolean;
|
|
26
27
|
disableHotkeySave?: boolean;
|
|
27
28
|
transformRequest?: (payload: StagePayload) => any;
|
|
28
29
|
transformResponse?: (res: StageData) => any;
|
package/dist/main.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var E=Object.defineProperty;var S=Object.getOwnPropertySymbols;var
|
|
1
|
+
var E=Object.defineProperty;var S=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var k=(a,s,e)=>s in a?E(a,s,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[s]=e,d=(a,s)=>{for(var e in s||(s={}))b.call(s,e)&&k(a,e,s[e]);if(S)for(var e of S(s))y.call(s,e)&&k(a,e,s[e]);return a};var u=(a,s)=>E(a,"name",{value:s,configurable:!0});var w=(a,s)=>{var e={};for(var t in a)b.call(a,t)&&s.indexOf(t)<0&&(e[t]=a[t]);if(a!=null&&S)for(var t of S(a))s.indexOf(t)<0&&y.call(a,t)&&(e[t]=a[t]);return e};var h=(a,s,e)=>k(a,typeof s!="symbol"?s+"":s,e);import L from"classnames";import n,{Component as M}from"react";import{Button as R,Card as P,Space as I,message as x,Spin as $}from"antd";import O from"@jswork/react-ant-form-schema";import{ArrowLeftOutlined as C,DiffOutlined as T,SaveOutlined as B}from"@ant-design/icons";var V={"zh-CN":{create:"\u521B\u5EFA",update:"\u4FDD\u5B58",create_title:"\u521B\u5EFA",update_title:"\u66F4\u65B0",create_success:"\u521B\u5EFA\u6210\u529F",update_success:"\u66F4\u65B0\u6210\u529F",submit:"\u63D0\u4EA4",back:"\u8FD4\u56DE"},"en-US":{create:"Create",update:"Save",create_title:"Create",update_title:"Update",create_success:"Create success",update_success:"Update success",submit:"Submit",back:"Back"}};import _ from"@jswork/next";import{useParams as z}from"react-router-dom";import K from"fast-deep-equal";var F="react-ant-resource-form",p,v=(p=class extends M{constructor(e){var t;super(e);h(this,"formRef",n.createRef());h(this,"_isMounted",!1);h(this,"_initialValues",null);h(this,"handleBack",u(()=>{history.back()},"handleBack"));h(this,"setInitialValues",u(e=>{var t;this._initialValues=e||((t=this.formInstance)==null?void 0:t.getFieldsValue())||{}},"setInitialValues"));h(this,"handleFinish",u(e=>{let{params:t,name:i}=this.props,r=`${i}_update`,o=`${i}_create`;if(this.isEdit){let l=d({id:t.id},e),m=this.handleStateRequest({stage:"update",payload:l});_.$api[r](m).then(c=>{x.success(this.t("update_success")),this.handleStateResponse({stage:"update",data:c})}).finally(()=>{this.setState({loading:!1}),this.setInitialValues(),this.handleValuesChange(null,this._initialValues)})}else{let l=d({},e),m=this.handleStateRequest({stage:"create",payload:l});_.$api[o](m).then(c=>{var f;x.success(this.t("create_success")),this.handleStateResponse({stage:"create",data:c}),(f=this.formInstance)==null||f.resetFields(),history.back()}).finally(()=>this.setState({loading:!1}))}},"handleFinish"));h(this,"handleKeydown",u(e=>{var r;let{disableHotkeySave:t}=this.props;(e.ctrlKey||e.metaKey)&&(e.key==="s"||e.key==="S")&&(e.preventDefault(),t||(r=this.formInstance)==null||r.submit())},"handleKeydown"));h(this,"handleValuesChange",u((e,t)=>{this.setState({touched:!K(this._initialValues,t)})},"handleValuesChange"));this.state={loading:!1,touched:!1},this.handleStateRequest=this.handleStateRequest.bind(this),this.handleStateResponse=this.handleStateResponse.bind(this),this.initDetailIfNeeded=this.initDetailIfNeeded.bind(this),(t=e.onInit)==null||t.call(e,this)}get isEdit(){let{params:e}=this.props;return!!(e!=null&&e.id)}get canSave(){let{touched:e,loading:t}=this.state;return this.isEdit?e&&!t:!t}get titleView(){let{title:e}=this.props,t=e||(this.isEdit?this.t("update_title"):this.t("create_title"));return n.createElement(I,null,t,n.createElement("span",null,this.touchedView))}get touchedView(){return this.isEdit&&this.state.touched?n.createElement("em",{style:{color:"#f60"}},n.createElement(T,null)):null}get extraView(){let{extra:e,backText:t,backProps:i}=this.props;return e||n.createElement(R,d({size:"small",icon:n.createElement(C,null),onClick:this.handleBack},i),t||this.t("back"))}get childrenView(){let{okText:e,backText:t,okProps:i,backProps:r,children:o}=this.props,l=e||(this.isEdit?this.t("update"):this.t("create"));return o||n.createElement(I,null,n.createElement(R,d({disabled:!this.canSave,htmlType:"submit",type:"primary",icon:n.createElement(B,null)},i),l||this.t("submit")),n.createElement(R,d({icon:n.createElement(C,null),onClick:this.handleBack},r),t||this.t("back")))}get formInstance(){var e;return(e=this.formRef)==null?void 0:e.current}t(e){let{lang:t}=this.props;return V[t][e]}handleStateRequest(e){var t,i;return this.setState({loading:!0}),((i=(t=this.props).transformRequest)==null?void 0:i.call(t,e))||e.payload}handleStateResponse(e){var i,r,o,l;let{name:t}=this.props;return this.setState({loading:!1}),(r=(i=_.$event)==null?void 0:i.emit)==null||r.call(i,`${t}:refetch`),((l=(o=this.props).transformResponse)==null?void 0:l.call(o,e))||e.data}componentDidMount(){this._isMounted=!0,window.addEventListener("keydown",this.handleKeydown),this.initDetailIfNeeded()}componentDidUpdate(e){var r,o;let t=(r=e.params)==null?void 0:r.id,i=(o=this.props.params)==null?void 0:o.id;t!==i&&this.initDetailIfNeeded()}componentWillUnmount(){window.removeEventListener("keydown",this.handleKeydown),this._isMounted=!1}initDetailIfNeeded(){let{params:e,name:t}=this.props,i=`${t}_show`;if(this.isEdit){let r={id:e.id},o=this.handleStateRequest({stage:"show",payload:r});_.$api[i](o).then(l=>{var c,f;if(!this._isMounted)return;let m=this.handleStateResponse({stage:"show",data:l});(f=(c=this.formInstance)==null?void 0:c.setFieldsValue)==null||f.call(c,m)}).finally(()=>{this.setState({loading:!1}),this.setInitialValues()})}else this.setInitialValues()}render(){let g=this.props,{className:e,name:t,meta:i,children:r,lang:o,title:l,extra:m,size:c,okText:f,backText:H,okProps:W,backProps:j,classNames:N,params:G,transformRequest:J,transformResponse:Q,disableHotkeySave:X,blocker:q,onInit:Y}=g,D=w(g,["className","name","meta","children","lang","title","extra","size","okText","backText","okProps","backProps","classNames","params","transformRequest","transformResponse","disableHotkeySave","blocker","onInit"]);return n.createElement(P,{title:this.titleView,extra:this.extraView,size:c,classNames:N,"data-component":F,"data-blocker":q,className:L(F,e)},n.createElement($,{spinning:this.state.loading},n.createElement(O,d({meta:i,ref:this.formRef,onValuesChange:this.handleValuesChange,onFinish:this.handleFinish},D),this.childrenView)))}},u(p,"ReactAntResourceForm"),h(p,"defaultProps",{lang:"zh-CN",disableHotkeySave:!1}),p),U=u(a=>{let s=z();return n.createElement(v,d({params:s},a))},"ReactAntResourceFormFc"),A=v;var pe=A;export{U as ReactAntResourceFormFc,pe as default};
|
|
2
2
|
//# sourceMappingURL=main.esm.js.map
|
package/dist/main.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.tsx","../src/locales.ts","../src/main.tsx"],"sourcesContent":["// import noop from '@jswork/noop';\nimport cx from 'classnames';\nimport React, { Component, FC } from 'react';\nimport { Button, ButtonProps, Card, CardProps, Space, message, Spin } from 'antd';\nimport type { FormInstance } from 'antd';\nimport ReactAntdFormSchema, { ReactAntdFormSchemaProps } from '@jswork/react-ant-form-schema';\nimport { ArrowLeftOutlined, DiffOutlined, SaveOutlined } from '@ant-design/icons';\nimport { API_FORM_LOCALES } from './locales';\nimport nx from '@jswork/next';\nimport { useParams } from 'react-router-dom';\nimport deepEqual from 'fast-deep-equal';\n\ndeclare global {\n interface NxStatic {\n $api: Record<string, any>;\n $event: any;\n }\n}\n\ntype StagePayload = {\n stage: 'show' | 'create' | 'update';\n payload: any;\n};\n\ntype StageData = {\n stage: 'show' | 'create' | 'update';\n data: any;\n};\n\nexport type ReactAntResourceFormProps = {\n lang?: string;\n loading?: boolean;\n okText?: string;\n backText?: string;\n params?: Record<string, any>;\n disableHotkeySave?: boolean;\n transformRequest?: (payload: StagePayload) => any;\n transformResponse?: (res: StageData) => any;\n okProps?: ButtonProps;\n backProps?: ButtonProps;\n classNames?: CardProps['classNames'];\n size?: CardProps['size'];\n extra?: CardProps['extra'];\n title?: CardProps['title'];\n onInit?: (ctx: ReactAntResourceForm) => void;\n} & ReactAntdFormSchemaProps;\n\ntype IState = {\n loading: boolean;\n touched: boolean;\n};\n\nconst CLASS_NAME = 'react-ant-resource-form';\n\n/**\n * 当前 card loading 不要直接使用，因为这个 loading 会导致 Card 里的 formRef 被设置成 null\n * 这个情况仅在 class component 里才会出现，function component 里不会：\n * 报错示例:\n *\n * this.formRef?: null\n * index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}\n * index.tsx:229 this.formRef?: null\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n };\n\n private formRef = React.createRef<FormInstance>(); // 注意类型\n private _isMounted = false;\n private _initialValues = null;\n\n get isEdit() {\n const { params } = this.props;\n return Boolean(params?.id);\n }\n\n get canSave() {\n const { touched, loading } = this.state;\n if (!this.isEdit) return loading === false;\n return touched === true && loading === false;\n }\n\n get titleView() {\n const { title } = this.props;\n const _title = title || (this.isEdit ? this.t('update_title') : this.t('create_title'));\n return (\n <Space>\n {_title}\n <span>{this.touchedView}</span>\n </Space>\n );\n }\n\n get touchedView() {\n if (!this.isEdit) return null;\n return this.state.touched ? (\n <em style={{ color: '#f60' }}>\n <DiffOutlined />\n </em>\n ) : null;\n }\n\n get extraView() {\n const { extra, backText, backProps } = this.props;\n if (extra) return extra;\n return (\n <Button size=\"small\" icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n );\n }\n\n get childrenView() {\n const { okText, backText, okProps, backProps, children } = this.props;\n const _okText = okText || (this.isEdit ? this.t('update') : this.t('create'));\n if (children) return children;\n\n return (\n <Space>\n <Button\n disabled={!this.canSave}\n htmlType=\"submit\"\n type=\"primary\"\n icon={<SaveOutlined />}\n {...okProps}>\n {_okText || this.t('submit')}\n </Button>\n <Button icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n </Space>\n );\n }\n\n get formInstance() {\n return this.formRef?.current;\n }\n\n constructor(props: ReactAntResourceFormProps) {\n super(props);\n this.state = {\n loading: false,\n touched: false,\n };\n\n this.handleStateRequest = this.handleStateRequest.bind(this);\n this.handleStateResponse = this.handleStateResponse.bind(this);\n this.initDetailIfNeeded = this.initDetailIfNeeded.bind(this);\n\n props.onInit?.(this);\n }\n\n private t(key: string) {\n const { lang } = this.props;\n return API_FORM_LOCALES[lang!][key];\n }\n\n private handleBack = () => {\n history.back();\n };\n\n private setInitialValues = (values?: any) => {\n this._initialValues = values || this.formInstance?.getFieldsValue() || {};\n };\n\n handleStateRequest(stagePayload: StagePayload) {\n this.setState({ loading: true });\n return this.props.transformRequest?.(stagePayload) || stagePayload.payload;\n }\n\n handleStateResponse(res: StageData) {\n const { name } = this.props;\n this.setState({ loading: false });\n nx.$event?.emit?.(`${name}:refetch`);\n return this.props.transformResponse?.(res) || res.data;\n }\n\n handleFinish = (values: any) => {\n const { params, name } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n message.success(this.t('update_success'));\n this.handleStateResponse({ stage: 'update', data: res });\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n this.handleValuesChange(null, this._initialValues);\n });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n message.success(this.t('create_success'));\n this.handleStateResponse({ stage: 'create', data: res });\n this.formInstance?.resetFields();\n history.back();\n })\n .finally(() => this.setState({ loading: false }));\n }\n };\n\n // hotkey save handler (replaces useKeyboardSave hook)\n handleKeydown = (e: KeyboardEvent) => {\n const { disableHotkeySave } = this.props;\n const isSave = (e.ctrlKey || e.metaKey) && (e.key === 's' || e.key === 'S');\n if (isSave) {\n e.preventDefault();\n if (!disableHotkeySave) {\n this.formInstance?.submit();\n }\n }\n };\n\n handleValuesChange = (_: any, allValues: any) => {\n this.setState({\n touched: deepEqual(this._initialValues, allValues) === false,\n });\n };\n\n componentDidMount() {\n this._isMounted = true;\n // attach hotkey listener\n window.addEventListener('keydown', this.handleKeydown);\n // initialize detail if editing\n this.initDetailIfNeeded();\n }\n\n componentDidUpdate(prevProps: ReactAntResourceFormProps) {\n const prevId = prevProps.params?.id;\n const curId = this.props.params?.id;\n // re-init when id changed or from create -> edit\n if (prevId !== curId) {\n this.initDetailIfNeeded();\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name } = this.props;\n const resourceShow = `${name}_show`;\n\n if (this.isEdit) {\n const payload = { id: params!.id };\n const _payload = this.handleStateRequest({ stage: 'show', payload });\n\n nx.$api[resourceShow](_payload)\n .then((res: any) => {\n if (!this._isMounted) return; // 👈 关键：防止操作已卸载组件\n const data = this.handleStateResponse({ stage: 'show', data: res });\n this.formInstance?.setFieldsValue?.(data);\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n });\n } else {\n this.setInitialValues();\n }\n }\n\n render() {\n const {\n className,\n name,\n meta,\n children,\n lang,\n title,\n extra,\n size,\n okText,\n backText,\n okProps,\n backProps,\n classNames,\n params,\n transformRequest,\n transformResponse,\n disableHotkeySave,\n onInit,\n ...rest\n } = this.props;\n\n return (\n <Card\n title={this.titleView}\n extra={this.extraView}\n size={size}\n classNames={classNames}\n data-component={CLASS_NAME}\n className={cx(CLASS_NAME, className)}>\n <Spin spinning={this.state.loading}>\n <ReactAntdFormSchema\n meta={meta}\n ref={this.formRef}\n onValuesChange={this.handleValuesChange}\n onFinish={this.handleFinish}\n {...rest}>\n {this.childrenView}\n </ReactAntdFormSchema>\n </Spin>\n </Card>\n );\n }\n}\n\nconst ReactAntResourceFormFc: FC<ReactAntResourceFormProps> = (props) => {\n const params = useParams();\n return <ReactAntResourceForm params={params} {...props} />;\n};\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\n","export const API_FORM_LOCALES = {\n 'zh-CN': {\n create: '创建',\n update: '保存',\n create_title: '创建',\n update_title: '更新',\n create_success: '创建成功',\n update_success: '更新成功',\n submit: '提交',\n back: '返回',\n },\n 'en-US': {\n create: 'Create',\n update: 'Save',\n create_title: 'Create',\n update_title: 'Update',\n create_success: 'Create success',\n update_success: 'Update success',\n submit: 'Submit',\n back: 'Back',\n },\n};\n","import ReactAntResourceForm, { ReactAntResourceFormFc } from '.';\nimport type { ReactAntResourceFormProps } from '.';\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\nexport type { ReactAntResourceFormProps };\n"],"mappings":"8lBACA,OAAOA,MAAQ,aACf,OAAOC,GAASC,aAAAA,MAAqB,QACrC,OAASC,UAAAA,EAAqBC,QAAAA,EAAiBC,SAAAA,EAAOC,WAAAA,EAASC,QAAAA,MAAY,OAE3E,OAAOC,MAAuD,gCAC9D,OAASC,qBAAAA,EAAmBC,gBAAAA,EAAcC,gBAAAA,MAAoB,oBCNvD,IAAMC,EAAmB,CAC9B,QAAS,CACPC,OAAQ,eACRC,OAAQ,eACRC,aAAc,eACdC,aAAc,eACdC,eAAgB,2BAChBC,eAAgB,2BAChBC,OAAQ,eACRC,KAAM,cACR,EACA,QAAS,CACPP,OAAQ,SACRC,OAAQ,OACRC,aAAc,SACdC,aAAc,SACdC,eAAgB,iBAChBC,eAAgB,iBAChBC,OAAQ,SACRC,KAAM,MACR,CACF,EDbA,OAAOC,MAAQ,eACf,OAASC,aAAAA,MAAiB,mBAC1B,OAAOC,MAAe,kBA0CtB,IAAMC,EAAa,0BApDnBC,EAgEMC,GAAND,EAAA,cAAmCE,CAAAA,CA6EjC,YAAYC,EAAkC,CA7IhD,IAAAH,EA8II,MAAMG,CAAAA,EAxEAC,EAAAA,eAAUC,EAAMC,UAAS,GACzBC,EAAAA,kBAAa,IACbC,EAAAA,sBAAiB,MAwFjBC,EAAAA,kBAAaC,EAAA,IAAA,CACnBC,QAAQC,KAAI,CACd,EAFqB,eAIbC,EAAAA,wBAAmBH,EAACI,GAAAA,CApK9B,IAAAd,EAqKI,KAAKQ,eAAiBM,KAAUd,EAAA,KAAKe,eAAL,YAAAf,EAAmBgB,mBAAoB,CAAC,CAC1E,EAF2B,qBAgB3BC,EAAAA,oBAAeP,EAACI,GAAAA,CACd,GAAM,CAAEI,OAAAA,EAAQC,KAAAA,CAAI,EAAK,KAAKhB,MACxBiB,EAAe,GAAGD,CAAAA,UAClBE,EAAiB,GAAGF,CAAAA,UAE1B,GAAI,KAAKG,OAAQ,CACf,IAAMC,EAAUC,EAAA,CAAEC,GAAIP,EAAQO,IAAOX,GAC/BY,EAAW,KAAKC,mBAAmB,CAAEC,MAAO,SAAUL,QAAAA,CAAQ,CAAA,EAEpEM,EAAGC,KAAKV,CAAAA,EAAcM,CAAAA,EACnBK,KAAMC,GAAAA,CACLC,EAAQC,QAAQ,KAAKC,EAAE,gBAAA,CAAA,EACvB,KAAKC,oBAAoB,CAAER,MAAO,SAAUS,KAAML,CAAI,CAAA,CACxD,CAAA,EACCM,QAAQ,IAAA,CACP,KAAKC,SAAS,CAAEC,QAAS,EAAM,CAAA,EAC/B,KAAK3B,iBAAgB,EACrB,KAAK4B,mBAAmB,KAAM,KAAKjC,cAAc,CACnD,CAAA,CACJ,KAAO,CACL,IAAMe,EAAUC,EAAA,GAAKV,GACfY,EAAW,KAAKC,mBAAmB,CAAEC,MAAO,SAAUL,QAAAA,CAAQ,CAAA,EAEpEM,EAAGC,KAAKT,CAAAA,EAAgBK,CAAAA,EACrBK,KAAMC,GAAAA,CA5Mf,IAAAhC,EA6MUiC,EAAQC,QAAQ,KAAKC,EAAE,gBAAA,CAAA,EACvB,KAAKC,oBAAoB,CAAER,MAAO,SAAUS,KAAML,CAAI,CAAA,GACtDhC,EAAA,KAAKe,eAAL,MAAAf,EAAmB0C,cACnB/B,QAAQC,KAAI,CACd,CAAA,EACC0B,QAAQ,IAAM,KAAKC,SAAS,CAAEC,QAAS,EAAM,CAAA,CAAA,CAClD,CACF,EAhCe,iBAmCfG,EAAAA,qBAAgBjC,EAACkC,GAAAA,CAvNnB,IAAA5C,EAwNI,GAAM,CAAE6C,kBAAAA,CAAiB,EAAK,KAAK1C,OACnByC,EAAEE,SAAWF,EAAEG,WAAaH,EAAEI,MAAQ,KAAOJ,EAAEI,MAAQ,OAErEJ,EAAEK,eAAc,EACXJ,IACH7C,EAAA,KAAKe,eAAL,MAAAf,EAAmBkD,SAGzB,EATgB,kBAWhBT,EAAAA,0BAAqB/B,EAAA,CAACyC,EAAQC,IAAAA,CAC5B,KAAKb,SAAS,CACZc,QAASC,EAAU,KAAK9C,eAAgB4C,CAAAA,IAAe,EACzD,CAAA,CACF,EAJqB,uBAnFnB,KAAKG,MAAQ,CACXf,QAAS,GACTa,QAAS,EACX,EAEA,KAAK1B,mBAAqB,KAAKA,mBAAmB6B,KAAK,IAAI,EAC3D,KAAKpB,oBAAsB,KAAKA,oBAAoBoB,KAAK,IAAI,EAC7D,KAAKC,mBAAqB,KAAKA,mBAAmBD,KAAK,IAAI,GAE3DrD,EAAAA,EAAMuD,SAANvD,MAAAA,EAAAA,KAAAA,EAAe,KACjB,CA/EA,IAAImB,QAAS,CACX,GAAM,CAAEJ,OAAAA,CAAM,EAAK,KAAKf,MACxB,MAAOwD,GAAQzC,GAAAA,MAAAA,EAAQO,GACzB,CAEA,IAAImC,SAAU,CACZ,GAAM,CAAEP,QAAAA,EAASb,QAAAA,CAAO,EAAK,KAAKe,MAClC,OAAK,KAAKjC,OACH+B,IAAY,IAAQb,IAAY,GADdA,IAAY,EAEvC,CAEA,IAAIqB,WAAY,CACd,GAAM,CAAEC,MAAAA,CAAK,EAAK,KAAK3D,MACjB4D,EAASD,IAAU,KAAKxC,OAAS,KAAKa,EAAE,cAAA,EAAkB,KAAKA,EAAE,cAAA,GACvE,OACE9B,EAAA,cAAC2D,EAAAA,KACED,EACD1D,EAAA,cAAC4D,OAAAA,KAAM,KAAKC,WAAW,CAAA,CAG7B,CAEA,IAAIA,aAAc,CAChB,OAAK,KAAK5C,QACH,KAAKiC,MAAMF,QAChBhD,EAAA,cAAC8D,KAAAA,CAAGC,MAAO,CAAEC,MAAO,MAAO,GACzBhE,EAAA,cAACiE,EAAAA,IAAAA,CAAAA,EAHoB,IAM3B,CAEA,IAAIC,WAAY,CACd,GAAM,CAAEC,MAAAA,EAAOC,SAAAA,EAAUC,UAAAA,CAAS,EAAK,KAAKvE,MAC5C,OAAIqE,GAEFnE,EAAA,cAACsE,EAAAA,EAAAA,CAAOC,KAAK,QAAQC,KAAMxE,EAAA,cAACyE,EAAAA,IAAAA,EAAsBC,QAAS,KAAKtE,YAAgBiE,GAC7ED,GAAY,KAAKtC,EAAE,MAAA,CAAA,CAG1B,CAEA,IAAI6C,cAAe,CACjB,GAAM,CAAEC,OAAAA,EAAQR,SAAAA,EAAUS,QAAAA,EAASR,UAAAA,EAAWS,SAAAA,CAAQ,EAAK,KAAKhF,MAC1DiF,EAAUH,IAAW,KAAK3D,OAAS,KAAKa,EAAE,QAAA,EAAY,KAAKA,EAAE,QAAA,GACnE,OAAIgD,GAGF9E,EAAA,cAAC2D,EAAAA,KACC3D,EAAA,cAACsE,EAAAA,EAAAA,CACCU,SAAU,CAAC,KAAKzB,QAChB0B,SAAS,SACTC,KAAK,UACLV,KAAMxE,EAAA,cAACmF,EAAAA,IAAAA,GACHN,GACHE,GAAW,KAAKjD,EAAE,QAAA,CAAA,EAErB9B,EAAA,cAACsE,EAAAA,EAAAA,CAAOE,KAAMxE,EAAA,cAACyE,EAAAA,IAAAA,EAAsBC,QAAS,KAAKtE,YAAgBiE,GAChED,GAAY,KAAKtC,EAAE,MAAA,CAAA,CAAA,CAI5B,CAEA,IAAIpB,cAAe,CAzIrB,IAAAf,EA0II,OAAOA,EAAA,KAAKI,UAAL,YAAAJ,EAAcyF,OACvB,CAgBQtD,EAAEa,EAAa,CACrB,GAAM,CAAE0C,KAAAA,CAAI,EAAK,KAAKvF,MACtB,OAAOwF,EAAiBD,CAAAA,EAAO1C,CAAAA,CACjC,CAUArB,mBAAmBiE,EAA4B,CAxKjD,IAAA5F,EAAA6F,EAyKI,YAAKtD,SAAS,CAAEC,QAAS,EAAK,CAAA,IACvBqD,GAAA7F,EAAA,KAAKG,OAAM2F,mBAAX,YAAAD,EAAA,KAAA7F,EAA8B4F,KAAiBA,EAAarE,OACrE,CAEAa,oBAAoBJ,EAAgB,CA7KtC,IAAAhC,EAAA6F,EAAAE,EAAAC,EA8KI,GAAM,CAAE7E,KAAAA,CAAI,EAAK,KAAKhB,MACtB,YAAKoC,SAAS,CAAEC,QAAS,EAAM,CAAA,GAC/BX,GAAAA,EAAAA,EAAGoE,SAAHpE,YAAAA,EAAWqE,OAAXrE,MAAAA,EAAAA,KAAAA,EAAkB,GAAGV,CAAAA,cACd6E,GAAAD,EAAA,KAAK5F,OAAMgG,oBAAX,YAAAH,EAAA,KAAAD,EAA+B/D,KAAQA,EAAIK,IACpD,CAsDA+D,mBAAoB,CAClB,KAAK7F,WAAa,GAElB8F,OAAOC,iBAAiB,UAAW,KAAK3D,aAAa,EAErD,KAAKc,mBAAkB,CACzB,CAEA8C,mBAAmBC,EAAsC,CAhP3D,IAAAxG,EAAA6F,EAiPI,IAAMY,GAASD,EAAAA,EAAUtF,SAAVsF,YAAAA,EAAkB/E,GAC3BiF,GAAQb,EAAA,KAAK1F,MAAMe,SAAX,YAAA2E,EAAmBpE,GAE7BgF,IAAWC,GACb,KAAKjD,mBAAkB,CAE3B,CAEAkD,sBAAuB,CACrBN,OAAOO,oBAAoB,UAAW,KAAKjE,aAAa,EACxD,KAAKpC,WAAa,EACpB,CAEAkD,oBAAqB,CACnB,GAAM,CAAEvC,OAAAA,EAAQC,KAAAA,CAAI,EAAK,KAAKhB,MACxB0G,EAAe,GAAG1F,CAAAA,QAExB,GAAI,KAAKG,OAAQ,CACf,IAAMC,EAAU,CAAEE,GAAIP,EAAQO,EAAG,EAC3BC,EAAW,KAAKC,mBAAmB,CAAEC,MAAO,OAAQL,QAAAA,CAAQ,CAAA,EAElEM,EAAGC,KAAK+E,CAAAA,EAAcnF,CAAAA,EACnBK,KAAMC,GAAAA,CAvQf,IAAAhC,EAAA6F,EAwQU,GAAI,CAAC,KAAKtF,WAAY,OACtB,IAAM8B,EAAO,KAAKD,oBAAoB,CAAER,MAAO,OAAQS,KAAML,CAAI,CAAA,GACjE6D,GAAA7F,EAAA,KAAKe,eAAL,YAAAf,EAAmB8G,iBAAnB,MAAAjB,EAAA,KAAA7F,EAAoCqC,EACtC,CAAA,EACCC,QAAQ,IAAA,CACP,KAAKC,SAAS,CAAEC,QAAS,EAAM,CAAA,EAC/B,KAAK3B,iBAAgB,CACvB,CAAA,CACJ,MACE,KAAKA,iBAAgB,CAEzB,CAEAkG,QAAS,CACP,IAoBI/G,EAAA,KAAKG,MAnBP6G,WAAAA,EACA7F,KAAAA,EACA8F,KAAAA,EACA9B,SAAAA,EACAO,KAAAA,EACA5B,MAAAA,EACAU,MAAAA,EACAI,KAAAA,EACAK,OAAAA,EACAR,SAAAA,EACAS,QAAAA,EACAR,UAAAA,EACAwC,WAAAA,EACAhG,OAAAA,EACA4E,iBAAAA,EACAK,kBAAAA,EACAtD,kBAAAA,EACAa,OAAAA,CAxSN,EA0SQ1D,EADCmH,EAAAA,EACDnH,EADCmH,CAlBHH,YACA7F,OACA8F,OACA9B,WACAO,OACA5B,QACAU,QACAI,OACAK,SACAR,WACAS,UACAR,YACAwC,aACAhG,SACA4E,mBACAK,oBACAtD,oBACAa,WAIF,OACErD,EAAA,cAAC+G,EAAAA,CACCtD,MAAO,KAAKD,UACZW,MAAO,KAAKD,UACZK,KAAMA,EACNsC,WAAYA,EACZG,iBAAgBtH,EAChBiH,UAAWM,EAAGvH,EAAYiH,CAAAA,GAC1B3G,EAAA,cAACkH,EAAAA,CAAKC,SAAU,KAAKjE,MAAMf,SACzBnC,EAAA,cAACoH,EAAAA,EAAAA,CACCR,KAAMA,EACNS,IAAK,KAAKtH,QACVuH,eAAgB,KAAKlF,mBACrBmF,SAAU,KAAK3G,cACXkG,GACH,KAAKnC,YAAY,CAAA,CAAA,CAK5B,CACF,EAjQmC9E,EAAAA,EAAAA,wBACjC2H,EADF7H,EACgB8H,eAAe,CAC3BpC,KAAM,QACN7C,kBAAmB,EACrB,GAJF7C,GAmQM+H,EAAwDrH,EAACP,GAAAA,CAC7D,IAAMe,EAAS8G,EAAAA,EACf,OAAO3H,EAAA,cAACJ,EAAAA,EAAAA,CAAqBiB,OAAQA,GAAYf,GACnD,EAH8D,0BAK9D8H,EAAehI,EErUf,IAAAiI,GAAeC","names":["cx","React","Component","Button","Card","Space","message","Spin","ReactAntdFormSchema","ArrowLeftOutlined","DiffOutlined","SaveOutlined","API_FORM_LOCALES","create","update","create_title","update_title","create_success","update_success","submit","back","nx","useParams","deepEqual","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","back","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","resourceEdit","resourceCreate","isEdit","payload","__spreadValues","id","_payload","handleStateRequest","stage","nx","$api","then","res","message","success","t","handleStateResponse","data","finally","setState","loading","handleValuesChange","resetFields","handleKeydown","e","disableHotkeySave","ctrlKey","metaKey","key","preventDefault","submit","_","allValues","touched","deepEqual","state","bind","initDetailIfNeeded","onInit","Boolean","canSave","titleView","title","_title","Space","span","touchedView","em","style","color","DiffOutlined","extraView","extra","backText","backProps","Button","size","icon","ArrowLeftOutlined","onClick","childrenView","okText","okProps","children","_okText","disabled","htmlType","type","SaveOutlined","current","lang","API_FORM_LOCALES","stagePayload","_b","transformRequest","_c","_d","$event","emit","transformResponse","componentDidMount","window","addEventListener","componentDidUpdate","prevProps","prevId","curId","componentWillUnmount","removeEventListener","resourceShow","setFieldsValue","render","className","meta","classNames","rest","Card","data-component","cx","Spin","spinning","ReactAntdFormSchema","ref","onValuesChange","onFinish","__publicField","defaultProps","ReactAntResourceFormFc","useParams","index_default","main_default","ReactAntResourceForm"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.tsx","../src/locales.ts","../src/main.tsx"],"sourcesContent":["// import noop from '@jswork/noop';\nimport cx from 'classnames';\nimport React, { Component, FC } from 'react';\nimport { Button, ButtonProps, Card, CardProps, Space, message, Spin } from 'antd';\nimport type { FormInstance } from 'antd';\nimport ReactAntdFormSchema, { ReactAntdFormSchemaProps } from '@jswork/react-ant-form-schema';\nimport { ArrowLeftOutlined, DiffOutlined, SaveOutlined } from '@ant-design/icons';\nimport { API_FORM_LOCALES } from './locales';\nimport nx from '@jswork/next';\nimport { useParams } from 'react-router-dom';\nimport deepEqual from 'fast-deep-equal';\n\ndeclare global {\n interface NxStatic {\n $api: Record<string, any>;\n $event: any;\n }\n}\n\ntype StagePayload = {\n stage: 'show' | 'create' | 'update';\n payload: any;\n};\n\ntype StageData = {\n stage: 'show' | 'create' | 'update';\n data: any;\n};\n\nexport type ReactAntResourceFormProps = {\n lang?: string;\n loading?: boolean;\n okText?: string;\n backText?: string;\n params?: Record<string, any>;\n blocker?: boolean;\n disableHotkeySave?: boolean;\n transformRequest?: (payload: StagePayload) => any;\n transformResponse?: (res: StageData) => any;\n okProps?: ButtonProps;\n backProps?: ButtonProps;\n classNames?: CardProps['classNames'];\n size?: CardProps['size'];\n extra?: CardProps['extra'];\n title?: CardProps['title'];\n onInit?: (ctx: ReactAntResourceForm) => void;\n} & ReactAntdFormSchemaProps;\n\ntype IState = {\n loading: boolean;\n touched: boolean;\n};\n\nconst CLASS_NAME = 'react-ant-resource-form';\n\n/**\n * 当前 card loading 不要直接使用，因为这个 loading 会导致 Card 里的 formRef 被设置成 null\n * 这个情况仅在 class component 里才会出现，function component 里不会：\n * 报错示例:\n *\n * this.formRef?: null\n * index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}\n * index.tsx:229 this.formRef?: null\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n };\n\n private formRef = React.createRef<FormInstance>(); // 注意类型\n private _isMounted = false;\n private _initialValues = null;\n\n get isEdit() {\n const { params } = this.props;\n return Boolean(params?.id);\n }\n\n get canSave() {\n const { touched, loading } = this.state;\n if (!this.isEdit) return !loading;\n return touched && !loading;\n }\n\n get titleView() {\n const { title } = this.props;\n const _title = title || (this.isEdit ? this.t('update_title') : this.t('create_title'));\n return (\n <Space>\n {_title}\n <span>{this.touchedView}</span>\n </Space>\n );\n }\n\n get touchedView() {\n if (!this.isEdit) return null;\n return this.state.touched ? (\n <em style={{ color: '#f60' }}>\n <DiffOutlined />\n </em>\n ) : null;\n }\n\n get extraView() {\n const { extra, backText, backProps } = this.props;\n if (extra) return extra;\n return (\n <Button size=\"small\" icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n );\n }\n\n get childrenView() {\n const { okText, backText, okProps, backProps, children } = this.props;\n const _okText = okText || (this.isEdit ? this.t('update') : this.t('create'));\n if (children) return children;\n\n return (\n <Space>\n <Button\n disabled={!this.canSave}\n htmlType=\"submit\"\n type=\"primary\"\n icon={<SaveOutlined />}\n {...okProps}>\n {_okText || this.t('submit')}\n </Button>\n <Button icon={<ArrowLeftOutlined />} onClick={this.handleBack} {...backProps}>\n {backText || this.t('back')}\n </Button>\n </Space>\n );\n }\n\n get formInstance() {\n return this.formRef?.current;\n }\n\n constructor(props: ReactAntResourceFormProps) {\n super(props);\n this.state = {\n loading: false,\n touched: false,\n };\n\n this.handleStateRequest = this.handleStateRequest.bind(this);\n this.handleStateResponse = this.handleStateResponse.bind(this);\n this.initDetailIfNeeded = this.initDetailIfNeeded.bind(this);\n\n props.onInit?.(this);\n }\n\n private t(key: string) {\n const { lang } = this.props;\n return API_FORM_LOCALES[lang!][key];\n }\n\n private handleBack = () => {\n history.back();\n };\n\n private setInitialValues = (values?: any) => {\n this._initialValues = values || this.formInstance?.getFieldsValue() || {};\n };\n\n handleStateRequest(stagePayload: StagePayload) {\n this.setState({ loading: true });\n return this.props.transformRequest?.(stagePayload) || stagePayload.payload;\n }\n\n handleStateResponse(res: StageData) {\n const { name } = this.props;\n this.setState({ loading: false });\n nx.$event?.emit?.(`${name}:refetch`);\n return this.props.transformResponse?.(res) || res.data;\n }\n\n handleFinish = (values: any) => {\n const { params, name } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n message.success(this.t('update_success'));\n this.handleStateResponse({ stage: 'update', data: res });\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n this.handleValuesChange(null, this._initialValues);\n });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n message.success(this.t('create_success'));\n this.handleStateResponse({ stage: 'create', data: res });\n this.formInstance?.resetFields();\n history.back();\n })\n .finally(() => this.setState({ loading: false }));\n }\n };\n\n // hotkey save handler (replaces useKeyboardSave hook)\n handleKeydown = (e: KeyboardEvent) => {\n const { disableHotkeySave } = this.props;\n const isSave = (e.ctrlKey || e.metaKey) && (e.key === 's' || e.key === 'S');\n if (isSave) {\n e.preventDefault();\n if (!disableHotkeySave) {\n this.formInstance?.submit();\n }\n }\n };\n\n handleValuesChange = (_: any, allValues: any) => {\n this.setState({\n touched: !deepEqual(this._initialValues, allValues),\n });\n };\n\n componentDidMount() {\n this._isMounted = true;\n // attach hotkey listener\n window.addEventListener('keydown', this.handleKeydown);\n // initialize detail if editing\n this.initDetailIfNeeded();\n }\n\n componentDidUpdate(prevProps: ReactAntResourceFormProps) {\n const prevId = prevProps.params?.id;\n const curId = this.props.params?.id;\n // re-init when id changed or from create -> edit\n if (prevId !== curId) {\n this.initDetailIfNeeded();\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name } = this.props;\n const resourceShow = `${name}_show`;\n\n if (this.isEdit) {\n const payload = { id: params!.id };\n const _payload = this.handleStateRequest({ stage: 'show', payload });\n\n nx.$api[resourceShow](_payload)\n .then((res: any) => {\n if (!this._isMounted) return; // 👈 关键：防止操作已卸载组件\n const data = this.handleStateResponse({ stage: 'show', data: res });\n this.formInstance?.setFieldsValue?.(data);\n })\n .finally(() => {\n this.setState({ loading: false });\n this.setInitialValues();\n });\n } else {\n this.setInitialValues();\n }\n }\n\n render() {\n const {\n className,\n name,\n meta,\n children,\n lang,\n title,\n extra,\n size,\n okText,\n backText,\n okProps,\n backProps,\n classNames,\n params,\n transformRequest,\n transformResponse,\n disableHotkeySave,\n blocker,\n onInit,\n ...rest\n } = this.props;\n\n return (\n <Card\n title={this.titleView}\n extra={this.extraView}\n size={size}\n classNames={classNames}\n data-component={CLASS_NAME}\n data-blocker={blocker}\n className={cx(CLASS_NAME, className)}>\n <Spin spinning={this.state.loading}>\n <ReactAntdFormSchema\n meta={meta}\n ref={this.formRef}\n onValuesChange={this.handleValuesChange}\n onFinish={this.handleFinish}\n {...rest}>\n {this.childrenView}\n </ReactAntdFormSchema>\n </Spin>\n </Card>\n );\n }\n}\n\nconst ReactAntResourceFormFc: FC<ReactAntResourceFormProps> = (props) => {\n const params = useParams();\n return <ReactAntResourceForm params={params} {...props} />;\n};\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\n","export const API_FORM_LOCALES = {\n 'zh-CN': {\n create: '创建',\n update: '保存',\n create_title: '创建',\n update_title: '更新',\n create_success: '创建成功',\n update_success: '更新成功',\n submit: '提交',\n back: '返回',\n },\n 'en-US': {\n create: 'Create',\n update: 'Save',\n create_title: 'Create',\n update_title: 'Update',\n create_success: 'Create success',\n update_success: 'Update success',\n submit: 'Submit',\n back: 'Back',\n },\n};\n","import ReactAntResourceForm, { ReactAntResourceFormFc } from '.';\nimport type { ReactAntResourceFormProps } from '.';\n\nexport default ReactAntResourceForm;\nexport { ReactAntResourceFormFc };\nexport type { ReactAntResourceFormProps };\n"],"mappings":"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","names":["cx","React","Component","Button","Card","Space","message","Spin","ReactAntdFormSchema","ArrowLeftOutlined","DiffOutlined","SaveOutlined","API_FORM_LOCALES","create","update","create_title","update_title","create_success","update_success","submit","back","nx","useParams","deepEqual","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","back","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","resourceEdit","resourceCreate","isEdit","payload","__spreadValues","id","_payload","handleStateRequest","stage","nx","$api","then","res","message","success","t","handleStateResponse","data","finally","setState","loading","handleValuesChange","resetFields","handleKeydown","e","disableHotkeySave","ctrlKey","metaKey","key","preventDefault","submit","_","allValues","touched","deepEqual","state","bind","initDetailIfNeeded","onInit","Boolean","canSave","titleView","title","_title","Space","span","touchedView","em","style","color","DiffOutlined","extraView","extra","backText","backProps","Button","size","icon","ArrowLeftOutlined","onClick","childrenView","okText","okProps","children","_okText","disabled","htmlType","type","SaveOutlined","current","lang","API_FORM_LOCALES","stagePayload","_b","transformRequest","_c","_d","$event","emit","transformResponse","componentDidMount","window","addEventListener","componentDidUpdate","prevProps","prevId","curId","componentWillUnmount","removeEventListener","resourceShow","setFieldsValue","render","className","meta","classNames","blocker","rest","Card","data-component","data-blocker","cx","Spin","spinning","ReactAntdFormSchema","ref","onValuesChange","onFinish","__publicField","defaultProps","ReactAntResourceFormFc","useParams","index_default","main_default","ReactAntResourceForm"]}
|
package/dist/style.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
.react-ant-form-schema[data-blocker=true] .nice-form-layout{display:block!important}
|
|
2
2
|
/*# sourceMappingURL=src/style.scss.map */
|
package/dist/style.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"src/style.scss"}
|
|
1
|
+
{"version":3,"sources":["src/style.scss"],"names":[],"mappings":"AAAA,4DACE,uBACF","file":"src/style.scss","sourcesContent":[".react-ant-form-schema[data-blocker=true] .nice-form-layout {\n display: block !important;\n}"]}
|
package/dist/style.scss
CHANGED
package/package.json
CHANGED
package/src/index.tsx
CHANGED
|
@@ -33,6 +33,7 @@ export type ReactAntResourceFormProps = {
|
|
|
33
33
|
okText?: string;
|
|
34
34
|
backText?: string;
|
|
35
35
|
params?: Record<string, any>;
|
|
36
|
+
blocker?: boolean;
|
|
36
37
|
disableHotkeySave?: boolean;
|
|
37
38
|
transformRequest?: (payload: StagePayload) => any;
|
|
38
39
|
transformResponse?: (res: StageData) => any;
|
|
@@ -79,8 +80,8 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
79
80
|
|
|
80
81
|
get canSave() {
|
|
81
82
|
const { touched, loading } = this.state;
|
|
82
|
-
if (!this.isEdit) return loading
|
|
83
|
-
return touched
|
|
83
|
+
if (!this.isEdit) return !loading;
|
|
84
|
+
return touched && !loading;
|
|
84
85
|
}
|
|
85
86
|
|
|
86
87
|
get titleView() {
|
|
@@ -226,7 +227,7 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
226
227
|
|
|
227
228
|
handleValuesChange = (_: any, allValues: any) => {
|
|
228
229
|
this.setState({
|
|
229
|
-
touched: deepEqual(this._initialValues, allValues)
|
|
230
|
+
touched: !deepEqual(this._initialValues, allValues),
|
|
230
231
|
});
|
|
231
232
|
};
|
|
232
233
|
|
|
@@ -294,6 +295,7 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
294
295
|
transformRequest,
|
|
295
296
|
transformResponse,
|
|
296
297
|
disableHotkeySave,
|
|
298
|
+
blocker,
|
|
297
299
|
onInit,
|
|
298
300
|
...rest
|
|
299
301
|
} = this.props;
|
|
@@ -305,6 +307,7 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
305
307
|
size={size}
|
|
306
308
|
classNames={classNames}
|
|
307
309
|
data-component={CLASS_NAME}
|
|
310
|
+
data-blocker={blocker}
|
|
308
311
|
className={cx(CLASS_NAME, className)}>
|
|
309
312
|
<Spin spinning={this.state.loading}>
|
|
310
313
|
<ReactAntdFormSchema
|
package/src/style.scss
CHANGED