收藏接口调用

src/api/modules/data-fill/collect.js

@@ -6,7 +6,7 @@ export default {
         return HcApi({
             url: '/api/blade-manager/contractCollectFolder/collect',
             method: 'post',
-            params: form,
+            data: form,
         })
     },
     //删除
@@ -30,7 +30,7 @@ export default {
         return HcApi({
             url: '/api/blade-manager/contractCollectFolder/saveOrUpdateFolder',
             method: 'post',
-            params: form,
+            data: form,
         })
     },
     //排序

src/views/data-fill/wbs.vue

@@ -30,13 +30,13 @@
                                                 @keyup.enter="confirmAddFolder"
                                             />
                                             <div class="input-buttons">
-                                                <HcIcon name="check" class="confirm-icon cursor-pointer" @click="confirmAddFolder" />
+                                                <HcIcon name="check" class="confirm-icon cursor-pointer" :loading="confirmAddFolderLoad" @click="confirmAddFolder" />
                                                 <HcIcon name="close" class="cancel-icon cursor-pointer" @click="cancelAddFolder" />
                                             </div>
                                         </div>
         
                                         <!-- 文件夹列表容器（带滚动） -->
-                                        <div class="folder-list-container">
+                                        <div v-loading="collectLoad" class="folder-list-container">
                                             <div 
                                                 v-for="(folder, index) in collectList" 
                                                 :key="index" 
@@ -47,7 +47,7 @@
                                                     name="delete-bin" 
                                                     class="delete-icon cursor-pointer" 
                                                     style="color:white;"
-                                                    @click.stop="deleteFolder(index)"
+                                                    @click.stop="deleteFolder(index, folder)"
                                                 />
                                             </div>
                                         </div>
@@ -59,7 +59,7 @@
                             <HcIcon name="eye-off" style="color:#3F9EFF" class="cursor-pointer" />
                         </div>
                         <div>
-                            <HcIcon name="time" class="mr-3 cursor-pointer" style="color:#3F9EFF" />
+                            <HcIcon v-loading="lookLoading" name="time" class="mr-3 cursor-pointer" style="color:#3F9EFF" @click="lookHistory" />
                             <HcIcon name="article" style="color:gray" class="cursor-pointer" />
                         </div>
                     </div>
@@ -1451,7 +1451,7 @@
             title="添加到文件夹"
           
             is-footer-center
-            :loading="collectLoad"
+            :loading="saveCollectLoad"
             :footer="collectList.length > 0"
             @close="collectModalClose"
             @save="collectModalSave"
@@ -1463,7 +1463,7 @@
                 :rules="collectRules"
             >
                 <el-form-item label="文件夹" prop="id">
-                    <el-select v-model="collectForm.id" placeholder="请选择">
+                    <el-select v-model="collectForm.id" v-loading="collectLoad" placeholder="请选择" clearable @change="checkCollect">
                         <el-option v-for="item in collectList" :key="item.id" :label="item.name" :value="item.id" />
                     </el-select>
                 </el-form-item>
@@ -1483,7 +1483,7 @@
 </template>
 
 <script setup>
-import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
+import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useAppStore } from '~src/store'
 import { HcIsButton } from '~src/plugins/IsButtons'
@@ -3786,8 +3786,9 @@ const moveSaveClick = ()=>{
 // 收藏夹
 // 控制tooltip显示状态
 const collectListVisible = ref(false)
-const collectListClick = ()=>{
-    
+const collectListClick = async ()=>{
+   
+      await nextTick()
     getCollectList()
 }
 // 触发元素引用
@@ -3797,36 +3798,60 @@ const showAddInput = ref(false)
 // 新文件夹名称
 const newFolderName = ref('')
 // 文件夹列表
-const folders = ref([
-  { name: '文件夹名称166' },
-  { name: '文件夹名称26666666666' },
-  // 可以添加更多测试数据
-  // { name: '文件夹3' },
-  // { name: '文件夹4' },
-  // { name: '文件夹5' },
-  // { name: '文件夹6' } // 第6个会触发滚动
-])
+
 
 // 最多显示5个文件夹
+const confirmAddFolderLoad = ref(false)
 
 // 确认添加文件夹
-const confirmAddFolder = () => {
-  if (newFolderName.value.trim()) {
-    folders.value.unshift({ name: newFolderName.value.trim() })
-    newFolderName.value = ''
-    showAddInput.value = false
-  }
+const confirmAddFolder = async () => {
+
+if (!newFolderName.value.trim()) return window?.$message?.error('请输入文件夹名称')
+    confirmAddFolderLoad.value = true
+    const { error, code, msg } = await collectApi.saveOrUpdateFolder(
+        {
+ 
+            nodeId: primaryKeyId.value,
+            contractId: contractId.value,
+            name: newFolderName.value.trim(),
+            type:1,
+        },
+        false,
+    )
+    confirmAddFolderLoad.value = false
+    if (!error && code === 200) {
+        window?.$message?.success(msg)
+        newFolderName.value = ''
+        showAddInput.value = false
+        getCollectList()
+    } 
 }
 
 // 取消添加文件夹
-const cancelAddFolder = () => {
+const cancelAddFolder = async (id) => {
   newFolderName.value = ''
   showAddInput.value = false
+    
+}
+const removeCollect = async (id)=>{
+    const { error, code, msg } = await collectApi.deleteFolder({
+        id,
+    })
+    if (!error && code === 200) {
+        window?.$message?.success(msg)
+        getCollectList()
+    }
 }
 
 // 删除文件夹
-const deleteFolder = (index) => {
-  folders.value.splice(index, 1)
+const deleteFolder = async (index, item) => {
+//   collectList.value.splice(index, 1)
+  HcDelMsg(async (resolve) => {
+            await removeCollect(item.id)
+            resolve() //关闭弹窗的回调
+            collectListVisible.value = true
+
+        })
 }
 
 // 控制缩放状态的变量
@@ -3844,33 +3869,86 @@ const handleClick = () => {
 }
 
 //收藏
-
-const collectClick = (data)=>{
+const collectTreeData = ref({})
+const collectClick = async (data)=>{
     // console.log(data, 'collectClick')
     // if (data.isCollect === 0) {
     //     data.isCollect = 1
     // } else {
     //     data.isCollect = 0
     // }
+    collectTreeData.value = data
+
     if (data.isCollect === 0) {
         
      collectDialog.value = true
+     await nextTick()
+
      getCollectList()
     } else {
         console.log('取消收藏')
+        collectModalCancel()
         
     }
 
 }
+const collectModalCancel = async ()=>{
+     const { error, code, msg } = await collectApi.collect(
+        {
+            id:'',
+            nodeId: collectTreeData.value.primaryKeyId,
+            contractId: contractId.value,
+            name: '',
+            type:0,
+        },
+        false,
+    )
+    if (!error && code === 200) {
+        window?.$message?.success(msg)
+         collectTreeData.value.isCollect = 0
+
+        
+    }
+}
 const collectDialog = ref(false)
 const collectLoad = ref(false)
 const collectModalClose = ()=>{
     collectDialog.value = false
    
 }
+const checkCollect = (val)=>{
+
+    collectList.value.forEach(item => {
+        if (item.id === val) {
+            collectForm.value.name = item.name
+          
+        }
+    })
+
+
+}
+const saveCollectLoad = ref(false)
 const collectModalSave = async ()=>{
      const validate = await formValidate(collectFormRef.value)
      if (!validate) return
+     saveCollectLoad.value = true
+     const { error, code, msg } = await collectApi.collect(
+        {
+            id:collectForm.value.id,
+            nodeId: collectTreeData.value.primaryKeyId,
+            contractId: contractId.value,
+            name: collectForm.value.name,
+            type:1,
+        },
+        false,
+    )
+     saveCollectLoad.value = false
+    if (!error && code === 200) {
+        window?.$message?.success(msg)
+         collectTreeData.value.isCollect = 1
+
+         collectDialog.value = false
+    }
 }
 const collectFormRef = ref(null)
 const collectForm = ref({
@@ -3887,6 +3965,7 @@ const collectRules = ref({
   ],
 })
 const collectList = ref([])
+
 const getCollectList = async ()=>{
   collectLoad.value = true
     const { error, code, msg, data } = await collectApi.folderList(
@@ -3896,7 +3975,7 @@ const getCollectList = async ()=>{
     )
   collectLoad.value = false
     if (!error && code === 200) {
-         collectList.value = getObjValue(data)
+         collectList.value = getArrValue(data)
     } else {
         collectList.value = []
     }
@@ -3904,6 +3983,11 @@ const getCollectList = async ()=>{
 }
 const eyeClick = (data)=>{
     console.log(data, 'eyeClick')
+}
+//查看最近操作的节点
+const lookLoading = ref(false)
+const lookHistory = ()=>{
+
 }
 </script>