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

View File

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