优化 便签列表页上下滑动时不再触发标签条的移动；

优化 添加了新的vite编译配置；

src/components/NoteItem.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="code-fun-flex-row code-fun-justify-center code-fun-relative list-item_7">
+  <div class="code-fun-flex-row code-fun-justify-center code-fun-relative list-item_7" @touchstart="handleContainerTouchStart" @touchmove="handleContainerTouchMove" @touchend="handleContainerTouchEnd">
     <!-- 删除按钮 -->
     <button class="btn_delete" @click.stop="handleDelete" :style="deleteButtonStyle">
       <span>删除</span>
@@ -73,8 +73,10 @@ const props = defineProps({
 // 滑动相关状态
 const slideOffset = ref(0)
 const startX = ref(0)
+const startY = ref(0) // 记录起始Y坐标
 const isSliding = ref(false)
 const isSlided = ref(false) // 是否已经滑动到阈值
+const isScrolling = ref(false) // 是否正在滚动
 
 const formattedDate = computed(() => {
   // 直接返回已经格式化的日期字符串
@@ -109,6 +111,22 @@ const deleteButtonStyle = computed(() => {
 // 当滑动距离超过此值时，显示删除按钮
 const SLIDE_THRESHOLD = 64 // 4rem 转换为 px
 
+// 容器触摸事件处理函数
+const handleContainerTouchStart = e => {
+  // 阻止事件冒泡到父组件
+  e.stopPropagation()
+}
+
+const handleContainerTouchMove = e => {
+  // 阻止事件冒泡到父组件
+  e.stopPropagation()
+}
+
+const handleContainerTouchEnd = e => {
+  // 阻止事件冒泡到父组件
+  e.stopPropagation()
+}
+
 // 处理便签点击事件
 // 只有在未滑动状态下才触发点击事件，避免与滑动操作冲突
 const handlePress = () => {
@@ -148,21 +166,47 @@ const handleDelete = () => {
 // 触摸开始事件处理函数
 // 记录触摸开始时的X坐标，用于计算滑动距离
 const handleTouchStart = e => {
+  // 阻止事件冒泡到父组件，防止页面滚动时触发便签滑动
+  e.stopPropagation()
   // 重置滑动状态
   startX.value = e.touches[0].clientX
+  startY.value = e.touches[0].clientY // 记录起始Y坐标
+  isSliding.value = false
+  isSlided.value = false
+  isScrolling.value = false // 重置滚动状态
 }
 
 // 触摸移动事件处理函数
 // 根据手指移动距离计算便签条的水平偏移量
 const handleTouchMove = e => {
-  if (!startX.value) return
+  if (!startX.value || !startY.value) return
 
   const currentX = e.touches[0].clientX
+  const currentY = e.touches[0].clientY
   const diffX = currentX - startX.value
+  const diffY = currentY - startY.value
+
+  // 如果已经确定是滚动，则不再处理
+  if (isScrolling.value) return
+
+  // 判断是滚动还是滑动操作
+  // 如果Y轴移动距离大于X轴移动距离，则认为是滚动
+  if (Math.abs(diffY) > Math.abs(diffX)) {
+    isScrolling.value = true
+    return
+  }
 
   // 只处理右滑动（正值）
   if (diffX > 0) {
-    e.preventDefault() // 防止页面滚动
+    // 阻止事件冒泡到父组件，防止页面滚动时触发便签滑动
+    e.stopPropagation()
+    // 阻止父级滚动容器的滚动行为
+    e.stopImmediatePropagation()
+    
+    // 只有当滑动达到一定距离时才阻止页面滚动
+    if (diffX > 5) {
+      e.preventDefault() // 防止页面滚动
+    }
 
     // 设置滑动状态
     isSliding.value = true
@@ -193,9 +237,12 @@ const handleTouchMove = e => {
 
 // 触摸结束事件处理函数
 // 根据滑动距离决定便签条的最终位置
-const handleTouchEnd = () => {
+const handleTouchEnd = e => {
   if (!startX.value) return
 
+  // 阻止事件冒泡到父组件，防止页面滚动时触发便签滑动
+  e?.stopPropagation()
+
   // 如果滑动超过阈值，保持滑出状态；否则回弹
   if (slideOffset.value >= SLIDE_THRESHOLD) {
     // 保持滑出状态，显示删除按钮
@@ -208,8 +255,10 @@ const handleTouchEnd = () => {
     isSlided.value = false
   }
 
-  // 重置起始位置
+  // 重置起始位置和滚动状态
   startX.value = 0
+  startY.value = 0
+  isScrolling.value = false
 }
 </script>
 
@@ -241,6 +290,7 @@ const handleTouchEnd = () => {
 .list-item_7 {
   width: 100%;
   height: 3.16rem;
+  touch-action: pan-y; /* 只允许垂直滚动，禁止水平滑动 */
   .section_17 {
     box-sizing: border-box;
     width: 95%;