@robot-admin/naive-ui-components 0.6.10 → 0.6.12

package/dist/C_Chat.css

@@ -0,0 +1,395 @@
+/* unplugin-vue-components disabled *//* ─── CSS 变量（基于项目主题变量，自动适配明暗） ───────────────────────── */
+.c-chat[data-v-5e7f3fe9] {
+  --chat-bg: var(--card-color);
+  --chat-sidebar-bg: var(--body-color);
+  --chat-sidebar-width: 280px;
+  --chat-header-bg: var(--card-color);
+  --chat-header-height: 56px;
+  --chat-input-bg: var(--body-color);
+  --chat-input-height: 56px;
+  --chat-bubble-self: var(--primary-color);
+  --chat-bubble-other: var(--body-color);
+  --chat-bubble-system: transparent;
+  --chat-text-primary: var(--app-text-primary);
+  --chat-text-secondary: var(--text-color-3);
+  --chat-text-self: #fff;
+  --chat-border: var(--border-color);
+  --chat-radius: 12px;
+  --chat-avatar-size: 36px;
+  --chat-scrollbar-thumb: var(--border-color);
+  display: flex;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  border-radius: var(--chat-radius);
+  overflow: hidden;
+  background: var(--chat-bg);
+  color: var(--chat-text-primary);
+  font-size: 14px;
+  border: 1px solid var(--chat-border);
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
+}
+
+/* ─── 联系人侧栏 ──────────────────────────────────────── */
+.c-chat__sidebar[data-v-5e7f3fe9] {
+  display: flex;
+  flex-direction: column;
+  width: var(--chat-sidebar-width);
+  min-width: var(--chat-sidebar-width);
+  background: var(--chat-sidebar-bg);
+  border-right: 1px solid var(--chat-border);
+  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.03);
+}
+.c-chat__sidebar-header[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  height: var(--chat-header-height);
+  padding: 0 16px;
+  border-bottom: 1px solid var(--chat-border);
+  font-weight: 600;
+  font-size: 15px;
+}
+.c-chat__search[data-v-5e7f3fe9] {
+  padding: 8px 12px;
+}
+.c-chat__contact-list[data-v-5e7f3fe9] {
+  flex: 1;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+}
+.c-chat__contact-list[data-v-5e7f3fe9]::-webkit-scrollbar {
+  width: 4px;
+}
+.c-chat__contact-list[data-v-5e7f3fe9]::-webkit-scrollbar-thumb {
+  background: var(--chat-scrollbar-thumb);
+  border-radius: 2px;
+}
+.c-chat__contact[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 10px 16px;
+  cursor: pointer;
+  transition: background 0.15s;
+}
+.c-chat__contact[data-v-5e7f3fe9]:hover {
+  background: color-mix(in srgb, var(--primary-color) 6%, transparent);
+}
+.c-chat__contact.is-active[data-v-5e7f3fe9] {
+  background: color-mix(in srgb, var(--primary-color) 12%, transparent);
+}
+.c-chat__contact-avatar[data-v-5e7f3fe9] {
+  position: relative;
+  flex-shrink: 0;
+}
+.c-chat__avatar[data-v-5e7f3fe9] {
+  width: var(--chat-avatar-size);
+  height: var(--chat-avatar-size);
+  border-radius: 50%;
+  object-fit: cover;
+  background: color-mix(in srgb, var(--border-color) 50%, transparent);
+}
+.c-chat__avatar-fallback[data-v-5e7f3fe9] {
+  width: var(--chat-avatar-size);
+  height: var(--chat-avatar-size);
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--primary-color) 25%, transparent);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--app-text-primary);
+}
+.c-chat__online-dot[data-v-5e7f3fe9] {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background: #22c55e;
+  border: 2px solid var(--chat-sidebar-bg);
+}
+.c-chat__contact-info[data-v-5e7f3fe9] {
+  flex: 1;
+  min-width: 0;
+}
+.c-chat__contact-name[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 13px;
+  font-weight: 500;
+}
+.c-chat__contact-time[data-v-5e7f3fe9] {
+  font-size: 11px;
+  color: var(--chat-text-secondary);
+  margin-left: 8px;
+  flex-shrink: 0;
+}
+.c-chat__contact-last[data-v-5e7f3fe9] {
+  font-size: 12px;
+  color: var(--chat-text-secondary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
+}
+.c-chat__unread[data-v-5e7f3fe9] {
+  min-width: 18px;
+  height: 18px;
+  padding: 0 5px;
+  border-radius: 9px;
+  background: #ef4444;
+  color: #fff;
+  font-size: 11px;
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+/* ─── 主聊天区域 ──────────────────────────────────────── */
+.c-chat__main[data-v-5e7f3fe9] {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+.c-chat__header[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  height: var(--chat-header-height);
+  padding: 0 20px;
+  background: var(--chat-header-bg);
+  border-bottom: 1px solid var(--chat-border);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
+  font-weight: 600;
+  font-size: 15px;
+}
+.c-chat__header-status[data-v-5e7f3fe9] {
+  font-size: 12px;
+  font-weight: 400;
+  color: var(--chat-text-secondary);
+}
+
+/* ─── 消息区域 ────────────────────────────────────────── */
+.c-chat__messages[data-v-5e7f3fe9] {
+  flex: 1;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  padding: 16px 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  background: color-mix(in srgb, var(--body-color) 50%, var(--card-color));
+}
+.c-chat__messages[data-v-5e7f3fe9]::-webkit-scrollbar {
+  width: 4px;
+}
+.c-chat__messages[data-v-5e7f3fe9]::-webkit-scrollbar-thumb {
+  background: var(--chat-scrollbar-thumb);
+  border-radius: 2px;
+}
+.c-chat__load-more[data-v-5e7f3fe9] {
+  text-align: center;
+  padding: 8px;
+}
+.c-chat__empty[data-v-5e7f3fe9] {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--chat-text-secondary);
+  font-size: 13px;
+}
+
+/* ─── 消息气泡 ────────────────────────────────────────── */
+.c-chat__msg[data-v-5e7f3fe9] {
+  display: flex;
+  gap: 8px;
+  max-width: 75%;
+}
+.c-chat__msg.is-self[data-v-5e7f3fe9] {
+  margin-left: auto;
+  flex-direction: row-reverse;
+}
+.c-chat__msg.is-system[data-v-5e7f3fe9] {
+  max-width: 100%;
+  justify-content: center;
+  align-self: center;
+}
+.c-chat__msg-avatar[data-v-5e7f3fe9] {
+  flex-shrink: 0;
+  margin-top: 2px;
+}
+.c-chat__msg-body[data-v-5e7f3fe9] {
+  display: flex;
+  flex-direction: column;
+}
+.c-chat__msg-username[data-v-5e7f3fe9] {
+  font-size: 12px;
+  color: var(--chat-text-secondary);
+  margin-bottom: 2px;
+}
+.is-self .c-chat__msg-username[data-v-5e7f3fe9] {
+  text-align: right;
+}
+.c-chat__bubble[data-v-5e7f3fe9] {
+  padding: 10px 14px;
+  border-radius: 16px;
+  line-height: 1.5;
+  word-break: break-word;
+  white-space: pre-wrap;
+}
+.is-other .c-chat__bubble[data-v-5e7f3fe9] {
+  background: var(--chat-bubble-other);
+  border: 1px solid var(--chat-border);
+  border-top-left-radius: 4px;
+}
+.is-self .c-chat__bubble[data-v-5e7f3fe9] {
+  background: var(--chat-bubble-self);
+  color: var(--chat-text-self);
+  border-top-right-radius: 4px;
+}
+.is-system .c-chat__bubble[data-v-5e7f3fe9] {
+  background: var(--chat-bubble-system);
+  color: var(--chat-text-secondary);
+  font-size: 12px;
+  padding: 4px 12px;
+}
+.c-chat__msg-image[data-v-5e7f3fe9] {
+  max-width: 240px;
+  max-height: 180px;
+  border-radius: 12px;
+  cursor: pointer;
+  object-fit: cover;
+}
+.is-self .c-chat__msg-image[data-v-5e7f3fe9] {
+  border-top-right-radius: 4px;
+}
+.is-other .c-chat__msg-image[data-v-5e7f3fe9] {
+  border-top-left-radius: 4px;
+}
+.c-chat__msg-file[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 10px 14px;
+  border-radius: 12px;
+  cursor: pointer;
+}
+.is-other .c-chat__msg-file[data-v-5e7f3fe9] {
+  background: var(--chat-bubble-other);
+  border: 1px solid var(--chat-border);
+  border-top-left-radius: 4px;
+}
+.is-self .c-chat__msg-file[data-v-5e7f3fe9] {
+  background: var(--chat-bubble-self);
+  color: var(--chat-text-self);
+  border-top-right-radius: 4px;
+}
+.c-chat__file-info[data-v-5e7f3fe9] {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+.c-chat__file-name[data-v-5e7f3fe9] {
+  font-size: 13px;
+  font-weight: 500;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.c-chat__file-size[data-v-5e7f3fe9] {
+  font-size: 11px;
+  opacity: 0.6;
+}
+.c-chat__msg-time[data-v-5e7f3fe9] {
+  font-size: 11px;
+  color: var(--chat-text-secondary);
+  margin-top: 4px;
+}
+.is-self .c-chat__msg-time[data-v-5e7f3fe9] {
+  text-align: right;
+}
+.c-chat__msg-status[data-v-5e7f3fe9] {
+  font-size: 11px;
+  margin-top: 2px;
+  text-align: right;
+}
+.c-chat__msg-status.is-sending[data-v-5e7f3fe9] {
+  color: var(--chat-text-secondary);
+}
+.c-chat__msg-status.is-failed[data-v-5e7f3fe9] {
+  color: #ef4444;
+  cursor: pointer;
+}
+
+/* ─── 时间分割线 ──────────────────────────────────────── */
+.c-chat__time-divider[data-v-5e7f3fe9] {
+  text-align: center;
+  font-size: 11px;
+  color: var(--chat-text-secondary);
+  padding: 4px 0;
+}
+
+/* ─── 输入区域 ────────────────────────────────────────── */
+.c-chat__input-area[data-v-5e7f3fe9] {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-height: var(--chat-input-height);
+  padding: 10px 16px;
+  background: var(--chat-input-bg);
+  border-top: 1px solid var(--chat-border);
+}
+.c-chat__input-actions[data-v-5e7f3fe9] {
+  display: flex;
+  gap: 4px;
+  flex-shrink: 0;
+}
+.c-chat__input-wrap[data-v-5e7f3fe9] {
+  flex: 1;
+  min-width: 0;
+}
+.c-chat__send-btn[data-v-5e7f3fe9] {
+  flex-shrink: 0;
+}
+
+/* ─── 空态 ────────────────────────────────────────────── */
+.c-chat__no-chat[data-v-5e7f3fe9] {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  color: var(--chat-text-secondary);
+}
+.c-chat__no-chat-icon[data-v-5e7f3fe9] {
+  font-size: 48px;
+  opacity: 0.3;
+}
+
+/* ─── 响应式 ──────────────────────────────────────────── */
+@media (max-width: 640px) {
+.c-chat[data-v-5e7f3fe9] {
+    --chat-sidebar-width: 72px;
+}
+.c-chat__contact-info[data-v-5e7f3fe9],
+  .c-chat__search[data-v-5e7f3fe9],
+  .c-chat__unread[data-v-5e7f3fe9] {
+    display: none;
+}
+.c-chat__contact[data-v-5e7f3fe9] {
+    justify-content: center;
+    padding: 10px 8px;
+}
+}
+
+/*# sourceMappingURL=C_Chat-CcdWgVE8.css.map*/

package/dist/C_Chat.d.cts

@@ -0,0 +1,2 @@
+import { a as DEFAULT_CHAT_PROPS, c as MessageType, i as ChatProps, n as ChatContact, o as MessageSender, r as ChatMessage, s as MessageStatus, t as _default } from "./index8.vue.js";
+export { _default as C_Chat, type ChatContact, type ChatMessage, type ChatProps, DEFAULT_CHAT_PROPS, type MessageSender, type MessageStatus, type MessageType };

package/dist/C_Chat.d.ts

@@ -0,0 +1,2 @@
+import { a as DEFAULT_CHAT_PROPS, c as MessageType, i as ChatProps, n as ChatContact, o as MessageSender, r as ChatMessage, s as MessageStatus, t as _default } from "./index8.vue.js";
+export { _default as C_Chat, type ChatContact, type ChatMessage, type ChatProps, DEFAULT_CHAT_PROPS, type MessageSender, type MessageStatus, type MessageType };

package/dist/C_Chat.js

@@ -0,0 +1 @@
+import"./C_Icon2.js";import{n as e,t}from"./C_Chat2.js";export{t as C_Chat,e as DEFAULT_CHAT_PROPS};

package/dist/C_Chat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"C_Chat.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":["/**\r\n * @Description: C_Chat 通用聊天组件 - 类型定义\r\n */\r\n\r\n// ================= 消息类型 =================\r\n\r\n/** 消息类型 */\r\nexport type MessageType = 'text' | 'image' | 'file' | 'system'\r\n\r\n/** 消息发送方 */\r\nexport type MessageSender = 'self' | 'other' | 'system'\r\n\r\n/** 消息状态 */\r\nexport type MessageStatus = 'sending' | 'sent' | 'failed'\r\n\r\n/** 单条消息 */\r\nexport interface ChatMessage {\r\n  /** 唯一标识 */\r\n  id: string\r\n  /** 消息内容（文本 / 图片 URL / 文件信息 JSON） */\r\n  content: string\r\n  /** 消息类型 */\r\n  type: MessageType\r\n  /** 发送方 */\r\n  sender: MessageSender\r\n  /** 发送时间（ISO 字符串 或 时间戳） */\r\n  timestamp: string | number\r\n  /** 发送者头像 URL */\r\n  avatar?: string\r\n  /** 发送者用户名 */\r\n  username?: string\r\n  /** 消息状态 */\r\n  status?: MessageStatus\r\n  /** 文件名（type = 'file' 时使用） */\r\n  fileName?: string\r\n  /** 文件大小（字节） */\r\n  fileSize?: number\r\n}\r\n\r\n// ================= 联系人 =================\r\n\r\n/** 联系人 / 会话 */\r\nexport interface ChatContact {\r\n  /** 唯一标识 */\r\n  id: string\r\n  /** 显示名称 */\r\n  name: string\r\n  /** 头像 URL */\r\n  avatar?: string\r\n  /** 最后一条消息摘要 */\r\n  lastMessage?: string\r\n  /** 最后消息时间 */\r\n  lastTime?: string | number\r\n  /** 未读数 */\r\n  unread?: number\r\n  /** 是否在线 */\r\n  online?: boolean\r\n}\r\n\r\n// ================= 组件 Props =================\r\n\r\nexport interface ChatProps {\r\n  /** 联系人列表 */\r\n  contacts?: ChatContact[]\r\n  /** 消息列表 */\r\n  messages?: ChatMessage[]\r\n  /** 当前选中的联系人 ID */\r\n  currentContactId?: string\r\n  /** 输入框占位符 */\r\n  placeholder?: string\r\n  /** 是否显示联系人侧栏 */\r\n  showContacts?: boolean\r\n  /** 是否显示消息时间戳 */\r\n  showTimestamp?: boolean\r\n  /** 当前用户头像 */\r\n  selfAvatar?: string\r\n  /** 当前用户名 */\r\n  selfName?: string\r\n  /** 是否显示发送按钮 */\r\n  showSendBtn?: boolean\r\n  /** 是否正在加载历史消息 */\r\n  loadingHistory?: boolean\r\n  /** 标题（无联系人模式时显示） */\r\n  title?: string\r\n}\r\n\r\n// ================= 默认值 =================\r\n\r\nexport const DEFAULT_CHAT_PROPS: Required<\r\n  Pick<\r\n    ChatProps,\r\n    | 'placeholder'\r\n    | 'showContacts'\r\n    | 'showTimestamp'\r\n    | 'showSendBtn'\r\n    | 'loadingHistory'\r\n    | 'title'\r\n  >\r\n> = {\r\n  placeholder: '输入消息...',\r\n  showContacts: true,\r\n  showTimestamp: true,\r\n  showSendBtn: true,\r\n  loadingHistory: false,\r\n  title: '聊天',\r\n}\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Description: C_Chat — 通用聊天组件\r\n *\r\n * 支持联系人列表 + 消息气泡 + 输入框，可用于 IM、客服、AI 对话等场景。\r\n * 通过 CSS 变量可完全自定义主题风格。\r\n *\r\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\r\n-->\r\n<template>\r\n  <div class=\"c-chat\">\r\n    <!-- ===== 联系人侧栏 ===== -->\r\n    <aside\r\n      v-if=\"mergedProps.showContacts && contactList.length\"\r\n      class=\"c-chat__sidebar\"\r\n    >\r\n      <div class=\"c-chat__sidebar-header\">\r\n        <C_Icon\r\n          name=\"mdi:chat-outline\"\r\n          :size=\"20\"\r\n        />\r\n        会话\r\n      </div>\r\n\r\n      <!-- 搜索框 -->\r\n      <div class=\"c-chat__search\">\r\n        <NInput\r\n          v-model:value=\"searchKeyword\"\r\n          placeholder=\"搜索联系人\"\r\n          clearable\r\n          size=\"small\"\r\n        >\r\n          <template #prefix>\r\n            <C_Icon\r\n              name=\"mdi:magnify\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NInput>\r\n      </div>\r\n\r\n      <!-- 联系人列表 -->\r\n      <div class=\"c-chat__contact-list\">\r\n        <div\r\n          v-for=\"contact in filteredContacts\"\r\n          :key=\"contact.id\"\r\n          class=\"c-chat__contact\"\r\n          :class=\"{ 'is-active': contact.id === currentId }\"\r\n          @click=\"handleSelectContact(contact.id)\"\r\n        >\r\n          <div class=\"c-chat__contact-avatar\">\r\n            <img\r\n              v-if=\"contact.avatar\"\r\n              :src=\"contact.avatar\"\r\n              :alt=\"contact.name\"\r\n              class=\"c-chat__avatar\"\r\n            />\r\n            <div\r\n              v-else\r\n              class=\"c-chat__avatar-fallback\"\r\n            >\r\n              {{ contact.name.charAt(0) }}\r\n            </div>\r\n            <span\r\n              v-if=\"contact.online\"\r\n              class=\"c-chat__online-dot\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"c-chat__contact-info\">\r\n            <div class=\"c-chat__contact-name\">\r\n              <span>{{ contact.name }}</span>\r\n              <span\r\n                v-if=\"contact.lastTime\"\r\n                class=\"c-chat__contact-time\"\r\n              >\r\n                {{ formatContactTime(contact.lastTime) }}\r\n              </span>\r\n            </div>\r\n            <div\r\n              v-if=\"contact.lastMessage\"\r\n              class=\"c-chat__contact-last\"\r\n            >\r\n              {{ contact.lastMessage }}\r\n            </div>\r\n          </div>\r\n\r\n          <span\r\n            v-if=\"contact.unread\"\r\n            class=\"c-chat__unread\"\r\n          >\r\n            {{ contact.unread > 99 ? '99+' : contact.unread }}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </aside>\r\n\r\n    <!-- ===== 主聊天区域 ===== -->\r\n    <div\r\n      v-if=\"currentContact || !mergedProps.showContacts\"\r\n      class=\"c-chat__main\"\r\n    >\r\n      <!-- 顶栏 -->\r\n      <div class=\"c-chat__header\">\r\n        <slot name=\"header\">\r\n          <span>{{ currentContact?.name || mergedProps.title }}</span>\r\n          <span\r\n            v-if=\"currentContact?.online\"\r\n            class=\"c-chat__header-status\"\r\n          >\r\n            在线\r\n          </span>\r\n        </slot>\r\n      </div>\r\n\r\n      <!-- 消息列表 -->\r\n      <div\r\n        ref=\"messagesRef\"\r\n        class=\"c-chat__messages\"\r\n        @scroll=\"handleMessagesScroll\"\r\n      >\r\n        <!-- 加载更多 -->\r\n        <div\r\n          v-if=\"mergedProps.loadingHistory\"\r\n          class=\"c-chat__load-more\"\r\n        >\r\n          <NSpin size=\"small\" />\r\n        </div>\r\n\r\n        <!-- 消息为空 -->\r\n        <div\r\n          v-if=\"!messageList.length && !mergedProps.loadingHistory\"\r\n          class=\"c-chat__empty\"\r\n        >\r\n          暂无消息，发送第一条吧\r\n        </div>\r\n\r\n        <!-- 消息列表 -->\r\n        <template\r\n          v-for=\"(msg, idx) in messageList\"\r\n          :key=\"msg.id\"\r\n        >\r\n          <!-- 时间分割 -->\r\n          <div\r\n            v-if=\"shouldShowTimeDivider(msg, idx)\"\r\n            class=\"c-chat__time-divider\"\r\n          >\r\n            {{ formatMessageTime(msg.timestamp) }}\r\n          </div>\r\n\r\n          <!-- 消息条目 -->\r\n          <div\r\n            class=\"c-chat__msg\"\r\n            :class=\"`is-${msg.sender}`\"\r\n          >\r\n            <!-- 头像 -->\r\n            <div\r\n              v-if=\"msg.sender !== 'system'\"\r\n              class=\"c-chat__msg-avatar\"\r\n            >\r\n              <img\r\n                v-if=\"getAvatar(msg)\"\r\n                :src=\"getAvatar(msg)\"\r\n                class=\"c-chat__avatar\"\r\n              />\r\n              <div\r\n                v-else\r\n                class=\"c-chat__avatar-fallback\"\r\n              >\r\n                {{ getUsername(msg).charAt(0) }}\r\n              </div>\r\n            </div>\r\n\r\n            <!-- 消息体 -->\r\n            <div class=\"c-chat__msg-body\">\r\n              <span\r\n                v-if=\"msg.sender === 'other' && msg.username\"\r\n                class=\"c-chat__msg-username\"\r\n              >\r\n                {{ msg.username }}\r\n              </span>\r\n\r\n              <!-- 文本消息 -->\r\n              <div\r\n                v-if=\"msg.type === 'text' || msg.type === 'system'\"\r\n                class=\"c-chat__bubble\"\r\n              >\r\n                {{ msg.content }}\r\n              </div>\r\n\r\n              <!-- 图片消息 -->\r\n              <img\r\n                v-else-if=\"msg.type === 'image'\"\r\n                :src=\"msg.content\"\r\n                class=\"c-chat__msg-image\"\r\n                @click=\"emit('image-preview', msg.content)\"\r\n              />\r\n\r\n              <!-- 文件消息 -->\r\n              <div\r\n                v-else-if=\"msg.type === 'file'\"\r\n                class=\"c-chat__msg-file\"\r\n                @click=\"emit('file-click', msg)\"\r\n              >\r\n                <C_Icon\r\n                  name=\"mdi:file-document-outline\"\r\n                  :size=\"28\"\r\n                />\r\n                <div class=\"c-chat__file-info\">\r\n                  <span class=\"c-chat__file-name\">{{\r\n                    msg.fileName || '文件'\r\n                  }}</span>\r\n                  <span\r\n                    v-if=\"msg.fileSize\"\r\n                    class=\"c-chat__file-size\"\r\n                  >\r\n                    {{ formatFileSize(msg.fileSize) }}\r\n                  </span>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- 时间戳 -->\r\n              <span\r\n                v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\r\n                class=\"c-chat__msg-time\"\r\n              >\r\n                {{ formatTime(msg.timestamp) }}\r\n              </span>\r\n\r\n              <!-- 发送状态 -->\r\n              <span\r\n                v-if=\"msg.sender === 'self' && msg.status\"\r\n                class=\"c-chat__msg-status\"\r\n                :class=\"`is-${msg.status}`\"\r\n                @click=\"msg.status === 'failed' && emit('resend', msg)\"\r\n              >\r\n                {{\r\n                  msg.status === 'sending'\r\n                    ? '发送中...'\r\n                    : msg.status === 'failed'\r\n                      ? '发送失败，点击重试'\r\n                      : ''\r\n                }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </template>\r\n      </div>\r\n\r\n      <!-- 输入区域 -->\r\n      <div class=\"c-chat__input-area\">\r\n        <div class=\"c-chat__input-actions\">\r\n          <slot name=\"input-actions\">\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('emoji-click')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:emoticon-happy-outline\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('file-upload')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:paperclip\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </slot>\r\n        </div>\r\n\r\n        <div class=\"c-chat__input-wrap\">\r\n          <NInput\r\n            v-model:value=\"inputText\"\r\n            :placeholder=\"mergedProps.placeholder\"\r\n            type=\"textarea\"\r\n            :autosize=\"{ minRows: 1, maxRows: 4 }\"\r\n            @keydown.enter.exact.prevent=\"handleSend\"\r\n          />\r\n        </div>\r\n\r\n        <NButton\r\n          v-if=\"mergedProps.showSendBtn\"\r\n          type=\"primary\"\r\n          :disabled=\"!inputText.trim()\"\r\n          class=\"c-chat__send-btn\"\r\n          @click=\"handleSend\"\r\n        >\r\n          <template #icon>\r\n            <C_Icon\r\n              name=\"mdi:send\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NButton>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- ===== 未选中联系人空态 ===== -->\r\n    <div\r\n      v-else\r\n      class=\"c-chat__main c-chat__no-chat\"\r\n    >\r\n      <C_Icon\r\n        name=\"mdi:chat-processing-outline\"\r\n        :size=\"48\"\r\n        class=\"c-chat__no-chat-icon\"\r\n      />\r\n      <span>选择一个会话开始聊天</span>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n  import { computed, nextTick, ref, watch } from 'vue'\r\n  import C_Icon from '../C_Icon/index.vue'\r\n  import {\r\n    DEFAULT_CHAT_PROPS,\r\n    type ChatProps,\r\n    type ChatMessage,\r\n    type ChatContact,\r\n  } from './types'\r\n\r\n  // ===== Props & Emits =====\r\n  const props = withDefaults(defineProps<ChatProps>(), {\r\n    contacts: () => [],\r\n    messages: () => [],\r\n    currentContactId: '',\r\n    placeholder: DEFAULT_CHAT_PROPS.placeholder,\r\n    showContacts: DEFAULT_CHAT_PROPS.showContacts,\r\n    showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\r\n    showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\r\n    loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\r\n    title: DEFAULT_CHAT_PROPS.title,\r\n    selfAvatar: '',\r\n    selfName: '',\r\n  })\r\n\r\n  const emit = defineEmits<{\r\n    (e: 'send', content: string): void\r\n    (e: 'select-contact', id: string): void\r\n    (e: 'load-more'): void\r\n    (e: 'image-preview', url: string): void\r\n    (e: 'file-click', msg: ChatMessage): void\r\n    (e: 'file-upload'): void\r\n    (e: 'emoji-click'): void\r\n    (e: 'resend', msg: ChatMessage): void\r\n  }>()\r\n\r\n  // ===== 合并 Props =====\r\n  const mergedProps = computed(() => ({\r\n    ...DEFAULT_CHAT_PROPS,\r\n    ...props,\r\n  }))\r\n\r\n  // ===== 内部状态 =====\r\n  const inputText = ref('')\r\n  const searchKeyword = ref('')\r\n  const messagesRef = ref<HTMLElement | null>(null)\r\n\r\n  // ===== 计算属性 =====\r\n  const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\r\n  const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\r\n\r\n  const currentId = computed(\r\n    () => props.currentContactId || contactList.value[0]?.id || ''\r\n  )\r\n\r\n  const currentContact = computed(() =>\r\n    contactList.value.find(c => c.id === currentId.value)\r\n  )\r\n\r\n  const filteredContacts = computed(() => {\r\n    if (!searchKeyword.value) return contactList.value\r\n    const kw = searchKeyword.value.toLowerCase()\r\n    return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\r\n  })\r\n\r\n  // ===== 方法 =====\r\n  const handleSelectContact = (id: string) => {\r\n    emit('select-contact', id)\r\n  }\r\n\r\n  const handleSend = () => {\r\n    const text = inputText.value.trim()\r\n    if (!text) return\r\n    emit('send', text)\r\n    inputText.value = ''\r\n  }\r\n\r\n  /** 自动滚动到底部 */\r\n  const scrollToBottom = () => {\r\n    nextTick(() => {\r\n      if (messagesRef.value) {\r\n        messagesRef.value.scrollTop = messagesRef.value.scrollHeight\r\n      }\r\n    })\r\n  }\r\n\r\n  // 消息变化时自动滚动\r\n  watch(\r\n    () => props.messages?.length,\r\n    () => scrollToBottom(),\r\n    { flush: 'post' }\r\n  )\r\n\r\n  /** 滚动到顶部时触发加载更多 */\r\n  const handleMessagesScroll = () => {\r\n    if (\r\n      messagesRef.value &&\r\n      messagesRef.value.scrollTop === 0 &&\r\n      !mergedProps.value.loadingHistory\r\n    ) {\r\n      emit('load-more')\r\n    }\r\n  }\r\n\r\n  // ===== 工具函数 =====\r\n  const getAvatar = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfAvatar || msg.avatar\r\n    return msg.avatar\r\n  }\r\n\r\n  const getUsername = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\r\n    return msg.username || '未知'\r\n  }\r\n\r\n  const formatTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\r\n  }\r\n\r\n  const formatMessageTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const isToday =\r\n      d.getFullYear() === now.getFullYear() &&\r\n      d.getMonth() === now.getMonth() &&\r\n      d.getDate() === now.getDate()\r\n    if (isToday) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\r\n  }\r\n\r\n  const formatContactTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const diff = now.getTime() - d.getTime()\r\n    if (diff < 60_000) return '刚刚'\r\n    if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\r\n    if (diff < 86_400_000) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()}`\r\n  }\r\n\r\n  const formatFileSize = (bytes: number) => {\r\n    if (bytes < 1024) return `${bytes}B`\r\n    if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\r\n    return `${(bytes / 1048576).toFixed(1)}MB`\r\n  }\r\n\r\n  /** 是否显示时间分割线（两条消息间超过 5 分钟） */\r\n  const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\r\n    if (idx === 0) return true\r\n    const prev = messageList.value[idx - 1]\r\n    const curr = new Date(msg.timestamp).getTime()\r\n    const prevTime = new Date(prev.timestamp).getTime()\r\n    return curr - prevTime > 5 * 60 * 1000\r\n  }\r\n\r\n  // ===== 暴露方法 =====\r\n  defineExpose({ scrollToBottom })\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n  @use './index.scss';\r\n</style>\r\n","/* unplugin-vue-components disabled */<!--\r\n * @Description: C_Chat — 通用聊天组件\r\n *\r\n * 支持联系人列表 + 消息气泡 + 输入框，可用于 IM、客服、AI 对话等场景。\r\n * 通过 CSS 变量可完全自定义主题风格。\r\n *\r\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\r\n-->\r\n<template>\r\n  <div class=\"c-chat\">\r\n    <!-- ===== 联系人侧栏 ===== -->\r\n    <aside\r\n      v-if=\"mergedProps.showContacts && contactList.length\"\r\n      class=\"c-chat__sidebar\"\r\n    >\r\n      <div class=\"c-chat__sidebar-header\">\r\n        <C_Icon\r\n          name=\"mdi:chat-outline\"\r\n          :size=\"20\"\r\n        />\r\n        会话\r\n      </div>\r\n\r\n      <!-- 搜索框 -->\r\n      <div class=\"c-chat__search\">\r\n        <NInput\r\n          v-model:value=\"searchKeyword\"\r\n          placeholder=\"搜索联系人\"\r\n          clearable\r\n          size=\"small\"\r\n        >\r\n          <template #prefix>\r\n            <C_Icon\r\n              name=\"mdi:magnify\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NInput>\r\n      </div>\r\n\r\n      <!-- 联系人列表 -->\r\n      <div class=\"c-chat__contact-list\">\r\n        <div\r\n          v-for=\"contact in filteredContacts\"\r\n          :key=\"contact.id\"\r\n          class=\"c-chat__contact\"\r\n          :class=\"{ 'is-active': contact.id === currentId }\"\r\n          @click=\"handleSelectContact(contact.id)\"\r\n        >\r\n          <div class=\"c-chat__contact-avatar\">\r\n            <img\r\n              v-if=\"contact.avatar\"\r\n              :src=\"contact.avatar\"\r\n              :alt=\"contact.name\"\r\n              class=\"c-chat__avatar\"\r\n            />\r\n            <div\r\n              v-else\r\n              class=\"c-chat__avatar-fallback\"\r\n            >\r\n              {{ contact.name.charAt(0) }}\r\n            </div>\r\n            <span\r\n              v-if=\"contact.online\"\r\n              class=\"c-chat__online-dot\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"c-chat__contact-info\">\r\n            <div class=\"c-chat__contact-name\">\r\n              <span>{{ contact.name }}</span>\r\n              <span\r\n                v-if=\"contact.lastTime\"\r\n                class=\"c-chat__contact-time\"\r\n              >\r\n                {{ formatContactTime(contact.lastTime) }}\r\n              </span>\r\n            </div>\r\n            <div\r\n              v-if=\"contact.lastMessage\"\r\n              class=\"c-chat__contact-last\"\r\n            >\r\n              {{ contact.lastMessage }}\r\n            </div>\r\n          </div>\r\n\r\n          <span\r\n            v-if=\"contact.unread\"\r\n            class=\"c-chat__unread\"\r\n          >\r\n            {{ contact.unread > 99 ? '99+' : contact.unread }}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </aside>\r\n\r\n    <!-- ===== 主聊天区域 ===== -->\r\n    <div\r\n      v-if=\"currentContact || !mergedProps.showContacts\"\r\n      class=\"c-chat__main\"\r\n    >\r\n      <!-- 顶栏 -->\r\n      <div class=\"c-chat__header\">\r\n        <slot name=\"header\">\r\n          <span>{{ currentContact?.name || mergedProps.title }}</span>\r\n          <span\r\n            v-if=\"currentContact?.online\"\r\n            class=\"c-chat__header-status\"\r\n          >\r\n            在线\r\n          </span>\r\n        </slot>\r\n      </div>\r\n\r\n      <!-- 消息列表 -->\r\n      <div\r\n        ref=\"messagesRef\"\r\n        class=\"c-chat__messages\"\r\n        @scroll=\"handleMessagesScroll\"\r\n      >\r\n        <!-- 加载更多 -->\r\n        <div\r\n          v-if=\"mergedProps.loadingHistory\"\r\n          class=\"c-chat__load-more\"\r\n        >\r\n          <NSpin size=\"small\" />\r\n        </div>\r\n\r\n        <!-- 消息为空 -->\r\n        <div\r\n          v-if=\"!messageList.length && !mergedProps.loadingHistory\"\r\n          class=\"c-chat__empty\"\r\n        >\r\n          暂无消息，发送第一条吧\r\n        </div>\r\n\r\n        <!-- 消息列表 -->\r\n        <template\r\n          v-for=\"(msg, idx) in messageList\"\r\n          :key=\"msg.id\"\r\n        >\r\n          <!-- 时间分割 -->\r\n          <div\r\n            v-if=\"shouldShowTimeDivider(msg, idx)\"\r\n            class=\"c-chat__time-divider\"\r\n          >\r\n            {{ formatMessageTime(msg.timestamp) }}\r\n          </div>\r\n\r\n          <!-- 消息条目 -->\r\n          <div\r\n            class=\"c-chat__msg\"\r\n            :class=\"`is-${msg.sender}`\"\r\n          >\r\n            <!-- 头像 -->\r\n            <div\r\n              v-if=\"msg.sender !== 'system'\"\r\n              class=\"c-chat__msg-avatar\"\r\n            >\r\n              <img\r\n                v-if=\"getAvatar(msg)\"\r\n                :src=\"getAvatar(msg)\"\r\n                class=\"c-chat__avatar\"\r\n              />\r\n              <div\r\n                v-else\r\n                class=\"c-chat__avatar-fallback\"\r\n              >\r\n                {{ getUsername(msg).charAt(0) }}\r\n              </div>\r\n            </div>\r\n\r\n            <!-- 消息体 -->\r\n            <div class=\"c-chat__msg-body\">\r\n              <span\r\n                v-if=\"msg.sender === 'other' && msg.username\"\r\n                class=\"c-chat__msg-username\"\r\n              >\r\n                {{ msg.username }}\r\n              </span>\r\n\r\n              <!-- 文本消息 -->\r\n              <div\r\n                v-if=\"msg.type === 'text' || msg.type === 'system'\"\r\n                class=\"c-chat__bubble\"\r\n              >\r\n                {{ msg.content }}\r\n              </div>\r\n\r\n              <!-- 图片消息 -->\r\n              <img\r\n                v-else-if=\"msg.type === 'image'\"\r\n                :src=\"msg.content\"\r\n                class=\"c-chat__msg-image\"\r\n                @click=\"emit('image-preview', msg.content)\"\r\n              />\r\n\r\n              <!-- 文件消息 -->\r\n              <div\r\n                v-else-if=\"msg.type === 'file'\"\r\n                class=\"c-chat__msg-file\"\r\n                @click=\"emit('file-click', msg)\"\r\n              >\r\n                <C_Icon\r\n                  name=\"mdi:file-document-outline\"\r\n                  :size=\"28\"\r\n                />\r\n                <div class=\"c-chat__file-info\">\r\n                  <span class=\"c-chat__file-name\">{{\r\n                    msg.fileName || '文件'\r\n                  }}</span>\r\n                  <span\r\n                    v-if=\"msg.fileSize\"\r\n                    class=\"c-chat__file-size\"\r\n                  >\r\n                    {{ formatFileSize(msg.fileSize) }}\r\n                  </span>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- 时间戳 -->\r\n              <span\r\n                v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\r\n                class=\"c-chat__msg-time\"\r\n              >\r\n                {{ formatTime(msg.timestamp) }}\r\n              </span>\r\n\r\n              <!-- 发送状态 -->\r\n              <span\r\n                v-if=\"msg.sender === 'self' && msg.status\"\r\n                class=\"c-chat__msg-status\"\r\n                :class=\"`is-${msg.status}`\"\r\n                @click=\"msg.status === 'failed' && emit('resend', msg)\"\r\n              >\r\n                {{\r\n                  msg.status === 'sending'\r\n                    ? '发送中...'\r\n                    : msg.status === 'failed'\r\n                      ? '发送失败，点击重试'\r\n                      : ''\r\n                }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </template>\r\n      </div>\r\n\r\n      <!-- 输入区域 -->\r\n      <div class=\"c-chat__input-area\">\r\n        <div class=\"c-chat__input-actions\">\r\n          <slot name=\"input-actions\">\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('emoji-click')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:emoticon-happy-outline\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('file-upload')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:paperclip\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </slot>\r\n        </div>\r\n\r\n        <div class=\"c-chat__input-wrap\">\r\n          <NInput\r\n            v-model:value=\"inputText\"\r\n            :placeholder=\"mergedProps.placeholder\"\r\n            type=\"textarea\"\r\n            :autosize=\"{ minRows: 1, maxRows: 4 }\"\r\n            @keydown.enter.exact.prevent=\"handleSend\"\r\n          />\r\n        </div>\r\n\r\n        <NButton\r\n          v-if=\"mergedProps.showSendBtn\"\r\n          type=\"primary\"\r\n          :disabled=\"!inputText.trim()\"\r\n          class=\"c-chat__send-btn\"\r\n          @click=\"handleSend\"\r\n        >\r\n          <template #icon>\r\n            <C_Icon\r\n              name=\"mdi:send\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NButton>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- ===== 未选中联系人空态 ===== -->\r\n    <div\r\n      v-else\r\n      class=\"c-chat__main c-chat__no-chat\"\r\n    >\r\n      <C_Icon\r\n        name=\"mdi:chat-processing-outline\"\r\n        :size=\"48\"\r\n        class=\"c-chat__no-chat-icon\"\r\n      />\r\n      <span>选择一个会话开始聊天</span>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n  import { computed, nextTick, ref, watch } from 'vue'\r\n  import C_Icon from '../C_Icon/index.vue'\r\n  import {\r\n    DEFAULT_CHAT_PROPS,\r\n    type ChatProps,\r\n    type ChatMessage,\r\n    type ChatContact,\r\n  } from './types'\r\n\r\n  // ===== Props & Emits =====\r\n  const props = withDefaults(defineProps<ChatProps>(), {\r\n    contacts: () => [],\r\n    messages: () => [],\r\n    currentContactId: '',\r\n    placeholder: DEFAULT_CHAT_PROPS.placeholder,\r\n    showContacts: DEFAULT_CHAT_PROPS.showContacts,\r\n    showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\r\n    showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\r\n    loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\r\n    title: DEFAULT_CHAT_PROPS.title,\r\n    selfAvatar: '',\r\n    selfName: '',\r\n  })\r\n\r\n  const emit = defineEmits<{\r\n    (e: 'send', content: string): void\r\n    (e: 'select-contact', id: string): void\r\n    (e: 'load-more'): void\r\n    (e: 'image-preview', url: string): void\r\n    (e: 'file-click', msg: ChatMessage): void\r\n    (e: 'file-upload'): void\r\n    (e: 'emoji-click'): void\r\n    (e: 'resend', msg: ChatMessage): void\r\n  }>()\r\n\r\n  // ===== 合并 Props =====\r\n  const mergedProps = computed(() => ({\r\n    ...DEFAULT_CHAT_PROPS,\r\n    ...props,\r\n  }))\r\n\r\n  // ===== 内部状态 =====\r\n  const inputText = ref('')\r\n  const searchKeyword = ref('')\r\n  const messagesRef = ref<HTMLElement | null>(null)\r\n\r\n  // ===== 计算属性 =====\r\n  const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\r\n  const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\r\n\r\n  const currentId = computed(\r\n    () => props.currentContactId || contactList.value[0]?.id || ''\r\n  )\r\n\r\n  const currentContact = computed(() =>\r\n    contactList.value.find(c => c.id === currentId.value)\r\n  )\r\n\r\n  const filteredContacts = computed(() => {\r\n    if (!searchKeyword.value) return contactList.value\r\n    const kw = searchKeyword.value.toLowerCase()\r\n    return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\r\n  })\r\n\r\n  // ===== 方法 =====\r\n  const handleSelectContact = (id: string) => {\r\n    emit('select-contact', id)\r\n  }\r\n\r\n  const handleSend = () => {\r\n    const text = inputText.value.trim()\r\n    if (!text) return\r\n    emit('send', text)\r\n    inputText.value = ''\r\n  }\r\n\r\n  /** 自动滚动到底部 */\r\n  const scrollToBottom = () => {\r\n    nextTick(() => {\r\n      if (messagesRef.value) {\r\n        messagesRef.value.scrollTop = messagesRef.value.scrollHeight\r\n      }\r\n    })\r\n  }\r\n\r\n  // 消息变化时自动滚动\r\n  watch(\r\n    () => props.messages?.length,\r\n    () => scrollToBottom(),\r\n    { flush: 'post' }\r\n  )\r\n\r\n  /** 滚动到顶部时触发加载更多 */\r\n  const handleMessagesScroll = () => {\r\n    if (\r\n      messagesRef.value &&\r\n      messagesRef.value.scrollTop === 0 &&\r\n      !mergedProps.value.loadingHistory\r\n    ) {\r\n      emit('load-more')\r\n    }\r\n  }\r\n\r\n  // ===== 工具函数 =====\r\n  const getAvatar = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfAvatar || msg.avatar\r\n    return msg.avatar\r\n  }\r\n\r\n  const getUsername = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\r\n    return msg.username || '未知'\r\n  }\r\n\r\n  const formatTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\r\n  }\r\n\r\n  const formatMessageTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const isToday =\r\n      d.getFullYear() === now.getFullYear() &&\r\n      d.getMonth() === now.getMonth() &&\r\n      d.getDate() === now.getDate()\r\n    if (isToday) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\r\n  }\r\n\r\n  const formatContactTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const diff = now.getTime() - d.getTime()\r\n    if (diff < 60_000) return '刚刚'\r\n    if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\r\n    if (diff < 86_400_000) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()}`\r\n  }\r\n\r\n  const formatFileSize = (bytes: number) => {\r\n    if (bytes < 1024) return `${bytes}B`\r\n    if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\r\n    return `${(bytes / 1048576).toFixed(1)}MB`\r\n  }\r\n\r\n  /** 是否显示时间分割线（两条消息间超过 5 分钟） */\r\n  const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\r\n    if (idx === 0) return true\r\n    const prev = messageList.value[idx - 1]\r\n    const curr = new Date(msg.timestamp).getTime()\r\n    const prevTime = new Date(prev.timestamp).getTime()\r\n    return curr - prevTime > 5 * 60 * 1000\r\n  }\r\n\r\n  // ===== 暴露方法 =====\r\n  defineExpose({ scrollToBottom })\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n  @use './index.scss';\r\n</style>\r\n","<!--\r\n * @Description: C_Chat — 通用聊天组件\r\n *\r\n * 支持联系人列表 + 消息气泡 + 输入框，可用于 IM、客服、AI 对话等场景。\r\n * 通过 CSS 变量可完全自定义主题风格。\r\n *\r\n * Copyright (c) 2026 by CHENY, All Rights Reserved 😎.\r\n-->\r\n<template>\r\n  <div class=\"c-chat\">\r\n    <!-- ===== 联系人侧栏 ===== -->\r\n    <aside\r\n      v-if=\"mergedProps.showContacts && contactList.length\"\r\n      class=\"c-chat__sidebar\"\r\n    >\r\n      <div class=\"c-chat__sidebar-header\">\r\n        <C_Icon\r\n          name=\"mdi:chat-outline\"\r\n          :size=\"20\"\r\n        />\r\n        会话\r\n      </div>\r\n\r\n      <!-- 搜索框 -->\r\n      <div class=\"c-chat__search\">\r\n        <NInput\r\n          v-model:value=\"searchKeyword\"\r\n          placeholder=\"搜索联系人\"\r\n          clearable\r\n          size=\"small\"\r\n        >\r\n          <template #prefix>\r\n            <C_Icon\r\n              name=\"mdi:magnify\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NInput>\r\n      </div>\r\n\r\n      <!-- 联系人列表 -->\r\n      <div class=\"c-chat__contact-list\">\r\n        <div\r\n          v-for=\"contact in filteredContacts\"\r\n          :key=\"contact.id\"\r\n          class=\"c-chat__contact\"\r\n          :class=\"{ 'is-active': contact.id === currentId }\"\r\n          @click=\"handleSelectContact(contact.id)\"\r\n        >\r\n          <div class=\"c-chat__contact-avatar\">\r\n            <img\r\n              v-if=\"contact.avatar\"\r\n              :src=\"contact.avatar\"\r\n              :alt=\"contact.name\"\r\n              class=\"c-chat__avatar\"\r\n            />\r\n            <div\r\n              v-else\r\n              class=\"c-chat__avatar-fallback\"\r\n            >\r\n              {{ contact.name.charAt(0) }}\r\n            </div>\r\n            <span\r\n              v-if=\"contact.online\"\r\n              class=\"c-chat__online-dot\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"c-chat__contact-info\">\r\n            <div class=\"c-chat__contact-name\">\r\n              <span>{{ contact.name }}</span>\r\n              <span\r\n                v-if=\"contact.lastTime\"\r\n                class=\"c-chat__contact-time\"\r\n              >\r\n                {{ formatContactTime(contact.lastTime) }}\r\n              </span>\r\n            </div>\r\n            <div\r\n              v-if=\"contact.lastMessage\"\r\n              class=\"c-chat__contact-last\"\r\n            >\r\n              {{ contact.lastMessage }}\r\n            </div>\r\n          </div>\r\n\r\n          <span\r\n            v-if=\"contact.unread\"\r\n            class=\"c-chat__unread\"\r\n          >\r\n            {{ contact.unread > 99 ? '99+' : contact.unread }}\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </aside>\r\n\r\n    <!-- ===== 主聊天区域 ===== -->\r\n    <div\r\n      v-if=\"currentContact || !mergedProps.showContacts\"\r\n      class=\"c-chat__main\"\r\n    >\r\n      <!-- 顶栏 -->\r\n      <div class=\"c-chat__header\">\r\n        <slot name=\"header\">\r\n          <span>{{ currentContact?.name || mergedProps.title }}</span>\r\n          <span\r\n            v-if=\"currentContact?.online\"\r\n            class=\"c-chat__header-status\"\r\n          >\r\n            在线\r\n          </span>\r\n        </slot>\r\n      </div>\r\n\r\n      <!-- 消息列表 -->\r\n      <div\r\n        ref=\"messagesRef\"\r\n        class=\"c-chat__messages\"\r\n        @scroll=\"handleMessagesScroll\"\r\n      >\r\n        <!-- 加载更多 -->\r\n        <div\r\n          v-if=\"mergedProps.loadingHistory\"\r\n          class=\"c-chat__load-more\"\r\n        >\r\n          <NSpin size=\"small\" />\r\n        </div>\r\n\r\n        <!-- 消息为空 -->\r\n        <div\r\n          v-if=\"!messageList.length && !mergedProps.loadingHistory\"\r\n          class=\"c-chat__empty\"\r\n        >\r\n          暂无消息，发送第一条吧\r\n        </div>\r\n\r\n        <!-- 消息列表 -->\r\n        <template\r\n          v-for=\"(msg, idx) in messageList\"\r\n          :key=\"msg.id\"\r\n        >\r\n          <!-- 时间分割 -->\r\n          <div\r\n            v-if=\"shouldShowTimeDivider(msg, idx)\"\r\n            class=\"c-chat__time-divider\"\r\n          >\r\n            {{ formatMessageTime(msg.timestamp) }}\r\n          </div>\r\n\r\n          <!-- 消息条目 -->\r\n          <div\r\n            class=\"c-chat__msg\"\r\n            :class=\"`is-${msg.sender}`\"\r\n          >\r\n            <!-- 头像 -->\r\n            <div\r\n              v-if=\"msg.sender !== 'system'\"\r\n              class=\"c-chat__msg-avatar\"\r\n            >\r\n              <img\r\n                v-if=\"getAvatar(msg)\"\r\n                :src=\"getAvatar(msg)\"\r\n                class=\"c-chat__avatar\"\r\n              />\r\n              <div\r\n                v-else\r\n                class=\"c-chat__avatar-fallback\"\r\n              >\r\n                {{ getUsername(msg).charAt(0) }}\r\n              </div>\r\n            </div>\r\n\r\n            <!-- 消息体 -->\r\n            <div class=\"c-chat__msg-body\">\r\n              <span\r\n                v-if=\"msg.sender === 'other' && msg.username\"\r\n                class=\"c-chat__msg-username\"\r\n              >\r\n                {{ msg.username }}\r\n              </span>\r\n\r\n              <!-- 文本消息 -->\r\n              <div\r\n                v-if=\"msg.type === 'text' || msg.type === 'system'\"\r\n                class=\"c-chat__bubble\"\r\n              >\r\n                {{ msg.content }}\r\n              </div>\r\n\r\n              <!-- 图片消息 -->\r\n              <img\r\n                v-else-if=\"msg.type === 'image'\"\r\n                :src=\"msg.content\"\r\n                class=\"c-chat__msg-image\"\r\n                @click=\"emit('image-preview', msg.content)\"\r\n              />\r\n\r\n              <!-- 文件消息 -->\r\n              <div\r\n                v-else-if=\"msg.type === 'file'\"\r\n                class=\"c-chat__msg-file\"\r\n                @click=\"emit('file-click', msg)\"\r\n              >\r\n                <C_Icon\r\n                  name=\"mdi:file-document-outline\"\r\n                  :size=\"28\"\r\n                />\r\n                <div class=\"c-chat__file-info\">\r\n                  <span class=\"c-chat__file-name\">{{\r\n                    msg.fileName || '文件'\r\n                  }}</span>\r\n                  <span\r\n                    v-if=\"msg.fileSize\"\r\n                    class=\"c-chat__file-size\"\r\n                  >\r\n                    {{ formatFileSize(msg.fileSize) }}\r\n                  </span>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- 时间戳 -->\r\n              <span\r\n                v-if=\"mergedProps.showTimestamp && msg.sender !== 'system'\"\r\n                class=\"c-chat__msg-time\"\r\n              >\r\n                {{ formatTime(msg.timestamp) }}\r\n              </span>\r\n\r\n              <!-- 发送状态 -->\r\n              <span\r\n                v-if=\"msg.sender === 'self' && msg.status\"\r\n                class=\"c-chat__msg-status\"\r\n                :class=\"`is-${msg.status}`\"\r\n                @click=\"msg.status === 'failed' && emit('resend', msg)\"\r\n              >\r\n                {{\r\n                  msg.status === 'sending'\r\n                    ? '发送中...'\r\n                    : msg.status === 'failed'\r\n                      ? '发送失败，点击重试'\r\n                      : ''\r\n                }}\r\n              </span>\r\n            </div>\r\n          </div>\r\n        </template>\r\n      </div>\r\n\r\n      <!-- 输入区域 -->\r\n      <div class=\"c-chat__input-area\">\r\n        <div class=\"c-chat__input-actions\">\r\n          <slot name=\"input-actions\">\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('emoji-click')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:emoticon-happy-outline\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n            <NButton\r\n              quaternary\r\n              circle\r\n              size=\"small\"\r\n              @click=\"emit('file-upload')\"\r\n            >\r\n              <template #icon>\r\n                <C_Icon\r\n                  name=\"mdi:paperclip\"\r\n                  :size=\"18\"\r\n                />\r\n              </template>\r\n            </NButton>\r\n          </slot>\r\n        </div>\r\n\r\n        <div class=\"c-chat__input-wrap\">\r\n          <NInput\r\n            v-model:value=\"inputText\"\r\n            :placeholder=\"mergedProps.placeholder\"\r\n            type=\"textarea\"\r\n            :autosize=\"{ minRows: 1, maxRows: 4 }\"\r\n            @keydown.enter.exact.prevent=\"handleSend\"\r\n          />\r\n        </div>\r\n\r\n        <NButton\r\n          v-if=\"mergedProps.showSendBtn\"\r\n          type=\"primary\"\r\n          :disabled=\"!inputText.trim()\"\r\n          class=\"c-chat__send-btn\"\r\n          @click=\"handleSend\"\r\n        >\r\n          <template #icon>\r\n            <C_Icon\r\n              name=\"mdi:send\"\r\n              :size=\"16\"\r\n            />\r\n          </template>\r\n        </NButton>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- ===== 未选中联系人空态 ===== -->\r\n    <div\r\n      v-else\r\n      class=\"c-chat__main c-chat__no-chat\"\r\n    >\r\n      <C_Icon\r\n        name=\"mdi:chat-processing-outline\"\r\n        :size=\"48\"\r\n        class=\"c-chat__no-chat-icon\"\r\n      />\r\n      <span>选择一个会话开始聊天</span>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\n  import { computed, nextTick, ref, watch } from 'vue'\r\n  import C_Icon from '../C_Icon/index.vue'\r\n  import {\r\n    DEFAULT_CHAT_PROPS,\r\n    type ChatProps,\r\n    type ChatMessage,\r\n    type ChatContact,\r\n  } from './types'\r\n\r\n  // ===== Props & Emits =====\r\n  const props = withDefaults(defineProps<ChatProps>(), {\r\n    contacts: () => [],\r\n    messages: () => [],\r\n    currentContactId: '',\r\n    placeholder: DEFAULT_CHAT_PROPS.placeholder,\r\n    showContacts: DEFAULT_CHAT_PROPS.showContacts,\r\n    showTimestamp: DEFAULT_CHAT_PROPS.showTimestamp,\r\n    showSendBtn: DEFAULT_CHAT_PROPS.showSendBtn,\r\n    loadingHistory: DEFAULT_CHAT_PROPS.loadingHistory,\r\n    title: DEFAULT_CHAT_PROPS.title,\r\n    selfAvatar: '',\r\n    selfName: '',\r\n  })\r\n\r\n  const emit = defineEmits<{\r\n    (e: 'send', content: string): void\r\n    (e: 'select-contact', id: string): void\r\n    (e: 'load-more'): void\r\n    (e: 'image-preview', url: string): void\r\n    (e: 'file-click', msg: ChatMessage): void\r\n    (e: 'file-upload'): void\r\n    (e: 'emoji-click'): void\r\n    (e: 'resend', msg: ChatMessage): void\r\n  }>()\r\n\r\n  // ===== 合并 Props =====\r\n  const mergedProps = computed(() => ({\r\n    ...DEFAULT_CHAT_PROPS,\r\n    ...props,\r\n  }))\r\n\r\n  // ===== 内部状态 =====\r\n  const inputText = ref('')\r\n  const searchKeyword = ref('')\r\n  const messagesRef = ref<HTMLElement | null>(null)\r\n\r\n  // ===== 计算属性 =====\r\n  const contactList = computed<ChatContact[]>(() => props.contacts ?? [])\r\n  const messageList = computed<ChatMessage[]>(() => props.messages ?? [])\r\n\r\n  const currentId = computed(\r\n    () => props.currentContactId || contactList.value[0]?.id || ''\r\n  )\r\n\r\n  const currentContact = computed(() =>\r\n    contactList.value.find(c => c.id === currentId.value)\r\n  )\r\n\r\n  const filteredContacts = computed(() => {\r\n    if (!searchKeyword.value) return contactList.value\r\n    const kw = searchKeyword.value.toLowerCase()\r\n    return contactList.value.filter(c => c.name.toLowerCase().includes(kw))\r\n  })\r\n\r\n  // ===== 方法 =====\r\n  const handleSelectContact = (id: string) => {\r\n    emit('select-contact', id)\r\n  }\r\n\r\n  const handleSend = () => {\r\n    const text = inputText.value.trim()\r\n    if (!text) return\r\n    emit('send', text)\r\n    inputText.value = ''\r\n  }\r\n\r\n  /** 自动滚动到底部 */\r\n  const scrollToBottom = () => {\r\n    nextTick(() => {\r\n      if (messagesRef.value) {\r\n        messagesRef.value.scrollTop = messagesRef.value.scrollHeight\r\n      }\r\n    })\r\n  }\r\n\r\n  // 消息变化时自动滚动\r\n  watch(\r\n    () => props.messages?.length,\r\n    () => scrollToBottom(),\r\n    { flush: 'post' }\r\n  )\r\n\r\n  /** 滚动到顶部时触发加载更多 */\r\n  const handleMessagesScroll = () => {\r\n    if (\r\n      messagesRef.value &&\r\n      messagesRef.value.scrollTop === 0 &&\r\n      !mergedProps.value.loadingHistory\r\n    ) {\r\n      emit('load-more')\r\n    }\r\n  }\r\n\r\n  // ===== 工具函数 =====\r\n  const getAvatar = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfAvatar || msg.avatar\r\n    return msg.avatar\r\n  }\r\n\r\n  const getUsername = (msg: ChatMessage) => {\r\n    if (msg.sender === 'self') return props.selfName || msg.username || 'Me'\r\n    return msg.username || '未知'\r\n  }\r\n\r\n  const formatTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    return `${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`\r\n  }\r\n\r\n  const formatMessageTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const isToday =\r\n      d.getFullYear() === now.getFullYear() &&\r\n      d.getMonth() === now.getMonth() &&\r\n      d.getDate() === now.getDate()\r\n    if (isToday) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()} ${formatTime(ts)}`\r\n  }\r\n\r\n  const formatContactTime = (ts: string | number) => {\r\n    const d = new Date(ts)\r\n    const now = new Date()\r\n    const diff = now.getTime() - d.getTime()\r\n    if (diff < 60_000) return '刚刚'\r\n    if (diff < 3_600_000) return `${Math.floor(diff / 60_000)}分钟前`\r\n    if (diff < 86_400_000) return formatTime(ts)\r\n    return `${d.getMonth() + 1}/${d.getDate()}`\r\n  }\r\n\r\n  const formatFileSize = (bytes: number) => {\r\n    if (bytes < 1024) return `${bytes}B`\r\n    if (bytes < 1048576) return `${(bytes / 1024).toFixed(1)}KB`\r\n    return `${(bytes / 1048576).toFixed(1)}MB`\r\n  }\r\n\r\n  /** 是否显示时间分割线（两条消息间超过 5 分钟） */\r\n  const shouldShowTimeDivider = (msg: ChatMessage, idx: number) => {\r\n    if (idx === 0) return true\r\n    const prev = messageList.value[idx - 1]\r\n    const curr = new Date(msg.timestamp).getTime()\r\n    const prevTime = new Date(prev.timestamp).getTime()\r\n    return curr - prevTime > 5 * 60 * 1000\r\n  }\r\n\r\n  // ===== 暴露方法 =====\r\n  defineExpose({ scrollToBottom })\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n  @use './index.scss';\r\n</style>\r\n"],"mappings":"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"}

package/dist/C_Chat2.js

@@ -0,0 +1,2 @@
+import{t as e}from"./C_Icon2.js";import{t}from"./export-helper.js";import{NButton as n,NInput as ee,NSpin as te}from"naive-ui";import{Fragment as r,computed as i,createBlock as ne,createCommentVNode as a,createElementBlock as o,createElementVNode as s,createTextVNode as c,createVNode as l,defineComponent as u,nextTick as d,normalizeClass as f,openBlock as p,ref as m,renderList as h,renderSlot as g,toDisplayString as _,watch as re,withCtx as v,withKeys as ie,withModifiers as ae}from"vue";const y={placeholder:`输入消息...`,showContacts:!0,showTimestamp:!0,showSendBtn:!0,loadingHistory:!1,title:`聊天`},oe={class:`c-chat`},se={key:0,class:`c-chat__sidebar`},ce={class:`c-chat__sidebar-header`},le={class:`c-chat__search`},ue={class:`c-chat__contact-list`},de=[`onClick`],fe={class:`c-chat__contact-avatar`},pe=[`src`,`alt`],me={key:1,class:`c-chat__avatar-fallback`},he={key:2,class:`c-chat__online-dot`},b={class:`c-chat__contact-info`},x={class:`c-chat__contact-name`},S={key:0,class:`c-chat__contact-time`},C={key:0,class:`c-chat__contact-last`},w={key:0,class:`c-chat__unread`},T={key:1,class:`c-chat__main`},E={class:`c-chat__header`},D={key:0,class:`c-chat__header-status`},O={key:0,class:`c-chat__load-more`},k={key:1,class:`c-chat__empty`},A={key:0,class:`c-chat__time-divider`},j={key:0,class:`c-chat__msg-avatar`},M=[`src`],N={key:1,class:`c-chat__avatar-fallback`},P={class:`c-chat__msg-body`},F={key:0,class:`c-chat__msg-username`},I={key:1,class:`c-chat__bubble`},L=[`src`,`onClick`],R=[`onClick`],ge={class:`c-chat__file-info`},_e={class:`c-chat__file-name`},ve={key:0,class:`c-chat__file-size`},ye={key:4,class:`c-chat__msg-time`},be=[`onClick`],xe={class:`c-chat__input-area`},Se={class:`c-chat__input-actions`},Ce={class:`c-chat__input-wrap`},we={class:`c-chat__main c-chat__no-chat`};var z=t(u({__name:`index`,props:{contacts:{default:()=>[]},messages:{default:()=>[]},currentContactId:{default:``},placeholder:{default:y.placeholder},showContacts:{type:Boolean,default:y.showContacts},showTimestamp:{type:Boolean,default:y.showTimestamp},selfAvatar:{default:``},selfName:{default:``},showSendBtn:{type:Boolean,default:y.showSendBtn},loadingHistory:{type:Boolean,default:y.loadingHistory},title:{default:y.title}},emits:[`send`,`select-contact`,`load-more`,`image-preview`,`file-click`,`file-upload`,`emoji-click`,`resend`],setup(t,{expose:u,emit:z}){let B=t,V=z,H=i(()=>({...y,...B})),U=m(``),W=m(``),G=m(null),K=i(()=>B.contacts??[]),q=i(()=>B.messages??[]),J=i(()=>B.currentContactId||K.value[0]?.id||``),Y=i(()=>K.value.find(e=>e.id===J.value)),Te=i(()=>{if(!W.value)return K.value;let e=W.value.toLowerCase();return K.value.filter(t=>t.name.toLowerCase().includes(e))}),Ee=e=>{V(`select-contact`,e)},X=()=>{let e=U.value.trim();e&&(V(`send`,e),U.value=``)},Z=()=>{d(()=>{G.value&&(G.value.scrollTop=G.value.scrollHeight)})};re(()=>B.messages?.length,()=>Z(),{flush:`post`});let De=()=>{G.value&&G.value.scrollTop===0&&!H.value.loadingHistory&&V(`load-more`)},Q=e=>e.sender===`self`&&B.selfAvatar||e.avatar,Oe=e=>e.sender===`self`?B.selfName||e.username||`Me`:e.username||`未知`,$=e=>{let t=new Date(e);return`${t.getHours().toString().padStart(2,`0`)}:${t.getMinutes().toString().padStart(2,`0`)}`},ke=e=>{let t=new Date(e),n=new Date;return t.getFullYear()===n.getFullYear()&&t.getMonth()===n.getMonth()&&t.getDate()===n.getDate()?$(e):`${t.getMonth()+1}/${t.getDate()} ${$(e)}`},Ae=e=>{let t=new Date(e),n=new Date().getTime()-t.getTime();return n<6e4?`刚刚`:n<36e5?`${Math.floor(n/6e4)}分钟前`:n<864e5?$(e):`${t.getMonth()+1}/${t.getDate()}`},je=e=>e<1024?`${e}B`:e<1048576?`${(e/1024).toFixed(1)}KB`:`${(e/1048576).toFixed(1)}MB`,Me=(e,t)=>{if(t===0)return!0;let n=q.value[t-1];return new Date(e.timestamp).getTime()-new Date(n.timestamp).getTime()>300*1e3};return u({scrollToBottom:Z}),(t,i)=>{let u=ee,d=te,m=n;return p(),o(`div`,oe,[a(` ===== 联系人侧栏 ===== `),H.value.showContacts&&K.value.length?(p(),o(`aside`,se,[s(`div`,ce,[l(e,{name:`mdi:chat-outline`,size:20}),i[4]||=c(` 会话 `,-1)]),a(` 搜索框 `),s(`div`,le,[l(u,{value:W.value,"onUpdate:value":i[0]||=e=>W.value=e,placeholder:`搜索联系人`,clearable:``,size:`small`},{prefix:v(()=>[l(e,{name:`mdi:magnify`,size:16})]),_:1},8,[`value`])]),a(` 联系人列表 `),s(`div`,ue,[(p(!0),o(r,null,h(Te.value,e=>(p(),o(`div`,{key:e.id,class:f([`c-chat__contact`,{"is-active":e.id===J.value}]),onClick:t=>Ee(e.id)},[s(`div`,fe,[e.avatar?(p(),o(`img`,{key:0,src:e.avatar,alt:e.name,class:`c-chat__avatar`},null,8,pe)):(p(),o(`div`,me,_(e.name.charAt(0)),1)),e.online?(p(),o(`span`,he)):a(`v-if`,!0)]),s(`div`,b,[s(`div`,x,[s(`span`,null,_(e.name),1),e.lastTime?(p(),o(`span`,S,_(Ae(e.lastTime)),1)):a(`v-if`,!0)]),e.lastMessage?(p(),o(`div`,C,_(e.lastMessage),1)):a(`v-if`,!0)]),e.unread?(p(),o(`span`,w,_(e.unread>99?`99+`:e.unread),1)):a(`v-if`,!0)],10,de))),128))])])):a(`v-if`,!0),a(` ===== 主聊天区域 ===== `),Y.value||!H.value.showContacts?(p(),o(`div`,T,[a(` 顶栏 `),s(`div`,E,[g(t.$slots,`header`,{},()=>[s(`span`,null,_(Y.value?.name||H.value.title),1),Y.value?.online?(p(),o(`span`,D,` 在线 `)):a(`v-if`,!0)],!0)]),a(` 消息列表 `),s(`div`,{ref_key:`messagesRef`,ref:G,class:`c-chat__messages`,onScroll:De},[a(` 加载更多 `),H.value.loadingHistory?(p(),o(`div`,O,[l(d,{size:`small`})])):a(`v-if`,!0),a(` 消息为空 `),!q.value.length&&!H.value.loadingHistory?(p(),o(`div`,k,` 暂无消息，发送第一条吧 `)):a(`v-if`,!0),a(` 消息列表 `),(p(!0),o(r,null,h(q.value,(t,n)=>(p(),o(r,{key:t.id},[a(` 时间分割 `),Me(t,n)?(p(),o(`div`,A,_(ke(t.timestamp)),1)):a(`v-if`,!0),a(` 消息条目 `),s(`div`,{class:f([`c-chat__msg`,`is-${t.sender}`])},[a(` 头像 `),t.sender===`system`?a(`v-if`,!0):(p(),o(`div`,j,[Q(t)?(p(),o(`img`,{key:0,src:Q(t),class:`c-chat__avatar`},null,8,M)):(p(),o(`div`,N,_(Oe(t).charAt(0)),1))])),a(` 消息体 `),s(`div`,P,[t.sender===`other`&&t.username?(p(),o(`span`,F,_(t.username),1)):a(`v-if`,!0),a(` 文本消息 `),t.type===`text`||t.type===`system`?(p(),o(`div`,I,_(t.content),1)):t.type===`image`?(p(),o(r,{key:2},[a(` 图片消息 `),s(`img`,{src:t.content,class:`c-chat__msg-image`,onClick:e=>V(`image-preview`,t.content)},null,8,L)],2112)):t.type===`file`?(p(),o(r,{key:3},[a(` 文件消息 `),s(`div`,{class:`c-chat__msg-file`,onClick:e=>V(`file-click`,t)},[l(e,{name:`mdi:file-document-outline`,size:28}),s(`div`,ge,[s(`span`,_e,_(t.fileName||`文件`),1),t.fileSize?(p(),o(`span`,ve,_(je(t.fileSize)),1)):a(`v-if`,!0)])],8,R)],2112)):a(`v-if`,!0),a(` 时间戳 `),H.value.showTimestamp&&t.sender!==`system`?(p(),o(`span`,ye,_($(t.timestamp)),1)):a(`v-if`,!0),a(` 发送状态 `),t.sender===`self`&&t.status?(p(),o(`span`,{key:5,class:f([`c-chat__msg-status`,`is-${t.status}`]),onClick:e=>t.status===`failed`&&V(`resend`,t)},_(t.status===`sending`?`发送中...`:t.status===`failed`?`发送失败，点击重试`:``),11,be)):a(`v-if`,!0)])],2)],64))),128))],544),a(` 输入区域 `),s(`div`,xe,[s(`div`,Se,[g(t.$slots,`input-actions`,{},()=>[l(m,{quaternary:``,circle:``,size:`small`,onClick:i[1]||=e=>V(`emoji-click`)},{icon:v(()=>[l(e,{name:`mdi:emoticon-happy-outline`,size:18})]),_:1}),l(m,{quaternary:``,circle:``,size:`small`,onClick:i[2]||=e=>V(`file-upload`)},{icon:v(()=>[l(e,{name:`mdi:paperclip`,size:18})]),_:1})],!0)]),s(`div`,Ce,[l(u,{value:U.value,"onUpdate:value":i[3]||=e=>U.value=e,placeholder:H.value.placeholder,type:`textarea`,autosize:{minRows:1,maxRows:4},onKeydown:ie(ae(X,[`exact`,`prevent`]),[`enter`])},null,8,[`value`,`placeholder`,`onKeydown`])]),H.value.showSendBtn?(p(),ne(m,{key:0,type:`primary`,disabled:!U.value.trim(),class:`c-chat__send-btn`,onClick:X},{icon:v(()=>[l(e,{name:`mdi:send`,size:16})]),_:1},8,[`disabled`])):a(`v-if`,!0)])])):(p(),o(r,{key:2},[a(` ===== 未选中联系人空态 ===== `),s(`div`,we,[l(e,{name:`mdi:chat-processing-outline`,size:48,class:`c-chat__no-chat-icon`}),i[5]||=s(`span`,null,`选择一个会话开始聊天`,-1)])],2112))])}}}),[[`__scopeId`,`data-v-5e7f3fe9`]]);export{y as n,z as t};
+//# sourceMappingURL=C_Chat2.js.map