Skip to content

7
7-Eleven
Commit 8d5c1657 by 高淑倩
Options

add: 关联商品_列表

parent 57acef2a
Showing with 255 additions and 67 deletions
src/component/relatedOrderItem/relatedOrderItem.js 0 → 100644
// component/relatedOrderItem/relatedOrderItem.js
var app = getApp()
const wxService = require('../../utils/wxService')
const utils = require('../../utils/util')
const envInfo = require('../../config/index').envInfo
Component({
/**
* 组件的属性列表
*/
properties: {
},
attached () {
},
/**
* 组件的初始数据
*/
data: {
isSelect:false
},
/**
* 组件的方法列表
*/
methods: {
selectCoupon() {
console.log('2222')
this.setData({
isSelect: !this.data.isSelect
})
},
}
})
src/component/relatedOrderItem/relatedOrderItem.json 0 → 100644
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
src/component/relatedOrderItem/relatedOrderItem.wxml 0 → 100644
<!--component/relatedOrderItem/relatedOrderItem.wxml-->
<!--<view class="grass-item weui-flex border_box">
<view class="grass-img-box">
<image class="grass-img" src="./../../assets/imgs/7_1_0/scancode.png" mode="widthFix" lazy-load="false" binderror="" bindload="" />
</view>
<view class="grass-item-desc border_box">
<view class="item-name">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
</view>
<view class="select-radio">
<view class="{{isSelect ? 'theme-color' : ''}} coupon-radio">
<image
wx:if="{{isSelect}}"
class="tick-success"
src="/assets/imgs/7_1_0/tick-success.png"
mode="widthFix"
/>
</view>
</view>
</view>-->
<view class="grass-item weui-flex border_box" bindtap="selectCoupon">
<view class="grass-img-box">
<image
class="grass-img"
src="./../../assets/imgs/7_1_0/scancode.png"
mode="widthFix"
lazy-load="false"
binderror=""
bindload=""
/>
</view>
<view class="grass-item-desc border_box">
<view class="item-name">商品名称称商品名称称称商品名称商品名称</view>
</view>
<view class="select-radio">
<view class="{{isSelect ? 'theme-color' : ''}} coupon-radio">
<image
wx:if="{{isSelect}}"
class="tick-success"
src="/assets/imgs/7_1_0/tick-success.png"
mode="widthFix"
/>
</view>
</view>
</view>
src/component/relatedOrderItem/relatedOrderItem.wxss 0 → 100644
/* component/relatedOrderItem/relatedOrderItem.wxss */
@import '/app.wxss';
@import './../../base/base.wxss';
.grass-item {
height: 200rpx;
border-radius: 10rpx;
overflow: hidden;
background-color: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.grass-img-box, .grass-img {
width: 200rpx;
height: 200rpx;
}
.grass-item-desc {
margin-left: 28rpx;
}
.item-name {
color: rgba(0, 0, 0, 1);
font-family: PingFangSC-Light;
padding: 20rpx 0 20rpx 0;
width: 400rpx;
height: 74rpx;
color: rgba(0, 0, 0, 1);
font-size: 26rpx;
}
.modal-container {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
transform: translateY(100%);
opacity: 0;
transition: opacity 200ms;
z-index: 98;
}
.modal-container.active {
opacity: 1;
transform: translateY(0); }
.modal-content.active {
transform: translateY(0); }
.modal-content {
position: fixed;
z-index: 99;
width: 100%;
bottom: 0;
left: 0;
background: #ffffff;
transition: transform 300ms;
transform: translateY(100%);
height: 1000rpx;
}
.modal-content .modal-close {
position: absolute;
right: 24rpx;
top: 35rpx;
width: 25rpx;
}
.modal-to-back{
width: 18rpx;
position: absolute;
left: 24rpx;
top: 35rpx;
transform: rotate(180deg);
}
.modal-title{
color: #333333;
font-size: 32rpx;
position: absolute;
left: 295rpx;
top: 28rpx;
}
.coupon-list{
width: 702rpx;
height: 174rpx;
position: relative;
margin-bottom: 25rpx;
}
.coupon-bg{
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.left-price,.right-info{
display: inline-block;
}
.left-price{
font-size: 18rpx;
color:#CB3C3C;
position: absolute;
top: 36rpx;
left: 48rpx;
}
.amount{
font-size: 54rpx;
}
.right-info{
position: absolute;
top: 33rpx;
left: 205rpx;
}
.coupon-title{
font-size: 28rpx;
color: #333333;
}
.coupon-time{
color: #aaaaaa;
font-size: 20rpx;
}
.coupon-desc{
color: #aaaaaa;
font-size: 22rpx;
margin-top: 12rpx;
}
.modal-info{
max-height: 900rpx;
overflow: scroll;
}
.empty-coupon{
width: 100%;
color: #aaaaaa;
margin-top:211rpx ;
text-align: center;
}
.coupon-radio{
width: 32rpx;
height: 32rpx;
border-radius: 50%;
border: 1rpx solid rgba(0, 0, 0, 0.2);
line-height: 26rpx;
text-align: center;
}
.tick-success{
width: 18rpx;
}
.select-radio{
position: absolute;
top: 71rpx;
right: 30rpx;
}
.theme-color{
border: none;
}
src/component/selectRelatedGoods/selectRelatedGoods.json
{
"component": true,
"usingComponents": {}
"usingComponents": {
"relate-order-item": "/component/relatedOrderItem/relatedOrderItem"
}
}
\ No newline at end of file
src/component/selectRelatedGoods/selectRelatedGoods.wxml
......@@ -19,31 +19,8 @@
</view>
<view class="coupon-list" bindtap="selectCoupon">
<image
wx:if="{{false}}"
class="coupon-bg"
src="/assets/imgs/7_1_0/coupon-bg.png"
mode="widthFix"
/>
<image class="coupon-bg" src="/assets/imgs/7_1_0/disabled-coupon.png" mode="widthFix" />
<view class="coupon-info">
<view class="left-price">
<view class="top-price">
<text>￥</text>
<text class="amount">50</text>
</view>
<view class="bottom-desc">
满99可用
</view>
</view>
<view class="right-info">
<view class="coupon-title">新人礼包劵</view>
<view class="coupon-time">有效期</view>
<view class="coupon-desc">拼团及特殊商品不可用</view>
</view>
<relate-order-item />
<!--
<view class="select-radio">
<view class="{{isSelect ? 'theme-color' : ''}} coupon-radio">
<image
......@@ -55,7 +32,7 @@
</view>
</view>
</view>
-->
</view>
<view class="empty-coupon">
......
src/component/selectRelatedGoods/selectRelatedGoods.wxss
......@@ -94,49 +94,11 @@
position: relative;
margin-bottom: 25rpx;
}
.coupon-bg {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.modal-info {
padding: 0 24rpx;
margin-top: 95rpx;
}
.left-price,
.right-info {
display: inline-block;
}
.left-price {
font-size: 18rpx;
color: #cb3c3c;
position: absolute;
top: 36rpx;
left: 48rpx;
}
.amount {
font-size: 54rpx;
}
.right-info {
position: absolute;
top: 33rpx;
left: 205rpx;
}
.coupon-title {
font-size: 28rpx;
color: #333333;
}
.coupon-time {
color: #aaaaaa;
font-size: 20rpx;
}
.coupon-desc {
color: #aaaaaa;
font-size: 22rpx;
margin-top: 12rpx;
}
.modal-info {
max-height: 900rpx;
overflow: scroll;
......
src/subPackage/page/pages/grassCommunity/grassCommunity.js
......@@ -10,7 +10,7 @@ wxService.page({
*/
data: {
pics:[],
showSelectRelatedGoods: false
showSelectRelatedGoods: true
},
/**
......
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