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.
108 lines
2.5 KiB
108 lines
2.5 KiB
3 years ago
|
<template>
|
||
|
|
<el-dialog ref="dialogForm" width="45%" :title="title" :visible.sync="visible" @close="closeDialog">
|
||
|
|
<el-form label-width="25%" ref="edit" :rules="rules" :model="edit">
|
||
|
|
<el-input v-show="false" v-model="edit.id"/>
|
||
|
|
<el-form-item label="姓名" prop="name">
|
||
|
|
<el-col :span="18">
|
||
|
|
<el-input v-model="edit.name"/>
|
||
|
|
</el-col>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="属性1" prop="attr1">
|
||
|
|
<el-col :span="18">
|
||
|
|
<el-input v-model="edit.attr1"/>
|
||
|
|
</el-col>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="属性2" prop="attr2">
|
||
|
|
<el-col :span="18">
|
||
|
|
<el-input v-model="edit.attr2"/>
|
||
|
|
</el-col>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
<div slot="footer" class="dialog-footer">
|
||
|
|
<el-button @click="visible = false">取消</el-button>
|
||
|
|
<el-button type="primary" @click="handleSave">保存</el-button>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { save } from '@/api/demo'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'EditDialog',
|
||
|
|
props: {
|
||
|
|
row: {
|
||
|
|
type: Object,
|
||
|
|
require: true
|
||
|
|
},
|
||
|
|
show: {
|
||
|
|
type: Boolean,
|
||
|
|
default: () => false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
components: {},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
edit: { id: null },
|
||
|
|
visible: this.show,
|
||
|
|
rules: {
|
||
|
|
name: [{ required: true, message: '请输入', trigger: 'blur' }]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
title() {
|
||
|
|
return (this.edit.id === null ? '新增' : '编辑')
|
||
|
|
}
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
visible() {
|
||
|
|
this.$emit('update:show', false)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
if (this.row !== null) {
|
||
|
|
this.edit = JSON.parse(JSON.stringify(this.row))
|
||
|
|
// console.log(this.edit)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
closeDialog() {
|
||
|
|
// 关闭
|
||
|
|
},
|
||
|
|
handleSave() {
|
||
|
|
this.$refs.edit.validate(valid => {
|
||
|
|
if (valid) {
|
||
|
|
const loading = this.$loading({
|
||
|
|
background: this.$elementGlobal.loadingBackground
|
||
|
|
})
|
||
|
|
save(this.edit)
|
||
|
|
.then(r => {
|
||
|
|
loading.close()
|
||
|
|
if (r.data === true) {
|
||
|
|
this.visible = false
|
||
|
|
this.$message({ type: 'success', message: '保存成功!' })
|
||
|
|
this.$emit('saved')
|
||
|
|
} else {
|
||
|
|
this.$message({ type: 'error', message: '保存失败!' })
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(() => {
|
||
|
|
loading.close()
|
||
|
|
})
|
||
|
|
} else {
|
||
|
|
return false
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
|
||
|
|
</style>
|