Files
foton-laws-system-front/src/pages/home1/components/searchGroup/index.vue
T

126 lines
2.4 KiB
Vue

<!-- 搜索栏 -->
<template>
<div class="search-group">
<el-select
v-model="checkState"
class="search-group-item"
placeholder="请选择"
>
<el-option
v-for="item in jumpPage"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<div class="search-condition">
<el-input
@keyup.native.enter="search"
v-model="checkContent">
type="text"
placeholder="请输入关键词"
clearable
></el-input>
<el-button class="primary_button" type="primary" @click="search">搜索</el-button>
</div>
</div>
</template>
<script>
export default {
name: 'SearchGroup',
components: {},
mixins: [],
data() {
return {
// 当前查询状态
checkState: 'All',
// 查询内容
checkContent: '',
jumpPage: [
{
label: '全部',
value: 'All'
},
{
label: '国内标准法规',
value: 'stand'
},
{
label: '海外标准法规', // value没改
value: 'bussstand'
},
// {
// label: '国内外政策',
// value: 'laws'
// },
{
label: '企业标准',
value: 'enterprise'
}
],
}
},
computed: {},
watch: {},
methods: {
search() {
this.$router.push({
name: 'StandardSearch',
params: {
selectKey: this.checkState,
searchValue: this.checkContent || undefined
}
})
},
},
mounted(){
},
}
</script>
<style lang="less" scoped>
.search-group {
display: flex;
width: 60vw;
height: 50px;
margin-bottom: 20px;
.search-group-item {
margin-right: 20px;
::v-deep {
.el-input__inner {
width: 18vm;
height: 50px;
color: #fff;
border: 0;
border-radius: 0px;
background: rgba(182, 213, 255, 0.22);
}
}
}
.search-condition {
display: flex;
flex: 1;
::v-deep {
.el-input__inner {
height: 50px;
font-size: 16px;
color: #fff;
border: 0;
border-radius: 0px;
background: rgba(182, 213, 255, 0.22);
}
}
}
.primary_button {
width: 8.2vw;
height: 50px;
border: 0;
border-radius: 0px;
background-color: #5ea9f6;
}
}
</style>