unika-components 1.0.323 → 1.0.325

package/dist/src/components/WorkRender/WorkRenderer.vue.d.ts

@@ -11,8 +11,8 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {
     bgMusic: Ref<HTMLAudioElement | null>;
-    personalData: Ref<PersonalData>;
-    global: Ref<GlobalData>;
+    personalData: import("vue").ComputedRef<PersonalData>;
+    global: import("vue").ComputedRef<GlobalData>;
     pages: import("vue").ComputedRef<PageData[]>;
     displayPages: import("vue").ComputedRef<PageData[]>;
     currentPageId: Ref<string>;

package/dist/unika-components.css

@@ -240,6 +240,14 @@
     background: rgba(0, 0, 0, 0.8);
   }
 
+.uni-lotties-component {
+  width: 100%;
+  height: 100%;
+}
+
+  .uni-build-up-component {
+  }
+
 .like-button {
   display: flex;
   flex-direction: column;
@@ -262,11 +270,6 @@
   color: #333;
 }
 
-.uni-lotties-component {
-  width: 100%;
-  height: 100%;
-}
-
 .ant-input-number {
   box-sizing: border-box;
   margin: 0;
@@ -301,19 +304,16 @@
   margin-bottom: 0px;
   vertical-align: top;
 }
+
+.uni-svg-component {
+  display: inline-block;
+}
 
 .effect {
   width: 100%;
   height: 100%;
 }
 
-  .uni-build-up-component {
-  }
-
-.uni-svg-component {
-  display: inline-block;
-}
-
 
 .no-animation__card {
   font-weight: 500;
@@ -500,7 +500,114 @@
     z-index: 5;
   }
 }
-
+
+  .page-indicator {
+    position: fixed;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1000;
+    transition: all 0.3s ease;
+  
+    /* 默认位置（底部居中） */
+    &.bottom {
+      bottom: 20px;
+      left: 50%;
+      transform: translateX(-50%);
+      flex-direction: row;
+    }
+  
+    /* 顶部样式 */
+    &.top {
+      top: 20px;
+      left: 50%;
+      transform: translateX(-50%);
+      flex-direction: row;
+    }
+  
+    /* 左侧样式 */
+    &.left {
+      left: 20px;
+      top: 50%;
+      transform: translateY(-50%);
+      flex-direction: column;
+    }
+  
+    /* 右侧样式 */
+    &.right {
+      right: 20px;
+      top: 50%;
+      transform: translateY(-50%);
+      flex-direction: column;
+    }
+  
+    /* 点状样式 */
+    &.dot-style {
+      .indicator-dot {
+        width: v-bind('size + "px"');
+        height: v-bind('size + "px"');
+        margin: v-bind('spacing/2 + "px"');
+        border-radius: 50%;
+        background-color: v-bind('color + "4D"'); /* 添加透明度 */
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        transition: all 0.3s ease;
+  
+        .active-dot {
+          border-radius: 50%;
+          transition: all 0.3s ease;
+        }
+  
+        &:hover {
+          background-color: v-bind('color + "80"');
+        }
+  
+        &.active {
+          background-color: transparent;
+        }
+      }
+    }
+  
+    /* 数字样式 */
+    &.number-style {
+      padding: 6px 12px;
+      border-radius: 20px;
+      background-color: rgba(0, 0, 0, 0.3);
+      color: v-bind('color');
+      font-size: 14px;
+  
+      .current-page {
+        color: v-bind('activeColor');
+        font-weight: bold;
+      }
+  
+      .separator {
+        margin: 0 4px;
+        opacity: 0.6;
+      }
+  
+      .total-pages {
+        opacity: 0.8;
+      }
+    }
+  }
+  
+  .dynamic-element {
+    position: absolute;
+    box-sizing: border-box;
+  }
+  
+  .is-sign {
+    z-index: 10;
+  }
+  
+  .is-locked {
+    pointer-events: none;
+    opacity: 0.7;
+  }
+  
 .unika-calendar-box {
   position: relative;
   width: 325px !important;
@@ -761,111 +868,3 @@
   padding: 0 0px;
   border-bottom: 1px solid
 }
-
-  .dynamic-element {
-    position: absolute;
-    box-sizing: border-box;
-  }
-  
-  .is-sign {
-    z-index: 10;
-  }
-  
-  .is-locked {
-    pointer-events: none;
-    opacity: 0.7;
-  }
-  
-  .page-indicator {
-    position: fixed;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: 1000;
-    transition: all 0.3s ease;
-  
-    /* 默认位置（底部居中） */
-    &.bottom {
-      bottom: 20px;
-      left: 50%;
-      transform: translateX(-50%);
-      flex-direction: row;
-    }
-  
-    /* 顶部样式 */
-    &.top {
-      top: 20px;
-      left: 50%;
-      transform: translateX(-50%);
-      flex-direction: row;
-    }
-  
-    /* 左侧样式 */
-    &.left {
-      left: 20px;
-      top: 50%;
-      transform: translateY(-50%);
-      flex-direction: column;
-    }
-  
-    /* 右侧样式 */
-    &.right {
-      right: 20px;
-      top: 50%;
-      transform: translateY(-50%);
-      flex-direction: column;
-    }
-  
-    /* 点状样式 */
-    &.dot-style {
-      .indicator-dot {
-        width: v-bind('size + "px"');
-        height: v-bind('size + "px"');
-        margin: v-bind('spacing/2 + "px"');
-        border-radius: 50%;
-        background-color: v-bind('color + "4D"'); /* 添加透明度 */
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        transition: all 0.3s ease;
-  
-        .active-dot {
-          border-radius: 50%;
-          transition: all 0.3s ease;
-        }
-  
-        &:hover {
-          background-color: v-bind('color + "80"');
-        }
-  
-        &.active {
-          background-color: transparent;
-        }
-      }
-    }
-  
-    /* 数字样式 */
-    &.number-style {
-      padding: 6px 12px;
-      border-radius: 20px;
-      background-color: rgba(0, 0, 0, 0.3);
-      color: v-bind('color');
-      font-size: 14px;
-  
-      .current-page {
-        color: v-bind('activeColor');
-        font-weight: bold;
-      }
-  
-      .separator {
-        margin: 0 4px;
-        opacity: 0.6;
-      }
-  
-      .total-pages {
-        opacity: 0.8;
-      }
-    }
-  }
-  

package/dist/unika-components.esm.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, openBlock, createElementBlock, normalizeStyle as normalizeStyle$1, createTextVNode, toDisplayString, createCommentVNode, createElementVNode, nextTick, withModifiers, Fragment, renderList, createBlock, resolveDynamicComponent, normalizeProps, guardReactiveProps, renderSlot, withDirectives, mergeProps, vShow, useCssVars, normalizeClass, pushScopeId, popScopeId, reactive, toRefs, watch, resolveComponent, createVNode, Transition, withCtx, onMounted, onBeforeMount, onUnmounted, h as h$2, isVNode, Comment, Text, getCurrentInstance, onUpdated, inject, provide, unref, shallowRef, watchEffect, onBeforeUnmount, triggerRef, resolveDirective, cloneVNode, toRef, Teleport, isRef, toRaw, render as render$o, TransitionGroup, onBeforeUpdate } from 'vue';
+import { defineComponent, ref, computed, openBlock, createElementBlock, normalizeStyle as normalizeStyle$1, createTextVNode, toDisplayString, createCommentVNode, createElementVNode, nextTick, withModifiers, Fragment, renderList, createBlock, resolveDynamicComponent, normalizeProps, guardReactiveProps, renderSlot, withDirectives, mergeProps, vShow, useCssVars, normalizeClass, pushScopeId, popScopeId, watch, resolveComponent, createVNode, Transition, withCtx, toRefs, onMounted, onBeforeMount, onUnmounted, h as h$2, isVNode, Comment, Text, reactive, getCurrentInstance, onUpdated, inject, provide, unref, shallowRef, watchEffect, onBeforeUnmount, triggerRef, resolveDirective, cloneVNode, toRef, Teleport, isRef, toRaw, render as render$o, TransitionGroup, onBeforeUpdate } from 'vue';
 import crypto from 'crypto';
 
 var script$l = defineComponent({
@@ -6055,6 +6055,7 @@ __default__.__file = "src/components/WorkRender/PageIndicator.vue";
 
 function usePageTransition(pages, currentPageId) {
     const deltaY = ref(0);
+    // 计算页面切换动画
     const pageTransition = computed(() => {
         if (!deltaY.value)
             return 'fade';
@@ -6070,90 +6071,139 @@ function useTouchHandler(pages, currentPageId, deltaY) {
     const touchStartX = ref(0);
     const touchStartY = ref(0);
     const isDragging = ref(false);
-    const isScrollMode = computed(() => false); // This should be passed as a prop in a real implementation
-    const handlePageSwitch = (direction) => {
-        const currentIndex = pages.value.findIndex(page => page.pageId === currentPageId.value);
-        let targetIndex;
-        if (direction === 'up') {
-            targetIndex = currentIndex - 1;
-            if (targetIndex < 0) {
-                // 如果是第一页，切换到最后一页
-                currentPageId.value = pages.value[pages.value.length - 1].pageId;
-                return;
-            }
+    const isScrollMode = computed(() => {
+        try {
+            return false; // This should be passed as a prop in a real implementation
         }
-        else {
-            targetIndex = currentIndex + 1;
-            if (targetIndex >= pages.value.length) {
-                // 如果是最后一页，切换到第一页
-                currentPageId.value = pages.value[0].pageId;
-                return;
+        catch (error) {
+            console.warn('Error computing isScrollMode:', error);
+            return false;
+        }
+    });
+    const handlePageSwitch = async (direction) => {
+        try {
+            const currentIndex = pages.value?.findIndex(page => page.pageId === currentPageId.value);
+            let targetIndex;
+            if (direction === 'up') {
+                targetIndex = currentIndex - 1;
+                if (targetIndex < 0) {
+                    // 如果是第一页，切换到最后一页
+                    currentPageId.value = pages.value[pages.value.length - 1].pageId;
+                    return;
+                }
+            }
+            else {
+                targetIndex = currentIndex + 1;
+                if (targetIndex >= pages.value.length) {
+                    // 如果是最后一页，切换到第一页
+                    currentPageId.value = pages.value[0].pageId;
+                    return;
+                }
+            }
+            const targetPage = pages.value[targetIndex];
+            if (targetPage) {
+                currentPageId.value = targetPage.pageId;
             }
         }
-        const targetPage = pages.value[targetIndex];
-        if (targetPage) {
-            currentPageId.value = targetPage.pageId;
+        catch (error) {
+            console.warn('Page switch error:', error);
         }
     };
     const handleTouchStart = (e) => {
-        if (isScrollMode.value)
-            return;
-        touchStartX.value = e.touches[0].clientX;
-        touchStartY.value = e.touches[0].clientY;
-        isDragging.value = true;
+        try {
+            if (isScrollMode.value)
+                return;
+            touchStartX.value = e.touches[0].clientX;
+            touchStartY.value = e.touches[0].clientY;
+            isDragging.value = true;
+        }
+        catch (error) {
+            console.warn('Touch start error:', error);
+            isDragging.value = false;
+        }
     };
     const handleTouchMove = (e) => {
-        if (!isDragging.value || isScrollMode.value)
-            return;
-        e.preventDefault();
+        try {
+            if (!isDragging.value || isScrollMode.value)
+                return;
+            e.preventDefault();
+        }
+        catch (error) {
+            console.warn('Touch move error:', error);
+            isDragging.value = false;
+        }
     };
     const handleTouchEnd = (e) => {
-        if (!isDragging.value || isScrollMode.value)
-            return;
-        const touchEndX = e.changedTouches[0].clientX;
-        const touchEndY = e.changedTouches[0].clientY;
-        const deltaX = touchEndX - touchStartX.value;
-        deltaY.value = touchEndY - touchStartY.value;
-        // 如果垂直滑动距离大于水平滑动距离，则进行翻页
-        if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
-            if (deltaY.value > 50) {
-                handlePageSwitch('up');
-            }
-            else if (deltaY.value < -50) {
-                handlePageSwitch('down');
+        try {
+            if (!isDragging.value || isScrollMode.value)
+                return;
+            const touchEndX = e.changedTouches[0].clientX;
+            const touchEndY = e.changedTouches[0].clientY;
+            const deltaX = touchEndX - touchStartX.value;
+            deltaY.value = touchEndY - touchStartY.value;
+            // 如果垂直滑动距离大于水平滑动距离，则进行翻页
+            if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
+                if (deltaY.value > 50) {
+                    handlePageSwitch('up');
+                }
+                else if (deltaY.value < -50) {
+                    handlePageSwitch('down');
+                }
             }
+            isDragging.value = false;
+        }
+        catch (error) {
+            console.warn('Touch end error:', error);
+            isDragging.value = false;
         }
-        isDragging.value = false;
     };
     const handleMouseDown = (e) => {
-        if (isScrollMode.value)
-            return;
-        touchStartX.value = e.clientX;
-        touchStartY.value = e.clientY;
-        isDragging.value = true;
+        try {
+            if (isScrollMode.value)
+                return;
+            touchStartX.value = e.clientX;
+            touchStartY.value = e.clientY;
+            isDragging.value = true;
+        }
+        catch (error) {
+            console.warn('Mouse down error:', error);
+            isDragging.value = false;
+        }
     };
     const handleMouseMove = (e) => {
-        if (!isDragging.value || isScrollMode.value)
-            return;
-        e.preventDefault();
+        try {
+            if (!isDragging.value || isScrollMode.value)
+                return;
+            e.preventDefault();
+        }
+        catch (error) {
+            console.warn('Mouse move error:', error);
+            isDragging.value = false;
+        }
     };
     const handleMouseUp = (e) => {
-        if (!isDragging.value || isScrollMode.value)
-            return;
-        const touchEndX = e.clientX;
-        const touchEndY = e.clientY;
-        const deltaX = touchEndX - touchStartX.value;
-        deltaY.value = touchEndY - touchStartY.value;
-        // 如果垂直滑动距离大于水平滑动距离，则进行翻页
-        if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
-            if (deltaY.value > 50) {
-                handlePageSwitch('up');
-            }
-            else if (deltaY.value < -50) {
-                handlePageSwitch('down');
+        try {
+            if (!isDragging.value || isScrollMode.value)
+                return;
+            const touchEndX = e.clientX;
+            const touchEndY = e.clientY;
+            const deltaX = touchEndX - touchStartX.value;
+            deltaY.value = touchEndY - touchStartY.value;
+            // 如果垂直滑动距离大于水平滑动距离，则进行翻页
+            if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
+                if (deltaY.value > 50) {
+                    handlePageSwitch('up');
+                }
+                else if (deltaY.value < -50) {
+                    handlePageSwitch('down');
+                }
             }
+            isDragging.value = false;
+        }
+        catch (error) {
+            console.warn('Mouse up error:', error);
+            isDragging.value = false;
         }
-        isDragging.value = false;
     };
     return {
         handleTouchStart,
@@ -6180,87 +6230,179 @@ var script$f = defineComponent({
     },
     setup(props) {
         const bgMusic = ref(null);
-        const currentPageId = ref(props.workData && props.workData.pages && props.workData.pages[0] && props.workData.pages[0].pageId || '');
-        // 数据解构
-        const workData = reactive(props.workData || {});
-        const { personalData, global, pages } = toRefs(workData);
+        const currentPageId = ref('');
+        // 初始化 currentPageId
+        try {
+            if (props.workData && props.workData.pages && props.workData.pages[0]) {
+                currentPageId.value = props.workData.pages[0].pageId;
+            }
+        }
+        catch (error) {
+            console.warn('Failed to initialize currentPageId:', error);
+        }
+        // 使用 computed 保持响应性
+        const workData = computed(() => props.workData || {});
+        const personalData = computed(() => workData.value.personalData || {});
+        const global = computed(() => workData.value.global || {});
+        const pages = computed(() => workData.value.pages || []);
         // 计算是否启用循环
-        const isLoopEnabled = computed(() => global?.value?.pageLoop === true);
+        const isLoopEnabled = computed(() => {
+            try {
+                return global.value?.pageLoop === true;
+            }
+            catch (error) {
+                console.warn('Error computing isLoopEnabled:', error);
+                return false;
+            }
+        });
         // 计算显示的页面列表（循环模式下添加首尾页面）
         const displayPages = computed(() => {
-            if (!isLoopEnabled.value || !pages.value?.length)
-                return pages.value;
-            const firstPage = pages.value[0];
-            const lastPage = pages.value[pages.value.length - 1];
-            return [
-                { ...lastPage, pageId: 'pre-' + lastPage.pageId },
-                ...pages.value,
-                { ...firstPage, pageId: 'post-' + firstPage.pageId } // 在末尾添加第一页的副本
-            ];
+            try {
+                if (!isLoopEnabled.value || !pages.value?.length)
+                    return pages.value;
+                const firstPage = pages.value[0];
+                const lastPage = pages.value[pages.value.length - 1];
+                return [
+                    { ...lastPage, pageId: 'pre-' + lastPage.pageId },
+                    ...pages.value,
+                    { ...firstPage, pageId: 'post-' + firstPage.pageId }
+                ];
+            }
+            catch (error) {
+                console.warn('Error computing displayPages:', error);
+                return pages.value || [];
+            }
         });
         // 使用组合式函数
         const { pageTransition, deltaY } = usePageTransition();
         const { handleTouchStart, handleTouchMove, handleTouchEnd, handleMouseDown, handleMouseMove, handleMouseUp } = useTouchHandler(displayPages, currentPageId, deltaY);
         // 计算属性
-        const containerStyle = computed(() => ({
-            width: global?.value?.width ?? '100%',
-            height: global?.value?.height ?? '100vh',
-            backgroundColor: global?.value?.themeColor ?? '#ffffff'
-        }));
-        const showPageIndicator = computed(() => pages?.value?.length > 1 && global?.value?.pageDot !== undefined);
-        const isScrollMode = computed(() => global?.value?.cat === 'long');
-        // 方法
-        const getPageStyle = (page) => ({
-            backgroundColor: page?.bgColor,
-            backgroundImage: page?.bgImage ? `url(${page.bgImage})` : 'none',
-            opacity: page?.bgOpacity || '1',
-            animation: page?.bgAni?.aniCss || page?.bgAni?.aniCss2 || ''
+        const containerStyle = computed(() => {
+            try {
+                return {
+                    width: global.value?.width ?? '100%',
+                    height: global.value?.height ?? '100vh',
+                    backgroundColor: global.value?.themeColor ?? '#ffffff'
+                };
+            }
+            catch (error) {
+                console.warn('Error computing containerStyle:', error);
+                return {
+                    width: '100%',
+                    height: '100vh',
+                    backgroundColor: '#ffffff'
+                };
+            }
         });
+        const showPageIndicator = computed(() => {
+            try {
+                return pages.value?.length > 1 && global.value?.pageDot !== undefined;
+            }
+            catch (error) {
+                console.warn('Error computing showPageIndicator:', error);
+                return false;
+            }
+        });
+        const isScrollMode = computed(() => {
+            try {
+                return global.value?.cat === 'long';
+            }
+            catch (error) {
+                console.warn('Error computing isScrollMode:', error);
+                return false;
+            }
+        });
+        // 方法
+        const getPageStyle = (page) => {
+            try {
+                return {
+                    backgroundColor: page?.bgColor,
+                    backgroundImage: page?.bgImage ? `url(${page.bgImage})` : 'none',
+                    opacity: page?.bgOpacity || '1',
+                    animation: page?.bgAni?.aniCss || page?.bgAni?.aniCss2 || ''
+                };
+            }
+            catch (error) {
+                console.warn('Error computing page style:', error);
+                return {
+                    backgroundColor: '#ffffff',
+                    backgroundImage: 'none',
+                    opacity: '1',
+                    animation: ''
+                };
+            }
+        };
         const getPageClasses = (page) => {
-            const classes = [];
-            if (page?.bgAni?.aniList?.[0]?.animate) {
-                classes.push(`animate-${page.bgAni.aniList[0].animate}`);
+            try {
+                const classes = [];
+                if (page?.bgAni?.aniList?.[0]?.animate) {
+                    classes.push(`animate-${page.bgAni.aniList[0].animate}`);
+                }
+                return classes;
+            }
+            catch (error) {
+                console.warn('Error computing page classes:', error);
+                return [];
             }
-            return classes;
         };
         const switchPage = (pageId) => {
-            // 处理循环页面的切换
-            if (isLoopEnabled.value) {
-                const currentIndex = displayPages.value.findIndex(page => page.pageId === currentPageId.value);
-                const targetIndex = displayPages.value.findIndex(page => page.pageId === pageId);
-                // 如果是切换到首尾的副本页面，需要跳转到对应的真实页面
-                if (pageId.startsWith('pre-')) {
-                    const realPageId = pageId.replace('pre-', '');
-                    currentPageId.value = realPageId;
-                    return;
-                }
-                if (pageId.startsWith('post-')) {
-                    const realPageId = pageId.replace('post-', '');
-                    currentPageId.value = realPageId;
-                    return;
-                }
-                // 处理循环切换
-                if (currentIndex === 1 && targetIndex === 0) {
-                    // 从第一页切换到最后一页
-                    currentPageId.value = pages.value[pages.value.length - 1].pageId;
-                    return;
-                }
-                if (currentIndex === pages.value.length && targetIndex === pages.value.length + 1) {
-                    // 从最后一页切换到第一页
-                    currentPageId.value = pages.value[0].pageId;
-                    return;
+            try {
+                // 处理循环页面的切换
+                if (isLoopEnabled.value) {
+                    const currentIndex = displayPages.value.findIndex(page => page.pageId === currentPageId.value);
+                    const targetIndex = displayPages.value.findIndex(page => page.pageId === pageId);
+                    // 如果是切换到首尾的副本页面，需要跳转到对应的真实页面
+                    if (pageId.startsWith('pre-')) {
+                        const realPageId = pageId.replace('pre-', '');
+                        currentPageId.value = realPageId;
+                        return;
+                    }
+                    if (pageId.startsWith('post-')) {
+                        const realPageId = pageId.replace('post-', '');
+                        currentPageId.value = realPageId;
+                        return;
+                    }
+                    // 处理循环切换
+                    if (currentIndex === 1 && targetIndex === 0) {
+                        currentPageId.value = pages.value[pages.value.length - 1].pageId;
+                        return;
+                    }
+                    if (currentIndex === pages.value.length && targetIndex === pages.value.length + 1) {
+                        currentPageId.value = pages.value[0].pageId;
+                        return;
+                    }
                 }
+                currentPageId.value = pageId;
+            }
+            catch (error) {
+                console.warn('Error switching page:', error);
             }
-            currentPageId.value = pageId;
         };
         const handleElementTrigger = (payload) => {
-            // 处理元素触发事件
-            console.log('Element triggered:', payload);
+            try {
+                console.log('Element triggered:', payload);
+            }
+            catch (error) {
+                console.warn('Error handling element trigger:', error);
+            }
         };
         // 自动播放处理
-        watch(() => props.autoPlay, (newVal) => {
+        watch(() => props.autoPlay, async (newVal) => {
             if (newVal && bgMusic.value) {
-                bgMusic.value.play().catch(e => console.warn('Autoplay prevented:', e));
+                try {
+                    await bgMusic.value.play();
+                }
+                catch (error) {
+                    console.warn('Autoplay prevented:', error);
+                    // 尝试静音播放
+                    try {
+                        bgMusic.value.muted = true;
+                        await bgMusic.value.play();
+                    }
+                    catch (e) {
+                        console.warn('Muted autoplay also prevented:', e);
+                    }
+                }
             }
         }, { immediate: true });
         return {
@@ -6306,7 +6448,7 @@ function render$g(_ctx, _cache, $props, $setup, $data, $options) {
     onMouseleave: _cache[6] || (_cache[6] = (...args) => (_ctx.handleMouseUp && _ctx.handleMouseUp(...args)))
   }, [
     createCommentVNode(" 背景音乐 "),
-    (_ctx.global?.music?.musicSrc)
+    (_ctx.global && _ctx.global.music && _ctx.global.music.musicSrc)
       ? (openBlock(), createElementBlock("audio", {
           key: 0,
           ref: "bgMusic",

package/dist/unika-components.umd.js

@@ -6062,6 +6062,7 @@
 
   function usePageTransition(pages, currentPageId) {
       const deltaY = vue.ref(0);
+      // 计算页面切换动画
       const pageTransition = vue.computed(() => {
           if (!deltaY.value)
               return 'fade';
@@ -6077,90 +6078,139 @@
       const touchStartX = vue.ref(0);
       const touchStartY = vue.ref(0);
       const isDragging = vue.ref(false);
-      const isScrollMode = vue.computed(() => false); // This should be passed as a prop in a real implementation
-      const handlePageSwitch = (direction) => {
-          const currentIndex = pages.value.findIndex(page => page.pageId === currentPageId.value);
-          let targetIndex;
-          if (direction === 'up') {
-              targetIndex = currentIndex - 1;
-              if (targetIndex < 0) {
-                  // 如果是第一页，切换到最后一页
-                  currentPageId.value = pages.value[pages.value.length - 1].pageId;
-                  return;
-              }
+      const isScrollMode = vue.computed(() => {
+          try {
+              return false; // This should be passed as a prop in a real implementation
           }
-          else {
-              targetIndex = currentIndex + 1;
-              if (targetIndex >= pages.value.length) {
-                  // 如果是最后一页，切换到第一页
-                  currentPageId.value = pages.value[0].pageId;
-                  return;
+          catch (error) {
+              console.warn('Error computing isScrollMode:', error);
+              return false;
+          }
+      });
+      const handlePageSwitch = async (direction) => {
+          try {
+              const currentIndex = pages.value?.findIndex(page => page.pageId === currentPageId.value);
+              let targetIndex;
+              if (direction === 'up') {
+                  targetIndex = currentIndex - 1;
+                  if (targetIndex < 0) {
+                      // 如果是第一页，切换到最后一页
+                      currentPageId.value = pages.value[pages.value.length - 1].pageId;
+                      return;
+                  }
+              }
+              else {
+                  targetIndex = currentIndex + 1;
+                  if (targetIndex >= pages.value.length) {
+                      // 如果是最后一页，切换到第一页
+                      currentPageId.value = pages.value[0].pageId;
+                      return;
+                  }
+              }
+              const targetPage = pages.value[targetIndex];
+              if (targetPage) {
+                  currentPageId.value = targetPage.pageId;
               }
           }
-          const targetPage = pages.value[targetIndex];
-          if (targetPage) {
-              currentPageId.value = targetPage.pageId;
+          catch (error) {
+              console.warn('Page switch error:', error);
           }
       };
       const handleTouchStart = (e) => {
-          if (isScrollMode.value)
-              return;
-          touchStartX.value = e.touches[0].clientX;
-          touchStartY.value = e.touches[0].clientY;
-          isDragging.value = true;
+          try {
+              if (isScrollMode.value)
+                  return;
+              touchStartX.value = e.touches[0].clientX;
+              touchStartY.value = e.touches[0].clientY;
+              isDragging.value = true;
+          }
+          catch (error) {
+              console.warn('Touch start error:', error);
+              isDragging.value = false;
+          }
       };
       const handleTouchMove = (e) => {
-          if (!isDragging.value || isScrollMode.value)
-              return;
-          e.preventDefault();
+          try {
+              if (!isDragging.value || isScrollMode.value)
+                  return;
+              e.preventDefault();
+          }
+          catch (error) {
+              console.warn('Touch move error:', error);
+              isDragging.value = false;
+          }
       };
       const handleTouchEnd = (e) => {
-          if (!isDragging.value || isScrollMode.value)
-              return;
-          const touchEndX = e.changedTouches[0].clientX;
-          const touchEndY = e.changedTouches[0].clientY;
-          const deltaX = touchEndX - touchStartX.value;
-          deltaY.value = touchEndY - touchStartY.value;
-          // 如果垂直滑动距离大于水平滑动距离，则进行翻页
-          if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
-              if (deltaY.value > 50) {
-                  handlePageSwitch('up');
-              }
-              else if (deltaY.value < -50) {
-                  handlePageSwitch('down');
+          try {
+              if (!isDragging.value || isScrollMode.value)
+                  return;
+              const touchEndX = e.changedTouches[0].clientX;
+              const touchEndY = e.changedTouches[0].clientY;
+              const deltaX = touchEndX - touchStartX.value;
+              deltaY.value = touchEndY - touchStartY.value;
+              // 如果垂直滑动距离大于水平滑动距离，则进行翻页
+              if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
+                  if (deltaY.value > 50) {
+                      handlePageSwitch('up');
+                  }
+                  else if (deltaY.value < -50) {
+                      handlePageSwitch('down');
+                  }
               }
+              isDragging.value = false;
+          }
+          catch (error) {
+              console.warn('Touch end error:', error);
+              isDragging.value = false;
           }
-          isDragging.value = false;
       };
       const handleMouseDown = (e) => {
-          if (isScrollMode.value)
-              return;
-          touchStartX.value = e.clientX;
-          touchStartY.value = e.clientY;
-          isDragging.value = true;
+          try {
+              if (isScrollMode.value)
+                  return;
+              touchStartX.value = e.clientX;
+              touchStartY.value = e.clientY;
+              isDragging.value = true;
+          }
+          catch (error) {
+              console.warn('Mouse down error:', error);
+              isDragging.value = false;
+          }
       };
       const handleMouseMove = (e) => {
-          if (!isDragging.value || isScrollMode.value)
-              return;
-          e.preventDefault();
+          try {
+              if (!isDragging.value || isScrollMode.value)
+                  return;
+              e.preventDefault();
+          }
+          catch (error) {
+              console.warn('Mouse move error:', error);
+              isDragging.value = false;
+          }
       };
       const handleMouseUp = (e) => {
-          if (!isDragging.value || isScrollMode.value)
-              return;
-          const touchEndX = e.clientX;
-          const touchEndY = e.clientY;
-          const deltaX = touchEndX - touchStartX.value;
-          deltaY.value = touchEndY - touchStartY.value;
-          // 如果垂直滑动距离大于水平滑动距离，则进行翻页
-          if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
-              if (deltaY.value > 50) {
-                  handlePageSwitch('up');
-              }
-              else if (deltaY.value < -50) {
-                  handlePageSwitch('down');
+          try {
+              if (!isDragging.value || isScrollMode.value)
+                  return;
+              const touchEndX = e.clientX;
+              const touchEndY = e.clientY;
+              const deltaX = touchEndX - touchStartX.value;
+              deltaY.value = touchEndY - touchStartY.value;
+              // 如果垂直滑动距离大于水平滑动距离，则进行翻页
+              if (Math.abs(deltaY.value) > Math.abs(deltaX)) {
+                  if (deltaY.value > 50) {
+                      handlePageSwitch('up');
+                  }
+                  else if (deltaY.value < -50) {
+                      handlePageSwitch('down');
+                  }
               }
+              isDragging.value = false;
+          }
+          catch (error) {
+              console.warn('Mouse up error:', error);
+              isDragging.value = false;
           }
-          isDragging.value = false;
       };
       return {
           handleTouchStart,
@@ -6187,87 +6237,179 @@
       },
       setup(props) {
           const bgMusic = vue.ref(null);
-          const currentPageId = vue.ref(props.workData && props.workData.pages && props.workData.pages[0] && props.workData.pages[0].pageId || '');
-          // 数据解构
-          const workData = vue.reactive(props.workData || {});
-          const { personalData, global, pages } = vue.toRefs(workData);
+          const currentPageId = vue.ref('');
+          // 初始化 currentPageId
+          try {
+              if (props.workData && props.workData.pages && props.workData.pages[0]) {
+                  currentPageId.value = props.workData.pages[0].pageId;
+              }
+          }
+          catch (error) {
+              console.warn('Failed to initialize currentPageId:', error);
+          }
+          // 使用 computed 保持响应性
+          const workData = vue.computed(() => props.workData || {});
+          const personalData = vue.computed(() => workData.value.personalData || {});
+          const global = vue.computed(() => workData.value.global || {});
+          const pages = vue.computed(() => workData.value.pages || []);
           // 计算是否启用循环
-          const isLoopEnabled = vue.computed(() => global?.value?.pageLoop === true);
+          const isLoopEnabled = vue.computed(() => {
+              try {
+                  return global.value?.pageLoop === true;
+              }
+              catch (error) {
+                  console.warn('Error computing isLoopEnabled:', error);
+                  return false;
+              }
+          });
           // 计算显示的页面列表（循环模式下添加首尾页面）
           const displayPages = vue.computed(() => {
-              if (!isLoopEnabled.value || !pages.value?.length)
-                  return pages.value;
-              const firstPage = pages.value[0];
-              const lastPage = pages.value[pages.value.length - 1];
-              return [
-                  { ...lastPage, pageId: 'pre-' + lastPage.pageId },
-                  ...pages.value,
-                  { ...firstPage, pageId: 'post-' + firstPage.pageId } // 在末尾添加第一页的副本
-              ];
+              try {
+                  if (!isLoopEnabled.value || !pages.value?.length)
+                      return pages.value;
+                  const firstPage = pages.value[0];
+                  const lastPage = pages.value[pages.value.length - 1];
+                  return [
+                      { ...lastPage, pageId: 'pre-' + lastPage.pageId },
+                      ...pages.value,
+                      { ...firstPage, pageId: 'post-' + firstPage.pageId }
+                  ];
+              }
+              catch (error) {
+                  console.warn('Error computing displayPages:', error);
+                  return pages.value || [];
+              }
           });
           // 使用组合式函数
           const { pageTransition, deltaY } = usePageTransition();
           const { handleTouchStart, handleTouchMove, handleTouchEnd, handleMouseDown, handleMouseMove, handleMouseUp } = useTouchHandler(displayPages, currentPageId, deltaY);
           // 计算属性
-          const containerStyle = vue.computed(() => ({
-              width: global?.value?.width ?? '100%',
-              height: global?.value?.height ?? '100vh',
-              backgroundColor: global?.value?.themeColor ?? '#ffffff'
-          }));
-          const showPageIndicator = vue.computed(() => pages?.value?.length > 1 && global?.value?.pageDot !== undefined);
-          const isScrollMode = vue.computed(() => global?.value?.cat === 'long');
-          // 方法
-          const getPageStyle = (page) => ({
-              backgroundColor: page?.bgColor,
-              backgroundImage: page?.bgImage ? `url(${page.bgImage})` : 'none',
-              opacity: page?.bgOpacity || '1',
-              animation: page?.bgAni?.aniCss || page?.bgAni?.aniCss2 || ''
+          const containerStyle = vue.computed(() => {
+              try {
+                  return {
+                      width: global.value?.width ?? '100%',
+                      height: global.value?.height ?? '100vh',
+                      backgroundColor: global.value?.themeColor ?? '#ffffff'
+                  };
+              }
+              catch (error) {
+                  console.warn('Error computing containerStyle:', error);
+                  return {
+                      width: '100%',
+                      height: '100vh',
+                      backgroundColor: '#ffffff'
+                  };
+              }
           });
+          const showPageIndicator = vue.computed(() => {
+              try {
+                  return pages.value?.length > 1 && global.value?.pageDot !== undefined;
+              }
+              catch (error) {
+                  console.warn('Error computing showPageIndicator:', error);
+                  return false;
+              }
+          });
+          const isScrollMode = vue.computed(() => {
+              try {
+                  return global.value?.cat === 'long';
+              }
+              catch (error) {
+                  console.warn('Error computing isScrollMode:', error);
+                  return false;
+              }
+          });
+          // 方法
+          const getPageStyle = (page) => {
+              try {
+                  return {
+                      backgroundColor: page?.bgColor,
+                      backgroundImage: page?.bgImage ? `url(${page.bgImage})` : 'none',
+                      opacity: page?.bgOpacity || '1',
+                      animation: page?.bgAni?.aniCss || page?.bgAni?.aniCss2 || ''
+                  };
+              }
+              catch (error) {
+                  console.warn('Error computing page style:', error);
+                  return {
+                      backgroundColor: '#ffffff',
+                      backgroundImage: 'none',
+                      opacity: '1',
+                      animation: ''
+                  };
+              }
+          };
           const getPageClasses = (page) => {
-              const classes = [];
-              if (page?.bgAni?.aniList?.[0]?.animate) {
-                  classes.push(`animate-${page.bgAni.aniList[0].animate}`);
+              try {
+                  const classes = [];
+                  if (page?.bgAni?.aniList?.[0]?.animate) {
+                      classes.push(`animate-${page.bgAni.aniList[0].animate}`);
+                  }
+                  return classes;
+              }
+              catch (error) {
+                  console.warn('Error computing page classes:', error);
+                  return [];
               }
-              return classes;
           };
           const switchPage = (pageId) => {
-              // 处理循环页面的切换
-              if (isLoopEnabled.value) {
-                  const currentIndex = displayPages.value.findIndex(page => page.pageId === currentPageId.value);
-                  const targetIndex = displayPages.value.findIndex(page => page.pageId === pageId);
-                  // 如果是切换到首尾的副本页面，需要跳转到对应的真实页面
-                  if (pageId.startsWith('pre-')) {
-                      const realPageId = pageId.replace('pre-', '');
-                      currentPageId.value = realPageId;
-                      return;
-                  }
-                  if (pageId.startsWith('post-')) {
-                      const realPageId = pageId.replace('post-', '');
-                      currentPageId.value = realPageId;
-                      return;
-                  }
-                  // 处理循环切换
-                  if (currentIndex === 1 && targetIndex === 0) {
-                      // 从第一页切换到最后一页
-                      currentPageId.value = pages.value[pages.value.length - 1].pageId;
-                      return;
-                  }
-                  if (currentIndex === pages.value.length && targetIndex === pages.value.length + 1) {
-                      // 从最后一页切换到第一页
-                      currentPageId.value = pages.value[0].pageId;
-                      return;
+              try {
+                  // 处理循环页面的切换
+                  if (isLoopEnabled.value) {
+                      const currentIndex = displayPages.value.findIndex(page => page.pageId === currentPageId.value);
+                      const targetIndex = displayPages.value.findIndex(page => page.pageId === pageId);
+                      // 如果是切换到首尾的副本页面，需要跳转到对应的真实页面
+                      if (pageId.startsWith('pre-')) {
+                          const realPageId = pageId.replace('pre-', '');
+                          currentPageId.value = realPageId;
+                          return;
+                      }
+                      if (pageId.startsWith('post-')) {
+                          const realPageId = pageId.replace('post-', '');
+                          currentPageId.value = realPageId;
+                          return;
+                      }
+                      // 处理循环切换
+                      if (currentIndex === 1 && targetIndex === 0) {
+                          currentPageId.value = pages.value[pages.value.length - 1].pageId;
+                          return;
+                      }
+                      if (currentIndex === pages.value.length && targetIndex === pages.value.length + 1) {
+                          currentPageId.value = pages.value[0].pageId;
+                          return;
+                      }
                   }
+                  currentPageId.value = pageId;
+              }
+              catch (error) {
+                  console.warn('Error switching page:', error);
               }
-              currentPageId.value = pageId;
           };
           const handleElementTrigger = (payload) => {
-              // 处理元素触发事件
-              console.log('Element triggered:', payload);
+              try {
+                  console.log('Element triggered:', payload);
+              }
+              catch (error) {
+                  console.warn('Error handling element trigger:', error);
+              }
           };
           // 自动播放处理
-          vue.watch(() => props.autoPlay, (newVal) => {
+          vue.watch(() => props.autoPlay, async (newVal) => {
               if (newVal && bgMusic.value) {
-                  bgMusic.value.play().catch(e => console.warn('Autoplay prevented:', e));
+                  try {
+                      await bgMusic.value.play();
+                  }
+                  catch (error) {
+                      console.warn('Autoplay prevented:', error);
+                      // 尝试静音播放
+                      try {
+                          bgMusic.value.muted = true;
+                          await bgMusic.value.play();
+                      }
+                      catch (e) {
+                          console.warn('Muted autoplay also prevented:', e);
+                      }
+                  }
               }
           }, { immediate: true });
           return {
@@ -6313,7 +6455,7 @@
       onMouseleave: _cache[6] || (_cache[6] = (...args) => (_ctx.handleMouseUp && _ctx.handleMouseUp(...args)))
     }, [
       vue.createCommentVNode(" 背景音乐 "),
-      (_ctx.global?.music?.musicSrc)
+      (_ctx.global && _ctx.global.music && _ctx.global.music.musicSrc)
         ? (vue.openBlock(), vue.createElementBlock("audio", {
             key: 0,
             ref: "bgMusic",

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "unika-components",
-  "version": "1.0.323",
+  "version": "1.0.325",
   "private": false,
-  "description": "Unika Components Library",
   "main": "dist/unika-components.umd.js",
   "module": "dist/unika-components.esm.js",
   "types": "dist/index.d.ts",
+  "description": "Unika Vue3 components library",
   "author": "Jim Yu",
   "license": "MIT",
   "keywords": [
@@ -17,15 +17,14 @@
     "dist"
   ],
   "scripts": {
-    "dev": "vite",
+    "serve": "vue-cli-service serve",
     "build": "npm run build:es && npm run build:umd",
     "lint": "vue-cli-service lint",
     "build:es": "rollup --config build/rollup.esm.config.js",
     "build:umd": "rollup --config build/rollup.umd.config.js",
     "test": "vue-cli-service test:unit",
     "test:watch": "vue-cli-service test:unit --watch",
-    "prepublishOnly": "npm run build",
-    "preview": "vite preview"
+    "prepublishOnly": "npm run build"
   },
   "husky": {
     "hooks": {}
@@ -40,11 +39,10 @@
     "particles.vue3": "^1.22.0",
     "swiper-animation": "^1.4.0",
     "vue-baberrage": "^3.2.4",
-    "vue-particles": "^1.0.9",
-    "vue": "^3.2.0"
+    "vue-particles": "^1.0.9"
   },
   "peerDependencies": {
-    "vue": "^3.2.0"
+    "vue": "^3.0.0-0"
   },
   "devDependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.4.2",
@@ -60,7 +58,7 @@
     "@types/node": "^22.13.13",
     "@typescript-eslint/eslint-plugin": "^4.22.0",
     "@typescript-eslint/parser": "^4.22.0",
-    "@vitejs/plugin-vue": "^4.0.0",
+    "@vitejs/plugin-vue": "^5.2.3",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-plugin-typescript": "^4.5.0",
@@ -81,19 +79,19 @@
     "eslint-plugin-vue": "^7.0.0-0",
     "husky": "^4.3.0",
     "less": "^4.2.0",
-    "rollup": "^2.79.0",
+    "rollup": "^2.28.2",
     "rollup-plugin-css-only": "^2.1.0",
     "rollup-plugin-exclude-dependencies-from-bundle": "^1.1.13",
-    "rollup-plugin-typescript2": "^0.31.0",
-    "rollup-plugin-vue": "^6.0.0",
+    "rollup-plugin-typescript2": "^0.29.0",
+    "rollup-plugin-vue": "^6.0.0-beta.10",
     "style-loader": "^3.3.4",
     "swiper": "^6.8.4",
-    "typescript": "^4.9.0",
+    "typescript": "^4.0.5",
     "uuid": "^8.0.0",
-    "vite": "^4.0.0",
+    "vite": "^6.2.3",
+    "vue": "^3.4.38",
     "vue-jest": "^5.0.0-alpha.5",
     "vue3-lottie": "^3.2.0",
-    "vue3-swiper": "^1.0.0",
-    "terser": "^5.4.0"
+    "vue3-swiper": "^1.0.0"
   }
 }