<template>
  <div class="sub_list">
    <tit :tname="name"/>
    <ul class="sub_nav clear-both">
      <li class="active">招投标订阅</li>
      <li>工程项目订阅</li>
    </ul>
    <!-- 订阅列表 -->
    <ul class="sub_list_show">
      <li @click="tojump">
        <subs/>
      </li>
      <li @click="tojump">
        <subs/>
      </li>
      <li @click="tojump">
        <subs/>
      </li>
    </ul>
    <!-- end：订阅列表 -->
    <button @click="jump">添加订阅</button>
  </div>
</template>

<script>
import subs from '~/components/subItem.vue'
import tit from '~/components/titles.vue'

export default {
  data() {
    return {
      name: '订阅列表'
    }
  },
  components: {
    subs,
    tit
  },
  methods: {
    // selected: function(index){
    //   this.current=index;
    // }
    jump() {
      this.$router.push({
        path: 'sub'
      })
    },
    tojump: function() {
      this.$router.push({
        path: 'subMine'
      })
    }
  }
}
</script>
  
<style scoped>
.sub_list {
  width: 100%;
  background-color: #f8f9fa !important;
  padding-bottom: 50px;
  height: auto;
}
.sub_list button {
  width: 100%;
  height: 50px;
  line-height: 50px;
  position: fixed;
  background-color: #ff5c5c;
  text-align: center;
  bottom: 0;
  max-width: 500px;
  color: #fff;
  font-size: 18px;
  border: 0;
  outline: none;
}
.sub_list .sub_list_show {
  width: 100%;
  padding: 0 1.5rem;
}
.sub_nav {
  width: 100%;
  background-color: #fff;
  margin-bottom: 20px;
}
.sub_nav li {
  width: 50%;
  float: left;
  text-align: center;
  height: 40px;
  line-height: 40px;
}
.sub_nav li.active {
  color: #ff5c5c;
}
</style>