You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
101 lines
2.3 KiB
101 lines
2.3 KiB
<script setup lang="ts">
|
|
import { add, update } from 'apis/point'
|
|
import FtDialog from 'components/common/FTDialog/index.vue'
|
|
import { FtMessage } from 'libs/message'
|
|
import { onMounted, ref } from 'vue'
|
|
|
|
const props = defineProps({
|
|
formData: {
|
|
type: Object,
|
|
default: () => ({}),
|
|
},
|
|
})
|
|
const emits = defineEmits(['ok', 'cancel'])
|
|
|
|
onMounted(() => {
|
|
if (props.formData.id) {
|
|
form.value = { ...props.formData }
|
|
}
|
|
})
|
|
|
|
const form = ref({})
|
|
|
|
const rules = {
|
|
pointName: [{ required: true, message: '请输入坐标名称', trigger: 'blur' }],
|
|
x: [{ required: true, message: '请输入x', trigger: 'blur' }],
|
|
y: [{ required: true, message: '请输入y', trigger: 'blur' }],
|
|
z: [{ required: true, message: '请输入z', trigger: 'blur' }],
|
|
}
|
|
|
|
const formRef = ref()
|
|
|
|
const okLoading = ref(false)
|
|
const okHandle = () => {
|
|
formRef.value.validate(async (valid: any) => {
|
|
if (!valid) {
|
|
return
|
|
}
|
|
okLoading.value = true
|
|
// TODO 调用保存接口
|
|
if (form.value.id) {
|
|
await update(form.value)
|
|
}
|
|
else {
|
|
await add(form.value)
|
|
}
|
|
setTimeout(() => {
|
|
okLoading.value = false
|
|
FtMessage.success('保存成功')
|
|
emits('ok')
|
|
}, 300)
|
|
})
|
|
}
|
|
|
|
const cancel = () => {
|
|
emits('cancel')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<FtDialog visible :title="form.id ? '编辑坐标' : '新增坐标'" width="40%" @ok="okHandle" @cancel="cancel">
|
|
<el-form ref="formRef" label-width="120" :model="form" :rules="rules">
|
|
<el-form-item label="坐标名称" prop="pointName">
|
|
<el-input v-model="form.pointName" placeholder="" />
|
|
</el-form-item>
|
|
<el-form-item label="x" prop="x">
|
|
<el-input v-model="form.x" type="number" placeholder="" />
|
|
</el-form-item>
|
|
<el-form-item label="y" prop="y">
|
|
<el-input v-model="form.y" type="number" placeholder="" />
|
|
</el-form-item>
|
|
<el-form-item label="z" prop="z">
|
|
<el-input v-model="form.z" type="number" placeholder="" />
|
|
</el-form-item>
|
|
</el-form>
|
|
</FtDialog>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.el-select {
|
|
width: 80%;
|
|
}
|
|
.el-input {
|
|
width: 80%;
|
|
}
|
|
.unit-text {
|
|
font-size: 40px;
|
|
color: #0349A8;
|
|
font-weight: 500;
|
|
margin-left: 20px;
|
|
}
|
|
.select-box {
|
|
display: flex;
|
|
margin: 40px;
|
|
}
|
|
.route-img {
|
|
display: flex;
|
|
img {
|
|
width: 70px;
|
|
}
|
|
}
|
|
</style>
|