html, body { width: 100%; height: 100%; margin: 0; padding: 0; color: #000; 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-evenly; } .main-box { height: 100%; padding: 1% 0.5% 0 0.45%; box-sizing: border-box; } .module-title { width: 100%; height: 40px; /* background: url("../../img/cityHome/module_title.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; */ } .module-title p { font-size: 22px; margin: -5px 0 0 6px; color: #000; } .module-title img { margin-right: 10px; cursor: pointer; } /* 左侧样式 start */ #left-box { width: 29%; flex-direction: column; justify-content: space-between; } #left-top { width: 100%; height: 28%; background-color: #fff; border-radius: 5px; } #pro-total-num { width: 100%; height: 42%; justify-content: space-evenly; } .pro-num { width: 22%; height: 100%; flex-direction: column; justify-content: center; } .pro-num:nth-child(1) { width: 34%; background: url("../../img/newDutyHome/pro_total_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: center center !important; } .pro-num p:nth-child(1) { font-size: 30px; font-weight: bold; } .pro-num:nth-child(1) p:nth-child(2) { margin: 0 0 5% 30%; } .pro-num:nth-child(1) p:nth-child(1) { margin: 0 0 0 30%; } .pro-num:nth-child(2) p:nth-child(2), .pro-num:nth-child(3) p:nth-child(2), .pro-num:nth-child(4) p:nth-child(2) { margin: 0 0 5% 0; } .pro-num:nth-child(1) p:nth-child(1) { font-family: 'zcoolqingkehuangyouti'; } .pro-num:nth-child(2) p:nth-child(1) { color: #36D6F9; font-family: 'zcoolqingkehuangyouti'; } .pro-num:nth-child(3) p:nth-child(1) { color: #27E288; font-family: 'zcoolqingkehuangyouti'; } .pro-num:nth-child(4) p:nth-child(1) { color: #FDAC80; font-family: 'zcoolqingkehuangyouti'; } #pro-total-echarts { width: 100%; height: calc(58% - 40px); } #left-center { width: 100%; height: 30%; background-color: #fff; border-radius: 5px; } #left-bottom { width: 100%; height: 39%; background-color: #fff; border-radius: 5px; } .tab-change { width: 100%; height: 40px; justify-content: space-between; } .date3-btn { width: 180px; height: 40px; justify-content: space-evenly; align-items: start; } .date3-type p { font-size: 22px; color: #bebcbc; } .date3-type { flex-direction: column; cursor: pointer; text-align: center; height: 40px; justify-content: center; } .check-p3 { color: #000 !important; } #province, #province2 { width: 54px; height: 30px; font-size: 16px; border: 1px solid #2A94F7; cursor: pointer; color: #000; text-align: center; line-height: 30px; margin-right: 10px; border-radius: 6px; } #week-echarts, #plan-trend-echarts { width: 100%; height: calc(100% - 40px); } #day-plan-box { width: 100%; height: 30%; justify-content: space-evenly; } .day-plan-num { width: 30%; height: 100%; justify-content: space-evenly; border-radius: 6px; } .day-plan-num:nth-child(1) { background: linear-gradient(to bottom, #E6EEFF, #EFF5FF); } .day-plan-num:nth-child(2) { background: linear-gradient(to bottom, #E8F7FF, #EEF9FF); } .day-plan-num:nth-child(3) { background: linear-gradient(to bottom, #F6FFE9, #FAFFEE); } .day-plan-num p:nth-child(1) { font-size: 20px; padding: 5px; } .day-plan-num p:nth-child(2) { padding: 5px 28px; font-size: 30px; font-family: 'zcoolqingkehuangyouti'; } #day-plan-title { width: 100%; height: 10%; } #day-plan-title p { font-size: 18px; padding: 0 10px; } #no-execute-day-plan { width: 100%; height: calc(60% - 40px); justify-content: space-evenly; } .no-execute-day-plan-echarts { width: 70%; height: 100%; } .no-execute-day-num { width: 30%; height: 100%; flex-direction: column; justify-content: space-evenly; } .no-execute-day-num p span { font-weight: bold; font-size: 20px; font-family: 'zcoolqingkehuangyouti'; } .no-execute-day-num p:nth-child(2) span { color: #0ECC71; } .no-execute-day-num p:nth-child(3) span { color: #E19146; } /* 左侧样式 end */ #center-box { width: 42%; flex-direction: column; justify-content: space-between; } #center-top { width: 100%; height: 35%; background-color: #fff; border-radius: 5px; } #task-num-box, #voi-num-box { width: 100%; height: calc(50% - 20px); justify-content: center; } .task-num { width: 30%; height: 100%; flex-direction: column; justify-content: center; } .task-num p:nth-child(1) { font-size: 30px; font-family: 'zcoolqingkehuangyouti'; } .task-num p:nth-child(2) { padding: 0 0 5px 0; } .task-num:nth-child(1) { background: url("../../img/newDutyHome/total_task_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .task-num:nth-child(2) { background: url("../../img/newDutyHome/xs_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .task-num:nth-child(3) { background: url("../../img/newDutyHome/no_xs_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .voi-num { width: 24%; height: 100%; justify-content: center; } .voi-num p { padding: 25px 0 0 0; } .voi-num p span { font-size: 30px; font-family: 'zcoolqingkehuangyouti'; } .voi-num:nth-child(1) { background: url("../../img/newDutyHome/yzwz_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .voi-num:nth-child(2) { background: url("../../img/newDutyHome/ybwz_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .voi-num:nth-child(3) { background: url("../../img/newDutyHome/voi_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } .voi-num:nth-child(4) { background: url("../../img/newDutyHome/zg_num.png") no-repeat 0 0 / 100% 100%; background-size: unset !important; background-position: left center !important; } #center-bottom { width: 100%; height: 63%; background-color: #fff; border-radius: 5px; } #duty-progress { width: 100%; height: calc(100% - 50px); flex-direction: column; justify-content: space-evenly; } #duty-total-progress-echarts { width: 100%; height: 20%; } #duty-detail-progress-echarts { width: 100%; height: 80%; } #right-box { width: 29%; flex-direction: column; justify-content: space-between; } #right-top { width: 100%; height: 30%; background-color: #fff; border-radius: 5px; } /* 人员统计 start */ #person-num-box { width: 100%; height: calc(100% - 50px); } #person-num { width: 39%; height: 100%; flex-direction: column; justify-content: space-evenly; } .person-total-num { width: 100%; height: 40%; } .person-total-num:nth-child(1) { flex-direction: column; justify-content: center; } .person-total-num:nth-child(1) p:nth-child(1) { font-size: 30px; font-family: 'zcoolqingkehuangyouti'; } .person-total-num:nth-child(2) { justify-content: space-evenly; } .person-total-num-child { width: 40%; height: 100%; flex-direction: column; justify-content: center; } .person-total-num-child p:nth-child(1) { font-size: 30px; font-family: 'zcoolqingkehuangyouti'; } #person-echarts { width: 61%; height: 100%; } /* 人员统计 end */ /* 告警信息 start*/ #right-center { width: 100%; height: 28%; background-color: #fff; border-radius: 5px; } #early-box { width: 100%; height: calc(100% - 60px); } #early-box ul li { height: 58px; } .early-info { width: 60%; height: 100%; font-size: 16px; } .early-info p, .early-deal-detail p { font-size: 15px; } .early-deal-detail { width: 36%; height: 100%; flex-direction: column; justify-content: center; } .layui-badge-dot { margin: 0 10px; } .no-deal { background-size: unset !important; background-position: left center !important; } .deal { background-size: unset !important; background-position: left center !important; color: #c2c2c2; } .title-circle { width: 30px; justify-content: center; } .proInfo { width: calc(100% - 30px); height: 100%; } .proInfo p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; } /* 告警信息 end*/ #right-bottom { width: 100%; height: 38%; background-color: #fff; border-radius: 5px; } #voi-ul-title { width: 100%; height: 50px; margin-bottom: 10px; background-color: #F0F0F0; } #voi-ul-title p { width: 18%; text-align: center; } #voi-ul-title p:nth-child(1) { width: 28%; } #voi-box { width: 100%; height: calc(100% - 120px); } #voi-box ul li { height: 58px; } #voi-box ul li:hover { color: #01cfff; } #voi-box ul li p { width: 18%; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; } #voi-box ul li p:nth-child(1) { width: 28%; padding: 0 5px; } #voi-box ul li p:nth-child(5) { color: #0AC4DE; cursor: pointer; } .layui-layer-dialog .layui-layer-content { color: #000; } /* 右侧样式 end */ ::-webkit-scrollbar { width: 0px; height: 10px; } body .my-skin.child-skin { background: url("../../img/compreDisplay/child-back.png") no-repeat 0 0/100% 100% transparent; background-size: cover; /* background-position: center center !important; */ }