@dolphinweex/weex-harmony 0.1.76 → 0.1.78

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dolphinweex/weex-harmony",
-  "version": "0.1.76",
+  "version": "0.1.78",
   "description": "weex harmony adapter",
   "main": "index.js",
   "files": [

package/src/components/midea-common-weex-view.vue

@@ -1,6 +1,9 @@
 <template>
   <div>
-    <!-- <text v-if="progressText.length > 0">{{progressText}}</text> -->
+    <div class="progress-container" v-if="progressText">
+      <img class="progress-loading" src="data:image/gif;base64,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" alt="loading" />
+      <text class="progress-text">{{progressText}}</text>
+    </div>
     <iframe
       :id="embedId"
       v-if="url.length > 0 && pluginType != 'old-h5'"
@@ -40,6 +43,9 @@ export default {
       height: '0px',
       _resizeObserver: null,
       _heightCheckTimer: null,
+      _weexRoot: null,
+      _useChildrenTotalHeight: false,
+      _parentElement: null, // 符合条件的父级元素
     };
   },
   components: {
@@ -80,6 +86,7 @@ export default {
         if (args.progressText) {
           this.progressText = args.progressText;
         } else if (args.url) {
+          this.progressText = ''
           this.url =  args.url;
           this.backgroundColor = args.pageBackgroundColor;
           this.pluginType = args.pluginType
@@ -124,6 +131,16 @@ export default {
       return null;
     };
     this._wrapperEl = findWrapperFromParent(); // 保存容器引用
+    
+    // 直接获取父级元素，如果 hmcomponentindex 属性存在且值为 midea-common-weex-view，则保存引用
+    const parentEl = this.$el;
+    if (parentEl) {
+      const hmComponentIndex = parentEl.getAttribute('hmcomponentindex');
+      if (hmComponentIndex === 'midea-common-weex-view') {
+        this._parentElement = parentEl;
+      }
+    }
+    
     // 优化手势处理性能
     this._rafId = null;
     this._pendingGesture = null;
@@ -167,6 +184,40 @@ export default {
       }
     },
     
+    // 计算 weex-root 所有子元素的高度总和
+    calculateWeexRootChildrenHeight(weexRoot) {
+      if (!weexRoot || !weexRoot.children || weexRoot.children.length === 0) {
+        return 0;
+      }
+      
+      let totalHeight = 0;
+      const children = Array.from(weexRoot.children);
+      
+      // 方法1: 计算所有子元素的 bottom 位置的最大值，减去第一个子元素的 top 位置
+      if (children.length > 0) {
+        const firstChildRect = children[0].getBoundingClientRect();
+        const rootRect = weexRoot.getBoundingClientRect();
+        let maxBottom = firstChildRect.bottom;
+        
+        children.forEach((child) => {
+          const rect = child.getBoundingClientRect();
+          maxBottom = Math.max(maxBottom, rect.bottom);
+        });
+        
+        totalHeight = maxBottom - rootRect.top;
+      }
+      
+      // 如果方法1计算出的高度为0或太小，则累加所有子元素的高度
+      if (totalHeight <= 0) {
+        children.forEach((child) => {
+          const childHeight = child.offsetHeight || child.clientHeight || child.scrollHeight || 0;
+          totalHeight += childHeight;
+        });
+      }
+      
+      return totalHeight;
+    },
+    
     // 监听 iframe 内 .weex-root 第一个子元素或 .weex-scroller-inner 的高度
     startWeexRootHeightMonitoring() {
       // 尝试多次查找元素（因为 iframe 内容可能还在加载）
@@ -189,8 +240,9 @@ export default {
           const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
           let targetElement = null;
           let elementDesc = '';
+          let useChildrenTotalHeight = false; // 标记是否使用子元素总高度
           
-          // 查找 .weex-root 的第一个子元素
+          // 查找 .weex-root
           const weexRoot = iframeDocument.querySelector('.weex-root');
           const weexRootFirstChild = (weexRoot && weexRoot.children.length > 0) ? weexRoot.children[0] : null;
           
@@ -199,20 +251,29 @@ export default {
           
           // 如果两个都找到了，比较高度，谁大用谁
           if (weexRootFirstChild && weexScrollerInner) {
-            const rootHeight = weexRootFirstChild.offsetHeight || weexRootFirstChild.clientHeight || 0;
+            // 计算 weex-root 所有子元素的总高度
+            const rootChildrenTotalHeight = this.calculateWeexRootChildrenHeight(weexRoot);
+            const rootFirstChildHeight = weexRootFirstChild.offsetHeight || weexRootFirstChild.clientHeight || 0;
+            // 使用子元素总高度和第一个子元素高度的较大值
+            const rootHeight = Math.max(rootChildrenTotalHeight, rootFirstChildHeight);
             const scrollerHeight = weexScrollerInner.offsetHeight || weexScrollerInner.clientHeight || 0;
             
             if (rootHeight >= scrollerHeight) {
               targetElement = weexRootFirstChild;
-              elementDesc = `.weex-root 的第一个子元素 (高度: ${rootHeight}px)`;
+              useChildrenTotalHeight = rootChildrenTotalHeight > rootFirstChildHeight;
+              elementDesc = useChildrenTotalHeight 
+                ? `.weex-root 的所有子元素总高度 (${rootChildrenTotalHeight}px)` 
+                : `.weex-root 的第一个子元素 (高度: ${rootHeight}px)`;
             } else {
               targetElement = weexScrollerInner;
               elementDesc = `.weex-scroller-inner (高度: ${scrollerHeight}px)`;
             }
           } else if (weexRootFirstChild) {
-            // 只找到 .weex-root 的第一个子元素
+            // 只找到 .weex-root 的第一个子元素，使用所有子元素的总高度
             targetElement = weexRootFirstChild;
-            elementDesc = '.weex-root 的第一个子元素';
+            useChildrenTotalHeight = true;
+            const rootChildrenTotalHeight = this.calculateWeexRootChildrenHeight(weexRoot);
+            elementDesc = `.weex-root 的所有子元素总高度 (${rootChildrenTotalHeight}px)`;
           } else if (weexScrollerInner) {
             // 只找到 .weex-scroller-inner
             targetElement = weexScrollerInner;
@@ -223,6 +284,10 @@ export default {
           if (targetElement) {
             console.log(`找到 ${elementDesc}，开始监听高度变化`, targetElement);
             
+            // 保存 weexRoot 引用和是否使用子元素总高度的标记
+            this._weexRoot = weexRoot;
+            this._useChildrenTotalHeight = useChildrenTotalHeight;
+            
             // 清除定时器，找到了就不再尝试
             clearInterval(this._heightCheckTimer);
             
@@ -230,10 +295,24 @@ export default {
             this.updateIframeHeightFromElement(targetElement);
             
             // 使用 ResizeObserver 监听元素高度变化
-            this._resizeObserver = new ResizeObserver(() => {
-              this.updateIframeHeightFromElement(targetElement);
-            });
-            this._resizeObserver.observe(targetElement);
+            // 如果使用子元素总高度，需要监听 weexRoot 的所有子元素
+            if (useChildrenTotalHeight && weexRoot) {
+              // 监听 weexRoot 本身的变化
+              this._resizeObserver = new ResizeObserver(() => {
+                this.updateIframeHeightFromElement(targetElement);
+              });
+              this._resizeObserver.observe(weexRoot);
+              
+              // 同时监听所有子元素的变化
+              Array.from(weexRoot.children).forEach((child) => {
+                this._resizeObserver.observe(child);
+              });
+            } else {
+              this._resizeObserver = new ResizeObserver(() => {
+                this.updateIframeHeightFromElement(targetElement);
+              });
+              this._resizeObserver.observe(targetElement);
+            }
             
           } else if (attempts >= maxAttempts) {
             clearInterval(this._heightCheckTimer);
@@ -252,8 +331,17 @@ export default {
     updateIframeHeightFromElement(element) {
       if (!element) return;
       
-      // 获取元素的实际高度
-      const elementHeight = element.offsetHeight || element.clientHeight || element.scrollHeight;
+      let elementHeight = 0;
+      
+      // 如果标记了使用子元素总高度，且 weexRoot 存在，计算所有子元素的总高度
+      if (this._useChildrenTotalHeight && this._weexRoot) {
+        elementHeight = this.calculateWeexRootChildrenHeight(this._weexRoot);
+      }
+      
+      // 如果子元素总高度为0或未使用，则使用元素本身的高度
+      if (elementHeight <= 0) {
+        elementHeight = element.offsetHeight || element.clientHeight || element.scrollHeight;
+      }
       
       if (elementHeight > 0) {
         // 限制最大高度，防止死循环
@@ -289,7 +377,13 @@ export default {
         if (this.height !== newHeight) {
           this.height = newHeight;
           console.log(`iframe 高度已更新: ${finalHeight}px -> ${newHeight} (embedId: ${this.embedId}, max: ${maxHeight}px)`);
+          // 如果父级元素存在且符合条件，也给父级元素设置高度
+          if (this._parentElement) {
+            this._parentElement.style.height = `${finalHeight}px`;
+          }
         }
+        
+
       }
     },
     handleGestureBubble(gestureData) {
@@ -349,6 +443,10 @@ export default {
       this._heightCheckTimer = null;
     }
     
+    // 清理引用
+    this._weexRoot = null;
+    this._useChildrenTotalHeight = false;
+    
     // 清理RAF避免内存泄漏
     if (this._rafId) {
       cancelAnimationFrame(this._rafId);
@@ -367,4 +465,27 @@ export default {
 .common-view-iframe {
   height: 100%;
 }
+.progress-container {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 10;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.progress-loading {
+  width:80px;
+  height:80px;
+  display: block;
+  margin-bottom: 40px;
+}
+.progress-text {
+  font-size: 24px;
+  color: #333;
+  text-align: center;
+  font-weight: 400;
+}
 </style>

package/src/components/midea-ipc-drag-list-view.vue

@@ -56,17 +56,13 @@
             >
               {{ item.label }}
             </div>
-            <button
-              class="edit-btn"
+            <img
               @click.stop.prevent="() => onEditClick(item, index)"
-            >
-              <img
-                class="edit-icon"
-                :src="'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAMAAACahl6sAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAJSUExURUdwTIqKioqKioqKiouLi4qKioqKioeHh4mJiYmJiYmJiYqKioyMjIqKiomJiYmJiYqKioqKiomJiY2NjYqKiomJiYmJiYqKioqKiomJiZGRkYyMjImJiYqKioiIiIiIiIqKioqKioqKiomJiYmJiX9/f4uLi4mJiYmJiYeHh4iIiIqKiomJiYmJiYqKioiIiImJiYmJiX9/f4qKioqKiouLi4iIiImJiYWFhYaGhoqKioyMjIuLi4yMjIqKioyMjImJiYiIiIqKioiIiIuLi5CQkImJiYmJiYyMjImJiYiIiIqKioqKiomJiYqKio2NjYuLi4qKioqKiomJiYmJiYqKioyMjIqKiouLi4qKioqKio6OjomJiYqKiomJiaqqqoqKioiIiIuLi4aGhoiIiImJiYqKioiIiIiIiIqKioiIiIeHh4mJiYmJiY6OjouLi4SEhImJiYmJiYqKin9/f4mJiYeHh4mJiYqKiomJiYuLi4mJiYmJiYmJiYmJiYmJiYmJiYqKioiIiImJiYqKioqKio6OjouLi39/f4mJiYmJiYiIiImJiYqKiomJiYqKiomJiYmJiYiIiIiIiImJiYqKioqKiomJiY2NjYiIiIqKin9/f4uLi4qKiomJiYmJiYiIiImJiYmJiYqKioqKiomJiYuLi4mJiYiIiIuLi4qKio+Pj4eHh4qKiv///4uLi4qKiomJiYmJiYmJiYmJiYeHh4qKiomJiYqKiouLi5SUlI2NjYqKioiIiIuLi4qKioqKiomJiYmJiYmJiYiIiIqKiuBsLJgAAADFdFJOUwB/VS4q1KpAv4CLsTNtSqxEdOckYE6ShZxmBzx3tA86UYjlp6AEFg09IHCtTM85bHpQCrJwQDY0FRPWMQsUrx3vKbVFNxejlia7R5mB8yMvTd+kP7hGR2lYGL4Zj8JBA1xJNSY4yO5jHNuVMe0aInkbb1u2AmQizDv1bNvrJdPk9qJLJ/G4K0IIt599c/lxMEPpLVQyjv3iElLJBlLFuWph0V1eU/hJ6h4hnRAR2gFf8+DVaOgz7H7YLAwJ3Vhj8EjG/JwrJ2aZ1gAABKpJREFUeNrt3Pdz1EYUB/Dns7Hl3iumF2MwphowPUDoBGO6MZ0USgodEhJqICGdXkPvCZ2EllDv/2Jghpm9k07S7t1p39t53x89e3rv45Gt3ZVOABwOh8PhcDgcU1OcZYWtrGLyjtyi8NsU5RJ3pITfJ9MQB22J6KAsiXTQlUQ7qErsDpoSJwdFibODniSWg5oktoOWxM1BSeLuoCPxclCReDtoSBwcFkWJ3ZGdARnZ5CR2R/q7n6cTk8RyUJPEdtCSuDkoSdwddCReDioSbwcNiR8HBYk/B36JXwd2iX8HbomMA7PE7vjGdTxWicO8vQwISpzWUf8BPYnjevBHICdJUVzKYpOkKC/KcUlc9hlSKElc90sISTz2fchIPPevFCT3cO7DyUtud0C5n+gtGRP9icP6HdaZnr2lJSXRH8jX7sh0Puk9JN2jx3+PwiEvGRg9/BUOh6zk0d3o0eVIHHIXh+kPo8ee+xCLQ0byYKVt6Gw8Dv+SQTNsA0OYHH4l9UexO/xJenTW6sj0d9p4Sxr+oODwlhT8Q8PhJZk8morDXZI3jY7DTVK6g5IjtqTjL7QcsSShI9QcTpKhGweE6TmcJGGSDl8SEg4fEiIOTwkZh4eEkMNVQsrhIiHmiCkh54BiQxwA6w1xwEhDHDmGONLasIMd7GAHO9jBDgMdBw1xnDLE0dEQRz9DHKWGOJoMcdQZ4sgzxHHZEMdzQxyTDXGMNcRRYIjjd0MciwxxNBjimGmIo4chjrYBOpYm0bElQAcsTJ4j0Kf1c5LnWBGkAyqT5hgXqAOmJssxKFgHlEdUb06YY3DADugkVl+TlihHTtAOyBLL70yU41DgDmgV6/dMkOO34B1QFu/EyMExXYMDJsQ5o3BwpOpwwBSxhfpEOA5ocUBFXNcwB8drPQ7oGs8/fwdHmiYHjBe7GBa34wNdDuii/mfq4NitzRH5ZNveOB0T9Tmgl+qJ4eD4VqMDIl5xtzwux0c6HdBOrRUHxyatDpgl9lIbh+OaXgdMEpsZpe6o1eyAFrGbr5QdV3U7IjdR5qs6Rml3wGmxnyGKjs/0O+CE2NAxNcfnCBywWeyovZJjAQYHRLxsokbFMR+FA74Te+qv4OiOwwFDxaaq5B1DkDjgb7GrbtKOEVgc8FRs66asoxGNA+74Xqeutjv+wuOA7X63sL+0f2/7BiIHFImdPRtTsm/snLymfhdD89ZdOPt/5dw+a38trO77U+af9+3f/2jvu8gXGfKRhWwLq6bGb4lQvsrhLck7HJ+oOh6rbQv4Txs5yB5Fx3D/JVR/VXJn11a1Ik8AG+SSUo0fAB3kpUqJKsAHUalwEhBCXsgX6AYYIaukj78YUELqZA+/AXBCoFnq4FcUZkGWIkR2iXBe4tjpKtO5PmqO69KFUr+uaJk0q112r/Qu47tWTJlQ1prVqXzqv32rCwfmzq389NaSeaHjpbvmFCxKVXvNXWNJviWfn3Xeo+BwOBwOh8PhcHAntN/CmJGyz4TPDmNNoRzkY7QQybvFeB0BbNAxhCEMYYg+yGi8ELnnwgegdXTuL3dpt5A6ZkjfaU/LwJhlw3k+z+FwOBwOhxNs3gBELfmj2OBppwAAAABJRU5ErkJggg=='"
-                :style="{ width: scalePx(data.editBtnSize, 24) + 'px', height: scalePx(data.editBtnSize, 24) + 'px' }"
-                alt="编辑"
-              />
-            </button>
+              class="edit-icon"
+              :src="'data:image/png;base64,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'"
+              :style="{ width: scalePx(data.editBtnSize, 12) + 'px', height: scalePx(data.editBtnSize, 12) + 'px' }"
+              alt="编辑"
+            />
           </div>
          </div>
        </div>
@@ -463,7 +459,6 @@
    font-weight:300
  }
  .label {
-   width: 100%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
@@ -473,15 +468,11 @@
   width: 100%;
   display: flex;
   align-items: center;
+  flex-direction: row;
+  justify-content: center;
   gap: 8px;
 }
-.edit-btn {
-  margin-left: auto;
-  padding: 4px 8px;
-  border: none;
-  border-radius: 4px;
-  background: #f5f5f5;
-  color: #333;
+.edit-icon {
 }
  .drag-clone {
    box-sizing: border-box;