custom-variant-form 2.3.0 → 2.3.2

package/src/components/form-designer/setting-panel/property-editor/field-time-range/time-range-format-editor.vue

@@ -1,27 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.format')">
-    <el-select v-model="optionModel.format" filterable allow-create>
-      <el-option label="HH:mm:ss" value="HH:mm:ss"></el-option>
-      <el-option label="HH时mm分ss秒" value="HH时mm分ss秒"></el-option>
-      <el-option label="hh:mm:ss" value="hh:mm:ss"></el-option>
-    </el-select>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "time-range-format-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/fileMaxSize-editor.vue

@@ -1,23 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.fileMaxSize')">
-    <el-input-number v-model="optionModel.fileMaxSize" :min="1" class="hide-spin-button" style="width: 100%"></el-input-number>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "fileMaxSize-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/filterable-editor.vue

@@ -1,23 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.filterable')">
-    <el-switch v-model="optionModel.filterable"></el-switch>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "filterable-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/hidden-editor.vue

@@ -1,23 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.hidden')">
-    <el-switch v-model="optionModel.hidden"></el-switch>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "hidden-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/index.js

@@ -1,10 +0,0 @@
-const requireComponent = require.context('./', true, /\w+\.vue$/)  //遍历当前目录和子目录
-
-let comps = {}
-
-requireComponent.keys().map(fileName => {
-  let comp = requireComponent(fileName).default;
-  comps[comp.name] = comp
-})
-
-export default comps;

package/src/components/form-designer/setting-panel/property-editor/label-editor.vue

@@ -1,30 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.label')" v-if="!noLabelSetting">
-    <el-input type="text" v-model="optionModel.label"></el-input>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "label-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      noLabelSetting() {
-        return (this.selectedWidget.type === 'static-text') || (this.selectedWidget.type === 'html-text')
-        //|| (this.selectedWidget.type === 'divider')
-      },
-
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelAlign-editor.vue

@@ -1,42 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.labelAlign')" v-if="!noLabelSetting && (selectedWidget.type !== 'button')">
-    <el-radio-group v-model="optionModel.labelAlign" class="radio-group-custom">
-      <el-radio-button label="label-left-align">
-        {{i18nt('designer.setting.leftAlign')}}</el-radio-button>
-      <el-radio-button label="label-center-align">
-        {{i18nt('designer.setting.centerAlign')}}</el-radio-button>
-      <el-radio-button label="label-right-align">
-        {{i18nt('designer.setting.rightAlign')}}</el-radio-button>
-    </el-radio-group>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "labelAlign-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      noLabelSetting() {
-        return (this.selectedWidget.type === 'static-text') || (this.selectedWidget.type === 'html-text')
-        //|| (this.selectedWidget.type === 'divider')
-      },
-
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  .radio-group-custom {
-    ::v-deep .el-radio-button__inner {
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelHidden-editor.vue

@@ -1,23 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.labelHidden')">
-    <el-switch v-model="optionModel.labelHidden"></el-switch>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "labelHidden-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelIconClass-editor.vue

@@ -1,28 +0,0 @@
-<template>
-  <div>
-    <el-form-item label-width="0">
-      <el-divider class="custom-divider">{{i18nt('designer.setting.customLabelIcon')}}</el-divider>
-    </el-form-item>
-    <el-form-item :label="i18nt('designer.setting.labelIconClass')">
-      <el-input type="text" v-model="optionModel.labelIconClass"></el-input>
-    </el-form-item>
-  </div>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "labelIconClass-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelIconPosition-editor.vue

@@ -1,37 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.labelIconPosition')">
-    <el-select v-model="optionModel.labelIconPosition">
-      <el-option v-for="item in labelIconPosition" :key="item.value" :label="item.label"
-                 :value="item.value">
-      </el-option>
-    </el-select>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "labelIconPosition-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    data() {
-      return {
-        labelIconPosition: [
-          {label: 'front', value: 'front'},
-          {label: 'rear', value: 'rear'},
-        ],
-
-      }
-    },
-
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelTooltip-editor.vue

@@ -1,23 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.labelTooltip')">
-    <el-input type="text" v-model="optionModel.labelTooltip"></el-input>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "labelTooltip-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/labelWidth-editor.vue

@@ -1,25 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.labelWidth')">
-    <el-input type="number" v-model="optionModel.labelWidth" @input.native="inputNumberHandler"
-              min="0" class="hide-spin-button"></el-input>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"
-
-  export default {
-    name: "labelWidth-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/limit-editor.vue

@@ -1,24 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.limit')">
-    <el-input-number v-model="optionModel.limit" :min="1" class="hide-spin-button" style="width: 100%"></el-input-number>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "limit-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/max-editor.vue

@@ -1,39 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.maxValue')">
-    <el-input-number v-model="maxValue" class="hide-spin-button" style="width: 100%"></el-input-number>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "max-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      maxValue: {
-        get() {
-          return this.optionModel['max']
-        },
-
-        set(newValue) {
-          if (!newValue || isNaN(newValue)) {
-            this.optionModel.max = null
-          } else {
-            this.optionModel.max = Number(newValue)
-          }
-        }
-      },
-
-    }
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/maxLength-editor.vue

@@ -1,40 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.maxLength')">
-    <el-input type="number" @input.native="inputNumberHandler" class="hide-spin-button"
-              min="1" v-model="maxLength" style="width: 100%"></el-input>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"
-
-  export default {
-    name: "maxLength-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      maxLength: {
-        get() {
-          return this.optionModel['maxLength']
-        },
-
-        set(newValue) {
-          if (!newValue || isNaN(newValue)) {
-            this.optionModel.maxLength = null
-          } else {
-            this.optionModel.maxLength = Number(newValue)
-          }
-        }
-      },
-    }
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/min-editor.vue

@@ -1,40 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.minValue')">
-    <el-input-number v-model="minValue" class="hide-spin-button" style="width: 100%"></el-input-number>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "min-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      minValue: {
-        get() {
-          return this.optionModel['min']
-        },
-
-        set(newValue) {
-          //if ((!newValue && (newValue !== 0)) || isNaN(newValue)) {
-          if ((newValue === undefined) || (newValue === null) || isNaN(newValue)) {
-            this.optionModel.min = null
-          } else {
-            this.optionModel.min = Number(newValue)
-          }
-        }
-      },
-
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/minLength-editor.vue

@@ -1,41 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.minLength')">
-    <el-input type="number" @input.native="inputNumberHandler" class="hide-spin-button"
-              min="0" v-model="minLength" style="width: 100%"></el-input>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"
-
-  export default {
-    name: "minLength-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    computed: {
-      minLength: {
-        get() {
-          return this.optionModel['minLength']
-        },
-
-        set(newValue) {
-          if (!newValue || isNaN(newValue)) {
-            this.optionModel.minLength = null
-          } else {
-            this.optionModel.minLength = Number(newValue)
-          }
-        }
-      },
-
-    }
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/multiple-editor.vue

@@ -1,24 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.multiple')">
-    <el-switch v-model="optionModel.multiple" @change="onMultipleSelected"></el-switch>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"
-
-  export default {
-    name: "multiple-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/multipleLimit-editor.vue

@@ -1,24 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.multipleLimit')">
-    <el-input-number v-model="optionModel.multipleLimit" :min="0"
-                     class="hide-spin-button" style="width: 100%"></el-input-number>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-
-  export default {
-    name: "multipleLimit-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/multipleSelect-editor.vue

@@ -1,24 +0,0 @@
-<template>
-  <el-form-item :label="i18nt('designer.setting.multipleSelect')">
-    <el-switch v-model="optionModel.multipleSelect"></el-switch>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n";
-
-  export default {
-    name: "multipleSelect-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-
-  }
-</script>
-
-<style scoped>
-
-</style>

package/src/components/form-designer/setting-panel/property-editor/name-editor.vue

@@ -1,89 +0,0 @@
-<template>
-  <el-form-item prop="name" :rules="nameRequiredRule">
-    <span slot="label">{{i18nt('designer.setting.uniqueName')}}
-      <el-tooltip effect="light" :content="i18nt('designer.setting.editNameHelp')">
-        <i class="el-icon-info"></i></el-tooltip>
-    </span>
-    <template v-if="(!!selectedWidget.category && (selectedWidget.type !== 'sub-form')) || noFieldList">
-      <el-input type="text" v-model="optionModel.name" :readonly="widgetNameReadonly" @change="updateWidgetNameAndRef"></el-input>
-    </template>
-    <template v-else>
-      <el-select v-model="optionModel.name" allow-create filterable :disabled="widgetNameReadonly" @change="updateWidgetNameAndRef"
-                 :title="i18nt('designer.setting.editNameHelp')">
-        <el-option v-for="(sf, sfIdx) in serverFieldList" :key="sfIdx" :label="sf.label" :value="sf.name"></el-option>
-      </el-select>
-    </template>
-  </el-form-item>
-</template>
-
-<script>
-  import i18n from "@/utils/i18n"
-  import {isEmptyStr} from "@/utils/util"
-
-  export default {
-    name: "name-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-    inject: ['serverFieldList', 'getDesignerConfig'],
-    data() {
-      return {
-        nameRequiredRule: [{required: true, message: 'name required'}],
-      }
-    },
-    computed: {
-      noFieldList() {
-        return !this.serverFieldList || (this.serverFieldList.length <= 0)
-      },
-
-      widgetNameReadonly() {
-        return !!this.getDesignerConfig().widgetNameReadonly
-      },
-
-    },
-    methods: {
-      updateWidgetNameAndRef(newName) {
-        let oldName = this.designer.selectedWidgetName
-        if (isEmptyStr(newName)) {
-          this.selectedWidget.options.name = oldName
-          this.$message.info(this.i18nt('designer.hint.nameRequired'))
-          return
-        }
-
-        if (!!this.designer.formWidget) {
-          let foundRef = this.designer.formWidget.getWidgetRef(newName) // 检查newName是否已存在！！
-          if (!!foundRef) {
-            this.selectedWidget.options.name = oldName
-            this.$message.info(this.i18nt('designer.hint.duplicateName') + newName)
-            return
-          }
-
-          let widgetInDesign = this.designer.formWidget.getWidgetRef(oldName)
-          if (!!widgetInDesign && !!widgetInDesign.registerToRefList) {
-            widgetInDesign.registerToRefList(oldName)  //注册组件新的ref名称并删除老的ref！！
-            let newLabel = this.getLabelByFieldName(newName)
-            this.designer.updateSelectedWidgetNameAndLabel(this.selectedWidget, newName, newLabel)
-          }
-        }
-      },
-
-      getLabelByFieldName(fieldName) {
-        for (let i = 0; i < this.serverFieldList.length; i++) {
-          if (this.serverFieldList[i].name === fieldName) {
-            return this.serverFieldList[i].label
-          }
-        }
-
-        return null
-      },
-
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-
-</style>