Commit 854bacf6 authored by Menethil's avatar Menethil
Browse files

添加Renard小程序

parent a50998e6
var util = require('../../utils/util.js');
var api = require('../../config/api.js');
var app = getApp();
Page({
data: {
bannerInfo: {
'imgUrl': '',
'name': ''
},
categoryFilter: false,
filterCategory: [],
goodsList: [],
categoryId: 0,
currentSortType: 'default',
currentSort: 'add_time',
currentSortOrder: 'desc',
page: 1,
size: 100
},
getBanner: function() {
let that = this;
util.request(api.GoodsHot).then(function(res) {
if (res.errno === 0) {
that.setData({
bannerInfo: res.data.bannerInfo,
});
}
});
},
getCategoryList: function() {
var that = this;
util.request(api.GoodsFilter, {
isHot: 1
})
.then(function(res) {
if (res.errno === 0) {
that.setData({
filterCategory: res.data.filterCategoryList,
});
}
});
},
getGoodsList: function() {
var that = this;
util.request(api.GoodsList, {
isHot: true,
page: that.data.page,
size: that.data.size,
order: that.data.currentSortOrder,
sort: that.data.currentSort,
categoryId: that.data.categoryId
})
.then(function(res) {
if (res.errno === 0) {
that.setData({
goodsList: res.data.goodsList,
filterCategory: res.data.filterCategoryList
});
}
});
},
onLoad: function(options) {
// 页面初始化 options为页面跳转所带来的参数
this.getBanner();
this.getGoodsList();
},
onReady: function() {
// 页面渲染完成
},
onShow: function() {
// 页面显示
},
onHide: function() {
// 页面隐藏
},
onUnload: function() {
// 页面关闭
},
openSortFilter: function(event) {
let currentId = event.currentTarget.id;
switch (currentId) {
case 'categoryFilter':
this.setData({
categoryFilter: !this.data.categoryFilter,
currentSortType: 'category',
currentSort: 'add_time',
currentSortOrder: 'desc'
});
break;
case 'priceSort':
let tmpSortOrder = 'asc';
if (this.data.currentSortOrder == 'asc') {
tmpSortOrder = 'desc';
}
this.setData({
currentSortType: 'price',
currentSort: 'retail_price',
currentSortOrder: tmpSortOrder,
categoryFilter: false
});
this.getGoodsList();
break;
default:
//综合排序
this.setData({
currentSortType: 'default',
currentSort: 'add_time',
currentSortOrder: 'desc',
categoryFilter: false,
categoryId: 0,
});
this.getGoodsList();
}
},
selectCategory: function(event) {
let currentIndex = event.target.dataset.categoryIndex;
this.setData({
'categoryFilter': false,
'categoryId': this.data.filterCategory[currentIndex].id
});
this.getGoodsList();
}
})
\ No newline at end of file
{
"navigationBarTitleText": "人气推荐"
}
\ No newline at end of file
<view class="container">
<view class="brand-info">
<view class="name">
<image class="img" src="{{bannerInfo.imgUrl}}" background-size="cover"></image>
<view class="info-box">
<view class="info">
<text class="txt">{{bannerInfo.name}}</text>
<text class="line"></text>
</view>
</view>
</view>
</view>
<view class="sort">
<view class="sort-box">
<view class="item {{currentSortType == 'default' ? 'active' : ''}}" bindtap="openSortFilter" id="defaultSort">
<text class="txt">综合</text>
</view>
<view class="item by-price {{currentSortType == 'price' ? 'active' : ''}} {{currentSortOrder == 'asc' ? 'asc' : 'desc'}}" bindtap="openSortFilter" id="priceSort">
<text class="txt">价格</text>
</view>
<view class="item {{currentSortType == 'category' ? 'active' : ''}}" bindtap="openSortFilter" id="categoryFilter">
<text class="txt">分类</text>
</view>
</view>
<view class="sort-box-category" wx-if="{{categoryFilter}}">
<view class="item {{item.checked ? 'active' : ''}}" wx:for="{{filterCategory}}" wx:key="id" data-category-index="{{index}}" bindtap="selectCategory">{{item.name}}</view>
</view>
</view>
<view class="cate-item">
<view class="b">
<block wx:for="{{goodsList}}" wx:for-index="iindex" wx:for-item="iitem" wx:key="id">
<navigator class="item {{iindex % 2 == 0 ? 'item-b' : '' }}" url="../goods/goods?id={{iitem.id}}">
<image class="img" src="{{iitem.picUrl}}" background-size="cover"></image>
<text class="name">{{iitem.name}}</text>
<text class="price">¥{{iitem.retailPrice}}</text>
</navigator>
</block>
</view>
</view>
</view>
\ No newline at end of file
page{
background: #f4f4f4;
}
.brand-info .name{
width: 100%;
height: 278rpx;
position: relative;
}
.brand-info .img{
position: absolute;
top:0;
left:0;
width: 100%;
height: 278rpx;
}
.brand-info .info-box{
position: absolute;
top:0;
left:0;
width: 100%;
height: 278rpx;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
.brand-info .info{
display: block;
}
.brand-info .txt{
display: block;
height: 40rpx;
font-size: 37.5rpx;
color: #fff;
}
.brand-info .line{
margin: 0 auto;
margin-top: 16rpx;
display: block;
height: 2rpx;
width: 145rpx;
background: #fff;
}
.sort{
position: relative;
background: #fff;
width: 100%;
height: 78rpx;
}
.sort-box{
background: #fff;
width: 100%;
height: 78rpx;
overflow: hidden;
padding: 0 30rpx;
display: flex;
border-bottom: 1px solid #d9d9d9;
}
.sort-box .item{
height: 78rpx;
line-height: 78rpx;
text-align: center;
flex:1;
color: #333;
font-size: 30rpx;
}
.sort-box .item .txt{
display: block;
width: 100%;
height: 100%;
color: #333;
}
.sort-box .item.active .txt{
color: #b4282d;
}
.sort-box .item.by-price{
background: url(//yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/no-3127092a69.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.asc{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/up-636b92c0a5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.desc{
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/down-95e035f3e5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box-category{
background: #fff;
width: 100%;
height: auto;
overflow: hidden;
padding: 40rpx 40rpx 0 0;
border-bottom: 1px solid #d9d9d9;
}
.sort-box-category .item{
height: 54rpx;
line-height: 54rpx;
text-align: center;
float: left;
padding: 0 16rpx;
margin: 0 0 40rpx 40rpx;
border: 1px solid #666;
color: #333;
font-size: 24rpx;
}
.sort-box-category .item.active{
color: #b4282d;
border: 1px solid #b4282d;
}
.cate-item .b{
width: 750rpx;
height: auto;
overflow: hidden;
border-top: 1rpx solid #f4f4f4;
margin-top: 20rpx;
}
.cate-item .b .item{
float: left;
background: #fff;
width: 375rpx;
padding-bottom: 33.333rpx;
border-bottom: 1rpx solid #f4f4f4;
height: auto;
overflow: hidden;
text-align: center;
}
.cate-item .b .item-b{
border-right: 1rpx solid #f4f4f4;
}
.cate-item .item .img{
margin-top: 10rpx;
width: 302rpx;
height: 302rpx;
}
.cate-item .item .name{
display: block;
width: 365.625rpx;
height: 35rpx;
padding: 0 20rpx;
overflow: hidden;
margin: 11.5rpx 0 22rpx 0;
text-align: center;
font-size: 30rpx;
color: #333;
}
.cate-item .item .price{
display: block;
width: 365.625rpx;
height: 30rpx;
text-align: center;
font-size: 30rpx;
color: #b4282d;
}
\ No newline at end of file
const util = require('../../utils/util.js');
const api = require('../../config/api.js');
const user = require('../../utils/user.js');
//获取应用实例
const app = getApp();
Page({
data: {
newGoods: [],
hotGoods: [],
topics: [],
brands: [],
groupons: [],
floorGoods: [],
// banner: [],
channel: []
},
onShareAppMessage: function() {
return {
title: 'Renard',
desc: '唯爱与美食不可辜负',
path: '/pages/index/index'
}
},
saveFormId: function(v) {
if (v.detail.formId != 'the formId is a mock one') {
util.request(api.UserFormIdCreate, {
formId: v.detail.formId
});
}
},
onPullDownRefresh() {
this.getIndexData();
wx.stopPullDownRefresh() //停止下拉刷新
},
getIndexData: function() {
wx.showLoading({
title: '加载中',
});
setTimeout(function() {
wx.hideLoading()
}, 2000);
let that = this;
util.request(api.IndexUrl).then(function(res) {
if (res.errno === 0) {
that.setData({
newGoods: res.data.newGoodsList,
hotGoods: res.data.hotGoodsList,
topics: res.data.topicList,
brands: res.data.brandList,
floorGoods: res.data.floorGoodsList,
// banner: res.data.banner,
groupons: res.data.grouponList,
channel: res.data.channel
});
wx.hideLoading();
}
});
},
onLoad: function(options) {
var that = this;
wx.getSystemInfo({
success: function(res) {
that.setData({
windowWidth: res.windowWidth,
windowHeight: res.windowHeight
});
}
});
if (options.scene) {
var scene = decodeURIComponent(options.scene);
console.log("scene:" + scene);
let info_arr = [];
info_arr = scene.split(',');
let _type = info_arr[0];
let id = info_arr[1];
if (_type == 'goods') {
wx.navigateTo({
url: '../goods/goods?id=' + id
});
} else if (_type == 'groupon') {
wx.navigateTo({
url: '../goods/goods?grouponId=' + id
});
} else {
wx.navigateTo({
url: '../index/index'
});
}
}
// 页面初始化 options为页面跳转所带来的参数
if (options.grouponId) {
//这个pageId的值存在则证明首页的开启来源于用户点击来首页,同时可以通过获取到的pageId的值跳转导航到对应的详情页
wx.navigateTo({
url: '../goods/goods?grouponId=' + options.grouponId
});
}
// 页面初始化 options为页面跳转所带来的参数
if (options.goodId) {
//这个pageId的值存在则证明首页的开启来源于用户点击来首页,同时可以通过获取到的pageId的值跳转导航到对应的详情页
wx.navigateTo({
url: '../goods/goods?id=' + options.goodId
});
}
// 页面初始化 options为页面跳转所带来的参数
if (options.orderId) {
//这个pageId的值存在则证明首页的开启来源于用户点击来首页,同时可以通过获取到的pageId的值跳转导航到对应的详情页
wx.navigateTo({
url: '../ucenter/orderDetail/orderDetail?id=' + options.orderId
});
}
this.getIndexData();
},
onReady: function() {
// 页面渲染完成
},
onShow: function() {
// 页面显示
},
onHide: function() {
// 页面隐藏
},
onUnload: function() {
// 页面关闭
},
});
\ No newline at end of file
{
"navigationBarTitleText": "首页",
"usingComponents": {
"zan-capsule": "/components/capsule/index",
"goodList": "/components/goodList/goodList",
"van-notice-bar": "/components/notice-bar/index"
}
}
\ No newline at end of file
<view class="container">
<!-- 首页顶部通知消息 -->
<van-notice-bar scrollable="true" text="目前上架的商品均可直接下单购买,欢迎大家购买支持我的工作!" />
<view class="HotName">今日推荐
<text></text>
</view>
<view class="HotMark">唯爱与美食不可辜负</view>
<view class="HotSwiper" style="margin-top:{{windowHeight/45}}px">
<swiper circular="true" autoplay="true" interval="6000" duration="500" previous-margin="{{windowWidth/3.8}}rpx" next-margin="{{windowWidth/3.8}}rpx">
<block wx:for-items="{{hotGoods}}" wx:key="{{id}}">
<navigator url="/pages/goods/goods?id={{item.id}}">
<swiper-item>
<view class="swiper-box">
<form bindsubmit="saveFormId" report-submit='true' class='form_class'>
<button formType="submit" class='form_button'>
<image src="{{item.picUrl}}" mode="aspectFill" data-id="{{item.id}}" />
</button>
</form>
<view class="swiper-box-info">
<view class="name">{{item.name}}</view>
<view class="price">
<view class="counterPrice" wx:if="{{item.counterPrice > item.retailPrice}}">原价:¥{{item.counterPrice}}</view>
<view class="retailPrice">现价:¥{{item.retailPrice}}</view>
</view>
<view class="capsule-tag" wx:if="{{item.isNew == true}}">
<zan-capsule color="#a78845" leftText="N" rightText="新 品" />
</view>
<view class="capsule-tag" wx:if="{{item.counterPrice > item.retailPrice}}">
<zan-capsule color="#b4282d" leftText="H" rightText="折 扣" />
</view>
</view>
</view>
</swiper-item>
</navigator>
</block>
</swiper>
</view>
<view class="a-section a-groupon" wx:if="{{groupons.length > 0}}">
<view class="h">
<view class="title">
<view>
<!-- <navigator url="../hotGoods/hotGoods"> -->
<text class="txt">优惠专区</text>
<!-- </navigator> -->
</view>
</view>
</view>
<view class="b">
<view class="item" wx:for="{{groupons}}" wx:for-index="index" wx:for-item="item" wx:key="id">
<navigator url="/pages/goods/goods?id={{item.goods.id}}">
<image class="img" src="{{item.goods.picUrl}}" background-size="cover"></image>
<view class="right">
<view class="text">
<view class="header">
<text class="name">{{item.goods.name}}</text>
<view class="capsule-tag">
<zan-capsule color="#a78845" leftText="团购" rightText="{{item.groupon_member}}" />
</view>
</view>
<text class="desc">{{item.goods.brief}}</text>
<view class="price">
<view class="counterPrice">原价:¥{{item.goods.counterPrice}}</view>
<view class="retailPrice">团购价:¥{{item.groupon_price}}</view>
</view>
</view>
</view>
</navigator>
</view>
</view>
</view>
<view class="a-section a-new" wx:if="{{newGoods.length > 0}}">
<view class="h">
<view class="title">
<navigator url="../newGoods/newGoods">
<text class="txt">新品首发</text>
</navigator>
</view>
</view>
<goodList goods="{{newGoods}}"></goodList>
</view>
<view class="a-section a-brand">
<view class="h">
<view class="title">
<navigator url="../brand/brand">
<text class="txt">品牌制造商直供</text>
</navigator>
</view>
</view>
<view class="b">
<view class="item item-1" wx:for="{{brands}}" wx:key="id">
<navigator url="/pages/brandDetail/brandDetail?id={{item.id}}">
<view class="wrap">
<image class="img" src="{{item.picUrl}}" mode="aspectFill"></image>
<view class="mt">
<text class="brand">{{item.name}}</text>
</view>
</view>
</navigator>
</view>
</view>
</view>
<view class="good-grid" wx:for="{{floorGoods}}" wx:key="id">
<navigator url="/pages/category/category?id={{item.id}}" class="more-a">
<view class="h" wx:if="{{item.goodsList.length > 0}}">
<text>{{item.name}}</text>
</view>
</navigator>
<goodList goods="{{item.goodsList}}"></goodList>
</view>
<view class="a-section a-topic" wx:if="topics.length > 0">
<view class="h">
<view class="title">
<navigator url="/pages/topic/topic">
<text class="txt">专题精选</text>
</navigator>
</view>
</view>
<view class="b">
<scroll-view scroll-x class="list">
<view class="item" wx:for="{{topics}}" wx:for-index="index" wx:for-item="item" wx:key="id">
<navigator url="../topicDetail/topicDetail?id={{item.id}}">
<image class="img" src="{{item.picUrl}}" background-size="cover"></image>
<view class="np">
<text class="name">{{item.title}}</text>
</view>
<text class="desc">{{item.subtitle}}</text>
</navigator>
</view>
</scroll-view>
</view>
</view>
</view>
\ No newline at end of file
.HotName {
font-size: 50rpx;
margin-left: 40rpx;
margin-top: 30rpx;
color: #293539;
font-weight: 300;
position: relative;
}
.HotName text {
width: 14rpx;
height: 14rpx;
position: absolute;
border: 4rpx solid #a78845;
border-radius: 50%;
}
.HotMark {
margin-left: 50rpx;
color: #293539;
font-size: 36rpx;
margin-top: 10rpx;
text-align: center;
width: 350rpx;
border-bottom: 1rpx solid #a78845;
}
.HotSwiper swiper {
width: 100%;
height: 800rpx;
}
.swiper-box {
width: 520rpx;
margin: 0 auto;
position: relative;
height: 700rpx;
box-shadow: 0px 10rpx 30rpx 0px #cfc9ca;
margin-top: 40rpx;
border-radius: 20rpx;
}
.swiper-box image {
width: 100%;
height: 520rpx;
background-color: #f5f5f5;
border-top-left-radius: 10rpx;
border-top-right-radius: 10rpx;
}
.swiper-box-info {
position: absolute;
width: 100%;
height: 100rpx;
top: 520rpx;
background-color: #fff;
border-bottom-right-radius: 10rpx;
border-bottom-left-radius: 10rpx;
}
.swiper-box-info .name {
width: 90%;
margin: 0 auto;
margin-top: 20rpx;
font-size: 32rpx;
margin-left: 35rpx;
color: #293539;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.swiper-box-info .price {
float: left;
width: 60%;
margin-top: 10rpx;
margin-left: 30rpx;
}
.swiper-box-info .counterPrice {
text-decoration: line-through;
font-size: 30rpx;
color: #999;
}
.swiper-box-info .retailPrice {
font-size: 30rpx;
color: #a78845;
}
.capsule-tag {
float: right;
padding-right: 20rpx;
padding-top: 8rpx;
}
.zan-capsule + .zan-capsule {
margin-left: 10px;
}
.a-section .h {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
height: 130rpx;
}
.a-section .h .title {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
background-color: #a78845;
height: 75rpx;
}
.a-section .h .txt {
padding-left: 50rpx;
padding-right: 50rpx;
height: 75rpx;
color: #fff;
font-size: 33rpx;
}
.a-brand .b {
width: 750rpx;
height: auto;
overflow: hidden;
position: relative;
}
.a-brand .wrap {
position: relative;
}
.a-brand .img {
position: absolute;
left: 0;
top: 0;
}
.a-brand .mt {
position: absolute;
z-index: 2;
padding: 4rpx 12rpx;
background-color: #a78845;
right: 0;
top: 0;
}
.a-brand .mt .brand {
display: block;
font-size: 24rpx;
height: 33rpx;
color: #fff;
}
.a-brand .mt .price, .a-brand .mt .unit {
font-size: 25rpx;
color: #fff;
}
.a-brand .item-1 {
float: left;
width: 375rpx;
height: 252rpx;
overflow: hidden;
border-top: 1rpx solid #fff;
margin-left: 1rpx;
}
.a-brand .item-1:nth-child(2n+1) {
margin-left: 0;
width: 374rpx;
}
.a-brand .item-1 .img {
width: 375rpx;
height: 253rpx;
}
.a-topic .b {
height: 533rpx;
width: 750rpx;
padding: 0 0 48rpx 0;
}
.a-topic .b .list {
height: 533rpx;
width: 750rpx;
white-space: nowrap;
}
.a-topic .b .item {
display: inline-block;
height: 533rpx;
width: 680.5rpx;
margin-left: 30rpx;
overflow: hidden;
}
.a-topic .b .item:last-child {
margin-right: 30rpx;
}
.a-topic .b .img {
height: 387.5rpx;
width: 680.5rpx;
margin-bottom: 30rpx;
}
.a-topic .b .np {
height: 35rpx;
margin-bottom: 13.5rpx;
color: #333;
font-size: 30rpx;
}
.a-topic .b .np .price {
margin-left: 20.8rpx;
color: #a78845;
}
.a-topic .b .desc {
display: block;
height: 30rpx;
color: #999;
font-size: 24rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.a-groupon {
width: 750rpx;
height: auto;
overflow: hidden;
}
.a-groupon .b .item {
border-top: 1px solid #d9d9d9;
margin: 0 20rpx;
height: 244rpx;
width: 710rpx;
}
.a-groupon .b .img {
margin-top: 12rpx;
margin-right: 12rpx;
float: left;
width: 220rpx;
height: 220rpx;
}
.a-groupon .b .right {
float: left;
height: 244rpx;
width: 476rpx;
display: flex;
flex-flow: row nowrap;
}
.a-groupon .b .text {
display: flex;
flex-wrap: nowrap;
flex-direction: column;
justify-content: center;
overflow: hidden;
height: 244rpx;
width: 476rpx;
}
.a-groupon .b .name {
float: left;
width: 330rpx;
display: block;
color: #333;
line-height: 50rpx;
font-size: 30rpx;
}
.a-groupon .capsule-tag {
float: right;
padding-right: 0rpx;
padding-top: 8rpx;
}
.a-groupon .zan-capsule + .zan-capsule {
margin-left: 10px;
}
.a-groupon .b .desc {
width: 476rpx;
display: block;
color: #999;
line-height: 50rpx;
font-size: 25rpx;
}
.a-groupon .b .price {
width: 476rpx;
display: flex;
color: #b4282d;
line-height: 50rpx;
font-size: 33rpx;
}
.a-groupon .b .counterPrice {
text-decoration: line-through;
font-size: 28rpx;
color: #999;
}
.a-groupon .b .retailPrice {
margin-left: 30rpx;
font-size: 28rpx;
color: #a78845;
}
.good-grid {
width: 750rpx;
height: auto;
overflow: hidden;
}
.good-grid .h {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
height: 130rpx;
font-size: 33rpx;
color: #333;
border: #a78845 1rpx;
}
var util = require('../../utils/util.js');
var api = require('../../config/api.js');
var app = getApp();
Page({
data: {
bannerInfo: {
'imgUrl': '',
'name': ''
},
categoryFilter: false,
filterCategory: [],
goodsList: [],
categoryId: 0,
currentSortType: 'default',
currentSort: 'add_time',
currentSortOrder: 'desc',
page: 1,
size: 100
},
onPullDownRefresh() {
this.getBanner();
this.getGoodsList();
wx.stopPullDownRefresh() //停止下拉刷新
},
getBanner: function() {
let that = this;
util.request(api.GoodsNew).then(function(res) {
if (res.errno === 0) {
that.setData({
bannerInfo: res.data.bannerInfo,
});
}
});
},
getGoodsList: function() {
var that = this;
util.request(api.GoodsList, {
isNew: true,
page: that.data.page,
size: that.data.size,
order: that.data.currentSortOrder,
sort: that.data.currentSort,
categoryId: that.data.categoryId
})
.then(function(res) {
if (res.errno === 0) {
that.setData({
goodsList: res.data.goodsList,
filterCategory: res.data.filterCategoryList
});
}
});
},
onLoad: function(options) {
// 页面初始化 options为页面跳转所带来的参数
this.getBanner();
this.getGoodsList();
},
onReady: function() {
// 页面渲染完成
},
onShow: function() {
// 页面显示
},
onHide: function() {
// 页面隐藏
},
onUnload: function() {
// 页面关闭
},
openSortFilter: function(event) {
let currentId = event.currentTarget.id;
switch (currentId) {
case 'categoryFilter':
this.setData({
categoryFilter: !this.data.categoryFilter,
currentSortType: 'category',
currentSort: 'add_time',
currentSortOrder: 'desc'
});
break;
case 'priceSort':
let tmpSortOrder = 'asc';
if (this.data.currentSortOrder == 'asc') {
tmpSortOrder = 'desc';
}
this.setData({
currentSortType: 'price',
currentSort: 'retail_price',
currentSortOrder: tmpSortOrder,
categoryFilter: false
});
this.getGoodsList();
break;
default:
//综合排序
this.setData({
currentSortType: 'default',
currentSort: 'add_time',
currentSortOrder: 'desc',
categoryFilter: false,
categoryId: 0
});
this.getGoodsList();
}
},
selectCategory: function(event) {
let currentIndex = event.target.dataset.categoryIndex;
this.setData({
'categoryFilter': false,
'categoryId': this.data.filterCategory[currentIndex].id
});
this.getGoodsList();
}
})
\ No newline at end of file
{
"navigationBarTitleText": "新品首发",
"usingComponents": {
"goodList": "/components/goodList/goodList"
}
}
\ No newline at end of file
<view class="container">
<view class="brand-info">
<view class="name">
<image class="img" src="{{bannerInfo.imgUrl}}" background-size="cover"></image>
<view class="info-box">
<view class="info">
<text class="txt">{{bannerInfo.name}}</text>
<text class="line"></text>
</view>
</view>
</view>
</view>
<view class="sort">
<view class="sort-box">
<view class="item {{currentSortType == 'default' ? 'active' : ''}}" bindtap="openSortFilter" id="defaultSort">
<text class="txt">综合</text>
</view>
<view class="item by-price {{currentSortType == 'price' ? 'active' : ''}} {{currentSortOrder == 'asc' ? 'asc' : 'desc'}}" bindtap="openSortFilter" id="priceSort">
<text class="txt">价格</text>
</view>
<view class="item {{currentSortType == 'category' ? 'active' : ''}}" bindtap="openSortFilter" id="categoryFilter">
<text class="txt">分类</text>
</view>
</view>
<view class="sort-box-category" wx-if="{{categoryFilter}}">
<view class="item {{item.checked ? 'active' : ''}}" wx:for="{{filterCategory}}" wx:key="id" data-category-index="{{index}}" bindtap="selectCategory">{{item.name}}</view>
</view>
</view>
<view class="cate-item" hidden='{{categoryFilter}}'>
<goodList calss="goodList" goods="{{goodsList}}"></goodList>
</view>
</view>
\ No newline at end of file
page {
background: #f4f4f4;
}
.brand-info .name {
width: 100%;
height: 278rpx;
position: relative;
}
.brand-info .img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 278rpx;
}
.brand-info .info-box {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 278rpx;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
.brand-info .info {
display: block;
}
.brand-info .txt {
display: block;
height: 40rpx;
font-size: 37.5rpx;
color: #fff;
}
.brand-info .line {
margin: 0 auto;
margin-top: 16rpx;
display: block;
height: 2rpx;
width: 145rpx;
background: #fff;
}
.sort {
position: relative;
background: #fff;
width: 100%;
height: 78rpx;
}
.sort-box {
background: #fff;
width: 100%;
height: 78rpx;
overflow: hidden;
padding: 0 30rpx;
display: flex;
border-bottom: 1px solid #d9d9d9;
}
.sort-box .item {
height: 78rpx;
line-height: 78rpx;
text-align: center;
flex: 1;
color: #333;
font-size: 30rpx;
}
.sort-box .item .txt {
display: block;
width: 100%;
height: 100%;
color: #333;
}
.sort-box .item.active .txt {
color: #a78845;
}
.sort-box .item.by-price {
background: url(//yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/no-3127092a69.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.asc {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/up-636b92c0a5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.desc {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/down-95e035f3e5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.cate-item {
z-index: -1;
}
.goodList {
z-index: -1;
}
.sort-box-category {
background: #fff;
width: 100%;
height: auto;
overflow: hidden;
padding: 40rpx 40rpx 0 0;
border-bottom: 1px solid #d9d9d9;
z-index: 5000;
}
.sort-box-category .item {
height: 54rpx;
line-height: 54rpx;
text-align: center;
float: left;
padding: 0 16rpx;
margin: 0 0 40rpx 40rpx;
border: 1px solid #666;
color: #333;
font-size: 24rpx;
z-index: 5000;
}
.sort-box-category .item.active {
color: #a78845;
border: 1px solid #a78845;
z-index: 5000;
}
var util = require('../../utils/util.js');
var api = require('../../config/api.js');
var app = getApp();
Page({
data: {
status: false,
orderId: 0
},
onLoad: function (options) {
// 页面初始化 options为页面跳转所带来的参数
this.setData({
orderId: options.orderId,
status: options.status === '1' ? true : false
})
},
onReady: function () {
},
onShow: function () {
// 页面显示
},
onHide: function () {
// 页面隐藏
},
onUnload: function () {
// 页面关闭
},
payOrder() {
let that = this;
util.request(api.OrderPrepay, {
orderId: that.data.orderId
}, 'POST').then(function (res) {
if (res.errno === 0) {
const payParam = res.data;
console.log("支付过程开始")
wx.requestPayment({
'timeStamp': payParam.timeStamp,
'nonceStr': payParam.nonceStr,
'package': payParam.packageValue,
'signType': payParam.signType,
'paySign': payParam.paySign,
'success': function (res) {
console.log("支付过程成功")
that.setData({
status: true
});
},
'fail': function (res) {
console.log("支付过程失败")
util.showErrorToast('支付失败');
},
'complete': function (res) {
console.log("支付过程结束")
}
});
}
});
}
})
\ No newline at end of file
{
"navigationBarTitleText": "付款结果",
"navigationBarBackgroundColor": "#fafafa"
}
\ No newline at end of file
<view class="container">
<view class="pay-result">
<view class="success" wx:if="{{status}}">
<view class="msg">付款成功</view>
<view class="btns">
<navigator class="btn" url="/pages/ucenter/order/order" open-type="redirect">查看订单</navigator>
<navigator class="btn" url="/pages/index/index" open-type="switchTab">继续逛</navigator>
</view>
</view>
<view class="error" wx:if="{{!status}}">
<view class="msg">付款失败</view>
<view class="tips">
<view class="p">请在 <text class="time">半小时</text> 内完成付款</view>
<view class="p">否则订单将会被系统取消</view>
</view>
<view class="btns">
<navigator class="btn" url="/pages/ucenter/order/order" open-type="redirect">查看订单</navigator>
<view class="btn" bindtap='payOrder'>重新付款</view>
</view>
</view>
</view>
</view>
\ No newline at end of file
page {
min-height: 100%;
width: 100%;
background: #fff;
}
.container {
height: 100%;
background: #fff;
}
.pay-result {
background: #fff;
}
.pay-result .msg {
text-align: center;
margin: 100rpx auto;
color: #2bab25;
font-size: 36rpx;
}
.pay-result .btns {
display: flex;
align-items: center;
justify-content: center;
}
.pay-result .btn {
text-align: center;
height: 80rpx;
margin: 0 20rpx;
width: 200rpx;
line-height: 78rpx;
border: 1px solid #868686;
color: #000000;
border-radius: 5rpx;
}
.pay-result .error .msg {
color: #b4282d;
margin-bottom: 60rpx;
}
.pay-result .error .tips {
color: #7f7f7f;
margin-bottom: 70rpx;
}
.pay-result .error .tips .p {
font-size: 24rpx;
line-height: 42rpx;
text-align: center;
}
.pay-result .error .tips .p {
line-height: 42rpx;
text-align: center;
}
\ No newline at end of file
var util = require('../../utils/util.js');
var api = require('../../config/api.js');
var app = getApp();
Page({
data: {
keywrod: '',
searchStatus: false,
goodsList: [],
helpKeyword: [],
historyKeyword: [],
categoryFilter: false,
currentSort: 'name',
currentSortType: 'default',
currentSortOrder: 'desc',
filterCategory: [],
defaultKeyword: {},
hotKeyword: [],
page: 1,
size: 20,
categoryId: 0
},
//事件处理函数
closeSearch: function() {
wx.navigateBack()
},
clearKeyword: function() {
this.setData({
keyword: '',
searchStatus: false
});
},
onLoad: function() {
this.getSearchKeyword();
},
getSearchKeyword() {
let that = this;
util.request(api.SearchIndex).then(function(res) {
if (res.errno === 0) {
that.setData({
historyKeyword: res.data.historyKeywordList,
defaultKeyword: res.data.defaultKeyword,
hotKeyword: res.data.hotKeywordList
});
}
});
},
inputChange: function(e) {
this.setData({
keyword: e.detail.value,
searchStatus: false
});
if (e.detail.value) {
this.getHelpKeyword();
}
},
getHelpKeyword: function() {
let that = this;
util.request(api.SearchHelper, {
keyword: that.data.keyword
}).then(function(res) {
if (res.errno === 0) {
that.setData({
helpKeyword: res.data
});
}
});
},
inputFocus: function() {
this.setData({
searchStatus: false,
goodsList: []
});
if (this.data.keyword) {
this.getHelpKeyword();
}
},
clearHistory: function() {
this.setData({
historyKeyword: []
});
util.request(api.SearchClearHistory, {}, 'POST')
.then(function(res) {
console.log('清除成功');
});
},
getGoodsList: function() {
let that = this;
util.request(api.GoodsList, {
keyword: that.data.keyword,
page: that.data.page,
size: that.data.size,
sort: that.data.currentSort,
order: that.data.currentSortOrder,
categoryId: that.data.categoryId
}).then(function(res) {
if (res.errno === 0) {
that.setData({
searchStatus: true,
categoryFilter: false,
goodsList: res.data.goodsList,
filterCategory: res.data.filterCategoryList
});
}
//重新获取关键词
that.getSearchKeyword();
});
},
onKeywordTap: function(event) {
this.getSearchResult(event.target.dataset.keyword);
},
getSearchResult(keyword) {
if (keyword === '') {
keyword = this.data.defaultKeyword.keyword;
}
this.setData({
keyword: keyword,
page: 1,
categoryId: 0,
goodsList: []
});
this.getGoodsList();
},
openSortFilter: function(event) {
let currentId = event.currentTarget.id;
switch (currentId) {
case 'categoryFilter':
this.setData({
categoryFilter: !this.data.categoryFilter,
currentSortType: 'category',
currentSort: 'add_time',
currentSortOrder: 'desc'
});
break;
case 'priceSort':
let tmpSortOrder = 'asc';
if (this.data.currentSortOrder == 'asc') {
tmpSortOrder = 'desc';
}
this.setData({
currentSortType: 'price',
currentSort: 'retail_price',
currentSortOrder: tmpSortOrder,
categoryFilter: false
});
this.getGoodsList();
break;
default:
//综合排序
this.setData({
currentSortType: 'default',
currentSort: 'name',
currentSortOrder: 'desc',
categoryFilter: false,
categoryId: 0,
});
this.getGoodsList();
}
},
selectCategory: function(event) {
let currentIndex = event.target.dataset.categoryIndex;
let filterCategory = this.data.filterCategory;
let currentCategory = null;
for (let key in filterCategory) {
if (key == currentIndex) {
filterCategory[key].selected = true;
currentCategory = filterCategory[key];
} else {
filterCategory[key].selected = false;
}
}
this.setData({
filterCategory: filterCategory,
categoryFilter: false,
categoryId: currentCategory.id,
page: 1,
goodsList: []
});
this.getGoodsList();
},
onKeywordConfirm(event) {
this.getSearchResult(event.detail.value);
}
});
\ No newline at end of file
{
"navigationBarTitleText": "搜索",
"usingComponents": {
"goodList": "/components/goodList/goodList"
}
}
\ No newline at end of file
<scroll-view class="container" style="height: 100%;">
<view class="search-header">
<view class="input-box">
<image class="icon" src="http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/search2-2fb94833aa.png"></image>
<input name="input" class="keywrod" focus="true" value="{{keyword}}" confirm-type="search" bindinput="inputChange" bindfocus="inputFocus" bindconfirm="onKeywordConfirm" placeholder="{{defaultKeyword.keyword}}" />
<image class="del" wx:if="{{keyword}}" bindtap="clearKeyword" src="http://nos.netease.com/mailpub/hxm/yanxuan-wap/p/20150730/style/img/icon-normal/clearIpt-f71b83e3c2.png"></image>
</view>
<view class="right" bindtap="closeSearch">取消</view>
</view>
<view class="no-search" wx:if="{{ !searchStatus}}">
<view class="search-keywords search-history" wx:if="{{!keyword && historyKeyword.length}}">
<view class="h">
<text class="title">历史记录</text>
<image class="icon" bindtap="clearHistory" src="http://nos.netease.com/mailpub/hxm/yanxuan-wap/p/20150730/style/img/icon-normal/del1-93f0a4add4.png"></image>
</view>
<view class="b">
<view class="item" bindtap="onKeywordTap" data-keyword="{{item.keyword}}" wx:for="{{historyKeyword}}" wx:key="keyword" hover-class="navigator-hover">{{item.keyword}}</view>
</view>
</view>
<view class="search-keywords search-hot" wx:if="{{!keyword && hotKeyword.length}}">
<view class="h">
<text class="title">热门搜索</text>
</view>
<view class="b">
<view class="item {{item.is_hot === 1 ? 'active' : ''}}" hover-class="navigator-hover" bindtap="onKeywordTap" data-keyword="{{item.keyword}}" wx:for="{{hotKeyword}}" wx:key="id">{{item.keyword}}</view>
</view>
</view>
<view class="shelper-list" wx:if="{{keyword}}">
<view class="item" hover-class="navigator-hover" wx:for="{{helpKeyword}}" wx:key="id" bindtap="onKeywordTap" data-keyword="{{item}}">{{item}}</view>
</view>
</view>
<view class="search-result" wx:if="{{ searchStatus && goodsList.length}}">
<view class="sort">
<view class="sort-box">
<view class="item {{currentSortType == 'default' ? 'active' : ''}}" bindtap="openSortFilter" id="defaultSort">
<text class="txt">综合</text>
</view>
<view class="item by-price {{currentSortType == 'price' ? 'active' : ''}} {{currentSortOrder == 'asc' ? 'asc' : 'desc'}}" bindtap="openSortFilter" id="priceSort">
<text class="txt">价格</text>
</view>
<view class="item {{currentSortType == 'category' ? 'active' : ''}}" id="categoryFilter">
<text class="txt">分类</text>
</view>
</view>
<view class="sort-box-category" wx-if="{{categoryFilter}}">
<view class="item {{item.checked ? 'active' : ''}}" wx:for="{{filterCategory}}" wx:key="id" data-category-index="{{index}}" bindtap="selectCategory">{{item.name}}</view>
</view>
</view>
<view class="cate-item">
<goodList calss="goodList" goods="{{goodsList}}"></goodList>
</view>
</view>
<view class="search-result-empty" wx:if="{{!goodsList.length && searchStatus}}">
<image class="icon" src="http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/noSearchResult-7572a94f32.png"></image>
<text class="text">您寻找的商品还未上架</text>
</view>
</scroll-view>
\ No newline at end of file
page {
min-height: 100%;
background-color: #f4f4f4;
}
.container {
min-height: 100%;
background-color: #f4f4f4;
}
.search-header {
position: fixed;
top: 0;
width: 750rpx;
height: 91rpx;
display: flex;
background: #fff;
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
padding: 0 31.25rpx;
font-size: 29rpx;
color: #333;
}
.search-header .input-box {
position: relative;
margin-top: 16rpx;
float: left;
width: 0;
flex: 1;
height: 59rpx;
line-height: 59rpx;
padding: 0 20rpx;
background: #f4f4f4;
}
.search-header .icon {
position: absolute;
top: 14rpx;
left: 20rpx;
width: 31rpx;
height: 31rpx;
}
.search-header .del {
position: absolute;
top: 3rpx;
right: 10rpx;
width: 53rpx;
height: 53rpx;
z-index: 10;
}
.search-header .keywrod {
position: absolute;
top: 0;
left: 40rpx;
width: 506rpx;
height: 59rpx;
padding-left: 30rpx;
}
.search-header .right {
margin-top: 24rpx;
margin-left: 31rpx;
margin-right: 6rpx;
width: 58rpx;
height: 43rpx;
line-height: 43rpx;
float: right;
}
.no-search {
height: auto;
overflow: hidden;
margin-top: 91rpx;
}
.search-keywords {
background: #fff;
width: 750rpx;
height: auto;
overflow: hidden;
margin-bottom: 20rpx;
}
.search-keywords .h {
padding: 0 31.25rpx;
height: 93rpx;
line-height: 93rpx;
width: 100%;
color: #999;
font-size: 29rpx;
}
.search-keywords .title {
display: block;
width: 120rpx;
float: left;
}
.search-keywords .icon {
margin-top: 19rpx;
float: right;
display: block;
margin-left: 511rpx;
height: 55rpx;
width: 55rpx;
}
.search-keywords .b {
width: 750rpx;
height: auto;
overflow: hidden;
padding-left: 31.25rpx;
}
.search-keywords .item {
display: inline-block;
width: auto;
height: 48rpx;
line-height: 48rpx;
padding: 0 15rpx;
border: 1px solid #999;
margin: 0 31.25rpx 31.25rpx 0;
font-size: 24rpx;
color: #333;
}
.search-keywords .item.active {
color: #a78845;
border: 1px solid #a78845;
}
.shelper-list {
width: 750rpx;
height: auto;
overflow: hidden;
background: #fff;
padding: 0 31.25rpx;
}
.shelper-list .item {
height: 93rpx;
width: 687.5rpx;
line-height: 93rpx;
font-size: 24rpx;
color: #333;
border-bottom: 1px solid #f4f4f4;
}
.sort {
position: fixed;
top: 91rpx;
background: #fff;
width: 100%;
height: 78rpx;
}
.sort-box {
background: #fff;
width: 100%;
height: 78rpx;
overflow: hidden;
padding: 0 30rpx;
display: flex;
border-bottom: 1px solid #d9d9d9;
}
.sort-box .item {
height: 78rpx;
line-height: 78rpx;
text-align: center;
flex: 1;
color: #333;
font-size: 30rpx;
}
.sort-box .item .txt {
display: block;
width: 100%;
height: 100%;
color: #333;
}
.sort-box .item.active .txt {
color: #a78845;
}
.sort-box .item.by-price {
background: url(//yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/no-3127092a69.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.asc {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/up-636b92c0a5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box .item.by-price.active.desc {
background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/down-95e035f3e5.png) 155rpx center no-repeat;
background-size: 15rpx 21rpx;
}
.sort-box-category {
background: #fff;
width: 100%;
height: auto;
overflow: hidden;
padding: 40rpx 40rpx 0 0;
border-bottom: 1px solid #d9d9d9;
}
.sort-box-category .item {
height: 54rpx;
line-height: 54rpx;
text-align: center;
float: left;
padding: 0 16rpx;
margin: 0 0 40rpx 40rpx;
border: 1px solid #666;
color: #333;
font-size: 24rpx;
}
.sort-box-category .item.active {
color: #a78845;
border: 1px solid #a78845;
}
.cate-item {
margin-top: 175rpx;
height: auto;
overflow: hidden;
}
.cate-item .h {
height: 145rpx;
width: 750rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.cate-item .h .name {
display: block;
height: 35rpx;
margin-bottom: 18rpx;
font-size: 30rpx;
color: #333;
}
.cate-item .h .desc {
display: block;
height: 24rpx;
font-size: 24rpx;
color: #999;
}
.search-result-empty {
width: 100%;
height: 100%;
padding-top: 300rpx;
}
.search-result-empty .icon {
margin: 0 auto;
display: block;
width: 240rpx;
height: 240rpx;
}
.search-result-empty .text {
display: block;
width: 100%;
height: 40rpx;
font-size: 28rpx;
text-align: center;
color: #999;
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment