diff --git a/src/views/documentManage/DocumentLibrary.vue b/src/views/documentManage/DocumentLibrary.vue
index 3b82c317..ce5f67d2 100644
--- a/src/views/documentManage/DocumentLibrary.vue
+++ b/src/views/documentManage/DocumentLibrary.vue
@@ -83,7 +83,6 @@ import { ACCESS_TOKEN } from '@/store/mutation-types'
 import { downFile, downloadFile, getAction } from '@/api/manage'
 import Modal from 'ant-design-vue'
 import store from '@/store'
-import eventBus from '@/common/event'
 
 export default {
   name: 'DocumentLibrary',
diff --git a/src/views/documentManage/modules/LibraryAddForm.vue b/src/views/documentManage/modules/LibraryAddForm.vue
index 40494686..f53f56a7 100644
--- a/src/views/documentManage/modules/LibraryAddForm.vue
+++ b/src/views/documentManage/modules/LibraryAddForm.vue
@@ -38,200 +38,44 @@
               {{$t('delete')}}
             </a>
           </span>
-        <span slot="standNumberOrClause">
-               <span :title="$t('docLibrary.statuteNumberClause')">{{$t('docLibrary.statuteNumberClause')}}</span>
+          <span slot="standNumberOrClause">
+            <span :title="$t('docLibrary.statuteNumberClause')">{{$t('docLibrary.statuteNumberClause')}}</span>
           </span>
-        <span slot="implementationDateTwo">
-           <span :title="$t('docLibrary.implementationDateTwo')">{{$t('docLibrary.implementationDateTwo')}}</span>
+          <span slot="implementationDateTwo">
+            <span :title="$t('docLibrary.implementationDateTwo')">{{$t('docLibrary.implementationDateTwo')}}</span>
           </span>
-        <span slot="typeofImplementation">
-               <span :title="$t('docLibrary.typeofImplementation')">{{$t('docLibrary.typeofImplementation')}}</span>
+          <span slot="typeofImplementation">
+            <span :title="$t('docLibrary.typeofImplementation')">{{$t('docLibrary.typeofImplementation')}}</span>
           </span>
       </a-table>
     </div>
-    <a-modal
-      :title="$t('newlyAdded')"
-      :width="900"
-      :visible="visibleGrad"
-      :confirm-loading="confirmLoading"
-      :maskClosable="false"
-      @cancel="visibleGrad = false"
-    >
-      <a-form-model :rules="tableRules" :model="tableDataGrad"
-                    ref="tableRuleForm">
-        <a-row :gutter="24">
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.statuteNumberClause')">{{$t('docLibrary.statuteNumberClause')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="standNumberOrClause">
-                <a-input class="box-input" v-model.trim="tableDataGrad.standNumberOrClause"
-                         :placeholder="$t('pleaseEnter')+$t('docLibrary.statuteNumberClause')"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.typeofImplementation')">{{$t('docLibrary.typeofImplementation')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="implementationType">
-                <j-multi-select-tag class="box-input" v-model="tableDataGrad.implementationType"
-                                    :placeholder="$t('pleaseSelect')+$t('docLibrary.typeofImplementation')"
-                                    :type="'select'"
-                                    @changeQuery='implementationTypeChange'
-                                    :triggerChange="false" dictCode="shi2_shi1_lei4_xing2"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.implementationDateTwo')">{{$t('docLibrary.implementationDateTwo')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="implementationDate">
-                <a-date-picker class="box-input" v-model="tableDataGrad.implementationDate"
-                               :placeholder="$t('pleaseSelect')+$t('docLibrary.implementationDateTwo')"
-                               format="YYYY-MM-DD"
-                               value-format="YYYY-MM-DD"
-                               style="width: 100%"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="24">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span :title="$t('remarks')">{{$t('remarks')}}</span>
-              </div>
-              <a-form-model-item class="item-model" style="height: auto" prop="remarks">
-                <a-textarea :placeholder="$t('pleaseEnter')+$t('remarks')"
-                            :rows="4" v-model="tableDataGrad.remarks"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-      </a-form-model>
-      <template slot="footer">
-        <a-button key="back" @click="visibleGrad = false">
-          {{ $t('cancel') }}
-        </a-button>
-        <a-button key="submit" type="primary" @click="handleTableSubmit">
-          {{ $t('determine') }}
-        </a-button>
-      </template>
-    </a-modal>
-    <a-modal
-      :title="$t('edit')"
-      :width="900"
-      :visible="tableVisibleGrad"
-      :confirm-loading="confirmLoading"
-      :maskClosable="false"
-      @cancel="tableVisibleGrad = false"
-    >
-      <a-form-model :rules="tableRules" :model="tableDataGrad"
-                    ref="tableRuleFormEdit">
-        <a-row :gutter="24">
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.statuteNumberClause')">{{$t('docLibrary.statuteNumberClause')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="standNumberOrClause">
-                <a-input class="box-input" v-model.trim="tableDataGrad.standNumberOrClause"
-                         :placeholder="$t('pleaseEnter')+$t('docLibrary.statuteNumberClause')"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.typeofImplementation')">{{$t('docLibrary.typeofImplementation')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="implementationType">
-                <j-multi-select-tag class="box-input" v-model="tableDataGrad.implementationType"
-                                    :placeholder="$t('pleaseSelect')+$t('docLibrary.typeofImplementation')"
-                                    :type="'select'"
-                                    @changeQuery="implementationTypeChange"
-                                    :triggerChange="false" dictCode="shi2_shi1_lei4_xing2"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="12">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span class="required">*</span>
-                <span :title="$t('docLibrary.implementationDateTwo')">{{$t('docLibrary.implementationDateTwo')}}</span>
-              </div>
-              <a-form-model-item class="item-model" prop="implementationDate">
-                <a-date-picker class="box-input" v-model="tableDataGrad.implementationDate"
-                               :placeholder="$t('pleaseSelect')+$t('docLibrary.implementationDateTwo')"
-                               format="YYYY-MM-DD"
-                               value-format="YYYY-MM-DD"
-                               style="width: 100%"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="24">
-            <div class="box-title-text">
-              <div class="title-text">
-                <span :title="$t('remarks')">{{$t('remarks')}}</span>
-              </div>
-              <a-form-model-item class="item-model" style="height: auto" prop="remarks">
-                <a-textarea :placeholder="$t('pleaseEnter')+$t('remarks')"
-                            :rows="4" v-model="tableDataGrad.remarks"/>
-              </a-form-model-item>
-            </div>
-          </a-col>
-        </a-row>
-      </a-form-model>
-      <template slot="footer">
-        <a-button key="back" @click="tablevisibleGrad = false">
-          {{ $t('cancel') }}
-        </a-button>
-        <a-button key="submit" type="primary" @click="handleTableEditSubmit">
-          {{ $t('determine') }}
-        </a-button>
-      </template>
-    </a-modal>
     <div class="drawer-bootom-button">
       <a-button style="margin-right: 8px" @click="handleCancel">{{$t('cancel')}}</a-button>
       <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button>
     </div>
+
+    <phased-implementation-modal ref="phasedImplementationModal" @submit="handleTableEditSubmit"></phased-implementation-modal>
   </a-drawer>
 </template>
 
 <script>
+// 新增表单组件
 import AddForm from '@/components/customField/AddForm'
+// 新增，编辑分阶段实施详情组件
+import PhasedImplementationModal from './PhasedImplementationModal'
 import { postAction } from '@/api/manage'
-import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
 
 export default {
   name: 'LibraryAddForm',
-  components: { AddForm, JMultiSelectTag },
+  components: { AddForm, PhasedImplementationModal },
   data () {
     return {
       title: this.$t('add'),
       drawerWidth: 900,
       visible: false,
       confirmLoading: false,
-      isDisplayType: false,
       dataList: [],
       // 分阶段实施详情的表格相关数据
-      columns: [],
       loading: false,
       dataGradto: [],
       columnsGrading: [
@@ -272,47 +116,7 @@ export default {
           width: 180,
           scopedSlots: { customRender: 'gradOperation' }
         }
-      ],
-      visibleGrad: false,
-      tableRules: {
-        standNumberOrClause: [
-          {
-            required: true,
-            message: this.$t('docLibrary.statuteNumberClause') + this.$t('cannotEmpty'),
-            trigger: 'blur'
-          },
-          {
-            // required: true,
-            max: 200,
-            message: this.$t('docLibrary.statuteNumberClause') + this.$t('cannotExceed') + 200 + this.$t('characters'),
-            trigger: 'blur'
-          }
-        ],
-        implementationType: [
-          {
-            required: true,
-            message: this.$t('docLibrary.typeofImplementation') + this.$t('cannotEmpty'),
-            trigger: 'change'
-          }
-        ],
-        implementationDate: [
-          {
-            required: true,
-            message: this.$t('docLibrary.implementationDateTwo') + this.$t('cannotEmpty'),
-            trigger: 'change'
-          }
-        ],
-        remarks: [
-          {
-            // required: true,
-            max: 1000,
-            message: this.$t('remarks') + this.$t('cannotExceed') + 1000 + this.$t('characters'),
-            trigger: 'blur'
-          }
-        ]
-      },
-      tableDataGrad: {},
-      tableVisibleGrad: false
+      ]
     }
   },
   props: {
@@ -350,14 +154,11 @@ export default {
     },
     // 分阶段实施详情的新增
     newlyAdded () {
-      this.tableDataGrad = {}
-      this.visibleGrad = true
+      this.$refs.phasedImplementationModal.add()
     },
     // 分阶段实施详情的编辑
-    handleEdit (result, index) {
-      this.tableVisibleGrad = true
-      this.tableDataIndex = index
-      this.tableDataGrad = JSON.parse(JSON.stringify(result))
+    handleEdit (record, index) {
+      this.$refs.phasedImplementationModal.edit(record, index)
     },
     // 分阶段实施详情的删除
     deleteLib (val, index) {
@@ -369,28 +170,14 @@ export default {
         }
       })
     },
-    // 分阶段实施详情的新增弹框
-    handleTableSubmit () {
-      this.$refs.tableRuleForm.validate(valid => {
-        if (valid) {
-          this.dataGradto.push(this.tableDataGrad)
-          this.visibleGrad = false
-        }
-      })
-    },
-    // 实施类型下拉框改变
-    implementationTypeChange (val) {
-      this.tableDataGrad.implementationTypeText = val
-    },
     // 表格编辑弹框的提交
-    handleTableEditSubmit () {
-      this.$refs.tableRuleFormEdit.validate((valid) => {
-        if (valid) {
-          this.tableVisibleGrad = false
-          this.dataGradto[this.tableDataIndex] = this.tableDataGrad
-          this.dataGradto = [...this.dataGradto]
-        }
-      })
+    handleTableEditSubmit (formData, index) {
+      if (index) {
+        // 说明是编辑
+        this.dataGradto[index] = formData
+      } else {
+        this.dataGradto.push(formData)
+      }
     },
     handleSubmit () {
       this.confirmLoading = true
diff --git a/src/views/documentManage/modules/LibraryDetail.vue b/src/views/documentManage/modules/LibraryDetail.vue
index 098337d7..f0dc474d 100644
--- a/src/views/documentManage/modules/LibraryDetail.vue
+++ b/src/views/documentManage/modules/LibraryDetail.vue
@@ -154,105 +154,25 @@
         </div>
       </div>
     </div>
-    <a-modal
-      :title="$t('docLibrary.updateLog')"
-      :width="900"
-      :visible="visible"
-      :confirm-loading="confirmLoading"
-      :maskClosable="false"
-      @ok="handleOk"
-      @cancel="handleCancel"
-    >
-      <a-table
-        class="table"
-        :components="drag(columns,'columns')"
-        :columns="columns"
-        :pagination="ipaginationUpdateLog"
-        :scroll="{x: '100%',y: 400}"
-        :data-source="dataSource"
-        :loading="loading"
-      >
-       <span slot="content" slot-scope="text">
-          <a-tooltip placement="topLeft" overlayClassName="tooltip-color">
-            <template slot="title">
-              <span v-html="text"></span>
-            </template>
-            <span v-html="text"></span>
-          </a-tooltip>
-       </span>
-      </a-table>
-    </a-modal>
-    <a-modal
-      :title="$t('docLibrary.standardOne')"
-      :width="600"
-      :visible="visibleRelated"
-      :maskClosable="false"
-      @ok="visibleRelated = false"
-      @cancel="visibleRelated = false"
-    >
-      <a-table
-        class="table"
-        :columns="columnsRelated"
-        :pagination="ipaginationStandarOne"
-        :scroll="{x: '100%',y: 400}"
-        :data-source="dataSourceRelated"
-        :loading="loading"
-      >
-        <span slot="operation" slot-scope="text,record">
-          <a class="text" :title="text" @click="detailClick(record)">
-                {{text && text.length > 18 ? text.slice(0,17)+'...' : text}}
-          </a>
-        </span>
-      </a-table>
-    </a-modal>
-    <a-modal
-      :title="$t('docLibrary.viewFileOne')"
-      :width="600"
-      :visible="visibleFile"
-      :maskClosable="false"
-      @cancel="visibleFile = false"
-    >
-      <template slot="footer">
-        <a-button key="back" @click="visibleFile = false">
-          {{$t('cancel')}}
-        </a-button>
-      </template>
-      <a-table
-        class="table"
-        :columns="columnsFile"
-        :pagination="ipaginationViewFileOne"
-        :scroll="{x:500,y: 400}"
-        :data-source="dataSourceFile"
-        :loading="loading"
-      >
-        <span slot="fileOperation" slot-scope="record">
-          <a class="text" @click="pdfPreview(record)"
-             :disabled="record.fileSuffix === '.pdf' || record.fileSuffix === '.docx' || record.fileSuffix === '.doc'
-             || record.fileSuffix === '.jpg' || record.fileSuffix === '.png' || record.fileSuffix === '.gif'
-             || record.fileSuffix === '.jpeg' || record.fileSuffix === '.xlsx' || record.fileSuffix === '.xls' ? false : true">
-                {{$t('view')}}
-          </a>
-          <a class="text" @click="download(record)">
-                {{$t('download')}}
-          </a>
-          <a class="text" @click="breakdown(record)" v-if="record.splitFlag === 1">
-                {{$t('docLibrary.standardBreakdown')}}
-          </a>
-        </span>
-      </a-table>
-    </a-modal>
     <uploadFile ref="uploadFile" :isUploadFile="true" :disabled="true"></uploadFile>
     <libraryPush
       :url="url"
       ref="libraryPushRef"
     />
+    <library-detail-update-log ref="libraryDetailUpdateLog"></library-detail-update-log>
+    <library-detail-file-modal ref="libraryDetailFileModal"></library-detail-file-modal>
   </div>
 </template>
 
 <script>
 import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
 import UploadFile from '@/components/UploadFile'
+// 分享弹框
 import LibraryPush from './LibraryPush'
+// 更新log弹框
+import LibraryDetailUpdateLog from './LibraryDetailUpdateLog'
+// 文件查看弹框
+import LibraryDetailFileModal from './LibraryDetailFileModal'
 import { mapGetters } from 'vuex'
 import { downloadFile, getAction } from '@/api/manage'
 import { Base64 } from 'js-base64'
@@ -260,56 +180,34 @@ import { Base64 } from 'js-base64'
 export default {
   name: 'LibraryDetail',
   mixins: [ResizeColumnProvide, ResizeHeader],
-  components: { UploadFile, LibraryPush },
+  components: { UploadFile, LibraryPush, LibraryDetailUpdateLog, LibraryDetailFileModal },
   data () {
     return {
       url: {
         getInfo: 'document/bussDocumentLibraryEO/getInfoById',
-        list: 'log/bussLogEO/page',
         getTitle: '/document/bussDocumentLibraryEO/getTitle',
         getPage: '/document/phasedImplementationDetailsEO/page',
         getMenuList: 'document/bussDocumentLibraryEO/getMenuList',
         pullMessage: 'document/bussDocumentLibraryEO/pullMessage', // 推送
         getWdkCollectAndSubscribeInfoByUser: ''
       },
-      visibleFile: false,
       loading: false,
-      columnsRelated: [
-        {
-          title: this.$t('docLibrary.standardName'),
-          dataIndex: 'title',
-          align: 'left',
-          ellipsis: true,
-          scopedSlots: { customRender: 'operation' },
-          width: 544
-        }
-      ],
-      columnsFile: [
-        {
-          title: this.$t('fileName'),
-          dataIndex: 'fileName',
-          align: 'left',
-          width: 260,
-          ellipsis: true
-        },
-        {
-          title: this.$t('operation'),
-          align: 'left',
-          width: 130,
-          scopedSlots: { customRender: 'fileOperation' }
-        }
-      ],
-      visibleRelated: false,
-      dataSourceRelated: [],
       detailList: [],
+      ipagination: {
+        current: 1,
+        pageSize: 50,
+        pageSizeOptions: ['10', '50', '100', '150', '200'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
       dataGrad: [],
-      visible: false, // 更新日志弹框是否可见
       serialNumber: '',
-      confirmLoading: false,
       downLoadFileUrl: window._CONFIG.domianPreviewURL + '/sys/common/download',
       downLoadImgUrl: window._CONFIG.domianWebImgURL + '/sys/common/download',
-      dataSource: [],
-      dataSourceFile: [],
       documentId: this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId,
       columnsGrading: [
         {
@@ -340,30 +238,6 @@ export default {
           width: '45%'
         }
       ],
-      columns: [
-        {
-          title: this.$t('docLibrary.modificationContent'),
-          dataIndex: 'content',
-          align: 'left',
-          ellipsis: true,
-          scopedSlots: { customRender: 'content' },
-          width: 484
-        },
-        {
-          title: this.$t('docLibrary.modificationTime'),
-          dataIndex: 'createTime',
-          align: 'left',
-          ellipsis: true,
-          width: 180
-        },
-        {
-          title: this.$t('docLibrary.personnel'),
-          dataIndex: 'createBy',
-          align: 'left',
-          ellipsis: true,
-          width: 180
-        }
-      ],
       collectFlag: ''
     }
   },
@@ -379,10 +253,12 @@ export default {
   },
   methods: {
     ...mapGetters(['userInfo']),
+    // 分享按钮点击
     shareClick () {
       const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
       this.$refs.libraryPushRef.getPush(_id.split(','))
     },
+    // 获取收藏状态是已收藏还是未收藏
     getWdkCollectAndSubscribeInfoByUser () {
       const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
       getAction(this.url.getWdkCollectAndSubscribeInfoByUser, { id: _id }).then((res) => {
@@ -395,6 +271,7 @@ export default {
         }
       })
     },
+    // 收藏按钮点击
     collectionClick (val) {
       this.$confirm({
         content: val.collectFlag === 0 || !val.collectFlag ? this.$t('docLibrary.confirmCollection') : this.$t('docLibrary.cancelConfirmCollection'),
@@ -416,40 +293,7 @@ export default {
         }
       })
     },
-    documentTranslationClick () {
-      let serialNumber = ''
-      if (this.detailList.length > 0) {
-        this.detailList[0][this.$t('essentialInformation')].forEach(res => {
-          if (res.db_field_name === 'serialNumber') {
-            serialNumber = res.value
-          }
-        })
-      }
-      const newUrl = this.$router.resolve({
-        path: '/documentTranslation',
-        query: {
-          serialNumber: serialNumber
-        }
-      })
-      window.open(newUrl.href, '_blank')
-    },
-    documentComparisonClick () {
-      let serialNumber = ''
-      if (this.detailList.length > 0) {
-        this.detailList[0][this.$t('essentialInformation')].forEach(res => {
-          if (res.db_field_name === 'serialNumber') {
-            serialNumber = res.value
-          }
-        })
-      }
-      const newUrl = this.$router.resolve({
-        path: '/documentComparison',
-        query: {
-          serialNumber: serialNumber
-        }
-      })
-      window.open(newUrl.href, '_blank')
-    },
+    // 知识分享按钮点击
     knowledgeDatabaseClick () {
       let serialNumber = ''
       if (this.detailList.length > 0) {
@@ -467,6 +311,7 @@ export default {
       })
       window.open(newUrl.href, '_blank')
     },
+    // 获取详情页标题
     getTitle (callback) {
       const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
       getAction(this.url.getTitle, { id: _id }).then((res) => {
@@ -478,6 +323,7 @@ export default {
         }
       })
     },
+    // 获取详情信息
     getInfoById () {
       const _id = this.$route.query.documentId === undefined ? this.$route.query.id : this.$route.query.documentId
       getAction(this.url.getInfo, { id: _id }).then((res) => {
@@ -489,43 +335,29 @@ export default {
         }
       })
     },
+    // 获取分阶段实施详情信息
     getPage () {
       const tableQuery = {
-        pageNo: this.tablepageNo,
-        pageSize: this.tablepageSize,
+        pageNo: this.ipagination.current,
+        pageSize: this.ipagination.pageSize,
         bussDocumentLibraryId: this.$route.query.id
       }
       getAction(this.url.getPage, tableQuery).then((res) => {
         if (res.success) {
           this.dataGrad = res.result.records
-          this.tabletotal = res.result.total
-          this.loading = false
+          this.ipagination.total = res.result.total
         } else {
           this.dataGrad = []
-          this.loading = false
         }
+      }).finally(() => {
+        this.loading = false
       })
     },
+    // 基本信息的文件按钮点击
     clickButtonToUpload (item) {
-      this.loading = true
-      this.visibleFile = true
-      getAction('document/bussDocumentLibraryEO/getFileInfos', { id: item.join(',') }).then((res) => {
-        if (res.success) {
-          this.dataSourceFile = res.result
-          this.dataSourceFile.forEach((val) => {
-            const fileName = val.fileName
-            const index1 = fileName.lastIndexOf('.')
-            const index2 = fileName.length
-            const fileSuffix = fileName.substring(index1, index2)
-            val.fileSuffix = fileSuffix
-          })
-          this.loading = false
-        } else {
-          this.dataSourceFile = []
-          this.loading = false
-        }
-      })
+      this.$refs.libraryDetailFileModal.open(item)
     },
+    // pdf文件预览
     pdfPreview (fileQuery) {
       const fileName = fileQuery.fileName
       const index1 = fileName.lastIndexOf('.')
@@ -546,74 +378,30 @@ export default {
         downloadFile('/sys/common/downLoadFile', fileQuery.fileName, { id: fileQuery.id })
       }
     },
+    // 文件下载
     download (item) {
       downloadFile('/sys/common/downLoadFile', item.fileName, { id: item.id, userName: this.userInfo().username })
     },
+    // 点击更新log按钮
     updateLog () {
-      this.visible = true
-      this.bussLogList()
-    },
-    handleOk () {
-      this.visible = false
-    },
-    handleCancel () {
-      this.visible = false
+      this.$refs.libraryDetailUpdateLog.open()
     },
+    // url跳转事件
     urlClick (item) {
       window.open(item.value)
     },
-    bussLogList () {
-      const query = {
-        pageNo: this.pageNo,
-        pageSize: this.pageSize,
-        documentId: this.$route.query.id
-      }
-      this.loading = true
-      getAction(this.url.list, query).then((res) => {
-        if (res.success) {
-          this.dataSource = res.result.records
-          this.total = res.result.total
-          this.loading = false
-        } else {
-          this.loading = false
-        }
-      })
-    },
-    documentSplitting () {
-      let serialNumber = ''
-      if (this.detailList.length > 0) {
-        this.detailList[0][this.$t('essentialInformation')].forEach(res => {
-          if (res.db_field_name === 'serialNumber') {
-            serialNumber = res.value
-          }
-        })
-      }
-      const newUrl = this.$router.resolve({
-        path: '/docManage/splite',
-        query: {
-          serial_number: serialNumber
-        }
-      })
-      window.open(newUrl.href, '_blank')
-    },
-    detailClick (val) {
-      const newUrl = this.$router.resolve({
-        path: '/docManage/library/detail',
-        query: val
-      })
-      this.visibleRelated = false
-      window.open(newUrl.href, '_blank')
-    },
+    // 基本信息中添加时类型是标准选择的点击
     relatedClick (val) {
       const newUrl = this.$router.resolve({
-        path: '/docManage/library/detail',
+        path: '/documentManage/library/detail',
         query: val
       })
       window.open(newUrl.href, '_blank')
     },
+    // 拆分过的文件的查看？
     breakdown (item) {
       const newUrl = this.$router.resolve({
-        path: '/docManage/splitting/splitDetail',
+        path: '/documentTool/split/detail',
         query: {
           infoId: item.splitInfoId
         }
diff --git a/src/views/documentManage/modules/LibraryDetailFileModal.vue b/src/views/documentManage/modules/LibraryDetailFileModal.vue
new file mode 100644
index 00000000..da240cda
--- /dev/null
+++ b/src/views/documentManage/modules/LibraryDetailFileModal.vue
@@ -0,0 +1,142 @@
+<template>
+  <a-modal
+    :title="$t('docLibrary.viewFileOne')"
+    :width="600"
+    :visible="visible"
+    :maskClosable="false"
+    @cancel="visible = false"
+  >
+    <template slot="footer">
+      <a-button key="back" @click="visible = false">
+        {{$t('cancel')}}
+      </a-button>
+    </template>
+    <a-table
+      class="table"
+      :columns="columns"
+      :pagination="false"
+      :scroll="{x:500,y: 400}"
+      :data-source="dataSource"
+      :loading="loading"
+    >
+        <span slot="fileOperation" slot-scope="record">
+          <a class="text" @click="pdfPreview(record)"
+             :disabled="record.fileSuffix === '.pdf' || record.fileSuffix === '.docx' || record.fileSuffix === '.doc'
+             || record.fileSuffix === '.jpg' || record.fileSuffix === '.png' || record.fileSuffix === '.gif'
+             || record.fileSuffix === '.jpeg' || record.fileSuffix === '.xlsx' || record.fileSuffix === '.xls' ? false : true">
+                {{$t('view')}}
+          </a>
+          <a class="text" @click="download(record)">
+                {{$t('download')}}
+          </a>
+          <a class="text" @click="breakdown(record)" v-if="record.splitFlag === 1">
+                {{$t('docLibrary.standardBreakdown')}}
+          </a>
+        </span>
+    </a-table>
+  </a-modal>
+</template>
+
+<script>
+import { getAction, downloadFile } from '@/api/manage'
+import { Base64 } from 'js-base64'
+
+export default {
+  name: 'LibraryDetailFileModal',
+  data () {
+    return {
+      visible: false,
+      ipagination: {
+        current: 1,
+        pageSize: 50,
+        pageSizeOptions: ['10', '50', '100', '150', '200'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      columns: [
+        {
+          title: this.$t('fileName'),
+          dataIndex: 'fileName',
+          align: 'left',
+          width: 260,
+          ellipsis: true
+        },
+        {
+          title: this.$t('operation'),
+          align: 'left',
+          width: 130,
+          scopedSlots: { customRender: 'fileOperation' }
+        }
+      ],
+      dataSource: [],
+      loading: false
+    }
+  },
+  methods: {
+    open (item) {
+      this.visible = true
+      this.getFileList(item)
+    },
+    getFileList (item) {
+      this.loading = true
+      this.visibleFile = true
+      getAction('document/bussDocumentLibraryEO/getFileInfos', { id: item.join(',') }).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result
+          this.dataSource.forEach((val) => {
+            const fileName = val.fileName
+            const index1 = fileName.lastIndexOf('.')
+            const index2 = fileName.length
+            const fileSuffix = fileName.substring(index1, index2)
+            val.fileSuffix = fileSuffix
+          })
+        } else {
+          this.dataSource = []
+        }
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    pdfPreview (fileQuery) {
+      const fileName = fileQuery.fileName
+      const index1 = fileName.lastIndexOf('.')
+      const index2 = fileName.length
+      const fileSuffix = fileName.substring(index1, index2)
+      if (fileSuffix === '.pdf') {
+        window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + fileQuery.id + '&userName=' + this.userInfo().username))
+      } else if (fileSuffix === '.docx' || fileSuffix === '.doc') {
+        const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+        window.open(url, '_blank')
+      } else if (fileSuffix === '.xlsx' || fileSuffix === '.xls') {
+        const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+        window.open(url, '_blank')
+      } else if (fileSuffix === '.png' || fileSuffix === '.jpeg' || fileSuffix === '.gif' || fileSuffix === '.jpg') {
+        const url = window._CONFIG.onlinePreviewDomainURL + '?url=' + Base64.encode(this.downLoadImgUrl + '/' + fileQuery.id + fileSuffix)
+        window.open(url, '_blank')
+      } else {
+        downloadFile('/sys/common/downLoadFile', fileQuery.fileName, { id: fileQuery.id })
+      }
+    },
+    download (item) {
+      downloadFile('/sys/common/downLoadFile', item.fileName, { id: item.id, userName: this.userInfo().username })
+    },
+    breakdown (item) {
+      const newUrl = this.$router.resolve({
+        path: '/docManage/splitting/splitDetail',
+        query: {
+          infoId: item.splitInfoId
+        }
+      })
+      window.open(newUrl.href, '_blank')
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/documentManage/modules/LibraryDetailUpdateLog.vue b/src/views/documentManage/modules/LibraryDetailUpdateLog.vue
new file mode 100644
index 00000000..d7fc998b
--- /dev/null
+++ b/src/views/documentManage/modules/LibraryDetailUpdateLog.vue
@@ -0,0 +1,116 @@
+<template>
+  <a-modal
+    :title="$t('docLibrary.updateLog')"
+    :width="900"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :maskClosable="false"
+    @ok="handleOk"
+    @cancel="handleCancel"
+  >
+    <a-table
+      class="table"
+      :components="drag(columns,'columns')"
+      :columns="columns"
+      :pagination="ipagination"
+      :scroll="{x: '100%',y: 400}"
+      :data-source="dataSource"
+      :loading="loading"
+    >
+       <span slot="content" slot-scope="text">
+          <a-tooltip placement="topLeft" overlayClassName="tooltip-color">
+            <template slot="title">
+              <span v-html="text"></span>
+            </template>
+            <span v-html="text"></span>
+          </a-tooltip>
+       </span>
+    </a-table>
+  </a-modal>
+</template>
+
+<script>
+import { getAction } from '@/api/manage'
+
+export default {
+  name: 'LibraryDetailUpdateLog',
+  data () {
+    return {
+      visible: false, // 更新日志弹框是否可见
+      confirmLoading: false,
+      ipagination: {
+        current: 1,
+        pageSize: 50,
+        pageSizeOptions: ['10', '50', '100', '150', '200'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      columns: [
+        {
+          title: this.$t('docLibrary.modificationContent'),
+          dataIndex: 'content',
+          align: 'left',
+          ellipsis: true,
+          scopedSlots: { customRender: 'content' },
+          width: 484
+        },
+        {
+          title: this.$t('docLibrary.modificationTime'),
+          dataIndex: 'createTime',
+          align: 'left',
+          ellipsis: true,
+          width: 180
+        },
+        {
+          title: this.$t('docLibrary.personnel'),
+          dataIndex: 'createBy',
+          align: 'left',
+          ellipsis: true,
+          width: 180
+        }
+      ],
+      dataSource: [],
+      loading: false,
+      url: {
+        list: 'log/bussLogEO/page',
+      }
+    }
+  },
+  methods: {
+    open () {
+      this.visible = true
+      this.bussLogList()
+    },
+    bussLogList () {
+      const query = {
+        pageNo: this.ipagination.current,
+        pageSize: this.ipagination.pageSize,
+        documentId: this.$route.query.id
+      }
+      this.loading = true
+      getAction(this.url.list, query).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result.records
+          this.ipagination.total = res.result.total
+        }
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    handleOk () {
+      this.visible = false
+    },
+    handleCancel () {
+      this.visible = false
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/documentManage/modules/LibraryPush.vue b/src/views/documentManage/modules/LibraryPush.vue
index 9a44dade..666bf3b8 100644
--- a/src/views/documentManage/modules/LibraryPush.vue
+++ b/src/views/documentManage/modules/LibraryPush.vue
@@ -1,40 +1,38 @@
 <template>
-  <div>
-    <a-drawer
-      :title="$t('share')"
-      :maskClosable="false"
-      :width="600"
-      placement="right"
-      :closable="true"
-      @close="handleCancel"
-      :visible="visible"
-      style="height: 100%;overflow: auto;padding-bottom: 53px;">
-      <a-spin :spinning="confirmLoading">
-        <a-input-search style="margin-bottom: 8px" v-model="searchModel"
-                        @search="onSearch"
-                        allowClear
-                        :placeholder="$t('nodeQuickLookup')"/>
-        <div class="drawer-content">
-          <a-tree
-            v-if="visibleTree"
-            style="margin-bottom: 60px;height: 600px"
-            checkable
-            :autoExpandParent="false"
-            :tree-data="gData"
-            @select="onSelect"
-            @check="checkChange"
-            @expand="onExpand"
-            :defaultExpandedKeys="defaultExpandedKeys"
-          >
-          </a-tree>
-        </div>
-      </a-spin>
-      <div class="drawer-bootom-button">
-        <a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
-        <a-button @click="handleSubmit" type="primary" :loading="submitLoading">{{$t('submit')}}</a-button>
+  <a-drawer
+    :title="$t('share')"
+    :maskClosable="false"
+    :width="600"
+    placement="right"
+    :closable="true"
+    @close="handleCancel"
+    :visible="visible"
+    style="height: 100%;overflow: auto;padding-bottom: 53px;">
+    <a-spin :spinning="confirmLoading">
+      <a-input-search style="margin-bottom: 8px" v-model="searchModel"
+                      @search="onSearch"
+                      allowClear
+                      :placeholder="$t('nodeQuickLookup')"/>
+      <div class="drawer-content">
+        <a-tree
+          v-if="visibleTree"
+          style="margin-bottom: 60px;height: 600px"
+          checkable
+          :autoExpandParent="false"
+          :tree-data="gData"
+          @select="onSelect"
+          @check="checkChange"
+          @expand="onExpand"
+          :defaultExpandedKeys="defaultExpandedKeys"
+        >
+        </a-tree>
       </div>
-    </a-drawer>
-  </div>
+    </a-spin>
+    <div class="drawer-bootom-button">
+      <a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
+      <a-button @click="handleSubmit" type="primary" :loading="submitLoading">{{$t('submit')}}</a-button>
+    </div>
+  </a-drawer>
 </template>
 
 <script>
diff --git a/src/views/documentManage/modules/PhasedImplementationModal.vue b/src/views/documentManage/modules/PhasedImplementationModal.vue
new file mode 100644
index 00000000..cbb0eda8
--- /dev/null
+++ b/src/views/documentManage/modules/PhasedImplementationModal.vue
@@ -0,0 +1,173 @@
+<template>
+  <a-modal
+    :title="title"
+    :width="900"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :maskClosable="false"
+    @cancel="visible = false"
+  >
+    <a-form-model :rules="rules" :model="tableDataGrad"
+                  ref="tableRuleForm">
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="required">*</span>
+              <span :title="$t('docLibrary.statuteNumberClause')">{{$t('docLibrary.statuteNumberClause')}}</span>
+            </div>
+            <a-form-model-item class="item-model" prop="standNumberOrClause">
+              <a-input class="box-input" v-model.trim="tableDataGrad.standNumberOrClause"
+                       :placeholder="$t('pleaseEnter')+$t('docLibrary.statuteNumberClause')"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="required">*</span>
+              <span :title="$t('docLibrary.typeofImplementation')">{{$t('docLibrary.typeofImplementation')}}</span>
+            </div>
+            <a-form-model-item class="item-model" prop="implementationType">
+              <j-multi-select-tag class="box-input" v-model="tableDataGrad.implementationType"
+                                  :placeholder="$t('pleaseSelect')+$t('docLibrary.typeofImplementation')"
+                                  :type="'select'"
+                                  @changeQuery='implementationTypeChange'
+                                  :triggerChange="false" dictCode="shi2_shi1_lei4_xing2"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="required">*</span>
+              <span :title="$t('docLibrary.implementationDateTwo')">{{$t('docLibrary.implementationDateTwo')}}</span>
+            </div>
+            <a-form-model-item class="item-model" prop="implementationDate">
+              <a-date-picker class="box-input" v-model="tableDataGrad.implementationDate"
+                             :placeholder="$t('pleaseSelect')+$t('docLibrary.implementationDateTwo')"
+                             format="YYYY-MM-DD"
+                             value-format="YYYY-MM-DD"
+                             style="width: 100%"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="24">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span :title="$t('remarks')">{{$t('remarks')}}</span>
+            </div>
+            <a-form-model-item class="item-model" style="height: auto" prop="remarks">
+              <a-textarea :placeholder="$t('pleaseEnter')+$t('remarks')"
+                          :rows="4" v-model="tableDataGrad.remarks"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <template slot="footer">
+      <a-button key="back" @click="visible = false">
+        {{ $t('cancel') }}
+      </a-button>
+      <a-button key="submit" type="primary" @click="handleTableSubmit">
+        {{ $t('determine') }}
+      </a-button>
+    </template>
+  </a-modal>
+</template>
+
+<script>
+import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
+
+export default {
+  name: 'PhasedImplementationModal',
+  components: { JMultiSelectTag },
+  data () {
+    return {
+      visible: false,
+      title: '',
+      confirmLoading: false,
+      rules: {
+        standNumberOrClause: [
+          {
+            required: true,
+            message: this.$t('docLibrary.statuteNumberClause') + this.$t('cannotEmpty'),
+            trigger: 'blur'
+          },
+          {
+            // required: true,
+            max: 200,
+            message: this.$t('docLibrary.statuteNumberClause') + this.$t('cannotExceed') + 200 + this.$t('characters'),
+            trigger: 'blur'
+          }
+        ],
+        implementationType: [
+          {
+            required: true,
+            message: this.$t('docLibrary.typeofImplementation') + this.$t('cannotEmpty'),
+            trigger: 'change'
+          }
+        ],
+        implementationDate: [
+          {
+            required: true,
+            message: this.$t('docLibrary.implementationDateTwo') + this.$t('cannotEmpty'),
+            trigger: 'change'
+          }
+        ],
+        remarks: [
+          {
+            // required: true,
+            max: 1000,
+            message: this.$t('remarks') + this.$t('cannotExceed') + 1000 + this.$t('characters'),
+            trigger: 'blur'
+          }
+        ]
+      },
+      tableDataGrad: {},
+      index: 0,
+      isEdit: false
+    }
+  },
+  methods: {
+    add () {
+      this.title = this.$t('newlyAdded')
+      this.visible = true
+      this.isEdit = false
+      this.tableDataGrad = {}
+    },
+    edit (record, index) {
+      this.title = this.$t('edit')
+      this.visible = true
+      this.isEdit = true
+      this.index = index
+      this.tableDataGrad = Object.assign({}, record)
+    },
+    // 实施类型下拉框改变
+    implementationTypeChange (val) {
+      this.tableDataGrad.implementationTypeText = val
+    },
+    // 分阶段实施详情的新增弹框
+    handleTableSubmit () {
+      this.$refs.tableRuleForm.validate(valid => {
+        if (valid) {
+          if (this.isEdit) {
+            this.$emit('submit', this.tableDataGrad, this.index)
+          } else {
+            this.$emit('submit', this.tableDataGrad)
+          }
+          this.visibleGrad = false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>