- //main-container全局样式
- .publicContainer {
- padding: 20px;
- color: #fff;
- }
- // 公共字体
- @font-face {
- font-family: 'YouSheBiaoTiHei';
- src: url('./../fonts/YouSheBiaoTiHei.TTF');
- }
- .text-center {
- text-align: center;
- }
-
- .multiselect {
- line-height: 16px;
- }
-
- .multiselect--active {
- z-index: 1000 !important;
- }
- .dialog-detail-box {
- .dialog-form-detail {
- border-bottom: 1px solid $mainColor2;
- border-right: 1px solid $mainColor2;
- .flex-r {
- border-right: 1px solid $mainColor2;
- border-top: 1px solid $mainColor2;
- width: 50%;
- }
-
- .detail-label {
- width: 118px;
- text-align: center;
- padding: 10px;
- background: $mainColor1;
- border-radius: 0px 0px 0px 0px;
- opacity: 1;
- border: 1px solid $mainColor2;
- border-bottom: 0;
- font-size: 14px;
- font-family: HarmonyOS Sans SC-Bold, HarmonyOS Sans SC;
- font-weight: 700;
- color: #c6c6c6;
- }
- .detail-value {
- font-size: 14px;
- font-family: Source Han Sans CN-Regular, Source Han Sans CN;
- font-weight: 400;
- color: #fff;
- padding: 8px 8px;
- flex: 1;
- }
- }
- }
- // 长效考核标题
- .longTermTitle {
- position: absolute;
- left: 35%;
- top: 20px;
- font-size: 22px;
- color: #21adda;
- z-index: 99;
- }
- // 一张图标题 排水防涝
- .selectTitle {
- display: flex;
- align-items: center;
- justify-content: space-between;
- height: 45px;
- background: url('@/assets/images/setting/titleBg.png') no-repeat;
- background-size: 100% 100%;
- .name {
- font-family: YouSheBiaoTiHei;
- font-size: 22px;
- font-style: normal;
- font-weight: bold;
- line-height: normal;
- letter-spacing: 2px;
- color: #21adda;
- margin-left: 70px;
- background: linear-gradient(180deg, #fff 26.56%, #21adda 100%);
- background-clip: text;
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- }
- .titleEnd {
- font-size: 14px;
- .el-button {
- margin-left: 8px;
- }
- }
- }
- // 一张图标题 海绵综合
- .selectTitleHM {
- display: flex;
- align-items: center;
- justify-content: space-between;
- height: 45px;
- background: url('@/assets/images/Sponge_screen/ListBox_Header_BG.png') no-repeat;
- background-size: 100% 100%;
- .name {
- font-family: YouSheBiaoTiHei;
- font-size: 18px;
- font-style: normal;
- font-weight: bold;
- line-height: normal;
- letter-spacing: 2px;
- color: #21adda;
- margin-left: 40px;
- background: linear-gradient(180deg, #fff 26.56%, #21adda 100%);
- background-clip: text;
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- }
- .titleEnd {
- font-size: 14px;
- .el-button {
- margin-left: 8px;
- }
- }
- }
- .el-textarea .el-input__count {
- background: transparent !important;
- }
- // 公共的表单提交
- .publicForm {
- .el-select,
- .el-input,
- .el-textarea {
- width: 100% !important;
- }
- }
- .red {
- color: $red !important;
- }
- .green {
- color: $green !important;
- }
- // 省略号
- .ellipsis {
- overflow: hidden;
- white-space: nowrap; /* 防止文字换行 */
- text-overflow: ellipsis; /* 超出部分显示省略号 */
- }
- // 公共的弹窗详情
- .publicDetail {
- display: flex;
- flex-wrap: wrap;
- margin-bottom: 30px;
- .part {
- display: flex;
- flex-wrap: wrap;
- align-items: center;
- width: 48%;
- margin-right: 2%;
- line-height: 30px;
- color: #c6c6c6;
- .title {
- font-weight: bold;
- }
-
- .content {
- margin-left: 10px;
- .el-image {
- width: 100px;
- height: 100px;
- }
- }
- }
- }
-
- // 表单提交 flex50 一行两列
- .flex50 {
- display: flex;
- flex-wrap: wrap;
- .el-form-item {
- width: 48%;
- margin-right: 2%;
- }
- }
-
- // 批量新增
- .batchAdd {
- display: flex;
- flex-direction: column;
- margin: 0px 0px 20px 0px;
-
- .batchTitle {
- width: 100%;
- display: flex;
- justify-content: space-between;
- font-weight: bold;
- height: 30px;
-
- p {
- text-align: center;
- width: 150px;
- }
- }
-
- .batchCon {
- display: flex;
- justify-content: space-between;
- align-items: center;
- border-top: 1px dashed #c6c6c6;
- margin-top: 20px;
-
- .el-form-item {
- margin: 10px 0px 0px 5px;
- width: 150px;
- .el-form-item__content {
- margin-left: 0px !important;
- }
- }
- }
- }
- // 一张图公共样式
- .mapTitle {
- font-weight: bold;
- font-size: 15px;
- color: #fff;
- width: 100%;
- height: 25px;
- line-height: 25px;
- border-left: 5px solid #00c7f2;
- background-size: 100% 100%;
- padding-left: 15px;
- }
-
- .tableLineMonitor {
- display: flex;
- justify-content: flex-end;
- margin-bottom: 5px;
- .el-icon {
- font-size: 26px;
- color: #5796ff;
- margin-right: 15px;
- cursor: pointer;
- }
- }
-
- // 图例色块
- .mapLegendColor {
- position: absolute;
- bottom: 20px;
- right: 430px;
- z-index: 99;
- background: $mainColor2;
- box-shadow: 0px 0px 20px $mainColor1;
- padding: 10px;
- border-radius: 8px;
- p {
- line-height: 25px;
- span {
- display: inline-block;
- width: 20px;
- height: 10px;
- border-radius: 5px;
- margin-right: 6px;
- }
- .info {
- background: #47e44e;
- }
- .primary {
- background: #4fd4ff;
- }
- .yellow {
- background: #f4e443;
- }
- .blue {
- background: $light-blue;
- }
- .pink {
- background: #f28c3a;
- }
- .red {
- background: #dd3737;
- }
- .green {
- background: #47e44e;
- }
- .reds {
- background: #ff0303;
- }
- }
- .title {
- font-size: 16px;
- font-weight: bold;
- }
- }
- // 暂无数据
- .noData {
- width: 100%;
- text-align: center;
- color: #c6c6c6;
- line-height: 200px;
- }
- // 长效考核板块
- .rightZkCX {
- right: 520px;
- }
- .rightSqCX {
- right: 10px;
- }
- .videoImgRCX {
- width: 13px;
- height: 147px;
- background: url('@/assets/newImgs/down.png');
- background-size: 100% 100%;
- transform: rotate(180deg);
- color: #fff;
- position: absolute;
- top: 340px;
- z-index: 99;
- cursor: pointer;
- transition: 0.5s ease-in-out;
- }
-
- // gis地图公共popup样式
- .popupMapPoint {
- background: $mainColor1;
- border-radius: 8px;
- .title {
- text-align: center;
- font-weight: bold;
- font-size: 16px;
- background: $mainColor2;
- padding: 5px;
- }
- .part {
- padding: 5px 10px;
- }
- }
- // 工改文件上传的列表展示
- .ggFileListShow {
- flex-wrap: wrap;
- display: flex;
- width: 100%;
- margin-top: 10px;
- .part {
- cursor: pointer;
- align-items: center;
- margin-right: 10px;
- margin-bottom: 5px;
- background: $mainColor2;
- padding: 1px 6px;
- border-radius: 5px;
- &:hover {
- background: $mainColor1;
- }
- .name {
- width: 150px;
- }
- .el-icon {
- margin-left: 8px;
- }
- }
- }
-
- // 一张图左右面板公共样式
- .rightZkCXHK {
- right: 470px;
- }
- .leftZkHM {
- left: 470px;
- }
- .leftSqHM {
- left: 10px;
- }
- .videoImgHM {
- width: 13px;
- height: 147px;
- background: url('@/assets/newImgs/down.png');
- background-size: 100% 100%;
- color: #fff;
- position: absolute;
- top: 340px;
- z-index: 99;
- cursor: pointer;
- transition: 0.5s ease-in-out;
- }
- .assContentLeftHM {
- width: 450px;
- height: calc(100vh - 100px);
- background: linear-gradient(0deg, #011431 0%, rgba(1, 20, 49, 0.8) 100%);
- border-radius: 8px;
- position: absolute;
- top: 20px;
- left: 20px;
- z-index: 90;
- padding: 15px;
- overflow: auto;
- }
- .assContentRightHM {
- width: 450px;
- height: calc(100vh - 100px);
- background: linear-gradient(0deg, #011431 0%, rgba(1, 20, 49, 0.8) 100%);
- border-radius: 8px;
- position: absolute;
- top: 20px;
- right: 20px;
- z-index: 90;
- padding: 15px;
- overflow-x: hidden;
- overflow-y: auto;
- }
- .OneLine {
- display: flex;
- align-items: center;
- justify-content: space-between;
- width: 410px;
- background: url('@/assets/newImgs/HaiMianScreen/natural.png');
- background-size: 100% 100%;
- z-index: 115;
- padding: 8px;
- margin: 8px auto;
- }
- .lineLeft {
- margin-left: 30px;
- color: #2482e6;
- font-weight: 600;
- }
- .lineRight {
- font-size: 14px;
- }
- .planCont {
- margin: 10px auto;
- font-size: 13px;
- .activePlan {
- background: $mainColor1;
- }
- .flex {
- margin-bottom: 5px;
- padding: 5px 10px;
- border-radius: 8px;
- align-items: center;
- cursor: pointer;
- .title {
- width: 110px;
- color: $--color-primary;
- }
- .el-progress {
- flex: 1;
- margin: 0px 15px;
- .name {
- font-size: 15px;
- font-weight: bold;
- padding-right: 10px;
- }
- }
- }
- }