diff --git a/src/assets/styles/collect-reorganizi.scss b/src/assets/styles/collect-reorganizi.scss
new file mode 100644
index 0000000..fa9b6f8
--- /dev/null
+++ b/src/assets/styles/collect-reorganizi.scss
@@ -0,0 +1,59 @@
+@import 'variables';
+@import 'mixin';
+
+.connection-header{
+  padding: 0 10px 0 20px;
+  height: auto;
+  border-top: none;
+  ::v-deep .el-date-editor.el-input, .el-date-editor.el-input__inner {
+    width: 220px !important;
+  }
+  .crud-opts{
+    display: block;
+  }
+}
+
+::v-deep .el-dialog{
+  width: 860px;
+  .el-dialog__body{
+    padding: 10px 0 30px 0;
+  }
+}
+.hitch-info{
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  margin-bottom: 10px;
+  li{
+    width: 50%;
+    font-size: 14px;
+    line-height: 28px;
+    span{
+      display: inline-block;
+      width:80px;
+      text-align: right;
+      color: #0C0E1E;
+    }
+    i{
+      font-style: normal;
+    }
+  }
+}
+
+// 2023-10-9 收集整编
+.success-status{
+  color: #2ECAAC;
+}
+.error-status{
+  color: #ED4A41;
+}
+
+.four-icon{
+  font-size: 12px;
+  &.icon-zhengque{
+    color: #07A35A;
+  }
+  &.icon-cuowu{
+    color: #ED4A41;
+  }
+}
\ No newline at end of file
diff --git a/src/views/collectReorganizi/batchConnection/index.vue b/src/views/collectReorganizi/batchConnection/index.vue
index f821a4f..a26656b 100644
--- a/src/views/collectReorganizi/batchConnection/index.vue
+++ b/src/views/collectReorganizi/batchConnection/index.vue
@@ -145,21 +145,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.connection-header{
-  padding: 0 10px 0 20px;
-  height: auto;
-  border-top: none;
-  ::v-deep .el-date-editor.el-input, .el-date-editor.el-input__inner {
-    width: 220px;
-  }
-  .crud-opts{
-    display: block;
-  }
-}
-.success-status{
-  color: #2ECAAC;
-}
-.error-status{
-  color: #ED4A41;
-}
+@import "~@/assets/styles/collect-reorganizi.scss";
 </style>
diff --git a/src/views/collectReorganizi/batchConnection/module/detail.vue b/src/views/collectReorganizi/batchConnection/module/detail.vue
index f09edb4..b91729b 100644
--- a/src/views/collectReorganizi/batchConnection/module/detail.vue
+++ b/src/views/collectReorganizi/batchConnection/module/detail.vue
@@ -8,7 +8,7 @@
         <li><span>操作人：</span>admin</li>
         <li><span style="width: 114px;">操作时间：</span>2016-09-21 08:50:08</li>
         <li style="width: 100%;"><span>挂接字段：</span>$archival_code$</li>
-        <li style="width: 100%;"><span>挂接结果：</span>共 2 条原文，成功 1 条，失败 1 条</li>
+        <li style="width: 100%;"><span>挂接结果：</span>共 2 条原文，成功 <i class="success-status">1</i>  条，失败 <i class="error-status">1</i>  条</li>
       </ul>
       <el-table ref="table" :data="tableData" style="width: 100%;">
         <el-table-column prop="name" label="文件名称" />
@@ -70,29 +70,7 @@ export default {
 </script>
 
 <style lang='scss' scoped>
-::v-deep .el-dialog{
-  width: 860px;
-  .el-dialog__body{
-    padding: 10px 0 30px 0;
-  }
-}
-.hitch-info{
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-  margin-bottom: 10px;
-  li{
-    width: 50%;
-    font-size: 14px;
-    line-height: 28px;
-    span{
-      display: inline-block;
-      width:80px;
-      text-align: right;
-      color: #0C0E1E;
-    }
-  }
-}
+@import "~@/assets/styles/collect-reorganizi.scss";
 .row-state{
   padding: 0 10px;
 }
diff --git a/src/views/collectReorganizi/externalReception/index.vue b/src/views/collectReorganizi/externalReception/index.vue
new file mode 100644
index 0000000..5dfb57e
--- /dev/null
+++ b/src/views/collectReorganizi/externalReception/index.vue
@@ -0,0 +1,176 @@
+<template>
+  <div class="app-container  row-container">
+    <div class="connection-header collect-header">
+      <div class="head-search">
+        <date-range-picker v-model="blurryTime" class="date-item" />
+        <rrOperation />
+      </div>
+      <crudOperation>
+        <template v-slot:right>
+          <el-button size="mini" :disabled="crud.selections.length === 0" @click="doDetection(crud.selections)">
+            <i class="iconfont icon-shangchuan2" />
+            上传接收
+          </el-button>
+          <el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
+            <i class="iconfont icon-daochu" />
+            导出
+          </el-button>
+        </template>
+      </crudOperation>
+    </div>
+    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 330px)" @selection-change="crud.selectionChangeHandler" @row-dblclick="handleDetail">
+      <el-table-column type="selection" align="center" width="55" />
+      <el-table-column prop="code" label="接收编号" />
+      <el-table-column prop="status" label="接收状态" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status===1" class="row-state end-state">成功</span>
+          <span v-else class="row-state cancel-state">失败</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="remark" label="接收说明">
+        <template slot-scope="scope">
+          <span>{{ scope.row.remark===null ? '-' : scope.row.remark }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="create_by" label="检测人员" width="100" />
+      <el-table-column prop="create_time" label="操作时间">
+        <template slot-scope="scope">
+          <div>{{ scope.row.create_time | parseTime }}</div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!--分页组件-->
+    <pagination v-if="crud.data.length !== 0" />
+    <EepDetail ref="mDetail" />
+  </div>
+
+</template>
+
+<script>
+// import crudConnection from '@/api/system/role'
+import crudRoles from '@/api/system/role'
+import CRUD, { presenter, header, crud } from '@crud/crud'
+import DateRangePicker from '@/components/DateRangePicker'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import pagination from '@crud/Pagination'
+import EepDetail from './module/detail'
+// import { exportFile } from '@/utils/index'
+// import qs from 'qs'
+import { mapGetters } from 'vuex'
+
+const data = [
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'code': '230c4a438fa84b2c9a0405c99e7f5cb1',
+    'status': 1,
+    'remark': null,
+    'create_by': 'admin',
+    'create_time': 1687330805000
+  },
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'code': '230c4a438fa84b2c9a0405c99e7f5cb2',
+    'status': 0,
+    'remark': '请检查zip包格式是否正确',
+    'create_by': 'admin',
+    'create_time': 1687330805000
+  }
+]
+
+export default {
+  name: 'ExternalReception',
+  components: { EepDetail, DateRangePicker, rrOperation, crudOperation, pagination },
+  cruds() {
+    return [
+      CRUD({
+        title: '外部接收', url: 'api/role/initRoleList',
+        crudMethod: { ...crudRoles },
+        optShow: {
+          add: false,
+          edit: false,
+          del: false,
+          reset: true,
+          download: false,
+          group: false
+        }
+      })
+    ]
+  },
+  mixins: [presenter(), header(), crud()],
+  props: {
+  },
+  data() {
+    return {
+      blurryTime: null
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'baseApi'
+    ])
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+    [CRUD.HOOK.beforeRefresh]() {
+      if (this.blurryTime) {
+        this.crud.query.startTime = this.blurryTime[0]
+        this.crud.query.endTime = this.blurryTime[1]
+      }
+    },
+    [CRUD.HOOK.afterRefresh]() {
+      this.crud.data = data
+    },
+    doDetection(data) {
+      this.$confirm('此操作将重新检测该条目中的档案' + '<span>你是否还要继续？</span>', '提示', {
+        confirmButtonText: '继续',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const ids = []
+        data.forEach(val => {
+          ids.push(val.id)
+        })
+        // const params = {
+        //   'roleIds': ids
+        // }
+        // exportFile(this.baseApi + '/api/role/exportRole?' + qs.stringify(params, { indices: false }))
+      }).catch(() => {
+      })
+    },
+    handleDetail() {
+      this.$refs.mDetail.eepDetialVisible = true
+    },
+    doExport(data) {
+      crud.downloadLoading = true
+      this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续？</span>', '提示', {
+        confirmButtonText: '继续',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const ids = []
+        data.forEach(val => {
+          ids.push(val.id)
+        })
+        // const params = {
+        //   'roleIds': ids
+        // }
+        // exportFile(this.baseApi + '/api/role/exportRole?' + qs.stringify(params, { indices: false }))
+      }).catch(() => {
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/collect-reorganizi.scss";
+.connection-header{
+  padding: 0 !important;
+}
+</style>
diff --git a/src/views/collectReorganizi/externalReception/module/detail.vue b/src/views/collectReorganizi/externalReception/module/detail.vue
new file mode 100644
index 0000000..07096ee
--- /dev/null
+++ b/src/views/collectReorganizi/externalReception/module/detail.vue
@@ -0,0 +1,59 @@
+<template>
+  <!-- EEP包 -->
+  <el-dialog title="eep包" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="eepDetialVisible">
+    <div class="setting-dialog">
+      <ul class="hitch-info">
+        <li><span>接收编号：</span>230c4a438fa84b2c9a0405c99e7f5cb1</li>
+        <li><span>接收状态：</span><i class="row-state end-state">成功</i></li>
+        <li><span>接收人员：</span>admin</li>
+        <li><span>接收时间：</span>2016-09-21 08:50:08</li>
+        <li><span>挂接结果：</span>请检查zip包格式是否正确</li>
+      </ul>
+      <el-table ref="table" :data="tableData" style="width: 100%;">
+        <el-table-column type="index" align="center" width="55" label="序号" />
+        <el-table-column prop="name" label="文件名称" />
+        <el-table-column prop="reason" label="原因" />
+      </el-table>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+const data = [
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'name': '档号+题名',
+    'reason': '成功'
+  },
+  {
+    'id': '005E76FEC5A2AAB368CA1F2',
+    'name': '档号+题名',
+    'reason': '成功'
+  }
+]
+export default {
+  name: 'EepDetail',
+  components: { },
+  mixins: [],
+  data() {
+    return {
+      eepDetialVisible: false,
+      tableData: []
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.tableData = data
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+@import "~@/assets/styles/collect-reorganizi.scss";
+.row-state{
+  font-style: normal;
+}
+</style>
diff --git a/src/views/collectReorganizi/filingApprovalList/index.vue b/src/views/collectReorganizi/filingApprovalList/index.vue
new file mode 100644
index 0000000..24ecb66
--- /dev/null
+++ b/src/views/collectReorganizi/filingApprovalList/index.vue
@@ -0,0 +1,154 @@
+<template>
+  <div class="app-container  row-container">
+    <div class="connection-header collect-header">
+      <div class="head-search">
+        <date-range-picker v-model="blurryTime" class="date-item" />
+        <rrOperation />
+      </div>
+      <crudOperation>
+        <template v-slot:right>
+          <el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
+            <i class="iconfont icon-daochu" />
+            导出
+          </el-button>
+        </template>
+      </crudOperation>
+    </div>
+    <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 330px)" @selection-change="crud.selectionChangeHandler" @row-dblclick="handleDetail">
+      <el-table-column type="selection" align="center" width="55" />
+      <el-table-column prop="dept" label="申请部门" />
+      <el-table-column prop="create_by" label="申请人" />
+      <el-table-column prop="category" label="档案门类" />
+      <el-table-column prop="fonds" label="所属全宗" />
+      <el-table-column prop="approval" label="审批单" width="260" />
+      <el-table-column prop="status" label="审批状态" align="center">
+        <template slot-scope="scope">
+          <span v-if="scope.row.status===1" class="row-state end-state">已审批</span>
+          <span v-else class="row-state ing-state">审批中</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="create_time" label="申请时间">
+        <template slot-scope="scope">
+          <div>{{ scope.row.create_time | parseTime }}</div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!--分页组件-->
+    <pagination v-if="crud.data.length !== 0" />
+  </div>
+
+</template>
+
+<script>
+// import crudConnection from '@/api/system/role'
+import crudRoles from '@/api/system/role'
+import CRUD, { presenter, header, crud } from '@crud/crud'
+import DateRangePicker from '@/components/DateRangePicker'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import pagination from '@crud/Pagination'
+// import { exportFile } from '@/utils/index'
+// import qs from 'qs'
+import { mapGetters } from 'vuex'
+
+const data = [
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'dept': '档案室',
+    'status': 1,
+    'category': '文书档案（案卷）',
+    'fonds': '全宗1',
+    'approval': '归档审批流程-admin-2016-09-21',
+    'create_time': 1687330805000,
+    'create_by': 'admin'
+  },
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'dept': '档案室',
+    'status': 0,
+    'category': '文书档案（案卷）',
+    'fonds': '全宗1',
+    'approval': '归档审批流程-admin-2016-09-21',
+    'create_time': 1687330805000,
+    'create_by': 'admin'
+  }
+]
+
+export default {
+  name: 'FilingApprovalList',
+  components: { DateRangePicker, rrOperation, crudOperation, pagination },
+  cruds() {
+    return [
+      CRUD({
+        title: '归档审批清单', url: 'api/role/initRoleList',
+        crudMethod: { ...crudRoles },
+        optShow: {
+          add: false,
+          edit: false,
+          del: false,
+          reset: true,
+          download: false,
+          group: false
+        }
+      })
+    ]
+  },
+  mixins: [presenter(), header(), crud()],
+  props: {
+  },
+  data() {
+    return {
+      blurryTime: null
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'baseApi'
+    ])
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+    [CRUD.HOOK.beforeRefresh]() {
+      if (this.blurryTime) {
+        this.crud.query.startTime = this.blurryTime[0]
+        this.crud.query.endTime = this.blurryTime[1]
+      }
+    },
+    [CRUD.HOOK.afterRefresh]() {
+      this.crud.data = data
+    },
+    handleDetail() {
+      this.$refs.mDetail.eepDetialVisible = true
+    },
+    doExport(data) {
+      crud.downloadLoading = true
+      this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续？</span>', '提示', {
+        confirmButtonText: '继续',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const ids = []
+        data.forEach(val => {
+          ids.push(val.id)
+        })
+        // const params = {
+        //   'roleIds': ids
+        // }
+        // exportFile(this.baseApi + '/api/role/exportRole?' + qs.stringify(params, { indices: false }))
+      }).catch(() => {
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/collect-reorganizi.scss";
+.connection-header{
+  padding: 0 !important;
+}
+</style>
diff --git a/src/views/collectReorganizi/fourDetection/index.vue b/src/views/collectReorganizi/fourDetection/index.vue
new file mode 100644
index 0000000..95ca636
--- /dev/null
+++ b/src/views/collectReorganizi/fourDetection/index.vue
@@ -0,0 +1,176 @@
+<template>
+  <div class="app-container archives-container">
+    <div class="container-main" style="justify-content: flex-start;">
+      <CategoryTree ref="categoryTree" @nodeClick="handleNodeClick" />
+      <div class="elect-cont-right">
+        <div class="connection-header collect-header">
+          <h4 class="is-anjuan">{{ currentCategory && currentCategory.cnName }} </h4>
+          <div class="head-search">
+            <date-range-picker v-model="blurryTime" class="date-item" />
+            <rrOperation />
+          </div>
+          <crudOperation>
+            <template v-slot:right>
+              <el-button size="mini" :disabled="crud.selections.length === 0" @click="doDetection(crud.selections)">
+                <i class="iconfont icon-zhongxinjiance" />
+                重新检测
+              </el-button>
+              <el-button :loading="crud.downloadLoading" size="mini" :disabled="crud.selections.length === 0" @click="doExport(crud.selections)">
+                <i class="iconfont icon-daochu" />
+                导出
+              </el-button>
+            </template>
+          </crudOperation>
+        </div>
+        <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler" @row-dblclick="handleDetail">
+          <el-table-column type="selection" align="center" width="55" />
+          <el-table-column prop="create_time" label="检测时间">
+            <template slot-scope="scope">
+              <div>{{ scope.row.create_time | parseTime }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="create_by" label="检测人员" width="100" />
+          <el-table-column prop="item" label="检测项目" width="100" />
+          <el-table-column prop="status" label="检测状态" align="center">
+            <template slot-scope="scope">
+              <span v-if="scope.row.status===1" class="row-state end-state">已完成</span>
+              <span v-else class="row-state cancel-state">失败</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="total" label="挂接结果" width="300">
+            <template slot-scope="scope">
+              <div>共 {{ scope.row.total }} 条原文，成功<span class="success-status"> {{ scope.row.success }} </span>条，失败<span class="error-status"> {{ scope.row.error }} </span>条</div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <!--分页组件-->
+        <pagination v-if="crud.data.length !== 0" />
+      </div>
+    </div>
+    <FourDetail ref="mDetail" />
+  </div>
+</template>
+
+<script>
+// import crudConnection from '@/api/system/role'
+import crudRoles from '@/api/system/role'
+import CRUD, { presenter, header, crud } from '@crud/crud'
+import DateRangePicker from '@/components/DateRangePicker'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import pagination from '@crud/Pagination'
+import CategoryTree from '@/views/components/categoryTree'
+import FourDetail from './module/detail'
+// import { exportFile } from '@/utils/index'
+// import qs from 'qs'
+import { mapGetters } from 'vuex'
+
+const data = [
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'item': '共12项',
+    'status': 1,
+    'success': 5,
+    'error': 0,
+    'create_by': 'admin',
+    'create_time': 1687330805000
+  }
+]
+
+export default {
+  name: 'FourDetection',
+  components: { CategoryTree, FourDetail, DateRangePicker, rrOperation, crudOperation, pagination },
+  cruds() {
+    return [
+      CRUD({
+        title: '四性检测记录', url: 'api/role/initRoleList',
+        crudMethod: { ...crudRoles },
+        optShow: {
+          add: false,
+          edit: false,
+          del: false,
+          reset: true,
+          download: false,
+          group: false
+        }
+      })
+    ]
+  },
+  mixins: [presenter(), header(), crud()],
+  props: {
+  },
+  data() {
+    return {
+      currentCategory: null,
+      blurryTime: null
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'baseApi'
+    ])
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+    [CRUD.HOOK.beforeRefresh]() {
+      if (this.blurryTime) {
+        this.crud.query.startTime = this.blurryTime[0]
+        this.crud.query.endTime = this.blurryTime[1]
+      }
+    },
+    [CRUD.HOOK.afterRefresh]() {
+      this.crud.data = data
+    },
+    handleNodeClick(data) {
+      this.currentCategory = data
+    },
+    doDetection(data) {
+      this.$confirm('此操作将重新检测该条目中的档案' + '<span>你是否还要继续？</span>', '提示', {
+        confirmButtonText: '继续',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const ids = []
+        data.forEach(val => {
+          ids.push(val.id)
+        })
+        // const params = {
+        //   'roleIds': ids
+        // }
+        // exportFile(this.baseApi + '/api/role/exportRole?' + qs.stringify(params, { indices: false }))
+      }).catch(() => {
+      })
+    },
+    handleDetail() {
+      this.$refs.mDetail.fourDetialVisible = true
+    },
+    doExport(data) {
+      crud.downloadLoading = true
+      this.$confirm('此操作将导出所选数据' + '<span>你是否还要继续？</span>', '提示', {
+        confirmButtonText: '继续',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const ids = []
+        data.forEach(val => {
+          ids.push(val.id)
+        })
+        // const params = {
+        //   'roleIds': ids
+        // }
+        // exportFile(this.baseApi + '/api/role/exportRole?' + qs.stringify(params, { indices: false }))
+      }).catch(() => {
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/styles/collect-reorganizi.scss";
+</style>
diff --git a/src/views/collectReorganizi/fourDetection/module/detail.vue b/src/views/collectReorganizi/fourDetection/module/detail.vue
new file mode 100644
index 0000000..25aebc5
--- /dev/null
+++ b/src/views/collectReorganizi/fourDetection/module/detail.vue
@@ -0,0 +1,143 @@
+<template>
+  <div>
+    <!-- 四性检测 -->
+    <el-dialog title="四性检测" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="fourDetialVisible">
+      <div class="setting-dialog">
+        <ul class="hitch-info">
+          <li><span>检测时间：</span>2016-09-21 08:50:08</li>
+          <li><span>检测人员：</span>admin</li>
+          <li><span>挂接结果：</span>共 2 条原文，成功 <i class="success-status">1</i> 条，失败 <i class="error-status">1</i> 条</li>
+          <li><span>检测状态：</span><i class="row-state end-state">已完成</i></li>
+        </ul>
+        <el-table ref="table" :data="tableData" style="width: 100%;" @row-dblclick="handleViewDetection">
+          <el-table-column prop="archive_no" label="档号" width="240px" />
+          <el-table-column prop="maintitle" label="题名" width="240px" />
+          <el-table-column prop="truth" label="真实性" align="center">
+            <template slot-scope="scope">
+              <span v-if="scope.row.truth===1" class="four-icon iconfont icon-zhengque" />
+              <span v-else class="four-icon iconfont icon-cuowu" />
+            </template>
+          </el-table-column>
+          <el-table-column prop="integrity" label="完整性" align="center">
+            <template slot-scope="scope">
+              <span v-if="scope.row.integrity===1" class="four-icon iconfont icon-zhengque" />
+              <span v-else class="four-icon iconfont icon-cuowu" />
+            </template>
+          </el-table-column>
+          <el-table-column prop="availability" label="可用性" align="center">
+            <template slot-scope="scope">
+              <span v-if="scope.row.availability===1" class="four-icon iconfont icon-zhengque" />
+              <span v-else class="four-icon iconfont icon-cuowu" />
+            </template>
+          </el-table-column>
+          <el-table-column prop="safety" label="安全性" align="center">
+            <template slot-scope="scope">
+              <span v-if="scope.row.safety===1" class="four-icon iconfont icon-zhengque" />
+              <span v-else class="four-icon iconfont icon-cuowu" />
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-dialog>
+
+    <!-- 检测报告 -->
+    <el-dialog title="检测报告" :close-on-click-modal="false" :modal-append-to-body="false" append-to-body :visible.sync="reportVisible">
+      <div class="setting-dialog">
+        <ul class="hitch-info">
+          <li><span>报告编号：</span>SXJC20230511000048</li>
+          <li><span>报告编号：</span>共 14 项</li>
+          <li><span>检测人员：</span>admin</li>
+          <li><span>检测耗时：</span>1779 ms</li>
+          <li><span>档号：</span>YXK-2022-JJ-001</li>
+          <li><span>题名：</span>文书档案001</li>
+          <li><span>挂接结果：</span>共 2 条原文，成功 <i class="success-status">1</i> 条，失败 <i class="error-status">1</i> 条</li>
+        </ul>
+        <div class="report-main">
+          <div class="report-header">
+            <el-button size="mini">
+              <i class="iconfont icon-dayin" />
+              打印
+            </el-button>
+            <el-button size="mini">
+              <i class="iconfont icon-daochu" />
+              导出
+            </el-button>
+          </div>
+          <div class="report-cont">
+            <p>自定义表格显示区域</p>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+const data = [
+  {
+    'id': '005E76FEC5A2AAB368CA1F',
+    'archive_no': 'YXK-2022-JJ-001 ',
+    'maintitle': '文书档案001',
+    'truth': 0,
+    'integrity': 1,
+    'availability': 0,
+    'safety': 0
+  },
+  {
+    'id': '005E76FEC5A2AAB368CA1F2',
+    'archive_no': 'YXK-2022-JJ-002 ',
+    'maintitle': '文书档案001',
+    'truth': 0,
+    'integrity': 1,
+    'availability': 1,
+    'safety': 0
+  }
+]
+export default {
+  name: 'FourDetail',
+  components: { },
+  mixins: [],
+  data() {
+    return {
+      fourDetialVisible: false,
+      reportVisible: false,
+      tableData: []
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.tableData = data
+  },
+  methods: {
+    handleViewDetection() {
+      this.reportVisible = true
+    }
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+@import "~@/assets/styles/collect-reorganizi.scss";
+.row-state{
+  font-style: normal;
+}
+.report-main{
+  padding-top: 10px;
+  .report-header{
+    display: flex;
+    justify-content: flex-end;
+  }
+  .report-cont{
+    height: 454px;
+    margin-top: 10px;
+    background-color: #EDEFF3;
+    p{
+      font-size: 14px;
+      color: #545B65;
+      text-align: center;
+      line-height: 454px;
+    }
+  }
+}
+</style>