@robot-admin/naive-ui-components 0.10.2 → 0.11.0

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.
Files changed (652) hide show
  1. package/CHANGELOG.md +111 -94
  2. package/LICENSE +21 -21
  3. package/README.md +463 -315
  4. package/README_EN.md +404 -0
  5. package/SECURITY.md +23 -0
  6. package/dist/C_ActionBar.cjs +1 -1
  7. package/dist/C_ActionBar.css +46 -48
  8. package/dist/C_ActionBar.d.cts +1 -1
  9. package/dist/C_ActionBar.js +1 -1
  10. package/dist/C_ActionBar2.cjs +1 -0
  11. package/dist/C_ActionBar2.js +1 -2
  12. package/dist/C_AntV.cjs +1 -1
  13. package/dist/C_AntV.css +3 -3
  14. package/dist/C_AntV.d.cts +1 -1
  15. package/dist/C_AntV.js +1 -1
  16. package/dist/C_AntV2.cjs +4 -0
  17. package/dist/C_AntV2.js +3 -4
  18. package/dist/C_AudioPlayer.cjs +1 -1
  19. package/dist/C_AudioPlayer.css +15 -7
  20. package/dist/C_AudioPlayer.d.cts +1 -1
  21. package/dist/C_AudioPlayer.js +1 -1
  22. package/dist/C_AudioPlayer2.cjs +1 -0
  23. package/dist/C_AudioPlayer2.js +1 -2
  24. package/dist/C_AvatarGroup.cjs +1 -1
  25. package/dist/C_AvatarGroup.css +15 -7
  26. package/dist/C_AvatarGroup.d.cts +1 -1
  27. package/dist/C_AvatarGroup2.cjs +1 -0
  28. package/dist/C_AvatarGroup2.js +1 -2
  29. package/dist/C_Barcode.cjs +1 -1
  30. package/dist/C_Barcode.css +0 -2
  31. package/dist/C_Barcode.d.cts +1 -1
  32. package/dist/C_Barcode2.cjs +1 -0
  33. package/dist/C_Barcode2.js +1 -2
  34. package/dist/C_Breadcrumb.cjs +1 -1
  35. package/dist/C_Breadcrumb.css +0 -2
  36. package/dist/C_Breadcrumb.d.cts +2 -2
  37. package/dist/C_Breadcrumb.d.ts +1 -1
  38. package/dist/C_Breadcrumb.js +1 -1
  39. package/dist/C_Breadcrumb2.cjs +1 -0
  40. package/dist/C_Breadcrumb2.js +1 -2
  41. package/dist/C_Captcha.cjs +1 -1
  42. package/dist/C_Captcha.css +46 -21
  43. package/dist/C_Captcha.d.cts +3 -2
  44. package/dist/C_Captcha.d.ts +3 -2
  45. package/dist/C_Captcha.js +1 -1
  46. package/dist/C_Captcha2.cjs +1 -0
  47. package/dist/C_Captcha2.js +1 -2
  48. package/dist/C_Cascade.cjs +1 -1
  49. package/dist/C_Cascade.css +0 -2
  50. package/dist/C_Cascade.d.cts +1 -1
  51. package/dist/C_Cascade.d.ts +1 -1
  52. package/dist/C_Cascade2.cjs +1 -0
  53. package/dist/C_Cascade2.js +1 -2
  54. package/dist/C_Chat.cjs +1 -1
  55. package/dist/C_Chat.css +0 -2
  56. package/dist/C_Chat.d.cts +1 -1
  57. package/dist/C_Chat.d.ts +1 -1
  58. package/dist/C_Chat.js +1 -1
  59. package/dist/C_Chat2.cjs +1 -0
  60. package/dist/C_Chat2.js +1 -2
  61. package/dist/C_City.cjs +1 -1
  62. package/dist/C_City.css +28 -30
  63. package/dist/C_City.d.cts +1 -1
  64. package/dist/C_City.d.ts +1 -1
  65. package/dist/C_City2.cjs +1 -0
  66. package/dist/C_City2.js +1 -2
  67. package/dist/C_Code.cjs +1 -1
  68. package/dist/C_Code.css +241 -4
  69. package/dist/C_Code.d.cts +1 -1
  70. package/dist/C_Code.d.ts +1 -1
  71. package/dist/C_Code.js +1 -1
  72. package/dist/C_Code2.cjs +1 -0
  73. package/dist/C_Code2.js +1 -2
  74. package/dist/C_CollapsePanel.cjs +1 -1
  75. package/dist/C_CollapsePanel.css +12 -6
  76. package/dist/C_CollapsePanel.d.cts +1 -1
  77. package/dist/C_CollapsePanel.js +1 -1
  78. package/dist/C_CollapsePanel2.cjs +1 -0
  79. package/dist/C_CollapsePanel2.js +1 -2
  80. package/dist/C_ContextMenu.cjs +1 -1
  81. package/dist/C_ContextMenu.css +16 -18
  82. package/dist/C_ContextMenu.d.cts +1 -1
  83. package/dist/C_ContextMenu.d.ts +1 -1
  84. package/dist/C_ContextMenu.js +1 -1
  85. package/dist/C_ContextMenu2.cjs +1 -0
  86. package/dist/C_ContextMenu2.js +1 -2
  87. package/dist/C_Cron.cjs +1 -1
  88. package/dist/C_Cron.css +18 -8
  89. package/dist/C_Cron.d.cts +1 -1
  90. package/dist/C_Cron.js +1 -1
  91. package/dist/C_Cron2.cjs +1 -0
  92. package/dist/C_Cron2.js +1 -2
  93. package/dist/C_Date.cjs +1 -1
  94. package/dist/C_Date.css +1 -0
  95. package/dist/C_Date.d.cts +2 -2
  96. package/dist/C_Date.d.ts +2 -2
  97. package/dist/C_Date2.cjs +1 -0
  98. package/dist/C_Date2.js +1 -2
  99. package/dist/C_Draggable.cjs +1 -1
  100. package/dist/C_Draggable.css +9 -5
  101. package/dist/C_Draggable.d.cts +1 -1
  102. package/dist/C_Draggable2.cjs +1 -0
  103. package/dist/C_Draggable2.js +1 -2
  104. package/dist/C_Editor.cjs +1 -1
  105. package/dist/C_Editor.css +80 -67
  106. package/dist/C_Editor.d.cts +1 -1
  107. package/dist/C_Editor.d.ts +1 -1
  108. package/dist/C_Editor2.cjs +1 -0
  109. package/dist/C_Editor2.js +1 -2
  110. package/dist/C_FilePreview.cjs +1 -1
  111. package/dist/C_FilePreview.css +0 -2
  112. package/dist/C_FilePreview.d.cts +1 -1
  113. package/dist/C_FilePreview.js +1 -1
  114. package/dist/C_FilePreview2.cjs +1 -0
  115. package/dist/C_FilePreview2.js +1 -2
  116. package/dist/C_Form.base.css +980 -0
  117. package/dist/C_Form.cjs +1 -1
  118. package/dist/C_Form.css +256 -155
  119. package/dist/C_Form.d.cts +2 -2
  120. package/dist/C_Form.d.ts +2 -2
  121. package/dist/C_Form.js +1 -1
  122. package/dist/C_Form2.cjs +1 -0
  123. package/dist/C_Form2.js +1 -2
  124. package/dist/C_FormSearch.cjs +1 -1
  125. package/dist/C_FormSearch.css +47 -47
  126. package/dist/C_FormSearch.d.cts +2 -2
  127. package/dist/C_FormSearch.d.ts +2 -2
  128. package/dist/C_FormSearch2.cjs +1 -0
  129. package/dist/C_FormSearch2.js +1 -2
  130. package/dist/C_FormulaEditor.cjs +1 -1
  131. package/dist/C_FormulaEditor.css +64 -38
  132. package/dist/C_FormulaEditor.d.cts +1 -1
  133. package/dist/C_FormulaEditor.js +1 -1
  134. package/dist/C_FormulaEditor2.cjs +2 -0
  135. package/dist/C_FormulaEditor2.js +2 -2
  136. package/dist/C_FullCalendar.cjs +1 -1
  137. package/dist/C_FullCalendar.css +0 -2
  138. package/dist/C_FullCalendar.d.cts +1 -1
  139. package/dist/C_FullCalendar2.cjs +1 -0
  140. package/dist/C_FullCalendar2.js +1 -2
  141. package/dist/C_GlobalSearch.cjs +1 -1
  142. package/dist/C_GlobalSearch.css +111 -113
  143. package/dist/C_GlobalSearch.d.cts +1 -1
  144. package/dist/C_GlobalSearch2.cjs +1 -0
  145. package/dist/C_GlobalSearch2.js +1 -2
  146. package/dist/C_Guide.cjs +1 -1
  147. package/dist/C_Guide.css +1 -0
  148. package/dist/C_Guide.d.cts +1 -1
  149. package/dist/C_Guide.d.ts +1 -1
  150. package/dist/C_Guide.js +1 -1
  151. package/dist/C_Guide2.cjs +1 -0
  152. package/dist/C_Guide2.js +1 -2
  153. package/dist/C_Icon.cjs +1 -1
  154. package/dist/C_Icon.css +58 -0
  155. package/dist/C_Icon.d.cts +1 -1
  156. package/dist/C_Icon.d.ts +1 -1
  157. package/dist/C_Icon2.cjs +1 -0
  158. package/dist/C_Icon2.js +1 -2
  159. package/dist/C_ImageCropper.cjs +1 -1
  160. package/dist/C_ImageCropper.css +0 -2
  161. package/dist/C_ImageCropper.d.cts +1 -1
  162. package/dist/C_ImageCropper.js +1 -1
  163. package/dist/C_ImageCropper2.cjs +1 -0
  164. package/dist/C_ImageCropper2.js +1 -2
  165. package/dist/C_Language.cjs +1 -1
  166. package/dist/C_Language.css +1 -0
  167. package/dist/C_Language.d.cts +1 -1
  168. package/dist/C_Language.d.ts +1 -1
  169. package/dist/C_Language.js +1 -1
  170. package/dist/C_Language2.cjs +1 -0
  171. package/dist/C_Language2.js +1 -2
  172. package/dist/C_Login.cjs +1 -1
  173. package/dist/C_Login.css +92 -76
  174. package/dist/C_Login.d.cts +1 -1
  175. package/dist/C_Login.d.ts +1 -1
  176. package/dist/C_Login.js +1 -1
  177. package/dist/C_Login2.cjs +1 -0
  178. package/dist/C_Login2.js +1 -2
  179. package/dist/C_Map.cjs +1 -1
  180. package/dist/C_Map.css +665 -5
  181. package/dist/C_Map.d.cts +1 -1
  182. package/dist/C_Map2.cjs +1 -0
  183. package/dist/C_Map2.js +1 -2
  184. package/dist/C_Markdown.cjs +1 -1
  185. package/dist/C_Markdown.css +940 -35
  186. package/dist/C_Markdown.d.cts +1 -1
  187. package/dist/C_Markdown.d.ts +1 -1
  188. package/dist/C_Markdown2.cjs +1 -0
  189. package/dist/C_Markdown2.js +1 -2
  190. package/dist/C_Menu.cjs +1 -1
  191. package/dist/C_Menu.css +1 -0
  192. package/dist/C_Menu.d.cts +3 -3
  193. package/dist/C_Menu.d.ts +3 -3
  194. package/dist/C_Menu2.cjs +1 -0
  195. package/dist/C_Menu2.js +1 -2
  196. package/dist/C_NotificationCenter.cjs +1 -1
  197. package/dist/C_NotificationCenter.css +95 -47
  198. package/dist/C_NotificationCenter.d.cts +1 -1
  199. package/dist/C_NotificationCenter.js +1 -1
  200. package/dist/C_NotificationCenter2.cjs +1 -0
  201. package/dist/C_NotificationCenter2.js +1 -2
  202. package/dist/C_OrgChart.cjs +1 -1
  203. package/dist/C_OrgChart.css +6 -4
  204. package/dist/C_OrgChart.d.cts +1 -1
  205. package/dist/C_OrgChart.d.ts +1 -1
  206. package/dist/C_OrgChart2.cjs +1 -0
  207. package/dist/C_OrgChart2.js +1 -2
  208. package/dist/C_Progress.cjs +1 -1
  209. package/dist/C_Progress.css +1 -0
  210. package/dist/C_Progress.d.cts +1 -1
  211. package/dist/C_Progress.d.ts +1 -1
  212. package/dist/C_Progress2.cjs +1 -0
  213. package/dist/C_Progress2.js +1 -2
  214. package/dist/C_QRCode.cjs +1 -1
  215. package/dist/C_QRCode.css +8 -10
  216. package/dist/C_QRCode.d.cts +1 -1
  217. package/dist/C_QRCode2.cjs +1 -0
  218. package/dist/C_QRCode2.js +1 -2
  219. package/dist/C_Signature.cjs +1 -1
  220. package/dist/C_Signature.css +0 -2
  221. package/dist/C_Signature.d.cts +1 -1
  222. package/dist/C_Signature.js +1 -1
  223. package/dist/C_Signature2.cjs +1 -0
  224. package/dist/C_Signature2.js +1 -2
  225. package/dist/C_Skeleton.cjs +1 -1
  226. package/dist/C_Skeleton.css +0 -2
  227. package/dist/C_Skeleton.d.cts +1 -1
  228. package/dist/C_Skeleton.d.ts +1 -1
  229. package/dist/C_Skeleton2.cjs +1 -0
  230. package/dist/C_Skeleton2.js +1 -2
  231. package/dist/C_SplitPane.cjs +1 -1
  232. package/dist/C_SplitPane.css +27 -11
  233. package/dist/C_SplitPane.d.cts +1 -1
  234. package/dist/C_SplitPane.js +1 -1
  235. package/dist/C_SplitPane2.cjs +1 -0
  236. package/dist/C_SplitPane2.js +1 -2
  237. package/dist/C_Steps.cjs +1 -1
  238. package/dist/C_Steps.css +37 -39
  239. package/dist/C_Steps.d.cts +1 -1
  240. package/dist/C_Steps.d.ts +1 -1
  241. package/dist/C_Steps2.cjs +1 -0
  242. package/dist/C_Steps2.js +1 -2
  243. package/dist/C_Table.base.css +1588 -0
  244. package/dist/C_Table.cjs +1 -1
  245. package/dist/C_Table.css +1202 -112
  246. package/dist/C_Table.d.cts +2 -2
  247. package/dist/C_Table.d.ts +11 -2
  248. package/dist/C_Table.js +1 -1
  249. package/dist/C_TagsView.cjs +1 -1
  250. package/dist/C_TagsView.css +44 -40
  251. package/dist/C_TagsView.d.cts +2 -2
  252. package/dist/C_TagsView.d.ts +2 -2
  253. package/dist/C_TagsView.js +1 -1
  254. package/dist/C_TagsView2.cjs +1 -0
  255. package/dist/C_TagsView2.js +1 -2
  256. package/dist/C_Theme.cjs +1 -1
  257. package/dist/C_Theme.css +1 -0
  258. package/dist/C_Theme.d.cts +1 -1
  259. package/dist/C_Theme.d.ts +1 -1
  260. package/dist/C_Theme.js +1 -1
  261. package/dist/C_Theme2.cjs +1 -0
  262. package/dist/C_Theme2.js +1 -2
  263. package/dist/C_Time.cjs +1 -1
  264. package/dist/C_Time.css +0 -2
  265. package/dist/C_Time.d.cts +2 -2
  266. package/dist/C_Time.d.ts +2 -2
  267. package/dist/C_Time2.cjs +1 -0
  268. package/dist/C_Time2.js +1 -2
  269. package/dist/C_Timeline.cjs +1 -1
  270. package/dist/C_Timeline.css +44 -46
  271. package/dist/C_Timeline.d.cts +1 -1
  272. package/dist/C_Timeline.js +1 -1
  273. package/dist/C_Timeline2.cjs +1 -0
  274. package/dist/C_Timeline2.js +1 -2
  275. package/dist/C_Transfer.cjs +1 -1
  276. package/dist/C_Transfer.css +21 -9
  277. package/dist/C_Transfer.d.cts +1 -1
  278. package/dist/C_Transfer.js +1 -1
  279. package/dist/C_Transfer2.cjs +1 -0
  280. package/dist/C_Transfer2.js +1 -2
  281. package/dist/C_Tree.cjs +1 -1
  282. package/dist/C_Tree.css +0 -2
  283. package/dist/C_Tree.d.cts +1 -1
  284. package/dist/C_Tree.js +1 -1
  285. package/dist/C_Tree2.cjs +1 -0
  286. package/dist/C_Tree2.js +1 -2
  287. package/dist/C_Upload.cjs +1 -1
  288. package/dist/C_Upload.css +17 -17
  289. package/dist/C_Upload.d.cts +1 -1
  290. package/dist/C_Upload.js +1 -1
  291. package/dist/C_Upload2.cjs +1 -0
  292. package/dist/C_Upload2.js +1 -25
  293. package/dist/C_VideoPlayer.cjs +1 -1
  294. package/dist/C_VideoPlayer.css +35 -24
  295. package/dist/C_VideoPlayer.d.cts +2 -2
  296. package/dist/C_VideoPlayer.d.ts +2 -2
  297. package/dist/C_VideoPlayer.js +1 -1
  298. package/dist/C_VideoPlayer2.cjs +3 -0
  299. package/dist/C_VideoPlayer2.js +3 -4
  300. package/dist/C_VtableGantt.cjs +1 -1
  301. package/dist/C_VtableGantt.css +15 -7
  302. package/dist/C_VtableGantt.d.cts +1 -1
  303. package/dist/C_VtableGantt.d.ts +1 -1
  304. package/dist/C_VtableGantt.js +1 -1
  305. package/dist/C_VtableGantt2.cjs +1 -0
  306. package/dist/C_VtableGantt2.js +1 -2
  307. package/dist/C_WaterFall.cjs +1 -1
  308. package/dist/C_WaterFall.css +15 -17
  309. package/dist/C_WaterFall.d.cts +1 -1
  310. package/dist/C_WaterFall2.cjs +1 -0
  311. package/dist/C_WaterFall2.js +1 -2
  312. package/dist/C_WorkFlow.cjs +1 -1
  313. package/dist/C_WorkFlow.css +257 -197
  314. package/dist/C_WorkFlow.d.cts +1 -1
  315. package/dist/C_WorkFlow.js +1 -1
  316. package/dist/C_WorkFlow2.cjs +1 -0
  317. package/dist/C_WorkFlow2.js +1 -2
  318. package/dist/city.cjs +1 -0
  319. package/dist/city.js +1 -2
  320. package/dist/config.cjs +1 -0
  321. package/dist/config.d.cts +33 -0
  322. package/dist/config.d.ts +33 -0
  323. package/dist/config.js +1 -0
  324. package/dist/constants.d.cts +272 -0
  325. package/dist/constants.d.ts +2 -3
  326. package/dist/constants2.d.cts +177 -0
  327. package/dist/constants2.d.ts +3 -4
  328. package/dist/constants3.d.cts +479 -0
  329. package/dist/constants3.d.ts +16 -12
  330. package/dist/constants4.d.cts +420 -0
  331. package/dist/constants4.d.ts +27 -37
  332. package/dist/constants5.d.cts +491 -0
  333. package/dist/constants5.d.ts +20 -4
  334. package/dist/data.cjs +1 -0
  335. package/dist/data.d.cts +67 -0
  336. package/dist/data.d.ts +12 -12
  337. package/dist/data.js +1 -0
  338. package/dist/export-helper.cjs +1 -0
  339. package/dist/helpers.cjs +1 -0
  340. package/dist/helpers.js +1 -0
  341. package/dist/html.cjs +1 -0
  342. package/dist/html.js +1 -0
  343. package/dist/images/marker-icon-2x.png +0 -0
  344. package/dist/images/marker-icon.png +0 -0
  345. package/dist/images/marker-shadow.png +0 -0
  346. package/dist/index.cjs +1 -2
  347. package/dist/index.d.cts +60 -99
  348. package/dist/index.d.ts +75 -164
  349. package/dist/index.js +1 -2
  350. package/dist/index.vue.d.cts +79 -0
  351. package/dist/index.vue.d.ts +3 -4
  352. package/dist/index10.vue.d.cts +47 -0
  353. package/dist/index10.vue.d.ts +80 -40
  354. package/dist/index11.vue.d.cts +88 -0
  355. package/dist/index11.vue.d.ts +68 -78
  356. package/dist/index12.vue.d.cts +79 -0
  357. package/dist/index12.vue.d.ts +49 -45
  358. package/dist/index13.vue.d.cts +64 -0
  359. package/dist/index13.vue.d.ts +99 -34
  360. package/dist/index14.vue.d.cts +106 -0
  361. package/dist/index14.vue.d.ts +82 -99
  362. package/dist/index15.vue.d.cts +91 -0
  363. package/dist/index15.vue.d.ts +25 -83
  364. package/dist/index16.vue.d.cts +34 -0
  365. package/dist/index16.vue.d.ts +113 -24
  366. package/dist/index17.vue.d.cts +124 -0
  367. package/dist/index17.vue.d.ts +76 -110
  368. package/dist/index18.vue.d.cts +83 -0
  369. package/dist/index18.vue.d.ts +67 -73
  370. package/dist/index19.vue.d.cts +101 -0
  371. package/dist/index19.vue.d.ts +93 -59
  372. package/dist/index2.vue.d.cts +82 -0
  373. package/dist/index2.vue.d.ts +7 -8
  374. package/dist/index20.vue.d.cts +54 -0
  375. package/dist/index20.vue.d.ts +40 -88
  376. package/dist/index21.vue.d.cts +103 -0
  377. package/dist/index21.vue.d.ts +89 -41
  378. package/dist/index22.vue.d.cts +45 -0
  379. package/dist/index22.vue.d.ts +37 -96
  380. package/dist/index23.vue.d.cts +19 -0
  381. package/dist/index23.vue.d.ts +8 -35
  382. package/dist/{index28.vue.d.ts → index24.vue.d.cts} +4 -5
  383. package/dist/index24.vue.d.ts +650 -86
  384. package/dist/index25.vue.d.cts +96 -0
  385. package/dist/index25.vue.d.ts +86 -10
  386. package/dist/index26.vue.d.cts +111 -0
  387. package/dist/index26.vue.d.ts +4 -5
  388. package/dist/index27.vue.d.cts +80 -0
  389. package/dist/index27.vue.d.ts +2 -3
  390. package/dist/index3.vue.d.cts +87 -0
  391. package/dist/index3.vue.d.ts +4 -5
  392. package/dist/index4.vue.d.cts +37 -0
  393. package/dist/index4.vue.d.ts +6 -7
  394. package/dist/index5.vue.d.cts +133 -0
  395. package/dist/index5.vue.d.ts +2 -3
  396. package/dist/index6.vue.d.cts +29 -0
  397. package/dist/index6.vue.d.ts +25 -38
  398. package/dist/index7.vue.d.cts +32 -0
  399. package/dist/index7.vue.d.ts +117 -23
  400. package/dist/index8.vue.d.cts +127 -0
  401. package/dist/index8.vue.d.ts +17 -111
  402. package/dist/index9.vue.d.cts +34 -0
  403. package/dist/index9.vue.d.ts +38 -26
  404. package/dist/public.d.ts +166 -0
  405. package/dist/resolver.cjs +1 -2
  406. package/dist/resolver.d.cts +6 -4
  407. package/dist/resolver.d.ts +6 -4
  408. package/dist/resolver.js +1 -2
  409. package/dist/storage.cjs +1 -0
  410. package/dist/storage.js +1 -2
  411. package/dist/style.css +9864 -7702
  412. package/dist/types.d.cts +107 -0
  413. package/dist/types.d.ts +52 -102
  414. package/dist/types2.d.cts +58 -0
  415. package/dist/useCalendarEvents.d.cts +150 -0
  416. package/dist/useCalendarEvents.d.ts +3 -4
  417. package/dist/useCollapsePanel.d.cts +133 -0
  418. package/dist/useCollapsePanel.d.ts +2 -3
  419. package/dist/useCropperCore.d.cts +104 -0
  420. package/dist/useCropperCore.d.ts +11 -9
  421. package/dist/useDraggableLayout.d.cts +196 -0
  422. package/dist/useDraggableLayout.d.ts +17 -15
  423. package/dist/useDynamicFormState.d.cts +749 -0
  424. package/dist/useDynamicFormState.d.ts +234 -112
  425. package/dist/useEdgeInteraction.d.cts +324 -0
  426. package/dist/useEdgeInteraction.d.ts +6 -7
  427. package/dist/useFullscreen.d.cts +165 -0
  428. package/dist/useFullscreen.d.ts +1 -2
  429. package/dist/useGlobalSearch.d.cts +110 -0
  430. package/dist/useGlobalSearch.d.ts +17 -9
  431. package/dist/useInfiniteScroll.d.cts +177 -0
  432. package/dist/useInfiniteScroll.d.ts +13 -5
  433. package/dist/useQRCode.d.cts +89 -0
  434. package/dist/useQRCode.d.ts +5 -3
  435. package/dist/useSearchState.d.cts +871 -0
  436. package/dist/useSearchState.d.ts +830 -30
  437. package/dist/useSignatureHistory.d.cts +197 -0
  438. package/dist/useSignatureHistory.d.ts +10 -5
  439. package/dist/useSplitResize.d.cts +157 -0
  440. package/dist/useSplitResize.d.ts +3 -4
  441. package/dist/useTableQuery.cjs +3 -0
  442. package/dist/{useModalEdit.d.ts → useTableQuery.d.cts} +624 -211
  443. package/dist/useTableQuery.d.ts +1721 -0
  444. package/dist/useTableQuery.js +3 -0
  445. package/dist/useTimeSelection.d.cts +116 -0
  446. package/dist/useTimeSelection.d.ts +20 -9
  447. package/dist/useTreeOperations.d.cts +185 -0
  448. package/dist/useTreeOperations.d.ts +13 -11
  449. package/dist/useWorkflowValidation.d.cts +1051 -0
  450. package/dist/useWorkflowValidation.d.ts +62 -63
  451. package/dist/verification.d.cts +58 -0
  452. package/dist/verification.d.ts +58 -0
  453. package/package.json +102 -69
  454. package/dist/C_ActionBar-BAcfOfRw.css.map +0 -1
  455. package/dist/C_ActionBar-DG2HW7t5.css.map +0 -1
  456. package/dist/C_ActionBar.js.map +0 -1
  457. package/dist/C_ActionBar2.js.map +0 -1
  458. package/dist/C_AntV-D_jTK8oZ.css.map +0 -1
  459. package/dist/C_AntV-DanTAq22.css.map +0 -1
  460. package/dist/C_AntV.js.map +0 -1
  461. package/dist/C_AntV2.js.map +0 -1
  462. package/dist/C_AudioPlayer-BnYIJXPD.css.map +0 -1
  463. package/dist/C_AudioPlayer-Cj4lUdZo.css.map +0 -1
  464. package/dist/C_AudioPlayer.js.map +0 -1
  465. package/dist/C_AudioPlayer2.js.map +0 -1
  466. package/dist/C_AvatarGroup-B9d-GJ9c.css.map +0 -1
  467. package/dist/C_AvatarGroup-D3PwsKME.css.map +0 -1
  468. package/dist/C_AvatarGroup.js.map +0 -1
  469. package/dist/C_AvatarGroup2.js.map +0 -1
  470. package/dist/C_Barcode-CAU2mFcx.css.map +0 -1
  471. package/dist/C_Barcode-D2oJaEg3.css.map +0 -1
  472. package/dist/C_Barcode.js.map +0 -1
  473. package/dist/C_Barcode2.js.map +0 -1
  474. package/dist/C_Breadcrumb-BiH0d9AI.css.map +0 -1
  475. package/dist/C_Breadcrumb-DOcLt9uX.css.map +0 -1
  476. package/dist/C_Breadcrumb.js.map +0 -1
  477. package/dist/C_Breadcrumb2.js.map +0 -1
  478. package/dist/C_Captcha-B3yrtG7t.css.map +0 -1
  479. package/dist/C_Captcha-D4hDdWDu.css.map +0 -1
  480. package/dist/C_Captcha.js.map +0 -1
  481. package/dist/C_Captcha2.js.map +0 -1
  482. package/dist/C_Cascade-CmCrLVft.css.map +0 -1
  483. package/dist/C_Cascade-U6A5AJJb.css.map +0 -1
  484. package/dist/C_Cascade.js.map +0 -1
  485. package/dist/C_Cascade2.js.map +0 -1
  486. package/dist/C_Chat-DeUv6uuI.css.map +0 -1
  487. package/dist/C_Chat-DwatUQqu.css.map +0 -1
  488. package/dist/C_Chat.js.map +0 -1
  489. package/dist/C_Chat2.js.map +0 -1
  490. package/dist/C_City-DdkX6u64.css.map +0 -1
  491. package/dist/C_City-iP-dIvui.css.map +0 -1
  492. package/dist/C_City.js.map +0 -1
  493. package/dist/C_City2.js.map +0 -1
  494. package/dist/C_Code-BWmJMNS7.css.map +0 -1
  495. package/dist/C_Code-k14vjgVl.css.map +0 -1
  496. package/dist/C_Code.js.map +0 -1
  497. package/dist/C_Code2.js.map +0 -1
  498. package/dist/C_CollapsePanel-BSKcWSmY.css.map +0 -1
  499. package/dist/C_CollapsePanel-DRvRq8tB.css.map +0 -1
  500. package/dist/C_CollapsePanel.js.map +0 -1
  501. package/dist/C_CollapsePanel2.js.map +0 -1
  502. package/dist/C_ContextMenu-C9iuxG2n.css.map +0 -1
  503. package/dist/C_ContextMenu-CD0iaSju.css.map +0 -1
  504. package/dist/C_ContextMenu.js.map +0 -1
  505. package/dist/C_ContextMenu2.js.map +0 -1
  506. package/dist/C_Cron-BIQ2By9v.css.map +0 -1
  507. package/dist/C_Cron-BNSAGD6A.css.map +0 -1
  508. package/dist/C_Cron.js.map +0 -1
  509. package/dist/C_Cron2.js.map +0 -1
  510. package/dist/C_Date.js.map +0 -1
  511. package/dist/C_Date2.js.map +0 -1
  512. package/dist/C_Draggable-BDAbk4s5.css.map +0 -1
  513. package/dist/C_Draggable-UhfDLXop.css.map +0 -1
  514. package/dist/C_Draggable.js.map +0 -1
  515. package/dist/C_Draggable2.js.map +0 -1
  516. package/dist/C_Editor-CZOaChru.css.map +0 -1
  517. package/dist/C_Editor-kJAQq5z6.css.map +0 -1
  518. package/dist/C_Editor.js.map +0 -1
  519. package/dist/C_Editor2.js.map +0 -1
  520. package/dist/C_FilePreview-Bs_omgJS.css.map +0 -1
  521. package/dist/C_FilePreview-DbwoyF2j.css.map +0 -1
  522. package/dist/C_FilePreview.js.map +0 -1
  523. package/dist/C_FilePreview2.js.map +0 -1
  524. package/dist/C_Form-B_2ql62V.css.map +0 -1
  525. package/dist/C_Form-CX-7xsz3.css.map +0 -1
  526. package/dist/C_Form.js.map +0 -1
  527. package/dist/C_Form2.js.map +0 -1
  528. package/dist/C_FormSearch-C3F8peAY.css.map +0 -1
  529. package/dist/C_FormSearch-qW56bJPo.css.map +0 -1
  530. package/dist/C_FormSearch.js.map +0 -1
  531. package/dist/C_FormSearch2.js.map +0 -1
  532. package/dist/C_FormulaEditor-ChOvDbsZ.css.map +0 -1
  533. package/dist/C_FormulaEditor-mfiIUDY4.css.map +0 -1
  534. package/dist/C_FormulaEditor.js.map +0 -1
  535. package/dist/C_FormulaEditor2.js.map +0 -1
  536. package/dist/C_FullCalendar-C2nsqrgS.css.map +0 -1
  537. package/dist/C_FullCalendar-DdFtXVhy.css.map +0 -1
  538. package/dist/C_FullCalendar.js.map +0 -1
  539. package/dist/C_FullCalendar2.js.map +0 -1
  540. package/dist/C_GlobalSearch-Dq4Wo01K.css.map +0 -1
  541. package/dist/C_GlobalSearch-RB7J43gu.css.map +0 -1
  542. package/dist/C_GlobalSearch.js.map +0 -1
  543. package/dist/C_GlobalSearch2.js.map +0 -1
  544. package/dist/C_Guide.js.map +0 -1
  545. package/dist/C_Guide2.js.map +0 -1
  546. package/dist/C_Icon.js.map +0 -1
  547. package/dist/C_Icon2.js.map +0 -1
  548. package/dist/C_ImageCropper-CdTX2nxU.css.map +0 -1
  549. package/dist/C_ImageCropper-ilOqPklJ.css.map +0 -1
  550. package/dist/C_ImageCropper.js.map +0 -1
  551. package/dist/C_ImageCropper2.js.map +0 -1
  552. package/dist/C_Language.js.map +0 -1
  553. package/dist/C_Language2.js.map +0 -1
  554. package/dist/C_Login-BrQBs_m4.css.map +0 -1
  555. package/dist/C_Login-xMI1_ojE.css.map +0 -1
  556. package/dist/C_Login.js.map +0 -1
  557. package/dist/C_Login2.js.map +0 -1
  558. package/dist/C_Map-CWMMN58_.css.map +0 -1
  559. package/dist/C_Map-xSR2H-9o.css.map +0 -1
  560. package/dist/C_Map.js.map +0 -1
  561. package/dist/C_Map2.js.map +0 -1
  562. package/dist/C_Markdown-C7lTVJ1S.css.map +0 -1
  563. package/dist/C_Markdown-CZDm_baQ.css.map +0 -1
  564. package/dist/C_Markdown.js.map +0 -1
  565. package/dist/C_Markdown2.js.map +0 -1
  566. package/dist/C_Menu.js.map +0 -1
  567. package/dist/C_Menu2.js.map +0 -1
  568. package/dist/C_NotificationCenter-D7GGGWg7.css.map +0 -1
  569. package/dist/C_NotificationCenter-SSmeHA45.css.map +0 -1
  570. package/dist/C_NotificationCenter.js.map +0 -1
  571. package/dist/C_NotificationCenter2.js.map +0 -1
  572. package/dist/C_OrgChart-BXEp4i4w.css.map +0 -1
  573. package/dist/C_OrgChart-DqBufOv5.css.map +0 -1
  574. package/dist/C_OrgChart.js.map +0 -1
  575. package/dist/C_OrgChart2.js.map +0 -1
  576. package/dist/C_Progress.js.map +0 -1
  577. package/dist/C_Progress2.js.map +0 -1
  578. package/dist/C_QRCode-B_1lHUdx.css.map +0 -1
  579. package/dist/C_QRCode-CuQRYu0s.css.map +0 -1
  580. package/dist/C_QRCode.js.map +0 -1
  581. package/dist/C_QRCode2.js.map +0 -1
  582. package/dist/C_Signature-Bp-RBpAl.css.map +0 -1
  583. package/dist/C_Signature-Cb2VW1ok.css.map +0 -1
  584. package/dist/C_Signature.js.map +0 -1
  585. package/dist/C_Signature2.js.map +0 -1
  586. package/dist/C_Skeleton-BJoFYwrF.css.map +0 -1
  587. package/dist/C_Skeleton-Djsjw8XY.css.map +0 -1
  588. package/dist/C_Skeleton.js.map +0 -1
  589. package/dist/C_Skeleton2.js.map +0 -1
  590. package/dist/C_SplitPane-CgGWYsRE.css.map +0 -1
  591. package/dist/C_SplitPane-DGf6WEeR.css.map +0 -1
  592. package/dist/C_SplitPane.js.map +0 -1
  593. package/dist/C_SplitPane2.js.map +0 -1
  594. package/dist/C_Steps-27Exh7PM.css.map +0 -1
  595. package/dist/C_Steps-DU9ZsFrs.css.map +0 -1
  596. package/dist/C_Steps.js.map +0 -1
  597. package/dist/C_Steps2.js.map +0 -1
  598. package/dist/C_Table--kbQaaBv.css.map +0 -1
  599. package/dist/C_Table-D631kdXC.css.map +0 -1
  600. package/dist/C_Table.js.map +0 -1
  601. package/dist/C_Table2.js +0 -4
  602. package/dist/C_Table2.js.map +0 -1
  603. package/dist/C_TagsView-DtGtYhBH.css.map +0 -1
  604. package/dist/C_TagsView-s1dnSJAV.css.map +0 -1
  605. package/dist/C_TagsView.js.map +0 -1
  606. package/dist/C_TagsView2.js.map +0 -1
  607. package/dist/C_Theme.js.map +0 -1
  608. package/dist/C_Theme2.js.map +0 -1
  609. package/dist/C_Time-BQ9PGy8B.css.map +0 -1
  610. package/dist/C_Time-CO73krC6.css.map +0 -1
  611. package/dist/C_Time.js.map +0 -1
  612. package/dist/C_Time2.js.map +0 -1
  613. package/dist/C_Timeline-DdESmqwL.css.map +0 -1
  614. package/dist/C_Timeline-irQcO-b7.css.map +0 -1
  615. package/dist/C_Timeline.js.map +0 -1
  616. package/dist/C_Timeline2.js.map +0 -1
  617. package/dist/C_Transfer-11y3k-WD.css.map +0 -1
  618. package/dist/C_Transfer-EzdHzZNv.css.map +0 -1
  619. package/dist/C_Transfer.js.map +0 -1
  620. package/dist/C_Transfer2.js.map +0 -1
  621. package/dist/C_Tree-CsXgGfhn.css.map +0 -1
  622. package/dist/C_Tree-P7eRpnOa.css.map +0 -1
  623. package/dist/C_Tree.js.map +0 -1
  624. package/dist/C_Tree2.js.map +0 -1
  625. package/dist/C_Upload-CHjiVVh7.css.map +0 -1
  626. package/dist/C_Upload-DE3OLsZD.css.map +0 -1
  627. package/dist/C_Upload.js.map +0 -1
  628. package/dist/C_Upload2.js.map +0 -1
  629. package/dist/C_VideoPlayer-CnaNOFtW.css.map +0 -1
  630. package/dist/C_VideoPlayer-cnP88zNV.css.map +0 -1
  631. package/dist/C_VideoPlayer.js.map +0 -1
  632. package/dist/C_VideoPlayer2.js.map +0 -1
  633. package/dist/C_VtableGantt-CZlJgvpC.css.map +0 -1
  634. package/dist/C_VtableGantt-DKfQkql0.css.map +0 -1
  635. package/dist/C_VtableGantt.js.map +0 -1
  636. package/dist/C_VtableGantt2.js.map +0 -1
  637. package/dist/C_WaterFall-BJ_39ext.css.map +0 -1
  638. package/dist/C_WaterFall-cYc1vntE.css.map +0 -1
  639. package/dist/C_WaterFall.js.map +0 -1
  640. package/dist/C_WaterFall2.js.map +0 -1
  641. package/dist/C_WorkFlow-BFzRGGhJ.css.map +0 -1
  642. package/dist/C_WorkFlow-DSyCOvRp.css.map +0 -1
  643. package/dist/C_WorkFlow.js.map +0 -1
  644. package/dist/C_WorkFlow2.js.map +0 -1
  645. package/dist/city.js.map +0 -1
  646. package/dist/index.cjs.map +0 -1
  647. package/dist/index.js.map +0 -1
  648. package/dist/index2.d.ts +0 -120
  649. package/dist/resolver.cjs.map +0 -1
  650. package/dist/resolver.js.map +0 -1
  651. package/dist/storage.js.map +0 -1
  652. /package/dist/{chunk.js → chunk.cjs} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_Chat-DwatUQqu.css","names":[],"sources":["../src/components/C_Chat/index.vue?vue&type=style&index=0&scoped=5b4bf8dc&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled *//* ─── CSS 变量(基于项目主题变量,自动适配明暗) ───────────────────────── */\n.c-chat[data-v-5b4bf8dc] {\n --chat-bg: var(--card-color);\n --chat-sidebar-bg: var(--body-color);\n --chat-sidebar-width: 280px;\n --chat-header-bg: var(--card-color);\n --chat-header-height: 56px;\n --chat-input-bg: var(--body-color);\n --chat-input-height: 56px;\n --chat-bubble-self: var(--primary-color);\n --chat-bubble-other: var(--body-color);\n --chat-bubble-system: transparent;\n --chat-text-primary: var(--app-text-primary);\n --chat-text-secondary: var(--text-color-3);\n --chat-text-self: #fff;\n --chat-border: var(--border-color);\n --chat-online-color: #22c55e;\n --chat-unread-bg: #ef4444;\n --chat-unread-color: #fff;\n --chat-failed-color: #ef4444;\n --chat-shadow: rgba(0, 0, 0, 0.06);\n --chat-shadow-light: rgba(0, 0, 0, 0.03);\n --chat-radius: 12px;\n --chat-avatar-size: 36px;\n --chat-scrollbar-thumb: var(--border-color);\n display: flex;\n width: 100%;\n height: 100%;\n min-height: 0;\n border-radius: var(--chat-radius);\n overflow: hidden;\n background: var(--chat-bg);\n color: var(--chat-text-primary);\n font-size: 14px;\n border: 1px solid var(--chat-border);\n box-shadow: 0 2px 12px var(--chat-shadow);\n}\n\n/* ─── 联系人侧栏 ──────────────────────────────────────── */\n.c-chat__sidebar[data-v-5b4bf8dc] {\n display: flex;\n flex-direction: column;\n width: var(--chat-sidebar-width);\n min-width: var(--chat-sidebar-width);\n background: var(--chat-sidebar-bg);\n border-right: 1px solid var(--chat-border);\n box-shadow: 2px 0 8px var(--chat-shadow-light);\n}\n.c-chat__sidebar-header[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n gap: 8px;\n height: var(--chat-header-height);\n padding: 0 16px;\n border-bottom: 1px solid var(--chat-border);\n font-weight: 600;\n font-size: 15px;\n}\n.c-chat__search[data-v-5b4bf8dc] {\n padding: 8px 12px;\n}\n.c-chat__contact-list[data-v-5b4bf8dc] {\n flex: 1;\n overflow-y: auto;\n overscroll-behavior: contain;\n}\n.c-chat__contact-list[data-v-5b4bf8dc]::-webkit-scrollbar {\n width: 4px;\n}\n.c-chat__contact-list[data-v-5b4bf8dc]::-webkit-scrollbar-thumb {\n background: var(--chat-scrollbar-thumb);\n border-radius: 2px;\n}\n.c-chat__contact[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 16px;\n cursor: pointer;\n transition: background 0.15s;\n}\n.c-chat__contact[data-v-5b4bf8dc]:hover {\n background: color-mix(in srgb, var(--primary-color) 6%, transparent);\n}\n.c-chat__contact.is-active[data-v-5b4bf8dc] {\n background: color-mix(in srgb, var(--primary-color) 12%, transparent);\n}\n.c-chat__contact-avatar[data-v-5b4bf8dc] {\n position: relative;\n flex-shrink: 0;\n}\n.c-chat__avatar[data-v-5b4bf8dc] {\n width: var(--chat-avatar-size);\n height: var(--chat-avatar-size);\n border-radius: 50%;\n object-fit: cover;\n background: color-mix(in srgb, var(--border-color) 50%, transparent);\n}\n.c-chat__avatar-fallback[data-v-5b4bf8dc] {\n width: var(--chat-avatar-size);\n height: var(--chat-avatar-size);\n border-radius: 50%;\n background: color-mix(in srgb, var(--primary-color) 25%, transparent);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 14px;\n font-weight: 600;\n color: var(--app-text-primary);\n}\n.c-chat__online-dot[data-v-5b4bf8dc] {\n position: absolute;\n bottom: 0;\n right: 0;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: var(--chat-online-color);\n border: 2px solid var(--chat-sidebar-bg);\n}\n.c-chat__contact-info[data-v-5b4bf8dc] {\n flex: 1;\n min-width: 0;\n}\n.c-chat__contact-name[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 13px;\n font-weight: 500;\n}\n.c-chat__contact-time[data-v-5b4bf8dc] {\n font-size: 11px;\n color: var(--chat-text-secondary);\n margin-left: 8px;\n flex-shrink: 0;\n}\n.c-chat__contact-last[data-v-5b4bf8dc] {\n font-size: 12px;\n color: var(--chat-text-secondary);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-top: 2px;\n}\n.c-chat__unread[data-v-5b4bf8dc] {\n min-width: 18px;\n height: 18px;\n padding: 0 5px;\n border-radius: 9px;\n background: var(--chat-unread-bg);\n color: var(--chat-unread-color);\n font-size: 11px;\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n/* ─── 主聊天区域 ──────────────────────────────────────── */\n.c-chat__main[data-v-5b4bf8dc] {\n flex: 1;\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.c-chat__header[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n gap: 10px;\n height: var(--chat-header-height);\n padding: 0 20px;\n background: var(--chat-header-bg);\n border-bottom: 1px solid var(--chat-border);\n box-shadow: 0 1px 4px var(--chat-shadow-light);\n font-weight: 600;\n font-size: 15px;\n}\n.c-chat__header-status[data-v-5b4bf8dc] {\n font-size: 12px;\n font-weight: 400;\n color: var(--chat-text-secondary);\n}\n\n/* ─── 消息区域 ────────────────────────────────────────── */\n.c-chat__messages[data-v-5b4bf8dc] {\n flex: 1;\n overflow-y: auto;\n overscroll-behavior: contain;\n padding: 16px 20px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n background: color-mix(in srgb, var(--body-color) 50%, var(--card-color));\n}\n.c-chat__messages[data-v-5b4bf8dc]::-webkit-scrollbar {\n width: 4px;\n}\n.c-chat__messages[data-v-5b4bf8dc]::-webkit-scrollbar-thumb {\n background: var(--chat-scrollbar-thumb);\n border-radius: 2px;\n}\n.c-chat__load-more[data-v-5b4bf8dc] {\n text-align: center;\n padding: 8px;\n}\n.c-chat__empty[data-v-5b4bf8dc] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--chat-text-secondary);\n font-size: 13px;\n}\n\n/* ─── 消息气泡 ────────────────────────────────────────── */\n.c-chat__msg[data-v-5b4bf8dc] {\n display: flex;\n gap: 8px;\n max-width: 75%;\n}\n.c-chat__msg.is-self[data-v-5b4bf8dc] {\n margin-left: auto;\n flex-direction: row-reverse;\n}\n.c-chat__msg.is-system[data-v-5b4bf8dc] {\n max-width: 100%;\n justify-content: center;\n align-self: center;\n}\n.c-chat__msg-avatar[data-v-5b4bf8dc] {\n flex-shrink: 0;\n margin-top: 2px;\n}\n.c-chat__msg-body[data-v-5b4bf8dc] {\n display: flex;\n flex-direction: column;\n}\n.c-chat__msg-username[data-v-5b4bf8dc] {\n font-size: 12px;\n color: var(--chat-text-secondary);\n margin-bottom: 2px;\n}\n.is-self .c-chat__msg-username[data-v-5b4bf8dc] {\n text-align: right;\n}\n.c-chat__bubble[data-v-5b4bf8dc] {\n padding: 10px 14px;\n border-radius: 16px;\n line-height: 1.5;\n word-break: break-word;\n white-space: pre-wrap;\n}\n.is-other .c-chat__bubble[data-v-5b4bf8dc] {\n background: var(--chat-bubble-other);\n border: 1px solid var(--chat-border);\n border-top-left-radius: 4px;\n}\n.is-self .c-chat__bubble[data-v-5b4bf8dc] {\n background: var(--chat-bubble-self);\n color: var(--chat-text-self);\n border-top-right-radius: 4px;\n}\n.is-system .c-chat__bubble[data-v-5b4bf8dc] {\n background: var(--chat-bubble-system);\n color: var(--chat-text-secondary);\n font-size: 12px;\n padding: 4px 12px;\n}\n.c-chat__msg-image[data-v-5b4bf8dc] {\n max-width: 240px;\n max-height: 180px;\n border-radius: 12px;\n cursor: pointer;\n object-fit: cover;\n}\n.is-self .c-chat__msg-image[data-v-5b4bf8dc] {\n border-top-right-radius: 4px;\n}\n.is-other .c-chat__msg-image[data-v-5b4bf8dc] {\n border-top-left-radius: 4px;\n}\n.c-chat__msg-file[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 14px;\n border-radius: 12px;\n cursor: pointer;\n}\n.is-other .c-chat__msg-file[data-v-5b4bf8dc] {\n background: var(--chat-bubble-other);\n border: 1px solid var(--chat-border);\n border-top-left-radius: 4px;\n}\n.is-self .c-chat__msg-file[data-v-5b4bf8dc] {\n background: var(--chat-bubble-self);\n color: var(--chat-text-self);\n border-top-right-radius: 4px;\n}\n.c-chat__file-info[data-v-5b4bf8dc] {\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.c-chat__file-name[data-v-5b4bf8dc] {\n font-size: 13px;\n font-weight: 500;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.c-chat__file-size[data-v-5b4bf8dc] {\n font-size: 11px;\n opacity: 0.6;\n}\n.c-chat__msg-time[data-v-5b4bf8dc] {\n font-size: 11px;\n color: var(--chat-text-secondary);\n margin-top: 4px;\n}\n.is-self .c-chat__msg-time[data-v-5b4bf8dc] {\n text-align: right;\n}\n.c-chat__msg-status[data-v-5b4bf8dc] {\n font-size: 11px;\n margin-top: 2px;\n text-align: right;\n}\n.c-chat__msg-status.is-sending[data-v-5b4bf8dc] {\n color: var(--chat-text-secondary);\n}\n.c-chat__msg-status.is-failed[data-v-5b4bf8dc] {\n color: var(--chat-failed-color);\n cursor: pointer;\n}\n\n/* ─── 时间分割线 ──────────────────────────────────────── */\n.c-chat__time-divider[data-v-5b4bf8dc] {\n text-align: center;\n font-size: 11px;\n color: var(--chat-text-secondary);\n padding: 4px 0;\n}\n\n/* ─── 输入区域 ────────────────────────────────────────── */\n.c-chat__input-area[data-v-5b4bf8dc] {\n display: flex;\n align-items: center;\n gap: 8px;\n min-height: var(--chat-input-height);\n padding: 10px 16px;\n background: var(--chat-input-bg);\n border-top: 1px solid var(--chat-border);\n}\n.c-chat__input-actions[data-v-5b4bf8dc] {\n display: flex;\n gap: 4px;\n flex-shrink: 0;\n}\n.c-chat__input-wrap[data-v-5b4bf8dc] {\n flex: 1;\n min-width: 0;\n}\n.c-chat__send-btn[data-v-5b4bf8dc] {\n flex-shrink: 0;\n}\n\n/* ─── 空态 ────────────────────────────────────────────── */\n.c-chat__no-chat[data-v-5b4bf8dc] {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 12px;\n color: var(--chat-text-secondary);\n}\n.c-chat__no-chat-icon[data-v-5b4bf8dc] {\n font-size: 48px;\n opacity: 0.3;\n}\n\n/* ─── 响应式 ──────────────────────────────────────────── */\n@media (max-width: 640px) {\n.c-chat[data-v-5b4bf8dc] {\n --chat-sidebar-width: 72px;\n}\n.c-chat__contact-info[data-v-5b4bf8dc],\n .c-chat__search[data-v-5b4bf8dc],\n .c-chat__unread[data-v-5b4bf8dc] {\n display: none;\n}\n.c-chat__contact[data-v-5b4bf8dc] {\n justify-content: center;\n padding: 10px 8px;\n}\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;;AAEA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;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;;AAEA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +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"],"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","<!--\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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"}
@@ -1 +0,0 @@
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"],"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","<!--\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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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_City-DdkX6u64.css","names":[],"sources":["../src/components/C_City/index.vue?vue&type=style&index=0&scoped=6286e78d&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.city-selector-trigger[data-v-6286e78d] {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n min-width: 200px;\n height: 34px;\n padding: 0 12px;\n border: 1px solid #e0e0e6;\n border-radius: 3px;\n cursor: pointer;\n transition: all 0.3s;\n}\n.city-selector-trigger[data-v-6286e78d]:hover {\n border-color: var(--c-primary, #1890ff);\n}\n.city-selector-trigger__text[data-v-6286e78d] {\n flex: 1;\n font-size: 14px;\n}\n.city-selector-trigger__icon[data-v-6286e78d] {\n margin-left: 8px;\n color: #999;\n font-size: 16px;\n transition: transform 0.3s;\n}\n.city-selector-trigger__icon.is-active[data-v-6286e78d] {\n transform: rotate(180deg);\n}\n.city-selector-content[data-v-6286e78d] {\n display: flex;\n flex-direction: column;\n height: 500px;\n padding: 0;\n}\n.city-selector-header[data-v-6286e78d] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n border-bottom: 1px solid rgba(247, 247, 247, 0.514);\n flex-shrink: 0;\n}\n.city-selector-header .city-selector-search[data-v-6286e78d] {\n flex: 1;\n}\n.city-selector-letters[data-v-6286e78d] {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin: 0 12px 10px;\n padding: 8px;\n flex-shrink: 0;\n}\n.city-selector-letters .city-selector-letter[data-v-6286e78d] {\n padding: 2px 6px;\n cursor: pointer;\n color: var(--c-primary, #1890ff);\n font-size: 13px;\n font-weight: 500;\n transition: all 0.3s;\n min-width: 24px;\n text-align: center;\n}\n.city-selector-letters .city-selector-letter[data-v-6286e78d]:hover {\n background-color: var(--c-primary, #1890ff);\n color: #fff;\n border-radius: 2px;\n}\n.city-selector-body[data-v-6286e78d] {\n flex: 1;\n margin: 12px;\n margin-top: 8px;\n overflow: hidden;\n}\n.city-list[data-v-6286e78d],\n.province-list[data-v-6286e78d] {\n padding: 0 8px;\n}\n.city-group[data-v-6286e78d],\n.province-group[data-v-6286e78d] {\n display: flex;\n margin-bottom: 12px;\n padding-bottom: 12px;\n border-bottom: 1px solid rgba(247, 247, 247, 0.514);\n}\n.city-group[data-v-6286e78d]:last-child,\n.province-group[data-v-6286e78d]:last-child {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n}\n.city-group__letter[data-v-6286e78d], .city-group__name[data-v-6286e78d],\n.province-group__letter[data-v-6286e78d],\n.province-group__name[data-v-6286e78d] {\n flex-shrink: 0;\n width: 70px;\n font-weight: 500;\n font-size: 14px;\n line-height: 28px;\n}\n.city-group__cities[data-v-6286e78d],\n.province-group__cities[data-v-6286e78d] {\n flex: 1;\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n align-items: flex-start;\n}\n.city-item[data-v-6286e78d] {\n padding: 3px 10px;\n cursor: pointer;\n font-size: 13px;\n border-radius: 2px;\n transition: all 0.3s;\n line-height: 20px;\n}\n.city-item[data-v-6286e78d]:hover {\n background-color: #f0f0f0;\n color: var(--c-primary, #1890ff);\n}\n.city-item.is-active[data-v-6286e78d] {\n background-color: var(--c-primary, #1890ff);\n color: #fff;\n}\n[data-v-6286e78d] .n-scrollbar .n-scrollbar-rail {\n right: 2px;\n}\n[data-v-6286e78d] .n-scrollbar .n-scrollbar-content {\n padding-right: 12px;\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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_City-iP-dIvui.css","names":[],"sources":["../src/components/C_City/index.vue?vue&type=style&index=0&scoped=6286e78d&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.city-selector-trigger[data-v-6286e78d] {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n min-width: 200px;\n height: 34px;\n padding: 0 12px;\n border: 1px solid #e0e0e6;\n border-radius: 3px;\n cursor: pointer;\n transition: all 0.3s;\n}\n.city-selector-trigger[data-v-6286e78d]:hover {\n border-color: var(--c-primary, #1890ff);\n}\n.city-selector-trigger__text[data-v-6286e78d] {\n flex: 1;\n font-size: 14px;\n}\n.city-selector-trigger__icon[data-v-6286e78d] {\n margin-left: 8px;\n color: #999;\n font-size: 16px;\n transition: transform 0.3s;\n}\n.city-selector-trigger__icon.is-active[data-v-6286e78d] {\n transform: rotate(180deg);\n}\n.city-selector-content[data-v-6286e78d] {\n display: flex;\n flex-direction: column;\n height: 500px;\n padding: 0;\n}\n.city-selector-header[data-v-6286e78d] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n border-bottom: 1px solid rgba(247, 247, 247, 0.514);\n flex-shrink: 0;\n}\n.city-selector-header .city-selector-search[data-v-6286e78d] {\n flex: 1;\n}\n.city-selector-letters[data-v-6286e78d] {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin: 0 12px 10px;\n padding: 8px;\n flex-shrink: 0;\n}\n.city-selector-letters .city-selector-letter[data-v-6286e78d] {\n padding: 2px 6px;\n cursor: pointer;\n color: var(--c-primary, #1890ff);\n font-size: 13px;\n font-weight: 500;\n transition: all 0.3s;\n min-width: 24px;\n text-align: center;\n}\n.city-selector-letters .city-selector-letter[data-v-6286e78d]:hover {\n background-color: var(--c-primary, #1890ff);\n color: #fff;\n border-radius: 2px;\n}\n.city-selector-body[data-v-6286e78d] {\n flex: 1;\n margin: 12px;\n margin-top: 8px;\n overflow: hidden;\n}\n.city-list[data-v-6286e78d],\n.province-list[data-v-6286e78d] {\n padding: 0 8px;\n}\n.city-group[data-v-6286e78d],\n.province-group[data-v-6286e78d] {\n display: flex;\n margin-bottom: 12px;\n padding-bottom: 12px;\n border-bottom: 1px solid rgba(247, 247, 247, 0.514);\n}\n.city-group[data-v-6286e78d]:last-child,\n.province-group[data-v-6286e78d]:last-child {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n}\n.city-group__letter[data-v-6286e78d], .city-group__name[data-v-6286e78d],\n.province-group__letter[data-v-6286e78d],\n.province-group__name[data-v-6286e78d] {\n flex-shrink: 0;\n width: 70px;\n font-weight: 500;\n font-size: 14px;\n line-height: 28px;\n}\n.city-group__cities[data-v-6286e78d],\n.province-group__cities[data-v-6286e78d] {\n flex: 1;\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n align-items: flex-start;\n}\n.city-item[data-v-6286e78d] {\n padding: 3px 10px;\n cursor: pointer;\n font-size: 13px;\n border-radius: 2px;\n transition: all 0.3s;\n line-height: 20px;\n}\n.city-item[data-v-6286e78d]:hover {\n background-color: #f0f0f0;\n color: var(--c-primary, #1890ff);\n}\n.city-item.is-active[data-v-6286e78d] {\n background-color: var(--c-primary, #1890ff);\n color: #fff;\n}\n[data-v-6286e78d] .n-scrollbar .n-scrollbar-rail {\n right: 2px;\n}\n[data-v-6286e78d] .n-scrollbar .n-scrollbar-content {\n padding-right: 12px;\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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_City.js","names":["modelValue","placeholder","showLetters"],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue","../src/components/C_City/index.vue"],"sourcesContent":["","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <NPopover\n v-model:show=\"visible\"\n placement=\"bottom-start\"\n :width=\"430\"\n trigger=\"click\"\n :show-arrow=\"false\"\n >\n <template #trigger>\n <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n <div class=\"city-selector-trigger\">\n <span class=\"city-selector-trigger__text\">{{\n modelValue || placeholder\n }}</span>\n </div>\n </slot>\n </template>\n\n <div class=\"city-selector-content\">\n <div class=\"city-selector-header\">\n <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n <NRadioButton value=\"city\">按城市</NRadioButton>\n <NRadioButton value=\"province\">按省份</NRadioButton>\n </NRadioGroup>\n <NSelect\n v-model:value=\"searchValue\"\n class=\"city-selector-search\"\n :options=\"searchOptions\"\n filterable\n clearable\n placeholder=\"搜索城市\"\n @update:value=\"handleSearchSelect\"\n />\n </div>\n\n <div v-if=\"showLetters\" class=\"city-selector-letters\">\n <span\n v-for=\"letter in letters\"\n :key=\"letter\"\n class=\"city-selector-letter\"\n @click=\"scrollToLetter(letter)\"\n >\n {{ letter }}\n </span>\n </div>\n\n <NScrollbar class=\"city-selector-body\">\n <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n <div\n v-for=\"(cities, letter) in cityDataByLetter\"\n :key=\"letter\"\n :id=\"`letter-${letter}`\"\n class=\"city-group\"\n >\n <div class=\"city-group__letter\">{{ letter }}:</div>\n <div class=\"city-group__cities\">\n <span\n v-for=\"(city, index) in cities\"\n :key=\"`${letter}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city.name }\"\n @click=\"handleCitySelect(city.name)\"\n >\n {{ city.name }}\n </span>\n </div>\n </div>\n </div>\n\n <div v-else class=\"province-list\">\n <div\n v-for=\"province in allProvinces\"\n :key=\"province.id\"\n :id=\"`letter-${province.id}`\"\n class=\"province-group\"\n >\n <div class=\"province-group__name\">{{ province.name }}:</div>\n <div class=\"province-group__cities\">\n <span\n v-for=\"(city, index) in province.data\"\n :key=\"`${province.id}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city }\"\n @click=\"handleCitySelect(city)\"\n >\n {{ city }}\n </span>\n </div>\n </div>\n </div>\n </NScrollbar>\n </div>\n </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n NPopover,\n NRadioGroup,\n NRadioButton,\n NSelect,\n NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n id: number;\n spell: string;\n name: string;\n}\n\n// 城市数据懒加载(83KB JSON 仅在组件挂载时加载)\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n const mod = await import(\"./city.json\");\n cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n id?: string;\n name: string;\n data: string[];\n}\n\ninterface Props {\n modelValue?: string;\n placeholder?: string;\n showLetters?: boolean;\n}\n\ninterface Emits {\n (e: \"update:modelValue\", value: string): void;\n (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n placeholder: \"请选择城市\",\n showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n const provinces: ProvinceItem[] = [];\n Object.values(provinceData).forEach((group) => {\n provinces.push(...(group as ProvinceItem[]));\n });\n return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n if (cityData.value?.cities) {\n return cityData.value.cities;\n }\n // 数据未加载时,从省份数据生成城市索引作为 fallback\n const cities: Record<string, CityItem[]> = {};\n let cityId = 1;\n const citySet = new Set<string>();\n allProvinces.value.forEach((province) => {\n province.data.forEach((cityName) => {\n citySet.add(cityName);\n });\n });\n Array.from(citySet).forEach((cityName) => {\n const letter = cityName[0].toUpperCase();\n if (!cities[letter]) cities[letter] = [];\n cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n });\n const sortedCities: Record<string, CityItem[]> = {};\n Object.keys(cities)\n .sort()\n .forEach((letter) => {\n sortedCities[letter] = cities[letter].sort((a, b) =>\n a.name.localeCompare(b.name, \"zh-CN\"),\n );\n });\n return sortedCities;\n});\n\nconst letters = computed(() => {\n if (radioValue.value === \"city\") {\n return Object.keys(cityDataByLetter.value).sort();\n } else {\n const provinceLetters = new Set<string>();\n Object.keys(provinceData).forEach((key) => {\n if (key !== \"直辖市\" && key !== \"港澳\") {\n provinceLetters.add(key);\n }\n });\n const result = Array.from(provinceLetters).sort();\n result.push(\"直辖市\", \"港澳\");\n return result;\n }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n if (radioValue.value === \"city\") {\n const options: SelectOption[] = [];\n Object.values(cityDataByLetter.value).forEach((cities) => {\n (cities as CityItem[]).forEach((city) => {\n options.push({\n label: city.name,\n value: city.name,\n });\n });\n });\n return options;\n } else {\n return allProvinces.value.flatMap((province) =>\n province.data.map((city) => ({\n label: `${city} (${province.name})`,\n value: city,\n })),\n );\n }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n emit(\"update:modelValue\", cityName);\n emit(\"change\", cityName);\n visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n if (value) {\n handleCitySelect(value);\n searchValue.value = \"\";\n }\n};\n\nconst scrollToLetter = (letter: string): void => {\n const element = document.getElementById(`letter-${letter}`);\n if (element) {\n element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <NPopover\n v-model:show=\"visible\"\n placement=\"bottom-start\"\n :width=\"430\"\n trigger=\"click\"\n :show-arrow=\"false\"\n >\n <template #trigger>\n <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n <div class=\"city-selector-trigger\">\n <span class=\"city-selector-trigger__text\">{{\n modelValue || placeholder\n }}</span>\n </div>\n </slot>\n </template>\n\n <div class=\"city-selector-content\">\n <div class=\"city-selector-header\">\n <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n <NRadioButton value=\"city\">按城市</NRadioButton>\n <NRadioButton value=\"province\">按省份</NRadioButton>\n </NRadioGroup>\n <NSelect\n v-model:value=\"searchValue\"\n class=\"city-selector-search\"\n :options=\"searchOptions\"\n filterable\n clearable\n placeholder=\"搜索城市\"\n @update:value=\"handleSearchSelect\"\n />\n </div>\n\n <div v-if=\"showLetters\" class=\"city-selector-letters\">\n <span\n v-for=\"letter in letters\"\n :key=\"letter\"\n class=\"city-selector-letter\"\n @click=\"scrollToLetter(letter)\"\n >\n {{ letter }}\n </span>\n </div>\n\n <NScrollbar class=\"city-selector-body\">\n <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n <div\n v-for=\"(cities, letter) in cityDataByLetter\"\n :key=\"letter\"\n :id=\"`letter-${letter}`\"\n class=\"city-group\"\n >\n <div class=\"city-group__letter\">{{ letter }}:</div>\n <div class=\"city-group__cities\">\n <span\n v-for=\"(city, index) in cities\"\n :key=\"`${letter}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city.name }\"\n @click=\"handleCitySelect(city.name)\"\n >\n {{ city.name }}\n </span>\n </div>\n </div>\n </div>\n\n <div v-else class=\"province-list\">\n <div\n v-for=\"province in allProvinces\"\n :key=\"province.id\"\n :id=\"`letter-${province.id}`\"\n class=\"province-group\"\n >\n <div class=\"province-group__name\">{{ province.name }}:</div>\n <div class=\"province-group__cities\">\n <span\n v-for=\"(city, index) in province.data\"\n :key=\"`${province.id}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city }\"\n @click=\"handleCitySelect(city)\"\n >\n {{ city }}\n </span>\n </div>\n </div>\n </div>\n </NScrollbar>\n </div>\n </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n NPopover,\n NRadioGroup,\n NRadioButton,\n NSelect,\n NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n id: number;\n spell: string;\n name: string;\n}\n\n// 城市数据懒加载(83KB JSON 仅在组件挂载时加载)\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n const mod = await import(\"./city.json\");\n cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n id?: string;\n name: string;\n data: string[];\n}\n\ninterface Props {\n modelValue?: string;\n placeholder?: string;\n showLetters?: boolean;\n}\n\ninterface Emits {\n (e: \"update:modelValue\", value: string): void;\n (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n placeholder: \"请选择城市\",\n showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n const provinces: ProvinceItem[] = [];\n Object.values(provinceData).forEach((group) => {\n provinces.push(...(group as ProvinceItem[]));\n });\n return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n if (cityData.value?.cities) {\n return cityData.value.cities;\n }\n // 数据未加载时,从省份数据生成城市索引作为 fallback\n const cities: Record<string, CityItem[]> = {};\n let cityId = 1;\n const citySet = new Set<string>();\n allProvinces.value.forEach((province) => {\n province.data.forEach((cityName) => {\n citySet.add(cityName);\n });\n });\n Array.from(citySet).forEach((cityName) => {\n const letter = cityName[0].toUpperCase();\n if (!cities[letter]) cities[letter] = [];\n cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n });\n const sortedCities: Record<string, CityItem[]> = {};\n Object.keys(cities)\n .sort()\n .forEach((letter) => {\n sortedCities[letter] = cities[letter].sort((a, b) =>\n a.name.localeCompare(b.name, \"zh-CN\"),\n );\n });\n return sortedCities;\n});\n\nconst letters = computed(() => {\n if (radioValue.value === \"city\") {\n return Object.keys(cityDataByLetter.value).sort();\n } else {\n const provinceLetters = new Set<string>();\n Object.keys(provinceData).forEach((key) => {\n if (key !== \"直辖市\" && key !== \"港澳\") {\n provinceLetters.add(key);\n }\n });\n const result = Array.from(provinceLetters).sort();\n result.push(\"直辖市\", \"港澳\");\n return result;\n }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n if (radioValue.value === \"city\") {\n const options: SelectOption[] = [];\n Object.values(cityDataByLetter.value).forEach((cities) => {\n (cities as CityItem[]).forEach((city) => {\n options.push({\n label: city.name,\n value: city.name,\n });\n });\n });\n return options;\n } else {\n return allProvinces.value.flatMap((province) =>\n province.data.map((city) => ({\n label: `${city} (${province.name})`,\n value: city,\n })),\n );\n }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n emit(\"update:modelValue\", cityName);\n emit(\"change\", cityName);\n visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n if (value) {\n handleCitySelect(value);\n searchValue.value = \"\";\n }\n};\n\nconst scrollToLetter = (letter: string): void => {\n const element = document.getElementById(`letter-${letter}`);\n if (element) {\n element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_City2.js","names":["modelValue","placeholder","showLetters"],"sources":["../src/components/C_City/province.json","../src/components/C_City/index.vue","../src/components/C_City/index.vue"],"sourcesContent":["","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <NPopover\n v-model:show=\"visible\"\n placement=\"bottom-start\"\n :width=\"430\"\n trigger=\"click\"\n :show-arrow=\"false\"\n >\n <template #trigger>\n <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n <div class=\"city-selector-trigger\">\n <span class=\"city-selector-trigger__text\">{{\n modelValue || placeholder\n }}</span>\n </div>\n </slot>\n </template>\n\n <div class=\"city-selector-content\">\n <div class=\"city-selector-header\">\n <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n <NRadioButton value=\"city\">按城市</NRadioButton>\n <NRadioButton value=\"province\">按省份</NRadioButton>\n </NRadioGroup>\n <NSelect\n v-model:value=\"searchValue\"\n class=\"city-selector-search\"\n :options=\"searchOptions\"\n filterable\n clearable\n placeholder=\"搜索城市\"\n @update:value=\"handleSearchSelect\"\n />\n </div>\n\n <div v-if=\"showLetters\" class=\"city-selector-letters\">\n <span\n v-for=\"letter in letters\"\n :key=\"letter\"\n class=\"city-selector-letter\"\n @click=\"scrollToLetter(letter)\"\n >\n {{ letter }}\n </span>\n </div>\n\n <NScrollbar class=\"city-selector-body\">\n <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n <div\n v-for=\"(cities, letter) in cityDataByLetter\"\n :key=\"letter\"\n :id=\"`letter-${letter}`\"\n class=\"city-group\"\n >\n <div class=\"city-group__letter\">{{ letter }}:</div>\n <div class=\"city-group__cities\">\n <span\n v-for=\"(city, index) in cities\"\n :key=\"`${letter}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city.name }\"\n @click=\"handleCitySelect(city.name)\"\n >\n {{ city.name }}\n </span>\n </div>\n </div>\n </div>\n\n <div v-else class=\"province-list\">\n <div\n v-for=\"province in allProvinces\"\n :key=\"province.id\"\n :id=\"`letter-${province.id}`\"\n class=\"province-group\"\n >\n <div class=\"province-group__name\">{{ province.name }}:</div>\n <div class=\"province-group__cities\">\n <span\n v-for=\"(city, index) in province.data\"\n :key=\"`${province.id}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city }\"\n @click=\"handleCitySelect(city)\"\n >\n {{ city }}\n </span>\n </div>\n </div>\n </div>\n </NScrollbar>\n </div>\n </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n NPopover,\n NRadioGroup,\n NRadioButton,\n NSelect,\n NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n id: number;\n spell: string;\n name: string;\n}\n\n// 城市数据懒加载(83KB JSON 仅在组件挂载时加载)\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n const mod = await import(\"./city.json\");\n cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n id?: string;\n name: string;\n data: string[];\n}\n\ninterface Props {\n modelValue?: string;\n placeholder?: string;\n showLetters?: boolean;\n}\n\ninterface Emits {\n (e: \"update:modelValue\", value: string): void;\n (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n placeholder: \"请选择城市\",\n showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n const provinces: ProvinceItem[] = [];\n Object.values(provinceData).forEach((group) => {\n provinces.push(...(group as ProvinceItem[]));\n });\n return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n if (cityData.value?.cities) {\n return cityData.value.cities;\n }\n // 数据未加载时,从省份数据生成城市索引作为 fallback\n const cities: Record<string, CityItem[]> = {};\n let cityId = 1;\n const citySet = new Set<string>();\n allProvinces.value.forEach((province) => {\n province.data.forEach((cityName) => {\n citySet.add(cityName);\n });\n });\n Array.from(citySet).forEach((cityName) => {\n const letter = cityName[0].toUpperCase();\n if (!cities[letter]) cities[letter] = [];\n cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n });\n const sortedCities: Record<string, CityItem[]> = {};\n Object.keys(cities)\n .sort()\n .forEach((letter) => {\n sortedCities[letter] = cities[letter].sort((a, b) =>\n a.name.localeCompare(b.name, \"zh-CN\"),\n );\n });\n return sortedCities;\n});\n\nconst letters = computed(() => {\n if (radioValue.value === \"city\") {\n return Object.keys(cityDataByLetter.value).sort();\n } else {\n const provinceLetters = new Set<string>();\n Object.keys(provinceData).forEach((key) => {\n if (key !== \"直辖市\" && key !== \"港澳\") {\n provinceLetters.add(key);\n }\n });\n const result = Array.from(provinceLetters).sort();\n result.push(\"直辖市\", \"港澳\");\n return result;\n }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n if (radioValue.value === \"city\") {\n const options: SelectOption[] = [];\n Object.values(cityDataByLetter.value).forEach((cities) => {\n (cities as CityItem[]).forEach((city) => {\n options.push({\n label: city.name,\n value: city.name,\n });\n });\n });\n return options;\n } else {\n return allProvinces.value.flatMap((province) =>\n province.data.map((city) => ({\n label: `${city} (${province.name})`,\n value: city,\n })),\n );\n }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n emit(\"update:modelValue\", cityName);\n emit(\"change\", cityName);\n visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n if (value) {\n handleCitySelect(value);\n searchValue.value = \"\";\n }\n};\n\nconst scrollToLetter = (letter: string): void => {\n const element = document.getElementById(`letter-${letter}`);\n if (element) {\n element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-05-30\n * @Description: 城市选择器组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <NPopover\n v-model:show=\"visible\"\n placement=\"bottom-start\"\n :width=\"430\"\n trigger=\"click\"\n :show-arrow=\"false\"\n >\n <template #trigger>\n <slot name=\"trigger\" :value=\"modelValue\" :visible=\"visible\">\n <div class=\"city-selector-trigger\">\n <span class=\"city-selector-trigger__text\">{{\n modelValue || placeholder\n }}</span>\n </div>\n </slot>\n </template>\n\n <div class=\"city-selector-content\">\n <div class=\"city-selector-header\">\n <NRadioGroup v-model:value=\"radioValue\" size=\"small\">\n <NRadioButton value=\"city\">按城市</NRadioButton>\n <NRadioButton value=\"province\">按省份</NRadioButton>\n </NRadioGroup>\n <NSelect\n v-model:value=\"searchValue\"\n class=\"city-selector-search\"\n :options=\"searchOptions\"\n filterable\n clearable\n placeholder=\"搜索城市\"\n @update:value=\"handleSearchSelect\"\n />\n </div>\n\n <div v-if=\"showLetters\" class=\"city-selector-letters\">\n <span\n v-for=\"letter in letters\"\n :key=\"letter\"\n class=\"city-selector-letter\"\n @click=\"scrollToLetter(letter)\"\n >\n {{ letter }}\n </span>\n </div>\n\n <NScrollbar class=\"city-selector-body\">\n <div v-if=\"radioValue === 'city'\" class=\"city-list\">\n <div\n v-for=\"(cities, letter) in cityDataByLetter\"\n :key=\"letter\"\n :id=\"`letter-${letter}`\"\n class=\"city-group\"\n >\n <div class=\"city-group__letter\">{{ letter }}:</div>\n <div class=\"city-group__cities\">\n <span\n v-for=\"(city, index) in cities\"\n :key=\"`${letter}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city.name }\"\n @click=\"handleCitySelect(city.name)\"\n >\n {{ city.name }}\n </span>\n </div>\n </div>\n </div>\n\n <div v-else class=\"province-list\">\n <div\n v-for=\"province in allProvinces\"\n :key=\"province.id\"\n :id=\"`letter-${province.id}`\"\n class=\"province-group\"\n >\n <div class=\"province-group__name\">{{ province.name }}:</div>\n <div class=\"province-group__cities\">\n <span\n v-for=\"(city, index) in province.data\"\n :key=\"`${province.id}-${index}`\"\n class=\"city-item\"\n :class=\"{ 'is-active': modelValue === city }\"\n @click=\"handleCitySelect(city)\"\n >\n {{ city }}\n </span>\n </div>\n </div>\n </div>\n </NScrollbar>\n </div>\n </NPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from \"vue\";\nimport {\n NPopover,\n NRadioGroup,\n NRadioButton,\n NSelect,\n NScrollbar,\n} from \"naive-ui\";\nimport type { SelectOption } from \"naive-ui\";\nimport provinceData from \"./province.json\";\n\ndefineOptions({ name: \"C_City\" });\n\ninterface CityItem {\n id: number;\n spell: string;\n name: string;\n}\n\n// 城市数据懒加载(83KB JSON 仅在组件挂载时加载)\nconst cityData = ref<{ cities: Record<string, CityItem[]> } | null>(null);\n\nonMounted(async () => {\n const mod = await import(\"./city.json\");\n cityData.value = mod.default ?? mod;\n});\n\ninterface ProvinceItem {\n id?: string;\n name: string;\n data: string[];\n}\n\ninterface Props {\n modelValue?: string;\n placeholder?: string;\n showLetters?: boolean;\n}\n\ninterface Emits {\n (e: \"update:modelValue\", value: string): void;\n (e: \"change\", value: string): void;\n}\n\nwithDefaults(defineProps<Props>(), {\n placeholder: \"请选择城市\",\n showLetters: true,\n});\n\nconst emit = defineEmits<Emits>();\n\nconst visible = ref(false);\nconst radioValue = ref<\"city\" | \"province\">(\"city\");\nconst searchValue = ref(\"\");\n\nconst allProvinces = computed(() => {\n const provinces: ProvinceItem[] = [];\n Object.values(provinceData).forEach((group) => {\n provinces.push(...(group as ProvinceItem[]));\n });\n return provinces;\n});\n\nconst cityDataByLetter = computed(() => {\n if (cityData.value?.cities) {\n return cityData.value.cities;\n }\n // 数据未加载时,从省份数据生成城市索引作为 fallback\n const cities: Record<string, CityItem[]> = {};\n let cityId = 1;\n const citySet = new Set<string>();\n allProvinces.value.forEach((province) => {\n province.data.forEach((cityName) => {\n citySet.add(cityName);\n });\n });\n Array.from(citySet).forEach((cityName) => {\n const letter = cityName[0].toUpperCase();\n if (!cities[letter]) cities[letter] = [];\n cities[letter].push({ id: cityId++, name: cityName, spell: \"\" });\n });\n const sortedCities: Record<string, CityItem[]> = {};\n Object.keys(cities)\n .sort()\n .forEach((letter) => {\n sortedCities[letter] = cities[letter].sort((a, b) =>\n a.name.localeCompare(b.name, \"zh-CN\"),\n );\n });\n return sortedCities;\n});\n\nconst letters = computed(() => {\n if (radioValue.value === \"city\") {\n return Object.keys(cityDataByLetter.value).sort();\n } else {\n const provinceLetters = new Set<string>();\n Object.keys(provinceData).forEach((key) => {\n if (key !== \"直辖市\" && key !== \"港澳\") {\n provinceLetters.add(key);\n }\n });\n const result = Array.from(provinceLetters).sort();\n result.push(\"直辖市\", \"港澳\");\n return result;\n }\n});\n\nconst searchOptions = computed((): SelectOption[] => {\n if (radioValue.value === \"city\") {\n const options: SelectOption[] = [];\n Object.values(cityDataByLetter.value).forEach((cities) => {\n (cities as CityItem[]).forEach((city) => {\n options.push({\n label: city.name,\n value: city.name,\n });\n });\n });\n return options;\n } else {\n return allProvinces.value.flatMap((province) =>\n province.data.map((city) => ({\n label: `${city} (${province.name})`,\n value: city,\n })),\n );\n }\n});\n\nconst handleCitySelect = (cityName: string): void => {\n emit(\"update:modelValue\", cityName);\n emit(\"change\", cityName);\n visible.value = false;\n};\n\nconst handleSearchSelect = (value: string): void => {\n if (value) {\n handleCitySelect(value);\n searchValue.value = \"\";\n }\n};\n\nconst scrollToLetter = (letter: string): void => {\n const element = document.getElementById(`letter-${letter}`);\n if (element) {\n element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n@use \"./index.scss\";\n</style>\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_Code-BWmJMNS7.css","names":[],"sources":["../src/components/C_Code/index.vue?vue&type=style&index=0&scoped=82c274bd&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.mr-2[data-v-82c274bd] {\n margin-right: 0.5rem;\n}\n.ml-2[data-v-82c274bd] {\n margin-left: 0.5rem;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_Code-k14vjgVl.css","names":[],"sources":["../src/components/C_Code/index.vue?vue&type=style&index=0&scoped=82c274bd&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled */.mr-2[data-v-82c274bd] {\n margin-right: 0.5rem;\n}\n.ml-2[data-v-82c274bd] {\n margin-left: 0.5rem;\n}"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_Code.js","names":["showHeader","title","language","showFullscreen","code","showLineNumbers","wordWrap","trim"],"sources":["../src/components/C_Code/index.vue","../src/components/C_Code/index.vue"],"sourcesContent":["<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-06-19\n * @Description: 全局代码高亮组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-code-wrapper\">\n <!-- 代码标题栏 -->\n <div v-if=\"showHeader\" class=\"c-code-header\">\n <div class=\"c-code-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <div class=\"c-code-actions\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"tiny\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n\n <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\n <template #trigger>\n <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon\n :name=\"\n isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\n \"\n />\n </template>\n </NButton>\n </template>\n {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\n </NTooltip>\n </div>\n </div>\n\n <!-- 代码内容区域 -->\n <div class=\"c-code-content\">\n <div\n class=\"code-wrapper\"\n @mouseenter=\"showFloatingCopy = true\"\n @mouseleave=\"showFloatingCopy = false\"\n >\n <NCode\n :key=\"`code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n :style=\"codeStyle\"\n @click=\"emit('click', $event)\"\n />\n\n <!-- 悬浮复制按钮 -->\n <Transition name=\"fade\">\n <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"small\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n class=\"copy-floating\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n </div>\n </Transition>\n </div>\n\n <!-- 语言加载状态 -->\n <div v-if=\"languageLoading\" class=\"c-code-loading\">\n <NSpin size=\"small\" />\n <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\n </div>\n </div>\n\n <!-- 全屏模态框 -->\n <NModal\n v-model:show=\"isFullscreen\"\n :mask-closable=\"false\"\n :show-icon=\"false\"\n :bordered=\"false\"\n style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\n >\n <div class=\"fullscreen-content\">\n <div class=\"fullscreen-header\">\n <div class=\"fullscreen-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon name=\"mdi:close\" />\n </template>\n </NButton>\n </div>\n <div class=\"fullscreen-body\">\n <NCode\n :key=\"`fullscreen-code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n />\n </div>\n </div>\n </NModal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {\n ref,\n computed,\n watch,\n onMounted,\n onUnmounted,\n nextTick,\n inject,\n} from \"vue\";\nimport C_Icon from \"../C_Icon/index.vue\";\n\n// 直接在组件内定义 HighlightManager 接口,避免导入错误\ninterface HighlightManager {\n getHljs?: () => any;\n loadLanguage?: (language: string) => Promise<void>;\n getLoadedLanguages?: () => string[];\n}\n\n// 组件名称定义\ndefineOptions({\n name: \"CCode\",\n});\n\ninterface Props {\n code: string;\n language?: string;\n title?: string;\n showHeader?: boolean;\n showLineNumbers?: boolean;\n wordWrap?: boolean;\n trim?: boolean;\n showFullscreen?: boolean;\n maxHeight?: string | number;\n autoLoadLanguage?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n code: \"\",\n language: \"text\",\n showHeader: true,\n showLineNumbers: true,\n wordWrap: false,\n trim: true,\n showFullscreen: false,\n autoLoadLanguage: true,\n});\n\nconst emit = defineEmits<{\n copy: [code: string];\n click: [event: MouseEvent];\n fullscreen: [isFullscreen: boolean];\n}>();\n\n// 尝试获取 highlight 实例(如果用户安装了插件)\nconst highlightManager = inject<HighlightManager | null>(\n \"highlightManager\",\n null,\n);\n\nconst copying = ref(false);\nconst isFullscreen = ref(false);\nconst languageLoading = ref(false);\nconst showFloatingCopy = ref(false);\n\n// 安全地获取 hljs 实例\nconst hljs = computed(() => {\n try {\n return highlightManager?.getHljs?.() || null;\n } catch (error) {\n console.warn(\"Highlight.js not available:\", error);\n return null;\n }\n});\n\n// 语言图标映射(使用标准的 MDI 图标名称)\nconst languageIcon = computed(() => {\n const iconMap: Record<string, string> = {\n javascript: \"mdi:language-javascript\",\n typescript: \"mdi:language-typescript\",\n python: \"mdi:language-python\",\n html: \"mdi:language-html5\",\n css: \"mdi:language-css3\",\n vue: \"mdi:vuejs\",\n react: \"mdi:react\",\n json: \"mdi:code-json\",\n java: \"mdi:language-java\",\n cpp: \"mdi:language-cpp\",\n go: \"mdi:language-go\",\n rust: \"mdi:language-rust\",\n php: \"mdi:language-php\",\n csharp: \"mdi:language-csharp\",\n sql: \"mdi:database\",\n yaml: \"mdi:file-code\",\n xml: \"mdi:xml\",\n markdown: \"mdi:language-markdown\",\n bash: \"mdi:bash\",\n shell: \"mdi:console\",\n powershell: \"mdi:powershell\",\n swift: \"mdi:language-swift\",\n kotlin: \"mdi:language-kotlin\",\n ruby: \"mdi:language-ruby\",\n };\n return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\n});\n\n// 代码样式\nconst codeStyle = computed(() => {\n if (!props.maxHeight) return {};\n return {\n maxHeight:\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight,\n };\n});\n\n// 自动加载语言包\nwatch(\n () => props.language,\n async (newLanguage) => {\n if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\n return;\n\n const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\n if (loadedLanguages.includes(newLanguage)) return;\n\n languageLoading.value = true;\n try {\n await highlightManager.loadLanguage?.(newLanguage);\n await nextTick();\n } catch (error) {\n console.warn(`Failed to load language: ${newLanguage}`, error);\n } finally {\n languageLoading.value = false;\n }\n },\n { immediate: true },\n);\n\n/**\n * 复制代码到剪贴板\n */\nasync function copyCode() {\n if (copying.value) return;\n copying.value = true;\n\n try {\n await navigator.clipboard.writeText(props.code);\n emit(\"copy\", props.code);\n } catch (error) {\n console.error(\"Copy failed:\", error);\n } finally {\n copying.value = false;\n }\n}\n\n/**\n * 切换全屏显示状态\n */\nfunction toggleFullscreen() {\n isFullscreen.value = !isFullscreen.value;\n emit(\"fullscreen\", isFullscreen.value);\n}\n\n/**\n * 获取编程语言的显示标题\n */\nfunction getLanguageTitle(lang: string): string {\n const titleMap: Record<string, string> = {\n javascript: \"JavaScript\",\n typescript: \"TypeScript\",\n python: \"Python\",\n java: \"Java\",\n cpp: \"C++\",\n csharp: \"C#\",\n php: \"PHP\",\n go: \"Go\",\n rust: \"Rust\",\n html: \"HTML\",\n css: \"CSS\",\n json: \"JSON\",\n bash: \"Bash\",\n shell: \"Shell\",\n yaml: \"YAML\",\n xml: \"XML\",\n markdown: \"Markdown\",\n sql: \"SQL\",\n powershell: \"PowerShell\",\n swift: \"Swift\",\n kotlin: \"Kotlin\",\n ruby: \"Ruby\",\n vue: \"Vue\",\n react: \"React\",\n };\n return titleMap[lang.toLowerCase()] || lang.toUpperCase();\n}\n\n/**\n * 处理ESC键退出全屏\n */\nfunction handleEscapeKey(event: KeyboardEvent) {\n if (event.key === \"Escape\" && isFullscreen.value) {\n toggleFullscreen();\n }\n}\n\nonMounted(() => {\n document.addEventListener(\"keydown\", handleEscapeKey);\n});\n\nonUnmounted(() => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n});\n\ndefineExpose({\n copyCode,\n toggleFullscreen,\n});\n</script>\n\n<style lang=\"scss\" scoped>\n.mr-2 {\n margin-right: 0.5rem;\n}\n\n.ml-2 {\n margin-left: 0.5rem;\n}\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-06-19\n * @Description: 全局代码高亮组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-code-wrapper\">\n <!-- 代码标题栏 -->\n <div v-if=\"showHeader\" class=\"c-code-header\">\n <div class=\"c-code-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <div class=\"c-code-actions\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"tiny\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n\n <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\n <template #trigger>\n <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon\n :name=\"\n isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\n \"\n />\n </template>\n </NButton>\n </template>\n {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\n </NTooltip>\n </div>\n </div>\n\n <!-- 代码内容区域 -->\n <div class=\"c-code-content\">\n <div\n class=\"code-wrapper\"\n @mouseenter=\"showFloatingCopy = true\"\n @mouseleave=\"showFloatingCopy = false\"\n >\n <NCode\n :key=\"`code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n :style=\"codeStyle\"\n @click=\"emit('click', $event)\"\n />\n\n <!-- 悬浮复制按钮 -->\n <Transition name=\"fade\">\n <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"small\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n class=\"copy-floating\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n </div>\n </Transition>\n </div>\n\n <!-- 语言加载状态 -->\n <div v-if=\"languageLoading\" class=\"c-code-loading\">\n <NSpin size=\"small\" />\n <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\n </div>\n </div>\n\n <!-- 全屏模态框 -->\n <NModal\n v-model:show=\"isFullscreen\"\n :mask-closable=\"false\"\n :show-icon=\"false\"\n :bordered=\"false\"\n style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\n >\n <div class=\"fullscreen-content\">\n <div class=\"fullscreen-header\">\n <div class=\"fullscreen-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon name=\"mdi:close\" />\n </template>\n </NButton>\n </div>\n <div class=\"fullscreen-body\">\n <NCode\n :key=\"`fullscreen-code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n />\n </div>\n </div>\n </NModal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {\n ref,\n computed,\n watch,\n onMounted,\n onUnmounted,\n nextTick,\n inject,\n} from \"vue\";\nimport C_Icon from \"../C_Icon/index.vue\";\n\n// 直接在组件内定义 HighlightManager 接口,避免导入错误\ninterface HighlightManager {\n getHljs?: () => any;\n loadLanguage?: (language: string) => Promise<void>;\n getLoadedLanguages?: () => string[];\n}\n\n// 组件名称定义\ndefineOptions({\n name: \"CCode\",\n});\n\ninterface Props {\n code: string;\n language?: string;\n title?: string;\n showHeader?: boolean;\n showLineNumbers?: boolean;\n wordWrap?: boolean;\n trim?: boolean;\n showFullscreen?: boolean;\n maxHeight?: string | number;\n autoLoadLanguage?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n code: \"\",\n language: \"text\",\n showHeader: true,\n showLineNumbers: true,\n wordWrap: false,\n trim: true,\n showFullscreen: false,\n autoLoadLanguage: true,\n});\n\nconst emit = defineEmits<{\n copy: [code: string];\n click: [event: MouseEvent];\n fullscreen: [isFullscreen: boolean];\n}>();\n\n// 尝试获取 highlight 实例(如果用户安装了插件)\nconst highlightManager = inject<HighlightManager | null>(\n \"highlightManager\",\n null,\n);\n\nconst copying = ref(false);\nconst isFullscreen = ref(false);\nconst languageLoading = ref(false);\nconst showFloatingCopy = ref(false);\n\n// 安全地获取 hljs 实例\nconst hljs = computed(() => {\n try {\n return highlightManager?.getHljs?.() || null;\n } catch (error) {\n console.warn(\"Highlight.js not available:\", error);\n return null;\n }\n});\n\n// 语言图标映射(使用标准的 MDI 图标名称)\nconst languageIcon = computed(() => {\n const iconMap: Record<string, string> = {\n javascript: \"mdi:language-javascript\",\n typescript: \"mdi:language-typescript\",\n python: \"mdi:language-python\",\n html: \"mdi:language-html5\",\n css: \"mdi:language-css3\",\n vue: \"mdi:vuejs\",\n react: \"mdi:react\",\n json: \"mdi:code-json\",\n java: \"mdi:language-java\",\n cpp: \"mdi:language-cpp\",\n go: \"mdi:language-go\",\n rust: \"mdi:language-rust\",\n php: \"mdi:language-php\",\n csharp: \"mdi:language-csharp\",\n sql: \"mdi:database\",\n yaml: \"mdi:file-code\",\n xml: \"mdi:xml\",\n markdown: \"mdi:language-markdown\",\n bash: \"mdi:bash\",\n shell: \"mdi:console\",\n powershell: \"mdi:powershell\",\n swift: \"mdi:language-swift\",\n kotlin: \"mdi:language-kotlin\",\n ruby: \"mdi:language-ruby\",\n };\n return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\n});\n\n// 代码样式\nconst codeStyle = computed(() => {\n if (!props.maxHeight) return {};\n return {\n maxHeight:\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight,\n };\n});\n\n// 自动加载语言包\nwatch(\n () => props.language,\n async (newLanguage) => {\n if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\n return;\n\n const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\n if (loadedLanguages.includes(newLanguage)) return;\n\n languageLoading.value = true;\n try {\n await highlightManager.loadLanguage?.(newLanguage);\n await nextTick();\n } catch (error) {\n console.warn(`Failed to load language: ${newLanguage}`, error);\n } finally {\n languageLoading.value = false;\n }\n },\n { immediate: true },\n);\n\n/**\n * 复制代码到剪贴板\n */\nasync function copyCode() {\n if (copying.value) return;\n copying.value = true;\n\n try {\n await navigator.clipboard.writeText(props.code);\n emit(\"copy\", props.code);\n } catch (error) {\n console.error(\"Copy failed:\", error);\n } finally {\n copying.value = false;\n }\n}\n\n/**\n * 切换全屏显示状态\n */\nfunction toggleFullscreen() {\n isFullscreen.value = !isFullscreen.value;\n emit(\"fullscreen\", isFullscreen.value);\n}\n\n/**\n * 获取编程语言的显示标题\n */\nfunction getLanguageTitle(lang: string): string {\n const titleMap: Record<string, string> = {\n javascript: \"JavaScript\",\n typescript: \"TypeScript\",\n python: \"Python\",\n java: \"Java\",\n cpp: \"C++\",\n csharp: \"C#\",\n php: \"PHP\",\n go: \"Go\",\n rust: \"Rust\",\n html: \"HTML\",\n css: \"CSS\",\n json: \"JSON\",\n bash: \"Bash\",\n shell: \"Shell\",\n yaml: \"YAML\",\n xml: \"XML\",\n markdown: \"Markdown\",\n sql: \"SQL\",\n powershell: \"PowerShell\",\n swift: \"Swift\",\n kotlin: \"Kotlin\",\n ruby: \"Ruby\",\n vue: \"Vue\",\n react: \"React\",\n };\n return titleMap[lang.toLowerCase()] || lang.toUpperCase();\n}\n\n/**\n * 处理ESC键退出全屏\n */\nfunction handleEscapeKey(event: KeyboardEvent) {\n if (event.key === \"Escape\" && isFullscreen.value) {\n toggleFullscreen();\n }\n}\n\nonMounted(() => {\n document.addEventListener(\"keydown\", handleEscapeKey);\n});\n\nonUnmounted(() => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n});\n\ndefineExpose({\n copyCode,\n toggleFullscreen,\n});\n</script>\n\n<style lang=\"scss\" scoped>\n.mr-2 {\n margin-right: 0.5rem;\n}\n\n.ml-2 {\n margin-left: 0.5rem;\n}\n</style>\n"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_Code2.js","names":["showHeader","title","language","showFullscreen","code","showLineNumbers","wordWrap","trim"],"sources":["../src/components/C_Code/index.vue","../src/components/C_Code/index.vue"],"sourcesContent":["<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-06-19\n * @Description: 全局代码高亮组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-code-wrapper\">\n <!-- 代码标题栏 -->\n <div v-if=\"showHeader\" class=\"c-code-header\">\n <div class=\"c-code-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <div class=\"c-code-actions\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"tiny\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n\n <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\n <template #trigger>\n <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon\n :name=\"\n isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\n \"\n />\n </template>\n </NButton>\n </template>\n {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\n </NTooltip>\n </div>\n </div>\n\n <!-- 代码内容区域 -->\n <div class=\"c-code-content\">\n <div\n class=\"code-wrapper\"\n @mouseenter=\"showFloatingCopy = true\"\n @mouseleave=\"showFloatingCopy = false\"\n >\n <NCode\n :key=\"`code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n :style=\"codeStyle\"\n @click=\"emit('click', $event)\"\n />\n\n <!-- 悬浮复制按钮 -->\n <Transition name=\"fade\">\n <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"small\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n class=\"copy-floating\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n </div>\n </Transition>\n </div>\n\n <!-- 语言加载状态 -->\n <div v-if=\"languageLoading\" class=\"c-code-loading\">\n <NSpin size=\"small\" />\n <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\n </div>\n </div>\n\n <!-- 全屏模态框 -->\n <NModal\n v-model:show=\"isFullscreen\"\n :mask-closable=\"false\"\n :show-icon=\"false\"\n :bordered=\"false\"\n style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\n >\n <div class=\"fullscreen-content\">\n <div class=\"fullscreen-header\">\n <div class=\"fullscreen-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon name=\"mdi:close\" />\n </template>\n </NButton>\n </div>\n <div class=\"fullscreen-body\">\n <NCode\n :key=\"`fullscreen-code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n />\n </div>\n </div>\n </NModal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {\n ref,\n computed,\n watch,\n onMounted,\n onUnmounted,\n nextTick,\n inject,\n} from \"vue\";\nimport C_Icon from \"../C_Icon/index.vue\";\n\n// 直接在组件内定义 HighlightManager 接口,避免导入错误\ninterface HighlightManager {\n getHljs?: () => any;\n loadLanguage?: (language: string) => Promise<void>;\n getLoadedLanguages?: () => string[];\n}\n\n// 组件名称定义\ndefineOptions({\n name: \"CCode\",\n});\n\ninterface Props {\n code: string;\n language?: string;\n title?: string;\n showHeader?: boolean;\n showLineNumbers?: boolean;\n wordWrap?: boolean;\n trim?: boolean;\n showFullscreen?: boolean;\n maxHeight?: string | number;\n autoLoadLanguage?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n code: \"\",\n language: \"text\",\n showHeader: true,\n showLineNumbers: true,\n wordWrap: false,\n trim: true,\n showFullscreen: false,\n autoLoadLanguage: true,\n});\n\nconst emit = defineEmits<{\n copy: [code: string];\n click: [event: MouseEvent];\n fullscreen: [isFullscreen: boolean];\n}>();\n\n// 尝试获取 highlight 实例(如果用户安装了插件)\nconst highlightManager = inject<HighlightManager | null>(\n \"highlightManager\",\n null,\n);\n\nconst copying = ref(false);\nconst isFullscreen = ref(false);\nconst languageLoading = ref(false);\nconst showFloatingCopy = ref(false);\n\n// 安全地获取 hljs 实例\nconst hljs = computed(() => {\n try {\n return highlightManager?.getHljs?.() || null;\n } catch (error) {\n console.warn(\"Highlight.js not available:\", error);\n return null;\n }\n});\n\n// 语言图标映射(使用标准的 MDI 图标名称)\nconst languageIcon = computed(() => {\n const iconMap: Record<string, string> = {\n javascript: \"mdi:language-javascript\",\n typescript: \"mdi:language-typescript\",\n python: \"mdi:language-python\",\n html: \"mdi:language-html5\",\n css: \"mdi:language-css3\",\n vue: \"mdi:vuejs\",\n react: \"mdi:react\",\n json: \"mdi:code-json\",\n java: \"mdi:language-java\",\n cpp: \"mdi:language-cpp\",\n go: \"mdi:language-go\",\n rust: \"mdi:language-rust\",\n php: \"mdi:language-php\",\n csharp: \"mdi:language-csharp\",\n sql: \"mdi:database\",\n yaml: \"mdi:file-code\",\n xml: \"mdi:xml\",\n markdown: \"mdi:language-markdown\",\n bash: \"mdi:bash\",\n shell: \"mdi:console\",\n powershell: \"mdi:powershell\",\n swift: \"mdi:language-swift\",\n kotlin: \"mdi:language-kotlin\",\n ruby: \"mdi:language-ruby\",\n };\n return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\n});\n\n// 代码样式\nconst codeStyle = computed(() => {\n if (!props.maxHeight) return {};\n return {\n maxHeight:\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight,\n };\n});\n\n// 自动加载语言包\nwatch(\n () => props.language,\n async (newLanguage) => {\n if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\n return;\n\n const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\n if (loadedLanguages.includes(newLanguage)) return;\n\n languageLoading.value = true;\n try {\n await highlightManager.loadLanguage?.(newLanguage);\n await nextTick();\n } catch (error) {\n console.warn(`Failed to load language: ${newLanguage}`, error);\n } finally {\n languageLoading.value = false;\n }\n },\n { immediate: true },\n);\n\n/**\n * 复制代码到剪贴板\n */\nasync function copyCode() {\n if (copying.value) return;\n copying.value = true;\n\n try {\n await navigator.clipboard.writeText(props.code);\n emit(\"copy\", props.code);\n } catch (error) {\n console.error(\"Copy failed:\", error);\n } finally {\n copying.value = false;\n }\n}\n\n/**\n * 切换全屏显示状态\n */\nfunction toggleFullscreen() {\n isFullscreen.value = !isFullscreen.value;\n emit(\"fullscreen\", isFullscreen.value);\n}\n\n/**\n * 获取编程语言的显示标题\n */\nfunction getLanguageTitle(lang: string): string {\n const titleMap: Record<string, string> = {\n javascript: \"JavaScript\",\n typescript: \"TypeScript\",\n python: \"Python\",\n java: \"Java\",\n cpp: \"C++\",\n csharp: \"C#\",\n php: \"PHP\",\n go: \"Go\",\n rust: \"Rust\",\n html: \"HTML\",\n css: \"CSS\",\n json: \"JSON\",\n bash: \"Bash\",\n shell: \"Shell\",\n yaml: \"YAML\",\n xml: \"XML\",\n markdown: \"Markdown\",\n sql: \"SQL\",\n powershell: \"PowerShell\",\n swift: \"Swift\",\n kotlin: \"Kotlin\",\n ruby: \"Ruby\",\n vue: \"Vue\",\n react: \"React\",\n };\n return titleMap[lang.toLowerCase()] || lang.toUpperCase();\n}\n\n/**\n * 处理ESC键退出全屏\n */\nfunction handleEscapeKey(event: KeyboardEvent) {\n if (event.key === \"Escape\" && isFullscreen.value) {\n toggleFullscreen();\n }\n}\n\nonMounted(() => {\n document.addEventListener(\"keydown\", handleEscapeKey);\n});\n\nonUnmounted(() => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n});\n\ndefineExpose({\n copyCode,\n toggleFullscreen,\n});\n</script>\n\n<style lang=\"scss\" scoped>\n.mr-2 {\n margin-right: 0.5rem;\n}\n\n.ml-2 {\n margin-left: 0.5rem;\n}\n</style>\n","<!--\n * @Author: ChenYu ycyplus@gmail.com\n * @Date: 2025-06-19\n * @Description: 全局代码高亮组件\n * @Migration: naive-ui-components 组件库迁移版本\n * Copyright (c) 2025 by CHENY, All Rights Reserved.\n-->\n<template>\n <div class=\"c-code-wrapper\">\n <!-- 代码标题栏 -->\n <div v-if=\"showHeader\" class=\"c-code-header\">\n <div class=\"c-code-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <div class=\"c-code-actions\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"tiny\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n\n <NTooltip v-if=\"showFullscreen\" trigger=\"hover\">\n <template #trigger>\n <NButton size=\"tiny\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon\n :name=\"\n isFullscreen ? 'mdi:fullscreen-exit' : 'mdi:fullscreen'\n \"\n />\n </template>\n </NButton>\n </template>\n {{ isFullscreen ? \"退出全屏\" : \"全屏查看\" }}\n </NTooltip>\n </div>\n </div>\n\n <!-- 代码内容区域 -->\n <div class=\"c-code-content\">\n <div\n class=\"code-wrapper\"\n @mouseenter=\"showFloatingCopy = true\"\n @mouseleave=\"showFloatingCopy = false\"\n >\n <NCode\n :key=\"`code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n :style=\"codeStyle\"\n @click=\"emit('click', $event)\"\n />\n\n <!-- 悬浮复制按钮 -->\n <Transition name=\"fade\">\n <div v-if=\"showFloatingCopy && !showHeader\" class=\"floating-copy-btn\">\n <NTooltip trigger=\"hover\">\n <template #trigger>\n <NButton\n size=\"small\"\n quaternary\n @click=\"copyCode\"\n :loading=\"copying\"\n class=\"copy-floating\"\n >\n <template #icon>\n <C_Icon\n :name=\"copying ? 'mdi:loading' : 'mdi:content-copy'\"\n :loading=\"copying\"\n />\n </template>\n </NButton>\n </template>\n 复制代码\n </NTooltip>\n </div>\n </Transition>\n </div>\n\n <!-- 语言加载状态 -->\n <div v-if=\"languageLoading\" class=\"c-code-loading\">\n <NSpin size=\"small\" />\n <span class=\"ml-2\">正在加载 {{ language }} 语言包...</span>\n </div>\n </div>\n\n <!-- 全屏模态框 -->\n <NModal\n v-model:show=\"isFullscreen\"\n :mask-closable=\"false\"\n :show-icon=\"false\"\n :bordered=\"false\"\n style=\"width: 100vw; height: 100vh; margin: 0; padding: 0\"\n >\n <div class=\"fullscreen-content\">\n <div class=\"fullscreen-header\">\n <div class=\"fullscreen-title\">\n <C_Icon\n v-if=\"languageIcon\"\n :name=\"languageIcon\"\n :size=\"16\"\n class=\"mr-2\"\n />\n <span>{{ title || getLanguageTitle(language) }}</span>\n </div>\n <NButton size=\"small\" quaternary @click=\"toggleFullscreen\">\n <template #icon>\n <C_Icon name=\"mdi:close\" />\n </template>\n </NButton>\n </div>\n <div class=\"fullscreen-body\">\n <NCode\n :key=\"`fullscreen-code-${language}-${code.length}`\"\n :code=\"code\"\n :language=\"language\"\n :hljs=\"hljs\"\n :show-line-numbers=\"showLineNumbers\"\n :word-wrap=\"wordWrap\"\n :trim=\"trim\"\n />\n </div>\n </div>\n </NModal>\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {\n ref,\n computed,\n watch,\n onMounted,\n onUnmounted,\n nextTick,\n inject,\n} from \"vue\";\nimport C_Icon from \"../C_Icon/index.vue\";\n\n// 直接在组件内定义 HighlightManager 接口,避免导入错误\ninterface HighlightManager {\n getHljs?: () => any;\n loadLanguage?: (language: string) => Promise<void>;\n getLoadedLanguages?: () => string[];\n}\n\n// 组件名称定义\ndefineOptions({\n name: \"CCode\",\n});\n\ninterface Props {\n code: string;\n language?: string;\n title?: string;\n showHeader?: boolean;\n showLineNumbers?: boolean;\n wordWrap?: boolean;\n trim?: boolean;\n showFullscreen?: boolean;\n maxHeight?: string | number;\n autoLoadLanguage?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n code: \"\",\n language: \"text\",\n showHeader: true,\n showLineNumbers: true,\n wordWrap: false,\n trim: true,\n showFullscreen: false,\n autoLoadLanguage: true,\n});\n\nconst emit = defineEmits<{\n copy: [code: string];\n click: [event: MouseEvent];\n fullscreen: [isFullscreen: boolean];\n}>();\n\n// 尝试获取 highlight 实例(如果用户安装了插件)\nconst highlightManager = inject<HighlightManager | null>(\n \"highlightManager\",\n null,\n);\n\nconst copying = ref(false);\nconst isFullscreen = ref(false);\nconst languageLoading = ref(false);\nconst showFloatingCopy = ref(false);\n\n// 安全地获取 hljs 实例\nconst hljs = computed(() => {\n try {\n return highlightManager?.getHljs?.() || null;\n } catch (error) {\n console.warn(\"Highlight.js not available:\", error);\n return null;\n }\n});\n\n// 语言图标映射(使用标准的 MDI 图标名称)\nconst languageIcon = computed(() => {\n const iconMap: Record<string, string> = {\n javascript: \"mdi:language-javascript\",\n typescript: \"mdi:language-typescript\",\n python: \"mdi:language-python\",\n html: \"mdi:language-html5\",\n css: \"mdi:language-css3\",\n vue: \"mdi:vuejs\",\n react: \"mdi:react\",\n json: \"mdi:code-json\",\n java: \"mdi:language-java\",\n cpp: \"mdi:language-cpp\",\n go: \"mdi:language-go\",\n rust: \"mdi:language-rust\",\n php: \"mdi:language-php\",\n csharp: \"mdi:language-csharp\",\n sql: \"mdi:database\",\n yaml: \"mdi:file-code\",\n xml: \"mdi:xml\",\n markdown: \"mdi:language-markdown\",\n bash: \"mdi:bash\",\n shell: \"mdi:console\",\n powershell: \"mdi:powershell\",\n swift: \"mdi:language-swift\",\n kotlin: \"mdi:language-kotlin\",\n ruby: \"mdi:language-ruby\",\n };\n return iconMap[props.language.toLowerCase()] || \"mdi:code-braces\";\n});\n\n// 代码样式\nconst codeStyle = computed(() => {\n if (!props.maxHeight) return {};\n return {\n maxHeight:\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight,\n };\n});\n\n// 自动加载语言包\nwatch(\n () => props.language,\n async (newLanguage) => {\n if (!props.autoLoadLanguage || newLanguage === \"text\" || !highlightManager)\n return;\n\n const loadedLanguages = highlightManager.getLoadedLanguages?.() || [];\n if (loadedLanguages.includes(newLanguage)) return;\n\n languageLoading.value = true;\n try {\n await highlightManager.loadLanguage?.(newLanguage);\n await nextTick();\n } catch (error) {\n console.warn(`Failed to load language: ${newLanguage}`, error);\n } finally {\n languageLoading.value = false;\n }\n },\n { immediate: true },\n);\n\n/**\n * 复制代码到剪贴板\n */\nasync function copyCode() {\n if (copying.value) return;\n copying.value = true;\n\n try {\n await navigator.clipboard.writeText(props.code);\n emit(\"copy\", props.code);\n } catch (error) {\n console.error(\"Copy failed:\", error);\n } finally {\n copying.value = false;\n }\n}\n\n/**\n * 切换全屏显示状态\n */\nfunction toggleFullscreen() {\n isFullscreen.value = !isFullscreen.value;\n emit(\"fullscreen\", isFullscreen.value);\n}\n\n/**\n * 获取编程语言的显示标题\n */\nfunction getLanguageTitle(lang: string): string {\n const titleMap: Record<string, string> = {\n javascript: \"JavaScript\",\n typescript: \"TypeScript\",\n python: \"Python\",\n java: \"Java\",\n cpp: \"C++\",\n csharp: \"C#\",\n php: \"PHP\",\n go: \"Go\",\n rust: \"Rust\",\n html: \"HTML\",\n css: \"CSS\",\n json: \"JSON\",\n bash: \"Bash\",\n shell: \"Shell\",\n yaml: \"YAML\",\n xml: \"XML\",\n markdown: \"Markdown\",\n sql: \"SQL\",\n powershell: \"PowerShell\",\n swift: \"Swift\",\n kotlin: \"Kotlin\",\n ruby: \"Ruby\",\n vue: \"Vue\",\n react: \"React\",\n };\n return titleMap[lang.toLowerCase()] || lang.toUpperCase();\n}\n\n/**\n * 处理ESC键退出全屏\n */\nfunction handleEscapeKey(event: KeyboardEvent) {\n if (event.key === \"Escape\" && isFullscreen.value) {\n toggleFullscreen();\n }\n}\n\nonMounted(() => {\n document.addEventListener(\"keydown\", handleEscapeKey);\n});\n\nonUnmounted(() => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n});\n\ndefineExpose({\n copyCode,\n toggleFullscreen,\n});\n</script>\n\n<style lang=\"scss\" scoped>\n.mr-2 {\n margin-right: 0.5rem;\n}\n\n.ml-2 {\n margin-left: 0.5rem;\n}\n</style>\n"],"mappings":"mvCA2LA,IAAM,EAAQ,EAWR,EAAO,EAOP,EAAmB,EACvB,mBACA,KACD,CAEK,EAAU,EAAI,GAAM,CACpB,EAAe,EAAI,GAAM,CACzB,EAAkB,EAAI,GAAM,CAC5B,EAAmB,EAAI,GAAM,CAG7B,EAAO,MAAe,CAC1B,GAAI,CACF,OAAO,GAAkB,WAAW,EAAI,WACjC,EAAO,CAEd,OADA,QAAQ,KAAK,8BAA+B,EAAM,CAC3C,OAET,CAGI,EAAe,OACqB,CACtC,WAAY,0BACZ,WAAY,0BACZ,OAAQ,sBACR,KAAM,qBACN,IAAK,oBACL,IAAK,YACL,MAAO,YACP,KAAM,gBACN,KAAM,oBACN,IAAK,mBACL,GAAI,kBACJ,KAAM,oBACN,IAAK,mBACL,OAAQ,sBACR,IAAK,eACL,KAAM,gBACN,IAAK,UACL,SAAU,wBACV,KAAM,WACN,MAAO,cACP,WAAY,iBACZ,MAAO,qBACP,OAAQ,sBACR,KAAM,oBACP,EACc,EAAM,SAAS,aAAa,GAAK,kBAChD,CAGI,EAAY,MACX,EAAM,UACJ,CACL,UACE,OAAO,EAAM,WAAc,SACvB,GAAG,EAAM,UAAU,IACnB,EAAM,UACb,CAN4B,EAAE,CAO/B,CAGF,MACQ,EAAM,SACZ,KAAO,IAAgB,CACjB,MAAC,EAAM,kBAAoB,IAAgB,QAAU,CAAC,IAI1D,EADwB,EAAiB,sBAAsB,EAAI,EAAE,EACjD,SAAS,EAAY,CAEzC,GAAgB,MAAQ,GACxB,GAAI,CACF,MAAM,EAAiB,eAAe,EAAY,CAClD,MAAM,GAAU,OACT,EAAO,CACd,QAAQ,KAAK,4BAA4B,IAAe,EAAM,QACtD,CACR,EAAgB,MAAQ,MAG5B,CAAE,UAAW,GAAM,CACpB,CAKD,eAAe,GAAW,CACpB,MAAQ,MACZ,GAAQ,MAAQ,GAEhB,GAAI,CACF,MAAM,UAAU,UAAU,UAAU,EAAM,KAAK,CAC/C,EAAK,OAAQ,EAAM,KAAK,OACjB,EAAO,CACd,QAAQ,MAAM,eAAgB,EAAM,QAC5B,CACR,EAAQ,MAAQ,KAOpB,SAAS,GAAmB,CAC1B,EAAa,MAAQ,CAAC,EAAa,MACnC,EAAK,aAAc,EAAa,MAAM,CAMxC,SAAS,EAAiB,EAAsB,CA2B9C,MA1ByC,CACvC,WAAY,aACZ,WAAY,aACZ,OAAQ,SACR,KAAM,OACN,IAAK,MACL,OAAQ,KACR,IAAK,MACL,GAAI,KACJ,KAAM,OACN,KAAM,OACN,IAAK,MACL,KAAM,OACN,KAAM,OACN,MAAO,QACP,KAAM,OACN,IAAK,MACL,SAAU,WACV,IAAK,MACL,WAAY,aACZ,MAAO,QACP,OAAQ,SACR,KAAM,OACN,IAAK,MACL,MAAO,QACR,CACe,EAAK,aAAa,GAAK,EAAK,aAAa,CAM3D,SAAS,EAAgB,EAAsB,CACzC,EAAM,MAAQ,UAAY,EAAa,OACzC,GAAkB,QAItB,MAAgB,CACd,SAAS,iBAAiB,UAAW,EAAgB,EACrD,CAEF,MAAkB,CAChB,SAAS,oBAAoB,UAAW,EAAgB,EACxD,CAEF,EAAa,CACX,WACA,mBACD,CAAC,4CCxWA,EA2IM,MA3IN,EA2IM,CA1IJ,EAAA,UAAc,CACHA,EAAAA,YAAAA,GAAAA,CAAX,EA6CM,MA7CN,EA6CM,CA5CJ,EAQM,MARN,EAQM,CANI,EAAA,OAAA,GAAA,CADR,EAKE,EAAA,OAHC,KAAM,EAAA,MACN,KAAM,GACP,MAAM,uCAER,EAAsD,OAAA,KAAA,EAA7CC,EAAAA,OAAS,EAAiBC,EAAAA,SAAQ,CAAA,CAAA,EAAA,CAAA,CAAA,CAE7C,EAkCM,MAlCN,EAkCM,CAjCJ,EAiBW,EAAA,CAjBD,QAAQ,QAAO,CAAA,CACZ,QAAO,MAaN,CAZV,EAYU,EAAA,CAXR,KAAK,OACL,WAAA,GACC,QAAO,EACP,QAAS,EAAA,QAEC,KAAI,MAIX,CAHF,EAGE,EAAA,CAFC,KAAM,EAAA,MAAO,cAAA,mBACb,QAAS,EAAA,wEAMpB,CAAA,AAAA,EAAA,KAAA,EAFa,SAEb,GAAA,CAAA,CAAA,cAEgBC,EAAAA,gBAAAA,GAAAA,CAAhB,EAaW,EAAA,OAbqB,QAAQ,UAC3B,QAAO,MASN,CARV,EAQU,EAAA,CARD,KAAK,OAAO,WAAA,GAAY,QAAO,IAC3B,KAAI,MAKX,CAJF,EAIE,EAAA,CAHC,KAA2B,EAAA,MAAY,sBAAA,iBAAA,CAAA,KAAA,EAAA,CAAA,OAAA,CAAA,CAAA,CAAA,uBAOhD,CAAA,EADW,IACX,EAAG,EAAA,MAAY,OAAA,OAAA,CAAA,EAAA,CAAA,CAAA,uCAKrB,EAAA,WAAe,CACf,EAiDM,MAjDN,EAiDM,CAhDJ,EAyCM,MAAA,CAxCJ,MAAM,eACL,aAAU,AAAA,EAAA,KAAA,GAAE,EAAA,MAAgB,GAC5B,aAAU,AAAA,EAAA,KAAA,GAAE,EAAA,MAAgB,UAE7B,EAUE,EAAA,CATC,IAAG,QAAUD,EAAAA,SAAQ,GAAIE,EAAAA,KAAK,SAC9B,KAAMA,EAAAA,KACN,SAAUF,EAAAA,SACV,KAAM,EAAA,MACN,oBAAmBG,EAAAA,gBACnB,YAAWC,EAAAA,SACX,KAAMC,EAAAA,KACN,MAAK,EAAE,EAAA,MAAS,CAChB,QAAK,AAAA,EAAA,KAAA,GAAE,EAAI,QAAU,EAAM,qFAG9B,EAAA,WAAe,CACf,EAsBa,EAAA,CAtBD,KAAK,OAAM,CAAA,eAqBf,CApBK,EAAA,OAAgB,CAAKP,EAAAA,YAAAA,GAAAA,CAAhC,EAoBM,MApBN,EAoBM,CAnBJ,EAkBW,EAAA,CAlBD,QAAQ,QAAO,CAAA,CACZ,QAAO,MAcN,CAbV,EAaU,EAAA,CAZR,KAAK,QACL,WAAA,GACC,QAAO,EACP,QAAS,EAAA,MACV,MAAM,kBAEK,KAAI,MAIX,CAHF,EAGE,EAAA,CAFC,KAAM,EAAA,MAAO,cAAA,mBACb,QAAS,EAAA,wEAMpB,CAAA,AAAA,EAAA,KAAA,EAFa,SAEb,GAAA,CAAA,CAAA,2CAKN,EAAA,WAAe,CACJ,EAAA,OAAA,GAAA,CAAX,EAGM,MAHN,EAGM,CAFJ,EAAsB,EAAA,CAAf,KAAK,QAAO,CAAA,CACnB,EAAoD,OAApD,EAAmB,QAAK,EAAGE,EAAAA,SAAQ,CAAG,UAAO,EAAA,CAAA,CAAA,EAAA,EAAA,OAAA,GAAA,GAIjD,EAAA,UAAc,CACd,EAoCS,EAAA,CAnCC,KAAM,EAAA,gCAAA,EAAY,MAAA,EACzB,gBAAe,GACf,YAAW,GACX,SAAU,GACX,MAAA,CAAA,MAAA,QAAA,OAAA,QAAA,OAAA,IAAA,QAAA,qBA8BM,CA5BN,EA4BM,MA5BN,EA4BM,CA3BJ,EAeM,MAfN,EAeM,CAdJ,EAQM,MARN,EAQM,CANI,EAAA,OAAA,GAAA,CADR,EAKE,EAAA,OAHC,KAAM,EAAA,MACN,KAAM,GACP,MAAM,uCAER,EAAsD,OAAA,KAAA,EAA7CD,EAAAA,OAAS,EAAiBC,EAAAA,SAAQ,CAAA,CAAA,EAAA,CAAA,CAAA,CAE7C,EAIU,EAAA,CAJD,KAAK,QAAQ,WAAA,GAAY,QAAO,IAC5B,KAAI,MACc,CAA3B,EAA2B,EAAA,CAAnB,KAAK,YAAW,CAAA,CAAA,CAAA,SAI9B,EAUM,MAVN,EAUM,EAAA,GAAA,CATJ,EAQE,EAAA,CAPC,IAAG,mBAAqBA,EAAAA,SAAQ,GAAIE,EAAAA,KAAK,SACzC,KAAMA,EAAAA,KACN,SAAUF,EAAAA,SACV,KAAM,EAAA,MACN,oBAAmBG,EAAAA,gBACnB,YAAWC,EAAAA,SACX,KAAMC,EAAAA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_CollapsePanel-BSKcWSmY.css","names":[],"sources":["../src/components/C_CollapsePanel/index.vue?vue&type=style&index=0&scoped=3ad19a41&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled *//* ─── 变量 ───────────────────────────────────────── */\n/* ─── 容器 ───────────────────────────────────────── */\n.c-collapse-panel[data-v-3ad19a41] {\n width: 100%;\n /* ── default 变体 ────────────────────────────── */\n /* ── card 变体 ───────────────────────────────── */\n /* ── ghost 变体(无边框极简) ──────────────────── */\n /* ── bordered 修饰符 ─────────────────────────── */\n /* ── 图标右侧模式 ────────────────────────────── */\n}\n.c-collapse-panel--default .collapse-item[data-v-3ad19a41] {\n border-bottom: 1px solid var(--c-border, #e1e4e8);\n}\n.c-collapse-panel--default .collapse-item[data-v-3ad19a41]:last-child {\n border-bottom: none;\n}\n.c-collapse-panel--card[data-v-3ad19a41] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.c-collapse-panel--card .collapse-item[data-v-3ad19a41] {\n border: 1px solid var(--c-border, #e1e4e8);\n border-radius: 8px;\n background: var(--c-bg-card, #fff);\n transition: box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.c-collapse-panel--card .collapse-item--active[data-v-3ad19a41] {\n box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);\n}\n.c-collapse-panel--card .collapse-item[data-v-3ad19a41]:hover:not(.collapse-item--disabled) {\n border-color: var(--c-primary, #409eff);\n}\n.c-collapse-panel--ghost .collapse-item__header[data-v-3ad19a41] {\n background: transparent;\n}\n.c-collapse-panel--ghost .collapse-item__header[data-v-3ad19a41]:hover {\n background: var(--c-bg-card, #fff);\n}\n.c-collapse-panel--ghost .collapse-item__content[data-v-3ad19a41] {\n padding-left: 28px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default[data-v-3ad19a41] {\n border: 1px solid var(--c-border, #e1e4e8);\n border-radius: 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:first-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px 8px 0 0;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item[data-v-3ad19a41]:last-child {\n border-bottom: none;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:last-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 0 0 8px 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:last-child.collapse-item--active .collapse-item__header[data-v-3ad19a41] {\n border-radius: 0;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:only-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:only-child.collapse-item--active .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px 8px 0 0;\n}\n.c-collapse-panel--icon-right .collapse-item__header[data-v-3ad19a41] {\n flex-direction: row-reverse;\n}\n.c-collapse-panel--icon-right .collapse-item__arrow[data-v-3ad19a41] {\n margin-left: auto;\n margin-right: 0;\n}\n.c-collapse-panel--icon-right .collapse-item__title-area[data-v-3ad19a41] {\n margin-left: 0;\n}\n\n/* ─── 面板项 ─────────────────────────────────────── */\n.collapse-item--disabled .collapse-item__header[data-v-3ad19a41] {\n cursor: not-allowed;\n opacity: 0.5;\n}\n\n/* ─── 面板头部 ───────────────────────────────────── */\n.collapse-item__header[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px;\n cursor: pointer;\n user-select: none;\n background: transparent;\n transition: background-color 0.15s ease;\n outline: none;\n}\n.collapse-item__header[data-v-3ad19a41]:hover:not([aria-disabled=true]) {\n background: var(--c-bg-hover, rgba(0, 0, 0, 0.04));\n}\n.collapse-item__header[data-v-3ad19a41]:focus-visible {\n outline: 2px solid var(--c-primary, #409eff);\n outline-offset: -2px;\n border-radius: 4px;\n}\n\n/* ─── 展开箭头 ───────────────────────────────────── */\n.collapse-item__arrow[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 20px;\n height: 20px;\n font-size: 16px;\n color: var(--c-text-3, #999);\n transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.collapse-item__arrow--expanded[data-v-3ad19a41] {\n transform: rotate(90deg);\n}\n\n/* ─── 标题区域 ───────────────────────────────────── */\n.collapse-item__title-area[data-v-3ad19a41] {\n flex: 1;\n min-width: 0;\n}\n.collapse-item__title-group[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.collapse-item__icon[data-v-3ad19a41] {\n flex-shrink: 0;\n font-size: 18px;\n color: var(--c-primary, #409eff);\n}\n.collapse-item__title[data-v-3ad19a41] {\n font-size: 14px;\n font-weight: 600;\n color: var(--c-text-1, #333);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.collapse-item__subtitle[data-v-3ad19a41] {\n font-size: 12px;\n color: var(--c-text-4, #ccc);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n/* ─── 头部右侧操作区 ────────────────────────────── */\n.collapse-item__extra[data-v-3ad19a41] {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n}\n\n/* ─── 内容区域 ───────────────────────────────────── */\n.collapse-item__content-wrapper[data-v-3ad19a41] {\n transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n will-change: height;\n}\n.collapse-item__content[data-v-3ad19a41] {\n padding: 0 16px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: var(--c-text-2, #666);\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;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;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;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"C_CollapsePanel-DRvRq8tB.css","names":[],"sources":["../src/components/C_CollapsePanel/index.vue?vue&type=style&index=0&scoped=3ad19a41&lang.scss"],"sourcesContent":["/* unplugin-vue-components disabled *//* ─── 变量 ───────────────────────────────────────── */\n/* ─── 容器 ───────────────────────────────────────── */\n.c-collapse-panel[data-v-3ad19a41] {\n width: 100%;\n /* ── default 变体 ────────────────────────────── */\n /* ── card 变体 ───────────────────────────────── */\n /* ── ghost 变体(无边框极简) ──────────────────── */\n /* ── bordered 修饰符 ─────────────────────────── */\n /* ── 图标右侧模式 ────────────────────────────── */\n}\n.c-collapse-panel--default .collapse-item[data-v-3ad19a41] {\n border-bottom: 1px solid var(--c-border, #e1e4e8);\n}\n.c-collapse-panel--default .collapse-item[data-v-3ad19a41]:last-child {\n border-bottom: none;\n}\n.c-collapse-panel--card[data-v-3ad19a41] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.c-collapse-panel--card .collapse-item[data-v-3ad19a41] {\n border: 1px solid var(--c-border, #e1e4e8);\n border-radius: 8px;\n background: var(--c-bg-card, #fff);\n transition: box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.c-collapse-panel--card .collapse-item--active[data-v-3ad19a41] {\n box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);\n}\n.c-collapse-panel--card .collapse-item[data-v-3ad19a41]:hover:not(.collapse-item--disabled) {\n border-color: var(--c-primary, #409eff);\n}\n.c-collapse-panel--ghost .collapse-item__header[data-v-3ad19a41] {\n background: transparent;\n}\n.c-collapse-panel--ghost .collapse-item__header[data-v-3ad19a41]:hover {\n background: var(--c-bg-card, #fff);\n}\n.c-collapse-panel--ghost .collapse-item__content[data-v-3ad19a41] {\n padding-left: 28px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default[data-v-3ad19a41] {\n border: 1px solid var(--c-border, #e1e4e8);\n border-radius: 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:first-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px 8px 0 0;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item[data-v-3ad19a41]:last-child {\n border-bottom: none;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:last-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 0 0 8px 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:last-child.collapse-item--active .collapse-item__header[data-v-3ad19a41] {\n border-radius: 0;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:only-child .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px;\n}\n.c-collapse-panel--bordered.c-collapse-panel--default .collapse-item:only-child.collapse-item--active .collapse-item__header[data-v-3ad19a41] {\n border-radius: 8px 8px 0 0;\n}\n.c-collapse-panel--icon-right .collapse-item__header[data-v-3ad19a41] {\n flex-direction: row-reverse;\n}\n.c-collapse-panel--icon-right .collapse-item__arrow[data-v-3ad19a41] {\n margin-left: auto;\n margin-right: 0;\n}\n.c-collapse-panel--icon-right .collapse-item__title-area[data-v-3ad19a41] {\n margin-left: 0;\n}\n\n/* ─── 面板项 ─────────────────────────────────────── */\n.collapse-item--disabled .collapse-item__header[data-v-3ad19a41] {\n cursor: not-allowed;\n opacity: 0.5;\n}\n\n/* ─── 面板头部 ───────────────────────────────────── */\n.collapse-item__header[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px;\n cursor: pointer;\n user-select: none;\n background: transparent;\n transition: background-color 0.15s ease;\n outline: none;\n}\n.collapse-item__header[data-v-3ad19a41]:hover:not([aria-disabled=true]) {\n background: var(--c-bg-hover, rgba(0, 0, 0, 0.04));\n}\n.collapse-item__header[data-v-3ad19a41]:focus-visible {\n outline: 2px solid var(--c-primary, #409eff);\n outline-offset: -2px;\n border-radius: 4px;\n}\n\n/* ─── 展开箭头 ───────────────────────────────────── */\n.collapse-item__arrow[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 20px;\n height: 20px;\n font-size: 16px;\n color: var(--c-text-3, #999);\n transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.collapse-item__arrow--expanded[data-v-3ad19a41] {\n transform: rotate(90deg);\n}\n\n/* ─── 标题区域 ───────────────────────────────────── */\n.collapse-item__title-area[data-v-3ad19a41] {\n flex: 1;\n min-width: 0;\n}\n.collapse-item__title-group[data-v-3ad19a41] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.collapse-item__icon[data-v-3ad19a41] {\n flex-shrink: 0;\n font-size: 18px;\n color: var(--c-primary, #409eff);\n}\n.collapse-item__title[data-v-3ad19a41] {\n font-size: 14px;\n font-weight: 600;\n color: var(--c-text-1, #333);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.collapse-item__subtitle[data-v-3ad19a41] {\n font-size: 12px;\n color: var(--c-text-4, #ccc);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n/* ─── 头部右侧操作区 ────────────────────────────── */\n.collapse-item__extra[data-v-3ad19a41] {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: auto;\n}\n\n/* ─── 内容区域 ───────────────────────────────────── */\n.collapse-item__content-wrapper[data-v-3ad19a41] {\n transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n will-change: height;\n}\n.collapse-item__content[data-v-3ad19a41] {\n padding: 0 16px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: var(--c-text-2, #666);\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;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;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;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}