【前端】智能库房综合管理系统前端项目
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.
 
 
 
 
 

193 lines
7.1 KiB

<template>
<div>
<el-dialog title="盘点详情" :visible.sync="detailVisible" :close-on-click-modal="false">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<el-table :data="rowData" :cell-class-name="cellTop" style="margin:5px 0 15px 0;width:100%;" height="calc(25vh - 137px)">
<el-table-column prop="id" align="center" label="盘点单号" min-width="150" />
<el-table-column prop="region" align="center" label="所在区域" show-overflow-tooltip min-width="120" />
<el-table-column prop="checkState" align="center" label="盘点状态" min-width="120">
<template slot-scope="scope">
<span class="clear">{{ scope.row.checkState | checkState }}</span>
</template>
</el-table-column>
<el-table-column prop="create_time" align="center" label="创建时间" min-width="150">
<template slot-scope="scope">
<span>{{ scope.row.create_time | parseTime }}</span>
</template>
</el-table-column>
<el-table-column prop="noCheck" align="center" label="未盘档案" min-width="90" />
<el-table-column prop="correct" align="center" label="在库档案" min-width="90" />
<el-table-column prop="dislocation" align="center" label="错位档案" min-width="90" />
<el-table-column prop="borrowed" align="center" label="已借档案" min-width="90" />
<el-table-column prop="abnormal" align="center" label="异常档案" min-width="90" />
<el-table-column prop="others" align="center" label="其他档案" min-width="90" />
</el-table>
<el-table :data="tableData" :cell-class-name="cell" style="width:100%;" height="calc(50vh - 99px)">
<el-table-column type="index" label="序号" align="center" width="90" />
<el-table-column prop="checkResult" align="center" label="盘点结果" width="90">
<template slot-scope="scope">
<!-- 在库/已借/错位 -->
<span class="clear" style="width:56px">{{ scope.row.checkResult | checkResult }}</span>
</template>
</el-table-column>
<el-table-column prop="child" align="center" label="子条数目" width="90" />
<el-table-column prop="categoryType" align="center" label="门类级别" width="90">
<template slot-scope="scope">
<span v-if="scope.row.categoryType === 5" style="width:56px">文件级</span>
<span v-if="scope.row.categoryType === 4" style="width:56px">卷内级</span>
<span v-if="scope.row.categoryType === 3" style="width:56px">案卷级</span>
</template>
</el-table-column>
<el-table-column prop="caseName" align="center" :show-overflow-tooltip="true" label="门类名称" min-width="180" />
<el-table-column prop="fondsNo" align="center" label="全宗号" min-width="90" />
<el-table-column prop="archiveNo" align="center" label="档号" min-width="180" />
<el-table-column prop="archiveYear" align="center" label="归档年度" min-width="90" />
<el-table-column prop="maintitle" align="center" :show-overflow-tooltip="true" label="题名" min-width="180" />
<el-table-column prop="securityClass" align="center" label="保密程度" min-width="90" />
<el-table-column prop="department" align="center" label="部门" min-width="90" />
<el-table-column prop="caseName" align="center" label="盒名称" min-width="180" />
<el-table-column prop="folderLocationDetails" align="center" :show-overflow-tooltip="true" label="所在位置" min-width="280">
<template slot-scope="scope">
<span v-if="!scope.row.folderLocationDetails">-</span>
<span v-else>
<el-tag effect="dark">{{ scope.row.folderLocationDetails }}</el-tag>
</span>
</template>
</el-table-column>
<el-table-column prop="createTime" align="center" label="创建时间" min-width="150">
<template slot-scope="scope">
<div>{{ scope.row.createTime | parseTime }}</div>
</template>
</el-table-column>
</el-table>
</div></el-dialog>
</div>
</template>
<script>
export default {
filters: {
checkState(val) {
switch (val) {
case 0:
return '待执行'
case 1:
return '执行中'
case 2:
return '已执行'
}
},
checkResult(val) {
switch (val) {
case 0:
return '未盘'
case 1:
return '在库'
case 2:
return '已盘'
case 3:
return '错位'
case 4:
return '已借'
case 5:
return '异常'
case 6:
return '其他'
}
}
},
data() {
return {
detailVisible: false,
tableData: [],
rowData: [],
classLend: ''
}
},
methods: {
cellTop({ row, columnIndex }) {
if (row.checkState === 2 && columnIndex === 2) {
return 'have-clear'
} else if (row.checkState === 0 && columnIndex === 2) {
return 'fail-clear'
} else if (row.checkState === 1 && columnIndex === 2) {
return 'no-clear'
}
},
cell({ row, columnIndex }) {
if (row.checkResult === 0 && columnIndex === 1) { // 未盘
return 'no-clear-bg'
} else if (row.checkResult === 1 && columnIndex === 1) { // 在库
return 'no-clear'
} else if (row.checkResult === 2 && columnIndex === 1) { // 已盘
return 'have-clear-bg'
} else if (row.checkResult === 3 && columnIndex === 1) { // 错位
return 'fail-clear'
} else if (row.checkResult === 4 && columnIndex === 1) { // 已借
return 'have-clear'
} else if (row.checkResult === 5 && columnIndex === 1) { // 异常
return 'error-clear-bg'
} else if (row.checkResult === 6 && columnIndex === 1) { // 其他
return 'other-clear'
}
}
}
}
</script>
<style lang="scss" scoped>
@import '~@/assets/styles/lend-manage.scss';
::v-deep .el-dialog__body{
padding: 10px 0 20px 0;
}
::v-deep .el-dialog{
width: 950px;
height: 520px;
}
::v-deep .el-dialog .el-dialog__header .el-dialog__close::before{
position: absolute;
right: -158px;
bottom: -12px;
}
p{
display: flex;
height: 40px;
align-items: center;
.color-blue{
color: #3A99FD;
width: 70px;
height: 19px;
text-align: right;
}
.color-white{
color: white;
padding: 0 0 0 20px;
}
}
.dpflex{
display: flex;
.one{
width: 320px;
margin-left: 30px;
}
.two{
flex:1;
}
.tree{
flex: 1;
}
.four{
flex: 1;
}
}
//表格滚动条 白色方格
::v-deep ::-webkit-scrollbar-corner{
background: transparent;
}
::v-deep .el-table--scrollable-x .el-table__body-wrapper{
z-index: 2
}
</style>