search.vue

<template>
  <div class="search-layout">
    <nafm-header title="信息披露" navClass="nafmii-head-bg3">
      <template #bottom>
        <SearchInput v-model.trim="keyword" placeholder="请输入机构/债券简称/标题关键字" @search="handleSearch" />
      </template>
    </nafm-header>
    <div class="history-container">
      <SearchHistory stateKey="InfoDisclosure" @jumpPage="jumpResultPage" />
    </div>
    <slot />
  </div>
</template>
<script>
import SearchInput from '@/components/SearchInput';
import SearchHistory from '@/components/SearchHistory';
import {KeywordBus} from '@/utils/eventBus'
export default {
  name: 'InfoDisclosureSearch', // 注册发行搜索页面
  components: {
    SearchInput,
    SearchHistory
  },
  data() {
    return {
      keyword: ''
    }
  },
  mounted() {
  },
  methods: {
    handleJumpAction(keyword) {
      this.$store.dispatch('search/APushInfoDisclosureSearchValue', keyword)
      KeywordBus.emit(keyword)
      this.$router.back()
    },
    // 点击历史搜索页面tag签 或者搜索关键字回车 跳转到 搜索页面
    handleSearch(val) {
      const keyword = val || this.keyword
      if (!keyword) {
        Toast('搜索内容不能为空')
        return
      }
      this.handleJumpAction(keyword)
    },
    jumpResultPage(val) {
      this.handleJumpAction(val)
    },
  }
}
</script>
<style lang="less" scoped>
.search-layout {
  height: 100%;
  display: flex;
  flex-direction: column;
  .history-container {
    flex: 1;
  }
}
/deep/ .nav_bottom_container {
  display: flex;
  flex-direction: row;
  align-items: center;
  .filter {
    width: 18px;
    height: 21px;
    margin-left: 15px;
  }
}
</style>