diff --git a/src/assets/enterpriseLibrary/basic-info.png b/src/assets/enterpriseLibrary/basic-info.png
new file mode 100644
index 0000000..7d64d67
Binary files /dev/null and b/src/assets/enterpriseLibrary/basic-info.png differ
diff --git a/src/assets/enterpriseLibrary/enterprise/enterprise-delete.png b/src/assets/enterpriseLibrary/enterprise/enterprise-delete.png
new file mode 100644
index 0000000..764b366
Binary files /dev/null and b/src/assets/enterpriseLibrary/enterprise/enterprise-delete.png differ
diff --git a/src/assets/enterpriseLibrary/enterprise/enterprise-detail.png b/src/assets/enterpriseLibrary/enterprise/enterprise-detail.png
new file mode 100644
index 0000000..4442cf4
Binary files /dev/null and b/src/assets/enterpriseLibrary/enterprise/enterprise-detail.png differ
diff --git a/src/assets/enterpriseLibrary/enterprise/enterprise-edit.png b/src/assets/enterpriseLibrary/enterprise/enterprise-edit.png
new file mode 100644
index 0000000..712d1a8
Binary files /dev/null and b/src/assets/enterpriseLibrary/enterprise/enterprise-edit.png differ
diff --git a/src/assets/enterpriseLibrary/enterprise/enterprise-knowledge.png b/src/assets/enterpriseLibrary/enterprise/enterprise-knowledge.png
new file mode 100644
index 0000000..95498ee
Binary files /dev/null and b/src/assets/enterpriseLibrary/enterprise/enterprise-knowledge.png differ
diff --git a/src/assets/enterpriseLibrary/legalperson.png b/src/assets/enterpriseLibrary/legalperson.png
new file mode 100644
index 0000000..b161e2e
Binary files /dev/null and b/src/assets/enterpriseLibrary/legalperson.png differ
diff --git a/src/router/index.js b/src/router/index.js
index 53efb1d..a69409d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -235,6 +235,20 @@ export const dynamicRoutes = [
         meta: { title: '接收详情', activeMenu: '/archivesManagement/filesTransfer/accept', noCache: true }
       }
     ]
+  },
+  {
+    path: '/EnterpriseForm',
+    component: Layout,
+    hidden: true,
+    permissions: ['enterpriseLibrary:enterprise:add'],
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/enterpriseLibrary/enterprise/components/EnterpriseForm'),
+        name: 'EnterpriseForm',
+        meta: { title: '新增主体信息', activeMenu: '/enterpriseLibrary/enterprise', noCache: true }
+      }
+    ]
   }
 
 
diff --git a/src/views/common/UploadFile.vue b/src/views/common/UploadFile.vue
new file mode 100644
index 0000000..4d16395
--- /dev/null
+++ b/src/views/common/UploadFile.vue
@@ -0,0 +1,342 @@
+<template>
+    <div class="upload-container">
+        <el-upload class="upload-demo" drag action="#" multiple :show-file-list="true" :before-upload="beforeUpload"
+            :on-change="handleFileChange" :on-remove="handleRemove" :on-exceed="handleExceed" :file-list="files"
+            :accept="accept" :limit="limitUploadNum" :auto-upload="false">
+            <div class="upload-content">
+                <!-- 当只有一张图片时显示缩略图 -->
+                <div v-if="showImagePreview" class="image-preview">
+                    <img :src="previewImageUrl" :alt="previewImageName" class="preview-thumbnail" />
+                    <div class="preview-overlay">
+                        <div class="preview-text">
+                            <div class="main-text">点击更换图片</div>
+                            <div class="tip-text">或拖拽新图片到此处</div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- 默认上传区域 -->
+                <div v-else class="upload-text">
+                    <div class="main-text"> + 点击或将文件拖拽到这里上传</div>
+                    <div class="tip-text">
+                        <div>文件大小上限 {{ maxFileTips }}，</div>
+                        <div>支持文件类型：{{ uploadType }}</div>
+                    </div>
+                </div>
+            </div>
+        </el-upload>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'UploadFile',
+    props: {
+        fileList: {
+            type: Array,
+            default: () => []
+        },
+        maxFileTips: {
+            type: String,
+            default: '20MB'
+        },
+        uploadType: {
+            type: String,
+            default: 'png、jpg、jpeg'
+        },
+        limitUploadNum: {
+            type: Number,
+            default: 1
+        },
+    },
+    data() {
+        return {
+            files: this.fileList,
+            previewImageUrl: '',
+            previewImageName: ''
+        }
+    },
+    methods: {
+        beforeUpload(file) {
+            // 验证文件类型
+            const fileExtension = file.name.split('.').pop().toLowerCase();
+            const isAllowedType = this.allowedTypes.includes(fileExtension);
+
+            // 验证MIME类型（额外验证）
+            const isAllowedMimeType = this.mimeTypes.includes(file.type);
+
+            // 验证文件大小
+            const isLtMaxSize = file.size / 1024 / 1024 < this.maxSizeMB;
+
+            if (!isAllowedType || !isAllowedMimeType) {
+                this.$message.error(`只能上传 ${this.uploadType} 格式的文件!`);
+                return false;
+            }
+
+            if (!isLtMaxSize) {
+                this.$message.error(`文件大小不能超过 ${this.maxFileTips}!`);
+                return false;
+            }
+
+            return false;
+        },
+        // 文件状态改变
+        handleFileChange(file, fileList) {
+            
+            this.files = fileList;
+
+            // 生成图片预览
+            if (file.raw && this.isImageFile(file.raw) && fileList.length === 1) {
+                this.generateImagePreview(file.raw);
+            } else {
+                // 如果不是单张图片，清除预览
+                this.previewImageUrl = '';
+                this.previewImageName = '';
+            }
+            console.log('文件列表更新:', this.files.length, '个文件');
+            this.$emit('file-change', this.files);
+        },
+        // 处理文件超出限制
+        handleExceed(files, fileList) {
+            // 当文件数量超出限制时，用新文件替换旧文件
+            if (files.length > 0) {
+                // 清空原有文件列表
+                this.files = [];
+
+                // 手动触发新文件的上传流程
+                const newFile = files[0];
+                this.beforeUpload(newFile); // 先进行验证
+
+                // 创建新的文件对象
+                const newFileObj = {
+                    name: newFile.name,
+                    size: newFile.size,
+                    type: newFile.type,
+                    raw: newFile,
+                    uid: Date.now() // 生成新的uid
+                };
+
+                // 更新文件列表
+                this.files = [newFileObj];
+
+                // 生成预览
+                if (this.isImageFile(newFile)) {
+                    this.generateImagePreview(newFile);
+                }
+
+                this.$emit('file-change', this.files);
+                // this.$message.success('文件已替换');
+            }
+        },
+        // 移除文件
+        handleRemove(file, fileList) {
+            this.files = fileList;
+
+            // 如果移除了图片，清除预览
+            if (fileList.length === 0 || (fileList[0] && !this.isImageFile(fileList[0].raw))) {
+                this.previewImageUrl = '';
+                this.previewImageName = '';
+            } else if (fileList.length === 1 && fileList[0] && this.isImageFile(fileList[0].raw)) {
+                // 如果只剩一张图片，重新生成预览
+                this.generateImagePreview(fileList[0].raw);
+            }
+
+            this.$emit('file-change', fileList);
+        },
+        // 判断是否为图片文件
+        isImageFile(file) {
+            return file && file.type && file.type.startsWith('image/');
+        },
+        // 生成图片预览
+        generateImagePreview(file) {
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                this.previewImageUrl = e.target.result;
+                this.previewImageName = file.name;
+            };
+            reader.readAsDataURL(file);
+        },
+        // 清空所有文件
+        clearFiles() {
+            this.files = [];
+            this.previewImageUrl = '';
+            this.previewImageName = '';
+            this.$emit('file-change', []);
+        }
+    },
+    computed: {
+        // 是否显示图片预览
+        showImagePreview() {
+            return this.previewImageUrl &&
+                this.files.length === 1 &&
+                this.files[0] &&
+                this.files[0].raw &&
+                this.isImageFile(this.files[0].raw);
+        },
+        accept() {
+            return this.uploadType.split('、').map(type => `.${type}`).join(',');
+        },
+        // 获取支持的文件类型数组
+        allowedTypes() {
+            return this.uploadType.split('、');
+        },
+        // 获取文件大小限制（转换为MB数字）
+        maxSizeMB() {
+            const sizeStr = this.maxFileTips.toLowerCase();
+            if (sizeStr.includes('mb')) {
+                return parseFloat(sizeStr);
+            } else if (sizeStr.includes('kb')) {
+                return parseFloat(sizeStr) / 1024;
+            } else if (sizeStr.includes('gb')) {
+                return parseFloat(sizeStr) * 1024;
+            }
+            return 20;
+        },
+        // 获取MIME类型映射
+        mimeTypes() {
+            const typeMap = {
+                'png': 'image/png',
+                'jpg': 'image/jpeg',
+                'jpeg': 'image/jpeg',
+                'gif': 'image/gif',
+                'bmp': 'image/bmp',
+                'webp': 'image/webp',
+                'svg': 'image/svg+xml'
+            };
+            return this.allowedTypes.map(type => typeMap[type] || `image/${type}`);
+        }
+    },
+    watch: {
+        fileList: {
+            handler(newVal) {
+                this.files = newVal;
+                // 如果外部传入文件列表，也尝试生成预览
+                if (newVal.length === 1 && newVal[0] && newVal[0].raw && this.isImageFile(newVal[0].raw)) {
+                    this.generateImagePreview(newVal[0].raw);
+                } else {
+                    this.previewImageUrl = '';
+                    this.previewImageName = '';
+                }
+            },
+            deep: true
+        }
+    }
+}
+</script>
+
+<style scoped lang="scss">
+.upload-container {
+    width: 100%;
+
+    .upload-demo {
+        width: 100%;
+
+        ::v-deep .el-upload {
+            width: 100%;
+
+            .el-upload-dragger {
+                width: 100%;
+                height: 180px;
+                border: 2px dashed #DCDFE6;
+                border-radius: 8px;
+                background-color: #FAFAFA;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                transition: all 0.3s ease;
+                position: relative;
+                overflow: hidden;
+
+                &:hover {
+                    border-color: #409EFF;
+                    background-color: #F5F7FA;
+                }
+            }
+        }
+    }
+
+    .upload-content {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        padding: 20px;
+
+        // 图片预览样式
+        .image-preview {
+            position: relative;
+            width: 100%;
+            height: 100%;
+            border-radius: 6px;
+            overflow: hidden;
+
+            .preview-thumbnail {
+                width: 100%;
+                height: 100%;
+                object-fit: cover;
+                display: block;
+            }
+
+            .preview-overlay {
+                position: absolute;
+                top: 0;
+                left: 0;
+                right: 0;
+                bottom: 0;
+                background: rgba(0, 0, 0, 0.6);
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                opacity: 0;
+                transition: opacity 0.3s ease;
+                pointer-events: none;
+
+                .preview-text {
+                    text-align: center;
+                    color: white;
+                    pointer-events: none;
+
+                    .main-text {
+                        font-size: 16px;
+                        margin-bottom: 8px;
+                        font-weight: 500;
+                    }
+
+                    .tip-text {
+                        font-size: 12px;
+                        opacity: 0.9;
+                    }
+                }
+            }
+
+            &:hover .preview-overlay {
+                opacity: 1;
+            }
+        }
+
+        // 默认上传区域样式
+        .upload-text {
+            text-align: center;
+
+            .main-text {
+                font-size: 18px;
+                color: #1F72EA;
+                margin-bottom: 12px;
+                font-weight: 500;
+            }
+
+            .tip-text {
+                font-size: 14px;
+                color: #909399;
+                line-height: 1.5;
+
+                div {
+                    margin-bottom: 2px;
+                }
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/enterpriseLibrary/enterprise/components/EnterpriseForm.vue b/src/views/enterpriseLibrary/enterprise/components/EnterpriseForm.vue
new file mode 100644
index 0000000..8ac5df3
--- /dev/null
+++ b/src/views/enterpriseLibrary/enterprise/components/EnterpriseForm.vue
@@ -0,0 +1,165 @@
+<!-- 企业主体库表单 -->
+<template>
+    <div class="app-container">
+        <div class="content-header">
+            <el-button class="reset-btn" @click="handleClose()">返回</el-button>
+            <el-button class="search-btn" @click="handleSave()">保存</el-button>
+        </div>
+        <div class="content-body">
+            <el-row :gutter="24" class="content-row">
+                <!-- 基本信息 -->
+                <el-col :span="6" class="pane-left">
+                    <BasicInfo ref="basicInfo" />
+                </el-col>
+                <!-- 法人信息 -->
+                <el-col :span="6" class="pane-center">
+                    <LegalPerson ref="legalPerson" />
+                </el-col>
+                <!-- 开户证明 -->
+                <el-col :span="6" class="pane-right">
+                    <AccountOpeningCertificate ref="accountOpeningCertificate" />
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+<script>
+import { decryptWithSM4 } from '@/utils/sm'
+import BasicInfo from './child/BasicInfo.vue'
+import LegalPerson from './child/LegalPerson.vue'
+import AccountOpeningCertificate from './child/AccountOpeningCertificate.vue'
+export default {
+    name: 'EnterpriseForm',
+    components: {
+        BasicInfo,
+        LegalPerson,
+        AccountOpeningCertificate
+    },
+    data() {
+        return {
+            id: decryptWithSM4(this.$route.query.id),
+            type: decryptWithSM4(this.$route.query.type),
+        }
+    },
+    methods: {
+        // 返回
+        handleClose() {
+            const obj = { path: "/enterpriseLibrary/enterprise" }
+            this.$tab.closeOpenPage(obj)
+        },
+        // 保存
+       async handleSave() {
+            try {
+                // 并行校验所有表单
+                const [basicInfoData, legalPersonData, accountData] = await Promise.all([
+                    this.$refs.basicInfo.validate(),
+                    this.$refs.legalPerson.validate(),
+                    this.$refs.accountOpeningCertificate.validate()
+                ])
+
+                // 所有校验通过，组装完整数据
+                const formData = {
+                    ...basicInfoData,
+                    ...legalPersonData,
+                    ...accountData
+                }
+
+                console.log('所有表单校验通过，完整数据:', formData)
+
+                // 这里可以调用保存接口
+                // await this.saveEnterprise(formData)
+                this.$message.success('保存成功')
+
+            } catch (error) {
+                // console.error('表单校验失败:', error)
+                this.$message.error(error.message || '请完善表单信息')
+            }
+        }
+    }
+
+}
+</script>
+
+<style scoped lang="scss">
+.app-container {
+    padding: 24px;
+    background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
+    max-height: 100vh;
+    overflow-y: auto;
+}
+
+.content-body {
+    margin-top: 20px;
+}
+
+.content-row {
+    margin: 0;
+    display: flex;
+    flex-wrap: nowrap;
+    gap: 16px;
+}
+
+.pane-left,
+.pane-center,
+.pane-right {
+    background: #fff;
+    border-radius: 16px 16px 16px 16px;
+    min-height: 600px;
+    box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
+    // border: 1px solid #e8f4ff;
+    padding: 0;
+    margin-bottom: 20px;
+    flex: 1;
+    min-width: 0;
+}
+
+
+.content-header {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    margin-bottom: 20px;
+    gap: 12px;
+}
+
+.search-btn {
+    background: #409EFF;
+    border-color: #409EFF;
+    color: #fff;
+    font-weight: 600;
+    padding: 12px 24px;
+    border-radius: 6px;
+    box-shadow: 0px 4px 12px 0px rgba(64, 158, 255, 0.4);
+    letter-spacing: 0.5px;
+    font-size: 14px;
+    transition: all 0.3s ease;
+
+    &:hover {
+        background: #66b1ff;
+        border-color: #66b1ff;
+        box-shadow: 0px 6px 16px 0px rgba(64, 158, 255, 0.5);
+        transform: translateY(-1px);
+    }
+}
+
+.reset-btn {
+    background: #fff;
+    border: 1px solid #dcdfe6;
+    color: #606266;
+    font-weight: 600;
+    padding: 12px 24px;
+    border-radius: 6px;
+    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
+    letter-spacing: 0.5px;
+    font-size: 14px;
+    transition: all 0.3s ease;
+
+    &:hover {
+        background: #f5f7fa;
+        border-color: #c0c4cc;
+        color: #409EFF;
+        box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.15);
+        transform: translateY(-1px);
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/enterpriseLibrary/enterprise/components/child/AccountOpeningCertificate.vue b/src/views/enterpriseLibrary/enterprise/components/child/AccountOpeningCertificate.vue
new file mode 100644
index 0000000..cf577fb
--- /dev/null
+++ b/src/views/enterpriseLibrary/enterprise/components/child/AccountOpeningCertificate.vue
@@ -0,0 +1,75 @@
+<template>
+    <div>
+        <div class="basic-info-title">
+            <img src="@/assets/enterpriseLibrary/legalperson.png" alt="开户证明">
+            <span>开户证明</span>
+        </div>
+        <el-form :model="form" :rules="rules" ref="accountOpeningCertificateForm" label-width="110px" label-position="top">
+            <el-form-item label="开户许可证" prop="fileList">
+                <UploadFile :fileList="form.fileList"/>
+            </el-form-item>
+            <el-form-item label="开户银行" prop="openingBank">
+                <el-input v-model="form.openingBank" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="开户账号" prop="openingAccount">
+                <el-input v-model="form.openingAccount" placeholder="自动提取"></el-input>
+            </el-form-item>
+            
+        </el-form>
+    </div>
+</template>
+
+<script>
+import UploadFile from '@/views/common/UploadFile.vue'
+export default {
+    name: 'AccountOpeningCertificate',
+    components:{UploadFile},
+    data() {
+        return {
+            form: {
+                fileList:[],
+                openingBank: '',
+                openingAccount: '',
+            },
+            rules: {
+                fileList:[
+                    { required: true, message: '请上传开户许可证', trigger: 'blur' }
+                ],
+                openingBank: [
+                    { required: true, message: '请输入开户银行', trigger: 'blur' }
+                ],
+                openingAccount: [
+                    { required: true, message: '请输入开户账号', trigger: 'blur' }
+                ],
+                
+
+            }
+        }
+    },
+    methods: {
+        // 校验规则
+        validate() {
+            return new Promise((resolve, reject) => {
+                this.$refs.accountOpeningCertificateForm.validate((valid) => {
+                    if (valid) {
+                        resolve(this.form) // 校验成功返回表单数据
+                    } else {
+                        reject(new Error('开户证明未填写完整'))
+                    }
+                })
+            })
+        },
+    },
+}
+</script>
+
+<style scoped lang="scss">
+.basic-info-title {
+    display: flex;
+    align-items: center;
+    margin: 10px 0;
+    span{
+        margin: 0 5px;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/enterpriseLibrary/enterprise/components/child/BasicInfo.vue b/src/views/enterpriseLibrary/enterprise/components/child/BasicInfo.vue
new file mode 100644
index 0000000..e66f084
--- /dev/null
+++ b/src/views/enterpriseLibrary/enterprise/components/child/BasicInfo.vue
@@ -0,0 +1,106 @@
+<template>
+    <div>
+        <div class="basic-info-title">
+            <img src="@/assets/enterpriseLibrary/basic-info.png" alt="基本信息">
+            <span>基本信息</span>
+        </div>
+        <el-form :model="form" :rules="rules" ref="basicInfoForm" label-width="110px" label-position="top">
+            <!-- 营业执照 -->
+            <el-form-item label="营业执照" prop="fileList">
+                <UploadFile :fileList="form.fileList" />
+            </el-form-item>
+            <el-form-item label="企业名称" prop="enterpriseName">
+                <el-input v-model="form.enterpriseName" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="统一社会信用代码" prop="enterpriseCode">
+                <el-input v-model="form.enterpriseCode" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="注册资本" prop="registeredCapital">
+                <el-input v-model="form.registeredCapital" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="营业期限" prop="businessTerm">
+                <el-input v-model="form.businessTerm" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="住所" prop="residence">
+                <el-input v-model="form.residence" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="经营范围" prop="businessScope">
+                <el-input v-model="form.businessScope" placeholder="自动提取"></el-input>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+import UploadFile from '@/views/common/UploadFile.vue'
+export default {
+    name: 'BasicInfo',
+    components: {
+        UploadFile
+    },
+    data() {
+        return {
+            form: {
+                name: '',
+                enterpriseName: '',
+                enterpriseCode: '',
+                registeredCapital: '',
+                businessTerm: '',
+                residence: '',
+                businessScope: '',
+                fileList: []
+            },
+            rules: {
+                fileList: [
+                    { required: true, message: '请上传营业执照', trigger: 'blur' }
+                ],
+                enterpriseName: [
+                    { required: true, message: '请输入企业名称', trigger: 'blur' }
+                ],
+                enterpriseCode: [
+                    { required: true, message: '请输入统一社会信用代码', trigger: 'blur' }
+                ],
+                registeredCapital: [
+                    { required: true, message: '请输入注册资本', trigger: 'blur' }
+                ],
+                businessTerm: [
+                    { required: true, message: '请输入营业期限', trigger: 'blur' }
+                ],
+                residence: [
+                    { required: true, message: '请输入住所', trigger: 'blur' }
+                ],
+                businessScope: [
+                    { required: true, message: '请输入经营范围', trigger: 'blur' }
+                ],
+
+            }
+        }
+    },
+    methods: {
+        // 校验规则
+        validate() {
+            return new Promise((resolve, reject) => {
+                this.$refs.basicInfoForm.validate((valid) => {
+                    if (valid) {
+                        resolve(this.form) // 校验成功返回表单数据
+                    } else {
+                        reject(new Error('基本信息未填写完整'))
+                    }
+                })
+            })
+        },
+    },
+}
+</script>
+
+<style scoped lang="scss">
+.basic-info-title {
+    display: flex;
+    align-items: center;
+    margin: 10px 0;
+
+    span {
+        margin: 0 5px;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/enterpriseLibrary/enterprise/components/child/LegalPerson.vue b/src/views/enterpriseLibrary/enterprise/components/child/LegalPerson.vue
new file mode 100644
index 0000000..3625499
--- /dev/null
+++ b/src/views/enterpriseLibrary/enterprise/components/child/LegalPerson.vue
@@ -0,0 +1,98 @@
+<template>
+    <div>
+        <div class="basic-info-title">
+            <img src="@/assets/enterpriseLibrary/legalperson.png" alt="法人信息">
+            <span>法人信息</span>
+        </div>
+        <el-form :model="form" :rules="rules" ref="legalPersonForm" label-width="110px" label-position="top">
+            <!-- 身份证人像面 -->
+            <el-form-item label="身份证人像面" prop="fileList">
+                <UploadFile :fileList="form.fileList" />
+            </el-form-item>
+            <!-- 身份证国徽面 -->
+            <el-form-item label="身份证国徽面" prop="fileList2">
+                <UploadFile :fileList="form.fileList2" />
+            </el-form-item>
+            <el-form-item label="法人姓名" prop="legalPersonName">
+                <el-input v-model="form.legalPersonName" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="法人身份证号" prop="legalPersonIdCard">
+                <el-input v-model="form.legalPersonIdCard" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="身份证有效期" prop="idCardStartDate">
+                <el-input v-model="form.idCardStartDate" placeholder="自动提取"></el-input>
+            </el-form-item>
+            <el-form-item label="法人职务" prop="legalPersonPosition">
+                <el-input v-model="form.legalPersonPosition" placeholder="请输入法人职务"></el-input>
+            </el-form-item>
+            <el-form-item label="法人联系方式" prop="legalPersonPhone">
+                <el-input v-model="form.legalPersonPhone" placeholder="请输入法人联系方式"></el-input>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+import UploadFile from '@/views/common/UploadFile.vue'
+export default {
+    name: 'LegalPerson',
+    components: { UploadFile },
+    data() {
+        return {
+            form: {
+                legalPersonName: '',
+                legalPersonIdCard: '',
+                idCardStartDate: '',
+                legalPersonPosition: '',
+                legalPersonPhone: '',
+                fileList: [],
+                fileList2: [],
+            },
+            rules: {
+                fileList: [
+                    { required: true, message: '请上传身份证人像面', trigger: 'blur' }
+                ],
+                fileList2: [
+                    { required: true, message: '请上传身份证国徽面', trigger: 'blur' }
+                ],
+                legalPersonName: [
+                    { required: true, message: '请输入法人姓名', trigger: 'blur' }
+                ],
+                legalPersonIdCard: [
+                    { required: true, message: '请输入法人身份证号', trigger: 'blur' }
+                ],
+                idCardStartDate: [
+                    { required: true, message: '请输入身份证有效期', trigger: 'blur' }
+                ],
+
+            }
+        }
+    },
+    methods: {
+        // 校验规则
+        validate() {
+            return new Promise((resolve, reject) => {
+                this.$refs.legalPersonForm.validate((valid) => {
+                    if (valid) {
+                        resolve(this.form) // 校验成功返回表单数据
+                    } else {
+                        reject(new Error('法人信息未填写完整'))
+                    }
+                })
+            })
+        },
+    },
+}
+</script>
+
+<style scoped lang="scss">
+.basic-info-title {
+    display: flex;
+    align-items: center;
+    margin: 10px 0;
+
+    span {
+        margin: 0 5px;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/enterpriseLibrary/enterprise/index.vue b/src/views/enterpriseLibrary/enterprise/index.vue
index 967598a..86ce7a6 100644
--- a/src/views/enterpriseLibrary/enterprise/index.vue
+++ b/src/views/enterpriseLibrary/enterprise/index.vue
@@ -1,271 +1,306 @@
 <template>
-    <!-- 主体库 -->
-    <div class="app-container">
-        
-        <!-- 搜索区域 -->
-        <div class="search-container">
-            <div class="search-content">
-                <div class="search-left">
-                    <h2 class="page-title">投标人主体库</h2>
-                </div>
-                <div class="search-right">
-                    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
-                        <el-form-item prop="enterpriseName">
-                            <el-input 
-                                v-model="queryParams.enterpriseName" 
-                                placeholder="请输入企业名称进行查询" 
-                                clearable 
-                                maxlength="32"
-                                class="search-input">
-                            </el-input>
-                        </el-form-item>
-                        <el-form-item>
-                            <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery" class="search-btn">查询</el-button>
-                            <el-button icon="el-icon-refresh" size="small" @click="resetQuery" class="reset-btn">重置</el-button>
-                        </el-form-item>
-                    </el-form>
-                </div>
-            </div>
+  <!-- 主体库 -->
+  <div class="app-container">
+    <!-- 搜索区域 -->
+    <div class="search-container">
+      <div class="search-content">
+        <div class="search-left">
+          <h2 class="page-title">投标人主体库</h2>
         </div>
-
-        <!-- 企业卡片网格 -->
-        <div class="enterprise-grid">
-            <!-- 新建企业卡片 -->
-            <div class="enterprise-card create-card" @click="handleAdd">
-                <div class="create-icon">
-                    <i class="el-icon-plus"></i>
-                </div>
-                <div class="create-text">新建企业主体信息</div>
-            </div>
-
-            <!-- 企业信息卡片 -->
-            <div class="enterprise-card" v-for="(enterprise, index) in enterpriseList" :key="index">
-                <div class="enterprise-header">
-                    <h3 class="enterprise-name">{{ enterprise.name }}</h3>
-                    <div class="enterprise-rating">{{ enterprise.rating }}</div>
-                </div>
-                
-                <div class="enterprise-info">
-                    <div class="info-item">
-                        <span class="label">法定代表人:</span>
-                        <span class="value">{{ enterprise.legalRepresentative }}</span>
-                    </div>
-                    <div class="info-item">
-                        <span class="label">统一信用代码:</span>
-                        <span class="value">{{ enterprise.creditCode }}</span>
-                    </div>
-                </div>
-
-                <!-- 过期文档标签 -->
-                <div class="expired-tags" v-if="enterprise.expiredDocs && enterprise.expiredDocs.length > 0">
-                    <span class="expired-tag" v-for="doc in enterprise.expiredDocs" :key="doc">{{ doc }}</span>
-                </div>
-
-                <!-- 资质库 -->
-                <div class="qualification-section">
-                    <div class="qualification-label">资质库</div>
-                    <div class="qualification-items">
-                        <div class="qualification-item" v-for="n in 7" :key="n">
-                            <span class="qualification-number">1</span>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- 操作按钮 -->
-                <div class="enterprise-actions">
-                    <el-button type="primary" size="mini" icon="el-icon-document">企业知识库</el-button>
-                    <el-button size="mini" icon="el-icon-view">详情</el-button>
-                    <el-button size="mini" icon="el-icon-edit">编辑</el-button>
-                    <el-button type="danger" size="mini" icon="el-icon-delete">删除</el-button>
-                </div>
-            </div>
-        </div>
-
-        <!-- 分页 -->
-        <div class="pagination-container">
-            <el-pagination
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-                :current-page="queryParams.pageNum"
-                :page-sizes="[10, 20, 50, 100]"
-                :page-size="queryParams.pageSize"
-                layout="total, sizes, prev, pager, next, jumper"
-                :total="total">
-            </el-pagination>
+        <div class="search-right">
+          <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+            <el-form-item prop="enterpriseName">
+              <el-input v-model="queryParams.enterpriseName" placeholder="请输入企业名称进行查询" clearable maxlength="32"
+                class="search-input" @keyup.enter.native="handleQuery">
+              </el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" size="small" @click="handleQuery" class="search-btn">查询</el-button>
+              <el-button size="small" @click="resetQuery" class="reset-btn">重置</el-button>
+            </el-form-item>
+          </el-form>
         </div>
+      </div>
     </div>
+
+    <!-- 企业卡片网格 -->
+    <div class="enterprise-grid">
+      <!-- 新建企业卡片 -->
+      <div class="enterprise-card create-card" @click="handleAdd" v-hasPermi="['enterpriseLibrary:enterprise:add']">
+        <div class="create-icon">
+          <i class="el-icon-plus"></i>
+        </div>
+        <div class="create-text">新建企业主体信息</div>
+      </div>
+
+      <!-- 企业信息卡片 -->
+      <div class="enterprise-card" v-for="(enterprise, index) in enterpriseList" :key="index">
+        <div class="enterprise-header">
+          <h3 class="enterprise-name">{{ enterprise.name }}</h3>
+        </div>
+
+        <div class="enterprise-info">
+          <div class="info-item">
+            <span class="label">法定代表人:</span>
+            <span class="value">{{ enterprise.legalRepresentative }}</span>
+          </div>
+          <div class="info-item">
+            <span class="label">统一信用代码:</span>
+            <span class="value">{{ enterprise.creditCode }}</span>
+          </div>
+        </div>
+
+        <!-- 过期文档标签 -->
+        <div class="expired-tags" v-if="enterprise.expiredDocs && enterprise.expiredDocs.length > 0">
+          <span class="expired-tag" v-for="doc in enterprise.expiredDocs" :key="doc">{{ doc }}</span>
+        </div>
+
+         <!-- 数据统计 -->
+         <div class="data-stats">
+           <div class="stat-item">
+             <span class="stat-label">资质库</span>
+             <span class="stat-value">10</span>
+           </div>
+           <div class="stat-item">
+             <span class="stat-label">业绩库</span>
+             <span class="stat-value">23</span>
+           </div>
+           <div class="stat-item">
+             <span class="stat-label">人员库</span>
+             <span class="stat-value">55</span>
+           </div>
+           <div class="stat-item">
+             <span class="stat-label">财务库</span>
+             <span class="stat-value">88</span>
+           </div>
+           <!-- <div class="stat-item">
+             <span class="stat-label">技术方案库</span>
+             <span class="stat-value">88</span>
+           </div>
+           <div class="stat-item">
+             <span class="stat-label">工器具库</span>
+             <span class="stat-value">88</span>
+           </div> -->
+         </div>
+
+        <!-- 操作按钮 -->
+        <div class="enterprise-actions">
+          <div>
+            <img :src="EnterpriseKnowledge" alt="企业知识库" />
+            <span>企业知识库</span>
+          </div>
+          <div v-hasPermi="['enterpriseLibrary:enterprise:detail']">
+            <img :src="EnterpriseDetail" alt="详情" />
+            <span>详情</span>
+          </div>
+          <div v-hasPermi="['enterpriseLibrary:enterprise:edit']">
+            <img :src="EnterpriseEdit" alt="编辑" />
+            <span>编辑</span>
+          </div>
+          <div v-hasPermi="['enterpriseLibrary:enterprise:del']">
+            <img :src="EnterpriseDelete" alt="删除" />
+            <span>删除</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 分页 -->
+    <div class="pagination-container">
+      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+        :current-page="queryParams.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="queryParams.pageSize"
+        layout="total, sizes, prev, pager, next, jumper" :total="total">
+      </el-pagination>
+    </div>
+  </div>
 </template>
 
 <script>
+import EnterpriseKnowledge from '@/assets/enterpriseLibrary/enterprise/enterprise-knowledge.png';
+import EnterpriseDetail from '@/assets/enterpriseLibrary/enterprise/enterprise-detail.png';
+import EnterpriseEdit from '@/assets/enterpriseLibrary/enterprise/enterprise-edit.png';
+import EnterpriseDelete from '@/assets/enterpriseLibrary/enterprise/enterprise-delete.png';
+import { encryptWithSM4 } from '@/utils/sm'
 export default {
-    name: 'Enterprise',
-    components: {
+  name: 'Enterprise',
+  components: {
+    
+  },
+  data() {
+    return {
+      // 企业知识库、编辑等图片引用
+      EnterpriseKnowledge,
+      EnterpriseDetail,
+      EnterpriseEdit,
+      EnterpriseDelete,
+      queryParams: {
+        enterpriseName: '',
+        pageNum: 1,
+        pageSize: 10,
 
-    },
-    data() {
-        return {
-            queryParams: {
-                enterpriseName: '',
-                pageNum: 1,
-                pageSize: 10
-            },
-            total: 1000,
-            enterpriseList: [
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: ['【身份证】已过期', '【营业执照】已过期']
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                },
-                {
-                    name: '中电鸿信信息科技有限公司',
-                    legalRepresentative: '沈宇',
-                    creditCode: '91320000668382125',
-                    rating: 'D',
-                    expiredDocs: []
-                }
-            ]
+      },
+      total: 1000,
+      enterpriseList: [
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: ['【身份证】已过期', '【营业执照】已过期']
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
+        },
+        {
+          name: '中电鸿信信息科技有限公司',
+          legalRepresentative: '沈宇',
+          creditCode: '91320000668382125',
+          rating: 'D',
+          expiredDocs: []
         }
+      ]
+    }
+  },
+
+  created() {
+    this.getList()
+  },
+
+  methods: {
+    // 获取企业列表
+    getList() {
+      // 这里可以调用API获取数据
+      console.log('获取企业列表')
     },
 
-    created() {
-        this.getList()
+    // 查询
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
     },
 
-    methods: {
-        // 获取企业列表
-        getList() {
-            // 这里可以调用API获取数据
-            console.log('获取企业列表')
-        },
-        
-        // 查询
-        handleQuery() {
-            this.queryParams.pageNum = 1
-            this.getList()
-        },
-        
-        // 重置
-        resetQuery() {
-            this.queryParams.enterpriseName = ''
-            this.handleQuery()
-        },
-        
-        // 新增企业
-        handleAdd() {
-            console.log('新增企业')
-        },
-        
-        // 分页大小改变
-        handleSizeChange(val) {
-            this.queryParams.pageSize = val
-            this.getList()
-        },
-        
-        // 当前页改变
-        handleCurrentChange(val) {
-            this.queryParams.pageNum = val
-            this.getList()
+    // 重置
+    resetQuery() {
+      this.queryParams.enterpriseName = ''
+      this.handleQuery()
+    },
+
+    // 新增企业
+    handleAdd() {
+      console.log('新增企业')
+      // this.$router.push('/enterpriseLibrary/enterprise/add')
+      this.$router.push({
+        name: 'EnterpriseForm',
+        query: {
+          type: encryptWithSM4('add'),
+          id: encryptWithSM4(''),
         }
+      })
     },
+
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.queryParams.pageSize = val
+      this.getList()
+    },
+
+    // 当前页改变
+    handleCurrentChange(val) {
+      this.queryParams.pageNum = val
+      this.getList()
+    }
+  },
 }
 </script>
 
 <style scoped lang="scss">
 .app-container {
   padding: 20px;
-  background: #f5f5f5;
-  min-height: 100vh;
+  background: linear-gradient( 180deg, #F1F6FF 20%, #E5EFFF 100%);
+  max-height: 100vh;
 }
 
 .page-header {
   margin-bottom: 20px;
-  
+
   .page-title {
-    font-size: 24px;
+    font-size: 20px;
     font-weight: 500;
-    color: #333;
+    color: #424242;
     margin: 0;
   }
 }
 
 .search-container {
-  background: #fff;
-  padding: 20px;
+  padding: 0 20px;
   border-radius: 8px;
-  margin-bottom: 20px;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-  
+ 
   .search-content {
     display: flex;
     justify-content: space-between;
     align-items: center;
   }
-  
+
   .search-left {
     .page-title {
       font-size: 24px;
@@ -274,12 +309,12 @@ export default {
       margin: 0;
     }
   }
-  
+
   .search-right {
     .search-input {
       width: 300px;
     }
-    
+
     .search-btn {
       background: #409EFF;
       border-color: #409EFF;
@@ -287,25 +322,31 @@ export default {
       font-weight: 500;
       padding: 8px 16px;
       border-radius: 4px;
-      
+      box-shadow: 0px 4px 8px 0px rgba(51, 135, 255, 0.5);
+      letter-spacing: 1px;
+
       &:hover {
         background: #66b1ff;
         border-color: #66b1ff;
+        box-shadow: 0px 6px 12px 0px rgba(51, 135, 255, 0.6);
       }
     }
-    
+
     .reset-btn {
       background: #fff;
       border-color: #dcdfe6;
       color: #606266;
       font-weight: 500;
       padding: 8px 16px;
-      border-radius: 4px;
-      
+      border-radius: 4px 4px 4px 4px;
+      box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
+      letter-spacing: 1px;
+
       &:hover {
         background: #f5f7fa;
         border-color: #c0c4cc;
         color: #409EFF;
+        box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
       }
     }
   }
@@ -316,24 +357,24 @@ export default {
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
   margin-bottom: 30px;
-  max-height: 600px;
+  max-height: calc(100vh - 280px);
   overflow-y: auto;
   padding: 10px;
-  
+
   /* 自定义滚动条样式 */
   &::-webkit-scrollbar {
     width: 8px;
   }
-  
+
   &::-webkit-scrollbar-track {
     background: #f1f1f1;
     border-radius: 4px;
   }
-  
+
   &::-webkit-scrollbar-thumb {
     background: #c1c1c1;
     border-radius: 4px;
-    
+
     &:hover {
       background: #a8a8a8;
     }
@@ -346,12 +387,12 @@ export default {
   padding: 20px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   transition: all 0.3s ease;
-  
+
   &:hover {
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
     transform: translateY(-2px);
   }
-  
+
   &.create-card {
     border: 2px dashed #ddd;
     display: flex;
@@ -361,18 +402,18 @@ export default {
     min-height: 200px;
     cursor: pointer;
     transition: all 0.3s ease;
-    
+
     &:hover {
       border-color: #409EFF;
       background: #f0f8ff;
     }
-    
+
     .create-icon {
       font-size: 48px;
       color: #999;
       margin-bottom: 10px;
     }
-    
+
     .create-text {
       font-size: 16px;
       color: #666;
@@ -385,16 +426,16 @@ export default {
   justify-content: space-between;
   align-items: flex-start;
   margin-bottom: 15px;
-  
+
   .enterprise-name {
-    font-size: 16px;
-    font-weight: 500;
-    color: #333;
+    font-size: 20px;
+    font-weight: bold;
+    color: #424242;
     margin: 0;
     flex: 1;
     line-height: 1.4;
   }
-  
+
   .enterprise-rating {
     background: #409EFF;
     color: #fff;
@@ -412,20 +453,21 @@ export default {
 
 .enterprise-info {
   margin-bottom: 15px;
-  
+
   .info-item {
     display: flex;
     margin-bottom: 8px;
-    
+
     .label {
-      color: #666;
+      color: #888888;
       font-size: 14px;
       min-width: 100px;
     }
-    
+
     .value {
-      color: #333;
-      font-size: 14px;
+      color: #424242;
+      font-size: 16px;
+      font-weight: bold;
       flex: 1;
     }
   }
@@ -433,7 +475,7 @@ export default {
 
 .expired-tags {
   margin-bottom: 15px;
-  
+
   .expired-tag {
     display: inline-block;
     background: #ff4d4f;
@@ -446,32 +488,32 @@ export default {
   }
 }
 
-.qualification-section {
+.data-stats {
   margin-bottom: 15px;
-  
-  .qualification-label {
-    font-size: 14px;
-    color: #666;
-    margin-bottom: 8px;
-  }
-  
-  .qualification-items {
-    display: flex;
-    gap: 8px;
-    
-    .qualification-item {
-      width: 24px;
-      height: 24px;
-      background: #f0f0f0;
-      border-radius: 4px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      
-      .qualification-number {
-        font-size: 12px;
-        color: #666;
-      }
+  display: flex;
+  justify-content: space-between;
+  gap: 8px;
+
+  .stat-item {
+    flex: 1;
+    text-align: center;
+    padding: 8px 4px;
+    background: #f8f9fa;
+    border-radius: 4px;
+    border: 1px solid #e9ecef;
+
+    .stat-label {
+      display: block;
+      font-size: 12px;
+      color: #666;
+      margin-bottom: 4px;
+    }
+
+    .stat-value {
+      display: block;
+      font-size: 16px;
+      font-weight: 600;
+      color: #333;
     }
   }
 }
@@ -480,31 +522,104 @@ export default {
   display: flex;
   gap: 8px;
   flex-wrap: wrap;
-  
-  .el-button {
+  justify-content: space-between;
+
+  > div {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 12px 8px;
+    border-radius: 6px;
     font-size: 12px;
-    padding: 6px 12px;
+    font-weight: 500;
+    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
+    transition: all 0.3s ease;
+    cursor: pointer;
+    min-width: 70px;
+    height: 60px;
+    gap: 6px;
+    
+    img {
+      width: 20px;
+      height: 20px;
+    }
+    
+    span {
+      font-size: 12px;
+      white-space: nowrap;
+    }
+  }
+
+  // 企业知识库按钮 - 蓝色主题
+  > div:nth-child(1) {
+    background: #409EFF;
+    color: #fff;
+    
+    &:hover {
+      background: #66b1ff;
+      box-shadow: 0px 4px 8px rgba(64, 158, 255, 0.3);
+    }
+  }
+
+  // 详情按钮 - 浅蓝色主题
+  > div:nth-child(2) {
+    background: #f0f8ff;
+    border: none;
+    color: #409EFF;
+    
+    &:hover {
+      background: #e6f3ff;
+      color: #66b1ff;
+      box-shadow: 0px 4px 8px rgba(64, 158, 255, 0.2);
+    }
+  }
+
+  // 编辑按钮 - 橙色主题
+  > div:nth-child(3) {
+    background: #fff7e6;
+    border: none;
+    color: #ff9500;
+    
+    &:hover {
+      background: #fff2d9;
+      color: #ffb84d;
+      box-shadow: 0px 4px 8px rgba(255, 149, 0, 0.2);
+    }
+  }
+
+  // 删除按钮 - 红色主题
+  > div:nth-child(4) {
+    background: #fff1f0;
+    border: none;
+    color: #ff4d4f;
+    
+    &:hover {
+      background: #ffe7e6;
+      color: #ff7875;
+      box-shadow: 0px 4px 8px rgba(255, 77, 79, 0.2);
+    }
   }
 }
 
 .pagination-container {
   display: flex;
   justify-content: center;
-  background: #fff;
+  // background: #fff;
   padding: 20px;
   border-radius: 8px;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  // box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   margin-top: 20px;
   position: sticky;
   bottom: 0;
   z-index: 10;
-  
+
   .el-pagination {
     .el-pagination__total {
       color: #606266;
       font-weight: 500;
     }
-    
+
     .el-pagination__sizes {
       .el-select {
         .el-input__inner {
@@ -513,31 +628,31 @@ export default {
         }
       }
     }
-    
+
     .el-pager li {
       border-radius: 4px;
       margin: 0 2px;
-      
+
       &.active {
         background: #409EFF;
         color: #fff;
       }
-      
+
       &:hover {
         color: #409EFF;
       }
     }
-    
+
     .btn-prev,
     .btn-next {
       border-radius: 4px;
       margin: 0 2px;
-      
+
       &:hover {
         color: #409EFF;
       }
     }
-    
+
     .el-pagination__jump {
       .el-input__inner {
         border-color: #dcdfe6;
@@ -567,30 +682,30 @@ export default {
       align-items: flex-start;
       gap: 15px;
     }
-    
+
     .search-right {
       width: 100%;
-      
+
       .search-input {
         width: 100%;
         max-width: 300px;
       }
     }
   }
-  
+
   .enterprise-grid {
     grid-template-columns: 1fr;
   }
-  
+
   .enterprise-actions {
     flex-direction: column;
-    
+
     .el-button {
       width: 100%;
       margin-bottom: 8px;
     }
   }
-  
+
   .pagination-container {
     .el-pagination {
       flex-wrap: wrap;