@gct-paas/core-web 0.0.1-dev.14 → 0.0.1-dev.16

package/es/components/layout/flex-item/flex-item.mjs

@@ -0,0 +1,53 @@
+import { defineComponent, createVNode } from 'vue';
+import { useNamespace } from '@gct-paas/core';
+
+"use strict";
+const FlexItem = /* @__PURE__ */ defineComponent({
+  name: "FlexItem",
+  props: {
+    layout: Object
+  },
+  setup(props) {
+    const ns = useNamespace("flex-item");
+    const getStyle = () => {
+      const style = {};
+      if (props.layout) {
+        const {
+          order,
+          alignSelf,
+          flexBasis,
+          flexGrow,
+          flexShrink
+        } = props.layout;
+        if (order != null) {
+          style["order"] = order;
+        }
+        if (alignSelf != null) {
+          style["align-self"] = alignSelf;
+        }
+        if (flexBasis != null) {
+          style["flex-basis"] = flexBasis;
+        }
+        if (flexGrow != null) {
+          style["flex-grow"] = flexGrow;
+        }
+        if (flexShrink != null) {
+          style["flex-shrink"] = flexShrink;
+        }
+      }
+      return style;
+    };
+    return {
+      ns,
+      getStyle
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": this.ns.b(),
+      "style": this.getStyle()
+    }, [this.$slots.default?.()]);
+  }
+});
+
+export { FlexItem, FlexItem as default };

package/es/components/layout/flex-item/flex-item.scss

@@ -0,0 +1,17 @@
+// $flex-item: (
+//   'order': 0,
+//   'flex-grow': 0,
+//   'flex-shrink': 1,
+//   'flex-basis': 'auto',
+//   'align-self': 'auto'
+// );
+
+// @include b(flex-item) {
+//   @include set-component-css-var('flex-item', $flex-item);
+
+//   order: #{getCssVar(flex-item, order)};
+//   flex-grow: #{getCssVar(flex-item, flex-grow)};
+//   flex-shrink: #{getCssVar(flex-item, flex-shrink)};
+//   flex-basis: #{getCssVar(flex-item, flex-basis)};
+//   align-self: #{getCssVar(flex-item, align-self)};
+// }

package/es/components/layout/grid-container/grid-container.d.ts

@@ -0,0 +1,13 @@
+import { PropType } from 'vue';
+import { IGridContainer } from '@gct-paas/core';
+/**
+ * 栅格布局
+ */
+export declare const GridContainer: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    layout: PropType<IGridContainer>;
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    layout: PropType<IGridContainer>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default GridContainer;

package/es/components/layout/grid-container/grid-container.mjs

@@ -0,0 +1,47 @@
+import { isVNode, defineComponent, createVNode, resolveComponent } from 'vue';
+import { useNamespace } from '@gct-paas/core';
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const GridContainer = /* @__PURE__ */ defineComponent({
+  name: "GridContainer",
+  props: {
+    layout: Object
+  },
+  setup() {
+    const ns = useNamespace("grid-container");
+    return {
+      ns
+    };
+  },
+  render() {
+    let _slot;
+    const l = this.layout || {};
+    let items = this.$slots.default?.() || [];
+    if (items.length > 0) {
+      items = items[0].children || [];
+    }
+    return createVNode(resolveComponent("a-row"), {
+      "class": this.ns.b(),
+      "wrap": true,
+      "gutter": l.gutter
+    }, _isSlot(_slot = items.map((item) => {
+      if (!item) {
+        return null;
+      }
+      const model = item.props.model.gridItem;
+      return createVNode(resolveComponent("a-col"), {
+        "span": model ? model.span ?? 24 : 24,
+        "offset": model ? model.offset ?? 0 : 0
+      }, _isSlot(item) ? item : {
+        default: () => [item]
+      });
+    })) ? _slot : {
+      default: () => [_slot]
+    });
+  }
+});
+
+export { GridContainer, GridContainer as default };

package/es/components/layout/view-container/view-container.d.ts

@@ -0,0 +1,25 @@
+export declare const ViewContainer: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    context: {
+        type: ObjectConstructor;
+    };
+    params: {
+        type: ObjectConstructor;
+    };
+    modal: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    context: {
+        type: ObjectConstructor;
+    };
+    params: {
+        type: ObjectConstructor;
+    };
+    modal: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/components/layout/view-container/view-container.mjs

@@ -0,0 +1,39 @@
+import { defineComponent, createVNode } from 'vue';
+import { useNamespace } from '@gct-paas/core';
+import './view-container.scss';
+
+"use strict";
+const ViewContainer = /* @__PURE__ */ defineComponent({
+  name: "ViewContainer",
+  props: {
+    context: {
+      type: Object
+    },
+    params: {
+      type: Object
+    },
+    modal: {
+      type: Object,
+      required: true
+    }
+  },
+  setup() {
+    const ns = useNamespace("view-container");
+    return {
+      ns
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": this.ns.b()
+    }, [this.$slots.header ? createVNode("div", {
+      "class": this.ns.b("header")
+    }, [this.$slots.header()]) : null, createVNode("div", {
+      "class": this.ns.b("content")
+    }, [this.$slots.default?.()]), this.$slots.footer ? createVNode("div", {
+      "class": this.ns.b("footer")
+    }, [this.$slots.footer()]) : null]);
+  }
+});
+
+export { ViewContainer };

package/es/components/layout/view-container/view-container.scss

@@ -0,0 +1,19 @@
+@include b(view-container) {
+  background-color: white;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+@include b(view-container-header) {
+  flex-shrink: 0;
+}
+
+@include b(view-container-content) {
+  flex-grow: 1;
+  overflow: hidden auto;
+}
+
+@include b(view-container-footer) {
+  flex-shrink: 0;
+}

package/es/editor/gct-form-check-switch/gct-form-check-switch.d.ts

@@ -0,0 +1,40 @@
+import { PropType } from 'vue';
+import { IFormItem, ICheckSwitchEditor, EditorController } from '@gct-paas/core';
+/**
+ * 文本编辑器
+ */
+export declare const GctFormCheckSwitch: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    itemModel: {
+        type: PropType<IFormItem>;
+        required: true;
+    };
+    model: {
+        type: PropType<ICheckSwitchEditor>;
+        required: true;
+    };
+    value: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+    c: EditorController<ICheckSwitchEditor>;
+    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<ICheckSwitchEditor>;
+        required: true;
+    };
+    value: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}>, {
+    value: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/editor/gct-form-check-switch/gct-form-check-switch.mjs

@@ -0,0 +1,53 @@
+import { defineComponent, createVNode, resolveComponent, mergeProps } from 'vue';
+import { useNamespace, EditorController, useGctFormValue } from '@gct-paas/core';
+import './gct-form-check-switch.scss';
+
+"use strict";
+const GctFormCheckSwitch = /* @__PURE__ */ defineComponent({
+  name: "GctFormCheckSwitch",
+  props: {
+    itemModel: {
+      type: Object,
+      required: true
+    },
+    model: {
+      type: Object,
+      required: true
+    },
+    value: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["update:value"],
+  setup(props) {
+    const ns = useNamespace("gct-form-check-switch");
+    const c = new EditorController(props.model);
+    const val = useGctFormValue();
+    return {
+      ns,
+      c,
+      val
+    };
+  },
+  render() {
+    if (this.model.isSwitch) {
+      return createVNode("div", {
+        "class": [this.ns.b(), this.ns.m("switch"), this.ns.is("readonly", this.model.readonly)]
+      }, [createVNode(resolveComponent("a-switch"), mergeProps({
+        "checked": this.val,
+        "onUpdate:checked": ($event) => this.val = $event
+      }, this.model.props || {}), null)]);
+    }
+    return createVNode(resolveComponent("a-checkbox"), mergeProps({
+      "checked": this.val,
+      "onUpdate:checked": ($event) => this.val = $event
+    }, this.model.props || {}, {
+      "class": [this.ns.b(), this.ns.m("checkbox"), this.ns.is("readonly", this.model.readonly)]
+    }), {
+      default: () => [this.model.label]
+    });
+  }
+});
+
+export { GctFormCheckSwitch };

package/es/editor/gct-form-check-switch/gct-form-check-switch.provider.d.ts

@@ -0,0 +1,13 @@
+import { IEditorProvider } from '@gct-paas/core';
+/**
+ * 选项框类型开关
+ *
+ * @author zhanghanrui
+ * @date 2024-03-27 10:03:03
+ * @export
+ * @class GctFormCheckSwitchProvider
+ * @implements {IEditorProvider}
+ */
+export declare class GctFormCheckSwitchProvider implements IEditorProvider {
+    component: string;
+}

package/es/editor/gct-form-check-switch/gct-form-check-switch.provider.mjs

@@ -0,0 +1,6 @@
+"use strict";
+class GctFormCheckSwitchProvider {
+  component = "gct-form-check-switch";
+}
+
+export { GctFormCheckSwitchProvider };

package/es/editor/gct-form-check-switch/gct-form-check-switch.scss

@@ -0,0 +1,10 @@
+@include b(gct-form-check-switch) {
+  @include m(checkbox){
+    height: 32px;
+    padding-top: 5px;
+  }
+
+  @include when(readonly) {
+    pointer-events: none;
+  }
+}

package/es/editor/gct-form-check-switch/index.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    install(app: import('vue').App): void;
+};
+export default _default;

package/es/editor/gct-form-check-switch/index.mjs

@@ -0,0 +1,12 @@
+import { widthEditorInstall, EditorType } from '@gct-paas/core';
+import { GctFormCheckSwitchProvider } from './gct-form-check-switch.provider.mjs';
+import { GctFormCheckSwitch as GctFormCheckSwitch$1 } from './gct-form-check-switch.mjs';
+
+"use strict";
+var GctFormCheckSwitch = widthEditorInstall(
+  EditorType.CHECK_SWITCH,
+  () => new GctFormCheckSwitchProvider(),
+  GctFormCheckSwitch$1
+);
+
+export { GctFormCheckSwitch as default };

package/es/editor/gct-form-checkbox/gct-form-checkbox.d.ts

@@ -0,0 +1,41 @@
+import { PropType } from 'vue';
+import { IFormItemController, ICheckboxEditor, IDictionaryItem } from '@gct-paas/core';
+export declare const GctFormCheckbox: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    c: {
+        type: PropType<IFormItemController>;
+        required: true;
+    };
+    model: {
+        type: PropType<ICheckboxEditor>;
+        required: true;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+    checked: import('vue').ComputedRef<any>;
+    onChange: (checkVal: any) => void;
+    options: import('vue').ComputedRef<(IDictionaryItem & {
+        checked?: boolean;
+    })[]>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    c: {
+        type: PropType<IFormItemController>;
+        required: true;
+    };
+    model: {
+        type: PropType<ICheckboxEditor>;
+        required: true;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}>, {
+    value: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default GctFormCheckbox;

package/es/editor/gct-form-checkbox/gct-form-checkbox.mjs

@@ -0,0 +1,70 @@
+import { defineComponent, createVNode, mergeProps, computed } from 'vue';
+import { useNamespace, useGctFormValue } from '@gct-paas/core';
+import { CheckboxGroup } from 'ant-design-vue';
+import { cloneDeep } from 'lodash-es';
+import './gct-form-checkbox.scss';
+
+"use strict";
+const GctFormCheckbox = /* @__PURE__ */ defineComponent({
+  name: "GctFormCheckbox",
+  props: {
+    c: {
+      type: Object,
+      required: true
+    },
+    model: {
+      type: Object,
+      required: true
+    },
+    value: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["update:value"],
+  setup(props, {
+    emit
+  }) {
+    const ns = useNamespace("gct-form-checkbox");
+    const val = useGctFormValue();
+    const checked = computed(() => {
+      return val.value;
+    });
+    const options = computed(() => {
+      return cloneDeep(props.c.state.options);
+    });
+    const onChange = (checkVal) => {
+      options.value.forEach((e) => {
+        if (props.model.minLength && checkVal.length <= props.model.minLength && checkVal.includes(e.value)) {
+          e.disabled = true;
+        } else {
+          e.disabled = false;
+        }
+        e.checked = checkVal.includes(e.value);
+      });
+      emit("update:value", checkVal);
+    };
+    return {
+      ns,
+      checked,
+      onChange,
+      options
+    };
+  },
+  render() {
+    const attrs = {
+      ...this.model.props || {},
+      class: [this.ns.b(), this.ns.m("checkbox"), this.model.layout === "column" && "isColumn"],
+      disabled: this.c.state.disabled
+    };
+    return createVNode(CheckboxGroup, mergeProps({
+      "value": this.checked,
+      "onUpdate:value": ($event) => this.checked = $event,
+      "options": this.options
+    }, attrs, {
+      "onChange": this.onChange
+    }), null);
+  }
+});
+
+export { GctFormCheckbox, GctFormCheckbox as default };

package/es/editor/gct-form-checkbox/gct-form-checkbox.scss

@@ -0,0 +1,56 @@
+@include b(gct-form-checkbox) {
+  @include m(checkbox){
+    &.ant-checkbox-group {
+      height: 32px;
+      display: flex;
+      align-items: center;
+    }
+  }
+}
+
+.#{bem(gct-form-checkbox)}.ant-checkbox-group{
+  width: 100%;
+  padding: 2px;
+  border-radius: 4px;
+  display: flex;
+  gap: 4px 8px;
+  flex-wrap: wrap;
+  height: auto;
+
+  .ant-checkbox+span {
+    padding-left: 4px;
+  }
+
+  .ant-checkbox-group-item {
+    margin-right: 0;
+    display: flex;
+    align-items: flex-start;
+  }
+
+  .ant-checkbox-wrapper {
+    display: flex;
+  }
+
+  &.isColumn {
+    flex-flow: column wrap;
+    align-items: flex-start;
+  }
+
+  .drag-wrap {
+    width: 100%;
+
+    .drag-checkbox-item {
+      padding: 6px 4px;
+      border-radius: 4px;
+      background-color: #F2F4F7;
+
+      .icon-drag {
+        line-height: 1;
+      }
+
+      & + .drag-checkbox-item {
+        margin-top: 4px;
+      }
+    }
+  }
+}

package/es/editor/gct-form-checkbox/index.d.ts

@@ -0,0 +1,11 @@
+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;
+export declare const oldCheckboxCom: {
+    install(app: import('vue').App): void;
+};

package/es/editor/gct-form-checkbox/index.mjs

@@ -0,0 +1,19 @@
+import { widthEditorInstall, EditorType, EditorTypeOld } from '@gct-paas/core';
+import { GctFormCheckbox as GctFormCheckbox$1 } from './gct-form-checkbox.mjs';
+
+"use strict";
+class Provider {
+  component = "gct-form-checkbox";
+}
+var GctFormCheckbox = widthEditorInstall(
+  EditorType.CHECKBOX,
+  () => new Provider(),
+  GctFormCheckbox$1
+);
+const oldCheckboxCom = widthEditorInstall(
+  EditorTypeOld.CHECKBOX,
+  () => new Provider(),
+  GctFormCheckbox$1
+);
+
+export { Provider, GctFormCheckbox as default, oldCheckboxCom };

package/es/editor/gct-form-color/gct-form-color.d.ts

@@ -0,0 +1,37 @@
+import { PropType } from 'vue';
+import { ColorEditorController, IColorEditor, IFormItem } from '@gct-paas/core';
+/**
+ * 颜色选择编辑器
+ */
+export declare const GctFormColor: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    itemModel: {
+        type: PropType<IFormItem>;
+        required: true;
+    };
+    model: {
+        type: PropType<IColorEditor>;
+        required: true;
+    };
+    value: {
+        type: StringConstructor;
+    };
+}>, {
+    ns: import('@gct-paas/core').Namespace;
+    c: ColorEditorController;
+    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<IColorEditor>;
+        required: true;
+    };
+    value: {
+        type: StringConstructor;
+    };
+}>> & Readonly<{
+    "onUpdate:value"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default GctFormColor;

package/es/editor/gct-form-color/gct-form-color.mjs

@@ -0,0 +1,43 @@
+import { defineComponent, createVNode, resolveComponent, mergeProps } from 'vue';
+import { useNamespace, ColorEditorController, useGctFormValue } from '@gct-paas/core';
+import './gct-form-color.scss';
+
+"use strict";
+const GctFormColor = /* @__PURE__ */ defineComponent({
+  name: "GctFormColor",
+  inheritAttrs: false,
+  props: {
+    itemModel: {
+      type: Object,
+      required: true
+    },
+    model: {
+      type: Object,
+      required: true
+    },
+    value: {
+      type: String
+    }
+  },
+  emits: ["update:value"],
+  setup(props) {
+    const ns = useNamespace("form-color");
+    const c = new ColorEditorController(props.model);
+    const val = useGctFormValue();
+    return {
+      ns,
+      c,
+      val
+    };
+  },
+  render() {
+    return createVNode(resolveComponent("color-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 { GctFormColor, GctFormColor as default };

package/es/editor/gct-form-color/gct-form-color.provider.d.ts

@@ -0,0 +1,13 @@
+import { IEditorProvider } from '@gct-paas/core';
+/**
+ * 颜色选择编辑器
+ *
+ * @author lingxiaoming
+ * @date 2024-07-17 04:48:33
+ * @export
+ * @class GctFormColorProvider
+ * @implements {IEditorProvider}
+ */
+export declare class GctFormColorProvider implements IEditorProvider {
+    component: string;
+}

package/es/editor/gct-form-color/gct-form-color.provider.mjs

@@ -0,0 +1,6 @@
+"use strict";
+class GctFormColorProvider {
+  component = "gct-form-color";
+}
+
+export { GctFormColorProvider };

package/es/editor/gct-form-color/gct-form-color.scss

@@ -0,0 +1,3 @@
+@include b(form-color) {
+  vertical-align: middle;
+}