mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2025-09-14 15:51:55 +08:00
feat(core,data-source): 数据源支持mock
This commit is contained in:
parent
56dfacbaaa
commit
4c46a4e575
@ -48,6 +48,7 @@ interface AppOptionsConfig {
|
|||||||
jsEngine?: 'browser' | 'hippy';
|
jsEngine?: 'browser' | 'hippy';
|
||||||
designWidth?: number;
|
designWidth?: number;
|
||||||
curPage?: Id;
|
curPage?: Id;
|
||||||
|
useMock?: boolean;
|
||||||
transformStyle?: (style: Record<string, any>) => Record<string, any>;
|
transformStyle?: (style: Record<string, any>) => Record<string, any>;
|
||||||
request?: RequestFunction;
|
request?: RequestFunction;
|
||||||
}
|
}
|
||||||
@ -66,6 +67,7 @@ class App extends EventEmitter implements AppCore {
|
|||||||
|
|
||||||
public page?: Page;
|
public page?: Page;
|
||||||
|
|
||||||
|
public useMock = false;
|
||||||
public platform = 'mobile';
|
public platform = 'mobile';
|
||||||
public jsEngine = 'browser';
|
public jsEngine = 'browser';
|
||||||
public designWidth = 375;
|
public designWidth = 375;
|
||||||
@ -86,6 +88,10 @@ class App extends EventEmitter implements AppCore {
|
|||||||
options.platform && (this.platform = options.platform);
|
options.platform && (this.platform = options.platform);
|
||||||
options.jsEngine && (this.jsEngine = options.jsEngine);
|
options.jsEngine && (this.jsEngine = options.jsEngine);
|
||||||
|
|
||||||
|
if (typeof options.useMock === 'boolean') {
|
||||||
|
this.useMock = options.useMock;
|
||||||
|
}
|
||||||
|
|
||||||
if (typeof options.designWidth !== 'undefined') {
|
if (typeof options.designWidth !== 'undefined') {
|
||||||
this.setDesignWidth(options.designWidth);
|
this.setDesignWidth(options.designWidth);
|
||||||
}
|
}
|
||||||
@ -174,7 +180,7 @@ class App extends EventEmitter implements AppCore {
|
|||||||
this.dataSourceManager.destroy();
|
this.dataSourceManager.destroy();
|
||||||
}
|
}
|
||||||
|
|
||||||
this.dataSourceManager = createDataSourceManager(this);
|
this.dataSourceManager = createDataSourceManager(this, this.useMock);
|
||||||
|
|
||||||
this.codeDsl = config.codeBlocks;
|
this.codeDsl = config.codeBlocks;
|
||||||
this.setPage(curPage || this.page?.data?.id);
|
this.setPage(curPage || this.page?.data?.id);
|
||||||
|
@ -43,13 +43,13 @@ class DataSourceManager extends EventEmitter {
|
|||||||
|
|
||||||
public data: DataSourceManagerData = {};
|
public data: DataSourceManagerData = {};
|
||||||
|
|
||||||
constructor({ app }: DataSourceManagerOptions) {
|
constructor({ app, useMock }: DataSourceManagerOptions) {
|
||||||
super();
|
super();
|
||||||
|
|
||||||
this.app = app;
|
this.app = app;
|
||||||
|
|
||||||
app.dsl?.dataSources?.forEach((config) => {
|
app.dsl?.dataSources?.forEach((config) => {
|
||||||
this.addDataSource(config);
|
this.addDataSource(config, useMock);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -57,7 +57,7 @@ class DataSourceManager extends EventEmitter {
|
|||||||
return this.dataSourceMap.get(id);
|
return this.dataSourceMap.get(id);
|
||||||
}
|
}
|
||||||
|
|
||||||
public async addDataSource(config?: DataSourceSchema) {
|
public async addDataSource(config?: DataSourceSchema, useMock?: boolean) {
|
||||||
if (!config) return;
|
if (!config) return;
|
||||||
|
|
||||||
let ds: DataSource;
|
let ds: DataSource;
|
||||||
@ -66,6 +66,7 @@ class DataSourceManager extends EventEmitter {
|
|||||||
app: this.app,
|
app: this.app,
|
||||||
schema: config as HttpDataSourceSchema,
|
schema: config as HttpDataSourceSchema,
|
||||||
request: this.app.request,
|
request: this.app.request,
|
||||||
|
useMock,
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||||
@ -74,6 +75,7 @@ class DataSourceManager extends EventEmitter {
|
|||||||
ds = new DataSourceClass({
|
ds = new DataSourceClass({
|
||||||
app: this.app,
|
app: this.app,
|
||||||
schema: config,
|
schema: config,
|
||||||
|
useMock,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -81,6 +83,10 @@ class DataSourceManager extends EventEmitter {
|
|||||||
|
|
||||||
this.data[ds.id] = ds.data;
|
this.data[ds.id] = ds.data;
|
||||||
|
|
||||||
|
ds.on('change', () => {
|
||||||
|
this.setData(ds);
|
||||||
|
});
|
||||||
|
|
||||||
const beforeInit: ((...args: any[]) => any)[] = [];
|
const beforeInit: ((...args: any[]) => any)[] = [];
|
||||||
const afterInit: ((...args: any[]) => any)[] = [];
|
const afterInit: ((...args: any[]) => any)[] = [];
|
||||||
|
|
||||||
@ -103,12 +109,6 @@ class DataSourceManager extends EventEmitter {
|
|||||||
for (const method of afterInit) {
|
for (const method of afterInit) {
|
||||||
await method({ params: {}, dataSource: ds, app: this.app });
|
await method({ params: {}, dataSource: ds, app: this.app });
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setData(ds);
|
|
||||||
|
|
||||||
ds.on('change', () => {
|
|
||||||
this.setData(ds);
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public setData(ds: DataSource) {
|
public setData(ds: DataSource) {
|
||||||
|
@ -28,11 +28,11 @@ import DataSourceManager from './DataSourceManager';
|
|||||||
* @param httpDataSourceOptions http 数据源配置
|
* @param httpDataSourceOptions http 数据源配置
|
||||||
* @returns DataSourceManager
|
* @returns DataSourceManager
|
||||||
*/
|
*/
|
||||||
export const createDataSourceManager = (app: AppCore) => {
|
export const createDataSourceManager = (app: AppCore, useMock?: boolean) => {
|
||||||
const { dsl, platform } = app;
|
const { dsl, platform } = app;
|
||||||
if (!dsl?.dataSources) return;
|
if (!dsl?.dataSources) return;
|
||||||
|
|
||||||
const dataSourceManager = new DataSourceManager({ app });
|
const dataSourceManager = new DataSourceManager({ app, useMock });
|
||||||
|
|
||||||
if (dsl.dataSources && dsl.dataSourceCondDeps && platform !== 'editor') {
|
if (dsl.dataSources && dsl.dataSourceCondDeps && platform !== 'editor') {
|
||||||
getNodes(getDepNodeIds(dsl.dataSourceCondDeps), dsl.items).forEach((node) => {
|
getNodes(getDepNodeIds(dsl.dataSourceCondDeps), dsl.items).forEach((node) => {
|
||||||
|
@ -17,7 +17,7 @@
|
|||||||
*/
|
*/
|
||||||
import EventEmitter from 'events';
|
import EventEmitter from 'events';
|
||||||
|
|
||||||
import type { AppCore, CodeBlockContent, DataSchema } from '@tmagic/schema';
|
import type { AppCore, CodeBlockContent, DataSchema, MockSchema } from '@tmagic/schema';
|
||||||
import { getDefaultValueFromFields } from '@tmagic/utils';
|
import { getDefaultValueFromFields } from '@tmagic/utils';
|
||||||
|
|
||||||
import type { DataSourceOptions } from '@data-source/types';
|
import type { DataSourceOptions } from '@data-source/types';
|
||||||
@ -36,6 +36,8 @@ export default class DataSource extends EventEmitter {
|
|||||||
|
|
||||||
public app: AppCore;
|
public app: AppCore;
|
||||||
|
|
||||||
|
protected mockData?: MockSchema;
|
||||||
|
|
||||||
private fields: DataSchema[] = [];
|
private fields: DataSchema[] = [];
|
||||||
private methods: CodeBlockContent[] = [];
|
private methods: CodeBlockContent[] = [];
|
||||||
|
|
||||||
@ -47,7 +49,15 @@ export default class DataSource extends EventEmitter {
|
|||||||
this.setFields(options.schema.fields);
|
this.setFields(options.schema.fields);
|
||||||
this.setMethods(options.schema.methods || []);
|
this.setMethods(options.schema.methods || []);
|
||||||
|
|
||||||
|
if (typeof options.useMock === 'boolean' && options.useMock) {
|
||||||
|
this.mockData = options.schema.mocks?.find((mock) => mock.enable);
|
||||||
|
}
|
||||||
|
|
||||||
this.updateDefaultData();
|
this.updateDefaultData();
|
||||||
|
|
||||||
|
if (this.mockData) {
|
||||||
|
this.setData(this.mockData.data);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public setFields(fields: DataSchema[]) {
|
public setFields(fields: DataSchema[]) {
|
||||||
|
@ -123,10 +123,12 @@ export default class HttpDataSource extends DataSource {
|
|||||||
await method({ options, params: {}, dataSource: this, app: this.app });
|
await method({ options, params: {}, dataSource: this, app: this.app });
|
||||||
}
|
}
|
||||||
|
|
||||||
const res = await this.fetch?.({
|
const res = this.mockData
|
||||||
...this.httpOptions,
|
? this.mockData.data
|
||||||
...options,
|
: await this.fetch?.({
|
||||||
});
|
...this.httpOptions,
|
||||||
|
...options,
|
||||||
|
});
|
||||||
|
|
||||||
for (const method of this.afterRequest) {
|
for (const method of this.afterRequest) {
|
||||||
await method({ res, options, params: {}, dataSource: this, app: this.app });
|
await method({ res, options, params: {}, dataSource: this, app: this.app });
|
||||||
|
@ -3,6 +3,7 @@ import type { AppCore, DataSourceSchema, HttpOptions, RequestFunction } from '@t
|
|||||||
export interface DataSourceOptions {
|
export interface DataSourceOptions {
|
||||||
schema: DataSourceSchema;
|
schema: DataSourceSchema;
|
||||||
app: AppCore;
|
app: AppCore;
|
||||||
|
useMock?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface HttpDataSourceSchema extends DataSourceSchema {
|
export interface HttpDataSourceSchema extends DataSourceSchema {
|
||||||
@ -14,14 +15,14 @@ export interface HttpDataSourceSchema extends DataSourceSchema {
|
|||||||
autoFetch?: boolean;
|
autoFetch?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface HttpDataSourceOptions {
|
export interface HttpDataSourceOptions extends DataSourceOptions {
|
||||||
schema: HttpDataSourceSchema;
|
schema: HttpDataSourceSchema;
|
||||||
app: AppCore;
|
|
||||||
request?: RequestFunction;
|
request?: RequestFunction;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DataSourceManagerOptions {
|
export interface DataSourceManagerOptions {
|
||||||
app: AppCore;
|
app: AppCore;
|
||||||
|
useMock?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DataSourceManagerData {
|
export interface DataSourceManagerData {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user