- <template>
- <!-- 风险点档案信息 -->
- <div id="fengxiandiandanganxinxi" v-loading="loading"
- element-loading-background="rgba(11, 18, 52, 0.3)">
- <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.riskReason}}</div>
- </div>
- <div class="eachInfo">
- <div class="name">应急措施:</div>
- <div class="text">{{listData.floodDuty}}</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="fengxiandiandanganxinxi">
- const { proxy } = getCurrentInstance();
- import {
-
- waterloggingPointInfo,
- } 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
- waterloggingPointInfo(props.Getproperties.dataId).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('Getproperties12344',props.Getproperties);
- gitDataFun()
-
- });
- </script>
-
- <style lang="scss" scoped>
- #fengxiandiandanganxinxi {
- 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: 90px;
- text-align: right;
- padding-right: 10px;
- }
- .text {
- min-height: 37px;
- flex: 1;
- color: #8fbffe;
- background: #0d2359;
- border-radius: 6px;
- border: 1px solid #0b9bff;
- padding: 7px 12px;
- }
- }
- }
- </style>