diff --git a/docs/arco-mapping.md b/docs/arco-mapping.md index 0c5509b..b47cb8b 100644 --- a/docs/arco-mapping.md +++ b/docs/arco-mapping.md @@ -21,13 +21,15 @@ Phase 005 起，新代码与迁移代码一律使用 Arco Design Vue。本文表 | Naive | Arco | 用量 | 备注 | |---|---|---|---| -| `NButton` | `a-button` | 732 | `block`→`long`、`size="tiny"`→`size="mini"`、`type="warning"`→`type="primary" status="warning"`、`quaternary`→`status="secondary"` | +| `NButton` | `a-button` | 732 | `block`→`long`、`size="tiny"`→`size="mini"`、`type="warning"`→`type="primary" status="warning"`、`quaternary`/`secondary`→`type="secondary"`（Arco `status` 只有 `normal\|success\|warning\|danger`，没有 `secondary`） | | `NInput` | `a-input` / `a-textarea` | 160 | `type="textarea"` 用独立 `a-textarea`；`a-input` 关闭了 attrs 透传，`autofocus` 无效，需 `ref` + `focus()` | | `NModal` | `a-modal` | 138 | `v-model:show`→`v-model:visible`；`preset="dialog"` 无对应，信息型弹窗用 `:footer="false"`（`footer` 为 Boolean prop，默认 true） | | `NFormItem` | `a-form-item` | 136 | 校验规则 API 不同（`rules` 结构、`required` 表达式）需适配 | | `NSelect` | `a-select` | 97 | `options` 的 `label/value` 语义一致；`consistent-menu-width` 等 prop 无对应 | | `NSpin` | `a-spin` | 86 | `show`→`loading` | -| `NTooltip` | `a-tooltip` | 76 | `trigger="hover"` 默认一致；`placement` 语义基本一致 | +| `NTooltip` | `a-tooltip` | 76 | `trigger="hover"` 默认一致；`placement`→`position`；**触发元素走默认插槽**，naive 的 ` - + -
-
- {{ t("common.loading") }} -
-
- {{ t("chat.noSessions") }} -
+ +
+
+ {{ t("common.loading") }} +
+
+ {{ t("chat.noSessions") }} +
{{ t('files.fileTree') }} - + -import { ref, computed, nextTick, onMounted, watch } from 'vue' -import { NButton, NDropdown, NInput, NModal, NSpace, NSpin } from 'naive-ui' +import { ref, computed, onMounted, watch } from 'vue' import { useDialog } from '@/composables/useDialog' import { useMessage } from '@/composables/useMessage' import { useI18n } from 'vue-i18n' @@ -54,8 +53,6 @@ const loadingPaths = ref>(new Set()) const selectedPath = ref(props.modelValue || '') const loadFailed = ref(false) const contextMenuVisible = ref(false) -const contextMenuX = ref(0) -const contextMenuY = ref(0) const contextTarget = ref(null) const renameModalVisible = ref(false) const renameMode = ref<'create' | 'rename'>('create') @@ -64,8 +61,8 @@ const actionLoading = ref(false) watch(() => props.modelValue, (v) => { selectedPath.value = v || '' }) -function updateSelectedPath(value: string | null) { - const next = String(value || '').trim() +function updateSelectedPath(value: string | number | null) { + const next = String(value ?? '').trim() selectedPath.value = next emit('update:modelValue', next || null) } @@ -156,39 +153,27 @@ async function openFolder(folder: FolderEntry | null) { } } -function showContextMenu(event: MouseEvent, folder: FolderEntry | null) { - event.preventDefault() - event.stopPropagation() +function showContextMenu(_event: MouseEvent, folder: FolderEntry | null) { contextTarget.value = folder - contextMenuX.value = event.clientX - contextMenuY.value = event.clientY - contextMenuVisible.value = false - void nextTick(() => { - contextMenuVisible.value = true - }) } const contextOptions = computed(() => { - const options: any[] = [ - { label: t('files.open'), key: 'open' }, - { type: 'divider', key: 'd1' }, - { label: t('files.copyPath'), key: 'copyPath' }, - { label: t('files.newFolder'), key: 'newFolder' }, + const options: { key: string; label: string; divider?: boolean }[] = [ + { key: 'open', label: t('files.open') }, + { key: 'd1', label: '', divider: true }, + { key: 'copyPath', label: t('files.copyPath') }, + { key: 'newFolder', label: t('files.newFolder') }, ] if (contextTarget.value) { if (!contextTarget.value.readonly) { - options.push({ label: t('files.rename'), key: 'rename' }) - options.push({ type: 'divider', key: 'd2' }) - options.push({ label: t('files.delete'), key: 'delete' }) + options.push({ key: 'rename', label: t('files.rename') }) + options.push({ key: 'd2', label: '', divider: true }) + options.push({ key: 'delete', label: t('files.delete') }) } } return options }) -function handleContextOutside() { - contextMenuVisible.value = false -} - function openRenameModal(mode: 'create' | 'rename') { renameMode.value = mode renameInput.value = mode === 'rename' ? contextTarget.value?.name || '' : '' @@ -312,63 +297,81 @@ const flatNodes = computed(() => {