first commit

app.js

@@ -0,0 +1,7 @@
+//app.js
+App({
+  globalData:{
+    appkey:'c39621ea5b825547001f9858a643f182',
+    pagesize:10,
+  }
+})

app.json

@@ -0,0 +1,41 @@
+{
+  "pages":[
+    "pages/joke/joke",
+    "pages/picture/picture",
+    "pages/index/index"
+  ],
+  "window":{
+    "backgroundTextStyle":"light",
+    "navigationBarBackgroundColor": "#268dcd",
+    "navigationBarTitleText": "开心一刻",
+    "navigationBarTextStyle":"white",
+    "enablePullDownRefresh":true
+  },
+  "tabBar": {
+    "color": "#000000",
+    "selectedColor": "#268dcd",
+    "borderStyle": "white",
+    "backgroundColor": "#ffffff",
+    "list": [
+      {
+        "pagePath": "pages/joke/joke",
+        "text": "笑话",
+        "iconPath": "image/ic_joke_gray.png",
+        "selectedIconPath": "image/ic_joke_blue.png"
+      },
+      {
+        "pagePath": "pages/picture/picture",
+        "text": "趣图",
+        "iconPath": "image/ic_gif_gray.png",
+        "selectedIconPath": "image/ic_gif_blue.png"
+      }
+
+    ]
+  },
+  "netWorkTimeout": {
+    "request": 10000,
+    "connectSocket": 10000,
+    "uploadFile": 10000,
+    "downloadFile": 10000
+  }
+}

app.wxss

@@ -0,0 +1,26 @@
+/**app.wxss**/
+.container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+} 
+
+page{
+  height: 100%;
+}
+
+.page-body {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  height: 100%;
+}
+
+
+.loading-view{
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  padding: 10px;
+}

pages/index/index.js

@@ -0,0 +1,26 @@
+//index.js
+//获取应用实例
+var app = getApp()
+Page({
+  data: {
+    motto: 'Hello World',
+    userInfo: {}
+  },
+  //事件处理函数
+  bindViewTap: function() {
+    wx.navigateTo({
+      url: '../logs/logs'
+    })
+  },
+  onLoad: function () {
+    console.log('onLoad')
+    var that = this
+    //调用应用实例的方法获取全局数据
+    app.getUserInfo(function(userInfo){
+      //更新数据
+      that.setData({
+        userInfo:userInfo
+      })
+    })
+  }
+})

pages/index/index.wxml

@@ -0,0 +1,10 @@
+<!--index.wxml-->
+<view class="container">
+  <view  bindtap="bindViewTap" class="userinfo">
+    <image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
+    <text class="userinfo-nickname">{{userInfo.nickName}}</text>
+  </view>
+  <view class="usermotto">
+    <text class="user-motto">{{motto}}</text>
+  </view>
+</view>

pages/index/index.wxss

@@ -0,0 +1,21 @@
+/**index.wxss**/
+.userinfo {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.userinfo-avatar {
+  width: 128rpx;
+  height: 128rpx;
+  margin: 20rpx;
+  border-radius: 50%;
+}
+
+.userinfo-nickname {
+  color: #aaa;
+}
+
+.usermotto {
+  margin-top: 200px;
+}

pages/joke/joke.js

@@ -0,0 +1,57 @@
+var http = require( '../../utils/util' )
+var app = getApp()
+var url = 'http://japi.juhe.cn/joke/content/text.from'
+
+Page( {
+  data: {
+    page: 1,
+    loadingHide: false,
+    hideFooter: true,
+    jokeList: [],
+  },
+  onLoad: function( options ) {
+    // 页面初始化 options为页面跳转所带来的参数
+    var that = this
+    //请求笑话列表
+    http.request( url, this.data.page, function( dataJson ) {
+      that.setData( {
+        jokeList: that.data.jokeList.concat( dataJson.result.data ),
+        loadingHide: true
+      })
+    }, function( reason ) {
+      console.log( reason )
+      that.setData( {
+        loadingHide: true
+      })
+    })
+
+  },
+
+  /**
+   * 滑动到底部加载更多
+   */
+  loadMore() {
+    //请求笑话列表
+    var that = this
+    //显示footer
+    this.setData( {
+      hideFooter: !this.data.hideFooter
+    })
+    //请求笑话列表
+    http.request( url, ++this.data.page, function( dataJson ) {
+      that.setData( {
+        jokeList: that.data.jokeList.concat( dataJson.result.data ),
+        hideFooter: !that.data.hideFooter
+      })
+
+    }, function( reason ) {
+      console.log( reason )
+      that.setData( {
+        hideFooter: !that.data.hideFooter
+      })
+    })
+
+
+  },
+
+})

pages/joke/joke.json

@@ -0,0 +1,3 @@
+{
+    "navigationBarTitleText": "笑话大全"
+}

pages/joke/joke.wxml

@@ -0,0 +1,14 @@
+<scroll-view scroll-y="true" class="page-body" bindscrolltolower="loadMore">
+    <view class="item-view" wx:for="{{jokeList}}">
+        <text class="content">{{item.content}}</text>
+        <text class="date">{{item.updatetime}}</text>
+    </view>
+    <view class="loading-view" hidden="{{hideFooter}}">
+        <image src="../../image/loading.gif" style="height:26px;width:26px"/>
+        <text style="font-size:20px">正在加载</text>
+    </view>
+</scroll-view>
+
+<loading hidden="{{loadingHide}}">
+    加载中...
+</loading>

pages/joke/joke.wxss

@@ -0,0 +1,17 @@
+.item-view{
+    padding: 10px;
+    display: flex;
+    flex-direction: column;
+    border-bottom: 1px solid gray;
+}
+
+.item-view .content{
+    color: black;
+}
+
+.item-view .date{
+    color: grey;
+    margin-top: 10px;
+}
+
+

pages/picture/picture.js

@@ -0,0 +1,55 @@
+var app = getApp()
+var http = require( '../../utils/util' )
+var url = 'http://japi.juhe.cn/joke/img/text.from'
+Page( {
+  data: {
+    page: 1,
+    loadingHide: false,
+    picList: []
+  },
+  onLoad: function( options ) {
+    // 页面初始化 options为页面跳转所带来的参数
+    var that = this
+    //请求笑话列表
+    http.request( url, this.data.page, function( dataJson ) {
+      that.setData( {
+        picList: that.data.picList.concat( dataJson.result.data ),
+        loadingHide: true
+      })
+    }, function( reason ) {
+      console.log( reason )
+      that.setData( {
+        loadingHide: true
+      })
+    })
+  },
+
+  /**
+   * 滑动到底部加载更多
+   */
+  loadMore() {
+    //请求笑话列表
+    var that = this
+    http.request( url, ++this.data.page, function( dataJson ) {
+      that.setData( {
+        picList: that.data.picList.concat( dataJson.result.data ),
+
+      })
+    }, function( reason ) {
+      console.log( reason )
+      that.setData( {
+
+      })
+    })
+  },
+
+  preview( e ) {
+    console.log( e.target.dataset.url )
+    var urls = []
+    urls.push( e.target.dataset.url )
+    wx.previewImage( {
+      urls: urls // 需要预览的图片http链接列表
+    })
+  }
+
+})

pages/picture/picture.json

@@ -0,0 +1,3 @@
+{
+    "navigationBarTitleText": "搞笑趣图"
+}

pages/picture/picture.wxml

@@ -0,0 +1,11 @@
+<scroll-view scroll-y="true" class="page-body" bindscrolltolower="loadMore">
+    <view class="item-view" wx:for="{{picList}}">
+        <text class="content">{{item.content}}</text>
+        <image src="{{item.url}}" mode="aspectFit" catchtap="preview" data-url="{{item.url}}"/>
+        <text class="date">{{item.updatetime}}</text>
+    </view>
+</scroll-view>
+
+<loading hidden="{{loadingHide}}">
+    加载中...
+</loading>

pages/picture/picture.wxss

@@ -0,0 +1,17 @@
+.item-view{
+    padding: 10px;
+    display: flex;
+    flex-direction: column;
+    border-bottom: 1px solid gray;
+}
+
+.item-view image{
+    width: 100%;
+    height: 400rpx;
+    margin-top: 10px;
+}
+
+.item-view .date{
+    color: grey;
+    margin-top: 10px;
+}

utils/util.js

@@ -0,0 +1,35 @@
+/**
+ * 请求网络
+ */
+function request( url, page, success, fail ) {
+  if( typeof success != 'function' || typeof fail != 'function' ) {
+    return
+  }
+  var app = getApp()
+  wx.request( {
+    url: url,
+    data: {
+      key: app.globalData.appkey,
+      page: page,
+      pagesize: app.globalData.pagesize
+    },
+    header: {
+      'Content-Type': 'application/json'
+    },
+    success: function( res ) {
+      if( res.data.error_code == 0 ) {
+        success( res.data )
+      } else {
+        fail( res.data.reason )
+      }
+    },
+    fail: function() {
+      fail( '网络错误' )
+    }
+
+  })
+}
+
+module.exports = {
+  request: request
+}