@gct-paas/design 0.1.4-dev.7 → 0.1.4-dev.9

package/es/plugins/design-personal-center/design-personal-center.provider.mjs

@@ -0,0 +1,144 @@
+import { EditorType, PersonalCenterType, t } from '@gct-paas/core';
+import { DesignNodeMode, DesignNodeType, MaterialGroup } from '../../constant/index.mjs';
+import { DesignPersonalCenterNode } from './design-personal-center.data.mjs';
+import { NodeBaseProvider } from '../../provider/node-base/node-base.provider.mjs';
+import '../../provider/design-editor-node/design-editor-node.provider.mjs';
+import { DesignEditorType } from '../../constant/design-editor-type.mjs';
+
+class DesignPersonalCenterProvider extends NodeBaseProvider {
+  mode = DesignNodeMode.CONTAINER;
+  type = DesignNodeType.PERSONAL_CENTER;
+  component = "DesignPersonalCenterComponent";
+  static materialConfig = {
+    group: MaterialGroup.SYSTEM,
+    label: "我的",
+    type: DesignNodeType.PERSONAL_CENTER,
+    icon: "icon-yidongduan-wode",
+    order: 0
+  };
+  model = {
+    type: "edit",
+    noColon: true,
+    children: [
+      {
+        type: "tab",
+        name: "tab",
+        isContainer: true,
+        layout: "flex",
+        navPosition: "center",
+        height: "100%",
+        children: [
+          {
+            name: "pane1",
+            type: "tab-pane",
+            isContainer: true,
+            title: "属性",
+            layout: "grid",
+            children: [
+              {
+                name: "collapse-property",
+                type: "collapse",
+                isContainer: true,
+                layout: "flex",
+                children: [
+                  {
+                    name: "collapse-pane-config",
+                    type: "collapse-pane",
+                    isContainer: true,
+                    layout: "grid",
+                    title: "个人中心配置",
+                    children: [
+                      {
+                        type: "item",
+                        name: "displayContent",
+                        label: "显示内容",
+                        labelPosition: "top",
+                        noColon: true,
+                        dictionary: {
+                          tag: "display content",
+                          mode: "static",
+                          rules: [{ required: true }],
+                          items: [
+                            {
+                              label: t(
+                                `sys.menu.personal.${PersonalCenterType.PROFILE}`
+                              ),
+                              value: PersonalCenterType.PROFILE
+                            },
+                            {
+                              label: t(
+                                `sys.menu.personal.${PersonalCenterType.GENDER}`
+                              ),
+                              value: PersonalCenterType.GENDER
+                            },
+                            {
+                              label: t(
+                                `sys.menu.personal.${PersonalCenterType.ENTERPRISE}`
+                              ),
+                              value: PersonalCenterType.ENTERPRISE
+                            }
+                          ]
+                        },
+                        editor: {
+                          type: EditorType.CHECKBOX,
+                          layout: "column"
+                        }
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            name: "pane2",
+            type: "tab-pane",
+            class: "style-pane",
+            title: "样式",
+            isContainer: true,
+            layout: "grid",
+            children: [
+              {
+                name: "collapse-style",
+                type: "collapse",
+                isContainer: true,
+                layout: "flex",
+                children: [
+                  {
+                    name: "collapse-pane-spacing",
+                    type: "collapse-pane",
+                    isContainer: true,
+                    layout: "grid",
+                    title: "边距",
+                    children: [
+                      {
+                        type: "hidden",
+                        name: "padding"
+                      },
+                      {
+                        type: "item",
+                        name: "margin",
+                        fields: ["margin", "padding"],
+                        editor: {
+                          type: DesignEditorType.STYLE_SPACING,
+                          showArea: ["margin"]
+                        }
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    ]
+  };
+  create(data) {
+    return new DesignPersonalCenterNode(
+      data
+    );
+  }
+}
+
+export { DesignPersonalCenterProvider };

package/es/plugins/design-select-component/components/design-select-component.component.css

@@ -0,0 +1,107 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+.gct-design-select-component--simple {
+  height: 24px;
+  display: inline-block;
+  background-color: rgba(49, 104, 236, 0.08);
+  color: var(--ant-primary-color);
+  font-size: 14px;
+  padding: 0 6px;
+}
+.gct-design-select-component--simple .iconfont {
+  font-size: 12px;
+  margin-left: 6px;
+}
+
+.gct-design-select-component--standard {
+  background-color: #FFF;
+  border-radius: 8px;
+  margin: 14px;
+  padding: 10px;
+  display: flex;
+  align-items: center;
+}
+.gct-design-select-component--standard .gct-design-select-component__icon {
+  width: 24px;
+  height: 24px;
+  margin-right: 8px;
+  flex-shrink: 0;
+}
+
+.gct-design-select-component--standard .gct-design-select-component__label {
+  flex-grow: 1;
+}
+
+.gct-design-select-component--standard .gct-design-select-component__action {
+  font-size: 14px;
+  color: var(--ant-primary-color);
+  cursor: pointer;
+  flex-shrink: 0;
+}
+
+.gct-design-select-component--standard .iconfont {
+  font-size: 12px;
+  margin-left: 6px;
+}

package/es/plugins/design-select-component/components/design-select-component.component.d.ts

@@ -0,0 +1,41 @@
+import { IDesignSelectComponentNodeData } from '../design-select-component.data';
+export declare const DesignSelectComponentComponent: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    readonly count: {
+        readonly type: NumberConstructor;
+        readonly required: true;
+    };
+    readonly data: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode>;
+        readonly required: true;
+    };
+    readonly children: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode[]>;
+        readonly default: () => never[];
+    };
+    readonly parent: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode>;
+    };
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+    model: import('vue').ComputedRef<IDesignSelectComponentNodeData>;
+    renderSimple: () => import("vue/jsx-runtime").JSX.Element;
+    renderStandard: () => import("vue/jsx-runtime").JSX.Element;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    readonly count: {
+        readonly type: NumberConstructor;
+        readonly required: true;
+    };
+    readonly data: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode>;
+        readonly required: true;
+    };
+    readonly children: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode[]>;
+        readonly default: () => never[];
+    };
+    readonly parent: {
+        readonly type: import('vue').PropType<import('../../..').IDesignNode>;
+    };
+}>> & Readonly<{}>, {
+    readonly children: import('../../..').IDesignNode<import('../../..').IDesignNodeData>[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/plugins/design-select-component/components/design-select-component.component.mjs

@@ -0,0 +1,57 @@
+import { defineComponent, createVNode, computed, Fragment, createTextVNode } from 'vue';
+import { useNamespace, t } from '@gct-paas/core';
+import { nodeContainerProps } from '../../../props/index.mjs';
+import './design-select-component.component.css';/* empty css                                        */
+
+const DesignSelectComponentComponent = /* @__PURE__ */ defineComponent({
+  name: 'DesignSelectComponentComponent',
+  props: nodeContainerProps,
+  setup(defProps) {
+    const ns = useNamespace('design-select-component');
+    const model = computed(() => defProps.data.data);
+    const renderSimple = () => {
+      return createVNode(Fragment, null, [createVNode("span", null, [t('sys.appDesigner.designView.components.select.sampleText')]), createVNode("span", null, [createVNode("i", {
+        "class": "iconfont icon-a-Rightarrow"
+      }, null)])]);
+    };
+    const renderStandard = () => {
+      return createVNode(Fragment, null, [createVNode("span", {
+        "class": ns.e('icon')
+      }, [createVNode("svg", {
+        "class": "icon",
+        "viewBox": "0 0 1024 1024",
+        "version": "1.1",
+        "xmlns": "http://www.w3.org/2000/svg",
+        "width": "24",
+        "height": "24"
+      }, [createVNode("path", {
+        "d": "M20.48 20.48m163.84 0l655.36 0q163.84 0 163.84 163.84l0 655.36q0 163.84-163.84 163.84l-655.36 0q-163.84 0-163.84-163.84l0-655.36q0-163.84 163.84-163.84Z",
+        "fill": "#3168EC",
+        "p-id": "16585"
+      }, null), createVNode("path", {
+        "d": "M245.76 303.63648a26.13248 26.13248 0 0 1 30.96576-25.72288H747.27424a26.13248 26.13248 0 0 1 30.96576 25.68192V730.3168c0 6.02112-2.048 11.55072-5.48864 15.9744a26.17344 26.17344 0 0 1-25.55904 20.72576H276.56192c-8.6016 0-16.1792-4.13696-20.97152-10.52672a26.09152 26.09152 0 0 1-9.8304-20.48V303.67744z m52.30592 411.07456h427.86816V330.21952H298.06592v384.49152z m284.22144-347.99616l90.9312 58.49088-90.9312 59.8016v-37.02784l-183.00928-0.04096v23.7568a22.7328 22.7328 0 0 1-18.6368 22.40512l-4.096 0.32768a22.7328 22.7328 0 0 1-22.36416-18.6368l-0.36864-4.096v-46.4896a22.7328 22.7328 0 0 1 18.67776-22.36416l4.096-0.36864h205.70112v-35.75808z m67.1744 173.75232a22.7328 22.7328 0 0 1 22.36416 18.6368l0.4096 4.096v43.99104a22.7328 22.7328 0 0 1-18.71872 22.3232l-4.05504 0.4096h-203.65312v36.98688l-90.9312-59.76064 90.9312-58.49088v35.75808H626.688v-21.21728a22.7328 22.7328 0 0 1 18.67776-22.36416l4.096-0.36864z",
+        "fill": "#FFFFFF",
+        "p-id": "16586"
+      }, null)])]), createVNode("span", {
+        "class": ns.e('label')
+      }, [t('sys.appDesigner.designView.components.select.selectCom'), createTextVNode("\uFF1A"), t('sys.appDesigner.designView.components.select.sampleText')]), createVNode("span", {
+        "class": ns.e('action')
+      }, [t('sys.appDesigner.designView.components.select.switch'), createVNode("i", {
+        "class": "iconfont icon-qiehuan"
+      }, null)])]);
+    };
+    return {
+      ns,
+      model,
+      renderSimple,
+      renderStandard
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": [this.ns.b(), this.ns.m(this.model.switchStyle)]
+    }, [this.model.switchStyle === 'simple' ? this.renderSimple() : this.renderStandard()]);
+  }
+});
+
+export { DesignSelectComponentComponent };

package/es/plugins/design-select-component/design-select-component.data.d.ts

@@ -0,0 +1,57 @@
+import { IDesignNodeData } from '../../interface';
+import { DesignContainerNode } from '../../data';
+/**
+ * 选择组件数据
+ *
+ * @author zhanghanrui
+ * @date 2024-07-12 11:07:35
+ * @export
+ * @interface IDesignSelectComponentNodeData
+ * @extends {IDesignNodeData}
+ */
+export interface IDesignSelectComponentNodeData extends IDesignNodeData {
+    /**
+     * 标题
+     * @author lingxiaoming
+     * @date 2024-07-19 03:37:47
+     * @type {string}
+     */
+    title?: string | object;
+    /**
+     * 切换样式
+     *
+     * @author lingxiaoming
+     * @date 2024-07-19 03:39:18
+     * @type {('simple' | 'standard')}
+     */
+    switchStyle: 'simple' | 'standard';
+    /**
+     * 取值字段
+     * 格式(模型key.字段key)
+     * @author lingxiaoming
+     * @date 2024-07-19 03:39:46
+     * @type {string}
+     */
+    valueField?: string;
+    /**
+     * 选择的模型对象
+     *
+     * @author zhanghanrui
+     * @date 2024-07-21 16:07:56
+     * @type {string}
+     */
+    modelKey?: string;
+}
+/**
+ * 设计选择组件节点
+ *
+ * @author zhanghanrui
+ * @date 2024-07-12 13:07:43
+ * @export
+ * @class DesignSelectComponentNode
+ * @extends {DesignContainerNode<IDesignSelectComponentNodeData>}
+ */
+export declare class DesignSelectComponentNode extends DesignContainerNode<IDesignSelectComponentNodeData> {
+    type: string;
+    protected createData(): IDesignSelectComponentNodeData;
+}

package/es/plugins/design-select-component/design-select-component.data.mjs

@@ -0,0 +1,18 @@
+import { DesignNodeType } from '../../constant/index.mjs';
+import { DesignContainerNode } from '../../data/design-container-node/design-container-node.mjs';
+import '@jsplumb/browser-ui';
+import 'lodash-es';
+
+class DesignSelectComponentNode extends DesignContainerNode {
+  type = DesignNodeType.SELECT_COMPONENT;
+  createData() {
+    return {
+      name: "选择组件",
+      title: "选择组件",
+      switchStyle: "standard",
+      valueField: void 0
+    };
+  }
+}
+
+export { DesignSelectComponentNode };

package/es/plugins/design-select-component/design-select-component.provider.d.ts

@@ -0,0 +1,23 @@
+import { IEditForm } from '@gct-paas/core';
+import { DesignNodeMode } from '../../constant';
+import { IMaterialData, INodeProvider } from '../../interface';
+import { DesignSelectComponentNode } from './design-select-component.data';
+import { NodeBaseProvider } from '../../provider';
+/**
+ * 选择组件
+ *
+ * @author zhanghanrui
+ * @date 2024-07-16 17:07:36
+ * @export
+ * @class DesignSelectComponentProvider
+ * @extends {NodeBaseProvider<DesignSelectComponentNode>}
+ * @implements {INodeProvider<DesignSelectComponentNode>}
+ */
+export declare class DesignSelectComponentProvider extends NodeBaseProvider<DesignSelectComponentNode> implements INodeProvider<DesignSelectComponentNode> {
+    mode: DesignNodeMode;
+    type: string;
+    component: string;
+    static materialConfig: IMaterialData;
+    model: IEditForm;
+    create(data?: DesignSelectComponentNode): DesignSelectComponentNode;
+}

package/es/plugins/design-select-component/design-select-component.provider.mjs

@@ -0,0 +1,207 @@
+import { EditorType, t } from '@gct-paas/core';
+import { DesignNodeMode, DesignNodeType, MaterialGroup } from '../../constant/index.mjs';
+import { DesignSelectComponentNode } from './design-select-component.data.mjs';
+import { NodeBaseProvider } from '../../provider/node-base/node-base.provider.mjs';
+import '../../provider/design-editor-node/design-editor-node.provider.mjs';
+import { DesignEditorType } from '../../constant/design-editor-type.mjs';
+
+const SwitchStyleMap = {
+  ["simple" /* SIMPLE */]: "简易",
+  ["standard" /* STANDARD */]: "标准"
+};
+class DesignSelectComponentProvider extends NodeBaseProvider {
+  mode = DesignNodeMode.CONTAINER;
+  type = DesignNodeType.SELECT_COMPONENT;
+  component = "DesignSelectComponentComponent";
+  static materialConfig = {
+    group: MaterialGroup.SYSTEM,
+    label: "选择组件",
+    type: DesignNodeType.SELECT_COMPONENT,
+    icon: "icon-cangkuqiehuanmoren",
+    order: 0
+  };
+  model = {
+    type: "edit",
+    children: [
+      {
+        type: "tab",
+        name: "tab",
+        isContainer: true,
+        layout: "flex",
+        navPosition: "center",
+        height: "100%",
+        children: [
+          {
+            name: "pane1",
+            type: "tab-pane",
+            isContainer: true,
+            title: t("sys.designView.form.attribute"),
+            layout: "grid",
+            children: [
+              {
+                name: "collapse-property",
+                type: "collapse",
+                isContainer: true,
+                layout: "flex",
+                children: [
+                  {
+                    name: "collapse-pane-config",
+                    type: "collapse-pane",
+                    isContainer: true,
+                    layout: "grid",
+                    title: t(
+                      "sys.appDesigner.designView.components.select.form.group"
+                    ),
+                    children: [
+                      {
+                        type: "item",
+                        name: "title",
+                        label: t(
+                          "sys.appDesigner.designView.components.select.form.label"
+                        ),
+                        labelPosition: "top",
+                        noColon: true,
+                        editor: {
+                          type: EditorType.I18N,
+                          max: 32,
+                          props: {}
+                        }
+                      },
+                      {
+                        type: "item",
+                        name: "switchStyle",
+                        label: t(
+                          "sys.appDesigner.designView.components.select.form.label2"
+                        ),
+                        labelPosition: "top",
+                        noColon: true,
+                        defaultValue: "standard" /* STANDARD */,
+                        dictionary: {
+                          tag: "switchStyle",
+                          mode: "static",
+                          items: Object.keys(SwitchStyleMap).map((key) => {
+                            return {
+                              value: key,
+                              label: SwitchStyleMap[key]
+                            };
+                          })
+                        },
+                        editor: {
+                          type: EditorType.RADIO,
+                          buttonMode: true,
+                          props: {
+                            size: "small"
+                          }
+                        }
+                      },
+                      {
+                        type: "hidden",
+                        name: "modelKey"
+                      },
+                      {
+                        type: "item",
+                        name: "valueField",
+                        label: t(
+                          "sys.appDesigner.designView.components.select.form.label3"
+                        ),
+                        labelPosition: "top",
+                        noColon: true,
+                        editor: {
+                          type: "model-field-select",
+                          props: {}
+                        },
+                        rules: [
+                          {
+                            required: true,
+                            message: t(
+                              "sys.appDesigner.designView.components.select.form.errorMsg.label3"
+                            )
+                          }
+                        ]
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          },
+          {
+            name: "pane2",
+            type: "tab-pane",
+            class: "style-pane",
+            title: t("sys.designView.form.style"),
+            isContainer: true,
+            layout: "grid",
+            children: [
+              {
+                name: "collapse-style",
+                type: "collapse",
+                isContainer: true,
+                layout: "flex",
+                children: [
+                  {
+                    name: "collapse-pane-layout",
+                    type: "collapse-pane",
+                    isContainer: true,
+                    layout: "grid",
+                    title: t("sys.designView.form.layout"),
+                    children: [
+                      {
+                        type: "item",
+                        label: t("sys.designView.form.position"),
+                        name: "position",
+                        noColon: true,
+                        labelAlign: "left",
+                        labelWidth: "34px",
+                        editor: {
+                          type: DesignEditorType.STYLE_POSITION
+                        }
+                      }
+                    ]
+                  },
+                  {
+                    name: "collapse-pane-spacing",
+                    type: "collapse-pane",
+                    isContainer: true,
+                    layout: "grid",
+                    title: t("sys.designView.form.margin"),
+                    children: [
+                      {
+                        type: "hidden",
+                        name: "padding"
+                      },
+                      {
+                        type: "item",
+                        name: "margin",
+                        fields: ["margin", "padding"],
+                        editor: {
+                          type: DesignEditorType.STYLE_SPACING
+                        }
+                      }
+                    ]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    ],
+    loadRequest(_params) {
+      return Promise.resolve({});
+    },
+    newRequest(_data) {
+      return Promise.resolve({});
+    },
+    updateRequest(_params, _data) {
+      return Promise.resolve({});
+    }
+  };
+  create(data) {
+    return new DesignSelectComponentNode(
+      data
+    );
+  }
+}
+
+export { DesignSelectComponentProvider };