feat: improve code

This commit is contained in:
chenos 2025-06-24 09:34:34 +08:00
parent 71b2ac3acf
commit 5870c0f261

View File

@ -7,23 +7,15 @@
* For more information, please refer to: https://www.nocobase.com/agreement. * For more information, please refer to: https://www.nocobase.com/agreement.
*/ */
import { BlockModel } from '@nocobase/client';
import { APIResource } from '@nocobase/flow-engine';
import { Card, Spin } from 'antd'; import { Card, Spin } from 'antd';
import React, { createRef } from 'react'; import React, { createRef } from 'react';
import { BlockModel } from '@nocobase/client';
import { CodeEditor } from './CodeEditor'; import { CodeEditor } from './CodeEditor';
function waitForRefCallback<T extends HTMLElement>(ref: React.RefObject<T>, cb: (el: T) => void, timeout = 3000) {
const start = Date.now();
function check() {
if (ref.current) return cb(ref.current);
if (Date.now() - start > timeout) return;
setTimeout(check, 30);
}
check();
}
export class LowcodeBlockFlowModel extends BlockModel { export class LowcodeBlockFlowModel extends BlockModel {
ref = createRef<HTMLDivElement>(); ref = createRef<HTMLDivElement>();
declare resource: APIResource;
render() { render() {
const { loading, error } = this.props; const { loading, error } = this.props;
@ -44,7 +36,7 @@ export class LowcodeBlockFlowModel extends BlockModel {
<div style={{ marginTop: '8px' }}>Loading lowcode component...</div> <div style={{ marginTop: '8px' }}>Loading lowcode component...</div>
</div> </div>
)} )}
<div ref={this.ref} style={{ width: '100%', minHeight: '200px' }} /> <div ref={this.ref} style={{ width: '100%' }} />
</Card> </Card>
); );
} }
@ -104,6 +96,12 @@ LowcodeBlockFlowModel.registerFlow({
key: 'default', key: 'default',
auto: true, auto: true,
steps: { steps: {
setMainResource: {
handler(ctx) {
ctx.model.resource = new APIResource();
ctx.model.resource.setAPIClient(ctx.globals.api);
},
},
executionStep: { executionStep: {
uiSchema: { uiSchema: {
code: { code: {
@ -175,11 +173,11 @@ element.innerHTML = \`
`.trim(), `.trim(),
}, },
settingMode: 'drawer', settingMode: 'drawer',
async handler(ctx: any, params: any) { title: 'Code',
async handler(ctx, params: any) {
ctx.model.setProps('loading', true); ctx.model.setProps('loading', true);
ctx.model.setProps('error', null); ctx.model.setProps('error', null);
ctx.reactView.onRefReady(ctx.model.ref, async (element: HTMLElement) => {
waitForRefCallback(ctx.model.ref, async (element: HTMLElement) => {
try { try {
// Get requirejs from app context // Get requirejs from app context
const requirejs = ctx.app?.requirejs?.requirejs; const requirejs = ctx.app?.requirejs?.requirejs;