diff --git a/src/views/ElectronicMap.vue b/src/views/ElectronicMap.vue index 7e78d56..5b3d1e2 100644 --- a/src/views/ElectronicMap.vue +++ b/src/views/ElectronicMap.vue @@ -11,10 +11,9 @@ - - - - + + + @@ -37,10 +36,8 @@ - - - + + import WKT from 'terraformer-wkt-parser'; import { defineProps, computed, defineEmits, ref, onMounted } from 'vue'; -import { showImagePreview } from 'vant'; import { getProjects } from '@/api/project'; import AMapUtils from '@/utils/gis/AMapUtils'; import kaifengPSFQ1 from '@/assets/geojson/kaifengPSFQ1.json'; @@ -79,132 +75,35 @@ }; const AllData = reactive({ TuLi: [ - { - name: 'GIS', - img: Img1, - check: true, - font: 'GIS平台建设与监测设施', - }, - { - name: 'HMXDLGC', - img: Img2, - check: true, - font: '海绵型道路广场', - }, - { - name: 'HMXGYLD', - img: Img3, - check: true, - font: '海绵型公园绿地', - }, - { - name: 'GWJBZ', - img: Img4, - check: true, - font: '雨水管网及泵站', - }, - { - name: 'GWPCYXF', - img: Img5, - check: true, - font: '管网排查与修复项目', - }, - { - name: 'HMJZYSQ', - img: Img6, - check: true, - font: '海绵型建筑与社区', - }, - { - name: 'HMXSX', - img: Img7, - check: true, - font: '海绵型水系', - }, + { name: 'GIS', img: Img1, check: true, font: 'GIS平台建设与监测设施' }, + { name: 'HMXDLGC', img: Img2, check: true, font: '海绵型道路广场' }, + { name: 'HMXGYLD', img: Img3, check: true, font: '海绵型公园绿地' }, + { name: 'GWJBZ', img: Img4, check: true, font: '雨水管网及泵站' }, + { name: 'GWPCYXF', img: Img5, check: true, font: '管网排查与修复项目' }, + { name: 'HMJZYSQ', img: Img6, check: true, font: '海绵型建筑与社区' }, + { name: 'HMXSX', img: Img7, check: true, font: '海绵型水系' }, ], showBottom: false, keyObj: [ - { - key: 'projectName', - name: '项目名称:', - }, - { - key: 'projectOverview', - name: '项目简介:', - }, - // { - // key: "startTime", - // name: "项目开始时间:", - // }, - // { - // key: "endTime", - // name: "项目交付时间:", - // }, - // { - // key: "chargeDepartment", - // name: "责任部门:", - // }, - // { - // key: "chargeUser", - // name: "责任人:", - // }, - // { - // key: "phone", - // name: "联系方式:", - // }, + { key: 'projectName', name: '项目名称:' }, + { key: 'projectOverview', name: '项目简介:' }, ], ProjectData: {}, isPC: false, jiansheleixing: [ - { - name: 'not_approved', - font: '尚未立项', - }, - { - name: 'XMQQSWWCSJJD', - font: '在建', - }, - { - name: 'XMQQSWWCZB', - font: '在建', - }, - { - name: 'not_yet_under_construction', - font: '在建', - }, - { - name: 'opened', - font: '在建', - }, - { - name: 'completed', - font: '已竣工', - }, - { - name: 'Suspended', - font: '已停工', - }, + { name: 'not_approved', font: '尚未立项' }, + { name: 'XMQQSWWCSJJD', font: '在建' }, + { name: 'XMQQSWWCZB', font: '在建' }, + { name: 'not_yet_under_construction', font: '在建' }, + { name: 'opened', font: '在建' }, + { name: 'completed', font: '已竣工' }, + { name: 'Suspended', font: '已停工' }, ], previewShow: false, images: [], imagesIndex: 0, }); -const getProjectss1 = async () => { - let { data } = await getProjects(); - let features = data.data - .filter((i) => i.projectLocation) - .map((i) => - turf.point(i.projectLocation.split(',').map(Number), { - ...i, - mapParams: { - icon: ICONS_MAP[i.projectTypeCode], - group: i.projectTypeCode, - name: i.projectName, - }, - }) - ); - amapUtils.geojsonToMap(turf.featureCollection(features)); -}; + const getProjectss = async () => { let { data } = await getProjects(); let features = data @@ -258,29 +157,12 @@ console.log('target,lngLat', target.getExtData(), lngLat); // 内容赋值 AllData.ProjectData = target.getExtData(); - // 判断当前环境 - // if (AllData.isPC) { - // 打开PC弹窗 - // } else { - // 打开移动端弹窗 - AllData.showBottom = true; // } }); getProjectss(); }; -/* - *根据分辨率用来检测是 PC还是移动终端 - */ -// const flashChecker = () => { -// let winWidth = window.innerWidth || document.documentElement.clientWidth; -// if (winWidth < 750) { -// AllData.isPC = false; -// } else { -// AllData.isPC = true; -// } -// }; const formatter = (item) => { let str = ''; AllData.TuLi.forEach((element) => { @@ -304,16 +186,11 @@ AllData.ProjectData.sysFileList.forEach((tem) => { Arr.push(tem.url); }); - // showImagePreview({ - // images: Arr, - // startPosition: index, - // }); AllData.imagesIndex = index; AllData.images = Arr; AllData.previewShow = true; }; onMounted(() => { - // flashChecker(); // 初始化地图 let interVal = setInterval(() => { if (window.AMap) init(), clearInterval(interVal); @@ -375,66 +252,4 @@ } } } - -// } -/* 针对宽度大于或等于750px的屏幕 不进行vw转换 */ -// @media screen and (min-width: 750px) { -// .TopTuLi { -// position: absolute; -// top: 5px; -// left: 0; -// width: calc(100% - 20px); -// height: 200px; -// background: linear-gradient( -// to bottom, -// rgb(255, 255, 255), -// rgba(255, 255, 255, 0.685) -// ); -// z-index: 999; -// border-radius: 30px; -// margin-left: 10px; -// ::selection { -// background: none; -// color: inherit; -// } - -// .Title { -// width: 100%; -// height: 60px; -// line-height: 60px; -// text-align: center; -// font-size: 26px; -// color: black; -// } - -// .TuLiListBox { -// width: 100%; -// height: 140px; -// display: flex; -// flex-direction: row; -// flex-wrap: nowrap; -// justify-content: center; -// align-items: center; -// border-radius: 10px; -// .TuLiList { -// width: 84.2px; -// height: 140px; -// cursor: pointer; -// margin: 0 10px; - -// .ListImg { -// width: 100%; -// height: 120px; -// } -// .ShowDiv { -// width: 100%; -// height: 5px; -// background: lime; -// margin-top: 5px; -// border-radius: 10px; -// } -// } -// } -// } -// } diff --git a/src/views/ElectronicMap.vue b/src/views/ElectronicMap.vue index 7e78d56..5b3d1e2 100644 --- a/src/views/ElectronicMap.vue +++ b/src/views/ElectronicMap.vue @@ -11,10 +11,9 @@ - - - - + + + @@ -37,10 +36,8 @@ - - - + + import WKT from 'terraformer-wkt-parser'; import { defineProps, computed, defineEmits, ref, onMounted } from 'vue'; -import { showImagePreview } from 'vant'; import { getProjects } from '@/api/project'; import AMapUtils from '@/utils/gis/AMapUtils'; import kaifengPSFQ1 from '@/assets/geojson/kaifengPSFQ1.json'; @@ -79,132 +75,35 @@ }; const AllData = reactive({ TuLi: [ - { - name: 'GIS', - img: Img1, - check: true, - font: 'GIS平台建设与监测设施', - }, - { - name: 'HMXDLGC', - img: Img2, - check: true, - font: '海绵型道路广场', - }, - { - name: 'HMXGYLD', - img: Img3, - check: true, - font: '海绵型公园绿地', - }, - { - name: 'GWJBZ', - img: Img4, - check: true, - font: '雨水管网及泵站', - }, - { - name: 'GWPCYXF', - img: Img5, - check: true, - font: '管网排查与修复项目', - }, - { - name: 'HMJZYSQ', - img: Img6, - check: true, - font: '海绵型建筑与社区', - }, - { - name: 'HMXSX', - img: Img7, - check: true, - font: '海绵型水系', - }, + { name: 'GIS', img: Img1, check: true, font: 'GIS平台建设与监测设施' }, + { name: 'HMXDLGC', img: Img2, check: true, font: '海绵型道路广场' }, + { name: 'HMXGYLD', img: Img3, check: true, font: '海绵型公园绿地' }, + { name: 'GWJBZ', img: Img4, check: true, font: '雨水管网及泵站' }, + { name: 'GWPCYXF', img: Img5, check: true, font: '管网排查与修复项目' }, + { name: 'HMJZYSQ', img: Img6, check: true, font: '海绵型建筑与社区' }, + { name: 'HMXSX', img: Img7, check: true, font: '海绵型水系' }, ], showBottom: false, keyObj: [ - { - key: 'projectName', - name: '项目名称:', - }, - { - key: 'projectOverview', - name: '项目简介:', - }, - // { - // key: "startTime", - // name: "项目开始时间:", - // }, - // { - // key: "endTime", - // name: "项目交付时间:", - // }, - // { - // key: "chargeDepartment", - // name: "责任部门:", - // }, - // { - // key: "chargeUser", - // name: "责任人:", - // }, - // { - // key: "phone", - // name: "联系方式:", - // }, + { key: 'projectName', name: '项目名称:' }, + { key: 'projectOverview', name: '项目简介:' }, ], ProjectData: {}, isPC: false, jiansheleixing: [ - { - name: 'not_approved', - font: '尚未立项', - }, - { - name: 'XMQQSWWCSJJD', - font: '在建', - }, - { - name: 'XMQQSWWCZB', - font: '在建', - }, - { - name: 'not_yet_under_construction', - font: '在建', - }, - { - name: 'opened', - font: '在建', - }, - { - name: 'completed', - font: '已竣工', - }, - { - name: 'Suspended', - font: '已停工', - }, + { name: 'not_approved', font: '尚未立项' }, + { name: 'XMQQSWWCSJJD', font: '在建' }, + { name: 'XMQQSWWCZB', font: '在建' }, + { name: 'not_yet_under_construction', font: '在建' }, + { name: 'opened', font: '在建' }, + { name: 'completed', font: '已竣工' }, + { name: 'Suspended', font: '已停工' }, ], previewShow: false, images: [], imagesIndex: 0, }); -const getProjectss1 = async () => { - let { data } = await getProjects(); - let features = data.data - .filter((i) => i.projectLocation) - .map((i) => - turf.point(i.projectLocation.split(',').map(Number), { - ...i, - mapParams: { - icon: ICONS_MAP[i.projectTypeCode], - group: i.projectTypeCode, - name: i.projectName, - }, - }) - ); - amapUtils.geojsonToMap(turf.featureCollection(features)); -}; + const getProjectss = async () => { let { data } = await getProjects(); let features = data @@ -258,29 +157,12 @@ console.log('target,lngLat', target.getExtData(), lngLat); // 内容赋值 AllData.ProjectData = target.getExtData(); - // 判断当前环境 - // if (AllData.isPC) { - // 打开PC弹窗 - // } else { - // 打开移动端弹窗 - AllData.showBottom = true; // } }); getProjectss(); }; -/* - *根据分辨率用来检测是 PC还是移动终端 - */ -// const flashChecker = () => { -// let winWidth = window.innerWidth || document.documentElement.clientWidth; -// if (winWidth < 750) { -// AllData.isPC = false; -// } else { -// AllData.isPC = true; -// } -// }; const formatter = (item) => { let str = ''; AllData.TuLi.forEach((element) => { @@ -304,16 +186,11 @@ AllData.ProjectData.sysFileList.forEach((tem) => { Arr.push(tem.url); }); - // showImagePreview({ - // images: Arr, - // startPosition: index, - // }); AllData.imagesIndex = index; AllData.images = Arr; AllData.previewShow = true; }; onMounted(() => { - // flashChecker(); // 初始化地图 let interVal = setInterval(() => { if (window.AMap) init(), clearInterval(interVal); @@ -375,66 +252,4 @@ } } } - -// } -/* 针对宽度大于或等于750px的屏幕 不进行vw转换 */ -// @media screen and (min-width: 750px) { -// .TopTuLi { -// position: absolute; -// top: 5px; -// left: 0; -// width: calc(100% - 20px); -// height: 200px; -// background: linear-gradient( -// to bottom, -// rgb(255, 255, 255), -// rgba(255, 255, 255, 0.685) -// ); -// z-index: 999; -// border-radius: 30px; -// margin-left: 10px; -// ::selection { -// background: none; -// color: inherit; -// } - -// .Title { -// width: 100%; -// height: 60px; -// line-height: 60px; -// text-align: center; -// font-size: 26px; -// color: black; -// } - -// .TuLiListBox { -// width: 100%; -// height: 140px; -// display: flex; -// flex-direction: row; -// flex-wrap: nowrap; -// justify-content: center; -// align-items: center; -// border-radius: 10px; -// .TuLiList { -// width: 84.2px; -// height: 140px; -// cursor: pointer; -// margin: 0 10px; - -// .ListImg { -// width: 100%; -// height: 120px; -// } -// .ShowDiv { -// width: 100%; -// height: 5px; -// background: lime; -// margin-top: 5px; -// border-radius: 10px; -// } -// } -// } -// } -// } diff --git a/vite.config.js b/vite.config.js index 37d95d3..5e2e15e 100644 --- a/vite.config.js +++ b/vite.config.js @@ -9,9 +9,8 @@ const Timestamp = new Date().getTime(); //随机时间戳 -const targetUrl = 'http://192.168.20.52:7300'; //杨辉 -// const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上 -// http://kaifeng.wh-nf.cn/prod-api +// const targetUrl = 'http://192.168.20.52:7300'; //杨辉 +const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上 export default defineConfig({ // 地址是和router中和ngix中配置的名称一致