Merge pull request 'yink' (#22) from yink into main

Reviewed-on: https://gitea-inner.fontree.cn/scout666/chat-pc/pulls/22

package.json

@@ -20,6 +20,7 @@
     "@iconify-json/ion": "^1.2.3",
     "@kangc/v-md-editor": "^2.3.18",
     "@onlyoffice/document-editor-vue": "^1.5.0",
+    "@soerenmartius/vue3-clipboard": "^0.1.2",
     "@tiptap/core": "^2.23.1",
     "@tiptap/extension-blockquote": "^2.23.1",
     "@tiptap/extension-emoji": "^2.23.1",

pnpm-lock.yaml

@@ -26,6 +26,9 @@ importers:
       '@onlyoffice/document-editor-vue':
         specifier: ^1.5.0
         version: 1.5.0(vue@3.5.17(typescript@5.2.2))
+      '@soerenmartius/vue3-clipboard':
+        specifier: ^0.1.2
+        version: 0.1.2
       '@tiptap/core':
         specifier: ^2.23.1
         version: 2.23.1(@tiptap/pm@2.23.1)
@@ -898,6 +901,9 @@ packages:
     resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==}
     engines: {node: '>=18'}
 
+  '@soerenmartius/vue3-clipboard@0.1.2':
+    resolution: {integrity: sha512-a5er6cFGcFIQ/3qg6kWvU0yFqIz9iWoQGEVs9azjevyRyMAKvj1w3JuLH9y6+u0WhMNby3kn7nuR8nktSnDesg==}
+
   '@tiptap/core@2.23.1':
     resolution: {integrity: sha512-EURGKGsEPrwxvOPi9gA+BsczvsECJNV+xgTAGWHmEtU4YJ0AulYrCX3b7FK+aiduVhThIHDoG/Mmvmb/HPLRhQ==}
     peerDependencies:
@@ -1613,6 +1619,9 @@ packages:
     resolution: {integrity: sha512-qOhPa/Fj7s6TY8H8esGu5QNpMMQxz79h+urzrNYN6mn+9BnxlDGf5QZ+XeCDsxSjPqsSR56XOZOJmpeurnLMeg==}
     engines: {node: '>=0.10.0'}
 
+  clipboard@2.0.11:
+    resolution: {integrity: sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==}
+
   cliui@8.0.1:
     resolution: {integrity: sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==}
     engines: {node: '>=12'}
@@ -2347,6 +2356,9 @@ packages:
     resolution: {integrity: sha512-ollPHROa5mcxDEkwg6bPt3QbEf4pDQSNtd6JPL1YvOvAo/7/0VAm9TccUeoTmarjPw4pfUthSCqcyfNB1I3ZSg==}
     engines: {node: '>=6'}
 
+  good-listener@1.2.2:
+    resolution: {integrity: sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==}
+
   gopd@1.2.0:
     resolution: {integrity: sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==}
     engines: {node: '>= 0.4'}
@@ -3358,6 +3370,9 @@ packages:
   seemly@0.3.10:
     resolution: {integrity: sha512-2+SMxtG1PcsL0uyhkumlOU6Qo9TAQ/WyH7tthnPIOQB05/12jz9naq6GZ6iZ6ApVsO3rr2gsnTf3++OV63kE1Q==}
 
+  select@1.1.2:
+    resolution: {integrity: sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA==}
+
   semver@5.7.2:
     resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==}
     hasBin: true
@@ -3543,6 +3558,9 @@ packages:
     resolution: {integrity: sha512-B71/4oyj61iNH0KeCamLuE2rmKuTO5byTOSVwECM5FA7TiAiAW+UqTKZ9ERueC4qvgSttUhdmq1mXC3kJqGX7A==}
     engines: {node: '>=12.22'}
 
+  tiny-emitter@2.1.0:
+    resolution: {integrity: sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==}
+
   tinyexec@1.0.1:
     resolution: {integrity: sha512-5uC6DDlmeqiOwCPmK9jMSdOuZTh8bU39Ys6yidB+UTt5hfZUPGAypSgFRiEp+jbi9qH40BLDvy85jIU88wKSqw==}
 
@@ -4559,6 +4577,10 @@ snapshots:
 
   '@sindresorhus/merge-streams@4.0.0': {}
 
+  '@soerenmartius/vue3-clipboard@0.1.2':
+    dependencies:
+      clipboard: 2.0.11
+
   '@tiptap/core@2.23.1(@tiptap/pm@2.23.1)':
     dependencies:
       '@tiptap/pm': 2.23.1
@@ -5518,6 +5540,12 @@ snapshots:
       isobject: 3.0.1
       static-extend: 0.1.2
 
+  clipboard@2.0.11:
+    dependencies:
+      good-listener: 1.2.2
+      select: 1.1.2
+      tiny-emitter: 2.1.0
+
   cliui@8.0.1:
     dependencies:
       string-width: 4.2.3
@@ -6299,6 +6327,10 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  good-listener@1.2.2:
+    dependencies:
+      delegate: 3.2.0
+
   gopd@1.2.0: {}
 
   graceful-fs@4.2.11: {}
@@ -7430,6 +7462,8 @@ snapshots:
 
   seemly@0.3.10: {}
 
+  select@1.1.2: {}
+
   semver@5.7.2:
     optional: true
 
@@ -7609,6 +7643,8 @@ snapshots:
 
   throttle-debounce@5.0.2: {}
 
+  tiny-emitter@2.1.0: {}
+
   tinyexec@1.0.1: {}
 
   tinyglobby@0.2.14:

src/components/editor/MentionList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="dropdown-menu">
+  <div class="dropdown-menu" ref="dropdownMenuRef">
     <n-virtual-list
       ref="virtualListRef"
       style="max-height: 240px"
@@ -20,7 +20,7 @@
 </template>
 
 <script setup>
-import { ref, watch, defineProps, defineExpose } from 'vue'
+import { ref, watch, defineProps, defineExpose, onMounted, onUnmounted } from 'vue'
 
 const props = defineProps({
   items: {
@@ -35,6 +35,40 @@ const props = defineProps({
 
 const selectedIndex = ref(0)
 const virtualListRef = ref(null)
+const dropdownMenuRef = ref(null)
+
+let observer = null
+
+let isViewport = ref(true)
+const handleIntersection = (entries, observer) => {
+  entries.forEach(entry => {
+    if (entry.isIntersecting) {
+      isViewport.value = true
+      // 在这里处理元素可见的逻辑
+    } else {
+      isViewport.value = false
+      // 在这里处理元素不可见的逻辑
+    }
+  })
+}
+onMounted(() => {
+  observer = new IntersectionObserver(handleIntersection, {
+    root: null, // null 值表示视口
+    rootMargin: '0px',
+    threshold: 0.1 // 元素至少有 10% 可见时触发回调
+  })
+
+  if (dropdownMenuRef.value) {
+    observer.observe(dropdownMenuRef.value)
+  }
+})
+
+onUnmounted(() => {
+  if (observer && dropdownMenuRef.value) {
+    observer.unobserve(dropdownMenuRef.value)
+    observer.disconnect()
+  }
+})
 
 watch(
   () => props.items,
@@ -45,6 +79,7 @@ watch(
 
 const onKeyDown = ({ event }) => {
   console.log('event', event)
+  if(!isViewport.value) return false
   if (event.key === 'ArrowUp') {
     upHandler()
     return true
@@ -100,6 +135,7 @@ defineExpose({
   overflow: auto;
   padding: 0.4rem;
   position: relative;
+  
   max-height: 200px;
   width: 200px;
   button {

src/components/editor/TiptapEditor.vue

@@ -9,7 +9,7 @@ import { computePosition, flip, shift } from '@floating-ui/dom'
 import Link from '@tiptap/extension-link'
 import { Extension, Node } from '@tiptap/core'
 import { Plugin, PluginKey } from '@tiptap/pm/state'
-
+import { IosSend } from '@vicons/ionicons4'
 
 import { reactive, watch, ref, markRaw, computed, onMounted, onUnmounted, shallowRef } from 'vue'
 
@@ -61,6 +61,9 @@ const props = defineProps({
     type: Boolean,
     default: false
   },
+  uid:{
+    type: Number
+  },
   members: {
     default: () => []
   }
@@ -216,6 +219,7 @@ const editor = useEditor({
           return suggestion.items({ 
             query, 
             props: {
+              uid: props.uid,
               members: props.members,
               isGroupManager: (dialogueStore.groupInfo).is_manager
             }
@@ -287,7 +291,8 @@ const editor = useEditor({
       if (text) {
         event.preventDefault()
         const { state, dispatch } = view
-        dispatch(state.tr.insertText(text))
+        // dispatch(state.tr.insertContent(text).replace(/\n/g, '<br>'))
+        editor.value.commands.insertContent(text.replace(/\r/g, '').replace(/\n/g, '<br>'))
         return true // Handled
       }
 
@@ -397,7 +402,11 @@ async function onUploadFile(e) {
 
   if (file.type.indexOf('image/') === 0) {
 
-    let fn = emitCall('image_event', file, () => {})
+    const form = new FormData()
+    form.append('file', file)
+    form.append('source', 'fonchain-chat')
+    const { data } = await uploadImg(form)
+    let fn = emitCall('image_event', { url: data.ori_url, size: file.size }, () => { })
     emit('editor-event', fn)
 
     return
@@ -522,6 +531,8 @@ function tiptapToString() {
         result += node.attrs.alt || ''
       } else if (node.type === 'hardBreak') {
         result += '\n'
+      } else if (node.type === 'image') {
+        result += '[图片]'
       }
     })
   }
@@ -705,7 +716,8 @@ function onSubscribeEdit(data) {
   editor.value.commands.clearContent(true)
   
 
-  editor.value.commands.insertContent(data.content)
+  editor.value.commands.insertContent(data.content.replace(/\n/g, '<br>'))
+
   
 
   editor.value.commands.focus('end')
@@ -784,6 +796,16 @@ useEventBus([
             <p class="tip-title">{{ nav.title }}</p>
           </div>
         </div>
+        <div class="h-[45px] flex justify-center items-center">
+          <n-button class="w-80px h-30px mr-[22px]" type="primary" @click="onSendMessage">
+            <template #icon>
+              <n-icon>
+                <IosSend />
+              </n-icon>
+            </template>
+            发送
+          </n-button>
+        </div>
       </header>
 
       <div v-if="quoteData" class="quote-card-wrapper">
@@ -971,6 +993,7 @@ html[theme-mode='dark'] {
   outline: none;
   .tiptap.ProseMirror{
     height: 100%;
+    white-space: pre-wrap;
   }
   .image-upload-loading {
     position: relative;

src/components/editor/suggestion.js

@@ -39,6 +39,8 @@ export default {
     if (props.isGroupManager) {
       list.unshift({ id: 0, nickname: '所有人', avatar: defAvatar })
     }
+    // 排除掉自己
+    list.splice(list.findIndex((item) => item.id === props.uid), 1)
 
     const filteredItems = list.filter(
       (item) => item.nickname.toLowerCase().includes(query.toLowerCase())

src/components/talk/message/TextMessage.vue

@@ -17,7 +17,7 @@ let textContent = props.extra?.content || ''
 textContent = textReplaceLink(textContent)
 
 if (props.data.talk_type == 2) {
-  textContent = textReplaceMention(textContent, float==='right'?'#462AA0':'#fff',float==='right'?'#EEE9F9':'#462AA0')
+  textContent = textReplaceMention(textContent, float==='right'?'':'black',float==='right'?'':'')
 }
 
 textContent = textReplaceEmoji(textContent)

src/store/modules/dialogue.js

@@ -383,6 +383,9 @@ export const useDialogueStore = defineStore('dialogue', {
         
         // 从全局列表中移除
         this.globalUploadList.splice(taskIndex, 1)
+        // 移除消息记录
+
+        this.batchDelDialogueRecord([uploadId])
       }
     },
     

src/utils/common.js

@@ -1,4 +1,5 @@
 import { createApp } from 'vue'
+import { toClipboard } from '@soerenmartius/vue3-clipboard'
 
 /**
  * 防抖函数
@@ -51,12 +52,12 @@ export function throttle(fn, delay, call = function () {}) {
  * @param {String} text 复制内容
  * @param {Function} callback 复制成功回调方法
  */
-export function clipboard(text, callback) {
+export async function clipboard(text, callback) {
   // 在wujie环境下使用主应用的clipboard
   const clipboardObj = window.__POWERED_BY_WUJIE__
     ? window.parent.navigator.clipboard
     : navigator.clipboard
-
+  try {
     clipboardObj
       .writeText(text)
       .then(() => {
@@ -65,6 +66,11 @@ export function clipboard(text, callback) {
       .catch(() => {
         alert('Oops, unable to copy')
       })
+  } catch (e) {
+    console.error(e)
+    await toClipboard(text)
+    callback && callback()
+  }
 }
 
 export async function clipboardImage(src, callback) {

src/utils/request.js

@@ -48,7 +48,9 @@ request.interceptors.request.use((config) => {
   if (token) {
     config.headers['Authorization'] = `Bearer ${token}`
   }
-
+  if(config.url.indexOf('api/v1/upload/multipart') > -1){ 
+    config.timeout = 600000
+  }
   return config
 }, errorHandler)
 

src/views/message/inner/panel/PanelFooter.vue

@@ -75,7 +75,7 @@ const onSendMessage = (data = {}, callBack: any) => {
 }
 
 // 发送文本消息
-const onSendTextEvent = throttle((value: any) => {
+const onSendTextEvent = (value: any) => {
   let { data, callBack } = value
 
   let message = {
@@ -93,7 +93,7 @@ const onSendTextEvent = throttle((value: any) => {
 
     callBack(true)
   })
-}, 1000)
+}
 
 // 发送图片消息
 const onSendImageEvent = ({ data, callBack }) => {
@@ -297,7 +297,7 @@ onMounted(() => {
     <MultiSelectFooter v-if="dialogueStore.isOpenMultiSelect" />
     <!-- <Editor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" /> -->
     <!-- <CustomEditor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" /> -->
-     <TiptapEditor v-else @editor-event="onEditorEvent" :vote="talk_type == 2" :members="members" />
+     <TiptapEditor v-else @editor-event="onEditorEvent" :uid="uid" :vote="talk_type == 2" :members="members" />
   </footer>
 
   <HistoryRecord