159 lines
3.0 KiB
Vue
159 lines
3.0 KiB
Vue
<template>
|
||
<div class="page-body">
|
||
|
||
<vxe-form :data="options.formOptions.data" ref="xForm" :title-width="options.formOptions.titleWidth"
|
||
:title-align="options.formOptions.titleAlign" :rules="options.formOptions.rules" :items="options.formOptions.items" titleColon>
|
||
</vxe-form>
|
||
|
||
<div class="footerbar">
|
||
<a-button type="primary" @click="ok">确定</a-button>
|
||
<a-button @click="cancel">取消</a-button>
|
||
</div>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
|
||
|
||
export default {
|
||
|
||
name: 'BasicPageEdit',
|
||
components: { },
|
||
props: {
|
||
options: {
|
||
type: Object
|
||
},
|
||
dataId: {
|
||
}
|
||
|
||
|
||
},
|
||
|
||
data() {
|
||
|
||
return {};
|
||
},
|
||
|
||
computed: {
|
||
},
|
||
|
||
|
||
created() {
|
||
|
||
|
||
|
||
},
|
||
// 函数
|
||
methods: {
|
||
|
||
|
||
// 返回
|
||
back() {
|
||
// 如果是新增模式，关闭当前页面
|
||
if (!this.isEdit) {
|
||
this.$closePage({
|
||
closeRoute: this.options.addPageUrl
|
||
});
|
||
} else {
|
||
this.$closePage({
|
||
closeRoute: this.options.editPageUrl
|
||
});
|
||
}
|
||
// 打开列表页面
|
||
this.$openPage(this.options.listPageUrl)
|
||
},
|
||
|
||
// 保存
|
||
ok() {
|
||
|
||
let save = () => {
|
||
|
||
|
||
// 如果是新增模式，提交新增接口 如果是编辑模式，提交编辑接口
|
||
let action = !this.isEdit ? this.options.actions.create : this.options.actions.update;
|
||
// 如果是新增模式，提交的数据中加入id 如果是编辑模式，提交的数据中不加入id
|
||
let postdata = Object.assign({}, this.options.formOptions.data);
|
||
// 如果是编辑模式
|
||
if (this.isEdit) {
|
||
// postdata = { MesUnit: postdata }
|
||
}
|
||
// 格式化提交的数据
|
||
this.$mk.formatFormData({ data: postdata, rules: this.options.formOptions.items });
|
||
|
||
|
||
// 提交数据
|
||
this.$mk.post({
|
||
url: action,
|
||
loading: "保存中...",
|
||
data: postdata,
|
||
useBigInt: true,
|
||
}).then(() => { // 成功回调
|
||
this.$mk.success("保存成功");
|
||
if (!this.isEdit) { // 如果是新增模式，关闭当前页面
|
||
this.back();
|
||
}
|
||
}).catch((a) => { // 失败回调
|
||
this.$mk.error(a.data.msg); // 显示错误信息
|
||
});
|
||
|
||
|
||
};
|
||
|
||
|
||
// 验证表单
|
||
this.$mk.validateForm({ form: this.$refs.xForm }).then(() => { // 验证表单
|
||
save(); // 提交保存
|
||
}).catch(count => { // 验证失败
|
||
this.$mk.error(`存在${count}项错误，请检查`);
|
||
});
|
||
|
||
|
||
},
|
||
|
||
|
||
// 取消 返回
|
||
cancel() {
|
||
this.back();
|
||
}
|
||
},
|
||
// 监听属性
|
||
watch: {
|
||
|
||
}
|
||
};
|
||
|
||
</script>
|
||
|
||
|
||
<style scoped lang="less">
|
||
.page-body {
|
||
padding: 30px;
|
||
background: @base-bg-color;
|
||
}
|
||
|
||
.formtabs .ant-tabs-tabpane {
|
||
/* background: white; */
|
||
padding: 12px;
|
||
}
|
||
|
||
.gridPanel {
|
||
height: calc(100vh - 600px);
|
||
}
|
||
|
||
.footerbar {
|
||
padding-left: 10px;
|
||
}
|
||
|
||
.imagePanel {
|
||
cursor: pointer;
|
||
padding: 10px;
|
||
width: 100px;
|
||
|
||
img {
|
||
width: 80px;
|
||
height: 80px;
|
||
}
|
||
}
|
||
</style>
|