完成了鱼塘页面

package.json

@@ -12,6 +12,7 @@
   "dependencies": {
     "axios": "^0.18.0",
     "better-scroll": "^1.12.5",
+    "lrz": "^4.9.40",
     "mint-ui": "^2.2.13",
     "stylus": "^0.54.5",
     "stylus-loader": "^3.0.2",

src/api/data.js

@@ -36,4 +36,33 @@ export function getSmBanner() {
 export function getIndexNav() {
   const url = HOST + '/indexnav'
   return axios.get(url)
+}
+
+export function getBanner() {
+  const url = HOST + '/banner'
+  return axios.get(url)
+}
+
+export function getInterests() {
+  const url = HOST + '/interests'
+  return axios.get(url)
+}
+export function getQuestions() {
+  const url = HOST + '/questions'
+  return axios.get(url)
+}
+
+export function getTuhao() {
+  const url = HOST + '/tuhao'
+  return axios.get(url)
+}
+
+export function getChina() {
+  const url = HOST + '/china'
+  return axios.get(url)
+}
+
+export function getLists() {
+  const url = HOST + '/lists'
+  return axios.get(url)
 }

src/components/Yutang/Banner.vue

@@ -0,0 +1,52 @@
+<template>
+  <div class="swiper-container" ref="swiper">
+    <div class="swiper-wrapper swiper">
+      <div class="swiper-slide item" v-for="(item,index) in banner" :key="index">
+        <img :src="item.src" alt="">
+      </div>
+    </div>
+    <div class="swiper-pagination"></div>
+  </div>
+</template>
+<script>
+import { getBanner, ERR_OK } from '@/api/data'
+import Swiper from 'swiper'
+import 'swiper/dist/css/swiper.min.css'
+export default {
+  data() {
+    return {
+      banner: []
+    }
+  },
+  created() {
+    getBanner().then(res=> {
+      if(res.status === ERR_OK) {
+        // console.log(res.data.banner)
+        this.banner = res.data.banner
+        let swiper = this.$refs.swiper
+        this.$nextTick(()=> {
+        let mySwiper = new Swiper(swiper,{
+        observer:true,
+        observeParents:true,
+        autoplay: {
+          delay: 1000
+        },
+        loop: true,
+        pagination: {
+          el: '.swiper-pagination'
+        }
+        })
+      })
+    }
+  })
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.swiper
+  height 3.2rem
+  img
+    width 100%
+    height 100%
+</style>

src/components/Yutang/Input.vue

@@ -0,0 +1,51 @@
+<template>
+  <div class="inputwrap">
+    <div class="goinput" @click="fail">
+      <input type="text" placeholder="请输入鱼塘关键字">
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    fail() {
+      this.$toast('这个功能小哥哥还未完成哦')
+    }
+  }
+}
+</script>
+
+
+<style lang="stylus" scoped>
+.inputwrap
+  width 10rem
+  height 1.5rem
+  line-height 1.5rem
+  background-color #f7f7f7
+  .goinput
+    width 96%
+    height 100%
+    margin 0 auto
+    text-align center
+    box-sizing border-box
+    padding .3rem
+    display flex
+    justify-content center
+    align-items center
+    input 
+      width 100%
+      height 100%
+      padding-left 40%
+      outline none
+      border none 
+      background-color #fff
+      border-radius .13rem
+      box-sizing border-box
+      background #fff url('../../assets/images/search.png') no-repeat
+      background-size .6rem .6rem
+      background-position 35% 50%
+
+
+
+</style>