Skip to content

7
7-Eleven
Commit 2c8536a5 by 赵雅纹
Options

聚fun

parent f4cbedfd
Showing with 382 additions and 4 deletions
src/component/productListStyleOne/productListStyleOne.js 0 → 100644
// component/productListStyleOne/productListStyleOne.js
Component({
/**
* 组件的属性列表
*/
properties: {
imageData: {
type: Array,
value: [],
},
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
}
})
src/component/productListStyleOne/productListStyleOne.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/component/productListStyleOne/productListStyleOne.wxml 0 → 100644
<!--component/productListStyleOne/productListStyleOne.wxml-->
<view class="water-wrap">
<view class="left">
<block wx:for="{{imageData}}" wx:key="">
<template is="water-list" data="{{...item}}" wx:if="{{index%2==0}}"></template>
</block>
</view>
<view class="right">
<block wx:for="{{imageData}}" wx:key="">
<template is="water-list" data="{{...item}}" wx:if="{{index%2==1}}"></template>
</block>
</view>
</view>
<template name="water-list">
<view class="item">
<image class="item-img" src="{{url}}" mode="widthFix"></image>
<view class="item-title-box">
<view class="item-title">{{title}}</view>
</view>
<view class="pro-price-wrap">
<view class="pro-plus-price">
<text>￥</text>
<text class="plus-price">228</text>
<image mode="widthFix" src="/assets/imgs/7_1_0/member-icon.png"></image>
</view>
<view class="pro-member-price">
<text>￥</text>
<text class="member-price">228</text>
<image mode="widthFix" src="/assets/imgs/7_1_0/plus-sm.png"></image>
</view>
</view>
</view>
</template>
src/component/productListStyleOne/productListStyleOne.wxss 0 → 100644
/* component/productListStyleOne/productListStyleOne.wxss */
.water-wrap{
margin: 20rpx 24rpx;
text-align: justify;
}
.item{
margin-bottom: 22rpx;
display: inline-block;
width: 341rpx;
border-radius: 10rpx;
box-shadow: 0px 2px 5px 0px rgba(199, 199, 199, 0.5);
padding-bottom: 24rpx;
}
.item-ava{
width: 40rpx;
height: 40rpx;
border-radius: 20rpx;
}
.heart{
width: 30rpx;
height: 26rpx;
margin-right: 8rpx;
}
.heart_{
display: flex;
align-items: center;
}
.item-img{
width: 100%;
border-top-left-radius: 10rpx;
border-top-right-radius: 10rpx;
}
.item-title{
font-size: 25rpx;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-family: 'PingFang SC-Medium';
color: #333333;
margin: 15rpx;
}
.item .name{
display: flex;
padding: 0 17rpx;
margin-top: 20rpx;
padding-bottom: 10rpx;
align-items: center;
font-size: 22rpx;
color: #1e1e1e;
font-family: 'PingFang SC-Medium';
}
.left,.right{
display: inline-block;
vertical-align: top;
width: 49%;
}
.right{
float: right;
}
.pro-price-wrap{
padding: 0 17rpx;
}
.pro-plus-price{
color: #cb3c3c;
font-size: 24rpx;
}
.pro-member-price{
color: #333333;
font-size: 24rpx;
margin-top: 10rpx;
}
.plus-price,.member-price{
font-size: 32rpx;
}
.pro-plus-price image{
width: 61rpx;
margin-left: 13rpx;
}
.pro-member-price image{
width: 30rpx;
margin-left: 13rpx;
}
\ No newline at end of file
src/component/productListStyleTwo/productListStyleTwo.js 0 → 100644
// component/productListStyleTwo/productListStyleTwo.js
Component({
/**
* 组件的属性列表
*/
properties: {
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
}
})
src/component/productListStyleTwo/productListStyleTwo.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/component/productListStyleTwo/productListStyleTwo.wxml 0 → 100644
<!--component/productListStyleTwo/productListStyleTwo.wxml-->
<view class="hot-item border_box">
<view class="hot-img-box">
<image class="hot-img" src="./../../assets/imgs/7_1_0/scancode.png" mode="widthFix" lazy-load="false" binderror="" bindload="" />
</view>
<view class="hot-item-desc border_box">
<view class="item-name">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
<view class="item-desc">商品描述商品描述商品描述商品描述商品描述商品描述商品描述</view>
<view class="item-vip-price weui-flex">
<view class="">
<image
class="item-vip"
src="./../../assets/imgs/7_1_0/vip.png"
mode="widthFix"
lazy-load="false"
binderror=""
bindload=""
/>
</view>
<text class="vip-sale-price border_box">￥189</text>
<text class="vip-original-price">￥189</text>
</view>
<view class="item-plus-price weui-flex">
<view class="">
<image
class="item-plus"
src="./../../assets/imgs/7_1_0/plus.png"
mode="widthFix"
lazy-load="false"
binderror=""
bindload=""
/>
</view>
<text class="vip-plus-price vip-sale-price border_box">￥158</text>
</view>
<view/>
</view>
</view>
src/component/productListStyleTwo/productListStyleTwo.wxss 0 → 100644
/* component/productListStyleTwo/productListStyleTwo.wxss */
@import './../../base/base.wxss';
.hot-item {
display: flex;
/* padding: 28rpx; */
width: 710rpx;
height: 276rpx;
border-radius: 10rpx;
margin: 0 auto;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.05);
}
.hot-img {
width: 276rpx;
height: 276rpx;
border-top-left-radius: 10rpx;
border-bottom-left-radius: 10rpx;
}
.hot-item-desc {
margin-left: 28rpx;
margin-top: 33rpx;
}
.item-name {
width: 338rpx;
color: rgba(0, 0, 0, 1);
font-size: 26rpx;
text-align: left;
font-family: PingFangSC-Light;
font-weight: bold;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
}
.item-desc{
color: #C09A74;
font-size: 22rpx;
width: 378rpx;
margin-top: 12rpx;
}
.item-vip,
.item-plus {
width: 88rpx;
height: 30rpx;
border-radius: 3rpx;
background-color: #fff;
}
.item-plus-price,
.item-vip-price{
display: flex;
height: 45rpx;
color: rgba(51, 51, 51, 1);
font-size: 32rpx;
font-family: PingFangSC-Medium;
flex-direction: row;
align-items: baseline;
}
.item-vip-price{
margin-top: 12rpx;
}
.vip-sale-price {
padding: 0 10rpx;
}
.vip-original-price {
width: 62rpx;
color: rgba(170, 170, 170, 1);
font-size: 22rpx;
font-family: PingFangSC-Regular;
text-decoration: line-through;
}
.vip-plus-price {
color: rgba(203, 60, 60, 1);
}
.buy-btn {
text-align: right;
}
.buy {
display: inline-block;
width: 125rpx;
height: 39rpx;
line-height: 35rpx;
border-radius: 19rpx;
text-align: center;
background-color: rgba(203, 60, 60, 1);
border: 2rpx solid rgba(151, 151, 151, 1);
color: rgba(255, 255, 255, 1);
font-size: 18rpx;
font-family: PingFangSC-Regular;
}
src/subPackage/page/pages/fun/fun.js
......@@ -5,7 +5,62 @@ Page({
* 页面的初始数据
*/
data: {
imageData: [
{
name: '大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼大脸猫爱吃鱼',
heart_num: '1',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://f10.baidu.com/it/u=121654667,1482133440&fm=72',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
},
{
name: '大脸猫爱吃鱼',
heart_num: '2',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://img3.imgtn.bdimg.com/it/u=1417732605,3777474040&fm=26&gp=0.jpg',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
},
{
name: '大脸猫爱吃鱼',
heart_num: '3',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://img3.imgtn.bdimg.com/it/u=1417732605,3777474040&fm=26&gp=0.jpg',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
}, {
name: '大脸猫爱吃鱼',
heart_num: '4',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://f10.baidu.com/it/u=121654667,1482133440&fm=72',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
},
{
name: '大脸猫爱吃鱼',
heart_num: '5',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://f10.baidu.com/it/u=121654667,1482133440&fm=72',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
},
{
name: '大脸猫爱吃鱼',
heart_num: '6',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://img3.imgtn.bdimg.com/it/u=1417732605,3777474040&fm=26&gp=0.jpg',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
},
{
name: '大脸猫爱吃鱼',
heart_num: '7',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://img4.imgtn.bdimg.com/it/u=2748975304,2710656664&fm=26&gp=0.jpg',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
}, {
name: '大脸猫爱吃鱼',
heart_num: '8',
title: '你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识你所不知道的红酒知识',
url: 'http://img2.imgtn.bdimg.com/it/u=1561660534,130168102&fm=26&gp=0.jpg',
avatar: 'http://img4.imgtn.bdimg.com/it/u=349345436,3394162868&fm=26&gp=0.jpg'
}
],
},
/**
......
src/subPackage/page/pages/fun/fun.json
{
"navigationBarTitleText": "聚FUN",
"usingComponents": {}
"usingComponents": {
"tab-sort": "/component/tabSort/tabSort",
"product-list-style-one": "/component/productListStyleOne/productListStyleOne",
"product-list-style-two": "/component/productListStyleTwo/productListStyleTwo"
}
}
\ No newline at end of file
src/subPackage/page/pages/fun/fun.wxml
<!--subPackage/page/pages/fun/fun.wxml-->
<text>subPackage/page/pages/fun/fun.wxml</text>
<!--pages/userCenter.wxml-->
<view>
<tab-sort/>
<product-list-style-one image-data="{{imageData}}"/>
<product-list-style-two />
</view>
Markdown is supported
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