@@ -38,11 +25,19 @@
-
+
点击地图,绘制巡检路线;再次点击可继续绘制下一条(但只能保留一条)
- 清空所有路线
+ {
+ GDef.clearAll();
+ }
+ "
+ >清空所有路线
@@ -62,11 +57,11 @@ import { useRouter, useRoute } from 'vue-router';
import PageHeader from '@/components/Pageheader/index.vue';
import { listPoint } from '@/api/system/InspectionPoint';
import { onMounted, onUnmounted } from 'vue';
-import AMapLoader from '@amap/amap-jsapi-loader';
import { addRoute, getRoute, updateRoute } from '@/api/system/InspectionRoute';
-import { getVillageByIdAPI } from '@/api/system/community';
import { Check } from '@element-plus/icons-vue';
+import GD from '@/components/Map/GD.vue';
+
const router = useRouter();
const route = useRoute();
@@ -90,65 +85,12 @@ const rules = ref({
estimatedTime: [{ required: true, message: '请输入预计巡检时长', trigger: 'blur' }]
});
-// !== 初始化 =============================================================================
+const GDef = ref();
const routeid = ref(null);
// 巡检点 列表
const pointslist = ref([]);
-
// 选择巡检点列表
const checkoutPointlist = ref([]);
-function checkoutItem(id: string) {
- if (checkoutPointlist.value.includes(id)) {
- checkoutPointlist.value = checkoutPointlist.value.filter((item) => item !== id);
- removePointMarker(id);
- } else {
- checkoutPointlist.value.push(id);
- const find = pointslist.value.find((item) => item.id === id);
- if (find && find.location) {
- if (find && find.location) {
- addPointMarker(id, find.location, find.pointName);
- }
- }
- }
- // 调整地图视野以适应所有 marker
- map.value.setFitView();
-}
-// 添加 marker
-function addPointMarker(id: string, location: string, title?: string) {
- if (!map.value || !AMapLib.value) return;
- const [lng, lat] = location.split(',').map((v) => Number(v.trim()));
- if (!Number.isFinite(lng) || !Number.isFinite(lat)) return;
- // 获取到经纬度后,添加 marker 数组
- const lnglat = new AMapLib.value.LngLat(lng, lat);
- const index = Object.keys(markers.value).length + 1; // 获取当前 marker 数量,作为新的 marker 的编号
- markers.value[id] = new AMapLib.value.Marker({
- position: lnglat,
- map: map.value,
- title: title || '巡检点',
- label: title || '巡检点',
- content: `
-
`
- });
-}
-// 移除 marker
-function removePointMarker(id: string) {
- const markerItem = markers.value[id];
- if (markerItem) {
- map.value.remove(markerItem);
- delete markers.value[id];
- }
-}
// ! 初始化 =========================================================================
function init() {
@@ -177,30 +119,31 @@ function init() {
checkoutPointlist.value.forEach((id) => {
const find = res.data.points.find((item) => item.id === id);
if (find && find.location) {
- addPointMarker(id, find.location, find.pointName);
+ // addPointMarker(id, find.location, find.pointName);
+ const location = find.location
+ .split(',')
+ .map((item) => Number(item))
+ .filter((item) => !Number.isNaN(item));
+ if (location.length >= 2) {
+ GDef.value.addMarker_more(location, find.pointName, find.id);
+ }
}
});
}
// 回显路线
if (res.data.pathPoints) {
- renderSavedPath(res.data.pathPoints);
+ // renderSavedPath(res.data.pathPoints);
+ setTimeout(() => {
+ GDef.value.renderSavedPath(res.data.pathPoints);
+ }, 800);
}
}
});
});
}
}
-// ! map
-const mapReady = ref(false);
-const AMapLib = ref(null);
const map = ref
(null);
-const markers = ref>({});
-const mouseTool = ref(null);
-const drawnPolylines = ref([]); // 存所有线条
-const villageid = localStorage.getItem('villageid');
-const aloaderkey = import.meta.env.VITE_GCJ02_KEY_GD;
-const VITE_GCJ02_JS_CODE_GD = import.meta.env.VITE_GCJ02_JS_CODE_GD;
onMounted(async () => {
// 获取巡检点列表
if (!routeid.value) {
@@ -208,183 +151,47 @@ onMounted(async () => {
pointslist.value = res.rows;
});
}
- await nextTick();
- window._AMapSecurityConfig = { securityJsCode: VITE_GCJ02_JS_CODE_GD };
- AMapLoader.load({
- key: aloaderkey,
- version: '2.0',
- plugins: ['AMap.Scale', 'AMap.Marker']
- }).then(async (AMap) => {
- AMapLib.value = AMap;
- map.value = new AMap.Map('containerMap', {
- viewMode: '3D',
- zoom: 11
- });
-
- const villageinfo = await getVillageByIdAPI(villageid);
- AMap.plugin('AMap.Geocoder', function () {
- const city = villageinfo.data.city.replaceAll('/', '');
- const geocoder = new AMap.Geocoder({
- city: city // city 指定进行编码查询的城市,支持传入城市名、adcode 和 citycode
- });
- geocoder.getLocation(city, function (status, result) {
- if (status === 'complete' && result.info === 'OK') {
- // result中对应详细地理坐标信息
- map.value.setCenter(result.geocodes[0].location.toArray());
- }
- });
- });
-
- mapReady.value = true;
-
- // 初始化绘图插件 MouseTool
- AMap.plugin(['AMap.MouseTool'], () => {
- mouseTool.value = new AMap.MouseTool(map.value);
- // ✅ 只在这里调用一次,不要重复调用
- // 监听绘制(全局只绑定一次!)
- mouseTool.value.on('draw', (e) => {
- if (!e.obj) return;
- // ==========================================
- // 核心:永远只保留一条线,画新的自动删旧的
- // ==========================================
- if (drawnPolylines.value.length > 0) {
- map.value.remove(drawnPolylines.value[0]);
- }
- drawnPolylines.value = [e.obj];
- // 画完继续允许画下一条(但永远只保留一条)
- initDrawTool();
- });
- initDrawTool();
- });
- init();
- });
+ await nextTick(() => init());
});
-// 回显
-function renderSavedPath(pathStr: string) {
- if (!pathStr || !map.value || !AMapLib.value) return;
-
- try {
- const path = JSON.parse(pathStr);
- if (!Array.isArray(path) || path.length === 0) return;
-
- // 先清空旧路线
- drawnPolylines.value.forEach((line) => {
- map.value.remove(line);
- });
- drawnPolylines.value = []; // 🔴 清空数组
-
- // 只回显一条
- const polyline = new AMapLib.value.Polyline({
- path: path,
- strokeColor: '#3366FF',
- strokeOpacity: 1,
- strokeWeight: 3,
- strokeStyle: 'solid',
- map: map.value
- });
-
- drawnPolylines.value.push(polyline); // ✅ 只一条
- map.value.setFitView(polyline);
- } catch (e) {
- console.error('路线解析失败', e);
- }
-}
-
-// 初始化绘图(只执行一次,防止事件重复绑定)
-function initDrawTool() {
- if (!mouseTool.value) return;
-
- // 先关闭可能存在的绘图
- mouseTool.value.close(false);
-
- // 开启折线绘制
- mouseTool.value.polyline({
- strokeColor: '#3366FF',
- strokeOpacity: 1,
- strokeWeight: 3,
- strokeStyle: 'solid'
- });
-}
-
-// 清空所有画线
-function clearAll() {
- if (mouseTool.value) {
- mouseTool.value.close(true); // 关闭绘图并清空
- drawnPolylines.value.forEach((line) => {
- map.value.removeOverlay(line);
- });
- drawnPolylines.value = [];
- initDrawTool();
- }
-}
-
-// !!! 核心:获取绘制的路线经纬度数组
-function getPolylinePath() {
- if (drawnPolylines.value.length === 0) return [];
- // 获取最后一条线
- const lastPolyline = drawnPolylines.value[drawnPolylines.value.length - 1];
- // const lastLine = drawnPolylines.value.pop();
- const path = lastPolyline.getPath().map((p) => [p.lng, p.lat]);
- return path;
-}
-/**
- * 修复高德地图 Polyline 闭合路线最后一段不显示
- * 解决:最后两点坐标相同 → 长度0 → 不渲染
- */
-function fixClosePath(path: number[][]): number[][] {
- if (!path || path.length < 2) return path;
-
- const newPath = [...path];
-
- // 如果是闭合路线(最后一点 ≈ 第一点)
- const first = newPath[0];
- const last = newPath[newPath.length - 1];
-
- // 判断是否几乎重合
- const isSame = Math.abs(last[0] - first[0]) < 1e-8 && Math.abs(last[1] - first[1]) < 1e-8;
-
- if (isSame) {
- // 【关键】最后一点极微小偏移,强制生成线段
- newPath[newPath.length - 1] = [last[0] + 0.0000001, last[1] + 0.0000001];
- }
-
- return newPath;
-}
-
// !== 提交 =============================================================================
const submitForm = () => {
+ if (form.value.routeName.trim() === '') {
+ ElMessage.warning('请输入巡检路线名称');
+ return;
+ }
formRef.value?.validate(async (valid: boolean) => {
- // if (valid) {
- // 获取路线经纬度
- const path = getPolylinePath() as [number, number][];
- if (path.length === 0) {
- ElMessage.warning('请绘制巡检路线');
- return;
- }
- // 转成字符串传给后端
- const [start_lng, start_lat] = path.at(0) as [number, number];
- const [end_lng, end_lat] = path.at(-1) as [number, number];
+ if (valid) {
+ // 获取路线经纬度
+ const path = GDef.value.getAllDrawLines() as [number, number][];
+ console.log(path);
+ if (path.length === 0) {
+ ElMessage.warning('请绘制巡检路线');
+ return;
+ }
+ // 转成字符串传给后端
+ const [start_lng, start_lat] = path.at(0) as [number, number];
+ const [end_lng, end_lat] = path.at(-1) as [number, number];
- form.value.startLng = `${start_lng}`;
- form.value.startLat = `${start_lat}`;
- form.value.endLng = `${end_lng}`;
- form.value.endLat = `${end_lat}`;
+ form.value.startLng = `${start_lng}`;
+ form.value.startLat = `${start_lat}`;
+ form.value.endLng = `${end_lng}`;
+ form.value.endLat = `${end_lat}`;
- form.value.pathPoints = JSON.stringify(path);
- form.value.totalPoints = checkoutPointlist.value.join(',');
- if (routeid.value) {
- updateRoute(form.value).then(() => {
- ElMessage.success('编辑成功');
- cancelForm();
- });
- } else {
- addRoute(form.value).then(() => {
- ElMessage.success('添加成功');
- cancelForm();
- });
+ form.value.pathPoints = JSON.stringify(path);
+ form.value.totalPoints = checkoutPointlist.value.join(',');
+ if (routeid.value) {
+ updateRoute(form.value).then(() => {
+ ElMessage.success('编辑成功');
+ cancelForm();
+ });
+ } else {
+ addRoute(form.value).then(() => {
+ ElMessage.success('添加成功');
+ cancelForm();
+ });
+ }
}
- // }
});
};
// 返回
@@ -392,6 +199,27 @@ const cancelForm = () => {
router.back();
};
+// 点击展现 巡检点
+function checkoutItemPoint(pop) {
+ const find = pointslist.value.find((item) => item.id === pop.id);
+ if (find && find.location) {
+ const locations =
+ find.location
+ .split(',')
+ .map((item: string) => Number(item))
+ .filter(Boolean) ?? [];
+ if (locations.length >= 2) {
+ GDef.value.addMarker_more(locations, find.pointName, find.id);
+ if (checkoutPointlist.value.includes(pop.id)) {
+ checkoutPointlist.value = checkoutPointlist.value.filter((item) => item !== pop.id);
+ } else {
+ checkoutPointlist.value.push(pop.id);
+ }
+ } else {
+ ElMessage.error(find.pointName + ' - 巡检点经纬度定位有误');
+ }
+ }
+}
onUnmounted(() => {
map.value?.destroy();
});
diff --git a/src/views/system/inspection/Task/addTask.vue b/src/views/system/inspection/Task/addTask.vue
index 668c175..28b0552 100644
--- a/src/views/system/inspection/Task/addTask.vue
+++ b/src/views/system/inspection/Task/addTask.vue
@@ -57,14 +57,12 @@
-->
-
+
-
+
提交
@@ -81,11 +79,11 @@ import RepairUser from '@/components/Holder/repairUser.vue';
import PageHeader from '@/components/Pageheader/index.vue';
import { Delete, Plus } from '@element-plus/icons-vue';
import { ref } from 'vue';
-import AMapLoader from '@amap/amap-jsapi-loader';
import { listPlan } from '@/api/system/InspectionPlan';
import { addTask, getTask, updateTask } from '@/api/system/InspectionTask';
import { getRoute } from '@/api/system/InspectionRoute';
-import { RouteVO } from '@/api/system/InspectionRoute/type';
+
+import GD from '@/components/Map/GD.vue';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_inspection_remind_tiime } = toRefs(proxy?.useDict('com_inspection_remind_tiime'));
@@ -148,13 +146,11 @@ async function init() {
};
taskTime.value = res.data.taskTime ? res.data.taskTime.split(' - ') : [];
checkoutUserlist.value = Array.isArray(res.data.inspectorInfo) ? res.data.inspectorInfo : [res.data.inspectorInfo];
- handlChangeMap(res.data.planId);
+ handleChangeMap(res.data.planId);
});
}
}
-init();
-
// 选择 巡检人员
const RepairUserRef = ref>();
function handleAddUser() {
@@ -172,101 +168,47 @@ function handleDelete(id) {
function routeback() {
router.back();
}
-
-const AMapLib = ref(null);
-const map = ref(null);
-const mapReady = ref(false);
-
const maploading = ref(false);
-// 地图覆盖物
-const markerlist = [];
-// 选择计划f
-function handlChangeMap(val: string) {
- // 清楚 覆盖物
- if (markerlist.length > 0) {
- map.value.remove(markerlist);
- }
- if (val) {
- // 查找计划id
- const find = planlist.value.find((item) => item.id === val);
- if (find) {
- const route = find.routeList.pop();
- // 查找路线
- getRoute(route.id).then((res) => {
- handleRoute(res.data);
- });
- }
- }
-}
+const GDef = ref(null);
-// 处理 巡检路线 巡检点数据
-function handleRoute(route: RouteVO) {
+function handleChangeMap(val: string) {
maploading.value = true;
- // ! 添加点
- if (route.points && route.points.length > 0) {
- route.points.forEach((item, index) => {
- const lnglat = item.location.split(',').map(Number);
- const marker = new AMapLib.value.Marker({
- position: new AMapLib.value.LngLat(lnglat[0], lnglat[1]), //经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9]
- title: item.pointName,
- content: `
- `
- });
- //将创建的点标记添加到已有的地图实例:
- map.value.add(marker);
- markerlist.push(marker);
- });
+ const find = planlist.value.find((item) => item.id === val);
+ if (find) {
+ const route = find.routeList[find.routeList.length - 1];
+ if (route) {
+ getRoute(route.id)
+ .then((res) => {
+ if (res) {
+ GDef.value.clearMapMarker();
+ if (res.data.points && res.data.points.length > 0) {
+ res.data.points.forEach((item) => {
+ const angular = item.location.split(',').map(Number).filter(Boolean);
+ GDef.value.addMarker_more(angular, item.pointName, item.id);
+ });
+ }
+ // 巡检路线
+ if (res.data.pathPoints) {
+ GDef.value.renderSavedPath(res.data.pathPoints);
+ }
+ }
+ })
+ .finally(() => {
+ maploading.value = false;
+ });
+ } else {
+ maploading.value = false;
+ }
+ } else {
+ maploading.value = false;
}
- // ! 添加路线
- if (route.pathPoints && typeof route.pathPoints === 'string') {
- const path = JSON.parse(route.pathPoints);
- //创建 Polyline 实例
- const polyline = new AMapLib.value.Polyline({
- path: path,
- strokeWeight: 2, //线条宽度
- strokeColor: 'red', //线条颜色
- lineJoin: 'round' //折线拐点连接处样式
- });
- map.value.add(polyline);
- markerlist.push(polyline);
- }
-
- // 自动 适应 范围
- map.value.setFitView();
- maploading.value = false;
}
-const aloaderkey = import.meta.env.VITE_GCJ02_KEY_GD;
-const VITE_GCJ02_JS_CODE_GD = import.meta.env.VITE_GCJ02_JS_CODE_GD;
-onMounted(async () => {
- await nextTick();
- window._AMapSecurityConfig = { securityJsCode: VITE_GCJ02_JS_CODE_GD };
- AMapLoader.load({
- key: aloaderkey,
- version: '2.0',
- plugins: ['AMap.Scale', 'AMap.Marker']
- }).then(async (AMap) => {
- AMapLib.value = AMap;
- map.value = new AMap.Map('TaskMapBox', {
- viewMode: '3D',
- zoom: 11,
- center: [116.397428, 39.90923]
- });
- mapReady.value = true;
- });
+onMounted(() => {
+ init();
});
+
const formRef = ref();
function submit() {
if (taskTime.value.length > 0) {
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index b197a03..38f470d 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -8,9 +8,6 @@
-
@@ -66,12 +63,12 @@
-
+
{{ scope.row.createTime }}
-
+
修改
删除
@@ -81,7 +78,7 @@
-
+
@@ -171,7 +168,7 @@ const data = reactive>({
const { queryParams, form, rules } = toRefs(data);
-/** 查询公告列表 */
+/** 查询公告列表╬ */
const getList = async () => {
loading.value = true;
listNotice(queryParams.value)
diff --git a/src/views/system/parking/addParking.vue b/src/views/system/parking/addParking.vue
index 4f88c4d..0438cf2 100644
--- a/src/views/system/parking/addParking.vue
+++ b/src/views/system/parking/addParking.vue
@@ -80,7 +80,7 @@
-
+
请选择
@@ -150,7 +150,7 @@ const rules = ref({
contactPhone: [
{ required: true, message: '请输入联系人电话', trigger: 'blur' },
{
- validator: (rule, value, callback) => {
+ validator: (_: any, value: string | number, callback: (arg0?: Error) => void) => {
if (!validator(value, 'phone')) {
callback(new Error('请输入正确的手机号码'));
} else {
@@ -200,7 +200,6 @@ function choiceResidentFun() {
function handleChange(pop) {
holderInfo.value = null;
holderInfo.value = pop;
- console.log(pop);
form.value.residentId = '';
form.value.residentName = '';
if (pop !== null) {
@@ -288,7 +287,7 @@ const cancelForm = () => {
border: 1px solid #ccc;
border-radius: 5px;
padding: 0 10px;
- .defaultbox {
+ .defaultBox {
display: flex;
align-items: center;
justify-content: space-between;
diff --git a/src/views/system/parking/index.vue b/src/views/system/parking/index.vue
index d1e64a6..0551e7b 100644
--- a/src/views/system/parking/index.vue
+++ b/src/views/system/parking/index.vue
@@ -75,7 +75,7 @@
-
+
-
@@ -31,12 +30,11 @@
>
-
+
-
+
-
@@ -46,7 +44,6 @@
-
提交
返回
@@ -76,13 +73,13 @@ const formRef = ref();
const userid = ref(null);
const form = ref({
'userId': null,
- 'userName': '', // >= 0 && <= 30 账号
+ 'userName': '', // >= 4 && <= 16 账号
'nickName': '', // >= 0 && <= 30 昵称
// 'userType': '', // 用户类型(sys_user系统用户)
'villageIds': '', // 管理小区id串
'email': '', // >= 0 && <= 50
'phonenumber': '', // 手机号码
- 'sex': '', // 0男 1女 2未知
+ 'sex': '0', // 0男 1女 2未知
'status': '0', // (0正常 1停用)
'password': '', // 密码
'roleIds': '', // 角色组
@@ -97,10 +94,13 @@ const rules = ref({
// 登录账号:必填,长度限制,通常建议增加唯一性校验(需后端配合或异步校验)
userName: [
{ required: true, message: '请输入登录账号', trigger: 'blur' },
- { min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' }
+ { min: 4, max: 16, message: '长度在 4 到 16 个字符', trigger: 'blur' }
],
// 登录密码:必填,新增时必填,编辑时可选(通常逻辑),这里暂按必填处理,建议长度限制
- password: [{ min: 5, max: 20, message: '长度在 5 到 20 个字符', trigger: 'blur' }],
+ password: [
+ { required: true, message: '请输入登录密码', trigger: 'blur' },
+ { min: 5, max: 20, message: '长度在 5 到 20 个字符', trigger: 'blur' }
+ ],
roleIds: [{ required: true, message: '请选择员工角色', trigger: 'change' }],
phonenumber: [
{
@@ -110,6 +110,7 @@ const rules = ref({
required: true
}
],
+ villageIds: [{ required: true, message: '请选择管理小区', trigger: 'blur' }],
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }]
});
// 选择小区
@@ -145,12 +146,12 @@ async function init() {
}
// 小区列表
-const vilageList = ref([]);
+const villageList = ref([]);
/** 查询小区列表 */
const getViliageList = async () => {
const res = await getCommunitylistAPI();
- vilageList.value = res.rows;
- console.log(vilageList.value);
+ villageList.value = res.rows;
+ console.log(villageList.value);
};
onMounted(() => {
getViliageList();
@@ -158,7 +159,6 @@ onMounted(() => {
});
function handleChangeVillage(value: string[]) {
- console.log(value);
form.value.villageIds = value.join(',');
}
@@ -233,7 +233,6 @@ const cancelForm = () => {
padding: 10px 5px;
li {
margin-right: 10px;
- margin-bottom: 10px;
display: flex;
align-items: center;
justify-content: space-between;
diff --git a/src/views/workflow/processDefinition/index.vue b/src/views/workflow/processDefinition/index.vue
index 848d4ca..3161030 100644
--- a/src/views/workflow/processDefinition/index.vue
+++ b/src/views/workflow/processDefinition/index.vue
@@ -435,7 +435,7 @@ const handleDelete = async (row?: FlowDefinitionVo) => {
await proxy?.$modal.confirm('是否确认删除流程定义编码为【' + defList + '】的数据项?');
loading.value = true;
await deleteDefinition(id).finally(() => (loading.value = false));
- await handleQuery();
+ handleQuery();
proxy?.$modal.msgSuccess('删除成功');
};
@@ -448,7 +448,7 @@ const handlePublish = async (row?: FlowDefinitionVo) => {
await publish(row.id).finally(() => (loading.value = false));
processDefinitionDialog.visible = false;
activeName.value = '0';
- await handleQuery();
+ handleQuery();
proxy?.$modal.msgSuccess('发布成功');
};
/** 挂起/激活 */
@@ -463,7 +463,7 @@ const handleProcessDefState = async (row: FlowDefinitionVo, status: number | str
loading.value = true;
await proxy?.$modal.confirm(msg);
await active(row.id, !!status);
- await handleQuery();
+ handleQuery();
proxy?.$modal.msgSuccess('操作成功');
} catch (error) {
row.activityStatus = status === 0 ? 1 : 0;
diff --git a/src/views/workflow/task/allTaskWaiting.vue b/src/views/workflow/task/allTaskWaiting.vue
index 48cdee1..f79c9b1 100644
--- a/src/views/workflow/task/allTaskWaiting.vue
+++ b/src/views/workflow/task/allTaskWaiting.vue
@@ -246,7 +246,7 @@ const handleUserTask = async (data) => {
await proxy?.$modal.confirm('是否确认提交?');
data.taskIdList = ids.value;
await urgeTask(data);
- messageTypeRef.value.close();
+ await messageTypeRef.value.close();
proxy?.$modal.msgSuccess('操作成功');
handleQuery();
};