skhj-variant 2.1.12

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

@@ -0,0 +1,24 @@
+<template>
+  <el-time-picker v-model="optionModel.defaultValue" is-range @change="emitDefaultValueChange"
+                  :format="optionModel.format" value-format="HH:mm:ss" style="width: 100%">
+  </el-time-picker>
+</template>
+
+<script>
+  import i18n from "@/utils/i18n"
+  import propertyMixin from "@/components/form-designer/setting-panel/property-editor/propertyMixin"
+
+  export default {
+    name: "time-range-defaultValue-editor",
+    mixins: [i18n, propertyMixin],
+    props: {
+      designer: Object,
+      selectedWidget: Object,
+      optionModel: Object,
+    },
+  }
+</script>
+
+<style scoped>
+
+</style>

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

@@ -0,0 +1,27 @@
+<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

@@ -0,0 +1,23 @@
+<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

@@ -0,0 +1,23 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.filterable')">
+    <el-checkbox v-model="optionModel.filterable"></el-checkbox>
+  </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

@@ -0,0 +1,23 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.hidden')">
+    <el-checkbox v-model="optionModel.hidden"></el-checkbox>
+  </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

@@ -0,0 +1,10 @@
+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

@@ -0,0 +1,30 @@
+<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

@@ -0,0 +1,42 @@
+<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

@@ -0,0 +1,23 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.labelHidden')">
+    <el-checkbox v-model="optionModel.labelHidden"></el-checkbox>
+  </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

@@ -0,0 +1,28 @@
+<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

@@ -0,0 +1,37 @@
+<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

@@ -0,0 +1,23 @@
+<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

@@ -0,0 +1,25 @@
+<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

@@ -0,0 +1,24 @@
+<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

@@ -0,0 +1,39 @@
+<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

@@ -0,0 +1,40 @@
+<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

@@ -0,0 +1,40 @@
+<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

@@ -0,0 +1,41 @@
+<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

@@ -0,0 +1,24 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.multiple')">
+    <el-checkbox v-model="optionModel.multiple" @change="onMultipleSelected"></el-checkbox>
+  </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

@@ -0,0 +1,24 @@
+<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

@@ -0,0 +1,24 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.multipleSelect')">
+    <el-checkbox v-model="optionModel.multipleSelect"></el-checkbox>
+  </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>