html, body { width: 100%; height: 100%; margin: 0; padding: 0; color: #fff; font-size: 16px; font-family: 'Alibaba PuHuiTi R'; letter-spacing: 1px; } .layout { display: flex; align-items: center; justify-content: start; box-sizing: border-box; } #content { width: 100%; height: 100%; box-sizing: border-box; justify-content: space-between; background-color: #fff; } .main-box { height: 100%; padding: 0 0.5% 0 0.45%; box-sizing: border-box; } .module-title { width: 100%; height: 40px; padding: 0 15px; font-weight: bold; font-size: 18px; color: #000; justify-content: space-between; } .module-title img { cursor: pointer; margin-right: 20px } .module-title2 { width: 120px; height: 40px; padding: 0 15px; font-weight: bold; font-size: 18px; color: #000; position: absolute; } .layui-tab-brief>.layui-tab-title .layui-this { color: #409EFF; } .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after { border-bottom: 2px solid #409EFF; } .layui-tab .layui-tab-title li { font-size: 18px; } .layui-tab .layui-tab-title li { color: #000; } .layui-tab .layui-tab-title { padding: 0 1%; } .layui-tab-content { padding: 0; height: calc(100% - 42px); } .layui-tab { margin: 0; text-align: left !important; height: 100%; } .layui-show { height: 100%; } .layui-layer-dialog .layui-layer-padding { color: #000; } .classTable { width: 100%; table-layout: fixed; text-align: center; border-collapse: collapse; border-spacing: 0; box-sizing: border-box; height: 100%; } .classTable tbody tr td { font-size: 14px; border-bottom: 1px solid #7c7878; height: 40px; color: #000; } .classTable tr:hover { background-color: #f8f8f8 } .classTable thead tr:nth-of-type(1) { background-color: #f0f0f0; height: 50px; } .classTable thead tr:nth-of-type(1) td { font-size: 16px; color: #000; } .classTable tbody { display: block; height: 31vh; overflow-y: auto; } .classTable2 tbody { height: 23vh; } .classTable3 tbody { height: 28vh; } .classTable4 tbody { height: 28vh; } .classTable thead, .classTable tbody tr { display: table; width: 100%; table-layout: fixed; } .classTable thead { width: calc(100% - 10px); } .classTable tbody tr { width: 100%; cursor: pointer; } /* 左侧样式 start */ #left-box { width: 50%; flex-direction: column; justify-content: space-evenly; } /* 今日风险 start */ #left-top { width: 100%; height: 16%; } #today-risk { width: 100%; height: calc(100% - 40px); justify-content: space-evenly; } .risk-div { width: 22%; height: 100%; } .risk-back { width: 40%; height: 100%; background-size: unset !important; background-position: center center !important; } #today-risk .risk-div:nth-child(1) .risk-back { background: url("../../img/staging/two.png") no-repeat 0 0 / 100% 100%; } #today-risk .risk-div:nth-child(2) .risk-back { background: url("../../img/staging/three.png") no-repeat 0 0 / 100% 100%; } #today-risk .risk-div:nth-child(3) .risk-back { background: url("../../img/staging/four.png") no-repeat 0 0 / 100% 100%; } #today-risk .risk-div:nth-child(4) .risk-back { background: url("../../img/staging/five.png") no-repeat 0 0 / 100% 100%; } .risk-info { width: 60%; height: 100%; flex-direction: column; justify-content: center; color: #000; } .risk-info p:nth-child(1) { font-size: 30px; font-weight: bold; } /* 今日风险 end */ #left-center { width: 100%; height: 44%; } .more-div { width: 140px; height: 40px; justify-content: space-around; position: absolute; left: 86%; z-index: 99999; font-size: 16px; color: #389BFF; cursor: pointer; } .more-btn { width: 80px; height: 40px; } .more-div2 { width: 100%; height: 40px; justify-content: end; padding: 0 5%; color: #389BFF; cursor: pointer; } /* 当日站班会 start */ .content-box { width: 100%; height: 100%; padding: 1% 1%; box-sizing: border-box; } #todayTaskTable tr td:nth-child(2) { width: 10%; } #todayTaskTable tr td:nth-child(1), #todayTaskTable tr td:nth-child(5), #todayTaskTable tr td:nth-child(7), #todayTaskTable tr td:nth-child(8) { width: 8%; } #todayTaskTable tr td:nth-child(3), #todayTaskTable tr td:nth-child(4) { width: 21%; } #todayTaskTable tr td:nth-child(6) { width: 16%; } /* 当日站班会 end */ /* 作业许可 start */ #zyxkTable tr td:nth-child(1), #zyxkTable tr td:nth-child(2), #zyxkTable tr td:nth-child(3), #zyxkTable tr td:nth-child(4), #zyxkTable tr td:nth-child(5) { width: 10%; } #zyxkTable tr td:nth-child(2), #zyxkTable tr td:nth-child(3) { width: 35%; } /* 作业许可 end */ /* 风险销号 start */ #fxxhTable tr td:nth-child(1), #fxxhTable tr td:nth-child(2), #fxxhTable tr td:nth-child(3), #fxxhTable tr td:nth-child(4), #fxxhTable tr td:nth-child(5), #fxxhTable tr td:nth-child(6), #fxxhTable tr td:nth-child(7) { width: 12%; } #fxxhTable tr td:nth-child(2), #fxxhTable tr td:nth-child(3) { width: 20%; } /* 风险销号 end */ /* 违章信息 start*/ #left-bottom { width: 100%; height: 36%; } .violation-title { width: 100%; height: 40px; } .classTable2 tr td:nth-child(1), .classTable2 tr td:nth-child(2), .classTable2 tr td:nth-child(4), .classTable2 tr td:nth-child(5), .classTable2 tr td:nth-child(6), .classTable2 tr td:nth-child(8) { width: 9%; } .classTable2 tr td:nth-child(7) { width: 12%; } .classTable2 tr td:nth-child(3), .classTable2 tr td:nth-child(9) { width: 17%; } .opera a { color: #2F82FB; font-size: 14px; text-decoration: none; cursor: pointer; } .opera div { color: #D9D9D9; margin: 0 4px; vertical-align: top; display: inline-block; } .early-module { position: relative; /* display: inline-block; */ } .early-module::after { content: attr(data-notification); /* 使用伪元素的content属性获取通知数量 */ position: absolute; top: 0; right: 0; display: flex; justify-content: center; align-items: center; width: 23px !important; height: 23px !important; background-color: #FF5D5D; color: white; border-radius: 50%; font-size: 12px; opacity: 0.9; left: 95%; } /* 违章信息 end */ /* 左侧样式 end */ /* 中侧样式 start */ #center-box { width: 50%; justify-content: space-evenly; flex-direction: column; } #center-top { width: 100%; height: 40%; justify-content: space-between; } /* 今日施工计划 start */ #workPlan-box { width: 79%; height: 100%; } #workPlanDiv { width: 100%; height: calc(100% - 40px); justify-content: space-between; } #workPlanNum { width: 30%; height: 100%; flex-direction: column; justify-content: space-evenly; } .zx-div { width: 100%; height: 40%; background-size: unset !important; background-position: center center !important; flex-direction: column; justify-content: center; cursor: pointer; color: #000; } .zx-div p { margin-left: 45%; } .zx-div p:nth-child(1) { font-size: 20px; font-weight: bold; } #yzx { background: url("../../img/staging/yzx.png") no-repeat 0 0 / 100% 100%; } #wzx { background: url("../../img/staging/wzx.png") no-repeat 0 0 / 100% 100%; } #workPlanTableDiv { width: 78%; height: 100%; } .classTable3 tr td:nth-child(1) { width: 10%; } .classTable3 tr td:nth-child(3) { width: 15%; } .classTable3 tr td:nth-child(2), .classTable3 tr td:nth-child(4), .classTable3 tr td:nth-child(5) { width: 25%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; } /* 今日施工计划 end */ /* 报岗 start */ #bg-box { width: 20%; height: 100%; } #bg-div { width: 100%; height: calc(100% - 60px); flex-direction: column; justify-content: space-evenly; } #bg-div p { color: #000; } #bgStatus { font-size: 24px; font-weight: bold; } /* 报岗 end */ #center-center { width: 100%; height: 40%; } /* 施工队伍 start */ #workTeamDiv { width: 100%; height: calc(100% -40px); padding: 0 1%; box-sizing: border-box; } .classTable4 tr td:nth-child(2), .classTable4 tr td:nth-child(3), .classTable4 tr td:nth-child(4), .classTable4 tr td:nth-child(5), .classTable4 tr td:nth-child(7) { width: 10%; } .classTable4 tr td:nth-child(1) { width: 8%; } .classTable4 tr td:nth-child(6) { width: 12%; } .classTable4 tr td:nth-child(2), .classTable4 tr td:nth-child(5), .classTable4 tr td:nth-child(6) { width: 20%; } /* 施工队伍 end */ #center-bottom { width: 100%; height: 16%; } /* 预警信息 start */ #early-div { width: 100%; height: calc(100% - 36px); justify-content: space-evenly; } .early-info { width: 12%; height: 100%; background-size: unset !important; background-position: center center !important; flex-direction: column; justify-content: center; } .early-info p:nth-child(1) { font-size: 26px; font-weight: bold; } .early-info:nth-child(1) { background: url("../../img/staging/early_1.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(2) { background: url("../../img/staging/early_2.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(3) { background: url("../../img/staging/early_3.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(4) { background: url("../../img/staging/early_4.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(5) { background: url("../../img/staging/early_5.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(6) { background: url("../../img/staging/early_6.png") no-repeat 0 0 / 100% 100%; } .early-info:nth-child(7) { background: url("../../img/staging/early_7.png") no-repeat 0 0 / 100% 100%; } /* 预警信息 end */ /* 中侧样式 end */ /*滚动条样式start*/ ::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-thumb:hover { background: #dadee8; cursor: pointer; } ::-webkit-scrollbar-thumb { border-radius: 14px; border-style: dashed; border-color: transparent; border-width: 1px; background-color: #dadee8; background-clip: padding-box; } ::-webkit-scrollbar-corner { background-color: transparent; } /* ::-webkit-scrollbar-track { background: #e7e7f1 !important; border-radius: 0px; } ::-webkit-scrollbar-thumb { background: rgba(94, 96, 97, 0.43) !important; border-radius: 0px; } ::-webkit-scrollbar-thumb:hover { background: rgba(94, 96, 97, 0.43) !important; border-radius: 0px; } ::-webkit-scrollbar-thumb:active { background: rgba(94, 96, 97, 0.43) !important; border-radius: 0px; } */ /*滚动条样式end*/ .opera a { margin: 0 5px; }