feat(yunti-ui): add some props for Page

yuntijs · Jul 8, 2024 · 8bda982 · 8bda982
1 parent 879100e
commit 8bda982
Show file tree

Hide file tree

Showing 6 changed files with 420 additions and 244 deletions.
diff --git a/packages/shared/src/setters.ts b/packages/shared/src/setters.ts
@@ -1,3 +1,5 @@
+import type { IBaseRendererInstance } from '@alilc/lowcode-renderer-core/lib/types';
+
 /**
  * 所有设置器
  */
@@ -157,3 +159,8 @@ export const STYLE_ONLY_CSS_CODE_PROP = {
     },
   },
 };
+
+export const getSimulatorRenderer = () => {
+  const renderer = (window as any).AliLowCodeEngine.project.simulator.renderer;
+  return renderer[Object.getOwnPropertySymbols(renderer)[0]] as IBaseRendererInstance;
+};
diff --git a/packages/yunti-ui-lowcode-materials/lowcode/Page/meta/breadcrumb.ts b/packages/yunti-ui-lowcode-materials/lowcode/Page/meta/breadcrumb.ts
@@ -0,0 +1,126 @@
+import { IPublicTypeComponentMetadata } from '@alilc/lowcode-types';
+
+import { Setters } from '../../../../shared/src/setters';
+import { COMMON_CONFIGURE_PROPS, getPriority } from '../../utils';
+import { PageBreadcrumbSnippets } from '../snippets';
+
+export const PageBreadcrumbMeta: IPublicTypeComponentMetadata = {
+  title: 'PageBreadcrumb',
+  componentName: 'Page.Breadcrumb',
+  category: '布局',
+  snippets: PageBreadcrumbSnippets,
+  priority: getPriority('Page.Breadcrumb'),
+  devMode: 'proCode',
+  npm: {
+    package: '@yuntijs/ui-lowcode-materials',
+    version: '{{version}}',
+    exportName: 'Page',
+    destructuring: true,
+    subName: 'Breadcrumb',
+  },
+  configure: {
+    props: [
+      ...COMMON_CONFIGURE_PROPS,
+      {
+        title: '常用配置',
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'items',
+            title: {
+              label: '路由栈',
+            },
+            setter: {
+              ...Setters.ArraySetter,
+              props: {
+                itemSetter: {
+                  ...Setters.ObjectSetter,
+                  props: {
+                    config: {
+                      items: [
+                        {
+                          name: 'title',
+                          title: {
+                            label: '名称',
+                          },
+                          isRequired: true,
+                          defaultValue: '名称',
+                          setter: Setters.StringSetter,
+                        },
+                        {
+                          name: 'path',
+                          title: {
+                            label: '拼接路径',
+                            tip: '每一层都会拼接前一个 path 信息，不能和 href 共用',
+                          },
+                          setter: Setters.StringSetter,
+                        },
+                        {
+                          name: 'href',
+                          title: {
+                            label: '链接',
+                            tip: '链接的目的地，不能和 path 共用',
+                          },
+                          setter: Setters.StringSetter,
+                        },
+                      ],
+                    },
+                  },
+                },
+              },
+            },
+          },
+          {
+            name: 'subTitle',
+            title: {
+              label: '副标题',
+              tip: '副标题或描述',
+            },
+            defaultValue: '我是副标题',
+            setter: Setters.StringSetter,
+          },
+          {
+            name: 'bordered',
+            title: {
+              label: '边框',
+            },
+            defaultValue: false,
+            setter: Setters.BoolSetter,
+          },
+          {
+            name: 'divider',
+            title: {
+              label: '分割线',
+              tip: '控制 header 与 content 的分割线，当 bordered 为 true 时，divider 自动设置为 false',
+            },
+            defaultValue: true,
+            setter: Setters.BoolSetter,
+          },
+        ],
+      },
+      {
+        title: '高级配置',
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'separator',
+            title: {
+              label: '分隔符',
+            },
+          },
+        ],
+      },
+    ],
+    supports: {
+      loop: false,
+      condition: true,
+      style: true,
+      events: [],
+    },
+    component: {
+      isContainer: false,
+    },
+  },
+};
diff --git a/packages/yunti-ui-lowcode-materials/lowcode/Page/meta/content.ts b/packages/yunti-ui-lowcode-materials/lowcode/Page/meta/content.ts
@@ -0,0 +1,59 @@
+import { IPublicTypeComponentMetadata } from '@alilc/lowcode-types';
+
+import { Setters } from '../../../../shared/src/setters';
+import { COMMON_CONFIGURE_PROPS, getPriority } from '../../utils';
+import { PageContentSnippets } from '../snippets';
+
+export const PageContentMeta: IPublicTypeComponentMetadata = {
+  title: 'PageContent',
+  componentName: 'Page.Content',
+  category: '布局',
+  snippets: PageContentSnippets,
+  priority: getPriority('Page.Content'),
+  devMode: 'proCode',
+  npm: {
+    package: '@yuntijs/ui-lowcode-materials',
+    version: '{{version}}',
+    exportName: 'Page',
+    destructuring: true,
+    subName: 'Content',
+  },
+  configure: {
+    props: [
+      ...COMMON_CONFIGURE_PROPS,
+      {
+        title: '常用配置',
+        display: 'block',
+        type: 'group',
+        items: [
+          {
+            name: 'vertical',
+            title: {
+              label: '垂直布局',
+            },
+            defaultValue: true,
+            setter: Setters.BoolSetter,
+          },
+          {
+            name: 'gap',
+            title: {
+              label: '间隙',
+              tip: '设置网格之间的间隙',
+            },
+            defaultValue: 16,
+            setter: Setters.NumberSetter,
+          },
+        ],
+      },
+    ],
+    supports: {
+      loop: false,
+      condition: true,
+      style: true,
+      events: [],
+    },
+    component: {
+      isContainer: true,
+    },
+  },
+};