@gct-paas/design 0.1.4-dev.9 → 0.1.5-dev.1

package/es/editor/model-field-select/model-field-select.mjs

@@ -1,314 +0,0 @@
-import { defineComponent, ref, computed, watch, createVNode, resolveComponent, isVNode } from 'vue';
-import { useNamespace, t, FieldIconMap, modelLoader } from '@gct-paas/core';
-import { CloseOutlined } from '@ant-design/icons-vue';
-import { GctDndContainer } from '@gct-paas/core-web';
-import '../../hooks/design-view/design-state.mjs';
-import '@gct-paas/schema';
-import 'lodash-es';
-import '../../hooks/design-view/layout/useScope.mjs';
-import '../../hooks/design-view/global/useGlobal.mjs';
-import '@vueuse/core';
-import '../../hooks/develop/useCacheHistory.mjs';
-import 'ant-design-vue';
-import '../../hooks/design-view/widget/useSelectedWidget.mjs';
-import '../../hooks/design-view/widget/useWidget.mjs';
-import '../../hooks/design-view/page/usePage.mjs';
-import '../../hooks/design-view/page/usePageOccupy.mjs';
-import '../../hooks/design-view/layout/useToolkit.mjs';
-import { useDesignViewController } from '../../hooks/use-design-view-controller/use-design-view-controller.mjs';
-import '../../hooks/use-model-field/use-model-field.mjs';
-import 'qx-util';
-import { DesignNodeType } from '../../constant/index.mjs';
-import './model-field-select.css';/* empty css                         */
-
-function _isSlot(s) {
-  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
-}
-const ModelFieldSelect = /* @__PURE__ */ defineComponent({
-  name: 'ModelFieldSelect',
-  props: {
-    value: {
-      type: Array,
-      default: () => []
-    },
-    model: {
-      type: Object,
-      required: true
-    },
-    c: {
-      type: Object
-    },
-    itemModel: {
-      type: Object
-    },
-    data: {
-      type: Object
-    }
-  },
-  setup() {
-    const ns = useNamespace('model-field-select');
-    // 基础信息是否加载完毕
-    const isLoaded = ref(false);
-    const c = useDesignViewController();
-    const selectNode = c.store.selected;
-    const parentKey = computed(() => {
-      if (!selectNode || selectNode.type === DesignNodeType.PAGE || selectNode.type === DesignNodeType.PAGE_LOWER) {
-        return undefined;
-      }
-      return selectNode.id;
-    });
-    const nodes = ref([]);
-    // 存储字段映射，key 为 ${modelKey}___${fieldKey}，value 为 ModelDndData
-    const fieldMap = ref({});
-    function getFieldCacheKey(modelKey, fieldKey) {
-      return `${modelKey}___${fieldKey}`;
-    }
-    function updateNodes() {
-      if (!isLoaded.value) {
-        nodes.value = [];
-        return;
-      }
-      nodes.value = c.store.getChildren(parentKey.value) || [];
-    }
-    watch(() => c.store.count, () => {
-      // 当 c.store.count 变化时，更新节点
-      updateNodes();
-    });
-
-    /**
-     * 根据现有的列表排序，修改 c.store.tree 的顺序
-     *
-     * @author chitanda
-     * @date 2025-06-19 11:06:03
-     * @param {ModelDndData[]} fields
-     */
-    function sortFields(fields) {
-      // 按照给回的属性顺序重新排序
-      const newItems = c.store.getChildren(parentKey.value) || [];
-      newItems.sort((a, b) => {
-        const indexA = fields.findIndex(field => field.key === a.data.key);
-        const indexB = fields.findIndex(field => field.key === b.data.key);
-        return indexA - indexB;
-      });
-      if (parentKey.value) {
-        // 存在父时查找出父节点，然后重新排序子
-        c.store.getTreeItem(parentKey.value)?.children?.sort((a, b) => {
-          const indexA = newItems.findIndex(item => item.id === a.id);
-          const indexB = newItems.findIndex(item => item.id === b.id);
-          return indexA - indexB;
-        });
-      } else {
-        // 不存在父 c.store.tree 直接按照 newItems 排序
-        c.store.tree.sort((a, b) => {
-          const indexA = newItems.findIndex(item => item.id === a.id);
-          const indexB = newItems.findIndex(item => item.id === b.id);
-          return indexA - indexB;
-        });
-      }
-    }
-
-    // const fieldInstance = useFieldTransfer();
-
-    async function addField() {
-      // TODO: 待实现字段选择功能
-      // const excludeList = [
-      //   FIELD_TYPE.EXPRESSION_CONDITION,
-      //   FIELD_TYPE.MASTERSLAVE,
-      //   FIELD_TYPE.LABEL_TEMPLATE,
-      //   FIELD_TYPE.SERIALRULE,
-      //   // FIELD_TYPE.ONLINE_FORM,
-      //   FIELD_TYPE.PRIMARY_KEY,
-      //   FIELD_TYPE.ESOP,
-      // ];
-      // if (gct.designPlatform === PlatformType.PDA) {
-      //   excludeList.push(
-      //     ...[
-      //       FIELD_TYPE.RANGE_USER,
-      //       FIELD_TYPE.MESSAGE_TMPL,
-      //       FIELD_TYPE.EXPRESSION_CONDITION,
-      //     ],
-      //   );
-      // }
-      // const modelKey = c.store.pageNode?.data.modelKey;
-      // fieldInstance.open({
-      //   modelKey: modelKey,
-      //   modalTitle: t('sys.pageDesigner.modelField'),
-      //   isShowCascader: true,
-      //   draggable: false,
-      //   data: nodes.value.map(
-      //     item =>
-      //       fieldMap.value[getFieldCacheKey(item.data.modelKey, item.data.key)],
-      //   ),
-      //   excludeFieldType: excludeList.concat(
-      //     props.model.excludeFieldType ?? [],
-      //   ) as FIELD_TYPE[],
-      //   excludeFieldKey: [
-      //     'tenant_id_',
-      //     'ref_field_key_',
-      //     'ref_model_key_',
-      //   ].concat(props.model.excludeFieldKey ?? []),
-      //   saveCallback: async ({ objFieldList }) => {
-      //     const items = c.store.getChildren(parentKey.value);
-      //     if (objFieldList.length === 0) {
-      //       // 选项清空后，子项全部删除
-      //       items.forEach(item => {
-      //         c.store.deleteNode(item.id);
-      //       });
-      //       return;
-      //     }
-      //     // 过滤出被删除的项
-      //     const deletedItems = items.filter(
-      //       item => !objFieldList.some(field => field.key === item.data.key),
-      //     );
-      //     // 删除被删除的项
-      //     deletedItems.forEach(item => {
-      //       c.store.deleteNode(item.id);
-      //     });
-      //     const provider = NodeRegister.get(
-      //       DesignNodeType.FIELD,
-      //       c.store.prefix,
-      //     );
-      //     if (!provider) {
-      //       console.error('Field provider not found');
-      //       return;
-      //     }
-      //     for await (const item of objFieldList) {
-      //       // 存在则更新，不存在则新增，和旧数据对比
-      //       const node = items.find(treeItem => treeItem.data.key === item.key);
-      //       if (!node) {
-      //         const field = await modelLoader.loadField(
-      //           item.modelKey,
-      //           item.key,
-      //         );
-      //         if (field) {
-      //           fieldMap.value[getFieldCacheKey(item.modelKey, field.key!)] =
-      //             field as IGctDndData;
-      //         }
-      //         let fieldCodeChain: IFieldCodeChain | undefined = undefined;
-      //         if (item.fieldCodeChain) {
-      //           try {
-      //             fieldCodeChain = JSON.parse(item.fieldCodeChain);
-      //           } catch (error) {
-      //             console.error(
-      //               'Invalid fieldCodeChain JSON:',
-      //               item.fieldCodeChain,
-      //               error,
-      //             );
-      //           }
-      //         }
-      //         const data = provider.create({
-      //           data: {
-      //             modelKey: item.modelKey,
-      //             modelCategory: item.modelCategory,
-      //             key: item.key,
-      //             type: item.type,
-      //             name: item.name,
-      //             mapping_type: item.mappingType,
-      //             fieldCodeChain,
-      //           },
-      //         });
-      //         c.store.setNode(parentKey.value || null, data, -1);
-      //       }
-      //     }
-      //     sortFields(objFieldList);
-      //   },
-      // });
-    }
-    const dndCfg = {
-      group: 'gct-form-model-field-select',
-      end() {
-        sortFields(nodes.value.map(item => fieldMap.value[getFieldCacheKey(item.data.modelKey, item.data.key)]).filter(item => !!item));
-      }
-    };
-    function onDeleteItem(e, item) {
-      e.stopPropagation();
-      const node = nodes.value.find(n => n.data.key === item.key);
-      if (!node) {
-        console.warn('Node not found for item:', item);
-        return;
-      }
-      // 删除节点
-      c.store.deleteNode(node.id);
-    }
-    async function onInit() {
-      // 加载所有非主模型字段
-      const all = [];
-      c.store.map.forEach(node => {
-        all.push((async () => {
-          const key = node.data.modelKey;
-          const field = await modelLoader.loadField(key, node.data.key);
-          if (field) {
-            fieldMap.value[getFieldCacheKey(key, field.key)] = field;
-          }
-        })());
-      });
-      await Promise.all(all);
-      isLoaded.value = true;
-      updateNodes();
-    }
-    onInit();
-    return () => {
-      let _slot;
-      return createVNode("div", {
-        "class": ns.b()
-      }, [createVNode("div", {
-        "class": ns.e('select-modal')
-      }, [createVNode(resolveComponent("a-button"), {
-        "onClick": addField,
-        "type": "dashed",
-        "block": true
-      }, _isSlot(_slot = t('sys.pageDesigner.selectModelFields')) ? _slot : {
-        default: () => [_slot]
-      })]), createVNode("div", {
-        "class": ns.e('field-content')
-      }, [createVNode("div", {
-        "class": ns.e('field-list')
-      }, [createVNode(GctDndContainer, {
-        "config": dndCfg,
-        "items": nodes.value,
-        "onUpdate:items": $event => nodes.value = $event
-      }, {
-        default: args => {
-          const data = fieldMap.value[getFieldCacheKey(args.data.data.modelKey, args.data.data.key)];
-          if (!data) {
-            return createVNode("div", null, null);
-          }
-          return createVNode("div", {
-            "class": ns.e('field-item')
-          }, [createVNode("div", {
-            "class": ns.em('field-item', 'bg')
-          }, null), createVNode("div", {
-            "class": ns.em('field-item', 'drag')
-          }, [createVNode("i", {
-            "class": "iconfont icon-drag"
-          }, null)]), createVNode("div", {
-            "class": ns.em('field-item', 'label')
-          }, [createVNode("span", {
-            "class": ns.em('field-item', 'label-icon')
-          }, [createVNode("i", {
-            "class": ['iconfont', FieldIconMap[data.type]]
-          }, null)]), createVNode("span", {
-            "class": ns.em('field-item', 'label-text'),
-            "title": data.name
-          }, [data.name])]), createVNode("div", {
-            "class": ns.em('field-item', 'actions')
-          }, [createVNode(resolveComponent("a-popconfirm"), {
-            "placement": "topRight",
-            "ok-text": t('sys.okText'),
-            "cancel-text": t('sys.closeText'),
-            "onConfirm": e => onDeleteItem(e, data)
-          }, {
-            title: () => {
-              return createVNode("div", null, [t('sys.sureToDo')]);
-            },
-            default: () => {
-              return createVNode(CloseOutlined, null, null);
-            }
-          })])]);
-        }
-      })])])]);
-    };
-  }
-});
-
-export { ModelFieldSelect };

package/es/editor/style-border/index.d.ts

@@ -1,8 +0,0 @@
-import { IEditorProvider } from '@gct-paas/core';
-export declare class Provider implements IEditorProvider {
-    component: string;
-}
-declare const _default: {
-    install(app: import('vue').App): void;
-};
-export default _default;

package/es/editor/style-border/index.mjs

@@ -1,15 +0,0 @@
-import { widthEditorInstall } from '@gct-paas/core';
-import { DesignEditorType } from '../../constant/design-editor-type.mjs';
-import '../../constant/page-designer.mjs';
-import { StyleBorder as StyleBorder$1 } from './style-border.mjs';
-
-class Provider {
-  component = "style-border";
-}
-const StyleBorder = widthEditorInstall(
-  DesignEditorType.STYLE_BORDER,
-  () => new Provider(),
-  StyleBorder$1
-);
-
-export { Provider, StyleBorder as default };

package/es/editor/style-border/style-border.d.ts

@@ -1,38 +0,0 @@
-import { PropType } from 'vue';
-import { IFormItem, IBorder, EditorController } from '@gct-paas/core';
-import { IStyleBorder } from '../../interface';
-/**
- * 边框编辑器
- */
-export declare const StyleBorder: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStyleBorder>;
-        required: true;
-    };
-    value: {
-        type: PropType<IBorder>;
-    };
-}>, {
-    ns: import('@gct-paas/core').Namespace;
-    c: EditorController<IStyleBorder>;
-    val: import('vue').WritableComputedRef<any, any>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStyleBorder>;
-        required: true;
-    };
-    value: {
-        type: PropType<IBorder>;
-    };
-}>> & Readonly<{
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default StyleBorder;

package/es/editor/style-border/style-border.mjs

@@ -1,45 +0,0 @@
-import { defineComponent, createVNode, resolveComponent, mergeProps } from 'vue';
-import { useNamespace, EditorController, useGctFormValue } from '@gct-paas/core';
-
-/**
- * 边框编辑器
- */
-const StyleBorder = /* @__PURE__ */ defineComponent({
-  name: 'StyleBorder',
-  inheritAttrs: false,
-  props: {
-    itemModel: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    },
-    value: {
-      type: Object
-    }
-  },
-  emits: ['update:value'],
-  setup(props) {
-    const ns = useNamespace('style-border');
-    const c = new EditorController(props.model);
-    const val = useGctFormValue();
-    return {
-      ns,
-      c,
-      val
-    };
-  },
-  render() {
-    return createVNode(resolveComponent("border-editor"), mergeProps({
-      "value": this.val,
-      "onUpdate:value": $event => this.val = $event
-    }, this.model.props || {}, {
-      "showArea": this.model.showArea,
-      "class": [this.ns.b(), this.ns.is('readonly', this.model.readonly)]
-    }), null);
-  }
-});
-
-export { StyleBorder };

package/es/editor/style-font/index.d.ts

@@ -1,8 +0,0 @@
-import { IEditorProvider } from '@gct-paas/core';
-export declare class Provider implements IEditorProvider {
-    component: string;
-}
-declare const _default: {
-    install(app: import('vue').App): void;
-};
-export default _default;

package/es/editor/style-font/index.mjs

@@ -1,15 +0,0 @@
-import { widthEditorInstall } from '@gct-paas/core';
-import { DesignEditorType } from '../../constant/design-editor-type.mjs';
-import '../../constant/page-designer.mjs';
-import { StyleFont as StyleFont$1 } from './style-font.mjs';
-
-class Provider {
-  component = "style-font";
-}
-const StyleFont = widthEditorInstall(
-  DesignEditorType.STYLE_FONT,
-  () => new Provider(),
-  StyleFont$1
-);
-
-export { Provider, StyleFont as default };

package/es/editor/style-font/style-font.css

@@ -1,86 +0,0 @@
-@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-style-font .component {
-  padding: 2px;
-  border: 1px solid var(--gct-color-border);
-  border-radius: 4px;
-}
-.gct-style-font .box .color-picker-icon {
-  width: 20px;
-  height: 20px;
-}
-.gct-style-font .align-group-box,
-.gct-style-font .font-style-box {
-  height: 28px;
-}
-.gct-style-font .align-group-box .iconfont:hover, .gct-style-font .align-group-box .anticon:hover,
-.gct-style-font .font-style-box .iconfont:hover,
-.gct-style-font .font-style-box .anticon:hover {
-  background-color: transparent;
-}
-.gct-style-font .align-group-box .icon-box:hover,
-.gct-style-font .font-style-box .icon-box:hover {
-  background-color: #e6e9ef;
-}

package/es/editor/style-font/style-font.d.ts

@@ -1,38 +0,0 @@
-import { PropType } from 'vue';
-import { IFormItem, IFont, EditorController } from '@gct-paas/core';
-import { IStyleFont } from '../../interface';
-/**
- * 文本样式编辑器
- */
-export declare const StyleFont: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStyleFont>;
-        required: true;
-    };
-    value: {
-        type: PropType<IFont>;
-    };
-}>, {
-    ns: import('@gct-paas/core').Namespace;
-    c: EditorController<IStyleFont>;
-    val: import('vue').WritableComputedRef<any, any>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStyleFont>;
-        required: true;
-    };
-    value: {
-        type: PropType<IFont>;
-    };
-}>> & Readonly<{
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default StyleFont;

package/es/editor/style-font/style-font.mjs

@@ -1,45 +0,0 @@
-import { defineComponent, createVNode, resolveComponent, mergeProps } from 'vue';
-import { useNamespace, EditorController, useGctFormValue } from '@gct-paas/core';
-import './style-font.css';/* empty css                 */
-
-/**
- * 文本样式编辑器
- */
-const StyleFont = /* @__PURE__ */ defineComponent({
-  name: 'StyleFont',
-  inheritAttrs: false,
-  props: {
-    itemModel: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    },
-    value: {
-      type: Object
-    }
-  },
-  emits: ['update:value'],
-  setup(props) {
-    const ns = useNamespace('style-font');
-    const c = new EditorController(props.model);
-    const val = useGctFormValue();
-    return {
-      ns,
-      c,
-      val
-    };
-  },
-  render() {
-    return createVNode(resolveComponent("font-editor"), mergeProps({
-      "value": this.val,
-      "onUpdate:value": $event => this.val = $event
-    }, this.model.props || {}, {
-      "class": [this.ns.b(), this.ns.is('readonly', this.model.readonly)]
-    }), null);
-  }
-});
-
-export { StyleFont };

package/es/editor/style-position/index.d.ts

@@ -1,8 +0,0 @@
-import { IEditorProvider } from '@gct-paas/core';
-export declare class Provider implements IEditorProvider {
-    component: string;
-}
-declare const _default: {
-    install(app: import('vue').App): void;
-};
-export default _default;

package/es/editor/style-position/index.mjs

@@ -1,15 +0,0 @@
-import { widthEditorInstall } from '@gct-paas/core';
-import { DesignEditorType } from '../../constant/design-editor-type.mjs';
-import '../../constant/page-designer.mjs';
-import { StylePosition as StylePosition$1 } from './style-position.mjs';
-
-class Provider {
-  component = "style-position";
-}
-const StylePosition = widthEditorInstall(
-  DesignEditorType.STYLE_POSITION,
-  () => new Provider(),
-  StylePosition$1
-);
-
-export { Provider, StylePosition as default };

package/es/editor/style-position/style-position.d.ts

@@ -1,38 +0,0 @@
-import { PropType } from 'vue';
-import { IFormItem, IPosition, EditorController } from '@gct-paas/core';
-import { IStylePosition } from '../../interface';
-/**
- * 定位编辑器
- */
-export declare const StylePosition: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStylePosition>;
-        required: true;
-    };
-    value: {
-        type: PropType<IPosition>;
-    };
-}>, {
-    ns: import('@gct-paas/core').Namespace;
-    c: EditorController<IStylePosition>;
-    val: import('vue').WritableComputedRef<any, any>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    itemModel: {
-        type: PropType<IFormItem>;
-        required: true;
-    };
-    model: {
-        type: PropType<IStylePosition>;
-        required: true;
-    };
-    value: {
-        type: PropType<IPosition>;
-    };
-}>> & Readonly<{
-    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-export default StylePosition;