1

app.wxss

@@ -1,5 +1,4 @@
 /**app.wxss**/
-@import "/pages/template/template.wxss";
 .container {
   height: 100%;
   display: flex;

component/follow/follow.js

@@ -1,7 +1,6 @@
 //index.js
 //获取应用实例
 const app = getApp()
-let template = require('../../template/template.js');
 
 Page({
   data: {
@@ -12,6 +11,5 @@ Page({
   },
   //事件处理函数
   onLoad: function () {
-    template.tabbar("tabBar", 1, this)//0表示第一个tabbar
   }
 })

component/follow/follow.wxml

@@ -1,6 +1,4 @@
 <view >
-<import src="../../template/template.wxml"></import>
-<template is="tabBar" data="{{tabBar:bindData.tabBar}}"></template>
 <h2>关注</h2>
 <h2>关注</h2>
 <h2>关注</h2>

component/hot/hot.js

@@ -0,0 +1,62 @@
+export const hotInit =  (that) => {
+    that.setData({
+      hotData: {
+        nav: [],
+        hotIndex: 0,
+        hotList: [],
+        left: ''
+      }
+    })
+    //点击更改数据
+    that.hotChoice = ({ currentTarget }) => {
+      that.data.hotData.hotInd = currentTarget.dataset.index;
+      if (that.data.hotData.nav.length > 3 && currentTarget.dataset.index == 2) {
+        that.data.hotData.left = currentTarget.dataset.index * 225;
+      }
+      if (that.data.hotData.nav.length > 3 && currentTarget.dataset.index == 1) {
+        that.data.hotData.left = '';
+      }
+      that.setData({
+        hotData: that.data.hotData
+      })
+      //数据请求
+      that.httpList(currentTarget.dataset.index + 1)
+    }
+    //滑动更改数据
+    that.lookSlide = ({ detail }) => {
+      that.data.hotData.hotInd = detail.current;
+      if (that.data.hotData.nav.length > 3 && detail.current == 2) {
+        that.data.hotData.left = detail.current * 225;
+      }
+      if (that.data.hotData.nav.length > 3 && detail.current == 1) {
+        that.data.hotData.left = '';
+      }
+      // console.log(detail.current);
+      that.setData({
+        hotData: that.data.hotData
+      })
+      that.httpList(detail.current + 1)
+    }
+    //跳转到详情页
+    that.details = ({ currentTarget }) => {
+      const id = currentTarget.dataset.id;
+      wx.navigateTo({
+        url: '/pages/details/details?id=' + id 
+      })
+    }
+    //请求数据封装
+    that.httpList = (ind) => {
+      httpRequestApi.getCourse({
+        categoryId: ind
+      }).success((res)=>{
+        console.log('课程列表', res);
+        that.data.hotData.hotList = res.data.data.list;
+        that.setData({
+            hotData: that.data.hotData
+        })
+      })
+    }
+
+    //初始数据
+    that.httpList(1)
+  }

component/hot/hot.wxml

@@ -0,0 +1,3 @@
+<view >
+<h1>热门</h1>
+</view>

component/my/index.js

@@ -1,17 +0,0 @@
-//index.js
-//获取应用实例
-const app = getApp()
-let template = require('../../template/template.js');
-
-Page({
-  data: {
-
-  },
-  onReady: function(res){
-    
-  },
-  //事件处理函数
-  onLoad: function () {
-    template.tabbar("tabBar", 2, this)//0表示第一个tabbar
-  }
-})

component/my/index.wxml

@@ -1,11 +0,0 @@
-<view >
-<import src="../../template/template.wxml"></import>
-<template is="tabBar" data="{{tabBar:bindData.tabBar}}"></template>
-<h1>我的</h1>
-<h1>我的</h1>
-<h1>我的</h1>
-<h1>我的</h1>
-<h1>我的</h1>
-<h1>我的</h1>
-<h1>我的</h1>
-</view>

component/my/my.js

@@ -0,0 +1,15 @@
+//index.js
+//获取应用实例
+const app = getApp()
+
+Page({
+  data: {
+
+  },
+  onReady: function(res){
+    
+  },
+  //事件处理函数
+  onLoad: function () {
+  }
+})

component/my/my.wxml

@@ -0,0 +1,9 @@
+<view >
+<h1>我的</h1>
+<h1>我的</h1>
+<h1>我的</h1>
+<h1>我的</h1>
+<h1>我的</h1>
+<h1>我的</h1>
+<h1>我的</h1>
+</view>

pages/index/index.js

@@ -1,49 +1,44 @@
 //index.js
 //获取应用实例
 const app = getApp()
-import { lookInit } from '../../component/look/look';
-import { myInit } from '../../component/mys/mys';
-import { searchInit } from '../../component/search/search';
-import httpRequestApi from '../../utils/APIRequest';
-import httputil from '../../utils/httputil';
+import { hotInit } from '../../component/hot/hot';
+// import { myInit } from '../../component/my/my';
+// import { searchInit } from '../../component/follow/follow';
+// import httpRequestApi from '../../utils/APIRequest';
+// import httputil from '../../utils/httputil';
 Page({
   data: {
     tab:[
       {
-        name: '看',
-        templates: 'look',
-        img: '../../static/image/look1.png',
-        selectimg: '../../static/image/look2.png'
+        name: '热门',
+        templates: 'hot',
+      },  
+      {
+        name: '关注',
+        templates: 'follow',
       },  
       {
-        name: '搜',
-        templates: 'search',
-        img: '../../static/image/sou1.png',
-        selectimg: '../../static/image/sou2.png'
-      },  {
         name: '我的',
-        templates: 'mys',
-        img: '../../static/image/my1.png',
-        selectimg: '../../static/image/my2.png'
+        templates: 'my',
       }
     ],
     ind: 0,
-    templates: 'look',
+    templates: 'hot',
     jurisdictionFlag: true
   },
   //tab点击
   switcher: function({currentTarget}) {
-    let ind = currentTarget.dataset.ind;
-    let templates = this.data.tab[ind].templates;
+    let index = currentTarget.dataset.index;
+    let templates = this.data.tab[index].templates;
     //console.log(this.data[ind])
     this.setData({
-      ind,
+      index,
       templates
     })
-    if (ind == 1) {
+    if (index == 1) {
       searchInit(this);
     }
-    if (ind == 2) {
+    if (index == 2) {
       myInit(this);
     }
   },
@@ -53,17 +48,17 @@ Page({
     },1000)
   },
   onLoad: function (options) {
-    if(options.ind) {
-      let ind = options.ind;
-      let templates = this.data.tab[ind].templates;
+    if(options.index) {
+      let index = options.index;
+      let templates = this.data.tab[index].templates;
       this.setData({
         templates,
-        ind,
+        index,
       })
-      if (ind == 1) {
+      if (index == 1) {
         searchInit(this);
       }
-      if (ind == 2) {
+      if (index == 2) {
         myInit(this);
       }
     }
@@ -71,17 +66,17 @@ Page({
   },
   //初始化数据
   init: function () {
-    httputil.getOpenidSessionKey((res) => {
-      console.log('微信的用户信息', res);
-      this.setData({
-        jurisdictionFlag: true
-      })
-      lookInit(this);
-    },(error) => {
-      console.log(error);
-      this.setData({
-        jurisdictionFlag: false
-      })
-    });
+    // httputil.getOpenidSessionKey((res) => {
+    //   console.log('微信的用户信息', res);
+    //   this.setData({
+    //     jurisdictionFlag: true
+    //   })
+    //   lookInit(this);
+    // },(error) => {
+    //   console.log(error);
+    //   this.setData({
+    //     jurisdictionFlag: false
+    //   })
+    // });
   }
 })

pages/index/index.wxml

@@ -1,25 +1,23 @@
 <!--index.wxml-->
 <view class="container">
   <!-- 引入组件 -->
-  <import src="/component/look/look.wxml"/>
-  <import src="/component/search/search.wxml"/> 
-  <import src="/component/mys/mys.wxml"/>  
+  <import src="/component/hot/hot.wxml"/>
+  <!-- <import src="/component/follow/follow.wxml"/>  -->
+  <!-- <import src="/component/my/my.wxml"/>   -->
   <!--调用组件-->
   <!--<template is="{{templates}}" data="{{lookData: lookData, searchData: searchData, myData: myData}}"></template>-->
-  <view class="template" wx:if="{{templates == 'look'}}">
-    <template is="{{templates}}" data="{{lookData: lookData}}"></template>
+  <view class="template" wx:if="{{templates == 'hot'}}">
+    <template is="{{templates}}" data="{{hotData: hotData}}"></template>
   </view>
-  <view class="template" wx:elif="{{templates == 'search'}}">
-    <template is="{{templates}}" data="{{searchData: searchData}}"></template>
+  <view class="template" wx:elif="{{templates == 'follow'}}">
+    <template is="{{templates}}" data="{{followData: followData}}"></template>
   </view>
-  <view class="template" wx:else="{{templates == 'mys'}}">
+  <view class="template" wx:else="{{templates == 'my'}}">
     <template is="{{templates}}" data="{{myData: myData}}"></template>
   </view>
-  <button class="jurisdiction" hidden="{{jurisdictionFlag}}" open-type="getUserInfo" bindtap="jurisdiction">点击授权</button>
-  <view class="bottom-tab">
+  <view class="top-tab">
       <block  wx:for="{{tab}}" wx:key="{{index}}">
       <view class="tabbar {{index == ind ? 'select':' '}}" bindtap="switcher" data-ind="{{index}}">
-          <image src="{{index == ind ? item.selectimg : item.img}}"></image>
           <text>{{item.name}}</text>
       </view>
       </block>            

pages/index/index.wxss

@@ -1,30 +1,27 @@
 /**index.wxss**/
 /*看*/
-@import "/component/look/look.wxss";
+/* @import "/component/look/look.wxss"; */
 /*搜索*/
-@import "/component/search/search.wxss";
+/* @import "/component/search/search.wxss"; */
 /*我的*/
-@import "/component/mys/mys.wxss";
+/* @import "/component/mys/mys.wxss"; */
 .template {
   height: 100%;
 }
 .scroll-view {
   height: 100%;
 }
-.bottom-tab {
+.top-tab {
   position: fixed;
-  bottom: 28rpx;
-  left: 5%;
-  width: 90%;
-  height: 152rpx;
-  background: #fff;
+  top: 0;
+  width: 100%;
+  height: 80rpx;
+  background:#fff;
   color: #6a6a6a;
-  border-radius: 152rpx;
   box-sizing: border-box;
   display: flex;
   justify-content: space-between;
   align-items: center;
-  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 3px 6px 0 rgba(0, 0, 0, .2);
 }
 
 .tabbar {
@@ -32,14 +29,16 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  height: 100%;
-  font-size: 48rpx;
-  border-radius: 152rpx;
+  width: 125rpx;
+  height: 60rpx;
+  font-size: 32rpx;
+  border-radius: 100rpx;
+  background: #fff;
 }
 
 .select {
-  background: #fece00;
-  color: #000;
+  background: #61ca54;
+  color: #fff;
 }
 
 .bottom-tab image {