|
@@ -41,8 +41,31 @@
|
|
|
v-for="(folder, index) in collectList"
|
|
|
:key="index"
|
|
|
class="folder-item"
|
|
|
+ style="display: flex; align-items: center; gap: 8px;"
|
|
|
>
|
|
|
- <span class="folder-name">{{ folder.name }}</span>
|
|
|
+ <!-- 编辑状态显示输入框 -->
|
|
|
+ <el-input
|
|
|
+ v-if="folder.isEditing"
|
|
|
+ ref="editInput"
|
|
|
+ v-model="folder.editableName"
|
|
|
+ size="small"
|
|
|
+ @blur="handleEditBlur(folder)"
|
|
|
+ @keyup.enter="confirmEdit(index, folder)"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 非编辑状态显示文本 -->
|
|
|
+ <span
|
|
|
+ v-else
|
|
|
+ class="folder-name"
|
|
|
+ style="cursor: pointer;"
|
|
|
+ @click="startEdit(folder)"
|
|
|
+ >
|
|
|
+ {{ folder.name }}
|
|
|
+ </span>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <HcIcon v-if="folder.isEditing" name="check" class="cursor-pointer" style="color:white;" @click="confirmEdit(index, folder)" />
|
|
|
<HcIcon
|
|
|
name="delete-bin"
|
|
|
class="delete-icon cursor-pointer"
|
|
@@ -56,7 +79,8 @@
|
|
|
<HcIcon name="star-half" class="mr-3 cursor-pointer" style="color:rgb(255, 125, 67);" @click="collectListClick" />
|
|
|
</el-tooltip>
|
|
|
|
|
|
- <HcIcon name="eye-off" style="color:#3F9EFF" class="cursor-pointer" />
|
|
|
+ <HcIcon v-if="isLookHide" name="eye-off" style="color:#3F9EFF" class="cursor-pointer" @click="lookHideList" />
|
|
|
+ <HcIcon v-else name="eye" style="color:#3F9EFF" class="cursor-pointer" @click="handleClickBack" />
|
|
|
</div>
|
|
|
<div>
|
|
|
<HcIcon v-loading="lookLoading" name="time" class="mr-3 cursor-pointer" style="color:#3F9EFF" @click="lookHistory" />
|
|
@@ -128,6 +152,8 @@
|
|
|
:is-show-sync="userInfo?.role_id?.split(',').includes('1123598816738675201')"
|
|
|
@node-tap="wbsElTreeClick"
|
|
|
@menu-tap="ElTreeMenuClick"
|
|
|
+ @collect="collectClick"
|
|
|
+ @eye="eyeClick"
|
|
|
/>
|
|
|
</el-scrollbar>
|
|
|
<el-scrollbar
|
|
@@ -1556,8 +1582,16 @@ const getSearchTreeData = async (type) => {
|
|
|
if (type === 'history') {
|
|
|
response = await collectApi.saveHistory({
|
|
|
contractId: contractId.value || '',
|
|
|
- days: 5,
|
|
|
- tableOwner: authBtnTabKey.value,
|
|
|
+
|
|
|
+ tableOwner: authBtnTabKey.value,
|
|
|
+ queryValue: searchTreeVal.value,
|
|
|
+ })
|
|
|
+ } else if (type === 'hide') {
|
|
|
+ response = await collectApi.getHiddenTreeNode({
|
|
|
+
|
|
|
+ contractId: contractId.value,
|
|
|
+ tableOwner: authBtnTabKey.value,
|
|
|
+ queryValue: searchTreeVal.value,
|
|
|
})
|
|
|
} else {
|
|
|
response = await queryApi.getTreeNodeByQueryValueAndContractId({
|
|
@@ -3848,7 +3882,7 @@ const handleClick = () => {
|
|
|
|
|
|
//重新加载左边树
|
|
|
isLookHistory.value = false
|
|
|
-
|
|
|
+ isLookHide.value = true
|
|
|
isSearchTree.value = false
|
|
|
searchTreeVal.value = ''
|
|
|
isShowLeft.value = false
|
|
@@ -3858,15 +3892,10 @@ const handleClick = () => {
|
|
|
getTableDataAll()
|
|
|
}
|
|
|
|
|
|
+
|
|
|
//收藏
|
|
|
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) {
|
|
@@ -3966,11 +3995,81 @@ const getCollectList = async ()=>{
|
|
|
collectLoad.value = false
|
|
|
if (!error && code === 200) {
|
|
|
collectList.value = getArrValue(data)
|
|
|
+ collectList.value = getArrValue(data).map(folder => ({
|
|
|
+ ...folder,
|
|
|
+ isEditing: false, // 是否处于编辑状态
|
|
|
+ editableName: folder.name, // 编辑框绑定的值
|
|
|
+ originalName: folder.name, // 原始名称,用于取消编辑时恢复
|
|
|
+ }))
|
|
|
} else {
|
|
|
collectList.value = []
|
|
|
}
|
|
|
|
|
|
}
|
|
|
+// 开始编辑文件夹名称
|
|
|
+const startEdit = (folder) => {
|
|
|
+ collectList.value.forEach((ele)=>{
|
|
|
+ ele.isEditing = false
|
|
|
+
|
|
|
+ })
|
|
|
+ // 记录原始名称用于取消编辑时恢复
|
|
|
+ folder.originalName = folder.name
|
|
|
+ // 设置编辑状态并初始化编辑框的值
|
|
|
+ folder.isEditing = true
|
|
|
+ folder.editableName = folder.name
|
|
|
+
|
|
|
+ // 确保输入框渲染后自动聚焦
|
|
|
+ nextTick(() => {
|
|
|
+ const input = document.querySelector(`.folder-item:nth-child(${collectList.value.indexOf(folder) + 1}) .el-input__inner`)
|
|
|
+ if (input) input.focus()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 确认编辑
|
|
|
+const confirmEdit = async (index, folder) => {
|
|
|
+
|
|
|
+
|
|
|
+ // 简单验证
|
|
|
+ if (!folder.editableName.trim()) {
|
|
|
+ window.$message.warning('文件夹名称不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 调用修改文件夹名称的API
|
|
|
+ const { error, code, msg } = await collectApi.saveOrUpdateFolder({
|
|
|
+ nodeId: primaryKeyId.value,
|
|
|
+ contractId: contractId.value,
|
|
|
+ name: folder.editableName.trim(),
|
|
|
+ type:1,
|
|
|
+ id: folder.id,
|
|
|
+ })
|
|
|
+
|
|
|
+ if (!error && code === 200) {
|
|
|
+ // 更新成功,保存新名称
|
|
|
+
|
|
|
+ window.$message.success(msg)
|
|
|
+ folder.isEditing = false
|
|
|
+ getCollectList()
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+// 输入框失焦处理
|
|
|
+const handleEditBlur = (folder) => {
|
|
|
+ // 如果仍然处于编辑状态(未通过确认按钮提交),恢复原始名称
|
|
|
+ if (folder.isEditing) {
|
|
|
+ folder.editableName = folder.originalName
|
|
|
+ // folder.isEditing = false
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 获取文件夹列表的方法需要修改,为每个文件夹添加编辑相关属性
|
|
|
+
|
|
|
|
|
|
//查看最近操作的节点
|
|
|
const lookLoading = ref(false)
|
|
@@ -4014,6 +4113,25 @@ const hideTreeNode = async (data) => {
|
|
|
}, 1000)
|
|
|
}
|
|
|
}
|
|
|
+const isLookHide = ref(true)
|
|
|
+const handleClickBack = ()=>{
|
|
|
+ //重新加载左边树
|
|
|
+ isLookHide.value = true
|
|
|
+ isLookHistory.value = false
|
|
|
+
|
|
|
+ isSearchTree.value = false
|
|
|
+ searchTreeVal.value = ''
|
|
|
+ isShowLeft.value = false
|
|
|
+ setTimeout(() => {
|
|
|
+ isShowLeft.value = true
|
|
|
+ }, 500)
|
|
|
+ getTableDataAll()
|
|
|
+}
|
|
|
+const lookHideList = ()=>{
|
|
|
+ isLookHide.value = false
|
|
|
+ isSearchTree.value = true
|
|
|
+ getSearchTreeData('hide')
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|