Compare commits
8 Commits
278176a0fb
...
yqy
| Author | SHA1 | Date | |
|---|---|---|---|
| faae591f4c | |||
| da4b440b0e | |||
| d8bf6fd1b5 | |||
| ffe45a240d | |||
| 0ed458cb08 | |||
| a562e2cea8 | |||
| af252cd65e | |||
| 2f6de52604 |
1
.gitignore
vendored
1
.gitignore
vendored
@ -21,3 +21,4 @@ pnpm-debug.log*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
*.zip
|
||||
@ -1,16 +1,16 @@
|
||||
{
|
||||
"startPoint": "114.26344,27.800982",
|
||||
"endPoint": "114.284668,27.794961",
|
||||
"startPoint": "114.312888,27.796612",
|
||||
"endPoint": "114.336525,27.767989",
|
||||
"viaPoints": [
|
||||
{
|
||||
"time": "1694352000000",
|
||||
"points": "114.272329,27.797299"
|
||||
"points": "114.334239,27.779261"
|
||||
}
|
||||
],
|
||||
"avoidPoints": [
|
||||
{
|
||||
"time": "1694352003000",
|
||||
"points": "114.27882,27.792857"
|
||||
"points": ""
|
||||
}
|
||||
],
|
||||
"avoidAreas": [
|
||||
|
||||
@ -80,3 +80,20 @@ html {
|
||||
.flex-warp {
|
||||
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;
|
||||
}
|
||||
@ -6,11 +6,11 @@ import residentAnalysis from '@/views/residentAnalysis/index.vue'
|
||||
Vue.use(VueRouter)
|
||||
|
||||
const routes = [
|
||||
// {
|
||||
// path: '/',
|
||||
// name: 'home',
|
||||
// component: HomeView,
|
||||
// },
|
||||
{
|
||||
path: '/home',
|
||||
name: 'home',
|
||||
component: HomeView,
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
name: 'residentAnalysis',
|
||||
|
||||
@ -2,11 +2,21 @@
|
||||
<div>
|
||||
<div class="home-header">
|
||||
<div class="home-header-left">
|
||||
<el-tooltip content="起点绘制">
|
||||
<img @click="drawStartPoint" src="@/assets/image/start.png" />
|
||||
</el-tooltip>
|
||||
<el-tooltip content="终点绘制">
|
||||
<img @click="drawEndPoint" src="@/assets/image/end.png" />
|
||||
</el-tooltip>
|
||||
<el-tooltip content="途径点绘制">
|
||||
<img @click="drawViaPoint" src="@/assets/image/add.png" />
|
||||
</el-tooltip>
|
||||
<el-tooltip content="避让点绘制">
|
||||
<img @click="drawAvoidPoint" src="@/assets/image/avoidP.png" />
|
||||
</el-tooltip>
|
||||
<el-tooltip content="避让区域绘制">
|
||||
<img @click="drawAvoidArea" src="@/assets/image/updown.png" />
|
||||
</el-tooltip>
|
||||
<div @click="clear" class="sure">清除</div>
|
||||
<div @click="calculateShortestPath" class="sure">确定</div>
|
||||
<div @click="hadBuffer" class="sure">路线隐蔽规划</div>
|
||||
@ -36,14 +46,8 @@
|
||||
<div class="main-container">
|
||||
<div class="control-panel">
|
||||
<div class="title">参数</div>
|
||||
<el-form
|
||||
@submit.native.prevent="calculateShortestPath"
|
||||
label-width="120px"
|
||||
label-position="left"
|
||||
size="mini"
|
||||
:model="form"
|
||||
>
|
||||
<el-form-item label="起点">
|
||||
<el-form @submit.native.prevent="calculateShortestPath" label-position="left" size="mini" :model="form">
|
||||
<el-form-item label="起点:">
|
||||
<el-input
|
||||
v-model="form.startPoint"
|
||||
@blur="pointsChange('startPoint')"
|
||||
@ -51,7 +55,7 @@
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="终点">
|
||||
<el-form-item label="终点:">
|
||||
<el-input
|
||||
v-model="form.endPoint"
|
||||
@blur="pointsChange('endPoint')"
|
||||
@ -59,7 +63,7 @@
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="途经点">
|
||||
<el-form-item label="途经点:">
|
||||
<div v-for="(item, index) in form.viaPoints" :key="index">
|
||||
<el-input
|
||||
v-model="item.points"
|
||||
@ -70,7 +74,7 @@
|
||||
></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="避让点">
|
||||
<el-form-item label="避让点:">
|
||||
<div v-for="(item, index) in form.avoidPoints" :key="index">
|
||||
<el-input
|
||||
v-model="item.points"
|
||||
@ -81,7 +85,7 @@
|
||||
></el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="避让区域">
|
||||
<el-form-item label="避让区域:">
|
||||
<div v-for="(item, index) in form.avoidAreas" :key="index">
|
||||
<el-input
|
||||
v-model="item.points"
|
||||
@ -98,11 +102,11 @@
|
||||
</div>
|
||||
<div class="control-panel">
|
||||
<div class="title">隐蔽添加</div>
|
||||
<el-form label-width="120px" label-position="left" size="mini">
|
||||
<el-form-item label="缓冲半径(m)">
|
||||
<el-form label-position="left" size="mini">
|
||||
<el-form-item label="缓冲半径(m):">
|
||||
<el-input v-model="hideform.radius"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="面积冗余(%)">
|
||||
<el-form-item label="面积冗余(%):">
|
||||
<el-input v-model="hideform.redundancy" placeholder=""></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -115,14 +119,14 @@
|
||||
<span>参与路线规划</span>
|
||||
</div>
|
||||
</div>
|
||||
<el-form @submit.native.prevent="calculateShortestPath" label-width="120px" label-position="left" size="mini">
|
||||
<el-form-item label="宽度">
|
||||
<el-form @submit.native.prevent="calculateShortestPath" label-position="left" size="mini">
|
||||
<el-form-item label="宽度(m):">
|
||||
<el-input v-model="inputform.width"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="载重(吨)">
|
||||
<el-form-item label="载重(吨):">
|
||||
<el-input v-model="inputform.load" placeholder=""></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="最小转弯半径">
|
||||
<el-form-item label="最小转弯半径(m):">
|
||||
<el-input v-model="inputform.minTurnRadius" placeholder=""></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -426,6 +430,7 @@ export default {
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
;[...document.querySelectorAll('*')].forEach((n) => console.log(window.getComputedStyle(n).fontFamily))
|
||||
this.viewer = null
|
||||
await this.getMapOption()
|
||||
this.$nextTick(async () => {
|
||||
@ -466,6 +471,9 @@ export default {
|
||||
pitch: -35,
|
||||
},
|
||||
},
|
||||
defaultLabelStyle: {
|
||||
font: '16px "DengXian",sans-serif',
|
||||
},
|
||||
// basemaps: [
|
||||
// {
|
||||
// id: "image-tdss",
|
||||
@ -1264,8 +1272,14 @@ export default {
|
||||
graphic?.remove()
|
||||
this.viaPoints = this.viaPoints.filter((viaPoint) => viaPoint.style.time !== row.time)
|
||||
} else {
|
||||
if (this.viaPoints.length > 0) {
|
||||
const graphic = this.viaPoints.find((viaPoint) => viaPoint.style.time === row.time)
|
||||
this.updatePointPosition(graphic, row.points)
|
||||
} else {
|
||||
const time = new Date().getTime()
|
||||
row.time = time
|
||||
this.addPointToMap('viaPoints', row, time)
|
||||
}
|
||||
}
|
||||
} else if (type === 'avoidPoints') {
|
||||
if (!row.points) {
|
||||
@ -1279,8 +1293,14 @@ export default {
|
||||
graphic?.remove()
|
||||
this.avoidPoints = this.avoidPoints.filter((avoidPoint) => avoidPoint.style.time !== row.time)
|
||||
} else {
|
||||
if (this.avoidPoints.length > 0) {
|
||||
const graphic = this.avoidPoints.find((avoidPoint) => avoidPoint.style.time === row.time)
|
||||
this.updatePointPosition(graphic, row.points)
|
||||
} else {
|
||||
const time = new Date().getTime()
|
||||
row.time = time
|
||||
this.addPointToMap('avoidPoints', row, time)
|
||||
}
|
||||
}
|
||||
} else if (type === 'avoidAreas') {
|
||||
if (!row.points) {
|
||||
@ -1294,8 +1314,14 @@ export default {
|
||||
graphic?.remove()
|
||||
this.avoidAreas = this.avoidAreas.filter((avoidArea) => avoidArea.style.time !== row.time)
|
||||
} else {
|
||||
if (this.avoidAreas.length > 0) {
|
||||
const graphic = this.avoidAreas.find((avoidArea) => avoidArea.style.time === row.time)
|
||||
this.updatePolygonPosition(graphic, row.points)
|
||||
} else {
|
||||
const time = new Date().getTime()
|
||||
row.time = time
|
||||
this.addPolygonToMap('avoidAreas', row, time)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -2,26 +2,30 @@
|
||||
<div id="page">
|
||||
<div class="header">
|
||||
<div class="images flex a-c" v-for="item in imagesList" :key="item.id">
|
||||
<el-tooltip effect="dark" content="绘制矩形区域">
|
||||
<img :src="item.src" @click="drawRectangle" />
|
||||
<el-button class="form-btn" type="primary" size="mini" @click="analyzeAverageSlope">确定</el-button>
|
||||
<el-button class="form-btn right" type="primary" size="mini" :disabled="showExport" @click="clickExport">
|
||||
</el-tooltip>
|
||||
<div class="sure" @click="analyzeAverageSlope">确定</div>
|
||||
<div class="right flex a-c">
|
||||
<div class="sure" :style="!showExport ? {cursor: 'pointer'} : {cursor: 'not-allowed'}" @click="clickExport">
|
||||
导出
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="sure" @click="handleExportJosn">json编辑</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content flex j-s a-c">
|
||||
<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="title">范围</div>
|
||||
<el-form-item label="左上角:">
|
||||
<el-input v-model="form.leftTop" @blur="updateArea" placeholder="请输入经纬度,以 ',' 隔开'"></el-input>
|
||||
<el-input v-model="form.leftTop" @blur="updateArea" placeholder="经纬度,以 ',' 隔开'"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="右下角:">
|
||||
<el-input v-model="form.rightBottom" @blur="updateArea" placeholder="请输入经纬度,以 ',' 隔开'">
|
||||
</el-input>
|
||||
<el-input v-model="form.rightBottom" @blur="updateArea" placeholder="经纬度,以 ',' 隔开'"> </el-input>
|
||||
</el-form-item>
|
||||
<input type="file" ref="fileInput" @change="handleFileUpload" style="display: none" />
|
||||
<div class="importJson flex j-c a-c" @click="triggerFileUpload">导入json文件</div>
|
||||
@ -46,17 +50,17 @@
|
||||
|
||||
<!-- 条件 -->
|
||||
<div class="control-panel">
|
||||
<div class="title">条件</div>
|
||||
<el-form-item label="长:">
|
||||
<div class="title">网格条件</div>
|
||||
<el-form-item label="列(个):">
|
||||
<el-input v-model="form.xLength"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="宽:">
|
||||
<el-form-item label="行(个):">
|
||||
<el-input v-model="form.yLength"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="最大坡度:">
|
||||
<el-form-item label="最大坡度(°):">
|
||||
<el-input v-model="form.maxSlope"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="居民地最小距离:">
|
||||
<el-form-item label="居民地距离(米):">
|
||||
<el-input v-model="form.minPeopleDis"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@ -64,7 +68,14 @@
|
||||
</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="数据加载中">
|
||||
<!-- 路点 -->
|
||||
@ -145,8 +156,8 @@
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="100">
|
||||
<template v-slot="{row}">
|
||||
<el-button v-if="!row.editing" type="text" size="mini" @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-if="!row.editing" @click="handleEdit(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>
|
||||
</template>
|
||||
</vxe-column>
|
||||
@ -188,8 +199,8 @@
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="100">
|
||||
<template v-slot="{row}">
|
||||
<el-button v-if="!row.editing" type="text" size="mini" @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-if="!row.editing" @click="handleEdit(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>
|
||||
</template>
|
||||
</vxe-column>
|
||||
@ -233,8 +244,8 @@
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="100">
|
||||
<template v-slot="{row}">
|
||||
<el-button v-if="!row.editing" type="text" size="mini" @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-if="!row.editing" @click="handleEdit(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>
|
||||
</template>
|
||||
</vxe-column>
|
||||
@ -276,8 +287,8 @@
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="100">
|
||||
<template v-slot="{row}">
|
||||
<el-button v-if="!row.editing" type="text" size="mini" @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-if="!row.editing" @click="handleEdit(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>
|
||||
</template>
|
||||
</vxe-column>
|
||||
@ -289,7 +300,21 @@
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<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>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 右侧json编辑 -->
|
||||
<el-dialog :visible.sync="dialogJsonVisible" title="json编辑" width="600px">
|
||||
<div v-loading="jsonLoading">
|
||||
<div style="margin-bottom: 10px">
|
||||
<el-button type="primary" size="mini" @click="handleJson">选择</el-button>
|
||||
</div>
|
||||
<el-input type="textarea" resize="none" :rows="18" v-model="jsonInfo.json" size="mini"></el-input>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button size="mini" @click="closeJson">取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="confirmJson">保存</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@ -300,7 +325,6 @@
|
||||
import {getStorage} from '@/utils/localStorage'
|
||||
import plantJson from '/public/config/plant.json'
|
||||
import soilJson from '/public/config/soil.json'
|
||||
import FileSaver from 'file-saver'
|
||||
import axios from 'axios'
|
||||
import iniParser from 'ini-parser'
|
||||
|
||||
@ -361,6 +385,13 @@ export default {
|
||||
|
||||
tableHeight: 280,
|
||||
showExport: true,
|
||||
|
||||
dialogJsonVisible: false,
|
||||
jsonInfo: {
|
||||
json: '',
|
||||
path: '',
|
||||
},
|
||||
jsonLoading: false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -478,7 +509,7 @@ export default {
|
||||
window.viewer.addLayer(window.shortestPathLayer)
|
||||
// 添加地图点击事件监听,用于结束绘制
|
||||
window.viewer.on(mars3d.EventType.dblClick, (event) => {
|
||||
// 如果正在绘制,点击地图可以结束绘制(除了绘制点)
|
||||
// 如果正在绘制,点击地图可以结束绘制(除了绘制点)
|
||||
window.graphicLayer.stopDraw()
|
||||
this.form.leftTop = ''
|
||||
this.form.rightBottom = ''
|
||||
@ -613,7 +644,7 @@ export default {
|
||||
})
|
||||
},
|
||||
|
||||
// 算矩形到 geoJSONLayer 的最小距离(米),判断是否在其内部
|
||||
// 算矩形到 geoJSONLayer 的最小距离(米),判断是否在其内部
|
||||
calcMinDistance(rectPositions, geoJSONLayer) {
|
||||
if (!geoJSONLayer || !rectPositions?.length) return Infinity
|
||||
|
||||
@ -652,27 +683,21 @@ export default {
|
||||
})
|
||||
})
|
||||
|
||||
console.log('矩形 → polygonP 边界最短距离(米)', inside, minDist)
|
||||
console.log('矩形 → polygonP 边界最短距离(米)', inside, minDist)
|
||||
|
||||
// 5. 面内直接返回 -1
|
||||
return inside ? -1 : minDist
|
||||
},
|
||||
|
||||
// 判断矩形与 mars3d GeoJSON 图层是否相交(不转 GeoJSON)
|
||||
// 判断矩形与 mars3d GeoJSON 图层是否相交(不转 GeoJSON)
|
||||
getIntersectId(position, layer) {
|
||||
console.log('position===>', position, layer)
|
||||
if (!position || !layer || !layer.graphics) return null
|
||||
|
||||
const rectCoords = position.concat([position[0]]) // 闭合
|
||||
|
||||
console.log('rectCoords===>', rectCoords)
|
||||
|
||||
const rectPoly = turf.polygon([rectCoords])
|
||||
console.log('rectPoly===>', rectPoly)
|
||||
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)
|
||||
|
||||
if (!fc) {
|
||||
@ -788,7 +813,7 @@ export default {
|
||||
},
|
||||
label: {
|
||||
text: '分析区域',
|
||||
font: '16px sans-serif',
|
||||
font: '16px 等线',
|
||||
color: '#ffffff',
|
||||
outline: true,
|
||||
outlineColor: '#000000',
|
||||
@ -823,7 +848,7 @@ export default {
|
||||
// 更新多边形位置
|
||||
this.polygon.positions = cartesianPositions
|
||||
|
||||
// 触发更新(根据mars3d的具体API可能需要调用其他方法)
|
||||
// 触发更新(根据mars3d的具体API可能需要调用其他方法)
|
||||
if (this.polygon.update) {
|
||||
this.polygon.update()
|
||||
}
|
||||
@ -965,7 +990,7 @@ export default {
|
||||
drawLabelAndRec() {
|
||||
this.analyzing = false
|
||||
|
||||
/* 1. 计算总分(保持原逻辑) */
|
||||
/* 1. 计算总分(保持原逻辑) */
|
||||
const list = this.calcTotalScore(this.validBlocks)
|
||||
const len = list.length
|
||||
if (!len) {
|
||||
@ -1028,7 +1053,7 @@ export default {
|
||||
style: {
|
||||
text: String(b.totalScore),
|
||||
font_size: 24,
|
||||
font_family: '楷体',
|
||||
font_family: '等线',
|
||||
color: '#000000',
|
||||
outline: false,
|
||||
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
||||
@ -1231,6 +1256,8 @@ export default {
|
||||
|
||||
// 点击导出按钮
|
||||
clickExport() {
|
||||
if (this.showExport) return
|
||||
|
||||
this.rectangles.forEach((rectGraphic) => {
|
||||
this.selectRectangle(rectGraphic)
|
||||
})
|
||||
@ -1257,7 +1284,6 @@ export default {
|
||||
}
|
||||
)
|
||||
.then((res) => {
|
||||
this.$message.success(res)
|
||||
this.$message.success('导出成功!')
|
||||
})
|
||||
.catch((error) => {
|
||||
@ -1269,6 +1295,78 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
// json编辑
|
||||
handleExportJosn() {
|
||||
this.dialogJsonVisible = true
|
||||
},
|
||||
|
||||
decodeEscapedJson(str) {
|
||||
// 去掉字符串首尾的空白字符
|
||||
str = str.trim()
|
||||
// 直接解析 JSON 字符串
|
||||
try {
|
||||
return JSON.parse(str)
|
||||
} catch (e) {
|
||||
console.error('Error parsing JSON:', e)
|
||||
return null
|
||||
}
|
||||
},
|
||||
|
||||
handleJson() {
|
||||
this.jsonLoading = true
|
||||
fetch('./config.ini')
|
||||
.then((response) => response.text())
|
||||
.then((text) => {
|
||||
const parsedData = iniParser.parse(text)
|
||||
axios
|
||||
.post(`http://${parsedData.http.address}:${parsedData.http.port}/api/json/select`, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
timeout: 10 * 60 * 1000,
|
||||
})
|
||||
.then((response) => {
|
||||
this.jsonInfo = {
|
||||
path: response.data.path,
|
||||
json: JSON.stringify(this.decodeEscapedJson(response.data.json), null, 2),
|
||||
}
|
||||
this.jsonLoading = false
|
||||
})
|
||||
.catch((error) => {
|
||||
this.jsonLoading = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
confirmJson() {
|
||||
fetch('./config.ini')
|
||||
.then((response) => response.text())
|
||||
.then((text) => {
|
||||
const parsedData = iniParser.parse(text)
|
||||
axios
|
||||
.post(
|
||||
`http://${parsedData.http.address}:${parsedData.http.port}/api/json/save?path=${this.jsonInfo.path}`,
|
||||
JSON.stringify(JSON.parse(this.jsonInfo.json)),
|
||||
{
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
}
|
||||
)
|
||||
.then((response) => {
|
||||
this.$message.success('保存成功')
|
||||
this.closeJson()
|
||||
})
|
||||
.catch((error) => {})
|
||||
})
|
||||
},
|
||||
|
||||
closeJson() {
|
||||
this.jsonInfo.path = ''
|
||||
this.jsonInfo.json = ''
|
||||
this.dialogJsonVisible = false
|
||||
},
|
||||
|
||||
// 新增
|
||||
handleAdd(type) {
|
||||
let tabIndex = this.tabList.findIndex((item) => item.id === this.activeName)
|
||||
@ -1334,31 +1432,26 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .el-button--primary {
|
||||
background-color: #176363;
|
||||
.sure {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
background: #176363;
|
||||
border-radius: 4px;
|
||||
&:hover {
|
||||
background-color: #176363;
|
||||
}
|
||||
&:active {
|
||||
background-color: #176363;
|
||||
}
|
||||
}
|
||||
|
||||
::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;
|
||||
min-width: 14px;
|
||||
padding: 0 10px;
|
||||
height: 24px;
|
||||
color: #ffffff;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#page {
|
||||
width: 100%;
|
||||
width: 340px;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
@ -1373,11 +1466,11 @@ export default {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
margin-left: 32px;
|
||||
img {
|
||||
margin-right: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.form-btn {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.btn {
|
||||
position: absolute;
|
||||
@ -1401,14 +1494,14 @@ export default {
|
||||
background-color: #d4e5db;
|
||||
.control-panel {
|
||||
width: 340px;
|
||||
padding: 5px 20px;
|
||||
padding: 20px 26px;
|
||||
box-sizing: border-box;
|
||||
background-size: cover;
|
||||
background: #d4e5db;
|
||||
.title {
|
||||
font-size: 16px;
|
||||
margin-bottom: 5px;
|
||||
color: #1c1c1c;
|
||||
font-size: 16px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1420,7 +1513,8 @@ export default {
|
||||
height: 24px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
padding: 3px 0;
|
||||
margin-left: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1445,10 +1539,9 @@ export default {
|
||||
}
|
||||
.table-title {
|
||||
font-size: 16px;
|
||||
font-family: 'Pingfang';
|
||||
font-weight: bold;
|
||||
color: #1c1c1c;
|
||||
letter-spacing: 0.1em;
|
||||
margin-bottom: 10px;
|
||||
margin: 20px 0 10px 0;
|
||||
span {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
@ -21,25 +21,25 @@ module.exports = defineConfig({
|
||||
})
|
||||
|
||||
/* 2. 追加 ES5 规则(只转 src,不转 node_modules) */
|
||||
config.module.rules.push({
|
||||
test: /\.js$/,
|
||||
include: path.resolve(__dirname, 'src'),
|
||||
use: {
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
presets: [
|
||||
[
|
||||
'@babel/preset-env',
|
||||
{
|
||||
targets: {ie: '11'}, // 强制 ES5
|
||||
corejs: 3,
|
||||
useBuiltIns: 'entry',
|
||||
},
|
||||
],
|
||||
],
|
||||
},
|
||||
},
|
||||
})
|
||||
// config.module.rules.push({
|
||||
// test: /\.js$/,
|
||||
// include: path.resolve(__dirname, 'src'),
|
||||
// use: {
|
||||
// loader: 'babel-loader',
|
||||
// options: {
|
||||
// presets: [
|
||||
// [
|
||||
// '@babel/preset-env',
|
||||
// {
|
||||
// targets: {ie: '11'}, // 强制 ES5
|
||||
// corejs: 3,
|
||||
// useBuiltIns: 'entry',
|
||||
// },
|
||||
// ],
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
// })
|
||||
},
|
||||
|
||||
css: {
|
||||
|
||||
Reference in New Issue
Block a user