resolver-egretimp-plus 0.0.209 → 0.0.210

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "resolver-egretimp-plus",
-  "version": "0.0.209",
+  "version": "0.0.210",
   "description": "交付体验渲染",
   "main": "./dist/web/index.js",
   "module": "./dist/web/index.js",

package/src/components/packages-web/CustomComponentCycleTabPane.vue

@@ -1,7 +1,8 @@
 <template>
   <TabPane v-for="(pageMetaList, $index) in (multiPmPageMetaList || [])" v-bind="{...tabPaneProps}" :key="pageMetaListKeys[pageMetaList.id]" :label="`${lang.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn}-${$index}`" :name="`${props.config?.metaCode}-${$index}`">
-    <template #label v-if="pageMetaList.filter(config => config.collapseSlot).length">
-      <Renderer :modelValue="modelValue?.[$index]" :rowScope="{row: modelValue?.[$index], $index}" @update:modelValues="onUpdateModelValue($event, $index)" :config="pageMetaList.filter(config => config.collapseSlot)"></Renderer>
+    <template #label v-if="labelRenderContentFn || pageMetaList.filter(config => config.collapseSlot).length">
+      <component :is="labelRenderContentFn(getLableRenderParams(modelValue?.[$index]))" v-if="labelRenderContentFn"></component>
+      <Renderer v-else :modelValue="modelValue?.[$index]" :rowScope="{row: modelValue?.[$index], $index}" @update:modelValues="onUpdateModelValue($event, $index)" :config="pageMetaList.filter(config => config.collapseSlot)"></Renderer>
     </template>
     <ElRow>
       <Renderer :modelValue="modelValue?.[$index]" :rowScope="{row: modelValue?.[$index], $index}" @update:modelValues="onUpdateModelValue($event, $index)" :config="pageMetaList.filter(config => !config.collapseSlot)"></Renderer>
@@ -14,6 +15,7 @@ import Renderer from '../../renderer.jsx'
 import { computed, inject, reactive, watch, defineModel, defineProps } from 'vue'
 import { commonPropsType, cloneDeep, definePrivatelyProp } from '../../utils/index.js'
 import { TabPane } from '../tabs'
+import { h } from 'vue'
 
 const props = defineProps({
   ...commonPropsType,
@@ -82,6 +84,28 @@ watch(() => {
 }, {
   immediate: true
 })
+
+// 自定义渲染label方法
+const labelRenderContentFn = computed(() => {
+  if (props.config?.labelRender && typeof props.config?.labelRender == 'function') {
+    return (params) => {
+      const context = props.config?.labelRender?.(params)
+      if (typeof context === 'string') {
+        return h('span', context)
+      } else {
+        return context
+      }
+    }
+  } else {
+    return null
+  }
+})
+function getLableRenderParams(tabPaneData) {
+  return {
+    config: props.config,
+    tabPaneData
+  }
+}
 </script>
 <style lang="scss">
 .el-tabs__item.is-active {

package/src/components/packages-web/CustomComponentTabPane.vue

@@ -1,7 +1,8 @@
 <template>
   <TabPane v-bind="{...attrs, ...tabPaneProps, ...polyProps}">
-    <template #label v-if="slotsPageMetalist.length">
-      <Renderer :config="slotsPageMetalist" v-model="props.refValue.value"></Renderer>
+    <template #label v-if="labelRenderContent || slotsPageMetalist.length">
+      <component :is="labelRenderContent" v-if="labelRenderContent"></component>
+      <Renderer v-else :config="slotsPageMetalist" v-model="props.refValue.value"></Renderer>
     </template>
     <ElRow>
       <Renderer :config="(props.config.pmPageMetaList || []).filter(config => !config.collapseSlot)" v-model="props.refValue.value"></Renderer>
@@ -14,6 +15,7 @@ import Renderer from '../../renderer.jsx'
 import { computed, inject, useAttrs } from 'vue'
 import { commonPropsType } from '../../utils/index.js'
 import { TabPane } from '../tabs'
+import { h } from 'vue'
 
 const props = defineProps({
   ...commonPropsType,
@@ -43,4 +45,20 @@ const tabPaneProps = computed(() => {
   }
   return ret
 })
+
+// 自定义渲染label方法
+const labelRenderContent = computed(() => {
+  const context = props.config?.labelRender?.(getLableRenderParams())
+  if (typeof context === 'string') {
+    return h('span', context)
+  } else {
+    return context
+  }
+})
+function getLableRenderParams() {
+  return {
+    config: props.config,
+    tabPaneData: props.refValue.value
+  }
+}
 </script>

package/src/components/packages-web/CustomComponentTabs.vue

@@ -1,5 +1,5 @@
 <template>
-  <Tabs :class="[`tabs-level-${level}`, fullBorder ? 'full-border' : '']" v-bind="transTabsProps" v-model="activeNames">
+  <Tabs :class="[`tabs-level-${level}`, isHeaderAuto ? 'tabpane-auto-header' : '',  fullBorder ? 'full-border' : '']" v-bind="transTabsProps" v-model="activeNames">
     <Renderer :config="tabpanes" v-model="props.refValue.value"></Renderer>
   </Tabs>
 </template>
@@ -56,7 +56,9 @@ const activeNames = computed({
     })
   }
 })
-
+const isHeaderAuto = computed(() => {
+  return props.config.autoHeader == '1'
+})
 const level = computed(() => {
   return props.config.level || tabpanes.value.find(tabpane => hasOwn(tabpane, 'level'))?.level || 1
 })

package/src/theme/element/components/tabs.scss

@@ -72,6 +72,11 @@
     }
   }
 }
+.tabpane-auto-header {
+  & > .el-tabs__header {
+    --el-tabs-header-height: auto;
+  }
+}
 .CustomComponentTabs {
   .el-tabs__content {
     margin-right: -16px;