@jswork/react-ant-resource-form 1.0.23 → 1.0.25
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/dist/main.cjs.js +1 -1
- package/dist/main.cjs.js.map +1 -1
- package/dist/main.d.mts +21 -0
- package/dist/main.d.ts +21 -0
- package/dist/main.esm.js +1 -1
- package/dist/main.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/index.tsx +99 -33
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
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var w=Object.defineProperty;var _=Object.getOwnPropertySymbols;var V=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var E=(i,a,e)=>a in i?w(i,a,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[a]=e,p=(i,a)=>{for(var e in a||(a={}))V.call(a,e)&&E(i,e,a[e]);if(_)for(var e of _(a))I.call(a,e)&&E(i,e,a[e]);return i};var c=(i,a)=>w(i,"name",{value:a,configurable:!0});var x=(i,a)=>{var e={};for(var t in i)V.call(i,t)&&a.indexOf(t)<0&&(e[t]=i[t]);if(i!=null&&_)for(var t of _(i))a.indexOf(t)<0&&I.call(i,t)&&(e[t]=i[t]);return e};var d=(i,a,e)=>E(i,typeof a!="symbol"?a+"":a,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",no_change:"\u6CA1\u6709\u4FEE\u6539"},"en-US":{create:"Create",update:"Save",create_title:"Create",update_title:"Update",create_success:"Create success",update_success:"Update success",submit:"Submit",back:"Back",no_change:"No change"}};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",m,N=(m=class extends _react.Component{constructor(e){var t;super(e);d(this,"formRef",_react2.default.createRef());d(this,"_isMounted",!1);d(this,"_initialValues",null);d(this,"handleBack",c(()=>{history.back()},"handleBack"));d(this,"setInitialValues",c(e=>{var t;this._initialValues=e||((t=this.formInstance)==null?void 0:t.getFieldsValue())||{}},"setInitialValues"));d(this,"handleFinish",c(e=>{let{params:t,name:s,submitGuard:n}=this.props,r=`${s}_update`,l=`${s}_create`;if(!this.canSave){_antd.message.info(this.t("no_change"));return}if(this.isEdit){let f=p({id:t.id},e),h=this.handleStateRequest({stage:"update",payload:f}),g={name:s,payload:h,isEdit:!0,values:e,params:t};n==null||n(g).then(()=>{_next2.default.$api[r](h).then(u=>{_antd.message.success(this.t("update_success")),this.handleStateResponse({stage:"update",data:u})}).finally(()=>{this.setState({loading:!1}),this.setInitialValues(),this.handleValuesChange(null,this._initialValues)})})}else{let f=p({},e),h=this.handleStateRequest({stage:"create",payload:f}),g={name:s,payload:h,isEdit:!1,values:e,params:t};n==null||n(g).then(()=>{_next2.default.$api[l](h).then(u=>{var S;_antd.message.success(this.t("create_success")),this.handleStateResponse({stage:"create",data:u}),(S=this.formInstance)==null||S.resetFields(),history.back()}).finally(()=>this.setState({loading:!1}))})}},"handleFinish"));d(this,"handleKeydown",c(e=>{var n;let{disableHotkeySave:t}=this.props;(e.ctrlKey||e.metaKey)&&(e.key==="s"||e.key==="S")&&(e.preventDefault(),t||(n=this.formInstance)==null||n.submit())},"handleKeydown"));d(this,"handleValuesChange",c((e,t)=>{this.setState({touched:!_fastdeepequal2.default.call(void 0, this._initialValues,t)})},"handleValuesChange"));this.state={loading:e.loading,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:s}=this.props;return e||_react2.default.createElement(_antd.Button,p({size:"small",icon:_react2.default.createElement(_icons.ArrowLeftOutlined,null),onClick:this.handleBack},s),t||this.t("back"))}get childrenView(){let{okText:e,backText:t,okProps:s,backProps:n,children:r}=this.props,l=e||(this.isEdit?this.t("update"):this.t("create"));return r||_react2.default.createElement(_antd.Space,null,_react2.default.createElement(_antd.Button,p({disabled:!this.canSave,htmlType:"submit",type:"primary",icon:_react2.default.createElement(_icons.SaveOutlined,null)},s),l||this.t("submit")),_react2.default.createElement(_antd.Button,p({icon:_react2.default.createElement(_icons.ArrowLeftOutlined,null),onClick:this.handleBack},n),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,s;return this.setState({loading:!0}),((s=(t=this.props).transformRequest)==null?void 0:s.call(t,e))||e.payload}handleStateResponse(e){var s,n,r,l;let{name:t}=this.props;return this.setState({loading:!1}),(n=(s=_next2.default.$event)==null?void 0:s.emit)==null||n.call(s,`${t}:refetch`),((l=(r=this.props).transformResponse)==null?void 0:l.call(r,e))||e.data}componentDidMount(){this._isMounted=!0,window.addEventListener("keydown",this.handleKeydown),this.initDetailIfNeeded()}componentDidUpdate(e){var n,r;let t=(n=e.params)==null?void 0:n.id,s=(r=this.props.params)==null?void 0:r.id;t!==s&&this.initDetailIfNeeded(),e.loading!==this.props.loading&&this.setState({loading:this.props.loading})}componentWillUnmount(){window.removeEventListener("keydown",this.handleKeydown),this._isMounted=!1}initDetailIfNeeded(){let{params:e,name:t,initGuard:s}=this.props,n=`${t}_show`;if(this.isEdit){let r={id:e.id},l=this.handleStateRequest({stage:"show",payload:r}),f={name:t,payload:l,isEdit:!0,params:e};s==null||s(f).then(()=>{_next2.default.$api[n](l).then(h=>{var u,S;if(!this._isMounted)return;let g=this.handleStateResponse({stage:"show",data:h});(S=(u=this.formInstance)==null?void 0:u.setFieldsValue)==null||S.call(u,g)}).finally(()=>{this.setState({loading:!1}),this.setInitialValues()})})}else{let r={name:t,payload:null,isEdit:!1,params:e};s==null||s(r).then(()=>{this.setInitialValues()})}}render(){let b=this.props,{className:e,name:t,meta:s,children:n,lang:r,title:l,extra:f,size:h,okText:g,backText:u,okProps:S,backProps:W,classNames:D,params:j,transformRequest:J,transformResponse:Q,disableHotkeySave:X,blocker:P,onInit:Y,initGuard:Z,submitGuard:ee,loading:te}=b,L=x(b,["className","name","meta","children","lang","title","extra","size","okText","backText","okProps","backProps","classNames","params","transformRequest","transformResponse","disableHotkeySave","blocker","onInit","initGuard","submitGuard","loading"]);return _react2.default.createElement(_antd.Card,{title:this.titleView,extra:this.extraView,size:h,classNames:D,"data-component":F,"data-blocker":P,className:_classnames2.default.call(void 0, F,e)},_react2.default.createElement(_antd.Spin,{spinning:this.state.loading},_react2.default.createElement(_reactantformschema2.default,p({meta:s,ref:this.formRef,onValuesChange:this.handleValuesChange,onFinish:this.handleFinish},L),this.childrenView)))}},c(m,"ReactAntResourceForm"),d(m,"defaultProps",{lang:"zh-CN",disableHotkeySave:!1,blocker:!1,initGuard:c(()=>Promise.resolve(),"initGuard"),submitGuard:c(()=>Promise.resolve(),"submitGuard")}),m),G= exports.ReactAntResourceFormFc =c(i=>{let a=_reactrouterdom.useParams.call(void 0, );return _react2.default.createElement(N,p({params:a},i))},"ReactAntResourceFormFc"),q=N;var ge=q;exports.ReactAntResourceFormFc = G; exports.default = ge;
|
|
2
2
|
//# sourceMappingURL=main.cjs.js.map
|
package/dist/main.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
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","no_change","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","resourceEdit"],"mappings":"AAAA,6KAAI,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,qBAAqB,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CCC7lB,gGAAe,4EACsB,4BACsC,2IAEb,0CACA,ICNjDA,CAAAA,CAAmB,CAC9B,OAAA,CAAS,CACPC,MAAAA,CAAQ,cAAA,CACRC,MAAAA,CAAQ,cAAA,CACRC,YAAAA,CAAc,cAAA,CACdC,YAAAA,CAAc,cAAA,CACdC,cAAAA,CAAgB,0BAAA,CAChBC,cAAAA,CAAgB,0BAAA,CAChBC,MAAAA,CAAQ,cAAA,CACRC,IAAAA,CAAM,cAAA,CACNC,SAAAA,CAAW,0BACb,CAAA,CACA,OAAA,CAAS,CACPR,MAAAA,CAAQ,QAAA,CACRC,MAAAA,CAAQ,MAAA,CACRC,YAAAA,CAAc,QAAA,CACdC,YAAAA,CAAc,QAAA,CACdC,cAAAA,CAAgB,gBAAA,CAChBC,cAAAA,CAAgB,gBAAA,CAChBC,MAAAA,CAAQ,QAAA,CACRC,IAAAA,CAAM,MAAA,CACNC,SAAAA,CAAW,WACb,CACF,CAAA,CDfA,gFAAe,kDACW,8GACJ,IA2ChBC,CAAAA,CAAa,yBAAA,CArDnBC,CAAAA,CAiEMC,CAAAA,CAAAA,CAAND,CAAAA,CAAA,MAAA,QAAmCE,gBAAAA,CA6EjC,WAAA,CAAYC,CAAAA,CAAkC,CA9IhD,IAAAH,CAAAA,CA+II,KAAA,CAAMG,CAAAA,CAAAA,CAxEAC,CAAAA,CAAAA,IAAAA,CAAAA,SAAAA,CAAUC,eAAAA,CAAMC,SAAAA,CAAS,CAAA,CAAA,CACzBC,CAAAA,CAAAA,IAAAA,CAAAA,YAAAA,CAAa,CAAA,CAAA,CAAA,CACbC,CAAAA,CAAAA,IAAAA,CAAAA,gBAAAA,CAAiB,IAAA,CAAA,CAwFjBC,CAAAA,CAAAA,IAAAA,CAAAA,YAAAA,CAAaC,CAAAA,CAAA,CAAA,CAAA,EAAA,CACnBC,OAAAA,CAAQd,IAAAA,CAAI,CACd,CAAA,CAFqB,YAAA,CAAA,CAAA,CAIbe,CAAAA,CAAAA,IAAAA,CAAAA,kBAAAA,CAAmBF,CAAAA,CAACG,CAAAA,EAAAA,CArK9B,IAAAb,CAAAA,CAsKI,IAAA,CAAKQ,cAAAA,CAAiBK,CAAAA,EAAAA,CAAAA,CAAUb,CAAAA,CAAA,IAAA,CAAKc,YAAAA,CAAAA,EAAL,IAAA,CAAA,KAAA,CAAA,CAAAd,CAAAA,CAAmBe,cAAAA,CAAAA,CAAAA,CAAAA,EAAoB,CAAC,CAC1E,CAAA,CAF2B,kBAAA,CAAA,CAAA,CAgB3BC,CAAAA,CAAAA,IAAAA,CAAAA,cAAAA,CAAeN,CAAAA,CAACG,CAAAA,EAAAA,CACd,GAAM,CAAEI,MAAAA,CAAAA,CAAAA,CAAQC,IAAAA,CAAAA,CAAI,CAAA,CAAK,IAAA,CAAKf,KAAAA,CACxBgB,CAAAA,CAAe,CAAA,EAAA","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.canSave) {\n void message.info(this.t('no_change'));\n return;\n }\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 no_change: '没有修改',\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 no_change: 'No change',\n },\n};\n"]}
|
|
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","no_change","CLASS_NAME","_a","ReactAntResourceForm","Component","props","formRef","React","createRef","_isMounted","_initialValues","handleBack","__name","history","setInitialValues","values","formInstance","getFieldsValue","handleFinish","params","name","submitGuard","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\ntype InitGuardArgs = {\n name?: string;\n params?: Record<string, any>;\n payload: any;\n isEdit: boolean;\n}\n\ntype SubmitGuardArgs = {\n name?: string;\n params?: Record<string, any>;\n payload: any;\n isEdit: boolean;\n values: 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 initGuard?: (args: InitGuardArgs) => Promise<void>;\n submitGuard?: (args: SubmitGuardArgs) => Promise<void>;\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 * initGuard | submitGuard:\n * https://chat.qwen.ai/c/60329863-0e5e-47f9-a075-a65ad30940cc\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n blocker: false,\n initGuard: () => Promise.resolve(),\n submitGuard: () => Promise.resolve(),\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: props.loading!,\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, submitGuard } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (!this.canSave) {\n void message.info(this.t('no_change'));\n return;\n }\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n const submitGuardArgs: SubmitGuardArgs = {\n name,\n payload: _payload,\n isEdit: true,\n values,\n params,\n };\n\n submitGuard?.(submitGuardArgs)\n .then(() => {\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n void 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 });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n const submitGuardArgs: SubmitGuardArgs = {\n name,\n payload: _payload,\n isEdit: false,\n values,\n params,\n };\n\n submitGuard?.(submitGuardArgs).then(() => {\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n void 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\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 // loading update\n if (prevProps.loading !== this.props.loading) {\n this.setState({ loading: this.props.loading! });\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name, initGuard } = 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 const initGuardArgs: InitGuardArgs = {\n name,\n payload: _payload,\n isEdit: true,\n params,\n };\n initGuard?.(initGuardArgs)\n .then(() => {\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 });\n } else {\n const initGuardArgs: InitGuardArgs = {\n name,\n payload: null,\n isEdit: false,\n params,\n };\n initGuard?.(initGuardArgs).then(() => {\n this.setInitialValues();\n });\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 initGuard,\n submitGuard,\n loading,\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 no_change: '没有修改',\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 no_change: 'No change',\n },\n};\n"]}
|
package/dist/main.d.mts
CHANGED
|
@@ -17,6 +17,19 @@ type StageData = {
|
|
|
17
17
|
stage: 'show' | 'create' | 'update';
|
|
18
18
|
data: any;
|
|
19
19
|
};
|
|
20
|
+
type InitGuardArgs = {
|
|
21
|
+
name?: string;
|
|
22
|
+
params?: Record<string, any>;
|
|
23
|
+
payload: any;
|
|
24
|
+
isEdit: boolean;
|
|
25
|
+
};
|
|
26
|
+
type SubmitGuardArgs = {
|
|
27
|
+
name?: string;
|
|
28
|
+
params?: Record<string, any>;
|
|
29
|
+
payload: any;
|
|
30
|
+
isEdit: boolean;
|
|
31
|
+
values: any;
|
|
32
|
+
};
|
|
20
33
|
type ReactAntResourceFormProps = {
|
|
21
34
|
lang?: string;
|
|
22
35
|
loading?: boolean;
|
|
@@ -25,6 +38,8 @@ type ReactAntResourceFormProps = {
|
|
|
25
38
|
params?: Record<string, any>;
|
|
26
39
|
blocker?: boolean;
|
|
27
40
|
disableHotkeySave?: boolean;
|
|
41
|
+
initGuard?: (args: InitGuardArgs) => Promise<void>;
|
|
42
|
+
submitGuard?: (args: SubmitGuardArgs) => Promise<void>;
|
|
28
43
|
transformRequest?: (payload: StagePayload) => any;
|
|
29
44
|
transformResponse?: (res: StageData) => any;
|
|
30
45
|
okProps?: ButtonProps;
|
|
@@ -47,11 +62,17 @@ type IState = {
|
|
|
47
62
|
* this.formRef?: null
|
|
48
63
|
* index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}
|
|
49
64
|
* index.tsx:229 this.formRef?: null
|
|
65
|
+
*
|
|
66
|
+
* initGuard | submitGuard:
|
|
67
|
+
* https://chat.qwen.ai/c/60329863-0e5e-47f9-a075-a65ad30940cc
|
|
50
68
|
*/
|
|
51
69
|
declare class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {
|
|
52
70
|
static defaultProps: {
|
|
53
71
|
lang: string;
|
|
54
72
|
disableHotkeySave: boolean;
|
|
73
|
+
blocker: boolean;
|
|
74
|
+
initGuard: () => Promise<void>;
|
|
75
|
+
submitGuard: () => Promise<void>;
|
|
55
76
|
};
|
|
56
77
|
private formRef;
|
|
57
78
|
private _isMounted;
|
package/dist/main.d.ts
CHANGED
|
@@ -17,6 +17,19 @@ type StageData = {
|
|
|
17
17
|
stage: 'show' | 'create' | 'update';
|
|
18
18
|
data: any;
|
|
19
19
|
};
|
|
20
|
+
type InitGuardArgs = {
|
|
21
|
+
name?: string;
|
|
22
|
+
params?: Record<string, any>;
|
|
23
|
+
payload: any;
|
|
24
|
+
isEdit: boolean;
|
|
25
|
+
};
|
|
26
|
+
type SubmitGuardArgs = {
|
|
27
|
+
name?: string;
|
|
28
|
+
params?: Record<string, any>;
|
|
29
|
+
payload: any;
|
|
30
|
+
isEdit: boolean;
|
|
31
|
+
values: any;
|
|
32
|
+
};
|
|
20
33
|
type ReactAntResourceFormProps = {
|
|
21
34
|
lang?: string;
|
|
22
35
|
loading?: boolean;
|
|
@@ -25,6 +38,8 @@ type ReactAntResourceFormProps = {
|
|
|
25
38
|
params?: Record<string, any>;
|
|
26
39
|
blocker?: boolean;
|
|
27
40
|
disableHotkeySave?: boolean;
|
|
41
|
+
initGuard?: (args: InitGuardArgs) => Promise<void>;
|
|
42
|
+
submitGuard?: (args: SubmitGuardArgs) => Promise<void>;
|
|
28
43
|
transformRequest?: (payload: StagePayload) => any;
|
|
29
44
|
transformResponse?: (res: StageData) => any;
|
|
30
45
|
okProps?: ButtonProps;
|
|
@@ -47,11 +62,17 @@ type IState = {
|
|
|
47
62
|
* this.formRef?: null
|
|
48
63
|
* index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}
|
|
49
64
|
* index.tsx:229 this.formRef?: null
|
|
65
|
+
*
|
|
66
|
+
* initGuard | submitGuard:
|
|
67
|
+
* https://chat.qwen.ai/c/60329863-0e5e-47f9-a075-a65ad30940cc
|
|
50
68
|
*/
|
|
51
69
|
declare class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {
|
|
52
70
|
static defaultProps: {
|
|
53
71
|
lang: string;
|
|
54
72
|
disableHotkeySave: boolean;
|
|
73
|
+
blocker: boolean;
|
|
74
|
+
initGuard: () => Promise<void>;
|
|
75
|
+
submitGuard: () => Promise<void>;
|
|
55
76
|
};
|
|
56
77
|
private formRef;
|
|
57
78
|
private _isMounted;
|
package/dist/main.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var
|
|
1
|
+
var w=Object.defineProperty;var _=Object.getOwnPropertySymbols;var V=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var E=(i,a,e)=>a in i?w(i,a,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[a]=e,p=(i,a)=>{for(var e in a||(a={}))V.call(a,e)&&E(i,e,a[e]);if(_)for(var e of _(a))I.call(a,e)&&E(i,e,a[e]);return i};var c=(i,a)=>w(i,"name",{value:a,configurable:!0});var x=(i,a)=>{var e={};for(var t in i)V.call(i,t)&&a.indexOf(t)<0&&(e[t]=i[t]);if(i!=null&&_)for(var t of _(i))a.indexOf(t)<0&&I.call(i,t)&&(e[t]=i[t]);return e};var d=(i,a,e)=>E(i,typeof a!="symbol"?a+"":a,e);import M from"classnames";import o,{Component as $}from"react";import{Button as R,Card as O,Space as C,message as y,Spin as T}from"antd";import B from"@jswork/react-ant-form-schema";import{ArrowLeftOutlined as A,DiffOutlined as z,SaveOutlined as K}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",no_change:"\u6CA1\u6709\u4FEE\u6539"},"en-US":{create:"Create",update:"Save",create_title:"Create",update_title:"Update",create_success:"Create success",update_success:"Update success",submit:"Submit",back:"Back",no_change:"No change"}};import k from"@jswork/next";import{useParams as U}from"react-router-dom";import H from"fast-deep-equal";var F="react-ant-resource-form",m,N=(m=class extends ${constructor(e){var t;super(e);d(this,"formRef",o.createRef());d(this,"_isMounted",!1);d(this,"_initialValues",null);d(this,"handleBack",c(()=>{history.back()},"handleBack"));d(this,"setInitialValues",c(e=>{var t;this._initialValues=e||((t=this.formInstance)==null?void 0:t.getFieldsValue())||{}},"setInitialValues"));d(this,"handleFinish",c(e=>{let{params:t,name:s,submitGuard:n}=this.props,r=`${s}_update`,l=`${s}_create`;if(!this.canSave){y.info(this.t("no_change"));return}if(this.isEdit){let f=p({id:t.id},e),h=this.handleStateRequest({stage:"update",payload:f}),g={name:s,payload:h,isEdit:!0,values:e,params:t};n==null||n(g).then(()=>{k.$api[r](h).then(u=>{y.success(this.t("update_success")),this.handleStateResponse({stage:"update",data:u})}).finally(()=>{this.setState({loading:!1}),this.setInitialValues(),this.handleValuesChange(null,this._initialValues)})})}else{let f=p({},e),h=this.handleStateRequest({stage:"create",payload:f}),g={name:s,payload:h,isEdit:!1,values:e,params:t};n==null||n(g).then(()=>{k.$api[l](h).then(u=>{var S;y.success(this.t("create_success")),this.handleStateResponse({stage:"create",data:u}),(S=this.formInstance)==null||S.resetFields(),history.back()}).finally(()=>this.setState({loading:!1}))})}},"handleFinish"));d(this,"handleKeydown",c(e=>{var n;let{disableHotkeySave:t}=this.props;(e.ctrlKey||e.metaKey)&&(e.key==="s"||e.key==="S")&&(e.preventDefault(),t||(n=this.formInstance)==null||n.submit())},"handleKeydown"));d(this,"handleValuesChange",c((e,t)=>{this.setState({touched:!H(this._initialValues,t)})},"handleValuesChange"));this.state={loading:e.loading,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 o.createElement(C,null,t,o.createElement("span",null,this.touchedView))}get touchedView(){return this.isEdit&&this.state.touched?o.createElement("em",{style:{color:"#f60"}},o.createElement(z,null)):null}get extraView(){let{extra:e,backText:t,backProps:s}=this.props;return e||o.createElement(R,p({size:"small",icon:o.createElement(A,null),onClick:this.handleBack},s),t||this.t("back"))}get childrenView(){let{okText:e,backText:t,okProps:s,backProps:n,children:r}=this.props,l=e||(this.isEdit?this.t("update"):this.t("create"));return r||o.createElement(C,null,o.createElement(R,p({disabled:!this.canSave,htmlType:"submit",type:"primary",icon:o.createElement(K,null)},s),l||this.t("submit")),o.createElement(R,p({icon:o.createElement(A,null),onClick:this.handleBack},n),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,s;return this.setState({loading:!0}),((s=(t=this.props).transformRequest)==null?void 0:s.call(t,e))||e.payload}handleStateResponse(e){var s,n,r,l;let{name:t}=this.props;return this.setState({loading:!1}),(n=(s=k.$event)==null?void 0:s.emit)==null||n.call(s,`${t}:refetch`),((l=(r=this.props).transformResponse)==null?void 0:l.call(r,e))||e.data}componentDidMount(){this._isMounted=!0,window.addEventListener("keydown",this.handleKeydown),this.initDetailIfNeeded()}componentDidUpdate(e){var n,r;let t=(n=e.params)==null?void 0:n.id,s=(r=this.props.params)==null?void 0:r.id;t!==s&&this.initDetailIfNeeded(),e.loading!==this.props.loading&&this.setState({loading:this.props.loading})}componentWillUnmount(){window.removeEventListener("keydown",this.handleKeydown),this._isMounted=!1}initDetailIfNeeded(){let{params:e,name:t,initGuard:s}=this.props,n=`${t}_show`;if(this.isEdit){let r={id:e.id},l=this.handleStateRequest({stage:"show",payload:r}),f={name:t,payload:l,isEdit:!0,params:e};s==null||s(f).then(()=>{k.$api[n](l).then(h=>{var u,S;if(!this._isMounted)return;let g=this.handleStateResponse({stage:"show",data:h});(S=(u=this.formInstance)==null?void 0:u.setFieldsValue)==null||S.call(u,g)}).finally(()=>{this.setState({loading:!1}),this.setInitialValues()})})}else{let r={name:t,payload:null,isEdit:!1,params:e};s==null||s(r).then(()=>{this.setInitialValues()})}}render(){let b=this.props,{className:e,name:t,meta:s,children:n,lang:r,title:l,extra:f,size:h,okText:g,backText:u,okProps:S,backProps:W,classNames:D,params:j,transformRequest:J,transformResponse:Q,disableHotkeySave:X,blocker:P,onInit:Y,initGuard:Z,submitGuard:ee,loading:te}=b,L=x(b,["className","name","meta","children","lang","title","extra","size","okText","backText","okProps","backProps","classNames","params","transformRequest","transformResponse","disableHotkeySave","blocker","onInit","initGuard","submitGuard","loading"]);return o.createElement(O,{title:this.titleView,extra:this.extraView,size:h,classNames:D,"data-component":F,"data-blocker":P,className:M(F,e)},o.createElement(T,{spinning:this.state.loading},o.createElement(B,p({meta:s,ref:this.formRef,onValuesChange:this.handleValuesChange,onFinish:this.handleFinish},L),this.childrenView)))}},c(m,"ReactAntResourceForm"),d(m,"defaultProps",{lang:"zh-CN",disableHotkeySave:!1,blocker:!1,initGuard:c(()=>Promise.resolve(),"initGuard"),submitGuard:c(()=>Promise.resolve(),"submitGuard")}),m),G=c(i=>{let a=U();return o.createElement(N,p({params:a},i))},"ReactAntResourceFormFc"),q=N;var ge=q;export{G as ReactAntResourceFormFc,ge 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 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.canSave) {\n void message.info(this.t('no_change'));\n return;\n }\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 no_change: '没有修改',\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 no_change: 'No change',\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","no_change","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","canSave","message","info","t","isEdit","payload","__spreadValues","id","_payload","handleStateRequest","stage","nx","$api","then","res","success","handleStateResponse","data","finally","setState","loading","handleValuesChange","resetFields","handleKeydown","e","disableHotkeySave","ctrlKey","metaKey","key","preventDefault","submit","_","allValues","touched","deepEqual","state","bind","initDetailIfNeeded","onInit","Boolean","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"]}
|
|
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\ntype InitGuardArgs = {\n name?: string;\n params?: Record<string, any>;\n payload: any;\n isEdit: boolean;\n}\n\ntype SubmitGuardArgs = {\n name?: string;\n params?: Record<string, any>;\n payload: any;\n isEdit: boolean;\n values: 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 initGuard?: (args: InitGuardArgs) => Promise<void>;\n submitGuard?: (args: SubmitGuardArgs) => Promise<void>;\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 * initGuard | submitGuard:\n * https://chat.qwen.ai/c/60329863-0e5e-47f9-a075-a65ad30940cc\n */\n\nclass ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {\n public static defaultProps = {\n lang: 'zh-CN',\n disableHotkeySave: false,\n blocker: false,\n initGuard: () => Promise.resolve(),\n submitGuard: () => Promise.resolve(),\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: props.loading!,\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, submitGuard } = this.props;\n const resourceEdit = `${name}_update`;\n const resourceCreate = `${name}_create`;\n\n if (!this.canSave) {\n void message.info(this.t('no_change'));\n return;\n }\n\n if (this.isEdit) {\n const payload = { id: params!.id, ...values };\n const _payload = this.handleStateRequest({ stage: 'update', payload });\n const submitGuardArgs: SubmitGuardArgs = {\n name,\n payload: _payload,\n isEdit: true,\n values,\n params,\n };\n\n submitGuard?.(submitGuardArgs)\n .then(() => {\n nx.$api[resourceEdit](_payload)\n .then((res: any) => {\n void 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 });\n } else {\n const payload = { ...values };\n const _payload = this.handleStateRequest({ stage: 'create', payload });\n const submitGuardArgs: SubmitGuardArgs = {\n name,\n payload: _payload,\n isEdit: false,\n values,\n params,\n };\n\n submitGuard?.(submitGuardArgs).then(() => {\n nx.$api[resourceCreate](_payload)\n .then((res: any) => {\n void 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\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 // loading update\n if (prevProps.loading !== this.props.loading) {\n this.setState({ loading: this.props.loading! });\n }\n }\n\n componentWillUnmount() {\n window.removeEventListener('keydown', this.handleKeydown);\n this._isMounted = false;\n }\n\n initDetailIfNeeded() {\n const { params, name, initGuard } = 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 const initGuardArgs: InitGuardArgs = {\n name,\n payload: _payload,\n isEdit: true,\n params,\n };\n initGuard?.(initGuardArgs)\n .then(() => {\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 });\n } else {\n const initGuardArgs: InitGuardArgs = {\n name,\n payload: null,\n isEdit: false,\n params,\n };\n initGuard?.(initGuardArgs).then(() => {\n this.setInitialValues();\n });\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 initGuard,\n submitGuard,\n loading,\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 no_change: '没有修改',\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 no_change: 'No change',\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","no_change","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","submitGuard","resourceEdit","resourceCreate","canSave","message","info","t","isEdit","payload","__spreadValues","id","_payload","handleStateRequest","stage","submitGuardArgs","then","nx","$api","res","success","handleStateResponse","data","finally","setState","loading","handleValuesChange","resetFields","handleKeydown","e","disableHotkeySave","ctrlKey","metaKey","key","preventDefault","submit","_","allValues","touched","deepEqual","state","bind","initDetailIfNeeded","onInit","Boolean","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","initGuard","resourceShow","initGuardArgs","setFieldsValue","render","className","meta","classNames","blocker","rest","Card","data-component","data-blocker","cx","Spin","spinning","ReactAntdFormSchema","ref","onValuesChange","onFinish","__publicField","defaultProps","Promise","resolve","ReactAntResourceFormFc","useParams","index_default","main_default","ReactAntResourceForm"]}
|
package/package.json
CHANGED
package/src/index.tsx
CHANGED
|
@@ -27,6 +27,21 @@ type StageData = {
|
|
|
27
27
|
data: any;
|
|
28
28
|
};
|
|
29
29
|
|
|
30
|
+
type InitGuardArgs = {
|
|
31
|
+
name?: string;
|
|
32
|
+
params?: Record<string, any>;
|
|
33
|
+
payload: any;
|
|
34
|
+
isEdit: boolean;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
type SubmitGuardArgs = {
|
|
38
|
+
name?: string;
|
|
39
|
+
params?: Record<string, any>;
|
|
40
|
+
payload: any;
|
|
41
|
+
isEdit: boolean;
|
|
42
|
+
values: any;
|
|
43
|
+
}
|
|
44
|
+
|
|
30
45
|
export type ReactAntResourceFormProps = {
|
|
31
46
|
lang?: string;
|
|
32
47
|
loading?: boolean;
|
|
@@ -35,6 +50,8 @@ export type ReactAntResourceFormProps = {
|
|
|
35
50
|
params?: Record<string, any>;
|
|
36
51
|
blocker?: boolean;
|
|
37
52
|
disableHotkeySave?: boolean;
|
|
53
|
+
initGuard?: (args: InitGuardArgs) => Promise<void>;
|
|
54
|
+
submitGuard?: (args: SubmitGuardArgs) => Promise<void>;
|
|
38
55
|
transformRequest?: (payload: StagePayload) => any;
|
|
39
56
|
transformResponse?: (res: StageData) => any;
|
|
40
57
|
okProps?: ButtonProps;
|
|
@@ -61,12 +78,18 @@ const CLASS_NAME = 'react-ant-resource-form';
|
|
|
61
78
|
* this.formRef?: null
|
|
62
79
|
* index.tsx:229 this.formRef?: {getFieldValue: ƒ, getFieldsValue: ƒ, getFieldError: ƒ, getFieldWarning: ƒ, getFieldsError: ƒ, …}
|
|
63
80
|
* index.tsx:229 this.formRef?: null
|
|
81
|
+
*
|
|
82
|
+
* initGuard | submitGuard:
|
|
83
|
+
* https://chat.qwen.ai/c/60329863-0e5e-47f9-a075-a65ad30940cc
|
|
64
84
|
*/
|
|
65
85
|
|
|
66
86
|
class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState> {
|
|
67
87
|
public static defaultProps = {
|
|
68
88
|
lang: 'zh-CN',
|
|
69
89
|
disableHotkeySave: false,
|
|
90
|
+
blocker: false,
|
|
91
|
+
initGuard: () => Promise.resolve(),
|
|
92
|
+
submitGuard: () => Promise.resolve(),
|
|
70
93
|
};
|
|
71
94
|
|
|
72
95
|
private formRef = React.createRef<FormInstance>(); // 注意类型
|
|
@@ -143,7 +166,7 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
143
166
|
constructor(props: ReactAntResourceFormProps) {
|
|
144
167
|
super(props);
|
|
145
168
|
this.state = {
|
|
146
|
-
loading:
|
|
169
|
+
loading: props.loading!,
|
|
147
170
|
touched: false,
|
|
148
171
|
};
|
|
149
172
|
|
|
@@ -180,7 +203,7 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
180
203
|
}
|
|
181
204
|
|
|
182
205
|
handleFinish = (values: any) => {
|
|
183
|
-
const { params, name } = this.props;
|
|
206
|
+
const { params, name, submitGuard } = this.props;
|
|
184
207
|
const resourceEdit = `${name}_update`;
|
|
185
208
|
const resourceCreate = `${name}_create`;
|
|
186
209
|
|
|
@@ -192,29 +215,48 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
192
215
|
if (this.isEdit) {
|
|
193
216
|
const payload = { id: params!.id, ...values };
|
|
194
217
|
const _payload = this.handleStateRequest({ stage: 'update', payload });
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
218
|
+
const submitGuardArgs: SubmitGuardArgs = {
|
|
219
|
+
name,
|
|
220
|
+
payload: _payload,
|
|
221
|
+
isEdit: true,
|
|
222
|
+
values,
|
|
223
|
+
params,
|
|
224
|
+
};
|
|
225
|
+
|
|
226
|
+
submitGuard?.(submitGuardArgs)
|
|
227
|
+
.then(() => {
|
|
228
|
+
nx.$api[resourceEdit](_payload)
|
|
229
|
+
.then((res: any) => {
|
|
230
|
+
void message.success(this.t('update_success'));
|
|
231
|
+
this.handleStateResponse({ stage: 'update', data: res });
|
|
232
|
+
})
|
|
233
|
+
.finally(() => {
|
|
234
|
+
this.setState({ loading: false });
|
|
235
|
+
this.setInitialValues();
|
|
236
|
+
this.handleValuesChange(null, this._initialValues);
|
|
237
|
+
});
|
|
205
238
|
});
|
|
206
239
|
} else {
|
|
207
240
|
const payload = { ...values };
|
|
208
241
|
const _payload = this.handleStateRequest({ stage: 'create', payload });
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
242
|
+
const submitGuardArgs: SubmitGuardArgs = {
|
|
243
|
+
name,
|
|
244
|
+
payload: _payload,
|
|
245
|
+
isEdit: false,
|
|
246
|
+
values,
|
|
247
|
+
params,
|
|
248
|
+
};
|
|
249
|
+
|
|
250
|
+
submitGuard?.(submitGuardArgs).then(() => {
|
|
251
|
+
nx.$api[resourceCreate](_payload)
|
|
252
|
+
.then((res: any) => {
|
|
253
|
+
void message.success(this.t('create_success'));
|
|
254
|
+
this.handleStateResponse({ stage: 'create', data: res });
|
|
255
|
+
this.formInstance?.resetFields();
|
|
256
|
+
history.back();
|
|
257
|
+
})
|
|
258
|
+
.finally(() => this.setState({ loading: false }));
|
|
259
|
+
});
|
|
218
260
|
}
|
|
219
261
|
};
|
|
220
262
|
|
|
@@ -251,6 +293,11 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
251
293
|
if (prevId !== curId) {
|
|
252
294
|
this.initDetailIfNeeded();
|
|
253
295
|
}
|
|
296
|
+
|
|
297
|
+
// loading update
|
|
298
|
+
if (prevProps.loading !== this.props.loading) {
|
|
299
|
+
this.setState({ loading: this.props.loading! });
|
|
300
|
+
}
|
|
254
301
|
}
|
|
255
302
|
|
|
256
303
|
componentWillUnmount() {
|
|
@@ -259,25 +306,41 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
259
306
|
}
|
|
260
307
|
|
|
261
308
|
initDetailIfNeeded() {
|
|
262
|
-
const { params, name } = this.props;
|
|
309
|
+
const { params, name, initGuard } = this.props;
|
|
263
310
|
const resourceShow = `${name}_show`;
|
|
264
311
|
|
|
265
312
|
if (this.isEdit) {
|
|
266
313
|
const payload = { id: params!.id };
|
|
267
314
|
const _payload = this.handleStateRequest({ stage: 'show', payload });
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
.
|
|
276
|
-
|
|
277
|
-
|
|
315
|
+
const initGuardArgs: InitGuardArgs = {
|
|
316
|
+
name,
|
|
317
|
+
payload: _payload,
|
|
318
|
+
isEdit: true,
|
|
319
|
+
params,
|
|
320
|
+
};
|
|
321
|
+
initGuard?.(initGuardArgs)
|
|
322
|
+
.then(() => {
|
|
323
|
+
nx.$api[resourceShow](_payload)
|
|
324
|
+
.then((res: any) => {
|
|
325
|
+
if (!this._isMounted) return; // 👈 关键:防止操作已卸载组件
|
|
326
|
+
const data = this.handleStateResponse({ stage: 'show', data: res });
|
|
327
|
+
this.formInstance?.setFieldsValue?.(data);
|
|
328
|
+
})
|
|
329
|
+
.finally(() => {
|
|
330
|
+
this.setState({ loading: false });
|
|
331
|
+
this.setInitialValues();
|
|
332
|
+
});
|
|
278
333
|
});
|
|
279
334
|
} else {
|
|
280
|
-
|
|
335
|
+
const initGuardArgs: InitGuardArgs = {
|
|
336
|
+
name,
|
|
337
|
+
payload: null,
|
|
338
|
+
isEdit: false,
|
|
339
|
+
params,
|
|
340
|
+
};
|
|
341
|
+
initGuard?.(initGuardArgs).then(() => {
|
|
342
|
+
this.setInitialValues();
|
|
343
|
+
});
|
|
281
344
|
}
|
|
282
345
|
}
|
|
283
346
|
|
|
@@ -302,6 +365,9 @@ class ReactAntResourceForm extends Component<ReactAntResourceFormProps, IState>
|
|
|
302
365
|
disableHotkeySave,
|
|
303
366
|
blocker,
|
|
304
367
|
onInit,
|
|
368
|
+
initGuard,
|
|
369
|
+
submitGuard,
|
|
370
|
+
loading,
|
|
305
371
|
...rest
|
|
306
372
|
} = this.props;
|
|
307
373
|
|