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