cloud-web-corejs 1.0.276 → 1.0.278

package/src/components/xform/form-designer/setting-panel/property-editor/field-button/search-dialog-event-editor.vue

@@ -3,12 +3,16 @@
     <el-form-item label-width="0">
       <el-divider class="custom-divider">选择弹框配置</el-divider>
     </el-form-item>
+    <!-- 搜索类控件的多选是结构性的（决定字段值是数组还是标量），由控件自身的「是否多选」决定，
+         这里只做展示，避免两个开关各说各话 -->
     <el-form-item label="是否多选">
-      <el-switch v-model="eventConfig.multipleChoices"
-                 v-if="selectedWidget.type !== 'singerSearch' && selectedWidget.type !== 'multiSearch'"></el-switch>
-      <span v-else>{{eventConfig.multipleChoices?'是':'否'}}</span>
+      <el-switch v-model="eventConfig.multipleChoices" v-if="!vabsearchFlag"></el-switch>
+      <template v-else>
+        <span>{{ optionModel.multipleChoices ? '是' : '否' }}</span>
+        <span class="tips">由控件自身的「是否多选」决定</span>
+      </template>
     </el-form-item>
-    <el-form-item label="弹框表单编码">
+    <el-form-item class="form-item-label-top" label="弹框表单编码">
       <el-input type="text" v-model="eventConfig.formCode"></el-input>
     </el-form-item>
     <el-form-item label="弹框查询参数">
@@ -17,6 +21,8 @@
         <span>{{ eventConfig.dialogQueryParam }}</span>
         <i class="el-icon-edit"></i>
       </a>
+      <span class="tips">按业务字段过滤写
+        <code>return {'{'} condition: {'{'} status: 1 {'}'} {'}'}</code>（追加进查询区条件，同字段以脚本为准）</span>
     </el-form-item>
     <el-form-item label="弹框自定义参数">
       <a href="javascript:void(0);" class="a-link link-oneLind"
@@ -26,11 +32,11 @@
       </a>
     </el-form-item>
     <template v-if="hasConfig('vabsearchFlag')">
-      <el-form-item label="关联来源字段">
+      <el-form-item class="form-item-label-top" label="关联来源字段">
         <el-input type="text" v-model="eventConfig.valueSourceField"></el-input>
       </el-form-item>
 
-      <el-form-item label="展示来源字段">
+      <el-form-item class="form-item-label-top" label="展示来源字段">
         <el-input type="text" v-model="eventConfig.labelSourceField"></el-input>
       </el-form-item>
     </template>
@@ -42,10 +48,10 @@
         <el-switch v-model="eventConfig.tableEnabled"></el-switch>
       </el-form-item>
       <template v-if="eventConfig.tableEnabled">
-        <el-form-item label="关联表格ID">
+        <el-form-item class="form-item-label-top el-form-item-second" label="关联表格ID">
           <el-input type="text" v-model="eventConfig.tableRef"></el-input>
         </el-form-item>
-        <el-form-item label="关联表格唯一字段">
+        <el-form-item class="form-item-label-top el-form-item-second" label="关联表格唯一字段">
           <el-input type="text" v-model="eventConfig.tableUniqueKey"></el-input>
         </el-form-item>
       </template>
@@ -160,7 +166,6 @@ export default {
     selectedWidget: Object,
     optionModel: Object,
   },
-  inject: ['defaultClickBindEventConfig'],
   data() {
     return {
       showDialog: false,
@@ -197,6 +202,14 @@ export default {
   computed: {
     eventConfig() {
       return this.optionModel.searchDialogConfig || {};
+    },
+    vabsearchFlag() {
+      let type = this.selectedWidget.type;
+      return (
+        type === "vabsearch"
+        || type === "singerSearch"
+        || type === "multiSearch"
+      );
     }
   },
   created() {
@@ -216,5 +229,9 @@ export default {
 </script>
 
 <style scoped>
-
+.tips {
+  margin-left: 8px;
+  color: #909399;
+  font-size: 12px;
+}
 </style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-cascader/checkStrictly-editor.vue

@@ -5,19 +5,17 @@
 </template>
 
 <script>
-  import i18n from "../../../../../../components/xform/utils/i18n"
+import i18n from "../../../../../../components/xform/utils/i18n";
 
-  export default {
-    name: "checkStrictly-editor",
-    mixins: [i18n],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
+export default {
+  name: "checkStrictly-editor",
+  mixins: [i18n],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-common/keyName-editor.vue

@@ -1,67 +1,74 @@
-<template>
-  <div>
-    <el-form-item prop="keyName" v-if="optionModel.keyNameEnabled">
-      <span slot="label">数据属性名称
-        <el-tooltip effect="light" content="数据属性名称是指form-data对象中字段组件所对应的属性名称">
-          <i class="el-icon-info"></i></el-tooltip>
-      </span>
-      <el-input type="text" v-model="optionModel.keyName" :disabled="hasConfig('keyNameSuffix')"></el-input>
-    </el-form-item>
-    <el-form-item prop="keyName" label="属性名称前缀" v-if="optionModel.keyNameEnabled && hasConfig('keyNameSuffix')">
-      <span>{{ keyNamePrefixMap[selectedWidget.type] }}</span>
-    </el-form-item>
-    <el-form-item prop="keyName" label="属性名称后缀" v-if="optionModel.keyNameEnabled && hasConfig('keyNameSuffix')">
-      <el-input
-        class="search-input"
-        max="200"
-        v-model="optionModel.keyNameSuffix"
-        @change="changeKeyNameSuffix"
-      >
-        <el-tooltip slot="suffix" :enterable="false" effect="dark" content="随机生成" placement="top">
-          <i class="el-input__icon el-icon-refresh-right" @click="createRandomName"></i>
-        </el-tooltip>
-      </el-input>
-    </el-form-item>
-  </div>
-</template>
-
-<script>
-import i18n from "../../../../../../components/xform/utils/i18n"
-import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin"
-import {keyNamePrefixMap} from "../../../../../../components/xform/form-designer/widget-panel/widgetsConfig";
-
-export default {
-  name: "keyName-editor",
-  mixins: [i18n, propertyMixin],
-  props: {
-    designer: Object,
-    selectedWidget: Object,
-    optionModel: Object,
-  },
-  data() {
-    return {
-      keyNamePrefixMap
-    }
-  },
-  methods: {
-    changeKeyNameSuffix(val) {
-      this.optionModel.keyName = this.designer.createKeyName(this.selectedWidget.type, val);//生成属性名称
-    },
-    createRandomName() {
-      this.$baseConfirm('您确定要生成属性名称后缀吗？').then(() => {
-        this.optionModel.keyNameSuffix = this.designer.createKeyNameSuffix(this.selectedWidget.type);//生成后缀
-        this.changeKeyNameSuffix(this.optionModel.keyNameSuffix)
-        this.$message({
-          type: "success",
-          message: "success",
-          duration: 1000
-        })
-      });
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>
+<template>
+  <div>
+    <el-form-item class="form-item-label-top el-form-item-second" prop="keyName" v-if="optionModel.keyNameEnabled">
+      <span slot="label">数据属性名称
+        <el-tooltip effect="light" content="数据属性名称是指form-data对象中字段组件所对应的属性名称">
+          <i class="el-icon-info"></i></el-tooltip>
+      </span>
+      <el-input type="text" v-model="optionModel.keyName" :disabled="prefixMode"></el-input>
+    </el-form-item>
+    <el-form-item prop="keyName" label="属性名称前缀" v-if="optionModel.keyNameEnabled && prefixMode" class="el-form-item-second">
+      <span class="form-item-txt">{{ keyNamePrefixMap[selectedWidget.type] }}</span>
+    </el-form-item>
+    <el-form-item prop="keyName" label="属性名称后缀" v-if="optionModel.keyNameEnabled && prefixMode" class="form-item-label-top el-form-item-second">
+      <el-input
+        class="search-input"
+        max="200"
+        v-model="optionModel.keyNameSuffix"
+        @change="changeKeyNameSuffix"
+      >
+        <el-tooltip slot="suffix" :enterable="false" effect="dark" content="随机生成" placement="top">
+          <i class="el-input__icon el-icon-refresh-right" @click="createRandomName"></i>
+        </el-tooltip>
+      </el-input>
+    </el-form-item>
+  </div>
+</template>
+
+<script>
+import i18n from "../../../../../../components/xform/utils/i18n"
+import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin"
+import {keyNamePrefixMap} from "../../../../../../components/xform/form-designer/widget-panel/widgetsConfig";
+
+export default {
+  name: "keyName-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  data() {
+    return {
+      keyNamePrefixMap
+    }
+  },
+  computed: {
+    /* 附件字段默认按「前缀 + 随机后缀」生成 keyName，输入框锁死；
+       开了「值存为URL」后它是主表普通列，要让实施改成后端表字段名 */
+    prefixMode() {
+      return this.hasConfig('keyNameSuffix') && !this.optionModel.urlValueEnabled;
+    }
+  },
+  methods: {
+    changeKeyNameSuffix(val) {
+      this.optionModel.keyName = this.designer.createKeyName(this.selectedWidget.type, val, this.optionModel);//生成属性名称
+    },
+    createRandomName() {
+      this.$baseConfirm('您确定要生成属性名称后缀吗？').then(() => {
+        this.optionModel.keyNameSuffix = this.designer.createKeyNameSuffix(this.selectedWidget.type);//生成后缀
+        this.changeKeyNameSuffix(this.optionModel.keyNameSuffix)
+        this.$message({
+          type: "success",
+          message: "success",
+          duration: 1000
+        })
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date/date-dateLimit-editor.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-form-item label="关联开始字段">
+    <el-form-item label="关联开始字段" class="form-item-label-top">
       <el-select
         v-if="dateFieldOptions.length"
         v-model="optionModel.limitStartField"
@@ -22,7 +22,7 @@
         clearable
       ></el-input>
     </el-form-item>
-    <el-form-item label="关联结束字段">
+    <el-form-item label="关联结束字段" class="form-item-label-top">
       <el-select
         v-if="dateFieldOptions.length"
         v-model="optionModel.limitEndField"
@@ -44,9 +44,11 @@
         clearable
       ></el-input>
     </el-form-item>
-    <el-form-item label="最小日期">
+    <el-form-item label="最小日期" class="form-item-label-top">
+      <el-checkbox v-model="nowMinDate">当前日期</el-checkbox>
       <el-date-picker
-        v-model="optionModel.minDate"
+        v-if="!nowMinDate"
+        v-model="minDate"
         :type="pickerType"
         :format="optionModel.format"
         :value-format="optionModel.valueFormat"
@@ -55,7 +57,7 @@
         placeholder="留空则不限制"
       ></el-date-picker>
     </el-form-item>
-    <el-form-item label="最大日期">
+    <el-form-item label="最大日期" class="form-item-label-top">
       <el-date-picker
         v-model="optionModel.maxDate"
         :type="pickerType"
@@ -84,6 +86,26 @@ export default {
     tableColumns: Array,
   },
   computed: {
+    /* 老表单的options可能没有这些属性，统一用$set赋值，保证响应式 */
+    nowMinDate: {
+      get() {
+        return this.optionModel.minDateType === "now";
+      },
+      set(checked) {
+        this.$set(this.optionModel, "minDateType", checked ? "now" : "");
+        if (checked) {
+          this.$set(this.optionModel, "minDate", null);
+        }
+      },
+    },
+    minDate: {
+      get() {
+        return this.optionModel.minDate || null;
+      },
+      set(value) {
+        this.$set(this.optionModel, "minDate", value || null);
+      },
+    },
     pickerType() {
       return this.optionModel.type || "date";
     },

package/src/components/xform/form-designer/setting-panel/property-editor/field-date/date-defaultValue-editor.vue

@@ -1,26 +1,43 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.defaultValue')">
-    <el-date-picker :type="optionModel.type" v-model="optionModel.defaultValue" @change="emitDefaultValueChange"
-                    :format="optionModel.format" :value-format="optionModel.valueFormat" style="width: 100%">
-    </el-date-picker>
+  <el-form-item
+    :label="i18nt('designer.setting.defaultValue')"
+    class="form-item-label-top"
+  >
+    <relative-default-block
+      :option-model="optionModel"
+      widget-type="date"
+      @change="emitDefaultValueChange"
+    >
+      <el-date-picker
+        :type="optionModel.type"
+        v-model="optionModel.defaultValue"
+        @change="emitDefaultValueChange"
+        :format="optionModel.format"
+        :value-format="optionModel.valueFormat"
+        style="width: 100%"
+      >
+      </el-date-picker>
+    </relative-default-block>
   </el-form-item>
 </template>
 
 <script>
-  import i18n from "../../../../../../components/xform/utils/i18n"
-  import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin"
+import i18n from "../../../../../../components/xform/utils/i18n";
+import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+import RelativeDefaultBlock from "../../../../../../components/xform/form-designer/setting-panel/property-editor/relative-default-block";
 
-  export default {
-    name: "date-defaultValue-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
+export default {
+  name: "date-defaultValue-editor",
+  mixins: [i18n, propertyMixin],
+  components: {
+    RelativeDefaultBlock,
+  },
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date/date-format-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.format')">
+  <el-form-item :label="i18nt('designer.setting.format')" class="form-item-label-top">
     <el-select v-model="optionModel.format" filterable allow-create>
       <el-option label="yyyy-MM-dd" value="yyyy-MM-dd"></el-option>
       <el-option label="yyyy/MM/dd" value="yyyy/MM/dd"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date/date-type-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.displayType')">
+  <el-form-item :label="i18nt('designer.setting.displayType')" class="form-item-label-top">
     <el-select v-model="optionModel.type" @change="changeType">
       <el-option label="datetime" value="datetime"></el-option>
       <el-option label="date" value="date"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date/date-valueFormat-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.valueFormat')">
+  <el-form-item :label="i18nt('designer.setting.valueFormat')" class="form-item-label-top">
     <el-select v-model="optionModel.valueFormat" filterable allow-create>
       <el-option label="yyyy-MM-dd" value="yyyy-MM-dd"></el-option>
       <el-option label="yyyy-MM" value="yyyy-MM"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date-range/date-range-defaultTime-editor.vue

@@ -1,6 +1,6 @@
 <template>
 
-  <el-form-item :label="i18nt('默认时间')">
+  <el-form-item :label="i18nt('默认时间')" class="form-item-label-top">
     <el-time-picker v-model="optionModel.defaultTime" is-range @change="emitDefaultValueChange"
                     format="HH:mm:ss" value-format="HH:mm:ss" style="width: 100%">
     </el-time-picker>

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

@@ -1,26 +1,43 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.defaultValue')">
-    <el-date-picker :type="optionModel.type" v-model="optionModel.defaultValue" @change="emitDefaultValueChange"
-                    :format="optionModel.format" :value-format="optionModel.valueFormat" style="width: 100%">
-    </el-date-picker>
+  <el-form-item
+    :label="i18nt('designer.setting.defaultValue')"
+    class="form-item-label-top"
+  >
+    <relative-default-block
+      :option-model="optionModel"
+      widget-type="date-range"
+      @change="emitDefaultValueChange"
+    >
+      <el-date-picker
+        :type="optionModel.type"
+        v-model="optionModel.defaultValue"
+        @change="emitDefaultValueChange"
+        :format="optionModel.format"
+        :value-format="optionModel.valueFormat"
+        style="width: 100%"
+      >
+      </el-date-picker>
+    </relative-default-block>
   </el-form-item>
 </template>
 
 <script>
-  import i18n from "../../../../../../components/xform/utils/i18n"
-  import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin"
+import i18n from "../../../../../../components/xform/utils/i18n";
+import propertyMixin from "../../../../../../components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+import RelativeDefaultBlock from "../../../../../../components/xform/form-designer/setting-panel/property-editor/relative-default-block";
 
-  export default {
-    name: "date-range-defaultValue-editor",
-    mixins: [i18n, propertyMixin],
-    props: {
-      designer: Object,
-      selectedWidget: Object,
-      optionModel: Object,
-    },
-  }
+export default {
+  name: "date-range-defaultValue-editor",
+  mixins: [i18n, propertyMixin],
+  components: {
+    RelativeDefaultBlock,
+  },
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

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

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.format')">
+  <el-form-item :label="i18nt('designer.setting.format')" class="form-item-label-top">
     <el-select v-model="optionModel.format" filterable allow-create>
       <el-option label="yyyy-MM-dd" value="yyyy-MM-dd"></el-option>
       <el-option label="yyyy/MM/dd" value="yyyy/MM/dd"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date-range/date-range-type-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.displayType')">
+  <el-form-item :label="i18nt('designer.setting.displayType')" class="form-item-label-top">
     <el-select v-model="optionModel.type" @change="changeType">
       <el-option label="daterange" value="daterange"></el-option>
       <el-option label="datetimerange" value="datetimerange"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-date-range/date-range-valueFormat-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.valueFormat')">
+  <el-form-item :label="i18nt('designer.setting.valueFormat')" class="form-item-label-top">
     <el-select v-model="optionModel.valueFormat" filterable allow-create>
       <el-option label="yyyy-MM-dd" value="yyyy-MM-dd"></el-option>
       <el-option label="yyyy-MM" value="yyyy-MM"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-divider/contentPosition-editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item :label="i18nt('designer.setting.contentPosition')">
+  <el-form-item :label="i18nt('designer.setting.contentPosition')" class="form-item-label-top">
     <el-select v-model="optionModel.contentPosition">
       <el-option label="center" value="center"></el-option>
       <el-option label="left" value="left"></el-option>

package/src/components/xform/form-designer/setting-panel/property-editor/field-dropdown-menu/dropdown-menu-editor.vue

@@ -1,59 +1,59 @@
-<template>
-  <div>
-    <el-form-item :label="i18nt('designer.setting.tabPaneSetting')"></el-form-item>
-    <el-form-item label-width="0" class="panes-setting">
-      <draggable tag="ul" :list="selectedWidget.widgetList"
-                 v-bind="{group:'panesGroup', ghostClass: 'ghost', handle: '.drag-option'}" class="draggable-box">
-        <li v-for="(tpItem, tpIdx) in selectedWidget.widgetList" :key="tpIdx" class="col-item">
-          <el-input type="text" v-model="tpItem.options.label" style="width:calc(100% - 65px) !important;"></el-input>
-          <i class="el-icon-s-operation drag-option"></i>
-          <el-button circle plain size="mini" type="danger" @click="deleteTabPane(selectedWidget, tpIdx)"
-                     icon="el-icon-minus" class="col-delete-button"></el-button>
-        </li>
-        <div>
-          <el-button type="text" @click="addTabPane(selectedWidget)" icon="el-icon-circle-plus-outline" class="add-option">{{i18nt('designer.setting.addTabPane')}}</el-button>
-        </div>
-      </draggable>
-    </el-form-item>
-  </div>
-</template>
-<script>
-import i18n from "@base/components/xform/utils/i18n";
-import Draggable from 'vuedraggable'
-import {deepClone} from "../../../../../../components/xform/utils/util";
-
-export default {
-  name: "dropdown-menu-editor",
-  components: {Draggable},
-  mixins: [i18n],
-  props: {
-    designer: Object,
-    selectedWidget: Object,
-    optionModel: Object,
-  },
-  methods: {
-    onTabPaneActiveChange(evt, tpItem) {
-      //TODO: !!!
-    },
-
-    addTabPane(curTabs) {
-      this.designer.addDropdownItem(curTabs)
-      this.designer.emitHistoryChange()
-    },
-
-    deleteTabPane(curTabs, tpIdx) {
-      if (curTabs.widgetList.length === 1) {
-        this.$message.info(this.i18nt('designer.hint.lastPaneCannotBeDeleted'))
-        return
-      }
-
-      this.designer.deleteDropdownItem(curTabs, tpIdx)
-      this.designer.emitHistoryChange()
-    },
-
-  }
-}
-</script>
-<style scoped>
-
-</style>
+<template>
+  <div>
+    <el-form-item :label="i18nt('designer.setting.tabPaneSetting')"></el-form-item>
+    <el-form-item label-width="0" class="panes-setting form-item-label-top">
+      <draggable tag="ul" :list="selectedWidget.widgetList"
+                 v-bind="{group:'panesGroup', ghostClass: 'ghost', handle: '.drag-option'}" class="draggable-box">
+        <li v-for="(tpItem, tpIdx) in selectedWidget.widgetList" :key="tpIdx" class="col-item">
+          <el-input type="text" v-model="tpItem.options.label" style="width:calc(100% - 65px) !important;"></el-input>
+          <i class="el-icon-s-operation drag-option"></i>
+          <el-button circle plain size="mini" type="danger" @click="deleteTabPane(selectedWidget, tpIdx)"
+                     icon="el-icon-minus" class="col-delete-button"></el-button>
+        </li>
+        <div>
+          <el-button type="text" @click="addTabPane(selectedWidget)" icon="el-icon-circle-plus-outline" class="add-option">{{i18nt('designer.setting.addTabPane')}}</el-button>
+        </div>
+      </draggable>
+    </el-form-item>
+  </div>
+</template>
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import Draggable from 'vuedraggable'
+import {deepClone} from "../../../../../../components/xform/utils/util";
+
+export default {
+  name: "dropdown-menu-editor",
+  components: {Draggable},
+  mixins: [i18n],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+  methods: {
+    onTabPaneActiveChange(evt, tpItem) {
+      //TODO: !!!
+    },
+
+    addTabPane(curTabs) {
+      this.designer.addDropdownItem(curTabs)
+      this.designer.emitHistoryChange()
+    },
+
+    deleteTabPane(curTabs, tpIdx) {
+      if (curTabs.widgetList.length === 1) {
+        this.$message.info(this.i18nt('designer.hint.lastPaneCannotBeDeleted'))
+        return
+      }
+
+      this.designer.deleteDropdownItem(curTabs, tpIdx)
+      this.designer.emitHistoryChange()
+    },
+
+  }
+}
+</script>
+<style scoped>
+
+</style>