Skip to content

N
nyx
Commit a9bfb60c by jscat
Options

nyx weapp: 数据优化, 页面优化 

1. 新增主流程 activity-info页面
parent e7927409
正在显示 包含 492 行增加 和 3 行删除
增值产品-小程序及app/nyx-master/pages/activity/activity-info/activity-info.js 0 → 100644
// pages/activity/activity-info/activity-info.js
// pages/activity/activity-info/activity-info.js
Page({
/**
* 页面的初始数据
*/
data: {
/* 用于判断是否已经登陆 */
nyxCode : "",
authStatus : "0",
userInfo : {},
windowHeight: "",
windowWidth: "",
contentHeight: "",
scrollLeft: 0, //切换栏的滚动条位置
curIndex : 0,
// 基础数据
activityInfo: {},
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var _this = this;
var windowHeight = wx.getSystemInfoSync().windowHeight;//获取设备高度，小程序自带的方法
var windowWidth = wx.getSystemInfoSync().windowWidth;//获取设备高度，小程序自带的方法
this.setData({
windowHeight: windowHeight,
windowWidth: windowWidth,
contentHeight : windowHeight * 0.675,
})
//初始化数据
if (wx.getStorageSync('nyxCode')) {
_this.setData({
nyxCode: wx.getStorageSync('nyxCode'),
userInfo: wx.getStorageSync('userInfo'),
authStatus: wx.getStorageSync('authStatus'),
})
}
var activityInfo = _this.__data__.activityInfo
if (Object.keys(activityInfo).length==0 && options.title != "")
{
activityInfo['activity_id'] = options.activity_id;
activityInfo['note_image'] = options.note_image.split("::");
activityInfo['title'] = options.title;
activityInfo['content'] = options.content;
activityInfo['like'] = options.like;
activityInfo['product_desc'] = options.product_desc;
activityInfo['unit_price'] = options.price;
activityInfo['member_id'] = options.member_id;
activityInfo['member_name'] = options.member_name;
activityInfo['member_slogan'] = options.member_slogan;
activityInfo['member_logo'] = options.member_logo==""?'/icon/icon_avatar1.png':options.member_logo;
}
wx.setNavigationBarTitle({
title: '活动详情',
})
_this.setData(
{
activityInfo: activityInfo,
}
)
//get the activity_item, then add to activityInfo
_this.getActivityItem(activityInfo['activity_id'])
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function (options) {
var shareObj = {
　　　　title: "好友推荐: "+"Renaissance Bar知识竞答", // 默认是小程序的名称(可以写slogan等)
　　　　path: '/pages/share/share', // 默认是当前页面，必须是以'/'开头的完整路径
　　　　imageUrl: ''
}
　　// 来自页面内的按钮的转发
　　if( options.from == 'button' ){
　　　　// var eData = options.target.dataset;
　　　　// console.log( eData.id); // shareBtn
　　　　// 此处可以修改 shareObj 中的内容
　　　　shareObj.path = '/pages/goods/goods?goodId=123';
　　}
return shareObj;
},
/**
*
* 用户自定义函数
*/
//获取活动的子项
getActivityItem(activity_id){
var _this = this;
var activityInfo = _this.__data__.activityInfo
var activity_item = [
{
product_desc : "会员",
unit_price : 59.00,
default_status : "01",
},
{
product_desc : "普通用户",
unit_price : 99.00,
default_status : "00",
},
]
activityInfo['activity_item'] = activity_item
_this.setData({
activityInfo : activityInfo,
})
},
//滑动获取选中商品
getSelectItem: function (e) {
var that = this;
var preCurIndex = that.data.curIndex;
var itemWidth = e.detail.scrollWidth / that.data.activityInfo.note_image.length;//每个商品的宽度
var scrollLeft = e.detail.scrollLeft;//滚动宽度
var curIndex = Math.round(scrollLeft / itemWidth);//通过Math.round方法对滚动大于一半的位置进行进位
var newScrollLeft = 0
// 目标: 始终让图片居中显示
if (curIndex != preCurIndex
|| (curIndex == that.data.activityInfo.note_image.length - 1 && scrollLeft > that.data.windowWidth * (that.data.activityInfo.note_image.length - 1))
)
{
newScrollLeft = that.data.windowWidth * curIndex
that.setData({
scrollLeft : newScrollLeft,
curIndex : curIndex,
});
}
},
//跳转到知识竞答页面
toGame: function (e) {
var _this = this;
var url = "/pages/key/matchTest/matchTest?"
+ "&activity_id=" + _this.__data__.activityInfo["activity_id"]
+ "&activityInfo=" + _this.__data__.activityInfo["activityInfo"]
+ "&point=" + _this.__data__.activityInfo["point"]
+ "&member_id=" + _this.__data__.activityInfo["member_id"]
+ "&member_name=" + _this.__data__.activityInfo["member_name"]
+ "&title=" + _this.__data__.activityInfo["title"]
wx.navigateTo({
url: url
});
},
//跳转到首页
toHome: function (e) {
wx.switchTab({
url: "/pages/activity/activity"
});
},
})
\ No newline at end of file
增值产品-小程序及app/nyx-master/pages/activity/activity-info/activity-info.wxml 0 → 100644
<view class="page">
<view class="page">
<!-- 图片 -->
<scroll-view class="scroll-view_H" scroll-x scroll-with-animation style="width: 100%;height: 90%;" bindscroll="getSelectItem" scroll-left="{{scrollLeft}}">
<block wx:for="{{activityInfo.note_image}}" wx:key="unique" wx:for-index="id" wx:for-item="item">
<view class="scroll_item {{item.selected ? 'selected' : ''}}" data-index='{{item.index}}' bindtap='selectProItem'>
<image src="{{item}}" mode="widthFix"/>
</view>
</block>
</scroll-view>
<!-- 文字内容 -->
<view class="note">
<view class="note-price" style="font-weight: bold">
￥{{activityInfo.unit_price}}
</view>
<view class="note-content">
{{activityInfo.title}} {{activityInfo.product_desc}}
</view>
<view class="note-content">
{{activityInfo.content}}
</view>
</view>
<!-- 企业信息 -->
<view class="note-row">
<image class="writer-image" src="{{activityInfo.member_logo}}"/>
<view class="note-column">
<span class="name">{{activityInfo.member_name}}</span>
<span class="name">{{activityInfo.member_slogan}}</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 justify "><view class="placeholder">
<view class="list">
<view class="items" bindtap="toHome">
<image src="../../../icon/index.png"></image>
<text>首页</text>
</view>
<view class="items">
<button class="share" open-type="share">
</button>
<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-red" bindtap="toGame">立即购买</button>
</view></view>
</view>
</view>
<!-- end bottom-->
</view>
增值产品-小程序及app/nyx-master/pages/activity/activity-info/activity-info.wxss 0 → 100644
.scroll-view_H{
.scroll-view_H{
position: relative;
width: 100%;
text-align: center;
transform: scale(0.9);
white-space: nowrap;
}
.scroll_item {
position: relative;
width: 100%;
height: 90%;
margin: 0;
transform-origin: 50% 0;
left: 0%;
display: inline-block;
/* border-radius: 20rpx !important ; */
overflow: hidden;
/* transform: scale(0.9); */
vertical-align: middle;
/* top: 0%; */
/* height: 72%; */
background-color: #fff;
}
.scroll_item:first-child{
margin-left: 0%;
left: 0;
}
.scroll_item:last-child{
margin-right: 10%;
left: 0;
}
.scroll_item.selected{
/* transform: scale(0.9); */
border: solid 1px #ffcd54;
}
.scroll_item image {
width: 100%;
float: left;
margin-top: 0;
/* border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx; */
}
.note{
width: 100%;
/* position: fixed; */
background: #fff;
border-radius: 5rpx;
float: left;
margin-top: 20rpx;
margin-bottom: 20rpx;
}
.note-title{
font-size: 16px;
margin-left: 5%;
margin-right: 5%;
margin-top: 0;
text-align:justify;
}
.note-price{
font-size: 16px;
margin-left: 5%;
margin-right: 5%;
margin-top: 0;
text-align:justify;
color: #FF6600;
}
.note-content{
font-size: 16px;
/* 后期用于 '展开' 功能 */
/* overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical; */
margin-left: 5%;
margin-right: 4%;
margin-top: 20rpx;
text-align:justify;
}
.note-row{
width: 100%;
display: flex;
flex-direction: row;
margin-bottom: 30rpx;
margin-top: 30rpx;
}
.note-column{
display: flex;
flex-direction: column;
margin-left: 30rpx;
}
.writer-image{
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-left: 20rpx;
margin-right: 20rpx;
text-align: center;
/* vertical-align: middle; */
padding: 0 10px;
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: 80rpx;
height: 80rpx;
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 */
/* 分享按钮 */
.share {
position: absolute;
background-size: 50rpx 50rpx;
opacity: 0;
border:none;
}
\ No newline at end of file
增值产品-小程序及app/nyx-master/pages/activity/activity.js
// pages/activity/activity.js
// pages/activity/activity.js
......@@ -231,8 +231,18 @@ Page({
+"&member_name="+result["member_name"]
+"&member_slogan="+result["member_slogan"]
+"&member_logo="+result["member_logo"]
var url_activity = "../activity/activity-info/quiz-info?"
+"&activity_id="+result["activity_id"]
var url_activity = "../activity/activity-info/activity-info?"
+"activity_id="+result["activity_id"]
+"&note_image="+res.data.data[i].noteImage //传递原始string数据, List不正确
+"&title="+result["title"]
+"&content="+result["content"]
+"&like="+result["num_like"]
+"&price="+result["price"]
+"&product_desc="+result["product_desc"]
+"&member_id="+result["member_id"]
+"&member_name="+result["member_name"]
+"&member_slogan="+result["member_slogan"]
+"&member_logo="+result["member_logo"]
result["url"] = result["tag"]=='竞答'? url_quiz : url_activity
list.push(result)
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论