feat: version 2.9.1 (#207)

* feat: i18n

* chore: format

* feat: 补充遗漏翻译

* chore: update deps

* feat: 复制代码块[#196][#197]

* chore: version 2.9.1

src/views/chat/components/Message/Text.vue

@@ -4,6 +4,7 @@ import { marked } from 'marked'
 import hljs from 'highlight.js'
 import { useBasicLayout } from '@/hooks/useBasicLayout'
 import { encodeHTML } from '@/utils/format'
+import { t } from '@/locales'
 
 interface Props {
   inversion?: boolean
@@ -26,8 +27,10 @@ renderer.html = (html) => {
 
 renderer.code = (code, language) => {
   const validLang = !!(language && hljs.getLanguage(language))
-  if (validLang)
-    return `<pre><code class="hljs ${language}">${hljs.highlight(language, code).value}</code></pre>`
+  if (validLang) {
+    const lang = language ?? ''
+    return `<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang">${lang}</span><span class="code-block-header__copy">${t('chat.copyCode')}</span></div><code class="hljs code-block-body ${language}">${hljs.highlight(lang, code).value}</code></pre>`
+  }
   return `<pre style="background: none">${hljs.highlightAuto(code).value}</pre>`
 }
 

src/views/chat/components/Message/index.vue

@@ -1,11 +1,12 @@
 <script setup lang='ts'>
 import { ref } from 'vue'
-import { NDropdown, useMessage } from 'naive-ui'
+import { NDropdown } from 'naive-ui'
 import AvatarComponent from './Avatar.vue'
 import TextComponent from './Text.vue'
 import { SvgIcon } from '@/components/common'
 import { copyText } from '@/utils/format'
 import { useIconRender } from '@/hooks/useIconRender'
+import { t } from '@/locales'
 
 interface Props {
   dateTime?: string
@@ -24,25 +25,18 @@ const props = defineProps<Props>()
 
 const emit = defineEmits<Emit>()
 
-const ms = useMessage()
-
 const { iconRender } = useIconRender()
 
 const textRef = ref<HTMLElement>()
 
 const options = [
   {
-    label: 'Copy Raw',
-    key: 'copyRaw',
+    label: t('chat.copy'),
+    key: 'copyText',
     icon: iconRender({ icon: 'ri:file-copy-2-line' }),
   },
   {
-    label: 'Copy Text',
-    key: 'copyText',
-    icon: iconRender({ icon: 'ri:file-copy-line' }),
-  },
-  {
-    label: 'Delete',
+    label: t('common.delete'),
     key: 'delete',
     icon: iconRender({ icon: 'ri:delete-bin-line' }),
   },
@@ -50,15 +44,8 @@ const options = [
 
 function handleSelect(key: 'copyRaw' | 'copyText' | 'delete') {
   switch (key) {
-    case 'copyRaw':
-      if (textRef.value && (textRef.value as any).textRef) {
-        copyText({ text: (textRef.value as any).textRef.innerText })
-        ms.success('Copied Raw')
-      }
-      return
     case 'copyText':
-      copyText({ text: props.text ?? '', origin: false })
-      ms.success('Copied Text')
+      copyText({ text: props.text ?? '' })
       return
     case 'delete':
       emit('delete')

src/views/chat/components/Message/style.less

@@ -24,9 +24,37 @@
 		background-color: #fff;
 	}
 
-	code.hljs{
+	code.hljs {
 		padding: 0;
 	}
+
+	.code-block {
+		&-wrapper {
+			position: relative;
+			padding-top: 24px;
+		}
+
+		&-header {
+			position: absolute;
+			top: 5px;
+			right: 0;
+			width: 100%;
+			padding: 0 1rem;
+			display: flex;
+			justify-content: flex-end;
+			align-items: center;
+			color: #b3b3b3;
+
+			&__copy{
+				cursor: pointer;
+				margin-left: 0.5rem;
+				user-select: none;
+				&:hover {
+					color: #65a665;
+				}
+			}
+		}
+	}
 }
 
 html.dark {