<template>
  <div>
    <div style="margin: 20px 0;padding: 0" class="bread-menu">
      <nuxt-link to="/">首页></nuxt-link>
      <span>搜索结果页</span>
    </div>
    <ul class="v-ul clearfix">
      <li v-for="menu in findList" :key="menu.id">
        <nuxt-link  :to="menu.link + '?keywords=' + listQuery.keyword" style="color:#000"  :class="router== menu.link?'active':''">{{ menu.name }} ({{menu.number}})</nuxt-link>
      </li>
    </ul>
  </div>
</template>

<script>
import axios from "../plugins/axios";
export default {
  data() {
    return {
     router: "/",
      tourType: [],
      campsiteType: [],
      findList: [
        { id: 1, value: "1", name: "综合", link: "/findList/all", number: 0 },
        { id: 2, value: "2", name: "车型", link: "/findList/findVehicle", number: 0 },
        { id: 3, value: "3", name: "旅游", link: "/findList/findTour", number: 0 },
        { id: 4, value: "4", name: "营地", link: "/findList/findCampsite", number: 0 },
        { id: 5, value: "5", name: "活动", link: "/findList/findActivity", number: 0 },
        { id: 6, value: "6", name: "新闻", link: "/findList/findNew", number: 0 },
        { id: 7, value: "7", name: "子公司", link: "/findList/findCompany", number: 0 }
      ],
      allDetail: [],
      carDetail: [],
      tourDetail: [],
      campsiteDetail: [],
      actDetail: [],
      newDetail: [],
      companyDetail: [],
      listQuery: {
        type: "",
        keyword: "",
        page: "",
        limit: ""
      }
    };
  },
  components: {},
  created() {
    this.listQuery.keyword = this.$route.query.keywords;
    this.getAll();
    let router = this.$route.path;
    this.router = router;
    
  },
  methods: {
    
    async getAll() {
      // this.listQuery.keyword = this.$route.query.keywords;
      let {
        data: { data }
      } = await axios.get(
        `/api/uccn/app/unauth/search?type=${this.listQuery.type}&keyword=${this.listQuery.keyword}&page=${this.listQuery.page}&limit=${this.listQuery.limit}`
      );
      this.findList[1].number = data.vehicle.totalCount;
      this.findList[2].number = data.tour.totalCount;
      this.findList[3].number = data.campsite.totalCount;
      this.findList[4].number = data.activity.totalCount;
      this.findList[5].number = data.news.totalCount;
      this.findList[6].number = data.company.totalCount;
      var allNum = 0;
      for (var i = 1; i < 7; i++) {
        allNum = allNum + this.findList[i].number;
      }
      this.findList[0].number = allNum;

    }
  }
};
</script>

<style scoped>
.clearfix:after {
  /*伪元素是行内元素 正常浏览器清除浮动方法*/
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1; /*ie6清除浮动的方式 *号只有IE6-IE7执行，其他浏览器不执行*/
}
.v-ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.v-ul li {
  margin: 0;
  padding: 0;
  list-style: none;
  float: left;
  font-size: 22px;
  padding-right: 30px;
}
.margin-Top {
  margin-top: 70px;
}
.active {
  color: #1bbb9f !important;
  /* border-bottom: 3px solid #1bbb9f !important; */
}
</style>
