bge-ui 1.9.0 → 1.9.1

package/dist/index.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { defineComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, renderSlot, normalizeStyle, createStaticVNode, provide, reactive, toRefs, ref, watch, getCurrentScope, onScopeDispose, unref, readonly, computed, getCurrentInstance, onMounted, useSlots, inject, createTextVNode, toDisplayString, createCommentVNode, TransitionGroup, withCtx, nextTick, createBlock, withModifiers, withDirectives, cloneVNode, Fragment, Text, Comment, onUnmounted, h, Transition, vShow, onBeforeMount, Teleport, resolveDynamicComponent, shallowReactive, render as render$7, isVNode, vModelCheckbox, renderList, toRef, useAttrs, normalizeProps, mergeProps, onBeforeUpdate, withKeys, createSlots, guardReactiveProps, isRef } from "vue";
+import { defineComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, renderSlot, normalizeStyle, createStaticVNode, provide, reactive, toRefs, ref, watch, getCurrentScope, onScopeDispose, unref, readonly, computed, getCurrentInstance, onMounted, useSlots, inject, createTextVNode, toDisplayString, createCommentVNode, TransitionGroup, withCtx, nextTick, createBlock, withModifiers, onUnmounted, withDirectives, cloneVNode, Fragment, Text, Comment, h, Transition, vShow, onBeforeMount, Teleport, resolveDynamicComponent, shallowReactive, render as render$7, isVNode, vModelCheckbox, renderList, toRef, useAttrs, normalizeProps, mergeProps, onBeforeUpdate, withKeys, createSlots, guardReactiveProps, isRef } from "vue";
 const _hoisted_1$2d = ["disabled"];
 const _hoisted_2$1U = { class: "loading-icon" };
 const _sfc_main$2o = /* @__PURE__ */ defineComponent({
@@ -6682,7 +6682,23 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     const tabsRef = ref(null);
     const navScrollRef = ref(null);
     function addPane(pane) {
-      panes.value.push(pane);
+      const existingIndex = panes.value.findIndex(
+        (p) => p.id === pane.id || p.value === pane.value
+      );
+      if (existingIndex === -1) {
+        panes.value.push(pane);
+      } else {
+        panes.value[existingIndex] = pane;
+      }
+    }
+    function removePane(id) {
+      const index2 = panes.value.findIndex((p) => p.id === id);
+      if (index2 !== -1) {
+        panes.value.splice(index2, 1);
+      }
+    }
+    function getPaneByValue(value) {
+      return panes.value.find((p) => p.value === value);
     }
     function changeValue(value) {
       emits("update:modelValue", value);
@@ -6697,6 +6713,8 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     });
     provide(tabsKey$1, {
       addPane,
+      removePane,
+      getPaneByValue,
       changeValue
     });
     const getBarStyle = () => {
@@ -6916,19 +6934,35 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     const props = __props;
     const tabPaneRef = ref();
     const tabContext = inject(tabsKey, void 0);
+    const isActive = ref(false);
+    const paneId = Math.random().toString(36).substring(2, 10);
     function changeValue() {
-      tabContext.changeValue(props.value);
+      if (tabContext) {
+        tabContext.changeValue(props.value);
+      }
     }
-    const isActive = ref(false);
     function setActive(active) {
       isActive.value = active;
     }
     onMounted(() => {
-      tabContext.addPane(reactive({
-        ref: tabPaneRef.value,
-        value: props.value,
-        setActive
-      }));
+      var _a;
+      if (tabContext) {
+        const existingPane = (_a = tabContext.getPaneByValue) == null ? void 0 : _a.call(tabContext, props.value);
+        if (!existingPane) {
+          tabContext.addPane(reactive({
+            id: paneId,
+            ref: tabPaneRef.value,
+            value: props.value,
+            setActive
+          }));
+        }
+      }
+    });
+    onUnmounted(() => {
+      var _a;
+      if (tabContext) {
+        (_a = tabContext.removePane) == null ? void 0 : _a.call(tabContext, paneId);
+      }
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bge-ui",
-  "version": "1.9.0",
+  "version": "1.9.1",
   "description": "",
   "type": "module",
   "main": "./src/index.ts",

package/src/tabs/index.vue

@@ -41,6 +41,7 @@ const emits = defineEmits(['update:modelValue'])
 
 // 类型定义
 interface TabPane {
+  id: string
   ref: HTMLElement | null
   value: string
   setActive: (active: boolean) => void
@@ -58,7 +59,27 @@ const navScrollRef = ref<HTMLElement | null>(null)
 
 // 方法
 function addPane(pane: TabPane) {
-  panes.value.push(pane)
+  // 检查是否已存在相同 id 或 value 的 pane，避免重复添加
+  const existingIndex = panes.value.findIndex(
+    (p) => p.id === pane.id || p.value === pane.value
+  )
+  if (existingIndex === -1) {
+    panes.value.push(pane)
+  } else {
+    // 更新已存在的 pane
+    panes.value[existingIndex] = pane
+  }
+}
+
+function removePane(id: string) {
+  const index = panes.value.findIndex((p) => p.id === id)
+  if (index !== -1) {
+    panes.value.splice(index, 1)
+  }
+}
+
+function getPaneByValue(value: string) {
+  return panes.value.find((p) => p.value === value)
 }
 
 function changeValue(value: string) {
@@ -77,6 +98,8 @@ watch(() => props.modelValue, () => {
 const tabsKey = 'bge-tabs-context'
 provide(tabsKey, {
   addPane,
+  removePane,
+  getPaneByValue,
   changeValue
 })
 

package/src/tabs/tab-pane.vue

@@ -14,23 +14,44 @@ const props = defineProps({
     type: String
   }
 })
-import { ref, onMounted, inject, reactive } from "vue";
+import { ref, onMounted, inject, reactive, onUnmounted } from "vue";
 const tabPaneRef = ref<HTMLDivElement>()
 const tabsKey = 'bge-tabs-context'
 const tabContext: any = inject(tabsKey, undefined)
+const isActive = ref<Boolean>(false)
+
+// 生成唯一标识，用于去重
+const paneId = Math.random().toString(36).substring(2, 10)
+
 function changeValue() {
-  tabContext.changeValue(props.value)
+  if (tabContext) {
+    tabContext.changeValue(props.value)
+  }
 }
-const isActive = ref<Boolean>(false)
+
 function setActive(active: Boolean) {
   isActive.value = active
 }
+
 onMounted(() => {
-  tabContext.addPane(reactive({
-    ref: tabPaneRef.value,
-    value: props.value,
-    setActive
-  }))
+  if (tabContext) {
+    // 检查是否已存在相同 value 的 pane，避免重复添加
+    const existingPane = tabContext.getPaneByValue?.(props.value)
+    if (!existingPane) {
+      tabContext.addPane(reactive({
+        id: paneId,
+        ref: tabPaneRef.value,
+        value: props.value,
+        setActive
+      }))
+    }
+  }
+})
+
+onUnmounted(() => {
+  if (tabContext) {
+    tabContext.removePane?.(paneId)
+  }
 })
 </script>
 <style lang="scss" >