修改监控页面样式

main
junhong 1 week ago
parent cefc6083f4
commit 0e56ce0516
  1. 21
      src/views/constructionScheduling/resource-management/index.vue
  2. 2
      src/views/vehicleMachinery/video-manage/index.vue

@ -59,8 +59,12 @@ function change(i) {
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="tabbox"> <div class="tabbox">
<div @click="change(0)" :class="state.tabindex == 0 ? 'active' : ''" class="topbat">人力信息</div> <div @click="change(0)" :class="state.tabindex == 0 ? 'active' : ''" class="topbat">人力信息
<div @click="change(1)" :class="state.tabindex == 1 ? 'active' : ''" class="topbat">材料信息</div> <div v-if="state.tabindex == 0" class="triangle-down"></div>
</div>
<div @click="change(1)" :class="state.tabindex == 1 ? 'active' : ''" class="topbat">
<div v-if="state.tabindex == 1" class="triangle-down"></div>材料信息
</div>
</div> </div>
<BaseTablePage :tableOptions="state" ref="table" v-if="state.show"> <BaseTablePage :tableOptions="state" ref="table" v-if="state.show">
<el-table-column label="序号" align="center" type="index" width="70" /> <el-table-column label="序号" align="center" type="index" width="70" />
@ -100,6 +104,18 @@ function change(i) {
</template> </template>
<style scoped> <style scoped>
.triangle-down {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #1188fb;
position: absolute;
bottom: -10px;
left: 50%;
margin-left: -10px;
}
.tabbox { .tabbox {
display: flex; display: flex;
align-items: center; align-items: center;
@ -118,6 +134,7 @@ function change(i) {
margin-right: 20px; margin-right: 20px;
cursor: pointer; cursor: pointer;
font-size: 16px; font-size: 16px;
position: relative;
} }
.active { .active {

@ -47,7 +47,7 @@ const state = reactive({
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 20px; padding: 20px;
min-height: 100vh; height: calc(100vh - 135px);
} }
.camera-name-list { .camera-name-list {

Loading…
Cancel
Save