From f8c0a7ac696a5da32890596477ee129c655e2890 Mon Sep 17 00:00:00 2001 From: chenos Date: Mon, 17 Jan 2022 23:05:27 +0800 Subject: [PATCH] feat: improve application demo --- .../src/application/demos/demo2/apiClient.ts | 39 +---- .../src/application/demos/demo2/index.tsx | 8 +- .../src/application/demos/demo2/mock.ts | 135 ++++++++++++++++++ 3 files changed, 142 insertions(+), 40 deletions(-) create mode 100644 packages/client/src/application/demos/demo2/mock.ts diff --git a/packages/client/src/application/demos/demo2/apiClient.ts b/packages/client/src/application/demos/demo2/apiClient.ts index 2999fe756..47135015d 100644 --- a/packages/client/src/application/demos/demo2/apiClient.ts +++ b/packages/client/src/application/demos/demo2/apiClient.ts @@ -1,45 +1,10 @@ import { APIClient } from '@nocobase/client'; -import MockAdapter from 'axios-mock-adapter'; +import mock from './mock'; const apiClient = new APIClient({ baseURL: `${location.protocol}//${location.host}/api/`, }); -const mock = new MockAdapter(apiClient.axios); - -mock.onGet('/app:getLang').reply(200, { - data: { lang: 'en-US' }, -}); - -mock.onGet('/routes:getAccessible').reply(200, { - data: [ - { - type: 'redirect', - from: '/', - to: '/admin', - exact: true, - }, - { - type: 'route', - uiSchemaKey: 'qqzzjakwkwl', - path: '/admin/:name(.+)?', - component: 'AdminLayout', - title: 'NocoBase', - }, - { - type: 'route', - component: 'AuthLayout', - routes: [ - { - type: 'route', - uiSchemaKey: 'dtf9j0b8p9u', - path: '/signin', - component: 'RouteSchemaComponent', - title: '{{t("Sign in")}}', - }, - ], - }, - ], -}); +mock(apiClient); export default apiClient; diff --git a/packages/client/src/application/demos/demo2/index.tsx b/packages/client/src/application/demos/demo2/index.tsx index 42ec61d27..64fe435dd 100644 --- a/packages/client/src/application/demos/demo2/index.tsx +++ b/packages/client/src/application/demos/demo2/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { HashRouter } from 'react-router-dom'; +import { HashRouter, MemoryRouter } from 'react-router-dom'; import { i18n, compose, @@ -11,17 +11,19 @@ import { RouteSwitchProvider, AntdConfigProvider, SchemaComponentProvider, + Menu, } from '@nocobase/client'; import { I18nextProvider } from 'react-i18next'; import { Spin } from 'antd'; import apiClient from './apiClient'; const providers = [ - [HashRouter, {}], + [HashRouter], + // [MemoryRouter, { initialEntries: ['/'] }], [APIClientProvider, { apiClient }], [I18nextProvider, { i18n }], [AntdConfigProvider, { remoteLocale: true }], - [SchemaComponentProvider, { components: {} }], + [SchemaComponentProvider, { components: { Menu } }], [RouteSwitchProvider, { components: { AuthLayout, AdminLayout } }], ]; diff --git a/packages/client/src/application/demos/demo2/mock.ts b/packages/client/src/application/demos/demo2/mock.ts new file mode 100644 index 000000000..51a762918 --- /dev/null +++ b/packages/client/src/application/demos/demo2/mock.ts @@ -0,0 +1,135 @@ +import { APIClient } from '@nocobase/client'; +import MockAdapter from 'axios-mock-adapter'; + +export default (apiClient: APIClient) => { + const mock = new MockAdapter(apiClient.axios); + + mock.onGet('/app:getLang').reply(200, { + data: { lang: 'en-US' }, + }); + + mock.onGet('/ui_schemas:getJsonSchema/item1').reply(200, { + data: { + type: 'void', + name: 'item1', + 'x-uid': 'item1', + 'x-component': 'div', + 'x-content': 'item1', + }, + }); + + mock.onGet('/ui_schemas:getJsonSchema/item2').reply(200, { + data: { + type: 'void', + name: 'item2', + 'x-uid': 'item2', + 'x-component': 'div', + 'x-content': 'item2', + }, + }); + + mock.onGet('/ui_schemas:getJsonSchema/item4').reply(200, { + data: { + type: 'void', + name: 'item4', + 'x-uid': 'item4', + 'x-component': 'div', + 'x-content': 'item4', + }, + }); + + mock.onGet('/ui_schemas:getJsonSchema/item5').reply(200, { + data: { + type: 'void', + name: 'item5', + 'x-uid': 'item5', + 'x-component': 'div', + 'x-content': 'item5', + }, + }); + + mock.onGet('/ui_schemas:getJsonSchema/qqzzjakwkwl').reply(200, { + data: { + type: 'void', + name: 'qqzzjakwkwl', + 'x-uid': 'qqzzjakwkwl', + 'x-component': 'Menu', + 'x-component-props': { + mode: 'horizontal', + theme: 'dark', + onSelect: '{{ onSelect }}', + defaultSelectedUid: '{{ defaultSelectedUid }}', + }, + properties: { + item1: { + type: 'void', + title: 'Menu Item 1', + 'x-uid': 'item1', + 'x-component': 'Menu.Item', + 'x-component-props': {}, + }, + item2: { + type: 'void', + title: 'Menu Item 2', + 'x-uid': 'item2', + 'x-component': 'Menu.Item', + 'x-component-props': {}, + }, + item3: { + type: 'void', + title: 'SubMenu 1', + 'x-uid': 'item3', + 'x-component': 'Menu.SubMenu', + 'x-component-props': {}, + properties: { + item4: { + type: 'void', + title: 'Menu Item 4', + 'x-uid': 'item4', + 'x-component': 'Menu.Item', + 'x-component-props': {}, + }, + item5: { + type: 'void', + title: 'Menu Item 5', + 'x-uid': 'item5', + 'x-component': 'Menu.Item', + 'x-component-props': {}, + }, + }, + }, + }, + }, + }); + + mock.onGet('/routes:getAccessible').reply(200, { + data: [ + { + type: 'redirect', + from: '/', + to: '/admin', + exact: true, + }, + { + type: 'route', + uiSchemaUid: 'qqzzjakwkwl', + path: '/admin/:name(.+)?', + component: 'AdminLayout', + title: 'NocoBase', + }, + { + type: 'route', + component: 'AuthLayout', + routes: [ + { + type: 'route', + uiSchemaUid: 'dtf9j0b8p9u', + path: '/signin', + component: 'RouteSchemaComponent', + title: '{{t("Sign in")}}', + }, + ], + }, + ], + }); +};