Browse Source

fix:修复聊天记录显示排序问题

master
秋田弘 8 months ago
parent
commit
79187e3db0
  1. 3
      frontend/auto-imports.d.ts
  2. 15
      frontend/components.d.ts
  3. 4
      frontend/package-lock.json
  4. 2123
      frontend/pnpm-lock.yaml
  5. 1
      frontend/src/components/chat/Chat.vue
  6. 4
      frontend/src/components/localchat/ChatContent.vue
  7. 1
      frontend/src/components/localchat/ChatDomain.vue
  8. 1
      frontend/src/components/localchat/ChatFoot.vue
  9. 2
      frontend/src/components/window/MenuBar.vue
  10. 85
      frontend/src/components/window/WindowTemplate.vue
  11. 4
      frontend/src/stores/localchat.ts

3
frontend/auto-imports.d.ts

@ -3,7 +3,6 @@
// @ts-nocheck // @ts-nocheck
// noinspection JSUnusedGlobalSymbols // noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import // Generated by unplugin-auto-import
// biome-ignore lint: disable
export {} export {}
declare global { declare global {
const EffectScope: typeof import('vue')['EffectScope'] const EffectScope: typeof import('vue')['EffectScope']
@ -71,6 +70,6 @@ declare global {
// for type re-export // for type re-export
declare global { declare global {
// @ts-ignore // @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
import('vue') import('vue')
} }

15
frontend/components.d.ts

@ -22,9 +22,6 @@ declare module 'vue' {
ChatDomain: typeof import('./src/components/localchat/ChatDomain.vue')['default'] ChatDomain: typeof import('./src/components/localchat/ChatDomain.vue')['default']
ChatEditor: typeof import('./src/components/localchat/ChatEditor.vue')['default'] ChatEditor: typeof import('./src/components/localchat/ChatEditor.vue')['default']
ChatFoot: typeof import('./src/components/localchat/ChatFoot.vue')['default'] ChatFoot: typeof import('./src/components/localchat/ChatFoot.vue')['default']
ChatHeader: typeof import('./src/components/chat/ChatHeader.vue')['default']
ChatHistory: typeof import('./src/components/chat/ChatHistory.vue')['default']
ChatList: typeof import('./src/components/chat/ChatList.vue')['default']
ChatMenu: typeof import('./src/components/chat/ChatMenu.vue')['default'] ChatMenu: typeof import('./src/components/chat/ChatMenu.vue')['default']
ChatMessage: typeof import('./src/components/chat/ChatMessage.vue')['default'] ChatMessage: typeof import('./src/components/chat/ChatMessage.vue')['default']
ChatMsgList: typeof import('./src/components/chat/ChatMsgList.vue')['default'] ChatMsgList: typeof import('./src/components/chat/ChatMsgList.vue')['default']
@ -37,7 +34,6 @@ declare module 'vue' {
ColorPicker: typeof import('./src/components/setting/ColorPicker.vue')['default'] ColorPicker: typeof import('./src/components/setting/ColorPicker.vue')['default']
Computer: typeof import('./src/components/computer/Computer.vue')['default'] Computer: typeof import('./src/components/computer/Computer.vue')['default']
ComputerNavBar: typeof import('./src/components/computer/ComputerNavBar.vue')['default'] ComputerNavBar: typeof import('./src/components/computer/ComputerNavBar.vue')['default']
Conservation: typeof import('./src/components/chat/Conservation.vue')['default']
ContextMenu: typeof import('./src/components/builtin/ContextMenu.vue')['default'] ContextMenu: typeof import('./src/components/builtin/ContextMenu.vue')['default']
CreateUrl: typeof import('./src/components/builtin/CreateUrl.vue')['default'] CreateUrl: typeof import('./src/components/builtin/CreateUrl.vue')['default']
CustomIcon: typeof import('./src/components/taskbar/CustomIcon.vue')['default'] CustomIcon: typeof import('./src/components/taskbar/CustomIcon.vue')['default']
@ -51,7 +47,6 @@ declare module 'vue' {
DialogTemp: typeof import('./src/components/window/DialogTemp.vue')['default'] DialogTemp: typeof import('./src/components/window/DialogTemp.vue')['default']
EditFileName: typeof import('./src/components/builtin/EditFileName.vue')['default'] EditFileName: typeof import('./src/components/builtin/EditFileName.vue')['default']
EditType: typeof import('./src/components/builtin/EditType.vue')['default'] EditType: typeof import('./src/components/builtin/EditType.vue')['default']
ElAlert: typeof import('element-plus/es')['ElAlert']
ElAside: typeof import('element-plus/es')['ElAside'] ElAside: typeof import('element-plus/es')['ElAside']
ElAvatar: typeof import('element-plus/es')['ElAvatar'] ElAvatar: typeof import('element-plus/es')['ElAvatar']
ElBadge: typeof import('element-plus/es')['ElBadge'] ElBadge: typeof import('element-plus/es')['ElBadge']
@ -60,11 +55,9 @@ declare module 'vue' {
ElCarousel: typeof import('element-plus/es')['ElCarousel'] ElCarousel: typeof import('element-plus/es')['ElCarousel']
ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem'] ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox'] ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
ElCol: typeof import('element-plus/es')['ElCol'] ElCol: typeof import('element-plus/es')['ElCol']
ElColorPicker: typeof import('element-plus/es')['ElColorPicker'] ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
ElContainer: typeof import('element-plus/es')['ElContainer'] ElContainer: typeof import('element-plus/es')['ElContainer']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDialog: typeof import('element-plus/es')['ElDialog'] ElDialog: typeof import('element-plus/es')['ElDialog']
ElDrawer: typeof import('element-plus/es')['ElDrawer'] ElDrawer: typeof import('element-plus/es')['ElDrawer']
ElEmpty: typeof import('element-plus/es')['ElEmpty'] ElEmpty: typeof import('element-plus/es')['ElEmpty']
@ -75,7 +68,6 @@ declare module 'vue' {
ElIcon: typeof import('element-plus/es')['ElIcon'] ElIcon: typeof import('element-plus/es')['ElIcon']
ElImage: typeof import('element-plus/es')['ElImage'] ElImage: typeof import('element-plus/es')['ElImage']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElLink: typeof import('element-plus/es')['ElLink']
ElMain: typeof import('element-plus/es')['ElMain'] ElMain: typeof import('element-plus/es')['ElMain']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
@ -83,16 +75,13 @@ declare module 'vue' {
ElPagination: typeof import('element-plus/es')['ElPagination'] ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopover: typeof import('element-plus/es')['ElPopover'] ElPopover: typeof import('element-plus/es')['ElPopover']
ElProgress: typeof import('element-plus/es')['ElProgress'] ElProgress: typeof import('element-plus/es')['ElProgress']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow'] ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar'] ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect'] ElSelect: typeof import('element-plus/es')['ElSelect']
ElSpace: typeof import('element-plus/es')['ElSpace']
ElSwitch: typeof import('element-plus/es')['ElSwitch'] ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable'] ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn'] ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTimePicker: typeof import('element-plus/es')['ElTimePicker'] ElText: typeof import('element-plus/es')['ElText']
ElTooltip: typeof import('element-plus/es')['ElTooltip'] ElTooltip: typeof import('element-plus/es')['ElTooltip']
Error: typeof import('./src/components/taskbar/Error.vue')['default'] Error: typeof import('./src/components/taskbar/Error.vue')['default']
FileIcon: typeof import('./src/components/builtin/FileIcon.vue')['default'] FileIcon: typeof import('./src/components/builtin/FileIcon.vue')['default']
@ -102,7 +91,6 @@ declare module 'vue' {
FileProps: typeof import('./src/components/builtin/FileProps.vue')['default'] FileProps: typeof import('./src/components/builtin/FileProps.vue')['default']
FileTree: typeof import('./src/components/builtin/FileTree.vue')['default'] FileTree: typeof import('./src/components/builtin/FileTree.vue')['default']
FileViewer: typeof import('./src/components/builtin/FileViewer.vue')['default'] FileViewer: typeof import('./src/components/builtin/FileViewer.vue')['default']
Home: typeof import('./src/components/chat/Home.vue')['default']
IframeFile: typeof import('./src/components/window/IframeFile.vue')['default'] IframeFile: typeof import('./src/components/window/IframeFile.vue')['default']
ImageViewer: typeof import('./src/components/builtin/ImageViewer.vue')['default'] ImageViewer: typeof import('./src/components/builtin/ImageViewer.vue')['default']
Install: typeof import('./src/components/install/Install.vue')['default'] Install: typeof import('./src/components/install/Install.vue')['default']
@ -113,7 +101,6 @@ declare module 'vue' {
LockDesktop: typeof import('./src/components/desktop/LockDesktop.vue')['default'] LockDesktop: typeof import('./src/components/desktop/LockDesktop.vue')['default']
Magnet: typeof import('./src/components/taskbar/Magnet.vue')['default'] Magnet: typeof import('./src/components/taskbar/Magnet.vue')['default']
MarkDown: typeof import('./src/components/builtin/MarkDown.vue')['default'] MarkDown: typeof import('./src/components/builtin/MarkDown.vue')['default']
Menu: typeof import('./src/components/chat/Menu.vue')['default']
MenuBar: typeof import('./src/components/window/MenuBar.vue')['default'] MenuBar: typeof import('./src/components/window/MenuBar.vue')['default']
MenuList: typeof import('./src/components/taskbar/MenuList.vue')['default'] MenuList: typeof import('./src/components/taskbar/MenuList.vue')['default']
MessageCenterPop: typeof import('./src/components/taskbar/MessageCenterPop.vue')['default'] MessageCenterPop: typeof import('./src/components/taskbar/MessageCenterPop.vue')['default']

4
frontend/package-lock.json

@ -1,12 +1,12 @@
{ {
"name": "godoos", "name": "godoos",
"version": "1.0.0", "version": "1.0.2",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "godoos", "name": "godoos",
"version": "1.0.0", "version": "1.0.2",
"dependencies": { "dependencies": {
"@element-plus/icons-vue": "^2.3.1", "@element-plus/icons-vue": "^2.3.1",
"@liripeng/vue-audio-player": "^1.6.2", "@liripeng/vue-audio-player": "^1.6.2",

2123
frontend/pnpm-lock.yaml

File diff suppressed because it is too large

1
frontend/src/components/chat/Chat.vue

@ -8,7 +8,6 @@ onMounted(() => {
store.initChat() store.initChat()
}) })
</script> </script>
<template> <template>
<el-container class="container"> <el-container class="container">
<!--菜单--> <!--菜单-->

4
frontend/src/components/localchat/ChatContent.vue

@ -2,6 +2,7 @@
import { onMounted, inject, ref, nextTick, watch } from "vue"; import { onMounted, inject, ref, nextTick, watch } from "vue";
import { useLocalChatStore } from "@/stores/localchat"; import { useLocalChatStore } from "@/stores/localchat";
import { formatChatTime } from "@/util/common"; import { formatChatTime } from "@/util/common";
// import { orderBy } from "lodash-es";
// import Vditor from "vditor"; // import Vditor from "vditor";
// import "vditor/dist/index.css"; // import "vditor/dist/index.css";
import { ElScrollbar } from "element-plus"; import { ElScrollbar } from "element-plus";
@ -27,6 +28,7 @@ const scrollToBottom = () => {
watch( watch(
() => store.msgList, () => store.msgList,
(_) => { (_) => {
// this.sortMsgList(); //
if (!isScrool) { if (!isScrool) {
scrollToBottom(); scrollToBottom();
} }
@ -36,6 +38,7 @@ watch(
deep: true, deep: true,
} }
); );
function replaceIconTags(text: any) { function replaceIconTags(text: any) {
// {**} // {**}
// console.log(text) // console.log(text)
@ -62,6 +65,7 @@ async function scroll({ scrollTop }: { scrollTop: number }) {
</script> </script>
<template> <template>
<!-- {{ store.msgLis }} -->
<div class="chatContentContainer" v-if="store.chatTargetId > 0"> <div class="chatContentContainer" v-if="store.chatTargetId > 0">
<div class="message-area"> <div class="message-area">
<el-scrollbar max-height="100%" class="scrollbar-container" @scroll="scroll" ref="messageContainerRef"> <el-scrollbar max-height="100%" class="scrollbar-container" @scroll="scroll" ref="messageContainerRef">

1
frontend/src/components/localchat/ChatDomain.vue

@ -64,6 +64,7 @@
</div> </div>
</el-scrollbar> </el-scrollbar>
</div> </div>
<el-dialog v-model="store.showAddUser" title="系统设置" width="500"> <el-dialog v-model="store.showAddUser" title="系统设置" width="500">
<el-form> <el-form>

1
frontend/src/components/localchat/ChatFoot.vue

@ -67,6 +67,7 @@ const imgExt = ["png", "jpg", "jpeg", "gif", "bmp", "webp", "svg"];
const choosetype = ref('image') const choosetype = ref('image')
// //
function selectIcon(icon: string) { function selectIcon(icon: string) {
console.log("icon:", icon);
store.sendInfo += store.sendInfo +=
"{-" + icon.replace("/image/chat/emoji/", "").replace(".gif", "") + "-}"; "{-" + icon.replace("/image/chat/emoji/", "").replace(".gif", "") + "-}";
} }

2
frontend/src/components/window/MenuBar.vue

@ -20,6 +20,8 @@ import { emitEvent } from "@/system/event";
const props = defineProps<{ const props = defineProps<{
browserWindow: UnwrapNestedRefs<BrowserWindow>; browserWindow: UnwrapNestedRefs<BrowserWindow>;
}>(); }>();
function handleEvent(event: string) { function handleEvent(event: string) {
switch (event) { switch (event) {
case "min": case "min":

85
frontend/src/components/window/WindowTemplate.vue

@ -15,9 +15,11 @@
ref="$win_outer" ref="$win_outer"
v-dragable v-dragable
> >
<!-- 窗口标题栏 -->
<div class="wintmp_uper" @contextmenu.prevent> <div class="wintmp_uper" @contextmenu.prevent>
<MenuBar :browser-window="browserWindow"></MenuBar> <MenuBar :browser-window="browserWindow"></MenuBar>
</div> </div>
<div <div
class="wintmp_main" class="wintmp_main"
:class="{ resizeing: resizemode != 'null' }" :class="{ resizeing: resizemode != 'null' }"
@ -31,65 +33,20 @@
></div> ></div>
<WindowInner :win="browserWindow"></WindowInner> <WindowInner :win="browserWindow"></WindowInner>
</div> </div>
<!-- 使用 v-for 生成拖拽边界 -->
<div <div
class="right_border win_drag_border" v-for="border in dragBorders"
:class="{ isChoseMode: resizemode == 'r' }" :key="border.type"
v-if="resizable" :class="[
@mousedown.stop.prevent="startScale($event, 'r')" border.class,
@touchstart.stop.passive="startScale($event, 'r')" 'win_drag_border',
></div> { isChoseMode: resizemode == border.type },
<div border.cursorClass
class="bottom_border win_drag_border" ]"
:class="{ isChoseMode: resizemode == 'b' }"
v-if="resizable"
@mousedown.stop.prevent="startScale($event, 'b')"
@touchstart.stop.passive="startScale($event, 'b')"
></div>
<div
class="left_border win_drag_border"
:class="{ isChoseMode: resizemode == 'l' }"
v-if="resizable"
@mousedown.stop.prevent="startScale($event, 'l')"
@touchstart.stop.passive="startScale($event, 'l')"
></div>
<div
class="top_border win_drag_border"
:class="{ isChoseMode: resizemode == 't' }"
v-if="resizable"
@mousedown.stop.prevent="startScale($event, 't')"
@touchstart.stop.passive="startScale($event, 't')"
></div>
<div
class="right_bottom_border win_drag_border"
:class="{ isChoseMode: resizemode == 'rb' }"
v-if="resizable"
draggable="false"
@mousedown.stop.prevent="startScale($event, 'rb')"
@touchstart.stop.passive="startScale($event, 'rb')"
></div>
<div
class="left_bottom_border win_drag_border"
:class="{ isChoseMode: resizemode == 'lb' }"
v-if="resizable"
draggable="false"
@mousedown.stop.prevent="startScale($event, 'lb')"
@touchstart.stop.passive="startScale($event, 'lb')"
></div>
<div
class="left_top_border win_drag_border"
:class="{ isChoseMode: resizemode == 'lt' }"
v-if="resizable" v-if="resizable"
draggable="false" draggable="false"
@mousedown.stop.prevent="startScale($event, 'lt')" @mousedown.stop.prevent="startScale($event, border.type)"
@touchstart.stop.passive="startScale($event, 'lt')" @touchstart.stop.passive="startScale($event, border.type)"
></div>
<div
class="right_top_border win_drag_border"
:class="{ isChoseMode: resizemode == 'rt' }"
v-if="resizable"
draggable="false"
@mousedown.stop.prevent="startScale($event, 'rt')"
@touchstart.stop.passive="startScale($event, 'rt')"
></div> ></div>
</div> </div>
</template> </template>
@ -133,9 +90,6 @@ function onFocus(e: MouseEvent | TouchEvent): void {
const istop = computed(() => windowInfo.istop); const istop = computed(() => windowInfo.istop);
/*
*计算样式
*/
onMounted(() => { onMounted(() => {
customerStyle.value = { customerStyle.value = {
width: computed(() => windowInfo.width + "px"), width: computed(() => windowInfo.width + "px"),
@ -176,6 +130,7 @@ onMounted(() => {
}); });
}); });
function startScale(e: MouseEvent | TouchEvent, dire: string) { function startScale(e: MouseEvent | TouchEvent, dire: string) {
console.log(e);
if (windowInfo.disable) { if (windowInfo.disable) {
return; return;
} }
@ -193,6 +148,18 @@ onUnmounted(() => {
scaleAble.unMount(); scaleAble.unMount();
// dragAble.unMount(); // dragAble.unMount();
}); });
//
const dragBorders = [
{ type: 'r', class: 'right_border' },
{ type: 'b', class: 'bottom_border' },
{ type: 'l', class: 'left_border' },
{ type: 't', class: 'top_border' },
{ type: 'rb', class: 'right_bottom_border' },
{ type: 'lb', class: 'left_bottom_border' },
{ type: 'lt', class: 'left_top_border' },
{ type: 'rt', class: 'right_top_border' },
];
</script> </script>
<style> <style>
.dragwin { .dragwin {

4
frontend/src/stores/localchat.ts

@ -179,7 +179,7 @@ export const useLocalChatStore = defineStore('localChatStore', () => {
const offset = (currentPage.value - 1) * pageSize.value const offset = (currentPage.value - 1) * pageSize.value
const list = await db.table('chatmsg') const list = await db.table('chatmsg')
.where({ targetIp: chatTargetIp.value }) .where({ targetIp: chatTargetIp.value })
.desc() // .desc()
.offset(offset) .offset(offset)
.limit(pageSize.value) .limit(pageSize.value)
.toArray(); .toArray();
@ -192,7 +192,7 @@ export const useLocalChatStore = defineStore('localChatStore', () => {
const offset = currentPage.value * pageSize.value const offset = currentPage.value * pageSize.value
const list = await db.table('chatmsg') const list = await db.table('chatmsg')
.where({ targetIp: chatTargetIp.value }) .where({ targetIp: chatTargetIp.value })
.desc() // .desc()
.offset(offset) .offset(offset)
.limit(pageSize.value) .limit(pageSize.value)
.toArray(); .toArray();

Loading…
Cancel
Save