custom-variant-form 2.3.0 → 2.3.2

package/src/components/form-render/refMixin.js

@@ -1,30 +0,0 @@
-export default {
-  methods: {
-    initRefList() {
-      if ((this.refList !== null) && !!this.widget.options.name) {
-        this.refList[this.widget.options.name] = this
-      }
-    },
-
-    getWidgetRef(widgetName, showError = false) {
-      let foundRef = this.refList[widgetName]
-      if (!foundRef && !!showError) {
-        this.$message.error(this.i18nt('render.hint.refNotFound') + widgetName)
-      }
-      return foundRef
-    },
-
-    getFormRef() { /* 获取VFrom引用，必须在VForm组件created之后方可调用 */
-      return this.refList['v_form_ref']
-    },
-
-    getComponentByContainer(con) {
-      if (con.type === 'grid') {  //grid-item跟VueGridLayout全局注册组件重名，故特殊处理！！
-        return 'vf-grid-item'
-      }
-
-      return con.type + '-item'
-    },
-
-  }
-}

package/src/components/svg-icon/index.vue

@@ -1,49 +0,0 @@
-<template>
-  <svg :class="svgClass" aria-hidden="true">
-    <use :xlink:href="iconName"></use>
-    <title v-if="!!title">{{title}}</title>
-  </svg>
-</template>
-
-<script>
-  export default {
-    name: 'SvgIcon',
-    props: {
-      iconClass: {
-        type: String,
-        required: true
-      },
-      className: {
-        type: String
-      },
-      title: {
-        type: String,
-        default: ''
-      }
-    },
-    computed: {
-      iconName() {
-        return `#icon-${this.iconClass}`
-      },
-      svgClass() {
-        if (this.className) {
-          return 'svg-icon ' + this.className
-        } else {
-          return 'svg-icon'
-        }
-      }
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .svg-icon {
-    width: 1.1em;
-    height: 1.1em;
-    margin-left: 0.35em;
-    margin-right: 0.35em;
-    vertical-align: -0.15em;
-    fill: currentColor;
-    overflow: hidden;
-  }
-</style>

package/src/components/v-table/index.vue

@@ -1,106 +0,0 @@
-<template>
-  <el-container id="commonTable">
-    <el-main>
-      <el-table :data="data" :height="height" :max-height="maxHeight" border stripe tooltip-effect="light"
-                @selection-change="handleSelectionChange" :size="tableSize" :style="{width: tableWidth}">
-        <el-table-column v-if="showCheckBox" type="selection" width="45"></el-table-column>
-        <template v-for="(item, index) in columns">
-          <el-table-column
-                  v-if="item.show !== false"
-                  :key="index"
-                  :fixed="item.fixed"
-                  :prop="item.prop"
-                  :label="item.label"
-                  :align="item.align ? item.align:'center'"
-                  :width="item.width"
-                  :show-overflow-tooltip="true"
-                  :formatter="item.formatter ? item.formatter : formatterValue">
-          </el-table-column>
-        </template>
-        <slot name="table_operation"/>
-      </el-table>
-    </el-main>
-
-    <el-footer id="simpleTableFooter" v-if="showPager" style="height: 42px;padding-top: 6px; background: white">
-      <el-pagination
-              @size-change="handleSizeChange"
-              @current-change="handleCurrentChange"
-              style="text-align: right;margin:0;"
-              :current-page="pagination.pageNo"
-              :page-size="pagination.limit"
-              :page-sizes="pagination.sizes"
-              :total="pagination.total"
-              layout="total, sizes, prev, pager, next, jumper">
-      </el-pagination>
-    </el-footer>
-  </el-container>
-</template>
-
-<script>
-  export default {
-    name: 'VTable',
-    props: {
-      tableWidth: [String, Number],
-      columns: Array,
-      data: Array,
-      showPager: {
-        type: Boolean,
-        default: true
-      },
-      showCheckBox: {
-        type: Boolean,
-        default: false
-      },
-      pagination: Object,
-      height: {
-        type: String,
-        default: "100%"
-      },
-      maxHeight: {
-        type: Number,
-        default: 2000
-      },
-      tableSize: {
-        type: String,
-        default: 'medium'
-      },
-    },
-    methods: {
-      handleSelectionChange(val) {
-        this.$emit('handleSelectionChange', val);
-      },
-      handleSizeChange(val) {
-        this.$emit('handleSizeChange', val);
-      },
-      handleCurrentChange(val) {
-        this.$emit('handleCurrentChange', val);
-      },
-      formatterValue(row, column, cellValue) {
-        return cellValue;
-      }
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-
-  .el-table {
-    // 解决table组件内容滚动时页面滚动条同步滚动
-    overflow: auto;
-    // 必须设置
-    position: relative;
-
-    ::v-deep .el-table__fixed-header-wrapper thead th > .cell {
-      white-space: nowrap !important;  /* 禁止表头换行 */
-    }
-
-    ::v-deep .el-table__header-wrapper thead th > .cell {
-      white-space: nowrap !important;  /* 禁止表头换行 */
-    }
-
-    ::v-deep .el-table__body-wrapper {
-      //height: 100% !important;
-    }
-  }
-
-</style>

package/src/extension/components/tag/index.js

@@ -1,9 +0,0 @@
-import { tagSchema } from './tag-schema'
-import TagWidget from './tag-widget.vue'
-import TagItem from './tag-item.vue'
-
-export {
-  tagSchema,
-  TagWidget,
-  TagItem
-}

package/src/extension/components/tag/tag-item.vue

@@ -1,49 +0,0 @@
-<template>
-  <div class="tag-item">
-    <el-tag
-      :type="field.options.type"
-      :size="field.options.size"
-      :closable="field.options.closable"
-      :disable-transitions="field.options.disableTransitions"
-      :hit="field.options.hit"
-      :effect="field.options.effect"
-      @close="handleClose"
-    >
-      {{ field.options.content || 'Tag' }}
-    </el-tag>
-  </div>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "tag-item",
-    mixins: [i18n],
-    props: {
-      field: Object,
-      formData: Object,
-      value: [String, Number, Boolean, Array, Object],
-      disabled: Boolean,
-      rules: Array
-    },
-    methods: {
-      handleClose() {
-        if (this.field.options.onClose) {
-          try {
-            let func = new Function('$event', '$field', '$value', this.field.options.onClose)
-            func.call(this, 'close', this.field, this.value)
-          } catch (e) {
-            console.error('Error executing onClose event:', e)
-          }
-        }
-      }
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .tag-item {
-    display: inline-block;
-  }
-</style>

package/src/extension/components/tag/tag-schema.js

@@ -1,33 +0,0 @@
-export const tagSchema = {
-  type: 'tag',
-  icon: 'tag-field',
-  formItemFlag: true,
-  options: {
-    name: '',
-    label: 'Tag',
-    labelAlign: '',
-    content: 'Tag',
-    type: '',
-    size: '',
-    closable: false,
-    disableTransitions: false,
-    hit: false,
-    effect: 'plain',
-    columnWidth: '200px',
-    size: '',
-    labelWidth: null,
-    labelHidden: false,
-    disabled: false,
-    hidden: false,
-    //-------------------
-    customClass: '',  //自定义css类名
-    labelIconClass: null,
-    labelIconPosition: 'rear',
-    labelTooltip: null,
-    //-------------------
-    onCreated: '',
-    onMounted: '',
-    onClick: '',
-    onClose: ''
-  }
-}

package/src/extension/components/tag/tag-widget.vue

@@ -1,53 +0,0 @@
-<template>
-  <form-item-wrapper :designer="designer" :field="field" :parent-widget="parentWidget" :parent-list="parentList" :index-of-parent-list="indexOfParentList">
-    <el-tag
-      :key="field.id"
-      :type="field.options.type"
-      :size="field.options.size"
-      :closable="field.options.closable"
-      :disable-transitions="field.options.disableTransitions"
-      :hit="field.options.hit"
-      :effect="field.options.effect"
-      @click="selectWidget(field)"
-    >
-      {{ field.options.content || 'Tag' }}
-    </el-tag>
-  </form-item-wrapper>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import fieldMixin from "@/components/form-designer/form-widget/field-widget/fieldMixin"
-  import FormItemWrapper from "@/components/form-designer/form-widget/field-widget/form-item-wrapper"
-  import refMixinDesign from "@/components/form-designer/refMixinDesign"
-
-  export default {
-    name: "tag-widget",
-    componentName: 'FieldWidget',
-    mixins: [i18n, fieldMixin, refMixinDesign],
-    components: {
-      FormItemWrapper
-    },
-    props: {
-      field: Object,
-      parentWidget: Object,
-      parentList: Array,
-      indexOfParentList: Number,
-      designer: Object,
-    },
-    computed: {
-      selected() {
-        return this.field.id === this.designer.selectedId
-      }
-    },
-    created() {
-      this.initRefList()
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .selected {
-    outline: 2px solid $--color-primary !important;
-  }
-</style>

package/src/extension/extension-helper.js

@@ -1,23 +0,0 @@
-import {
-  addContainerWidgetSchema,
-  addBasicFieldSchema,
-  addAdvancedFieldSchema,
-  addCustomWidgetSchema
-} from '@/components/form-designer/widget-panel/widgetsConfig'
-import {
-  registerCommonProperty,
-  registerAdvancedProperty,
-  registerEventProperty
-} from '@/components/form-designer/setting-panel/propertyRegister'
-
-
-export default {
-  addContainerWidgetSchema,
-  addBasicFieldSchema,
-  addAdvancedFieldSchema,
-  addCustomWidgetSchema,
-
-  registerCommonProperty,
-  registerAdvancedProperty,
-  registerEventProperty,
-}

package/src/extension/extension-loader.js

@@ -1,174 +0,0 @@
-import Vue from 'vue'
-
-import {
-  addContainerWidgetSchema,
-  addCustomWidgetSchema
-} from '@/components/form-designer/widget-panel/widgetsConfig'
-import * as PERegister from '@/components/form-designer/setting-panel/propertyRegister'
-import * as PEFactory from '@/components/form-designer/setting-panel/property-editor-factory'
-
-import {cardSchema} from "@/extension/samples/extension-schema"
-import CardWidget from '@/extension/samples/card/card-widget'
-import CardItem from '@/extension/samples/card/card-item'
-import {registerCWGenerator} from '@/utils/sfc-generator'
-import {cardTemplateGenerator} from '@/extension/samples/extension-sfc-generator'
-
-import {alertSchema} from "@/extension/samples/extension-schema"
-import AlertWidget from '@/extension/samples/alert/alert-widget'
-import {registerFWGenerator} from '@/utils/sfc-generator'
-import {alertTemplateGenerator} from '@/extension/samples/extension-sfc-generator'
-
-import {tagSchema} from "@/extension/components/tag/tag-schema"
-import TagWidget from '@/extension/components/tag/tag-widget'
-import TagItem from '@/extension/components/tag/tag-item'
-
-export const loadExtension = function () {
-
-  /**
-   * 加载容器组件步骤：
-   * 1. 加载组件Json Schema;
-   * 2. 全局注册容器组件，容器组件有两种状态——设计期和运行期，故需要注册两个组件；
-   * 3. 全局注册属性编辑器组件（基本属性、高级属性、事件属性）；
-   * 4. 注册容器组件的代码生成器；
-   * 5. 加载完毕。
-   */
-  addContainerWidgetSchema(cardSchema)  //加载组件Json Schema
-  /* -------------------------------------------------- */
-  Vue.component(CardWidget.name, CardWidget)  //注册设计期的容器组件
-  Vue.component(CardItem.name, CardItem)  //注册运行期的容器组件
-  /* -------------------------------------------------- */
-  PERegister.registerCPEditor('card-folded', 'card-folded-editor',
-      PEFactory.createBooleanEditor('folded', 'extension.setting.cardFolded'))
-
-  PERegister.registerCPEditor('card-showFold', 'card-showFold-editor',
-      PEFactory.createBooleanEditor('showFold', 'extension.setting.cardShowFold'))
-
-  PERegister.registerCPEditor('card-cardWidth', 'card-cardWidth-editor',
-      PEFactory.createInputTextEditor('cardWidth', 'extension.setting.cardWidth'))
-
-  let shadowOptions = [
-    {label: 'never', value: 'never'},
-    {label: 'hover', value: 'hover'},
-    {label: 'always', value: 'always'},
-  ]
-  PERegister.registerCPEditor('card-shadow', 'card-shadow-editor',
-      PEFactory.createSelectEditor('shadow', 'extension.setting.cardShadow',
-          {optionItems: shadowOptions}))
-  /* -------------------------------------------------- */
-  registerCWGenerator('card', cardTemplateGenerator)  //注册容器组件的代码生成器
-  /* -------------------------------------------------- */
-  /* 容器组件加载完毕 end */
-
-  /**
-   * 加载字段组件步骤：
-   * 1. 加载组件Json Schema;
-   * 2. 全局注册字段组件，字段组件设计期和运行期共用，故需要仅需注册一个组件；
-   * 3. 全局注册属性编辑器组件（基本属性、高级属性、事件属性）；
-   * 4. 注册字段组件的代码生成器；
-   * 5. 加载完毕。
-   */
-  addCustomWidgetSchema(alertSchema)  //加载组件Json Schema
-  /* -------------------------------------------------- */
-  Vue.component(AlertWidget.name, AlertWidget)  //注册组件
-  /* -------------------------------------------------- */
-  PERegister.registerCPEditor('alert-title', 'alert-title-editor',
-      PEFactory.createInputTextEditor('title', 'extension.setting.alertTitle'))
-
-  let typeOptions = [
-    {label: 'success', value: 'success'},
-    {label: 'warning', value: 'warning'},
-    {label: 'info', value: 'info'},
-    {label: 'error', value: 'error'},
-  ]
-  // PERegister.registerCPEditor('alert-type', 'alert-type-editor',
-  //     PEFactory.createSelectEditor('type', 'extension.setting.alertType',
-  //         {optionItems: typeOptions}))
-  /* type属性映射已存在，无须再注册，故只需注册属性编辑器即可！！ */
-  Vue.component('alert-type-editor',
-      PEFactory.createSelectEditor('type', 'extension.setting.alertType',
-          {optionItems: typeOptions}))
-
-  PERegister.registerCPEditor('alert-description', 'alert-description-editor',
-      PEFactory.createInputTextEditor('description', 'extension.setting.description'))
-
-  PERegister.registerCPEditor('alert-closable', 'alert-closable-editor',
-      PEFactory.createBooleanEditor('closable', 'extension.setting.closable'))
-
-  PERegister.registerCPEditor('alert-closeText', 'alert-closeText-editor',
-      PEFactory.createInputTextEditor('closeText', 'extension.setting.closeText'))
-
-  PERegister.registerCPEditor('alert-center', 'alert-center-editor',
-      PEFactory.createBooleanEditor('center', 'extension.setting.center'))
-
-  PERegister.registerCPEditor('alert-showIcon', 'alert-showIcon-editor',
-      PEFactory.createBooleanEditor('showIcon', 'extension.setting.showIcon'))
-
-  let effectOptions = [
-    {label: 'light', value: 'light'},
-    {label: 'dark', value: 'dark'},
-  ]
-  PERegister.registerCPEditor('alert-effect', 'alert-effect-editor',
-      PEFactory.createRadioButtonGroupEditor('effect', 'extension.setting.effect',
-          {optionItems: effectOptions}))
-
-  PERegister.registerEPEditor('alert-onClose', 'alert-onClose-editor',
-      PEFactory.createEventHandlerEditor('onClose', []))
-  /* -------------------------------------------------- */
-  registerFWGenerator('alert', alertTemplateGenerator)  //注册字段组件的代码生成器
-  /* -------------------------------------------------- */
-  /* 字段组件加载完毕 end */
-
-  /**
-   * 加载Tag字段组件
-   */
-  addCustomWidgetSchema(tagSchema)  //加载组件Json Schema
-  /* -------------------------------------------------- */
-  Vue.component(TagWidget.name, TagWidget)  //注册设计期的字段组件
-  Vue.component(TagItem.name, TagItem)  //注册运行期的字段组件
-  /* -------------------------------------------------- */
-  PERegister.registerCPEditor('tag-content', 'tag-content-editor',
-      PEFactory.createInputTextEditor('content', 'extension.setting.tagContent'))
-
-  let tagTypeOptions = [
-    {label: '', value: ''},
-    {label: 'success', value: 'success'},
-    {label: 'warning', value: 'warning'},
-    {label: 'info', value: 'info'},
-    {label: 'error', value: 'error'},
-  ]
-  Vue.component('tag-type-editor',
-      PEFactory.createSelectEditor('type', 'extension.setting.tagType',
-          {optionItems: tagTypeOptions}))
-
-  let tagSizeOptions = [
-    {label: '', value: ''},
-    {label: 'medium', value: 'medium'},
-    {label: 'small', value: 'small'},
-    {label: 'mini', value: 'mini'},
-  ]
-  Vue.component('tag-size-editor',
-      PEFactory.createSelectEditor('size', 'extension.setting.tagSize',
-          {optionItems: tagSizeOptions}))
-
-  PERegister.registerCPEditor('tag-closable', 'tag-closable-editor',
-      PEFactory.createBooleanEditor('closable', 'extension.setting.tagClosable'))
-
-  PERegister.registerCPEditor('tag-disableTransitions', 'tag-disableTransitions-editor',
-      PEFactory.createBooleanEditor('disableTransitions', 'extension.setting.tagDisableTransitions'))
-
-  PERegister.registerCPEditor('tag-hit', 'tag-hit-editor',
-      PEFactory.createBooleanEditor('hit', 'extension.setting.tagHit'))
-
-  let tagEffectOptions = [
-    {label: 'plain', value: 'plain'},
-    {label: 'dark', value: 'dark'},
-  ]
-  Vue.component('tag-effect-editor',
-      PEFactory.createRadioButtonGroupEditor('effect', 'extension.setting.tagEffect',
-          {optionItems: tagEffectOptions}))
-
-  PERegister.registerEPEditor('tag-onClose', 'tag-onClose-editor',
-      PEFactory.createEventHandlerEditor('onClose', []))
-  /* -------------------------------------------------- */
-  /* Tag字段组件加载完毕 end */
-}

package/src/extension/samples/alert/alert-widget.vue

@@ -1,72 +0,0 @@
-<template>
-  <static-content-wrapper :designer="designer" :field="field" :design-state="designState"
-                          :parent-widget="parentWidget" :parent-list="parentList" :index-of-parent-list="indexOfParentList"
-                          :sub-form-row-index="subFormRowIndex" :sub-form-col-index="subFormColIndex" :sub-form-row-id="subFormRowId">
-    <el-alert ref="fieldEditor" :title="field.options.title" :type="field.options.type"
-              :description="field.options.description" :closable="field.options.closable"
-              :center="field.options.center" :close-text="field.options.closeText"
-              :show-icon="field.options.showIcon" :effect="field.options.effect" @close="handleCloseCustomEvent"></el-alert>
-  </static-content-wrapper>
-</template>
-
-<script>
-  import StaticContentWrapper from '@/components/form-designer/form-widget/field-widget/static-content-wrapper'
-  import emitter from '@/utils/emitter'
-  import i18n from "@/utils/i18n"
-  import fieldMixin from "@/components/form-designer/form-widget/field-widget/fieldMixin"
-
-  export default {
-    name: "alert-widget",
-    componentName: 'FieldWidget',  //必须固定为FieldWidget，用于接收父级组件的broadcast事件
-    mixins: [emitter, fieldMixin, i18n],
-    props: {
-      field: Object,
-      parentWidget: Object,
-      parentList: Array,
-      indexOfParentList: Number,
-      designer: Object,
-
-      designState: {
-        type: Boolean,
-        default: false
-      },
-
-      subFormRowIndex: { /* 子表单组件行索引，从0开始计数 */
-        type: Number,
-        default: -1
-      },
-      subFormColIndex: { /* 子表单组件列索引，从0开始计数 */
-        type: Number,
-        default: -1
-      },
-      subFormRowId: { /* 子表单组件行Id，唯一id且不可变 */
-        type: String,
-        default: ''
-      },
-
-    },
-    components: {
-      StaticContentWrapper,
-    },
-    created() {
-      this.registerToRefList()
-      this.initEventHandler()
-    },
-    beforeDestroy() {
-      this.unregisterFromRefList()
-    },
-    methods: {
-      handleCloseCustomEvent() {
-        if (!!this.field.options.onClose) {
-          let changeFn = new Function(this.field.options.onClose)
-          changeFn.call(this)
-        }
-      }
-
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-
-</style>