fix:病害管理差修改删除
This commit is contained in:
parent
7536b188ae
commit
10cc75f6b3
@ -1,62 +1,102 @@
|
||||
/*
|
||||
* @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
|
||||
* @Date: 2024-10-08 09:26:24
|
||||
* @LastEditors: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
|
||||
* @LastEditTime: 2024-10-08 18:06:36
|
||||
* @LastEditors: SunTao 328867980@qq.com
|
||||
* @LastEditTime: 2024-10-10 17:09:19
|
||||
* @FilePath: \znxjxt-ui\src\api\xj\disease.js
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
* @Description: 巡检信息-病害管理
|
||||
*/
|
||||
import request from '@/utils/request'
|
||||
import request from "@/utils/request";
|
||||
|
||||
// 查询病害日志列表
|
||||
export function listDefect(query) {
|
||||
return request({
|
||||
url: '/xj/defect/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
url: "/xj/defect/list",
|
||||
method: "get",
|
||||
params: query,
|
||||
});
|
||||
}
|
||||
|
||||
// 查询病害日志详细
|
||||
export function getDefect(id) {
|
||||
return request({
|
||||
url: '/xj/defect/' + id,
|
||||
method: 'get'
|
||||
})
|
||||
url: "/xj/defect/" + id,
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
|
||||
// 新增病害日志
|
||||
export function addDefect(data) {
|
||||
return request({
|
||||
url: '/xj/defect',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
url: "/xj/defect",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
|
||||
// 修改病害日志
|
||||
export function updateDefect(data) {
|
||||
return request({
|
||||
url: '/xj/defect',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
url: "/xj/defect",
|
||||
method: "put",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
|
||||
// 删除病害日志
|
||||
export function delDefect(id) {
|
||||
return request({
|
||||
url: '/xj/defect/' + id,
|
||||
method: 'delete'
|
||||
})
|
||||
url: "/xj/defect/" + id,
|
||||
method: "delete",
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// 病害类型下拉数据
|
||||
export function getDefectTypes() {
|
||||
return request({
|
||||
url: '/metadata/defectTypes',
|
||||
method: 'get'
|
||||
})
|
||||
url: "/metadata/defectTypes",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
|
||||
// 路段下拉数据
|
||||
export function getSegment() {
|
||||
return request({
|
||||
url: "/api/v2/segment/selectList",
|
||||
method: "post",
|
||||
});
|
||||
}
|
||||
|
||||
// 查询列表病害类型
|
||||
export function getDefectList(params) {
|
||||
return request({
|
||||
url: "/metadata/defectType",
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
// 校验状态下拉类型
|
||||
export function getStatesList() {
|
||||
return request({
|
||||
url: "/metadata/defectDataStatus",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
|
||||
// 病害状态下拉类型
|
||||
export function getDefectStatus() {
|
||||
return request({
|
||||
url: "/metadata/defectState",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
|
||||
// 批量修改病害状态
|
||||
export function changeDefectStatus(data) {
|
||||
return request({
|
||||
url: "/xj/defect/batch",
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
26
src/api/xj/parameter.js
Normal file
26
src/api/xj/parameter.js
Normal file
@ -0,0 +1,26 @@
|
||||
/*
|
||||
* @Author: SunTao 328867980@qq.com
|
||||
* @Date: 2024-10-09 15:28:34
|
||||
* @LastEditors: SunTao 328867980@qq.com
|
||||
* @LastEditTime: 2024-10-09 15:46:37
|
||||
* @FilePath: \znxjxt-ui\src\api\xj\parameter.js
|
||||
* @Description: 系统工具-系统参数
|
||||
*/
|
||||
import request from "@/utils/request";
|
||||
|
||||
// 获取地图详情
|
||||
export function getMapInfo() {
|
||||
return request({
|
||||
url: "/basMapInfo/getMapInfo",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
|
||||
// 更新地图坐标信息
|
||||
export function updateMapInfo(data) {
|
||||
return request({
|
||||
url: "/basMapInfo/update",
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
319
src/views/xj/parameter/index.vue
Normal file
319
src/views/xj/parameter/index.vue
Normal file
@ -0,0 +1,319 @@
|
||||
<!--
|
||||
* @Author: SunTao 328867980@qq.com
|
||||
* @Date: 2024-10-09 13:11:56
|
||||
* @LastEditors: SunTao 328867980@qq.com
|
||||
* @LastEditTime: 2024-10-11 15:01:25
|
||||
* @FilePath: \znxjxt-ui\src\views\xj\parameter\index.vue
|
||||
* @Description: 系统工具-系统参数
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="parameter-content">
|
||||
<div class="parameter-form">
|
||||
<!-- 搜索表单 -->
|
||||
<el-form
|
||||
:model="parameterForm"
|
||||
ref="parameterForm"
|
||||
size="small"
|
||||
:inline="true"
|
||||
:rules="rules"
|
||||
label-width="7rem"
|
||||
>
|
||||
<el-form-item label="地图层级" prop="zoom">
|
||||
<el-input
|
||||
disabled
|
||||
v-model.number="parameterForm.zoom"
|
||||
placeholder="请输入地图层级"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="lon">
|
||||
<el-input
|
||||
disabled
|
||||
v-model.number="parameterForm.lon"
|
||||
placeholder="请输入坐标经度"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="lat">
|
||||
<el-input
|
||||
disabled
|
||||
v-model.number="parameterForm.lat"
|
||||
placeholder="请输入坐标纬度"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
size="mini"
|
||||
@click="handleQuery"
|
||||
>保存</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div id="map"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Map, View, Feature } from "ol";
|
||||
import XYZ from "ol/source/XYZ";
|
||||
import { Tile as TileLayer } from "ol/layer";
|
||||
import { defaults as defaultControls } from "ol/control";
|
||||
import { Vector as VectorSource } from "ol/source";
|
||||
import logo from "@/assets/xc.png";
|
||||
import { Point } from "ol/geom";
|
||||
import { Style, Icon } from "ol/style";
|
||||
import VectorLayer from "ol/layer/Vector";
|
||||
import { getMapInfo ,updateMapInfo} from "@/api/xj/parameter";
|
||||
|
||||
export default {
|
||||
name: "Parameter",
|
||||
data() {
|
||||
return {
|
||||
// 搜索表单
|
||||
parameterForm: {
|
||||
// 地图层级
|
||||
zoom: "",
|
||||
// 经度
|
||||
lon: "",
|
||||
// 纬度
|
||||
lat: "",
|
||||
},
|
||||
// 表单验证规则
|
||||
rules: {
|
||||
zoom: [
|
||||
{
|
||||
required: true,
|
||||
message: "地图层级不能为空",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
lon: [
|
||||
{
|
||||
required: true,
|
||||
message: "经度不能为空",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
lat: [
|
||||
{
|
||||
required: true,
|
||||
message: "纬度不能为空",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
},
|
||||
// 地图实例
|
||||
map: null,
|
||||
// 地图中心点
|
||||
centePoint: [123.30297096718999, 41.87942945541742],
|
||||
// 坐标数组
|
||||
coordinateList: [123.30297096718999, 41.87942945541742],
|
||||
};
|
||||
},
|
||||
/* 生命周期函数-created */
|
||||
created() {
|
||||
this.getMapPoint();
|
||||
},
|
||||
methods: {
|
||||
/* 获取地图点位详情信息 */
|
||||
getMapPoint() {
|
||||
getMapInfo().then((res) => {
|
||||
// 如果有返回
|
||||
this.parameterForm = {
|
||||
zoom: "11",
|
||||
// 经度
|
||||
lon: 41.87942945541742,
|
||||
// 纬度
|
||||
lat: 123.30297096718999,
|
||||
};
|
||||
this.centePoint = [123.30297096718999, 41.87942945541742];
|
||||
this.coordinateList = [];
|
||||
this.initMap();
|
||||
// 如果没有就用默认
|
||||
this.drawPoint([123.30297096718999, 41.87942945541742]);
|
||||
});
|
||||
},
|
||||
/* 地图打点 */
|
||||
drawPoint(value) {
|
||||
const features = [];
|
||||
const point = new Point(value); // 修改坐标格式
|
||||
const feature = new Feature({
|
||||
geometry: point,
|
||||
custom: { data: "123", type: "icon" }, // 可以放一些自己的数据
|
||||
type: "icon", // 自己设置一个标识
|
||||
});
|
||||
feature.setStyle([
|
||||
new Style({
|
||||
image: new Icon({
|
||||
crossOrigin: "anonymous",
|
||||
src: logo,
|
||||
// size: [40, 40],
|
||||
scale: 0.2, // 图标缩放比例
|
||||
}),
|
||||
}),
|
||||
]);
|
||||
features.push(feature);
|
||||
//设置地图的数据源
|
||||
const pointSource = new VectorSource({
|
||||
features,
|
||||
});
|
||||
let markLayerPoints = new VectorLayer({
|
||||
source: pointSource,
|
||||
properties: {
|
||||
type: "point",
|
||||
},
|
||||
});
|
||||
this.map.addLayer(markLayerPoints);
|
||||
},
|
||||
/* 点击保存事件 */
|
||||
handleQuery() {
|
||||
this.$refs["parameterForm"].validate((valid) => {
|
||||
if (valid) {
|
||||
updateMapInfo(this.parameterForm).then((res) => {});
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化地图 */
|
||||
initMap() {
|
||||
const map = new Map({
|
||||
target: "map",
|
||||
controls: defaultControls({
|
||||
zoom: true,
|
||||
attribution: false,
|
||||
rotate: false,
|
||||
}),
|
||||
view: new View({
|
||||
center: [this.parameterForm.lat, this.parameterForm.lon], //中心点经纬度
|
||||
zoom: this.parameterForm.zoom, //图层缩放大小
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
layers: [
|
||||
new TileLayer({
|
||||
source: new XYZ({
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=vec_c&tk=c691040443c68cda625755c5c3e2acc3",
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
}),
|
||||
new TileLayer({
|
||||
source: new XYZ({
|
||||
url: "http://t{0-7}.tianditu.com/DataServer?x={x}&y={y}&l={z}&T=cva_c&tk=c691040443c68cda625755c5c3e2acc3",
|
||||
projection: "EPSG:4326",
|
||||
}),
|
||||
}),
|
||||
],
|
||||
});
|
||||
this.map = map;
|
||||
map.on("click", (e) => {
|
||||
this.mapClick(e);
|
||||
});
|
||||
// map.on("click", (e) => {
|
||||
// 清除point层
|
||||
// const pointSource = map
|
||||
// .getAllLayers()
|
||||
// .filter((item) => item.get("type") === "point");
|
||||
// pointSource[0].getSource().clear();
|
||||
// // 打点新图层
|
||||
// const { coordinate } = e;
|
||||
// this.drawPoint(coordinate)
|
||||
// const featureClick = map.forEachFeatureAtPixel(
|
||||
// map.getEventPixel(e.originalEvent),
|
||||
// (feature) => {
|
||||
// return feature;
|
||||
// }
|
||||
// );
|
||||
// if (featureClick) {
|
||||
// this.$emit("feature-click", featureClick);
|
||||
// this.$emit("map-click", e, "feature-click");
|
||||
// } else {
|
||||
// this.$emit("map-click", e, "map-click");
|
||||
// if (this.clearOverlayer) {
|
||||
// this.clearOverlay();
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
/* 地图点击事件 */
|
||||
// map.on("click", (evt) => {
|
||||
// // 获取点击的经纬度
|
||||
// const { coordinate } = evt;
|
||||
// const features = [];
|
||||
// const point = new Point(coordinate); // 修改坐标格式
|
||||
// const feature = new Feature({
|
||||
// geometry: point,
|
||||
// custom: { data: "123", type: "icon" }, // 可以放一些自己的数据
|
||||
// type: "icon", // 自己设置一个标识
|
||||
// });
|
||||
// feature.setStyle([
|
||||
// new Style({
|
||||
// image: new Icon({
|
||||
// crossOrigin: "anonymous",
|
||||
// src: logo,
|
||||
// // size: [40, 40],
|
||||
// scale: 0.2, // 图标缩放比例
|
||||
// }),
|
||||
// }),
|
||||
// ]);
|
||||
// features.push(feature);
|
||||
// //设置地图的数据源
|
||||
// const source = new VectorSource({
|
||||
// features,
|
||||
// });
|
||||
// let markLayerPoints = new VectorLayer({
|
||||
// source: source,
|
||||
// properties: { name: "point" },
|
||||
// });
|
||||
// this.map.addLayer(markLayerPoints);
|
||||
// });
|
||||
},
|
||||
/* 地图点击事件 */
|
||||
mapClick(e) {
|
||||
// 过滤图层返回数组
|
||||
const [pointSource] = this.map
|
||||
.getAllLayers()
|
||||
.filter((item) => item.get("type") === "point");
|
||||
// 获取点击的点位
|
||||
const { coordinate } = e;
|
||||
// 获取当前图层的source
|
||||
const source = pointSource.getSource();
|
||||
// 获取图层的features 数组
|
||||
const [features] = source.getFeatures();
|
||||
// 修改geometry 定位
|
||||
features.set("geometry", new Point(coordinate));
|
||||
// 获取当前点击的图层zoom
|
||||
const zoom = this.map.getView().getZoom();
|
||||
this.parameterForm = {
|
||||
zoom: zoom.toFixed(0),
|
||||
lon: coordinate[1],
|
||||
lat: coordinate[0],
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.parameter-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 1rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
.parameter-form {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
}
|
||||
|
||||
#map {
|
||||
width: 100%;
|
||||
height: 45rem;
|
||||
}
|
||||
}
|
||||
|
||||
// ::v-deep .ol-layer:nth-child(1) {
|
||||
// filter: invert(100%) hue-rotate(180deg);
|
||||
// }
|
||||
</style>
|
||||
@ -35,7 +35,7 @@ module.exports = {
|
||||
proxy: {
|
||||
// detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
[process.env.VUE_APP_BASE_API]: {
|
||||
// target: `http://192.168.1.188:8080`
|
||||
// target: `http://192.168.1.188:8080`,
|
||||
target: `http://localhost:8080`,
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user