<template> <div class="detail-real-box"> <div class="left-item" v-for="(item,index) in allData.jsdList" :key="index"> <div class="item-name">{{item.name}}</div> <div class="item-value" v-if="item.type=='src'"> <el-image style=" height: 40px" :src="item.value" :zoom-rate="1.2" :preview-src-list="allData.srcList" :initial-index="0" fit="cover" /> </div> <div class="item-value" v-else :title="item.value">{{item.value}}</div> </div> </div> </template> <script setup> import { getImageUrl, } from "@/utils/ruoyi"; import { useRouter } from "vue-router"; const router = useRouter(); const { proxy } = getCurrentInstance(); import moment from "moment" import useUserStore from '@/store/modules/user' const appStore = useUserStore() import { listData } from '@/api/system/dict/data'; const weatherpop = ref(false) const props = defineProps({ pointfeature: { type: Object, default: {}, }, }); const industrytypeList = ref('[]') const allData = reactive({ yuqingicon: getImageUrl('yujing_icon', 'cockpit'), jsdList: [ // { // name: '站点名称', // value: 'XXX积水点', // }, // { // name: '站点编号', // value: '039600001', // }, // { // name: '观测时间', // value: '2023-04-23 18:00', // }, // { // name: '积水深度', // value: '0.18m', // }, // { // name: '责任部门', // value: '市政管理处', // }, // { // name: ' 责 任 人', // value: '张三 136****8659', // }, // { // name: '通行状态', // value: '缓慢通行', // }, // { // name: '报警信息', // value: '通行正常通行正常通行正常通行正常', // }, // { // name: '安装照片', // type: 'src', // value: getImageUrl('install', 'cockpit'), // }, ], url: getImageUrl('install', 'cockpit'), srcList: [getImageUrl('install', 'cockpit')], }) const GetObj = ref({}) function showpic () { }; // ** 查询字典数据列表 */ function getList2 (type) { listData({ dictType: type }).then((res) => { switch (type) { case 'drainage_user_industry_type': industrytypeList.value = res.data break; } fuzhiobj() }); } function GetTypeName (value) { let name = industrytypeList.value.filter(item => { return item.dictValue == value })[0].dictLabel return name } function fuzhiobj () { GetObj.value = props.pointfeature switch (Number(GetObj.value.pointType)) { // 排水户 case 12: allData.jsdList = [ { name: '责任人', value: GetObj.value.dutyPerson, }, { name: '联系方式', value: GetObj.value.dutyTellPhone, }, { name: '行业类别', value: GetTypeName(GetObj.value.industryType), }, { name: '是否是重点排水户', value: GetObj.value.importFlag == 1 ? '是' : '否' }, { name: '是否办理排水证', value: GetObj.value.certificateStatus == 'NaN' ? '未办理' : GetObj.value.certificateStatus == 'normal' ? '有效' : '过期' }, { name: '办证年份', value: GetObj.value.certificateYear, }, { name: '地址', value: GetObj.value.drainageUserAddress, }, { name: '有效开始时间', value: GetObj.value.certificateStartTime, }, { name: '有效结束时间', value: GetObj.value.certificateEndTime, }, // { // name: '安装照片', // type: 'src', // value: getImageUrl('install', 'cockpit'), // }, ] break; } } // onMounted(() => { // console.log(props.pointfeature); // }) getList2('drainage_user_industry_type') </script> <style lang="scss" scoped> @import "@/assets/styles/map-detail.scss"; .detail-real-box { flex-wrap: wrap; overflow-y: auto; } .left-item { width: 50%; min-height: 40px; height: auto; display: flex; align-items: center; .item-name { width: 50%; } .item-value { width: 50%; color: #fff; } } </style>