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

93 lines
2.8 KiB

<template>
<div class="app-container lend-container">
<div class="tab-content">
<span class="right-top-line" />
<span class="left-bottom-line" />
<span class="right-bottom-line" />
<ul class="tab-nav">
<li :class="{ 'active-tab-nav': activeIndex == 0 }" @click="changeActiveTab(0)">登录日志<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 1 }" @click="changeActiveTab(1)">操作日志<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 2 }" @click="changeActiveTab(2)">报警日志<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 3 }" @click="changeActiveTab(3)">通道门日志<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 4 }" @click="changeActiveTab(4)">门禁日志<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 5 }" @click="changeActiveTab(5)">密集架日志<i /></li>
<!-- <li :class="{ 'active-tab-nav': activeIndex == 4 }" @click="changeActiveTab(4)">接口访问日志<i /></li> -->
<!-- 最右侧装饰img -->
<span class="tab-right-img" />
</ul>
<component :is="comName" />
</div>
</div>
</template>
<script>
import loginLog from './loginLog/index.vue'
import operateLog from './operateLog/index.vue'
import warnLog from './warnLog/index.vue'
import doorLog from './doorLog/index.vue'
import accessDoorLog from './accessDoorLog/index.vue'
import portLog from './portLog/index.vue'
import deviceLog from './deviceLog/index.vue'
export default {
name: 'LogManage',
components: {
loginLog,
operateLog,
warnLog,
doorLog,
portLog,
accessDoorLog,
deviceLog
},
data() {
return {
activeIndex: 0
}
},
computed: {
comName: function() {
if (this.activeIndex === 0) {
return 'loginLog'
} else if (this.activeIndex === 1) {
return 'operateLog'
} else if (this.activeIndex === 2) {
return 'warnLog'
} else if (this.activeIndex === 3) {
return 'accessDoorLog'
} else if (this.activeIndex === 4) {
return 'doorLog'
} else if (this.activeIndex === 5) {
return 'deviceLog'
}
// else if (this.activeIndex === 4) {
// return 'portLog'
// }
return 'loginLog'
}
},
created() {
if (this.$route.params.locationIndex) {
this.activeIndex = this.$route.params.locationIndex
}
},
methods: {
changeActiveTab(data) {
this.activeIndex = data
}
}
}
</script>
<style lang="scss" scoped>
.lend-container{
.tab-content{
position: relative;
margin-top: 61px;
border: 1px solid #113d72;
}
}
.tab-content .tab-nav{
margin-bottom: 0;
}
</style>