fix(editor): 编辑数据源/代码块时,列表高亮

This commit is contained in:
roymondchen 2025-04-24 14:02:34 +08:00
parent 0e911337b8
commit de52ff4fe1
2 changed files with 16 additions and 18 deletions

View File

@ -33,7 +33,6 @@
:content="codeConfig" :content="codeConfig"
@submit="submitCodeBlockHandler" @submit="submitCodeBlockHandler"
@close="editDialogCloseHandler" @close="editDialogCloseHandler"
@open="editDialogOpenHandler"
></CodeBlockEditor> ></CodeBlockEditor>
<Teleport to="body"> <Teleport to="body">
@ -48,7 +47,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, inject, useTemplateRef } from 'vue'; import { computed, inject, useTemplateRef, watch } from 'vue';
import type { Id } from '@tmagic/core'; import type { Id } from '@tmagic/core';
import { TMagicButton, TMagicScrollbar } from '@tmagic/design'; import { TMagicButton, TMagicScrollbar } from '@tmagic/design';
@ -102,13 +101,13 @@ eventBus?.on('edit-code', (id: string) => {
editCode(id); editCode(id);
}); });
const editDialogOpenHandler = () => { watch(codeId, () => {
if (codeBlockListRef.value) { if (codeBlockListRef.value) {
for (const [statusId, status] of codeBlockListRef.value.nodeStatusMap.entries()) { for (const [statusId, status] of codeBlockListRef.value.nodeStatusMap.entries()) {
status.selected = statusId === codeId.value; status.selected = statusId === codeId.value;
} }
} }
}; });
const editDialogCloseHandler = () => { const editDialogCloseHandler = () => {
if (codeBlockListRef.value) { if (codeBlockListRef.value) {

View File

@ -46,7 +46,6 @@
:title="dialogTitle" :title="dialogTitle"
@submit="submitDataSourceHandler" @submit="submitDataSourceHandler"
@close="editDialogCloseHandler" @close="editDialogCloseHandler"
@open="editDialogOpenHandler"
></DataSourceConfigPanel> ></DataSourceConfigPanel>
<Teleport to="body"> <Teleport to="body">
@ -61,7 +60,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, inject, ref } from 'vue'; import { computed, inject, useTemplateRef, watch } from 'vue';
import { mergeWith } from 'lodash-es'; import { mergeWith } from 'lodash-es';
import { TMagicButton, tMagicMessageBox, TMagicPopover, TMagicScrollbar } from '@tmagic/design'; import { TMagicButton, tMagicMessageBox, TMagicPopover, TMagicScrollbar } from '@tmagic/design';
@ -95,22 +94,22 @@ const { dataSourceService } = useServices();
const { editDialog, dataSourceValues, dialogTitle, editable, editHandler, submitDataSourceHandler } = const { editDialog, dataSourceValues, dialogTitle, editable, editHandler, submitDataSourceHandler } =
useDataSourceEdit(dataSourceService); useDataSourceEdit(dataSourceService);
const editDialogOpenHandler = (id: string) => {
if (dataSourceList.value) {
for (const [statusId, status] of dataSourceList.value.nodeStatusMap.entries()) {
status.selected = statusId === id;
}
}
};
const editDialogCloseHandler = () => { const editDialogCloseHandler = () => {
if (dataSourceList.value) { if (dataSourceListRef.value) {
for (const [, status] of dataSourceList.value.nodeStatusMap.entries()) { for (const [, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
status.selected = false; status.selected = false;
} }
} }
}; };
watch(dataSourceValues, (dataSourceValues) => {
if (dataSourceListRef.value && dataSourceValues.id) {
for (const [statusId, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
status.selected = statusId === dataSourceValues.id;
}
}
});
const datasourceTypeList = computed(() => const datasourceTypeList = computed(() =>
[ [
{ text: '基础', type: 'base' }, { text: '基础', type: 'base' },
@ -148,10 +147,10 @@ const removeHandler = async (id: string) => {
dataSourceService.remove(id); dataSourceService.remove(id);
}; };
const dataSourceList = ref<InstanceType<typeof DataSourceList>>(); const dataSourceListRef = useTemplateRef<InstanceType<typeof DataSourceList>>('dataSourceList');
const filterTextChangeHandler = (val: string) => { const filterTextChangeHandler = (val: string) => {
dataSourceList.value?.filter(val); dataSourceListRef.value?.filter(val);
}; };
eventBus?.on('edit-data-source', (id: string) => { eventBus?.on('edit-data-source', (id: string) => {