search.vue 1.64 KB
<template>
  <div class="resIssue_search_container">
    <NafmHeader title="注册发行" navClass="nafmii-head-bg3">
      <template #bottom>
        <SearchInput v-model="keyword" placeholder="请输入企业名称/注册报告名称/主承销商" @search="handleSearch" />
      </template>
    </NafmHeader>
    <div class="resIssue_search_content">
      <div class="history_title" v-if="list.length">
        <span>搜索历史</span>
        <img :src="require('@/assets/icon/trash.png')">
      </div>
    </div>
  </div>
</template>
<script>
import SearchInput from '@/components/SearchInput.vue'
import { setLocalStorage, getLocalStorage, removeLocalStorage } from '@/utils/LocalStorage'
export default {
  name: 'ResIssueSearch',
  components: {
    SearchInput
  },
  data() {
    return {
      keyword: '',
      list: []
    }
  },
  mounted() {
    this.list = getLocalStorage('resIssucessData') || []
  },
  methods: {
    handleSearch(val) {
      const list = getLocalStorage('resIssucessData') || []
      const length = list.legnth
      const newList = []

      if (list.indexOf(val) === -1) {
        list.unshift(val)
        if (length >= 10) {
          list.pop()
        }
        newList.push(val)
        setLocalStorage('resIssucessData', newList)

        this.list = newList
      }

    }
  }
  // console.log(val);
}
</script>
<style lang="less" scoped>
.resIssue_search_content {
  display: flex;
  flex-direction: column;
  padding: 20px 15px;
  .history_title {
    display: flex;
    justify-content: space-between;
    span {
      color: #666;
      font-size: 11px;
    }
    img {
      width: 25px;
      height: 25px;
    }
  }
}
</style>