From 9770c23a06487ecfc21f0edaa7e789fcd0c869e1 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:27:46 +0800 Subject: [PATCH 1/8] =?UTF-8?q?refactor:=20=E7=B2=BE=E7=AE=80=E4=BB=A3?= =?UTF-8?q?=E7=A0=81=E7=A7=BB=E9=99=A4=E4=B8=8D=E4=BD=BF=E7=94=A8=E7=9A=84?= =?UTF-8?q?=E5=8F=82=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs | 2 +- src/BootstrapBlazor/Components/TreeView/TreeView.razor.js | 5 +---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs index 7aa3cd6fb7e..2d2b45f6584 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs @@ -399,7 +399,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender) /// /// /// - protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, new { Invoke = Interop, Method = nameof(TriggerKeyDown), IsVirtualize, AutoCheckParent, AutoCheckChildren }); + protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, new { Invoke = Interop, Method = nameof(TriggerKeyDown) }); private bool _keyboardArrowUpDownTrigger; diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 6f2c895c600..e36ef8a990a 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -2,15 +2,12 @@ import EventHandler from "../../modules/event-handler.js" export function init(id, options) { - const { invoke, method, isVirtualize } = options const el = document.getElementById(id) if (el === null) { return } - const tree = { el, invoke, isVirtualize }; - Data.set(id, tree) - + const { invoke, method } = options EventHandler.on(el, 'keydown', '.tree-root', e => { if (e.key === 'ArrowDown' || e.key === 'ArrowUp' || e.key === 'ArrowLeft' || e.key === 'ArrowRight') { const v = el.getAttribute('data-bb-keyboard'); From 531402e01eae2aee037e471c8c3f4f03664c5234 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:36:18 +0800 Subject: [PATCH 2/8] =?UTF-8?q?refactor:=20=E7=B2=BE=E7=AE=80=20scroll=20?= =?UTF-8?q?=E4=BB=A3=E7=A0=81=E6=8F=90=E9=AB=98=E6=80=A7=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/TreeView/TreeView.razor.cs | 2 +- .../Components/TreeView/TreeView.razor.js | 11 ++++------- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs index 2d2b45f6584..7022d4e5428 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs @@ -391,7 +391,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender) if (_keyboardArrowUpDownTrigger) { _keyboardArrowUpDownTrigger = false; - await InvokeVoidAsync("scroll", Id, ScrollIntoViewOptions ?? new() { Behavior = ScrollIntoViewBehavior.Smooth, Block = ScrollIntoViewBlock.Center, Inline = ScrollIntoViewInline.Nearest }); + await InvokeVoidAsync("scroll", Id, ScrollIntoViewOptions); } } diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index e36ef8a990a..47a6aa4206b 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -30,13 +30,10 @@ export function init(id, options) { } export function scroll(id, options) { - const tree = Data.get(id) - if (tree) { - const { el } = tree; - const item = el.querySelector(".active .tree-node"); - if (item) { - item.scrollIntoView(options); - } + const el = document.getElementById(id); + const item = el.querySelector(".active .tree-node"); + if (item) { + item.scrollIntoView(options ?? { behavior: 'smooth', block: 'start', inline: 'nearest' }); } } From 76b51c628a5ef1b25a69905f1966b193a4dad11e Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:37:04 +0800 Subject: [PATCH 3/8] =?UTF-8?q?refactor:=20=E6=9B=B4=E6=96=B0=20GetParents?= =?UTF-8?q?State=20=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/TreeView/TreeView.razor.cs | 12 +--- .../Components/TreeView/TreeView.razor.js | 61 +++++++++---------- 2 files changed, 32 insertions(+), 41 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs index 7022d4e5428..7b775898de8 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.cs @@ -431,17 +431,11 @@ public async ValueTask TriggerKeyDown(string key) /// 客户端查询指定行选择框状态方法 由 JavaScript 调用 /// /// - /// - /// /// [JSInvokable] - public ValueTask> GetParentsState(List items, int index, CheckboxState? state) + public ValueTask> GetParentsState(List items) { var rows = Rows; - if (state.HasValue) - { - rows[index].CheckedState = state.Value; - } var result = items.Select(i => { var item = rows[i]; @@ -719,8 +713,8 @@ private async Task OnCheckStateChanged(TreeViewItem item, CheckboxState s // 向下级联操作 if (item.CheckedState != CheckboxState.Indeterminate) { - _ = InvokeVoidAsync("setChildrenState", Id, Rows.IndexOf(item), item.CheckedState); item.SetChildrenCheck(TreeNodeStateCache); + _ = InvokeVoidAsync("setChildrenState", Id, Rows.IndexOf(item), item.CheckedState); } } @@ -728,7 +722,7 @@ private async Task OnCheckStateChanged(TreeViewItem item, CheckboxState s { // 向上级联操作 item.SetParentCheck(TreeNodeStateCache); - _ = InvokeVoidAsync("setParentState", Id, Rows.IndexOf(item)); + _ = InvokeVoidAsync("setParentState", Id, Interop, nameof(GetParentsState), Rows.IndexOf(item)); } if (OnTreeItemChecked != null) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 47a6aa4206b..0516cfc2080 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -78,41 +78,38 @@ export function setChildrenState(id, index, state) { } } -export async function setParentState(id, index, state) { - const tree = Data.get(id) - if (tree) { - const { el, invoke } = tree; - const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); - let level = parseInt(node.style.getPropertyValue('--bb-tree-view-level')); - if (node) { - const parents = []; - let prev = node.previousElementSibling; - while (prev) { - const currentLevel = parseInt(prev.style.getPropertyValue('--bb-tree-view-level')); - if (currentLevel < level) { - level = currentLevel; - parents.push(prev); - } - prev = prev.previousElementSibling; +export async function setParentState(id, invoke, method, index) { + const el = document.getElementById(id); + const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); + let level = parseInt(node.style.getPropertyValue('--bb-tree-view-level')); + if (node) { + const parents = []; + let prev = node.previousElementSibling; + while (prev) { + const currentLevel = parseInt(prev.style.getPropertyValue('--bb-tree-view-level')); + if (currentLevel < level) { + level = currentLevel; + parents.push(prev); } + prev = prev.previousElementSibling; + } - if (parents.length > 0) { - const results = await invoke.invokeMethodAsync('GetParentsState', parents.map(p => parseInt(p.getAttribute('data-bb-tree-view-index'))), index, state); - for (let index = 0; index < parents.length; index++) { - const checkbox = parents[index].querySelector('.form-check-input'); - const result = results[index]; - checkbox.indeterminate = false; - if (result === 0) { - checkbox.checked = false; - } - else if (result === 1) { - checkbox.checked = true; - } - else { - checkbox.indeterminate = true; - } - EventHandler.trigger(checkbox, "statechange.bb.checkbox", { state: result }); + if (parents.length > 0) { + const results = await invoke.invokeMethodAsync(method, parents.map(p => parseInt(p.getAttribute('data-bb-tree-view-index')))); + for (let index = 0; index < parents.length; index++) { + const checkbox = parents[index].querySelector('.form-check-input'); + const result = results[index]; + checkbox.indeterminate = false; + if (result === 0) { + checkbox.checked = false; + } + else if (result === 1) { + checkbox.checked = true; + } + else { + checkbox.indeterminate = true; } + EventHandler.trigger(checkbox, "statechange.bb.checkbox", { state: result }); } } } From 30934b987104ed1f71648cbcd331125018d7f327 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:37:28 +0800 Subject: [PATCH 4/8] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=20toggleLoad?= =?UTF-8?q?ing=20=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/TreeView/TreeView.razor.js | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 0516cfc2080..0f4d4d43aa0 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -38,17 +38,14 @@ export function scroll(id, options) { } export function toggleLoading(id, index, state) { - const tree = Data.get(id) - if (tree) { - const { el } = tree; - const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); - if (node) { - if (state) { - node.classList.add('loading'); - } - else { - node.classList.remove('loading'); - } + const el = document.getElementById(id); + const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); + if (node) { + if (state) { + node.classList.add('loading'); + } + else { + node.classList.remove('loading'); } } } From 42f065ba1b33491e6fcec9630a30b65af274d8ed Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:37:44 +0800 Subject: [PATCH 5/8] =?UTF-8?q?refactor:=20=E7=B2=BE=E7=AE=80=20setChildre?= =?UTF-8?q?nState=20=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/TreeView/TreeView.razor.js | 35 +++++++++---------- 1 file changed, 16 insertions(+), 19 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 0f4d4d43aa0..687c94617ee 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -51,26 +51,23 @@ export function toggleLoading(id, index, state) { } export function setChildrenState(id, index, state) { - const tree = Data.get(id) - if (tree) { - const { el } = tree; - const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); - const level = parseInt(node.style.getPropertyValue('--bb-tree-view-level')); - if (node) { - let next = node.nextElementSibling; - while (next) { - const currentLevel = parseInt(next.style.getPropertyValue('--bb-tree-view-level')); - if (currentLevel <= level) { - break; - } - const checkbox = next.querySelector('.form-check-input'); - if (checkbox) { - checkbox.indeterminate = false; - checkbox.checked = state === 1; - EventHandler.trigger(checkbox, "statechange.bb.checkbox", { state }); - } - next = next.nextElementSibling; + const el = document.getElementById(id); + const node = el.querySelector(`[data-bb-tree-view-index="${index}"]`); + const level = parseInt(node.style.getPropertyValue('--bb-tree-view-level')); + if (node) { + let next = node.nextElementSibling; + while (next) { + const currentLevel = parseInt(next.style.getPropertyValue('--bb-tree-view-level')); + if (currentLevel <= level) { + break; + } + const checkbox = next.querySelector('.form-check-input'); + if (checkbox) { + checkbox.indeterminate = false; + checkbox.checked = state === 1; + EventHandler.trigger(checkbox, "statechange.bb.checkbox", { state }); } + next = next.nextElementSibling; } } } From 808c59595b4509f4c17f1542ec72c02d59f01659 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:38:04 +0800 Subject: [PATCH 6/8] =?UTF-8?q?refactor:=20=E7=B2=BE=E7=AE=80=20dispose=20?= =?UTF-8?q?=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/TreeView/TreeView.razor.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 687c94617ee..1f5be87481f 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -110,11 +110,9 @@ export async function setParentState(id, invoke, method, index) { } export function dispose(id) { - const tree = Data.get(id) - Data.remove(id); + const el = document.getElementById(id); - if (tree) { - const { el } = tree; + if (el) { EventHandler.off(el, 'keyup', '.tree-root'); } } From 42a05d51419ddb1a9ff4a868997f2918f5a5be40 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:38:25 +0800 Subject: [PATCH 7/8] =?UTF-8?q?refactor:=20=E7=A7=BB=E9=99=A4=20Data=20?= =?UTF-8?q?=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/TreeView/TreeView.razor.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js index 1f5be87481f..908a543fb4c 100644 --- a/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js +++ b/src/BootstrapBlazor/Components/TreeView/TreeView.razor.js @@ -1,5 +1,4 @@ -import Data from "../../modules/data.js" -import EventHandler from "../../modules/event-handler.js" +import EventHandler from "../../modules/event-handler.js" export function init(id, options) { const el = document.getElementById(id) From 27da4bee8e0bf66dd7c72f6a1e3decc2d326a941 Mon Sep 17 00:00:00 2001 From: Argo-AsicoTech Date: Sun, 24 Nov 2024 10:38:43 +0800 Subject: [PATCH 8/8] =?UTF-8?q?test:=20=E6=9B=B4=E6=96=B0=E5=8D=95?= =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- test/UnitTest/Components/TreeViewTest.cs | 17 +++-------------- 1 file changed, 3 insertions(+), 14 deletions(-) diff --git a/test/UnitTest/Components/TreeViewTest.cs b/test/UnitTest/Components/TreeViewTest.cs index e7fa49b3fec..ea1d49c2390 100644 --- a/test/UnitTest/Components/TreeViewTest.cs +++ b/test/UnitTest/Components/TreeViewTest.cs @@ -507,7 +507,6 @@ public async Task GetParentsState_Ok() Assert.Equal(CheckboxState.Checked, checkboxes[1].Instance.State); await cut.InvokeAsync(() => cut.Find(".fa-caret-right.visible").Click()); - cut.WaitForState(() => cut.Instance.Items[0].Items.Count > 0); // 101 unchecked // -> 101-101 unchecked @@ -516,21 +515,11 @@ public async Task GetParentsState_Ok() checkboxes = cut.FindComponents>>(); var parents = new List() { 0 }; - List results = await cut.Instance.GetParentsState(parents, 1, CheckboxState.Checked); - Assert.NotNull(results); - Assert.Equal(CheckboxState.Checked, checkboxes[1].Instance.Value.CheckedState); - Assert.Equal(CheckboxState.Checked, checkboxes[0].Instance.Value.CheckedState); - - Assert.Single(results); - Assert.Equal(CheckboxState.Checked, results[0]); - - // 更改第二个子节点状态 - checkboxes = cut.FindComponents>>(); - results = await cut.Instance.GetParentsState(parents, 2, CheckboxState.UnChecked); + List results = await cut.Instance.GetParentsState(parents); Assert.NotNull(results); Assert.Equal(CheckboxState.Indeterminate, checkboxes[0].Instance.Value.CheckedState); - Assert.Equal(CheckboxState.Checked, checkboxes[1].Instance.Value.CheckedState); - Assert.Equal(CheckboxState.UnChecked, checkboxes[2].Instance.Value.CheckedState); + Assert.Equal(CheckboxState.UnChecked, checkboxes[1].Instance.Value.CheckedState); + Assert.Equal(CheckboxState.Checked, checkboxes[2].Instance.Value.CheckedState); Assert.Single(results); Assert.Equal(CheckboxState.Indeterminate, results[0]);