2025-05-21 15:29:38 +08:00

148 lines
3.6 KiB
Vue

<template>
<div class="app-container">
<el-container>
<el-main>
<div class="form-main">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="白名单名称" prop="whitelistName">
<el-input v-model="form.whitelistName" placeholder="请输入白名单名称" />
</el-form-item>
<el-form-item label="白名单类型" prop="whitelistType">
<el-select v-model="form.whitelistType" clearable placeholder="请选择白名单类型">
<el-option v-for="dict in dict.type.whitelist_type" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="白名单模式" prop="whitelistMode">
<el-select v-model="form.whitelistMode" clearable placeholder="请选择白名单模式">
<el-option v-for="dict in dict.type.white_mode" :key="dict.value" :label="dict.label"
:value="parseInt(dict.value)" />
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="form.remarks" placeholder="请输入内容" type="textarea" />
</el-form-item>
</el-form>
</div>
<div class="footer">
<el-button @click="cancel"> </el-button>
<el-button type="primary" @click="submitAddForm()"> </el-button>
</div>
</el-main>
</el-container>
</div>
</template>
<script>
import { addWhitelist } from '@/api/FDS/whiteList'
export default {
name: 'WhiteAdd',
dicts: ["white_mode", 'whitelist_type'],
data () {
return {
form: {},
tokenId: '',
// 文件存放的路径
fileList: [],
rules: {
whitelistName: [
{ required: true, message: '白名单名称不能为空', trigger: 'blur' }
],
whitelistType: [
{ required: true, message: '白名单类型不能为空', trigger: 'change' }
],
whitelistMode: [
{ required: true, message: '白名单模式不能为空', trigger: 'change' }
]
}
}
},
computed: {},
mounted () {
this.reset()
},
methods: {
reset () {
this.form = {
}
console.log(this.form)
},
/** 新增按钮 */
submitAddForm: function () {
this.$refs['form'].validate(valid => {
if (valid) {
addWhitelist(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
})
this.close()
this.$router.push({ path: '/build/whitelist' })
}
})
},
cancel () {
this.close()
this.$router.push({ path: '/build/whitelist' })
},
close () {
this.$tab.closePage();
},
}
}
</script>
<style lang="scss" scoped>
.app-container {
background: #ffffff;
height: 100%;
position: relative;
}
.form-main {
width: 700px;
margin: 0 auto;
}
::v-deep .el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner {
border: 1px solid #E4E7ED !important;
}
.tag-group {
.el-tag {
cursor: pointer;
}
}
.el-tag+.el-tag {
margin-left: 10px
}
.page-footer {
margin: 0 auto;
width: 700px;
justify-content: center;
display: flex;
}
::v-deep .el-input,
.el-select,
.el-textarea {
max-width: 400px;
width: 400px;
}
.footer {
margin-top: 20px;
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute;
bottom: 24px;
right: 80px
}
</style>