subList.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <div class="sub_list">
  3. <tit :tname="name"/>
  4. <ul class="sub_nav clear-both">
  5. <li class="active">招投标订阅</li>
  6. <li>工程项目订阅</li>
  7. </ul>
  8. <!-- 订阅列表 -->
  9. <ul class="sub_list_show">
  10. <li @click="tojump">
  11. <subs/>
  12. </li>
  13. <li @click="tojump">
  14. <subs/>
  15. </li>
  16. <li @click="tojump">
  17. <subs/>
  18. </li>
  19. </ul>
  20. <!-- end:订阅列表 -->
  21. <button @click="jump">添加订阅</button>
  22. </div>
  23. </template>
  24. <script>
  25. import subs from '~/components/subItem.vue'
  26. import tit from '~/components/titles.vue'
  27. export default {
  28. data() {
  29. return {
  30. name: '订阅列表'
  31. }
  32. },
  33. components: {
  34. subs,
  35. tit
  36. },
  37. methods: {
  38. // selected: function(index){
  39. // this.current=index;
  40. // }
  41. jump() {
  42. this.$router.push({
  43. path: 'sub'
  44. })
  45. },
  46. tojump: function() {
  47. this.$router.push({
  48. path: 'subMine'
  49. })
  50. }
  51. }
  52. }
  53. </script>
  54. <style scoped>
  55. .sub_list {
  56. width: 100%;
  57. background-color: #f8f9fa !important;
  58. padding-bottom: 50px;
  59. height: auto;
  60. }
  61. .sub_list button {
  62. width: 100%;
  63. height: 50px;
  64. line-height: 50px;
  65. position: fixed;
  66. background-color: #ff5c5c;
  67. text-align: center;
  68. bottom: 0;
  69. max-width: 500px;
  70. color: #fff;
  71. font-size: 18px;
  72. border: 0;
  73. outline: none;
  74. }
  75. .sub_list .sub_list_show {
  76. width: 100%;
  77. padding: 0 1.5rem;
  78. }
  79. .sub_nav {
  80. width: 100%;
  81. background-color: #fff;
  82. margin-bottom: 20px;
  83. }
  84. .sub_nav li {
  85. width: 50%;
  86. float: left;
  87. text-align: center;
  88. height: 40px;
  89. line-height: 40px;
  90. }
  91. .sub_nav li.active {
  92. color: #ff5c5c;
  93. }
  94. </style>