diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Control/SubgraphControl.tsx b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Control/SubgraphControl.tsx index 347308844b3563fb6e8406cee503b4dc03623804..b8e3d1b02506772d0df24528b52251d02b02b9fa 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Control/SubgraphControl.tsx +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Control/SubgraphControl.tsx @@ -33,7 +33,7 @@ const SubgraphControl = () => { return } diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Subgraph/index.tsx b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Subgraph/index.tsx index 4b40d1cc47f93ba66d06063c7ff0623131d7fe5e..fd92313517039d3b72c668d1590087810e73ebbf 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Subgraph/index.tsx +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/Subgraph/index.tsx @@ -21,12 +21,12 @@ import { loadingAtom, modelPathAtom, subgraphPanelVisibleAtom, - subgraphsVisibleAtom + subgraphsVisibleAtom, themeAtom } from '../../stores' import { useAtom, useSetAtom } from 'jotai/index' import { invoke } from '@tauri-apps/api/core' import type { ColumnsType } from 'antd/es/table' -import { Table } from 'antd' +import { ConfigProvider, Table, theme } from 'antd' import { useState } from 'react' import { workerInitSubgraphs, workerToggleSubgraphs } from '../../worker-apis' @@ -106,6 +106,8 @@ const Subgraph = () => { const [selectedRow, setSelectedRow] = useState() const columns = getColumns(t) + const globalTheme = useAtomValue(themeAtom) + const querySubgraph = async (repeat: number, min: number, max: number) => { setLoading(true) const res = await invoke( @@ -119,7 +121,7 @@ const Subgraph = () => { const toggleSubgraph = (): void => { setSubgraphVis(!subgraphVis) - workerToggleSubgraphs(!visible) + workerToggleSubgraphs(!subgraphVis) if (!subgraphVis) { workerInitSubgraphs(selectedRow?.nodes ?? []) } @@ -145,21 +147,27 @@ const Subgraph = () => { style={{display: visible ? 'block' : 'none'}} > - record.key === selectedRow?.key ? 'bg-blue-300' : ''} - pagination={{ - className: '!my-2', - pageSizeOptions: ['10', '20', '50', '100'], - total: subgraphData.length, - showTotal: (total: number): string => t('subgraph.paginationTotal', {total: total}), - showSizeChanger: true, - showQuickJumper: true + + > +
record.key === selectedRow?.key ? 'bg-blue-300' : ''} + pagination={{ + className: '!my-2', + pageSizeOptions: ['10', '20', '50', '100'], + total: subgraphData.length, + showTotal: (total: number): string => t('subgraph.paginationTotal', {total: total}), + showSizeChanger: true, + showQuickJumper: true + }} + /> + } diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/index.tsx b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/index.tsx index de726bb6220c53ec7ac0c182a853228e75dd1a18..19a8439dfe125f9e92ce71431aa8bab8f35b94d2 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/index.tsx +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/ModelStructure/index.tsx @@ -24,12 +24,12 @@ import { useRef, useState } from "react" -import { nodesEdgesAtom, themeAtom, translateAtom, useZoom } from "stores" +import { nodesEdgesAtom, subgraphsVisibleAtom, themeAtom, translateAtom, useZoom } from "stores" import { workerHitTest, workerInit, workerLayoutRs, - workerNewProj, + workerNewProj, workerResize, workerToggleTheme, workerTransform } from "worker-apis" @@ -46,6 +46,7 @@ const ModelStructureComp = ({ width, height }: WindowSize) => { const [translate, setTranslate] = useAtom(translateAtom) const [zoom, zoomIn, zoomOut] = useZoom() const theme = useAtomValue(themeAtom) + const subgraphVis = useAtomValue(subgraphsVisibleAtom) const ref = useRef(null!) const hlRef = useRef(null!) @@ -122,7 +123,13 @@ const ModelStructureComp = ({ width, height }: WindowSize) => { } catch (_e) { workerNewProj(data) } - }, [width, data]) + }, [data]) + + useEffect(() => { + if (!width || !height || !data) return + + workerResize({ width, height, subgraphVis }) + }, [width, height]) useEffect(() => workerTransform(translate, zoom), [translate, zoom]) diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/render.ts b/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/render.ts index 8e83e66f95ffe7d12982c0fadc6e519817a1805f..339b349496894952d4ec200091c47d4eeb6fd9b4 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/render.ts +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/render.ts @@ -67,7 +67,7 @@ const render = () => { const ex = (Width - TranslateX) / Zoom const ey = (Height - TranslateY) / Zoom - if (DisplaySubgraph) renderMaxSubgraphs() + if (DisplaySubgraph && MaxSubgraphs !== null) renderMaxSubgraphs() renderNodes(Nodes, sx, sy, ex, ey) // When the zoom is too small, the edge is hard to see, so it is hidden diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/worker.ts b/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/worker.ts index 00bc3c01eac592e219afe5833ef7b93ca9a3067f..12f2e4c4fab42d505205c5eeeed6136ab2e08afd 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/worker.ts +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/src-worker/worker.ts @@ -140,6 +140,7 @@ const handleResize = (payload: ResizePayload) => { HighlightCanvas.width = payload.width * DPR HighlightCanvas.height = payload.height * DPR HighlightCtx = HighlightCanvas.getContext("2d") + DisplaySubgraph = payload.subgraphVis rerender() } diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/types/ipc.d.ts b/plugins/mindstudio-insight-plugins/ModelVis/app/src/types/ipc.d.ts index 6f81a56c6f6845e0548bc4f607e1baebb2e559ba..44e3a9733fe88ebfbbaf26cd781ea5cd0064dbc1 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/types/ipc.d.ts +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/types/ipc.d.ts @@ -17,6 +17,7 @@ type ResizePayload = { type: "resize" width: number height: number + subgraphVis: boolean } type TransformPayload = { diff --git a/plugins/mindstudio-insight-plugins/ModelVis/app/src/worker-apis.ts b/plugins/mindstudio-insight-plugins/ModelVis/app/src/worker-apis.ts index 33d14a77774be06ebba3f571c20fc853ccfd57fd..53055c4f88df47adeaba993f064f8c6b9820f752 100644 --- a/plugins/mindstudio-insight-plugins/ModelVis/app/src/worker-apis.ts +++ b/plugins/mindstudio-insight-plugins/ModelVis/app/src/worker-apis.ts @@ -48,7 +48,8 @@ export const workerResize = (payload: MainThreadResizePayload) => { { type: "resize", width: payload.width, - height: payload.height + height: payload.height, + subgraphVis: payload.subgraphVis } ) }