开发朗读比赛

api/user.js

@@ -5,8 +5,6 @@ import {
 module.exports = {
   // 用户登录
   userLogin: data => request('/user/openId', 'get', data),
-  //获取用户信息
-  getMyInfo: data => request('/v3/user/my', 'get', data),
   //获取他人用户信息,
   getUserInfo: data => request('/user/info', 'get', data),
   //获取用户信息

app.js

@@ -17,8 +17,6 @@ App({
     let {
       scene
     } = wx.getLaunchOptionsSync()
-    console.log(scene, 'res');
-
     this.globalData.scene = scene
   },
   async onShow(options) {

app.json

@@ -1,5 +1,6 @@
 {
   "pages": [
+    "pages/match/index",
     "pages/index/index",
     "pages/medalStore/index",
     "pages/my/index",

components/activityList/index.less

@@ -272,7 +272,7 @@
 
     .cover {
       width: 100%;
-      height: 260rpx;
+      height: 216rpx;
       border-radius: 20rpx;
       background-color: #EBEBEB;
     }

components/activityList/index.wxss

@@ -220,7 +220,7 @@
 }
 .activityList .activityBox .cover {
   width: 100%;
-  height: 260rpx;
+  height: 216rpx;
   border-radius: 20rpx;
   background-color: #EBEBEB;
 }

pages/index/index.js

@@ -24,6 +24,7 @@ Page({
     // 控制一级分类是否固定
     isFixed: false,
     desktopTips: false,
+    isIOS: false,
     categoryList: []
   },
   /**
@@ -44,10 +45,18 @@ Page({
       isIOS,
       scene
     } = app.globalData
-    this.setData({
-      desktopTips: isIOS ? scene != 1104 : scene != 1023
-    })
-    console.log(isIOS ? scene != 1104 : scene != 1023);
+    let desktopTips = isIOS ? scene != 1104 : scene != 1023
+    if (desktopTips) {
+      this.setData({
+        isIOS,
+        desktopTips
+      })
+      setTimeout(() => {
+        this.setData({
+          desktopTips: false
+        })
+      }, 8000)
+    }
     let uid = wx.getStorageSync('uid')
     /*  if (uid) {
        this.getLocUserInfo()
@@ -136,4 +145,9 @@ Page({
       }
     }
   },
+  closeDesktop() {
+    this.setData({
+      desktopTips: false
+    })
+  }
 })

pages/index/index.wxml

@@ -2,10 +2,10 @@
 <view class="recommend">
   <banner classify='1' />
   <!-- 加桌提示 -->
-  <view class="desktopTips" style="top:{{navBarHeight+3}}px">
+  <view class="desktopTips" wx:if="{{desktopTips}}" style="top:{{navBarHeight+3}}px" bindtap="closeDesktop">
     <view class="triangle"></view>
     <image
-      src="{{app.globalData.isIOS?'http://reader-wx.ai160.com/images/reader/v3/desktop-ios.png':'http://reader-wx.ai160.com/images/reader/v3/desktop-android.png'}}"
+      src="{{isIOS?'http://reader-wx.ai160.com/images/reader/v3/desktop-ios.png':'http://reader-wx.ai160.com/images/reader/v3/desktop-android.png'}}"
       class="tipsImg" />
   </view>
   <!-- 滚动定位 -->

pages/match/index.js

@@ -0,0 +1,45 @@
+// pages/match/index.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    // true是人气榜，false是参赛作品
+    currentType: true,
+    bannerList: [{
+      id: 1,
+      url: "https://efunimgs.ai160.com/xyyf/banner/voucher.png"
+    }, {
+      id: 2,
+      url: "https://efunimgs.ai160.com/xyyf/banner/course.png"
+    }, {
+      id: 3,
+      url: "https://efunimgs.ai160.com/xyyf/banner/video.png"
+    }, {
+      id: 4,
+      url: "https://efunimgs.ai160.com/xyyf/banner/topic.png"
+    }]
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+  bannelEvent() {},
+  selectType({
+    target
+  }) {
+    if (target.dataset.type) {
+      this.setData({
+        currentType: JSON.parse(target.dataset.type)
+      })
+
+    }
+  },
+  onShareAppMessage() {
+
+  }
+})

pages/match/index.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "朗读比赛"
+}

pages/match/index.less

@@ -0,0 +1,96 @@
+.matchBox {
+  background-color: F2F6FC;
+
+  .headerImg {
+    width: 100%;
+    height: 216rpx;
+    background-color: #5DE0C0;
+  }
+
+  .modelText {
+    width: 724rpx;
+    margin: 40rpx auto;
+    border-radius: 20rpx;
+    background-color: white;
+
+    .header {
+      position: relative;
+      text-align: center;
+
+      .bg {
+        position: absolute;
+        top: -24rpx;
+        left: 0rpx;
+        right: 0rpx;
+        margin: auto;
+        width: 460rpx;
+        height: 90rpx;
+      }
+
+      .text {
+        position: relative;
+        z-index: 2;
+        font-size: 36rpx;
+        color: #A0A0A0;
+      }
+    }
+
+    .tips {
+      margin: 42rpx auto;
+      width: 580rpx;
+      padding: 6rpx 0rpx;
+      text-align: center;
+      letter-spacing: 2rpx;
+      border-radius: 20rpx;
+      font-size: 30rpx;
+      color: #858585;
+      background-color: #F8F6FF;
+    }
+
+    .swiper {
+      .swiper-item {
+        width: 580rpx;
+        height: 238rpx;
+        border-radius: 10rpx;
+        overflow: hidden;
+        object-fit: cover;
+      }
+    }
+  }
+
+  .rankList {
+    width: 100%;
+    margin-top: 60rpx;
+    background-color: white;
+
+    .switchBtns {
+      height: 88rpx;
+      display: flex;
+      align-items: flex-end;
+      background-color: #D5DDEA;
+
+      .switchBtn {
+        width: 50%;
+        font-size: 34rpx;
+        padding: 20rpx 0rpx;
+        background-color: #D5DDEA;
+        text-align: center;
+      }
+
+      .currentBtn {
+        color: #FF6908;
+        padding: 30rpx 10rpx;
+        font-weight: bold;
+        background-color: white;
+      }
+
+      .currentBtn-l {
+        border-top-right-radius: 50rpx;
+      }
+
+      .currentBtn-r {
+        border-top-left-radius: 50rpx;
+      }
+    }
+  }
+}

pages/match/index.wxml

@@ -0,0 +1,26 @@
+<view class="matchBox">
+  <image src="" class="headerImg" />
+  <view class="modelText">
+    <view class="header">
+      <image src="/static/modelBg.png" class="bg" />
+      <view class="text">一年级朗读范文素材</view>
+    </view>
+    <view class="tips">
+      选择下面范文进行朗读
+    </view>
+    <swiper class="swiper" autoplay circular indicator-dots previous-margin='36px' next-margin='20px'
+      indicator-active-color="#7ACAFF" indicator-color='#BABABA'>
+      <block wx:for="{{bannerList}}" wx:key="id">
+        <swiper-item bindtap='bannelEvent'>
+          <image src="{{item.url}}" class="swiper-item" mode="" />
+        </swiper-item>
+      </block>
+    </swiper>
+  </view>
+  <view class="rankList">
+    <view class="switchBtns" bindtap="selectType">
+      <view class="switchBtn {{currentType?'currentBtn currentBtn-l':''}}" data-type='true'>人气榜TOP100</view>
+      <view class="switchBtn {{!currentType?'currentBtn currentBtn-r':''}}" data-type='false'>我的参赛作品</view>
+    </view>
+  </view>
+</view>

pages/match/index.wxss

@@ -0,0 +1,81 @@
+.matchBox {
+  background-color: F2F6FC;
+}
+.matchBox .headerImg {
+  width: 100%;
+  height: 216rpx;
+  background-color: #5DE0C0;
+}
+.matchBox .modelText {
+  width: 724rpx;
+  margin: 40rpx auto;
+  border-radius: 20rpx;
+  background-color: white;
+}
+.matchBox .modelText .header {
+  position: relative;
+  text-align: center;
+}
+.matchBox .modelText .header .bg {
+  position: absolute;
+  top: -24rpx;
+  left: 0rpx;
+  right: 0rpx;
+  margin: auto;
+  width: 460rpx;
+  height: 90rpx;
+}
+.matchBox .modelText .header .text {
+  position: relative;
+  z-index: 2;
+  font-size: 36rpx;
+  color: #A0A0A0;
+}
+.matchBox .modelText .tips {
+  margin: 42rpx auto;
+  width: 580rpx;
+  padding: 6rpx 0rpx;
+  text-align: center;
+  letter-spacing: 2rpx;
+  border-radius: 20rpx;
+  font-size: 30rpx;
+  color: #858585;
+  background-color: #F8F6FF;
+}
+.matchBox .modelText .swiper .swiper-item {
+  width: 580rpx;
+  height: 238rpx;
+  border-radius: 10rpx;
+  overflow: hidden;
+  object-fit: cover;
+}
+.matchBox .rankList {
+  width: 100%;
+  margin-top: 60rpx;
+  background-color: white;
+}
+.matchBox .rankList .switchBtns {
+  height: 88rpx;
+  display: flex;
+  align-items: flex-end;
+  background-color: #D5DDEA;
+}
+.matchBox .rankList .switchBtns .switchBtn {
+  width: 50%;
+  font-size: 34rpx;
+  padding: 20rpx 0rpx;
+  background-color: #D5DDEA;
+  text-align: center;
+}
+.matchBox .rankList .switchBtns .currentBtn {
+  color: #FF6908;
+  padding: 30rpx 10rpx;
+  font-weight: bold;
+  background-color: white;
+}
+.matchBox .rankList .switchBtns .currentBtn-l {
+  border-top-right-radius: 50rpx;
+}
+.matchBox .rankList .switchBtns .currentBtn-r {
+  border-top-left-radius: 50rpx;
+}