修改
This commit is contained in:
@ -4,71 +4,33 @@
|
||||
<div class="head_box">
|
||||
<span class="title">{{ title }}</span>
|
||||
<div>
|
||||
<el-button
|
||||
v-if="!infoActive"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="submit"
|
||||
:loading="btnLoading"
|
||||
>保存</el-button
|
||||
>
|
||||
<el-button v-if="!infoActive" type="primary" size="small" @click="submit" :loading="btnLoading">保存</el-button>
|
||||
<el-button size="small" @click="close">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialogWrapper">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
:inline="true"
|
||||
:disabled="infoActive"
|
||||
>
|
||||
<el-form ref="formRef" :model="form" :rules="rules" :inline="true" :disabled="infoActive">
|
||||
<el-form-item prop="bddMc" label="必到点名称:">
|
||||
<el-input
|
||||
style="width: 80%;"
|
||||
min="0"
|
||||
placeholder="请填写必到点名称"
|
||||
v-model="form.bddMc"
|
||||
></el-input>
|
||||
<el-input style="width: 80%" min="0" placeholder="请填写必到点名称" v-model="form.bddMc"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="fgdwId" label="所属方格:">
|
||||
<el-select
|
||||
:disabled="typeStatus === 'del'"
|
||||
placeholder="请选择所属方格"
|
||||
filterable
|
||||
clearable
|
||||
v-model="form.fgdwId"
|
||||
@change="handleChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in fgList"
|
||||
:key="item?.id"
|
||||
:label="item?.mc"
|
||||
:value="item?.id"
|
||||
/>
|
||||
<el-select :disabled="typeStatus === 'del'" placeholder="请选择所属方格" filterable clearable v-model="form.fgdwId"
|
||||
@change="handleChange">
|
||||
<el-option v-for="item in fgList" :key="item?.id" :label="item?.mc" :value="item?.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="bddDz" label="必到点地址:">
|
||||
<el-input
|
||||
placeholder="请填必到点地址"
|
||||
clearable
|
||||
v-model="form.bddDz"
|
||||
></el-input>
|
||||
<el-input placeholder="请填必到点地址" clearable v-model="form.bddDz"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="dkjgsj" label="必到点间隔时间/分钟为单位:">
|
||||
<el-input placeholder="请填写必到点间隔时间/分钟为单位" v-model="form.dkjgsj"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="jd" label="经度:">
|
||||
<el-input
|
||||
disabled
|
||||
placeholder="请填写经度"
|
||||
v-model="form.jd"
|
||||
></el-input>
|
||||
<el-input disabled placeholder="请填写经度" v-model="form.jd"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="wd" label="纬度:">
|
||||
<el-input
|
||||
disabled
|
||||
placeholder="请填写纬度"
|
||||
v-model="form.jd"
|
||||
></el-input>
|
||||
<el-input disabled placeholder="请填写纬度" v-model="form.jd"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
@ -77,23 +39,27 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, getCurrentInstance, computed, onMounted } from "vue";
|
||||
import { fetchTbZdxlFgdwSelectList, fetchTbZdxlFgdwBddSave, fetchTbZdxlFgdwBddUpdate, fetchTbZdxlFgdwId } from "@/api/service/taskProgress";
|
||||
import {
|
||||
fetchTbZdxlFgdwSelectList,
|
||||
fetchTbZdxlFgdwBddSave,
|
||||
fetchTbZdxlFgdwBddUpdate,
|
||||
fetchTbZdxlFgdwId
|
||||
} from "@/api/service/taskProgress";
|
||||
const { proxy } = getCurrentInstance();
|
||||
import GdMap from "@/components/Map/GdMap/index.vue"
|
||||
import GdMap from "@/components/Map/GdMap/index.vue";
|
||||
import emitter from "@/utils/eventBus";
|
||||
const btnLoading = ref(false); //按钮截流
|
||||
const title = ref("新增必到点采集");
|
||||
const formRef = ref(null);
|
||||
const infoActive = ref(true);
|
||||
const visible = ref(false);
|
||||
const fgList = ref([])
|
||||
const typeStatus = ref("")
|
||||
const fgList = ref([]);
|
||||
const typeStatus = ref("");
|
||||
|
||||
//级联选择器配置
|
||||
const props = defineProps({
|
||||
@ -103,41 +69,41 @@ const props = defineProps({
|
||||
}
|
||||
});
|
||||
|
||||
const emits = defineEmits(['update:modelValue', 'ok']);
|
||||
const emits = defineEmits(["update:modelValue", "ok"]);
|
||||
|
||||
const dialogFormVisible = computed({
|
||||
get() {
|
||||
return props.modelValue;
|
||||
},
|
||||
set(val) {
|
||||
if (!infoActive.value && typeStatus?.value !== 'del') {
|
||||
// 获取经纬度
|
||||
setTimeout(() => {
|
||||
emitter.emit("getMapClickCoordinates");
|
||||
if (!infoActive.value && typeStatus?.value !== "del") {
|
||||
// 获取经纬度
|
||||
setTimeout(() => {
|
||||
emitter.emit("getMapClickCoordinates");
|
||||
|
||||
// 更新地图标注位置
|
||||
emitter.on("mapClickCoordinates", async (res) => {
|
||||
emitter.emit("deletePointArea")
|
||||
|
||||
form.value.jd = res.lng
|
||||
form.value.wd = res.lat
|
||||
// 更新地图标注位置
|
||||
emitter.on("mapClickCoordinates", async (res) => {
|
||||
emitter.emit("deletePointArea");
|
||||
|
||||
emitter.emit("addPointArea", {
|
||||
coords: [{ jd: res.lng, wd: res.lat }],
|
||||
coordinates: res?.coordinates,
|
||||
icon: require("@/assets/lz/dw.png"),
|
||||
sizeX: 30,
|
||||
sizeY: 35
|
||||
form.value.jd = res.lng;
|
||||
form.value.wd = res.lat;
|
||||
|
||||
emitter.emit("addPointArea", {
|
||||
coords: [{ jd: res.lng, wd: res.lat }],
|
||||
coordinates: res?.coordinates,
|
||||
icon: require("@/assets/lz/dw.png"),
|
||||
sizeX: 30,
|
||||
sizeY: 35
|
||||
});
|
||||
});
|
||||
})
|
||||
}, 500);
|
||||
}, 500);
|
||||
} else {
|
||||
emitter.off('getMapClickCoordinates')
|
||||
emitter.off("getMapClickCoordinates");
|
||||
}
|
||||
|
||||
emits("update:modelValue", val);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
//表单数据
|
||||
const form = ref({
|
||||
@ -180,41 +146,40 @@ const rules = reactive({
|
||||
message: "请填写纬度",
|
||||
trigger: "change"
|
||||
}
|
||||
],
|
||||
]
|
||||
});
|
||||
|
||||
// 获取方格
|
||||
const getFgList = async () => {
|
||||
const res = await fetchTbZdxlFgdwSelectList()
|
||||
const res = await fetchTbZdxlFgdwSelectList();
|
||||
if (res && res?.length > 0) {
|
||||
fgList.value = res
|
||||
fgList.value = res;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 获取方格详情
|
||||
const getFgDetails = async (id, type) => {
|
||||
const res = await fetchTbZdxlFgdwId(id)
|
||||
const res = await fetchTbZdxlFgdwId(id);
|
||||
if (res) {
|
||||
setMap(res, type)
|
||||
setMap(res, type);
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
//新增
|
||||
function open(row = {}, type) {
|
||||
typeStatus.value = type
|
||||
infoActive.value = type === 'view';
|
||||
typeStatus.value = type;
|
||||
infoActive.value = type === "view";
|
||||
form.value = { ...row, xfbbName: row?.xfxz };
|
||||
if (type === 'view') {
|
||||
title.value = "查看信息"
|
||||
} else if (type === 'del') {
|
||||
title.value = "编辑必到点采集"
|
||||
if (type === "view") {
|
||||
title.value = "查看信息";
|
||||
} else if (type === "del") {
|
||||
title.value = "编辑必到点采集";
|
||||
} else {
|
||||
title.value = "新增必到点采集"
|
||||
title.value = "新增必到点采集";
|
||||
}
|
||||
|
||||
if (type === 'view' || type === 'del') {
|
||||
getFgDetails(form?.value?.fgdwId , !(type === 'view' || type === 'del'))
|
||||
if (type === "view" || type === "del") {
|
||||
getFgDetails(form?.value?.fgdwId, !(type === "view" || type === "del"));
|
||||
}
|
||||
dialogFormVisible.value = true;
|
||||
}
|
||||
@ -225,28 +190,45 @@ function close() {
|
||||
dialogFormVisible.value = false;
|
||||
}
|
||||
|
||||
|
||||
const handleChange = (val) => {
|
||||
const data = fgList?.value?.find(i => i?.id === val)
|
||||
setMap(data)
|
||||
}
|
||||
const data = fgList?.value?.find((i) => i?.id === val);
|
||||
setMap(data);
|
||||
};
|
||||
|
||||
const setMap = (data, type = true) => {
|
||||
emitter.emit("deletePointArea", "addfg")
|
||||
const { x1 = "", y1 = "", x2 = "", y2 = "", id = "", zxX = "", zxY = "", mc = "" } = data
|
||||
const centerPoint = [zxX, zxY]
|
||||
const position = [[Number(x1),Number(y1)],[Number(x2),Number(y2)]]
|
||||
const text = mc
|
||||
const obj = [{ position: position, text, id, userData: data}]
|
||||
emitter.emit("deletePointArea", "addfg");
|
||||
const {
|
||||
x1 = "",
|
||||
y1 = "",
|
||||
x2 = "",
|
||||
y2 = "",
|
||||
id = "",
|
||||
zxX = "",
|
||||
zxY = "",
|
||||
mc = ""
|
||||
} = data;
|
||||
const centerPoint = [zxX, zxY];
|
||||
const position = [
|
||||
[Number(x1), Number(y1)],
|
||||
[Number(x2), Number(y2)]
|
||||
];
|
||||
const text = mc;
|
||||
const obj = [{ position: position, text, id, userData: data }];
|
||||
|
||||
emitter.emit("echoPlane", { fontColor:'#12fdb8',coords: obj, type:'rectangle', flag:'addfg', color:'rgba(2,20,51,0.5)', linecolor:'#1C97FF'})
|
||||
emitter.emit("echoPlane", {
|
||||
fontColor: "#12fdb8",
|
||||
coords: obj,
|
||||
type: "rectangle",
|
||||
flag: "addfg",
|
||||
color: "rgba(2,20,51,0.5)",
|
||||
linecolor: "#1C97FF"
|
||||
});
|
||||
emitter.emit("setMapCenter", { location: centerPoint, zoomLevel: 14 });
|
||||
|
||||
|
||||
// 更新地图标注位置
|
||||
if (type) return
|
||||
emitter.emit("deletePointArea")
|
||||
|
||||
if (type) return;
|
||||
emitter.emit("deletePointArea");
|
||||
|
||||
emitter.emit("addPointArea", {
|
||||
coords: [{ jd: form.value?.jd, wd: form.value?.wd }],
|
||||
coordinates: [form.value?.jd, form.value?.wd],
|
||||
@ -254,36 +236,33 @@ const setMap = (data, type = true) => {
|
||||
sizeX: 30,
|
||||
sizeY: 35
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
//提交
|
||||
const submit = async () => {
|
||||
try {
|
||||
await formRef.value.validate()
|
||||
|
||||
await formRef.value.validate();
|
||||
if (!form.value?.id) {
|
||||
await fetchTbZdxlFgdwBddSave(form.value)
|
||||
await fetchTbZdxlFgdwBddSave(form.value);
|
||||
} else {
|
||||
await fetchTbZdxlFgdwBddUpdate(form.value)
|
||||
await fetchTbZdxlFgdwBddUpdate(form.value);
|
||||
}
|
||||
|
||||
proxy.$message({
|
||||
type: "success",
|
||||
message: "修改成功"
|
||||
});
|
||||
dialogFormVisible.value = false;
|
||||
emits("ok")
|
||||
|
||||
emits("ok");
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getFgList()
|
||||
})
|
||||
getFgList();
|
||||
});
|
||||
|
||||
defineExpose({ open })
|
||||
defineExpose({ open });
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
Reference in New Issue
Block a user