feat: 部分功能新增

src/api/modules/mapCommon.ts

@@ -22,6 +22,10 @@ export const updateSystemConfig = (params: any) => {
 export const baseMapPage = (params: any) => {
 	return http.post(BASEURL + `/base/baseMap/page`, params);
 };
+// 底图图层列表
+export const baseMapList = (params: any) => {
+	return http.post(BASEURL + `/base/baseMap/list`, params);
+};
 // 底图图层新增
 export const baseMapAdd = (params: any) => {
 	return http.post(BASEURL + `/base/baseMap/add`, params);
@@ -38,3 +42,28 @@ export const baseMapEdit = (params: any) => {
 export const baseMapDelete = (params: any) => {
 	return http.post(BASEURL + `/base/baseMap/delete`, params);
 };
+
+// 白膜图层分页列表
+export const albugineaMapPage = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/page`, params);
+};
+// 白膜图层列表
+export const albugineaMapList = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/list`, params);
+};
+// 白膜图层新增
+export const albugineaMapAdd = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/add`, params);
+};
+// 白膜图层详细信息
+export const albugineaMapDetails = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/queryById`, params);
+};
+// 白膜图层编辑
+export const albugineaMapEdit = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/edit`, params);
+};
+// 白膜图层删除
+export const albugineaMapDelete = (params: any) => {
+	return http.post(BASEURL + `/base/tilesetLayer/delete`, params);
+};

src/components/testMap/index.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="map-content" id="map-content">
 		<div id="mars3dContainer" class="mars3d-container"></div>
-		<div class="layer-config">
+		<div class="layer-config" v-if="props.type == '底图'">
 			<div class="property-column-item">
 				<span>饱和度：{{ formData.saturation ? formData.saturation : 0 }}</span>
 				<el-slider v-model="formData.saturation" :step="0.5" :max="5" :min="-5" @change="e => layerOperate(e, 'saturation')" />
@@ -31,7 +31,32 @@
 				<el-color-picker v-model="formData.filterColor" @change="e => layerOperate(e, 'filterColor')" />
 			</div>
 			<div class="operate-btn">
-				<el-button>保存当前配置</el-button>
+				<el-button @click="editBaseMapsConfig">保存当前配置</el-button>
+			</div>
+		</div>
+		<div class="layer-config" v-if="props.type == '白膜'">
+			<div class="property-column-item">
+				<span>偏移量lon经度：{{ formData.lng ? formData.lng : 0 }}</span>
+				<el-slider v-model="formData.lng" :step="0.0001" :max="0.01" :min="-0.01" @change="e => albugineaOperate(e, 'lng')" />
+			</div>
+			<div class="property-column-item">
+				<span>偏移量lat纬度：{{ formData.lat ? formData.lat : 0 }}</span>
+				<el-slider v-model="formData.lat" :step="0.0001" :max="0.01" :min="-0.01" @change="e => albugineaOperate(e, 'lat')" />
+			</div>
+			<div class="property-column-item">
+				<span>偏移量height高度(米)：{{ formData.alt ? formData.alt : 0 }}</span>
+				<el-slider v-model="formData.alt" :step="10" :max="500" :min="-500" @change="e => albugineaOperate(e, 'alt')" />
+			</div>
+			<!-- <div class="property-row-item">
+				<span>是否反色：</span>
+				<el-switch v-model="formData.invertColor" @change="e => layerOperate(e, 'invertColor')" />
+			</div> -->
+			<div class="property-row-item">
+				<span>白膜颜色：{{ formData.color ? formData.color : "" }}</span>
+				<el-color-picker v-model="formData.color" @change="e => albugineaOperate(e, 'color')" />
+			</div>
+			<div class="operate-btn">
+				<el-button @click="editAlbugineaConfig">保存当前配置</el-button>
 			</div>
 		</div>
 		<div class="close-btn" @click="$emit('confirm')">
@@ -48,10 +73,12 @@ import * as Cesium from "mars3d-cesium";
 //导入mars3d主库
 import "mars3d/dist/mars3d.css";
 import * as mars3d from "mars3d";
-import { baseMapDetails } from "@/api/modules/mapCommon";
+import { baseMapDetails, baseMapEdit, albugineaMapDetails, albugineaMapEdit } from "@/api/modules/mapCommon";
+import { ElMessage } from "element-plus";
 const props = defineProps({
 	testMapVisible: Boolean,
-	relativeId: String
+	relativeId: String,
+	type: String
 });
 const emits = defineEmits(["confirm"]);
 const formData: any = ref({});
@@ -80,21 +107,124 @@ const configJson = ref<any>({
 let map: any;
 let graphicLayer: any;
 let thisLayer: any; // 选中的图层
+let thisAlbuginea: any; // 选中的白膜
+// 修改白膜当前配置
+const editAlbugineaConfig = async () => {
+	let requestData = {
+		id: props.relativeId,
+		...formData.value
+	};
+	const res: any = await albugineaMapEdit(requestData);
+	if (res.code == 200) {
+		ElMessage.success("操作成功");
+	}
+};
+// 修改底图当前配置
+const editBaseMapsConfig = async () => {
+	let requestData = {
+		id: props.relativeId,
+		...formData.value
+	};
+	const res: any = await baseMapEdit(requestData);
+	if (res.code == 200) {
+		ElMessage.success("操作成功");
+	}
+};
+let initCenter: any; // 初始中心经纬度
+let requestNum: number = 0; // 请求中心点次数
+// 白膜图层操作
+const albugineaOperate = (e: any, label: any) => {
+	console.log(formData.value);
+	thisAlbuginea = map.getLayerById(formData.value.id);
+	if (requestNum == 0) {
+		initCenter = {
+			lng: thisAlbuginea.orginCenterPoint.lng,
+			lat: thisAlbuginea.orginCenterPoint.lat,
+			alt: thisAlbuginea.orginCenterPoint.alt
+		};
+		++requestNum;
+	}
+	console.log(thisAlbuginea);
+	if (label == "color") {
+		console.log(e, label);
+		if (e) {
+			thisAlbuginea.style = {
+				color: {
+					conditions: [["true", "color('" + e + "')"]]
+				}
+			};
+		} else {
+			thisAlbuginea.style = {
+				color: {
+					conditions: [["true", "color('#fff')"]]
+				}
+			};
+		}
+	} else {
+		thisAlbuginea.position = {
+			lng: initCenter.lng + formData.value.lng,
+			lat: initCenter.lat + formData.value.lat,
+			alt: initCenter.alt + formData.value.alt
+		};
+		console.log(thisAlbuginea);
+	}
+};
 // 底图图层操作
 const layerOperate = (e: any, label: any) => {
 	thisLayer = map.getLayerById(formData.value.id);
 	console.log(thisLayer);
 	if (label == "filterColor") {
 		console.log(e, label);
-		thisLayer.layer[label] = Cesium.Color.fromCssColorString(e);
+		if (e) {
+			thisLayer.layer[label] = Cesium.Color.fromCssColorString(e);
+			// thisLayer.layer[label] = e;
+		} else {
+			thisLayer.layer[label] = Cesium.Color.fromCssColorString("#FBFBFB");
+			// thisLayer.layer[label] = "#FBFBFB";
+		}
 	} else if (label == "invertColor") {
 		thisLayer.layer[label] = e;
 	} else {
 		thisLayer[label] = e;
 	}
 };
-// 获取数据详情
+// 获取白膜数据详情
-const getInfo = async () => {
+const getAlbugineaInfo = async () => {
+	let requestData = {
+		id: props.relativeId
+	};
+	const { result }: { result: any } = await albugineaMapDetails(requestData);
+	console.log(result, "--------白膜");
+	if (result) {
+		formData.value = {
+			...result
+		};
+		configJson.value.layers = [
+			{
+				id: result.id,
+				name: result.name,
+				icon:
+					result.layer == "gaode"
+						? "src/assets/images/Mars3DImg/basemaps/gaode_img.png"
+						: "src/assets/images/Mars3DImg/basemaps/bd-img.png",
+
+				type: "3dtiles",
+				url: result.url,
+				maximumScreenSpaceError: 1,
+				style: {
+					color: {
+						conditions: [["true", "color('" + result.color + "')"]]
+					}
+				},
+				show: result.show ? result.show : false,
+				flyTo: result.flyTo ? result.flyTo : false
+			}
+		];
+		initMars3d(configJson.value);
+	}
+};
+// 获取底图数据详情
+const getBaseMapsInfo = async () => {
 	let requestData = {
 		id: props.relativeId
 	};
@@ -131,7 +261,11 @@ const initMars3d = (option: any) => {
 	map.addLayer(graphicLayer);
 };
 onMounted(async () => {
-	await getInfo();
+	if (props.type == "底图") {
+		await getBaseMapsInfo();
+	} else if (props.type == "白膜") {
+		await getAlbugineaInfo();
+	}
 });
 onUnmounted(() => {
 	map = null;

src/views/goverment/largeScreen/index.vue

@@ -74,6 +74,7 @@
 					:data="treeData"
 					:props="props"
 					show-checkbox
+					node-key="id"
 					@check-change="handleCheckChange"
 				/>
 			</div>
@@ -105,6 +106,7 @@
 					:data="treeData"
 					:props="props"
 					show-checkbox
+					node-key="id"
 					@check-change="handleCheckChange"
 				/>
 			</div>
@@ -243,7 +245,7 @@ import MapPrint from "./components/mapPrint.vue";
 import FlyRoam from "./components/flyRoam.vue";
 import MapMark from "./components/mapMark.vue";
 import RouteNavigation from "./components/routeNavigation.vue";
-import { getSystemConfig } from "@/api/modules/mapCommon";
+import { getSystemConfig, baseMapList, albugineaMapList } from "@/api/modules/mapCommon";
 const configJson = ref<any>({});
 const screenComparisonShow = ref(false); // 分屏对比弹框
 const leftRollerList = ref<any>([]);
@@ -342,6 +344,56 @@ onMounted(async () => {
 	} else {
 		configJson.value = ConfigJson.map3d;
 	}
+	// 查询配置的图层
+	const resBaseMaps: any = await baseMapList({});
+	console.log(resBaseMaps, "6666666666");
+	if (resBaseMaps.result && resBaseMaps.result.length > 0) {
+		let initBasemaps: any = [{ id: 10, name: "地图底图", type: "group" }];
+		resBaseMaps.result.map((item: any) => {
+			initBasemaps.push({
+				pid: 10,
+				id: item.id,
+				name: item.name,
+				icon:
+					item.layer == "gaode"
+						? "src/assets/images/Mars3DImg/basemaps/gaode_img.png"
+						: "src/assets/images/Mars3DImg/basemaps/bd-img.png",
+				type: item.layer,
+				layer: item.layer == "gaode" ? "img_d" : "img_z",
+				saturation: item.saturation ? item.saturation : 0,
+				brightness: item.brightness ? item.brightness : 0,
+				contrast: item.contrast ? item.contrast : 0,
+				hue: item.hue ? item.hue : 0,
+				gamma: item.gamma ? item.gamma : 0,
+				show: item.show ? item.show : false
+			});
+		});
+		configJson.value.basemaps = initBasemaps;
+	}
+	// 查询配置的白膜
+	const resAlbuginea: any = await albugineaMapList({});
+	console.log(resAlbuginea, "白膜666666");
+	if (resAlbuginea.result && resAlbuginea.result.length > 0) {
+		let initAlbugineamaps: any = [{ id: 2040, name: "城市白模", type: "group" }];
+		resAlbuginea.result.map((item: any) => {
+			initAlbugineamaps.push({
+				pid: 2040,
+				id: item.id,
+				name: item.name,
+				type: "3dtiles",
+				url: item.url,
+				maximumScreenSpaceError: 1,
+				style: {
+					color: {
+						conditions: [["true", "color('" + item.color + "')"]]
+					}
+				},
+				show: item.show ? item.show : false,
+				flyTo: item.flyTo ? item.flyTo : false
+			});
+			configJson.value.layers = initAlbugineamaps;
+		});
+	}
 	await initMars3d(configJson.value);
 	await initTree();
 });
@@ -791,7 +843,7 @@ const initMars3d = (option: any) => {
 	// map.addEffect(snowCover);
 };
 // 获取config.json中的底图配置
-const getBasicMaps = () => {
+const getBasicMaps = async () => {
 	const layers = {
 		baseMaps: map.getBasemaps(true),
 		hasTerrain: map.hasTerrain
@@ -807,14 +859,18 @@ const getBasicMaps = () => {
 			options: markRaw(m.options)
 		};
 	});
-	rollerVal.value.leftRollerVal = baseMaps.value[0].id;
+	if (baseMaps.value.length > 1) {
-	rollerVal.value.rightRollerVal = baseMaps.value[1].id;
+		rollerVal.value.leftRollerVal = baseMaps.value[0].id;
-	leftRollerList.value = baseMaps.value.filter((item: any) => {
+		rollerVal.value.rightRollerVal = baseMaps.value[1].id;
-		return item.id != rollerVal.value.rightRollerVal;
+		leftRollerList.value = baseMaps.value.filter((item: any) => {
-	});
+			return item.id != rollerVal.value.rightRollerVal;
-	rightRollerList.value = baseMaps.value.filter((item: any) => {
+		});
-		return item.id != rollerVal.value.leftRollerVal;
+		rightRollerList.value = baseMaps.value.filter((item: any) => {
-	});
+			return item.id != rollerVal.value.leftRollerVal;
+		});
+	} else if (baseMaps.value.length > 0) {
+		rollerVal.value.leftRollerVal = baseMaps.value[0].id;
+	}
 	chkHasTerrain.value = layers.hasTerrain || false;
 };
 const addRandomGraphicByCount = (graphicLayer: any, position: any) => {
@@ -845,12 +901,13 @@ const addRandomGraphicByCount = (graphicLayer: any, position: any) => {
 };
 const handleCheckChange = (e: any, isCheck: any) => {
 	const layer = layersObj[e.key];
-
+	console.log(e);
+	console.log(layer);
+	console.log(isCheck);
 	if (layer) {
 		if (!layer.isAdded) {
 			map.addLayer(layer);
 		}
-
 		// 处理子节点
 		if (e.children && e.children.length) {
 			renderChildNode(isCheck, e.children);
@@ -889,6 +946,7 @@ const initTree = () => {
 		basemaps: true, // 是否取config.json中的basempas
 		layers: true // 是否取config.json中的layers
 	});
+	console.log(layers);
 	// 遍历出config.json中所有的basempas和layers
 	for (let i = layers.length - 1; i >= 0; i--) {
 		const layer = layers[i];

src/views/jxjview/albugineaManagement/components/operateDialog.vue

@@ -1,10 +1,10 @@
 <template>
 	<div class="overview">
-		<el-dialog :show-close="false" v-model="visible1" width="60%" @close="closeMain">
+		<el-dialog :show-close="false" v-model="visible1" width="60%" @close="closeMain" v-if="!testMapVisible">
 			<template #title>
 				<div class="title-detail">
 					<img src="@/assets/images/tableIcon/look.png" alt="" />
-					<span>新增白膜</span>
+					<span>{{ props.title }}</span>
 					<el-icon>
 						<close @click="closeMain" />
 					</el-icon>
@@ -14,72 +14,96 @@
 				<div class="basic-info">
 					<div class="form-content">
 						<div class="row">
-							<el-form-item label="名称:" prop="engineeringName">
+							<el-form-item label="名称:" prop="name">
-								<el-input v-model="formData.engineeringName" placeholder="请输入" disabled />
+								<el-input v-model="formData.name" placeholder="请输入" />
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="地址:" prop="engineeringName">
+							<el-form-item label="地址:" prop="url">
-								<el-input v-model="formData.engineeringName" placeholder="请输入" disabled />
+								<el-input v-model="formData.url" placeholder="请输入" />
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="偏移量lon经度:" prop="engineeringName">
+							<el-form-item label="偏移量lon经度:">
-								<el-input-number v-model="formData.engineeringName" placeholder="请输入" controls-position="right" disabled />
+								<el-input-number
+									v-model="formData.lng"
+									:step="0.0001"
+									:max="0.01"
+									:min="-0.01"
+									placeholder="请输入"
+									controls-position="right"
+								/>
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="偏移量lat维度:" prop="engineeringName">
+							<el-form-item label="偏移量lat维度:">
-								<el-input-number v-model="formData.engineeringName" placeholder="请输入" controls-position="right" disabled />
+								<el-input-number
+									v-model="formData.lat"
+									:step="0.0001"
+									:max="0.01"
+									:min="-0.01"
+									placeholder="请输入"
+									controls-position="right"
+								/>
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="偏移量高z米:" prop="engineeringName">
+							<el-form-item label="偏移量高z米:">
-								<el-input-number v-model="formData.engineeringName" placeholder="请输入" controls-position="right" disabled />
+								<el-input-number
+									v-model="formData.alt"
+									:step="10"
+									:max="500"
+									:min="-500"
+									placeholder="请输入"
+									controls-position="right"
+								/>
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="是否启用:" prop="engineeringName">
+							<el-form-item label="是否启用:">
+								<el-switch v-model="formData.show" style="--el-switch-on-color: #13ce66" />
+							</el-form-item>
+						</div>
+						<div class="row">
+							<el-form-item label="飞到该白膜:">
+								<el-switch v-model="formData.flyTo" style="--el-switch-on-color: #13ce66" />
+							</el-form-item>
+						</div>
+						<div class="row">
+							<el-form-item label="白膜颜色:">
+								<el-color-picker v-model="formData.color" />
+							</el-form-item>
+						</div>
+						<!-- <div class="row">
+							<el-form-item label="开启打光效果:">
 								<el-switch v-model="formData.engineeringName" style="--el-switch-on-color: #13ce66" />
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="飞到该白膜:" prop="engineeringName">
+							<el-form-item label="光环的高度范围:">
-								<el-switch v-model="formData.engineeringName" style="--el-switch-on-color: #13ce66" />
+								<el-input-number v-model="formData.engineeringName" placeholder="请输入" controls-position="right" />
 							</el-form-item>
 						</div>
 						<div class="row">
-							<el-form-item label="白膜颜色:" prop="engineeringName">
+							<el-form-item label="打光颜色:">
 								<el-color-picker v-model="formData.engineeringName" />
 							</el-form-item>
-						</div>
+						</div> -->
 						<div class="row">
-							<el-form-item label="开启打光效果:" prop="engineeringName">
+							<el-form-item label="可视化设置预览:" v-if="props.title == '编辑白膜图层'">
-								<el-switch v-model="formData.engineeringName" style="--el-switch-on-color: #13ce66" />
+								<el-button type="primary" @click="openTestMap">编辑</el-button>
-							</el-form-item>
-						</div>
-						<div class="row">
-							<el-form-item label="光环的高度范围:" prop="engineeringName">
-								<el-input-number v-model="formData.engineeringName" placeholder="请输入" controls-position="right" disabled />
-							</el-form-item>
-						</div>
-						<div class="row">
-							<el-form-item label="打光颜色:" prop="engineeringName">
-								<el-color-picker v-model="formData.engineeringName" />
-							</el-form-item>
-						</div>
-						<div class="row">
-							<el-form-item label="可视化设置预览:" prop="engineeringName">
-								<el-button type="primary" @click="visible1 = false">编辑</el-button>
 							</el-form-item>
 						</div>
 					</div>
 				</div>
 			</el-form>
 			<template #footer>
-				<el-button type="primary" @click="visible1 = false">确定</el-button>
+				<el-button type="primary" @click="confirmSubmit">确定</el-button>
+				<el-button class="cancelButtonStyle" @click="visible1 = false">取消</el-button>
 			</template>
 		</el-dialog>
+		<!-- 图层效果编辑 -->
+		<testMap v-if="testMapVisible" :relativeId="props.relativeId" @confirm="requestDetails" type="白膜"></testMap>
 	</div>
 </template>
 
@@ -87,66 +111,25 @@
 import { onMounted, ref, watch } from "vue";
 import type { FormInstance } from "element-plus";
 import { ElMessage } from "element-plus";
-import { getDicList } from "@/api/modules/jxjview";
+import { albugineaMapAdd, albugineaMapDetails, albugineaMapEdit } from "@/api/modules/mapCommon";
-import FilesUploadPlus from "@/components/FilesUploadPlus/FilesUpload.vue";
+import testMap from "@/components/testMap/index.vue";
-import {
+const testMapVisible = ref(false);
-	dangerousEngineerDetails,
-	constructionSchemeList,
-	constructionSchemeFile,
-	constructionProgressList,
-	localInspectList,
-	engineerAcceptList
-} from "@/api/modules/goverment";
-import DownLoad from "@/utils/annexDowload.ts";
-const layerTypeList = ref([
-	{ label: "ArcGisMapServerImageryProvider", value: "ArcGisMapServerImageryProvider" },
-	{ label: "BingMapsImageryProvider", value: "BingMapsImageryProvider" },
-	{ label: "OpenStreetMapImageryProvider", value: "OpenStreetMapImageryProvider" },
-	{ label: "TileMapServiceImageryProvider", value: "TileMapServiceImageryProvider" },
-	{ label: "GoogleEarthEnterpriseImageryProvider", value: "GoogleEarthEnterpriseImageryProvider" },
-	{ label: "GoogleEarthEnterpriseMapsProvider", value: "GoogleEarthEnterpriseMapsProvider" },
-	{ label: "GridImageryProvider", value: "GridImageryProvider" },
-	{ label: "IonImageryProvider", value: "IonImageryProvider" },
-	{ label: "MapboxImageryProvider", value: "MapboxImageryProvider" },
-	{ label: "MapboxStyleImageryProvider", value: "MapboxStyleImageryProvider" },
-	{ label: "SingleTileImageryProvider", value: "SingleTileImageryProvider" },
-	{ label: "TileCoordinatesImageryProvider", value: "TileCoordinatesImageryProvider" },
-	{ label: "UrlTemplateImageryProvider", value: "UrlTemplateImageryProvider" },
-	{ label: "WebMapServiceImageryProvider", value: "WebMapServiceImageryProvider" },
-	{ label: "WebMapTileServiceImageryProvider", value: "WebMapTileServiceImageryProvider" }
-]);
 const props = defineProps({
 	operateVisible: Boolean,
-	relativeId: String
+	relativeId: String,
+	title: String
 });
-const emits = defineEmits(["update:operateVisible"]);
+const emits = defineEmits(["update:operateVisible", "confirm"]);
-const arrOne = ref<any>([]);
-const arrFive = ref<any>([]);
-const arrSeven = ref<any>([]);
-const arrEight = ref<any>([]);
 const tabPosition = ref(0);
-const documentDataIndex = ref(0);
-const current = ref({
-	files: []
-});
-const typeList = ref([]);
-const acceptTypeList = ref([]);
 const rules = ref({
-	engineeringName: [
+	name: [
 		{
 			required: true,
 			message: "请输入",
 			trigger: "blur"
 		}
 	],
-	type: [
+	url: [
-		{
-			required: true,
-			message: "请输入",
-			trigger: "change"
-		}
-	],
-	typeDescribe: [
 		{
 			required: true,
 			message: "请输入",
@@ -155,145 +138,54 @@ const rules = ref({
 	]
 });
 const formRef = ref<FormInstance>();
-const formData = ref<any>({
+const formData = ref<any>({});
-	technicalDisclosureFile: [],
-	securityConstructionSchemeFile: [],
-	specialConstructionSchemeFile: []
-});
 const visible1 = ref(false);
-// 验收类型文本转换;
+
-const textTransform = (id: any) => {
+// 打开测试地图
-	let findItem: any = acceptTypeList.value.find(item => item.value == id);
+const openTestMap = () => {
-	return findItem?.label;
+	testMapVisible.value = true;
 };
-// 获取附件列表
+// 刷新详情数据
-const getConstructionSchemeList = async () => {
+const requestDetails = async () => {
-	const res = await constructionSchemeList({ dangerousEngineeringId: props.relativeId, type: tabPosition.value });
+	testMapVisible.value = false;
-	console.log(res);
+	getInfo();
-	if (res.result && res.result.length > 0) {
-		arrOne.value = res.result;
-	} else {
-		arrOne.value = [];
-	}
 };
-// 获取施工进度列表
+// 获取数据详情
-const getConstructionProgressList = async () => {
+const getInfo = async () => {
-	const res = await constructionProgressList({ dangerousEngineeringId: props.relativeId });
-	console.log(res);
-	if (res.result && res.result.length > 0) {
-		arrFive.value = res.result;
-	} else {
-		arrFive.value = [];
-	}
-};
-// 获取现场巡视列表
-const getLocalInspectList = async () => {
-	const res = await localInspectList({ dangerousEngineeringId: props.relativeId });
-	console.log(res);
-	if (res.result && res.result.length > 0) {
-		arrSeven.value = res.result;
-	} else {
-		arrSeven.value = [];
-	}
-};
-// 获取危大工程验收列表
-const getengineerAcceptList = async () => {
-	const res = await engineerAcceptList({ dangerousEngineeringId: props.relativeId });
-	console.log(res);
-	if (res.result && res.result.length > 0) {
-		arrEight.value = res.result;
-	} else {
-		arrEight.value = [];
-	}
-};
-// 获取危大工程详情
-const getDetailsData = async () => {
-	const res = await dangerousEngineerDetails({ id: props.relativeId });
-	console.log(res);
-	if (res && res.result) {
-		formData.value = { ...res.result };
-	}
-	if (formData.value.constructionPlanStartTime && formData.value.constructionPlanEndTime) {
-		formData.value.planRange = [formData.value.constructionPlanStartTime, formData.value.constructionPlanEndTime];
-	}
-	if (formData.value.constructionStartTime && formData.value.constructionEndTime) {
-		formData.value.constructionRange = [formData.value.constructionStartTime, formData.value.constructionEndTime];
-	}
-};
-// tabs项点击时
-const handleClick = (pane: any) => {
-	tabPosition.value = pane.props.name;
-	const listOperation = [getConstructionSchemeList, getConstructionProgressList, getLocalInspectList, getengineerAcceptList];
-	if (tabPosition.value < 5 || tabPosition.value == 8) {
-		listOperation[0]();
-	} else {
-		listOperation[tabPosition.value - 4]();
-	}
-};
-// 附件上传改变
-const handlechange = e => {
-	console.log(e);
-	current.value.files = e.map(item => {
-		item.label = current.value.dictLabel;
-		return item;
-	});
-	console.log(current.value.files);
-	arrOne.value[documentDataIndex.value].fileList = current.value.files;
-};
-// 危大工程资料
-const onDownLoad = (key: any) => {
-	console.log(key);
-	console.log(formData.value[key]);
-	let val = JSON.parse(formData.value[key]);
-	if (val && val.length > 0) {
-		DownLoad(val);
-	} else {
-		ElMessage.error("暂无可下载文件");
-	}
-};
-// 表格附件下载
-const onTableDownLoad = async (row: any) => {
-	console.log(row);
 	let requestData = {
-		id: row.id
+		id: props.relativeId
 	};
-	const { result } = await constructionSchemeFile(requestData);
+	const { result }: { result: any } = await albugineaMapDetails(requestData);
-	console.log(result);
+	if (result) {
-	if (result && result.length > 0) {
+		formData.value = { ...result, lng: result.lng || 0, lat: result.lat || 0, alt: result.alt || 0 };
-		DownLoad(result);
-	} else {
-		ElMessage.error("暂无可下载文件");
 	}
 };
-// 获取验收类型字典
+// 新增确认
-const getAcceptTypeList = async () => {
+const confirmSubmit = () => {
-	const { result } = await getDicList({ dictType: "check_accept_type" });
+	const formEl = formRef.value;
-	if (result.length > 0) {
+	if (!formEl) return;
-		let arr: any = [];
+	formEl.validate(async (valid, fields) => {
-		result.map(item => {
+		if (valid) {
-			arr.push({
+			let requestData = {
-				label: item.dictValue,
+				...formData.value
-				value: item.dictLabel
+			};
-			});
+			if (props.title == "新增白膜图层") {
-		});
+				const res: any = await albugineaMapAdd(requestData);
-		acceptTypeList.value.length = 0;
+				if (res.code == 200) {
-		acceptTypeList.value.push(...arr);
+					ElMessage.success("操作成功");
-	}
+				}
-};
+			} else if (props.title == "编辑白膜图层") {
-const getTypeDicMainList = async () => {
+				const res: any = await albugineaMapEdit(requestData);
-	// 获取起重机械设备类型字典
+				if (res.code == 200) {
-	const { result } = await getDicList({ dictType: "dangerous_engineer_type" });
+					ElMessage.success("操作成功");
-	if (result.length > 0) {
+				}
-		let arr: any = [];
+			}
-		result.map(item => {
+			visible1.value = false;
-			arr.push({
+			emits("confirm");
-				label: item.dictValue,
+		} else {
-				value: item.dictLabel
+			console.log("error submit!", fields);
-			});
+		}
-		});
+	});
-		typeList.value.length = 0;
-		typeList.value.push(...arr);
-	}
 };
 // 关闭两个对话框
 const closeMain = () => {
@@ -304,15 +196,15 @@ watch(
 	() => props.operateVisible,
 	n => {
 		if (n) {
-			getAcceptTypeList();
+			if (props.title == "新增白膜图层") {
-			getTypeDicMainList();
+				formData.value = {};
-			getDetailsData();
+			} else if (props.title == "编辑白膜图层") {
-			getConstructionSchemeList();
+				getInfo();
+			}
+			visible1.value = n;
 			setTimeout(function () {
 				formRef.value?.clearValidate();
-			}, 200);
+			}, 20);
-			visible1.value = n;
-			tabPosition.value = 0;
 		}
 	}
 );
@@ -471,51 +363,4 @@ onMounted(() => {});
 		}
 	}
 }
-:deep(.el-tabs--card > .el-tabs__header) {
-	border-bottom: none;
-}
-:deep(.el-tabs--card > .el-tabs__header .el-tabs__nav) {
-	width: 100%;
-	background: #f8f8f8;
-	border: 0;
-}
-:deep(.el-tabs__nav-scroll) {
-	display: flex;
-	.el-tabs__item {
-		width: 50%;
-		text-align: center;
-		// background: #f8f8f8;
-		color: #333;
-		// border: 1px solid #e5e5e5;
-		// border-radius: 8px;
-	}
-	.el-tabs__item.is-active {
-		background-color: #008bff;
-		color: #fff;
-	}
-}
-:deep(.el-tabs--card > .el-tabs__header .el-tabs__item.is-active) {
-	border-bottom-color: #008bff !important;
-}
-:deep(#tab-0) {
-	border-radius: 4px 0 0 4px;
-	border: 1px solid #e5e5e5;
-	border-right: 0;
-}
-:deep() {
-	#tab-1,
-	#tab-2,
-	#tab-3,
-	#tab-4,
-	#tab-5,
-	#tab-6,
-	#tab-7 {
-		border: 1px solid #e5e5e5;
-		border-right: 0;
-	}
-}
-:deep(#tab-8) {
-	border: 1px solid #e5e5e5;
-	border-radius: 0 4px 4px 0;
-}
 </style>

src/views/jxjview/albugineaManagement/index.vue

@@ -2,7 +2,7 @@
 	<div class="table-box">
 		<ProTable
 			ref="proTable"
-			title="用户列表"
+			title="白膜图层列表"
 			:columns="columns"
 			:requestApi="getTableList"
 			:initParam="initParam"
@@ -17,22 +17,32 @@
 			<template #formButton="scope">
 				<el-button class="addButtonStyle" @click="handleAddItem()">新增</el-button>
 			</template>
+			<!-- 是否启用 -->
+			<template #show="scope">
+				<el-switch v-model="scope.row.show" disabled style="--el-switch-on-color: #13ce66" />
+			</template>
+			<!-- 是否飞到该白膜 -->
+			<template #flyTo="scope">
+				<el-switch v-model="scope.row.flyTo" disabled style="--el-switch-on-color: #13ce66" />
+			</template>
 			<!-- 表格操作 -->
 			<template #operation="scope">
-				<div class="operate-option"></div>
+				<div class="operate-option">
-			</template>
+					<el-button type="primary" link @click="handleEditItem(scope.row)">
-			<template #state="{ row }">
+						<img src="@/assets/images/tableIcon/updateIcon.png" alt="" class="configureIcon" />
-				<span :class="row.state === 1 ? '' : 'redText'">{{ row.state === 1 ? "启用" : "禁用" }}</span>
+						<span>编辑</span>
-			</template>
+					</el-button>
-			<template #authProject="{ row }">
+					<el-button type="danger" link :icon="Delete" @click="handleDeleteItem(scope.row)">删除</el-button>
-				{{ (row.installProject ? row.installProject : 0) + "/" + row.authProject }}
+				</div>
-			</template>
-			<template #diffDay="{ row }">
-				{{ row.expireTime === null ? "永久有效" : row.diffDay }}
 			</template>
 		</ProTable>
 		<!-- 图层新增/编辑 -->
-		<operateDialog v-model:operateVisible="operateVisible" :relativeId="relativeId"></operateDialog>
+		<operateDialog
+			v-model:operateVisible="operateVisible"
+			:relativeId="relativeId"
+			:title="title"
+			@confirm="requestTable"
+		></operateDialog>
 	</div>
 </template>
 
@@ -43,8 +53,11 @@ import { useRouter } from "vue-router";
 import { User } from "@/api/interface";
 import { ColumnProps } from "@/components/ProTable/interface";
 import ProTable from "@/components/ProTable/index.vue";
-import { getGovermentTreeList } from "@/api/modules/jxjview";
 import operateDialog from "./components/operateDialog.vue";
+import { Delete } from "@element-plus/icons-vue";
+import { useHandleData } from "@/hooks/useHandleData";
+import { albugineaMapPage, albugineaMapDelete } from "@/api/modules/mapCommon";
+import { jxj_User } from "@/api/types";
 const relativeId = ref("");
 const operateVisible = ref(false);
 const treeProps = ref({ children: "children", hasChildren: "hasChildren" });
@@ -59,19 +72,18 @@ const formData = ref({});
 // 表格配置项
 const columns: ColumnProps[] = [
 	{
-		prop: "governmentName",
+		prop: "id",
-		label: "ID",
+		label: "ID"
-		search: { el: "input" }
 	},
 	// 多级 prop
-	{ prop: "createTime", label: "名称" },
+	{ prop: "name", label: "名称", search: { el: "input" } },
-	{ prop: "governmentTel", label: "是否启用" },
+	{ prop: "show", label: "是否启用" },
-	{ prop: "state", label: "飞到该白膜" },
+	{ prop: "flyTo", label: "飞到该白膜" },
-	{ prop: "diffDay", label: "白膜颜色" },
+	{ prop: "color", label: "白膜颜色" },
-	{ prop: "authProject", label: "开启打光效果" },
+	// { prop: "authProject", label: "开启打光效果" },
-	{ prop: "authProject", label: "创建时间" },
+	{ prop: "createTime", label: "创建时间" },
-	{ prop: "authProject", label: "更新时间" },
+	{ prop: "updateTime", label: "更新时间" },
-	{ prop: "operation", label: "操作", fixed: "right", width: 260 }
+	{ prop: "operation", label: "操作", fixed: "right", width: 160 }
 ];
 // const AuthIdData = ref([]);
 
@@ -79,10 +91,26 @@ const columns: ColumnProps[] = [
 const initParam = reactive({
 	// type: 1
 });
+
+// 刷新列表数据
+const requestTable = () => {
+	proTable.value.getTableList();
+};
+// 删除白膜图层
+const handleDeleteItem = async (params: jxj_User.ResUserList) => {
+	await useHandleData(albugineaMapDelete, { id: params.id }, `删除【${params.name}】`);
+	proTable.value.getTableList();
+};
+// 编辑
+const handleEditItem = (row: any) => {
+	operateVisible.value = true;
+	title.value = "编辑白膜图层";
+	relativeId.value = row.id;
+};
 // 添加数据按钮
 const handleAddItem = () => {
 	operateVisible.value = true;
-	title.value = "新增市级政务";
+	title.value = "新增白膜图层";
 	formData.value = reactive({});
 };
 // dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total && pageNum && pageSize 这些字段，那么你可以在这里进行处理成这些字段
@@ -101,48 +129,22 @@ const dataCallback = (data: any) => {
 // 默认不做操作就直接在 ProTable 组件上绑定	:requestApi="getUserList"
 const getTableList = (params: any) => {
 	let newParams = JSON.parse(JSON.stringify(params));
-	return getGovermentTreeList(newParams);
+	return albugineaMapPage(newParams);
 };
 onMounted(async () => {});
 </script>
 <style scoped lang="scss">
+.table-box {
+	position: relative;
+}
 .operate-option {
 	display: flex;
 	align-items: center;
+	justify-content: center;
 	:deep() {
 		.el-button + .el-button {
 			margin-left: 0px;
 		}
 	}
 }
-.littleTitle {
-	border-left: 3px solid #008bff;
-	padding-left: 6px;
-}
-.allModular {
-	width: 100%;
-	margin: 10px;
-	display: flex;
-	flex-wrap: wrap;
-	.modularItem {
-		padding-right: 50px;
-	}
-}
-.select-all {
-	display: flex;
-	flex-direction: column;
-	.radio-select {
-		display: flex;
-		align-items: center;
-	}
-}
-:deep(.el-dialog__footer) {
-	text-align: center;
-}
-:focus-visible {
-	outline: none;
-}
-// .redText {
-// 	color: red;
-// }
 </style>

src/views/jxjview/layerManagement/components/operateDialog.vue

@@ -126,7 +126,7 @@
 			</template>
 		</el-dialog>
 		<!-- 图层效果编辑 -->
-		<testMap v-if="testMapVisible" :relativeId="props.relativeId" @confirm="requestDetails"></testMap>
+		<testMap v-if="testMapVisible" :relativeId="props.relativeId" @confirm="requestDetails" type="底图"></testMap>
 	</div>
 </template>
 

src/views/jxjview/layerManagement/index.vue

@@ -51,11 +51,10 @@ import { ref, reactive, onMounted } from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import ProTable from "@/components/ProTable/index.vue";
 import operateDialog from "./components/operateDialog.vue";
-import { baseMapPage } from "@/api/modules/mapCommon";
 import { Delete } from "@element-plus/icons-vue";
 import { useHandleData } from "@/hooks/useHandleData";
 import { jxj_User } from "@/api/types";
-import { baseMapDelete } from "@/api/modules/mapCommon";
+import { baseMapPage, baseMapDelete } from "@/api/modules/mapCommon";
 const relativeId = ref("");
 const operateVisible = ref(false);
 const treeProps = ref({ children: "children", hasChildren: "hasChildren" });