@_tc/template-core 0.0.1-bate.9 → 0.0.2

package/fe/frontend/src/defaultPages/SchemaPage/utils/schemaConversion.js

@@ -0,0 +1,115 @@
+import { suffixKey } from '../data';
+import { schemaStore } from '../../../stores/schemaStore';
+/**
+ *
+ * 构建出需要optios + 其他字段
+ */
+const buildSchema = (schema, fieldType) => {
+    if (!schema.properties)
+        return;
+    const temSchema = {
+        type: 'object',
+        properties: {},
+        required: schema.required,
+    };
+    for (const key in schema.properties) {
+        const fieldInfo = schema.properties[key];
+        const fieldKeys = Object.keys(fieldInfo);
+        temSchema.properties[key] = fieldKeys.reduce((o, fieldKey) => {
+            // 为xxxoption
+            if (fieldKey.indexOf(suffixKey) !== -1) {
+                // 需要的option
+                if (fieldKey === `${fieldType}${suffixKey}`) {
+                    o['option'] = fieldInfo[fieldKey];
+                }
+            }
+            // 其余属性
+            else {
+                ;
+                o[fieldKey] = fieldInfo[fieldKey];
+            }
+            return o;
+        }, {});
+    }
+    return temSchema;
+};
+// properties 构建
+// const buildSchema = (data: FieldType, fieldType: AllOptionsPreNames) => {
+//   console.log(data);
+//   const keys = Object.keys(data) as (keyof FieldType)[];
+//   type TargetOptionKey = `${typeof fieldType}${typeof suffixKey}`;
+//   type NewState = Partial<{
+//     [K in NonOptionKey]: FieldType[K];
+//   }> & {
+//     option?: FieldType[TargetOptionKey];
+//   };
+//   const newData = produce<NewState>(data, (temData) => {
+//     const newState: NewState = {
+//       option: undefined,
+//     } as unknown as NewState;
+//     keys.forEach((k) => {
+//       // 是 Option
+//       if (k.indexOf(suffixKey) !== -1) {
+//         // 需要的options
+//         if (k === (`${fieldType}${suffixKey}` as const)) {
+//           newState["option"] = (temData as FieldType)[k];
+//         }
+//       } else {
+//         (newState as any)[k] = (temData as FieldType)[
+//           k
+//         ] as NewState[keyof NewState];
+//       }
+//     });
+//     return newState;
+//   });
+//   return newData;
+// };
+export const schemaConversion = (schema, schemaKey) => {
+    // 存在缓存直接跳过
+    const { schemaCache, setSchemaState } = schemaStore.getState();
+    if (schemaCache.has(schemaKey)) {
+        // 应用缓存
+        setSchemaState({
+            ...schemaCache.get(schemaKey),
+        });
+        return;
+    }
+    const { api, schema: schemaMetadata = {}, componentConfig, tableConfig, searchConfig } = schema;
+    //   整个schema 进行移动
+    const tableSchema = buildSchema(JSON.parse(JSON.stringify(schemaMetadata)), 'table');
+    const searchSchema = buildSchema(JSON.parse(JSON.stringify(schemaMetadata)), 'search');
+    let components = {};
+    //  page components
+    if (componentConfig) {
+        const componentKeys = Object.keys(componentConfig ?? {});
+        components = componentKeys.reduce((o, comKey) => {
+            // 获取组件的 schema
+            const comSchema = buildSchema(JSON.parse(JSON.stringify(schemaMetadata)), comKey);
+            o[comKey] = {
+                schema: comSchema,
+                config: componentConfig[comKey],
+            };
+            return o;
+        }, {});
+    }
+    {
+        const { setSchemaState, updateSchemaCache } = schemaStore.getState();
+        setSchemaState({
+            api,
+            components,
+            tableSchema,
+            tableConfig,
+            searchSchema,
+            searchConfig,
+        });
+        updateSchemaCache({
+            api,
+            schemaKey,
+            components,
+            tableSchema: tableSchema,
+            tableConfig: tableConfig,
+            searchSchema: searchSchema,
+            searchConfig: searchConfig,
+        });
+    }
+};

package/fe/frontend/src/defaultPages/SchemaPage/utils/validator.d.ts

@@ -0,0 +1,7 @@
+import { Ajv } from 'ajv';
+export declare const ajvInstance: Ajv;
+/**
+ * 创建验证器
+ */
+export declare function createAjvValidator(schema: object): (rule: object, value: unknown, callback: (errors?: string[]) => void) => void;
+//# sourceMappingURL=validator.d.ts.map

package/fe/frontend/src/defaultPages/SchemaPage/utils/validator.js

@@ -0,0 +1,36 @@
+import { Ajv } from 'ajv';
+// 初始化 AJV (全局复用)
+export const ajvInstance = new Ajv({ allErrors: true, verbose: true, strict: false });
+/**
+ * 创建验证器
+ */
+export function createAjvValidator(schema) {
+    const validate = ajvInstance.compile(schema);
+    return (rule, value, callback) => {
+        const valid = validate(value);
+        if (valid) {
+            callback();
+        }
+        else {
+            const messages = (validate.errors || []).map(formatError);
+            callback(messages);
+        }
+    };
+}
+// 格式化错误信息
+function formatError(error) {
+    const path = error.instancePath.replace(/^\//, '') || 'value';
+    switch (error.keyword) {
+        case 'required':
+            return `缺少必填字段: ${error.params.missingProperty}`;
+        case 'type':
+            return `${path} 类型错误，期望 ${error.params.type}`;
+        case 'format':
+            return `${path} 格式不正确`;
+        case 'minimum':
+        case 'maximum':
+            return `${path} 超出允许范围`;
+        default:
+            return `${path} ${error.message}`;
+    }
+}

package/fe/frontend/src/defaultPages/SidebarSlotPage/SidebarSlotContainer.d.ts

@@ -0,0 +1,10 @@
+import { BaseMenuType } from '../../../../model/types/menuType';
+import { MenuItemData } from '../../../../packages/ui/react/components';
+interface SidebarSlotContainerProps {
+    prefixPath: string;
+    rawMenuData: BaseMenuType[];
+    menuItems: MenuItemData[];
+}
+declare const SidebarSlotContainer: (props: SidebarSlotContainerProps) => import("react/jsx-runtime").JSX.Element;
+export default SidebarSlotContainer;
+//# sourceMappingURL=SidebarSlotContainer.d.ts.map

package/fe/frontend/src/defaultPages/SidebarSlotPage/SidebarSlotContainer.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { logPageNotFound } from '../../common/logFn';
+import { findMenuItem, QK } from '../../common/menu';
+import useRouterParams from '../../hooks/useRouterParams';
+import { Menu } from '../../../../packages/ui/react/components';
+import { useEffect, useState } from 'react';
+import { Outlet, useNavigate } from 'react-router-dom';
+const SidebarSlotContainer = (props) => {
+    const { prefixPath, rawMenuData, menuItems } = props;
+    const params = useRouterParams();
+    const [SK, uSK] = useState(params[QK.sk]);
+    const nav = useNavigate();
+    //  menu 初始化选中
+    useEffect(() => {
+        /**
+         * 如果没有 sidebar key 说明当前是 自定义路由
+         * 则需要获取 query 中的 ck 来查找 menuinfo
+         */
+        if (!params[QK.sk]) {
+            if (params[QK.ck]) {
+                const m = findMenuItem(rawMenuData, params[QK.ck]);
+                if (m) {
+                    uSK(m.key);
+                    return;
+                }
+            }
+            // 运行到这 说明
+            // 异常路径
+            logPageNotFound();
+        }
+    }, [rawMenuData, params]);
+    return (_jsxs("div", { className: "sidebar-slot flex h-full w-full gap-0 overflow-hidden bg-theme-bg", children: [_jsx("div", { className: "sidebar-slot-container flex h-full shrink-0 border-r border-border/70 bg-background/70 px-2 py-2", children: _jsx(Menu, { className: "sidebar-shell-menu", items: menuItems, selectedKey: SK, onSelect: (e) => {
+                        const m = findMenuItem(rawMenuData, e);
+                        uSK(e);
+                        nav({ ...m.path, pathname: prefixPath + m.path.pathname });
+                    } }) }), _jsx("div", { className: "min-w-0 flex-1 overflow-hidden", children: _jsx(Outlet, {}) })] }));
+};
+export default SidebarSlotContainer;

package/fe/frontend/src/defaultPages/SidebarSlotPage/index.d.ts

@@ -0,0 +1,3 @@
+declare const SidebarSlotPage: () => import("react/jsx-runtime").JSX.Element;
+export default SidebarSlotPage;
+//# sourceMappingURL=index.d.ts.map

package/fe/frontend/src/defaultPages/SidebarSlotPage/index.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { generateMenuItemData } from '../../common/generateMenuData';
+import { QK } from '../../common/menu';
+import useCurrentMenuData from '../../hooks/useCurrentMenuData';
+import { useMemo } from 'react';
+import { useParams } from 'react-router-dom';
+import SidebarSlotContainer from './SidebarSlotContainer';
+const SidebarSlotPage = () => {
+    const params = useParams();
+    // top left 从当前路由中获取到 sidebarConfig中的数据
+    const { menu: parentMenuInfo } = useCurrentMenuData();
+    const prefixPath = useMemo(() => `/${params[QK.k]}`, [params[QK.k]]);
+    const menuItem = generateMenuItemData(parentMenuInfo?.sidebarConfig?.menu ?? []);
+    return (_jsx(SidebarSlotContainer, { menuItems: menuItem, rawMenuData: parentMenuInfo?.sidebarConfig.menu, prefixPath: prefixPath }));
+};
+export default SidebarSlotPage;

package/fe/frontend/src/defaultPages/SidebarSlotPageTmp.d.ts

@@ -0,0 +1,3 @@
+declare const SidebarSlotPageTmp: () => import("react/jsx-runtime").JSX.Element;
+export default SidebarSlotPageTmp;
+//# sourceMappingURL=SidebarSlotPageTmp.d.ts.map

package/fe/frontend/src/defaultPages/SidebarSlotPageTmp.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { generateMenuItemData } from '../common/generateMenuData';
+import { leftSidebarBasePath } from '../common/menu';
+import SidebarSlotContainer from '../defaultPages/SidebarSlotPage/SidebarSlotContainer';
+import { useModeStore } from '../stores/mode';
+import { useMemo } from 'react';
+const SidebarSlotPageTmp = () => {
+    const projInfo = useModeStore((s) => s.projectInfo);
+    const [menuItems, rawMenuData] = useMemo(() => {
+        if (projInfo) {
+            return [generateMenuItemData(projInfo.menu), projInfo.menu];
+        }
+        return [[], []];
+    }, []);
+    return (_jsx(SidebarSlotContainer, { prefixPath: '/' + leftSidebarBasePath, rawMenuData: rawMenuData, menuItems: menuItems }));
+};
+export default SidebarSlotPageTmp;

package/fe/frontend/src/defaultPages/SlotPage/index.d.ts

@@ -0,0 +1,3 @@
+declare const SlotPage: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+export default SlotPage;
+//# sourceMappingURL=index.d.ts.map

package/fe/frontend/src/defaultPages/SlotPage/index.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo, useMemo } from 'react';
+import { logPageNotFound } from '../../common/logFn';
+import useCurrentMenuData from '../../hooks/useCurrentMenuData';
+import Iframe from '../Iframe';
+import Schema from '../SchemaPage';
+const SlotPage = memo(() => {
+    const { menu } = useCurrentMenuData(true);
+    const RenderDom = useMemo(() => {
+        if (menu?.moduleType === 'iframe') {
+            return _jsx(Iframe, {});
+        }
+        else if (menu?.moduleType === 'schema') {
+            return _jsx(Schema, {});
+        }
+        else {
+            // 运行到这 说明异常路径
+            // 自定义路径会在进入这之前被拦截;
+            logPageNotFound();
+            return _jsx("div", { children: "404" });
+        }
+    }, [menu?.moduleType]);
+    return RenderDom;
+});
+SlotPage.displayName = 'SlotPage';
+export default SlotPage;

package/fe/frontend/src/exportStore.d.ts

@@ -0,0 +1,17 @@
+/**
+ * mode 数据
+ */
+export * from './stores/mode';
+/**
+ *  callcom 与SchemaPage 通信
+ */
+export * from './stores/schemaEventBus';
+/**
+ * 获取 schema 数据
+ */
+export * from './stores/schemaStore';
+/**
+ * 请求冻结处理仓库
+ */
+export * from './stores/apiFreezer';
+//# sourceMappingURL=exportStore.d.ts.map

package/fe/frontend/src/exportStore.js

@@ -0,0 +1,16 @@
+/**
+ * mode 数据
+ */
+export * from './stores/mode';
+/**
+ *  callcom 与SchemaPage 通信
+ */
+export * from './stores/schemaEventBus';
+/**
+ * 获取 schema 数据
+ */
+export * from './stores/schemaStore';
+/**
+ * 请求冻结处理仓库
+ */
+export * from './stores/apiFreezer';

package/fe/frontend/src/hooks/useCurrentMenuData.d.ts

@@ -0,0 +1,19 @@
+import { BasicModuleType, SidebarModuleType } from '../../../model/types/menuType';
+/**
+ *
+ * 自定义路由直接交由路由器渲染
+ *
+ * 也就是说 这里找不到 自定义相关的菜单数据
+ *
+ * @param useSibe 使用侧边数据
+ */
+declare const useCurrentMenuData: <T = {
+    moduleType: BasicModuleType["moduleType"];
+    sidebarConfig: SidebarModuleType["sidebarConfig"];
+}>(useSibe?: boolean) => {
+    menu: T & {
+        moduleType: BasicModuleType["moduleType"];
+    };
+};
+export default useCurrentMenuData;
+//# sourceMappingURL=useCurrentMenuData.d.ts.map

package/fe/frontend/src/hooks/useCurrentMenuData.js

@@ -0,0 +1,28 @@
+import { findMenuItem, QK } from '../common/menu';
+import { useModeStore } from '../stores/mode';
+import { useMemo } from 'react';
+import { useParams } from 'react-router-dom';
+/**
+ *
+ * 自定义路由直接交由路由器渲染
+ *
+ * 也就是说 这里找不到 自定义相关的菜单数据
+ *
+ * @param useSibe 使用侧边数据
+ */
+const useCurrentMenuData = (useSibe = false) => {
+    const params = useParams();
+    const projectInfo = useModeStore((s) => s.projectInfo);
+    const menu = useMemo(() => {
+        const isSide = params[QK.sk];
+        const menuTypeIsTop = !!params[QK.k];
+        const menu = findMenuItem(projectInfo?.menu, menuTypeIsTop ? params[QK.k] : params[QK.sk]);
+        if (isSide && useSibe && menuTypeIsTop) {
+            const sMenu = findMenuItem(menu.sidebarConfig?.menu ?? [], params[QK.sk]);
+            return sMenu;
+        }
+        return menu;
+    }, [projectInfo?.menu, params]);
+    return { menu: menu };
+};
+export default useCurrentMenuData;

package/fe/frontend/src/hooks/useRouterParams.d.ts

@@ -0,0 +1,5 @@
+declare const useRouterParams: <T extends Record<string, string>>() => Readonly<[T] extends [string] ? import("react-router-dom").Params<T> : Partial<T>> & {
+    custk?: string | undefined;
+};
+export default useRouterParams;
+//# sourceMappingURL=useRouterParams.d.ts.map

package/fe/frontend/src/hooks/useRouterParams.js

@@ -0,0 +1,11 @@
+import { deserializationUrlSearch, QK } from '../common/menu';
+import { useMemo } from 'react';
+import { useParams } from 'react-router-dom';
+const useRouterParams = () => {
+    const params = useParams();
+    return useMemo(() => {
+        const query = deserializationUrlSearch(location.search);
+        return { ...params, ...(query[QK.ck] ? { [QK.ck]: query[QK.ck] } : {}) };
+    }, [params]);
+};
+export default useRouterParams;

package/fe/frontend/src/index.d.ts

@@ -0,0 +1,16 @@
+import './typing/scalability';
+export type * from '../apps/dash/types';
+export * from './main';
+export type { CallComComponentsMap, CallComRenderer } from './defaultPages/SchemaPage/schemaType';
+export type { FormFieldSchema, SchemaFormComponentsMap, SchemaFormNamespace, SelectProps } from '../../packages/ui/react';
+export { del, get, patch, post, put, request } from './common/request';
+/**
+ * callCom 事件通信 权限
+ */
+export * from './defaultPages/SchemaPage/data/eventInfo';
+export { merge } from './defaultPages/SchemaPage/utils/permissions';
+/**
+ * 导出依赖的 共享数据
+ */
+export * from './exportStore';
+//# sourceMappingURL=index.d.ts.map

package/fe/frontend/src/index.js

@@ -0,0 +1,13 @@
+import './typing/scalability';
+export * from './main';
+// 导出请求方法
+export { del, get, patch, post, put, request } from './common/request';
+/**
+ * callCom 事件通信 权限
+ */
+export * from './defaultPages/SchemaPage/data/eventInfo';
+export { merge } from './defaultPages/SchemaPage/utils/permissions';
+/**
+ * 导出依赖的 共享数据
+ */
+export * from './exportStore';

package/fe/frontend/src/main.css

@@ -0,0 +1,96 @@
+@import "../packages/ui/react/index.css";
+
+/* 内容扫描 */
+/* enhancedComponents */
+@source "./**/*.{js,ts,jsx,tsx}";
+
+.dark {
+    --background: 238 12% 7%;
+    --foreground: 225 16% 92%;
+    --card: 238 11% 8%;
+    --card-foreground: 225 16% 92%;
+    --popover: 238 11% 8%;
+    --popover-foreground: 225 16% 92%;
+    --primary: 225 16% 92%;
+    --primary-foreground: 238 12% 9%;
+    --secondary: 235 10% 15%;
+    --secondary-foreground: 225 16% 90%;
+    --muted: 235 10% 17%;
+    --muted-foreground: 228 9% 66%;
+    --accent: 226 16% 18%;
+    --accent-foreground: 225 16% 92%;
+    --border: 235 10% 20%;
+    --input: 235 10% 20%;
+    --ring: 225 16% 72%;
+
+    --theme-primary: 225 16% 92%;
+    --theme-primary-foreground: 238 12% 9%;
+    --theme-bg: 238 13% 9%;
+    --theme-text: 225 16% 92%;
+
+    --table-header-bg: 235 9% 18%;
+    --table-header-text: 228 10% 72%;
+    --table-head-text: 228 10% 72%;
+    --table-cell-text: 225 16% 90%;
+    --table-action-bg: 235 9% 19%;
+    --table-action-text: 225 16% 86%;
+}
+
+* {
+    scrollbar-color: hsl(var(--muted-foreground) / 0.34) transparent;
+    scrollbar-width: thin;
+}
+
+*::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+}
+
+*::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+*::-webkit-scrollbar-thumb {
+    min-height: 40px;
+    border: 3px solid transparent;
+    border-radius: 999px;
+    background: hsl(var(--muted-foreground) / 0.28);
+    background-clip: padding-box;
+}
+
+*::-webkit-scrollbar-thumb:hover {
+    background: hsl(var(--muted-foreground) / 0.46);
+    background-clip: padding-box;
+}
+
+*::-webkit-scrollbar-corner {
+    background: transparent;
+}
+
+.sidebar-shell-menu.tc-ui-menu {
+    width: 168px;
+    height: 100%;
+    border-radius: 0;
+    background: transparent;
+    box-shadow: none;
+}
+
+.sidebar-shell-menu .menuitem,
+.sidebar-shell-menu .subMenuItem {
+    border-radius: 8px;
+    color: hsl(var(--muted-foreground));
+    font-weight: 500;
+}
+
+.sidebar-shell-menu .menuitem:hover,
+.sidebar-shell-menu .subMenuItem:hover {
+    background: hsl(var(--muted) / 0.42);
+    color: hsl(var(--foreground));
+}
+
+.sidebar-shell-menu .menuitem.bg-theme,
+.sidebar-shell-menu .subMenuItem.bg-theme\/10 {
+    background: hsl(var(--foreground) / 0.08);
+    color: hsl(var(--foreground));
+    box-shadow: inset 0 0 0 1px hsl(var(--border) / 0.8);
+}

package/fe/frontend/src/main.d.ts

@@ -0,0 +1,27 @@
+import type { JSX } from 'react/jsx-runtime';
+import { RouteInfo } from './components/Router';
+import { RouterType } from './components/Router/type';
+import { type ReactNode } from 'react';
+import './main.css';
+import './typing/window';
+export declare const initApp: (
+/**
+ * ## ⚠️ ‼️如果你有配置路由，一定要渲染 children
+ * 根组件函数
+ *
+ */
+RootComponent: (props: {
+    children: Exclude<ReactNode, null | undefined>;
+}) => JSX.Element, options?: {
+    routes?: RouteInfo[];
+    routerType?: RouterType;
+    modelType?: string;
+    /**
+     * - 初始化 model 数据
+     * - 默认开启
+     * - modelType 为 MD 时 默认开启
+     * @default true
+     */
+    initModeData?: boolean;
+}) => void;
+//# sourceMappingURL=main.d.ts.map

package/fe/frontend/src/main.js

@@ -0,0 +1,72 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { generateRouter } from './components/Router';
+import { createRoot } from 'react-dom/client';
+import { renderImportComponent } from './common/importComponent';
+import { modeStore } from './exportStore';
+import './main.css';
+import './typing/window';
+const renderRouter = async ({ routerDom, requestModelData }) => {
+    if (requestModelData) {
+        const { initModeData } = modeStore.getState();
+        if (!modeStore.getState().initData) {
+            await new Promise((resolve, reject) => {
+                let settled = false;
+                let unsubscribe = () => { };
+                const done = () => {
+                    if (settled)
+                        return;
+                    settled = true;
+                    unsubscribe();
+                    resolve();
+                };
+                const fail = (error) => {
+                    if (settled)
+                        return;
+                    settled = true;
+                    unsubscribe();
+                    reject(error);
+                };
+                unsubscribe = modeStore.subscribe((ns) => {
+                    if (ns.initData) {
+                        done();
+                    }
+                });
+                let initResult;
+                try {
+                    initResult = initModeData();
+                }
+                catch (error) {
+                    fail(error);
+                    return;
+                }
+                Promise.resolve(initResult).then(() => {
+                    if (modeStore.getState().initData) {
+                        done();
+                    }
+                }, fail);
+            });
+        }
+    }
+    return { default: () => _jsx(_Fragment, { children: routerDom }) };
+};
+export const initApp = (
+/**
+ * ## ⚠️ ‼️如果你有配置路由，一定要渲染 children
+ * 根组件函数
+ *
+ */
+RootComponent, options) => {
+    console.log('initApp');
+    const root = createRoot(document.getElementById('root'));
+    const { routerType = 'browser', routes: pRoutes = [], initModeData = true, modelType = 'MD' } = options ?? {};
+    const routes = [...pRoutes];
+    const usedRouter = !!routes.length;
+    let routerDom;
+    if (usedRouter) {
+        routerDom = generateRouter(routes, routerType);
+    }
+    // 创建路由组件
+    const Component = renderImportComponent(renderRouter({ routerDom, requestModelData: initModeData || modelType === 'MD' }));
+    // 挂载 根节点
+    root.render(_jsx(RootComponent, { children: Component }));
+};