hw-cus-ui 1.1.17 → 1.1.19

package/HwDraggableBottomPopup/HwDraggableBottomPopup.vue

@@ -10,6 +10,7 @@
         borderTopRightRadius: isDrag ? '20rpx' : '0'
       }"
     >
+      <!-- 拖拽手柄区域 -->
       <view
         v-if="isDrag"
         class="draggable-popup-handle"
@@ -20,6 +21,7 @@
       >
         <view class="draggable-popup-handle-line"></view>
       </view>
+      <!-- 弹窗内容区域 -->
       <view class="draggable-popup-content" :style="{ height: isDrag ? contentPopupTop + 'px' : 'auto' }">
         <slot></slot>
       </view>
@@ -29,17 +31,46 @@
 
 <script>
 import { useDebounceFn } from '@vueuse/core';
+
+/**
+ * 可拖拽底部弹窗组件
+ * 支持手势拖拽控制弹窗位置，可以向上拖拽展开或向下拖拽收起
+ */
 export default {
   name: 'DraggableBottomPopup',
   props: {
+    /**
+     * 弹窗高度计算比例（相对于屏幕高度）
+     * @type {String}
+     * @default '0.4'
+     */
     heightCalc: {
       type: String,
       default: '0.4'
     },
+    /**
+     * 至少保留50px在屏幕内
+     * @type {Number}
+     * @default 50
+     */
+    reservedHeight: {
+      type: Number,
+      default: () => 50
+    },
+    /**
+     * 弹窗背景颜色
+     * @type {String}
+     * @default '#ffffff'
+     */
     bg: {
       type: String,
       default: () => '#ffffff'
     },
+    /**
+     * 是否启用拖拽功能
+     * @type {Boolean}
+     * @default true
+     */
     isDrag: {
       type: Boolean,
       default: () => true
@@ -47,18 +78,19 @@ export default {
   },
   data() {
     return {
-      startY: 0,
-      startTop: 0,
-      popupTop: 0,
-      windowHeight: 0,
-      contentPopupTop: 0,
-      isMoving: false,
+      startY: 0, // 触摸开始时的Y坐标
+      startTop: 0, // 触摸开始时弹窗的top值
+      popupTop: 0, // 当前弹窗的top位置
+      windowHeight: 0, // 窗口高度
+      contentPopupTop: 0, // 内容区域的高度
+      isMoving: false, // 是否正在移动中
       containerHeight: 0, // 容器高度
-      updateContentPopupTop: null // 防抖函数
+      updateContentPopupTop: null // 防抖函数，用于更新内容区域高度
     };
   },
 
   mounted() {
+    // 组件挂载后初始化窗口信息和弹窗位置
     this.getWindowInfo();
     this.initPopupPosition();
     // 初始化防抖函数
@@ -66,7 +98,12 @@ export default {
       this.contentPopupTop = this.windowHeight - this.popupTop - 25;
     }, 300);
   },
+
   methods: {
+    /**
+     * 获取窗口信息
+     * 设置窗口高度并初始化弹窗位置到屏幕外（隐藏状态）
+     */
     getWindowInfo() {
       const systemInfo = uni.getSystemInfoSync();
       this.windowHeight = systemInfo.windowHeight;
@@ -74,6 +111,10 @@ export default {
       this.popupTop = this.windowHeight;
     },
 
+    /**
+     * 初始化弹窗位置
+     * 获取容器实际高度并设置默认显示位置
+     */
     initPopupPosition() {
       this.$nextTick(() => {
         // 获取内容高度
@@ -93,12 +134,22 @@ export default {
       });
     },
 
+    /**
+     * 处理触摸开始事件
+     * 记录触摸起始位置和当前弹窗位置
+     * @param {TouchEvent} e - 触摸事件对象
+     */
     handleTouchStart(e) {
       this.isMoving = true;
       this.startY = e.touches[0].clientY;
       this.startTop = this.popupTop;
     },
 
+    /**
+     * 处理触摸移动事件
+     * 根据手指移动距离调整弹窗位置，并限制拖拽范围
+     * @param {TouchEvent} e - 触摸事件对象
+     */
     handleTouchMove(e) {
       if (!this.isMoving) return;
 
@@ -114,7 +165,7 @@ export default {
 
       // 保留一部分在屏幕内，方便拖回
       if (this.containerHeight > 0) {
-        const maxTop = this.windowHeight - 50; // 至少保留50px在屏幕内
+        const maxTop = this.windowHeight - this.reservedHeight;
         if (newTop > maxTop) {
           newTop = maxTop;
         }
@@ -125,6 +176,11 @@ export default {
       this.updateContentPopupTop();
     },
 
+    /**
+     * 处理触摸结束事件
+     * 结束拖拽操作并根据最终位置调整弹窗状态
+     * @param {TouchEvent} e - 触摸事件对象
+     */
     handleTouchEnd(e) {
       if (!this.isMoving) return;
       this.isMoving = false;
@@ -144,6 +200,12 @@ export default {
       }
       this.changeTop();
     },
+
+    /**
+     * 发送位置变化事件
+     * 向父组件通知弹窗位置的变化
+     * @param {Number} top - 当前弹窗的top值
+     */
     changeTop() {
       this.$emit('changeTop', this.popupTop);
     }

package/HwPickerTree/HwPickerTree.vue

@@ -96,21 +96,15 @@ import { ref, onMounted, watch, nextTick } from 'vue';
 const props = defineProps({
   range: {
     type: Array,
-    default: function () {
-      return [];
-    }
+    default: []
   },
   rangeNext: {
     type: Array,
-    default: function () {
-      return [];
-    }
+    default: []
   },
   request: {
     type: Function,
-    default: function () {
-      return null;
-    }
+    default: null
   },
   idKey: {
     //字段key值
@@ -331,6 +325,7 @@ onMounted(() => {
 });
 
 function queryList(pageNum, pageSize) {
+  if (!props.request) return;
   props
     .request({
       pageSize,
@@ -431,6 +426,8 @@ function _confirm() {
  * @param {Array} parents - 父节点对象数组
  */
 function _renderTreeList(list = [], rank = 0, parentId = [], parents = []) {
+  val = [];
+  temporarySelectedValue = [];
   if (Array.isArray(props.modelValue)) {
     val = props.modelValue || [];
   } else {

package/README.md

@@ -5,6 +5,7 @@
 
 ## 更新问题版本
 
+- 1.1.18版本：修复拖拽被遮挡问题
 - 1.1.17版本：修复列表类型问题
 - 1.1.16版本：修复列表类型问题
 - 1.1.15版本：修复列表类型问题

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hw-cus-ui",
-  "version": "1.1.17",
+  "version": "1.1.19",
   "description": "使用该组件库需安装uniapp插件@dcloudio/uni-ui",
   "main": "index.ts",
   "scripts": {