diff --git a/package.json b/package.json
index 808498f..fa3638e 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,7 @@
     "element-ui": "^2.15.6",
     "file-saver": "1.3.8",
     "fuse.js": "3.4.4",
+    "highlight.js": "^11.5.1",
     "js-beautify": "^1.10.2",
     "js-cookie": "2.2.0",
     "jsencrypt": "^3.0.0-rc.1",
@@ -49,6 +50,7 @@
     "qs": "^6.10.1",
     "screenfull": "4.2.0",
     "sortablejs": "1.8.4",
+    "vkbeautify": "^0.99.3",
     "vue": "^2.6.14",
     "vue-count-to": "^1.0.13",
     "vue-cropper": "0.4.9",
@@ -60,6 +62,7 @@
     "vuedraggable": "2.20.0",
     "vuex": "3.1.0",
     "wangeditor": "^4.7.11",
+    "x2js": "^3.4.3",
     "xlsx": "^0.17.4"
   },
   "devDependencies": {
diff --git a/src/assets/styles/archives-manage.scss b/src/assets/styles/archives-manage.scss
index 4429b00..d8a6319 100644
--- a/src/assets/styles/archives-manage.scss
+++ b/src/assets/styles/archives-manage.scss
@@ -6,6 +6,26 @@ $arcRed:#F65163;
 $arcGreen: #1AAE93;
 $arcCyan: #0FBED9;
 
+::v-deep.input-prepend{
+  position: relative;
+  .el-input__inner {
+    padding-left: 80px;
+  }
+  .el-input-group__prepend {
+    position: absolute;
+    left: 0;
+    top: 0;
+    color: #fff;
+    background-color: transparent;
+    border: none;
+    height: 32px;
+    line-height: 32px;
+    .el-input__inner {
+      padding-left: 15px;
+    }
+  }
+}
+
 .container-main{
   .left-tree-item{
     margin-bottom: 20px;
@@ -141,7 +161,7 @@ $arcCyan: #0FBED9;
   ::v-deep .is-scrolling-left,
   ::v-deep .is-scrolling-middle,
   ::v-deep .is-scrolling-right{
-    min-height: calc(100vh - 430px) !important;
+    min-height: calc(100vh - 434px) !important;
   }
 }
 ::v-deep .archives-table.el-table .el-table__fixed-right{
@@ -149,11 +169,12 @@ $arcCyan: #0FBED9;
   box-shadow: -5px 5px 10px 1px rgba(15,164,222,0.16);
 }
 
+// archives - tab
 .archives-tab{
   position: relative;
   display: flex;
   flex-direction: row;
-  padding: 0 70px;
+  padding: 0 35px;
   font-size: 16px;
   border-bottom: 1px solid #339CFF;
   z-index: 1001;
@@ -179,8 +200,80 @@ $arcCyan: #0FBED9;
 }
 
 // 上传附件
+.upload-dialog{
+  ::v-deep.el-dialog{
+    width: 940px;
+    .el-dialog__body{
+      padding: 20px 0;
+    }
+  }
+}
 .upload-file{
   .upload-curd{
-    margin: 20px 32px;
+    display: flex;
+    flex-direction: row;
+    margin: 0 32px 20px 32px;
+  }
+  .upload-demo{
+    position: relative;
+    margin-right: 10px;
+    ::v-deep .el-upload-list{
+      display: none;
+      position: absolute;
+      left: 0;
+      bottom: 0;
+    }
   }
+}
+.screenshot{
+  display: block;
+  margin: 0 auto;
+  object-fit: cover;
+}
+.file-down{
+  display: block;
+  width: 66px;
+  height: 28px;
+  line-height: 28px;
+  padding: 0;
+  color: #fff;
+  background-color: #339CFF;
+  border-radius: 2px;
+  margin: 0 auto;
+  &::before{
+    margin-right: 5px;
+  }
+}
+
+.drag-tip {
+  display: block;
+  padding-left: 20px;
+  padding-bottom: 10px;
+  font-style: normal;
+  font-weight: bold;
+  color: #fff;
+}
+
+// 档案详情
+.base-info{
+  padding-top: 20px;
+  color: #fff;
+  .base-info-item{
+    display: flex;
+    flex-direction: row;
+    margin-bottom: 20px;
+    span{
+      display: block;
+      width: 160px;
+      text-align: right;
+      color: #3A99FD;
+    }
+    p{
+      flex: 1;
+    }
+  }
+}
+::v-deep.hljs{
+  color: #fff;
+  background-color: transparent;
 }
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 65eb83c..30f914a 100644
--- a/src/main.js
+++ b/src/main.js
@@ -46,6 +46,9 @@ Vue.use(Element, {
   size: Cookies.get('size') || 'small' // set element-ui default size
 })
 
+import X2js from 'x2js' // xml数据处理插件
+Vue.prototype.$x2js = new X2js() // 创建x2js对象，挂到vue原型上
+
 Vue.config.productionTip = false
 
 new Vue({
diff --git a/src/views/archivesManage/archivesList/archivesDetail.vue b/src/views/archivesManage/archivesList/archivesDetail.vue
index b10ce10..c60f0ce 100644
--- a/src/views/archivesManage/archivesList/archivesDetail.vue
+++ b/src/views/archivesManage/archivesList/archivesDetail.vue
@@ -1,28 +1,39 @@
 <template>
-  <div class="rrr">
+  <div>
     <!--工具栏-->
     <div class="head-container">
       <div class="head-archives-top">
         <div class="head-search">
           <!-- 搜索 -->
-          <el-input v-model="query.blurry" clearable size="small" placeholder="请输入关键词" prefix-icon="el-icon-search" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
-          <el-select v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 100px" @change="crud.toQuery">
+          <el-select v-if="selectedCategory.isType === 3 || selectedCategory.isType === 5" v-model="query.enabled" clearable size="small" placeholder="状态" class="filter-item" style="width: 100px" @change="crud.toQuery">
             <i slot="prefix" class="iconfont icon-zhuangtai-fanbai" />
             <el-option v-for="item in stateOptions" :key="item.key" :label="item.label" :value="item.key" />
           </el-select>
+          <el-input v-model="query[inputSelect]" clearable size="small" placeholder="请输入关键词" style="width: 200px;" class="input-prepend filter-item" @keyup.enter.native="crud.toQuery">
+            <el-select slot="prepend" v-model="inputSelect" style="width: 80px" @change="querySelect">
+              <el-option
+                v-for="item in queryOption"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-input>
           <rrOperation />
         </div>
-        <el-checkbox v-model="fixedStatusBar">隐藏固定状态栏</el-checkbox>
+        <el-checkbox v-if="selectedCategory.isType !== 1 && selectedCategory.isType !== 2" v-model="fixedStatusBar">隐藏固定状态栏</el-checkbox>
       </div>
       <crudOperation :permission="permission">
         <template v-slot:right>
           <el-button v-permission="permission.del" icon="el-icon-delete" size="mini" :loading="crud.delAllLoading" :disabled="crud.selections.length === 0" @click="toDelete(crud.selections)">删除</el-button>
-          <el-button v-permission="permission.download" :loading="crud.downloadLoading" :disabled="!crud.data.length" size="mini" icon="el-icon-download" @click="crud.doExport">导出</el-button>
+          <el-button v-if="selectedCategory.isType !== 1 && selectedCategory.isType !== 2" v-permission="permission.download" :loading="crud.downloadLoading" :disabled="!crud.data.length" size="mini" icon="el-icon-download" @click="crud.doExport">导出</el-button>
+          <el-button v-if="selectedCategory.isType === 4 || selectedCategory.isType === 5" :disabled="crud.selections.length !== 1" size="mini" icon="el-icon-download" @click="uploadFile">上传附件</el-button>
         </template>
         <template v-slot:rightButtonGroup>
-          <div class="archives-handler-btn">
+          <div v-if="selectedCategory.isType === 3 || selectedCategory.isType === 5" class="archives-handler-btn">
             <el-button class="packing-btn iconfont icon-weibiaoti-2" type="primary">装盒</el-button>
-            <el-button class="warehousing-btn iconfont icon-weibiaoti-2" type="primary">入库</el-button>
+            <el-button v-if="selectedCategory.isType === 3" class="part-btn iconfont icon-weibiaoti-2" type="primary">分卷装盒</el-button>
+            <!-- <el-button class="warehousing-btn iconfont icon-weibiaoti-2" type="primary">入库</el-button> -->
             <el-button class="lending-btn iconfont icon-weibiaoti-2" type="primary">借阅</el-button>
             <el-button class="binding-btn iconfont icon-weibiaoti-2" type="primary">绑定标签</el-button>
           </div>
@@ -34,20 +45,26 @@
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
-        <!-- tab -->
-        <ul class="archives-tab">
-          <li :class="{'active': archivesTabIndex == 0}" @click="changeActiveTab(0)">基本信息</li>
-          <li v-if="isEditOrAdd !== 'add'" :class="{'active': archivesTabIndex == 1}" @click="changeActiveTab(1)">上传附件</li>
-        </ul>
         <!-- form -->
         <PreviewForm v-if="formPreviewData.length && archivesTabIndex == 0" ref="previewForm" :is-disabled="false" :form-preview-data.sync="formPreviewData" :selected-category="selectedCategory" :arc-id="arcId" />
-        <!-- 上传附件 -->
-        <UploadFile v-if="archivesTabIndex==1" />
         <div slot="footer" class="dialog-footer">
           <el-button :loading="crud.status.cu === 2" type="primary" @click="handlerArchivesSubmit">保存</el-button>
         </div>
       </div>
     </el-dialog>
+
+    <!-- 上传附件 -->
+    <el-dialog class="upload-dialog" :modal-append-to-body="false" :close-on-click-modal="false" :before-close="handleClose" :visible.sync="uploadFileVisible" title="上传附件">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <UploadFile :is-upload-detail="true" />
+        <div slot="footer" class="dialog-footer">
+          <el-button :loading="crud.status.cu === 2" type="primary" @click="uploadFileSave">保存</el-button>
+        </div>
+      </div>
+    </el-dialog>
+
     <!-- 删除档案 -->
     <el-dialog title="删除档案" :visible.sync="deleteVisible" :before-close="handleClose">
       <span class="dialog-right-top" />
@@ -66,8 +83,9 @@
         </div>
       </div>
     </el-dialog>
+
     <!-- table表格渲染 -->
-    <el-table ref="table" v-loading="crud.loading || getTableDisplayFieldsLoading" class="archives-table" :data="crud.data" highlight-current-row style="width: 100%; " height="calc(100vh - 370px)" @selection-change="crud.selectionChangeHandler" @row-click="clickRowHandler">
+    <el-table ref="table" v-loading="crud.loading || getTableDisplayFieldsLoading" class="archives-table" :data="crud.data" highlight-current-row style="width: 100%; " height="calc(100vh - 370px)" @selection-change="crud.selectionChangeHandler" @row-click="clickRowHandler" @cell-dblclick="tableDoubleClick">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column type="index" label="序号" width="55" align="center" />
       <el-table-column v-for="field in tableDisplayFields" :key="field.id" :label="field.fieldCnName" :align="field.displayformatType" :width="field.displayLength" show-overflow-tooltip>
@@ -75,26 +93,26 @@
           {{ scope.row[field.fieldName] }}
         </template>
       </el-table-column>
-      <el-table-column label="装盒" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
+      <el-table-column v-if="selectedCategory.isType !== 1 && selectedCategory.isType !== 2" label="装盒" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
         <!-- state-active 已装/已入/已借/已绑 -->
         <template slot-scope="scope">
           <!-- 未装 / 已装 -->
           <span class="row-state row-packing state-active">{{ scope.row.case_no ? '已装': '未装' }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="入库" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
+      <el-table-column v-if="selectedCategory.isType !== 1 && selectedCategory.isType !== 2" label="入库" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
         <template slot-scope="">
           <!-- 未入 / 已入 -->
           <span class="row-state row-warehousing">未入</span>
         </template>
       </el-table-column>
-      <el-table-column label="借阅" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
+      <el-table-column v-if="selectedCategory.isType === 3 || selectedCategory.isType === 5" label="借阅" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
         <template slot-scope="">
           <!-- 待借 / 不可借-用“—” 表示 / 已借 -->
           <span class="row-state row-lending">—</span>
         </template>
       </el-table-column>
-      <el-table-column label="标签" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
+      <el-table-column v-if="selectedCategory.isType === 3 || selectedCategory.isType === 5" label="标签" width="100" align="center" :fixed="fixedStatusBar?false:'right'">
         <template slot-scope="scope">
           <!-- 未绑 / 已绑 -->
           <span class="row-state row-binding">{{ scope.row.tid ? '已绑': '未绑' }}</span>
@@ -103,21 +121,35 @@
     </el-table>
     <!--分页组件-->
     <pagination />
+
+    <!-- 删除档案 -->
+    <el-dialog class="upload-dialog" title="档案详情" :visible.sync="archivesInfoVisible" :before-close="handleClose">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <ArchivesInfo />
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click.native="handleDeltConfirm">确定</el-button>
+        </div>
+      </div>
+    </el-dialog>
+
   </div>
 </template>
 
 <script>
 import { add, edit, del, getTableDisplayFields, getFormDisplayFields } from '@/api/archivesManage/archivesList'
-import CRUD, { presenter, header, form, crud } from '@crud/crud'
+import CRUD, { presenter, header, form } from '@crud/crud'
 import { initData } from '@/api/data'
 import crudOperation from '@crud/CRUD.operation'
 import rrOperation from '@crud/RR.operation'
 import pagination from '@crud/Pagination'
 import PreviewForm from '@/views/components/category/PreviewForm'
 import UploadFile from './module/uploadFile'
+import ArchivesInfo from './module/archivesInfo'
 
 export default {
-  components: { crudOperation, rrOperation, pagination, PreviewForm, UploadFile },
+  components: { crudOperation, rrOperation, pagination, PreviewForm, UploadFile, ArchivesInfo },
   mixins: [
     presenter(),
     header(),
@@ -161,6 +193,12 @@ export default {
         { key: '5', label: '待借' },
         { key: '6', label: '已借' }
       ],
+      queryOption: [
+        { value: 'maintitle', label: '题名' },
+        { value: 'archive_no', label: '档号' },
+        { value: 'archive_year', label: '年度' }
+      ],
+      inputSelect: '',
       permission: {
         add: ['admin', 'archivesList:add'],
         edit: ['admin', 'archivesList:edit'],
@@ -178,7 +216,9 @@ export default {
       archivesTabIndex: 0, // 新增
       tabDisabled: true,
       arcId: null, // 档案ID
-      arrySort: []
+      arrySort: [],
+      uploadFileVisible: false, // 上传附件
+      archivesInfoVisible: false // 档案详情
     }
   },
   watch: {
@@ -193,48 +233,50 @@ export default {
       this.doLayout()
     }
   },
+  created() {
+    // 初始化带select的输入框的 - 搜索
+    this.inputSelect = this.queryOption[0].value
+  },
   mounted() {
   },
   methods: {
-    // 获取数据前设置默认参数
-    // [CRUD.HOOK.beforeRefresh]() {
-    //   this.crud.query.id = this.dicPid
-    // },
-    // [CRUD.HOOK.afterRefresh](crud) {
-    //   console.log(this.curd)
-    //   // if (this.needRefreshTree) {
-    //   //   this.$emit('treeRefresh', crud.data)
-    //   // }
-    // },
+    // 搜索-select
+    querySelect(val) {
+      this.inputSelect = val
+    },
     [CRUD.HOOK.beforeRefresh]() {
       this.getTableDisplayFieldsLoading = true
       // 档案列表获取显示列
       getTableDisplayFields({ categoryId: this.selectedCategory.id }).then(data => {
         this.tableDisplayFields = data
         this.getTableDisplayFieldsLoading = false
-
         this.tableDisplayFields.map(item => {
-          if (item.displayOrder) {
+          if (item.queue) {
             this.arrySort.push(item.fieldName + ', ' + (item.displayOrder === 1 ? 'asc' : 'desc'))
           }
         })
-        console.log(this.arrySort)
         this.crud.sort = this.arrySort
         new Promise((resolve, reject) => {
-          crud.loading = true
+          this.crud.loading = true
           // 请求数据
-          initData(crud.url, crud.getQueryParams()).then(data => {
-            const table = crud.getTable()
+          initData(this.crud.url, this.crud.getQueryParams()).then(data => {
+            const table = this.crud.getTable()
             if (table && table.lazy) { // 懒加载子节点数据，清掉已加载的数据
               table.store.states.treeData = {}
               table.store.states.lazyTreeNodeMap = {}
             }
-            crud.page.total = data.totalElements !== null ? data.totalElements : data.length
-            crud.data = data.content ? data.content : data
-            crud.resetDataStatus()
-            resolve(data)
+            if (data) {
+              this.crud.page.total = data.totalElements !== null ? data.totalElements : data.length
+              this.crud.data = data.content ? data.content : data
+              this.crud.resetDataStatus()
+              resolve(data)
+              // time 毫秒后显示表格
+              setTimeout(() => {
+                this.crud.loading = false
+              }, this.crud.time)
+            }
           }).catch(err => {
-            crud.loading = false
+            this.crud.loading = false
             reject(err)
           })
         })
@@ -255,23 +297,38 @@ export default {
       this.form.dictionaryConfigId = {}
       this.formPreviewData = []
       // 档案预编辑获取字段
-      getFormDisplayFields({ categoryId: this.selectedCategory.id }).then(data => {
+      const params = {
+        categoryId: this.selectedCategory.id,
+        archivesId: this.arcId
+      }
+      this.getFormInfo(params)
+    },
+    // 著录界面-form/详情-api
+    getFormInfo(params) {
+      getFormDisplayFields(params).then(data => {
         // this.formPreviewData = data.showFiled.filter((fields) => { return fields.isInput })
         this.formPreviewData = data.showFiled
         this.form.categoryId = this.selectedCategory.id
         this.$nextTick(() => {
           if (this.isEditOrAdd === 'edit') {
-            this.$refs.previewForm.addOrUpdateForm = this.selectedData[0]
+            this.$refs.previewForm.addOrUpdateForm = data.echo
           }
         })
       })
     },
-    changeActiveTab(index) {
-      this.archivesTabIndex = index
-    },
+    // form - submit
     handlerArchivesSubmit() {
       this.$refs.previewForm.submitForm('addOrUpdateForm')
     },
+    // table - 双击查看详情
+    tableDoubleClick(row) {
+      this.archivesInfoVisible = true
+      const params = {
+        categoryId: this.selectedCategory.id,
+        archivesId: row.id
+      }
+      this.getFormInfo(params)
+    },
     // table - 当前选中得row
     clickRowHandler(row) {
       this.$refs.table.toggleRowSelection(row)
@@ -315,6 +372,12 @@ export default {
       this.$nextTick(() => {
         this.$refs.table.doLayout()
       })
+    },
+    uploadFile() {
+      this.uploadFileVisible = true
+    },
+    uploadFileSave() {
+      this.uploadFileVisible = false
     }
   }
 }
@@ -324,14 +387,11 @@ export default {
 @import "~@/assets/styles/archives-manage.scss";
 .preview-dialog {
 ::v-deep .el-dialog {
-    width: 940px !important;
     .el-dialog__body{
       padding: 0;
-      height: calc(100vh - 174px);
     }
     .preview-content {
       width: auto !important;
-      padding: 20px 144px 0 150px!important;
       margin-right: 6px;
       overflow: hidden;
       overflow-y: auto;
@@ -340,12 +400,9 @@ export default {
         background-color: transparent;
       }
     }
-    .el-dialog__header {
-      width: 420px;
-    }
     .dialog-footer{
       margin: 0 auto;
-      padding: 15px 0 30px 0;
+      padding: 15px 0 20px 0;
     }
   }
 }
diff --git a/src/views/archivesManage/archivesList/module/archivesInfo.vue b/src/views/archivesManage/archivesList/module/archivesInfo.vue
new file mode 100644
index 0000000..fc81ae2
--- /dev/null
+++ b/src/views/archivesManage/archivesList/module/archivesInfo.vue
@@ -0,0 +1,90 @@
+<template>
+  <div class="archives-info-wrap">
+    <!-- tab -->
+    <ul class="archives-tab">
+      <li :class="{'active': archivesTabIndex == 0}" @click="changeActiveTab(0)">基本信息</li>
+      <li :class="{'active': archivesTabIndex == 1}" @click="changeActiveTab(1)">附件</li>
+      <li :class="{'active': archivesTabIndex == 2}" @click="changeActiveTab(2)">元数据</li>
+    </ul>
+    <!-- 基本信息 -->
+    <div v-if="archivesTabIndex==0" class="base-info">
+      <el-row>
+        <el-col :span="12" class="base-info-item">
+          <span>全宗号：</span>
+          <p>父区域-子区域-设备1-1区1列1节1层左边</p>
+        </el-col>
+        <el-col :span="12" class="base-info-item">
+          <span>TID：</span>
+          <p>E2806894200040159AF8AD06</p>
+        </el-col>
+        <el-col :span="12" class="base-info-item">
+          <span>全宗号：</span>
+          <p>父区域-子区域-设备1-1区1列1节1层左边</p>
+        </el-col>
+        <el-col :span="12" class="base-info-item">
+          <span>TID：</span>
+          <p>E2806894200040159AF8AD06</p>
+        </el-col>
+      </el-row>
+    </div>
+    <!-- 附件 -->
+    <UploadFile v-if="archivesTabIndex==1" :is-upload-detail="false" />
+    <!-- 元数据 -->
+    <div v-if="archivesTabIndex==2">
+      <pre v-highlightjs="xml_show">
+        <code class="highlight_s" />
+      </pre>
+    </div>
+  </div>
+</template>
+
+<script>
+import vkbeautify from 'vkbeautify'
+import { form } from '@crud/crud'
+import UploadFile from './uploadFile'
+export default {
+  name: 'ArchivesInfo',
+  components: { UploadFile },
+  mixins: [
+    form({})
+  ],
+  data() {
+    return {
+      archivesTabIndex: 0,
+      textareaoutput: null,
+      xml_show: null
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.setXml()
+  },
+  methods: {
+    setXml() {
+      const xmlstr = `<?xml version="1.0" encoding="UTF-8"?>
+          <note>
+          <to>Tove</to>
+          <from>Jani</from> 
+          <heading>Reminder</heading>
+          <body>Don't forget me this weekend!</body>
+          </note>`
+
+      this.xml_show = vkbeautify.xml(xmlstr)
+
+      console.log('xmlstr:', xmlstr)
+      console.log('xml转json:', this.$x2js.xml2js(xmlstr))
+      console.log('json转xml:', this.$x2js.js2xml(this.$x2js.xml2js(xmlstr)))
+      this.textareaoutput = xmlstr
+    },
+    changeActiveTab(index) {
+      this.archivesTabIndex = index
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/archives-manage.scss";
+
+</style>
diff --git a/src/views/archivesManage/archivesList/module/packing.vue b/src/views/archivesManage/archivesList/module/packing.vue
new file mode 100644
index 0000000..2f025df
--- /dev/null
+++ b/src/views/archivesManage/archivesList/module/packing.vue
@@ -0,0 +1,79 @@
+<template>
+  <div class="upload-file">
+    <!-- 上传附件curd -->
+    <div class="upload-curd">
+      ddd
+    </div>
+    <!--表格渲染-->
+    <el-table
+      ref="table"
+      :data="tableData"
+      style="min-width: 100%"
+      height="calc(100vh - 382px)"
+      @row-click="clickRowHandler"
+      @selection-change="selectionChangeHandler"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="index" label="序号" width="55" align="center" />
+      <el-table-column prop="fileName" label="文件名称" min-width="140" align="center" />
+      <el-table-column prop="fileFormat" label="格式" min-width="60" align="center" />
+      <el-table-column prop="fileSize" label="大小" min-width="85" align="center" />
+      <el-table-column prop="fileDpi" label="分辨率" min-width="85" align="center" />
+      <el-table-column prop="fileCover" label="缩览图" min-width="60" align="center">
+        <template slot-scope="scope">
+          <div v-if="scope.row.fileCover">
+            <img width="60px" height="32px" style="object-fit:cover;" :src="scope.row.fileCover" @click="showCoverVisible=true">
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="create_date" label="创建时间" min-width="100" align="center" />
+    </el-table>
+  </div>
+</template>
+
+<script>
+import { form } from '@crud/crud'
+import data from './data.json'
+export default {
+  name: 'UploadFile',
+  components: {},
+  mixins: [
+    form({})
+  ],
+  data() {
+    return {
+      tableData: [],
+      selections: [],
+      showCoverVisible: false,
+      fileList: [], // 上传list
+      sortVisible: false, // 排序
+      sortTableData: [],
+      deleteVisible: false,
+      deleteData: []
+    }
+  },
+  created() {
+    this.tableData = data.data
+  },
+  methods: {
+    // table
+    clickRowHandler(row) {
+      this.$refs.table.toggleRowSelection(row)
+    },
+    // table
+    selectionChangeHandler(val) {
+      this.selections = val
+    },
+    // dialog - close
+    handleClose(done) {
+      this.showCoverVisible = false
+      done()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/archives-manage.scss";
+
+</style>
diff --git a/src/views/archivesManage/archivesList/module/uploadFile.vue b/src/views/archivesManage/archivesList/module/uploadFile.vue
index d7436f8..11a27d7 100644
--- a/src/views/archivesManage/archivesList/module/uploadFile.vue
+++ b/src/views/archivesManage/archivesList/module/uploadFile.vue
@@ -1,11 +1,20 @@
 <template>
   <div class="upload-file">
     <!-- 上传附件curd -->
-    <div class="upload-curd">
-      <el-button icon="el-icon-plus">新增</el-button>
-      <el-button icon="el-icon-delete" :disabled="selections.length === 0">删除</el-button>
-      <el-button icon="el-icon-sort">排序</el-button>
+    <div v-if="isUploadDetail" class="upload-curd">
+      <!-- <el-button icon="el-icon-plus">新增</el-button> -->
+      <el-upload
+        class="upload-demo"
+        action="#"
+        :on-preview="handlePreview"
+        :file-list="fileList"
+      >
+        <el-button icon="el-icon-plus" size="small" type="primary">新增</el-button>
+      </el-upload>
+      <el-button icon="el-icon-delete" :disabled="selections.length === 0" @click="toDelete(selections)">删除</el-button>
+      <el-button icon="el-icon-sort" @click="sortVisible = true">排序</el-button>
     </div>
+
     <!--表格渲染-->
     <el-table
       ref="table"
@@ -24,11 +33,16 @@
       <el-table-column prop="fileCover" label="缩览图" min-width="60" align="center">
         <template slot-scope="scope">
           <div v-if="scope.row.fileCover">
-            <img width="60px" height="32px" style="object-fit:cover;" :src="scope.row.fileCover" @click="showCoverVisible=true">
+            <img width="60px" height="32px" class="screenshot" :src="scope.row.fileCover" @click="showCoverVisible=true">
           </div>
         </template>
       </el-table-column>
       <el-table-column prop="create_date" label="创建时间" min-width="100" align="center" />
+      <el-table-column v-if="!isUploadDetail" label="操作" min-width="100" align="center">
+        <template>
+          <el-button class="file-down iconfont icon-weibiaoti-2">下载</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <!-- 点击缩略图看大图 -->
@@ -39,11 +53,42 @@
         <img style="width:100%; height:100%;" src="https://qiniu.aiyxlib.com/yuekan-5-h5bg.jpg">
       </div>
     </el-dialog>
+
+    <!-- 排序 -->
+    <el-dialog :close-on-click-modal="false" :append-to-body="true" title="排序" :visible.sync="sortVisible" @opened="opened">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <i class="drag-tip">提示：请通过拖动鼠标来调整当前顺序</i>
+        <el-table :data="sortTableData" class="file-sort" style="width: 100%;max-height: 70vh;" row-key="id">
+          <el-table-column type="index" label="序号" width="100" align="center" />
+          <el-table-column prop="cnName" label="文件名称" />
+        </el-table>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click.native="handleSort">保存</el-button>
+        </div>
+      </div>
+    </el-dialog>
+
+    <!-- 删除附件 -->
+    <el-dialog title="删除附件" :append-to-body="true" :visible.sync="deleteVisible" :before-close="handleClose">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <div class="dialog-delt">
+          <p><span>确定删除已选择的附件吗？</span></p>
+        </div>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click.native="handleDeltConfirm">确定</el-button>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { form } from '@crud/crud'
+import Sortable from 'sortablejs'
 import data from './data.json'
 export default {
   name: 'UploadFile',
@@ -51,23 +96,101 @@ export default {
   mixins: [
     form({})
   ],
+  props: {
+    isUploadDetail: {
+      type: Boolean,
+      default: true
+    }
+  },
   data() {
     return {
       tableData: [],
       selections: [],
-      showCoverVisible: false
+      showCoverVisible: false,
+      fileList: [], // 上传list
+      sortVisible: false, // 排序
+      sortTableData: [],
+      deleteVisible: false,
+      deleteData: []
     }
   },
   created() {
     this.tableData = data.data
+    console.log(this.isUploadDetail)
   },
   methods: {
+    // 新增
+    handlePreview(file) {
+      console.log(file)
+    },
+    // 选择删除
+    toDelete(data) {
+      console.log(data)
+      this.deleteData = data
+      this.deleteVisible = true
+    },
+    // 确认删除
+    handleDeltConfirm() {
+      this.deleteVisible = false
+      const ids = []
+      this.deleteData.forEach(val => {
+        ids.push(val.id)
+      })
+      // const params = {
+      //   'ids': ids,
+      //   'categoryId': this.selectedCategory.id
+      // }
+      // 删除fetch
+      // del(params).then(res => {
+      //   this.crud.delAllLoading = false
+      //   this.$notify({
+      //     title: '删除成功',
+      //     type: 'success',
+      //     duration: 2500
+      //   })
+      //   this.crud.refresh()
+      // })
+    },
+    // 排序 -  行拖拽
+    rowDrop(className, targetName) {
+      // 此时找到的元素是要拖拽元素的父容器
+      const tbody = document.querySelector('.' + className + ' .el-table__body-wrapper tbody')
+      const that = this
+      Sortable.create(tbody, {
+        // 指定父元素下可被拖拽的子元素
+        draggable: '.el-table__row',
+        onEnd({ newIndex, oldIndex }) {
+          if (newIndex === oldIndex) return
+          that[targetName].splice(newIndex, 0, that[targetName].splice(oldIndex, 1)[0])
+        }
+      })
+    },
+    // 排序
+    opened() {
+      this.rowDrop('file-sort', 'sortTableData')
+    },
+    // 排序 - data
+    handleSort() {
+      // const data = this.sortTableData.map((value, index) => {
+      //   return { id: value.id, sort: index + 1 }
+      // })
+      // this.sortTableData.forEach((item, index) => {
+      //   item.categorySeq = index + 1
+      // })
+      // sort(data).then(() => {
+      //   this.sortVisible = false
+      //   this.$emit('treeNodeSort', this.sortTableData)
+      // })
+    },
+    // table
     clickRowHandler(row) {
       this.$refs.table.toggleRowSelection(row)
     },
+    // table
     selectionChangeHandler(val) {
       this.selections = val
     },
+    // dialog - close
     handleClose(done) {
       this.showCoverVisible = false
       done()
@@ -78,4 +201,5 @@ export default {
 
 <style lang="scss" scoped>
 @import "~@/assets/styles/archives-manage.scss";
+
 </style>
diff --git a/src/views/components/category/PreviewForm.vue b/src/views/components/category/PreviewForm.vue
index 0fad6fb..2b5daaa 100644
--- a/src/views/components/category/PreviewForm.vue
+++ b/src/views/components/category/PreviewForm.vue
@@ -3,7 +3,7 @@
     <el-row :gutter="4">
       <el-form ref="addOrUpdateForm" :model="addOrUpdateForm" :rules="rules" :validate-on-rule-change="false" label-width="120px">
         <draggable v-bind="{draggable:'.drag-item',animation:500}" :disabled="!isDisabled" @update="datadragEnd">
-          <el-col v-for="(item,index) in formPreviewData" :key="index" class="drag-item" :span="item.isLine ? 24 : 12">
+          <el-col v-for="(item,index) in formPreviewData" :key="index" :class="['drag-item',item.fieldName === 'barcode'? 'barcode-input':'']" :span="item.isLine || item.fieldName === 'barcode' ? 24 : 12">
             <el-form-item :label="item.fieldCnName" :prop="item.fieldName">
               <!-- select  :load-options="loadOptions"-->
               <treeselect
@@ -12,7 +12,7 @@
                 :options="item.options"
                 :normalizer="normalizer"
                 placeholder=""
-                :style="{ width: item.editLength+'px'}"
+                :style="{ width: item.editLength+14+'px'}"
                 :disabled="isDisabled"
                 :validate-event="!isDisabled"
                 no-options-text="无数据"
@@ -22,7 +22,7 @@
               <!-- text / number / textarea / popover -->
               <!-- :validate-event="isDisabled" -->
               <el-input
-                v-if="item.isInputClass !== 'select' && item.isInputClass !== 'date'"
+                v-if="item.isInputClass !== 'select' && item.isInputClass !== 'date' && item.fieldName !== 'barcode' "
                 v-model="addOrUpdateForm[item.fieldName]"
                 :type="item.isInputClass === 'popover'? 'text' : item.isInputClass"
                 :rows="item.isInputClass === 'textarea' ? 3 : ''"
@@ -35,6 +35,17 @@
               >
                 <i v-if="item.isInputClass === 'popover'" slot="suffix" class="el-input__icon iconfont icon-weibiaoti-2" @click="handleCurrentFieldName(item)" />
               </el-input>
+              <div v-if="item.fieldName === 'barcode' " class="last-barcode">
+                <el-input
+                  v-model="addOrUpdateForm[item.fieldName]"
+                  type="text"
+                  style="width: 510px"
+                  :disabled="isDisabled"
+                  :validate-event="!isDisabled"
+                  @keyup.enter.native="isRepeatHandle(item)"
+                  @blur="isRepeatHandle(item)"
+                />
+              </div>
               <!-- date -->
               <el-date-picker
                 v-if="item.isInputClass === 'date'"
@@ -292,7 +303,7 @@ export default {
 <style lang="scss" scoped>
 .preview-content {
   width: 640px !important;
-  height: calc(100vh - 312px);
+  // height: calc(100vh - 312px);
   padding: 20px 0 0 0 !important;
   margin-top: 0 !important;
   border-radius: 4px;