|
|
@@ -5,6 +5,7 @@ export default {
|
|
|
</script>
|
|
|
<script setup>
|
|
|
import { ref, reactive, toRaw, toRefs } from "vue";
|
|
|
+import { useRouter, useRoute } from "vue-router";
|
|
|
import useUserStore from "@/store/modules/user";
|
|
|
import word from "@/assets/images/word2.png";
|
|
|
import chat from "@/assets/images/profile.jpg";
|
|
|
@@ -21,6 +22,8 @@ import forwordTree from "@/components/forwordTree/index.vue"; //选择文件发
|
|
|
//websocket连接====
|
|
|
import useWebsoctStore from "@/store/modules/websocket";
|
|
|
import { ElMessage } from "element-plus";
|
|
|
+const route = useRoute();
|
|
|
+console.log('route===', route)
|
|
|
const websoctStore = useWebsoctStore();
|
|
|
//====
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
@@ -33,7 +36,9 @@ const sendId = ref(""); //选择发送的文件id
|
|
|
const isForward = ref(false);
|
|
|
const openFile = ref(false); //文件目录
|
|
|
const openForwardFile = ref(false); //转发目录
|
|
|
+const showCircel=ref('') //是否 显示圆点
|
|
|
const chatRecords = reactive({ data: [] });
|
|
|
+const loading = ref(false)
|
|
|
const sendCont = reactive({
|
|
|
//发送聊天内容数据组装
|
|
|
data: {
|
|
|
@@ -198,7 +203,8 @@ const noMes = ref(false);
|
|
|
const handleScroll = (event) => {
|
|
|
// 在滚动到顶部时,加载上一页的聊天记录
|
|
|
const mainContainer = document.querySelector(".right-container");
|
|
|
- if (event.deltaY < 0 && mainContainer.scrollTop <= 1) {
|
|
|
+ if (event.deltaY < 0 && mainContainer.scrollTop <= 1&&!noMes.value) {
|
|
|
+ loading.value=true
|
|
|
loadPreviousPage();
|
|
|
}
|
|
|
};
|
|
|
@@ -209,10 +215,12 @@ const loadPreviousPage = async () => {
|
|
|
pageSize: 10,
|
|
|
};
|
|
|
const resMsgData = await msgRecord(sendCont.data.toId, queryParams);
|
|
|
+ loading.value=false
|
|
|
const previousPageData = resMsgData.rows.reverse();
|
|
|
if (currentPageNum * 10 >= resMsgData.total && !noMes.value) {
|
|
|
- noMes.value = true;
|
|
|
- return ElMessage("无更多聊天记录");
|
|
|
+ return noMes.value = true;
|
|
|
+
|
|
|
+ // return ElMessage("无更多聊天记录");
|
|
|
}
|
|
|
// 将加载的上一页聊天记录插入到 chatRecords.data 的前面
|
|
|
chatRecords.data = [...previousPageData, ...chatRecords.data];
|
|
|
@@ -238,7 +246,6 @@ const forwardClick = async (indexs,docIds) => {
|
|
|
//获取最上层树的id
|
|
|
const topSpaceid = await spaceInfo(3);
|
|
|
spaceId.value = topSpaceid.data.spaceId.toString();
|
|
|
- console.log("topSpaceid", topSpaceid);
|
|
|
openForwardFile.value = true;
|
|
|
};
|
|
|
const forwardChangeMsg = async (val) => {};
|
|
|
@@ -246,7 +253,6 @@ const forwardChangeMsg = async (val) => {};
|
|
|
const downClick =async (fileId) => {
|
|
|
// location.href=await fileDownload(fileId)
|
|
|
location.href=`${import.meta.env.VITE_APP_BASE_API}/api/download/${fileId}`;
|
|
|
- console.log('downRes===', downRes)
|
|
|
}
|
|
|
// 滚动翻页========
|
|
|
onMounted(() => {
|
|
|
@@ -271,8 +277,7 @@ onMounted(() => {
|
|
|
@change="SearchChat"
|
|
|
/>
|
|
|
<!-- 添加聊天人员 -->
|
|
|
- <el-icon size="24" color="#505870" @click="clickNewPerson"
|
|
|
- ><Plus
|
|
|
+ <el-icon size="24" color="#505870" @click="clickNewPerson" style=" margin-right: 8px;"><Plus
|
|
|
/></el-icon>
|
|
|
<!-- 新建聊天弹框 -->
|
|
|
<Addperson
|
|
|
@@ -313,9 +318,10 @@ onMounted(() => {
|
|
|
: item.toName
|
|
|
}}</span
|
|
|
><span class="person-cont spill">
|
|
|
- {{ item.cont ? item.cont : item.content }}</span
|
|
|
+ {{ item.file?.fileName ? item.file?.fileName : item.content }}</span
|
|
|
>
|
|
|
</div>
|
|
|
+ <!-- <span class="yuandian" v-if="showCircel==item.fromId&&$route.path=='/index'"></span> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 右侧聊天 -->
|
|
|
@@ -334,6 +340,8 @@ onMounted(() => {
|
|
|
@mousewheel="handleScroll"
|
|
|
ref="mainContainer"
|
|
|
>
|
|
|
+ <div v-loading="loading"></div>
|
|
|
+ <!-- <div v-if="noMes" style="color:#9fa1a5 ;">无更多聊天记录</div> -->
|
|
|
<div
|
|
|
class="message-container"
|
|
|
v-for="(record, index) in chatRecords.data"
|
|
|
@@ -454,4 +462,16 @@ onMounted(() => {
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
@import "@/assets/styles/my-common.scss";
|
|
|
+.left-container{
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.yuandian{
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ position: absolute;
|
|
|
+ right: 8px;
|
|
|
+ top: 6px;
|
|
|
+ background: #FA5151;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
</style>
|