6/23 更改高德地图组件,统一入口

This commit is contained in:
Zy
2026-06-23 17:07:48 +08:00
parent 826bf3c782
commit 33d35c8d70
30 changed files with 643 additions and 757 deletions

View File

@@ -36,7 +36,7 @@ VITE_LOGIN_BACK_URL_WORKBENCH_TRUE= false
VITE_APP_SHOW_WORK_PLATFORM = true
# 地图类型 天地图 or 高德地图 天地图 WGS84 高德地图 GCJ02, 高德地图 需要在高德地图官网申请key
# 地图类型 天地图 WGS84 高德地图 GCJ02, 高德地图 需要在高德地图官网申请key
# 高德地图 GCJ02
# 天地图 WGS84
VITE_APP_MAP_TYPE = 'GCJ02'

View File

@@ -30,7 +30,7 @@
"@vueuse/core": "14.2.1",
"animate.css": "4.1.1",
"await-to-js": "3.0.0",
"axios": "1.13.6",
"axios": "1.15.2",
"big.js": "^7.0.1",
"crypto-js": "4.2.0",
"echarts": "6.0.0",
@@ -86,7 +86,7 @@
"unplugin-icons": "23.0.1",
"unplugin-vue-components": "31.0.0",
"unplugin-vue-setup-extend-plus": "1.0.1",
"vite": "7.3.1",
"vite": "8.0.5",
"vite-plugin-svg-icons-ng": "^1.5.2",
"vite-plugin-vue-devtools": "8.0.7",
"vite-plugin-zip-pack": "^1.2.4",

View File

@@ -70,26 +70,6 @@ export interface RepairProjectForm extends BaseEntity {
* 状态 0启用 1停用
*/
status?: string;
/**
* 创建时间
*/
cretaeTime?: string;
/**
* 创建者
*/
createBy?: number;
/**
* 更新时间
*/
updateTime?: string;
/**
* 更新者
*/
updateBy?: number;
}
export interface RepairProjectQuery extends PageQuery {
@@ -122,9 +102,4 @@ export interface RepairProjectQuery extends PageQuery {
* 状态 0启用 1停用
*/
status?: string;
/**
* 日期范围参数
*/
params?: any;
}

View File

@@ -68,7 +68,7 @@ export const genCode = (tableId: string | number) => {
method: 'get'
});
};
253029745
// 同步数据库
export const synchDb = (tableId: string | number) => {
return request({

334
src/components/Map/GD.vue Normal file
View File

@@ -0,0 +1,334 @@
<script setup lang="ts">
import AMapLoader from '@amap/amap-jsapi-loader';
import { getVillageByIdAPI } from '@/api/system/community';
import { onUnmounted, ref, watch, onMounted, nextTick } from 'vue';
// 密钥配置
const autoloader = import.meta.env.VITE_GCJ02_KEY_GD;
const VITE_GCJ02_JS_CODE_GD = import.meta.env.VITE_GCJ02_JS_CODE_GD;
window._AMapSecurityConfig = { securityJsCode: VITE_GCJ02_JS_CODE_GD };
// 全局实例
const AMAP = ref<any>(null);
const map = ref<any>(null);
const mapReady = ref(false);
const maploading = ref(false);
const markers = ref<any[]>([]);
const mouseTool = ref<any>(null);
const AddMarkered = new Map<string, any>();
let drawnPolylines: any[] = [];
// Props & Emits
const props = defineProps({
disabled: {
type: Boolean,
default: false
},
clickOrDraw: {
type: Boolean,
default: false
},
smallScroll: {
type: Boolean,
default: false
}
});
const emits = defineEmits<{
clickPoint: [value: number[]];
}>();
// 对外暴露方法
defineExpose({
addMarker_only,
clearLocation,
addMarker_more,
clearAll,
getAllDrawLines,
renderSavedPath,
clearMapMarker
});
const village = localStorage.getItem('villageid');
// ===================== 工具函数 =====================
/** 地图完整可用校验 */
function isMapAvailable() {
return mapReady.value && map.value && AMAP.value;
}
/** 统一适配视野,无动画 + 留白 + 最大缩放限制 */
function fitMapView(overlays: any[]) {
if (!isMapAvailable() || overlays.length === 0) return;
// 第二个参数true关闭动画留白80px最大缩放18级
console.log(props.smallScroll);
map.value.setFitView(overlays, props.smallScroll);
}
// ===================== 渲染等待队列(响应式) =====================
type WaitMarkerItem = { angular: number[]; pointName: string };
type WaitMoreMarkerItem = { angular: number[]; pointName: string; pointId: string };
const waitQueue = ref<{
onlyPoints: WaitMarkerItem[];
point: WaitMoreMarkerItem[];
routes: string[];
clear: boolean;
}>({
onlyPoints: [],
point: [],
routes: [],
clear: false
});
// 地图就绪后批量执行队列任务
watch(mapReady, async (ready) => {
if (!ready || !isMapAvailable()) return;
await nextTick();
// 先执行清空
if (waitQueue.value.clear) {
map.value.clearMap();
AddMarkered.clear();
markers.value = [];
drawnPolylines = [];
waitQueue.value.clear = false;
}
// 批量多点标记
waitQueue.value.point.forEach((item) => addMarker_more(item.angular, item.pointName, item.pointId));
waitQueue.value.point = [];
// 单点标记
waitQueue.value.onlyPoints.forEach((item) => addMarker_only(item.angular, item.pointName));
waitQueue.value.onlyPoints = [];
// 路线回显
waitQueue.value.routes.forEach((pathStr) => renderSavedPath(pathStr));
waitQueue.value.routes = [];
});
// ===================== 单点标记 =====================
function addMarker_only(angular: number[], pointName: string) {
if (!isMapAvailable()) {
waitQueue.value.onlyPoints.push({ angular, pointName });
return;
}
clearLocation();
const marker = new AMAP.value.Marker({
position: angular,
map: map.value,
title: pointName || '巡检点',
content: `
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:rgba(26,117,255,0.3);">
<div style="width:20px;height:20px;border-radius:50%;line-height:20px;background:#1a75ff;color:#fff;font-size:20px;text-align:center;">1</div>
</div>`
});
markers.value = [marker];
fitMapView(markers.value);
return marker;
}
/** 清空单点标记 */
function clearLocation() {
if (!isMapAvailable() || markers.value.length === 0) return;
markers.value.forEach((item) => map.value.remove(item));
markers.value = [];
}
// ===================== 多点标记(可增删) =====================
function addMarker_more(angular: number[], pointName: string, pointId: string) {
if (!isMapAvailable()) {
waitQueue.value.point.push({ angular, pointName, pointId });
return;
}
// 存在则删除
if (AddMarkered.has(pointId)) {
map.value.remove(AddMarkered.get(pointId));
AddMarkered.delete(pointId);
// 删除后重新适配视野
fitMapView(Array.from(AddMarkered.values()));
return;
}
const index = AddMarkered.size + 1;
const marker = new AMAP.value.Marker({
position: angular,
map: map.value,
title: pointName || '巡检点',
content: `
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:rgba(26,117,255,0.3);">
<div style="width:20px;height:20px;border-radius:50%;line-height:20px;background:#1a75ff;color:#fff;font-size:20px;text-align:center;">${index}</div>
</div>`
});
AddMarkered.set(pointId, marker);
markers.value.push(marker);
fitMapView(Array.from(AddMarkered.values()));
return marker;
}
// ===================== 绘制路线 =====================
function MapDrawLine() {
if (!isMapAvailable()) return;
mouseTool.value = new AMAP.value.MouseTool(map.value);
mouseTool.value.on('draw', (e: any) => {
if (!e.obj) return;
// 只保留一条线
if (drawnPolylines.length > 0) map.value.remove(drawnPolylines[0]);
drawnPolylines = [e.obj];
initDrawTool();
});
initDrawTool();
}
function initDrawTool() {
if (!mouseTool.value || !isMapAvailable()) return;
mouseTool.value.close(false);
mouseTool.value.polyline({
strokeColor: '#3366FF',
strokeOpacity: 1,
strokeWeight: 3,
strokeStyle: 'solid'
});
}
/** 获取路线坐标数组 */
function getAllDrawLines(): number[][] {
if (!isMapAvailable() || drawnPolylines.length === 0) return [];
const path = drawnPolylines[0].getPath();
return path.map((p: any) => [p.lng, p.lat]);
}
/** 回显历史路线 */
function renderSavedPath(pathStr: string) {
if (!isMapAvailable()) {
waitQueue.value.routes.push(pathStr);
return;
}
try {
const path = JSON.parse(pathStr);
if (!Array.isArray(path) || path.length === 0) return;
// 清空旧线
drawnPolylines.forEach((line) => map.value.remove(line));
drawnPolylines = [];
const polyline = new AMAP.value.Polyline({
path,
strokeColor: '#3366FF',
strokeOpacity: 1,
strokeWeight: 3,
strokeStyle: 'solid',
map: map.value
});
drawnPolylines.push(polyline);
fitMapView([polyline]);
} catch (err) {
console.error('路线解析失败', err);
}
}
/** 清空绘图工具+路线 */
function clearAll() {
if (!isMapAvailable() || !mouseTool.value) return;
mouseTool.value.close(true);
drawnPolylines.forEach((line) => map.value.removeOverlay(line));
drawnPolylines = [];
initDrawTool();
}
/** 清空地图所有覆盖物(标记+路线) */
function clearMapMarker() {
if (isMapAvailable()) {
map.value.clearMap();
AddMarkered.clear();
markers.value = [];
drawnPolylines = [];
} else {
waitQueue.value.clear = true;
}
}
/** 地图点击拾取坐标 */
function handleMap() {
if (!isMapAvailable()) return;
map.value.on('click', (e: any) => {
const { lng, lat } = e.lnglat;
emits('clickPoint', [lng, lat]);
});
}
// ===================== 地图初始化 =====================
onMounted(async () => {
maploading.value = true;
try {
const AMap = await AMapLoader.load({
key: autoloader,
version: '2.0',
plugins: ['AMap.Scale', 'AMap.Marker', 'AMap.Geocoder', 'AMap.MouseTool']
});
AMAP.value = AMap;
// 获取村庄城市定位
const villageInfo = await getVillageByIdAPI(village);
const city = villageInfo.data.city.replaceAll('/', '');
// 创建地图,全局关闭动画,解决移动缓慢
map.value = new AMap.Map('GD-Map', {
viewMode: '3D',
zoom: 11,
center: [116.397428, 39.90923]
});
// 城市地理编码定位
const geocoder = new AMap.Geocoder({ city });
geocoder.getLocation(city, (status: string, result: any) => {
if (status === 'complete' && result.info === 'OK') {
map.value.setCenter(result.geocodes[0].location.toArray());
}
});
mapReady.value = true;
// 禁用状态不开启绘制/点击
if (!props.disabled) {
props.clickOrDraw ? handleMap() : MapDrawLine();
}
} catch (err) {
console.error('高德地图加载失败', err);
} finally {
maploading.value = false;
}
});
// ===================== 销毁清理 =====================
onUnmounted(() => {
// 销毁地图实例
map.value?.destroy();
// 清空所有缓存队列
waitQueue.value.onlyPoints = [];
waitQueue.value.point = [];
waitQueue.value.routes = [];
waitQueue.value.clear = false;
// 清空覆盖物缓存
markers.value = [];
drawnPolylines = [];
AddMarkered.clear();
mouseTool.value = null;
AMAP.value = null;
map.value = null;
mapReady.value = false;
});
</script>
<template>
<div v-loading="maploading" class="map" id="GD-Map"></div>
</template>
<style scoped lang="scss">
.map {
width: 100%;
min-height: 450px;
background-color: #f0f0f0;
border: 1px solid #ccc;
border-radius: 4px;
margin-top: 10px;
}
</style>

View File

@@ -0,0 +1,9 @@
<script setup lang="ts"></script>
<template>
<div>
<!-- 天地图-->
</div>
</template>
<style scoped lang="scss"></style>

View File

@@ -0,0 +1,14 @@
<script setup name="MapIndex" lang="ts">
import TDT from './TDT.vue';
import GD from './GD.vue';
const isGD = import.meta.env.VITE_APP_MAP_TYPE === 'GCJ02';
</script>
<template>
<div>
<!-- 天地图 -->
<TDT v-if="!isGD"></TDT>
<!-- 高德地图-->
<GD v-else></GD>
</div>
</template>
<style scoped lang="scss"></style>

View File

@@ -150,7 +150,7 @@ const getList = () => {
});
};
const pageList = async () => {
await getList();
getList();
const roles = roleList.value.filter((item) => {
return selectRoleList.value.some((role) => role.roleId === item.roleId);
});

View File

@@ -35,15 +35,42 @@
<el-table v-loading="loading" border :data="activityList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="封面" align="center">
<template #default="scope">
<el-image
preview-teleported
lazy
:preview-src-list="[scope.row.coverImage]"
v-if="scope.row.coverImage"
:src="scope.row.coverImage"
fit="cover"
></el-image>
<span v-else style="color: grey">暂无</span>
</template>
</el-table-column>
<el-table-column label="标题" align="center" prop="title" />
<el-table-column label="作者" align="center" prop="author" />
<el-table-column label="发布状态" align="center" prop="status">
<el-table-column label="主办方" align="center" prop="organizer" />
<el-table-column label="发布状态" width="100" align="center" prop="status">
<template #default="scope">
<DictTag :value="scope.row.status" :options="com_publish_status"></DictTag>
</template>
</el-table-column>
<el-table-column label="浏览量" align="center" prop="pageViews" />
<el-table-column label="发布人" align="center" prop="createName" />
<el-table-column label="活动时间" align="center">
<template #default="scope">
<span>{{ scope.row.startTime }}</span>
<span> -- </span>
<span>{{ scope.row.endTime }}</span>
</template>
</el-table-column>
<el-table-column label="活动地点" align="center" prop="address" />
<el-table-column label="联系人" width="120" align="center" prop="contactName" />
<el-table-column label="联系电话" width="120" align="center" prop="contactPhone" />
<el-table-column label="活动名额" width="80" align="center" prop="contactPhone">
<template #default="scope">
<span v-if="scope.row.quota === 0">无限制</span>
<span v-else>{{ scope.row.quota }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="300px" fixed="right">
<template #default="scope">
<el-button v-if="scope.row.status === '0'" link type="primary" @click="handleSend(scope.row)">发布</el-button>

View File

@@ -75,8 +75,7 @@
<el-form ref="formRef" :rules="rules" class="m-auto" :inline="false" label-width="100px" :model="form">
<el-form-item label="处理状态" prop="status">
<el-radio-group v-model="form.status">
<!-- <el-radio v-for="(item, index) in com_complaint_status" :key="index" :value="item.value">{{ item.label }}</el-radio> -->
<el-radio value="1">处理完成</el-radio>
<el-radio value="2">处理完成</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="处理人员" prop="handleId">
@@ -92,7 +91,7 @@
<el-input type="textarea" :rows="5" v-model="form.handleContent"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button type="primary" v-if="form.status === '0'" @click="submitForm">提交</el-button>
<el-button @click="handleBack">返回</el-button>
</el-form-item>
</el-form>
@@ -124,7 +123,7 @@ const form = ref({
'complaintName': '',
'phone': '',
'problemImageUrl': '',
'status': '1', // 投诉状态 0待处理 1已处理
'status': '2', // 投诉状态 0待处理 1处理中 2已处理
'handleId': '',
'handleName': '',
'handleContent': '',
@@ -145,7 +144,6 @@ async function init() {
...res.data
};
problemImageUrlList.value = res.data.problemImageUrl ? res.data.problemImageUrl.split(',') : [];
form.value.status = '1';
const find = res2.rows.find((item) => item.id === form.value.typeId);
if (find) {
form.value.type = find.name;

View File

@@ -34,13 +34,14 @@
<dict-tag :options="com_complaint_status" :value="scope.row.status"></dict-tag>
</template>
</el-table-column>
<el-table-column label="处理人" align="center" prop="handleName" />
<el-table-column label="处理描述" show-overflow-tooltip align="center" prop="handleContent" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" @click="handleUpdate(scope.row)" v-has-permi="['complaint:complaint:query']">查看详情</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
</div>
@@ -98,7 +99,7 @@ const data = reactive<PageData<ComplaintForm, ComplaintQuery>>({
const { queryParams } = toRefs(data);
const complainTypeList = ref([]);
/** 查询投诉管理列表 */
/** 查询投诉管理列表 ╬╬╬*/
const getList = async () => {
loading.value = true;
const res2 = await listComplaintType();

View File

@@ -48,7 +48,7 @@
v-model="checkDate"
type="daterange"
placeholder="选择日期"
@change="handlDate"
@change="handleDate"
value-format="YYYY-MM-DD"
/>
</el-form-item>
@@ -115,7 +115,7 @@ const form = ref({
endTime: '' // 结束日期
});
const checkDate = ref([]);
function handlDate() {
function handleDate() {
form.value.startTime = checkDate.value[0];
form.value.endTime = checkDate.value[1];
}
@@ -124,7 +124,7 @@ const rules = ref({
cardName: [
{ required: true, message: '请输入姓名', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'ChineseName'),
validator: (_: any, value: string | number) => validator(value, 'ChineseName'),
message: '请输入正确的中文姓名',
trigger: 'blur'
}
@@ -132,7 +132,7 @@ const rules = ref({
handleName: [
{ required: true, message: '请输入姓名', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'ChineseName'),
validator: (_: any, value: string | number) => validator(value, 'ChineseName'),
message: '请输入正确的中文姓名',
trigger: 'blur'
}
@@ -140,7 +140,7 @@ const rules = ref({
phone: [
{ required: true, message: '请输入手机号', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'phone'),
validator: (_: any, value: string | number) => validator(value, 'phone'),
message: '请输入正确的手机号码',
trigger: 'blur'
}
@@ -148,7 +148,7 @@ const rules = ref({
carNum: [
{ required: true, message: '请输入车牌号', trigger: 'blur' },
{
validator: (rule: any, value: string, callback: any) => {
validator: (_: any, value: string, callback: any) => {
if (!value) {
callback();
return;
@@ -166,7 +166,7 @@ const rules = ref({
payMethod: [{ required: true, message: '请选择支付方式', trigger: 'blur' }],
cost: [
{
validator: (_, value) => validator(value, 'money'),
validator: (_: any, value: string | number) => validator(value, 'money'),
message: '请输入正确的金额,最多两位小数',
trigger: 'blur',
required: true
@@ -198,12 +198,12 @@ const submitForm = () => {
ElMessage.warning('请选择有效日期');
}
if (userid.value) {
updateMonthCard(form.value).then((res) => {
updateMonthCard(form.value).then(() => {
ElMessage.success('编辑成功');
cancelForm();
});
} else {
addMonthCard(form.value).then((res) => {
addMonthCard(form.value).then(() => {
ElMessage.success('添加成功');
cancelForm();

View File

@@ -20,19 +20,6 @@
<el-card shadow="never" class="flex-1">
<template #header>
<el-row :gutter="10" class="mb8">
<!-- <el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-has-permi="['repair:add:noticepc']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-has-permi="['repair:edit:noticepc']"
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-has-permi="['notice:notice:remove']"
>删除</el-button
>
</el-col> -->
<right-toolbar
:disable-delete="multiple"
:disable-edit="single"
@@ -82,7 +69,7 @@
</template>
<script setup name="Notice" lang="ts">
import { listNotice, delNotice } from '@/api/system/NoticePc/index';
import { listNotice, delNotice } from '@/api/system/NoticePc';
import { NoticeVO, NoticeQuery, NoticeForm } from '@/api/system/NoticePc/type';
import { checkPermi } from '@/utils/permission';
@@ -91,7 +78,6 @@ const { com_noticepc_level } = toRefs<any>(proxy?.useDict('com_noticepc_level'))
const { com_publish_status } = toRefs<any>(proxy?.useDict('com_publish_status'));
const noticeList = ref<NoticeVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
@@ -101,11 +87,6 @@ const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: NoticeForm = {
noticeId: undefined,
noticeTitle: undefined,
@@ -138,7 +119,7 @@ const data = reactive<PageData<NoticeForm, NoticeQuery>>({
}
});
const { queryParams, form, rules } = toRefs(data);
const { queryParams } = toRefs(data);
/** 查询公告信息列表 */
const getList = async () => {
@@ -180,7 +161,7 @@ const handleAdd = () => {
};
/** 修改按钮操作 */
const handleUpdate = async (row?: NoticeVO) => {
const handleUpdate = (row?: NoticeVO) => {
const _id = row?.noticeId || ids.value[0];
router.push({
path: '/repair/editNoticePc',

View File

@@ -72,10 +72,10 @@
<script setup lang="ts">
import pagination from '@/components/Pagination/index.vue';
import { getNotificationList, NotificationVo, ReadNotificationByID } from '@/api/system/Notification/index';
import { getNotificationList, NotificationVo, ReadNotificationByID } from '@/api/system/Notification';
import { ref } from 'vue';
// 1 代办 2通知
// 1 代办 2 通知
const activeTabs = ref(1);
const todonum = computed(() => {
return awaittoList.value.filter((item) => isdisable(item)).length;

View File

@@ -9,7 +9,7 @@
<el-col :span="11">
<el-form-item label="区域" prop="areaId">
<el-select @change="handleArea" v-model="form.areaId" placeholder="请选择区域" clearable>
<el-option v-for="dict in CarArealist" :key="dict.id" :label="dict.areaName" :value="dict.id" />
<el-option v-for="dict in CarRealist" :key="dict.id" :label="dict.areaName" :value="dict.id" />
</el-select>
</el-form-item>
</el-col>
@@ -17,7 +17,7 @@
<el-col :span="11">
<el-form-item label="选择车位" prop="parkingId">
<el-select v-model="form.parkingId" placeholder="请选择车位">
<el-option v-for="dict in Parkinglist" :key="dict.id" :label="dict.parkingCode" :value="dict.id" />
<el-option v-for="dict in parkingList" :key="dict.id" :label="dict.parkingCode" :value="dict.id" />
</el-select>
</el-form-item>
</el-col>
@@ -56,7 +56,7 @@
v-model="checkDate"
type="datetimerange"
placeholder="选择日期"
@change="handlDate"
@change="handleDate"
format="YYYY-MM-DD HH:mm"
value-format="YYYY-MM-DD HH:mm"
/>
@@ -139,7 +139,7 @@ const form = ref({
});
const checkDate = ref([]);
// 改变时间日期
function handlDate() {
function handleDate() {
form.value.startTime = checkDate.value[0];
form.value.endTime = checkDate.value[1];
}
@@ -150,7 +150,7 @@ const rules = ref({
payerName: [
{ required: true, message: '请输入缴纳人姓名', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'ChineseName'),
validator: (_: any, value: string) => validator(value, 'ChineseName'),
message: '请输入缴纳人姓名',
trigger: 'blur'
}
@@ -158,7 +158,7 @@ const rules = ref({
carNum: [
{ required: true, message: '请绑定车牌号', trigger: 'blur' },
{
validator: (rule: any, value: string, callback: any) => {
validator: (_: any, value: string, callback: any) => {
if (!value) {
callback();
return;
@@ -177,7 +177,7 @@ const rules = ref({
cost: [
{ required: true, message: '请输入费用', trigger: 'blur' },
{
validator: (_, value) => validator(value, 'money'),
validator: (_: any, value: number) => validator(value, 'money'),
message: '请输入费用',
trigger: 'blur'
}
@@ -189,12 +189,12 @@ function handleValidate() {
const userid = ref(null);
// 区域
const CarArealist = ref([]);
const CarRealist = ref([]);
// 车位
const Parkinglist = ref([]);
const parkingList = ref([]);
function init() {
listArea().then((res) => {
CarArealist.value = res.rows;
CarRealist.value = res.rows;
});
if (route.query.id) {
userid.value = route.query.id;
@@ -217,7 +217,7 @@ function handleArea(val: string) {
pageNum: 1,
pageSize: 999999999
}).then((res) => {
Parkinglist.value = res.rows;
parkingList.value = res.rows;
});
}
@@ -227,14 +227,13 @@ const submitForm = () => {
formRef.value?.validate(async (valid: boolean) => {
if (valid) {
if (userid.value) {
updateParkingCost(form.value).then((res) => {
updateParkingCost(form.value).then(() => {
ElMessage.success('编辑成功');
cancelForm();
});
} else {
addParkingCost(form.value).then((res) => {
addParkingCost(form.value).then(() => {
ElMessage.success('添加成功');
cancelForm();
});
}

View File

@@ -1,6 +1,6 @@
<template>
<div class="h-full flex flex-col p-2">
<pageheader title="报修项目"></pageheader>
<pageHeader title="报修项目"></pageHeader>
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
@@ -20,18 +20,6 @@
<el-card class="flex-1" shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<!-- <el-button style="width: 100px" type="primary" plain icon="Plus" @click="handleAdd" v-has-permi="['repairProject:repairProject:add']"
>新增维修类</el-button
>
<el-button
type="danger"
plain
icon="Delete"
:disabled="multiple"
@click="handleDelete()"
v-has-permi="['repairProject:repairProject:remove']"
>删除</el-button
> -->
<right-toolbar
:disable-delete="multiple"
:disable-edit="single"
@@ -102,51 +90,14 @@
</template>
</el-table-column>
</el-table>
<!-- <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> -->
</el-card>
<!-- 添加或修改报修维修项目管理对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="repairProjectFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="维修项目名" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入维修项目名" />
</el-form-item>
<el-form-item label="父级项目id" prop="parentId">
<el-input v-model="form.parentId" placeholder="请输入父级项目id" />
</el-form-item>
<el-form-item label="项目层级 01" prop="projectLevel">
<el-input v-model="form.projectLevel" placeholder="请输入项目层级 01" />
</el-form-item>
<el-form-item label="排序 " prop="sortOrder">
<el-input v-model="form.sortOrder" placeholder="请输入排序 " />
</el-form-item>
<el-form-item label="创建时间" prop="cretaeTime">
<el-date-picker clearable v-model="form.cretaeTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择创建时间">
</el-date-picker>
</el-form-item>
<el-form-item label="创建者" prop="createBy">
<el-input v-model="form.createBy" placeholder="请输入创建者" />
</el-form-item>
<el-form-item label="更新时间" prop="updateTime">
<el-date-picker clearable v-model="form.updateTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择更新时间">
</el-date-picker>
</el-form-item>
<el-form-item label="更新者" prop="updateBy">
<el-input v-model="form.updateBy" placeholder="请输入更新者" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="RepairProject" lang="ts">
import { listRepairProject, delRepairProject, addRepairProject, updateRepairProject } from '@/api/system/RepairProject';
import pageHeader from '@/components/Pageheader/index.vue';
import DictTag from '@/components/DictTag/index.vue';
import { listRepairProject, delRepairProject } from '@/api/system/RepairProject';
import { RepairProjectVO, RepairProjectQuery, RepairProjectForm } from '@/api/system/RepairProject/type';
import { checkPermi } from '@/utils/permission';
@@ -157,7 +108,6 @@ const { com_repair_project_types } = toRefs<any>(proxy?.useDict('com_repair_proj
const router = useRouter();
const repairProjectList = ref<RepairProjectVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
@@ -166,12 +116,6 @@ const multiple = ref(true);
const total = ref(0);
const queryFormRef = ref<ElFormInstance>();
const repairProjectFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: RepairProjectForm = {
id: undefined,
@@ -181,7 +125,6 @@ const initFormData: RepairProjectForm = {
projectLevel: undefined,
sortOrder: undefined,
status: undefined,
cretaeTime: undefined,
createBy: undefined,
updateTime: undefined,
updateBy: undefined
@@ -201,7 +144,7 @@ const data = reactive<PageData<RepairProjectForm, RepairProjectQuery>>({
rules: {}
});
const { queryParams, form, rules } = toRefs(data);
const { queryParams } = toRefs(data);
/** 查询报修维修项目管理列表 */
const getList = async () => {
@@ -229,18 +172,6 @@ const getList = async () => {
loading.value = false;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
repairProjectFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
@@ -268,7 +199,7 @@ const handleAdd = () => {
};
/** 修改按钮操作 */
const handleUpdate = async (row?: RepairProjectVO) => {
const handleUpdate = (row?: RepairProjectVO) => {
const _id = row?.id || ids.value[0];
router.push({
path: '/system/editRepairProjectList',
@@ -278,25 +209,12 @@ const handleUpdate = async (row?: RepairProjectVO) => {
});
};
/** 提交按钮 */
const submitForm = () => {
repairProjectFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
await updateRepairProject(form.value).finally(() => (buttonLoading.value = false));
} else {
await addRepairProject(form.value).finally(() => (buttonLoading.value = false));
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: RepairProjectVO) => {
if (row.projectLevel === 0 && row.children && Array.isArray(row.children) && row.children.length > 0) {
await proxy?.$modal.confirm('当前分类下存在子级数据,请先删除所有子级内容后,再删除当前父级!').finally(() => (loading.value = false));
return;
}
const _ids = row?.id || ids.value;
await proxy?.$modal.confirm('该信息删除后无法恢复,确定要删除吗?').finally(() => (loading.value = false));
await delRepairProject(_ids);

View File

@@ -193,7 +193,7 @@ const handleAdd = () => {
};
/** 修改按钮操作 */
const handleUpdate = async (row?: ChargeItemVO) => {
const handleUpdate = (row?: ChargeItemVO) => {
const _ids = row?.id || ids.value[0];
router.push({
path: '/sdb/editchargeItem',

View File

@@ -38,12 +38,14 @@
</template>
</el-table-column>
<el-table-column label="访客联系方式" align="center" prop="visitorPhone" />
<el-table-column label="来访时间" align="center" prop="startTime" width="180">
<el-table-column label="来访时间" align="center" prop="startTime">
<template #default="scope">
<span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span>
<span>{{ scope.row.startTime }}</span>
<span> -- </span>
<span>{{ scope.row.endTime }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="操作" width="100" align="center" fixed="right">
<template #default="scope">
<el-button link type="primary" @click="handleMain(scope.row)" v-has-permi="['visitor:visitor:query']">访客详情</el-button>
</template>

View File

@@ -92,16 +92,7 @@ import { formatTimeDiff } from '@/utils/time';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_user_sex } = toRefs<any>(proxy?.useDict('sys_user_sex'));
const tableData = ref([
{
date: '',
name: '西大门'
},
{
date: '',
name: '西大门'
}
]);
const tableData = ref([]);
const userid = ref(null);
const route = useRoute();
@@ -138,9 +129,7 @@ function init() {
init();
function back() {
router.push({
path: '/repair/visitorlist'
});
router.back();
}
</script>

View File

@@ -42,7 +42,8 @@
<el-table-column label="区域编号" align="center" prop="areaCode" />
<el-table-column label="面积" align="center" prop="area" width="90">
<template #default="scope">
{{ scope.row.area + ' m²' }}
<span v-if="scope.row.area">{{ scope.row.area + ' m²' }}</span>
<span v-else> --- </span>
</template>
</el-table-column>
<el-table-column label="车位数量" align="center" prop="parkingCount" width="90" />

View File

@@ -61,10 +61,10 @@
</el-select>
</el-form-item>
<el-form-item label="计划路线">
<el-select @change="handlChangeMap" v-model="form.routeIds" placeholder="请选择" style="width: 100%">
<el-select @change="handleChangeMap" v-model="form.routeIds" placeholder="请选择" style="width: 100%">
<el-option v-for="item in playlist" :key="item.value" :label="item.routeName" :value="item.id" />
</el-select>
<div class="mapbox" id="PlanMapBox"></div>
<GD ref="GDef" :disabled="true"></GD>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submit">提交</el-button>
@@ -81,9 +81,10 @@ import { listRoute } from '@/api/system/InspectionRoute';
import PageHeader from '@/components/Pageheader/index.vue';
import { numToWeek } from '@/utils/time';
import { ref } from 'vue';
import AMapLoader from '@amap/amap-jsapi-loader';
import { addPlan, getPlan, updatePlan } from '@/api/system/InspectionPlan';
import { Check } from '@element-plus/icons-vue';
import GD from '@/components/Map/GD.vue';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_inspection_remind_tiime } = toRefs<any>(proxy?.useDict('com_inspection_remind_tiime'));
@@ -165,88 +166,37 @@ async function init() {
taskTime.value = [['', '']];
}
handlChangeMap(res.data.routeIds);
handleChangeMap(res.data.routeIds);
});
}
}
init();
// 返回
function outback() {
router.back();
}
const AMapLib = ref(null);
const map = ref(null);
const mapReady = ref(false);
const GDef = ref(null);
const markerlist = [];
function handlChangeMap(val: string) {
map.value.remove(markerlist);
function handleChangeMap(val: string) {
if (val) {
GDef.value.clearMapMarker();
const find = playlist.value.find((item) => item.id === val);
if (find) {
if (find.points && find.points.length > 0) {
find.points.forEach((item: { location: string; pointName: any }, index: number) => {
const angular = item.location.split(',').map(Number);
const marker = new AMapLib.value.Marker({
position: new AMapLib.value.LngLat(angular[0], angular[1]), //经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9]
title: item.pointName,
content: `
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;line-height:18px;border-radius:50%;background-color:rgba(26,117,255,0.3);">
<div
style=" width: 20px;
border-radius: 50%;
height: 20px;
line-height: 20px;
background-color: rgba(26,117,255,1);
color: #ffffff;
font-size: 20px;
text-align: center;"
>${index + 1}</div>
</div>`
});
//将创建的点标记添加到已有的地图实例:
map.value.add(marker);
markerlist.push(marker);
find.points.forEach((item) => {
const angular = item.location.split(',').map(Number).filter(Boolean);
GDef.value.addMarker_more(angular, item.pointNames, item.id);
});
}
if (find.pathPoints && typeof find.pathPoints === 'string') {
const path = JSON.parse(find.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();
// 巡检路线
if (find.pathPoints) {
GDef.value.renderSavedPath(find.pathPoints);
}
}
}
const autoloader = 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: autoloader,
version: '2.0',
plugins: ['AMap.Scale', 'AMap.Marker']
}).then(async (AMap) => {
AMapLib.value = AMap;
map.value = new AMap.Map('PlanMapBox', {
viewMode: '3D',
zoom: 11,
center: [116.397428, 39.90923]
});
mapReady.value = true;
});
onMounted(() => {
init();
});
const formRef = ref();
function submit() {

View File

@@ -38,10 +38,19 @@
</el-radio-group>
</el-form-item>
<el-form-item label="巡检点位置" prop="location">
<div class="map" id="containerMap"></div>
<GD :click-or-draw="true" ref="GDef" @click-point="handleClickPoint"></GD>
<div class="tips">
<span>点击地图选择位置</span>
<span class="deleteMarker" v-show="Boolean(marker)" @click="clearLocation">清空选择地点</span>
<span
class="deleteMarker"
v-show="Boolean(marker)"
@click="
() => {
GDef.clearLocation();
}
"
>清空选择地点</span
>
</div>
</el-form-item>
<el-form-item style="margin-top: 30px">
@@ -62,13 +71,12 @@ import { ElMessage } from 'element-plus';
import PageHeader from '@/components/Pageheader/index.vue';
import { addPoint, getPoint, updatePoint } from '@/api/system/InspectionPoint';
import { listItem } from '@/api/system/InspectionItem';
import { onMounted, onUnmounted } from 'vue';
import AMapLoader from '@amap/amap-jsapi-loader';
import { getVillageByIdAPI } from '@/api/system/community';
import { onMounted } from 'vue';
import { Check } from '@element-plus/icons-vue';
import GD from '@/components/Map/GD.vue';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
// const { com_inspection_point_checkmode } = toRefs<any>(proxy?.useDict('com_inspection_point_checkmode'));
const { com_inspection_point_status } = toRefs<any>(proxy?.useDict('com_inspection_point_status'));
const router = useRouter();
@@ -97,6 +105,7 @@ const rules = ref({
const pointId = ref(null);
const pointItemlist = ref([]);
const checkoutPointItemlist = ref([]);
const marker = ref(null);
function checkoutItem(id: string) {
form.value.itemId = ''; // 每次点击都先清空 itemId
if (checkoutPointItemlist.value.includes(id)) {
@@ -128,10 +137,19 @@ function init() {
if (res.data.itemId) {
checkoutPointItemlist.value = res.data.itemId.split(',');
}
const location = form.value.location
.split(',')
.map((item) => Number(item))
.filter((item) => !Number.isNaN(item));
if (location.length >= 2) {
setTimeout(() => {
marker.value = GDef.value.addMarker_only(location);
}, 500);
}
});
}
}
init();
// !== 提交 =============================================================================
const submitForm = () => {
@@ -140,12 +158,12 @@ const submitForm = () => {
// 设置 itemId
form.value.itemId = checkoutPointItemlist.value.join(',');
if (pointId.value) {
updatePoint(form.value).then((res) => {
updatePoint(form.value).then(() => {
ElMessage.success('编辑成功');
cancelForm();
});
} else {
addPoint(form.value).then((res) => {
addPoint(form.value).then(() => {
ElMessage.success('添加成功');
cancelForm();
});
@@ -158,110 +176,15 @@ const cancelForm = () => {
router.back();
};
// ! map
const mapReady = ref(false);
const map = ref(null);
const marker = ref(null);
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 () => {
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) => {
const villageinfo = await getVillageByIdAPI(villageid);
const city = villageinfo.data.city.replaceAll('/', '');
map.value = new AMap.Map('containerMap', {
viewMode: '3D',
zoom: 11,
center: [116.397428, 39.90923]
});
AMap.plugin('AMap.Geocoder', function () {
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;
handleMap(AMap, city);
initLocation(AMap);
});
});
/** 清空选择地点 */
function clearLocation() {
form.value.location = '';
if (marker.value) {
map.value.remove(marker.value);
const GDef = ref();
function handleClickPoint(laglat: number[]) {
marker.value = null;
}
form.value.location = `${laglat[0]},${laglat[1]}`;
marker.value = GDef.value.addMarker_only(laglat);
}
function handleMap(AMap, city = '010') {
// 添加点击事件
map.value.on('click', (e) => {
const lnglat = e.lnglat;
form.value.location = `${lnglat.lng},${lnglat.lat}`;
const lnglatarr = [lnglat.lng, lnglat.lat];
const geocoder = new AMap.Geocoder({
city: city // city 指定进行编码查询的城市支持传入城市名、adcode 和 citycode
});
geocoder.getAddress(lnglatarr, function (status, result) {
if (status === 'complete' && result.info === 'OK') {
// result为对应的地理位置详细信息
form.value.locationName = result.regeocode.formattedAddress;
}
});
// 如果有 marker.value先移除
if (marker.value) {
map.value.remove(marker.value);
}
// 添加新 marker
marker.value = new AMap.Marker({
position: lnglat,
map: map.value,
title: form.value.pointName || '巡检点'
});
});
}
const initLocation = (AMap) => {
if (!map.value || !form.value.location) return;
const [lng, lat] = form.value.location.split(',').map((v) => Number(v.trim()));
if (!Number.isFinite(lng) || !Number.isFinite(lat)) return;
if (!lng || !lat) return;
const lnglat = new AMap.LngLat(lng, lat);
map.value.setCenter(lnglat);
map.value.setZoom(16);
if (marker.value) {
map.value.remove(marker.value);
}
marker.value = new AMap.Marker({
position: lnglat,
map: map.value,
title: form.value.pointName || '巡检点'
});
};
onUnmounted(() => {
map.value?.destroy();
onMounted(async () => {
init();
});
</script>

View File

@@ -8,19 +8,6 @@
<el-form-item label="巡检路线名称" prop="routeName">
<el-input v-model.trim="form.routeName" placeholder="请输入巡检路线名称" />
</el-form-item>
<!-- <el-form-item label="巡检路线描述" prop="description">
<el-input type="textarea" :rows="3" v-model.trim="form.description" placeholder="请输入巡检路线描述" />
</el-form-item> -->
<!-- <el-form-item label="预计巡检时长" prop="estimatedTime">
<el-input v-model.trim.number="form.estimatedTime" placeholder="预计巡检时长">
<template #append>分钟</template>
</el-input>
</el-form-item> -->
<!-- <el-form-item label="巡检路线状态" prop="routeStatus">
<el-radio-group v-model="form.routeStatus">
<el-radio v-for="(item, index) in com_inspection_route_status" :key="index" :value="item.value" :label="item.label"></el-radio>
</el-radio-group>
</el-form-item> -->
<el-form-item label="巡检点">
<div class="itembox">
<div
@@ -28,8 +15,8 @@
:class="{
active: checkoutPointlist.includes(item.id)
}"
@click="checkoutItem(item.id)"
v-for="(item, index) in pointslist"
@click="checkoutItemPoint(item)"
:key="index"
>
<el-icon v-show="checkoutPointlist.includes(item.id)"><Check /></el-icon>
@@ -38,11 +25,19 @@
</div>
</el-form-item>
<el-form-item label="绘制巡检路线">
<div class="map" id="containerMap"></div>
<GD :small-scroll="true" ref="GDef" :click-or-draw="false"></GD>
<div class="tips flex flex-items-center justify-between">
<div>点击地图绘制巡检路线再次点击可继续绘制下一条但只能保留一条</div>
<div>
<span class="deleteMarker" @click="clearAll">清空所有路线</span>
<span
class="deleteMarker"
@click="
() => {
GDef.clearAll();
}
"
>清空所有路线</span
>
</div>
</div>
</el-form-item>
@@ -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: `
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;line-height:18px;border-radius:50%;background-color:rgba(26,117,255,0.3);">
<div
style=" width: 20px;
border-radius: 50%;
height: 20px;
line-height: 20px;
background-color: rgba(26,117,255,1);
color: #ffffff;
font-size: 20px;
text-align: center;"
>${index}</div>
</div>`
});
}
// 移除 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<any>(null);
const markers = ref<Record<string, any>>({});
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,156 +151,20 @@ 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) {
if (valid) {
// 获取路线经纬度
const path = getPolylinePath() as [number, number][];
const path = GDef.value.getAllDrawLines() as [number, number][];
console.log(path);
if (path.length === 0) {
ElMessage.warning('请绘制巡检路线');
return;
@@ -384,7 +191,7 @@ const submitForm = () => {
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();
});

View File

@@ -57,14 +57,12 @@
</el-checkbox-group>
</el-form-item> -->
<el-form-item label="关联计划" props="planId">
<el-select @change="handlChangeMap" v-model="form.planId" placeholder="请选择" style="width: 100%">
<el-select @change="handleChangeMap" v-model="form.planId" placeholder="请选择" style="width: 100%">
<el-option v-for="item in planlist" :key="item.id" :label="item.planName" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="计划路线" props="planId">
<div class="mapbox" v-loading="maploading">
<div class="w-full h-full" id="TaskMapBox"></div>
</div>
<GD v-loading="maploading" ref="GDef" :disabled="true"></GD>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submit">提交</el-button>
@@ -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<any>(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<InstanceType<typeof RepairUser>>();
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 GDef = ref(null);
function handleChangeMap(val: string) {
maploading.value = true;
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 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);
}
}
// 处理 巡检路线 巡检点数据
function handleRoute(route: RouteVO) {
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: `
<div style="display:flex;align-items:center;justify-content:center;width:30px;height:30px;line-height:18px;border-radius:50%;background-color:rgba(26,117,255,0.3);">
<div
style=" width: 20px;
border-radius: 50%;
height: 20px;
line-height: 20px;
background-color: rgba(26,117,255,1);
color: #ffffff;
font-size: 20px;
text-align: center;"
>${index + 1}</div>
</div>`
});
//将创建的点标记添加到已有的地图实例:
map.value.add(marker);
markerlist.push(marker);
});
}
// ! 添加路线
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();
})
.finally(() => {
maploading.value = false;
});
} else {
maploading.value = false;
}
} else {
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) {

View File

@@ -8,9 +8,6 @@
<el-form-item label="公告标题" prop="noticeTitle">
<el-input v-model="queryParams.noticeTitle" placeholder="请输入公告标题" clearable @keyup.enter="handleQuery" />
</el-form-item>
<!-- <el-form-item label="操作人员" prop="createByName">
<el-input v-model="queryParams.createByName" placeholder="请输入操作人员" clearable @keyup.enter="handleQuery" />
</el-form-item> -->
<el-form-item label="类型" prop="noticeType">
<el-select v-model="queryParams.noticeType" placeholder="公告类型" clearable>
<el-option v-for="dict in sys_notice_type" :key="dict.value" :label="dict.label" :value="dict.value" />
@@ -66,12 +63,12 @@
<dict-tag :options="sys_notice_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column label="创建时间" sortable align="center" prop="createTime" width="180">
<el-table-column label="创建时间" sortable align="center" prop="createTime">
<template #default="scope">
<span>{{ scope.row.createTime }}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="400" align="center" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button v-has-permi="['system:notice:edit']" link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
<el-button v-has-permi="['system:notice:remove']" link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
@@ -81,7 +78,7 @@
<pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
</el-card>
<!-- 添加或修改公告对话框 -->
<!-- 添加或修改公告对话框 -->
<el-dialog v-model="dialog.visible" :title="dialog.title" width="780px" append-to-body>
<el-form ref="noticeFormRef" :model="form" :rules="rules" label-width="80px">
<el-row>
@@ -171,7 +168,7 @@ const data = reactive<PageData<NoticeForm, NoticeQuery>>({
const { queryParams, form, rules } = toRefs(data);
/** 查询公告列表 */
/** 查询公告列表 */
const getList = async () => {
loading.value = true;
listNotice(queryParams.value)

View File

@@ -80,7 +80,7 @@
<Holder :isMultiple="false" :userid="form.residentId ?? ''" ref="HolderRef" @change="handleChange">
<template #default>
<div class="residentBox" @click="choiceResidentFun">
<div class="defaultbox" v-if="form.residentId == null || form.residentId === ''">
<div class="defaultBox" v-if="form.residentId == null || form.residentId === ''">
<span>请选择</span>
<el-icon><Search /></el-icon>
</div>
@@ -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;

View File

@@ -75,7 +75,7 @@
<el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
<el-table-column label="操作" width="180" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<!-- 待审核 审核不通过 -->
<!-- 待审核 审核不通过 -->
<el-button
link
type="primary"

View File

@@ -14,7 +14,6 @@
<el-form-item label="登录密码" v-if="form.userId == undefined" prop="password">
<el-input type="password" clearable v-model.trim="form.password" placeholder="请输入" />
</el-form-item>
<!-- <el-form-item label="员工头像" prop="chargeScope"></el-form-item> -->
<el-form-item label="员工性别" prop="chargeScope">
<el-select v-model="form.sex" placeholder="请选择">
<el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
@@ -31,12 +30,11 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="管理小区" prop="checkvillage">
<el-form-item label="管理小区" prop="villageIds">
<el-select v-model="checkvillage" multiple @change="handleChangeVillage">
<el-option v-for="(item, index) in vilageList" :key="index" :value="item.villageId" :label="item.villageName"></el-option>
<el-option v-for="(item, index) in villageList" :key="index" :value="item.villageId" :label="item.villageName"></el-option>
</el-select>
</el-form-item>
<el-form-item label="手机号" prop="phonenumber">
<el-input v-model.trim="form.phonenumber" placeholder="请输入" />
</el-form-item>
@@ -46,7 +44,6 @@
<el-form-item label="备注" prop="remark">
<el-input type="textarea" :rows="5" v-model.trim="form.remark" placeholder="请输入" />
</el-form-item>
<el-form-item style="margin-top: 30px">
<el-button type="primary" @click="submitForm">提交</el-button>
<el-button @click="cancelForm">返回</el-button>
@@ -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: '长度在 130 个字符', trigger: 'blur' }
{ min: 4, max: 16, message: '长度在 416 个字符', 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;

View File

@@ -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;

View File

@@ -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();
};