This commit is contained in:
2020-07-16 17:39:06 +08:00
parent 91241682de
commit b250d05adf
14 changed files with 497 additions and 72 deletions

View File

@@ -1,6 +1,6 @@
<template>
<view class="items">
<view class="item-top">
<view class="item-top" @click="choiceAddress">
<view class="user-info">
<view class="user-name">{{ item.address_realname }}</view>
<view class="user-pnone">{{ item.address_mob_phone | phoneFormat }}</view>
@@ -35,17 +35,15 @@
</view>
</template>
<script>
/**
* address
* @description 地址
* @property {Object} item 地址信息
* @property {String} state 是否选择地址 choise
*/
export default {
name: 'address-item',
data() {
return {
}
},
props: ['item', 'current'],
mounted() {
// console.log(this.item);
},
props: ['item', 'current', 'state'],
filters: {
phoneFormat(value) {
return value.replace(/^(\d{3})\d*(\d{4})$/, '$1****$2');
@@ -74,6 +72,15 @@ export default {
}
})
},
choiceAddress() {
if(this.state) {
this.$store.commit('updateAddress', this.item);
this.$u.route({
type: 'navigateBack',
url: '/pageC/cart/ConfirmOrder',
})
}
},
showToast(message, type) {
this.$refs.uToast.show({
title: message,

View File

@@ -9,18 +9,59 @@
<view class="item">
<item v-for="item in goodsList" :key="item.goods_id" :info="item"></item>
</view>
<!-- <view>
<u-tabs-swiper ref="uTabs" :list="tabList" :current="current" @change="tabsChange" :is-scroll="false"
swiperWidth="750" height="60"></u-tabs-swiper>
</view>
<swiper :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish" >
<swiper-item class="swiper-item" v-for="(_, index) in tabList" :key="index">
<scroll-view scroll-y style="height: 800rpx;width: 100%;">
<view class="item">
<item v-for="item in goodsList" :key="item.goods_id" :info="item"></item>
</view>
</scroll-view>
</swiper-item>
</swiper> -->
</view>
</template>
<script>
import item from "./item"
export default {
name:"list",
name:"list",
data() {
return {
tabList: [{name: '推荐'}, {name: '推荐'}, {name: '推荐'}],
tabList: [],
current: 0,
swiperCurrent: 0,
}
},
components:{
item
},
props: {
classifyList: Array,
goodsList: Array,
},
methods: {
// tabs通知swiper切换
tabsChange(index) {
this.swiperCurrent = index;
},
// swiper-item左右移动通知tabs的滑块跟随移动
transition(e) {
let dx = e.detail.dx;
this.$refs.uTabs.setDx(dx);
},
// 由于swiper的内部机制问题快速切换swiper不会触发dx的连续变化需要在结束时重置状态
// swiper滑动结束分别设置tabs和swiper的状态
animationfinish(e) {
let current = e.detail.current;
this.$refs.uTabs.setFinishCurrent(current);
this.swiperCurrent = current;
this.current = current;
},
}
}
</script>

View File

@@ -4,21 +4,25 @@
<view class="title">
<view class="name">全部秒杀</view>
<view class="time">
<text class="num">12</text>
<text class="num">{{ time.littleHour }}</text>
<text class="mah">:</text>
<text class="num">12</text>
<text class="num">00</text>
<text class="mah">:</text>
<text class="num">12</text>
<text class="num">00</text>
<text>-</text>
<text class="num">{{ time.bigHour }}</text>
<text class="mah">:</text>
<text class="num">00</text>
<text class="mah">:</text>
<text class="num">00</text>
</view>
</view>
<view class="next">
<view class="next" @click="viewMore">
查看更多>
</view>
</view>
<view class="list">
<sitem></sitem>
<sitem></sitem>
<sitem></sitem>
<sitem v-for="(item, index) in list.slice(0, 3)" :key="index" :item="item"></sitem>
</view>
</view>
</template>
@@ -28,7 +32,15 @@ export default {
name:"seckill",
components:{
sitem
}
},
props: ['list', 'time'],
methods: {
viewMore() {
this.$u.route({
url: '/pageC/spike/index',
})
}
}
}
</script>
<style lang="scss" scoped>
@@ -46,15 +58,17 @@ export default {
color: #333;
}
.time{
margin-left: 39rpx;
margin-left: 20rpx;
display: flex;
align-items: center;
font-size: 20rpx;
.num{
box-sizing: content-box;
width: 25rpx;
height: 25rpx;
background-color: #bfbfbf;
margin: 0 10rpx;
padding: 2rpx;
}
}
}

View File

@@ -1,25 +1,33 @@
<template>
<view class="item">
<image class="head"></image>
<text class="title">商品名</text>
<image class="head" :src="item.groupbuy_image1"></image>
<text class="title u-line-2">{{ item.goods_name }}</text>
<view class="price">
<text>99</text>
<text>299</text>
<text>{{ item.groupbuy_price }}</text>
<text>{{ item.goods_price }}</text>
</view>
<view class="info">
<text>剩余21</text>
<text>剩余{{ item.inventory | formatValue }}</text>
<text>立即购买</text>
</view>
</view>
</template>
<script>
export default {
name:"item"
name:"item",
props: ['item'],
filters: {
formatValue(value) {
let temp = Number(value);
if(temp > 999) temp = '999+';
return temp;
}
}
}
</script>
<style lang="scss" scoped>
.item{
width: 210rpx;
width: 220rpx;
.head{
width: 210rpx;
height: 131rpx;
@@ -43,6 +51,7 @@ export default {
>text:last-child{
font-size: 24rpx;
color: #999;
text-decoration: line-through;
}
}
@@ -50,7 +59,7 @@ export default {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 22rpx;
font-size: 20rpx;
margin-top: 19rpx;
>text:first-child{
color: #666;

View File

@@ -0,0 +1,91 @@
<template>
<view class="special">
<image :src="item.groupbuy_image1"></image>
<view class="right">
<view class="name u-line-1">{{ item.goods_name }}</view>
<view class="price" v-if="type == 'spike'">
<view class="groupbuy-price">{{ item.groupbuy_price }}</view>
<view class="goods-price">{{ item.goods_price }}</view>
</view>
<view class="buy">
<view class="num">剩余{{ item.inventory }}</view>
<view class="btn">立即购买</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
props: {
item: Object,
type: String,
},
created() {
console.log(this.item);
}
};
</script>
<style lang="scss" scoped>
.special {
margin-bottom: 30rpx;
display: flex;
width: 690rpx;
background: rgba(245,245,245,1);
border-radius: 6rpx;
> image {
flex-shrink: 0;
width: 210rpx;
height: 170rpx;
border-radius: 6rpx 0rpx 0rpx 6rpx;
}
.right {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 20rpx;
.name {
width: 400rpx;
font-size: 26rpx;
color: rgba(51,51,51,1);
margin-bottom: 20rpx;
}
.price {
display: flex;
.groupbuy-price {
font-size: 26rpx;
color: rgba(255,49,49,1);
margin-right: 12rpx;
}
.goods-price {
font-size: 24rpx;
text-decoration: line-through;
color: rgba(153,153,153,1);
}
}
.buy {
display: flex;
justify-content: space-between;
align-items: center;
.num {
font-size: 22rpx;
color: rgba(102,102,102,1);
}
.btn {
width: 140rpx;
height: 50rpx;
background: rgba(255,120,15,1);
border-radius: 25rpx;
font-size: 22rpx;
font-weight: 500;
color: rgba(255,255,255,1);
line-height: 50rpx;
text-align: center;
}
}
}
}
</style>