首页转存

src/api/chat/msg.js

@@ -100,3 +100,32 @@ export function getConfigKeys(docId) {
     method: 'get'
   })
 }
+// 新建目录
+export function builtDir(data) {
+  return request({
+    url: '/biz/dir',
+    method: 'post',
+    data: data
+  })
+}
+
+export function fileCopy(data) {
+  return request({
+      url: `/biz/info/copy`,
+      method: "get",
+      params: data
+  })
+}
+export function spaceInfo(type) {
+  return request({
+      url: `/biz/space/info/${type}`,
+      method: "get",
+  })
+}
+// 文件下载
+export function fileDownload(data){
+  return request({
+      url:`/biz/info/download/${data}`,
+      method:"get"
+  })
+}

src/assets/styles/tree-common.scss

@@ -16,8 +16,9 @@
   
     .main-cont-left,
     .main-cont-right {
-      width: 99%;
+      width: 100%;
       height: 100%;
+      overflow-y: auto;
     }
     .main-cont-right {
       border-left: 1px solid #c1cce3;

src/components/FileTreeChoice/index.vue

@@ -71,6 +71,7 @@ const treeData = reactive({ data: [] });
 watchEffect(() => {
   treeData.data[0]=props.fileUserTreeData
   toRaw(treeData.data);
+  console.log('toRaw(treeData.data);', toRaw(treeData.data))
 });
 
 //树

src/components/forwordTree/index.vue

@@ -1,95 +1,214 @@
 <template>
-    <el-dialog v-model="isOpen" append-to-body width="700">
-      <template #header>
-        <div class="my-header">
-          <div class="title">选择文件</div>
+  <el-dialog v-model="isOpen" append-to-body width="700">
+    <template #header>
+      <div class="my-header">
+        <div class="title">转存到</div>
+      </div>
+    </template>
+    <div class="main-cont">
+      <div class="main-cont-left">
+        <div class="build-file" v-if="dirBulidNow">
+          <img :src="fileImg" alt="" class="left-img build-img" />
+          <el-input
+            v-model="dirName"
+            class="bulid-input"
+            clearable
+            placeholder="新建目录"
+          />
+          <el-icon size="20" color="#327CEC" @click="sureDir"
+            ><CircleCheckFilled
+          /></el-icon>
         </div>
-      </template>
-      <div class="main-cont">
-        <div class="main-cont-left">
-          <el-tree-v2
-            ref="treeRef"
-            :data="treeData.data"
-            :show-checkbox="false"
-            :height="280"
-            :props="defaultProps"
-            @node-click="handleNodeClick"
-          >
-            <template #default="{ node }">
-              <span style="display: flex;align-items: center;">
-                <img :src="fileImg" alt="" style="width: 20px;height: 20px;margin-right: 5px;"/>
-                <!-- 放置图片 -->
-                <span>{{ node.label }}</span>
-                <!-- 显示节点标签 -->
-              </span>
-            </template>
-          </el-tree-v2>
+        <el-tree-v2
+          ref="treeRef"
+          :data="treeData.data"
+          :highlight-current="true"
+          :default-expanded-keys="[spaceId]"
+          :show-checkbox="false"
+          :height="280"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+        >
+          <template #default="{ node }">
+            <span style="display: flex; align-items: center">
+              <img :src="fileImg" alt="" class="left-img" />
+              <!-- 放置图片 -->
+              <span>{{ node.label }}</span>
+              <!-- 显示节点标签 -->
+            </span>
+          </template>
+        </el-tree-v2>
+      </div>
+    </div>
+    <template #footer>
+      <div class="footer">
+        <span
+          ><el-button @click.stop="buildFile" class="cancel-button"
+            >新建文件夹</el-button
+          ></span
+        >
+        <div>
+          <span class="dialog-footer">
+            <el-button @click="isOpen = false" class="cancel-button"
+              >取消</el-button
+            >
+            <el-button type="primary" @click="confirm" class="sure-button">
+              确认
+            </el-button>
+          </span>
         </div>
       </div>
-      <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="isOpen = false" class="cancel-button"
-            >取消</el-button
-          >
-          <el-button type="primary" @click="confirm" class="sure-button">
-            确认
-          </el-button>
-        </span>
-      </template>
-    </el-dialog>
-  </template>
+    </template>
+  </el-dialog>
+</template>
     <script setup>
-  import { reactive, ref, toRaw, toRefs, watch } from "vue";
-  import { ElMessage } from "element-plus";
-  import fileImg from "@/assets/images/file-img.png";
-  import useUserStore from "@/store/modules/user";
-  import { defineEmits } from "vue";
-  const opent = ref(true);
-  const props = defineProps({
-    openForwardFile: {
-      type: Boolean,
-      default: false,
-    },
-    forwardTreeData: {
-      type: Object,
-      default: () => {},
-    },
+import { reactive, ref, toRaw, toRefs, watch, nextTick, onMounted } from "vue";
+import { ElMessage } from "element-plus";
+import fileImg from "@/assets/images/file-img.png";
+import direction from "@/assets/images/direction.png";
+import useUserStore from "@/store/modules/user";
+import { defineEmits } from "vue";
+import { builtDir, fileCopy, spaceInfo, dirTree } from "@/api/chat/msg";
+const opent = ref(true);
+const props = defineProps({
+  openForwardFile: {
+    type: Boolean,
+    default: false,
+  },
+  forwardTreeData: {
+    type: Object,
+    default: () => {},
+  },
+  docId: {
+    type: String,
+  },
+  spaceId: {
+    type: String,
+  },
+});
+const defaultProps = {
+  children: "children",
+  label: "label",
+  value: "id",
+};
+const dirName = ref(""); //新建文件夹名称
+const dirBulidNow = ref(false);
+const treeRef = ref(null);
+const isOpen = ref(props.openForwardFile);
+watch(
+  () => props.openForwardFile,
+  (newValue) => {
+    isOpen.value = newValue;
+  }
+);
+const treeData = reactive({ data: [] });
+const defaultExpandedKeys = ref([]);
+watchEffect(() => {
+  treeData.data[0] = props.forwardTreeData;
+//   //默认展开第二级
+//   treeData.data.forEach((node) => {
+//     if (node.children) {
+//       // 如果节点有子节点
+//       const childKeys = node.children.map((child) => child.id); // 获取子节点的 key 数组
+//       defaultExpandedKeys.value= [... defaultExpandedKeys.value, ...childKeys]; // 将子节点的 key 数组合并到 defaultExpandedKeys 中
+//     }
+//   });
+});
+watchEffect(() => {
+  console.log("props.docId", props.docId);
+});
+//树
+const clickData = ref({});
+const handleNodeClick = (data) => {
+  clickData.value = data;
+};
+//确定按钮
+const emit = defineEmits(["forwardChangeMsg"]);
+const confirm = async () => {
+  const copyRes = await fileCopy({
+    docId: props.docId,
+    dirId: clickData.value.id,
+    spaceId: props.spaceId,
   });
-  const defaultProps = {
-    children: "children",
-    label: "label",
-    value: "id",
-  };
-  const isOpen = ref(props.openForwardFile);
-  watch(
-    () => props.openForwardFile,
-    (newValue) => {
-      isOpen.value = newValue;
-    }
-  );
-  const treeData = reactive({ data: [] });
-  watchEffect(() => {
-    treeData.data[0]=props.forwardTreeData
-    console.log(treeData.data,'treeData.data')
-    toRaw(treeData.data);
+  if (copyRes.code === 200) {
+    ElMessage({ message: "转存成功", type: "success" });
+    dirBulidNow.value = false;
+  }
+  isOpen.value = false;
+};
+//新建目录显示
+const clickId = ref("");
+const buildFile = async () => {
+  clickId.value = clickData.value.id;
+  if (!clickId.value) {
+    return ElMessage({ message: "请选中目录", type: "error" });
+  }
+  dirBulidNow.value = true;
+};
+//确认新建目录--点击勾选
+const sureDir = async () => {
+  const dirRes = await builtDir({
+    dirName: dirName.value,
+    spaceId: props.spaceId,
+    parentId: clickData.value.id,
   });
-  
-  //树
-  const clickData = ref({});
-  const handleNodeClick = (data) => {
-    clickData.value = data;
-  };
-  //确定按钮
-    const emit = defineEmits(["forwardChangeMsg"]);
-  const confirm = () => {
-    const {disabled,label}=toRefs(clickData.value)
-    if(disabled.value){
-      return ElMessage({ message: '当前选中为目录,请重新选择文件', type: 'error' })
-    }
-      emit("forwardChangeMsg", clickData.value);
-      isOpen.value  = false
-  };
-  </script>
+  if (dirRes.code === 200) {
+    ElMessage({ message: "创建成功", type: "success" });
+    dirBulidNow.value = false;
+    clickId.value = "";
+    dirName.value = "";
+    //重新获取树结构
+    const resDir = await dirTree(3);
+    treeData.data[0] = resDir;
+    // treeRef.value.setCurrentKey(clickData.value.id)
+  }
+
+};
+</script>
   <style lang="scss" scoped>
-  @import "@/assets/styles/tree-common.scss";
-  </style>
+@import "@/assets/styles/tree-common.scss";
+.sure-button,
+.cancel-button {
+  width: 120px;
+}
+.left-img {
+  width: 20px;
+  height: 20px;
+  margin-right: 5px;
+}
+.footer {
+  display: flex;
+  justify-content: space-between;
+}
+.title {
+  font-family: "Inter-Medium";
+  font-weight: 600;
+}
+:deep .el-tree {
+  //   margin-top: 4px;
+  width: 100%;
+}
+.arrow-img {
+  margin-left: 5px;
+  width: 12px;
+  height: 12px;
+}
+
+.build-file {
+  background: #f5f7f9;
+  padding: 3px 0;
+  margin: 4px 0;
+  display: flex;
+  align-items: center;
+  .build-img {
+    margin-left: 24px;
+  }
+  .bulid-input {
+    margin-right: 10px;
+  }
+  :deep .el-input {
+    width: 240px !important;
+    height: 29px;
+  }
+}
+</style>

src/store/modules/websocket.js

@@ -1,5 +1,6 @@
 // websoct.js
 import useUserStore from '@/store/modules/user'
+import { ElMessage } from "element-plus";
 import {
   msgSend
 } from "@/api/chat/msg";
@@ -8,7 +9,8 @@ const useWebsoctStore = defineStore('websoct', {
     messages: [],
     socket: null,
     messOne:{},
-    newMessage: false
+    newMessage: false,
+    falseMessag:false,//消息是否发送成功
   }),
   actions: {
     connect() {
@@ -43,6 +45,7 @@ const useWebsoctStore = defineStore('websoct', {
            this.newMessage = true // 标记有新的消息
 					resolve(res)
 				}).catch(error => {
+          ElMessage({ message: "发送消息失败", type: "error" });
 					reject(error)
 				})
 			})

src/views/liveChat/index.vue

@@ -14,16 +14,7 @@ import downFile from "@/assets/images/down-file.png";
 import forwardFile from "@/assets/images/forward-file.png";
 import sendFile from "@/assets/images/send-file.png";
 import store from "@/store";
-import {
-  msgFriend,
-  userTree,
-  userInfo,
-  msgSend,
-  msgRecord,
-  delMsg,
-  dirTree,
-  fileTree,
-} from "@/api/chat/msg";
+import {msgFriend,userTree,userInfo,msgSend,msgRecord,delMsg,dirTree,fileTree,spaceInfo,fileDownload} from "@/api/chat/msg";
 import Addperson from "@/components/AddPerson/index.vue"; //添加人员的弹框
 import FileTreeChoice from "@/components/FileTreeChoice/index.vue"; //选择文件发送的列表
 import forwordTree from "@/components/forwordTree/index.vue"; //选择文件发送的列表
@@ -39,7 +30,7 @@ const messageText = ref(""); //发送的内容
 const headerName = ref("");
 const total = ref(0);
 const sendId = ref(""); //选择发送的文件id
-const isForward=ref(false)
+const isForward = ref(false);
 const openFile = ref(false); //文件目录
 const openForwardFile = ref(false); //转发目录
 const chatRecords = reactive({ data: [] });
@@ -94,7 +85,7 @@ const msgRecordEvent = async (toIdValue) => {
     pageSize: 10,
   };
   const resMsgData = await msgRecord(toIdValue, queryParams);
-  resMsgData.rows.map(i=>i.isForward=false)
+  resMsgData.rows.map((i) => (i.isForward = false));
   chatRecords.data = resMsgData.rows.reverse();
   total.value = resMsgData.total;
 };
@@ -226,29 +217,36 @@ const loadPreviousPage = async () => {
   // 将加载的上一页聊天记录插入到 chatRecords.data 的前面
   chatRecords.data = [...previousPageData, ...chatRecords.data];
 };
-const transferFiles=(forwardVal,msgIds)=>{
-  chatRecords.data.map(i=>{
-    if(i.msgId==msgIds&&i.msgType=='1'){
-      i.isForward=true
-    }else{
-      i.isForward=false
+const transferFiles = (forwardVal, msgIds, indexs) => {
+  chatRecords.data.map((i, index) => {
+    if (i.msgId == msgIds && i.msgType == "1" && indexs == index) {
+      i.isForward = true;
+    } else {
+      i.isForward = false;
     }
-  })
-}
-// 点击转发
+  });
+};
+// 点击转存
 const forwardTreeData = reactive({ data: {} });
-const forwardClick=async ()=>{
+const spaceId = ref("");
+const docId=ref('')
+const forwardClick = async (indexs,docIds) => {
+  docId.value=docIds.toString()
   const resDir = await dirTree(3);
   forwardTreeData.data = resDir;
   toRaw(forwardTreeData.data);
-  openFile.value = true;
-}
-const forwardChangeMsg = async (val) => {
-
+  //获取最上层树的id
+  const topSpaceid = await spaceInfo(3);
+  spaceId.value = topSpaceid.data.spaceId.toString();
+  console.log("topSpaceid", topSpaceid);
+  openForwardFile.value = true;
 };
+const forwardChangeMsg = async (val) => {};
 //点击下载
-const downClick=()=>{
-
+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(() => {
@@ -267,6 +265,7 @@ onMounted(() => {
           v-model="searchText"
           class="w-50 m-2"
           size="small"
+          clearable
           placeholder="搜索聊天"
           suffix-icon="Search"
           @change="SearchChat"
@@ -346,10 +345,22 @@ onMounted(() => {
             >
               <div
                 v-if="useUserStore().uid !== record.toId"
-                :class="record.msgType == '1'?'file-msg right-back':'time-text right-back'"
+                :class="
+                  record.msgType == '1'
+                    ? 'file-msg right-back'
+                    : 'time-text right-back'
+                "
               >
-                <img :src="word"  v-if="record.msgType == '1'" class="head-sculpture" />
-                <div :class="record.msgType == '2'?'clip-path':'clip-path-right'">
+                <img
+                  :src="word"
+                  v-if="record.msgType == '1'"
+                  class="head-sculpture"
+                />
+                <div
+                  :class="
+                    record.msgType == '2' ? 'clip-path' : 'clip-path-right'
+                  "
+                >
                   <div>{{ record.createTime }}</div>
                   <span v-if="record.msgType == '1'">{{
                     record.file?.fileName
@@ -360,30 +371,48 @@ onMounted(() => {
                 </div>
               </div>
               <img :src="chat" class="head-sculpture" />
-              <div style="display: flex;align-items: center;">
-              <div v-if="useUserStore().uid == record.toId"  :class="record.msgType == '1'?'file-msg left-back':'left-back'" @click="transferFiles(record.msgType,record.msgId)">
+              <div style="display: flex; align-items: center">
+                <div
+                  v-if="useUserStore().uid == record.toId"
+                  :class="
+                    record.msgType == '1' ? 'file-msg left-back' : 'left-back'
+                  "
+                  @click="transferFiles(record.msgType, record.msgId, index)"
+                >
+                  <img
+                    v-if="record.msgType == '1'"
+                    :src="word"
+                    class="head-sculpture"
+                  />
+                  <div
+                    :class="
+                      record.msgType == '2' ? 'clip-path' : 'clip-path-left'
+                    "
+                  >
+                    <div>{{ record.createTime }}</div>
+                    <span v-if="record.msgType == '1'">{{
+                      record.file?.fileName
+                    }}</span>
+                    <span v-else-if="record.msgType == '2'">{{
+                      record.content
+                    }}</span>
+                  </div>
+                </div>
                 <img
-                  v-if="record.msgType == '1'"
-                  :src="word"
-                  class="head-sculpture"
+                  :src="forwardFile"
+                  class="zhuanfa forwd"
+                  alt="转存"
+                  v-if="record.isForward"
+                  @click="forwardClick(index,record.file.docId)"
+                />
+                <img
+                  :src="downFile"
+                  class="zhuanfa downf"
+                  alt="下载"
+                  v-if="record.isForward"
+                  @click="downClick(record.file.fileId)"
                 />
-                <div :class="record.msgType == '2'?'clip-path':'clip-path-left'">
-                  <div>{{ record.createTime }}</div>
-                  <span v-if="record.msgType == '1'">{{
-                    record.file?.fileName
-                  }}</span>
-                  <span  v-else-if="record.msgType == '2'">{{ record.content }}</span>
-                </div>
               </div>
-                  <img :src="forwardFile" class="zhuanfa forwd" alt="转存" v-if="record.isForward" @click="forwardClick">
-                  <img :src="downFile" class="zhuanfa downf" alt="下载" v-if="record.isForward" @click="downClick">
-                    <forwordTree
-                    :openForwardFile="openForwardFile"
-                    @close="openForwardFile = false"
-                    :forwardTreeData="forwardTreeData.data"
-                    @forwardChangeMsg="forwardChangeMsg"
-                  ></forwordTree>
-                </div>
             </div>
           </el-main>
           <!-- 底部 -->
@@ -413,6 +442,14 @@ onMounted(() => {
       </div>
     </div>
   </div>
+  <forwordTree
+    :openForwardFile="openForwardFile"
+    :docId="docId"
+    :spaceId="spaceId"
+    @close="openForwardFile = false"
+    :forwardTreeData="forwardTreeData.data"
+    @forwardChangeMsg="forwardChangeMsg"
+  ></forwordTree>
 </template>
 
 <style lang="scss" scoped>