| | |
| | | <template> |
| | | <div class="gas-tab"> |
| | | <!-- 框 --> |
| | | <div class="win"> |
| | | <!-- 四个角的边框效果 --> |
| | | <div class="border_corner border_corner_left_top"></div> |
| | | <div class="border_corner border_corner_right_top"></div> |
| | | <div class="border_corner border_corner_left_bottom"></div> |
| | | <div class="border_corner border_corner_right_bottom"></div> |
| | | <div class="main"> |
| | | <el-row type="flex" class="row-bg" justify="space-around"> |
| | | <el-col :span="12">监测点名称:{{ displayContent.Name }}</el-col> |
| | | <el-col :span="12">生产单位:{{ displayContent.DeptSname }}</el-col> |
| | |
| | | <el-col :span="12">控制级别名称:{{ displayContent.ContrLevelShowName }}</el-col> |
| | | <el-col :span="12">内/外排口:{{ displayContent.OrOutPortName }}</el-col> |
| | | </el-row> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="less"> |
| | | .gas-tab { |
| | | border: 1px #4c667d solid; |
| | | } |
| | | |
| | | .win { |
| | | position: relative; |
| | | display: inline-block; |
| | | //border: 1px solid #396d83; |
| | | } |
| | | .main { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | .border_corner{ |
| | | z-index: 2500; |
| | | position: absolute; |
| | | width: 14px; |
| | | height: 14px; |
| | | background: rgba(0,0,0,0); |
| | | border: 2px solid #47d5ea; |
| | | } |
| | | .border_corner_left_top{ |
| | | top: 0; |
| | | left: 0; |
| | | border-right: none; |
| | | border-bottom: none; |
| | | } |
| | | .border_corner_right_top{ |
| | | top: 0; |
| | | right: 0; |
| | | border-left: none; |
| | | border-bottom: none; |
| | | } |
| | | .border_corner_left_bottom{ |
| | | bottom: 0; |
| | | left: 0; |
| | | border-right: none; |
| | | border-top: none; |
| | | border-bottom-left-radius: 4px; |
| | | } |
| | | .border_corner_right_bottom{ |
| | | bottom: 0; |
| | | right: 0; |
| | | border-left: none; |
| | | border-top: none; |
| | | } |
| | | .el-row { |
| | | color: #00d0f9; |
| | | |
| | | .el-col { |
| | | width: 200px; |
| | | height: 28px; |
| | | background-color: #243a55; |
| | | border-radius: 0.05rem; |
| | | margin: 5px 0; |
| | | background-color: #243a55;; |
| | | text-align: center; |
| | | line-height: 28px; |
| | | } |