'fix

component/search/search.wxml

@@ -1,4 +1,4 @@
 <view class="search marginTopBottom">
-  <view class="icon-search"></view>
-  <input placeholder="搜索你想听的节目"></input>
+  <view class="search-item">搜索你想听的节目</view>
+  <!-- <input placeholder="搜索你想听的节目"></input> -->
 </view>

component/search/search.wxss

@@ -1,16 +1,14 @@
 /* 搜索框 */
 .search{
     width: 90%;
+    height: 50rpx;
     margin: 0rpx auto;
-    height: 35rpx;
-    /* border: 1rpx solid #cdcdcd; */
     border-radius: 10rpx;
     font-size: 25rpx;
-    padding: 10rpx 0rpx;
     display: flex;
-    justify-content: start;
+    justify-content: center;
+    align-items: center;
     background-color: rgb(240, 240, 240);
-    /* margin-top: 20rpx; */
     margin-bottom: 20rpx;
   }
   .search-box{
@@ -29,5 +27,10 @@
     position: relative;
     top: -5rpx;
     left: 10rpx;
-    /* background-color: red */
+  }
+  .search-item{
+    width: 95%;
+    height: 100%;
+    color: #aaa;
+    line-height: 50rpx;
   }

pages/collection/collection.wxml

@@ -20,10 +20,14 @@
 <block wx:else>
     <!-- 搜索框 -->
     <search></search>
+    <!-- 功能栏 -->
     <view class="titleBar">
       <view class="itemTitle {{index == currentIndex ? 'active' : ' '}}" 
         data-index="{{index}}" bindtap="checkItem" wx:for="{{content}}" wx:key="index">
           {{item.text}}
       </view>
     </view>
+    <view class="collectionContent">
+      暂无内容
+    </view>
 </block>

pages/collection/collection.wxss

@@ -28,15 +28,17 @@
   border-radius: 15rpx;
   background: #ff520f;
 }
-/* .currtline {
-    margin: -8rpx auto 0 auto;
-    width: 100rpx;
-    height: 1rpx;
-    border-radius: 4rpx;
-} */
+
 .active {
   font-size: 32rpx;
   font-weight: 700;
   transition: all .3s;
   color: #333333;
+}
+.collectionContent{
+  width: 100%;
+  text-align: center;
+  position: absolute;
+  top: 300rpx;
+  color: #aaaaaa
 }

pages/details/details.js

@@ -4,7 +4,16 @@ Page({
    * 页面的初始数据
    */
   data: {
-    
+    performance:[
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+    ]
   },
 
   /**

pages/details/details.wxml

@@ -1,5 +1,8 @@
-<!-- title和背景 -->
-<view class="toptitlebar">
+<!-- 
+  title和背景 
+  注：这部分的背景色还没有处理好
+-->
+<view class="toptitlebar" style="background:url(../../image/guess1.jpg) no-repeat;background-size:100% 100%">
     <view class="baritem">
       <view class="baritemtop">
         <view class="themebgimg" style="background:url(../../image/guess1.jpg)"></view>
@@ -22,14 +25,14 @@
       </view>
     </view>
 </view>
-<!-- 节目列表 -->
+<!-- 顶部选项 -->
 <view class="Performance">
   <view class="selectbar">
     <view class="detail">详情</view>
-    <view class="list">
-      节目 <text class="">152</text>
+    <view class="list">节目<text>152</text>
     </view>
   </view>
+  <!-- 播放选项 -->
   <view class="play">
     <view class="playall">
       <text class="icon-video"></text> 播放全部
@@ -39,78 +42,20 @@
       <view><text class="icon-all"></text> 选集</view>
     </view>
   </view>
-  <view class="performanceContent">
+  <!-- 节目列表 -->
+  <view class="performanceContent" wx:for="{{performance}}" wx:key="index">
     <!-- 序号 -->
-    <view class="performanceIndex">1</view>
+    <view class="performanceIndex">{{index}}</view>
     <!-- 节目标题 -->
     <view class="performanceInfo">
       <view class="performanceInfoTop">
-        <view style="font-size:33rpx">《人在江湖》郭德纲 于谦</view>
-        <view style="color:#aaaaaa">2年前</view>
+        <view style="font-size:33rpx">{{item.name}}</view>
+        <view style="color:#aaaaaa">{{item.year}}</view>
       </view>
+      <!-- 播放次数和时间 -->
       <view class="performanceInfoBottom">
-        <view><text class="icon-video"></text> 5601.9万</view>
-        <view style="margin-left:20rpx"><text class="icon-time"></text> 34:36</view>
-      </view>
-    </view>
-  </view>
-  <view class="performanceContent">
-    <!-- 序号 -->
-    <view class="performanceIndex">1</view>
-    <!-- 节目标题 -->
-    <view class="performanceInfo">
-      <view class="performanceInfoTop">
-        <view style="font-size:33rpx">《人在江湖》郭德纲 于谦</view>
-        <view style="color:#aaaaaa">2年前</view>
-      </view>
-      <view class="performanceInfoBottom">
-        <view><text class="icon-video"></text> 5601.9万</view>
-        <view style="margin-left:20rpx"><text class="icon-time"></text> 34:36</view>
-      </view>
-    </view>
-  </view>
-  <view class="performanceContent">
-    <!-- 序号 -->
-    <view class="performanceIndex">1</view>
-    <!-- 节目标题 -->
-    <view class="performanceInfo">
-      <view class="performanceInfoTop">
-        <view style="font-size:33rpx">《人在江湖》郭德纲 于谦</view>
-        <view style="color:#aaaaaa">2年前</view>
-      </view>
-      <view class="performanceInfoBottom">
-        <view><text class="icon-video"></text> 5601.9万</view>
-        <view style="margin-left:20rpx"><text class="icon-time"></text> 34:36</view>
-      </view>
-    </view>
-  </view>
-  <view class="performanceContent">
-    <!-- 序号 -->
-    <view class="performanceIndex">1</view>
-    <!-- 节目标题 -->
-    <view class="performanceInfo">
-      <view class="performanceInfoTop">
-        <view style="font-size:33rpx">《人在江湖》郭德纲 于谦</view>
-        <view style="color:#aaaaaa">2年前</view>
-      </view>
-      <view class="performanceInfoBottom">
-        <view><text class="icon-video"></text> 5601.9万</view>
-        <view style="margin-left:20rpx"><text class="icon-time"></text> 34:36</view>
-      </view>
-    </view>
-  </view>
-  <view class="performanceContent">
-    <!-- 序号 -->
-    <view class="performanceIndex">1</view>
-    <!-- 节目标题 -->
-    <view class="performanceInfo">
-      <view class="performanceInfoTop">
-        <view style="font-size:33rpx">《人在江湖》郭德纲 于谦</view>
-        <view style="color:#aaaaaa">2年前</view>
-      </view>
-      <view class="performanceInfoBottom">
-        <view><text class="icon-video"></text> 5601.9万</view>
-        <view style="margin-left:20rpx"><text class="icon-time"></text> 34:36</view>
+        <view><text class="icon-video"></text>{{item.count}}</view>
+        <view style="margin-left:20rpx"><text class="icon-time"></text>{{item.time}}</view>
       </view>
     </view>
   </view>

pages/details/details.wxss

@@ -1,10 +1,10 @@
-.toptitlebar{
+.toptitlebar {
   width: 100%;
   height: 410rpx;
-  background: rgba(27, 123, 136, .5);
   overflow: hidden;
 }
-.Performance{
+
+.Performance {
   width: 100%;
   height: 500rpx;
   border-top-left-radius: 20rpx;
@@ -12,53 +12,63 @@
   position: relative;
   top: -10rpx;
 }
-.baritem{
+
+.baritem {
   width: 100%;
   height: 400rpx;
   margin-top: 50rpx;
   padding: 20rpx 0rpx;
 }
-.baritemtop{
+
+.baritemtop {
   width: 100%;
   height: 200rpx;
   display: flex;
   justify-content: center;
   align-items: center;
 }
-.themebgimg{
+
+.themebgimg {
   width: 200rpx;
   height: 200rpx;
   margin-right: 30rpx;
   background-repeat: no-repeat;
   background-size: 100% 100%;
 }
-.themeinfo{
+
+.themeinfo {
   width: 60%;
   height: 200rpx;
 }
-.themetitle{
+
+.themetitle {
   color: #fff;
   font-size: 40rpx;
 }
-.themeauthor{
+
+.themeauthor {
   font-size: 25rpx;
   color: #fff;
   margin-top: 5rpx;
 }
-.viewinfo{
+
+.viewinfo {
   color: #fff;
   font-size: 30rpx;
   margin-top: 5rpx;
   display: flex;
   justify-content: flex-start;
 }
-.viewinfoleft{
+
+.viewinfoleft {
   margin-right: 5rpx;
 }
-.viewinforight{
+
+.viewinforight {
   margin-left: 5rpx;
 }
-.baritembottom{
+
+.baritembottom {
   width: 70%;
   height: 100rpx;
   display: flex;
@@ -68,7 +78,8 @@
   float: right;
   margin-top: 15rpx;
 }
-.baritembottom button{
+
+.baritembottom button {
   width: 210rpx;
   height: 75rpx;
   text-align: center;
@@ -76,15 +87,18 @@
   color: #fff;
   border-radius: 20rpx;
 }
-.sharebut{
+
+.sharebut {
   background: orangered;
   border: 1rpx solid #fff;
   margin-left: 70rpx;
 }
-.collection{
+
+.collection {
   background: orangered;
 }
-.selectbar{
+
+.selectbar {
   width: 100%;
   height: 100rpx;
   padding: 20rpx 0rpx;
@@ -93,17 +107,20 @@
   justify-content: space-between;
   background: #fff;
   box-sizing: border-box;
-  color: #aaaaaa;
+  color: #aaa;
   border-radius: 15rpx;
   border-bottom: 1rpx solid #f1f1f1;
 }
-.detail{
+
+.detail {
   width: 50%;
 }
-.list{
+
+.list {
   width: 50%;
 }
-.play{
+
+.play {
   width: 100%;
   height: 100rpx;
   padding: 0rpx 40rpx;
@@ -113,19 +130,22 @@
   justify-content: space-between;
   align-items: center;
 }
-.playall{
+
+.playall {
   width: auto;
   text-align: center;
   font-size: 30rpx;
 }
-.playselect{
+
+.playselect {
   width: auto;
   display: flex;
   justify-content: space-between;
   text-align: center;
   font-size: 30rpx;
 }
-.performanceContent{
+
+.performanceContent {
   width: 100%;
   height: 150rpx;
   display: flex;
@@ -135,30 +155,34 @@
   border-bottom: 1rpx solid #f1f1f1;
   padding: 20rpx 20rpx;
 }
-.performanceIndex{
+
+.performanceIndex {
   width: 15%;
   height: 80rpx;
   text-align: center;
   line-height: 80rpx;
-  color:#aaaaaa;
+  color: #aaa;
 }
-.performanceInfo{
+
+.performanceInfo {
   width: 85%;
   height: 100%;
 }
-.performanceInfoTop{
+
+.performanceInfoTop {
   width: 100%;
   height: 50%;
   display: flex;
   justify-content: space-between;
   font-size: 30rpx;
 }
-.performanceInfoBottom{
+
+.performanceInfoBottom {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: flex-start;
-  color: #aaaaaa;
+  color: #aaa;
   font-size: 25rpx;
   margin-top: 20rpx;
-}
+}

pages/index/index.wxml

@@ -8,14 +8,14 @@
     current="{{swiperCurren}}" 
     bindchange="swiperChange">
     <!-- 轮播图图片 -->
-    <swiper-item class="swiperItem" wx:for="{{imgList}}" wx:key>
+    <swiper-item class="swiperItem" wx:for="{{imgList}}" wx:key="index">
       <!-- 加上widthFix可以使图片自适应 -->
       <image src="{{item}}"></image>
     </swiper-item>
   </swiper>
   <!-- 为了和喜马拉雅一致，自己需定制轮播图dots -->
   <view class="dots">
-    <block wx:for="{{imgList.length}}" wx:key>
+    <block wx:for="{{imgList.length}}" wx:key="index">
       <!-- 根据index判断是否选中 -->
       <view class="dotsItem{{index == swiperCurrent ? ' active' : ''}}"></view>
     </block>
@@ -80,7 +80,7 @@
       <view class="Title-left">有声小说</view>
       <view class="Title-right">查看全部></view>
     </view>
-    <block wx:for="{{xiaoshuocontent}}" wx:key>
+    <block wx:for="{{xiaoshuocontent}}" wx:key="index">
       <view class="content">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix"></image>
@@ -107,7 +107,7 @@
       <view class="Title-left">相声评书</view>
       <view class="Title-right">查看全部></view>
     </view>
-    <block wx:for="{{xiangshengcontent}}" wx:key>
+    <block wx:for="{{xiangshengcontent}}" wx:key="index">
       <view class="content">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix"></image>
@@ -134,7 +134,7 @@
       <view class="Title-left">脱口秀</view>
       <view class="Title-right">查看全部></view>
     </view>
-    <block wx:for="{{tuokocontent}}" wx:key>
+    <block wx:for="{{tuokocontent}}" wx:key="index">
       <view class="content">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix" lazy-load="false"></image>

pages/user/phoneLogin/phoneLogin.js

@@ -15,4 +15,9 @@ Page({
   onLoad: function (options) {
     
   },
+  login: function () {
+    wx.showToast({
+      title: '成功',
+    })
+  }
 })

pages/user/phoneLogin/phoneLogin.wxml

@@ -17,7 +17,7 @@
                     <input type="number" placeholder="输入验证码" placeholder-class="place"></input>
                     <view class="getcode">获取验证码</view>
                 </view>
-                <view class="submit" >
+                <view class="submit" bindtap="login">
                     <button><text class="icon-wechat"></text> 立即登录</button>
                 </view>
             </form>

project.config.json

@@ -21,7 +21,7 @@
 		}
 	},
 	"compileType": "miniprogram",
-	"libVersion": "2.7.7",
+	"libVersion": "2.9.4",
 	"appid": "wx101d03d3f1aab84c",
 	"projectname": "%E4%BB%BF%E5%96%9C%E9%A9%AC%E6%8B%89%E9%9B%85lite",
 	"debugOptions": {

utils/utils.js

@@ -1,3 +1,6 @@
+/**
+ * 本文件主要是工具类函数
+ */
 let myRequest = function(url,methods,data = {}){
     wx.request({
         url: url,