centaline-data-driven-v3 0.1.38 → 0.1.39

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "centaline-data-driven-v3",
-  "version": "0.1.38",
+  "version": "0.1.39",
   "private": false,
   "description": "centaline-data-driven-v3",
   "main": "dist/centaline-data-driven-v3.umd.js",

package/src/components/web/ComboBox.vue

@@ -21,7 +21,7 @@
                 <template #tag>
                     <template v-for="(v, i) in model.labelValue" :key="i">
                         <el-tag class="ml-2" type="info" disable-transitions :closable="!v.locked && !model.locked"
-                        :style="{ marginRight: i+1==model.labelValue.length ? '20px' : '' }"
+                            :style="{ marginRight: i + 1 == model.labelValue.length ? '20px' : '' }"
                             @close="closeTag(v.code)">
                             {{ v.name }}</el-tag>
                     </template>
@@ -62,6 +62,7 @@ const refselect = ref()
 const open = ref(false)
 const isComposing = ref(false);
 const nodatatext = ref('    ')
+const popperWidth = ref(null)
 model.value.itemKey = Math.random();
 let cancelTokenSource = null; // 用于存储取消令牌
 
@@ -77,6 +78,7 @@ onBeforeUnmount(() => {
 
 //下拉框出现/隐藏时触发
 function visibleChange(visible) {
+
     //是否有更多选择路由
     if (model.value.moreActionRouter) {
         refselect.value.popperRef.hidden = true
@@ -84,6 +86,9 @@ function visibleChange(visible) {
     else {
         //出现获取数据
         if (visible) {
+            if (refselect.value && popperWidth.value) {
+                refselect.value.popperSize = popperWidth.value;
+            }
             open.value = true;
             nodatatext.value = common.LocalizedString('加载中', '加載中');
             if (!model.value.filterable) {
@@ -256,9 +261,11 @@ function setminWidth() {
 
     if ((span.getBoundingClientRect().width + 40) <= refselect.value.selectRef.offsetWidth) {
         refselect.value.popperSize = refselect.value.selectRef.offsetWidth;
+        popperWidth.value = refselect.value.selectRef.offsetWidth;
     }
     else {
         refselect.value.popperSize = span.getBoundingClientRect().width + 40;
+        popperWidth.value = span.getBoundingClientRect().width + 40;
     }
 
     document.body.removeChild(span);

package/src/components/web/ContainerControl.vue

@@ -12,10 +12,10 @@
                     <div style="display: flex; flex: 0 0 100%;" v-if="col.show !== false && col.lineFeed"></div>
                     <div v-if="col.show !== false"
                         :class="index > 0 && (col.controlLabel == '' || col.is == 'ct-button') ? 'complex-left-10' : ''"
-                        :style="{ 'width': (col.width && col.width>0 ? col.width + 'px' : ''), 'flex': (col.width && col.width>0? '0 0 ' + col.width + 'px' : '') }">
+                        :style="{ 'width': (col.width && col.width > 0 ? col.width + 'px' : ''), 'flex': (col.width && col.width > 0 ? '0 0 ' + col.width + 'px' : '') }">
                         <component ref="Fields" :is="col.is" :vmodel="col" :parameterAction="parameterAction"
-                            v-bind="col.bindPara" @fieldClick="fieldClickHandler(col)" @change="change(col)"
-                            @popupSearchList="popupSearchListHandler"></component>
+                            :key="col.fieldItemKey" v-bind="col.bindPara" @fieldClick="fieldClickHandler(col)"
+                            @change="change(col)" @popupSearchList="popupSearchListHandler"></component>
                     </div>
                 </template>
             </template>
@@ -28,10 +28,10 @@
                         <div style="display: flex; flex: 0 0 100%;" v-if="col.show !== false && col.lineFeed"></div>
                         <el-col v-if="col.show !== false"
                             :class="[index > 0 && (col.controlLabel == '' || col.is == 'ct-btn') ? 'complex-left-10' : '', 'containerCol']"
-                            :style="{ 'width': (col.width && col.width>0 ? col.width + 'px' : '100%'), 'flex': (col.width && col.width>0 ? '0 0 ' + col.width + 'px' : '100%') }">
+                            :style="{ 'width': (col.width && col.width > 0 ? col.width + 'px' : '100%'), 'flex': (col.width && col.width > 0 ? '0 0 ' + col.width + 'px' : '100%') }">
                             <component ref="Fields" :is="col.is" :vmodel="col" :parameterAction="parameterAction"
-                                v-bind="col.bindPara" @fieldClick="fieldClickHandler(col)" @change="change(col)"
-                                @popupSearchList="popupSearchListHandler">
+                                :key="col.fieldItemKey" v-bind="col.bindPara" @fieldClick="fieldClickHandler(col)"
+                                @change="change(col)" @popupSearchList="popupSearchListHandler">
                             </component>
                         </el-col>
                     </template>

package/src/components/web/Form.vue

@@ -5,16 +5,16 @@
             <div style="flex: 1; min-width: 0;">
                 <div v-if="model !== null && !loading" class="ct-form">
                     <el-affix target=".ct-form" v-if="model.tip" :offset="62">
-                        <div class="ct-form-tip">
+                        <div class="ct-form-tip" ref="refTip">
                             <span v-html="model.tip"></span>
                         </div>
                     </el-affix>
 
                     <!--可根据场景判断显示el-card还是el-main-->
-                    <component :is="model.showTitle ? 'el-main' : 'el-card'">
-                        <div class="ct-from-title" v-if="typeof model.title !== 'undefined' && model.flagShowTitle">
+                    <component :is="model.showTitle ? 'el-main' : 'el-card'" :key="itemKey">
+                        <!-- <div class="ct-from-title" v-if="typeof model.title !== 'undefined' && model.flagShowTitle">
                             <span style="font-weight:bold">{{ model.title }}</span>
-                        </div>
+                        </div> -->
 
                         <!--relationParentFormFields-->
                         <el-row v-if="relationParentFormFields.length > 0">
@@ -23,9 +23,9 @@
                                 </div>
                                 <el-col v-if="col.show !== false" :span="col.colspan" style="padding:5px"
                                     :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
-                                    <component ref="Fields" :is="col.is" :vmodel="col" :key="itemKey" :listHeight="listHeight"
-                                        :parameterAction="model.parameterAction" v-bind="col.bindPara"
-                                        :fileData="getFileData(col)" @change="changeHandler"
+                                    <component ref="Fields" :is="col.is" :vmodel="col" :key="col.fieldItemKey"
+                                        :listHeight="listHeight" :parameterAction="model.parameterAction"
+                                        v-bind="col.bindPara" :fileData="getFileData(col)" @change="changeHandler"
                                         @importComplete="importComplete" @popupLocation="popupLocationHandler"
                                         @fieldClick="fieldClickHandler" @popupSearchList="popupSearchListHandler"
                                         @tableButtonClick="clickHandler" @popupGroupList="popupGroupListHandler"
@@ -42,9 +42,9 @@
                                 </div>
                                 <el-col v-if="col.show !== false" :span="col.colspan" style="padding:5px"
                                     :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
-                                    <component ref="Fields" :is="col.is" :vmodel="col" :key="itemKey" :listHeight="listHeight"
-                                        :parameterAction="model.parameterAction" v-bind="col.bindPara"
-                                        :fileData="getFileData(col)" @change="changeHandler"
+                                    <component ref="Fields" :is="col.is" :vmodel="col" :key="col.fieldItemKey"
+                                        :listHeight="listHeight" :parameterAction="model.parameterAction"
+                                        v-bind="col.bindPara" :fileData="getFileData(col)" @change="changeHandler"
                                         @importComplete="importComplete" @popupLocation="popupLocationHandler"
                                         @fieldClick="fieldClickHandler" @popupSearchList="popupSearchListHandler"
                                         @tableButtonClick="clickHandler" @popupGroupList="popupGroupListHandler"
@@ -54,37 +54,43 @@
                             </template>
                         </el-row>
                         <!--tabs-->
-                        <el-tabs v-if="model.isHorizontalLayout" v-model="activeName" @tab-click="tabClick">
+                        <template v-if="model.isHorizontalLayout">
+                            <component :is="model.flagFixedTabOnHorizontalLayout ? 'el-affix' : 'div'"
+                                v-bind="model.flagFixedTabOnHorizontalLayout ? { offset: tabTopHight, target: '.ct-form' } : {}">
+                                <el-tabs v-model="activeName" @tab-click="tabClick" style="background: #fff;">
+                                    <template v-for="(item, index) in model.collapse" :key="index">
+                                        <el-tab-pane :name="index.toString()" :lazy="item.lazyLoad"
+                                            v-if="item.show !== false" :key="index">
+                                            <template #label>
+                                                <span v-html="item.controlLabel"></span>
+                                            </template>
+                                        </el-tab-pane>
+                                    </template>
+                                </el-tabs>
+                            </component>
                             <template v-for="(item, index) in model.collapse" :key="index">
-                                <el-tab-pane :name="index.toString()" :lazy="item.lazyLoad" v-if="item.show !== false"
-                                    :key="index">
-                                    <template #label>
-                                        <span v-html="item.controlLabel"></span>
+                                <el-row v-show="activeName === index.toString()">
+                                    <template v-for="(col, i) in model.collapseFields[index + 1]" :key="i">
+                                        <div style="display: flex; flex: 0 0 100%;"
+                                            v-if="col.show !== false && col.lineFeed"></div>
+                                        <el-col :span="col.colspan" v-if="col.show !== false" style="padding:5px"
+                                            :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
+                                            <component ref="Fields" :is="col.is" :vmodel="col" :key="col.fieldItemKey"
+                                                :listHeight="listHeight" :parameterAction="model.parameterAction"
+                                                v-bind="col.bindPara" :fileData="getFileData(col)"
+                                                @change="changeHandler" @fieldClick="fieldClickHandler"
+                                                @popupLocation="popupLocationHandler"
+                                                @popupSearchList="popupSearchListHandler"
+                                                @importComplete="importComplete" @popupGroupList="popupGroupListHandler"
+                                                @tableButtonClick="clickHandler"
+                                                @flagNotificationParentAfterContentChanged="flagNotificationParentAfterContentChanged">
+                                            </component>
+                                        </el-col>
                                     </template>
-                                    <el-row>
-                                        <template v-for="(col, i) in model.collapseFields[index + 1]" :key="i">
-                                            <div style="display: flex; flex: 0 0 100%;"
-                                                v-if="col.show !== false && col.lineFeed"></div>
-                                            <el-col :span="col.colspan" v-if="col.show !== false" style="padding:5px"
-                                                :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
-                                                <component ref="Fields" :is="col.is" :vmodel="col" :key="itemKey" :listHeight="listHeight"
-                                                    :parameterAction="model.parameterAction" v-bind="col.bindPara"
-                                                    :fileData="getFileData(col)" @change="changeHandler"
-                                                    @fieldClick="fieldClickHandler"
-                                                    @popupLocation="popupLocationHandler"
-                                                    @popupSearchList="popupSearchListHandler"
-                                                    @importComplete="importComplete"
-                                                    @popupGroupList="popupGroupListHandler"
-                                                    @tableButtonClick="clickHandler"
-                                                    @flagNotificationParentAfterContentChanged="flagNotificationParentAfterContentChanged">
-                                                </component>
-                                            </el-col>
-                                        </template>
-                                    </el-row>
-                                </el-tab-pane>
+                                </el-row>
                             </template>
-                        </el-tabs>
-
+                            <div style="height: 34px;"> </div>
+                        </template>
                         <!--分组-->
                         <el-collapse v-else v-model="model.collapseActiveNames"
                             :class="model.flagHideSaveLine ? 'el-collapse-saveLine' : ''">
@@ -104,10 +110,10 @@
                                                 v-if="col.show !== false && col.lineFeed"></div>
                                             <el-col :span="col.colspan" v-if="col.show !== false" style="padding:5px"
                                                 :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
-                                                <component ref="Fields" :is="col.is" :vmodel="col" :key="itemKey" :listHeight="listHeight"
-                                                    :parameterAction="model.parameterAction" v-bind="col.bindPara"
-                                                    :fileData="getFileData(col)" @change="changeHandler"
-                                                    @fieldClick="fieldClickHandler"
+                                                <component ref="Fields" :is="col.is" :vmodel="col" :key="col.fieldItemKey"
+                                                    :listHeight="listHeight" :parameterAction="model.parameterAction"
+                                                    v-bind="col.bindPara" :fileData="getFileData(col)"
+                                                    @change="changeHandler" @fieldClick="fieldClickHandler"
                                                     @popupLocation="popupLocationHandler"
                                                     @popupSearchList="popupSearchListHandler"
                                                     @importComplete="importComplete"
@@ -130,7 +136,7 @@
                                     :class="[col.is == 'ct-button' && col.labelPlacement == '1' ? 'el-col1' : '']">
                                     <component ref="Fields" :is="col.is" :vmodel="col" :listHeight="listHeight"
                                         :parameterAction="model.parameterAction" v-bind="col.bindPara"
-                                        @change="changeHandler" :key="itemKey" :fileData="getFileData(col)"
+                                        @change="changeHandler" :key="col.fieldItemKey" :fileData="getFileData(col)"
                                         @fieldClick="fieldClickHandler" @popupSearchList="popupSearchListHandler"
                                         @importComplete="importComplete" @tableButtonClick="clickHandler"
                                         @popupGroupList="popupGroupListHandler" @popupLocation="popupLocationHandler"
@@ -148,8 +154,7 @@
 
                             </el-col>
                         </el-row>
-                        <el-row v-if="model.buttons.findIndex((v) => { return v.show }) > -1"
-                            :class="isScroll ? 'button-absolute' : 'button-initial'"
+                        <el-row v-if="model.buttons.findIndex((v) => { return v.show }) > -1" class="button-absolute"
                             :style="['max-width:' + buttonsWidth(), isWebScroll ? 'position: fixed;' : '']">
                             <el-col :span="24"
                                 style="text-align:center;padding-bottom: 1px;padding-left: 5px;padding-right: 5px;"
@@ -164,6 +169,12 @@
                         <div v-if="isScroll && model.buttons.findIndex((v) => { return v.show }) > -1"
                             style="height: 34px;">
                         </div>
+                        <el-affix target=".ct-form" position="bottom" v-if="model.bottomTip"
+                            :offset="model.buttons.findIndex((v) => { return v.show }) > -1 ? 43 : 0">
+                            <div class="ct-form-tip">
+                                <span v-html="model.bottomTip"></span>
+                            </div>
+                        </el-affix>
                     </component>
                 </div>
 
@@ -276,6 +287,8 @@ const minHeight = ref('auto')
 const showAI = ref(false);
 const dialogHeight = ref(props.dialogHeight || (window.innerHeight - 60));
 const tabActiveNameKey = ref('')
+const refTip = ref()
+const tabTopHight = ref(52)
 
 const qrtimer1 = ref(null)
 const qrtimer2 = ref(null)
@@ -366,7 +379,11 @@ function load(data) {
 
         }
     }
-
+    nextTick(() => {
+        if (refTip.value) {
+            tabTopHight.value = tabTopHight.value + refTip.value.clientHeight + 10
+        }
+    })
     //通知父组件加载完成
     emit('loaded', model.value);
 }
@@ -686,6 +703,12 @@ function setCss() {
     if (props.topHeight > -1) {
         minHeight.value = (document.documentElement.clientHeight - props.topHeight - 20) + 'px';
     }
+    else if(props.dialogHeight){
+        minHeight.value = (props.dialogHeight) + 'px';
+    }
+    else{
+        minHeight.value = document.documentElement.clientHeight + 'px';
+    }
 }
 
 

package/src/components/web/JsonViewer.vue

@@ -1,36 +1,56 @@
-<template> 
-
-    <div class="josnViewerBox" :style="{ height: model.height || 'auto','max-height':(listHeight?listHeight-130+'px':'calc(100vh - 130px)') }" v-if="isRefresh">
-      <JsonViewer :value="model.json" copyable show-array-index show-double-quotes theme="light" :expanded="true"
-        :expand-depth="2" @onKeyClick="keyClick">
-        <template #copy="{ copied }">
-          <div class="btn-iocn"><el-icon title="复原到初始状态" @click.stop="resetJSON">
-              <Refresh />
-            </el-icon>
-
-            <!-- 复制按钮 -->
-            <el-icon :class="{ 'copied': copied }" title="复制JSON内容">
-              <CopyDocument />
-            </el-icon>
-          </div>
-        </template>
-      </JsonViewer>
-    </div>
+<template>
+  <div class="josnViewerBox" ref="jsonContent" tabindex="-1"
+    :style="{ height: model.height || 'auto', 'max-height': ('calc(100vh - '+topDistance+'px)') }"
+    v-if="isRefresh">
+    <JsonViewer :value="model.json" copyable show-array-index show-double-quotes theme="light" :expanded="true"
+      :expand-depth="2" @onKeyClick="keyClick">
+      <template #copy="{ copied }">
+        <div class="btn-iocn"><el-icon title="复原到初始状态" @click.stop="resetJSON">
+            <Refresh />
+          </el-icon>
+
+          <!-- 复制按钮 -->
+          <el-icon :class="{ 'copied': copied }" title="复制JSON内容">
+            <CopyDocument />
+          </el-icon>
+        </div>
+      </template>
+    </JsonViewer>
+  </div>
 </template>
 
 <script setup>
 import { JsonViewer } from "vue3-json-viewer"
 import "vue3-json-viewer/dist/vue3-json-viewer.css";
-import { nextTick, ref } from "vue";
+import { useDistanceCalculator } from '../../utils/distance-utils.js';
+
+import { nextTick, ref, onMounted ,inject} from "vue";
 const props = defineProps({
   api: String,
   vmodel: Object,
   actionRouter: Array,
-   listHeight: Number,
+  listHeight: Number,
 })
+
+const jsonContent = ref(null); 
+
 const model = ref({});
 const isRefresh = ref(true);
+const topDistance = ref(0);
+const { getAllDistances } = useDistanceCalculator(jsonContent);
+
+
+ 
+
+// 在组件挂载后或需要时调用
+onMounted(() => {
+  nextTick(() => { 
+      setTimeout(() => {
+       topDistance.value = getAllDistances()?.elementInfo?.top+40;
+      }, 100);
+  });
 
+});
 
 init()
 //初始化数据
@@ -47,12 +67,12 @@ function load(data) {
 }
 const resetJSON = () => {
   isRefresh.value = false;
-  nextTick(() => { 
+  nextTick(() => {
     isRefresh.value = true;
   });
 };
 
- 
+
 
 const keyClick = (keyName) => {
   console.log(keyName, "it was click")
@@ -72,14 +92,14 @@ const keyClick = (keyName) => {
   z-index: 10;
   margin-left: auto;
   /* 辅助：确保靠右 */
- float: right;
+  float: right;
 
 }
 
- 
+
 
 .josnViewerBox {
-  overflow: auto; 
+  overflow: auto;
   width: 100%;
   border: 1px solid #eee;
   border-radius: 4px;
@@ -89,14 +109,15 @@ const keyClick = (keyName) => {
   box-sizing: border-box;
   background-color: #ffffff;
 }
+
 .josnViewerBox:focus {
   border: 1px solid #3D5ECC;
 }
 
 
 .btn-iocn {
-    display: flex;
+  display: flex;
   gap: 10px;
- 
+
 }
 </style>

package/src/loader/src/Form.js

@@ -98,6 +98,9 @@ function loadFromModel(source, isFormList) {
           }
 
           rtn1[attrKey] = attrValue;
+          if (rtn1.fieldItemKey) {
+            rtn1.fieldItemKey = Math.random()
+          }
 
           if (rtn1.controlType === Enum.ControlType.Tags) {
             rtn1["value"] = JSON.parse(attrValue);
@@ -533,10 +536,12 @@ function loadFromModel(source, isFormList) {
           if (f.controlType == Enum.ControlType.Compound || f.controlType == Enum.ControlType.ContainerControl) {
             if (f.fields) {
               f.fields.forEach((v) => {
+                v.fieldItemKey = Math.random();
                 rtn._fieldsDic[v.fieldName1] = v;
               });
             }
           }
+          f.fieldItemKey = Math.random();
           rtn._fieldsDic[f.fieldName1] = f;
         });
       }
@@ -765,6 +770,12 @@ function loadFromModel(source, isFormList) {
     get tip() {
       return source.tip;
     },
+    get bottomTip() {
+      return source.bottomTip;
+    },
+    get flagFixedTabOnHorizontalLayout() {
+      return source.flagFixedTabOnHorizontalLayout === true;
+    },
     get flagAlertCloseWindowAfterSave() {
       return source.flagAlertCloseWindowAfterSave === true;
     },

package/src/loader/src/LibFunction.js

@@ -301,7 +301,7 @@ const LibFunction = {
                     else {
                         num = 24 / colNum;
                     }
-                    return num;
+                    return parseInt(num);
                 },
                 get for() {
                     return field.for;

package/src/loader/src/SliceUpload.js

@@ -1,7 +1,15 @@
-
+import common from '../../utils/common';
 async function postFile(api, data, callback) {
   var xhr = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject("Microsoft.XMLHTTP");
   xhr.open('POST', api, !0)
+  
+  // let headers=common.getDataDrivenOpts().handler.getRequestHeaders(api);
+  // if(headers){
+  //   for (const [key, value] of Object.entries(headers)) {
+  //     xhr.setRequestHeader(key,value)
+  //   }
+  // }
+
   xhr.onreadystatechange = function () {
     if (xhr.readyState != 4 || xhr.status < 200) {
       return false;

package/src/main.js

@@ -21,7 +21,7 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
 }
 
 app.use(centaline, {
-    baseUrl: "http://10.88.22.13:7080/ibs-api/",
+    baseUrl: "http://10.88.22.66/IBS.Mvc/api/",
     //baseUrl:"http://10.88.22.13:7070/onecard-api/",
     //baseUrl: "https://kq-api.centaline.com.cn/onecard-api/",
     //baseUrl: "http://10.88.22.13:6060/onecard-api/",
@@ -65,7 +65,7 @@ app.use(centaline, {
         //获取请求头
         getRequestHeaders: function () {
             return {
-              authobject: '{token:"T5067-1993594422771769344",platform:"WEB"}',
+              authobject: '{EmpID:"Token_a3e4add3-642b-40b6-bc3f-32bdf8114668",MachineCode:"ae184643-f8e2-453c-a752-ba82612b592f",SSO_Token:"SSOToken_a3e4add3-642b-40b6-bc3f-32bdf8114668",Platform:"WEB"}',
                 //oldToken: 'd92d4a3b-2274-42e8-96f0-100ffb579b6e',
                 //authObject: '{token:"jiangzf-1958445358178844672",platform:"WEB"}',
                 //authObject: '{EmpID:"Token_4e09499b-4b76-46df-9ce5-5498d48ed062",MachineCode:"ae184643-f8e2-453c-a752-ba82612b592f",SSO_Token:"SSOToken_4e09499b-4b76-46df-9ce5-5498d48ed062",Platform:"WEB"}',

package/src/utils/common.js

@@ -278,7 +278,10 @@ const common = {
    */
   message(message, type, center, duration, showClose, dangerouslyUseHTMLString) {
     if (dataDrivenOpts.flagApp) {
-      if (this.hasHtml(message)) {
+      if (typeof duration === 'undefined') {
+        duration = 3000;
+      }
+      if (duration == 0) {
         showDialog({ message: message, allowHtml: true });
       }
       else if (type == 'error') {
@@ -287,7 +290,7 @@ const common = {
       else {
         showToast({
           message: message,
-          duration: 3000,
+          duration: duration,
         });
       }
 
@@ -303,9 +306,7 @@ const common = {
         showClose = false;
       }
       if (this.hasHtml(message)) {
-        duration = 0;
         dangerouslyUseHTMLString = true;
-        showClose = true;
       }
       ElMessage({
         message: message,//消息文字

package/src/utils/distance-utils.js

@@ -0,0 +1,84 @@
+export const useDistanceCalculator = (elementRef) => {
+  const getAllDistances = (retryCount = 0) => {
+    if (!elementRef?.value) {
+      console.warn('元素引用为空');
+      return null;
+    }
+    
+    const element = elementRef.value;
+    
+    // 检查元素是否在 DOM 中
+    if (!document.body.contains(element)) {
+      console.warn('元素不在 DOM 中');
+      return null;
+    }
+    
+    const rect = element.getBoundingClientRect();
+    const scrollTop = window.pageYOffset;
+    
+    // 检查是否有实际尺寸
+    const hasSize = rect.height > 0 && rect.width > 0;
+    
+    if (!hasSize && retryCount < 3) {
+      console.warn(`元素尺寸为 0，尝试重试 (${retryCount + 1}/3)`);
+      // 延迟重试
+      setTimeout(() => getAllDistances(retryCount + 1), 50);
+      return null;
+    }
+    
+    // 获取计算样式，检查是否隐藏
+    const computedStyle = window.getComputedStyle(element);
+    const isVisible = computedStyle.display !== 'none' && 
+                      computedStyle.visibility !== 'hidden' &&
+                      computedStyle.opacity !== '0';
+    
+    if (!isVisible) {
+      console.warn('元素不可见，无法获取尺寸');
+      return null;
+    }
+    
+    return {
+      // 到文档顶部的距离
+      toDocumentTop: rect.top + scrollTop,
+      
+      // 到视口顶部的距离
+      toViewportTop: rect.top,
+      
+      // 元素自身信息
+      elementInfo: {
+        height: rect.height,
+        width: rect.width,
+        top: rect.top,
+        right: rect.right,
+        bottom: rect.bottom,
+        left: rect.left,
+        // 添加更多诊断信息
+        hasSize,
+        isVisible,
+        displayStyle: computedStyle.display,
+        positionStyle: computedStyle.position
+      },
+      
+      // 视口信息
+      viewportInfo: {
+        height: window.innerHeight,
+        width: window.innerWidth,
+        scrollTop: scrollTop
+      }
+    };
+  };
+  
+  // 添加一个延迟获取的方法，用于异步内容
+  const getDistancesWithDelay = (delay = 100) => {
+    return new Promise((resolve) => {
+      setTimeout(() => {
+        resolve(getAllDistances());
+      }, delay);
+    });
+  };
+  
+  return { 
+    getAllDistances,
+    getDistancesWithDelay 
+  };
+};