107 lines
2.6 KiB
Vue
107 lines
2.6 KiB
Vue
![]() |
<template>
|
||
|
<div>
|
||
|
<el-dialog custom-class="zdy-dialog-bbd" :destroy-on-close="true" v-model="dialogForm" :title="`比巡点${title}`" width="80%" @close="close">
|
||
|
<FormMessage ref="FormRef" v-model="listQuery" :rules="rules" :formList="formList">
|
||
|
</FormMessage>
|
||
|
<div class="tc mt10">
|
||
|
<el-button type="primary" @click="save">保存</el-button>
|
||
|
<el-button @click="close">关闭</el-button>
|
||
|
</div>
|
||
|
</el-dialog>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script setup>
|
||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||
|
import { ref, defineProps, reactive, defineEmits } from 'vue';
|
||
|
const emit = defineEmits(["refresh"]);
|
||
|
const props = defineProps({
|
||
|
dic: {
|
||
|
type: Object,
|
||
|
default: () => ({})
|
||
|
}
|
||
|
});
|
||
|
const dialogForm = ref(false);
|
||
|
const title = ref('');
|
||
|
const FormRef = ref();
|
||
|
const listQuery = ref({});
|
||
|
const rules = reactive({
|
||
|
bxdMc: [{ required: true, message: "请输入必巡点名称", trigger: "blur" }],
|
||
|
bxdLx: [{ required: true, message: "请输入必巡点类型", trigger: "blur" }],
|
||
|
});
|
||
|
const formList = reactive([
|
||
|
{ label: "必巡点名称", prop: "bxdMc", type: "input" },
|
||
|
{ label: "必巡点类型", prop: "bxdLx", type: "select", options: props.dic.D_BZ_BXDLX },
|
||
|
{ label: "经度", prop: "jd",type: "input" },
|
||
|
{ label: "纬度", prop: "wd", type: "input"},
|
||
|
])
|
||
|
|
||
|
// 初始化数据
|
||
|
const init = (type, row) => {
|
||
|
dialogForm.value = true;
|
||
|
title.value = type == "add" ? "新增" : "编辑";
|
||
|
listQuery.value = row ? { ...row } : {};
|
||
|
console.log(listQuery.value,'===listQuery.value');
|
||
|
|
||
|
};
|
||
|
|
||
|
const save = () => {
|
||
|
FormRef.value.submit(() => {
|
||
|
let data = JSON.parse(JSON.stringify(listQuery.value));
|
||
|
data.id = data.id || new Date().getTime();
|
||
|
let obj = {
|
||
|
data: data,
|
||
|
type: title.value == "新增" ? "add" : "edit"
|
||
|
}
|
||
|
emit("changeDxd", obj);
|
||
|
close();
|
||
|
});
|
||
|
}
|
||
|
|
||
|
const close = () => {
|
||
|
dialogForm.value = false;
|
||
|
FormRef.value.reset()
|
||
|
};;
|
||
|
|
||
|
defineExpose({ init })
|
||
|
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
@import "@/assets/css/layout.scss";
|
||
|
|
||
|
.mapBox {
|
||
|
width: 100%;
|
||
|
height: 400px;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-form--inline .el-form-item {
|
||
|
margin-right: 0;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-dialog {
|
||
|
--el-dialog-bg-color: #fff;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-dialog__title {
|
||
|
color: #333;
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
</style>
|
||
|
<style lang="scss" scoped>
|
||
|
::v-deep .zdy-dialog-bbd {
|
||
|
width: 30%!important;
|
||
|
--el-dialog-bg-color: #fff !important;
|
||
|
background: #fff !important;
|
||
|
|
||
|
::v-deep .el-dialog__header {
|
||
|
background-color: #f7fafb;
|
||
|
border-bottom: 1px solid #e3e7ed;
|
||
|
}
|
||
|
|
||
|
.el-dialog__title {
|
||
|
color: #333;
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
}
|
||
|
</style>
|