Skip to content

Commit e55836e

Browse files
authored
Merge pull request #1924 from DevCloudFE/dev
update main with dev
2 parents 2eea00a + 03b2b64 commit e55836e

File tree

9 files changed

+79
-39
lines changed

9 files changed

+79
-39
lines changed

packages/devui-vue/devui/code-review/src/composables/use-code-review-comment.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -218,4 +218,4 @@ export function useCodeReviewComment(reviewContentRef: Ref<HTMLElement>, props:
218218
updateLineNumberMap,
219219
updateCheckedLine,
220220
};
221-
}
221+
}

packages/devui-vue/devui/code-review/src/composables/use-code-review-line-selection.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -248,4 +248,4 @@ export function useCodeReviewLineSelection(
248248
);
249249

250250
return { onMousedown, updateLineNumberMap, getCheckedLineDetails, clearCommentClass, updateCheckedLine };
251-
}
251+
}

packages/devui-vue/devui/code-review/src/utils.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -561,7 +561,7 @@ export function parseCodeToSingle(container: HTMLElement, code: string, options:
561561
}
562562

563563
function generateNumberTdObj(tdNodes: HTMLElement[]) {
564-
const lineNumber = parseInt(tdNodes[0].innerText) || -1;
564+
const lineNumber = tdNodes[0]?.innerText ? parseInt(tdNodes[0].innerText) : -1;
565565
if (lineNumber !== -1) {
566566
return { [lineNumber]: tdNodes };
567567
}

packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import cloneDeep from 'lodash/cloneDeep';
22
import { computed, nextTick, onMounted, reactive, Ref, ref, SetupContext, toRefs, watch, onBeforeUnmount } from 'vue';
33
import { debounce } from '../../../shared/utils';
44
import { EditorMdProps, Mode } from '../editor-md-types';
5-
import { DEFAULT_TOOLBARS } from '../toolbar-config';
5+
import { ALT_KEY, DEFAULT_TOOLBARS } from '../toolbar-config';
66
import { parseHTMLStringToDomList } from '../utils';
77
import { refreshEditorCursor, _enforceMaxLength } from './helper';
88
import { throttle } from 'lodash';
@@ -289,8 +289,8 @@ export function useEditorMd(props: EditorMdProps, ctx: SetupContext) {
289289
const tempToolbars = { ...toolbars, ...customToolbars?.value };
290290
for (const key of Object.keys(tempToolbars)) {
291291
const toolbarItem = tempToolbars[key];
292-
if (toolbarItem.shortKey && flatToolbarConfig.includes(toolbarItem.id)) {
293-
shortKeys[toolbarItem.shortKey.replace(/\+/g, '-')] = toolbarItem.handler?.bind(null, editorIns, toolbarItem.params);
292+
if (toolbarItem.shortKeyWithCode && flatToolbarConfig.includes(toolbarItem.id)) {
293+
shortKeys[toolbarItem.shortKeyWithCode.replace(/\+/g, '-')] = toolbarItem.handler?.bind(null, editorIns, toolbarItem.params);
294294
}
295295
}
296296

@@ -322,13 +322,17 @@ export function useEditorMd(props: EditorMdProps, ctx: SetupContext) {
322322
if (e.ctrlKey) {
323323
keyCombination += 'Ctrl-';
324324
}
325+
if (e.metaKey) {
326+
keyCombination += '⌘-';
327+
}
325328
if (e.altKey) {
326-
keyCombination += 'Alt-';
329+
keyCombination += `${ALT_KEY}-`;
327330
}
328331
if (e.shiftKey) {
329332
keyCombination += 'Shift-';
330333
}
331-
keyCombination += e.key.toUpperCase();
334+
335+
keyCombination += e.keyCode;
332336
if (shortKeys[keyCombination] && typeof shortKeys[keyCombination] === 'function') {
333337
e.preventDefault();
334338
shortKeys[keyCombination]();

packages/devui-vue/devui/editor-md/src/toolbar-config.ts

Lines changed: 36 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ export interface IToolbarItemConfig {
3131
template?: any;
3232
component?: any;
3333
shortKey?: string;
34+
shortKeyWithCode?: string;
3435
params?: { [key: string]: any };
3536
handler?(editor?: any, params?: any): void;
3637
}
@@ -277,93 +278,107 @@ class ToolBarHandler {
277278
static color = (): void => {};
278279
}
279280

281+
export const CTRL_KEY = navigator?.platform?.indexOf('Mac') !== -1 ? '⌘' : 'Ctrl';
282+
export const ALT_KEY = navigator?.platform?.indexOf('Mac') !== -1 ? '⌥' : 'Alt';
283+
280284
export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
281285
undo: {
282286
id: 'undo',
283287
name: 'undo',
284288
type: 'button',
285289
icon: UNDO_ICON,
286-
shortKey: 'Ctrl+Z',
290+
shortKey: `${CTRL_KEY}+Z`,
291+
shortKeyWithCode: `${CTRL_KEY}+90`,
287292
handler: ToolBarHandler.undo,
288293
},
289294
redo: {
290295
id: 'redo',
291296
name: 'redo',
292297
type: 'button',
293298
icon: REDO_ICON,
294-
shortKey: 'Ctrl+Y',
299+
shortKey: `${CTRL_KEY}+Y`,
300+
shortKeyWithCode: `${CTRL_KEY}+89`,
295301
handler: ToolBarHandler.redo,
296302
},
297303
bold: {
298304
id: 'bold',
299305
name: 'bold',
300306
type: 'button',
301307
icon: BOLD_ICON,
302-
shortKey: 'Ctrl+B',
308+
shortKey: `${CTRL_KEY}+B`,
309+
shortKeyWithCode: `${CTRL_KEY}+66`,
303310
handler: ToolBarHandler.bold,
304311
},
305312
italic: {
306313
id: 'italic',
307314
name: 'italic',
308315
type: 'button',
309316
icon: ITALIC_ICON,
310-
shortKey: 'Ctrl+I',
317+
shortKey: `${CTRL_KEY}+I`,
318+
shortKeyWithCode: `${CTRL_KEY}+73`,
311319
handler: ToolBarHandler.italic,
312320
},
313321
strike: {
314322
id: 'strike',
315323
name: 'strike',
316324
type: 'button',
317325
icon: STRIKE_ICON,
318-
shortKey: 'Ctrl+D',
326+
shortKey: `${CTRL_KEY}+D`,
327+
shortKeyWithCode: `${CTRL_KEY}+68`,
319328
handler: ToolBarHandler.strike,
320329
},
321330
h1: {
322331
id: 'h1',
323332
name: 'h1',
324333
type: 'button',
325334
icon: H1_ICON,
326-
shortKey: 'Ctrl+1',
335+
shortKey: `${CTRL_KEY}+1`,
336+
shortKeyWithCode: `${CTRL_KEY}+49`,
327337
handler: ToolBarHandler.h1,
328338
},
329339
h2: {
330340
id: 'h2',
331341
name: 'h2',
332342
type: 'button',
333343
icon: H2_ICON,
334-
shortKey: 'Ctrl+2',
344+
shortKey: `${CTRL_KEY}+2`,
345+
shortKeyWithCode: `${CTRL_KEY}+50`,
335346
handler: ToolBarHandler.h2,
336347
},
337348
ul: {
338349
id: 'ul',
339350
name: 'unorderedlist',
340351
type: 'button',
341352
icon: LIST_UNORDERED_ICON,
342-
shortKey: 'Ctrl+U',
353+
shortKey: `${CTRL_KEY}+U`,
354+
shortKeyWithCode: `${CTRL_KEY}+85`,
343355
handler: ToolBarHandler.ul,
344356
},
345357
ol: {
346358
id: 'ol',
347359
name: 'orderedlist',
348360
type: 'button',
349361
icon: LIST_ORDERED_ICON,
350-
shortKey: 'Ctrl+O',
362+
shortKey: `${CTRL_KEY}+O`,
363+
shortKeyWithCode: `${CTRL_KEY}+79`,
351364
handler: ToolBarHandler.ol,
352365
},
353366
checklist: {
354367
id: 'checklist',
355368
name: 'checklist',
356369
type: 'button',
357370
icon: LIST_CHECK_ICON,
358-
shortKey: 'Ctrl+Alt+C',
371+
shortKey: `${CTRL_KEY}+${ALT_KEY}+C`,
372+
shortKeyWithCode: `${CTRL_KEY}+${ALT_KEY}+67`,
359373
handler: ToolBarHandler.checkList,
360374
},
361375
underline: {
362376
id: 'underline',
363377
name: 'underline',
364378
type: 'button',
365379
icon: UNDERLINE_ICON,
366-
shortKey: 'Ctrl+R',
380+
shortKey: `${CTRL_KEY}+R`,
381+
shortKeyWithCode: `${CTRL_KEY}+82`,
367382
handler: ToolBarHandler.underline,
368383
},
369384
font: {
@@ -379,15 +394,17 @@ export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
379394
name: 'link',
380395
type: 'button',
381396
icon: LINK_ICON,
382-
shortKey: 'Ctrl+L',
397+
shortKey: `${CTRL_KEY}+L`,
398+
shortKeyWithCode: `${CTRL_KEY}+76`,
383399
handler: ToolBarHandler.link,
384400
},
385401
image: {
386402
id: 'image',
387403
name: 'image',
388404
type: 'button',
389405
icon: IMAGE_ICON,
390-
shortKey: 'Ctrl+G',
406+
shortKey: `${CTRL_KEY}+G`,
407+
shortKeyWithCode: `${CTRL_KEY}+71`,
391408
params: { imageUploadToServer: false },
392409
handler: ToolBarHandler.image,
393410
},
@@ -397,23 +414,26 @@ export const DEFAULT_TOOLBARS: Record<string, IToolbarItemConfig> = {
397414
type: 'button',
398415
icon: FILE_ICON,
399416
params: {},
400-
shortKey: 'Ctrl+F',
417+
shortKey: `${CTRL_KEY}+F`,
418+
shortKeyWithCode: `${CTRL_KEY}+70`,
401419
handler: ToolBarHandler.file,
402420
},
403421
code: {
404422
id: 'code',
405423
name: 'code',
406424
type: 'button',
407425
icon: CODE_ICON,
408-
shortKey: 'Ctrl+K',
426+
shortKey: `${CTRL_KEY}+K`,
427+
shortKeyWithCode: `${CTRL_KEY}+75`,
409428
handler: ToolBarHandler.code,
410429
},
411430
table: {
412431
id: 'table',
413432
name: 'table',
414433
type: 'button',
415434
icon: TABLE_ICON,
416-
shortKey: 'Ctrl+Alt+T',
435+
shortKey: `${CTRL_KEY}+${ALT_KEY}+T`,
436+
shortKeyWithCode: `${CTRL_KEY}+${ALT_KEY}+84`,
417437
handler: ToolBarHandler.table,
418438
},
419439
fullscreen: {

packages/devui-vue/devui/git-graph/src/git-graph-class.ts

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -72,12 +72,12 @@ export class GitGraph {
7272
this.graphHeight = (this.element as HTMLElement).getBoundingClientRect().height;
7373
this.graphWidth = (this.element as HTMLElement).getBoundingClientRect().width;
7474

75-
// 按提交数据计算画布高度,并留出下方150,右边300空白,保证悬浮框不超出画布
75+
// 按提交数据计算画布高度,并留出下方150,右边500空白,保证悬浮框不超出画布
7676
const ch = Math.max(this.graphHeight, this.offsetY + this.unitTime * this.mtime + 150);
77-
const cw = Math.max(this.graphWidth, this.offsetX + this.unitSpace * this.mspace + 300);
77+
const cw = Math.max(this.graphWidth, this.offsetX + this.unitSpace * this.mspace + 500);
7878
this.svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
7979
this.svg.setAttribute('height', ch + '');
80-
this.svg.setAttribute('width', '100%');
80+
this.svg.setAttribute('width', cw + '');
8181
this.element?.appendChild(this.svg);
8282
this.barHeight = Math.max(this.graphHeight, this.unitTime * this.commits.length + 320);
8383

@@ -237,7 +237,7 @@ export class GitGraph {
237237
r: 4,
238238
fill: '#fff',
239239
strokeWidth: 1,
240-
stroke: this.colors[commit.space],
240+
stroke: this.colors[commit.space % 20],
241241
style: 'cursor: pointer;'
242242
};
243243
this.setNodeAttr(circle, attrs);
@@ -265,7 +265,7 @@ export class GitGraph {
265265
this.svg.appendChild(img);
266266

267267
if (!this.messageBoxWidth) {
268-
this.messageBoxWidth = this.svg.getBoundingClientRect.width - (avatar_box_x + 40);
268+
this.messageBoxWidth = this.svg.getBoundingClientRect().width - (avatar_box_x + 40);
269269
}
270270
// 画竖线
271271
let route = ['M', avatar_box_x + 15, avatar_box_y - 20, 'L', avatar_box_x + 15, avatar_box_y];
@@ -292,17 +292,30 @@ export class GitGraph {
292292
commit.author.name = commit.author.name.substr(0, this.maxNameLength) + '...';
293293
}
294294

295-
const commitText = document.createElementNS('http://www.w3.org/2000/svg', 'text');
295+
const commitText = document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject');
296296
const commitAttrs = {
297297
x: avatar_box_x + 40,
298-
y: y + 4,
298+
y: y - 8,
299299
'text-anchor': 'start',
300300
style: 'cursor: pointer;text-anchor: start;',
301-
fill: isdark ? '#e8e8e8' : '#2e2e2e',
302-
'font-size': 14,
301+
width: this.messageBoxWidth,
302+
height: 20,
303303
};
304304
this.setNodeAttr(commitText, commitAttrs);
305305

306+
const textArr = {
307+
style: 'width: 100%; height: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;',
308+
title: commit.message,
309+
};
310+
311+
const text = document.createElement('div');
312+
this.setNodeAttr(text, textArr);
313+
314+
text.innerText = commit.message.replace(/\n/g, ' ');
315+
commitText.appendChild(text);
316+
317+
this.svg.appendChild(commitText);
318+
306319
const tspan = document.createElementNS('http://www.w3.org/2000/svg', 'tspan');
307320
tspan.appendChild(document.createTextNode(commit.message.replace(/\n/g, ' ')));
308321
commitText.appendChild(tspan);
@@ -339,9 +352,9 @@ export class GitGraph {
339352
parentX1 = this.offsetX + this.unitSpace * (this.mspace - parentCommit.space);
340353
parentX2 = this.offsetX + this.unitSpace * (this.mspace - parent[1]);
341354
if (parentCommit.space <= commit.space) {
342-
color = this.colors[commit.space];
355+
color = this.colors[commit.space % 20];
343356
} else {
344-
color = this.colors[parentCommit.space];
357+
color = this.colors[parentCommit.space % 20];
345358
}
346359
if (parent[1] === commit.space) {
347360
offset = [0, 5];
@@ -438,15 +451,15 @@ export class GitGraph {
438451

439452
const rectAttrs = {
440453
fill: this.isDark ? '#4C4C4C' : '#fff',
441-
stroke: this.colors[commit.space],
454+
stroke: this.colors[commit.space % 20],
442455
'stroke-width': '1px',
443456
d: path.join(' '),
444457
transform: `matrix(1,0,0,1,-${textbox.width + 26},0)`,
445458
};
446459

447460
const newAttrs = {
448461
transform: `matrix(1,0,0,1,-${textbox.width + 26},0)`,
449-
fill: this.colors[commit.space],
462+
fill: this.colors[commit.space % 20],
450463
};
451464

452465
this.setNodeAttr(text, newAttrs);
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.d-graph-wrapper {
2+
overflow-x: auto;
3+
}

packages/devui-vue/devui/git-graph/src/git-graph.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { defineComponent, onMounted, ref, SetupContext, nextTick } from "vue";
22
import { GitGraphProps, gitGraphProps } from "./git-graph-types";
33
import useGitGraph from "./use-git-graph";
4-
4+
import './git-graph.scss';
55

66
export default defineComponent({
77
name: 'DGitGraph',

packages/devui-vue/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vue-devui",
3-
"version": "1.6.28",
3+
"version": "1.6.29",
44
"license": "MIT",
55
"description": "DevUI components based on Vite and Vue3",
66
"keywords": [

0 commit comments

Comments
 (0)