<template>
|
<div class="page-container page-safety colorfff">
|
<div class="nav">
|
<img
|
class="nav-icon"
|
:src="require('@/assets/safety/location.png')"
|
alt=""
|
/>
|
<div class="nav-content">
|
<span>安全管理 </span>
|
<i class="el-icon el-icon-arrow-right"></i>
|
<span> 访问信息</span>
|
</div>
|
</div>
|
<div class="content">
|
<div class="table-container">
|
<el-table
|
stripe
|
style="width: 100%"
|
header-row-class-name="table-header"
|
:height="'calc(100vh - 340px)'"
|
:data="visitList"
|
highlight-current-row
|
class="bs"
|
>
|
<el-table-column
|
align="center"
|
prop="deptName"
|
label="访问部门"
|
>
|
<template slot-scope="scope">{{scope.row.deptName ? scope.row.deptName : '总公司'}}</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="visitor"
|
label="访问人"
|
></el-table-column>
|
<el-table-column
|
align="center"
|
prop="visitorTime"
|
label="访问时间"
|
></el-table-column>
|
</el-table>
|
<div class="pagination-block">
|
<el-pagination
|
layout="prev, pager, next"
|
:total="total"
|
background
|
:current-page="filterForm.pageNum"
|
:page-size="filterForm.pageSize"
|
@current-change="pageChange"
|
></el-pagination>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "articleVisitList",
|
data() {
|
return {
|
filterForm: {
|
pageSize: 20,
|
pageNum: 1,
|
},
|
total: 0,
|
visitList: [],
|
};
|
},
|
created() {
|
this.getOtherQuota();
|
},
|
activated() {
|
if (this.$route.query.type) {
|
this.filterForm.type = this.$route.query.type;
|
} else {
|
this.filterForm.type = "";
|
}
|
this.getList();
|
},
|
methods: {
|
getList() {
|
this.$axios
|
.get(this.$exportBase + 'v3/safety/pageVisit', {
|
params: {
|
limit: this.filterForm.pageSize,
|
page: this.filterForm.pageNum,
|
safetyInfoId: this.$route.query.id
|
},
|
})
|
.then((res) => {
|
this.visitList = res.data.list;
|
this.total = Number(res.data.total);
|
});
|
},
|
pageChange(page) {
|
this.filterForm.pageNum = page;
|
this.getList();
|
},
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
@import url("../../assets/css/common.css");
|
@orange: #1cd1d3;
|
@blue: #3e89d3;
|
.page-container {
|
padding: 20px 30px;
|
padding-bottom: 0;
|
.nav {
|
display: flex;
|
font-size: 14px;
|
width: 100%;
|
height: 20px;
|
align-items: center;
|
.nav-icon {
|
width: 18px;
|
margin-left: 11px;
|
flex-shrink: 0;
|
margin-right: 11px;
|
}
|
.nav-content {
|
flex: 1;
|
}
|
}
|
.content {
|
margin-top: 16px;
|
.table-container {
|
margin: 0 72px;
|
.pagination-block {
|
text-align: center;
|
margin-top: 20px;
|
}
|
}
|
}
|
}
|
.action-bar {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
color: #fff;
|
font-size: 14px;
|
margin-left: 50px;
|
padding-top: 5px;
|
padding-right: 73px;
|
height: 37px;
|
.action-item {
|
padding: 8px 30px;
|
border-left: 2px solid;
|
border-right: 2px solid;
|
opacity: 0.8;
|
}
|
.orange {
|
border-color: @orange;
|
background-color: rgba(28, 209, 211, 0.1);
|
}
|
.blue {
|
border-color: @blue;
|
background-color: rgba(62, 137, 211, 0.1);
|
}
|
}
|
/deep/.el-table {
|
margin-top: 40px;
|
background: none !important;
|
}
|
</style>
|
<style lang="less">
|
.page-safety .el-table tr {
|
background: #161e2f !important;
|
height: 40px;
|
}
|
.page-safety .el-table td.el-table__cell {
|
border-bottom: none !important;
|
padding: 0 !important;
|
color: #fff;
|
}
|
.page-safety
|
.el-table--striped
|
.el-table__body
|
tr.el-table__row--striped
|
td.el-table__cell {
|
background: #182237 !important;
|
}
|
.page-safety .table-header th {
|
height: 54px !important;
|
background: rgba(255, 255, 255, 0.04) !important;
|
color: rgba(255, 255, 255, 0.85);
|
}
|
.page-safety .el-table::before {
|
height: 0 !important;
|
}
|
.page-safety .table-header {
|
background: none;
|
}
|
.page-safety .el-table th.el-table__cell.is-leaf {
|
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
|
}
|
.page-safety .el-table__empty-block {
|
background: rgba(60, 129, 255, 0.04);
|
}
|
.page-safety .el-table__body tr.current-row > td.el-table__cell {
|
background: rgba(60, 129, 255, 0.1) !important;
|
}
|
.page-safety
|
.el-table--striped
|
.el-table__body
|
tr.current-row.el-table__row--striped
|
td.el-table__cell {
|
background: rgba(60, 129, 255, 0.1) !important;
|
}
|
.page-safety
|
.el-table--enable-row-hover
|
.el-table__body
|
tr:hover
|
> td.el-table__cell {
|
background: rgba(60, 129, 255, 0.1) !important;
|
}
|
.page-safety {
|
.pagination-block {
|
.el-pagination.is-background .btn-next,
|
.el-pagination.is-background .btn-prev,
|
.el-pagination.is-background .el-pager li {
|
background: none;
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
color: rgba(255, 255, 255, 0.65);
|
}
|
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
background: #0179d0 !important;
|
}
|
}
|
.el-table--enable-row-hover .el-table__body tr:hover {
|
border: 1px solid rgba(0, 114, 194, 0.5);
|
}
|
.el-table--striped .el-table__body tr.current-row.el-table__row--striped {
|
border: 1px solid rgba(0, 114, 194, 0.5);
|
}
|
}
|
</style>
|
