@robot-admin/naive-ui-components 0.6.8 → 0.6.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +277 -261
- package/dist/C_AudioPlayer-DKRIGhi7.css.map +1 -0
- package/dist/C_AudioPlayer-DlB6eNsa.css.map +1 -0
- package/dist/C_AudioPlayer.cjs +1 -0
- package/dist/C_AudioPlayer.css +283 -0
- package/dist/C_AudioPlayer.d.cts +2 -0
- package/dist/C_AudioPlayer.d.ts +2 -0
- package/dist/C_AudioPlayer.js +1 -0
- package/dist/C_AudioPlayer.js.map +1 -0
- package/dist/C_AudioPlayer2.js +2 -0
- package/dist/C_AudioPlayer2.js.map +1 -0
- package/dist/C_AvatarGroup-D02zci-i.css.map +1 -0
- package/dist/C_AvatarGroup-DatHaUlY.css.map +1 -0
- package/dist/C_AvatarGroup.cjs +1 -0
- package/dist/C_AvatarGroup.css +107 -0
- package/dist/C_AvatarGroup.d.cts +2 -0
- package/dist/C_AvatarGroup.d.ts +2 -0
- package/dist/C_AvatarGroup.js +1 -0
- package/dist/C_AvatarGroup.js.map +1 -0
- package/dist/C_AvatarGroup2.js +2 -0
- package/dist/C_AvatarGroup2.js.map +1 -0
- package/dist/C_Barcode.d.cts +1 -1
- package/dist/C_Barcode.d.ts +1 -1
- package/dist/{C_Breadcrumb-B5PGpP5m.css.map → C_Breadcrumb-BiH0d9AI.css.map} +1 -1
- package/dist/{C_Breadcrumb-Cay7qluL.css.map → C_Breadcrumb-Bqqrl8nX.css.map} +1 -1
- package/dist/C_Breadcrumb.css +8 -2
- package/dist/C_Breadcrumb.d.cts +1 -1
- package/dist/C_Breadcrumb.d.ts +1 -1
- package/dist/C_Breadcrumb.js.map +1 -1
- package/dist/C_Breadcrumb2.js.map +1 -1
- package/dist/C_Captcha.d.cts +1 -1
- package/dist/C_Captcha.d.ts +1 -1
- package/dist/C_Cascade.d.cts +1 -1
- package/dist/C_Cascade.d.ts +1 -1
- package/dist/C_Chat-CcjZdAwu.css.map +1 -0
- package/dist/C_Chat-Diq7tyWU.css.map +1 -0
- package/dist/C_Chat.cjs +1 -0
- package/dist/C_Chat.css +395 -0
- package/dist/C_Chat.d.cts +2 -0
- package/dist/C_Chat.d.ts +2 -0
- package/dist/C_Chat.js +1 -0
- package/dist/C_Chat.js.map +1 -0
- package/dist/C_Chat2.js +2 -0
- package/dist/C_Chat2.js.map +1 -0
- package/dist/C_City.d.cts +1 -1
- package/dist/C_City.d.ts +1 -1
- package/dist/C_Code.d.cts +1 -1
- package/dist/C_Code.d.ts +1 -1
- package/dist/C_ContextMenu-B3Cgz_wJ.css.map +1 -0
- package/dist/C_ContextMenu-u1LixF3_.css.map +1 -0
- package/dist/C_ContextMenu.cjs +1 -0
- package/dist/C_ContextMenu.css +115 -0
- package/dist/C_ContextMenu.d.cts +2 -0
- package/dist/C_ContextMenu.d.ts +2 -0
- package/dist/C_ContextMenu.js +1 -0
- package/dist/C_ContextMenu.js.map +1 -0
- package/dist/C_ContextMenu2.js +2 -0
- package/dist/C_ContextMenu2.js.map +1 -0
- package/dist/C_Date.d.cts +1 -1
- package/dist/C_Date.d.ts +1 -1
- package/dist/C_Editor.d.cts +1 -1
- package/dist/C_Editor.d.ts +1 -1
- package/dist/C_Guide.d.cts +1 -1
- package/dist/C_Guide.d.ts +1 -1
- package/dist/C_Icon.d.cts +1 -1
- package/dist/C_Icon.d.ts +1 -1
- package/dist/C_Icon.js.map +1 -1
- package/dist/C_Icon2.js +1 -1
- package/dist/C_Icon2.js.map +1 -1
- package/dist/C_Language.d.cts +1 -1
- package/dist/C_Language.d.ts +1 -1
- package/dist/C_Language.js.map +1 -1
- package/dist/C_Language2.js +1 -1
- package/dist/C_Language2.js.map +1 -1
- package/dist/C_Login-BkdnkBKX.css.map +1 -0
- package/dist/C_Login-VkMM6OJ2.css.map +1 -0
- package/dist/C_Login.cjs +1 -0
- package/dist/C_Login.css +515 -0
- package/dist/C_Login.d.cts +2 -0
- package/dist/C_Login.d.ts +2 -0
- package/dist/C_Login.js +1 -0
- package/dist/C_Login.js.map +1 -0
- package/dist/C_Login2.js +2 -0
- package/dist/C_Login2.js.map +1 -0
- package/dist/C_Markdown.d.cts +1 -1
- package/dist/C_Markdown.d.ts +1 -1
- package/dist/C_Menu.d.cts +1 -1
- package/dist/C_Menu.d.ts +1 -1
- package/dist/C_Progress.d.cts +1 -1
- package/dist/C_Progress.d.ts +1 -1
- package/dist/C_Steps.d.cts +1 -1
- package/dist/C_Steps.d.ts +1 -1
- package/dist/C_TagsView.d.cts +1 -1
- package/dist/C_TagsView.d.ts +1 -1
- package/dist/C_Theme.d.cts +1 -1
- package/dist/C_Theme.d.ts +1 -1
- package/dist/C_Timeline-BIvw3f41.css.map +1 -0
- package/dist/C_Timeline-VsDfCv4Q.css.map +1 -0
- package/dist/C_Timeline.cjs +1 -0
- package/dist/C_Timeline.css +271 -0
- package/dist/C_Timeline.d.cts +2 -0
- package/dist/C_Timeline.d.ts +2 -0
- package/dist/C_Timeline.js +1 -0
- package/dist/C_Timeline.js.map +1 -0
- package/dist/C_Timeline2.js +2 -0
- package/dist/C_Timeline2.js.map +1 -0
- package/dist/C_Transfer-BOB6OBqS.css.map +1 -0
- package/dist/C_Transfer-Dpq7ezWC.css.map +1 -0
- package/dist/C_Transfer.cjs +1 -0
- package/dist/C_Transfer.css +193 -0
- package/dist/C_Transfer.d.cts +2 -0
- package/dist/C_Transfer.d.ts +2 -0
- package/dist/C_Transfer.js +1 -0
- package/dist/C_Transfer.js.map +1 -0
- package/dist/C_Transfer2.js +2 -0
- package/dist/C_Transfer2.js.map +1 -0
- package/dist/C_VtableGantt.d.cts +1 -1
- package/dist/C_VtableGantt.d.ts +1 -1
- package/dist/constants.d.ts +2 -2
- package/dist/constants2.d.ts +2 -2
- package/dist/constants4.d.ts +3 -3
- package/dist/constants5.d.ts +2 -2
- package/dist/data.d.ts +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +48 -41
- package/dist/index.d.ts +48 -41
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.vue.d.ts +1 -1
- package/dist/index10.vue.d.ts +41 -23
- package/dist/index11.vue.d.ts +80 -63
- package/dist/index12.vue.d.ts +48 -20
- package/dist/index13.vue.d.ts +23 -63
- package/dist/index14.vue.d.ts +21 -58
- package/dist/index15.vue.d.ts +65 -48
- package/dist/index16.vue.d.ts +16 -21
- package/dist/index17.vue.d.ts +106 -77
- package/dist/index18.vue.d.ts +74 -11
- package/dist/index19.vue.d.ts +58 -653
- package/dist/index2.vue.d.ts +75 -30
- package/dist/index20.vue.d.ts +55 -0
- package/dist/index21.vue.d.ts +33 -0
- package/dist/index22.vue.d.ts +88 -0
- package/dist/index23.vue.d.ts +18 -0
- package/dist/index24.vue.d.ts +112 -0
- package/dist/index25.vue.d.ts +81 -0
- package/dist/index26.vue.d.ts +662 -0
- package/dist/index3.vue.d.ts +77 -19
- package/dist/index4.vue.d.ts +29 -36
- package/dist/index5.vue.d.ts +19 -20
- package/dist/index6.vue.d.ts +36 -26
- package/dist/index7.vue.d.ts +23 -40
- package/dist/index8.vue.d.ts +117 -45
- package/dist/index9.vue.d.ts +19 -25
- package/dist/resolver.cjs +1 -1
- package/dist/resolver.cjs.map +1 -1
- package/dist/resolver.d.cts +1 -1
- package/dist/resolver.d.ts +1 -1
- package/dist/resolver.js +1 -1
- package/dist/resolver.js.map +1 -1
- package/dist/style.css +1920 -21
- package/dist/useCollapsePanel.d.ts +1 -1
- package/dist/useCropperCore.d.ts +4 -4
- package/dist/useDraggableLayout.d.ts +8 -8
- package/dist/useDynamicFormState.d.ts +10 -10
- package/dist/useEdgeInteraction.d.ts +1 -1
- package/dist/useInfiniteScroll.d.ts +2 -2
- package/dist/useModalEdit.d.ts +2 -2
- package/dist/useQRCode.d.ts +4 -4
- package/dist/useSearchState.d.ts +2 -2
- package/dist/useSignatureHistory.d.ts +1 -1
- package/dist/useSplitResize.d.ts +5 -5
- package/dist/useTimeSelection.d.ts +2 -2
- package/dist/useTreeOperations.d.ts +6 -6
- package/dist/useWorkflowValidation.d.ts +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_Chat2.js","names":[],"sources":["../src/components/C_Chat/types.ts","../src/components/C_Chat/index.vue","../src/components/C_Chat/index.vue","../src/components/C_Chat/index.vue"],"sourcesContent":["/**\n * @Description: C_Chat 通用聊天组件 - 类型定义\n */\n\n// ================= 消息类型 =================\n\n/** 消息类型 */\nexport type MessageType = 'text' | 'image' | 'file' | 'system'\n\n/** 消息发送方 */\nexport type MessageSender = 'self' | 'other' | 'system'\n\n/** 消息状态 */\nexport type MessageStatus = 'sending' | 'sent' | 'failed'\n\n/** 单条消息 */\nexport interface ChatMessage {\n /** 唯一标识 */\n id: string\n /** 消息内容(文本 / 图片 URL / 文件信息 JSON) */\n content: string\n /** 消息类型 */\n type: MessageType\n /** 发送方 */\n sender: MessageSender\n /** 发送时间(ISO 字符串 或 时间戳) */\n timestamp: string | number\n /** 发送者头像 URL */\n avatar?: string\n /** 发送者用户名 */\n username?: string\n /** 消息状态 */\n status?: MessageStatus\n /** 文件名(type = 'file' 时使用) */\n fileName?: string\n /** 文件大小(字节) */\n fileSize?: number\n}\n\n// ================= 联系人 =================\n\n/** 联系人 / 会话 */\nexport interface ChatContact {\n /** 唯一标识 */\n id: string\n /** 显示名称 */\n name: string\n /** 头像 URL */\n avatar?: string\n /** 最后一条消息摘要 */\n lastMessage?: string\n /** 最后消息时间 */\n lastTime?: string | number\n /** 未读数 */\n unread?: number\n /** 是否在线 */\n online?: boolean\n}\n\n// ================= 组件 Props =================\n\nexport interface ChatProps {\n /** 联系人列表 */\n contacts?: ChatContact[]\n /** 消息列表 */\n messages?: ChatMessage[]\n /** 当前选中的联系人 ID */\n currentContactId?: string\n /** 输入框占位符 */\n placeholder?: string\n /** 是否显示联系人侧栏 */\n showContacts?: boolean\n /** 是否显示消息时间戳 */\n showTimestamp?: boolean\n /** 当前用户头像 */\n selfAvatar?: string\n /** 当前用户名 */\n selfName?: string\n /** 是否显示发送按钮 */\n showSendBtn?: boolean\n /** 是否正在加载历史消息 */\n loadingHistory?: boolean\n /** 标题(无联系人模式时显示) */\n title?: string\n}\n\n// ================= 默认值 =================\n\nexport const DEFAULT_CHAT_PROPS: Required<\n Pick<\n ChatProps,\n | 'placeholder'\n | 'showContacts'\n | 'showTimestamp'\n | 'showSendBtn'\n | 'loadingHistory'\n | 'title'\n >\n> = {\n placeholder: '输入消息...',\n showContacts: true,\n showTimestamp: true,\n showSendBtn: true,\n loadingHistory: false,\n title: '聊天',\n}\n","/* unplugin-vue-components disabled */<!--\n * @Description: C_Chat — 通用聊天组件\n *\n * 支持联系人列表 + 消息气泡 + 输入框,可用于 IM、客服、AI 对话等场景。\n * 通过 CSS 变量可完全自定义主题风格。\n *\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <div class=\"c-chat\">\n <!-- ===== 联系人侧栏 ===== -->\n <aside\n v-if=\"mergedProps.showContacts && contactList.length\"\n class=\"c-chat__sidebar\"\n >\n <div class=\"c-chat__sidebar-header\">\n <C_Icon\n name=\"mdi:chat-outline\"\n :size=\"20\"\n />\n 会话\n </div>\n\n <!-- 搜索框 -->\n <div class=\"c-chat__search\">\n <NInput\n v-model:value=\"searchKeyword\"\n placeholder=\"搜索联系人\"\n clearable\n size=\"small\"\n >\n <template #prefix>\n <C_Icon\n name=\"mdi:magnify\"\n :size=\"16\"\n />\n </template>\n </NInput>\n </div>\n\n <!-- 联系人列表 -->\n <div class=\"c-chat__contact-list\">\n <div\n v-for=\"contact in filteredContacts\"\n :key=\"contact.id\"\n class=\"c-chat__contact\"\n :class=\"{ 'is-active': contact.id === currentId }\"\n @click=\"handleSelectContact(contact.id)\"\n >\n <div class=\"c-chat__contact-avatar\">\n <img\n v-if=\"contact.avatar\"\n :src=\"contact.avatar\"\n :alt=\"contact.name\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ contact.name.charAt(0) }}\n </div>\n <span\n v-if=\"contact.online\"\n class=\"c-chat__online-dot\"\n />\n </div>\n\n <div class=\"c-chat__contact-info\">\n <div class=\"c-chat__contact-name\">\n <span>{{ contact.name }}</span>\n <span\n v-if=\"contact.lastTime\"\n class=\"c-chat__contact-time\"\n >\n {{ formatContactTime(contact.lastTime) }}\n </span>\n </div>\n <div\n v-if=\"contact.lastMessage\"\n class=\"c-chat__contact-last\"\n >\n {{ contact.lastMessage }}\n </div>\n </div>\n\n <span\n v-if=\"contact.unread\"\n class=\"c-chat__unread\"\n >\n {{ contact.unread > 99 ? '99+' : contact.unread }}\n </span>\n </div>\n </div>\n </aside>\n\n <!-- ===== 主聊天区域 ===== -->\n <div\n v-if=\"currentContact || !mergedProps.showContacts\"\n class=\"c-chat__main\"\n >\n <!-- 顶栏 -->\n <div class=\"c-chat__header\">\n <slot name=\"header\">\n <span>{{ currentContact?.name || mergedProps.title }}</span>\n <span\n v-if=\"currentContact?.online\"\n class=\"c-chat__header-status\"\n >\n 在线\n </span>\n </slot>\n </div>\n\n <!-- 消息列表 -->\n <div\n ref=\"messagesRef\"\n class=\"c-chat__messages\"\n @scroll=\"handleMessagesScroll\"\n >\n <!-- 加载更多 -->\n <div\n v-if=\"mergedProps.loadingHistory\"\n class=\"c-chat__load-more\"\n >\n <NSpin size=\"small\" />\n </div>\n\n <!-- 消息为空 -->\n <div\n v-if=\"!messageList.length && !mergedProps.loadingHistory\"\n class=\"c-chat__empty\"\n >\n 暂无消息,发送第一条吧\n </div>\n\n <!-- 消息列表 -->\n <template\n v-for=\"(msg, idx) in messageList\"\n :key=\"msg.id\"\n >\n <!-- 时间分割 -->\n <div\n v-if=\"shouldShowTimeDivider(msg, idx)\"\n class=\"c-chat__time-divider\"\n >\n {{ formatMessageTime(msg.timestamp) }}\n </div>\n\n <!-- 消息条目 -->\n <div\n class=\"c-chat__msg\"\n :class=\"`is-${msg.sender}`\"\n >\n <!-- 头像 -->\n <div\n v-if=\"msg.sender !== 'system'\"\n class=\"c-chat__msg-avatar\"\n >\n <img\n v-if=\"getAvatar(msg)\"\n :src=\"getAvatar(msg)\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ getUsername(msg).charAt(0) }}\n </div>\n </div>\n\n <!-- 消息体 -->\n <div class=\"c-chat__msg-body\">\n <span\n v-if=\"msg.sender === 'other' && msg.username\"\n class=\"c-chat__msg-username\"\n >\n {{ msg.username }}\n </span>\n\n <!-- 文本消息 -->\n <div\n v-if=\"msg.type === 'text' || msg.type === 'system'\"\n class=\"c-chat__bubble\"\n >\n {{ msg.content }}\n </div>\n\n <!-- 图片消息 -->\n <img\n v-else-if=\"msg.type === 'image'\"\n :src=\"msg.content\"\n class=\"c-chat__msg-image\"\n @click=\"emit('image-preview', msg.content)\"\n />\n\n <!-- 文件消息 -->\n <div\n v-else-if=\"msg.type === 'file'\"\n class=\"c-chat__msg-file\"\n @click=\"emit('file-click', msg)\"\n >\n <C_Icon\n name=\"mdi:file-document-outline\"\n :size=\"28\"\n />\n <div class=\"c-chat__file-info\">\n <span class=\"c-chat__file-name\">{{\n msg.fileName || '文件'\n }}</span>\n <span\n v-if=\"msg.fileSize\"\n class=\"c-chat__file-size\"\n >\n {{ formatFileSize(msg.fileSize) }}\n </span>\n </div>\n </div>\n\n <!-- 时间戳 -->\n <span\n v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\n class=\"c-chat__msg-time\"\n >\n {{ formatTime(msg.timestamp) }}\n </span>\n\n <!-- 发送状态 -->\n <span\n v-if=\"msg.sender === 'self' && msg.status\"\n class=\"c-chat__msg-status\"\n :class=\"`is-${msg.status}`\"\n @click=\"msg.status === 'failed' && emit('resend', msg)\"\n >\n {{\n msg.status === 'sending'\n ? '发送中...'\n : msg.status === 'failed'\n ? '发送失败,点击重试'\n : ''\n }}\n </span>\n </div>\n </div>\n </template>\n </div>\n\n <!-- 输入区域 -->\n <div class=\"c-chat__input-area\">\n <div class=\"c-chat__input-actions\">\n <slot name=\"input-actions\">\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('emoji-click')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:emoticon-happy-outline\"\n :size=\"18\"\n />\n </template>\n </NButton>\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('file-upload')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:paperclip\"\n :size=\"18\"\n />\n </template>\n </NButton>\n </slot>\n </div>\n\n <div class=\"c-chat__input-wrap\">\n <NInput\n v-model:value=\"inputText\"\n :placeholder=\"mergedProps.placeholder\"\n type=\"textarea\"\n :autosize=\"{ minRows: 1, maxRows: 4 }\"\n @keydown.enter.exact.prevent=\"handleSend\"\n />\n </div>\n\n <NButton\n v-if=\"mergedProps.showSendBtn\"\n type=\"primary\"\n :disabled=\"!inputText.trim()\"\n class=\"c-chat__send-btn\"\n @click=\"handleSend\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:send\"\n :size=\"16\"\n />\n </template>\n </NButton>\n </div>\n </div>\n\n <!-- ===== 未选中联系人空态 ===== -->\n <div\n v-else\n class=\"c-chat__main c-chat__no-chat\"\n >\n <C_Icon\n name=\"mdi:chat-processing-outline\"\n :size=\"48\"\n class=\"c-chat__no-chat-icon\"\n />\n <span>选择一个会话开始聊天</span>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref, watch } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CHAT_PROPS,\n type ChatProps,\n type ChatMessage,\n type ChatContact,\n } from './types'\n\n // ===== Props & Emits =====\n const props = withDefaults(defineProps<ChatProps>(), {\n contacts: () => [],\n messages: () => [],\n currentContactId: '',\n placeholder: DEFAULT_CHAT_PROPS.placeholder,\n showContacts: DEFAULT_CHAT_PROPS.showContacts,\n showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\n showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\n loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\n title: DEFAULT_CHAT_PROPS.title,\n selfAvatar: '',\n selfName: '',\n })\n\n const emit = defineEmits<{\n (e: 'send', content: string): void\n (e: 'select-contact', id: string): void\n (e: 'load-more'): void\n (e: 'image-preview', url: string): void\n (e: 'file-click', msg: ChatMessage): void\n (e: 'file-upload'): void\n (e: 'emoji-click'): void\n (e: 'resend', msg: ChatMessage): void\n }>()\n\n // ===== 合并 Props =====\n const mergedProps = computed(() => ({\n ...DEFAULT_CHAT_PROPS,\n ...props,\n }))\n\n // ===== 内部状态 =====\n const inputText = ref('')\n const searchKeyword = ref('')\n const messagesRef = ref<HTMLElement | null>(null)\n\n // ===== 计算属性 =====\n const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\n const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\n\n const currentId = computed(\n () => props.currentContactId || contactList.value[0]?.id || ''\n )\n\n const currentContact = computed(() =>\n contactList.value.find(c => c.id === currentId.value)\n )\n\n const filteredContacts = computed(() => {\n if (!searchKeyword.value) return contactList.value\n const kw = searchKeyword.value.toLowerCase()\n return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\n })\n\n // ===== 方法 =====\n const handleSelectContact = (id: string) => {\n emit('select-contact', id)\n }\n\n const handleSend = () => {\n const text = inputText.value.trim()\n if (!text) return\n emit('send', text)\n inputText.value = ''\n }\n\n /** 自动滚动到底部 */\n const scrollToBottom = () => {\n nextTick(() => {\n if (messagesRef.value) {\n messagesRef.value.scrollTop = messagesRef.value.scrollHeight\n }\n })\n }\n\n // 消息变化时自动滚动\n watch(\n () => props.messages?.length,\n () => scrollToBottom(),\n { flush: 'post' }\n )\n\n /** 滚动到顶部时触发加载更多 */\n const handleMessagesScroll = () => {\n if (\n messagesRef.value &&\n messagesRef.value.scrollTop === 0 &&\n !mergedProps.value.loadingHistory\n ) {\n emit('load-more')\n }\n }\n\n // ===== 工具函数 =====\n const getAvatar = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfAvatar || msg.avatar\n return msg.avatar\n }\n\n const getUsername = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\n return msg.username || '未知'\n }\n\n const formatTime = (ts: string | number) => {\n const d = new Date(ts)\n return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\n }\n\n const formatMessageTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const isToday =\n d.getFullYear() === now.getFullYear() &&\n d.getMonth() === now.getMonth() &&\n d.getDate() === now.getDate()\n if (isToday) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\n }\n\n const formatContactTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const diff = now.getTime() - d.getTime()\n if (diff < 60_000) return '刚刚'\n if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\n if (diff < 86_400_000) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()}`\n }\n\n const formatFileSize = (bytes: number) => {\n if (bytes < 1024) return `${bytes}B`\n if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\n return `${(bytes / 1048576).toFixed(1)}MB`\n }\n\n /** 是否显示时间分割线(两条消息间超过 5 分钟) */\n const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\n if (idx === 0) return true\n const prev = messageList.value[idx - 1]\n const curr = new Date(msg.timestamp).getTime()\n const prevTime = new Date(prev.timestamp).getTime()\n return curr - prevTime > 5 * 60 * 1000\n }\n\n // ===== 暴露方法 =====\n defineExpose({ scrollToBottom })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Description: C_Chat — 通用聊天组件\n *\n * 支持联系人列表 + 消息气泡 + 输入框,可用于 IM、客服、AI 对话等场景。\n * 通过 CSS 变量可完全自定义主题风格。\n *\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <div class=\"c-chat\">\n <!-- ===== 联系人侧栏 ===== -->\n <aside\n v-if=\"mergedProps.showContacts && contactList.length\"\n class=\"c-chat__sidebar\"\n >\n <div class=\"c-chat__sidebar-header\">\n <C_Icon\n name=\"mdi:chat-outline\"\n :size=\"20\"\n />\n 会话\n </div>\n\n <!-- 搜索框 -->\n <div class=\"c-chat__search\">\n <NInput\n v-model:value=\"searchKeyword\"\n placeholder=\"搜索联系人\"\n clearable\n size=\"small\"\n >\n <template #prefix>\n <C_Icon\n name=\"mdi:magnify\"\n :size=\"16\"\n />\n </template>\n </NInput>\n </div>\n\n <!-- 联系人列表 -->\n <div class=\"c-chat__contact-list\">\n <div\n v-for=\"contact in filteredContacts\"\n :key=\"contact.id\"\n class=\"c-chat__contact\"\n :class=\"{ 'is-active': contact.id === currentId }\"\n @click=\"handleSelectContact(contact.id)\"\n >\n <div class=\"c-chat__contact-avatar\">\n <img\n v-if=\"contact.avatar\"\n :src=\"contact.avatar\"\n :alt=\"contact.name\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ contact.name.charAt(0) }}\n </div>\n <span\n v-if=\"contact.online\"\n class=\"c-chat__online-dot\"\n />\n </div>\n\n <div class=\"c-chat__contact-info\">\n <div class=\"c-chat__contact-name\">\n <span>{{ contact.name }}</span>\n <span\n v-if=\"contact.lastTime\"\n class=\"c-chat__contact-time\"\n >\n {{ formatContactTime(contact.lastTime) }}\n </span>\n </div>\n <div\n v-if=\"contact.lastMessage\"\n class=\"c-chat__contact-last\"\n >\n {{ contact.lastMessage }}\n </div>\n </div>\n\n <span\n v-if=\"contact.unread\"\n class=\"c-chat__unread\"\n >\n {{ contact.unread > 99 ? '99+' : contact.unread }}\n </span>\n </div>\n </div>\n </aside>\n\n <!-- ===== 主聊天区域 ===== -->\n <div\n v-if=\"currentContact || !mergedProps.showContacts\"\n class=\"c-chat__main\"\n >\n <!-- 顶栏 -->\n <div class=\"c-chat__header\">\n <slot name=\"header\">\n <span>{{ currentContact?.name || mergedProps.title }}</span>\n <span\n v-if=\"currentContact?.online\"\n class=\"c-chat__header-status\"\n >\n 在线\n </span>\n </slot>\n </div>\n\n <!-- 消息列表 -->\n <div\n ref=\"messagesRef\"\n class=\"c-chat__messages\"\n @scroll=\"handleMessagesScroll\"\n >\n <!-- 加载更多 -->\n <div\n v-if=\"mergedProps.loadingHistory\"\n class=\"c-chat__load-more\"\n >\n <NSpin size=\"small\" />\n </div>\n\n <!-- 消息为空 -->\n <div\n v-if=\"!messageList.length && !mergedProps.loadingHistory\"\n class=\"c-chat__empty\"\n >\n 暂无消息,发送第一条吧\n </div>\n\n <!-- 消息列表 -->\n <template\n v-for=\"(msg, idx) in messageList\"\n :key=\"msg.id\"\n >\n <!-- 时间分割 -->\n <div\n v-if=\"shouldShowTimeDivider(msg, idx)\"\n class=\"c-chat__time-divider\"\n >\n {{ formatMessageTime(msg.timestamp) }}\n </div>\n\n <!-- 消息条目 -->\n <div\n class=\"c-chat__msg\"\n :class=\"`is-${msg.sender}`\"\n >\n <!-- 头像 -->\n <div\n v-if=\"msg.sender !== 'system'\"\n class=\"c-chat__msg-avatar\"\n >\n <img\n v-if=\"getAvatar(msg)\"\n :src=\"getAvatar(msg)\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ getUsername(msg).charAt(0) }}\n </div>\n </div>\n\n <!-- 消息体 -->\n <div class=\"c-chat__msg-body\">\n <span\n v-if=\"msg.sender === 'other' && msg.username\"\n class=\"c-chat__msg-username\"\n >\n {{ msg.username }}\n </span>\n\n <!-- 文本消息 -->\n <div\n v-if=\"msg.type === 'text' || msg.type === 'system'\"\n class=\"c-chat__bubble\"\n >\n {{ msg.content }}\n </div>\n\n <!-- 图片消息 -->\n <img\n v-else-if=\"msg.type === 'image'\"\n :src=\"msg.content\"\n class=\"c-chat__msg-image\"\n @click=\"emit('image-preview', msg.content)\"\n />\n\n <!-- 文件消息 -->\n <div\n v-else-if=\"msg.type === 'file'\"\n class=\"c-chat__msg-file\"\n @click=\"emit('file-click', msg)\"\n >\n <C_Icon\n name=\"mdi:file-document-outline\"\n :size=\"28\"\n />\n <div class=\"c-chat__file-info\">\n <span class=\"c-chat__file-name\">{{\n msg.fileName || '文件'\n }}</span>\n <span\n v-if=\"msg.fileSize\"\n class=\"c-chat__file-size\"\n >\n {{ formatFileSize(msg.fileSize) }}\n </span>\n </div>\n </div>\n\n <!-- 时间戳 -->\n <span\n v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\n class=\"c-chat__msg-time\"\n >\n {{ formatTime(msg.timestamp) }}\n </span>\n\n <!-- 发送状态 -->\n <span\n v-if=\"msg.sender === 'self' && msg.status\"\n class=\"c-chat__msg-status\"\n :class=\"`is-${msg.status}`\"\n @click=\"msg.status === 'failed' && emit('resend', msg)\"\n >\n {{\n msg.status === 'sending'\n ? '发送中...'\n : msg.status === 'failed'\n ? '发送失败,点击重试'\n : ''\n }}\n </span>\n </div>\n </div>\n </template>\n </div>\n\n <!-- 输入区域 -->\n <div class=\"c-chat__input-area\">\n <div class=\"c-chat__input-actions\">\n <slot name=\"input-actions\">\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('emoji-click')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:emoticon-happy-outline\"\n :size=\"18\"\n />\n </template>\n </NButton>\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('file-upload')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:paperclip\"\n :size=\"18\"\n />\n </template>\n </NButton>\n </slot>\n </div>\n\n <div class=\"c-chat__input-wrap\">\n <NInput\n v-model:value=\"inputText\"\n :placeholder=\"mergedProps.placeholder\"\n type=\"textarea\"\n :autosize=\"{ minRows: 1, maxRows: 4 }\"\n @keydown.enter.exact.prevent=\"handleSend\"\n />\n </div>\n\n <NButton\n v-if=\"mergedProps.showSendBtn\"\n type=\"primary\"\n :disabled=\"!inputText.trim()\"\n class=\"c-chat__send-btn\"\n @click=\"handleSend\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:send\"\n :size=\"16\"\n />\n </template>\n </NButton>\n </div>\n </div>\n\n <!-- ===== 未选中联系人空态 ===== -->\n <div\n v-else\n class=\"c-chat__main c-chat__no-chat\"\n >\n <C_Icon\n name=\"mdi:chat-processing-outline\"\n :size=\"48\"\n class=\"c-chat__no-chat-icon\"\n />\n <span>选择一个会话开始聊天</span>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref, watch } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CHAT_PROPS,\n type ChatProps,\n type ChatMessage,\n type ChatContact,\n } from './types'\n\n // ===== Props & Emits =====\n const props = withDefaults(defineProps<ChatProps>(), {\n contacts: () => [],\n messages: () => [],\n currentContactId: '',\n placeholder: DEFAULT_CHAT_PROPS.placeholder,\n showContacts: DEFAULT_CHAT_PROPS.showContacts,\n showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\n showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\n loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\n title: DEFAULT_CHAT_PROPS.title,\n selfAvatar: '',\n selfName: '',\n })\n\n const emit = defineEmits<{\n (e: 'send', content: string): void\n (e: 'select-contact', id: string): void\n (e: 'load-more'): void\n (e: 'image-preview', url: string): void\n (e: 'file-click', msg: ChatMessage): void\n (e: 'file-upload'): void\n (e: 'emoji-click'): void\n (e: 'resend', msg: ChatMessage): void\n }>()\n\n // ===== 合并 Props =====\n const mergedProps = computed(() => ({\n ...DEFAULT_CHAT_PROPS,\n ...props,\n }))\n\n // ===== 内部状态 =====\n const inputText = ref('')\n const searchKeyword = ref('')\n const messagesRef = ref<HTMLElement | null>(null)\n\n // ===== 计算属性 =====\n const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\n const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\n\n const currentId = computed(\n () => props.currentContactId || contactList.value[0]?.id || ''\n )\n\n const currentContact = computed(() =>\n contactList.value.find(c => c.id === currentId.value)\n )\n\n const filteredContacts = computed(() => {\n if (!searchKeyword.value) return contactList.value\n const kw = searchKeyword.value.toLowerCase()\n return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\n })\n\n // ===== 方法 =====\n const handleSelectContact = (id: string) => {\n emit('select-contact', id)\n }\n\n const handleSend = () => {\n const text = inputText.value.trim()\n if (!text) return\n emit('send', text)\n inputText.value = ''\n }\n\n /** 自动滚动到底部 */\n const scrollToBottom = () => {\n nextTick(() => {\n if (messagesRef.value) {\n messagesRef.value.scrollTop = messagesRef.value.scrollHeight\n }\n })\n }\n\n // 消息变化时自动滚动\n watch(\n () => props.messages?.length,\n () => scrollToBottom(),\n { flush: 'post' }\n )\n\n /** 滚动到顶部时触发加载更多 */\n const handleMessagesScroll = () => {\n if (\n messagesRef.value &&\n messagesRef.value.scrollTop === 0 &&\n !mergedProps.value.loadingHistory\n ) {\n emit('load-more')\n }\n }\n\n // ===== 工具函数 =====\n const getAvatar = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfAvatar || msg.avatar\n return msg.avatar\n }\n\n const getUsername = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\n return msg.username || '未知'\n }\n\n const formatTime = (ts: string | number) => {\n const d = new Date(ts)\n return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\n }\n\n const formatMessageTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const isToday =\n d.getFullYear() === now.getFullYear() &&\n d.getMonth() === now.getMonth() &&\n d.getDate() === now.getDate()\n if (isToday) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\n }\n\n const formatContactTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const diff = now.getTime() - d.getTime()\n if (diff < 60_000) return '刚刚'\n if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\n if (diff < 86_400_000) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()}`\n }\n\n const formatFileSize = (bytes: number) => {\n if (bytes < 1024) return `${bytes}B`\n if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\n return `${(bytes / 1048576).toFixed(1)}MB`\n }\n\n /** 是否显示时间分割线(两条消息间超过 5 分钟) */\n const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\n if (idx === 0) return true\n const prev = messageList.value[idx - 1]\n const curr = new Date(msg.timestamp).getTime()\n const prevTime = new Date(prev.timestamp).getTime()\n return curr - prevTime > 5 * 60 * 1000\n }\n\n // ===== 暴露方法 =====\n defineExpose({ scrollToBottom })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","<!--\n * @Description: C_Chat — 通用聊天组件\n *\n * 支持联系人列表 + 消息气泡 + 输入框,可用于 IM、客服、AI 对话等场景。\n * 通过 CSS 变量可完全自定义主题风格。\n *\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <div class=\"c-chat\">\n <!-- ===== 联系人侧栏 ===== -->\n <aside\n v-if=\"mergedProps.showContacts && contactList.length\"\n class=\"c-chat__sidebar\"\n >\n <div class=\"c-chat__sidebar-header\">\n <C_Icon\n name=\"mdi:chat-outline\"\n :size=\"20\"\n />\n 会话\n </div>\n\n <!-- 搜索框 -->\n <div class=\"c-chat__search\">\n <NInput\n v-model:value=\"searchKeyword\"\n placeholder=\"搜索联系人\"\n clearable\n size=\"small\"\n >\n <template #prefix>\n <C_Icon\n name=\"mdi:magnify\"\n :size=\"16\"\n />\n </template>\n </NInput>\n </div>\n\n <!-- 联系人列表 -->\n <div class=\"c-chat__contact-list\">\n <div\n v-for=\"contact in filteredContacts\"\n :key=\"contact.id\"\n class=\"c-chat__contact\"\n :class=\"{ 'is-active': contact.id === currentId }\"\n @click=\"handleSelectContact(contact.id)\"\n >\n <div class=\"c-chat__contact-avatar\">\n <img\n v-if=\"contact.avatar\"\n :src=\"contact.avatar\"\n :alt=\"contact.name\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ contact.name.charAt(0) }}\n </div>\n <span\n v-if=\"contact.online\"\n class=\"c-chat__online-dot\"\n />\n </div>\n\n <div class=\"c-chat__contact-info\">\n <div class=\"c-chat__contact-name\">\n <span>{{ contact.name }}</span>\n <span\n v-if=\"contact.lastTime\"\n class=\"c-chat__contact-time\"\n >\n {{ formatContactTime(contact.lastTime) }}\n </span>\n </div>\n <div\n v-if=\"contact.lastMessage\"\n class=\"c-chat__contact-last\"\n >\n {{ contact.lastMessage }}\n </div>\n </div>\n\n <span\n v-if=\"contact.unread\"\n class=\"c-chat__unread\"\n >\n {{ contact.unread > 99 ? '99+' : contact.unread }}\n </span>\n </div>\n </div>\n </aside>\n\n <!-- ===== 主聊天区域 ===== -->\n <div\n v-if=\"currentContact || !mergedProps.showContacts\"\n class=\"c-chat__main\"\n >\n <!-- 顶栏 -->\n <div class=\"c-chat__header\">\n <slot name=\"header\">\n <span>{{ currentContact?.name || mergedProps.title }}</span>\n <span\n v-if=\"currentContact?.online\"\n class=\"c-chat__header-status\"\n >\n 在线\n </span>\n </slot>\n </div>\n\n <!-- 消息列表 -->\n <div\n ref=\"messagesRef\"\n class=\"c-chat__messages\"\n @scroll=\"handleMessagesScroll\"\n >\n <!-- 加载更多 -->\n <div\n v-if=\"mergedProps.loadingHistory\"\n class=\"c-chat__load-more\"\n >\n <NSpin size=\"small\" />\n </div>\n\n <!-- 消息为空 -->\n <div\n v-if=\"!messageList.length && !mergedProps.loadingHistory\"\n class=\"c-chat__empty\"\n >\n 暂无消息,发送第一条吧\n </div>\n\n <!-- 消息列表 -->\n <template\n v-for=\"(msg, idx) in messageList\"\n :key=\"msg.id\"\n >\n <!-- 时间分割 -->\n <div\n v-if=\"shouldShowTimeDivider(msg, idx)\"\n class=\"c-chat__time-divider\"\n >\n {{ formatMessageTime(msg.timestamp) }}\n </div>\n\n <!-- 消息条目 -->\n <div\n class=\"c-chat__msg\"\n :class=\"`is-${msg.sender}`\"\n >\n <!-- 头像 -->\n <div\n v-if=\"msg.sender !== 'system'\"\n class=\"c-chat__msg-avatar\"\n >\n <img\n v-if=\"getAvatar(msg)\"\n :src=\"getAvatar(msg)\"\n class=\"c-chat__avatar\"\n />\n <div\n v-else\n class=\"c-chat__avatar-fallback\"\n >\n {{ getUsername(msg).charAt(0) }}\n </div>\n </div>\n\n <!-- 消息体 -->\n <div class=\"c-chat__msg-body\">\n <span\n v-if=\"msg.sender === 'other' && msg.username\"\n class=\"c-chat__msg-username\"\n >\n {{ msg.username }}\n </span>\n\n <!-- 文本消息 -->\n <div\n v-if=\"msg.type === 'text' || msg.type === 'system'\"\n class=\"c-chat__bubble\"\n >\n {{ msg.content }}\n </div>\n\n <!-- 图片消息 -->\n <img\n v-else-if=\"msg.type === 'image'\"\n :src=\"msg.content\"\n class=\"c-chat__msg-image\"\n @click=\"emit('image-preview', msg.content)\"\n />\n\n <!-- 文件消息 -->\n <div\n v-else-if=\"msg.type === 'file'\"\n class=\"c-chat__msg-file\"\n @click=\"emit('file-click', msg)\"\n >\n <C_Icon\n name=\"mdi:file-document-outline\"\n :size=\"28\"\n />\n <div class=\"c-chat__file-info\">\n <span class=\"c-chat__file-name\">{{\n msg.fileName || '文件'\n }}</span>\n <span\n v-if=\"msg.fileSize\"\n class=\"c-chat__file-size\"\n >\n {{ formatFileSize(msg.fileSize) }}\n </span>\n </div>\n </div>\n\n <!-- 时间戳 -->\n <span\n v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\n class=\"c-chat__msg-time\"\n >\n {{ formatTime(msg.timestamp) }}\n </span>\n\n <!-- 发送状态 -->\n <span\n v-if=\"msg.sender === 'self' && msg.status\"\n class=\"c-chat__msg-status\"\n :class=\"`is-${msg.status}`\"\n @click=\"msg.status === 'failed' && emit('resend', msg)\"\n >\n {{\n msg.status === 'sending'\n ? '发送中...'\n : msg.status === 'failed'\n ? '发送失败,点击重试'\n : ''\n }}\n </span>\n </div>\n </div>\n </template>\n </div>\n\n <!-- 输入区域 -->\n <div class=\"c-chat__input-area\">\n <div class=\"c-chat__input-actions\">\n <slot name=\"input-actions\">\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('emoji-click')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:emoticon-happy-outline\"\n :size=\"18\"\n />\n </template>\n </NButton>\n <NButton\n quaternary\n circle\n size=\"small\"\n @click=\"emit('file-upload')\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:paperclip\"\n :size=\"18\"\n />\n </template>\n </NButton>\n </slot>\n </div>\n\n <div class=\"c-chat__input-wrap\">\n <NInput\n v-model:value=\"inputText\"\n :placeholder=\"mergedProps.placeholder\"\n type=\"textarea\"\n :autosize=\"{ minRows: 1, maxRows: 4 }\"\n @keydown.enter.exact.prevent=\"handleSend\"\n />\n </div>\n\n <NButton\n v-if=\"mergedProps.showSendBtn\"\n type=\"primary\"\n :disabled=\"!inputText.trim()\"\n class=\"c-chat__send-btn\"\n @click=\"handleSend\"\n >\n <template #icon>\n <C_Icon\n name=\"mdi:send\"\n :size=\"16\"\n />\n </template>\n </NButton>\n </div>\n </div>\n\n <!-- ===== 未选中联系人空态 ===== -->\n <div\n v-else\n class=\"c-chat__main c-chat__no-chat\"\n >\n <C_Icon\n name=\"mdi:chat-processing-outline\"\n :size=\"48\"\n class=\"c-chat__no-chat-icon\"\n />\n <span>选择一个会话开始聊天</span>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref, watch } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CHAT_PROPS,\n type ChatProps,\n type ChatMessage,\n type ChatContact,\n } from './types'\n\n // ===== Props & Emits =====\n const props = withDefaults(defineProps<ChatProps>(), {\n contacts: () => [],\n messages: () => [],\n currentContactId: '',\n placeholder: DEFAULT_CHAT_PROPS.placeholder,\n showContacts: DEFAULT_CHAT_PROPS.showContacts,\n showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\n showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\n loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\n title: DEFAULT_CHAT_PROPS.title,\n selfAvatar: '',\n selfName: '',\n })\n\n const emit = defineEmits<{\n (e: 'send', content: string): void\n (e: 'select-contact', id: string): void\n (e: 'load-more'): void\n (e: 'image-preview', url: string): void\n (e: 'file-click', msg: ChatMessage): void\n (e: 'file-upload'): void\n (e: 'emoji-click'): void\n (e: 'resend', msg: ChatMessage): void\n }>()\n\n // ===== 合并 Props =====\n const mergedProps = computed(() => ({\n ...DEFAULT_CHAT_PROPS,\n ...props,\n }))\n\n // ===== 内部状态 =====\n const inputText = ref('')\n const searchKeyword = ref('')\n const messagesRef = ref<HTMLElement | null>(null)\n\n // ===== 计算属性 =====\n const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\n const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\n\n const currentId = computed(\n () => props.currentContactId || contactList.value[0]?.id || ''\n )\n\n const currentContact = computed(() =>\n contactList.value.find(c => c.id === currentId.value)\n )\n\n const filteredContacts = computed(() => {\n if (!searchKeyword.value) return contactList.value\n const kw = searchKeyword.value.toLowerCase()\n return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\n })\n\n // ===== 方法 =====\n const handleSelectContact = (id: string) => {\n emit('select-contact', id)\n }\n\n const handleSend = () => {\n const text = inputText.value.trim()\n if (!text) return\n emit('send', text)\n inputText.value = ''\n }\n\n /** 自动滚动到底部 */\n const scrollToBottom = () => {\n nextTick(() => {\n if (messagesRef.value) {\n messagesRef.value.scrollTop = messagesRef.value.scrollHeight\n }\n })\n }\n\n // 消息变化时自动滚动\n watch(\n () => props.messages?.length,\n () => scrollToBottom(),\n { flush: 'post' }\n )\n\n /** 滚动到顶部时触发加载更多 */\n const handleMessagesScroll = () => {\n if (\n messagesRef.value &&\n messagesRef.value.scrollTop === 0 &&\n !mergedProps.value.loadingHistory\n ) {\n emit('load-more')\n }\n }\n\n // ===== 工具函数 =====\n const getAvatar = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfAvatar || msg.avatar\n return msg.avatar\n }\n\n const getUsername = (msg: ChatMessage) => {\n if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\n return msg.username || '未知'\n }\n\n const formatTime = (ts: string | number) => {\n const d = new Date(ts)\n return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\n }\n\n const formatMessageTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const isToday =\n d.getFullYear() === now.getFullYear() &&\n d.getMonth() === now.getMonth() &&\n d.getDate() === now.getDate()\n if (isToday) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\n }\n\n const formatContactTime = (ts: string | number) => {\n const d = new Date(ts)\n const now = new Date()\n const diff = now.getTime() - d.getTime()\n if (diff < 60_000) return '刚刚'\n if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\n if (diff < 86_400_000) return formatTime(ts)\n return `${d.getMonth() + 1}/${d.getDate()}`\n }\n\n const formatFileSize = (bytes: number) => {\n if (bytes < 1024) return `${bytes}B`\n if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\n return `${(bytes / 1048576).toFixed(1)}MB`\n }\n\n /** 是否显示时间分割线(两条消息间超过 5 分钟) */\n const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\n if (idx === 0) return true\n const prev = messageList.value[idx - 1]\n const curr = new Date(msg.timestamp).getTime()\n const prevTime = new Date(prev.timestamp).getTime()\n return curr - prevTime > 5 * 60 * 1000\n }\n\n // ===== 暴露方法 =====\n defineExpose({ scrollToBottom })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n"],"mappings":"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"}
|
package/dist/C_City.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index9.vue.js";
|
|
2
2
|
export { _default as C_City };
|
package/dist/C_City.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index9.vue.js";
|
|
2
2
|
export { _default as C_City };
|
package/dist/C_Code.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index10.vue.js";
|
|
2
2
|
export { _default as C_Code };
|
package/dist/C_Code.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index10.vue.js";
|
|
2
2
|
export { _default as C_Code };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_ContextMenu-B3Cgz_wJ.css","names":[],"sources":["../src/components/C_ContextMenu/index.vue?vue&type=style&index=0&scoped=cdd4d8bb&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-context-menu[data-v-cdd4d8bb] {\n --ctx-bg: var(--card-color);\n --ctx-bg-blur: 12px;\n --ctx-border: var(--border-color);\n --ctx-radius: 10px;\n --ctx-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);\n --ctx-padding: 6px;\n --ctx-text-primary: var(--app-text-primary);\n --ctx-text-secondary: var(--text-color-3);\n --ctx-text-danger: #d03050;\n --ctx-text-disabled: var(--text-color-3);\n --ctx-item-height: 32px;\n --ctx-item-padding: 0 12px;\n --ctx-item-radius: 6px;\n --ctx-item-hover-bg: color-mix(in srgb, var(--primary-color) 8%, transparent);\n --ctx-item-active-bg: color-mix(in srgb, var(--primary-color) 14%, transparent);\n --ctx-icon-size: 16px;\n --ctx-icon-gap: 10px;\n --ctx-shortcut-color: var(--text-color-3);\n --ctx-divider-color: var(--border-color);\n --ctx-divider-margin: 4px 8px;\n position: fixed;\n padding: var(--ctx-padding);\n background: var(--ctx-bg);\n backdrop-filter: blur(var(--ctx-bg-blur));\n border: 1px solid var(--ctx-border);\n border-radius: var(--ctx-radius);\n box-shadow: var(--ctx-shadow);\n color: var(--ctx-text-primary);\n font-size: 13px;\n user-select: none;\n outline: none;\n}\n.c-context-menu__item[data-v-cdd4d8bb] {\n position: relative;\n display: flex;\n align-items: center;\n height: var(--ctx-item-height);\n padding: var(--ctx-item-padding);\n border-radius: var(--ctx-item-radius);\n cursor: pointer;\n transition: background 0.15s;\n white-space: nowrap;\n gap: var(--ctx-icon-gap);\n}\n.c-context-menu__item[data-v-cdd4d8bb]:hover {\n background: var(--ctx-item-hover-bg);\n}\n.c-context-menu__item[data-v-cdd4d8bb]:active {\n background: var(--ctx-item-active-bg);\n}\n.c-context-menu__item.is-disabled[data-v-cdd4d8bb] {\n color: var(--ctx-text-disabled);\n cursor: not-allowed;\n pointer-events: none;\n}\n.c-context-menu__item.is-danger[data-v-cdd4d8bb] {\n color: var(--ctx-text-danger);\n}\n.c-context-menu__item.is-danger[data-v-cdd4d8bb]:hover {\n background: color-mix(in srgb, #d03050 12%, transparent);\n}\n.c-context-menu__icon[data-v-cdd4d8bb] {\n flex-shrink: 0;\n width: var(--ctx-icon-size);\n height: var(--ctx-icon-size);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--ctx-icon-size);\n}\n.c-context-menu__label[data-v-cdd4d8bb] {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.c-context-menu__shortcut[data-v-cdd4d8bb] {\n flex-shrink: 0;\n margin-left: 24px;\n font-size: 11px;\n color: var(--ctx-shortcut-color);\n font-family: \"JetBrains Mono\", \"Fira Code\", monospace;\n}\n.c-context-menu__arrow[data-v-cdd4d8bb] {\n flex-shrink: 0;\n margin-left: 8px;\n font-size: 12px;\n color: var(--ctx-text-secondary);\n transition: transform 0.15s;\n}\n.c-context-menu__divider[data-v-cdd4d8bb] {\n height: 1px;\n margin: var(--ctx-divider-margin);\n background: var(--ctx-divider-color);\n}\n.c-context-menu__submenu[data-v-cdd4d8bb] {\n position: absolute;\n top: -6px;\n}\n.c-context-menu__submenu.is-right[data-v-cdd4d8bb] {\n left: 100%;\n margin-left: 4px;\n}\n.c-context-menu__submenu.is-left[data-v-cdd4d8bb] {\n right: 100%;\n margin-right: 4px;\n}\n.c-context-menu-overlay[data-v-cdd4d8bb] {\n position: fixed;\n inset: 0;\n z-index: 9998;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_ContextMenu-u1LixF3_.css","names":[],"sources":["../src/components/C_ContextMenu/index.vue?vue&type=style&index=0&scoped=cdd4d8bb&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.c-context-menu[data-v-cdd4d8bb] {\n --ctx-bg: var(--card-color);\n --ctx-bg-blur: 12px;\n --ctx-border: var(--border-color);\n --ctx-radius: 10px;\n --ctx-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);\n --ctx-padding: 6px;\n --ctx-text-primary: var(--app-text-primary);\n --ctx-text-secondary: var(--text-color-3);\n --ctx-text-danger: #d03050;\n --ctx-text-disabled: var(--text-color-3);\n --ctx-item-height: 32px;\n --ctx-item-padding: 0 12px;\n --ctx-item-radius: 6px;\n --ctx-item-hover-bg: color-mix(in srgb, var(--primary-color) 8%, transparent);\n --ctx-item-active-bg: color-mix(in srgb, var(--primary-color) 14%, transparent);\n --ctx-icon-size: 16px;\n --ctx-icon-gap: 10px;\n --ctx-shortcut-color: var(--text-color-3);\n --ctx-divider-color: var(--border-color);\n --ctx-divider-margin: 4px 8px;\n position: fixed;\n padding: var(--ctx-padding);\n background: var(--ctx-bg);\n backdrop-filter: blur(var(--ctx-bg-blur));\n border: 1px solid var(--ctx-border);\n border-radius: var(--ctx-radius);\n box-shadow: var(--ctx-shadow);\n color: var(--ctx-text-primary);\n font-size: 13px;\n user-select: none;\n outline: none;\n}\n.c-context-menu__item[data-v-cdd4d8bb] {\n position: relative;\n display: flex;\n align-items: center;\n height: var(--ctx-item-height);\n padding: var(--ctx-item-padding);\n border-radius: var(--ctx-item-radius);\n cursor: pointer;\n transition: background 0.15s;\n white-space: nowrap;\n gap: var(--ctx-icon-gap);\n}\n.c-context-menu__item[data-v-cdd4d8bb]:hover {\n background: var(--ctx-item-hover-bg);\n}\n.c-context-menu__item[data-v-cdd4d8bb]:active {\n background: var(--ctx-item-active-bg);\n}\n.c-context-menu__item.is-disabled[data-v-cdd4d8bb] {\n color: var(--ctx-text-disabled);\n cursor: not-allowed;\n pointer-events: none;\n}\n.c-context-menu__item.is-danger[data-v-cdd4d8bb] {\n color: var(--ctx-text-danger);\n}\n.c-context-menu__item.is-danger[data-v-cdd4d8bb]:hover {\n background: color-mix(in srgb, #d03050 12%, transparent);\n}\n.c-context-menu__icon[data-v-cdd4d8bb] {\n flex-shrink: 0;\n width: var(--ctx-icon-size);\n height: var(--ctx-icon-size);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--ctx-icon-size);\n}\n.c-context-menu__label[data-v-cdd4d8bb] {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.c-context-menu__shortcut[data-v-cdd4d8bb] {\n flex-shrink: 0;\n margin-left: 24px;\n font-size: 11px;\n color: var(--ctx-shortcut-color);\n font-family: \"JetBrains Mono\", \"Fira Code\", monospace;\n}\n.c-context-menu__arrow[data-v-cdd4d8bb] {\n flex-shrink: 0;\n margin-left: 8px;\n font-size: 12px;\n color: var(--ctx-text-secondary);\n transition: transform 0.15s;\n}\n.c-context-menu__divider[data-v-cdd4d8bb] {\n height: 1px;\n margin: var(--ctx-divider-margin);\n background: var(--ctx-divider-color);\n}\n.c-context-menu__submenu[data-v-cdd4d8bb] {\n position: absolute;\n top: -6px;\n}\n.c-context-menu__submenu.is-right[data-v-cdd4d8bb] {\n left: 100%;\n margin-left: 4px;\n}\n.c-context-menu__submenu.is-left[data-v-cdd4d8bb] {\n right: 100%;\n margin-right: 4px;\n}\n.c-context-menu-overlay[data-v-cdd4d8bb] {\n position: fixed;\n inset: 0;\n z-index: 9998;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./C_Icon.js`);const e=require(`./C_ContextMenu.js`);exports.C_ContextMenu=e.t,exports.DEFAULT_CONTEXT_MENU_PROPS=e.n;
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
/* unplugin-vue-components disabled */.c-context-menu[data-v-cdd4d8bb] {
|
|
2
|
+
--ctx-bg: var(--card-color);
|
|
3
|
+
--ctx-bg-blur: 12px;
|
|
4
|
+
--ctx-border: var(--border-color);
|
|
5
|
+
--ctx-radius: 10px;
|
|
6
|
+
--ctx-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
|
|
7
|
+
--ctx-padding: 6px;
|
|
8
|
+
--ctx-text-primary: var(--app-text-primary);
|
|
9
|
+
--ctx-text-secondary: var(--text-color-3);
|
|
10
|
+
--ctx-text-danger: #d03050;
|
|
11
|
+
--ctx-text-disabled: var(--text-color-3);
|
|
12
|
+
--ctx-item-height: 32px;
|
|
13
|
+
--ctx-item-padding: 0 12px;
|
|
14
|
+
--ctx-item-radius: 6px;
|
|
15
|
+
--ctx-item-hover-bg: color-mix(in srgb, var(--primary-color) 8%, transparent);
|
|
16
|
+
--ctx-item-active-bg: color-mix(in srgb, var(--primary-color) 14%, transparent);
|
|
17
|
+
--ctx-icon-size: 16px;
|
|
18
|
+
--ctx-icon-gap: 10px;
|
|
19
|
+
--ctx-shortcut-color: var(--text-color-3);
|
|
20
|
+
--ctx-divider-color: var(--border-color);
|
|
21
|
+
--ctx-divider-margin: 4px 8px;
|
|
22
|
+
position: fixed;
|
|
23
|
+
padding: var(--ctx-padding);
|
|
24
|
+
background: var(--ctx-bg);
|
|
25
|
+
backdrop-filter: blur(var(--ctx-bg-blur));
|
|
26
|
+
border: 1px solid var(--ctx-border);
|
|
27
|
+
border-radius: var(--ctx-radius);
|
|
28
|
+
box-shadow: var(--ctx-shadow);
|
|
29
|
+
color: var(--ctx-text-primary);
|
|
30
|
+
font-size: 13px;
|
|
31
|
+
user-select: none;
|
|
32
|
+
outline: none;
|
|
33
|
+
}
|
|
34
|
+
.c-context-menu__item[data-v-cdd4d8bb] {
|
|
35
|
+
position: relative;
|
|
36
|
+
display: flex;
|
|
37
|
+
align-items: center;
|
|
38
|
+
height: var(--ctx-item-height);
|
|
39
|
+
padding: var(--ctx-item-padding);
|
|
40
|
+
border-radius: var(--ctx-item-radius);
|
|
41
|
+
cursor: pointer;
|
|
42
|
+
transition: background 0.15s;
|
|
43
|
+
white-space: nowrap;
|
|
44
|
+
gap: var(--ctx-icon-gap);
|
|
45
|
+
}
|
|
46
|
+
.c-context-menu__item[data-v-cdd4d8bb]:hover {
|
|
47
|
+
background: var(--ctx-item-hover-bg);
|
|
48
|
+
}
|
|
49
|
+
.c-context-menu__item[data-v-cdd4d8bb]:active {
|
|
50
|
+
background: var(--ctx-item-active-bg);
|
|
51
|
+
}
|
|
52
|
+
.c-context-menu__item.is-disabled[data-v-cdd4d8bb] {
|
|
53
|
+
color: var(--ctx-text-disabled);
|
|
54
|
+
cursor: not-allowed;
|
|
55
|
+
pointer-events: none;
|
|
56
|
+
}
|
|
57
|
+
.c-context-menu__item.is-danger[data-v-cdd4d8bb] {
|
|
58
|
+
color: var(--ctx-text-danger);
|
|
59
|
+
}
|
|
60
|
+
.c-context-menu__item.is-danger[data-v-cdd4d8bb]:hover {
|
|
61
|
+
background: color-mix(in srgb, #d03050 12%, transparent);
|
|
62
|
+
}
|
|
63
|
+
.c-context-menu__icon[data-v-cdd4d8bb] {
|
|
64
|
+
flex-shrink: 0;
|
|
65
|
+
width: var(--ctx-icon-size);
|
|
66
|
+
height: var(--ctx-icon-size);
|
|
67
|
+
display: flex;
|
|
68
|
+
align-items: center;
|
|
69
|
+
justify-content: center;
|
|
70
|
+
font-size: var(--ctx-icon-size);
|
|
71
|
+
}
|
|
72
|
+
.c-context-menu__label[data-v-cdd4d8bb] {
|
|
73
|
+
flex: 1;
|
|
74
|
+
min-width: 0;
|
|
75
|
+
overflow: hidden;
|
|
76
|
+
text-overflow: ellipsis;
|
|
77
|
+
}
|
|
78
|
+
.c-context-menu__shortcut[data-v-cdd4d8bb] {
|
|
79
|
+
flex-shrink: 0;
|
|
80
|
+
margin-left: 24px;
|
|
81
|
+
font-size: 11px;
|
|
82
|
+
color: var(--ctx-shortcut-color);
|
|
83
|
+
font-family: "JetBrains Mono", "Fira Code", monospace;
|
|
84
|
+
}
|
|
85
|
+
.c-context-menu__arrow[data-v-cdd4d8bb] {
|
|
86
|
+
flex-shrink: 0;
|
|
87
|
+
margin-left: 8px;
|
|
88
|
+
font-size: 12px;
|
|
89
|
+
color: var(--ctx-text-secondary);
|
|
90
|
+
transition: transform 0.15s;
|
|
91
|
+
}
|
|
92
|
+
.c-context-menu__divider[data-v-cdd4d8bb] {
|
|
93
|
+
height: 1px;
|
|
94
|
+
margin: var(--ctx-divider-margin);
|
|
95
|
+
background: var(--ctx-divider-color);
|
|
96
|
+
}
|
|
97
|
+
.c-context-menu__submenu[data-v-cdd4d8bb] {
|
|
98
|
+
position: absolute;
|
|
99
|
+
top: -6px;
|
|
100
|
+
}
|
|
101
|
+
.c-context-menu__submenu.is-right[data-v-cdd4d8bb] {
|
|
102
|
+
left: 100%;
|
|
103
|
+
margin-left: 4px;
|
|
104
|
+
}
|
|
105
|
+
.c-context-menu__submenu.is-left[data-v-cdd4d8bb] {
|
|
106
|
+
right: 100%;
|
|
107
|
+
margin-right: 4px;
|
|
108
|
+
}
|
|
109
|
+
.c-context-menu-overlay[data-v-cdd4d8bb] {
|
|
110
|
+
position: fixed;
|
|
111
|
+
inset: 0;
|
|
112
|
+
z-index: 9998;
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
/*# sourceMappingURL=C_ContextMenu-B3Cgz_wJ.css.map*/
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import"./C_Icon2.js";import{n as e,t}from"./C_ContextMenu2.js";export{t as C_ContextMenu,e as DEFAULT_CONTEXT_MENU_PROPS};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_ContextMenu.js","names":[],"sources":["../src/components/C_ContextMenu/types.ts","../src/components/C_ContextMenu/index.vue","../src/components/C_ContextMenu/index.vue","../src/components/C_ContextMenu/index.vue"],"sourcesContent":["/**\n * @Description: 右键菜单组件类型定义\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n */\n\n/** 菜单项 */\nexport interface ContextMenuItem {\n /** 唯一标识 */\n key: string\n /** 菜单文字 */\n label: string\n /** 图标(Iconify 图标名) */\n icon?: string\n /** 快捷键标注文字(仅展示,不绑定) */\n shortcut?: string\n /** 是否禁用 */\n disabled?: boolean\n /** 是否隐藏 */\n hidden?: boolean\n /** 分割线(此项渲染为分割线,label 被忽略) */\n divider?: boolean\n /** 子菜单(支持无限嵌套) */\n children?: ContextMenuItem[]\n /** 自定义样式类 */\n className?: string\n /** 危险操作(红色高亮) */\n danger?: boolean\n}\n\n/** 组件 Props */\nexport interface ContextMenuProps {\n /** 菜单项列表 */\n items: ContextMenuItem[]\n /** 菜单最小宽度 */\n minWidth?: number\n /** 菜单最大宽度 */\n maxWidth?: number\n /** 子菜单展开方向 */\n subMenuPlacement?: 'right' | 'left'\n /** 点击菜单项后是否自动关闭 */\n autoClose?: boolean\n /** 是否禁用整个菜单 */\n disabled?: boolean\n /** 自定义 z-index */\n zIndex?: number\n}\n\n/** 默认 Props */\nexport const DEFAULT_CONTEXT_MENU_PROPS = {\n minWidth: 180,\n maxWidth: 280,\n subMenuPlacement: 'right' as const,\n autoClose: true,\n disabled: false,\n zIndex: 9999,\n}\n","/* unplugin-vue-components disabled */<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{t as e}from"./C_Icon2.js";import{t}from"./export-helper.js";import{Fragment as n,Teleport as r,computed as i,createBlock as a,createCommentVNode as o,createElementBlock as s,createElementVNode as c,createVNode as l,defineComponent as u,nextTick as d,normalizeClass as f,normalizeStyle as p,openBlock as m,ref as h,renderList as g,toDisplayString as _,withKeys as v,withModifiers as y}from"vue";const b={minWidth:180,maxWidth:280,subMenuPlacement:`right`,autoClose:!0,disabled:!1,zIndex:9999},x={key:0,class:`c-context-menu__divider`,role:`separator`},S=[`aria-disabled`,`onClick`,`onMouseenter`],C={key:0,class:`c-context-menu__icon`},w={class:`c-context-menu__label`},T={key:1,class:`c-context-menu__shortcut`},E={key:2,class:`c-context-menu__arrow`};var D=t(u({name:`C_ContextMenu`,__name:`index`,props:{items:{default:()=>[]},minWidth:{default:b.minWidth},maxWidth:{default:b.maxWidth},subMenuPlacement:{default:b.subMenuPlacement},autoClose:{type:Boolean,default:b.autoClose},disabled:{type:Boolean,default:b.disabled},zIndex:{default:b.zIndex}},emits:[`select`,`open`,`close`],setup(t,{expose:u,emit:b}){let O=t,k=b,A=h(!1),j=h({x:0,y:0}),M=h(),N=h(null),P=null,F=i(()=>O.items.filter(e=>!e.hidden)),I=i(()=>({left:`${j.value.x}px`,top:`${j.value.y}px`,minWidth:`${O.minWidth}px`,maxWidth:`${O.maxWidth}px`,zIndex:O.zIndex})),L=()=>{d(()=>{let e=M.value;if(!e)return;let t=e.getBoundingClientRect(),{innerWidth:n,innerHeight:r}=window;t.right>n&&(j.value.x=n-t.width-8),t.bottom>r&&(j.value.y=r-t.height-8),j.value.x<0&&(j.value.x=8),j.value.y<0&&(j.value.y=8)})},R=(e,t)=>{O.disabled||(j.value={x:e,y:t},A.value=!0,k(`open`,{x:e,y:t}),L(),d(()=>M.value?.focus()))},z=()=>{A.value=!1,N.value=null,k(`close`)},B=e=>{e.disabled||e.children?.length||(k(`select`,e),O.autoClose&&z())},V=e=>{P&&=(clearTimeout(P),null),e.children?.length&&!e.disabled?P=setTimeout(()=>{N.value=e.key},150):N.value=null},H=()=>{P&&=(clearTimeout(P),null),P=setTimeout(()=>{N.value=null},300)},U=e=>{k(`select`,e),O.autoClose&&z()};return u({open:R,close:z,visible:i(()=>A.value)}),(t,i)=>{let u=D;return m(),s(n,null,[o(` 遮罩层 `),(m(),a(r,{to:`body`},[A.value?(m(),s(`div`,{key:0,class:`c-context-menu-overlay`,style:p({zIndex:O.zIndex-1}),onClick:z,onContextmenu:y(z,[`prevent`])},null,36)):o(`v-if`,!0),o(` 菜单面板 `),A.value?(m(),s(`div`,{key:1,ref_key:`menuRef`,ref:M,class:`c-context-menu`,style:p(I.value),role:`menu`,tabindex:`-1`,onKeydown:v(z,[`escape`])},[(m(!0),s(n,null,g(F.value,t=>(m(),s(n,{key:t.key},[o(` 分割线 `),t.divider?(m(),s(`div`,x)):(m(),s(n,{key:1},[o(` 普通菜单项 `),c(`div`,{class:f([`c-context-menu__item`,{"is-disabled":t.disabled,"is-danger":t.danger}]),role:`menuitem`,"aria-disabled":t.disabled,onClick:e=>B(t),onMouseenter:e=>V(t),onMouseleave:H},[o(` 图标 `),t.icon?(m(),s(`span`,C,[l(e,{name:t.icon},null,8,[`name`])])):o(`v-if`,!0),o(` 文本 `),c(`span`,w,_(t.label),1),o(` 快捷键 `),t.shortcut?(m(),s(`span`,T,_(t.shortcut),1)):o(`v-if`,!0),o(` 子菜单箭头 `),t.children?.length?(m(),s(`span`,E,[l(e,{name:`mdi:chevron-right`})])):o(`v-if`,!0),o(` 子菜单(递归) `),t.children?.length&&N.value===t.key?(m(),a(u,{key:3,items:t.children,"min-width":O.minWidth,"max-width":O.maxWidth,"sub-menu-placement":O.subMenuPlacement,"auto-close":O.autoClose,"z-index":O.zIndex+1,class:f([`c-context-menu__submenu`,`is-${O.subMenuPlacement}`]),style:{position:`absolute`},onSelect:U},null,8,[`items`,`min-width`,`max-width`,`sub-menu-placement`,`auto-close`,`z-index`,`class`])):o(`v-if`,!0)],42,S)],2112))],64))),128))],36)):o(`v-if`,!0)]))],2112)}}}),[[`__scopeId`,`data-v-cdd4d8bb`]]);export{b as n,D as t};
|
|
2
|
+
//# sourceMappingURL=C_ContextMenu2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"C_ContextMenu2.js","names":[],"sources":["../src/components/C_ContextMenu/types.ts","../src/components/C_ContextMenu/index.vue","../src/components/C_ContextMenu/index.vue","../src/components/C_ContextMenu/index.vue"],"sourcesContent":["/**\n * @Description: 右键菜单组件类型定义\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n */\n\n/** 菜单项 */\nexport interface ContextMenuItem {\n /** 唯一标识 */\n key: string\n /** 菜单文字 */\n label: string\n /** 图标(Iconify 图标名) */\n icon?: string\n /** 快捷键标注文字(仅展示,不绑定) */\n shortcut?: string\n /** 是否禁用 */\n disabled?: boolean\n /** 是否隐藏 */\n hidden?: boolean\n /** 分割线(此项渲染为分割线,label 被忽略) */\n divider?: boolean\n /** 子菜单(支持无限嵌套) */\n children?: ContextMenuItem[]\n /** 自定义样式类 */\n className?: string\n /** 危险操作(红色高亮) */\n danger?: boolean\n}\n\n/** 组件 Props */\nexport interface ContextMenuProps {\n /** 菜单项列表 */\n items: ContextMenuItem[]\n /** 菜单最小宽度 */\n minWidth?: number\n /** 菜单最大宽度 */\n maxWidth?: number\n /** 子菜单展开方向 */\n subMenuPlacement?: 'right' | 'left'\n /** 点击菜单项后是否自动关闭 */\n autoClose?: boolean\n /** 是否禁用整个菜单 */\n disabled?: boolean\n /** 自定义 z-index */\n zIndex?: number\n}\n\n/** 默认 Props */\nexport const DEFAULT_CONTEXT_MENU_PROPS = {\n minWidth: 180,\n maxWidth: 280,\n subMenuPlacement: 'right' as const,\n autoClose: true,\n disabled: false,\n zIndex: 9999,\n}\n","/* unplugin-vue-components disabled */<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","/* unplugin-vue-components disabled */<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n","<!--\n * @Description: 右键菜单组件 — 声明式配置、快捷键标注、嵌套子菜单\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\n-->\n<template>\n <!-- 遮罩层 -->\n <Teleport to=\"body\">\n <div\n v-if=\"visible\"\n class=\"c-context-menu-overlay\"\n :style=\"{ zIndex: props.zIndex - 1 }\"\n @click=\"close\"\n @contextmenu.prevent=\"close\"\n />\n\n <!-- 菜单面板 -->\n <div\n v-if=\"visible\"\n ref=\"menuRef\"\n class=\"c-context-menu\"\n :style=\"menuStyle\"\n role=\"menu\"\n tabindex=\"-1\"\n @keydown.escape=\"close\"\n >\n <template\n v-for=\"item in visibleItems\"\n :key=\"item.key\"\n >\n <!-- 分割线 -->\n <div\n v-if=\"item.divider\"\n class=\"c-context-menu__divider\"\n role=\"separator\"\n />\n\n <!-- 普通菜单项 -->\n <div\n v-else\n :class=\"[\n 'c-context-menu__item',\n {\n 'is-disabled': item.disabled,\n 'is-danger': item.danger,\n },\n ]\"\n role=\"menuitem\"\n :aria-disabled=\"item.disabled\"\n @click=\"handleItemClick(item)\"\n @mouseenter=\"handleMouseEnter(item)\"\n @mouseleave=\"handleMouseLeave\"\n >\n <!-- 图标 -->\n <span\n v-if=\"item.icon\"\n class=\"c-context-menu__icon\"\n >\n <C_Icon :name=\"item.icon\" />\n </span>\n\n <!-- 文本 -->\n <span class=\"c-context-menu__label\">{{ item.label }}</span>\n\n <!-- 快捷键 -->\n <span\n v-if=\"item.shortcut\"\n class=\"c-context-menu__shortcut\"\n >\n {{ item.shortcut }}\n </span>\n\n <!-- 子菜单箭头 -->\n <span\n v-if=\"item.children?.length\"\n class=\"c-context-menu__arrow\"\n >\n <C_Icon name=\"mdi:chevron-right\" />\n </span>\n\n <!-- 子菜单(递归) -->\n <C_ContextMenu\n v-if=\"item.children?.length && activeSubKey === item.key\"\n :items=\"item.children\"\n :min-width=\"props.minWidth\"\n :max-width=\"props.maxWidth\"\n :sub-menu-placement=\"props.subMenuPlacement\"\n :auto-close=\"props.autoClose\"\n :z-index=\"props.zIndex + 1\"\n class=\"c-context-menu__submenu\"\n :class=\"`is-${props.subMenuPlacement}`\"\n :style=\"{ position: 'absolute' }\"\n @select=\"handleSubSelect\"\n />\n </div>\n </template>\n </div>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, ref } from 'vue'\n import C_Icon from '../C_Icon/index.vue'\n import {\n DEFAULT_CONTEXT_MENU_PROPS,\n type ContextMenuItem,\n type ContextMenuProps,\n } from './types'\n\n defineOptions({ name: 'C_ContextMenu' })\n\n const props = withDefaults(defineProps<ContextMenuProps>(), {\n items: () => [],\n minWidth: DEFAULT_CONTEXT_MENU_PROPS.minWidth,\n maxWidth: DEFAULT_CONTEXT_MENU_PROPS.maxWidth,\n subMenuPlacement: DEFAULT_CONTEXT_MENU_PROPS.subMenuPlacement,\n autoClose: DEFAULT_CONTEXT_MENU_PROPS.autoClose,\n disabled: DEFAULT_CONTEXT_MENU_PROPS.disabled,\n zIndex: DEFAULT_CONTEXT_MENU_PROPS.zIndex,\n })\n\n const emit = defineEmits<{\n (e: 'select', item: ContextMenuItem): void\n (e: 'open', position: { x: number; y: number }): void\n (e: 'close'): void\n }>()\n\n // ===== 状态 =====\n const visible = ref(false)\n const position = ref({ x: 0, y: 0 })\n const menuRef = ref<HTMLElement>()\n const activeSubKey = ref<string | null>(null)\n\n let subTimer: ReturnType<typeof setTimeout> | null = null\n\n // ===== 可见项 =====\n const visibleItems = computed(() => props.items.filter(item => !item.hidden))\n\n // ===== 菜单定位样式 =====\n const menuStyle = computed(() => ({\n left: `${position.value.x}px`,\n top: `${position.value.y}px`,\n minWidth: `${props.minWidth}px`,\n maxWidth: `${props.maxWidth}px`,\n zIndex: props.zIndex,\n }))\n\n // ===== 边界校正 =====\n const adjustPosition = () => {\n nextTick(() => {\n const el = menuRef.value\n if (!el) return\n const rect = el.getBoundingClientRect()\n const { innerWidth, innerHeight } = window\n\n if (rect.right > innerWidth) {\n position.value.x = innerWidth - rect.width - 8\n }\n if (rect.bottom > innerHeight) {\n position.value.y = innerHeight - rect.height - 8\n }\n if (position.value.x < 0) position.value.x = 8\n if (position.value.y < 0) position.value.y = 8\n })\n }\n\n // ===== 打开/关闭 =====\n const open = (x: number, y: number) => {\n if (props.disabled) return\n position.value = { x, y }\n visible.value = true\n emit('open', { x, y })\n adjustPosition()\n\n // 聚焦以支持 Escape 关闭\n nextTick(() => menuRef.value?.focus())\n }\n\n const close = () => {\n visible.value = false\n activeSubKey.value = null\n emit('close')\n }\n\n // ===== 菜单项点击 =====\n const handleItemClick = (item: ContextMenuItem) => {\n if (item.disabled) return\n if (item.children?.length) return // 有子菜单不触发\n\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 子菜单悬停 =====\n const handleMouseEnter = (item: ContextMenuItem) => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n if (item.children?.length && !item.disabled) {\n subTimer = setTimeout(() => {\n activeSubKey.value = item.key\n }, 150)\n } else {\n activeSubKey.value = null\n }\n }\n\n const handleMouseLeave = () => {\n if (subTimer) {\n clearTimeout(subTimer)\n subTimer = null\n }\n subTimer = setTimeout(() => {\n activeSubKey.value = null\n }, 300)\n }\n\n // ===== 子菜单选择向上冒泡 =====\n const handleSubSelect = (item: ContextMenuItem) => {\n emit('select', item)\n if (props.autoClose) close()\n }\n\n // ===== 暴露 API =====\n defineExpose({\n /** 在指定坐标打开菜单 */\n open,\n /** 关闭菜单 */\n close,\n /** 当前是否可见 */\n visible: computed(() => visible.value),\n })\n</script>\n\n<style scoped lang=\"scss\">\n @use './index.scss';\n</style>\n"],"mappings":"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"}
|
package/dist/C_Date.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index12.vue.js";
|
|
2
2
|
export { _default as C_Date };
|
package/dist/C_Date.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index12.vue.js";
|
|
2
2
|
export { _default as C_Date };
|
package/dist/C_Editor.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index13.vue.js";
|
|
2
2
|
export { _default as C_Editor };
|
package/dist/C_Editor.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as _default } from "./
|
|
1
|
+
import { t as _default } from "./index13.vue.js";
|
|
2
2
|
export { _default as C_Editor };
|
package/dist/C_Guide.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as _default, t as GuideStep } from "./
|
|
1
|
+
import { n as _default, t as GuideStep } from "./index14.vue.js";
|
|
2
2
|
export { _default as C_Guide, type GuideStep };
|
package/dist/C_Guide.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as _default, t as GuideStep } from "./
|
|
1
|
+
import { n as _default, t as GuideStep } from "./index14.vue.js";
|
|
2
2
|
export { _default as C_Guide, type GuideStep };
|
package/dist/C_Icon.d.cts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as _default, t as IconProps } from "./
|
|
1
|
+
import { n as _default, t as IconProps } from "./index15.vue.js";
|
|
2
2
|
export { _default as C_Icon, type IconProps };
|
package/dist/C_Icon.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as _default, t as IconProps } from "./
|
|
1
|
+
import { n as _default, t as IconProps } from "./index15.vue.js";
|
|
2
2
|
export { _default as C_Icon, type IconProps };
|