From 1da76d05ebba28eeebef8af3832680143d5699c5 Mon Sep 17 00:00:00 2001
From: seatonwan9 <seatonwan9@163.com>
Date: 星期一, 31 五月 2021 17:12:37 +0800
Subject: [PATCH] 查询条件补充，治理设施优化
---
src/components/base-page/GovernEquipment/PublicTabs.vue | 151 +++++++++++++++++++++++++++-----------------------
1 files changed, 82 insertions(+), 69 deletions(-)
diff --git a/src/components/base-page/GovernEquipment/PublicTabs.vue b/src/components/base-page/GovernEquipment/PublicTabs.vue
index 1f08bb6..b1ed89b 100644
--- a/src/components/base-page/GovernEquipment/PublicTabs.vue
+++ b/src/components/base-page/GovernEquipment/PublicTabs.vue
@@ -1,117 +1,130 @@
<template>
- <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">
- <div class="main-matter">
- <div>
- <ul>
- <li><span class="namer">鐩戞祴鐐瑰悕绉帮細</span>{{ storagePlaceId.Name }}</li>
- <li><span class="namer">鐢熶骇鍗曚綅锛�</span>{{ storagePlaceId.porltName }}</li>
- <li><span class="namer">鎺掓斁绫诲瀷鍚嶇О锛�</span>{{ storagePlaceId.MonTypeName }}</li>
- <li><span class="namer">鎺掓斁鍘诲悜锛�</span>{{ storagePlaceId.EmissDirecti }}</li>
- <li><span class="namer">鎺у埗绾у埆鍚嶇О锛�</span>{{ storagePlaceId.ContrLevelShowName }}</li>
- <li><span class="namer">鍐�/澶栨帓鏀惧彛锛�</span>{{ storagePlaceId.OrOutPortName }}</li>
- </ul>
- </div>
- </div>
+ <div class="slotChildTabs">
+ <span></span>
+ <span></span>
+ <span></span>
+ <span></span>
+ <div class="tabs-content">
+ <ul>
+ <li>椋庨櫓鍚嶇О锛歿{ riskSourceBaseInfo.riskname }}</li>
+ <li :style="{boxShadow: riskLevel[riskSourceBaseInfo.riskLevel]}">椋庨櫓绾у埆锛歿{ riskSourceBaseInfo.riskLevel }}</li>
+ <li>椋庨櫓鎻忚堪锛歿{ riskSourceBaseInfo.depiction }}</li>
+ </ul>
</div>
</div>
</template>
<script>
-// import mapApi from '../../../api/mapApi'
+import mapApi from '@/api/mapApi'
export default {
- name: 'WaterTabs',
- props: ['storagePlaceId'],
+ name: 'PublicTabs',
data () {
- return {}
+ return {
+ riskSourceBaseInfo: [],
+ riskLevel: {
+ 1: '0 0 10px rgba(246,16,43,.7) inset',
+ 2: '0 0 10px rgba(244,142,88,.7) inset',
+ 3: '0 0 10px rgba(253,238,13,.7) inset',
+ 4: '0 0 10px rgba(38,144,2,.7) inset'
+ }
+ }
+ },
+ mounted () {
+ this.$nextTick(() => {
+ // this.refsDataTabs()
+ })
+ },
+ methods: {
+ async refsRiskDataTabs (param) {
+ // 姝ゅ鎺ュ彛涓烘牴鎹闄╂簮ID鑾峰彇椋庨櫓婧愬熀鏈俊鎭紙鏆傛椂涓烘ā鎷熸暟鎹級
+ const result = await mapApi.getEnvironmentRiskPoint(param)
+ this.riskSourceBaseInfo = result[param.riskSourceId][0]
+ }
}
}
</script>
<style scoped lang="less">
-.win {
+.slotChildTabs {
position: relative;
- margin-bottom: 0.04rem;
+ margin-bottom: 0.06rem;
background-color: @background-color;
-}
-.main {
-
- .main-matter {
+ .tabs-content {
font-size: 0.06rem;
font-weight: normal;
padding: 0.04rem 0;
border: 1px solid #396d83;
ul {
- //width: 100%;
- //height: 100%;
display: flex;
align-items: center;
- justify-content: space-around;
flex-wrap: wrap;
- margin-bottom: -0.04rem;
-
+ padding: 0 .03rem;
li {
margin-bottom: 0.04rem;
- min-width: 31%;
+ min-width: 30%;
box-shadow: 0 0 10px rgba(129,211,248,.35) inset;
color: #00fff6;
border-radius: 0.02rem;
font-size: 0.08rem;
line-height: 0.09rem;
- padding: 0.03rem .5%;
- .namer{
- display: inline-block;
- width: .6rem;
- text-align: right;
- }
+ padding: 0.05rem .8%;
}
-
+ li:nth-child(2){
+ margin-left: .03rem;
+ }
+ li:last-child {
+ text-align: left;
+ line-height: .12rem;
+ margin-bottom: 0;
+ }
+ .lastli {
+ visibility: hidden
+ }
}
}
}
-.border_corner {
- z-index: 999;
+.slotChildTabs span:nth-child(1) {
position: absolute;
- width: 10px;
- height: 10px;
- background: rgba(0, 0, 0, 0);
- border: 1px solid #47d5ea;
+ left: -1px;
+ top: -1px;
+ padding: 6px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 1px 0 0 1px;
}
-.border_corner_left_top {
- top: 0;
- left: 0;
- border-right: none;
- border-bottom: none;
+.slotChildTabs span:nth-child(2) {
+ position: absolute;
+ right: -1px;
+ top: -1px;
+ padding: 6px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 1px 1px 0 0;
}
-.border_corner_right_top {
- top: 0;
- right: 0;
- border-left: none;
- border-bottom: none;
+.slotChildTabs span:nth-child(3) {
+ position: absolute;
+ right: -1px;
+ bottom: -1px;
+ padding: 6px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 0 1px 1px 0;
}
-.border_corner_left_bottom {
- bottom: 0;
- left: 0;
- border-right: none;
- border-top: none;
-}
-
-.border_corner_right_bottom {
- bottom: 0;
- right: 0;
- border-left: none;
- border-top: none;
+.slotChildTabs span:nth-child(4) {
+ position: absolute;
+ left: -1px;
+ bottom: -1px;
+ padding: 6px;
+ border-style: solid;
+ border-color: #02a6b5;
+ border-width: 0 0 1px 1px;
}
</style>
--
Gitblit v1.8.0