@gct-paas/core-web 0.1.4-dev.0 → 0.1.4-dev.10

package/es/widgets/gct-form/gct-form-item/gct-form-item.mjs

@@ -1,141 +0,0 @@
-import { isVNode, defineComponent, h, resolveComponent, createVNode, computed } from 'vue';
-import { EditorRegisterConst, useNamespace } from '@gct-paas/core';
-import './gct-form-item.scss';
-
-"use strict";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const GctFormItem = /* @__PURE__ */ defineComponent({
-  name: "GctFormItem",
-  props: {
-    c: {
-      type: Object,
-      required: true
-    },
-    formModel: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    }
-  },
-  setup(props) {
-    const ns = useNamespace("gct-form-item");
-    const style = {};
-    if (props.formModel.labelWidth) {
-      style[ns.cssVarName("form-item-label-width")] = props.formModel.labelWidth;
-    }
-    if (props.model.labelWidth) {
-      style[ns.cssVarName("form-item-label-width")] = props.model.labelWidth;
-    }
-    if (props.model.labelAlign) {
-      style[ns.cssVarName("form-item-label-align")] = props.model.labelAlign;
-    }
-    if (props.model.editorAlign) {
-      style[ns.cssVarName("form-item-editor-align")] = props.model.editorAlign;
-    }
-    if (props.model.width) {
-      style[ns.cssVarName("form-item-width")] = props.model.width;
-    }
-    if (props.model.margin) {
-      style.margin = props.model.margin;
-    }
-    if (props.model.padding) {
-      style.padding = props.model.padding;
-    }
-    const required = computed(() => {
-      return !!props.model.rules?.find((item) => item.required);
-    });
-    const renderLabelTooltip = () => {
-      if (!props.model.labelTooltip) {
-        return null;
-      }
-      return createVNode(resolveComponent("a-tooltip"), {
-        "class": ns.e("label-tooltip"),
-        "placement": "topLeft",
-        "title": props.model.labelTooltip
-      }, {
-        default: () => [createVNode("span", {
-          "class": "iconfont icon-assist ml5px text-[#bfbfbf]"
-        }, null)]
-      });
-    };
-    return {
-      ns,
-      style,
-      required,
-      renderLabelTooltip
-    };
-  },
-  render() {
-    const provider = _gct.register.editor.get(EditorRegisterConst.PREFIX + this.model.editor.type);
-    if (!provider) {
-      console.error(`\u672A\u627E\u5230\u8868\u5355\u9879${this.model.name}\u7684\u7F16\u8F91\u5668${this.model.editor.type}\u7684\u9002\u914D\u5668\u5B9E\u4F8B\uFF1A`, this.model);
-      return null;
-    }
-    const labelPosition = this.model.labelPosition || "left";
-    let content = null;
-    if (provider) {
-      if (provider.render) {
-        content = provider.render(this.c.editorValue, this.c.data, this.model);
-      } else {
-        if (provider.component) {
-          content = h(typeof provider.component === "string" ? resolveComponent(provider.component) : provider.component, {
-            key: this.model.name,
-            c: this.c,
-            value: this.c.editorValue,
-            itemModel: this.model,
-            model: this.model.editor,
-            data: this.c.data,
-            disabled: this.c.state.disabled,
-            readonly: this.c.state.readonly,
-            keepalive: this.c.state.keepalive,
-            visible: this.c.state.visible,
-            class: [this.ns.e("editor"), this.ns.e(labelPosition), this.model.editor.class],
-            style: this.model.editor.style,
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            "onUpdate:value": (value) => {
-              this.c.editorValue = value;
-            }
-          });
-        } else {
-          console.error(`\u672A\u627E\u5230\u7F16\u8F91\u5668\u7ED8\u5236\u7EC4\u4EF6\uFF1A${this.model.name} - ${this.model.editor.type}\uFF0C\u8BF7\u5B9E\u73B0 component \u6216 render \u65B9\u6CD5`);
-        }
-      }
-    } else {
-      console.error(`\u672A\u627E\u5230\u7F16\u8F91\u5668\u9002\u914D\u5668\uFF1A${this.model.name} - ${this.model.editor.type}`);
-    }
-    if (this.model.label && labelPosition === "top") {
-      content = [createVNode("div", {
-        "class": [this.ns.e("label"), this.ns.em("label", labelPosition)]
-      }, [this.model.label, this.renderLabelTooltip()]), content];
-    }
-    const itemSlots = {
-      default: () => {
-        return content;
-      }
-    };
-    if (labelPosition === "left" && this.model.label) {
-      itemSlots.label = () => {
-        return [createVNode("span", null, [this.model.label]), this.renderLabelTooltip()];
-      };
-    }
-    return createVNode(resolveComponent("a-form-item"), {
-      "key": this.c.model.name,
-      "colon": this.formModel.noColon === true ? false : this.model.noColon === true ? false : true,
-      "name": this.model.name,
-      "label": void 0,
-      "class": [this.ns.b(), this.ns.is("readonly", this.model.editor.readonly === true), this.ns.is("required", this.required), this.ns.is("hidden", this.c.state.visible === false), this.ns.is("hidden-label", !this.model.label), this.ns.m("label-" + labelPosition)],
-      "style": this.style,
-      "rules": this.c.state.visible === true ? this.model.rules : [],
-      "layout": "horizontal"
-    }, _isSlot(itemSlots) ? itemSlots : {
-      default: () => [itemSlots]
-    });
-  }
-});
-
-export { GctFormItem, GctFormItem as default };

package/es/widgets/gct-form/gct-form-item/gct-form-item.provider.mjs

@@ -1,11 +0,0 @@
-import { useFormItemController, FormItemController } from '@gct-paas/core';
-
-"use strict";
-class GctFormItemProvider {
-  component = "gct-form-item";
-  createController(form, item) {
-    return useFormItemController(() => new FormItemController(form, item));
-  }
-}
-
-export { GctFormItemProvider };

package/es/widgets/gct-form/gct-form-item/gct-form-item.scss

@@ -1,115 +0,0 @@
-$gct-form-item: (
-  min-height: 32px,
-  height: auto,
-  width: auto,
-  label-width: 100px,
-  readonly-color: #999,
-  label-align: right,
-  editor-align: left,
-  label-color: #252525,
-  label-font-size: 14px,
-  checkbox-width: 6px,
-  checkbox-height: 9px,
-);
-
-@include b(gct-form-item) {
-  @include set-component-css-var('form-item', $gct-form-item);
-
-  width: getCssVar(form-item, width);
-  height: getCssVar(form-item, height);
-  min-height: getCssVar(form-item, min-height);
-
-  @include when(hidden-label) {
-    .gct-gct-form-item__editor {
-      width: 100%;
-    }
-  }
-
-  @include when(hidden) {
-    display: none;
-  }
-
-  @include when(readonly) {
-    margin-bottom: 18px !important;
-    #{getCssVarName(form-item, min-height)}: 22px;
-
-    .ant-form-item-label {
-      padding: 0;
-
-      label {
-        color: getCssVar(form-item, readonly-color);
-      }
-    }
-
-    @include e(label) {
-      color: getCssVar(form-item, readonly-color);
-    }
-  }
-
-  @include when(required) {
-    @include e(label) {
-      &::before {
-        display: inline-block;
-        margin-inline-end: 4px;
-        color: #ff4d4f;
-        font-size: 14px;
-        font-family: SimSun, sans-serif;
-        line-height: 1;
-        content: '*';
-      }
-    }
-  }
-
-  .ant-form-item-label {
-    width: getCssVar(form-item, label-width);
-    text-align: getCssVar(form-item, label-align);
-
-    label {
-      color: getCssVar(form-item, label-color);
-      font-size: getCssVar(form-item, label-font-size);
-    }
-  }
-
-  .ant-form-item-control-input-content {
-    text-align: getCssVar(form-item, editor-align);
-  }
-
-  @include e(label) {
-    width: getCssVar(form-item, label-width);
-    line-height: 1.5715;
-    font-size: getCssVar(form-item, label-font-size);
-
-    @include m(top) {
-      width: 100%;
-    }
-  }
-
-  @include m(label-top) {
-    @include e(label) {
-      margin-bottom: 8px;
-    }
-  }
-
-  // 组件样式压
-  .ant-form-item-control-input {
-    flex-grow: 1;
-  }
-
-  .ant-checkbox-group {
-    font-size: getCssVar(form-item, label-font-size);
-
-    .ant-checkbox-wrapper {
-      font-size: getCssVar(form-item, label-font-size);
-    }
-
-    .ant-form input[type="checkbox"], .ant-checkbox-inner {
-      width: getCssVar(form-item, label-font-size);
-      height: getCssVar(form-item, label-font-size);
-    }
-
-    .ant-checkbox-inner::after {
-      width: getCssVar(form-item, checkbox-width);
-      height: getCssVar(form-item, checkbox-height);
-    }
-  }
-}

package/es/widgets/gct-form/gct-form-tab/gct-form-tab.mjs

@@ -1,53 +0,0 @@
-import { defineComponent, createVNode, resolveComponent } from 'vue';
-import { useNamespace } from '@gct-paas/core';
-import './gct-form-tab.scss';
-
-"use strict";
-const GctFormTab = /* @__PURE__ */ defineComponent({
-  name: "GctFormTab",
-  props: {
-    c: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    }
-  },
-  setup(props) {
-    const ns = useNamespace("form-tab");
-    const style = {};
-    if (props.model.width) {
-      style[ns.cssVarName("form-tab-width")] = props.model.width;
-    }
-    if (props.model.height) {
-      style[ns.cssVarName("form-tab-height")] = props.model.height;
-    }
-    return {
-      ns,
-      style
-    };
-  },
-  render() {
-    if (this.c.state.keepalive !== true && this.c.state.visible === false) {
-      return null;
-    }
-    const items = this.$slots.default?.() || [];
-    return createVNode(resolveComponent("a-tabs"), {
-      "class": [this.ns.b(), this.ns.is("hidden", this.c.state.visible === false), this.ns.m(this.model.navPosition || "left")],
-      "style": this.style
-    }, {
-      default: () => [this.model.children?.map((item, index) => {
-        return createVNode(resolveComponent("a-tab-pane"), {
-          "key": item.name,
-          "tab": item.title
-        }, {
-          default: () => [items[index]]
-        });
-      })]
-    });
-  }
-});
-
-export { GctFormTab, GctFormTab as default };

package/es/widgets/gct-form/gct-form-tab/gct-form-tab.provider.mjs

@@ -1,11 +0,0 @@
-import { useFormItemController, FormTabController } from '@gct-paas/core';
-
-"use strict";
-class GctFormTabProvider {
-  component = "gct-form-tab";
-  createController(form, item) {
-    return useFormItemController(() => new FormTabController(form, item));
-  }
-}
-
-export { GctFormTabProvider };

package/es/widgets/gct-form/gct-form-tab/gct-form-tab.scss

@@ -1,63 +0,0 @@
-$gct-form-tab: (
-  tab-spacing: 52px,
-  width: auto,
-  height: auto,
-);
-
-@include b(form-tab) {
-  @include set-component-css-var('form-tab', $gct-form-tab);
-
-  width: getCssVar(form-tab, width);
-  height: getCssVar(form-tab, height);
-
-  @include when(hidden) {
-    display: none;
-  }
-
-  // 原组件样式调整
-  >.ant-tabs-nav{
-    margin-bottom: 0 !important;
-    background-color: #fff;
-
-    >.ant-tabs-nav-wrap{
-      border-bottom: 1px solid #E0E3EA;
-    }
-
-    .ant-tabs-tab+.ant-tabs-tab{
-      margin-left: getCssVar(form-tab, tab-spacing);
-    }
-
-    /* stylelint-disable-next-line no-descending-specificity */
-    .ant-tabs-tab {
-      padding: 7px 0;
-    }
-  }
-
-  &.ant-tabs {
-    .ant-tabs-tabpane {
-      overflow: hidden auto;
-    }
-  }
-
-  >.ant-tabs-content-holder >.ant-tabs-content{
-    height: 100%;
-  }
-
-  @include m(left){
-    >.ant-tabs-nav .ant-tabs-nav-wrap{
-      justify-content: flex-start;
-    }
-  }
-
-  @include m(right){
-    >.ant-tabs-nav .ant-tabs-nav-wrap{
-      justify-content: flex-end;
-    }
-  }
-
-  @include m(center){
-    >.ant-tabs-nav .ant-tabs-nav-wrap{
-      justify-content: center;
-    }
-  }
-}

package/es/widgets/gct-form/gct-form-tab/index.mjs

@@ -1,12 +0,0 @@
-import { GctFormTabProvider } from './gct-form-tab.provider.mjs';
-import { GctFormTab as GctFormTab$1 } from './gct-form-tab.mjs';
-
-"use strict";
-var GctFormTab = {
-  install(app) {
-    _gct.register.formItem.register("tab", () => new GctFormTabProvider());
-    app.component(GctFormTab$1.name, GctFormTab$1);
-  }
-};
-
-export { GctFormTab as default };

package/es/widgets/gct-form/gct-form-tab-pane/gct-form-tab-pane.mjs

@@ -1,65 +0,0 @@
-import { isVNode, defineComponent, createVNode, resolveComponent } from 'vue';
-import { useNamespace } from '@gct-paas/core';
-import './gct-form-tab-pane.scss';
-
-"use strict";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const GctFormTabPane = /* @__PURE__ */ defineComponent({
-  name: "GctFormTabPane",
-  props: {
-    c: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    }
-  },
-  setup(props) {
-    const ns = useNamespace("form-tab-pane");
-    const style = {};
-    function renderContainer(items) {
-      if (props.model.layout === "flex") {
-        return createVNode(resolveComponent("flex-container"), {
-          "layout": props.model.flex
-        }, _isSlot(items) ? items : {
-          default: () => [items]
-        });
-      }
-      if (props.model.layout === "grid") {
-        return createVNode(resolveComponent("grid-container"), {
-          "layout": props.model.grid
-        }, _isSlot(items) ? items : {
-          default: () => [items]
-        });
-      }
-      console.error("\u4E0D\u652F\u6301\u7684layout\u7C7B\u578B" + props.model.layout);
-    }
-    if (props.model.width) {
-      style[ns.cssVarName("form-tab-pane-width")] = props.model.width;
-    }
-    if (props.model.height) {
-      style[ns.cssVarName("form-tab-pane-height")] = props.model.height;
-    }
-    return {
-      ns,
-      style,
-      renderContainer
-    };
-  },
-  render() {
-    if (this.c.state.keepalive !== true && this.c.state.visible === false) {
-      return null;
-    }
-    const items = this.$slots.default?.() || [];
-    return createVNode("div", {
-      "class": [this.ns.b(), this.ns.is("hidden", this.c.state.visible === false)],
-      "style": this.style
-    }, [this.renderContainer(items)]);
-  }
-});
-
-export { GctFormTabPane, GctFormTabPane as default };

package/es/widgets/gct-form/gct-form-tab-pane/gct-form-tab-pane.provider.mjs

@@ -1,11 +0,0 @@
-import { useFormItemController, FormTabPaneController } from '@gct-paas/core';
-
-"use strict";
-class GctFormTabPaneProvider {
-  component = "gct-form-tab-pane";
-  createController(form, item) {
-    return useFormItemController(() => new FormTabPaneController(form, item));
-  }
-}
-
-export { GctFormTabPaneProvider };

package/es/widgets/gct-form/gct-form-tab-pane/gct-form-tab-pane.scss

@@ -1,16 +0,0 @@
-$gct-form-tab-pane: (
-  width: auto,
-  height: auto,
-);
-
-@include b(form-tab-pane) {
-  @include set-component-css-var('form-tab-pane', $gct-form-tab-pane);
-
-  width: getCssVar(form-tab-pane, width);
-  height: 100%;
-  background-color: #fff;
-
-  @include when(hidden) {
-    display: none;
-  }
-}

package/es/widgets/gct-form/gct-form-tab-pane/index.mjs

@@ -1,15 +0,0 @@
-import { GctFormTabPaneProvider } from './gct-form-tab-pane.provider.mjs';
-import { GctFormTabPane as GctFormTabPane$1 } from './gct-form-tab-pane.mjs';
-
-"use strict";
-var GctFormTabPane = {
-  install(app) {
-    _gct.register.formItem.register(
-      "tab-pane",
-      () => new GctFormTabPaneProvider()
-    );
-    app.component(GctFormTabPane$1.name, GctFormTabPane$1);
-  }
-};
-
-export { GctFormTabPane as default };

package/es/widgets/gct-form/gct-form-title-group/gct-form-title-group.mjs

@@ -1,71 +0,0 @@
-import { isVNode, defineComponent, createVNode, ref, resolveComponent } from 'vue';
-import { useNamespace } from '@gct-paas/core';
-import './gct-form-title-group.scss';
-
-"use strict";
-function _isSlot(s) {
-  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const GctFormTitleGroup = /* @__PURE__ */ defineComponent({
-  name: "GctFormTitleGroup",
-  props: {
-    c: {
-      type: Object,
-      required: true
-    },
-    model: {
-      type: Object,
-      required: true
-    }
-  },
-  setup(props) {
-    const ns = useNamespace("gct-form-title-group");
-    const keys = ref([0]);
-    function renderContainer(items) {
-      if (props.model.layout === "flex") {
-        return createVNode(resolveComponent("flex-container"), {
-          "layout": props.model.flex
-        }, _isSlot(items) ? items : {
-          default: () => [items]
-        });
-      }
-      if (props.model.layout === "grid") {
-        return createVNode(resolveComponent("grid-container"), {
-          "layout": props.model.grid
-        }, _isSlot(items) ? items : {
-          default: () => [items]
-        });
-      }
-      console.error("\u4E0D\u652F\u6301\u7684layout\u7C7B\u578B" + props.model.layout);
-    }
-    const style = {};
-    if (props.model.width) {
-      style[ns.cssVarName("form-title-group-width")] = props.model.width;
-    }
-    if (props.model.height) {
-      style[ns.cssVarName("form-title-group-height")] = props.model.height;
-    }
-    return {
-      ns,
-      keys,
-      style,
-      renderContainer
-    };
-  },
-  render() {
-    if (this.c.state.keepalive !== true && this.c.state.visible === false) {
-      return null;
-    }
-    const items = this.$slots.default?.() || [];
-    return createVNode("div", {
-      "class": [this.ns.b(), this.ns.is("hidden", this.c.state.visible === false)],
-      "style": this.style
-    }, [createVNode("div", {
-      "class": this.ns.e("title")
-    }, [this.model.title]), createVNode("div", {
-      "class": this.ns.e("content")
-    }, [this.renderContainer(items)])]);
-  }
-});
-
-export { GctFormTitleGroup, GctFormTitleGroup as default };

package/es/widgets/gct-form/gct-form-title-group/gct-form-title-group.provider.mjs

@@ -1,11 +0,0 @@
-import { useFormItemController, FormGroupController } from '@gct-paas/core';
-
-"use strict";
-class GctFormTitleGroupProvider {
-  component = "gct-form-title-group";
-  createController(form, item) {
-    return useFormItemController(() => new FormGroupController(form, item));
-  }
-}
-
-export { GctFormTitleGroupProvider };

package/es/widgets/gct-form/gct-form-title-group/gct-form-title-group.scss

@@ -1,25 +0,0 @@
-$gct-form-title-group: (
-  min-height: 32px,
-  width: auto,
-  height: auto,
-);
-
-@include b(gct-form-title-group) {
-  @include set-component-css-var('form-title-group', $gct-form-title-group);
-
-  @include when(hidden) {
-    display: none;
-  }
-
-  @include e(title) {
-    color: #252525;
-    font-size: 12px;
-    padding: 8px 0;
-  }
-
-  @include e(content) {
-    .ant-form-item-label {
-      --gct-form-item-label-color: #797A7D;
-    }
-  }
-}

package/es/widgets/gct-form/gct-form-title-group/index.mjs

@@ -1,16 +0,0 @@
-import { FormContainerType } from '@gct-paas/core';
-import { GctFormTitleGroupProvider } from './gct-form-title-group.provider.mjs';
-import { GctFormTitleGroup as GctFormTitleGroup$1 } from './gct-form-title-group.mjs';
-
-"use strict";
-var GctFormTitleGroup = {
-  install(app) {
-    _gct.register.formItem.register(
-      FormContainerType.FORM_TITLE_GROUP,
-      () => new GctFormTitleGroupProvider()
-    );
-    app.component(GctFormTitleGroup$1.name, GctFormTitleGroup$1);
-  }
-};
-
-export { GctFormTitleGroup as default };