ソースを参照

添加新页面

yangg 7 ヶ月 前
コミット
591f344bd9
84 ファイル変更2254 行追加2 行削除
  1. 0 0
      dist/index.html
  2. 0 0
      dist/static/css/app.dbf5810a.css
  3. 0 0
      dist/static/css/chunk-301a8402.9733ac4d.css
  4. 0 0
      dist/static/css/chunk-319a1820.775a21e3.css
  5. 0 0
      dist/static/css/chunk-libs.a8bd5ebe.css
  6. 0 0
      dist/static/css/chunk-libs.ee51935a.css
  7. 1 0
      dist/static/img/attachment.b1a9b59f.svg
  8. 1 0
      dist/static/img/close.5736bc22.svg
  9. 1 0
      dist/static/img/hot-for-ux.2246c9f0.svg
  10. 1 0
      dist/static/img/left.59a9c942.svg
  11. 1 0
      dist/static/img/plus.9040c45b.svg
  12. 1 0
      dist/static/img/read.fdfa0036.svg
  13. 1 0
      dist/static/img/right.ecadc668.svg
  14. 1 0
      dist/static/img/up.2316092e.svg
  15. 0 0
      dist/static/img/upload.714868a4.svg
  16. 1 0
      dist/static/img/word.a9699f98.svg
  17. 0 0
      dist/static/js/app.2aa13d83.js
  18. 0 0
      dist/static/js/app.d2d200f7.js
  19. 0 0
      dist/static/js/chunk-00d3f6c2.4cfff979.js
  20. 0 0
      dist/static/js/chunk-04c39295.e709b7e5.js
  21. 0 0
      dist/static/js/chunk-0678749f.9250938b.js
  22. 0 0
      dist/static/js/chunk-09f78c22.14932b43.js
  23. 0 0
      dist/static/js/chunk-0ec56e2a.65d98cc1.js
  24. 0 0
      dist/static/js/chunk-11ff1a32.87e38847.js
  25. 0 0
      dist/static/js/chunk-138f7583.a6757932.js
  26. 0 0
      dist/static/js/chunk-16694b50.23e17d58.js
  27. 0 0
      dist/static/js/chunk-16694b50.62a45e5f.js
  28. 0 0
      dist/static/js/chunk-16a60d86.84671d9b.js
  29. 0 0
      dist/static/js/chunk-1bde5712.1fbedc29.js
  30. 0 0
      dist/static/js/chunk-23d4d74d.948dab21.js
  31. 0 0
      dist/static/js/chunk-2d0d3705.12524cb9.js
  32. 1 0
      dist/static/js/chunk-2d0dd870.06e5bbdd.js
  33. 0 0
      dist/static/js/chunk-301a8402.22633ca1.js
  34. 0 0
      dist/static/js/chunk-319a1820.becb6fc4.js
  35. 0 0
      dist/static/js/chunk-3401b870.b6ba7bd2.js
  36. 0 0
      dist/static/js/chunk-35464144.4a8c3f8d.js
  37. 0 0
      dist/static/js/chunk-3777bfcd.58bd7d05.js
  38. 0 0
      dist/static/js/chunk-3ecbedba.fa97bf34.js
  39. 0 0
      dist/static/js/chunk-44eee83d.dc2e5738.js
  40. 0 0
      dist/static/js/chunk-4ac7f82e.24fa4477.js
  41. 0 0
      dist/static/js/chunk-52f685c2.40173081.js
  42. 0 0
      dist/static/js/chunk-556bc188.c3e6aabb.js
  43. 0 0
      dist/static/js/chunk-5a3bdf57.0d6cd3fb.js
  44. 0 0
      dist/static/js/chunk-5a509642.d74a7c26.js
  45. 0 0
      dist/static/js/chunk-5c5b00e6.000d22d0.js
  46. 0 0
      dist/static/js/chunk-616f7602.152c7332.js
  47. 0 0
      dist/static/js/chunk-6711f3a4.10ae5d38.js
  48. 0 0
      dist/static/js/chunk-683feb49.5bdd4b65.js
  49. 0 2
      dist/static/js/chunk-696e880a.08ecd45a.js
  50. 0 0
      dist/static/js/chunk-6a80e4ca.f4207c0f.js
  51. 0 0
      dist/static/js/chunk-6ddf6871.d48920ea.js
  52. 0 0
      dist/static/js/chunk-708604c0.fef08a4e.js
  53. 0 0
      dist/static/js/chunk-7150dcbc.12383d6b.js
  54. 0 0
      dist/static/js/chunk-77e7ad00.d7e12f08.js
  55. 0 0
      dist/static/js/chunk-7a88741c.e6853f3d.js
  56. 0 0
      dist/static/js/chunk-9235c1ae.d2dc41f3.js
  57. 0 0
      dist/static/js/chunk-b9108494.e34014d5.js
  58. 0 0
      dist/static/js/chunk-elementUI.e5de5f60.js
  59. 0 0
      dist/static/js/chunk-elementUI.f54e49fc.js
  60. 0 0
      dist/static/js/chunk-libs.188d12a6.js
  61. 0 0
      dist/static/js/chunk-libs.ffbdfd39.js
  62. 0 0
      dist/static/js/vendors~canvg.8d0627e7.js
  63. 0 0
      dist/static/js/vendors~canvg.c2910215.js
  64. 2 0
      package.json
  65. 129 0
      src/components/Independent/components/Bubble.vue
  66. 47 0
      src/components/Independent/components/Conversations.vue
  67. 173 0
      src/components/Independent/components/Prompts.vue
  68. 140 0
      src/components/Independent/components/Sender.vue
  69. 62 0
      src/components/Independent/components/Welcome.vue
  70. 1551 0
      src/components/Independent/index.vue
  71. 83 0
      src/components/Independent/styles.js
  72. 1 0
      src/components/Independent/svg/attachment.svg
  73. 1 0
      src/components/Independent/svg/close.svg
  74. 1 0
      src/components/Independent/svg/hot-for-ux.svg
  75. 1 0
      src/components/Independent/svg/left.svg
  76. 1 0
      src/components/Independent/svg/plus.svg
  77. 1 0
      src/components/Independent/svg/read.svg
  78. 1 0
      src/components/Independent/svg/right.svg
  79. 1 0
      src/components/Independent/svg/up.svg
  80. 0 0
      src/components/Independent/svg/upload.svg
  81. 1 0
      src/components/Independent/svg/word.svg
  82. 3 0
      src/main.js
  83. 7 0
      src/router/index.js
  84. 38 0
      src/views/login/AI_demo.vue

ファイルの差分が大きいため隠しています
+ 0 - 0
dist/index.html


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/css/app.dbf5810a.css


+ 0 - 0
dist/static/css/chunk-10b289e2.9733ac4d.css → dist/static/css/chunk-301a8402.9733ac4d.css


+ 0 - 0
dist/static/css/chunk-696e880a.775a21e3.css → dist/static/css/chunk-319a1820.775a21e3.css


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/css/chunk-libs.a8bd5ebe.css


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/css/chunk-libs.ee51935a.css


+ 1 - 0
dist/static/img/attachment.b1a9b59f.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280632344" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7700" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M924.672 126.976q36.864 36.864 54.784 82.432t17.92 93.696-17.92 93.696-54.784 82.432l-392.192 389.12q-36.864 36.864-90.624 61.44t-113.664 28.672-122.368-16.384-115.712-73.728q-52.224-52.224-72.704-113.152t-16.384-121.344 28.16-113.664 60.928-90.112l348.16-345.088q9.216-9.216 27.136-4.608t27.136 13.824q8.192 9.216 13.312 27.136t-4.096 27.136l-347.136 344.064q-27.648 27.648-46.08 64.512t-21.504 78.848 12.288 84.992 55.296 82.944q35.84 35.84 79.36 50.688t86.528 12.288 81.92-18.944 66.56-44.032l391.168-388.096q27.648-27.648 39.424-57.344t11.264-58.88-13.824-56.832-36.864-51.2q-44.032-43.008-98.816-40.448t-110.08 57.856l-353.28 351.232q-23.552 23.552-23.04 52.224t18.944 47.104q22.528 22.528 51.712 18.432t47.616-22.528l320.512-318.464q9.216-9.216 27.136-4.608t27.136 13.824 14.336 27.136-4.096 27.136l-321.536 318.464q-36.864 36.864-70.656 51.2t-63.488 12.8-55.296-15.872-47.104-34.816q-17.408-16.384-31.232-41.984t-15.872-56.32 10.752-65.536 49.664-70.656q18.432-18.432 32.768-33.792 12.288-13.312 23.04-23.552t11.776-11.264l285.696-284.672q36.864-36.864 80.384-57.856t88.576-24.064 88.576 12.288 80.384 52.224z" p-id="7701" fill="#1e1e1e"></path></svg>

+ 1 - 0
dist/static/img/close.5736bc22.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735287774232" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1465" width="16" height="16" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M563.8 512l262.5-312.9c4.4-5.2 0.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9c-4.4 5.2-0.7 13.1 6.1 13.1h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" p-id="1466"></path></svg>

+ 1 - 0
dist/static/img/hot-for-ux.2246c9f0.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280492544" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4326" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M442.514286 73.142857c82.529524 64.24381 140.239238 126.610286 173.129143 187.099429 31.158857 57.295238 43.666286 115.907048 37.546666 175.835428l-1.219047 9.996191 6.095238-4.973715a174.055619 174.055619 0 0 0 49.249524-69.607619l2.681904-7.411809 7.704381-23.04c82.285714 55.734857 123.440762 150.064762 123.440762 283.062857C841.142857 823.515429 665.795048 950.857143 521.654857 950.857143c-144.11581 0-308.224-85.333333-334.750476-263.875048-26.550857-178.541714 83.480381-261.90019 158.427429-378.197333C395.288381 231.253333 427.690667 152.697905 442.514286 73.142857z m33.718857 154.575238c-17.554286 41.447619-39.424 82.407619-65.536 122.904381l-8.313905 12.653714c-8.411429 12.507429-17.310476 24.941714-28.818286 40.374858l-40.96 54.467047c-63.634286 86.869333-80.944762 136.021333-68.851809 217.526857 17.92 120.441905 128.341333 197.778286 257.901714 197.778286 120.905143 0 241.785905-110.933333 241.785905-249.344 0-61.976381-9.825524-111.323429-29.110857-149.699048-8.240762 9.411048-17.237333 18.285714-26.965334 26.59962l-159.085714 130.023619 26.697143-195.364572c6.41219-46.811429-2.462476-92.208762-27.648-138.483809-13.214476-24.30781-31.98781-49.737143-56.368762-76.166096l-8.338286-8.850285-6.387809 15.579428z" p-id="4327" fill="#ff4d4f"></path></svg>

+ 1 - 0
dist/static/img/left.59a9c942.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735295375625" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3239" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M659.748571 245.272381l-51.687619-51.687619-318.439619 318.585905 318.415238 318.268952 51.712-51.736381-266.703238-266.556952z" p-id="3240"></path></svg>

+ 1 - 0
dist/static/img/plus.9040c45b.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280866862" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="17804" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M474 152m8 0l60 0q8 0 8 8l0 704q0 8-8 8l-60 0q-8 0-8-8l0-704q0-8 8-8Z" fill="#81bdfe" p-id="17805"></path><path d="M168 474m8 0l672 0q8 0 8 8l0 60q0 8-8 8l-672 0q-8 0-8-8l0-60q0-8 8-8Z" fill="#81bdfe" p-id="17806"></path></svg>

+ 1 - 0
dist/static/img/read.fdfa0036.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735281808867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1528" width="16" height="16" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M928 161H699.2c-49.1 0-97.1 14.1-138.4 40.7L512 233l-48.8-31.3C422 175.1 373.9 161 324.8 161H96c-17.7 0-32 14.3-32 32v568c0 17.7 14.3 32 32 32h228.8c49.1 0 97.1 14.1 138.4 40.7l44.4 28.6c1.3 0.8 2.8 1.3 4.3 1.3s3-0.4 4.3-1.3l44.4-28.6C602 807.1 650.1 793 699.2 793H928c17.7 0 32-14.3 32-32V193c0-17.7-14.3-32-32-32zM324.8 721H136V233h188.8c35.4 0 69.8 10.1 99.5 29.2l48.8 31.3 6.9 4.5v462c-47.6-25.6-100.8-39-155.2-39z m563.2 0H699.2c-54.4 0-107.6 13.4-155.2 39V298l6.9-4.5 48.8-31.3c29.7-19.1 64.1-29.2 99.5-29.2H888v488z" p-id="1529" fill="#1890ff"></path><path d="M396.9 361H211.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5zM620 368.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0-4.1-3.2-7.5-7.1-7.5H627.1c-3.9 0-7.1 3.4-7.1 7.5zM396.9 501H211.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5zM812.9 501H627.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5z" p-id="1530" fill="#1890ff"></path></svg>

+ 1 - 0
dist/static/img/right.ecadc668.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735295357873" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2254" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M605.086476 512.146286L338.358857 245.272381l51.760762-51.687619 318.415238 318.585905L390.095238 830.415238l-51.687619-51.736381z" p-id="2255"></path></svg>

+ 1 - 0
dist/static/img/up.2316092e.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280808939" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15804" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M873.8816 150.1184C973.9264 250.2656 1024 370.8928 1024 512c0 141.2096-50.0736 261.8368-150.1184 361.8816C773.7344 973.9264 653.1072 1024 512 1024c-141.1072 0-261.7344-50.0736-361.8816-150.1184C50.0736 773.8368 0 653.2096 0 512c0-141.1072 50.0736-261.7344 150.1184-361.8816C250.2656 50.0736 370.8928 0 512 0 653.1072 0 773.7344 50.0736 873.8816 150.1184zM819.712 526.7456 507.0848 211.6608 192 526.7456l56.6272 54.1696 219.0336-219.0336 0 477.4912 78.7456 0L546.4064 361.8816l219.0336 219.0336L819.712 526.7456z" p-id="15805" fill="#4096ff"></path></svg>

ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/img/upload.714868a4.svg


+ 1 - 0
dist/static/img/word.a9699f98.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735287324782" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1522" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M616.746667 85.333333L896 347.904V853.333333a85.333333 85.333333 0 0 1-85.333333 85.333334H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333334V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h403.413334z m244.352 295.381334L581.802667 118.186667v177.237333a85.333333 85.333333 0 0 0 85.333333 85.333333h193.962667z m-107.264 76.373333h-49.152l-79.488 227.157333-109.354667-227.114666h-13.226667l-110.506666 226.688-77.824-226.688H265.130667l113.749333 328.192h13.226667l117.12-239.36 114.858666 239.36h13.781334l115.968-328.192z" fill="#5197e8" p-id="1523"></path></svg>

ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/app.2aa13d83.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/app.d2d200f7.js


+ 0 - 0
dist/static/js/chunk-00d3f6c2.09e66246.js → dist/static/js/chunk-00d3f6c2.4cfff979.js


+ 0 - 0
dist/static/js/chunk-04c39295.d984656b.js → dist/static/js/chunk-04c39295.e709b7e5.js


+ 0 - 0
dist/static/js/chunk-0678749f.bb74f10c.js → dist/static/js/chunk-0678749f.9250938b.js


+ 0 - 0
dist/static/js/chunk-09f78c22.10e2d4c9.js → dist/static/js/chunk-09f78c22.14932b43.js


+ 0 - 0
dist/static/js/chunk-0ec56e2a.ab0452b7.js → dist/static/js/chunk-0ec56e2a.65d98cc1.js


+ 0 - 0
dist/static/js/chunk-11ff1a32.61a74561.js → dist/static/js/chunk-11ff1a32.87e38847.js


+ 0 - 0
dist/static/js/chunk-138f7583.43c23be9.js → dist/static/js/chunk-138f7583.a6757932.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-16694b50.23e17d58.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-16694b50.62a45e5f.js


+ 0 - 0
dist/static/js/chunk-16a60d86.53ba7bc1.js → dist/static/js/chunk-16a60d86.84671d9b.js


+ 0 - 0
dist/static/js/chunk-1bde5712.2851479b.js → dist/static/js/chunk-1bde5712.1fbedc29.js


+ 0 - 0
dist/static/js/chunk-23d4d74d.2794e8b8.js → dist/static/js/chunk-23d4d74d.948dab21.js


+ 0 - 0
dist/static/js/chunk-2d0d3705.8eb62e74.js → dist/static/js/chunk-2d0d3705.12524cb9.js


+ 1 - 0
dist/static/js/chunk-2d0dd870.06e5bbdd.js

@@ -0,0 +1 @@
+(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-2d0dd870"],{8288:function(n,e,t){"use strict";t.r(e);var d=function(){var n=this,e=n.$createElement,t=n._self._c||e;return t("div",[t("Independent")],1)},c=[],o=t("f155"),u={props:{},components:{Independent:o["default"]},data:function(){return{}},computed:{},watch:{},mounted:function(){},methods:{}},p=u,a=t("2877"),r=Object(a["a"])(p,d,c,!1,null,"39edc687",null);e["default"]=r.exports}}]);

ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-301a8402.22633ca1.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-319a1820.becb6fc4.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-3401b870.b6ba7bd2.js


+ 0 - 0
dist/static/js/chunk-35464144.15682d7b.js → dist/static/js/chunk-35464144.4a8c3f8d.js


+ 0 - 0
dist/static/js/chunk-3777bfcd.7a4fabee.js → dist/static/js/chunk-3777bfcd.58bd7d05.js


+ 0 - 0
dist/static/js/chunk-3ecbedba.56b62c0e.js → dist/static/js/chunk-3ecbedba.fa97bf34.js


+ 0 - 0
dist/static/js/chunk-44eee83d.9d235966.js → dist/static/js/chunk-44eee83d.dc2e5738.js


+ 0 - 0
dist/static/js/chunk-4ac7f82e.ef61581d.js → dist/static/js/chunk-4ac7f82e.24fa4477.js


+ 0 - 0
dist/static/js/chunk-52f685c2.bb5a2f67.js → dist/static/js/chunk-52f685c2.40173081.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-556bc188.c3e6aabb.js


+ 0 - 0
dist/static/js/chunk-5a3bdf57.ef1ef08f.js → dist/static/js/chunk-5a3bdf57.0d6cd3fb.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-5a509642.d74a7c26.js


+ 0 - 0
dist/static/js/chunk-5c5b00e6.8ee156bf.js → dist/static/js/chunk-5c5b00e6.000d22d0.js


+ 0 - 0
dist/static/js/chunk-616f7602.63185d7a.js → dist/static/js/chunk-616f7602.152c7332.js


+ 0 - 0
dist/static/js/chunk-6711f3a4.253a954d.js → dist/static/js/chunk-6711f3a4.10ae5d38.js


+ 0 - 0
dist/static/js/chunk-683feb49.ab95f8ec.js → dist/static/js/chunk-683feb49.5bdd4b65.js


ファイルの差分が大きいため隠しています
+ 0 - 2
dist/static/js/chunk-696e880a.08ecd45a.js


+ 0 - 0
dist/static/js/chunk-6a80e4ca.c571b091.js → dist/static/js/chunk-6a80e4ca.f4207c0f.js


+ 0 - 0
dist/static/js/chunk-6ddf6871.ea368fb3.js → dist/static/js/chunk-6ddf6871.d48920ea.js


+ 0 - 0
dist/static/js/chunk-708604c0.16fd71f2.js → dist/static/js/chunk-708604c0.fef08a4e.js


+ 0 - 0
dist/static/js/chunk-7150dcbc.7adf2888.js → dist/static/js/chunk-7150dcbc.12383d6b.js


+ 0 - 0
dist/static/js/chunk-77e7ad00.4552a5d5.js → dist/static/js/chunk-77e7ad00.d7e12f08.js


+ 0 - 0
dist/static/js/chunk-7a88741c.70c1d7e3.js → dist/static/js/chunk-7a88741c.e6853f3d.js


+ 0 - 0
dist/static/js/chunk-9235c1ae.7740a205.js → dist/static/js/chunk-9235c1ae.d2dc41f3.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-b9108494.e34014d5.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-elementUI.e5de5f60.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-elementUI.f54e49fc.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-libs.188d12a6.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/chunk-libs.ffbdfd39.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/vendors~canvg.8d0627e7.js


ファイルの差分が大きいため隠しています
+ 0 - 0
dist/static/js/vendors~canvg.c2910215.js


+ 2 - 0
package.json

@@ -17,10 +17,12 @@
   "dependencies": {
     "@amcharts/amcharts4": "^4.10.39",
     "@amcharts/amcharts5": "^5.10.7",
+    "@ant-design/icons-vue": "^2.0.0",
     "@handsontable-pro/vue": "^3.1.1",
     "@handsontable/vue": "^14.1.0",
     "@hufe921/canvas-editor": "^0.9.96",
     "@jiaminghi/data-view": "^2.10.0",
+    "ant-design-vue": "^1.7.8",
     "axios": "0.18.1",
     "ckeditor4": "^4.23.0",
     "ckeditor4-vue": "^3.0.0",

+ 129 - 0
src/components/Independent/components/Bubble.vue

@@ -0,0 +1,129 @@
+<template>
+    <div class="bubble-list">
+      <div
+        v-for="item in items"
+        :key="item.key"
+        class="bubble-item"
+        :class="[
+          `bubble-${item.role || 'default'}`,
+          item.variant,
+          { 'bubble-loading': item.loading }
+        ]"
+      >
+        <div
+          class="bubble-content"
+          :style="getRoleStyles(item.role)"
+        >
+          <component
+            v-if="typeof item.content === 'object' && item.content.component"
+            :is="item.content.component"
+            v-bind="item.content.props"
+          />
+          <template v-else>
+            {{ item.content }}
+          </template>
+        </div>
+        <div v-if="item.loading" class="bubble-loading-dots">
+          <span></span>
+          <span></span>
+          <span></span>
+        </div>
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'BubbleList',
+    props: {
+      items: {
+        type: Array,
+        default: () => []
+      },
+      roles: {
+        type: Object,
+        default: () => ({})
+      }
+    },
+    methods: {
+      getRoleStyles(role) {
+        return this.roles[role]?.styles?.content || {}
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .bubble-list {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    overflow-y: auto;
+  }
+  
+  .bubble-item {
+    display: flex;
+    flex-direction: column;
+  }
+  
+  .bubble-content {
+    max-width: 80%;
+    padding: 12px 16px;
+    background: #f0f0f0;
+    border-radius: 8px;
+    word-break: break-word;
+  }
+  
+  .bubble-ai {
+    align-items: flex-start;
+  }
+  
+  .bubble-local {
+    align-items: flex-end;
+  }
+  
+  .bubble-local .bubble-content {
+    background: #1890ff;
+    color: white;
+  }
+  
+  .bubble-borderless .bubble-content {
+    background: transparent;
+    padding: 0;
+  }
+  
+  .bubble-loading-dots {
+    display: flex;
+    gap: 4px;
+    padding: 8px;
+  }
+  
+  .bubble-loading-dots span {
+    width: 8px;
+    height: 8px;
+    background: #1890ff;
+    border-radius: 50%;
+    animation: loading 1s infinite;
+  }
+  
+  .bubble-loading-dots span:nth-child(2) {
+    animation-delay: 0.2s;
+  }
+  
+  .bubble-loading-dots span:nth-child(3) {
+    animation-delay: 0.4s;
+  }
+  
+  @keyframes loading {
+    0%, 100% { opacity: 0.3; }
+    50% { opacity: 1; }
+  }
+  
+  .bubble-content {
+    border-radius: 8px;
+  }
+  
+  .bubble-ai .bubble-content {
+    border-radius: 16px;
+  }
+  </style>

+ 47 - 0
src/components/Independent/components/Conversations.vue

@@ -0,0 +1,47 @@
+<template>
+    <div class="conversations">
+      <a-menu
+        mode="inline"
+        :selectedKeys="[activeKey]"
+        @select="handleSelect"
+      >
+        <a-menu-item
+          v-for="item in items"
+          :key="item.key"
+          class="conversation-item"
+        >
+          <a-icon type="message" />
+          <span>{{ item.label }}</span>
+        </a-menu-item>
+      </a-menu>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'Conversations',
+    props: {
+      items: {
+        type: Array,
+        default: () => []
+      },
+      activeKey: String
+    },
+    methods: {
+      handleSelect({ key }) {
+        this.$emit('activeChange', key)
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .conversations {
+    overflow-y: auto;
+  }
+  
+  .conversation-item {
+    margin: 4px 0;
+    padding: 0 16px;
+  }
+  </style>

+ 173 - 0
src/components/Independent/components/Prompts.vue

@@ -0,0 +1,173 @@
+<template>
+    <div class="prompts">
+      <h3 v-if="title" class="prompts-title">{{ title }}</h3>
+      <div class="prompts-list" :style="customListStyle">
+        <div
+          v-for="(item, index) in items"
+          :key="index"
+          class="prompts-item"
+          :style="customItemStyle"
+          @click="handleItemClick(item)"
+        >
+          <!-- 标题部分 -->
+          <div class="prompts-item-header">
+            <a-icon 
+              v-if="item.icon" 
+              :type="item.icon"
+            />
+            <component 
+              v-else-if="hasIconComponent(item)" 
+              :is="getIconComponent(item)"
+              v-bind="getIconProps(item)"
+            />
+            <span>{{ getItemTitle(item) }}</span>
+          </div>
+  
+          <!-- 描述部分 -->
+          <div v-if="item.description" class="prompts-item-description">
+            {{ item.description }}
+          </div>
+  
+          <!-- 子项目列表 -->
+          <div v-if="hasChildren(item)" class="prompts-item-children">
+            <div
+              v-for="child in item.children"
+              :key="child.key"
+              class="prompts-child-item"
+              @click.stop="handleItemClick(child)"
+            >
+              <a-icon v-if="child.icon" :type="child.icon" />
+              <span>{{ child.description }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'Prompts',
+    props: {
+      title: String,
+      items: {
+        type: Array,
+        default: () => []
+      },
+      styles: {
+        type: Object,
+        default: () => ({})
+      }
+    },
+    computed: {
+      customListStyle() {
+        return (this.styles && this.styles.list) || {}
+      },
+      customItemStyle() {
+        return (this.styles && this.styles.item) || {}
+      }
+    },
+    methods: {
+      handleItemClick(item) {
+        this.$emit('item-click', {
+          data: item
+        })
+      },
+      getItemTitle(item) {
+        if (item.label && item.label.title) {
+          return item.label.title
+        }
+        return item.description || ''
+      },
+      hasIconComponent(item) {
+        return item.label && 
+               item.label.icon && 
+               item.label.icon.component
+      },
+      getIconComponent(item) {
+        return item.label && 
+               item.label.icon && 
+               item.label.icon.component
+      },
+      getIconProps(item) {
+        return (item.label && 
+                item.label.icon && 
+                item.label.icon.props) || {}
+      },
+      hasChildren(item) {
+        return item.children && item.children.length > 0
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .prompts {
+    width: 100%;
+  }
+  
+  .prompts-title {
+    margin: 0 0 16px;
+    font-size: 16px;
+    font-weight: 500;
+    color: rgba(0, 0, 0, 0.88);
+  }
+  
+  .prompts-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+    gap: 16px;
+  }
+  
+  .prompts-item {
+    padding: 16px;
+    background: #fff;
+    border: 1px solid #f0f0f0;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all 0.3s;
+  }
+  
+  .prompts-item:hover {
+    border-color: #1890ff;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  }
+  
+  .prompts-item-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+    font-weight: 500;
+  }
+  
+  .prompts-item-description {
+    color: rgba(0, 0, 0, 0.45);
+    font-size: 14px;
+    line-height: 1.5715;
+  }
+  
+  .prompts-item-children {
+    margin-top: 12px;
+    padding-top: 12px;
+    border-top: 1px solid #f0f0f0;
+  }
+  
+  .prompts-child-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 8px 0;
+    color: rgba(0, 0, 0, 0.65);
+    font-size: 14px;
+    transition: color 0.3s;
+  }
+  
+  .prompts-child-item:hover {
+    color: #1890ff;
+  }
+  
+  .prompts-child-item:not(:last-child) {
+    margin-bottom: 4px;
+  }
+  </style>

+ 140 - 0
src/components/Independent/components/Sender.vue

@@ -0,0 +1,140 @@
+<template>
+    <div class="sender">
+      <!-- 头部区域 -->
+      <div v-if="showHeader" class="sender-header">
+        <div class="sender-header-title">
+          <span>{{ header.title }}</span>
+          <a-icon type="close" @click="onHeaderClose" />
+        </div>
+        <div class="sender-header-content">
+          <slot name="header-content"></slot>
+        </div>
+      </div>
+  
+      <!-- 输入区域 -->
+      <div class="sender-content">
+        <!-- 前缀按钮 -->
+        <template v-if="prefix">
+          <a-badge :dot="prefix.dot">
+            <a-button type="text" @click="onPrefixClick">
+              <a-icon :type="prefix.icon" />
+            </a-button>
+          </a-badge>
+        </template>
+  
+        <!-- 输入框 -->
+        <a-textarea
+          v-model="localValue"
+          :rows="3"
+          :placeholder="placeholder"
+          @pressEnter.prevent="onSubmit"
+        />
+  
+        <!-- 发送按钮 -->
+        <a-button 
+          type="primary"
+          :loading="loading"
+          @click="onSubmit"
+        >
+          发送
+        </a-button>
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'Sender',
+    props: {
+      value: {
+        type: String,
+        default: ''
+      },
+      header: {
+        type: Object,
+        default: () => ({})
+      },
+      prefix: {
+        type: Object,
+        default: null
+      },
+      loading: {
+        type: Boolean,
+        default: false
+      },
+      placeholder: {
+        type: String,
+        default: '请输入消息...'
+      }
+    },
+    data() {
+      return {
+        localValue: this.value,
+        showHeader: false
+      }
+    },
+    watch: {
+      value(val) {
+        this.localValue = val
+      },
+      localValue(val) {
+        this.$emit('input', val)
+      }
+    },
+    methods: {
+      onSubmit() {
+        if (!this.localValue.trim()) return
+        this.$emit('submit', this.localValue)
+      },
+      onHeaderClose() {
+        this.showHeader = false
+        this.$emit('header-close')
+      },
+      onPrefixClick() {
+        this.showHeader = !this.showHeader
+        this.$emit('prefix-click')
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .sender {
+    border: 1px solid #f0f0f0;
+    border-radius: 8px;
+    background: #fff;
+  }
+  
+  .sender-header {
+    border-bottom: 1px solid #f0f0f0;
+  }
+  
+  .sender-header-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 12px 16px;
+    background: #fafafa;
+  }
+  
+  .sender-header-content {
+    padding: 16px;
+  }
+  
+  .sender-content {
+    display: flex;
+    align-items: flex-start;
+    padding: 16px;
+    gap: 8px;
+  }
+  
+  .sender-content .ant-textarea {
+    flex: 1;
+    min-height: 80px;
+    resize: none;
+  }
+  
+  .sender-content .ant-btn {
+    margin-left: 8px;
+  }
+  </style>

+ 62 - 0
src/components/Independent/components/Welcome.vue

@@ -0,0 +1,62 @@
+<template>
+    <div class="welcome" :class="{ 'welcome-borderless': variant === 'borderless' }">
+      <img :src="icon" class="welcome-icon" v-if="icon" />
+      <h2 class="welcome-title">{{ title }}</h2>
+      <p class="welcome-description">{{ description }}</p>
+      <div class="welcome-extra" v-if="extra">
+        <a-space>
+          <a-button 
+            v-for="btn in extra.buttons" 
+            :key="btn.icon"
+            v-bind="btn.props"
+          >
+            <component :is="btn.icon" />
+          </a-button>
+        </a-space>
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: 'Welcome',
+    props: {
+      variant: String,
+      icon: String,
+      title: String,
+      description: String,
+      extra: {
+        type: Object,
+        default: () => ({})
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .welcome {
+    text-align: center;
+    padding: 24px;
+    border: 1px solid #f0f0f0;
+    border-radius: 8px;
+  }
+  
+  .welcome-borderless {
+    border: none;
+  }
+  
+  .welcome-icon {
+    width: 64px;
+    margin-bottom: 16px;
+  }
+  
+  .welcome-title {
+    margin: 0 0 8px;
+    font-size: 20px;
+  }
+  
+  .welcome-description {
+    margin: 0 0 16px;
+    color: rgba(0, 0, 0, 0.45);
+  }
+  </style>

+ 1551 - 0
src/components/Independent/index.vue

@@ -0,0 +1,1551 @@
+<template>
+  <div class="layout">
+    <div class="menu">
+      <!-- Logo -->
+      <div class="logo">
+        <img
+          src="https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*eco6RrQhxbMAAAAAAAAAAAAADgCCAQ/original"
+          :draggable="false"
+          alt="logo"
+          class="logo-img"
+        />
+        <span>Ant Design X</span>
+      </div>
+
+      <!-- New Conversation 按钮 -->
+      <button class="new-conversation-btn" @click="addNewConversation">
+        <!-- <PlusOutlined /> -->
+        <img class="tab-icon" src="./svg/plus.svg" alt="" />
+        <span>New Conversation</span>
+      </button>
+
+      <!-- 会话列表 -->
+      <div class="conversation-list">
+        <div
+          v-for="conversation in conversations"
+          :key="conversation.id"
+          :class="[
+            'conversation-item',
+            { active: currentConversationId === conversation.id },
+          ]"
+          @click="switchConversation(conversation.id)"
+        >
+          {{ conversation.title }}
+        </div>
+      </div>
+    </div>
+
+    <div class="chat">
+      <!-- 欢迎消息 -->
+      <div v-if="messages.length === 0" class="welcome-section">
+        <div class="welcome-header">
+          <img class="avatar" src="path-to-your-avatar" alt="Ant Design X" />
+          <div class="welcome-info">
+            <h2>Hello, I'm Ant Design X</h2>
+            <p>
+              Base on Ant Design, AGI product interface solution, create a
+              better intelligent vision~
+            </p>
+          </div>
+          <div class="action-buttons">
+            <button class="icon-btn"><!-- <ShareAltOutlined /> --></button>
+            <button class="icon-btn"><!-- <EllipsisOutlined /> --></button>
+          </div>
+        </div>
+
+        <!-- Do you want 部分 -->
+        <div class="suggestion-section">
+          <h3>Do you want?</h3>
+
+          <div class="cards-container">
+            <!-- Hot Topics 卡片 -->
+            <div class="suggestion-card">
+              <div class="card-header">
+                <img
+                  src="./svg/hot-for-ux.svg"
+                  alt="hot topics"
+                  class="tab-icon"
+                />
+                <h4>Hot Topics</h4>
+              </div>
+              <p class="card-subtitle">What are you interested in?</p>
+              <div class="suggestion-items">
+                <div class="suggestion-item">What's new in X?</div>
+                <div class="suggestion-item">What's AGI?</div>
+                <div class="suggestion-item">Where is the doc?</div>
+              </div>
+            </div>
+
+            <!-- Design Guide 卡片 -->
+            <div class="suggestion-card">
+              <div class="card-header">
+                <img src="./svg/read.svg" alt="hot topics" class="tab-icon" />
+                <h4>Design Guide</h4>
+              </div>
+              <p class="card-subtitle">How to design a good product?</p>
+              <div class="suggestion-items">
+                <div class="suggestion-item">
+                  <!-- <HeartOutlined /> -->
+                  Know the well
+                </div>
+                <div class="suggestion-item">
+                  <!-- <SmileOutlined /> -->
+                  Set the AI role
+                </div>
+                <div class="suggestion-item">
+                  <!--  <CommentOutlined /> -->
+                  Express the feeling
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 修改消息列表部分 -->
+      <div v-else class="message-list">
+        <div
+          v-for="message in messages"
+          :key="message.id"
+          :class="[
+            'message-item',
+            message.role === 'user' ? 'user' : 'assistant',
+          ]"
+        >
+          <div class="message-bubble">
+            <div class="message-content">
+              {{ message.content }}
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 输入框 -->
+      <div class="input-container">
+        <!-- 标签栏 -->
+        <div class="tabs-wrapper">
+          <div class="tab-item active">
+            <img src="./svg/hot-for-ux.svg" alt="hot topics" class="tab-icon" />
+            <span>Hot Topics</span>
+          </div>
+          <div class="tab-item">
+            <img src="./svg/read.svg" alt="hot topics" class="tab-icon" />
+            <span>Design Guide</span>
+          </div>
+        </div>
+        <!-- 添加附件面板 -->
+        <div v-if="showAttachments" class="attachments-panel">
+          <div class="panel-content">
+            <div class="attachments-header">
+              <span>Attachments</span>
+              <button class="close-btn" @click="toggleAttachments">
+                <img src="./svg/close.svg" alt="" />
+              </button>
+            </div>
+            <div
+              v-if="attachedFiles.length === 0"
+              style="display: flex; justify-content: center"
+            >
+              <div
+                class="upload-area"
+                :class="{ 'has-files': attachedFiles.length > 0 }"
+                @click="triggerFileInput"
+                @drop.prevent="handleFileDrop"
+                @dragover.prevent
+                @dragenter.prevent
+              >
+                <template>
+                  <img
+                    src="./svg/upload.svg"
+                    alt="upload"
+                    class="upload-icon"
+                  />
+                  <div class="upload-text">Upload files</div>
+                  <div class="upload-hint">
+                    Click or drag files to this area to upload
+                  </div>
+                </template>
+                <input
+                  type="file"
+                  ref="fileInput"
+                  style="display: none"
+                  @change="handleFileUpload"
+                  multiple
+                />
+              </div>
+            </div>
+            <!-- 上传内容列表 -->
+            <div v-if="attachedFiles.length !== 0">
+              <div class="file-list">
+                <div
+                  v-for="file in attachedFiles"
+                  :key="file.name"
+                  class="file-item"
+                  :class="{ 'is-image': getFileType(file) }"
+                >
+                  <div class="file-wrapper">
+                    <img
+                      :src="require(`${getFileIcon(file)}`)"
+                      alt="file"
+                      :class="getFileType(file) ? 'file-icon' : ''"
+                    />
+                    <button
+                      class="remove-btn"
+                      v-if="getFileType(file)"
+                      @click.stop="removeFile(file)"
+                    >
+                      ×
+                    </button>
+                  </div>
+                  <div class="file-info" v-if="!getFileType(file)">
+                    <span class="file-name">{{ file.name }}</span>
+                    <span class="file-size">{{
+                      formatFileSize(file.size)
+                    }}</span>
+                  </div>
+                  <button
+                    class="remove-btn"
+                    v-if="!getFileType(file)"
+                    @click.stop="removeFile(file)"
+                  >
+                    ×
+                  </button>
+                </div>
+                <button class="add-more-btn" @click.stop="triggerFileInput">
+                  <img src="./svg/plus.svg" alt="add" />
+                </button>
+              </div>
+
+              <input
+                type="file"
+                ref="fileInput"
+                style="display: none"
+                @change="handleFileUpload"
+                multiple
+              />
+            </div>
+            <!--   <div v-if="attachedFiles.length" class="attached-files">
+              <div
+                v-for="file in attachedFiles"
+                :key="file.name"
+                class="file-item"
+              >
+                <FileOutlined />
+                <span>{{ file.name }}</span>
+                <button class="remove-btn" @click="removeFile(file)">
+                </button>
+              </div>
+            </div> -->
+          </div>
+        </div>
+        <!-- 输入框部分 -->
+        <div class="input-wrapper">
+          <button class="attachment-btn" @click="toggleAttachments">
+            <img src="./svg/attachment.svg" alt="attachment" class="tab-icon" />
+          </button>
+          <input
+            type="text"
+            class="message-input"
+            v-model="inputContent"
+            @keyup.enter="sendMessage"
+            placeholder="Type a message..."
+          />
+          <button
+            class="send-btn"
+            @click="sendMessage"
+            :disabled="!inputContent && attachedFiles.length === 0"
+          >
+            <img src="./svg/up.svg" alt="send" />
+          </button>
+        </div>
+      </div>
+    </div>
+
+    <div class="right_menu" :class="{ collapsed: isRightMenuCollapsed }">
+      <div class="collapse-button" @click="toggleRightMenu">
+        <img
+          :src="
+            isRightMenuCollapsed
+              ? require('./svg/left.svg')
+              : require('./svg/right.svg')
+          "
+          alt="toggle"
+          class="collapse-icon"
+        />
+      </div>
+      <div class="right-menu-content">
+        <!-- 这里添加右侧菜单的内容 -->
+        <h3>Right Menu</h3>
+        <p>Add your content here</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  PlusOutlined,
+  FireOutlined,
+  ReadOutlined,
+  HeartOutlined,
+  SmileOutlined,
+  CommentOutlined,
+  CloudUploadOutlined,
+  PaperClipOutlined,
+  ShareAltOutlined,
+  EllipsisOutlined,
+  CloseOutlined,
+  FileOutlined,
+  ArrowUpOutlined,
+  UploadOutlined,
+} from "@ant-design/icons-vue";
+import Welcome from "./components/Welcome.vue";
+
+export default {
+  name: "Independent",
+  components: {
+    PlusOutlined,
+    FireOutlined,
+    ReadOutlined,
+    HeartOutlined,
+    SmileOutlined,
+    CommentOutlined,
+    CloudUploadOutlined,
+    PaperClipOutlined,
+    ShareAltOutlined,
+    EllipsisOutlined,
+    CloseOutlined,
+    FileOutlined,
+    ArrowUpOutlined,
+    UploadOutlined,
+    Welcome,
+  },
+
+  data() {
+    return {
+      headerOpen: false,
+      content: "",
+      activeKey: "0",
+      attachedFiles: [],
+      isRequesting: false,
+      messages: [],
+      inputContent: "",
+      isLoading: false,
+      quickPrompts: [
+        {
+          key: "1",
+          icon: "fas fa-fire",
+          label: "Hot Topics",
+          description: "What are you interested in?",
+        },
+        {
+          key: "2",
+          icon: "fas fa-book",
+          label: "Design Guide",
+          description: "How to design a good product?",
+        },
+      ],
+      roles: {
+        ai: {
+          placement: "start",
+          typing: { step: 5, interval: 20 },
+          styles: {
+            content: {
+              borderRadius: 16,
+            },
+          },
+        },
+        local: {
+          placement: "end",
+          variant: "shadow",
+        },
+      },
+      senderPromptsItems: [
+        {
+          key: "1",
+          description: "Hot Topics",
+          icon: {
+            component: FireOutlined,
+            props: { style: { color: "#FF4D4F" } },
+          },
+        },
+        {
+          key: "2",
+          description: "Design Guide",
+          icon: {
+            component: ReadOutlined,
+            props: { style: { color: "#1890FF" } },
+          },
+        },
+      ],
+      placeholderPromptsItems: [
+        {
+          key: "1",
+          label: {
+            title: "Hot Topics",
+            icon: {
+              component: FireOutlined,
+              props: { style: { color: "#FF4D4F" } },
+            },
+          },
+          description: "What are you interested in?",
+          children: [
+            {
+              key: "1-1",
+              description: "What's new in X?",
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "12px",
+              },
+            },
+            {
+              key: "1-2",
+              description: "What's AGI?",
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "8px",
+              },
+            },
+            {
+              key: "1-3",
+              description: "Where is the doc?",
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "8px",
+              },
+            },
+          ],
+        },
+        {
+          key: "2",
+          label: {
+            title: "Design Guide",
+            icon: {
+              component: ReadOutlined,
+              props: { style: { color: "#1890FF" } },
+            },
+          },
+          description: "How to design a good product?",
+          children: [
+            {
+              key: "2-1",
+              description: "Know the well",
+              icon: HeartOutlined,
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "12px",
+              },
+            },
+            {
+              key: "2-2",
+              description: "Set the AI role",
+              icon: SmileOutlined,
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "8px",
+              },
+            },
+            {
+              key: "2-3",
+              description: "Express the feeling",
+              icon: CommentOutlined,
+              style: {
+                background: "#F5F5F5",
+                padding: "8px 12px",
+                borderRadius: "4px",
+                marginTop: "8px",
+              },
+            },
+          ],
+        },
+      ],
+      showAttachments: false,
+      isTyping: false,
+      typingConfig: {
+        step: 5,
+        interval: 20,
+      },
+      isRightMenuCollapsed: false,
+      /* 消息框 */
+      conversations: [
+        {
+          id: 1,
+          title: "What is Ant Design X?",
+          messages: [],
+        },
+      ],
+      currentConversationId: 1,
+      conversationCounter: 1,
+    };
+  },
+
+  computed: {
+    bubbleItems() {
+      if (this.messages.length === 0) {
+        return [
+          {
+            content: {
+              component: "Welcome",
+              props: {
+                variant: "borderless",
+                icon: "https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*s5sNRo5LjfQAAAAAAAAAAAAADgCCAQ/fmt.webp",
+                title: "Hello, I'm Ant Design X",
+                description:
+                  "Base on Ant Design, AGI product interface solution...",
+                extra: {
+                  buttons: [
+                    { icon: ShareAltOutlined },
+                    { icon: EllipsisOutlined },
+                  ],
+                },
+              },
+            },
+            variant: "borderless",
+          },
+        ];
+      }
+
+      return this.messages.map(({ id, message, status }) => ({
+        key: id,
+        loading: status === "loading",
+        role: status === "local" ? "local" : "ai",
+        content: message,
+      }));
+    },
+
+    attachmentsNode() {
+      return {
+        component: "a-badge",
+        props: {
+          dot: this.attachedFiles.length > 0 && !this.headerOpen,
+        },
+        children: [
+          {
+            component: "a-button",
+            props: {
+              type: "text",
+              icon: PaperClipOutlined,
+              onClick: () => this.setHeaderOpen(!this.headerOpen),
+            },
+          },
+        ],
+      };
+    },
+
+    senderHeader() {
+      return {
+        title: "Attachments",
+        open: this.headerOpen,
+        styles: {
+          content: {
+            padding: 0,
+          },
+        },
+        attachments: {
+          beforeUpload: () => false,
+          items: this.attachedFiles,
+          onChange: this.handleFileChange,
+          placeholder: (type) =>
+            type === "drop"
+              ? { title: "Drop file here" }
+              : {
+                  icon: CloudUploadOutlined,
+                  title: "Upload files",
+                  description: "Click or drag files to this area to upload",
+                },
+        },
+      };
+    },
+  },
+
+  methods: {
+    onSubmit(content) {
+      if (!content) return;
+      this.sendRequest(content);
+      this.content = "";
+    },
+
+    onPromptsItemClick(info) {
+      this.sendRequest(info.data.description);
+    },
+
+    onAddConversation() {
+      const newKey = `${this.conversationsItems.length}`;
+      this.conversationsItems.push({
+        key: newKey,
+        label: `New Conversation ${this.conversationsItems.length}`,
+      });
+      this.activeKey = newKey;
+    },
+
+    onConversationClick(key) {
+      this.activeKey = key;
+      this.messages = [];
+    },
+
+    handleFileChange(info) {
+      this.attachedFiles = info.fileList;
+    },
+
+    setHeaderOpen(value) {
+      this.headerOpen = value;
+    },
+
+    async sendRequest(messageData) {
+      const id = Date.now();
+
+      // 构建消息内容
+      let messageContent = messageData.text || "";
+      if (messageData.files.length > 0) {
+        const fileNames = messageData.files.map((f) => f.name).join(", ");
+        messageContent += messageContent
+          ? `\nFiles: ${fileNames}`
+          : `Files: ${fileNames}`;
+      }
+
+      // 添加用户消息
+      this.messages.push({
+        id,
+        message: messageContent,
+        status: "local",
+      });
+
+      try {
+        this.isTyping = true;
+        const response = `Mock success return. You said: ${messageContent}`;
+
+        // 逐字显示响应
+        let displayedResponse = "";
+        for (let i = 0; i < response.length; i += this.typingConfig.step) {
+          displayedResponse = response.slice(0, i + this.typingConfig.step);
+          this.messages.push({
+            id: id + 1,
+            message: displayedResponse,
+            status: "ai",
+          });
+          await new Promise((resolve) =>
+            setTimeout(resolve, this.typingConfig.interval)
+          );
+        }
+      } finally {
+        this.isTyping = false;
+        this.isRequesting = false;
+      }
+    },
+
+    toggleAttachments() {
+      this.showAttachments = !this.showAttachments;
+    },
+
+    removeFile(file) {
+      this.attachedFiles = this.attachedFiles.filter((f) => f !== file);
+    },
+
+    triggerFileInput() {
+      this.$refs.fileInput.click();
+    },
+
+    handleFileUpload(event) {
+      const files = Array.from(event.target.files);
+      this.attachedFiles = [...this.attachedFiles, ...files];
+      event.target.value = ""; // 重置input以允许重复上传相同文件
+    },
+
+    handlePromptClick(prompt) {
+      this.sendRequest(prompt.description);
+    },
+
+    handleSend() {
+      if (!this.content && this.attachedFiles.length === 0) return;
+
+      // 创建要发送的消息对象
+      const messageData = {
+        text: this.content,
+        files: this.attachedFiles,
+      };
+
+      // 发送消息
+      this.sendRequest(messageData);
+
+      // 清空输入和附件
+      this.content = "";
+      this.attachedFiles = [];
+      this.showAttachments = false;
+    },
+
+    handleFileDrop(event) {
+      const files = Array.from(event.dataTransfer.files);
+      this.attachedFiles = [...this.attachedFiles, ...files];
+    },
+
+    formatFileSize(bytes) {
+      if (bytes === 0) return "0 B";
+      const k = 1024;
+      const sizes = ["B", "KB", "MB", "GB"];
+      const i = Math.floor(Math.log(bytes) / Math.log(k));
+      return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
+    },
+
+    getFileIcon(file) {
+      // 获取文件扩展名
+      const ext = file.name.split(".").pop().toLowerCase();
+
+      // 判断是否为图片
+      const imageTypes = ["jpg", "jpeg", "png", "gif", "webp"];
+      if (imageTypes.includes(ext)) {
+        // 如果是图片,返回文件预览
+        return URL.createObjectURL(file);
+      }
+
+      // 其他文件类型返回默认文档图标
+      return "./svg/word.svg"; // 确保有这个默认文档图标
+    },
+    getFileType(file) {
+      const ext = file.name.split(".").pop().toLowerCase();
+      // 判断是否为图片
+      const imageTypes = ["jpg", "jpeg", "png", "gif", "webp"];
+      if (imageTypes.includes(ext)) {
+        // 如果是图片,返回文件预览
+        return true;
+      }
+      return false;
+    },
+   // 更新发送消息的方法
+   async sendMessage() {
+      if (!this.inputContent.trim()) return;
+
+      const currentConversation = this.conversations.find(
+        c => c.id === this.currentConversationId
+      );
+
+      if (!currentConversation) return;
+
+      const newMessage = {
+        id: Date.now(),
+        role: 'user',
+        content: this.inputContent
+      };
+
+      // 添加消息到当前会话
+      currentConversation.messages.push(newMessage);
+      this.messages = currentConversation.messages;
+
+      this.isLoading = true;
+
+      try {
+        // 模拟API请求
+        const response = await this.mockApiRequest(this.inputContent);
+
+        // 添加AI回复到当前会话
+        const aiMessage = {
+          id: Date.now() + 1,
+          role: 'assistant',
+          content: response
+        };
+        currentConversation.messages.push(aiMessage);
+        this.messages = currentConversation.messages;
+      } catch (error) {
+        console.error("Error:", error);
+      } finally {
+        this.isLoading = false;
+        this.inputContent = '';
+      }
+    },
+    handlePromptClick(prompt) {
+      this.inputContent = prompt.description;
+      this.sendMessage();
+    },
+
+    async mockApiRequest(message) {
+      // 模拟API延迟
+      await new Promise((resolve) => setTimeout(resolve, 1000));
+      return `This is a response to: ${message}`;
+    },
+
+    shareAction() {
+      // 实现分享功能
+      console.log("Share clicked");
+    },
+
+    moreAction() {
+      // 实现更多功能
+      console.log("More clicked");
+    },
+
+    toggleRightMenu() {
+      this.isRightMenuCollapsed = !this.isRightMenuCollapsed;
+    },
+
+    /* 添加消息 */
+    // 添加新会话
+    addNewConversation() {
+      this.conversationCounter++;
+      const newConversation = {
+        id: Date.now(),
+        title: `New Conversation ${this.conversationCounter}`,
+        messages: [],
+      };
+      this.conversations.push(newConversation);
+      this.switchConversation(newConversation.id);
+    },
+
+    // 切换会话
+    switchConversation(conversationId) {
+      this.currentConversationId = conversationId;
+      // 更新当前显示的消息列表
+      const conversation = this.conversations.find(
+        (c) => c.id === conversationId
+      );
+      this.messages = conversation ? conversation.messages : [];
+    },
+  },
+
+  watch: {
+    activeKey(newKey) {
+      if (newKey !== undefined) {
+        this.messages = [];
+      }
+    },
+  },
+};
+</script>
+
+<style scoped>
+.layout {
+  display: flex;
+  width: 100%;
+  height: 100vh;
+}
+
+.menu {
+  background: #f7f7f8;
+  width: 260px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  border-right: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+.conversations {
+  padding: 0 12px;
+  flex: 1;
+  overflow-y: auto;
+}
+
+.chat {
+  flex: 1;
+  padding: 24px;
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+  overflow-y: auto;
+}
+
+.messages {
+  flex: 1;
+  overflow-y: auto;
+  padding-right: 16px;
+}
+
+.sender {
+  box-shadow: none;
+  border: 1px solid #e5e6eb;
+  border-radius: 8px;
+  padding: 8px;
+}
+
+.logo {
+  height: 64px;
+  display: flex;
+  align-items: center;
+  padding: 0 20px;
+}
+
+.logo-img {
+  width: 24px;
+  height: 24px;
+}
+
+.logo span {
+  margin-left: 12px;
+  font-size: 16px;
+  font-weight: 600;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.new-conversation-btn {
+  margin: 0 12px 12px;
+  height: 40px;
+  background: rgba(235, 245, 255, 0.7);
+  border: none;
+  border-radius: 8px;
+  color: #1677ff;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.new-conversation-btn:hover {
+  background: rgba(235, 245, 255, 0.9);
+}
+
+.conversation-list {
+  flex: 1;
+  padding: 0 8px;
+  overflow-y: auto;
+}
+
+.conversation-item {
+  padding: 12px;
+  margin: 4px 0;
+  border-radius: 8px;
+  color: rgba(0, 0, 0, 0.88);
+  font-size: 14px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+
+.conversation-item:hover {
+  background: rgba(0, 0, 0, 0.04);
+}
+
+.conversation-item.active {
+  background: #fff;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
+}
+
+/* 滚动条样式 */
+.conversation-list::-webkit-scrollbar {
+  width: 4px;
+}
+
+.conversation-list::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.15);
+  border-radius: 2px;
+}
+
+.conversation-list::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+:deep(.welcome-message) {
+  background: #fff;
+  border-radius: 8px;
+  padding: 16px;
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+}
+
+:deep(.welcome-message .title) {
+  font-size: 16px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.88);
+  margin-bottom: 4px;
+}
+
+:deep(.welcome-message .description) {
+  color: rgba(0, 0, 0, 0.45);
+  font-size: 14px;
+}
+
+:deep(.prompt-card) {
+  background: #f7f8fa;
+  border-radius: 8px;
+  padding: 16px;
+  margin-bottom: 12px;
+}
+
+:deep(.prompt-card-title) {
+  font-size: 16px;
+  font-weight: 500;
+  margin-bottom: 8px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+:deep(.prompt-option) {
+  background: #f5f5f5;
+  padding: 8px 12px;
+  border-radius: 4px;
+  margin-top: 8px;
+  cursor: pointer;
+  transition: background 0.3s;
+}
+
+:deep(.prompt-option:hover) {
+  background: #e8e8e8;
+}
+
+.input-container {
+  width: 50%;
+  margin: auto auto 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+/* 标签栏样式 */
+.tabs-wrapper {
+  display: flex;
+  gap: 8px;
+  margin-bottom: 4px;
+}
+
+.tab-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 12px;
+  border-radius: 4px;
+  cursor: pointer;
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.88);
+  background: transparent;
+  transition: background-color 0.2s;
+}
+
+.tab-item:hover {
+  background: rgba(0, 0, 0, 0.04);
+}
+
+.tab-item.active {
+  background: #f5f5f5;
+}
+
+.tab-item .anticon {
+  font-size: 14px;
+}
+
+.input-wrapper {
+  display: flex;
+  align-items: center;
+  padding: 8px 12px;
+  border: 1px solid #e5e6eb;
+  border-radius: 8px;
+  background: white;
+}
+
+.message-input {
+  flex: 1;
+  border: none;
+  outline: none;
+  padding: 8px;
+  font-size: 14px;
+  background: transparent;
+}
+
+.message-input::placeholder {
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.attachment-btn,
+.send-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  color: rgba(0, 0, 0, 0.45);
+  border-radius: 4px;
+}
+
+.attachment-btn:hover,
+.send-btn:hover {
+  background: rgba(0, 0, 0, 0.04);
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.attachments-panel {
+  /* position: absolute;
+  bottom: calc(100% + 8px);
+  left: 0;
+  right: 0; */
+  background: white;
+  border-radius: 12px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
+  overflow: hidden;
+}
+
+.panel-content {
+  background: white;
+}
+
+.attachments-header {
+  padding: 12px 16px;
+  border-bottom: 1px solid #f0f0f0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.attachments-header span {
+  font-size: 14px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.close-btn {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.upload-area {
+  padding: 24px;
+  /*  border: 2px dashed #d9d9d9; */
+  border-radius: 8px;
+  text-align: center;
+  cursor: pointer;
+  transition: all 0.3s;
+  /*   background: #fafafa; */
+}
+
+/* .upload-area:hover {
+  border-color: #1677ff;
+  background: #f0f7ff;
+} */
+
+.upload-area.has-files {
+  padding: 12px;
+  background: #fff;
+}
+
+.upload-icon {
+  width: 32px;
+  height: 32px;
+  margin-bottom: 8px;
+}
+
+.upload-text {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.88);
+  margin-bottom: 4px;
+}
+
+.upload-hint {
+  font-size: 12px;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.file-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  padding: 10px;
+}
+
+.file-item {
+  position: relative;
+  width: 260px;
+  padding: 8px 12px;
+  margin: 4px 0;
+  background: #f5f5f5;
+  border-radius: 8px;
+}
+
+.file-item.is-image {
+  width: 68px;
+  padding: 0;
+  margin: 4px 0;
+}
+
+.file-wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+.file-icon {
+  width: 68px;
+  height: 68px;
+  object-fit: cover;
+  border-radius: 4px;
+}
+
+.remove-btn {
+  position: absolute;
+  top: -8px;
+  right: -8px;
+  width: 16px;
+  height: 16px;
+  padding: 0;
+  border: none;
+  background: #545454;
+  border-radius: 50%;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 14px;
+  line-height: 1;
+  color: #fff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.remove-btn:hover {
+  opacity: 0.8;
+}
+
+.file-info {
+  margin-top: 8px;
+}
+
+.file-name {
+  display: block;
+  color: rgba(0, 0, 0, 0.88);
+  font-size: 14px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.file-size {
+  display: block;
+  color: rgba(0, 0, 0, 0.45);
+  font-size: 12px;
+  margin-top: 4px;
+}
+
+.add-more-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 68px;
+  height: 68px;
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  background: transparent;
+  cursor: pointer;
+  transition: all 0.3s;
+  margin: 4px 0;
+}
+
+.add-more-btn:hover {
+  border-color: #1677ff;
+  background: #f0f7ff;
+}
+
+/* 欢迎区域样式 */
+.welcome-section {
+  max-width: 800px;
+  margin: 0 auto;
+  width: 50%;
+}
+
+.welcome-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 24px;
+}
+
+.avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+}
+
+.welcome-info {
+  flex: 1;
+}
+
+.welcome-info h2 {
+  font-size: 20px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.88);
+  margin: 0 0 4px 0;
+}
+
+.welcome-info p {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.45);
+  margin: 0;
+}
+
+.action-buttons {
+  display: flex;
+  gap: 8px;
+}
+
+.icon-btn {
+  padding: 8px;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+/* 建议区域样式 */
+.suggestion-section {
+  margin-top: 32px;
+}
+
+.suggestion-section h3 {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.45);
+  margin-bottom: 16px;
+}
+
+.cards-container {
+  display: flex;
+  gap: 16px;
+}
+
+.suggestion-card {
+  flex: 1;
+  border-radius: 8px;
+  padding: 16px;
+  background: #ffffff; /* 替换 var(--ant-color-bg-container) */
+  border-radius: 8px; /* 替换 var(--ant-border-radius-lg) */
+  transition: border 0.3s, background 0.3s; /* 替换 var(--ant-motion-duration-slow) */
+  border: 1px solid #f0f0f0; /* 替换组合的 border 属性 */
+}
+:root {
+  --ant-color-bg-container: #ffffff;
+  --ant-border-radius-lg: 8px;
+  --ant-motion-duration-slow: 0.3s;
+  --ant-line-width: 1px;
+  --ant-line-type: solid;
+  --ant-color-border-secondary: #f0f0f0;
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 8px;
+}
+
+.card-header h4 {
+  font-size: 16px;
+  font-weight: 500;
+  color: rgba(0, 0, 0, 0.88);
+  margin: 0;
+}
+
+.icon.red {
+  color: #ff4d4f;
+}
+
+.icon.blue {
+  color: #1890ff;
+}
+
+.card-subtitle {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.45);
+  margin-bottom: 16px;
+}
+
+.suggestion-items {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.suggestion-item {
+  padding: 8px 12px;
+  background: #f5f5f5;
+  border-radius: 4px;
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.88);
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+}
+
+.suggestion-item:hover {
+  background: #e8e8e8;
+}
+.tab-icon {
+  width: 16px;
+}
+
+.attached-files {
+  padding: 16px;
+}
+
+.file-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px;
+  border-radius: 4px;
+}
+
+.file-item:hover {
+  background: #f5f5f5;
+}
+
+.remove-btn {
+  margin-left: auto;
+  padding: 4px;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.remove-btn:hover {
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.send-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.upload-area {
+  /*   border: 2px dashed #d9d9d9; */
+  border-radius: 8px;
+  padding: 20px;
+  text-align: center;
+  cursor: pointer;
+  transition: border-color 0.3s;
+}
+
+/* .upload-area:hover,
+.upload-area.drag-over {
+  border-color: #1677ff;
+} */
+
+.file-item {
+  display: flex;
+  align-items: center;
+  width: 236px;
+  height: 68px;
+  padding: 8px 12px;
+  margin: 4px 0;
+  background: #f5f5f5;
+  border-radius: 4px;
+}
+
+.file-item .remove-btn {
+  margin-left: auto;
+  padding: 4px 8px;
+  background: transparent;
+  border: none;
+  cursor: pointer;
+}
+
+/* 聊天内容显示框 */
+.message-list {
+  width: 50%;
+  overflow-y: auto;
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  margin: 0 auto;
+}
+
+.message-item {
+  display: flex;
+  margin-bottom: 12px;
+}
+
+/* 用户消息靠右显示 */
+.user {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.message-bubble {
+  max-width: 80%;
+  padding: 12px 16px;
+  border-radius: 12px;
+  background: #fff;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+}
+
+/* 用户消息的气泡样式 */
+.user .message-bubble {
+  background: #1677ff;
+  color: white;
+}
+
+/* AI消息的气泡样式 */
+.assistant .message-bubble {
+  background: #f7f7f8;
+  color: rgba(0, 0, 0, 0.88);
+}
+
+.message-content {
+  font-size: 14px;
+  line-height: 1.5;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.right_menu {
+  width: 300px;
+  height: 100%;
+  background: #f7f7f8;
+  border-left: 1px solid rgba(0, 0, 0, 0.06);
+  position: relative;
+  transition: width 0.3s ease;
+}
+
+.right_menu.collapsed {
+  width: 0px;
+}
+
+.collapse-button {
+  position: absolute;
+  left: -20px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 20px;
+  height: 40px;
+  background: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.06);
+  border-right: none;
+  border-radius: 4px 0 0 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 1;
+}
+
+.collapse-button:hover {
+  background: #f5f5f5;
+}
+
+.collapse-icon {
+  width: 12px;
+  height: 12px;
+}
+
+.right-menu-content {
+  padding: 20px;
+  overflow: hidden;
+}
+
+.right_menu.collapsed .right-menu-content {
+  display: none;
+}
+</style>

+ 83 - 0
src/components/Independent/styles.js

@@ -0,0 +1,83 @@
+export const createStyles = () => {
+    const token = {
+      colorBgContainer: '#fff',
+      colorBgLayout: '#f5f5f5',
+      colorText: 'rgba(0, 0, 0, 0.88)',
+      borderRadius: 8,
+      boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
+      paddingLG: 24,
+      fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial'
+    }
+  
+    return {
+      layout: `
+        width: 100%;
+        min-width: 1000px;
+        height: 722px;
+        border-radius: ${token.borderRadius}px;
+        display: flex;
+        background: ${token.colorBgContainer};
+        font-family: AlibabaPuHuiTi, ${token.fontFamily}, sans-serif;
+      `,
+      menu: `
+        background: ${token.colorBgLayout}80;
+        width: 280px;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+      `,
+      conversations: `
+        padding: 0 12px;
+        flex: 1;
+        overflow-y: auto;
+      `,
+      chat: `
+        height: 100%;
+        width: 100%;
+        max-width: 700px;
+        margin: 0 auto;
+        box-sizing: border-box;
+        display: flex;
+        flex-direction: column;
+        padding: ${token.paddingLG}px;
+        gap: 16px;
+      `,
+      messages: `
+        flex: 1;
+      `,
+      placeholder: `
+        padding-top: 32px;
+      `,
+      sender: `
+        box-shadow: ${token.boxShadow};
+      `,
+      logo: `
+        display: flex;
+        height: 72px;
+        align-items: center;
+        justify-content: start;
+        padding: 0 24px;
+        box-sizing: border-box;
+  
+        img {
+          width: 24px;
+          height: 24px;
+          display: inline-block;
+        }
+  
+        span {
+          display: inline-block;
+          margin: 0 8px;
+          font-weight: bold;
+          color: ${token.colorText};
+          font-size: 16px;
+        }
+      `,
+      addBtn: `
+        background: #1677ff0f;
+        border: 1px solid #1677ff34;
+        width: calc(100% - 24px);
+        margin: 0 12px 24px 12px;
+      `
+    }
+  }

+ 1 - 0
src/components/Independent/svg/attachment.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280632344" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7700" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M924.672 126.976q36.864 36.864 54.784 82.432t17.92 93.696-17.92 93.696-54.784 82.432l-392.192 389.12q-36.864 36.864-90.624 61.44t-113.664 28.672-122.368-16.384-115.712-73.728q-52.224-52.224-72.704-113.152t-16.384-121.344 28.16-113.664 60.928-90.112l348.16-345.088q9.216-9.216 27.136-4.608t27.136 13.824q8.192 9.216 13.312 27.136t-4.096 27.136l-347.136 344.064q-27.648 27.648-46.08 64.512t-21.504 78.848 12.288 84.992 55.296 82.944q35.84 35.84 79.36 50.688t86.528 12.288 81.92-18.944 66.56-44.032l391.168-388.096q27.648-27.648 39.424-57.344t11.264-58.88-13.824-56.832-36.864-51.2q-44.032-43.008-98.816-40.448t-110.08 57.856l-353.28 351.232q-23.552 23.552-23.04 52.224t18.944 47.104q22.528 22.528 51.712 18.432t47.616-22.528l320.512-318.464q9.216-9.216 27.136-4.608t27.136 13.824 14.336 27.136-4.096 27.136l-321.536 318.464q-36.864 36.864-70.656 51.2t-63.488 12.8-55.296-15.872-47.104-34.816q-17.408-16.384-31.232-41.984t-15.872-56.32 10.752-65.536 49.664-70.656q18.432-18.432 32.768-33.792 12.288-13.312 23.04-23.552t11.776-11.264l285.696-284.672q36.864-36.864 80.384-57.856t88.576-24.064 88.576 12.288 80.384 52.224z" p-id="7701" fill="#1e1e1e"></path></svg>

+ 1 - 0
src/components/Independent/svg/close.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735287774232" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1465" width="16" height="16" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M563.8 512l262.5-312.9c4.4-5.2 0.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9c-4.4 5.2-0.7 13.1 6.1 13.1h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" p-id="1466"></path></svg>

+ 1 - 0
src/components/Independent/svg/hot-for-ux.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280492544" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4326" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M442.514286 73.142857c82.529524 64.24381 140.239238 126.610286 173.129143 187.099429 31.158857 57.295238 43.666286 115.907048 37.546666 175.835428l-1.219047 9.996191 6.095238-4.973715a174.055619 174.055619 0 0 0 49.249524-69.607619l2.681904-7.411809 7.704381-23.04c82.285714 55.734857 123.440762 150.064762 123.440762 283.062857C841.142857 823.515429 665.795048 950.857143 521.654857 950.857143c-144.11581 0-308.224-85.333333-334.750476-263.875048-26.550857-178.541714 83.480381-261.90019 158.427429-378.197333C395.288381 231.253333 427.690667 152.697905 442.514286 73.142857z m33.718857 154.575238c-17.554286 41.447619-39.424 82.407619-65.536 122.904381l-8.313905 12.653714c-8.411429 12.507429-17.310476 24.941714-28.818286 40.374858l-40.96 54.467047c-63.634286 86.869333-80.944762 136.021333-68.851809 217.526857 17.92 120.441905 128.341333 197.778286 257.901714 197.778286 120.905143 0 241.785905-110.933333 241.785905-249.344 0-61.976381-9.825524-111.323429-29.110857-149.699048-8.240762 9.411048-17.237333 18.285714-26.965334 26.59962l-159.085714 130.023619 26.697143-195.364572c6.41219-46.811429-2.462476-92.208762-27.648-138.483809-13.214476-24.30781-31.98781-49.737143-56.368762-76.166096l-8.338286-8.850285-6.387809 15.579428z" p-id="4327" fill="#ff4d4f"></path></svg>

+ 1 - 0
src/components/Independent/svg/left.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735295375625" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3239" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M659.748571 245.272381l-51.687619-51.687619-318.439619 318.585905 318.415238 318.268952 51.712-51.736381-266.703238-266.556952z" p-id="3240"></path></svg>

+ 1 - 0
src/components/Independent/svg/plus.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280866862" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="17804" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M474 152m8 0l60 0q8 0 8 8l0 704q0 8-8 8l-60 0q-8 0-8-8l0-704q0-8 8-8Z" fill="#81bdfe" p-id="17805"></path><path d="M168 474m8 0l672 0q8 0 8 8l0 60q0 8-8 8l-672 0q-8 0-8-8l0-60q0-8 8-8Z" fill="#81bdfe" p-id="17806"></path></svg>

+ 1 - 0
src/components/Independent/svg/read.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735281808867" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1528" width="16" height="16" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M928 161H699.2c-49.1 0-97.1 14.1-138.4 40.7L512 233l-48.8-31.3C422 175.1 373.9 161 324.8 161H96c-17.7 0-32 14.3-32 32v568c0 17.7 14.3 32 32 32h228.8c49.1 0 97.1 14.1 138.4 40.7l44.4 28.6c1.3 0.8 2.8 1.3 4.3 1.3s3-0.4 4.3-1.3l44.4-28.6C602 807.1 650.1 793 699.2 793H928c17.7 0 32-14.3 32-32V193c0-17.7-14.3-32-32-32zM324.8 721H136V233h188.8c35.4 0 69.8 10.1 99.5 29.2l48.8 31.3 6.9 4.5v462c-47.6-25.6-100.8-39-155.2-39z m563.2 0H699.2c-54.4 0-107.6 13.4-155.2 39V298l6.9-4.5 48.8-31.3c29.7-19.1 64.1-29.2 99.5-29.2H888v488z" p-id="1529" fill="#1890ff"></path><path d="M396.9 361H211.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5zM620 368.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0-4.1-3.2-7.5-7.1-7.5H627.1c-3.9 0-7.1 3.4-7.1 7.5zM396.9 501H211.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5zM812.9 501H627.1c-3.9 0-7.1 3.4-7.1 7.5v45c0 4.1 3.2 7.5 7.1 7.5h185.7c3.9 0 7.1-3.4 7.1-7.5v-45c0.1-4.1-3.1-7.5-7-7.5z" p-id="1530" fill="#1890ff"></path></svg>

+ 1 - 0
src/components/Independent/svg/right.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735295357873" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2254" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M605.086476 512.146286L338.358857 245.272381l51.760762-51.687619 318.415238 318.585905L390.095238 830.415238l-51.687619-51.736381z" p-id="2255"></path></svg>

+ 1 - 0
src/components/Independent/svg/up.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735280808939" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15804" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M873.8816 150.1184C973.9264 250.2656 1024 370.8928 1024 512c0 141.2096-50.0736 261.8368-150.1184 361.8816C773.7344 973.9264 653.1072 1024 512 1024c-141.1072 0-261.7344-50.0736-361.8816-150.1184C50.0736 773.8368 0 653.2096 0 512c0-141.1072 50.0736-261.7344 150.1184-361.8816C250.2656 50.0736 370.8928 0 512 0 653.1072 0 773.7344 50.0736 873.8816 150.1184zM819.712 526.7456 507.0848 211.6608 192 526.7456l56.6272 54.1696 219.0336-219.0336 0 477.4912 78.7456 0L546.4064 361.8816l219.0336 219.0336L819.712 526.7456z" p-id="15805" fill="#4096ff"></path></svg>

ファイルの差分が大きいため隠しています
+ 0 - 0
src/components/Independent/svg/upload.svg


+ 1 - 0
src/components/Independent/svg/word.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735287324782" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1522" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M616.746667 85.333333L896 347.904V853.333333a85.333333 85.333333 0 0 1-85.333333 85.333334H213.333333a85.333333 85.333333 0 0 1-85.333333-85.333334V170.666667a85.333333 85.333333 0 0 1 85.333333-85.333334h403.413334z m244.352 295.381334L581.802667 118.186667v177.237333a85.333333 85.333333 0 0 0 85.333333 85.333333h193.962667z m-107.264 76.373333h-49.152l-79.488 227.157333-109.354667-227.114666h-13.226667l-110.506666 226.688-77.824-226.688H265.130667l113.749333 328.192h13.226667l117.12-239.36 114.858666 239.36h13.781334l115.968-328.192z" fill="#5197e8" p-id="1523"></path></svg>

+ 3 - 0
src/main.js

@@ -29,7 +29,10 @@ Vue.use( CKEditor );
 import Vant from 'vant'
 import 'vant/lib/index.css'
 Vue.use(Vant)
+import Antd from 'ant-design-vue'
+import 'ant-design-vue/dist/antd.css'
 
+Vue.use(Antd)
 
 /**
  * If you don't want to use mock-server

+ 7 - 0
src/router/index.js

@@ -126,6 +126,13 @@ export const constantRoutes = [
     hidden:true,
     meta: { title: 'ai',  noCache: true }
   },
+  {
+    path: '/AiD',
+    component: () => import('@/views/login/AI_demo.vue'),
+    name: 'ai',
+    hidden:true,
+    meta: { title: 'ai',  noCache: true }
+  },
   {
     path: '/preview',
     component: () => import('@/views/login/Preview.vue'),

+ 38 - 0
src/views/login/AI_demo.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <Independent />
+  </div>
+</template>
+
+<script>
+import Independent from "@/components/Independent/index.vue";
+export default {
+  /*组件参数 接收来自父组件的数据*/
+  props: {},
+  /*局部注册的组件*/
+  components: {
+    Independent,
+  },
+  /*组件状态值*/
+  data() {
+    return {};
+  },
+
+  /*计算属性*/
+  computed: {},
+
+  /*侦听器*/
+  watch: {},
+
+  /*
+   * el 被新创建的 vm.$ el 替换,并挂载到实例上去之后调用该钩子。
+   * 如果 root 实例挂载了一个文档内元素,当 mounted 被调用时 vm.$ el 也在文档内。
+   */
+  mounted() {},
+
+  /*组件方法*/
+  methods: {},
+};
+</script>
+<style lang='css' scoped>
+</style>

この差分においてかなりの量のファイルが変更されているため、一部のファイルを表示していません