<!--简易搜索框--> <template> <div class="search-div"> <search-area :need-clear="true" :need-search-more="true" type="seperate" size="small" search-more-type="dialog" @search="searchCallback" @clear="clearInput"> <search-item> <el-input v-model="listQuery.caseid" size="small" clearable placeholder="案卷编号"/> </search-item> <search-item> <el-input v-model="listQuery.description" size="small" clearable placeholder="案卷描述"/> </search-item> <search-item> <el-select v-model="listQuery.source" size="small" clearable placeholder="请选择信息来源"> <el-option v-for="item in caseSourceList" :key="item.value" :label="item.name" :value="item.value" /> </el-select> </search-item> <search-item> <el-select v-model="listQuery.caseState" size="small" clearable placeholder="请选择案卷状态"> <el-option v-for="item in caseStateList" :key="item.value" :label="item.name" :value="item.value" /> </el-select> </search-item> <div slot="searchMore"> <search-more ref="demo1" :list-query="listQuery"/> </div> </search-area> <!--<search-more v-show="searchMoreShow" ref="searchMore" @searchMore="searchMore"/>--> </div> </template> <script> import { getCaseSourceList, getCaseStateList } from '@/api/seo/seo' import SearchMore from './searchMore' export default { name: 'SearchDiv', components: { SearchMore }, props: { listQuery: { type: Object, default() { return { caseid: '', // 案卷编号 caseState: '', // 案卷状态 source: '', // 案卷来源 description: '', // 案卷描述 fieldintro: '', // 地点描述 eorc: '', // 案卷类型, casetypeCode: '', // 大类 casetypeDetailCode: '', // 小类 onedeptid: '', // 业务单位id filingType: '', // 归档类型 isShopCase: '', // 是否五包案卷, specialQuery: '', // 超期查询字典值 createUser: '', // 上报人员id createTimeBegin: '', // 案卷录入开始时间 createTimeEnd: '', // 案卷录入结束时间 registerTimeBegin: '', // 立案开始时间 registerTimeEnd: '', // 立案结束时间 closeTimeBegin: '', // 结案开始时间 closeTimeEnd: '', // 结案结束时间 offset: 1, limit: 10, sort: '', order: '' } } } }, data() { return { searchMoreShow: false, // 高级检索弹窗是否显示 caseSourceList: [], caseStateList: [] } }, mounted() { this.getCaseSource() this.getCaseState() }, methods: { // 搜索回调 searchCallback() { // this.search({ ...this.$refs.demo1.listQuery }) this.search({ ...this.listQuery }) }, // 获取案卷来源列表 getCaseSource() { getCaseSourceList().then(response => { this.caseSourceList = response.data }) }, // 获取案卷状态列表 getCaseState() { getCaseStateList().then(response => { this.caseStateList = response.data }) }, // 查询条件 search(obj = this.listQuery) { obj.offset = 1 this.$emit('searchForm', obj) }, // 执行高级查询 searchMore(listQuery) { this.$emit('searchForm', listQuery) }, openSearchMore() { this.searchMoreShow = true this.$refs.searchMore.initDialog(this.searchMoreShow) }, // 重置后的操作, 若不需要显示重置按钮则不需要写 clearInput() { const offset = this.listQuery.offset const limit = this.listQuery.limit const sort = this.listQuery.sort const order = this.listQuery.order this.listQuery = { caseid: '', // 案卷编号 caseState: '', // 案卷状态 source: '', // 案卷来源 description: '', // 案卷描述 fieldintro: '', // 地点描述 eorc: '', // 案卷类型, casetypeCode: '', // 大类 casetypeDetailCode: '', // 小类 onedeptid: '', // 业务单位id filingType: '', // 归档类型 isShopCase: '', // 是否五包案卷, specialQuery: '', // 超期查询字典值 createUser: '', // 上报人员id createTimeBegin: '', // 案卷录入开始时间 createTimeEnd: '', // 案卷录入结束时间 registerTimeBegin: '', // 立案开始时间 registerTimeEnd: '', // 立案结束时间 closeTimeBegin: '', // 结案开始时间 closeTimeEnd: '', // 结案结束时间 offset: offset, limit: limit, sort: sort, order: order } this.searchCallback() // this.$message.success('clearInput') } } } </script> <style scoped> .search-div{ /* padding-top: 50px; */ /* padding-bottom: -40px; */ /*margin-top: 20px;*/ /*margin-left: 20px;*/ } .el-form-item { margin-bottom: 5px !important; } </style>