vue-devui 1.6.27 → 1.6.28

package/code-review/index.es.js

@@ -6816,34 +6816,144 @@ function findParentTrNode(node) {
 function getFullNumberList(min, max) {
   return Array.from({ length: max - min + 1 }, (_, i) => i + min);
 }
-function getLineNumbers(trNodes, outputFormat, side) {
+function clearCommentChecked(checkedTdNodes) {
+  for (let i = 0; i < checkedTdNodes.length; i++) {
+    checkedTdNodes[i].classList.remove("comment-checked");
+  }
+}
+function parseCodeToSingle(container, code, options) {
+  const diff2HtmlUi = new Diff2HtmlUI(container, code, {
+    drawFileList: false,
+    outputFormat: "line-by-line",
+    highlight: true,
+    rawTemplates: TemplateMap["line-by-line"],
+    ...options
+  });
+  diff2HtmlUi.draw();
+}
+function generateNumberTdObj(tdNodes) {
+  const lineNumber = parseInt(tdNodes[0].innerText) || -1;
+  if (lineNumber !== -1) {
+    return { [lineNumber]: tdNodes };
+  }
+}
+function getLineNumberTdMap(trNodes) {
+  const left = {};
+  const right = {};
+  for (let i = 0; i < trNodes.length; i++) {
+    const tdNodes = Array.from(trNodes[i].children);
+    Object.assign(left, generateNumberTdObj(tdNodes.slice(0, 2)));
+    Object.assign(right, generateNumberTdObj(tdNodes.slice(2)));
+  }
+  return { left, right };
+}
+function getLineNumberMap(trNodes) {
   var _a, _b;
-  const leftNumbers = [];
-  const rightNumbers = [];
+  const result = [];
   for (let i = 0; i < trNodes.length; i++) {
-    const itemTrNode = trNodes[i];
-    if (outputFormat === "line-by-line") {
-      const lineNumberTdNode = Array.from(itemTrNode.children)[0];
-      const leftLineNumber = parseInt((_a = lineNumberTdNode.children[0]) == null ? void 0 : _a.innerText);
-      const rightLineNumber = parseInt((_b = lineNumberTdNode.children[1]) == null ? void 0 : _b.innerText);
-      leftLineNumber && leftNumbers.push(leftLineNumber);
-      rightLineNumber && rightNumbers.push(rightLineNumber);
+    const lineNumberNodes = trNodes[i].children[0].children;
+    if (lineNumberNodes.length === 2) {
+      const left = parseInt((_a = lineNumberNodes[0]) == null ? void 0 : _a.innerText) || -1;
+      const right = parseInt((_b = lineNumberNodes[1]) == null ? void 0 : _b.innerText) || -1;
+      result.push({ left, right });
+    }
+  }
+  return result;
+}
+function getDoubleCheckedNumberAndCodes(checkedTdNodes) {
+  const lefts = [];
+  const rights = [];
+  const leftCode = [];
+  const rightCode = [];
+  const leftNumberNodes = [];
+  const rightNumberNodes = [];
+  for (let i = 0; i < checkedTdNodes.length; i++) {
+    const itemTdNode = checkedTdNodes[i];
+    if (itemTdNode.classList.contains("d-code-left")) {
+      if (itemTdNode.classList.contains("d2h-code-side-linenumber")) {
+        leftNumberNodes.push(itemTdNode);
+      } else {
+        leftCode.push(itemTdNode.innerText);
+      }
     } else {
-      const tdNodes = Array.from(itemTrNode.children);
-      const lineNumberTdNode = tdNodes[side === "left" ? 0 : 2];
-      if (lineNumberTdNode && notEmptyNode(lineNumberTdNode)) {
-        const lineNumber = parseInt(lineNumberTdNode.innerText);
-        if (lineNumber) {
-          side === "left" ? leftNumbers.push(lineNumber) : rightNumbers.push(lineNumber);
-        }
+      if (itemTdNode.classList.contains("d2h-code-side-linenumber")) {
+        rightNumberNodes.push(itemTdNode);
+      } else {
+        rightCode.push(itemTdNode.innerText);
       }
     }
   }
-  const lefts = leftNumbers.length ? getFullNumberList(leftNumbers[0], leftNumbers[leftNumbers.length - 1]) : leftNumbers;
-  const rights = rightNumbers.length ? getFullNumberList(rightNumbers[0], rightNumbers[rightNumbers.length - 1]) : rightNumbers;
-  return { lefts, rights };
+  if (leftNumberNodes.length) {
+    const leftMinNum = parseInt(leftNumberNodes[0].innerText);
+    const leftMaxNum = parseInt(leftNumberNodes[leftNumberNodes.length - 1].innerText);
+    lefts.push(...getFullNumberList(leftMinNum, leftMaxNum));
+  }
+  if (rightNumberNodes.length) {
+    const rightMinNum = parseInt(rightNumberNodes[0].innerText);
+    const rightMaxNum = parseInt(rightNumberNodes[rightNumberNodes.length - 1].innerText);
+    rights.push(...getFullNumberList(rightMinNum, rightMaxNum));
+  }
+  return { lefts, rights, codes: { leftCode, rightCode } };
+}
+function getSingleCheckedNumberAndCode(checkedTdNodes) {
+  const lefts = [];
+  const rights = [];
+  const codes = [];
+  const leftNumbers = [];
+  const rightNumbers = [];
+  for (let i = 0; i < checkedTdNodes.length; i++) {
+    const itemTdNode = checkedTdNodes[i];
+    if (itemTdNode.classList.contains("d2h-code-linenumber")) {
+      const numberChildren = itemTdNode.children;
+      const leftNum = parseInt(numberChildren[0].innerText);
+      const rightNum = parseInt(numberChildren[1].innerText);
+      !isNaN(leftNum) && leftNumbers.push(leftNum);
+      !isNaN(rightNum) && rightNumbers.push(rightNum);
+    } else {
+      codes.push(itemTdNode.innerText);
+    }
+  }
+  lefts.push(...getFullNumberList(leftNumbers[0], leftNumbers[leftNumbers.length - 1]));
+  rights.push(...getFullNumberList(rightNumbers[0], rightNumbers[rightNumbers.length - 1]));
+  return { lefts, rights, codes };
+}
+function addCommentCheckedForDouble(trNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum) {
+  const [leftNumTd, leftCodeTd, rightNumTd, rightCodeTd] = trNode.children;
+  const leftNum = parseInt(leftNumTd.innerText);
+  const rightNum = parseInt(rightNumTd.innerText);
+  const result = [];
+  if (!isNaN(leftNum) && leftNum >= leftMinNum && leftNum <= leftMaxNum) {
+    if (!leftNumTd.classList.contains("comment-checked")) {
+      leftNumTd.classList.add("comment-checked");
+      leftCodeTd.classList.add("comment-checked");
+    }
+    result.push(leftNumTd, leftCodeTd);
+  }
+  if (!isNaN(rightNum) && rightNum >= rightMinNum && rightNum <= rightMaxNum) {
+    if (!rightNumTd.classList.contains("comment-checked")) {
+      rightNumTd.classList.add("comment-checked");
+      rightCodeTd.classList.add("comment-checked");
+    }
+    result.push(rightNumTd, rightCodeTd);
+  }
+  return result;
 }
-function useCodeReviewExpand(reviewContentRef, props) {
+function addCommentCheckedForSingle(trNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum) {
+  const [numTd, codeTd] = trNode.children;
+  const [leftNumNode, rightNumNode] = numTd.children;
+  const leftNum = parseInt(leftNumNode.innerText);
+  const rightNum = parseInt(rightNumNode.innerText);
+  const result = [];
+  if (!isNaN(leftNum) && leftNum >= leftMinNum && leftNum <= leftMaxNum || !isNaN(rightNum) && rightNum >= rightMinNum && rightNum <= rightMaxNum) {
+    if (!numTd.classList.contains("comment-checked")) {
+      numTd.classList.add("comment-checked");
+      codeTd.classList.add("comment-checked");
+    }
+    result.push(numTd, codeTd);
+  }
+  return result;
+}
+function useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine) {
   const { outputFormat, expandThreshold, expandLoader } = toRefs(props);
   const processSideBySide = () => {
     var _a;
@@ -6903,7 +7013,9 @@ function useCodeReviewExpand(reviewContentRef, props) {
       return;
     }
     const trNodesToBeInserted = trNodes.filter((element) => element !== expandLine);
+    updateLineNumberMap(referenceDom.dataset, prefix + code, direction);
     insertIncrementLineToPage(referenceDom, trNodesToBeInserted, direction);
+    updateCheckedLine(referenceDom.dataset, direction);
     const removedExpandLine = ifRemoveExpandLineForDoubleColumn(referenceDom, expandLine, direction);
     if (removedExpandLine) {
       return;
@@ -6987,6 +7099,7 @@ function useCodeReviewExpand(reviewContentRef, props) {
     }
     const trNodesToBeInserted = trNodes.filter((element) => element.children[0].children.length === 2);
     insertIncrementLineToPage(referenceDom, trNodesToBeInserted, direction);
+    updateCheckedLine(referenceDom.dataset, direction);
     const removedExpandLine = ifRemoveExpandLine(referenceDom, expandLine, direction);
     if (removedExpandLine) {
       return;
@@ -7028,12 +7141,11 @@ function useCodeReviewExpand(reviewContentRef, props) {
   };
   return { insertExpandButton, onExpandButtonClick };
 }
-function useCodeReview(props, ctx) {
+function useCodeReview(props, ctx, reviewContentRef, updateLineNumberMap, updateCheckedLine) {
   const { diff, outputFormat, allowExpand, showBlob } = toRefs(props);
   const renderHtml = ref("");
-  const reviewContentRef = ref();
   const diffFile = ref([]);
-  const { insertExpandButton, onExpandButtonClick } = useCodeReviewExpand(reviewContentRef, props);
+  const { insertExpandButton, onExpandButtonClick } = useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine);
   const initDiffContent = () => {
     diffFile.value = Diff2Html.parse(diff.value);
     nextTick(() => {
@@ -7050,7 +7162,7 @@ function useCodeReview(props, ctx) {
   watch(showBlob, initDiffContent);
   watch(outputFormat, initDiffContent);
   watch(diff, initDiffContent, { immediate: true });
-  return { renderHtml, reviewContentRef, diffFile, onContentClick };
+  return { renderHtml, diffFile, onContentClick };
 }
 function useCodeReviewFold(props, ctx) {
   const { fold } = toRefs(props);
@@ -7075,38 +7187,52 @@ function useCodeReviewLineSelection(reviewContentRef, props, afterMouseup) {
   let dragging = false;
   let startTrNode;
   let trNodes;
-  let isClickedLeft;
+  let allTdNodes = [];
   let shouldClear;
   let isMouseMoved;
-  let checkedTrNodes = [];
+  let leftRightLineNumberArr = [];
+  let leftNumberTdMap = {};
+  let rightNumberTdMap = {};
+  let checkedTdNodes = [];
+  let startPosition;
+  let leftMinNum;
+  let leftMaxNum;
+  let rightMinNum;
+  let rightMaxNum;
   const onMousedown = (e) => {
+    var _a;
     if (e.button === 0) {
       const composedPath = e.composedPath();
       const lineNumberBox = composedPath.find(
         (item) => {
-          var _a, _b;
-          return ((_a = item.classList) == null ? void 0 : _a.contains("comment-icon-hover")) || ((_b = item.classList) == null ? void 0 : _b.contains("comment-icon"));
+          var _a2, _b;
+          return ((_a2 = item.classList) == null ? void 0 : _a2.contains("comment-icon-hover")) || ((_b = item.classList) == null ? void 0 : _b.contains("comment-icon"));
         }
       );
       trNodes = Array.from(reviewContentRef.value.querySelectorAll("tr")).filter((item) => {
-        var _a;
-        return !((_a = item.classList) == null ? void 0 : _a.contains("expand-line"));
+        var _a2;
+        return !((_a2 = item.classList) == null ? void 0 : _a2.contains("expand-line"));
       });
       if (!lineNumberBox) {
         return;
       }
       const parentTrNode = findParentTrNode(e.target);
-      if (parentTrNode && (parentTrNode == null ? void 0 : parentTrNode.classList.contains("expand-line"))) {
+      if (parentTrNode && ((_a = parentTrNode == null ? void 0 : parentTrNode.classList) == null ? void 0 : _a.contains("expand-line"))) {
         return;
       }
       startTrNode = parentTrNode;
+      allTdNodes = [];
+      for (let i = 0; i < trNodes.length; i++) {
+        allTdNodes.push(...trNodes[i].children);
+      }
       if (props.outputFormat === "side-by-side") {
-        isClickedLeft = composedPath.some((item) => {
-          var _a;
-          return (_a = item.classList) == null ? void 0 : _a.contains("d-code-left");
-        });
-      } else {
-        isClickedLeft = void 0;
+        const { left, right } = getLineNumberTdMap(trNodes);
+        leftNumberTdMap = left;
+        rightNumberTdMap = right;
+        startPosition = composedPath.some((item) => {
+          var _a2;
+          return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-left");
+        }) ? "left" : "right";
       }
       dragging = true;
       shouldClear = true;
@@ -7118,115 +7244,181 @@ function useCodeReviewLineSelection(reviewContentRef, props, afterMouseup) {
     }
   };
   function onMousemove(e) {
+    var _a, _b;
     if (!dragging) {
       return;
     }
-    isMouseMoved = true;
     if (shouldClear) {
-      clearCommentChecked();
+      clearCommentChecked(checkedTdNodes);
       shouldClear = false;
     }
     const composedPath = e.composedPath();
     const inReviewContent = composedPath.some((item) => {
-      var _a;
-      return (_a = item.classList) == null ? void 0 : _a.contains(ns2.e("content"));
+      var _a2;
+      return (_a2 = item.classList) == null ? void 0 : _a2.contains(ns2.e("content"));
     });
     if (!inReviewContent) {
       return;
     }
     const endTrNode = findParentTrNode(e.target);
+    let endPosition;
+    if (props.outputFormat === "side-by-side") {
+      if (composedPath.some((item) => {
+        var _a2;
+        return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-left");
+      })) {
+        endPosition = "left";
+      }
+      if (composedPath.some((item) => {
+        var _a2;
+        return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-right");
+      })) {
+        endPosition = "right";
+      }
+    }
     if (!endTrNode) {
       return;
     }
-    let startIndex = trNodes.indexOf(startTrNode);
-    let endIndex = trNodes.indexOf(endTrNode);
-    if (endIndex === -1) {
+    isMouseMoved = true;
+    const endTrChildren = endTrNode.children;
+    if (endPosition === "left" && isNaN(parseInt((_a = endTrChildren[0]) == null ? void 0 : _a.innerText)) || endPosition === "right" && isNaN(parseInt((_b = endTrChildren[2]) == null ? void 0 : _b.innerText))) {
       return;
     }
-    if (startIndex > endIndex) {
-      [startIndex, endIndex] = [endIndex, startIndex];
+    checkedTdNodes = [];
+    if (props.outputFormat === "line-by-line") {
+      let startIndex = trNodes.indexOf(startTrNode);
+      let endIndex = trNodes.indexOf(endTrNode);
+      if (endIndex === -1) {
+        return;
+      }
+      if (startIndex > endIndex) {
+        [startIndex, endIndex] = [endIndex, startIndex];
+      }
+      for (let i = 0; i < trNodes.length; i++) {
+        const tdNodes = Array.from(trNodes[i].children);
+        if (i >= startIndex && i <= endIndex) {
+          checkedTdNodes.push(...tdNodes);
+        }
+      }
     }
-    let position;
-    if (isClickedLeft === void 0) {
-      position = "all";
-    } else if (isClickedLeft) {
-      position = "left";
-    } else {
-      position = "right";
+    if (props.outputFormat === "side-by-side") {
+      const startNum = parseInt(startTrNode.children[startPosition === "left" ? 0 : 2].innerText);
+      let sIndex = leftRightLineNumberArr.findIndex((item) => item[startPosition] === startNum);
+      const endNum = parseInt(endTrNode.children[endPosition === "left" ? 0 : 2].innerText);
+      let eIndex = leftRightLineNumberArr.findIndex((item) => item[endPosition] === endNum);
+      if (sIndex > eIndex) {
+        [sIndex, eIndex] = [eIndex, sIndex];
+      }
+      const tempArr = leftRightLineNumberArr.slice(sIndex, eIndex + 1);
+      for (let i = 0; i < tempArr.length; i++) {
+        const { left, right } = tempArr[i];
+        if (left !== -1) {
+          checkedTdNodes.push(...leftNumberTdMap[left]);
+        }
+        if (right !== -1) {
+          checkedTdNodes.push(...rightNumberTdMap[right]);
+        }
+      }
     }
-    checkedTrNodes = [];
-    for (let i = 0; i < trNodes.length; i++) {
-      if (i >= startIndex && i <= endIndex) {
-        toggleCommentCheckedClass(trNodes[i], true, position);
-        checkedTrNodes.push(trNodes[i]);
+    for (let i = 0; i < allTdNodes.length; i++) {
+      if (checkedTdNodes.includes(allTdNodes[i])) {
+        allTdNodes[i].classList.add("comment-checked");
       } else {
-        toggleCommentCheckedClass(trNodes[i], false, position);
+        allTdNodes[i].classList.remove("comment-checked");
       }
     }
   }
   function onMouseup() {
     dragging = false;
     if (isMouseMoved) {
-      afterMouseup(getLineNumbers(checkedTrNodes, props.outputFormat, isClickedLeft ? "left" : "right"));
+      let details;
+      if (props.outputFormat === "side-by-side") {
+        details = getDoubleCheckedNumberAndCodes(checkedTdNodes);
+      } else {
+        details = getSingleCheckedNumberAndCode(checkedTdNodes);
+      }
+      leftMinNum = details.lefts[0];
+      leftMaxNum = details.lefts[details.lefts.length - 1];
+      rightMinNum = details.rights[0];
+      rightMaxNum = details.rights[details.rights.length - 1];
+      afterMouseup(details);
     }
     document.removeEventListener("mouseup", onMouseup);
     document.removeEventListener("mousemove", onMousemove);
   }
-  function clearCommentChecked() {
-    for (let i = 0; i < trNodes.length; i++) {
-      toggleCommentCheckedClass(trNodes[i], false, "all");
+  const getCheckedLineDetails = () => {
+    if (checkedTdNodes.length) {
+      return props.outputFormat === "side-by-side" ? getDoubleCheckedNumberAndCodes(checkedTdNodes) : getSingleCheckedNumberAndCode(checkedTdNodes);
     }
-  }
-  function toggleCommentCheckedClass(trNode, isAddClass, position) {
-    var _a;
-    const tdNodes = Array.from(trNode.children);
-    let toDoNodes;
-    if (position === "all") {
-      toDoNodes = tdNodes;
-    } else if (position === "left") {
-      toDoNodes = tdNodes.slice(0, 2);
+  };
+  const clearCommentClass = () => {
+    clearCommentChecked(checkedTdNodes);
+    checkedTdNodes = [];
+  };
+  const updateLineNumberMap = (expandLineNumberInfo, newCode, direction) => {
+    const container = document.createElement("div");
+    parseCodeToSingle(container, newCode, props.options);
+    const { prevL, prevR, nextL, nextR } = expandLineNumberInfo;
+    const arr = getLineNumberMap(Array.from(container.querySelectorAll("tr")));
+    if (direction === "down") {
+      const preLeft = Number(prevL) - 1;
+      const preRight = Number(prevR) - 1;
+      const index2 = leftRightLineNumberArr.findIndex((item) => item.left === preLeft && item.right === preRight);
+      leftRightLineNumberArr.splice(index2 + 1, 0, ...arr);
     } else {
-      toDoNodes = tdNodes.slice(2);
+      const nextLeft = Number(nextL) + 1;
+      const nextRight = Number(nextR) + 1;
+      const index2 = leftRightLineNumberArr.findIndex((item) => item.left === nextLeft && item.right === nextRight);
+      leftRightLineNumberArr.splice(index2, 0, ...arr);
     }
-    if ((position === "left" || position === "right") && isNaN(parseInt((_a = toDoNodes[0]) == null ? void 0 : _a.innerHTML))) {
+  };
+  const updateCheckedLine = (expandLineNumberInfo, direction) => {
+    const allTrNodes = Array.from(reviewContentRef.value.querySelectorAll("tr")).filter((item) => {
+      var _a;
+      return !((_a = item.classList) == null ? void 0 : _a.contains("expand-line"));
+    });
+    const { prevL, nextL } = expandLineNumberInfo;
+    const num = direction === "down" ? Number(prevL) : Number(nextL);
+    if (!checkedTdNodes.length || num < leftMinNum || num > leftMaxNum) {
       return;
     }
-    toDoNodes.forEach((item) => {
-      if (item.tagName === "TD") {
-        if (isAddClass) {
-          item.classList.add("comment-checked");
-        } else {
-          item.classList.remove("comment-checked");
-        }
+    checkedTdNodes = [];
+    for (let i = 0; i < allTrNodes.length; i++) {
+      const itemTrNode = allTrNodes[i];
+      if (props.outputFormat === "side-by-side") {
+        checkedTdNodes.push(...addCommentCheckedForDouble(itemTrNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum));
+      } else {
+        checkedTdNodes.push(...addCommentCheckedForSingle(itemTrNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum));
       }
-    });
-  }
-  return { onMousedown };
+    }
+  };
+  watch(
+    [() => props.outputFormat, () => props.allowChecked],
+    () => {
+      if (props.allowChecked && props.outputFormat === "side-by-side") {
+        const container = document.createElement("div");
+        parseCodeToSingle(container, props.diff, props.options);
+        leftRightLineNumberArr = getLineNumberMap(Array.from(container.querySelectorAll("tr")));
+      }
+    },
+    { immediate: true }
+  );
+  return { onMousedown, updateLineNumberMap, getCheckedLineDetails, clearCommentClass, updateCheckedLine };
 }
 function useCodeReviewComment(reviewContentRef, props, ctx) {
   const { outputFormat, allowComment, allowChecked } = toRefs(props);
   const ns2 = useNamespace("code-review");
-  const { onMousedown } = useCodeReviewLineSelection(reviewContentRef, props, afterMouseup);
+  const { onMousedown, updateLineNumberMap, getCheckedLineDetails, clearCommentClass, updateCheckedLine } = useCodeReviewLineSelection(
+    reviewContentRef,
+    props,
+    afterMouseup
+  );
   const commentLeft = ref(-100);
   const commentTop = ref(-100);
   let currentLeftLineNumber = -1;
   let currentRightLineNumber = -1;
+  let currentPosition;
   let lastLineNumberContainer;
-  let checkedLineNumberContainer = [];
-  let currentLeftLineNumbers = [];
-  let currentRightLineNumbers = [];
-  let checkedLineCodeString = {};
-  let allTrNodes = [];
-  let afterCheckLinesEmitData;
-  watch(
-    () => outputFormat.value,
-    () => {
-      checkedLineNumberContainer = [];
-      currentLeftLineNumbers = [];
-      currentRightLineNumbers = [];
-      checkedLineCodeString = [];
-    }
-  );
   const resetLeftTop = () => {
     commentLeft.value = -100;
     commentTop.value = -100;
@@ -7276,6 +7468,8 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
             commentLeft.value = left;
             commentTop.value = top;
             currentLeftLineNumber = parseInt(leftLineNumberContainer.innerText);
+            currentRightLineNumber = parseInt(rightLineNumberContainer.innerText || "-1");
+            currentPosition = "left";
           } else {
             resetLeftTop();
           }
@@ -7289,7 +7483,9 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
             const { top, left } = rightLineNumberContainer.getBoundingClientRect();
             commentLeft.value = left;
             commentTop.value = top;
+            currentLeftLineNumber = parseInt(leftLineNumberContainer.innerText || "-1");
             currentRightLineNumber = parseInt(rightLineNumberContainer.innerText);
+            currentPosition = "right";
           } else {
             resetLeftTop();
           }
@@ -7309,128 +7505,23 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
       resetLeftTop();
     }
   };
-  const getCommonClassAndJudge = () => {
-    const checkedLine = [currentLeftLineNumbers, currentRightLineNumbers];
-    return {
-      linenumberDom: allTrNodes,
-      checkedLine
-    };
-  };
-  const addCommentCheckedClass = (Dom) => {
-    !Dom.classList.contains("comment-checked") && Dom.classList.add("comment-checked");
-  };
-  function getSingleCheckedLineCode(shouldRenderClass) {
-    const { linenumberDom, checkedLine } = getCommonClassAndJudge();
-    const checkedCodeContent = [];
-    for (let i = 0; i < linenumberDom.length; i++) {
-      const lineNumberDomLeft = linenumberDom[i].children[0];
-      const lineNumberDomRight = linenumberDom[i].children[1];
-      if (lineNumberDomLeft || lineNumberDomRight) {
-        const codeLineNumberLeft = parseInt(lineNumberDomLeft == null ? void 0 : lineNumberDomLeft.innerText);
-        const codeLineNumberRight = parseInt(lineNumberDomRight == null ? void 0 : lineNumberDomRight.innerText);
-        if (checkedLine[0].includes(codeLineNumberLeft) || checkedLine[1].includes(codeLineNumberRight)) {
-          checkedLineNumberContainer.push(linenumberDom[i]);
-          const codeNode = linenumberDom[i].nextElementSibling;
-          checkedCodeContent.push(codeNode == null ? void 0 : codeNode.innerText);
-          if (shouldRenderClass) {
-            addCommentCheckedClass(linenumberDom[i]);
-            addCommentCheckedClass(codeNode);
-          }
-        }
-      }
-    }
-    checkedLineCodeString = checkedCodeContent;
-  }
-  function getDoubleCheckedLineCode(shouldRenderClass) {
-    var _a;
-    const { linenumberDom, checkedLine } = getCommonClassAndJudge();
-    const checkedCodeContentLeft = [];
-    const checkedCodeContentRight = [];
-    function checkedFunc(Dom) {
-      checkedLineNumberContainer.push(Dom);
-      const codeNode = Dom.nextElementSibling;
-      if (shouldRenderClass) {
-        addCommentCheckedClass(Dom);
-        addCommentCheckedClass(codeNode);
-      }
-      return codeNode == null ? void 0 : codeNode.innerText;
-    }
-    for (let i = 0; i < linenumberDom.length; i++) {
-      const codeLineNumber = parseInt((_a = linenumberDom[i]) == null ? void 0 : _a.innerHTML);
-      if (linenumberDom[i].classList.contains("d-code-left") && checkedLine[0].includes(codeLineNumber)) {
-        const lineNumText = checkedFunc(linenumberDom[i]);
-        checkedCodeContentLeft.push(lineNumText);
-        continue;
-      }
-      if (linenumberDom[i].classList.contains("d-code-right") && checkedLine[1].includes(codeLineNumber)) {
-        const lineNumText = checkedFunc(linenumberDom[i]);
-        checkedCodeContentRight.push(lineNumText);
-      }
-    }
-    checkedLineCodeString = { leftCode: checkedCodeContentLeft, rightCode: checkedCodeContentRight };
-  }
-  function getCheckedLineCode(shouldRenderClass) {
-    if (props.outputFormat === "line-by-line") {
-      return getSingleCheckedLineCode(shouldRenderClass);
-    }
-    getDoubleCheckedLineCode(shouldRenderClass);
-  }
-  function updateLineNumbers({ lefts, rights }) {
-    currentLeftLineNumbers = lefts;
-    currentRightLineNumbers = rights;
-    getCheckedLineCode(false);
-    afterCheckLinesEmitData = {
-      left: currentLeftLineNumber,
-      right: currentRightLineNumber,
-      details: {
-        lefts: currentLeftLineNumbers,
-        rights: currentRightLineNumbers,
-        codes: checkedLineCodeString
-      }
-    };
-  }
-  const updateCheckedLineClass = () => {
-    const lineClassName = props.outputFormat === "line-by-line" ? ".d2h-code-linenumber" : ".d2h-code-side-linenumber";
-    allTrNodes = reviewContentRef.value.querySelectorAll(lineClassName);
-    getCheckedLineCode(true);
-  };
-  const resetCommentClass = () => {
-    for (let i = 0; i < checkedLineNumberContainer.length; i++) {
-      checkedLineNumberContainer[i].classList.remove("comment-checked");
-      const codeNode = checkedLineNumberContainer[i].nextElementSibling;
-      codeNode == null ? void 0 : codeNode.classList.remove("comment-checked");
-    }
-    checkedLineNumberContainer = [];
-  };
   const commentClick = () => {
-    let obj = { left: currentLeftLineNumber, right: currentRightLineNumber };
-    if ((currentLeftLineNumbers.length >= 1 || currentRightLineNumbers.length >= 1) && allowChecked.value) {
-      const maxCurrentLeftLineNumber = currentLeftLineNumbers[currentLeftLineNumbers.length - 1];
-      const maxCurrentRightLineNumber = currentRightLineNumbers[currentRightLineNumbers.length - 1];
-      if (maxCurrentLeftLineNumber === currentLeftLineNumber || maxCurrentRightLineNumber === currentRightLineNumber) {
-        obj = {
-          left: currentLeftLineNumber,
-          right: currentRightLineNumber,
-          details: {
-            lefts: currentLeftLineNumbers,
-            rights: currentRightLineNumbers,
-            codes: checkedLineCodeString
-          }
-        };
+    let obj = { left: currentLeftLineNumber, right: currentRightLineNumber, position: currentPosition };
+    const checkedLineDetails = getCheckedLineDetails();
+    if (checkedLineDetails && allowChecked.value) {
+      const { lefts, rights } = checkedLineDetails;
+      const maxCheckedLeftLineNumber = lefts[lefts.length - 1];
+      const maxCheckedRightLineNumber = rights[rights.length - 1];
+      if (maxCheckedLeftLineNumber === currentLeftLineNumber || maxCheckedRightLineNumber === currentRightLineNumber) {
+        obj.details = checkedLineDetails;
       } else {
-        currentLeftLineNumbers = [];
-        currentRightLineNumbers = [];
-        resetCommentClass();
+        clearCommentClass();
       }
     }
     ctx.emit("addComment", obj);
   };
-  function afterCheckLines() {
-    ctx.emit("afterCheckLines", afterCheckLinesEmitData);
-  }
-  function afterMouseup(lineNumbers) {
-    updateLineNumbers(lineNumbers);
-    afterCheckLines();
+  function afterMouseup(details) {
+    ctx.emit("afterCheckLines", { left: currentLeftLineNumber, right: currentRightLineNumber, position: currentPosition, details });
   }
   const onCommentIconClick = (e) => {
     if (e) {
@@ -7486,15 +7577,7 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
     }
   };
   const clearCheckedLines = () => {
-    currentLeftLineNumbers = [];
-    currentRightLineNumbers = [];
-    checkedLineCodeString = [];
-    resetCommentClass();
-  };
-  const handleMouseDown = (e) => {
-    const lineClassName = props.outputFormat === "line-by-line" ? ".d2h-code-linenumber" : ".d2h-code-side-linenumber";
-    allTrNodes = reviewContentRef.value.querySelectorAll(lineClassName);
-    onMousedown(e);
+    clearCommentClass();
   };
   const mouseEvent = {};
   if (allowComment.value) {
@@ -7502,7 +7585,7 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
     mouseEvent.onMouseleave = onMouseleave;
   }
   if (props.allowChecked) {
-    mouseEvent.onMousedown = handleMouseDown;
+    mouseEvent.onMousedown = onMousedown;
   }
   window.addEventListener("scroll", resetLeftTop);
   onUnmounted(() => {
@@ -7512,12 +7595,13 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
     commentLeft,
     commentTop,
     mouseEvent,
-    updateCheckedLineClass,
     clearCheckedLines,
     onCommentMouseLeave,
     onCommentIconClick,
     insertComment,
-    removeComment
+    removeComment,
+    updateLineNumberMap,
+    updateCheckedLine
   };
 }
 var codeReview = "";
@@ -7530,16 +7614,7 @@ var CodeReview = defineComponent({
     const {
       diffType
     } = toRefs(props);
-    const {
-      renderHtml,
-      reviewContentRef,
-      diffFile,
-      onContentClick
-    } = useCodeReview(props, ctx);
-    const {
-      isFold,
-      toggleFold
-    } = useCodeReviewFold(props, ctx);
+    const reviewContentRef = ref();
     const {
       commentLeft,
       commentTop,
@@ -7548,15 +7623,24 @@ var CodeReview = defineComponent({
       onCommentIconClick,
       insertComment,
       removeComment,
-      updateCheckedLineClass,
-      clearCheckedLines
+      clearCheckedLines,
+      updateLineNumberMap,
+      updateCheckedLine
     } = useCodeReviewComment(reviewContentRef, props, ctx);
+    const {
+      renderHtml,
+      diffFile,
+      onContentClick
+    } = useCodeReview(props, ctx, reviewContentRef, updateLineNumberMap, updateCheckedLine);
+    const {
+      isFold,
+      toggleFold
+    } = useCodeReviewFold(props, ctx);
     onMounted(() => {
       ctx.emit("afterViewInit", {
         toggleFold,
         insertComment,
         removeComment,
-        updateCheckedLineClass,
         clearCheckedLines
       });
     });