@shijiu/jsview-vue 2.3.0 → 2.3.728-alpha.0

package/utils/JsViewEngineWidget/TemplateParser/CommonMetroTemplate.ts

@@ -1,5 +1,5 @@
 import { Fence, GapInfo } from "./Fence";
-import { MetroTemplate, TemplateItem, MeasureInfo } from "./MetroTemplate"
+import { MetroTemplate, TemplateItem, MeasureInfo } from "./MetroTemplate";
 import { RangesModel, SingleRangeModel } from "../RangeModel";
 import { VERTICAL, HORIZONTAL, FocusMoveType } from "../WidgetCommon";
 
@@ -7,29 +7,29 @@ const TAG = "CommonTemplateParser";
 
 /** neighbor related interface  */
 interface Edge {
-  position: number,
-  range: RangesModel,
+  position: number;
+  range: RangesModel;
 }
 
 interface EdgeInfo {
-  index: number,
+  index: number;
   edgeObj: {
-    leftEdge: Edge | null,
-    rightEdge: Edge | null,
-    topEdge: Edge | null,
-    bottomEdge: Edge | null,
-  }
+    leftEdge: Edge | null;
+    rightEdge: Edge | null;
+    topEdge: Edge | null;
+    bottomEdge: Edge | null;
+  };
 }
 
 /** get visible list related interface */
 interface VisibleSearchConfigCommon {
-  resultStartIdx: number,
-  resultEndIdx: number,
-  enableBackwardSearching: boolean,
-  enableForwardSearching: boolean,
-  checkingStartLinePos: number,
-  checkingEndLinePos: number,
-};
+  resultStartIdx: number;
+  resultEndIdx: number;
+  enableBackwardSearching: boolean;
+  enableForwardSearching: boolean;
+  checkingStartLinePos: number;
+  checkingEndLinePos: number;
+}
 
 interface VisibleSearchConfig {
   searchDirect: number;
@@ -45,20 +45,45 @@ interface VisibleSearchConfig {
   firstEndLineBlockIdx: number;
   searchToBorder: boolean;
   common: VisibleSearchConfigCommon;
-};
+}
+
+function left(item: TemplateItem) {
+  return item.left;
+}
+function right(item: TemplateItem) {
+  return item.left + item.width - 1;
+}
+function top(item: TemplateItem) {
+  return item.top;
+}
+function bottom(item: TemplateItem) {
+  return item.top + item.height - 1;
+}
 
 class CommonMetroTemplate extends MetroTemplate {
   private _FenceStack: Array<Fence>;
-  private _FenceEdge: { StartX: number, StartY: number };
+  private _FenceEdge: { StartX: number; StartY: number };
   private _NotOccupiedEdgeList: Array<EdgeInfo>;
 
-  constructor(direction: Symbol, lineMax: number, pageSize: number,
-    layoutType: string, supportHistoryPath: boolean) {
-    super(direction, lineMax, pageSize, layoutType, supportHistoryPath);
+  constructor(
+    direction: Symbol,
+    lineMax: number,
+    pageSize: number,
+    layoutType: string,
+    supportHistoryPath: boolean,
+    errorLogger: Function
+  ) {
+    super(
+      direction,
+      lineMax,
+      pageSize,
+      layoutType,
+      supportHistoryPath,
+      errorLogger
+    );
     this._FenceStack = [new Fence(0, 0, this.lineMax, 0)];
     this._FenceEdge = { StartX: 0, StartY: 0 }; // 新的未占用边列表生成
     this._NotOccupiedEdgeList = []; // 未占用边列表
-
   }
 
   public calculateNeighborWhenAddStop(): void {
@@ -126,8 +151,11 @@ class CommonMetroTemplate extends MetroTemplate {
     return found;
   }
 
-
-  private _GetValidNeighborIndex(srcItemId: number, lastItemId: number, neighborDirection: string) {
+  private _GetValidNeighborIndex(
+    srcItemId: number,
+    lastItemId: number,
+    neighborDirection: string
+  ) {
     const templateList = this.templateList;
     let validId = -1;
     const item = templateList[lastItemId];
@@ -189,10 +217,9 @@ class CommonMetroTemplate extends MetroTemplate {
       (item.neighborIndexList as any)[direction].length > 0 &&
       !this._CheckIdsHasFocusable((item.neighborIndexList as any)[direction])
     ) {
-      const lastItemId =
-        (item.neighborIndexList as any)[direction][
+      const lastItemId = (item.neighborIndexList as any)[direction][
         (item.neighborIndexList as any)[direction].length - 1
-        ];
+      ];
       const idx = this._GetValidNeighborIndex(item.id, lastItemId, direction); // 查找其左右邻居
       if (idx !== -1) {
         (item.neighborIndexList as any)[direction] = []; // 清除无效项
@@ -202,7 +229,7 @@ class CommonMetroTemplate extends MetroTemplate {
   }
 
   public addItemInner(itemObj: MeasureInfo): TemplateItem {
-    const templateItem: any = MetroTemplate.getTemplateItem(itemObj);
+    const templateItem: any = this.getTemplateItem(itemObj);
     // Layout template items
     const fenceStack = this._FenceStack;
     const itemWidth = templateItem.width;
@@ -249,6 +276,7 @@ class CommonMetroTemplate extends MetroTemplate {
         itemKeyPos = gapInfo.GapStart;
         itemSecondPos = topFence.AheadOffset;
       } else {
+        this.errorLogger(TAG, "parse template error");
         throw new Error(
           `${TAG} item size ${itemWidth}x${itemHeight} is greater than widget line max ${this.lineMax}`
         );
@@ -291,8 +319,9 @@ class CommonMetroTemplate extends MetroTemplate {
         positionKey = "top";
         sizeKey = "height";
       }
-      const curPageStart =
-        (this.templateList as any)[curPageHeadIndex][positionKey];
+      const curPageStart = (this.templateList as any)[curPageHeadIndex][
+        positionKey
+      ];
       if (
         templateItem[positionKey] + templateItem[sizeKey] >
         curPageStart + this.pageSize
@@ -314,10 +343,14 @@ class CommonMetroTemplate extends MetroTemplate {
       let pre: number, cur: number;
       if (this.direction === VERTICAL) {
         cur = templateItem.height + templateItem.top;
-        pre = this.templateList[this.tailItemIndex].height + this.templateList[this.tailItemIndex].top;
+        pre =
+          this.templateList[this.tailItemIndex].height +
+          this.templateList[this.tailItemIndex].top;
       } else {
         cur = templateItem.width + templateItem.left;
-        pre = this.templateList[this.tailItemIndex].width + this.templateList[this.tailItemIndex].left;
+        pre =
+          this.templateList[this.tailItemIndex].width +
+          this.templateList[this.tailItemIndex].left;
       }
       if (cur >= pre) {
         this.tailItemIndex = templateItem.index;
@@ -393,8 +426,12 @@ class CommonMetroTemplate extends MetroTemplate {
   }
 
   /** get next item functions */
-  public getNextItem(baseId: number, vOffset: number,
-    hOffset: number, moveType: number): TemplateItem | null {
+  public getNextItem(
+    baseId: number,
+    vOffset: number,
+    hOffset: number,
+    moveType: number
+  ): TemplateItem | null {
     if (vOffset === 0 && hOffset === 0)
       console.log("GetNextItem(): offset is 0");
     // Forge.ThrowError("GetNextItem(): offset is 0");
@@ -422,11 +459,7 @@ class CommonMetroTemplate extends MetroTemplate {
 
     if (nextTemplateItem === null) {
       // 在次方向的焦点移动才会loop
-      if (
-        isVertical &&
-        moveType & FocusMoveType.ROW_LOOP &&
-        hOffset != 0
-      ) {
+      if (isVertical && moveType & FocusMoveType.ROW_LOOP && hOffset != 0) {
         nextTemplateItem = this._GetNextLoopItem(
           itemIndex,
           hOffset,
@@ -445,27 +478,157 @@ class CommonMetroTemplate extends MetroTemplate {
       }
     }
 
-    if (nextTemplateItem === null) {
-      // 临近行的焦点移动
-      if (
-        vOffset != 0 &&
-        moveType & FocusMoveType.ROW_FIND_NEAR
-      ) {
-        nextTemplateItem = this._GetNearLineItem(itemIndex, vOffset, true);
-      } else if (
-        hOffset != 0 &&
-        moveType & FocusMoveType.COLUMN_FIND_NEAR
-      ) {
-        nextTemplateItem = this._GetNearLineItem(itemIndex, hOffset, false);
+    if (vOffset != 0 && moveType & FocusMoveType.ROW_FIND_NEAR) {
+      let rowNear = this._GetDirectionNearItem(
+        itemIndex,
+        vOffset > 0 ? "bottom" : "top"
+      );
+      if (rowNear) {
+        nextTemplateItem = rowNear;
+      }
+    } else if (hOffset != 0 && moveType & FocusMoveType.COLUMN_FIND_NEAR) {
+      let colNear = this._GetDirectionNearItem(
+        itemIndex,
+        hOffset > 0 ? "right" : "left"
+      );
+      if (colNear) {
+        nextTemplateItem = colNear;
       }
     }
 
     return nextTemplateItem;
   }
 
+  private _GetDirectionNearItem(
+    index: number,
+    direction: string,
+    mustFocusable: boolean = true
+  ) {
+    const SEARCH_RANGE = 100;
+    let searchMin = Math.max(0, index - SEARCH_RANGE);
+    let searchMax = Math.min(
+      this.templateList.length - 1,
+      index + SEARCH_RANGE
+    );
+    let targetItem = this.templateList[index];
+    let tl = left(targetItem);
+    let tr = right(targetItem);
+    let tt = top(targetItem);
+    let tb = bottom(targetItem);
+    let info: {
+      item: TemplateItem | null;
+      minMainDistance: number;
+      minSubDistance: number;
+    } = {
+      item: null,
+      minMainDistance: -1,
+      minSubDistance: -1,
+    };
+    const compare = (
+      item: TemplateItem,
+      getMainDistance: (i: TemplateItem) => number,
+      getSubDistance: (i: TemplateItem) => number
+    ) => {
+      if (mustFocusable && !item.focusable) return;
+      const mainDistance = getMainDistance(item);
+      if (mainDistance <= 0) return;
+      const subDistance = getSubDistance(item);
+      if (info.minMainDistance < 0 || mainDistance < info.minMainDistance) {
+        info.minMainDistance = mainDistance;
+        info.minSubDistance = subDistance;
+        info.item = item;
+      } else if (
+        mainDistance === info.minMainDistance &&
+        subDistance < info.minSubDistance
+      ) {
+        info.minSubDistance = subDistance;
+        info.item = item;
+      }
+    };
+
+    for (let i = searchMin; i <= searchMax; i++) {
+      const item = this.templateList[i];
+      let il = left(item);
+      let ir = right(item);
+      let it = top(item);
+      let ib = bottom(item);
+      switch (direction) {
+        case "left":
+          compare(
+            item,
+            (item) => {
+              return tl - il;
+            },
+            (item) => {
+              return Math.min(
+                Math.abs(tt - it),
+                Math.abs(tb - ib),
+                Math.abs(tt - ib),
+                Math.abs(tb - it)
+              );
+            }
+          );
+          break;
+        case "right":
+          compare(
+            item,
+            (item) => {
+              return ir - tr;
+            },
+            (item) => {
+              return Math.min(
+                Math.abs(tt - it),
+                Math.abs(tb - ib),
+                Math.abs(tt - ib),
+                Math.abs(tb - it)
+              );
+            }
+          );
+          break;
+        case "top":
+          compare(
+            item,
+            (item) => {
+              return tt - it;
+            },
+            (item) => {
+              return Math.min(
+                Math.abs(tl - il),
+                Math.abs(tr - ir),
+                Math.abs(tl - ir),
+                Math.abs(tr - il)
+              );
+            }
+          );
+          break;
+        case "bottom":
+          compare(
+            item,
+            (item) => {
+              return ib - tb;
+            },
+            (item) => {
+              return Math.min(
+                Math.abs(tl - il),
+                Math.abs(tr - ir),
+                Math.abs(tl - ir),
+                Math.abs(tr - il)
+              );
+            }
+          );
+          break;
+      }
+    }
+    return info.item;
+  }
 
-  private getNextItemInner(index: number, offset: number,
-    vertical: boolean, useHistory: boolean, checkAnchor: number = -1): any {
+  private getNextItemInner(
+    index: number,
+    offset: number,
+    vertical: boolean,
+    useHistory: boolean,
+    checkAnchor: number = -1
+  ): any {
     const templateList: any = this.templateList;
     const baseItem = templateList[index];
     if (checkAnchor < 0) {
@@ -479,14 +642,14 @@ class CommonMetroTemplate extends MetroTemplate {
               checkAnchor =
                 baseItem.left +
                 baseItem.findNextAnchor.bottom *
-                (baseItem.width + baseItem.marginRight);
+                  (baseItem.width + baseItem.marginRight);
             }
           } else {
             if (baseItem.findNextAnchor.top) {
               checkAnchor =
                 baseItem.left +
                 baseItem.findNextAnchor.top *
-                (baseItem.width + baseItem.marginRight);
+                  (baseItem.width + baseItem.marginRight);
             }
           }
         } else {
@@ -495,14 +658,14 @@ class CommonMetroTemplate extends MetroTemplate {
               checkAnchor =
                 baseItem.top +
                 baseItem.findNextAnchor.right *
-                (baseItem.height + baseItem.marginBottom);
+                  (baseItem.height + baseItem.marginBottom);
             }
           } else {
             if (baseItem.findNextAnchor.left) {
               checkAnchor =
                 baseItem.top +
                 baseItem.findNextAnchor.left *
-                (baseItem.height + baseItem.marginBottom);
+                  (baseItem.height + baseItem.marginBottom);
             }
           }
         }
@@ -513,9 +676,15 @@ class CommonMetroTemplate extends MetroTemplate {
     } else {
       // checkAncher可能在baseItem的范围之外, 将其调整至自身范围内
       if (vertical) {
-        checkAnchor = Math.max(Math.min(checkAnchor, baseItem.left + baseItem.width - 1), baseItem.left)
+        checkAnchor = Math.max(
+          Math.min(checkAnchor, baseItem.left + baseItem.width - 1),
+          baseItem.left
+        );
       } else {
-        checkAnchor = Math.max(Math.min(checkAnchor, baseItem.top + baseItem.height - 1), baseItem.top)
+        checkAnchor = Math.max(
+          Math.min(checkAnchor, baseItem.top + baseItem.height - 1),
+          baseItem.top
+        );
       }
     }
 
@@ -572,8 +741,7 @@ class CommonMetroTemplate extends MetroTemplate {
           nextIndex = neighborList[i];
           const checkingItem = templateList[nextIndex];
           if (
-            checkAnchor <=
-            checkingItem[posKey] + checkingItem[sizeKey] - 1 &&
+            checkAnchor <= checkingItem[posKey] + checkingItem[sizeKey] - 1 &&
             checkAnchor >= checkingItem[posKey]
           ) {
             if (
@@ -583,8 +751,7 @@ class CommonMetroTemplate extends MetroTemplate {
             ) {
               // horizontal lastItemIndex bottom 不记历史路径
               templateList[index].pathHistory[direction] = nextIndex; // 更新历史路径
-              templateList[nextIndex].pathHistory[pathHistoryDirection] =
-                index; // 更新历史路径
+              templateList[nextIndex].pathHistory[pathHistoryDirection] = index; // 更新历史路径
             }
             found = true;
             break;
@@ -631,7 +798,13 @@ class CommonMetroTemplate extends MetroTemplate {
     if (found) {
       if (!templateList[nextIndex].focusable) {
         // 如果是占位符，则查找占位符的下一个
-        return this.getNextItemInner(nextIndex, offset, vertical, false, checkAnchor);
+        return this.getNextItemInner(
+          nextIndex,
+          offset,
+          vertical,
+          false,
+          checkAnchor
+        );
       }
       return templateList[nextIndex];
     }
@@ -652,7 +825,10 @@ class CommonMetroTemplate extends MetroTemplate {
     );
   }
 
-  private _GetNearestItem(targetItemIndex: number, itemIndexList: Array<number>) {
+  private _GetNearestItem(
+    targetItemIndex: number,
+    itemIndexList: Array<number>
+  ) {
     let nearestIndex = -1,
       minDistance = Number.POSITIVE_INFINITY;
     let targetItem = this.templateList[targetItemIndex];
@@ -666,7 +842,34 @@ class CommonMetroTemplate extends MetroTemplate {
     return nearestIndex;
   }
 
-  private _GetNextLoopItem(index: number, offset: number, isVertical: boolean): TemplateItem | null {
+  private _FindNearestByDirection(
+    itemIndexList: Array<number>,
+    direction: string
+  ) {
+    return itemIndexList.reduce((acc, cur) => {
+      const curItem = this.templateList[cur];
+      const accItem = this.templateList[acc];
+      if (direction == "left") {
+        return curItem.left < accItem.left ? cur : acc;
+      } else if (direction == "right") {
+        return curItem.left + curItem.width > accItem.left + accItem.width
+          ? cur
+          : acc;
+      } else if (direction == "top") {
+        return curItem.top < accItem.top ? cur : acc;
+      } else {
+        return curItem.top + curItem.height > accItem.top + accItem.height
+          ? cur
+          : acc;
+      }
+    }, itemIndexList[0]);
+  }
+
+  private _GetNextLoopItem(
+    index: number,
+    offset: number,
+    isVertical: boolean
+  ): TemplateItem | null {
     const templateList = this.templateList;
     const baseItem = templateList[index];
     let searchDirection = isVertical ? "right" : "bottom";
@@ -679,176 +882,108 @@ class CommonMetroTemplate extends MetroTemplate {
     let focusableTarget = -1;
     let startIndex = -1;
     let neighborList = [];
-    //寻找下一列的起始item
-    neighborList = this._GetTotalNeighbor(index, searchDirection);
-    while (startIndex < 0 && neighborList.length > 0) {
-      for (let i of neighborList) {
-        if (this._GetTotalNeighbor(i, startDirection).length > 0) {
-          startIndex = i;
-          break;
-        } else {
-          //TODO 是否要用递归
-          neighborList = this._GetTotalNeighbor(i, searchDirection);
-        }
+    //目前的算法针对规整的列表, 瀑布流这种不对齐, 以及列表中存在非focusable项, 行为不可控
+
+    let curIndex = index;
+    let nextLevelNeighborList = this._GetTotalNeighbor(
+      curIndex,
+      startDirection
+    );
+    while (!nextLevelNeighborList || nextLevelNeighborList.length == 0) {
+      //查询同级的邻居
+      const sameLevelList = this._GetTotalNeighbor(curIndex, searchDirection);
+      if (sameLevelList.length > 0) {
+        //找最边缘的同级邻居
+        const i = this._FindNearestByDirection(sameLevelList, startDirection);
+        nextLevelNeighborList = this._GetTotalNeighbor(i, startDirection);
+        curIndex = i;
+      } else {
+        //没有同级邻居, 返回null
+        return null;
       }
     }
-    if (startIndex >= 0) {
-      neighborList = this._GetTotalNeighbor(startIndex, startDirection);
-
-      //寻找最近的neighbor
-      let nearestIndex = -1,
-        minDistance = Number.POSITIVE_INFINITY;
-      for (let i of neighborList) {
-        const d = this._GetItemDistance(templateList[i], baseItem);
-        if (d < minDistance) {
-          nearestIndex = i;
-          minDistance = d;
-        }
-      }
 
-      neighborList = this._GetTotalNeighbor(nearestIndex, searchDirection);
-      while (neighborList.length > 0) {
-        targetIndex = this._GetNearestItem(nearestIndex, neighborList);
-        if (templateList[targetIndex].focusable) {
-          focusableTarget = targetIndex;
+    if (nextLevelNeighborList && nextLevelNeighborList.length > 0) {
+      for (let i of nextLevelNeighborList) {
+        const item = templateList[i];
+        if (item.focusable) {
+          focusableTarget = i;
+          startIndex = i;
+          break;
         }
-        neighborList = this._GetTotalNeighbor(targetIndex, searchDirection);
-      }
-      if (focusableTarget >= 0) {
-        return templateList[focusableTarget];
-      } else if (targetIndex >= 0) {
-        return this._GetNextLoopItem(targetIndex, offset, isVertical);
       }
-    }
-    return null;
-  }
-
-  //获取临近行的item
-  private _GetNearLineItem(index: number, offset: number, isVertical: boolean) {
-    const templateList = this.templateList;
-    let searchDirection = isVertical ? "right" : "bottom";
-    let startDirection = isVertical ? "top" : "left";
-    if (offset > 0) {
-      searchDirection = isVertical ? "left" : "top";
-      startDirection = isVertical ? "bottom" : "right";
-    }
-    let startIndex = -1;
-    let neighborList = [];
-    //寻找下一列的起始item
-    neighborList = this._GetTotalNeighbor(index, searchDirection);
-    while (startIndex < 0 && neighborList.length > 0) {
-      for (let i of neighborList) {
-        const n = this._GetTotalNeighbor(i, startDirection);
-        if (n.length > 0) {
-          return templateList[this._GetNearestItem(index, n)];
-        } else {
-          //TODO 是否要用递归
-          neighborList = this._GetTotalNeighbor(i, searchDirection);
+      neighborList = this._GetTotalNeighbor(startIndex, searchDirection);
+      while (neighborList.length > 0) {
+        for (let i of neighborList) {
+          const item = templateList[i];
+          if (item.focusable) {
+            focusableTarget = i;
+            break;
+          }
         }
+        neighborList = this._GetTotalNeighbor(focusableTarget, searchDirection);
       }
     }
-    return null;
+    return focusableTarget >= 0 ? templateList[focusableTarget] : null;
   }
 
-  public updateItemSize(index: number, newSize: { width: number, height: number }): void {
-    console.error(TAG, "updateItemSize is not supported.");
+  public updateItemSize(
+    index: number,
+    newSize: { width: number; height: number }
+  ): void {
+    this.errorLogger(TAG, "updateItemSize is not supported.");
   }
 
   static intersects(s0: number, e0: number, s1: number, e1: number): boolean {
     return s0 <= e1 && s1 <= e0;
   }
 
-  static iterCount = 0;
-
   /** get visible item list functions */
   public getVisibleItemList(
     visibleStart: number,
     visibleEnd: number,
-    baseId: number): [number, number] {
-    if (visibleStart > visibleEnd || this.templateList.length == 0) {
-      // No visible item
+    _baseId: number
+  ): [number, number] {
+    // _baseId 与抽象接口保持一致；可视判定改为主轴线性扫描，不再依赖邻居图连通性
+    if (visibleStart > visibleEnd || this.templateList.length === 0) {
       return [-1, -1];
     }
 
     visibleStart = Math.round(visibleStart);
     visibleEnd = Math.round(visibleEnd);
-    let searchBaseItemIdx = this.id2Index(baseId);
-    if (searchBaseItemIdx < 0) searchBaseItemIdx = 0;
     const vertical = this.direction === VERTICAL;
     const sizeKey = vertical ? "height" : "width";
-    const posKey = vertical ? "top" : "left"
-
-    const visible = (s: number, e: number) => {
-      return CommonMetroTemplate.intersects(visibleStart, visibleEnd, s, e);
-    }
-
-    let baseItem = this.templateList[searchBaseItemIdx];
-
-    //寻找首个在范围内的item
-    let startIndex = 0, endIndex = this.templateList.length - 1;
-
-    while (baseItem && !visible(baseItem[posKey], baseItem[posKey] + baseItem[sizeKey])) {
-      if (baseItem[posKey] < visibleStart) {
-        startIndex = baseItem.index;
-      } else {
-        endIndex = baseItem.index;
-      }
-      if (Math.abs(startIndex - endIndex) <= 1) {
-        const startItem = this.templateList[startIndex];
-        const endItem = this.templateList[endIndex];
-        if (visible(startItem[posKey], startItem[posKey] + startItem[sizeKey])) {
-          baseItem = startItem;
-          break;
-        } else if (visible(endItem[posKey], endItem[posKey] + endItem[sizeKey])) {
-          baseItem = endItem;
-          break;
-        } else {
-          const tailItem = this.templateList[this.getTailItemIndex()];
-          let tailInfo: any = null;
-          if (tailItem) {
-            tailInfo = {
-              left: tailItem.left,
-              top: tailItem.top,
-              width: tailItem.width,
-              height: tailItem.height,
-            }
-          }
-          console.log("MetroWidget: can not find visible item", visibleStart, visibleEnd, tailInfo);
-          return [-1, -1];
+    const posKey = vertical ? "top" : "left";
+
+    let minIdx = -1;
+    let maxIdx = -1;
+    const list = this.templateList;
+    for (let i = 0; i < list.length; i++) {
+      const item = list[i];
+      const s = item[posKey];
+      const e = s + item[sizeKey];
+      if (CommonMetroTemplate.intersects(visibleStart, visibleEnd, s, e)) {
+        const idx = item.index;
+        if (minIdx < 0 || idx < minIdx) {
+          minIdx = idx;
         }
-      } else {
-        baseItem = this.templateList[Math.round((startIndex + endIndex) / 2)];
-      }
-    }
-
-    CommonMetroTemplate.iterCount = 0;
-
-    let visibleItem: Set<number> = new Set();
-    visibleItem.add(baseItem.index);
-    const nKeys = ["left", "top", "bottom", "right"];
-    const addVisibleNeighbor = (targetItem: TemplateItem) => {
-      for (let key of nKeys) {
-        let n = this._GetTotalNeighbor(targetItem.index, key);
-        if (n && n.length > 0) {
-          for (let i of n) {
-            let item = this.templateList[i];
-            if (visible(item[posKey], item[posKey] + item[sizeKey]) && !visibleItem.has(i)) {
-              visibleItem.add(i);
-              addVisibleNeighbor(item);
-            }
-          }
+        if (maxIdx < 0 || idx > maxIdx) {
+          maxIdx = idx;
         }
       }
     }
-    addVisibleNeighbor(baseItem);
-    return [
-      Math.min(...visibleItem),
-      Math.max(...visibleItem),
-    ]
+
+    return minIdx >= 0 ? [minIdx, maxIdx] : [-1, -1];
   }
 
   /** neighbor calculate functions */
-  private _TryCalculateNeighborItem(index: number, xPos: number, yPos: number, width: number, height: number) {
+  private _TryCalculateNeighborItem(
+    index: number,
+    xPos: number,
+    yPos: number,
+    width: number,
+    height: number
+  ) {
     const curNotOccupiedEdge: EdgeInfo = {
       index,
       edgeObj: {
@@ -940,7 +1075,8 @@ class CommonMetroTemplate extends MetroTemplate {
         // 临时邻居不触发fence edge
         // 超过fenceedge范围，不作为对比相
         if (
-          !tmpNeighbor && crossEdgeObj.bottomEdge != null &&
+          !tmpNeighbor &&
+          crossEdgeObj.bottomEdge != null &&
           crossEdgeObj.bottomEdge.position > this._FenceEdge.StartY
         ) {
           continue;
@@ -955,7 +1091,8 @@ class CommonMetroTemplate extends MetroTemplate {
         // 临时邻居不触发fence edge
         // 超过fenceedge范围，不作为对比相
         if (
-          !tmpNeighbor && crossEdgeObj.rightEdge &&
+          !tmpNeighbor &&
+          crossEdgeObj.rightEdge &&
           crossEdgeObj.rightEdge.position > this._FenceEdge.StartX
         ) {
           continue;
@@ -980,18 +1117,17 @@ class CommonMetroTemplate extends MetroTemplate {
         //更新每个方向找到的邻居
         if (neighbor[key] !== -1) {
           const targetItem = this._NotOccupiedEdgeList[neighbor[key]];
-          this._TryUpdateItemNeighbor(
-            tmpNeighbor,
-            key,
-            crossItem,
-            targetItem
-          );
+          this._TryUpdateItemNeighbor(tmpNeighbor, key, crossItem, targetItem);
         }
       }
     }
   }
 
-  private _IfBlockedByOtherNeighbor(direction: string, crossItem: EdgeInfo, targetItem: EdgeInfo) {
+  private _IfBlockedByOtherNeighbor(
+    direction: string,
+    crossItem: EdgeInfo,
+    targetItem: EdgeInfo
+  ) {
     //检查是否被其他neighbor遮挡
     let positionKey = "top";
     let sizeKey = "height";
@@ -1020,8 +1156,7 @@ class CommonMetroTemplate extends MetroTemplate {
 
     let valid = true;
     if (crossTemplateItem && targetTemplateItem) {
-      const crossNeighborList =
-        crossTemplateItem.neighborIndexList[direction];
+      const crossNeighborList = crossTemplateItem.neighborIndexList[direction];
       const targetStart = targetTemplateItem[positionKey];
       const targetEnd = targetStart + targetTemplateItem[sizeKey] - 1;
       for (let i = crossNeighborList.length - 1; i >= 0; i--) {
@@ -1034,12 +1169,10 @@ class CommonMetroTemplate extends MetroTemplate {
         if (itemStart <= targetEnd && itemEnd >= targetStart) {
           //有重叠, 检查两个item那个离 cross item 更近
           if (
-            Math.abs(
-              item[subPositionKey] - crossTemplateItem[subPositionKey]
-            ) <
+            Math.abs(item[subPositionKey] - crossTemplateItem[subPositionKey]) <
             Math.abs(
               targetTemplateItem[subPositionKey] -
-              crossTemplateItem[subPositionKey]
+                crossTemplateItem[subPositionKey]
             )
           ) {
             //已有的neighbor更近
@@ -1055,7 +1188,11 @@ class CommonMetroTemplate extends MetroTemplate {
     return valid;
   }
 
-  private _CheckNeighborItemMatching(direction: string, crossItem: EdgeInfo, targetItem: EdgeInfo) {
+  private _CheckNeighborItemMatching(
+    direction: string,
+    crossItem: EdgeInfo,
+    targetItem: EdgeInfo
+  ) {
     const crossEdgeObj: any = crossItem.edgeObj;
     const targetEdgeObj: any = targetItem.edgeObj;
     let targetEdgeName = "rightEdge";
@@ -1093,14 +1230,11 @@ class CommonMetroTemplate extends MetroTemplate {
     //   targetEdgeObj[targetEdgeName].range.Clone().Ranges
     // );
 
-    const targetEdgeRangeClone =
-      targetEdgeObj[targetEdgeName].range.Clone();
+    const targetEdgeRangeClone = targetEdgeObj[targetEdgeName].range.Clone();
     targetEdgeObj[targetEdgeName].range.ExcludeRanges(
       crossEdgeObj[crossEdgeName].range
     );
-    crossEdgeObj[crossEdgeName].range.ExcludeRanges(
-      targetEdgeRangeClone
-    );
+    crossEdgeObj[crossEdgeName].range.ExcludeRanges(targetEdgeRangeClone);
 
     // console.log(
     //   "cchtest after exclude",
@@ -1138,15 +1272,10 @@ class CommonMetroTemplate extends MetroTemplate {
         continue;
       }
       // 左边最近项
-      if (
-        crossEdgeObj.leftEdge !== null &&
-        targetEdgeObj.rightEdge !== null
-      ) {
+      if (crossEdgeObj.leftEdge !== null && targetEdgeObj.rightEdge !== null) {
         if (
           crossEdgeObj.leftEdge.position >= targetEdgeObj.rightEdge.position &&
-          crossEdgeObj.leftEdge.range.IsInterAct(
-            targetEdgeObj.rightEdge.range
-          )
+          crossEdgeObj.leftEdge.range.IsInterAct(targetEdgeObj.rightEdge.range)
         ) {
           // 在其左侧，且有交叉，才为neighbor
           // 计算最短距离
@@ -1167,15 +1296,10 @@ class CommonMetroTemplate extends MetroTemplate {
         }
       }
       // 右边最近项
-      if (
-        crossEdgeObj.rightEdge !== null &&
-        targetEdgeObj.leftEdge !== null
-      ) {
+      if (crossEdgeObj.rightEdge !== null && targetEdgeObj.leftEdge !== null) {
         if (
           crossEdgeObj.rightEdge.position <= targetEdgeObj.leftEdge.position &&
-          crossEdgeObj.rightEdge.range.IsInterAct(
-            targetEdgeObj.leftEdge.range
-          )
+          crossEdgeObj.rightEdge.range.IsInterAct(targetEdgeObj.leftEdge.range)
         ) {
           // 在其左侧，且有交叉，才为neighbor
           // 计算最短距离
@@ -1197,15 +1321,10 @@ class CommonMetroTemplate extends MetroTemplate {
       }
 
       // 上边最近项
-      if (
-        crossEdgeObj.topEdge !== null &&
-        targetEdgeObj.bottomEdge !== null
-      ) {
+      if (crossEdgeObj.topEdge !== null && targetEdgeObj.bottomEdge !== null) {
         if (
           crossEdgeObj.topEdge.position >= targetEdgeObj.bottomEdge.position &&
-          crossEdgeObj.topEdge.range.IsInterAct(
-            targetEdgeObj.bottomEdge.range
-          )
+          crossEdgeObj.topEdge.range.IsInterAct(targetEdgeObj.bottomEdge.range)
         ) {
           // 在其左侧，且有交叉，才为neighbor
           // 计算最短距离
@@ -1226,15 +1345,10 @@ class CommonMetroTemplate extends MetroTemplate {
         }
       }
       // 下边的最近项
-      if (
-        crossEdgeObj.bottomEdge !== null &&
-        targetEdgeObj.topEdge !== null
-      ) {
+      if (crossEdgeObj.bottomEdge !== null && targetEdgeObj.topEdge !== null) {
         if (
           crossEdgeObj.bottomEdge.position <= targetEdgeObj.topEdge.position &&
-          crossEdgeObj.bottomEdge.range.IsInterAct(
-            targetEdgeObj.topEdge.range
-          )
+          crossEdgeObj.bottomEdge.range.IsInterAct(targetEdgeObj.topEdge.range)
         ) {
           // 在其左侧，且有交叉，才为neighbor
           // 计算最短距离
@@ -1264,7 +1378,12 @@ class CommonMetroTemplate extends MetroTemplate {
     };
   }
 
-  private _TryUpdateItemNeighbor(tmpNeighbor: boolean, direction: string, crossItem: EdgeInfo, targetItem: EdgeInfo) {
+  private _TryUpdateItemNeighbor(
+    tmpNeighbor: boolean,
+    direction: string,
+    crossItem: EdgeInfo,
+    targetItem: EdgeInfo
+  ) {
     const keyMap: any = {
       target: {
         left: "right",
@@ -1282,7 +1401,10 @@ class CommonMetroTemplate extends MetroTemplate {
     let crossNeighborKey = keyMap.cross[direction];
     let targetNeighborKey = keyMap.target[direction];
     if (!crossNeighborKey || !targetNeighborKey) {
-      console.error("_TryUpdateItemNeighbor: undefined direction", direction);
+      this.errorLogger(
+        "_TryUpdateItemNeighbor: undefined direction",
+        direction
+      );
     }
 
     const targetIndex = targetItem.index;
@@ -1295,24 +1417,72 @@ class CommonMetroTemplate extends MetroTemplate {
         templateList[targetIndex].neighborIndexList[targetNeighborKey].push(
           crossItemIndex
         );
-        templateList[crossItemIndex].neighborIndexList[
-          crossNeighborKey
-        ].push(targetIndex);
-        templateList[targetIndex].tmpNeighborIndexList[targetNeighborKey] =
+        templateList[crossItemIndex].neighborIndexList[crossNeighborKey].push(
+          targetIndex
+        );
+        templateList[targetIndex].tmpNeighborIndexList[targetNeighborKey] = [];
+        templateList[crossItemIndex].tmpNeighborIndexList[crossNeighborKey] =
           [];
-        templateList[crossItemIndex].tmpNeighborIndexList[
-          crossNeighborKey
-        ] = [];
       } else {
-        templateList[targetIndex].tmpNeighborIndexList[
-          targetNeighborKey
-        ].push(crossItemIndex);
+        templateList[targetIndex].tmpNeighborIndexList[targetNeighborKey].push(
+          crossItemIndex
+        );
         templateList[crossItemIndex].tmpNeighborIndexList[
           crossNeighborKey
         ].push(targetIndex);
       }
     }
   }
+
+  public removeItemTo(index: number): void {
+    if (index < 0 || index >= this.templateList.length) {
+      return;
+    }
+    this.templateList.splice(index);
+    //TODO 删除时需要计算fence和neighbor，这里通过一个新的对象重新计算来实现
+    const tmpMetroTemplate = new CommonMetroTemplate(
+      this.direction,
+      this.lineMax,
+      this.pageSize,
+      this.layoutType,
+      this.supportHistoryPath,
+      this.errorLogger
+    );
+    for (let i of this.templateList) {
+      tmpMetroTemplate.addItemInner(i);
+    }
+    tmpMetroTemplate.calculateNeighborWhenAddStop();
+
+    this._FenceStack = tmpMetroTemplate._FenceStack;
+    this._FenceEdge = tmpMetroTemplate._FenceEdge;
+    this._NotOccupiedEdgeList = tmpMetroTemplate._NotOccupiedEdgeList;
+    //更新邻居信息
+    for (let i of this.templateList) {
+      i.neighborIndexList =
+        tmpMetroTemplate.templateList[i.index].neighborIndexList;
+      i.tmpNeighborIndexList =
+        tmpMetroTemplate.templateList[i.index].tmpNeighborIndexList;
+      i.pathHistory.left =
+        i.pathHistory.left >= index ? -1 : i.pathHistory.left;
+      i.pathHistory.right =
+        i.pathHistory.right >= index ? -1 : i.pathHistory.right;
+      i.pathHistory.top = i.pathHistory.top >= index ? -1 : i.pathHistory.top;
+      i.pathHistory.bottom =
+        i.pathHistory.bottom >= index ? -1 : i.pathHistory.bottom;
+    }
+    //更新idsMap
+    for (let i = this.idsMap.length - 1; i >= 0; --i) {
+      if (this.idsMap[i] >= index) {
+        this.idsMap.splice(i, 1);
+      }
+    }
+    this.tailItemIndex = this.templateList.length - 1;
+    for (let uid in this.uidMap) {
+      if ((this.uidMap as any)[uid].index >= index) {
+        delete (this.uidMap as any)[uid];
+      }
+    }
+  }
 }
 
-export { CommonMetroTemplate };
+export { CommonMetroTemplate };