vue-devui 1.6.26 → 1.6.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6816,34 +6816,144 @@ function findParentTrNode(node) {
6816
6816
  function getFullNumberList(min, max) {
6817
6817
  return Array.from({ length: max - min + 1 }, (_, i) => i + min);
6818
6818
  }
6819
- function getLineNumbers(trNodes, outputFormat, side) {
6819
+ function clearCommentChecked(checkedTdNodes) {
6820
+ for (let i = 0; i < checkedTdNodes.length; i++) {
6821
+ checkedTdNodes[i].classList.remove("comment-checked");
6822
+ }
6823
+ }
6824
+ function parseCodeToSingle(container, code, options) {
6825
+ const diff2HtmlUi = new Diff2HtmlUI(container, code, {
6826
+ drawFileList: false,
6827
+ outputFormat: "line-by-line",
6828
+ highlight: true,
6829
+ rawTemplates: TemplateMap["line-by-line"],
6830
+ ...options
6831
+ });
6832
+ diff2HtmlUi.draw();
6833
+ }
6834
+ function generateNumberTdObj(tdNodes) {
6835
+ const lineNumber = parseInt(tdNodes[0].innerText) || -1;
6836
+ if (lineNumber !== -1) {
6837
+ return { [lineNumber]: tdNodes };
6838
+ }
6839
+ }
6840
+ function getLineNumberTdMap(trNodes) {
6841
+ const left = {};
6842
+ const right = {};
6843
+ for (let i = 0; i < trNodes.length; i++) {
6844
+ const tdNodes = Array.from(trNodes[i].children);
6845
+ Object.assign(left, generateNumberTdObj(tdNodes.slice(0, 2)));
6846
+ Object.assign(right, generateNumberTdObj(tdNodes.slice(2)));
6847
+ }
6848
+ return { left, right };
6849
+ }
6850
+ function getLineNumberMap(trNodes) {
6820
6851
  var _a, _b;
6821
- const leftNumbers = [];
6822
- const rightNumbers = [];
6852
+ const result = [];
6823
6853
  for (let i = 0; i < trNodes.length; i++) {
6824
- const itemTrNode = trNodes[i];
6825
- if (outputFormat === "line-by-line") {
6826
- const lineNumberTdNode = Array.from(itemTrNode.children)[0];
6827
- const leftLineNumber = parseInt((_a = lineNumberTdNode.children[0]) == null ? void 0 : _a.innerText);
6828
- const rightLineNumber = parseInt((_b = lineNumberTdNode.children[1]) == null ? void 0 : _b.innerText);
6829
- leftLineNumber && leftNumbers.push(leftLineNumber);
6830
- rightLineNumber && rightNumbers.push(leftLineNumber);
6854
+ const lineNumberNodes = trNodes[i].children[0].children;
6855
+ if (lineNumberNodes.length === 2) {
6856
+ const left = parseInt((_a = lineNumberNodes[0]) == null ? void 0 : _a.innerText) || -1;
6857
+ const right = parseInt((_b = lineNumberNodes[1]) == null ? void 0 : _b.innerText) || -1;
6858
+ result.push({ left, right });
6859
+ }
6860
+ }
6861
+ return result;
6862
+ }
6863
+ function getDoubleCheckedNumberAndCodes(checkedTdNodes) {
6864
+ const lefts = [];
6865
+ const rights = [];
6866
+ const leftCode = [];
6867
+ const rightCode = [];
6868
+ const leftNumberNodes = [];
6869
+ const rightNumberNodes = [];
6870
+ for (let i = 0; i < checkedTdNodes.length; i++) {
6871
+ const itemTdNode = checkedTdNodes[i];
6872
+ if (itemTdNode.classList.contains("d-code-left")) {
6873
+ if (itemTdNode.classList.contains("d2h-code-side-linenumber")) {
6874
+ leftNumberNodes.push(itemTdNode);
6875
+ } else {
6876
+ leftCode.push(itemTdNode.innerText);
6877
+ }
6831
6878
  } else {
6832
- const tdNodes = Array.from(itemTrNode.children);
6833
- const lineNumberTdNode = tdNodes[side === "left" ? 0 : 2];
6834
- if (lineNumberTdNode && notEmptyNode(lineNumberTdNode)) {
6835
- const lineNumber = parseInt(lineNumberTdNode.innerText);
6836
- if (lineNumber) {
6837
- side === "left" ? leftNumbers.push(lineNumber) : rightNumbers.push(lineNumber);
6838
- }
6879
+ if (itemTdNode.classList.contains("d2h-code-side-linenumber")) {
6880
+ rightNumberNodes.push(itemTdNode);
6881
+ } else {
6882
+ rightCode.push(itemTdNode.innerText);
6839
6883
  }
6840
6884
  }
6841
6885
  }
6842
- const lefts = leftNumbers.length ? getFullNumberList(leftNumbers[0], leftNumbers[leftNumbers.length - 1]) : leftNumbers;
6843
- const rights = rightNumbers.length ? getFullNumberList(rightNumbers[0], rightNumbers[rightNumbers.length - 1]) : rightNumbers;
6844
- return { lefts, rights };
6886
+ if (leftNumberNodes.length) {
6887
+ const leftMinNum = parseInt(leftNumberNodes[0].innerText);
6888
+ const leftMaxNum = parseInt(leftNumberNodes[leftNumberNodes.length - 1].innerText);
6889
+ lefts.push(...getFullNumberList(leftMinNum, leftMaxNum));
6890
+ }
6891
+ if (rightNumberNodes.length) {
6892
+ const rightMinNum = parseInt(rightNumberNodes[0].innerText);
6893
+ const rightMaxNum = parseInt(rightNumberNodes[rightNumberNodes.length - 1].innerText);
6894
+ rights.push(...getFullNumberList(rightMinNum, rightMaxNum));
6895
+ }
6896
+ return { lefts, rights, codes: { leftCode, rightCode } };
6897
+ }
6898
+ function getSingleCheckedNumberAndCode(checkedTdNodes) {
6899
+ const lefts = [];
6900
+ const rights = [];
6901
+ const codes = [];
6902
+ const leftNumbers = [];
6903
+ const rightNumbers = [];
6904
+ for (let i = 0; i < checkedTdNodes.length; i++) {
6905
+ const itemTdNode = checkedTdNodes[i];
6906
+ if (itemTdNode.classList.contains("d2h-code-linenumber")) {
6907
+ const numberChildren = itemTdNode.children;
6908
+ const leftNum = parseInt(numberChildren[0].innerText);
6909
+ const rightNum = parseInt(numberChildren[1].innerText);
6910
+ !isNaN(leftNum) && leftNumbers.push(leftNum);
6911
+ !isNaN(rightNum) && rightNumbers.push(rightNum);
6912
+ } else {
6913
+ codes.push(itemTdNode.innerText);
6914
+ }
6915
+ }
6916
+ lefts.push(...getFullNumberList(leftNumbers[0], leftNumbers[leftNumbers.length - 1]));
6917
+ rights.push(...getFullNumberList(rightNumbers[0], rightNumbers[rightNumbers.length - 1]));
6918
+ return { lefts, rights, codes };
6919
+ }
6920
+ function addCommentCheckedForDouble(trNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum) {
6921
+ const [leftNumTd, leftCodeTd, rightNumTd, rightCodeTd] = trNode.children;
6922
+ const leftNum = parseInt(leftNumTd.innerText);
6923
+ const rightNum = parseInt(rightNumTd.innerText);
6924
+ const result = [];
6925
+ if (!isNaN(leftNum) && leftNum >= leftMinNum && leftNum <= leftMaxNum) {
6926
+ if (!leftNumTd.classList.contains("comment-checked")) {
6927
+ leftNumTd.classList.add("comment-checked");
6928
+ leftCodeTd.classList.add("comment-checked");
6929
+ }
6930
+ result.push(leftNumTd, leftCodeTd);
6931
+ }
6932
+ if (!isNaN(rightNum) && rightNum >= rightMinNum && rightNum <= rightMaxNum) {
6933
+ if (!rightNumTd.classList.contains("comment-checked")) {
6934
+ rightNumTd.classList.add("comment-checked");
6935
+ rightCodeTd.classList.add("comment-checked");
6936
+ }
6937
+ result.push(rightNumTd, rightCodeTd);
6938
+ }
6939
+ return result;
6845
6940
  }
6846
- function useCodeReviewExpand(reviewContentRef, props) {
6941
+ function addCommentCheckedForSingle(trNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum) {
6942
+ const [numTd, codeTd] = trNode.children;
6943
+ const [leftNumNode, rightNumNode] = numTd.children;
6944
+ const leftNum = parseInt(leftNumNode.innerText);
6945
+ const rightNum = parseInt(rightNumNode.innerText);
6946
+ const result = [];
6947
+ if (!isNaN(leftNum) && leftNum >= leftMinNum && leftNum <= leftMaxNum || !isNaN(rightNum) && rightNum >= rightMinNum && rightNum <= rightMaxNum) {
6948
+ if (!numTd.classList.contains("comment-checked")) {
6949
+ numTd.classList.add("comment-checked");
6950
+ codeTd.classList.add("comment-checked");
6951
+ }
6952
+ result.push(numTd, codeTd);
6953
+ }
6954
+ return result;
6955
+ }
6956
+ function useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine) {
6847
6957
  const { outputFormat, expandThreshold, expandLoader } = toRefs(props);
6848
6958
  const processSideBySide = () => {
6849
6959
  var _a;
@@ -6903,7 +7013,9 @@ function useCodeReviewExpand(reviewContentRef, props) {
6903
7013
  return;
6904
7014
  }
6905
7015
  const trNodesToBeInserted = trNodes.filter((element) => element !== expandLine);
7016
+ updateLineNumberMap(referenceDom.dataset, prefix + code, direction);
6906
7017
  insertIncrementLineToPage(referenceDom, trNodesToBeInserted, direction);
7018
+ updateCheckedLine(referenceDom.dataset, direction);
6907
7019
  const removedExpandLine = ifRemoveExpandLineForDoubleColumn(referenceDom, expandLine, direction);
6908
7020
  if (removedExpandLine) {
6909
7021
  return;
@@ -6987,6 +7099,7 @@ function useCodeReviewExpand(reviewContentRef, props) {
6987
7099
  }
6988
7100
  const trNodesToBeInserted = trNodes.filter((element) => element.children[0].children.length === 2);
6989
7101
  insertIncrementLineToPage(referenceDom, trNodesToBeInserted, direction);
7102
+ updateCheckedLine(referenceDom.dataset, direction);
6990
7103
  const removedExpandLine = ifRemoveExpandLine(referenceDom, expandLine, direction);
6991
7104
  if (removedExpandLine) {
6992
7105
  return;
@@ -7028,12 +7141,11 @@ function useCodeReviewExpand(reviewContentRef, props) {
7028
7141
  };
7029
7142
  return { insertExpandButton, onExpandButtonClick };
7030
7143
  }
7031
- function useCodeReview(props, ctx) {
7144
+ function useCodeReview(props, ctx, reviewContentRef, updateLineNumberMap, updateCheckedLine) {
7032
7145
  const { diff, outputFormat, allowExpand, showBlob } = toRefs(props);
7033
7146
  const renderHtml = ref("");
7034
- const reviewContentRef = ref();
7035
7147
  const diffFile = ref([]);
7036
- const { insertExpandButton, onExpandButtonClick } = useCodeReviewExpand(reviewContentRef, props);
7148
+ const { insertExpandButton, onExpandButtonClick } = useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine);
7037
7149
  const initDiffContent = () => {
7038
7150
  diffFile.value = Diff2Html.parse(diff.value);
7039
7151
  nextTick(() => {
@@ -7050,7 +7162,7 @@ function useCodeReview(props, ctx) {
7050
7162
  watch(showBlob, initDiffContent);
7051
7163
  watch(outputFormat, initDiffContent);
7052
7164
  watch(diff, initDiffContent, { immediate: true });
7053
- return { renderHtml, reviewContentRef, diffFile, onContentClick };
7165
+ return { renderHtml, diffFile, onContentClick };
7054
7166
  }
7055
7167
  function useCodeReviewFold(props, ctx) {
7056
7168
  const { fold } = toRefs(props);
@@ -7075,38 +7187,52 @@ function useCodeReviewLineSelection(reviewContentRef, props, afterMouseup) {
7075
7187
  let dragging = false;
7076
7188
  let startTrNode;
7077
7189
  let trNodes;
7078
- let isClickedLeft;
7190
+ let allTdNodes = [];
7079
7191
  let shouldClear;
7080
7192
  let isMouseMoved;
7081
- let checkedTrNodes = [];
7193
+ let leftRightLineNumberArr = [];
7194
+ let leftNumberTdMap = {};
7195
+ let rightNumberTdMap = {};
7196
+ let checkedTdNodes = [];
7197
+ let startPosition;
7198
+ let leftMinNum;
7199
+ let leftMaxNum;
7200
+ let rightMinNum;
7201
+ let rightMaxNum;
7082
7202
  const onMousedown = (e) => {
7203
+ var _a;
7083
7204
  if (e.button === 0) {
7084
7205
  const composedPath = e.composedPath();
7085
7206
  const lineNumberBox = composedPath.find(
7086
7207
  (item) => {
7087
- var _a, _b;
7088
- return ((_a = item.classList) == null ? void 0 : _a.contains("comment-icon-hover")) || ((_b = item.classList) == null ? void 0 : _b.contains("comment-icon"));
7208
+ var _a2, _b;
7209
+ return ((_a2 = item.classList) == null ? void 0 : _a2.contains("comment-icon-hover")) || ((_b = item.classList) == null ? void 0 : _b.contains("comment-icon"));
7089
7210
  }
7090
7211
  );
7091
7212
  trNodes = Array.from(reviewContentRef.value.querySelectorAll("tr")).filter((item) => {
7092
- var _a;
7093
- return !((_a = item.classList) == null ? void 0 : _a.contains("expand-line"));
7213
+ var _a2;
7214
+ return !((_a2 = item.classList) == null ? void 0 : _a2.contains("expand-line"));
7094
7215
  });
7095
7216
  if (!lineNumberBox) {
7096
7217
  return;
7097
7218
  }
7098
7219
  const parentTrNode = findParentTrNode(e.target);
7099
- if (parentTrNode && (parentTrNode == null ? void 0 : parentTrNode.classList.contains("expand-line"))) {
7220
+ if (parentTrNode && ((_a = parentTrNode == null ? void 0 : parentTrNode.classList) == null ? void 0 : _a.contains("expand-line"))) {
7100
7221
  return;
7101
7222
  }
7102
7223
  startTrNode = parentTrNode;
7224
+ allTdNodes = [];
7225
+ for (let i = 0; i < trNodes.length; i++) {
7226
+ allTdNodes.push(...trNodes[i].children);
7227
+ }
7103
7228
  if (props.outputFormat === "side-by-side") {
7104
- isClickedLeft = composedPath.some((item) => {
7105
- var _a;
7106
- return (_a = item.classList) == null ? void 0 : _a.contains("d-code-left");
7107
- });
7108
- } else {
7109
- isClickedLeft = void 0;
7229
+ const { left, right } = getLineNumberTdMap(trNodes);
7230
+ leftNumberTdMap = left;
7231
+ rightNumberTdMap = right;
7232
+ startPosition = composedPath.some((item) => {
7233
+ var _a2;
7234
+ return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-left");
7235
+ }) ? "left" : "right";
7110
7236
  }
7111
7237
  dragging = true;
7112
7238
  shouldClear = true;
@@ -7118,115 +7244,181 @@ function useCodeReviewLineSelection(reviewContentRef, props, afterMouseup) {
7118
7244
  }
7119
7245
  };
7120
7246
  function onMousemove(e) {
7247
+ var _a, _b;
7121
7248
  if (!dragging) {
7122
7249
  return;
7123
7250
  }
7124
- isMouseMoved = true;
7125
7251
  if (shouldClear) {
7126
- clearCommentChecked();
7252
+ clearCommentChecked(checkedTdNodes);
7127
7253
  shouldClear = false;
7128
7254
  }
7129
7255
  const composedPath = e.composedPath();
7130
7256
  const inReviewContent = composedPath.some((item) => {
7131
- var _a;
7132
- return (_a = item.classList) == null ? void 0 : _a.contains(ns2.e("content"));
7257
+ var _a2;
7258
+ return (_a2 = item.classList) == null ? void 0 : _a2.contains(ns2.e("content"));
7133
7259
  });
7134
7260
  if (!inReviewContent) {
7135
7261
  return;
7136
7262
  }
7137
7263
  const endTrNode = findParentTrNode(e.target);
7264
+ let endPosition;
7265
+ if (props.outputFormat === "side-by-side") {
7266
+ if (composedPath.some((item) => {
7267
+ var _a2;
7268
+ return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-left");
7269
+ })) {
7270
+ endPosition = "left";
7271
+ }
7272
+ if (composedPath.some((item) => {
7273
+ var _a2;
7274
+ return (_a2 = item.classList) == null ? void 0 : _a2.contains("d-code-right");
7275
+ })) {
7276
+ endPosition = "right";
7277
+ }
7278
+ }
7138
7279
  if (!endTrNode) {
7139
7280
  return;
7140
7281
  }
7141
- let startIndex = trNodes.indexOf(startTrNode);
7142
- let endIndex = trNodes.indexOf(endTrNode);
7143
- if (endIndex === -1) {
7282
+ isMouseMoved = true;
7283
+ const endTrChildren = endTrNode.children;
7284
+ 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))) {
7144
7285
  return;
7145
7286
  }
7146
- if (startIndex > endIndex) {
7147
- [startIndex, endIndex] = [endIndex, startIndex];
7287
+ checkedTdNodes = [];
7288
+ if (props.outputFormat === "line-by-line") {
7289
+ let startIndex = trNodes.indexOf(startTrNode);
7290
+ let endIndex = trNodes.indexOf(endTrNode);
7291
+ if (endIndex === -1) {
7292
+ return;
7293
+ }
7294
+ if (startIndex > endIndex) {
7295
+ [startIndex, endIndex] = [endIndex, startIndex];
7296
+ }
7297
+ for (let i = 0; i < trNodes.length; i++) {
7298
+ const tdNodes = Array.from(trNodes[i].children);
7299
+ if (i >= startIndex && i <= endIndex) {
7300
+ checkedTdNodes.push(...tdNodes);
7301
+ }
7302
+ }
7148
7303
  }
7149
- let position;
7150
- if (isClickedLeft === void 0) {
7151
- position = "all";
7152
- } else if (isClickedLeft) {
7153
- position = "left";
7154
- } else {
7155
- position = "right";
7304
+ if (props.outputFormat === "side-by-side") {
7305
+ const startNum = parseInt(startTrNode.children[startPosition === "left" ? 0 : 2].innerText);
7306
+ let sIndex = leftRightLineNumberArr.findIndex((item) => item[startPosition] === startNum);
7307
+ const endNum = parseInt(endTrNode.children[endPosition === "left" ? 0 : 2].innerText);
7308
+ let eIndex = leftRightLineNumberArr.findIndex((item) => item[endPosition] === endNum);
7309
+ if (sIndex > eIndex) {
7310
+ [sIndex, eIndex] = [eIndex, sIndex];
7311
+ }
7312
+ const tempArr = leftRightLineNumberArr.slice(sIndex, eIndex + 1);
7313
+ for (let i = 0; i < tempArr.length; i++) {
7314
+ const { left, right } = tempArr[i];
7315
+ if (left !== -1) {
7316
+ checkedTdNodes.push(...leftNumberTdMap[left]);
7317
+ }
7318
+ if (right !== -1) {
7319
+ checkedTdNodes.push(...rightNumberTdMap[right]);
7320
+ }
7321
+ }
7156
7322
  }
7157
- checkedTrNodes = [];
7158
- for (let i = 0; i < trNodes.length; i++) {
7159
- if (i >= startIndex && i <= endIndex) {
7160
- toggleCommentCheckedClass(trNodes[i], true, position);
7161
- checkedTrNodes.push(trNodes[i]);
7323
+ for (let i = 0; i < allTdNodes.length; i++) {
7324
+ if (checkedTdNodes.includes(allTdNodes[i])) {
7325
+ allTdNodes[i].classList.add("comment-checked");
7162
7326
  } else {
7163
- toggleCommentCheckedClass(trNodes[i], false, position);
7327
+ allTdNodes[i].classList.remove("comment-checked");
7164
7328
  }
7165
7329
  }
7166
7330
  }
7167
7331
  function onMouseup() {
7168
7332
  dragging = false;
7169
7333
  if (isMouseMoved) {
7170
- afterMouseup(getLineNumbers(checkedTrNodes, props.outputFormat, isClickedLeft ? "left" : "right"));
7334
+ let details;
7335
+ if (props.outputFormat === "side-by-side") {
7336
+ details = getDoubleCheckedNumberAndCodes(checkedTdNodes);
7337
+ } else {
7338
+ details = getSingleCheckedNumberAndCode(checkedTdNodes);
7339
+ }
7340
+ leftMinNum = details.lefts[0];
7341
+ leftMaxNum = details.lefts[details.lefts.length - 1];
7342
+ rightMinNum = details.rights[0];
7343
+ rightMaxNum = details.rights[details.rights.length - 1];
7344
+ afterMouseup(details);
7171
7345
  }
7172
7346
  document.removeEventListener("mouseup", onMouseup);
7173
7347
  document.removeEventListener("mousemove", onMousemove);
7174
7348
  }
7175
- function clearCommentChecked() {
7176
- for (let i = 0; i < trNodes.length; i++) {
7177
- toggleCommentCheckedClass(trNodes[i], false, "all");
7349
+ const getCheckedLineDetails = () => {
7350
+ if (checkedTdNodes.length) {
7351
+ return props.outputFormat === "side-by-side" ? getDoubleCheckedNumberAndCodes(checkedTdNodes) : getSingleCheckedNumberAndCode(checkedTdNodes);
7178
7352
  }
7179
- }
7180
- function toggleCommentCheckedClass(trNode, isAddClass, position) {
7181
- var _a;
7182
- const tdNodes = Array.from(trNode.children);
7183
- let toDoNodes;
7184
- if (position === "all") {
7185
- toDoNodes = tdNodes;
7186
- } else if (position === "left") {
7187
- toDoNodes = tdNodes.slice(0, 2);
7353
+ };
7354
+ const clearCommentClass = () => {
7355
+ clearCommentChecked(checkedTdNodes);
7356
+ checkedTdNodes = [];
7357
+ };
7358
+ const updateLineNumberMap = (expandLineNumberInfo, newCode, direction) => {
7359
+ const container = document.createElement("div");
7360
+ parseCodeToSingle(container, newCode, props.options);
7361
+ const { prevL, prevR, nextL, nextR } = expandLineNumberInfo;
7362
+ const arr = getLineNumberMap(Array.from(container.querySelectorAll("tr")));
7363
+ if (direction === "down") {
7364
+ const preLeft = Number(prevL) - 1;
7365
+ const preRight = Number(prevR) - 1;
7366
+ const index2 = leftRightLineNumberArr.findIndex((item) => item.left === preLeft && item.right === preRight);
7367
+ leftRightLineNumberArr.splice(index2 + 1, 0, ...arr);
7188
7368
  } else {
7189
- toDoNodes = tdNodes.slice(2);
7369
+ const nextLeft = Number(nextL) + 1;
7370
+ const nextRight = Number(nextR) + 1;
7371
+ const index2 = leftRightLineNumberArr.findIndex((item) => item.left === nextLeft && item.right === nextRight);
7372
+ leftRightLineNumberArr.splice(index2, 0, ...arr);
7190
7373
  }
7191
- if ((position === "left" || position === "right") && isNaN(parseInt((_a = toDoNodes[0]) == null ? void 0 : _a.innerHTML))) {
7374
+ };
7375
+ const updateCheckedLine = (expandLineNumberInfo, direction) => {
7376
+ const allTrNodes = Array.from(reviewContentRef.value.querySelectorAll("tr")).filter((item) => {
7377
+ var _a;
7378
+ return !((_a = item.classList) == null ? void 0 : _a.contains("expand-line"));
7379
+ });
7380
+ const { prevL, nextL } = expandLineNumberInfo;
7381
+ const num = direction === "down" ? Number(prevL) : Number(nextL);
7382
+ if (!checkedTdNodes.length || num < leftMinNum || num > leftMaxNum) {
7192
7383
  return;
7193
7384
  }
7194
- toDoNodes.forEach((item) => {
7195
- if (item.tagName === "TD") {
7196
- if (isAddClass) {
7197
- item.classList.add("comment-checked");
7198
- } else {
7199
- item.classList.remove("comment-checked");
7200
- }
7385
+ checkedTdNodes = [];
7386
+ for (let i = 0; i < allTrNodes.length; i++) {
7387
+ const itemTrNode = allTrNodes[i];
7388
+ if (props.outputFormat === "side-by-side") {
7389
+ checkedTdNodes.push(...addCommentCheckedForDouble(itemTrNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum));
7390
+ } else {
7391
+ checkedTdNodes.push(...addCommentCheckedForSingle(itemTrNode, leftMinNum, leftMaxNum, rightMinNum, rightMaxNum));
7201
7392
  }
7202
- });
7203
- }
7204
- return { onMousedown };
7393
+ }
7394
+ };
7395
+ watch(
7396
+ [() => props.outputFormat, () => props.allowChecked],
7397
+ () => {
7398
+ if (props.allowChecked && props.outputFormat === "side-by-side") {
7399
+ const container = document.createElement("div");
7400
+ parseCodeToSingle(container, props.diff, props.options);
7401
+ leftRightLineNumberArr = getLineNumberMap(Array.from(container.querySelectorAll("tr")));
7402
+ }
7403
+ },
7404
+ { immediate: true }
7405
+ );
7406
+ return { onMousedown, updateLineNumberMap, getCheckedLineDetails, clearCommentClass, updateCheckedLine };
7205
7407
  }
7206
7408
  function useCodeReviewComment(reviewContentRef, props, ctx) {
7207
7409
  const { outputFormat, allowComment, allowChecked } = toRefs(props);
7208
7410
  const ns2 = useNamespace("code-review");
7209
- const { onMousedown } = useCodeReviewLineSelection(reviewContentRef, props, afterMouseup);
7411
+ const { onMousedown, updateLineNumberMap, getCheckedLineDetails, clearCommentClass, updateCheckedLine } = useCodeReviewLineSelection(
7412
+ reviewContentRef,
7413
+ props,
7414
+ afterMouseup
7415
+ );
7210
7416
  const commentLeft = ref(-100);
7211
7417
  const commentTop = ref(-100);
7212
7418
  let currentLeftLineNumber = -1;
7213
7419
  let currentRightLineNumber = -1;
7420
+ let currentPosition;
7214
7421
  let lastLineNumberContainer;
7215
- let checkedLineNumberContainer = [];
7216
- let currentLeftLineNumbers = [];
7217
- let currentRightLineNumbers = [];
7218
- let checkedLineCodeString = {};
7219
- let allTrNodes = [];
7220
- let afterCheckLinesEmitData;
7221
- watch(
7222
- () => outputFormat.value,
7223
- () => {
7224
- checkedLineNumberContainer = [];
7225
- currentLeftLineNumbers = [];
7226
- currentRightLineNumbers = [];
7227
- checkedLineCodeString = [];
7228
- }
7229
- );
7230
7422
  const resetLeftTop = () => {
7231
7423
  commentLeft.value = -100;
7232
7424
  commentTop.value = -100;
@@ -7276,6 +7468,8 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7276
7468
  commentLeft.value = left;
7277
7469
  commentTop.value = top;
7278
7470
  currentLeftLineNumber = parseInt(leftLineNumberContainer.innerText);
7471
+ currentRightLineNumber = parseInt(rightLineNumberContainer.innerText || "-1");
7472
+ currentPosition = "left";
7279
7473
  } else {
7280
7474
  resetLeftTop();
7281
7475
  }
@@ -7289,7 +7483,9 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7289
7483
  const { top, left } = rightLineNumberContainer.getBoundingClientRect();
7290
7484
  commentLeft.value = left;
7291
7485
  commentTop.value = top;
7486
+ currentLeftLineNumber = parseInt(leftLineNumberContainer.innerText || "-1");
7292
7487
  currentRightLineNumber = parseInt(rightLineNumberContainer.innerText);
7488
+ currentPosition = "right";
7293
7489
  } else {
7294
7490
  resetLeftTop();
7295
7491
  }
@@ -7309,128 +7505,23 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7309
7505
  resetLeftTop();
7310
7506
  }
7311
7507
  };
7312
- const getCommonClassAndJudge = () => {
7313
- const checkedLine = [currentLeftLineNumbers, currentRightLineNumbers];
7314
- return {
7315
- linenumberDom: allTrNodes,
7316
- checkedLine
7317
- };
7318
- };
7319
- const addCommentCheckedClass = (Dom) => {
7320
- !Dom.classList.contains("comment-checked") && Dom.classList.add("comment-checked");
7321
- };
7322
- function getSingleCheckedLineCode(shouldRenderClass) {
7323
- const { linenumberDom, checkedLine } = getCommonClassAndJudge();
7324
- const checkedCodeContent = [];
7325
- for (let i = 0; i < linenumberDom.length; i++) {
7326
- const lineNumberDomLeft = linenumberDom[i].children[0];
7327
- const lineNumberDomRight = linenumberDom[i].children[1];
7328
- if (lineNumberDomLeft || lineNumberDomRight) {
7329
- const codeLineNumberLeft = parseInt(lineNumberDomLeft == null ? void 0 : lineNumberDomLeft.innerText);
7330
- const codeLineNumberRight = parseInt(lineNumberDomRight == null ? void 0 : lineNumberDomRight.innerText);
7331
- if (checkedLine[0].includes(codeLineNumberLeft) || checkedLine[1].includes(codeLineNumberRight)) {
7332
- checkedLineNumberContainer.push(linenumberDom[i]);
7333
- const codeNode = linenumberDom[i].nextElementSibling;
7334
- checkedCodeContent.push(codeNode == null ? void 0 : codeNode.innerText);
7335
- if (shouldRenderClass) {
7336
- addCommentCheckedClass(linenumberDom[i]);
7337
- addCommentCheckedClass(codeNode);
7338
- }
7339
- }
7340
- }
7341
- }
7342
- checkedLineCodeString = checkedCodeContent;
7343
- }
7344
- function getDoubleCheckedLineCode(shouldRenderClass) {
7345
- var _a;
7346
- const { linenumberDom, checkedLine } = getCommonClassAndJudge();
7347
- const checkedCodeContentLeft = [];
7348
- const checkedCodeContentRight = [];
7349
- function checkedFunc(Dom) {
7350
- checkedLineNumberContainer.push(Dom);
7351
- const codeNode = Dom.nextElementSibling;
7352
- if (shouldRenderClass) {
7353
- addCommentCheckedClass(Dom);
7354
- addCommentCheckedClass(codeNode);
7355
- }
7356
- return codeNode == null ? void 0 : codeNode.innerText;
7357
- }
7358
- for (let i = 0; i < linenumberDom.length; i++) {
7359
- const codeLineNumber = parseInt((_a = linenumberDom[i]) == null ? void 0 : _a.innerHTML);
7360
- if (linenumberDom[i].classList.contains("d-code-left") && checkedLine[0].includes(codeLineNumber)) {
7361
- const lineNumText = checkedFunc(linenumberDom[i]);
7362
- checkedCodeContentLeft.push(lineNumText);
7363
- continue;
7364
- }
7365
- if (linenumberDom[i].classList.contains("d-code-right") && checkedLine[1].includes(codeLineNumber)) {
7366
- const lineNumText = checkedFunc(linenumberDom[i]);
7367
- checkedCodeContentRight.push(lineNumText);
7368
- }
7369
- }
7370
- checkedLineCodeString = { leftCode: checkedCodeContentLeft, rightCode: checkedCodeContentRight };
7371
- }
7372
- function getCheckedLineCode(shouldRenderClass) {
7373
- if (props.outputFormat === "line-by-line") {
7374
- return getSingleCheckedLineCode(shouldRenderClass);
7375
- }
7376
- getDoubleCheckedLineCode(shouldRenderClass);
7377
- }
7378
- function updateLineNumbers({ lefts, rights }) {
7379
- currentLeftLineNumbers = lefts;
7380
- currentRightLineNumbers = rights;
7381
- getCheckedLineCode(false);
7382
- afterCheckLinesEmitData = {
7383
- left: currentLeftLineNumber,
7384
- right: currentRightLineNumber,
7385
- details: {
7386
- lefts: currentLeftLineNumbers,
7387
- rights: currentRightLineNumbers,
7388
- codes: checkedLineCodeString
7389
- }
7390
- };
7391
- }
7392
- const updateCheckedLineClass = () => {
7393
- const lineClassName = props.outputFormat === "line-by-line" ? ".d2h-code-linenumber" : ".d2h-code-side-linenumber";
7394
- allTrNodes = reviewContentRef.value.querySelectorAll(lineClassName);
7395
- getCheckedLineCode(true);
7396
- };
7397
- const resetCommentClass = () => {
7398
- for (let i = 0; i < checkedLineNumberContainer.length; i++) {
7399
- checkedLineNumberContainer[i].classList.remove("comment-checked");
7400
- const codeNode = checkedLineNumberContainer[i].nextElementSibling;
7401
- codeNode == null ? void 0 : codeNode.classList.remove("comment-checked");
7402
- }
7403
- checkedLineNumberContainer = [];
7404
- };
7405
7508
  const commentClick = () => {
7406
- let obj = { left: currentLeftLineNumber, right: currentRightLineNumber };
7407
- if ((currentLeftLineNumbers.length >= 1 || currentRightLineNumbers.length >= 1) && allowChecked.value) {
7408
- const maxCurrentLeftLineNumber = currentLeftLineNumbers[currentLeftLineNumbers.length - 1];
7409
- const maxCurrentRightLineNumber = currentRightLineNumbers[currentRightLineNumbers.length - 1];
7410
- if (maxCurrentLeftLineNumber === currentLeftLineNumber || maxCurrentRightLineNumber === currentRightLineNumber) {
7411
- obj = {
7412
- left: currentLeftLineNumber,
7413
- right: currentRightLineNumber,
7414
- details: {
7415
- lefts: currentLeftLineNumbers,
7416
- rights: currentRightLineNumbers,
7417
- codes: checkedLineCodeString
7418
- }
7419
- };
7509
+ let obj = { left: currentLeftLineNumber, right: currentRightLineNumber, position: currentPosition };
7510
+ const checkedLineDetails = getCheckedLineDetails();
7511
+ if (checkedLineDetails && allowChecked.value) {
7512
+ const { lefts, rights } = checkedLineDetails;
7513
+ const maxCheckedLeftLineNumber = lefts[lefts.length - 1];
7514
+ const maxCheckedRightLineNumber = rights[rights.length - 1];
7515
+ if (maxCheckedLeftLineNumber === currentLeftLineNumber || maxCheckedRightLineNumber === currentRightLineNumber) {
7516
+ obj.details = checkedLineDetails;
7420
7517
  } else {
7421
- currentLeftLineNumbers = [];
7422
- currentRightLineNumbers = [];
7423
- resetCommentClass();
7518
+ clearCommentClass();
7424
7519
  }
7425
7520
  }
7426
7521
  ctx.emit("addComment", obj);
7427
7522
  };
7428
- function afterCheckLines() {
7429
- ctx.emit("afterCheckLines", afterCheckLinesEmitData);
7430
- }
7431
- function afterMouseup(lineNumbers) {
7432
- updateLineNumbers(lineNumbers);
7433
- afterCheckLines();
7523
+ function afterMouseup(details) {
7524
+ ctx.emit("afterCheckLines", { left: currentLeftLineNumber, right: currentRightLineNumber, position: currentPosition, details });
7434
7525
  }
7435
7526
  const onCommentIconClick = (e) => {
7436
7527
  if (e) {
@@ -7486,15 +7577,7 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7486
7577
  }
7487
7578
  };
7488
7579
  const clearCheckedLines = () => {
7489
- currentLeftLineNumbers = [];
7490
- currentRightLineNumbers = [];
7491
- checkedLineCodeString = [];
7492
- resetCommentClass();
7493
- };
7494
- const handleMouseDown = (e) => {
7495
- const lineClassName = props.outputFormat === "line-by-line" ? ".d2h-code-linenumber" : ".d2h-code-side-linenumber";
7496
- allTrNodes = reviewContentRef.value.querySelectorAll(lineClassName);
7497
- onMousedown(e);
7580
+ clearCommentClass();
7498
7581
  };
7499
7582
  const mouseEvent = {};
7500
7583
  if (allowComment.value) {
@@ -7502,7 +7585,7 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7502
7585
  mouseEvent.onMouseleave = onMouseleave;
7503
7586
  }
7504
7587
  if (props.allowChecked) {
7505
- mouseEvent.onMousedown = handleMouseDown;
7588
+ mouseEvent.onMousedown = onMousedown;
7506
7589
  }
7507
7590
  window.addEventListener("scroll", resetLeftTop);
7508
7591
  onUnmounted(() => {
@@ -7512,12 +7595,13 @@ function useCodeReviewComment(reviewContentRef, props, ctx) {
7512
7595
  commentLeft,
7513
7596
  commentTop,
7514
7597
  mouseEvent,
7515
- updateCheckedLineClass,
7516
7598
  clearCheckedLines,
7517
7599
  onCommentMouseLeave,
7518
7600
  onCommentIconClick,
7519
7601
  insertComment,
7520
- removeComment
7602
+ removeComment,
7603
+ updateLineNumberMap,
7604
+ updateCheckedLine
7521
7605
  };
7522
7606
  }
7523
7607
  var codeReview = "";
@@ -7530,16 +7614,7 @@ var CodeReview = defineComponent({
7530
7614
  const {
7531
7615
  diffType
7532
7616
  } = toRefs(props);
7533
- const {
7534
- renderHtml,
7535
- reviewContentRef,
7536
- diffFile,
7537
- onContentClick
7538
- } = useCodeReview(props, ctx);
7539
- const {
7540
- isFold,
7541
- toggleFold
7542
- } = useCodeReviewFold(props, ctx);
7617
+ const reviewContentRef = ref();
7543
7618
  const {
7544
7619
  commentLeft,
7545
7620
  commentTop,
@@ -7548,15 +7623,24 @@ var CodeReview = defineComponent({
7548
7623
  onCommentIconClick,
7549
7624
  insertComment,
7550
7625
  removeComment,
7551
- updateCheckedLineClass,
7552
- clearCheckedLines
7626
+ clearCheckedLines,
7627
+ updateLineNumberMap,
7628
+ updateCheckedLine
7553
7629
  } = useCodeReviewComment(reviewContentRef, props, ctx);
7630
+ const {
7631
+ renderHtml,
7632
+ diffFile,
7633
+ onContentClick
7634
+ } = useCodeReview(props, ctx, reviewContentRef, updateLineNumberMap, updateCheckedLine);
7635
+ const {
7636
+ isFold,
7637
+ toggleFold
7638
+ } = useCodeReviewFold(props, ctx);
7554
7639
  onMounted(() => {
7555
7640
  ctx.emit("afterViewInit", {
7556
7641
  toggleFold,
7557
7642
  insertComment,
7558
7643
  removeComment,
7559
- updateCheckedLineClass,
7560
7644
  clearCheckedLines
7561
7645
  });
7562
7646
  });