refactor(editor): enable toc dragging in page mode (#9736)

Related [BS-2322](https://linear.app/affine-design/issue/BS-2322/toc-排序坏掉部分的修复)
This commit is contained in:
L-Sun
2025-01-16 17:53:28 +00:00
parent a2ffdb4047
commit c2149f218b
2 changed files with 6 additions and 17 deletions
@@ -317,7 +317,7 @@ export class OutlinePanelBody extends SignalWatcher(
notes: OutlineNoteItem[],
children: NoteBlockModel[]
) {
if (!this._isEdgelessMode() || !children.length || !this.doc.root) return;
if (!children.length || !this.doc.root) return;
const blocks = selected.map(
id => (notesMap.get(id) as OutlineNoteItem).note
@@ -351,7 +351,6 @@ export class OutlinePanelBody extends SignalWatcher(
style=${`transform: translateY(${this._indicatorTranslateY}px)`}
></div>`
: nothing}
${this._renderDocTitle()}
${this._pageVisibleNotes.length
? repeat(
this._pageVisibleNotes,
@@ -364,7 +363,6 @@ export class OutlinePanelBody extends SignalWatcher(
.number=${idx + 1}
.index=${note.index}
.doc=${this.doc}
.editorMode=${this.editor.mode}
.activeHeadingId=${this._activeHeadingId$.value}
.status=${selectedNotesSet.has(note.note.id)
? this._dragging
@@ -450,8 +448,6 @@ export class OutlinePanelBody extends SignalWatcher(
}
private _selectNote(e: SelectEvent) {
if (!this._isEdgelessMode()) return;
const { selected, id, multiselect } = e.detail;
if (!selected) {
@@ -658,6 +654,7 @@ export class OutlinePanelBody extends SignalWatcher(
return html`
<div class="outline-panel-body-container">
${this._renderDocTitle()}
${shouldRenderEmptyPanel
? this._EmptyPanel()
: this._PanelList(shouldRenderEdgelessOnlyNotes)}
@@ -42,7 +42,7 @@ const styles = css`
user-select: none;
}
.card-preview.edgeless:hover {
.card-preview:hover {
background: var(--affine-hover-color);
}
@@ -217,12 +217,7 @@ export class OutlineNoteCard extends SignalWatcher(WithDisposable(LitElement)) {
private _dispatchDragEvent(e: MouseEvent) {
e.preventDefault();
if (
e.button !== 0 ||
this.editorMode === 'page' ||
!this.enableNotesSorting
)
return;
if (e.button !== 0 || !this.enableNotesSorting) return;
const { clientX: startX, clientY: startY } = e;
const disposeDragStart = on(this.ownerDocument, 'mousemove', e => {
@@ -317,7 +312,7 @@ export class OutlineNoteCard extends SignalWatcher(WithDisposable(LitElement)) {
class="card-container ${this.status ?? ''} ${this.theme}"
>
<div
class="card-preview ${this.editorMode}"
class="card-preview"
@mousedown=${this._dispatchDragEvent}
@click=${this._dispatchSelectEvent}
@dblclick=${this._dispatchFitViewEvent}
@@ -368,7 +363,7 @@ export class OutlineNoteCard extends SignalWatcher(WithDisposable(LitElement)) {
.cardNumber=${this.number}
.enableNotesSorting=${this.enableNotesSorting}
@click=${() => {
if (this.editorMode === 'edgeless' || this.invisible) return;
if (this.invisible) return;
this._dispatchClickBlockEvent(block);
}}
></affine-outline-block-preview>`;
@@ -395,9 +390,6 @@ export class OutlineNoteCard extends SignalWatcher(WithDisposable(LitElement)) {
@property({ attribute: false })
accessor doc!: Store;
@property({ attribute: false })
accessor editorMode: 'page' | 'edgeless' = 'page';
@property({ attribute: false })
accessor enableNotesSorting!: boolean;