zhaoyang/estate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

6/24 统一地图组件入口，规范地图方法，属性。 完成天地图和高德切换

Browse Source
This commit is contained in:
Zy
2026-06-24 16:19:19 +08:00
parent 33d35c8d70
commit 4e2ae414c4
14 changed files with 515 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/views/system/inspection/Task/addTask.vue
View File

@@ -5,7 +5,7 @@
<div class="title">
<div>基本信息</div>
</div>
<div class="bodybox">
<div class="bodyBox">
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px" label-position="right">
<el-form-item label="任务名称" prop="taskName">
<el-input v-model="form.taskName" placeholder="请输入"></el-input>
@@ -14,7 +14,7 @@
<div class="inspectorIdsBox">
<div v-for="(item, index) in checkoutUserlist" :key="index" class="inspector_items">
<div class="name">{{ item.nickName }}</div>
<i @click="handleDelete(item.userId)" class="deleteaction">
<i @click="handleDelete(item.userId)" class="deleteAction">
<el-icon><Delete /></el-icon>
</i>
</div>
@@ -51,22 +51,17 @@
<el-option v-for="item in com_inspection_remind_tiime" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<!-- <el-form-item label="巡检设置">
<el-checkbox-group @change="handleChagneSetting" v-model="Settinglist">
<el-checkbox v-for="(item, index) in com_inspection_plan_setting" :key="index" :label="item.label" :value="item.value" />
</el-checkbox-group>
</el-form-item> -->
<el-form-item label="关联计划" props="planId">
<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-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">
<GD v-loading="maploading" ref="GDef" :disabled="true"></GD>
<MapWrapper v-loading="mapLoading" :disabled="true" ref="MapWrapperRef"></MapWrapper>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submit">提交</el-button>
<el-button @click="routeback">返回</el-button>
<el-button @click="outback">返回</el-button>
</el-form-item>
</el-form>
</div>
@@ -82,8 +77,8 @@ import { ref } from 'vue';
import { listPlan } from '@/api/system/InspectionPlan';
import { addTask, getTask, updateTask } from '@/api/system/InspectionTask';
import { getRoute } from '@/api/system/InspectionRoute';
import GD from '@/components/Map/GD.vue';
import MapWrapper from '@/components/Map/index.vue';
import { LngLat } from '@/components/Map/type';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { com_inspection_remind_tiime } = toRefs<any>(proxy?.useDict('com_inspection_remind_tiime'));
@@ -106,36 +101,19 @@ const rules = ref({
inspectorId: [{ required: true, message: '请选择巡检人员', trigger: 'blur' }],
planId: [{ required: true, message: '请选择巡检计划', trigger: 'blur' }]
});
// 提醒时间
const remindTimeoptions = ref([
{
value: 10,
label: '任务开始前10分钟'
},
{
value: 15,
label: '任务开始前15分钟'
},
{
value: 20,
label: '任务开始前30分钟'
}
]);
// 巡检计划id
const editid = ref(null);
const editId = ref(null);
// 初始化
// 路线列表
const planlist = ref([]);
const planList = ref([]);
async function init() {
// 获取 路线 列表
const res = await listPlan();
planlist.value = res.rows;
planList.value = res.rows;
if (route.query.id) {
editid.value = route.query.id;
getTask(editid.value).then((res) => {
editId.value = route.query.id;
getTask(editId.value).then((res) => {
form.value = {
id: res.data.id,
taskName: res.data.taskName, // 巡检计划名称
@@ -157,51 +135,51 @@ function handleAddUser() {
RepairUserRef.value.open();
}
const checkoutUserlist = ref([]);
function handleUserChange(val) {
function handleUserChange(val: any[]) {
checkoutUserlist.value = val;
}
function handleDelete(id) {
function handleDelete(id: string) {
checkoutUserlist.value = checkoutUserlist.value.filter((item) => item.userId !== id);
}
// 返回
function routeback() {
function outback() {
router.back();
}
const maploading = ref(false);
const mapLoading = ref(false);
const GDef = ref(null);
const MapWrapperRef = ref<InstanceType<typeof MapWrapper>>();
function handleChangeMap(val: string) {
maploading.value = true;
const find = planlist.value.find((item) => item.id === val);
mapLoading.value = true;
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();
MapWrapperRef.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);
const angular = item.location.split(',').map(Number).filter(Boolean) as LngLat;
MapWrapperRef.value.addMarker_more(angular, item.pointName, item.id);
});
}
// 巡检路线
if (res.data.pathPoints) {
GDef.value.renderSavedPath(res.data.pathPoints);
MapWrapperRef.value.renderSavedPath(res.data.pathPoints);
}
}
})
.finally(() => {
maploading.value = false;
mapLoading.value = false;
});
} else {
maploading.value = false;
mapLoading.value = false;
}
} else {
maploading.value = false;
mapLoading.value = false;
}
}
@@ -219,15 +197,15 @@ function submit() {
form.value.inspectorId = checkoutUserlist.value.map((item) => item.userId).join(',');
formRef.value?.validate(async (valid: boolean) => {
if (valid) {
if (editid.value) {
if (editId.value) {
updateTask(form.value).then(() => {
ElMessage.success('编辑成功');
routeback();
outback();
});
} else {
addTask(form.value).then(() => {
ElMessage.success('添加成功');
routeback();
outback();
});
}
}
@@ -240,7 +218,7 @@ function submit() {
margin-top: 20px;
padding: 30px;
background-color: white;
.bodybox {
.bodyBox {
width: 600px;
margin: 20px auto 0;
}
@@ -275,7 +253,7 @@ function submit() {
color: #44a0ff;
}
}
.deleteaction {
.deleteAction {
margin-left: 10px;
cursor: pointer;
&:hover {
@@ -295,7 +273,7 @@ function submit() {
color: #000;
display: flex;
align-items: center;
.iconbox {
.iconBox {
width: 30px;
height: 30px;
margin-left: 5px;