153 lines
4.1 KiB
Vue
153 lines
4.1 KiB
Vue
<!--
|
||
* @Author: SunTao 328867980@qq.com
|
||
* @Date: 2025-02-12 16:44:44
|
||
* @LastEditors: SunTao 328867980@qq.com
|
||
* @LastEditTime: 2025-02-17 16:18:20
|
||
* @FilePath: \znxjxt-ui\src\views\xj\hisense\inter-change\components\add-inter.vue
|
||
* @Description: 海信-收费站-新增/编辑
|
||
-->
|
||
<template>
|
||
<div class="dialog-content">
|
||
<el-form class="addForm" ref="addInterForm" :model="addInterForm" :rules="rules" label-width="8rem">
|
||
<el-row :gutter="24">
|
||
<el-col :span="24">
|
||
<el-form-item label="收费站名称：" prop="stationName">
|
||
<el-input v-model="addInterForm.stationName" placeholder="请填写名称" style="width: 100%" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="24">
|
||
<el-col :span="24">
|
||
<el-form-item label="收费站Id：" prop="stationId">
|
||
<el-input v-model="addInterForm.stationId" placeholder="请填写id" style="width: 100%" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="24">
|
||
<el-col :span="24">
|
||
<el-form-item label="收费站code：" prop="stationCode">
|
||
<el-input v-model="addInterForm.stationCode" placeholder="请填写收费站code" style="width: 100%" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="24">
|
||
<el-col :span="24">
|
||
<el-form-item label="桩号：" prop="stake">
|
||
<el-input v-model="addInterForm.stake" placeholder="请填写桩号" style="width: 100%" clearable>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<div class="dialog-footer">
|
||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { add, updata } from '@/api/xj/hisense/station'
|
||
|
||
export default {
|
||
name: "AddStation",
|
||
props: {
|
||
// 接收父组件传过来的数据
|
||
dialogItem: {
|
||
type: Object,
|
||
default: () => { },
|
||
},
|
||
},
|
||
data() {
|
||
return {
|
||
// 新增表单
|
||
addInterForm: {
|
||
stationName: "",
|
||
stationId: "",
|
||
stationCode: "",
|
||
stake: "",
|
||
},
|
||
// 表单校验规则
|
||
rules: {
|
||
stationName: [{ required: true, message: "请填写名称", trigger: "blur" }],
|
||
stationCode: [{ required: true, message: "请填写code", trigger: "blur" }],
|
||
stationId: [{ required: true, message: "请填写工作站id", trigger: "blur" }, {
|
||
pattern: /^[1-9]\d*$/,
|
||
message: "请输入正整数",
|
||
}],
|
||
stake: [{ required: true, message: "请填写桩号", trigger: "blur" }, {
|
||
pattern: /^(0|[1-9]\d*)(\.\d{1,3})?$/,
|
||
message: "请输入非负数",
|
||
},],
|
||
}
|
||
}
|
||
},
|
||
watch: {
|
||
dialogItem: {
|
||
handler(val) {
|
||
if (val) {
|
||
this.addInterForm = JSON.parse(JSON.stringify(val))
|
||
}
|
||
}, immediate: true, deep: true
|
||
}
|
||
},
|
||
mounted() {
|
||
|
||
},
|
||
methods: {
|
||
/**
|
||
* @description: 点击确定事件
|
||
* @return {*}
|
||
*/
|
||
submitForm() {
|
||
this.$refs.addInterForm.validate((valid) => {
|
||
if (valid) {
|
||
const data = {
|
||
...this.addInterForm,
|
||
};
|
||
if (this.addInterForm.id) {
|
||
updata(data).then(({ code }) => {
|
||
if (code === 200) {
|
||
this.$modal.msgSuccess("更新成功");
|
||
this.$emit("cancel");
|
||
}
|
||
});
|
||
} else {
|
||
add(data).then(({ code }) => {
|
||
if (code === 200) {
|
||
this.$modal.msgSuccess("新增成功");
|
||
this.$emit("cancel");
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
|
||
/**
|
||
* @description: 点击取消事件
|
||
* @return {*}
|
||
*/
|
||
cancel() {
|
||
this.$emit("cancel");
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.dialog-content {
|
||
width: 100%;
|
||
// height: 20rem;
|
||
}
|
||
|
||
/* 页脚 */
|
||
.dialog-footer {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
}
|
||
</style>
|