feat: 接口对接

src/api/modules/mapCommon.ts

@@ -0,0 +1,20 @@
+import { ResPage, User } from "@/api/types/common";
+// import { BASEURL } from "@/api/config/servicePort";
+import http from "@/api";
+import axios from "axios";
+
+const BASEURL = import.meta.env.VITE_API_URL;
+// const BASEURL1 = import.meta.env.VITE_API_URL + "6868";
+
+/**
+ * @name 公共的模块统一抽离api
+ */
+
+// 查询系统配置
+export const getSystemConfig = (params: any) => {
+	return http.post(BASEURL + `/xmgl/systemConfig/queryByKey`, params);
+};
+// 修改系统配置
+export const updateSystemConfig = (params: any) => {
+	return http.post(BASEURL + `/xmgl/systemConfig/edit`, params);
+};

src/assets/json/dynamicRouter.json

@@ -18,7 +18,7 @@
 		{
 			"path": "/config",
 			"name": "config",
-			"component": "/goverment/unmannedVideo/accessSituation/index",
+			"component": "/jxjview/configManagement/index",
 			"meta": {
 				"icon": "leftGover",
 				"title": "配置中心",

src/layouts/LayoutClassic/index.vue

@@ -13,7 +13,7 @@
 			</div>
 			<ToolBarRight />
 		</el-header>
-		<el-container class="classic-content" v-waterMarker>
+		<el-container class="classic-content">
 			<el-aside>
 				<!-- <div class="menu" :style="{ width: isCollapse ? '65px' : '210px' }">  根据屏幕自动收缩 -->
 				<div class="menu">

src/views/home/index.vue

@@ -17,7 +17,7 @@
 			<ToolBarRight />
 		</el-header>
 
-		<div class="contain-section" v-waterMarker>
+		<div class="contain-section">
 			<div class="contain-header">
 				<div class="header-important" v-for="item in data['important']" :key="item.moduleId">
 					<div class="header-item" @click="onChange(item)">

src/views/jxjview/configManagement/index.scss

@@ -0,0 +1,28 @@
+.protable {
+	// flex: 1;
+	padding: 20px;
+	height: calc(100% - 60px);
+	min-height: 415px;
+	border-radius: 8px;
+	background-color: white;
+	.operate-btn {
+		display: flex;
+		align-items: center;
+	}
+}
+.tab-card {
+	:deep() {
+		.el-card {
+			margin-bottom: 20px;
+			border: none;
+			border-radius: 8px;
+			height: 56px;
+		}
+		.el-button {
+			font-size: 14px;
+			font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+			font-weight: 400;
+			color: #333333;
+		}
+	}
+}

src/views/jxjview/configManagement/index.vue

@@ -0,0 +1,171 @@
+<template>
+	<div class="main-box">
+		<div class="table-box">
+			<div class="tab-card">
+				<el-card shadow="never">
+					<el-button :class="showPage == false ? 'blueText' : ''" @click="showPage = false" link>地图初始化控件配置</el-button>
+					<el-button :class="showPage == true ? 'blueText' : ''" @click="showPage = true" link>地图初始视角</el-button>
+				</el-card>
+			</div>
+			<div class="protable" v-show="!showPage">
+				<el-table
+					:data="controlsTable"
+					height="calc(100% - 40px)"
+					class="el-table"
+					:header-cell-style="{ backgroundColor: '#F5F7FA' }"
+				>
+					<el-table-column type="index" label="序号" width="120" align="center" />
+					<el-table-column prop="title" label="变量标题" align="left" width="150" />
+					<el-table-column prop="value" label="变量值" align="left">
+						<template #default="{ row }">
+							<el-switch v-model="configJson.control[row.key]" style="--el-switch-on-color: #13ce66" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="key" label="变量名" align="left" width="200">
+						<template #default="{ row }">
+							<span>{{ "${" + row.key + "}" }}</span>
+						</template>
+					</el-table-column>
+					<!-- <el-table-column align="center" fixed="right" width="180" label="操作">
+						<template #default="scope">
+							<el-button type="danger" link :icon="Delete">删除</el-button>
+						</template>
+					</el-table-column> -->
+					<template #empty>
+						<div class="table-empty">
+							<slot name="empty">
+								<img src="@/assets/images/notData.png" alt="notData" />
+								<div>暂无数据</div>
+							</slot>
+						</div>
+					</template>
+				</el-table>
+				<div class="operate-btn">
+					<el-button type="primary" @click="saveConfig('control')">确定</el-button>
+				</div>
+			</div>
+			<div class="protable" v-show="showPage">
+				<el-table
+					:data="viewsTable"
+					height="calc(100% - 40px)"
+					class="el-table"
+					:header-cell-style="{ backgroundColor: '#F5F7FA' }"
+				>
+					<el-table-column type="index" label="序号" width="120" align="center" />
+					<el-table-column prop="title" label="变量标题" align="left" width="150" />
+					<el-table-column prop="value" label="变量值" align="left">
+						<template #default="{ row }"><el-input v-model="row.value" placeholder="请输入" style="width: 70%" /></template>
+					</el-table-column>
+					<el-table-column prop="key" label="变量名" align="left" width="200">
+						<template #default="{ row }">
+							<span>{{ "${" + row.key + "}" }}</span>
+						</template>
+					</el-table-column>
+					<!-- <el-table-column align="center" fixed="right" width="180" label="操作">
+						<template #default="scope">
+							<el-button type="danger" link :icon="Delete">删除</el-button>
+						</template>
+					</el-table-column> -->
+					<template #empty>
+						<div class="table-empty">
+							<slot name="empty">
+								<img src="@/assets/images/notData.png" alt="notData" />
+								<div>暂无数据</div>
+							</slot>
+						</div>
+					</template>
+				</el-table>
+				<div class="operate-btn">
+					<el-button type="primary" @click="saveConfig('center')">确定</el-button>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+<script setup lang="ts" name="configManagement">
+import { ref, reactive, onMounted, onBeforeMount, watch } from "vue";
+import { ElMessage } from "element-plus";
+import { useRouter } from "vue-router";
+import { getSystemConfig, updateSystemConfig } from "@/api/modules/mapCommon";
+import configData from "./config.json";
+import { config } from "process";
+const configId = ref("");
+const configJson = ref<any>({
+	control: {}
+});
+const viewsTable = ref([
+	{ title: "初始化经度", value: "", key: "lng" }, // 180-180
+	{ title: "初始化纬度", value: "", key: "lat" }, // 90-90
+	{ title: "初始化高度", value: "", key: "alt" },
+	{ title: "相机方向角", value: "", key: "heading" }, // 0-360
+	{ title: "相机俯仰角", value: "", key: "pitch" }, // -90-90
+	{ title: "相机翻滚角", value: "", key: "roll" } // -90-90
+]);
+const controlsTable = ref([
+	{ title: "POI搜索", value: false, key: "geocoder" },
+	{ title: "视角复位", value: false, key: "homeButton" },
+	{ title: "二三维切换", value: false, key: "sceneModePicker" },
+	{ title: "地图切换", value: false, key: "baseLayerPicker" },
+	{ title: "全屏切换", value: false, key: "fullscreenButton" },
+	{ title: "VR", value: false, key: "vrButton" },
+	{ title: "帮助按钮", value: false, key: "navigationHelpButton" },
+	{ title: "地图缩放", value: false, key: "zoom" },
+	{ title: "信息状态栏", value: false, key: "locationBar" },
+	{ title: "时钟面板", value: false, key: "clockAnimate" },
+	{ title: "导航球", value: false, key: "compass" },
+	{ title: "时间刻度线", value: false, key: "timeline" },
+	{ title: "比例尺", value: false, key: "distanceLegend" }
+]);
+const router = useRouter();
+const showPage = ref(false);
+// 保存修改配置
+const saveConfig = async (label: any) => {
+	console.log(controlsTable.value);
+	if (label == "control") {
+		controlsTable.value.map((item: any) => {
+			configJson.value.control[item.key] = item.value;
+		});
+	} else {
+		controlsTable.value.map((item: any) => {
+			configJson.value.center[item.key] = item.value;
+		});
+	}
+	let requestData: any = { configKey: "mapConfig", configValue: JSON.stringify(configJson.value) };
+	if (configJson.value) {
+		requestData.configId = configId.value;
+	}
+	console.log(configJson.value);
+	const res = await updateSystemConfig(requestData);
+	console.log(res);
+	if (res.code == 200) {
+		ElMessage.success("操作成功");
+	}
+};
+// 获取配置
+const getConfig = async () => {
+	let requestData = {
+		configKey: "mapConfig"
+	};
+	const { result } = await getSystemConfig(requestData);
+	console.log(result, "6666666");
+	if (result) {
+		configId.value = result.configId;
+		configJson.value = JSON.parse(result.configValue);
+		console.log(configJson.value);
+	} else {
+		// const configUrl = "http://182.90.224.147:6080/file/config/config.json";
+		configJson.value = configData.map3d;
+		console.log(configData);
+	}
+};
+onBeforeMount(async () => {
+	await getConfig();
+});
+</script>
+
+<style lang="scss" scoped>
+.blueText {
+	color: #008bff !important;
+}
+@import "./index.scss";
+</style>