resolver-egretimp-plus 0.1.76 → 0.1.77

package/package.json

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

package/src/components/packages-H5/CustomComponentTabPaneH5.vue

@@ -11,13 +11,15 @@ useConfigLoad(props.config)
 const attrs = useAttrs()
 const tabProps = computed(() => {
   return {
-    label: props?.config?.hidden == '1' ?
-      '' :
-      lang.value.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    label: lang.value.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    // label: props?.config?.hidden == '1' ?
+    //   '' :
+    //   lang.value.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
     name: props.config?.metaCode,
-    disabled: props?.config?.hidden == '1' ?
-      true :
-      props.config?.editFlag == '0'
+    disabled: props.config?.editFlag == '0'
+    // disabled: props?.config?.hidden == '1' ?
+    //   true :
+    //   props.config?.editFlag == '0'
   }
 })
 const modelValue = defineModel()

package/src/components/packages-H5/CustomComponentTabsH5.vue

@@ -1,6 +1,6 @@
 <script setup>
-import { computed, inject, useAttrs } from 'vue'
-import { commonPropsType, hasOwn } from '../../utils/index.js'
+import { computed, inject, nextTick, onMounted, ref, useAttrs, watch } from 'vue'
+import { commonPropsType, getUuid, hasOwn } from '../../utils/index.js'
 import Renderer from '../../renderer.jsx'
 import CustomComponentTabPaneH5 from './CustomComponentTabPaneH5.vue'
 
@@ -8,28 +8,34 @@ const props = defineProps({
   ...commonPropsType,
 })
 
+const uuid = getUuid()
 const lang = inject('lang')
 const attrs = useAttrs()
 const modelValue = defineModel()
 const tabpanes = computed(() => {
-  return [...(props.config.pmPageMetaList || []).filter(item => item.hidden != '1'), ...(props.config.pmPageMetaList || []).filter(item => item.hidden == '1')]
+  return props.config.pmPageMetaList || []
+})
+const tabpanesOfHidden = computed(() => {
+  return tabpanes.value?.map(item => item.hidden)
 })
 
+const activeNameModel = ref(null)
 const activeNames = computed({
   get() {
-    const currentTab = tabpanes.value.find(tab => tab.defaultShowFlag == '1')
-    const currentCycleTab = tabpanes.value.find(tab => tab.currentCode)
+    const showTabpanes = tabpanes.value.filter(item => item.hidden != '1')
+    const currentTab = showTabpanes.find(tab => tab.defaultShowFlag == '1')
+    const currentCycleTab = showTabpanes.find(tab => tab.currentCode)
     if (currentTab) {
       return currentTab?.isCycle == '1' ? `${currentTab.metaCode}-0` : currentTab.metaCode
     }
     if (currentCycleTab) {
       return currentCycleTab.currentCode
     }
-    if (tabpanes.value[0]) {
-      if (assertMetaType(tabpanes.value[0], 'CustomComponentCycleTabPaneH5') || tabpanes.value[0]?.isCycle == '1') {
-        return `${tabpanes.value[0].metaCode}-0`
+    if (showTabpanes[0]) {
+      if (assertMetaType(showTabpanes[0], 'CustomComponentCycleTabPaneH5') || showTabpanes[0]?.isCycle == '1') {
+        return `${showTabpanes[0].metaCode}-0`
       } else {
-        return tabpanes.value[0].metaCode
+        return showTabpanes[0].metaCode
       }
     }
   },
@@ -54,7 +60,7 @@ const activeNames = computed({
 })
 const tabProps = computed(() => {
   return {
-    activekey: activeNames.value,
+    activekey: activeNameModel.value || activeNames.value,
     sticky: props.config?.sticky == '1',
     offsettop: (props.config?.offsetTop || '0') + 'vw',
     type: props.config.displayType || props.config.tabType,
@@ -90,13 +96,45 @@ const customClass = computed(() => {
 function assertMetaType(config, metaType) {
   return config.renderby === metaType || config.metaType === metaType
 }
+
+onMounted(() => {
+  // 控制 nav 头 可以支持设置hidden的时候的效果 ====start====
+  watch(() => props.config._componentLoad, (val) => {
+    setTimeout(() => {
+      if (val) {
+        watch(tabpanesOfHidden, (hids) => {
+          const navList = document.getElementById(uuid)?.shadowRoot?.querySelectorAll('cmi-tab-nav')
+          hids?.forEach((hidden, idx) => {
+            if (navList?.[idx]?.style) {
+              if (hidden == '1') {
+                navList[idx].style.display = 'none'
+              } else {
+                navList[idx].style.display = 'inline-flex'
+              }
+            }
+          })
+
+          activeNameModel.value = 'void'
+          nextTick(() => {
+            activeNameModel.value = null
+          })
+        }, {
+          immediate: true
+        })
+      }
+    }, 300);
+  }, {
+    immediate: true
+  })
+  // 控制 nav 头 可以支持设置hidden的时候的效果 ====end====
+})
 </script>
 
 <template>
-  <cmi-tabs :class="customClass" v-bind="{...attrs, ...tabProps}">
-    <CustomComponentTabPaneH5
-      v-for="tabpane in tabpanes" :config="tabpane" :key="tabpane.metaId"
-    >
+  <cmi-tabs :id="uuid" :class="customClass" v-bind="{...attrs, ...tabProps}">
+    <!-- <Renderer :config="tabpanes" v-model="modelValue"></Renderer> -->
+     <!-- 只能用下面这种方式写，移动端这个组件 内容嵌套多层级，就显示不出来 -->
+    <CustomComponentTabPaneH5 v-for="tabpane in tabpanes" :config="tabpane" :key="tabpane.metaId">
       <Renderer :config="tabpane?.pmPageMetaList || []" :additionConfigs="[tabpane]" :modelValue="getValue(tabpane.metaCode)" @update:modelValue="(val) => { onUpdateModelValue(val, tabpane.metaCode) }"></Renderer>
     </CustomComponentTabPaneH5>
   </cmi-tabs>