diff --git a/src/api/publicService/docCenter.js b/src/api/publicService/docCenter.js
index 645c017..b72dd7c 100644
--- a/src/api/publicService/docCenter.js
+++ b/src/api/publicService/docCenter.js
@@ -44,3 +44,74 @@ export function uploadFileTagAPI(data = {}) {
         data,
     })
 }
+
+// 删除文档中心
+export function deleteDocCenterAPI(data = {}) {
+    return request({
+        url: '/screen/document/delete',
+        method: 'POST',
+        data,
+    })
+}
+
+// 移动文档/文件
+export function moveDocCenterAPI(data = {}) {
+    return request({
+        url: '/screen/document/move',
+        method: 'POST',
+        data,
+    })
+}
+
+// 复制文档/文件
+export function copyDocCenterAPI(data = {}) {
+    return request({
+        url: '/screen/document/copy',
+        method: 'POST',
+        data,
+    })
+}
+
+// 共享-获取部门树
+export function getShareDeptTreeAPI() {
+    return request({
+        url: '/system/user/deptTree',
+        method: 'GET',
+    })
+}
+
+// 共享-获取角色列表
+export function getShareRoleListAPI(params = { pageSize: 1000, pageNum: 1 }) {
+    return request({
+        url: '/system/role/list',
+        method: 'GET',
+        params,
+    })
+}
+
+// 共享-根据部门获取人员列表
+export function getShareUserListAPI(params = {}) {
+    return request({
+        url: '/system/user/list',
+        method: 'GET',
+        params,
+    })
+}
+
+// 共享-根据角色获取人员列表
+export function getShareUserListByRoleAPI(params = {}) {
+    return request({
+        url: '/system/role/authUser/allocatedList',
+        method: 'GET',
+        params,
+    })
+}
+
+// 共享-提交授权
+export function saveSharePermissionAPI(data = {}) {
+    return request({
+        url: '/screen/document/share',
+        method: 'POST',
+        data,
+    })
+}
diff --git a/src/views/publicService/docCenter/components/rightTable.vue b/src/views/publicService/docCenter/components/rightTable.vue
index afe6fa7..31ff690 100644
--- a/src/views/publicService/docCenter/components/rightTable.vue
+++ b/src/views/publicService/docCenter/components/rightTable.vue
@@ -84,33 +84,20 @@
                 >
                     <template slot-scope="scope">
                         <el-tag
-                            :type="getTypeTagType(scope.row.type)"
+                            :type="getTypeTagType(scope.row.fileType)"
                             size="small"
                         >
-                            {{ scope.row.type }}
+                            {{ scope.row.fileType == 0 ? '文件夹' : '文件' }}
                         </el-tag>
                     </template>
                 </el-table-column>
 
                 <el-table-column
-                    prop="tags"
+                    prop="labName"
                     label="标签"
                     width="150"
                     align="center"
                 >
-                    <template slot-scope="scope">
-                        <div class="tags-cell">
-                            <el-tag
-                                v-for="tag in scope.row.tags"
-                                :key="tag"
-                                size="mini"
-                                type="info"
-                                class="tag-item"
-                            >
-                                {{ tag }}
-                            </el-tag>
-                        </div>
-                    </template>
                 </el-table-column>
 
                 <el-table-column
@@ -189,6 +176,7 @@
                 <component
                     ref="componentRef"
                     :selectedNode="selectedNode"
+                    v-bind="dialogConfig.outerComponentProps"
                     :is="dialogConfig.outerComponent"
                 />
 
@@ -230,7 +218,10 @@ import Move from './tableCom/move.vue'
 import AddCopy from './tableCom/addCopy.vue'
 import TagFilter from './tableCom/tagFilter.vue'
 
-import { getDocCenterRightListAPI } from '@/api/publicService/docCenter'
+import {
+    getDocCenterRightListAPI,
+    deleteDocCenterAPI,
+} from '@/api/publicService/docCenter'
 export default {
     name: 'RightTable',
     props: {
@@ -267,6 +258,7 @@ export default {
                 searchValue: '',
                 parentId: '',
                 type: '',
+                labelIds: '',
             },
             tableData: [],
 
@@ -327,6 +319,7 @@ export default {
                 outerVisible: false,
                 outerWidth: '50%',
                 outerComponent: null,
+                outerComponentProps: {},
             },
             // 用于下载的文件列表
             selectedFilesForDownload: [],
@@ -376,7 +369,7 @@ export default {
 
         // 获取类型标签样式
         getTypeTagType(type) {
-            if (type === '文件夹') {
+            if (type == 0) {
                 return 'warning'
             } else if (type === 'docx') {
                 return 'primary'
@@ -409,6 +402,7 @@ export default {
             this.dialogConfig.outerTitle = '新建文档夹'
             this.dialogConfig.outerVisible = true
             this.dialogConfig.outerComponent = 'AddWord'
+            this.dialogConfig.outerComponentProps = {}
         },
 
         // 上传
@@ -417,6 +411,7 @@ export default {
             this.dialogConfig.outerTitle = '上传文件'
             this.dialogConfig.outerVisible = true
             this.dialogConfig.outerComponent = 'Upload'
+            this.dialogConfig.outerComponentProps = {}
         },
 
         // 移动
@@ -425,6 +420,7 @@ export default {
             this.dialogConfig.outerTitle = '移动'
             this.dialogConfig.outerVisible = true
             this.dialogConfig.outerComponent = 'Move'
+            this.dialogConfig.outerComponentProps = {}
         },
 
         // 删除
@@ -444,8 +440,20 @@ export default {
                     type: 'warning',
                 },
             )
-                .then(() => {
-                    this.$modal.msgSuccess('删除功能待实现')
+                .then(async () => {
+                    // this.$modal.msgSuccess('删除功能待实现')
+
+                    const res = await deleteDocCenterAPI({
+                        id: this.selectedRows.map((row) => row.id).join(','),
+                        parentId: this.selectedNode?.id,
+                    })
+
+                    if (res.code === 200) {
+                        this.$modal.msgSuccess('删除成功')
+                        this.getTableList()
+                    } else {
+                        this.$modal.msgError(res.message)
+                    }
                 })
                 .catch(() => {
                     this.$modal.msgInfo('已取消删除')
@@ -481,6 +489,10 @@ export default {
             }))
             this.dialogConfig.outerTitle = '共享'
             this.dialogConfig.outerVisible = true
+            this.dialogConfig.outerComponent = 'SharePermissionForm'
+            this.dialogConfig.outerComponentProps = {
+                selectedFiles: this.selectedFilesForShare,
+            }
         },
 
         // 添加副本
@@ -488,6 +500,8 @@ export default {
             // this.$emit('add-copy', this.selectedRows)
             this.dialogConfig.outerTitle = '添加副本'
             this.dialogConfig.outerVisible = true
+            this.dialogConfig.outerComponent = 'AddCopy'
+            this.dialogConfig.outerComponentProps = {}
         },
 
         // 查看
@@ -539,7 +553,7 @@ export default {
                 const res = await this.$refs.componentRef.submit()
                 console.log(res, '新增结果')
                 // this.$modal.msgSuccess('操作成功')
-                // this.dialogConfig.outerVisible = false
+                this.dialogConfig.outerVisible = false
                 // 刷新列表
                 this.getTableList()
 
@@ -577,16 +591,20 @@ export default {
         },
 
         // 处理标签查询
-        handleTagQuery(selectedTags) {
-            console.log('选中的标签:', selectedTags)
-            // 这里可以根据选中的标签进行数据筛选
-            // this.$modal.msgSuccess('标签筛选功能待实现')
+        handleTagQuery(tagIds) {
+            this.queryParams.pageNum = 1
+            this.queryParams.labelIds = Array.isArray(tagIds)
+                ? tagIds.join(',')
+                : ''
+            this.getTableList()
             this.tagFilterVisible = false
         },
 
         // 处理标签重置
         handleTagReset() {
-            console.log('重置标签筛选')
+            this.queryParams.labelIds = ''
+            this.queryParams.pageNum = 1
+            this.getTableList()
             this.$modal.msgInfo('已重置标签筛选')
         },
 
diff --git a/src/views/publicService/docCenter/components/tableCom/TagSelector.vue b/src/views/publicService/docCenter/components/tableCom/TagSelector.vue
index 0708d09..bba31bd 100644
--- a/src/views/publicService/docCenter/components/tableCom/TagSelector.vue
+++ b/src/views/publicService/docCenter/components/tableCom/TagSelector.vue
@@ -27,7 +27,7 @@
         <div class="tags-container" v-loading="loading">
             <div
                 v-for="category in filteredCategories"
-                :key="category.typeId"
+                :key="category.key"
                 class="category-section"
             >
                 <div class="category-title"># {{ category.typeName }} #</div>
@@ -124,13 +124,22 @@ export default {
         // 初始化选中的标签
         initSelectedTags() {
             if (this.selectedTags && this.selectedTags.length > 0) {
-                this.selectedTagIds = this.selectedTags.map((tag) => {
-                    if (typeof tag === 'object') {
-                        // 使用 categoryName_labelName 作为唯一标识
-                        return tag.id || `${tag.typeName}_${tag.labelName}`
-                    }
-                    return tag
-                })
+                this.selectedTagIds = this.selectedTags
+                    .map((tag) => {
+                        if (typeof tag === 'object') {
+                            return (
+                                (tag.id ||
+                                    tag.typeId ||
+                                    tag.labelId ||
+                                    tag.value ||
+                                    tag.labelCode) ??
+                                ''
+                            )
+                        }
+                        return tag ?? ''
+                    })
+                    .filter((id) => id !== '')
+                    .map((id) => String(id))
             } else {
                 this.selectedTagIds = []
             }
@@ -150,21 +159,32 @@ export default {
 
                 // 转换为分类数组格式
                 this.categories = Object.keys(tagsData)
-                    .map((categoryName) => {
+                    .map((categoryName, index) => {
                         const tagList = tagsData[categoryName] || []
-                        // 从第一个标签获取分类的 typeId（同一分类下的标签 typeId 相同）
-                        const categoryTypeId =
-                            tagList.length > 0 ? tagList[0].typeId : null
-
                         return {
-                            typeId: categoryTypeId,
+                            key: `${categoryName}_${index}`,
                             typeName: categoryName,
-                            tags: tagList.map((tag) => ({
-                                id: `${categoryName}_${tag.labelName}`,
-                                labelName: tag.labelName,
-                                typeId: tag.typeId,
-                                typeName: categoryName,
-                            })),
+                            tags: tagList
+                                .map((tag) => {
+                                    const rawId =
+                                        tag.id ??
+                                        tag.typeId ??
+                                        tag.labelId ??
+                                        tag.value ??
+                                        tag.labelCode
+                                    if (!rawId) {
+                                        return null
+                                    }
+                                    return {
+                                        id: String(rawId),
+                                        labelName:
+                                            tag.labelName ?? tag.name ?? '',
+                                        typeId: tag.typeId ?? rawId,
+                                        typeName: categoryName,
+                                        raw: tag,
+                                    }
+                                })
+                                .filter(Boolean),
                         }
                     })
                     .filter((category) => category.tags.length > 0)
@@ -182,16 +202,17 @@ export default {
 
         // 判断标签是否被选中
         isTagSelected(tagId) {
-            return this.selectedTagIds.includes(tagId)
+            return this.selectedTagIds.includes(String(tagId))
         },
 
         // 切换标签选中状态
         toggleTag(tag) {
-            const index = this.selectedTagIds.indexOf(tag.id)
+            const tagId = String(tag.id)
+            const index = this.selectedTagIds.indexOf(tagId)
             if (index > -1) {
                 this.selectedTagIds.splice(index, 1)
             } else {
-                this.selectedTagIds.push(tag.id)
+                this.selectedTagIds.push(tagId)
             }
         },
 
@@ -199,15 +220,15 @@ export default {
         getSelectedTags() {
             const selectedTags = []
             const typeIdSet = new Set() // 用于收集去重后的 typeId
-
             this.categories.forEach((category) => {
                 category.tags.forEach((tag) => {
-                    if (this.selectedTagIds.includes(tag.id)) {
+                    if (this.selectedTagIds.includes(String(tag.id))) {
                         selectedTags.push({
-                            id: tag.id,
+                            id: String(tag.id),
                             labelName: tag.labelName,
                             typeId: tag.typeId,
                             typeName: tag.typeName,
+                            raw: tag.raw,
                         })
                         // 收集 typeId
                         if (tag.typeId) {
@@ -217,9 +238,14 @@ export default {
                 })
             })
 
+            const tagIds = selectedTags.map((tag) => tag.id)
+            const tagLabels = selectedTags.map((tag) => tag.labelName)
+
             // 返回选中的标签和去重后的 typeId 数组
             return {
                 tags: selectedTags,
+                tagIds,
+                tagLabels,
                 typeIds: Array.from(typeIdSet),
             }
         },
diff --git a/src/views/publicService/docCenter/components/tableCom/addCopy.vue b/src/views/publicService/docCenter/components/tableCom/addCopy.vue
index 6398e03..a162e1c 100644
--- a/src/views/publicService/docCenter/components/tableCom/addCopy.vue
+++ b/src/views/publicService/docCenter/components/tableCom/addCopy.vue
@@ -1,9 +1,247 @@
 <template>
-    <div> 添加副本 </div>
+    <!-- 添加副本 -->
+    <div class="move-container">
+        <div class="tree-wrapper" v-loading="loading">
+            <el-tree
+                v-if="treeData.length"
+                ref="treeRef"
+                node-key="id"
+                class="move-tree"
+                :data="treeData"
+                :props="treeProps"
+                highlight-current
+                default-expand-all
+                draggable
+                :allow-drag="allowDrag"
+                :allow-drop="allowDrop"
+                :expand-on-click-node="false"
+                @node-drop="handleNodeDrop"
+            >
+                <span class="tree-node" slot-scope="{ data }">
+                    <i :class="getNodeIcon(data)" class="node-icon"></i>
+                    <span class="node-label" :title="data.name">
+                        {{ data.name }}
+                    </span>
+                    <el-tag size="mini" v-if="data.fileType === 0" type="info">
+                        文件夹
+                    </el-tag>
+                </span>
+            </el-tree>
+            <div v-else class="empty-holder">暂无可移动数据</div>
+        </div>
+        <div class="tips">
+            <p class="tips-title">操作提示</p>
+            <p>1. 仅文件（fileType ≠ 0）可被拖拽。</p>
+            <p>2. 仅支持拖拽到文件夹节点内。</p>
+            <p>3. 拖拽到目标组后会立即复制副本并同步至后台。</p>
+        </div>
+    </div>
 </template>
 
 <script>
-export default {}
+import { copyDocCenterAPI } from '@/api/publicService/docCenter'
+
+export default {
+    name: 'AddCopy',
+    props: {
+        selectedNode: {
+            type: Object,
+            default: () => ({}),
+        },
+    },
+    data() {
+        return {
+            treeData: [],
+            treeProps: {
+                children: 'childTree',
+                label: 'name',
+            },
+            loading: false,
+            copyActions: [],
+        }
+    },
+    watch: {
+        selectedNode: {
+            handler(newVal) {
+                this.initTree(newVal)
+            },
+            immediate: true,
+            deep: true,
+        },
+    },
+    methods: {
+        initTree(node) {
+            if (!node || !node.id) {
+                this.treeData = []
+                return
+            }
+            this.treeData = [this.cloneNode(node)]
+            this.copyActions = []
+        },
+
+        cloneNode(node) {
+            const childTree = Array.isArray(node.childTree)
+                ? node.childTree.map((child) => this.cloneNode(child))
+                : []
+            return {
+                ...node,
+                childTree,
+            }
+        },
+
+        getNodeIcon(data) {
+            // console.log(data.fileType, 'data.fileType')
+            return data.fileType == 0 ? 'el-icon-folder' : 'el-icon-document'
+        },
+
+        // 是否允许拖拽
+        allowDrag(draggingNode) {
+            const data = draggingNode?.data || {}
+            return data.fileType == 1
+        },
+        // 是否允许放下
+        allowDrop(draggingNode, dropNode, type) {
+            if (type !== 'inner') {
+                return false
+            }
+            const dropData = dropNode?.data || {}
+            if (dropData.fileType == 1) {
+                return false
+            }
+
+            const dragData = draggingNode?.data || {}
+            if (!dragData.id || dragData.id === dropData.id) {
+                return false
+            }
+
+            return true
+        },
+
+        async handleNodeDrop(draggingNode, dropNode) {
+            const source = draggingNode?.data
+            const target = dropNode?.data
+
+            if (!source?.id || !target?.id) {
+                this.$message.error('无法获取拖拽节点信息')
+                return
+            }
+
+            await this.copyDocument(
+                source.id,
+                target.id,
+                source.parentId,
+                target.parentIds,
+            )
+        },
+
+        async copyDocument(documentId, targetParentId, parentId, parentIds) {
+            // 组装参数
+            const params = {
+                id: documentId, // 自身id
+                toId: targetParentId,
+                newParentId: targetParentId, // 目标i
+                parentId: parentId, // 目标父级id
+                parentIds: parentIds,
+            }
+            this.loading = true
+            try {
+                const res = await copyDocCenterAPI(params)
+
+                if (res.code === 200) {
+                    this.$message.success('复制成功')
+                    this.recordAction(documentId, targetParentId)
+                } else {
+                    this.$message.error(res.msg || res.message || '复制失败')
+                }
+            } catch (error) {
+                this.$message.error(error.message || '复制失败')
+            } finally {
+                this.loading = false
+            }
+        },
+
+        recordAction(documentId, targetParentId) {
+            const idx = this.copyActions.findIndex(
+                (item) => item.documentId === documentId,
+            )
+            const payload = { documentId, targetParentId }
+            if (idx > -1) {
+                this.$set(this.copyActions, idx, payload)
+            } else {
+                this.copyActions.push(payload)
+            }
+        },
+
+        submit() {
+            if (this.copyActions.length === 0) {
+                return Promise.reject(new Error('请先拖拽需要复制的文件'))
+            }
+            return Promise.resolve({
+                copied: this.copyActions,
+            })
+        },
+    },
+}
 </script>
 
-<style></style>
+<style scoped lang="scss">
+.move-container {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.tree-wrapper {
+    min-height: 320px;
+    border: 1px solid #f0f0f0;
+    border-radius: 6px;
+    padding: 12px;
+    background: #fafafa;
+}
+
+.move-tree {
+    max-height: 360px;
+    overflow: auto;
+
+    .tree-node {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+
+        .node-icon {
+            font-size: 16px;
+            color: #409eff;
+        }
+
+        .node-label {
+            max-width: 200px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+    }
+}
+
+.empty-holder {
+    height: 180px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #909399;
+}
+
+.tips {
+    font-size: 13px;
+    color: #666;
+    line-height: 1.8;
+    background: #fdf6ec;
+    border: 1px solid #f5dab1;
+    padding: 12px;
+    border-radius: 6px;
+
+    .tips-title {
+        font-weight: 600;
+        margin-bottom: 4px;
+    }
+}
+</style>
diff --git a/src/views/publicService/docCenter/components/tableCom/move.vue b/src/views/publicService/docCenter/components/tableCom/move.vue
index d749baa..152e302 100644
--- a/src/views/publicService/docCenter/components/tableCom/move.vue
+++ b/src/views/publicService/docCenter/components/tableCom/move.vue
@@ -1,9 +1,303 @@
 <template>
-    <div> 移动 </div>
+    <div class="move-container">
+        <div class="tree-wrapper" v-loading="loading">
+            <el-tree
+                v-if="treeData.length"
+                ref="treeRef"
+                node-key="id"
+                class="move-tree"
+                :data="treeData"
+                :props="treeProps"
+                highlight-current
+                default-expand-all
+                draggable
+                :allow-drag="allowDrag"
+                :allow-drop="allowDrop"
+                :expand-on-click-node="false"
+                @node-drop="handleNodeDrop"
+            >
+                <span class="tree-node" slot-scope="{ data }">
+                    <i :class="getNodeIcon(data)" class="node-icon"></i>
+                    <span class="node-label" :title="data.name">
+                        {{ data.name }}
+                    </span>
+                    <el-tag size="mini" v-if="data.fileType === 0" type="info">
+                        文件夹
+                    </el-tag>
+                </span>
+            </el-tree>
+            <div v-else class="empty-holder">暂无可移动数据</div>
+        </div>
+        <div class="tips">
+            <p class="tips-title">操作提示</p>
+            <p>1. 仅文件（fileType ≠ 0）可被拖拽。</p>
+            <p>2. 仅支持拖拽到文件夹节点内。</p>
+            <p>3. 拖拽到目标组后会立即同步至后台。</p>
+        </div>
+    </div>
 </template>
 
 <script>
-export default {}
+import { moveDocCenterAPI } from '@/api/publicService/docCenter'
+
+export default {
+    name: 'Move',
+    props: {
+        selectedNode: {
+            type: Object,
+            default: () => ({}),
+        },
+    },
+    data() {
+        return {
+            treeData: [],
+            treeProps: {
+                children: 'childTree',
+                label: 'name',
+            },
+            loading: false,
+            moveActions: [],
+        }
+    },
+    watch: {
+        selectedNode: {
+            handler(newVal) {
+                this.initTree(newVal)
+            },
+            immediate: true,
+            deep: true,
+        },
+    },
+    methods: {
+        initTree(node) {
+            if (!node || !node.id) {
+                this.treeData = []
+                return
+            }
+            this.treeData = [this.cloneNode(node)]
+            this.moveActions = []
+        },
+
+        cloneNode(node) {
+            const childTree = Array.isArray(node.childTree)
+                ? node.childTree.map((child) => this.cloneNode(child))
+                : []
+            return {
+                ...node,
+                childTree,
+            }
+        },
+
+        getNodeIcon(data) {
+            return data.fileType == 0 ? 'el-icon-folder' : 'el-icon-document'
+        },
+
+        // 是否允许拖拽
+        allowDrag(draggingNode) {
+            const data = draggingNode?.data || {}
+            return data.fileType == 1
+        },
+        // 是否允许放下
+        allowDrop(draggingNode, dropNode, type) {
+            if (type !== 'inner') {
+                return false
+            }
+            const dropData = dropNode?.data || {}
+            if (dropData.fileType == 1) {
+                return false
+            }
+
+            const dragData = draggingNode?.data || {}
+            if (!dragData.id || dragData.id === dropData.id) {
+                return false
+            }
+
+            return true
+        },
+
+        async handleNodeDrop(draggingNode, dropNode) {
+            const source = draggingNode?.data
+            const target = dropNode?.data
+
+            if (!source?.id || !target?.id) {
+                this.$message.error('无法获取拖拽节点信息')
+                return
+            }
+
+            await this.moveDocument(
+                source.id,
+                target.id,
+                source.parentId,
+                target.parentIds,
+            )
+        },
+
+        async moveDocument(documentId, targetParentId, parentId, parentIds) {
+            // 组装参数
+            const params = {
+                id: documentId, // 自身id
+                newParentId: targetParentId, // 目标id
+                parentId: parentId, // 目标父级id
+                parentIds: parentIds,
+            }
+            this.loading = true
+            try {
+                const res = await moveDocCenterAPI(params)
+
+                if (res.code === 200) {
+                    this.$message.success('移动成功')
+                    this.recordAction(documentId, targetParentId)
+                    this.updateLocalTree(documentId, targetParentId)
+                } else {
+                    this.$message.error(res.msg || res.message || '移动失败')
+                }
+            } catch (error) {
+                this.$message.error(error.message || '移动失败')
+            } finally {
+                this.loading = false
+            }
+        },
+
+        recordAction(documentId, targetParentId) {
+            const idx = this.moveActions.findIndex(
+                (item) => item.documentId === documentId,
+            )
+            const payload = { documentId, targetParentId }
+            if (idx > -1) {
+                this.$set(this.moveActions, idx, payload)
+            } else {
+                this.moveActions.push(payload)
+            }
+        },
+
+        updateLocalTree(sourceId, targetId) {
+            const { node: sourceNode, parent } = this.findNodeAndParent(
+                this.treeData,
+                sourceId,
+            )
+            if (!sourceNode) {
+                return
+            }
+
+            if (parent) {
+                const newChildren = (parent.childTree || []).filter(
+                    (child) => child.id !== sourceId,
+                )
+                this.$set(parent, 'childTree', newChildren)
+            } else {
+                this.treeData = this.treeData.filter(
+                    (item) => item.id !== sourceId,
+                )
+            }
+
+            const targetNode = this.findNode(this.treeData, targetId)
+            if (targetNode) {
+                if (!Array.isArray(targetNode.childTree)) {
+                    this.$set(targetNode, 'childTree', [])
+                }
+                targetNode.childTree.push(sourceNode)
+            }
+        },
+
+        findNodeAndParent(nodes, id, parent = null) {
+            for (const node of nodes) {
+                if (node.id === id) {
+                    return { node, parent }
+                }
+                const children = node.childTree || []
+                if (children.length > 0) {
+                    const result = this.findNodeAndParent(children, id, node)
+                    if (result.node) {
+                        return result
+                    }
+                }
+            }
+            return { node: null, parent: null }
+        },
+
+        findNode(nodes, id) {
+            for (const node of nodes) {
+                if (node.id === id) {
+                    return node
+                }
+                const childResult = this.findNode(node.childTree || [], id)
+                if (childResult) {
+                    return childResult
+                }
+            }
+            return null
+        },
+
+        submit() {
+            if (this.moveActions.length === 0) {
+                return Promise.reject(new Error('请先拖拽需要移动的文件'))
+            }
+            return Promise.resolve({
+                moved: this.moveActions,
+            })
+        },
+    },
+}
 </script>
 
-<style></style>
+<style scoped lang="scss">
+.move-container {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.tree-wrapper {
+    min-height: 320px;
+    border: 1px solid #f0f0f0;
+    border-radius: 6px;
+    padding: 12px;
+    background: #fafafa;
+}
+
+.move-tree {
+    max-height: 360px;
+    overflow: auto;
+
+    .tree-node {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+
+        .node-icon {
+            font-size: 16px;
+            color: #409eff;
+        }
+
+        .node-label {
+            max-width: 200px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+    }
+}
+
+.empty-holder {
+    height: 180px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #909399;
+}
+
+.tips {
+    font-size: 13px;
+    color: #666;
+    line-height: 1.8;
+    background: #fdf6ec;
+    border: 1px solid #f5dab1;
+    padding: 12px;
+    border-radius: 6px;
+
+    .tips-title {
+        font-weight: 600;
+        margin-bottom: 4px;
+    }
+}
+</style>
diff --git a/src/views/publicService/docCenter/components/tableCom/share.vue b/src/views/publicService/docCenter/components/tableCom/share.vue
index 3af6bec..26345a4 100644
--- a/src/views/publicService/docCenter/components/tableCom/share.vue
+++ b/src/views/publicService/docCenter/components/tableCom/share.vue
@@ -1,74 +1,220 @@
 <template>
-    <div class="permission-form">
+    <div class="share-permission-form">
+        <section class="share-section">
+            <div class="section-title">共享文件</div>
+            <div class="file-list" v-if="selectedFiles.length">
+                <el-tag
+                    size="mini"
+                    effect="plain"
+                    v-for="file in selectedFiles"
+                    :key="file.id"
+                >
+                    {{ file.name }}
+                </el-tag>
+            </div>
+            <el-empty
+                v-else
+                description="尚未选择文件"
+                :image-size="80"
+            ></el-empty>
+        </section>
+
         <el-form
-            ref="permissionForm"
+            ref="shareFormRef"
             :model="form"
             :rules="rules"
-            label-width="100px"
-            class="permission-form-content"
+            label-width="90px"
+            class="share-form"
         >
-            <!-- 授权对象 -->
-            <el-form-item
-                label="授权对象"
-                prop="authorizedObject"
-                class="form-item"
-            >
-                <el-select
-                    v-model="form.authorizedObject"
-                    placeholder="请选择"
-                    clearable
-                    filterable
-                    style="width: 100%"
-                    @change="handleAuthorizedObjectChange"
+            <el-form-item label="授权对象" prop="shareTargets">
+                <el-input
+                    readonly
+                    placeholder="请选择授权对象"
+                    :value="shareTargetNames"
+                    @focus="openUserPicker"
                 >
-                    <el-option
-                        v-for="item in authorizedObjectOptions"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value"
-                    />
-                </el-select>
+                    <i
+                        slot="suffix"
+                        class="el-input__icon el-icon-more"
+                        @click.stop="openUserPicker"
+                    ></i>
+                </el-input>
+                <div class="selected-user-tags" v-if="form.shareTargets.length">
+                    <el-tag
+                        v-for="user in form.shareTargets"
+                        :key="user.id"
+                        closable
+                        @close="removeSelectedUser(user.userId)"
+                    >
+                        {{ user.nickName }}
+                    </el-tag>
+                </div>
             </el-form-item>
 
-            <!-- 权限设置 -->
-            <el-form-item label="权限" prop="permission" class="form-item">
-                <el-radio-group
-                    v-model="form.permission"
-                    @change="handlePermissionChange"
-                >
-                    <div class="permission-options">
-                        <el-radio label="view" class="permission-radio">
-                            仅可查看
-                        </el-radio>
-                        <el-radio
-                            label="view_download"
-                            class="permission-radio"
-                        >
-                            可查看/下载
-                        </el-radio>
-                        <el-radio label="edit" class="permission-radio">
-                            可编辑
-                        </el-radio>
-                        <el-radio label="manage" class="permission-radio">
-                            可管理
-                        </el-radio>
-                    </div>
+            <el-form-item label="权限类型" prop="permission">
+                <el-radio-group v-model="form.permission" size="small">
+                    <el-radio-button label="1">仅可查看</el-radio-button>
+                    <el-radio-button label="2">可查看/下载</el-radio-button>
+                    <el-radio-button label="3">可编辑</el-radio-button>
+                    <el-radio-button label="4">可管理</el-radio-button>
                 </el-radio-group>
             </el-form-item>
         </el-form>
+
+        <el-dialog
+            title="人员选择"
+            append-to-body
+            :visible.sync="userPickerVisible"
+            width="80%"
+            class="user-picker-dialog"
+        >
+            <div class="user-picker">
+                <div class="left-panel">
+                    <el-tabs
+                        v-model="activeSelectorTab"
+                        class="selector-tabs"
+                        @tab-click="handleTabClick"
+                    >
+                        <el-tab-pane label="部门" name="dept">
+                            <div class="tab-toolbar">
+                                <el-input
+                                    v-model="deptKeyword"
+                                    size="mini"
+                                    placeholder="搜索部门"
+                                    clearable
+                                    prefix-icon="el-icon-search"
+                                />
+                                <el-button
+                                    type="text"
+                                    size="mini"
+                                    class="toggle-btn"
+                                    @click="toggleDeptExpand"
+                                >
+                                    {{ deptTreeExpanded ? '折叠' : '展开' }}
+                                </el-button>
+                            </div>
+                            <el-tree
+                                ref="deptTreeRef"
+                                class="dept-tree"
+                                :data="deptTree"
+                                :props="deptTreeProps"
+                                node-key="id"
+                                :highlight-current="true"
+                                :expand-on-click-node="false"
+                                :default-expand-all="false"
+                                :filter-node-method="filterDeptNode"
+                                :current-node-key="activeDeptId"
+                                v-loading="deptLoading"
+                                @node-click="handleDeptClick"
+                            />
+                        </el-tab-pane>
+                        <el-tab-pane label="角色" name="role">
+                            <div class="tab-toolbar">
+                                <el-input
+                                    v-model="roleKeyword"
+                                    size="mini"
+                                    placeholder="搜索角色"
+                                    clearable
+                                    prefix-icon="el-icon-search"
+                                />
+                            </div>
+                            <el-scrollbar
+                                class="role-list"
+                                v-loading="roleLoading"
+                            >
+                                <div
+                                    v-for="role in filteredRoleList"
+                                    :key="role.id"
+                                    class="role-item"
+                                    :class="{
+                                        active: activeRoleId === role.id,
+                                    }"
+                                    @click="handleRoleClick(role)"
+                                >
+                                    {{ role.name }}
+                                </div>
+                                <el-empty
+                                    v-if="
+                                        !filteredRoleList.length && !roleLoading
+                                    "
+                                    :image-size="60"
+                                    description="暂无角色"
+                                />
+                            </el-scrollbar>
+                        </el-tab-pane>
+                    </el-tabs>
+                </div>
+
+                <div class="right-panel">
+                    <div class="panel-header">
+                        <span>人员列表</span>
+                        <!-- <el-input
+                            size="mini"
+                            placeholder="搜索姓名"
+                            prefix-icon="el-icon-search"
+                            v-model="userKeyword"
+                            @keyup.enter.native="fetchUserList"
+                            clearable
+                            @clear="fetchUserList"
+                        /> -->
+                    </div>
+                    <el-table
+                        ref="userTableRef"
+                        :data="userList"
+                        height="320"
+                        border
+                        v-loading="userTableLoading"
+                        @selection-change="handleUserSelectionChange"
+                    >
+                        <el-table-column type="selection" width="60" />
+                        <el-table-column type="index" label="序号" width="80" />
+                        <el-table-column
+                            prop="nickName"
+                            label="姓名"
+                            min-width="200"
+                            show-overflow-tooltip
+                        />
+                    </el-table>
+                </div>
+            </div>
+
+            <div class="panel-title selected-title">
+                已选人员（{{ tempSelectedUsers.length }}）
+            </div>
+            <div class="selected-user-tags" v-if="tempSelectedUsers.length">
+                <el-tag
+                    v-for="user in tempSelectedUsers"
+                    :key="user.id"
+                    closable
+                    @close="removeTempSelected(user.userId)"
+                >
+                    {{ user.nickName }}
+                </el-tag>
+            </div>
+            <el-empty v-else description="暂未选择人员" :image-size="60" />
+
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="userPickerVisible = false">取消</el-button>
+                <el-button type="primary" @click="confirmUserSelection">
+                    确定
+                </el-button>
+            </span>
+        </el-dialog>
     </div>
 </template>
 
 <script>
+import {
+    getShareDeptTreeAPI,
+    getShareRoleListAPI,
+    getShareUserListAPI,
+    getShareUserListByRoleAPI,
+    saveSharePermissionAPI,
+} from '@/api/publicService/docCenter'
+
 export default {
     name: 'SharePermissionForm',
     props: {
-        // 是否显示弹框
-        visible: {
-            type: Boolean,
-            default: false,
-        },
-        // 选中的文件列表
         selectedFiles: {
             type: Array,
             default: () => [],
@@ -78,13 +224,15 @@ export default {
         return {
             loading: false,
             form: {
-                authorizedObject: '', // 授权对象
-                permission: 'view', // 权限，默认仅可查看
+                shareTargets: [],
+                permission: '3',
             },
             rules: {
-                authorizedObject: [
+                shareTargets: [
                     {
                         required: true,
+                        type: 'array',
+                        min: 1,
                         message: '请选择授权对象',
                         trigger: 'change',
                     },
@@ -92,136 +240,435 @@ export default {
                 permission: [
                     {
                         required: true,
-                        message: '请选择权限',
+                        message: '请选择权限类型',
                         trigger: 'change',
                     },
                 ],
             },
-            // 授权对象选项
-            authorizedObjectOptions: [
-                { value: 'user_001', label: '张三' },
-                { value: 'user_002', label: '李四' },
-                { value: 'user_003', label: '王五' },
-                { value: 'dept_001', label: '技术部' },
-                { value: 'dept_002', label: '产品部' },
-                { value: 'role_001', label: '管理员' },
-                { value: 'role_002', label: '编辑者' },
-            ],
+            userPickerVisible: false,
+            deptTree: [],
+            deptTreeProps: {
+                children: 'children',
+                label: 'label',
+            },
+            deptLoading: false,
+            roleList: [],
+            roleLoading: false,
+            activeDeptId: null,
+            activeRoleId: null,
+            userKeyword: '',
+            deptKeyword: '',
+            roleKeyword: '',
+            activeSelectorTab: 'dept',
+            deptTreeExpanded: true,
+            userList: [],
+            userTableLoading: false,
+            tempSelectedUsers: [],
         }
     },
+    computed: {
+        shareTargetNames() {
+            if (!this.form.shareTargets.length) return ''
+            return this.form.shareTargets
+                .map((item) => item.nickName)
+                .join('，')
+        },
+        filteredRoleList() {
+            if (!this.roleKeyword.trim()) {
+                return this.roleList
+            }
+            const keyword = this.roleKeyword.trim().toLowerCase()
+            return this.roleList.filter((role) =>
+                (role.name || '').toLowerCase().includes(keyword),
+            )
+        },
+    },
     watch: {
-        visible(newVal) {
-            if (newVal) {
-                this.resetForm()
+        deptKeyword(val) {
+            if (this.$refs.deptTreeRef) {
+                this.$refs.deptTreeRef.filter(val)
             }
         },
     },
+    created() {
+        this.initStaticData()
+    },
     methods: {
-        // 重置表单
-        resetForm() {
-            this.form = {
-                authorizedObject: '',
-                permission: 'view',
+        async initStaticData() {
+            this.fetchDeptTree()
+            this.fetchRoleList()
+        },
+        openUserPicker() {
+            this.tempSelectedUsers = [...this.form.shareTargets]
+            this.userPickerVisible = true
+            if (!this.deptTree.length) {
+                this.fetchDeptTree()
             }
-            this.$nextTick(() => {
-                this.$refs.permissionForm &&
-                    this.$refs.permissionForm.clearValidate()
+            if (!this.roleList.length) {
+                this.fetchRoleList()
+            }
+            if (this.activeDeptId && this.activeRoleId) {
+                this.fetchUserList()
+            }
+        },
+        async fetchDeptTree() {
+            this.deptLoading = true
+            try {
+                const res = await getShareDeptTreeAPI()
+                const treeData = res.data || res.rows || []
+                this.deptTree = this.normalizeDeptTree(treeData)
+                if (!this.activeDeptId && this.deptTree.length) {
+                    this.activeDeptId = this.deptTree[0].id
+                }
+                this.$nextTick(() => {
+                    if (this.$refs.deptTreeRef && this.deptKeyword) {
+                        this.$refs.deptTreeRef.filter(this.deptKeyword)
+                    }
+                })
+                if (this.activeDeptId && this.activeRoleId) {
+                    this.fetchUserList()
+                }
+            } finally {
+                this.deptLoading = false
+            }
+        },
+        async fetchRoleList() {
+            this.roleLoading = true
+            try {
+                const res = await getShareRoleListAPI()
+                const list = res.rows || res.data || []
+                this.roleList = list.map((item) => ({
+                    id: item.roleId ?? item.id,
+                    name: item.roleName ?? item.name,
+                }))
+                if (!this.activeRoleId && this.roleList.length) {
+                    this.activeRoleId = this.roleList[0].id
+                }
+                if (this.activeDeptId && this.activeRoleId) {
+                    this.fetchUserList()
+                }
+            } finally {
+                this.roleLoading = false
+            }
+        },
+        async fetchUserList() {
+            if (!this.activeDeptId && !this.activeRoleId) return
+            this.userTableLoading = true
+            try {
+                // const res = await getShareUserListAPI({
+                //     deptId: this.activeDeptId,
+                //     roleId: this.activeRoleId,
+                //     keyword: this.userKeyword.trim(),
+                // })
+
+                const API =
+                    this.activeSelectorTab == 'dept'
+                        ? getShareUserListAPI
+                        : getShareUserListByRoleAPI
+                const params =
+                    this.activeSelectorTab == 'dept'
+                        ? {
+                              pageSize: 1000,
+                              pageNum: 1,
+                              deptId: this.activeDeptId,
+                          }
+                        : {
+                              pageSize: 1000,
+                              pageNum: 1,
+                              roleId: this.activeRoleId,
+                          }
+                const res = await API(params)
+                this.userList = res.rows || []
+                this.syncTableSelection()
+            } finally {
+                this.userTableLoading = false
+            }
+        },
+        handleDeptClick(node) {
+            this.activeDeptId = node.id
+            this.activeSelectorTab = 'dept'
+            this.fetchUserList()
+        },
+        handleRoleClick(role) {
+            this.activeRoleId = role.id
+            this.activeSelectorTab = 'role'
+            this.fetchUserList()
+        },
+        handleUserSelectionChange(selection) {
+            const currentIds = this.userList.map((item) => item.userId)
+            this.tempSelectedUsers = this.tempSelectedUsers.filter((user) => {
+                if (!currentIds.includes(user.userId)) return true
+                return selection.some((item) => item.userId === user.userId)
+            })
+            selection.forEach((item) => {
+                if (
+                    !this.tempSelectedUsers.some(
+                        (user) => user.userId === item.userId,
+                    )
+                ) {
+                    this.tempSelectedUsers.push(item)
+                }
             })
         },
-
-        // 授权对象变化
-        handleAuthorizedObjectChange(value) {
-            console.log('授权对象变化:', value)
+        removeTempSelected(userId) {
+            this.tempSelectedUsers = this.tempSelectedUsers.filter(
+                (item) => item.userId !== userId,
+            )
+            if (this.$refs.userTableRef) {
+                const target = this.userList.find(
+                    (item) => item.userId === userId,
+                )
+                if (target) {
+                    this.$refs.userTableRef.toggleRowSelection(target, false)
+                }
+            }
+        },
+        confirmUserSelection() {
+            this.form.shareTargets = [...this.tempSelectedUsers]
+            this.$refs.shareFormRef.clearValidate('shareTargets')
+            this.userPickerVisible = false
+        },
+        removeSelectedUser(userId) {
+            this.form.shareTargets = this.form.shareTargets.filter(
+                (item) => item.userId !== userId,
+            )
+            this.tempSelectedUsers = this.tempSelectedUsers.filter(
+                (item) => item.userId !== userId,
+            )
+        },
+        syncTableSelection() {
+            this.$nextTick(() => {
+                if (!this.$refs.userTableRef) return
+                this.$refs.userTableRef.clearSelection()
+                this.userList.forEach((user) => {
+                    if (
+                        this.tempSelectedUsers.some(
+                            (item) => item.userId === user.userId,
+                        )
+                    ) {
+                        this.$refs.userTableRef.toggleRowSelection(user, true)
+                    }
+                })
+            })
+        },
+        filterDeptNode(value, data) {
+            if (!value) return true
+            return (data.label || '').includes(value)
+        },
+        toggleDeptExpand() {
+            if (!this.$refs.deptTreeRef || !this.$refs.deptTreeRef.store) {
+                return
+            }
+            const rootNodes = this.$refs.deptTreeRef.store.root.childNodes || []
+            const allExpanded = this.isAllDeptExpanded(rootNodes)
+            if (allExpanded) {
+                this.collapseNodes(rootNodes)
+                this.deptTreeExpanded = false
+            } else {
+                this.expandNodes(rootNodes)
+                this.deptTreeExpanded = true
+            }
+        },
+        expandNodes(nodes) {
+            nodes.forEach((node) => {
+                node.expanded = true
+                if (node.childNodes && node.childNodes.length) {
+                    this.expandNodes(node.childNodes)
+                }
+            })
+        },
+        collapseNodes(nodes) {
+            nodes.forEach((node) => {
+                node.expanded = false
+                if (node.childNodes && node.childNodes.length) {
+                    this.collapseNodes(node.childNodes)
+                }
+            })
+        },
+        isAllDeptExpanded(nodes) {
+            for (const node of nodes) {
+                if (node.childNodes && node.childNodes.length) {
+                    if (
+                        !node.expanded ||
+                        !this.isAllDeptExpanded(node.childNodes)
+                    ) {
+                        return false
+                    }
+                }
+            }
+            return true
+        },
+        normalizeDeptTree(list = []) {
+            return list.map((item) => ({
+                id: item.id ?? item.deptId,
+                label: item.label ?? item.name ?? item.deptName,
+                children: item.children
+                    ? this.normalizeDeptTree(item.children)
+                    : [],
+            }))
+        },
+        async submit() {
+            await new Promise((resolve, reject) => {
+                this.$refs.shareFormRef.validate((valid) => {
+                    if (valid) {
+                        resolve()
+                    } else {
+                        reject(new Error('表单验证失败'))
+                    }
+                })
+            })
+            if (!this.selectedFiles.length) {
+                throw new Error('未选择需要共享的文件')
+            }
+            const payload = {
+                id: this.selectedFiles.map((file) => file.id).join(','),
+                userIds: this.form.shareTargets
+                    .map((item) => item.userId)
+                    .join(','),
+                auth: this.form.permission,
+            }
+            this.loading = true
+            try {
+                const res = await saveSharePermissionAPI(payload)
+                if (res.code !== 200) {
+                    throw new Error(res.msg || '共享失败')
+                }
+                this.$message.success('共享成功')
+                return res
+            } finally {
+                this.loading = false
+            }
         },
 
-        // 权限变化
-        handlePermissionChange(value) {
-            console.log('权限变化:', value)
+        handleTabClick(tab) {
+            // this.activeSelectorTab = tab.name
+            // this.fetchUserList()
+            // console.log(tab)
+            this.activeDeptId = null
+            this.activeRoleId = null
+            this.userList = []
+            this.syncTableSelection()
         },
     },
 }
 </script>
 
 <style scoped lang="scss">
-.permission-form {
-    padding: 20px;
-    background: #fff;
-    border-radius: 8px;
-
-    .permission-form-content {
-        .form-item {
-            margin-bottom: 24px;
-
-            :deep(.el-form-item__label) {
-                font-weight: 600;
-                color: #333;
-                font-size: 14px;
-            }
-
-            :deep(.el-form-item__content) {
-                line-height: normal;
-            }
+.share-permission-form {
+    .share-section {
+        margin-bottom: 16px;
+        .section-title {
+            font-size: 14px;
+            margin-bottom: 8px;
+            font-weight: 600;
         }
-
-        .permission-options {
-            display: grid;
-            grid-template-columns: 1fr 1fr;
-            gap: 16px;
-            width: 100%;
-
-            .permission-radio {
-                margin: 0;
-                padding: 12px 16px;
-                border: 1px solid #e0e0e0;
-                border-radius: 6px;
-                background: #fafafa;
-                transition: all 0.3s ease;
-
-                &:hover {
-                    border-color: #409eff;
-                    background: #f0f7ff;
-                }
-
-                :deep(.el-radio__input.is-checked + .el-radio__label) {
-                    color: #409eff;
-                    font-weight: 600;
-                }
-
-                :deep(.el-radio__input.is-checked .el-radio__inner) {
-                    background-color: #409eff;
-                    border-color: #409eff;
-                }
-
-                :deep(.el-radio__label) {
-                    font-size: 14px;
-                    color: #333;
-                    padding-left: 8px;
-                }
-            }
+        .file-list {
+            display: flex;
+            flex-wrap: wrap;
+            gap: 8px;
         }
     }
+    .share-form {
+        background: #f9fbff;
+        padding: 16px;
+        border-radius: 8px;
+    }
+}
 
-    .form-actions {
+.selected-user-tags {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin-top: 8px;
+}
+
+.user-picker {
+    display: flex;
+    gap: 16px;
+    .left-panel {
+        width: 320px;
+        border-right: 1px solid #f0f0f0;
+        padding-right: 16px;
         display: flex;
-        justify-content: flex-end;
-        gap: 12px;
-        margin-top: 24px;
-        padding-top: 16px;
-        border-top: 1px solid #e0e0e0;
+        flex-direction: column;
+    }
+    .right-panel {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+    }
+}
 
-        .el-button {
-            min-width: 80px;
+.selector-tabs {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    ::v-deep .el-tabs__header {
+        margin-bottom: 8px;
+    }
+    ::v-deep .el-tabs__content {
+        flex: 1;
+        display: flex;
+    }
+    ::v-deep .el-tab-pane {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+    }
+}
+
+.tab-toolbar {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+}
+
+.toggle-btn {
+    padding: 0;
+    min-width: 50px;
+}
+
+.dept-tree {
+    flex: 1;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    padding: 8px;
+    overflow: auto;
+}
+
+.role-list {
+    flex: 1;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    padding: 8px;
+    .role-item {
+        padding: 6px 10px;
+        border-radius: 4px;
+        cursor: pointer;
+        margin-bottom: 4px;
+        &.active {
+            background: #ecf5ff;
+            color: #409eff;
         }
     }
 }
 
-// 响应式设计
-@media (max-width: 768px) {
-    .permission-form {
-        .permission-options {
-            grid-template-columns: 1fr;
-            gap: 12px;
-        }
+.panel-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 8px;
+}
+
+.selected-title {
+    margin-top: 8px;
+}
+
+.user-picker-dialog {
+    ::v-deep .el-dialog__body {
+        display: flex;
+        flex-direction: column;
     }
 }
 </style>
diff --git a/src/views/publicService/docCenter/components/tableCom/tagFilter.vue b/src/views/publicService/docCenter/components/tableCom/tagFilter.vue
index 60c41f6..49dd3df 100644
--- a/src/views/publicService/docCenter/components/tableCom/tagFilter.vue
+++ b/src/views/publicService/docCenter/components/tableCom/tagFilter.vue
@@ -1,186 +1,177 @@
 <template>
     <div class="tag-filter-container">
-        <!-- 需求分类 -->
-        <div class="filter-section">
-            <div class="section-title">需求</div>
-            <div class="tag-buttons">
-                <el-button
-                    v-for="(tag, index) in requirementTags"
-                    :key="index"
-                    :class="['tag-button', { active: tag.selected }]"
-                    @click="toggleTag('requirement', index)"
-                >
-                    {{ tag.name }}
-                </el-button>
-            </div>
-        </div>
-
-        <!-- 工程分类 -->
-        <div class="filter-section">
-            <div class="section-title">工程</div>
-            <div class="tag-buttons">
-                <el-button
-                    v-for="(tag, index) in engineeringTags"
-                    :key="index"
-                    :class="['tag-button', { active: tag.selected }]"
-                    @click="toggleTag('engineering', index)"
-                >
-                    {{ tag.name }}
-                </el-button>
-            </div>
-        </div>
-
-        <!-- 产品分类 -->
-        <div class="filter-section">
-            <div class="section-title">产品</div>
-            <div class="tag-buttons">
-                <el-button
-                    v-for="(tag, index) in productTags"
-                    :key="index"
-                    :class="['tag-button', { active: tag.selected }]"
-                    @click="toggleTag('product', index)"
-                >
-                    {{ tag.name }}
-                </el-button>
-            </div>
-        </div>
-
-        <!-- 营销分类 -->
-        <div class="filter-section">
-            <div class="section-title">营销</div>
-            <div class="tag-buttons">
-                <el-button
-                    v-for="(tag, index) in marketingTags"
-                    :key="index"
-                    :class="['tag-button', { active: tag.selected }]"
-                    @click="toggleTag('marketing', index)"
-                >
-                    {{ tag.name }}
-                </el-button>
-            </div>
-        </div>
-
-        <!-- 操作按钮 -->
-        <div class="action-buttons">
-            <el-button type="primary" class="query-button" @click="handleQuery">
-                <i class="el-icon-search"></i>
-                查询
+        <div class="search-container">
+            <el-input
+                v-model.trim="searchKeyword"
+                clearable
+                placeholder="输入搜索标签名称"
+                class="search-input"
+                @keyup.enter.native="handleSearch"
+            >
+                <i
+                    slot="prefix"
+                    class="el-input__icon el-icon-search"
+                    @click="handleSearch"
+                ></i>
+            </el-input>
+            <el-button type="primary" size="mini" @click="handleSearch">
+                搜索
             </el-button>
+        </div>
+
+        <div class="tags-container" v-loading="loading">
+            <template v-if="filteredCategories.length">
+                <div
+                    class="filter-section"
+                    v-for="category in filteredCategories"
+                    :key="category.key"
+                >
+                    <div class="section-title"># {{ category.typeName }} #</div>
+                    <div class="tag-buttons">
+                        <div
+                            v-for="tag in category.tags"
+                            :key="tag.id"
+                            :class="[
+                                'tag-button',
+                                { active: isTagSelected(tag.id) },
+                            ]"
+                            @click="toggleTag(tag)"
+                        >
+                            {{ tag.labelName }}
+                        </div>
+                    </div>
+                </div>
+                <div v-if="allTagsLoaded" class="load-status">全部加载完毕</div>
+            </template>
+            <el-empty
+                v-else-if="!loading"
+                description="暂无匹配标签"
+                :image-size="80"
+            />
+        </div>
+
+        <div class="action-buttons">
             <el-button class="reset-button" @click="handleReset">
                 <i class="el-icon-refresh"></i>
                 重置
             </el-button>
+            <el-button type="primary" class="query-button" @click="handleQuery">
+                <i class="el-icon-search"></i>
+                查询
+            </el-button>
         </div>
     </div>
 </template>
 
 <script>
+import { getDocsTagsListAPI } from '@/api/publicService/docCenter'
+
 export default {
     name: 'TagFilter',
     data() {
         return {
-            // 需求标签
-            requirementTags: [
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-            ],
-            // 工程标签
-            engineeringTags: [
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: '线路工程', selected: false },
-                { name: '调试工程', selected: false },
-                { name: '大修技改', selected: false },
-                { name: '其他工程', selected: false },
-                { name: '调试工程', selected: false },
-                { name: '设计工程', selected: false },
-                { name: '运维工程', selected: false },
-                { name: '监理工程', selected: false },
-            ],
-            // 产品标签
-            productTags: [
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-            ],
-            // 营销标签
-            marketingTags: [
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-                { name: 'XXXXXX', selected: false },
-            ],
+            searchKeyword: '',
+            loading: false,
+            allTagsLoaded: false,
+            categories: [],
+            selectedTagIds: [],
         }
     },
+    computed: {
+        filteredCategories() {
+            if (!this.searchKeyword) {
+                return this.categories
+            }
+            const keyword = this.searchKeyword.toLowerCase()
+            return this.categories
+                .map((category) => {
+                    const filteredTags = category.tags.filter((tag) =>
+                        (tag.labelName || '').toLowerCase().includes(keyword),
+                    )
+                    return {
+                        ...category,
+                        tags: filteredTags,
+                    }
+                })
+                .filter((category) => category.tags.length > 0)
+        },
+    },
+    created() {
+        this.loadTags()
+    },
     methods: {
-        // 切换标签选中状态
-        toggleTag(category, index) {
-            const tagList = this.getTagListByCategory(category)
-            if (tagList && tagList[index]) {
-                tagList[index].selected = !tagList[index].selected
+        async loadTags() {
+            this.loading = true
+            this.allTagsLoaded = false
+            try {
+                const tagsRes = await getDocsTagsListAPI({
+                    labelName: this.searchKeyword,
+                })
+                const tagsData = tagsRes?.data || tagsRes || {}
+                this.categories = Object.keys(tagsData)
+                    .map((categoryName, index) => {
+                        const tagList = tagsData[categoryName] || []
+                        return {
+                            key: `${categoryName}_${index}`,
+                            typeName: categoryName,
+                            tags: tagList
+                                .map((tag) => {
+                                    const rawId =
+                                        tag.id ??
+                                        tag.typeId ??
+                                        tag.labelId ??
+                                        tag.value ??
+                                        tag.labelCode
+                                    if (!rawId) {
+                                        return null
+                                    }
+                                    return {
+                                        id: String(rawId),
+                                        labelName:
+                                            tag.labelName ?? tag.name ?? '',
+                                        typeId: tag.typeId ?? rawId,
+                                        typeName: categoryName,
+                                        raw: tag,
+                                    }
+                                })
+                                .filter(Boolean),
+                        }
+                    })
+                    .filter((category) => category.tags.length > 0)
+                this.allTagsLoaded = true
+            } catch (error) {
+                console.error('加载标签失败:', error)
+                this.$message.error('加载标签失败，请重试')
+                this.categories = []
+                this.allTagsLoaded = true
+            } finally {
+                this.loading = false
             }
         },
-
-        // 根据分类获取标签列表
-        getTagListByCategory(category) {
-            switch (category) {
-                case 'requirement':
-                    return this.requirementTags
-                case 'engineering':
-                    return this.engineeringTags
-                case 'product':
-                    return this.productTags
-                case 'marketing':
-                    return this.marketingTags
-                default:
-                    return null
+        isTagSelected(tagId) {
+            return this.selectedTagIds.includes(String(tagId))
+        },
+        toggleTag(tag) {
+            const tagId = String(tag.id)
+            const index = this.selectedTagIds.indexOf(tagId)
+            if (index > -1) {
+                this.selectedTagIds.splice(index, 1)
+            } else {
+                this.selectedTagIds.push(tagId)
             }
         },
-
-        // 查询
+        handleSearch() {
+            this.loadTags()
+        },
         handleQuery() {
-            const selectedTags = this.getSelectedTags()
-            this.$emit('query', selectedTags)
+            this.$emit('query', [...this.selectedTagIds])
         },
-
-        // 重置
         handleReset() {
-            this.resetAllTags()
+            this.searchKeyword = ''
+            this.selectedTagIds = []
+            this.loadTags()
             this.$emit('reset')
         },
-
-        // 获取所有选中的标签
-        getSelectedTags() {
-            const selectedTags = {
-                requirement: this.requirementTags.filter((tag) => tag.selected),
-                engineering: this.engineeringTags.filter((tag) => tag.selected),
-                product: this.productTags.filter((tag) => tag.selected),
-                marketing: this.marketingTags.filter((tag) => tag.selected),
-            }
-            return selectedTags
-        },
-
-        // 重置所有标签
-        resetAllTags() {
-            this.requirementTags.forEach((tag) => {
-                tag.selected = false
-            })
-            this.engineeringTags.forEach((tag) => {
-                tag.selected = false
-            })
-            this.productTags.forEach((tag) => {
-                tag.selected = false
-            })
-            this.marketingTags.forEach((tag) => {
-                tag.selected = false
-            })
-        },
     },
 }
 </script>
@@ -191,14 +182,29 @@ export default {
     background: #fff;
     min-height: 100%;
     box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+}
+
+.search-container {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 16px;
+
+    .search-input {
+        flex: 1;
+    }
+}
+
+.tags-container {
+    flex: 1;
+    overflow-y: auto;
+    padding-right: 4px;
 }
 
 .filter-section {
-    margin-bottom: 24px;
-
-    &:last-of-type {
-        margin-bottom: 32px;
-    }
+    margin-bottom: 20px;
 }
 
 .section-title {
@@ -213,108 +219,94 @@ export default {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
-    margin-bottom: 8px;
+}
 
-    .tag-button {
-        height: 32px;
-        padding: 0 16px;
-        border-radius: 16px;
-        border: 1px solid #dcdfe6;
-        background: #f5f7fa;
-        color: #606266;
-        font-size: 14px;
-        transition: all 0.3s;
+.tag-button {
+    min-width: 80px;
+    height: 32px;
+    line-height: 32px;
+    border-radius: 16px;
+    border: 1px solid #dcdfe6;
+    background: #f5f7fa;
+    color: #606266;
+    font-size: 14px;
+    text-align: center;
+    padding: 0 16px;
+    cursor: pointer;
+    transition: all 0.3s;
+    user-select: none;
 
-        &:hover {
-            border-color: #409eff;
-            color: #409eff;
-        }
-
-        &.active {
-            background: #409eff;
-            border-color: #409eff;
-            color: #fff;
-        }
+    &:hover {
+        border-color: #409eff;
+        color: #409eff;
     }
+
+    &.active {
+        background: #409eff;
+        border-color: #409eff;
+        color: #fff;
+    }
+}
+
+.load-status {
+    text-align: center;
+    color: #909399;
+    font-size: 12px;
+    padding: 12px 0 4px;
 }
 
 .action-buttons {
     display: flex;
     justify-content: center;
     gap: 16px;
-    margin-top: 24px;
-    padding-top: 20px;
+    margin-top: 16px;
+    padding-top: 16px;
     border-top: 1px solid #e4e7ed;
 
-    .query-button {
+    .query-button,
+    .reset-button {
         height: 36px;
         padding: 0 24px;
         border-radius: 18px;
-        background: #409eff;
-        border-color: #409eff;
-        color: #fff;
-        font-size: 14px;
-        font-weight: 500;
         display: flex;
         align-items: center;
         gap: 6px;
+    }
+
+    .query-button {
+        background: #409eff;
+        border-color: #409eff;
+        color: #fff;
 
         &:hover {
             background: #66b1ff;
             border-color: #66b1ff;
         }
-
-        i {
-            font-size: 14px;
-        }
     }
 
     .reset-button {
-        height: 36px;
-        padding: 0 24px;
-        border-radius: 18px;
         background: #f5f7fa;
         border-color: #dcdfe6;
         color: #606266;
-        font-size: 14px;
-        display: flex;
-        align-items: center;
-        gap: 6px;
 
         &:hover {
             background: #ecf5ff;
             border-color: #c6e2ff;
             color: #409eff;
         }
-
-        i {
-            font-size: 14px;
-        }
     }
 }
 
-// 响应式设计
 @media (max-width: 768px) {
     .tag-filter-container {
         padding: 16px;
     }
 
-    .tag-buttons {
-        .tag-button {
-            height: 28px;
-            padding: 0 12px;
-            font-size: 12px;
-        }
-    }
-
-    .action-buttons {
-        flex-direction: column;
-        align-items: center;
-
-        .query-button,
-        .reset-button {
-            width: 120px;
-        }
+    .tag-button {
+        min-width: 70px;
+        height: 28px;
+        line-height: 28px;
+        font-size: 12px;
     }
 }
 </style>
diff --git a/src/views/publicService/docCenter/components/tableCom/upload.vue b/src/views/publicService/docCenter/components/tableCom/upload.vue
index fad91f1..5a70e59 100644
--- a/src/views/publicService/docCenter/components/tableCom/upload.vue
+++ b/src/views/publicService/docCenter/components/tableCom/upload.vue
@@ -41,7 +41,6 @@
                         action="#"
                         :auto-upload="false"
                         :file-list="fileList"
-                        :before-upload="handleBeforeUpload"
                         :on-change="handleFileChange"
                         :on-remove="handleRemove"
                         :on-exceed="handleExceed"
@@ -87,61 +86,45 @@ export default {
         TagSelector,
     },
     props: {
-        visible: {
-            type: Boolean,
-            default: false,
-        },
         selectedNode: {
             type: Object,
-            default: {},
+            default: () => ({}),
         },
     },
     data() {
         return {
-            dialogVisible: false,
             duplicateHandle: '1', // 重复处理方式：1-跳过，2-覆盖
-            selectedTag: '', // 选中的文件标签ID（兼容旧代码）
             selectedTags: [], // 选中的标签对象数组
+            selectedTagIds: [], // 选中的标签ID数组
+            selectedTagLabels: [], // 选中的标签名称数组
             selectedTypeIds: [], // 选中的去重后的 typeId 数组
             tagSelectorVisible: false, // 标签选择弹框显示状态
             fileList: [], // 文件列表
             uploading: false, // 上传状态
         }
     },
-    watch: {
-        visible: {
-            handler(val) {
-                this.dialogVisible = val
-            },
-            immediate: true,
-        },
-    },
     computed: {
         // 选中的标签显示文本
         selectedTagText() {
-            if (this.selectedTags.length === 0) {
+            if (this.selectedTagLabels.length === 0) {
                 return ''
             }
-            return this.selectedTags.map((tag) => tag.labelName).join(',')
+            return this.selectedTagLabels.join(',')
         },
     },
     methods: {
-        // 关闭对话框
-        handleClose() {
-            this.dialogVisible = false
-            this.$emit('update:visible', false)
-            this.resetForm()
-        },
-
         // 重置表单
         resetForm() {
             this.duplicateHandle = '1'
-            this.selectedTag = ''
             this.selectedTags = []
+            this.selectedTagIds = []
+            this.selectedTagLabels = []
             this.selectedTypeIds = []
             this.fileList = []
             this.uploading = false
-            this.$refs.upload && this.$refs.upload.clearFiles()
+            this.$nextTick(() => {
+                this.$refs.upload && this.$refs.upload.clearFiles()
+            })
         },
 
         // 打开标签选择弹框
@@ -153,38 +136,56 @@ export default {
         handleTagConfirm(result) {
             // result 格式: { tags: [], typeIds: [] }
             this.selectedTags = result?.tags || []
+            this.selectedTagIds =
+                result?.tagIds ||
+                this.selectedTags.map((tag) => String(tag.id ?? ''))
+            this.selectedTagLabels =
+                result?.tagLabels ||
+                this.selectedTags.map((tag) => tag.labelName || '')
             this.selectedTypeIds = result?.typeIds || []
-            // 兼容旧代码，取第一个标签的ID
-            if (this.selectedTags.length > 0) {
-                this.selectedTag = this.selectedTags[0].id
-            } else {
-                this.selectedTag = ''
-            }
         },
 
-        // 上传前校验
-        handleBeforeUpload(file) {
-            // 检查文件格式
-            // const allowedTypes = ['rar', 'zip']
-            // const fileExtension = file.name.split('.').pop().toLowerCase()
+        // 校验文件合法性
+        validateFile(file, options = {}) {
+            const { showMessage = true } = options
+            const rawFile = file?.raw || file
+            if (!rawFile) {
+                if (showMessage) {
+                    this.$modal.msgError('文件信息异常，请重新选择文件!')
+                }
+                return false
+            }
 
-            // if (!allowedTypes.includes(fileExtension)) {
-            //     this.$modal.msgError('只支持上传rar/zip格式文件!')
-            //     return false
-            // }
+            const fileName = rawFile.name || file.name || ''
+            const fileSize = rawFile.size || file.size || 0
+
+            // 检查文件格式
+            const allowedTypes = ['rar', 'zip']
+            const fileExtension = fileName.split('.').pop().toLowerCase()
+
+            if (!allowedTypes.includes(fileExtension)) {
+                if (showMessage) {
+                    this.$modal.msgError('只支持上传rar/zip格式文件!')
+                }
+                return false
+            }
 
             // 检查文件大小 (500kb = 0.5MB)
             const maxSize = 0.5
-            const isLtMaxSize = file.size / 1024 / 1024 < maxSize
+            const isLtMaxSize = fileSize / 1024 / 1024 < maxSize
 
             if (!isLtMaxSize) {
-                this.$modal.msgError(`文件大小不能超过 ${maxSize}MB!`)
+                if (showMessage) {
+                    this.$modal.msgError(`文件大小不能超过 ${maxSize}MB!`)
+                }
                 return false
             }
 
             // 检查文件名是否包含特殊字符
-            if (file.name.includes(',')) {
-                this.$modal.msgError('文件名不能包含英文逗号!')
+            if (fileName.includes(',')) {
+                if (showMessage) {
+                    this.$modal.msgError('文件名不能包含英文逗号!')
+                }
                 return false
             }
 
@@ -193,6 +194,10 @@ export default {
 
         // 文件变化
         handleFileChange(file, fileList) {
+            // if (!this.validateFile(file, { showMessage: true })) {
+            //     this.fileList = fileList.filter((item) => item.uid !== file.uid)
+            //     return
+            // }
             this.fileList = fileList
         },
 
@@ -215,14 +220,21 @@ export default {
         async handleConfirm() {
             if (this.fileList.length === 0) {
                 this.$modal.msgWarning('请选择要上传的文件!')
-                return
+                throw new Error('表单验证失败')
             }
 
             if (this.selectedTags.length === 0) {
                 this.$modal.msgWarning('请选择文件标签!')
-                return
+                throw new Error('表单验证失败')
             }
 
+            // const hasInvalidFile = this.fileList.some(
+            //     (item) => !this.validateFile(item, { showMessage: true }),
+            // )
+            // if (hasInvalidFile) {
+            //     throw new Error('表单验证失败')
+            // }
+
             this.uploading = true
 
             try {
@@ -233,9 +245,12 @@ export default {
                     folderId: this.selectedNode?.id,
                     type: this.selectedNode?.type,
                     repeatType: this.duplicateHandle,
-                    parentId: this.selectedNode?.parentId,
-                    labels: this.selectedTags.map((tag) => tag.id).join(','),
-                    typeIds: this.selectedTypeIds.join(','), // 去重后的 typeId 数组，用逗号连接
+                    parentId: this.selectedNode?.id,
+                    parentIds: this.selectedNode?.parentIds,
+                    labelIds: this.selectedTagIds.join(','), // 标签ID
+                    labels: this.selectedTagLabels.join(','), // 标签名称
+                    level: this.selectedNode?.level * 1 + 1,
+                    // typeIds: this.selectedTypeIds.join(','), // 去重后的 typeId 数组，用逗号连接
                 }
 
                 // 添加文件
@@ -250,7 +265,24 @@ export default {
 
                 // 调用上传接口
                 const response = await uploadFileTagAPI(formData)
-                console.log(response, '上传结果')
+                this.$modal.msgSuccess('文件上传成功!')
+
+                const payload = {
+                    success: true,
+                    response,
+                    tagIds: [...this.selectedTagIds],
+                    tagLabels: [...this.selectedTagLabels],
+                    tags: this.selectedTags.map((tag) => ({
+                        id: String(tag.id ?? ''),
+                        labelName: tag.labelName,
+                        typeId: tag.typeId,
+                        typeName: tag.typeName,
+                    })),
+                }
+
+                this.$emit('confirm', payload)
+                this.resetForm()
+                return payload
             } catch (error) {
                 this.$modal.msgError('文件上传失败，请重试!')
                 throw error