<template> <div> <el-form class="search-form" :model="form" ref="form" label-width="80px" :inline="true" size="mini" > <el-form-item label="操作对象"> <el-select v-model="form.operateObj" placeholder="请选择操作对象" clearable > <el-option v-for="item in operatObj" :key="item.dictValue" :label="item.dictValue" :value="+item.dictValue1" > </el-option> </el-select> </el-form-item> <el-form-item label="操作内容"> <el-select v-model="form.operateContent" placeholder="请选择操作内容" clearable > <el-option v-for="item in operatContent" :key="item.dictValue" :label="item.dictValue" :value="item.dictValue1" > </el-option> </el-select> </el-form-item> <el-form-item label="操作结果"> <el-select v-model="form.operateResult" placeholder="请选择操作结果" clearable > <el-option v-for="(val, key) in resultEnum" :key="val" :label="val" :value="+key" > </el-option> </el-select> </el-form-item> <el-form-item> <el-button type="success" @click="toSearch">查询</el-button> <el-button type="primary" @click="reset">重置</el-button> </el-form-item> </el-form> </div> </template> <script> import { selectDictType } from '@/api/baseData'; export default { name: 'search', data() { return { operatContent: [], operatObj: [], resultEnum: { 0: '失败', 1: '成功', }, form: formInit() } }, computed: { }, mounted() { this.getInit() }, methods: { toSearch() { this.$emit('search', this.form); }, reset() { this.form = formInit(); this.$emit('search'); }, getInit() { selectDictType({ dictType: '06' }).then(res => { let list = res || []; this.operatContent = list; }) selectDictType({ dictType: '07' }).then(res => { let list = res || []; this.operatObj = list; }) } } } function formInit() { return { operateContent: '', operateObj: null, operateResult: null, } } </script> <style scoped lang="scss"> .w200 { width: 200px; } .search-form { padding: 10px; background-color: #eaf1fe; margin-bottom: 20px; border-radius: 8px; .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item { margin-bottom: 0; } } </style>