From 96d13ee431fef2fb5eaba05654cd7e0216ce36ab Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期五, 28 六月 2024 16:53:26 +0800
Subject: [PATCH] 新建聊天室
---
src/layout/component/sidebar/waterLeftAside/asideNew.vue | 65 ++++++++++++++++++++------------
1 files changed, 40 insertions(+), 25 deletions(-)
diff --git a/src/layout/component/sidebar/waterLeftAside/asideNew.vue b/src/layout/component/sidebar/waterLeftAside/asideNew.vue
index c576779..c2a4fd3 100644
--- a/src/layout/component/sidebar/waterLeftAside/asideNew.vue
+++ b/src/layout/component/sidebar/waterLeftAside/asideNew.vue
@@ -28,18 +28,18 @@
<div class="flex-auto text-[#ccc] flex flex-col items-center mt-6 overflow-y-auto" ref="chatRoomRef">
<div
- :class="{ 'bg-[#41424a]': index === activeIndex }"
+ :class="{ 'bg-[#41424a]': item.id === activeRoomId }"
class="group flex items-center w-full h-10 rounded-md cursor-pointer px-2 py-2 flex-0"
v-for="(item, index) in chatRoomList"
:key="index"
- @click="roomClick(item, index)"
+ @click="roomClick(item)"
>
<div class="ywicon icon-xiaoxi flex-0 mr-2.5"></div>
<div class="flex-auto text-ellipsis text-nowrap text-sm group-hover:text-[#0084ff]">chat room</div>
<div class="text-gray-100 flex items-center space-x-2 ml-1">
<div class="ywicon invisible icon-bianji visible group-hover:visible !text-sm"></div>
- <el-popconfirm title="纭畾鍒犻櫎杩欎釜鑱婂ぉ瀹わ紵" @confirm.stop="confirmDeleteChatRoom(item, index)">
+ <el-popconfirm title="纭畾鍒犻櫎杩欎釜鑱婂ぉ瀹わ紵" @confirm.stop="confirmDeleteChatRoom(item)">
<template #reference>
<div class="ywicon invisible icon-shanchu3 visible group-hover:visible"></div>
</template>
@@ -53,11 +53,10 @@
<script setup lang="ts">
import { Search } from '@element-plus/icons-vue';
-import { nextTick, reactive, ref, watch } from 'vue';
+import { nextTick, onMounted, reactive, ref } from 'vue';
import type { ChatRoomItem } from './types';
import router from '/@/router';
-import { chatRoomList } from '/@/stores/chatRoom';
-import { Local } from '/@/utils/storage';
+import { activeRoomId, chatRoomList } from '/@/stores/chatRoom';
let state = reactive({
searchInput: '',
selectDateOption: [
@@ -87,47 +86,63 @@
state.isShowDate = !state.isShowDate;
};
-const activeIndex = ref(null);
+const gotoAnswerPage = (room: ChatRoomItem) => {
+ if (room.isInitial) {
+ router.push({
+ name: 'Home',
+ });
+ } else {
+ router.push({
+ name: 'AskAnswer',
+ query: {
+ id: room.id,
+ },
+ });
+ }
+};
+
const newChatRoomClick = () => {
const newRoom = {
+ id: new Date().getTime() + '' + Math.floor(Math.random() * 1000),
isInitial: true,
title: 'chat room',
};
- console.log("馃殌 ~ chatRoomList.value:", chatRoomList.value)
-
if (!chatRoomList.value) {
chatRoomList.value = [newRoom];
} else {
chatRoomList.value.unshift(newRoom);
}
- activeIndex.value = 0;
+ activeRoomId.value = newRoom.id;
nextTick(() => {
- router.push({
- name: 'Home',
- });
+ gotoAnswerPage(newRoom);
});
};
-const roomClick = (room: ChatRoomItem, index: number) => {
- activeIndex.value = index;
- router.push({
- name: 'Home',
- });
+const roomClick = (room: ChatRoomItem) => {
+ activeRoomId.value = room.id;
+ gotoAnswerPage(room);
};
-const confirmDeleteChatRoom = (room: ChatRoomItem, index: number) => {
+const confirmDeleteChatRoom = (room: ChatRoomItem) => {
const foundIndex = chatRoomList.value.findIndex((item) => item === room);
chatRoomList.value.splice(foundIndex, 1);
+ if (chatRoomList.value.length === 0) {
+ newChatRoomClick();
+ return;
+ }
+ roomClick(chatRoomList.value[0]);
chatRoomRef.value.firstElementChild?.scrollIntoView();
- activeIndex.value = 0;
};
-watch(
- () => chatRoomList.value,
- (val) => {
- Local.set('chatRoomList', val);
+onMounted(() => {
+ if (router.currentRoute.value.name === 'Home') {
+ if (!chatRoomList.value || chatRoomList.value.length === 0) {
+ newChatRoomClick();
+ } else {
+ roomClick(chatRoomList.value[0]);
+ }
}
-);
+});
</script>
<style scoped lang="scss">
.set-input {
--
Gitblit v1.9.3