湖里大屏(数字工地):新增切换 tab 逻辑
This commit is contained in:
parent
046e6218a6
commit
f134a239d0
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.1 MiB |
@ -1,8 +1,12 @@
|
||||
<template>
|
||||
<Card :title="title">
|
||||
<div class="pane"></div>
|
||||
<div class="pane">
|
||||
<div class="point "></div>
|
||||
</div>
|
||||
<div class="tabs">
|
||||
<div class="tab" :class="{ checked: tab === '全部' }" v-for="tab in tabs" :key="tab">{{ tab }}</div>
|
||||
<div class="tab" :class="{ checked: index === tabIndex }" v-for="(tab, index) in tabs" :key="index" @click="changeTab(index)">
|
||||
{{ tab }}
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
@ -20,8 +24,14 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabIndex: 0,
|
||||
tabs: ['全部', '塔机监测', '升降机监测', '视频监测', '环境监测', '人脸闸机']
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeTab(index) {
|
||||
this.tabIndex = index
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -30,7 +40,7 @@ export default {
|
||||
.pane {
|
||||
margin: 0 20px;
|
||||
height: 80%;
|
||||
background: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/digitalSite/bg-all.png') no-repeat;
|
||||
background: url('~@/views/projectAdmin/jlw/assets/images/digitalSite/bg-all.png') no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.tabs {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user