142 lines
3.6 KiB
Vue
142 lines
3.6 KiB
Vue
<template>
|
|
<el-drawer
|
|
:title="controlWindows.addInfo.title"
|
|
direction="ltr"
|
|
size="40%"
|
|
:visible.sync="controlWindows.add"
|
|
@opened="openDrawer"
|
|
:before-close="closeWindow"
|
|
>
|
|
<div class="add">
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
|
<el-form-item label="账户名称" prop="accountName">
|
|
<el-input
|
|
maxlength="50"
|
|
v-model="form.accountName"
|
|
placeholder="请输入账户名称"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="账户类型" prop="accountType">
|
|
<el-select v-model="form.accountType" placeholder="请选择账户类型">
|
|
<el-option
|
|
v-for="(item, index) in refineryAccountTypeEnum"
|
|
:key="index"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="炼厂名称" prop="refineryId">
|
|
<autocomplete :params="form" :config="configAutocomplete" />
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<div class="buttons">
|
|
<el-button @click="closeWindow">取消 </el-button>
|
|
<el-button @click="submit">确定</el-button>
|
|
</div>
|
|
</el-drawer>
|
|
</template>
|
|
|
|
<script>
|
|
import refineryInfoServe from "api/refineryInfo.js";
|
|
import serve from "api/refineryAccount.js";
|
|
|
|
import autocomplete from "components/autocomplete/index.vue";
|
|
export default {
|
|
components: {
|
|
autocomplete,
|
|
},
|
|
props: {
|
|
controlWindows: Object,
|
|
refineryAccountTypeEnum: Array,
|
|
},
|
|
data() {
|
|
let validatorRefineryId = (rule, value, callback) => {
|
|
if (this.form.refineryId) callback();
|
|
else callback("请选择炼厂");
|
|
};
|
|
return {
|
|
form: {},
|
|
refineryList: [],
|
|
configAutocomplete: {
|
|
serveTarget: refineryInfoServe.findByEntity,
|
|
autocompleteKey: "refineryName",
|
|
labelKey: "refineryName",
|
|
valueKey: "id",
|
|
placeholder: "炼厂名称",
|
|
querykey: "refineryId",
|
|
},
|
|
rules: {
|
|
accountName: [
|
|
{ required: true, message: "请输入账户名称", trigger: "blur" },
|
|
],
|
|
accountType: [
|
|
{ required: true, message: "请选择账户类型", trigger: "change" },
|
|
],
|
|
refineryId: [
|
|
{ required: true, validator: validatorRefineryId, trigger: "change" },
|
|
],
|
|
},
|
|
};
|
|
},
|
|
methods: {
|
|
openDrawer() {},
|
|
submit() {
|
|
this.$refs["form"].validate((valid) => {
|
|
if (valid) {
|
|
this.judgeInterface(this.form).then((res) => {
|
|
if (res.code === 20000) {
|
|
this.$message.success(res.msg);
|
|
this.closeWindow();
|
|
}
|
|
});
|
|
}
|
|
});
|
|
},
|
|
judgeInterface(form) {
|
|
let { id } = this.controlWindows.addInfo;
|
|
if (id) return serve.update(form);
|
|
else return serve.save(form);
|
|
},
|
|
closeWindow() {
|
|
this.$emit("closeWindow");
|
|
this.form = {};
|
|
this.controlWindows.addInfo = {};
|
|
this.$nextTick(() => {
|
|
this.$refs.form.clearValidate();
|
|
this.controlWindows.add = false;
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.add {
|
|
padding: 20px;
|
|
.el-input,
|
|
.el-select,
|
|
.el-textarea,
|
|
.el-autocomplete {
|
|
width: 300px;
|
|
}
|
|
}
|
|
.buttons {
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 0;
|
|
padding-right: 40px;
|
|
width: 100%;
|
|
height: 80px;
|
|
line-height: 80px;
|
|
text-align: right;
|
|
border-top: 1px solid #f2f3f5;
|
|
.el-button {
|
|
text-align: right;
|
|
font-size: 14px;
|
|
border-radius: 5px;
|
|
}
|
|
}
|
|
</style>
|