nyx: 调整活动详情页面格式

2fd6fc16 · jscat · 571a342c · 2fd6fc16 · 2fd6fc16 · 2fd6fc16
Commit 2fd6fc16 authored Jul 21, 2020 by jscat
--- a/增值产品-小程序及app/nyx-master/pages/activity/act-info/act-info.wxml
+++ b/增值产品-小程序及app/nyx-master/pages/activity/act-info/act-info.wxml
-<view class="page">
+<view class="page">
 <view class="page">

-  <!-- 作者信息 -->
-  <view class="note-handle">
-      <image class="writer-image" src="{{notes.writer_image}}"/>
-      <span class="name">{{notes.writer_name}}</span>
-  </view>
  <!-- 图片 -->
  <scroll-view class="scroll-view_H" scroll-x scroll-with-animation style="width: 100%;height: 90%;" bindscroll="getSelectItem" scroll-left="{{scrollLeft}}">
      <block wx:for="{{notes.note_image}}"  wx:key="unique" wx:for-index="id" wx:for-item="item">
@@ -13,13 +8,56 @@
        </view>
      </block>
  </scroll-view>
+
  <!-- 文字内容 -->
  <view class="note">
    <view class="note-title" style="font-weight: bold">
-      {{notes.title}}
+      
+      Renaissance Bar知识竞答
    </view>
    <view class="note-content">
-      {{notes.content}}
+      共10题
    </view>
+    <view class="note-content">
+      可获得5积分
+    </view>    
+  </view>
+
+  <!-- 企业信息 -->
+  <view class="note-row">
+      <image class="writer-image" src="{{notes.writer_image}}"/>
+      <view class="note-column">
+        <span class="name">Renaissance Bar</span>
+        <span class="name">充满爱与温度，自由放松的bar</span>
+      </view>
  </view>
+
+  <!-- start bottom-->
+  <!-- refer to https://www.jb51.net/article/129438.htm -->
+  <view class="bottom_total">
+    <view class="bottom_line"></view>
+  
+      <view class="weui-flex" style="height: 180rpx;">
+          <view class="weui-flex__item"><view class="placeholder">
+            <view class="list">
+                <view class="items">
+                  <image src="../../../icon/index.png"></image>
+                  <text>首页</text>
+                </view>
+              <view class="items">
+                <image src="../../../icon/activity/share.png"></image>
+                <text>分享</text>
+              </view>
+            </view>
+          </view></view>
+          <view class="weui-flex__item weui-flex justify align"><view class="placeholder">
+            <button class="button-brown" bindtap="toBuy" formType="submit">我要收藏</button>
+          </view></view>
+          <view class="weui-flex__item weui-flex justify align"><view class="placeholder">
+            <button class="button-red" bindtap="toBuy" formType="submit">立即参与</button>
+          </view></view>
+      </view>
+  </view>
+  <!-- end bottom-->
+
 </view>
--- a/增值产品-小程序及app/nyx-master/pages/activity/act-info/act-info.wxss
+++ b/增值产品-小程序及app/nyx-master/pages/activity/act-info/act-info.wxss
-.scroll-view_H{
+.scroll-view_H{
@@ -44,10 +44,12 @@
  width: 100%;
  /* position: fixed; */
  background: #fff;
-  border-radius: 5px;
+  border-radius: 5rpx;
  float: left;
-  margin-top: 0;
+  margin-top: 20rpx;
+  margin-bottom: 20rpx;
 }
+
 .note-title{
  font-size: 16px;

@@ -57,8 +59,8 @@
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical; */
-  margin-left: 10%;
-  margin-right: 10%;
+  margin-left: 5%;
+  margin-right: 5%;
  margin-top: 0;
  text-align:justify;
 }
@@ -72,19 +74,110 @@
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical; */
-  margin-left: 10%;
-  margin-right: 10%;
+  margin-left: 5%;
+  margin-right: 4%;
  margin-top: 20rpx;
  text-align:justify;
 }
-.note-handle{
+.note-row{
+  width: 100%;
  display: flex;
  flex-direction: row;
-  margin-bottom: 10rpx;
-  margin-top: 10rpx;  
+  margin-bottom: 30rpx;
+  margin-top: 30rpx;  
+}
+.note-column{
+  display: flex;
+  flex-direction: column;
+  margin-left: 30rpx;
 }
 .writer-image{
-  width: 30px;
-  height: 30px;
+  width: 120rpx;
+  height: 120rpx;
  margin-left: 10%;
 }
+
+/* start bottom style */
+ .column {
+  display: flex;
+  flex-direction: column;
+ }
+ .row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+ }
+ .bottom_line {
+  width: 100%;
+  height: 2rpx;
+  background: lightgray;
+ }
+ .bottom_total {
+  position: fixed;
+  display: flex;
+  flex-direction: column;
+  bottom: 0;
+  width: 100%;
+  height: 180rpx;
+  line-height: 10rpx;
+  background: white;
+ }
+ .button-red {
+  background-color: #f44336; /* 红色 */
+ }
+ .button-brown {
+  background-color: #D1A96E; /* 红色 */
+ }
+ button {
+  color: white;
+  text-align: center;
+  font-size: 40rpx;
+  height: 2.6em;
+  line-height: 2.6em;
+ }
+
+ .placeholder{
+  margin: 0px;
+  text-align: center;
+  vertical-align: middle;
+  line-height: 2.3em;
+  color: rgba(0,0,0);
+}
+/* justify-content: center;(水平居中)  align-items: center;(垂直居中) */
+.justify{
+  justify-content: center;
+}
+.align{
+  align-items: center;
+}
+
+.list .items{
+  display: flex;
+  flex-direction: column;
+  text-align: center;
+  align-items: center;
+}
+.items image{
+  width: 50rpx;
+  height: 60rpx;
+  margin-top: 20rpx;
+  font-size: 0;
+}
+.items text{
+  /* display: block; */
+  text-align: center;
+  margin-top: 0rpx;
+  margin-bottom: 20rpx;
+  padding: 0rpx;
+  font-size: 28rpx;
+}
+
+.list{
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin-left: 30rpx;
+  margin-right: 30rpx;
+  margin-top: 20rpx;
+}
+ /* end bottom style */
\ No newline at end of file
--- a/增值产品-小程序及app/nyx-master/pages/activity/activity.js
+++ b/增值产品-小程序及app/nyx-master/pages/activity/activity.js
-// pages/kinds/kinds.js
+// pages/activity/activity.js
-// pages/kinds/kinds.js
+// pages/activity/activity.js
 const app = getApp()
 var config = wx.getStorageSync("config");


--- a/增值产品-小程序及app/nyx-master/pages/activity/activity.wxml
+++ b/增值产品-小程序及app/nyx-master/pages/activity/activity.wxml
-<view class="page">
+<view class="page">
@@ -28,19 +28,19 @@
    <view class="list">
        <view class="items">
          <navigator url="matchStudyDetail/matchStudyDetail?studyType=wset1">
-            <image src="../../icon/discover/scan.png"></image>
+            <image src="../../icon/activity/scan.png"></image>
          </navigator>
          <text>扫一扫</text>
        </view>
      <view class="items">
        <navigator url="matchStudyDetail/matchStudyDetail?studyType=wset2">
-          <image src="../../icon/discover/points.png"></image>
+          <image src="../../icon/activity/points.png"></image>
        </navigator>
        <text>积分</text>
      </view>
      <view class="items">
        <navigator url="matchStudyDetail/matchStudyDetail?studyType=wset3">
-          <image src="../../icon/discover/top.png"></image>
+          <image src="../../icon/activity/top.png"></image>
        </navigator>
        <text>热销</text>
      </view>      
@@ -62,7 +62,7 @@
    <!-- 文章封面内容 -->
    <view class="notes-block" wx:for="{{notes}}" wx:for-item="item" wx:key="{{index}}">
      <view class="note-info">
-        <navigator url="../discover/note-info/note-info?title={{item.title}}&content={{item.content}}&like={{item.like}}&note_image={{item.note_image}}&writer_name={{item.writer_name}}&writer_image={{item.writer_image}}" >        
+        <navigator url="../activity/act-info/act-info?title={{item.title}}&content={{item.content}}&like={{item.like}}&note_image={{item.note_image}}&writer_name={{item.writer_name}}&writer_image={{item.writer_image}}" >        
          <view class="note-img">
            <image src="{{item.note_image[0]}}"/>
          </view>
@@ -71,11 +71,11 @@
      </view> 
      <!-- 作者信息 -->
      <view class="note-handle">
-        <navigator class="writer" url="../discover/note-writer/note-writer">
+        <navigator class="writer" url="../activity/act-writer/act-writer">
        </navigator>
        <span class="name">{{item.writer_name}}</span>
        <view class="like" bindtap="onSubmitLike" data-post-id="{{item.post_id}}">
-          <image class="like-icon" src="../../icon/discover/like.png" style="width:30rpx;height:30rpx"/>    
+          <image class="like-icon" src="../../icon/activity/like.png" style="width:30rpx;height:30rpx"/>    
          <span>{{item.like}}</span>
        </view>
      </view>