You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
113 lines
3.6 KiB
113 lines
3.6 KiB
<template>
|
|
<div class="import-detail-container">
|
|
<ul class="import-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>
|
|
<el-table
|
|
ref="table"
|
|
:data="tableData"
|
|
style="width: 100%"
|
|
height="calc(100vh - 504px)"
|
|
@row-click="clickRowHandler"
|
|
@selection-change="selectionChangeHandler"
|
|
>
|
|
<el-table-column prop="security_class" label="密级" align="center" width="80px" />
|
|
<el-table-column prop="medium_type" label="载体类型" align="center" width="100px" />
|
|
<el-table-column prop="micro_number" label="缩微号" align="center" width="80px" />
|
|
<el-table-column prop="archive_no" label="档号" align="center" width="200px" />
|
|
<el-table-column prop="page_qty" label="文件件数" align="center" width="100px" />
|
|
<el-table-column prop="maintitle" label="案卷题名" align="center" show-overflow-tooltip width="240px" />
|
|
<el-table-column prop="begin_date" label="起始时间" align="center" width="140px" />
|
|
<el-table-column prop="end_date" label="终止时间" align="center" width="140px" />
|
|
<el-table-column prop="archive_ctg_no" label="分类号" align="center" width="140px" />
|
|
<el-table-column prop="subject_term" label="主题词" align="center" width="140px" />
|
|
<el-table-column prop="remarks" label="附注" align="center" width="120px" />
|
|
<el-table-column prop="retention" label="保管期限" align="center" width="120px" />
|
|
<el-table-column prop="archive_year" label="年度" align="center" width="100px" />
|
|
<el-table-column prop="fonds_no" label="全宗" align="center" width="100px" />
|
|
<el-table-column prop="piece_no" label="卷号" align="center" width="100px" />
|
|
</el-table>
|
|
<!--分页组件-->
|
|
<el-pagination
|
|
:current-page="page.page"
|
|
:total="page.total"
|
|
:page-size="page.size"
|
|
:pager-count="5"
|
|
layout="total, prev, pager, next, sizes"
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentPage"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import tableJson from './table.json'
|
|
export default {
|
|
name: 'DataImport',
|
|
components: { },
|
|
data() {
|
|
return {
|
|
archivesTabIndex: 0,
|
|
tableData: [],
|
|
page: {
|
|
page: 1,
|
|
size: 10,
|
|
total: 0
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.tableData = tableJson
|
|
},
|
|
methods: {
|
|
changeActiveTab(index) {
|
|
this.archivesTabIndex = index
|
|
},
|
|
// table
|
|
clickRowHandler(row) {
|
|
this.$refs.table.toggleRowSelection(row)
|
|
},
|
|
// table
|
|
selectionChangeHandler(val) {
|
|
this.selections = val
|
|
},
|
|
handleSizeChange(size) {
|
|
this.page.size = size
|
|
this.page.page = 1
|
|
},
|
|
handleCurrentPage(val) {
|
|
this.page.page = val
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss' scoped>
|
|
.import-tab{
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
margin-bottom: 10px;
|
|
li{
|
|
padding: 10px 20px 14px 20px;
|
|
font-size: 16px;
|
|
color: #339CFF;
|
|
cursor: pointer;
|
|
&.active{
|
|
position: relative;
|
|
color: #fff;
|
|
&::after{
|
|
content: "";
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: -1px;
|
|
width: 100%;
|
|
height: 3px;
|
|
border-radius: 3px;
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|