eoss-ui 0.5.81-beta20 → 0.5.81-beta21

package/lib/theme-chalk/tabs.css

@@ -1 +1 @@
-@charset "UTF-8";.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap{padding:5px 8px 0}.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap .is-top .el-tabs__item{padding:0 16px}.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap .is-top .el-tabs__item+.el-tabs__item{padding-left:20px}.es-tabs .el-tabs__nav-wrap::after{height:1px}.es-tabs.el-tabs--left .el-tabs__nav-wrap.is-left::after,.es-tabs.el-tabs--left .el-tabs__nav-wrap.is-right::after,.es-tabs.el-tabs--right .el-tabs__nav-wrap.is-left::after,.es-tabs.el-tabs--right .el-tabs__nav-wrap.is-right::after{width:1px}.es-tabs.el-tabs--border-card .el-tabs__header{height:44px;border-bottom:1px solid #d9d9d9}.es-tabs.el-tabs--border-card .el-tabs__nav-scroll{padding:9px 10px 0}.es-tabs.el-tabs--border-card .el-tabs__nav-scroll .el-tabs__item{height:36px;line-height:36px}.es-tabs.el-tabs--border-card .el-tabs__nav-scroll .el-tabs__item .el-badge{position:absolute;right:0;top:0;line-height:0}.es-tabs.el-tabs--border-card .el-tabs__nav-scroll .el-tabs__item .el-badge .el-badge__content{display:block;line-height:16px;font-weight:200;width:16px;height:16px;padding:0;border:0}.es-tabs.el-tabs--border-card .el-tabs__nav-scroll .el-tabs__item.is-active{border-top-color:#d9d9d9;border-top-left-radius:2px;border-top-right-radius:2px;font-weight:700;color:#1890ff}.es-tabs .el-tabs__content{padding:0}.es-tabs.es-tabs-full{padding-top:44px;position:relative}.es-tabs.es-tabs-full .el-tabs__header.is-top{position:absolute;left:0;top:0;right:0}.es-tabs.es-tabs-full .el-tab-pane,.es-tabs.es-tabs-full .el-tabs__content{height:100%}.es-tabs.es-tabs-full .el-tab-pane.es-tabs-padding,.es-tabs.es-tabs-full .el-tabs__content.es-tabs-padding{padding:12px}.es-tabs .es-tabs-panel{height:100%}.es-tabs .es-tabs-panel .es-data-table-content{padding:16px}
+@charset "UTF-8";.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap:not(.is-scrollable){padding:5px 8px 0}.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap:not(.is-scrollable) .is-top .el-tabs__item{padding:0 16px}.es-tabs:not(.el-tabs--card):not(.el-tabs--border-card):not(.el-tabs--left) .el-tabs__nav-wrap:not(.is-scrollable) .is-top .el-tabs__item+.el-tabs__item{padding-left:20px}.es-tabs .el-tabs__nav-wrap::after{height:1px}.es-tabs.el-tabs--left .el-tabs__nav-wrap.is-left::after,.es-tabs.el-tabs--left .el-tabs__nav-wrap.is-right::after,.es-tabs.el-tabs--right .el-tabs__nav-wrap.is-left::after,.es-tabs.el-tabs--right .el-tabs__nav-wrap.is-right::after{width:1px}.es-tabs.el-tabs--border-card>.el-tabs__header{height:44px;border-bottom:1px solid #d9d9d9}.es-tabs.el-tabs--border-card>.el-tabs__header .el-tabs__nav-scroll{padding:9px 10px 0}.es-tabs.el-tabs--border-card>.el-tabs__header .el-tabs__nav-scroll .el-tabs__item{height:36px;line-height:36px}.es-tabs.el-tabs--border-card>.el-tabs__header .el-tabs__nav-scroll .el-tabs__item .el-badge .el-badge__content{display:block;line-height:16px;font-weight:200;width:16px;height:16px;padding:0;border:0}.es-tabs.el-tabs--border-card>.el-tabs__header .el-tabs__nav-scroll .el-tabs__item.is-active{border-top-color:#d9d9d9;border-top-left-radius:2px;border-top-right-radius:2px;font-weight:700;color:#1890ff}.es-tabs .el-tabs__content{padding:0}.es-tabs.es-tabs-full{padding-top:44px;position:relative}.es-tabs.es-tabs-full .el-tabs__header.is-top{position:absolute;left:0;top:0;right:0}.es-tabs.es-tabs-full .el-tab-pane,.es-tabs.es-tabs-full .el-tabs__content{height:100%}.es-tabs.es-tabs-full .el-tab-pane.es-tabs-padding,.es-tabs.es-tabs-full .el-tabs__content.es-tabs-padding{padding:12px}.es-tabs .es-tabs-panel{height:100%}.es-tabs .es-tabs-panel .es-data-table-content{padding:16px}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eoss-ui",
-  "version": "0.5.81-beta20",
+  "version": "0.5.81-beta21",
   "description": "eoss内部业务组件",
   "main": "lib/eoss-ui.common.js",
   "files": [
@@ -69,7 +69,7 @@
     "stompjs": "^2.3.3",
     "throttle-debounce": "^5.0.2",
     "video.js": "^8.0.4",
-    "wujie-vue2": "^1.0.18"
+    "wujie-vue2": "^1.0.22"
   },
   "peerDependencies": {
     "vue": "^2.5.22"
@@ -97,7 +97,7 @@
     "cp-cli": "^1.0.2",
     "cross-env": "^3.1.3",
     "css-loader": "^2.1.0",
-    "eoss-element": "^0.3.15",
+    "eoss-element": "^0.3.17",
     "es6-promise": "^4.0.5",
     "eslint": "4.18.2",
     "eslint-config-elemefe": "0.1.1",

package/packages/data-table/src/column.vue

@@ -13,7 +13,7 @@
           <component
             v-if="getType(scope.row.formConfigs, 'component')"
             :is="tag"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @blur="
@@ -50,7 +50,7 @@
           ></component>
           <es-select
             v-else-if="getType(scope.row.formConfigs, 'select')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @blur="
@@ -88,7 +88,7 @@
           </es-select>
           <es-cascader
             v-else-if="getType(scope.row.formConfigs, 'cascader')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @blur="
@@ -126,7 +126,7 @@
           </es-cascader>
           <es-select-ganged
             v-else-if="getType(scope.row.formConfigs, 'ganged')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="init(getData(scope.row.formOptions), config)"
             @change="
@@ -143,7 +143,7 @@
           </es-select-ganged>
           <es-radio-group
             v-else-if="getType(scope.row.formConfigs, 'radio')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @change="
@@ -160,7 +160,7 @@
           </es-radio-group>
           <es-checkbox-group
             v-else-if="getType(scope.row.formConfigs, 'checkbox')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @change="
@@ -177,7 +177,7 @@
           </es-checkbox-group>
           <es-switch
             v-else-if="getType(scope.row.formConfigs, 'switch')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :data="getData(scope.row.formOptions)"
             @change="
@@ -210,7 +210,7 @@
                 'halfyear'
               ])
             "
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             :type="type"
             @blur="
@@ -248,7 +248,7 @@
           </es-date-picker>
           <es-input-number
             v-else-if="getType(scope.row.formConfigs, 'number')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             @blur="
               (event) => {
@@ -285,7 +285,7 @@
           </es-input-number>
           <es-selector
             v-else-if="getType(scope.row.formConfigs, 'selector')"
-            v-bind="formOption"
+            v-bind="getOptions(scope.row.formConfigs)"
             v-model="scope.row[field || prop]"
             v-on="
               exclAttribute({
@@ -314,7 +314,7 @@
               <input
                 v-if="getType(scope.row.formConfigs, ['text', 'input'])"
                 class="el-input__inner"
-                v-bind="formOption"
+                v-bind="getOptions(scope.row.formConfigs)"
                 v-model.lazy="scope.row[field]"
                 @blur="
                   (event) => {
@@ -351,7 +351,7 @@
               <textarea
                 v-else
                 class="el-textarea__inner"
-                v-bind="formOption"
+                v-bind="getOptions(scope.row.formConfigs)"
                 v-model.lazy="scope.row[field]"
                 @blur="
                   (event) => {
@@ -388,7 +388,7 @@
             </template>
             <es-input
               v-else
-              v-bind="formOption"
+              v-bind="getOptions(scope.row.formConfigs)"
               :type="type"
               :scope="scope"
               v-model="scope.row[field || prop]"
@@ -784,10 +784,17 @@ export default {
     getType(config, types) {
       let type =
         config && config[this.field || this.prop]
-          ? config[this.field || this.prop]
+          ? config[this.field || this.prop]['type'] ||
+            config[this.field || this.prop]
           : this.type;
       return Array.isArray(types) ? types.includes(type) : type == types;
     },
+    getOptions(config) {
+      let option = config && config[this.field || this.prop];
+      return option && typeof option == 'object'
+        ? { ...this.formOption, ...option }
+        : this.formOption;
+    },
     getData(res) {
       return res && res[this.field || this.prop]
         ? res[this.field || this.prop]

package/packages/dialog/src/main.vue

@@ -3,8 +3,8 @@
     class="es-dialog"
     :title="titles"
     :visible.sync="show"
-    :width="wd"
-    :height="ht"
+    :width="_width"
+    :height="_height"
     :close-on-click-modal="shadeClose"
     :showScale="showScale"
     :drag="drag"
@@ -264,6 +264,10 @@ import WujieVue from 'wujie-vue2';
 import util from 'eoss-ui/src/utils/util';
 import mbus from 'eoss-ui/src/utils/bus';
 const { bus } = WujieVue;
+let availWidth = 0;
+let availHeight = 0;
+availWidth = util.win.top.document.body.offsetWidth - 260;
+availHeight = util.win.top.document.body.offsetHeight - 60;
 export default {
   name: 'EsDialog',
   inheritAttrs: false,
@@ -344,6 +348,12 @@ export default {
   computed: {
     wujieName() {
       return this.name ? this.name : util.uuid(16);
+    },
+    _width() {
+      return this.width ? this.width : this.sizes[this.size]['width'];
+    },
+    _height() {
+      return this.height ? this.height : this.sizes[this.size]['height'];
     }
   },
   watch: {
@@ -367,33 +377,16 @@ export default {
         sm: { width: '960px', height: '500px' },
         md: { width: '1060px', height: '600px' },
         lg: { width: '1200px', height: '800px' },
+        max: { width: `${availWidth}px`, height: `${availHeight}px` },
         full: { width: '100%', height: '100%' }
       },
       show: this.visible,
       defaultProps: {},
-      wd: '',
-      ht: '',
       zoom: 1,
       scales: { zoom: 1 }
     };
   },
   created() {
-    let availWidth = 0;
-    let availHeight = 0;
-    availWidth = util.win.top.document.body.offsetWidth - 260;
-    availHeight = util.win.top.document.body.offsetHeight - 60;
-    this.sizes.max = { width: `${availWidth}px`, height: `${availHeight}px` };
-    if (
-      this.size === 'full' ||
-      (this.width == '100%' && this.height == '100%')
-    ) {
-      this.full = true;
-      this.wd = '100%';
-      this.ht = '100%';
-    } else {
-      this.wd = this.width ? this.width : this.sizes[this.size]['width'];
-      this.ht = this.height ? this.height : this.sizes[this.size]['height'];
-    }
     if (this.busEvent) {
       mbus.$on(this.busEvent, async (res) => {
         this.titles = res.title;

package/packages/flow/src/main.vue

@@ -9,6 +9,7 @@
       <div class="es-flow-title">
         <span v-show="!shrink">当前节点：{{ isFlow ? '拟稿' : NodeName }}</span>
         <es-button
+          v-if="showShrink"
           size="medium"
           class="es-icon"
           :icon="shrink ? 'es-icon-indent' : 'es-icon-increase'"
@@ -717,6 +718,7 @@ export default {
     Preset
   },
   props: {
+    showShrink: { type: Boolean, default: true },
     isStartFlow: { type: Boolean, default: false },
     businessId: { type: String, default: '' },
     pendingId: { type: String, default: '' },

package/packages/flow-group/src/main.vue

@@ -32,9 +32,9 @@
                     :value="items.title.count"
                     :color="items.title.color"
                     :max="99"
-                  >
+                    >{{ items.title.text }}
                   </el-badge>
-                  <template v-if>{{ items.title.text }}</template>
+                  <template v-else>{{ items.title.text }}</template>
                 </template>
                 <template v-else>{{ items.title }}</template>
               </template>
@@ -279,11 +279,12 @@
                       >
                       </es-dialog>
                       <component
-                        v-if="item.component"
-                        :is="item.type"
+                        v-if="item.component || item.type == 'component'"
+                        :is="item.is || item.name || item.type"
                         v-bind="
                           handleExclAttribute({
-                            data: item
+                            data: item,
+                            attrs: ['is', 'type']
                           })
                         "
                       ></component>
@@ -292,11 +293,12 @@
                 </template>
                 <template v-else>
                   <component
-                    v-if="contents.component"
-                    :is="contents.type"
+                    v-if="contents.component || contents.type == 'component'"
+                    :is="contents.is || contents.name || contents.type"
                     v-bind="
                       handleExclAttribute({
-                        data: contents
+                        data: contents,
+                        attrs: ['is', 'type']
                       })
                     "
                   ></component>
@@ -426,7 +428,7 @@
       class="es-group-flow"
       v-bind="_flow"
       :width="width"
-      :before-submit="handleSubmit"
+      :before-submit="isSubmit ? handleSubmit : undefined"
       :businessId="businessId"
       @startTaskRead="handleTaskRead"
       @success="handleSuccess"
@@ -482,7 +484,11 @@ export default {
       type: String,
       default: '360px'
     },
-    refs: String
+    refs: String,
+    isSubmit: {
+      type: Boolean,
+      default: true
+    }
   },
   data() {
     return {
@@ -635,6 +641,7 @@ export default {
       if (Array.isArray(esFlowForm)) {
         esFlowForm = esFlowForm[0];
       }
+      esFlowForm;
       this.showMsg = res == 1 ? false : true;
       return esFlowForm.submitData(undefined, false, {}, res);
     },

package/packages/main/src/simplicity/index.vue

@@ -232,34 +232,28 @@
           :label="item.text || item.name"
           :name="item.id"
         >
-          <template
+          <iframe
             v-if="(isIE && item.method !== 'router') || item.method == 'iframe'"
-          >
-            <iframe
-              :id="activeName == item.id ? iframeId : ''"
-              :name="activeName == item.id ? iframeId : ''"
-              frameborder="0"
-              width="100%"
-              height="100%"
-              :src="item.url"
-            ></iframe>
-          </template>
-          <template v-else-if="item.method === 'wujie' && item.refresh">
-            <es-wujie
-              :show="true"
-              :props="wjProps"
-              :attrs="wjAttrs"
-              :name="item.appCode"
-              :url="item.url"
-            ></es-wujie>
-          </template>
-          <template v-else-if="item.method === 'router' && item.refresh">
-            <router-page
-              v-bind="item"
-              :show="activeName == item.id"
-              :query="$parent.params"
-            ></router-page>
-          </template>
+            :id="activeName == item.id ? iframeId : ''"
+            :name="activeName == item.id ? iframeId : ''"
+            frameborder="0"
+            width="100%"
+            height="100%"
+            :src="item.url"
+          ></iframe>
+          <es-wujie
+            v-else-if="item.method === 'wujie' && item.refresh"
+            :show="true"
+            :props="wjProps"
+            :attrs="wjAttrs"
+            :name="item.appCode"
+            :url="item.url"
+          ></es-wujie>
+          <router-page
+            v-else-if="item.method === 'router' && item.refresh"
+            v-bind="item"
+            :query="$parent.params"
+          ></router-page>
         </el-tab-pane>
       </el-tabs>
       <!-- 路由、iframe end -->
@@ -867,6 +861,49 @@ export default {
           }
         });
     },
+    /**
+     * @desc 获取菜单层级id
+     * @param {Array} [menus]    - 系统菜单数据对象
+     * @param {String} [url] - 菜单id或url地址
+     */
+    getId(menus, code) {
+      if (!code) {
+        return false;
+      }
+      for (let i = 0; i < menus.length; i++) {
+        let item = menus[i];
+        if (item.appCode === code) {
+          return item.id;
+        } else if (
+          Object.prototype.hasOwnProperty.call(item, 'children') &&
+          item.children.length
+        ) {
+          let id = this.getId(item.children, code);
+          if (id) {
+            if (item.pid === 'root' || Array.isArray(id)) {
+              return [item.id].concat(id);
+            } else if (typeof id === 'string') {
+              return [item.id, id];
+            }
+            return id;
+          }
+        } else if (
+          Object.prototype.hasOwnProperty.call(item, 'fourthTabs') &&
+          item.fourthTabs.length
+        ) {
+          let id = this.getId(item.fourthTabs, code);
+          if (id) {
+            if (item.pid === 'root' || Array.isArray(id)) {
+              return [item.id].concat(id);
+            } else if (typeof id === 'string') {
+              return [item.id, id];
+            }
+            return id;
+          }
+        }
+      }
+      return false;
+    },
     /**
      * @desc:获取菜单列表
      * @author huangbo
@@ -899,14 +936,16 @@ export default {
                     }
                   }
                 }
-                let subMenus = this.getMenu(
-                  this.menus,
-                  this.appCode,
-                  'appCode'
-                );
-                if (subMenus) {
-                  if (this.tabs.length == 0) {
-                    let obj = this.getFirst(subMenus);
+                let ids = this.getId(this.menus, this.appCode);
+                let subMenus;
+                if (ids && Array.isArray(ids) && ids.length > 1) {
+                  subMenus = this.getMenu(this.menus, ids[0], 'id');
+                  if (subMenus) {
+                    let obj = this.getMenu(
+                      this.menus,
+                      ids[ids.length - 1],
+                      'id'
+                    );
                     if (obj) {
                       this.subActive = obj.id;
                       let tab = this.setIframeType(obj);
@@ -916,6 +955,23 @@ export default {
                       this.subActive = '';
                     }
                   }
+                } else {
+                  subMenus = this.getMenu(this.menus, this.appCode, 'appCode');
+                  if (subMenus) {
+                    if (this.tabs.length == 0) {
+                      let obj = this.getFirst(subMenus);
+                      if (obj) {
+                        this.subActive = obj.id;
+                        let tab = this.setIframeType(obj);
+                        this.tabs = [tab];
+                        this.activeName = tab.id;
+                      } else {
+                        this.subActive = '';
+                      }
+                    }
+                  }
+                }
+                if (subMenus) {
                   this.subMenus = subMenus;
                   this.showMenu = true;
                 } else {
@@ -1368,23 +1424,24 @@ export default {
       this.showMsg = false;
       this.showSet = false;
       let i = util.indexOfObj(this.tabs, res, 'id');
-      this.activeName = res.id;
       if (i == -1) {
         let tab = this.setIframeType(res);
         this.tabs.push(tab);
+        this.activeName = res.id;
       } else {
-        if (res.method == 'iframe') {
-          res.url = util.handlerUrl(res.url);
+        let tab = this.tabs[i];
+        if (tab.method === 'iframe') {
+          this.activeName = res.id;
+          this.$set(this.tabs[i], 'url', util.handlerUrl(tab.url));
         } else {
-          let tab = this.tabs[i];
-          if (tab.method === 'iframe') {
-            this.$set(this.tabs[i], 'url', util.handlerUrl(tab.url));
-          } else {
-            this.$set(this.tabs[i], 'refresh', false);
-            this.$nextTick(() => {
-              this.$set(this.tabs[i], 'refresh', true);
-            });
+          this.$set(this.tabs[i], 'refresh', false);
+          if (tab.method === 'wujie') {
+            this.activeName = res.id;
           }
+          this.$nextTick(() => {
+            this.$set(this.tabs[i], 'refresh', true);
+            this.activeName = res.id;
+          });
         }
       }
     },

package/packages/main/src/simplicity/router-page.vue

@@ -18,32 +18,23 @@ export default {
       default() {
         return {};
       }
-    },
-    show: Boolean
+    }
   },
   data() {
-    return {
-      params: {}
-    };
+    return {};
   },
   computed: {},
-  watch: {
-    show(val) {
-      if (val) {
-        this.jump();
-      }
-    }
-  },
+  watch: {},
   created() {},
   mounted() {
-    this.params = util.getParams({ url: this.url });
     this.jump();
   },
   methods: {
     jump() {
+      let params = util.getParams({ url: this.url });
       this.$router.push({
         path: this.path,
-        query: { ...this.query, ...this.params }
+        query: { ...this.query, ...params }
       });
     }
   }

package/packages/selector/src/main.vue

@@ -184,6 +184,7 @@
       :title="title"
       :visible.sync="visible"
       :width="width"
+      :height="height"
       :css="false"
       :append-to-body="true"
       :close-on-click-modal="false"

package/packages/selector-panel/src/selection.vue

@@ -13,7 +13,7 @@
           :key="index"
           v-show="item.disabled ? showDisabled : true"
           v-bind="getprops($attrs, item)"
-          :label="isObject || typeof item == 'string' ? item : item[valKey]"
+          :label="isObject || typeof item == 'string' ? item : item[valueKey]"
           :disabled="typeof item == 'string' ? false : item.disabled"
           :class="{ 'es-radio-delete': genre === 'delete' }"
           :value-key="valueKey"
@@ -36,7 +36,7 @@
           :key="index"
           v-show="item.disabled ? showDisabled : true"
           v-bind="getprops($attrs, item)"
-          :label="isObject || typeof item == 'string' ? item : item[valKey]"
+          :label="isObject || typeof item == 'string' ? item : item[valueKey]"
           :disabled="typeof item == 'string' ? false : item.disabled"
           :class="{ 'es-checkbox-delete': genre === 'delete' }"
           :value-key="valueKey"

package/packages/tabs/src/main.vue

@@ -19,22 +19,22 @@
           :name="items.name || String(indexs)"
         >
           <template slot="label" v-if="items.title">
-            <span>
-              <template v-if="typeof items.title === 'object'">
-                <i v-if="items.title.icon" :class="items.title.icon"></i>
-                <el-badge
-                  v-if="
-                    Object.prototype.hasOwnProperty.call(items.title, 'count')
-                  "
-                  type="primary"
-                  :value="items.title.count"
-                  :max="99"
-                >
-                </el-badge>
+            <template v-if="typeof items.title === 'object'">
+              <i v-if="items.title.icon" :class="items.title.icon"></i>
+              <template v-if="items.title.text">
                 {{ items.title.text }}
               </template>
-              <template v-else>{{ items.title }}</template>
-            </span>
+              <el-badge
+                v-if="
+                  Object.prototype.hasOwnProperty.call(items.title, 'count')
+                "
+                type="primary"
+                :value="items.title.count"
+                :max="99"
+              >
+              </el-badge>
+            </template>
+            <template v-else>{{ items.title }}</template>
           </template>
           <template slot-scope="{ loaded }">
             <es-tabs-panel v-bind="items" :show="loaded">