feat(core,data-source): 数据源支持mock

Tencent · Oct 2, 2023 · 4c46a4e · 4c46a4e
1 parent 56dfacb
commit 4c46a4e
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 19 deletions.
diff --git a/packages/core/src/App.ts b/packages/core/src/App.ts
@@ -48,6 +48,7 @@ interface AppOptionsConfig {
   jsEngine?: 'browser' | 'hippy';
   designWidth?: number;
   curPage?: Id;
+  useMock?: boolean;
   transformStyle?: (style: Record<string, any>) => Record<string, any>;
   request?: RequestFunction;
 }
@@ -66,6 +67,7 @@ class App extends EventEmitter implements AppCore {
 
   public page?: Page;
 
+  public useMock = false;
   public platform = 'mobile';
   public jsEngine = 'browser';
   public designWidth = 375;
@@ -86,6 +88,10 @@ class App extends EventEmitter implements AppCore {
     options.platform && (this.platform = options.platform);
     options.jsEngine && (this.jsEngine = options.jsEngine);
 
+    if (typeof options.useMock === 'boolean') {
+      this.useMock = options.useMock;
+    }
+
     if (typeof options.designWidth !== 'undefined') {
       this.setDesignWidth(options.designWidth);
     }
@@ -174,7 +180,7 @@ class App extends EventEmitter implements AppCore {
       this.dataSourceManager.destroy();
     }
 
-    this.dataSourceManager = createDataSourceManager(this);
+    this.dataSourceManager = createDataSourceManager(this, this.useMock);
 
     this.codeDsl = config.codeBlocks;
     this.setPage(curPage || this.page?.data?.id);

diff --git a/packages/data-source/src/DataSourceManager.ts b/packages/data-source/src/DataSourceManager.ts
@@ -43,21 +43,21 @@ class DataSourceManager extends EventEmitter {
 
   public data: DataSourceManagerData = {};
 
-  constructor({ app }: DataSourceManagerOptions) {
+  constructor({ app, useMock }: DataSourceManagerOptions) {
     super();
 
     this.app = app;
 
     app.dsl?.dataSources?.forEach((config) => {
-      this.addDataSource(config);
+      this.addDataSource(config, useMock);
     });
   }
 
   public get(id: string) {
     return this.dataSourceMap.get(id);
   }
 
-  public async addDataSource(config?: DataSourceSchema) {
+  public async addDataSource(config?: DataSourceSchema, useMock?: boolean) {
     if (!config) return;
 
     let ds: DataSource;
@@ -66,6 +66,7 @@ class DataSourceManager extends EventEmitter {
         app: this.app,
         schema: config as HttpDataSourceSchema,
         request: this.app.request,
+        useMock,
       });
     } else {
       // eslint-disable-next-line @typescript-eslint/naming-convention
@@ -74,13 +75,18 @@ class DataSourceManager extends EventEmitter {
       ds = new DataSourceClass({
         app: this.app,
         schema: config,
+        useMock,
       });
     }
 
     this.dataSourceMap.set(config.id, ds);
 
     this.data[ds.id] = ds.data;
 
+    ds.on('change', () => {
+      this.setData(ds);
+    });
+
     const beforeInit: ((...args: any[]) => any)[] = [];
     const afterInit: ((...args: any[]) => any)[] = [];
 
@@ -103,12 +109,6 @@ class DataSourceManager extends EventEmitter {
     for (const method of afterInit) {
       await method({ params: {}, dataSource: ds, app: this.app });
     }
-
-    this.setData(ds);
-
-    ds.on('change', () => {
-      this.setData(ds);
-    });
   }
 
   public setData(ds: DataSource) {

diff --git a/packages/data-source/src/createDataSourceManager.ts b/packages/data-source/src/createDataSourceManager.ts
@@ -28,11 +28,11 @@ import DataSourceManager from './DataSourceManager';
  * @param httpDataSourceOptions http 数据源配置
  * @returns DataSourceManager
  */
-export const createDataSourceManager = (app: AppCore) => {
+export const createDataSourceManager = (app: AppCore, useMock?: boolean) => {
   const { dsl, platform } = app;
   if (!dsl?.dataSources) return;
 
-  const dataSourceManager = new DataSourceManager({ app });
+  const dataSourceManager = new DataSourceManager({ app, useMock });
 
   if (dsl.dataSources && dsl.dataSourceCondDeps && platform !== 'editor') {
     getNodes(getDepNodeIds(dsl.dataSourceCondDeps), dsl.items).forEach((node) => {

diff --git a/packages/data-source/src/data-sources/Base.ts b/packages/data-source/src/data-sources/Base.ts
@@ -17,7 +17,7 @@
  */
 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 type { DataSourceOptions } from '@data-source/types';
@@ -36,6 +36,8 @@ export default class DataSource extends EventEmitter {
 
   public app: AppCore;
 
+  protected mockData?: MockSchema;
+
   private fields: DataSchema[] = [];
   private methods: CodeBlockContent[] = [];
 
@@ -47,7 +49,15 @@ export default class DataSource extends EventEmitter {
     this.setFields(options.schema.fields);
     this.setMethods(options.schema.methods || []);
 
+    if (typeof options.useMock === 'boolean' && options.useMock) {
+      this.mockData = options.schema.mocks?.find((mock) => mock.enable);
+    }
+
     this.updateDefaultData();
+
+    if (this.mockData) {
+      this.setData(this.mockData.data);
+    }
   }
 
   public setFields(fields: DataSchema[]) {

diff --git a/packages/data-source/src/data-sources/Http.ts b/packages/data-source/src/data-sources/Http.ts
@@ -123,10 +123,12 @@ export default class HttpDataSource extends DataSource {
         await method({ options, params: {}, dataSource: this, app: this.app });
       }
 
-      const res = await this.fetch?.({
-        ...this.httpOptions,
-        ...options,
-      });
+      const res = this.mockData
+        ? this.mockData.data
+        : await this.fetch?.({
+            ...this.httpOptions,
+            ...options,
+          });
 
       for (const method of this.afterRequest) {
         await method({ res, options, params: {}, dataSource: this, app: this.app });

diff --git a/packages/data-source/src/types.ts b/packages/data-source/src/types.ts
@@ -3,6 +3,7 @@ import type { AppCore, DataSourceSchema, HttpOptions, RequestFunction } from '@t
 export interface DataSourceOptions {
   schema: DataSourceSchema;
   app: AppCore;
+  useMock?: boolean;
 }
 
 export interface HttpDataSourceSchema extends DataSourceSchema {
@@ -14,14 +15,14 @@ export interface HttpDataSourceSchema extends DataSourceSchema {
   autoFetch?: boolean;
 }
 
-export interface HttpDataSourceOptions {
+export interface HttpDataSourceOptions extends DataSourceOptions {
   schema: HttpDataSourceSchema;
-  app: AppCore;
   request?: RequestFunction;
 }
 
 export interface DataSourceManagerOptions {
   app: AppCore;
+  useMock?: boolean;
 }
 
 export interface DataSourceManagerData {