nyx weapp: 页面更新

1. 调整live及share的前端

nyx weapp: 页面更新
1. 调整live及share的前端
73dea9dc · jscat · bc9013b6 · 73dea9dc · 73dea9dc · 73dea9dc
Commit 73dea9dc authored Nov 27, 2020 by jscat
--- a/app/nyx-dev/config.js
+++ b/app/nyx-dev/config.js
@@ -3,7 +3,7 @@
 //  env = 0; //本地java测试，需要启动java后台
 //  env = 1; //阿里云服务器测试版本
 //  env = 2; //阿里云服务器生产版本
-var env = 1;
+var env = 0;
 var debug = 0; //是否打印调试信息
 var host_key  = "https://fun.hisuhong.com";
@@ -82,5 +82,6 @@ var config={
  image_url: host_key + "/images/",
  redis_update_like_url: host_key + "/api/nyx/redis/update/like",
  redis_query_like_url: host_key + "/api/nyx/redis/search/like",
+  live_query_url: host_key + "/api/nyx/live/query",
 }
 module.exports=config;
\ No newline at end of file
--- a/app/nyx-dev/icon/live/red.png
+++ b/app/nyx-dev/icon/live/red.png
--- a/app/nyx-dev/pages/live/live-info/live-info.js
+++ b/app/nyx-dev/pages/live/live-info/live-info.js
@@ -47,7 +47,7 @@ Page({
    //格式示例数据，可为空
    allContentList: [],
    num: 0,
-    sid: "key",
+    sid: "",
    chatUserInfo: {},
    scrollTop: 0,
@@ -70,6 +70,7 @@ Page({
    */
    selected : '@',
    likeUrl: "../../../icon/activity/like_selected.png", // like图标的url
+    redUrl: "../../../icon/live/red.png", // 在线图标的url
    //directly to redis
    rankData_raw_like: {
      '@叁年间' : 100,
@@ -96,6 +97,8 @@ Page({
    tabBarHeight: 0,
    streamer_name: "",
+    title: "",
+    num_watcher: "",
  },
@@ -149,13 +152,17 @@ Page({
    //step2: 获取上一页面传入的数据
    var sid = _this.__data__.sid
    var streamer_name = _this.__data__.streamer_name
+    var title = _this.__data__.title
+    var num_watcher = _this.__data__.num_watcher
    if ( options.sid != "") 
    {
      sid = options.sid;
+      title = options.title;
+      num_watcher = options.num_watcher;
      streamer_name = options.streamer_name;
    }
-    _this.setData({ sid, streamer_name })    
+    _this.setData({ sid, streamer_name, title, num_watcher })    
    //初始化socket
    if (app.globalData.socketTask.readyState != 1 && app.globalData.socketTask.readyState != 0) {

--- a/app/nyx-dev/pages/live/live-info/live-info.wxml
+++ b/app/nyx-dev/pages/live/live-info/live-info.wxml
 <!--pages/share/share.wxml-->
 <view class="page">
 <!-- start key view -->
-<view class="page__hd" style="position:fixed; top:0;width: 750rpx;">
+<view class="page__hd" style="position:fixed; top:0;width: 100%;">
  <view class="tab-title">
    <view class="{{selected=='@'?'border-tottom':'default'}}" id="@" bindtap="selected">热度商家榜</view>
    <view class="{{selected=='#'?'border-tottom':'default'}}" id="#" bindtap="selected">活跃主播榜</view>
@@ -15,7 +15,7 @@
      <view class="rank">
        <view class="rank-left">{{item.name}}</view>
        <view class="rank-right">
-          <view class="rank-row"><image src="{{likeUrl}}"></image> {{item.like}}</view>
+          <view class="rank-row"><image src="{{likeUrl}}"></image> {{item.like}}在线</view>
        </view>
      </view>
    </view> 
@@ -27,10 +27,16 @@
 <!--end key view -->
 <!--公屏view-->
-<view style="height:{{chatHeight}}rpx;position:fixed; bottom:0;">
+<view style="height:{{chatHeight}}rpx;position:fixed; bottom:0; width:100%">
 <view class="weui-cell weui-cell_access">
-    <view class="weui-cell__bd">{{streamer_name}}</view>
+    <view class="live">
+      <view class="live-left">{{title}}</view>
+      <view class="live-right">
+        <view class="live-row"><image src="{{redUrl}}"></image> {{num_watcher}}在线</view>
+      </view>
+    </view>    
 </view>
 <scroll-view scroll-y="true" scroll-top="{{scrollTop}}" style="height:{{chatHeight-80}}rpx;position:fixed; bottom:0;">
 <view class="wrapper {{isShowAdd?'media-padd':''}} {{isEmotion?'emotion-padd':''}}" id="wrapperCon" bindtap="cancelShow" >
  <!-- 消息列表 -->

--- a/app/nyx-dev/pages/live/live-info/live-info.wxss
+++ b/app/nyx-dev/pages/live/live-info/live-info.wxss
@@ -55,7 +55,7 @@ padding-bottom: 100rpx;
 }
 .message-list {
-margin: 10rpx 30rpx 30rpx;
+margin: 10rpx 32rpx 32rpx 32rpx;
 }
 .chat {
@@ -305,7 +305,7 @@ vertical-align: middle;
 height: 60rpx;
 background: #fff;
 border-top: 1px solid #fafafa; 
-padding: 16rpx; 
+padding: 16rpx 32rpx 16rpx 32rpx; 
 line-height: 60rpx;
 display:flex;
 flex-direction: row;
@@ -315,9 +315,9 @@ flex:auto;
 text-align:center;
 }
 .tab-content{
-height: 60rpx;
+  height: 60rpx;
-background: #fff;
+  background: #fff;
-padding: 16rpx;
+  padding: 16rpx 0rpx 16rpx 16rpx; /* top right bottom (left)*/
 }
 .rank-info{
 background: #fff;
@@ -342,4 +342,21 @@ font-size: 0;
 .rank-row{
 display: flex;
 flex-direction: row;
-}
+align-items: center;
\ No newline at end of file
+}
+/* live-info */
+/* top right bottom; 缺少了left,根据原则,则left的值有right来代替 */
+.live{width: 100%; display: flex; margin-top: 0rpx; align-items: center;margin-bottom: 12rpx;}
+.live-left{width: 65%; }
+.live-right{width: 35%; display: flex;}
+.live-right image{
+width: 40rpx;
+height: 40rpx;
+font-size: 0;
+}
+.live-row{
+display: flex;
+flex-direction: row;
+align-items: center;
+}
--- a/app/nyx-dev/pages/live/live.js
+++ b/app/nyx-dev/pages/live/live.js
--- a/app/nyx-dev/pages/live/live.wxml
+++ b/app/nyx-dev/pages/live/live.wxml
@@ -84,11 +84,11 @@
    <view class="item stamp stamp01">
        <!-- 商品信息 -->
        <view class="note-row">
-          <navigator url='live-info/live-info?sid={{item.sid}}&streamer_name={{item.streamer_name}}' >
+          <navigator url='{{item.url_live}}' >
            <image class="writer-image" src="{{item.note_image}}"/>
          </navigator>
            <view class="note-column">
-              <navigator url='live-info/live-info?sid={{item.sid}}&streamer_name={{item.streamer_name}}' >
+              <navigator url='{{item.url_live}}' >
              <!-- 商家信息 -->
              <text>{{item.title}}</text>
              <!-- 商品价格 -->
@@ -101,7 +101,7 @@
              <!-- 商家名称 -->
              <view class="note-row align">                
                <view class="desc-member-left">
-                <image src="{{item.note_image}}"/>{{item.streamer_name}}</view>
+                <image src="{{item.avatarUrl}}"/>{{item.streamer_name}}</view>
                <!-- todo 店铺功能尚未实现 -->
                <!-- <view class="desc-member-right">进店 ></view> -->
              </view>

--- a/app/nyx-dev/pages/share/share.js
+++ b/app/nyx-dev/pages/share/share.js
@@ -71,6 +71,7 @@ Page({
    */
    selected : '@',
    likeUrl: "../../icon/activity/like_selected.png", // like图标的url
+    redUrl: "../../icon/live/red.png", // 在线图标的url
    //directly to redis
    rankData_raw_like: {
      '@叁年间' : 100,

--- a/app/nyx-dev/pages/share/share.wxml
+++ b/app/nyx-dev/pages/share/share.wxml
 <!--pages/share/share.wxml-->
 <view class="page">
 <!-- start key view -->
-<view class="page__hd" style="position:fixed; top:0;width: 750rpx;">
+<view class="page__hd" style="position:fixed; top:0;width: 100%;">
  <view class="tab-title">
    <view class="{{selected=='@'?'border-tottom':'default'}}" id="@" bindtap="selected">热度商家榜</view>
    <view class="{{selected=='#'?'border-tottom':'default'}}" id="#" bindtap="selected">活跃主播榜</view>
@@ -27,9 +27,14 @@
 <!--end key view -->
 <!--公屏view-->
-<view style="height:{{chatHeight}}rpx;position:fixed; bottom:0;">
+<view style="height:{{chatHeight}}rpx;position:fixed; bottom:0;width: 100%">
 <view class="weui-cell weui-cell_access">
-    <view class="weui-cell__bd">公屏发言</view>
+    <view class="live">
+      <view class="live-left">公屏发言</view>
+      <view class="live-right">
+        <view class="live-row"><image src="{{redUrl}}"></image>100在线</view>
+      </view>
+    </view>     
 </view>
 <scroll-view scroll-y="true" scroll-top="{{scrollTop}}" style="height:{{chatHeight-80}}rpx;position:fixed; bottom:0;">
 <view class="wrapper {{isShowAdd?'media-padd':''}} {{isEmotion?'emotion-padd':''}}" id="wrapperCon" bindtap="cancelShow" >

--- a/app/nyx-dev/pages/share/share.wxss
+++ b/app/nyx-dev/pages/share/share.wxss
@@ -305,7 +305,7 @@
  height: 60rpx;
  background: #fff;
  border-top: 1px solid #fafafa; 
-  padding: 16rpx; 
+  padding: 16rpx 32rpx 16rpx 32rpx; 
  line-height: 60rpx;
  display:flex;
  flex-direction: row;
@@ -317,7 +317,7 @@
 .tab-content{
  height: 60rpx;
  background: #fff;
-  padding: 16rpx;
+  padding: 16rpx 0rpx 16rpx 16rpx; /* top right bottom (left)*/
 }
 .rank-info{
  background: #fff;
@@ -329,10 +329,10 @@
 .hidden{display:none;}
 /* rank-info */
-.rank{width: 100%; display: flex; margin-top: 0rpx; align-items: center;}
+.rank{width: 100%; display: flex; margin-top: 0rpx; align-items: center;margin-bottom: 12rpx;}
 /* .rank-left{width: 50%; text-align: center;}
 .rank-right{width: 50%; display: flex; justify-content: center;} */
-.rank-left{width: 50%; padding-left:100rpx; margin-bottom: 12rpx;}
+.rank-left{width: 50%; padding-left:100rpx;}
 .rank-right{width: 50%; display: flex; padding-left:100rpx;}
 .rank-right image{
  width: 40rpx;
@@ -342,4 +342,21 @@
 .rank-row{
  display: flex;
  flex-direction: row;
-}
+  align-items: center;
\ No newline at end of file
+}
+/* live-info */
+/* top right bottom; 缺少了left,根据原则,则left的值有right来代替 */
+.live{width: 100%; display: flex; margin-top: 0rpx; align-items: center;}
+.live-left{width: 50%; padding-right: 116rpx;}
+.live-right{width: 50%; display: flex; padding-left: 100rpx;}
+.live-right image{
+width: 40rpx;
+height: 40rpx;
+font-size: 0;
+}
+.live-row{
+display: flex;
+flex-direction: row;
+align-items: center;
+}