- <template>
- <!-- 泵站档案信息 -->
- <div id="bengzhandanganfenxi" v-loading="loading"
- element-loading-background="rgba(11, 18, 52, 0.3)">
- <div class="flex flex-justcontent-spacebetween">
- <div class="eachInfo">
- <div class="name">泵站名称:</div>
- <div class="text">{{listData.name}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">流域:</div>
- <div class="text">{{listData.waterRegionName}}</div>
- </div>
- </div>
- <div class="flex flex-justcontent-spacebetween">
- <div class="eachInfo">
- <div class="name">影响区域:</div>
- <div class="text">{{listData.discharge}} {{listData.elevation}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">排出方向:</div>
- <div class="text">{{listData.discharge}}</div>
- </div>
- </div>
-
- <div class="eachInfo">
- <div class="name">泵站工艺:</div>
- <div class="text">{{listData.plan}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">泵站介绍:</div>
- <div class="text">{{listData.description}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">防汛专班联系人:</div>
- <div class="text">{{listData.dutyPerson}} {{listData.dutyPersonPhone}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">泵站图纸:</div>
- <div>
- <el-image v-if="listData.imgArr?.length>0"
- style="width: 80px; height: 80px"
- :zoom-rate="1.2"
- :max-scale="7"
- :min-scale="0.2"
- :src="listData.imgArr[0]"
- fit="cover"
- :preview-src-list="listData.imgArr"
- :preview-teleported="true"
- ></el-image>
- </div>
- </div>
-
- </div>
- </template>
-
- <script setup name="bengzhandanganfenxi">
- const { proxy } = getCurrentInstance();
- import {
-
- rainWaterPumpStationInfo,
- } from '@/api/FloodControlAndDrainage.js';
- const props = defineProps({
- // 数据id
- dataID: {
- type: String,
- },
- dataCode: {
- type: String,
- },
- arrstcode: {
- type: Array,
- },
- arrid: {
- type: Array,
- },
- Getproperties:{
- type: Object,
- }
- });
- // 获取数据
- const loading=ref(false)
- const listData=ref({})
-
- function gitDataFun() {
- loading.value=true
- rainWaterPumpStationInfo(props.Getproperties.id).then(res => {
- console.log('渍水风险详情数据', res);
- loading.value=false
- if (res && res.code == 200) {
- listData.value=res.data
- listData.value.imgArr=listData.value.fileUrl?listData.value.fileUrl.split(','):[]
- }
- },(error)=>{
- loading.value=false
- });
- }
-
-
- onMounted(() => {
-
- console.log('Getproperties123',props.Getproperties.dataId);
- gitDataFun()
-
- });
- </script>
-
- <style lang="scss" scoped>
- #bengzhandanganfenxi {
- width: 100%;
- height: 100%;
- color: #ccefff;
- padding: 20px 30px;
- overflow-y: auto;
- .eachInfo {
- display: flex;
- align-items: center;
- font-weight: bold;
- font-size: 14px;
- margin-bottom: 20px;
-
- .name {
- color: #ccdfff;
- min-width: 120px;
- text-align: right;
- padding-right: 10px;
- }
- .text {
- min-height: 37px;
- flex: 1;
- min-width: 300px;
- color: #8fbffe;
- background: #0d2359;
- border-radius: 6px;
- border: 1px solid #0b9bff;
- padding: 7px 12px;
- }
- }
- }
- </style>
-