[新增]增加了直播列表

apis/index.js

@@ -15,6 +15,7 @@ import company 	from "./interfaces/company"
 import companyModule 	from "./interfaces/home"
 import ticket 	from "./interfaces/ticket"
 import address  from "./interfaces/address"
+import live  from "./interfaces/live"
 
 export default{
 	publics,
@@ -28,5 +29,6 @@ export default{
 	company,
 	companyModule,
 	ticket,
-	address
+	address,
+	live
 }

apis/interfaces/live.js

@@ -1,11 +1,11 @@
 
 /*
- * 电子名片
+ * 直播
  */
 import {req} from "../request"
 
-const card = data => req({url: "cardpersonal" , data: data}) //名片信息
+const rooms = () => req({url: "lives/rooms"}) //获取直播间列表
 
 export default({
-    card
+    rooms
 })

components/swiperVideo/swiperVideo.js

@@ -43,9 +43,6 @@ Component({
     methods: {
         // 视频滚动了
         changeVideo(e){
-            
-            console.log(e)
-
             let videoLists = this.data.videoList,
                 current    = e.detail.current,
                 currentId  = this.data.playId,

components/swiperVideo/swiperVideo.wxml

@@ -2,6 +2,7 @@
 <swiper class="videoSwiper" vertical bindchange="changeVideo">
     <swiper-item class="videoSwiperItem" wx:for="{{videoList}}" wx:key="videoItem" circular="{{videoList.length > 2}}">
         <video
+            class="videoSwiperItemVideo"
             id="video{{item.video_id}}"
             src="{{item.path_url || ''}}"
             controls="{{controls}}"
@@ -12,8 +13,9 @@
             bindplay="vipdeBindPlay"
             bindpause="vipdeBindPlay"
             loop
+            wx:if="{{item.video_id == playId}}"
         >
         </video>
-        <image src=""></image>
+        <image class="videoCover" src="{{item.cover}}" mode="aspectFill"></image>
     </swiper-item>
 </swiper>

components/swiperVideo/swiperVideo.wxss

@@ -15,7 +15,8 @@
     -webkit-overflow-scrolling:touch;
 }
 
-.videoSwiperItem video{
+.videoSwiperItemVideo,
+.videoCover{
     width: 100%;
     height: 100%;
 }

pages/shortVideo/index.js

@@ -14,6 +14,7 @@ Page({
         videoIndex  : 0, //当前播放视频的下标
         videoId     : "", //当前播放的视频id
         playState   : true, //视频播放状态
+        rooms       : [],   //直播列表
     },
 
     /**
@@ -29,6 +30,18 @@ Page({
         })
     },
 
+    /**
+     * 获取直播间列表
+     */
+    onShow(){
+        wx.$api.live.rooms().then(res=>{
+            console.log(res.list)
+            this.setData({
+                rooms: res.list
+            })
+        })
+    },
+
     /***
      * 视频的播放状态
      */

pages/shortVideo/index.wxml

@@ -1,13 +1,5 @@
 
-
-<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=4">进入直播间</navigator>
-
-
-<view style="margin-top: 10vh">
-    <view bindtap="onId">改变全局id</view>
-</view>
-
-<view class="videos-content" wx:if="{{1 == 2}}">
+<view class="videos-content">
     <swiperViode
         wx:if="{{videoList.length > 0}}"
         class="swiper-viode"
@@ -18,6 +10,14 @@
         bind:swiperindex="swiperIndex"
     >
     </swiperViode>
+    <!-- 直播列表 -->
+    <view class="live-rooms">
+        <block wx:for="{{rooms}}" wx:key="rooms">
+            <navigator class="live-rooms-nav" url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id={{item.roomid}}">
+                <image class="live-rooms-cover" src="{{item.cover_img}}" mode="aspectFill"></image>
+            </navigator>
+        </block>
+    </view>
     <!-- 视频播放按钮 -->
     <view class="videoLayer-play {{!isPlay ? 'show': ''}}" src="/static/icons/play_icon.png"></view>
     <!-- 视频信息 -->

pages/shortVideo/index.wxss

@@ -7,7 +7,7 @@
 
 
  page{
-    /* background: #0e0c1a; */
+    background: #0e0c1a;
 }
 
 .videoSwiper{
@@ -19,13 +19,69 @@
 .videos-content{
     position: relative;
     height: 100vh;
-    display: none;
+    box-sizing: border-box;
+    padding-bottom: calc(48px + env(safe-area-inset-bottom));
+}
+
+/* 直播信息 */
+.live-rooms{
+    position: absolute;
+    top: calc(180rpx + env(safe-area-inset-bottom));
+    left: 30rpx;
+}
+
+.live-rooms-cover{
+    width: 98rpx;
+    height: 98rpx;
+    border-radius: 50%;
+    vertical-align: top;
+}
+
+.live-rooms-nav{
+    position: relative;
+    display: inline-block;
+    width: 98rpx;
+    height: 98rpx;
+    margin-left: 30rpx;
+}
+
+.live-rooms-nav:first-child{
+    margin-left: 0;
+}
+
+.live-rooms-nav::before,
+.live-rooms-nav::after{
+    position: absolute;
+    content: "";
+}
+
+.live-rooms-nav::before{
+    width: 98rpx;
+    height: 98rpx;
+    border:solid 4rpx #FF8C37;
+    border-radius: 50%;
+    box-sizing: border-box;
+}
+
+.live-rooms-nav::after{
+    content: "直播中";
+    position: absolute;
+    bottom: 0;
+    left: 10rpx;
+    width: 78rpx;
+    background: #FF8C37;
+    color: white;
+    height: 32rpx;
+    line-height: 32rpx;
+    font-size: 20rpx;
+    text-align: center;
+    border-radius: 16rpx;
 }
 
 /* 视频信息 */
 .video-info{
     position: absolute;
-    bottom: 50rpx;
+    bottom: calc(78px + env(safe-area-inset-bottom));
     left: 30rpx;
     width: calc(100% - 218rpx);
 }
@@ -51,7 +107,7 @@
 .video-tool{
     position: absolute;
     right: 30rpx;
-    bottom: 50rpx;
+    bottom: calc(78px + env(safe-area-inset-bottom));
 }
 
 .video-tool-item{

project.config.json

@@ -40,7 +40,7 @@
     },
     "compileType": "miniprogram",
     "libVersion": "2.13.2",
-    "appid": "wx49efb36db851933d",
+    "appid": "wxd931d03dfe955254",
     "projectname": "%E8%A1%8C%E4%B8%9A%E7%89%88Saas",
     "debugOptions": {
         "hidedInDevtools": []
@@ -59,7 +59,8 @@
             "list": []
         },
         "miniprogram": {
-            "list": [{
+            "list": [
+                {
                     "name": "登录",
                     "pathName": "pages/login/login",
                     "query": "",