yiqiuyang/kxfx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: yiqiuyang:2f6de52604ff2531a8b23211d8eedc5f43ba54c1
Branches Tags
yiqiuyang:main yiqiuyang:pathPlan yiqiuyang:yqy
..
compare: yiqiuyang:yqy
Branches Tags
yiqiuyang:pathPlan yiqiuyang:yqy yiqiuyang:main

7 Commits
2f6de52604 ... yqy

Author SHA1 Message Date
yiqiuyang
faae591f4c 修改代码样式 2025-10-27 11:06:03 +08:00
yiqiuyang
da4b440b0e 1 2025-10-27 10:35:37 +08:00
yiqiuyang
d8bf6fd1b5 修改样式 2025-10-27 10:33:48 +08:00
yiqiuyang
ffe45a240d 合并代码 2025-10-27 09:54:17 +08:00
yiqiuyang
0ed458cb08 Merge branch 'pathPlan' of https://git.rangutech.com/yiqiuyang/kxfx into yqy 2025-10-27 09:50:49 +08:00
gcw_IJ7DAiVL
a562e2cea8 add 样式 2025-10-27 09:46:51 +08:00
gcw_IJ7DAiVL
af252cd65e fix 2025-10-24 09:02:28 +08:00
8 changed files with 153 additions and 118 deletions
Expand all files Collapse all files

1
.gitignore vendored
View File

@ -21,3 +21,4 @@ pnpm-debug.log*
*.njsproj *.njsproj
*.sln *.sln
*.sw? *.sw?
*.zip

BIN
dist.zip
View File

Binary file not shown.

8
public/data/points.json
View File

@ -1,16 +1,16 @@
{ {
"startPoint": "114.26344,27.800982", "startPoint": "114.312888,27.796612",
"endPoint": "114.284668,27.794961", "endPoint": "114.336525,27.767989",
"viaPoints": [ "viaPoints": [
{ {
"time": "1694352000000", "time": "1694352000000",
"points": "114.272329,27.797299" "points": "114.334239,27.779261"
} }
], ],
"avoidPoints": [ "avoidPoints": [
{ {
"time": "1694352003000", "time": "1694352003000",
"points": "114.27882,27.792857" "points": ""
} }
], ],
"avoidAreas": [ "avoidAreas": [

17
src/assets/scss/index.scss
View File

@ -80,3 +80,20 @@ html {
.flex-warp { .flex-warp {
flex-wrap: wrap; flex-wrap: wrap;
} }
.el-form-item {
display: flex!important;
justify-content: space-between;
margin-bottom: 12px!important;
}
.el-form-item__label {
letter-spacing: -1px;
min-width: 130px!important;
padding: 0!important;
white-space: nowrap; /* 强制不换行 */
flex-shrink: 0;
font-size: 16px!important;
}
.el-input__inner {
height: 24px;
line-height: 24px;
}

10
src/router/index.js
View File

@ -6,11 +6,11 @@ import residentAnalysis from '@/views/residentAnalysis/index.vue'
Vue.use(VueRouter) Vue.use(VueRouter)
const routes = [ const routes = [
// { {
// path: '/', path: '/home',
// name: 'home', name: 'home',
// component: HomeView, component: HomeView,
// }, },
{ {
path: '/', path: '/',
name: 'residentAnalysis', name: 'residentAnalysis',

64
src/views/home/home.vue
View File

@ -2,11 +2,21 @@
<div> <div>
<div class="home-header"> <div class="home-header">
<div class="home-header-left"> <div class="home-header-left">
<el-tooltip content="起点绘制">
<img @click="drawStartPoint" src="@/assets/image/start.png" /> <img @click="drawStartPoint" src="@/assets/image/start.png" />
</el-tooltip>
<el-tooltip content="终点绘制">
<img @click="drawEndPoint" src="@/assets/image/end.png" /> <img @click="drawEndPoint" src="@/assets/image/end.png" />
</el-tooltip>
<el-tooltip content="途径点绘制">
<img @click="drawViaPoint" src="@/assets/image/add.png" /> <img @click="drawViaPoint" src="@/assets/image/add.png" />
</el-tooltip>
<el-tooltip content="避让点绘制">
<img @click="drawAvoidPoint" src="@/assets/image/avoidP.png" /> <img @click="drawAvoidPoint" src="@/assets/image/avoidP.png" />
</el-tooltip>
<el-tooltip content="避让区域绘制">
<img @click="drawAvoidArea" src="@/assets/image/updown.png" /> <img @click="drawAvoidArea" src="@/assets/image/updown.png" />
</el-tooltip>
<div @click="clear" class="sure">清除</div> <div @click="clear" class="sure">清除</div>
<div @click="calculateShortestPath" class="sure">确定</div> <div @click="calculateShortestPath" class="sure">确定</div>
<div @click="hadBuffer" class="sure">路线隐蔽规划</div> <div @click="hadBuffer" class="sure">路线隐蔽规划</div>
@ -36,14 +46,8 @@
<div class="main-container"> <div class="main-container">
<div class="control-panel"> <div class="control-panel">
<div class="title">参数</div> <div class="title">参数</div>
<el-form <el-form @submit.native.prevent="calculateShortestPath" label-position="left" size="mini" :model="form">
@submit.native.prevent="calculateShortestPath" <el-form-item label="起点：">
label-width="120px"
label-position="left"
size="mini"
:model="form"
>
<el-form-item label="起点">
<el-input <el-input
v-model="form.startPoint" v-model="form.startPoint"
@blur="pointsChange('startPoint')" @blur="pointsChange('startPoint')"
@ -51,7 +55,7 @@
clearable clearable
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="终点"> <el-form-item label="终点：">
<el-input <el-input
v-model="form.endPoint" v-model="form.endPoint"
@blur="pointsChange('endPoint')" @blur="pointsChange('endPoint')"
@ -59,7 +63,7 @@
clearable clearable
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="途经点"> <el-form-item label="途经点：">
<div v-for="(item, index) in form.viaPoints" :key="index"> <div v-for="(item, index) in form.viaPoints" :key="index">
<el-input <el-input
v-model="item.points" v-model="item.points"
@ -70,7 +74,7 @@
></el-input> ></el-input>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="避让点"> <el-form-item label="避让点：">
<div v-for="(item, index) in form.avoidPoints" :key="index"> <div v-for="(item, index) in form.avoidPoints" :key="index">
<el-input <el-input
v-model="item.points" v-model="item.points"
@ -81,7 +85,7 @@
></el-input> ></el-input>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="避让区域"> <el-form-item label="避让区域：">
<div v-for="(item, index) in form.avoidAreas" :key="index"> <div v-for="(item, index) in form.avoidAreas" :key="index">
<el-input <el-input
v-model="item.points" v-model="item.points"
@ -98,11 +102,11 @@
</div> </div>
<div class="control-panel"> <div class="control-panel">
<div class="title">隐蔽添加</div> <div class="title">隐蔽添加</div>
<el-form label-width="120px" label-position="left" size="mini"> <el-form label-position="left" size="mini">
<el-form-item label="缓冲半径（m）"> <el-form-item label="缓冲半径(m)：">
<el-input v-model="hideform.radius"></el-input> <el-input v-model="hideform.radius"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="面积冗余（%）"> <el-form-item label="面积冗余(%)：">
<el-input v-model="hideform.redundancy" placeholder=""></el-input> <el-input v-model="hideform.redundancy" placeholder=""></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -115,14 +119,14 @@
<span>参与路线规划</span> <span>参与路线规划</span>
</div> </div>
</div> </div>
<el-form @submit.native.prevent="calculateShortestPath" label-width="120px" label-position="left" size="mini"> <el-form @submit.native.prevent="calculateShortestPath" label-position="left" size="mini">
<el-form-item label="宽度"> <el-form-item label="宽度(m)：">
<el-input v-model="inputform.width"></el-input> <el-input v-model="inputform.width"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="载重（吨）"> <el-form-item label="载重(吨)：">
<el-input v-model="inputform.load" placeholder=""></el-input> <el-input v-model="inputform.load" placeholder=""></el-input>
</el-form-item> </el-form-item>
<el-form-item label="最小转弯半径"> <el-form-item label="最小转弯半径(m)：">
<el-input v-model="inputform.minTurnRadius" placeholder=""></el-input> <el-input v-model="inputform.minTurnRadius" placeholder=""></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -426,6 +430,7 @@ export default {
} }
}, },
async mounted() { async mounted() {
;[...document.querySelectorAll('*')].forEach((n) => console.log(window.getComputedStyle(n).fontFamily))
this.viewer = null this.viewer = null
await this.getMapOption() await this.getMapOption()
this.$nextTick(async () => { this.$nextTick(async () => {
@ -466,6 +471,9 @@ export default {
pitch: -35, pitch: -35,
}, },
}, },
defaultLabelStyle: {
font: '16px "DengXian",sans-serif',
},
// basemaps: [ // basemaps: [
// { // {
// id: "image-tdss", // id: "image-tdss",
@ -1264,8 +1272,14 @@ export default {
graphic?.remove() graphic?.remove()
this.viaPoints = this.viaPoints.filter((viaPoint) => viaPoint.style.time !== row.time) this.viaPoints = this.viaPoints.filter((viaPoint) => viaPoint.style.time !== row.time)
} else { } else {
if (this.viaPoints.length > 0) {
const graphic = this.viaPoints.find((viaPoint) => viaPoint.style.time === row.time) const graphic = this.viaPoints.find((viaPoint) => viaPoint.style.time === row.time)
this.updatePointPosition(graphic, row.points) this.updatePointPosition(graphic, row.points)
} else {
const time = new Date().getTime()
row.time = time
this.addPointToMap('viaPoints', row, time)
}
} }
} else if (type === 'avoidPoints') { } else if (type === 'avoidPoints') {
if (!row.points) { if (!row.points) {
@ -1279,8 +1293,14 @@ export default {
graphic?.remove() graphic?.remove()
this.avoidPoints = this.avoidPoints.filter((avoidPoint) => avoidPoint.style.time !== row.time) this.avoidPoints = this.avoidPoints.filter((avoidPoint) => avoidPoint.style.time !== row.time)
} else { } else {
if (this.avoidPoints.length > 0) {
const graphic = this.avoidPoints.find((avoidPoint) => avoidPoint.style.time === row.time) const graphic = this.avoidPoints.find((avoidPoint) => avoidPoint.style.time === row.time)
this.updatePointPosition(graphic, row.points) this.updatePointPosition(graphic, row.points)
} else {
const time = new Date().getTime()
row.time = time
this.addPointToMap('avoidPoints', row, time)
}
} }
} else if (type === 'avoidAreas') { } else if (type === 'avoidAreas') {
if (!row.points) { if (!row.points) {
@ -1294,8 +1314,14 @@ export default {
graphic?.remove() graphic?.remove()
this.avoidAreas = this.avoidAreas.filter((avoidArea) => avoidArea.style.time !== row.time) this.avoidAreas = this.avoidAreas.filter((avoidArea) => avoidArea.style.time !== row.time)
} else { } else {
if (this.avoidAreas.length > 0) {
const graphic = this.avoidAreas.find((avoidArea) => avoidArea.style.time === row.time) const graphic = this.avoidAreas.find((avoidArea) => avoidArea.style.time === row.time)
this.updatePolygonPosition(graphic, row.points) this.updatePolygonPosition(graphic, row.points)
} else {
const time = new Date().getTime()
row.time = time
this.addPolygonToMap('avoidAreas', row, time)
}
} }
} }
}, },

111
src/views/residentAnalysis/index.vue
View File

@ -5,19 +5,19 @@
<el-tooltip effect="dark" content="绘制矩形区域"> <el-tooltip effect="dark" content="绘制矩形区域">
<img :src="item.src" @click="drawRectangle" /> <img :src="item.src" @click="drawRectangle" />
</el-tooltip> </el-tooltip>
<el-button class="form-btn" type="primary" size="mini" @click="analyzeAverageSlope">确定</el-button> <div class="sure" @click="analyzeAverageSlope">确定</div>
<div class="right"> <div class="right flex a-c">
<el-button class="form-btn" type="primary" size="mini" :disabled="showExport" @click="clickExport"> <div class="sure" :style="!showExport ? {cursor: 'pointer'} : {cursor: 'not-allowed'}" @click="clickExport">
导出 导出
</el-button> </div>
<el-button class="form-btn" type="primary" size="mini" @click="handleExportJosn"> json编辑 </el-button> <div class="sure" @click="handleExportJosn">json编辑</div>
</div> </div>
</div> </div>
</div> </div>
<div class="content flex j-s a-c"> <div class="content flex j-s a-c">
<div class="left"> <div class="left">
<el-form label-width="140px" label-position="left" size="small"> <el-form label-position="left" size="mini">
<!-- 范围 --> <!-- 范围 -->
<div class="control-panel"> <div class="control-panel">
<div class="title">范围</div> <div class="title">范围</div>
@ -68,7 +68,14 @@
</div> </div>
<!-- 地图 --> <!-- 地图 -->
<div class="center" id="cesiumContainer" v-loading="mapLoading" :element-loading-text="mapLoadText"></div> <div
class="center"
id="cesiumContainer"
v-loading="mapLoading"
:element-loading-text="mapLoadText"
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
></div>
<div class="right flex column" v-loading="showLoading" element-loading-text="数据加载中"> <div class="right flex column" v-loading="showLoading" element-loading-text="数据加载中">
<!-- 路点 --> <!-- 路点 -->
@ -149,8 +156,8 @@
</vxe-column> </vxe-column>
<vxe-column title="操作" width="100"> <vxe-column title="操作" width="100">
<template v-slot="{row}"> <template v-slot="{row}">
<el-button v-if="!row.editing" type="text" size="mini" @click="handleEdit(row)">编辑</el-button> <el-button type="text" size="mini" v-if="!row.editing" @click="handleEdit(row)">编辑</el-button>
<el-button v-else type="text" size="mini" @click="handleSave(row)">保存</el-button> <el-button type="text" size="mini" v-else @click="handleSave(row)">保存</el-button>
<el-button type="text" size="mini" @click="handleDelete('roadPointList', row)">删除</el-button> <el-button type="text" size="mini" @click="handleDelete('roadPointList', row)">删除</el-button>
</template> </template>
</vxe-column> </vxe-column>
@ -192,8 +199,8 @@
</vxe-column> </vxe-column>
<vxe-column title="操作" width="100"> <vxe-column title="操作" width="100">
<template v-slot="{row}"> <template v-slot="{row}">
<el-button v-if="!row.editing" type="text" size="mini" @click="handleEdit(row)">编辑</el-button> <el-button type="text" size="mini" v-if="!row.editing" @click="handleEdit(row)">编辑</el-button>
<el-button v-else type="text" size="mini" @click="handleSave(row)">保存</el-button> <el-button type="text" size="mini" v-else @click="handleSave(row)">保存</el-button>
<el-button type="text" size="mini" @click="handleDelete('roadLineList', row)">删除</el-button> <el-button type="text" size="mini" @click="handleDelete('roadLineList', row)">删除</el-button>
</template> </template>
</vxe-column> </vxe-column>
@ -237,8 +244,8 @@
</vxe-column> </vxe-column>
<vxe-column title="操作" width="100"> <vxe-column title="操作" width="100">
<template v-slot="{row}"> <template v-slot="{row}">
<el-button v-if="!row.editing" type="text" size="mini" @click="handleEdit(row)">编辑</el-button> <el-button type="text" size="mini" v-if="!row.editing" @click="handleEdit(row)">编辑</el-button>
<el-button v-else type="text" size="mini" @click="handleSave(row)">保存</el-button> <el-button type="text" size="mini" v-else @click="handleSave(row)">保存</el-button>
<el-button type="text" size="mini" @click="handleDelete('waterPointList', row)">删除</el-button> <el-button type="text" size="mini" @click="handleDelete('waterPointList', row)">删除</el-button>
</template> </template>
</vxe-column> </vxe-column>
@ -280,8 +287,8 @@
</vxe-column> </vxe-column>
<vxe-column title="操作" width="100"> <vxe-column title="操作" width="100">
<template v-slot="{row}"> <template v-slot="{row}">
<el-button v-if="!row.editing" type="text" size="mini" @click="handleEdit(row)">编辑</el-button> <el-button type="text" size="mini" v-if="!row.editing" @click="handleEdit(row)">编辑</el-button>
<el-button v-else type="text" size="mini" @click="handleSave(row)">保存</el-button> <el-button type="text" size="mini" v-else @click="handleSave(row)">保存</el-button>
<el-button type="text" size="mini" @click="handleDelete('waterLineList', row)">删除</el-button> <el-button type="text" size="mini" @click="handleDelete('waterLineList', row)">删除</el-button>
</template> </template>
</vxe-column> </vxe-column>
@ -293,7 +300,7 @@
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button size="mini" @click="dialogVisible = false">取消</el-button> <el-button size="mini" @click="dialogVisible = false">取消</el-button>
<el-button type="primary" size="mini" @click="exportJSON">导出</el-button> <el-button type="primary" size="mini" @click="exportJSON">保存</el-button>
</div> </div>
</el-dialog> </el-dialog>
@ -318,7 +325,6 @@
import {getStorage} from '@/utils/localStorage' import {getStorage} from '@/utils/localStorage'
import plantJson from '/public/config/plant.json' import plantJson from '/public/config/plant.json'
import soilJson from '/public/config/soil.json' import soilJson from '/public/config/soil.json'
import FileSaver from 'file-saver'
import axios from 'axios' import axios from 'axios'
import iniParser from 'ini-parser' import iniParser from 'ini-parser'
@ -685,19 +691,13 @@ export default {
// 判断矩形与 mars3d GeoJSON 图层是否相交(不转 GeoJSON) // 判断矩形与 mars3d GeoJSON 图层是否相交(不转 GeoJSON)
getIntersectId(position, layer) { getIntersectId(position, layer) {
console.log('position===>', position, layer)
if (!position || !layer || !layer.graphics) return null if (!position || !layer || !layer.graphics) return null
const rectCoords = position.concat([position[0]]) // 闭合 const rectCoords = position.concat([position[0]]) // 闭合
console.log('rectCoords===>', rectCoords)
const rectPoly = turf.polygon([rectCoords]) const rectPoly = turf.polygon([rectCoords])
console.log('rectPoly===>', rectPoly)
const [minX, minY, maxX, maxY] = turf.bbox(rectPoly) // 矩形 bbox const [minX, minY, maxX, maxY] = turf.bbox(rectPoly) // 矩形 bbox
console.log('minX, minY, maxX, maxY===>', minX, minY, maxX, maxY)
let fc = this._polyCache.get(layer) let fc = this._polyCache.get(layer)
if (!fc) { if (!fc) {
@ -1256,6 +1256,8 @@ export default {
// 点击导出按钮 // 点击导出按钮
clickExport() { clickExport() {
if (this.showExport) return
this.rectangles.forEach((rectGraphic) => { this.rectangles.forEach((rectGraphic) => {
this.selectRectangle(rectGraphic) this.selectRectangle(rectGraphic)
}) })
@ -1282,7 +1284,6 @@ export default {
} }
) )
.then((res) => { .then((res) => {
this.$message.success(res)
this.$message.success('导出成功!') this.$message.success('导出成功!')
}) })
.catch((error) => { .catch((error) => {
@ -1327,7 +1328,7 @@ export default {
.then((response) => { .then((response) => {
this.jsonInfo = { this.jsonInfo = {
path: response.data.path, path: response.data.path,
json: JSON.stringify(response.data.json, null, 2), json: JSON.stringify(this.decodeEscapedJson(response.data.json), null, 2),
} }
this.jsonLoading = false this.jsonLoading = false
}) })
@ -1431,34 +1432,26 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep .el-button--primary { .sure {
background-color: #176363; display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 10px;
background: #176363;
border-radius: 4px; border-radius: 4px;
&:hover { min-width: 14px;
background-color: #176363; padding: 0 10px;
} height: 24px;
&:active { color: #ffffff;
background-color: #176363; font-weight: 400;
} font-size: 14px;
&:focus { margin-right: 10px;
background-color: #176363; cursor: pointer;
}
}
::v-deep .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
margin-bottom: 8px;
}
::v-deep .el-button--primary.is-disabled,
.el-button--primary.is-disabled:active,
.el-button--primary.is-disabled:focus,
.el-button--primary.is-disabled:hover {
background-color: #176363;
} }
#page { #page {
width: 100%; width: 340px;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
box-sizing: border-box; box-sizing: border-box;
@ -1473,15 +1466,12 @@ export default {
position: relative; position: relative;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
cursor: pointer;
margin-left: 32px; margin-left: 32px;
img { img {
margin-right: 10px; margin-right: 30px;
cursor: pointer;
} }
} }
.form-btn {
margin-left: 20px;
}
.btn { .btn {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -1504,14 +1494,14 @@ export default {
background-color: #d4e5db; background-color: #d4e5db;
.control-panel { .control-panel {
width: 340px; width: 340px;
padding: 5px 20px; padding: 20px 26px;
box-sizing: border-box; box-sizing: border-box;
background-size: cover; background-size: cover;
background: #d4e5db; background: #d4e5db;
.title { .title {
font-size: 16px;
margin-bottom: 5px;
color: #1c1c1c; color: #1c1c1c;
font-size: 16px;
margin-bottom: 10px;
} }
} }
@ -1523,7 +1513,8 @@ export default {
height: 24px; height: 24px;
font-size: 14px; font-size: 14px;
text-align: center; text-align: center;
padding: 3px 0; margin-left: 20px;
cursor: pointer;
} }
} }
@ -1548,9 +1539,9 @@ export default {
} }
.table-title { .table-title {
font-size: 16px; font-size: 16px;
font-weight: bold; color: #1c1c1c;
letter-spacing: 0.1em; letter-spacing: 0.1em;
margin-bottom: 10px; margin: 20px 0 10px 0;
span { span {
margin-right: 10px; margin-right: 10px;
} }

38
vue.config.js
View File

@ -21,25 +21,25 @@ module.exports = defineConfig({
}) })
/* 2. 追加 ES5 规则（只转 src，不转 node_modules） */ /* 2. 追加 ES5 规则（只转 src，不转 node_modules） */
config.module.rules.push({ // config.module.rules.push({
test: /\.js$/, // test: /\.js$/,
include: path.resolve(__dirname, 'src'), // include: path.resolve(__dirname, 'src'),
use: { // use: {
loader: 'babel-loader', // loader: 'babel-loader',
options: { // options: {
presets: [ // presets: [
[ // [
'@babel/preset-env', // '@babel/preset-env',
{ // {
targets: {ie: '11'}, // 强制 ES5 // targets: {ie: '11'}, // 强制 ES5
corejs: 3, // corejs: 3,
useBuiltIns: 'entry', // useBuiltIns: 'entry',
}, // },
], // ],
], // ],
}, // },
}, // },
}) // })
}, },
css: { css: {