|
|
@@ -0,0 +1,150 @@
|
|
|
+<template>
|
|
|
+ <el-dialog
|
|
|
+ :model-value="visible"
|
|
|
+ @update:model-value="(val) => emit('update:visible', val)"
|
|
|
+ :title="title"
|
|
|
+ width="500"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :model="form"
|
|
|
+ :rules="formRules"
|
|
|
+ label-width="100px"
|
|
|
+ class="container"
|
|
|
+ ref="formRef"
|
|
|
+ label-position="right"
|
|
|
+ status-icon
|
|
|
+ >
|
|
|
+ <el-form-item label="坐标" prop="coord">
|
|
|
+ <el-input
|
|
|
+ v-model="form.coord"
|
|
|
+ show-word-limit
|
|
|
+ :autosize="{ minRows: 3, maxRows: 3 }"
|
|
|
+ type="textarea"
|
|
|
+ disabled
|
|
|
+ :placeholder="placeholder"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="测试类型" prop="type">
|
|
|
+ <el-select style="width: 100%" v-model="form.type" clearable>
|
|
|
+ <el-option
|
|
|
+ :value="Number(key)"
|
|
|
+ :label="type"
|
|
|
+ v-for="(type, key) in measurePointDesc"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="测试说明" prop="name" required>
|
|
|
+ <el-input
|
|
|
+ v-model.trim="form.name"
|
|
|
+ :maxlength="100"
|
|
|
+ show-word-limit
|
|
|
+ :autosize="{ minRows: 3, maxRows: 8 }"
|
|
|
+ type="textarea"
|
|
|
+ placeholder="请输入"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="备注" prop="remark">
|
|
|
+ <el-input
|
|
|
+ v-model.trim="form.remark"
|
|
|
+ :maxlength="100"
|
|
|
+ type="text"
|
|
|
+ placeholder="请输入"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="emit('update:visible', false)">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submit"> 确定 </el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import { ElMessage } from "element-plus";
|
|
|
+import { ref, unref, watchEffect, reactive } from "vue";
|
|
|
+import type { FormRules } from "element-plus";
|
|
|
+import { measurePointDesc } from "@/store/relics";
|
|
|
+
|
|
|
+const form = ref({
|
|
|
+ coord: "",
|
|
|
+ name: "",
|
|
|
+ type: "",
|
|
|
+ remark: "",
|
|
|
+});
|
|
|
+
|
|
|
+const formRules = reactive<FormRules>({
|
|
|
+ type: [{ required: true, message: "请输入", trigger: "change" }],
|
|
|
+ name: [{ required: true, message: "请输入", trigger: "blur" }],
|
|
|
+});
|
|
|
+
|
|
|
+const props = withDefaults(
|
|
|
+ defineProps<{
|
|
|
+ visible: boolean;
|
|
|
+ value: any;
|
|
|
+ title: string;
|
|
|
+ name?: string;
|
|
|
+ placeholder: string;
|
|
|
+ isAllowEmpty?: boolean;
|
|
|
+ updateValue: (value: any) => void;
|
|
|
+ }>(),
|
|
|
+ {
|
|
|
+ placeholder: "请输入",
|
|
|
+ }
|
|
|
+);
|
|
|
+const emit = defineEmits<{
|
|
|
+ (e: "update:visible", visible: boolean): void;
|
|
|
+}>();
|
|
|
+const formRef = ref();
|
|
|
+// const ivalue = ref(props.value);
|
|
|
+
|
|
|
+watchEffect(() => {
|
|
|
+ // ivalue.value = props.value;
|
|
|
+ console.log("props.value", props.value);
|
|
|
+ if (props.value) {
|
|
|
+ // debugger
|
|
|
+ form.value.coord = `纬度：${props.value.pos[0]}\n经度：${props.value.pos[1]}\n高程：${props.value.pos[2]}`;
|
|
|
+ form.value.type = props.value.type;
|
|
|
+ form.value.name = props.value.name;
|
|
|
+ form.value.remark = props.value.remark;
|
|
|
+ } else {
|
|
|
+ form.value.coord = "";
|
|
|
+ form.value.type = "";
|
|
|
+ form.value.name = "";
|
|
|
+ form.value.remark = "";
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const submit = async () => {
|
|
|
+ const res = await unref(formRef)?.validate();
|
|
|
+ console.log("res", res);
|
|
|
+ if (res) {
|
|
|
+ const lastObj = {
|
|
|
+ ...props.value,
|
|
|
+ ...form.value,
|
|
|
+ };
|
|
|
+ delete lastObj.coord;
|
|
|
+
|
|
|
+ lastObj.type = measurePointDesc[lastObj.type];
|
|
|
+ // console.log("lastObj", lastObj);
|
|
|
+ await props.updateValue(lastObj);
|
|
|
+ emit("update:visible", false);
|
|
|
+ }
|
|
|
+ // if (ivalue.value.length === 0 && !props.isAllowEmpty) {
|
|
|
+ // return ElMessage.error(`${props.name || "点位"}名称不能为空！`);
|
|
|
+ // }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.container {
|
|
|
+ padding: 0px 60px 0 20px;
|
|
|
+}
|
|
|
+:global(.container .el-form-item) {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+</style>
|
