From de967a172cbd8389073b5af59fd4966e4736c36a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=82=93=E5=B9=B3=E8=89=BA?= <52643018@qq.com>
Date: Sat, 18 Sep 2021 16:22:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E9=A6=96=E9=A1=B5=E4=B8=BA?=
=?UTF-8?q?=E4=BD=A0=E6=8E=A8=E8=8D=90=E5=92=8Ctips=EF=BC=8C=E5=AE=8C?=
=?UTF-8?q?=E5=96=84=E8=B4=AD=E7=89=A9=E8=BD=A6=E9=A1=B5=E9=9D=A2=E9=83=A8?=
=?UTF-8?q?=E5=88=86=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
components/lf-indexFind/lf-indexFind.vue | 2 +-
components/lf-nav/lf-nav.vue | 2 +-
components/lf-seckill/lf-seckill.vue | 19 ++-
pages/index/category/category.vue | 10 +-
pages/index/index/index.vue | 83 +++++-------
pages/shop/search.vue | 1 +
pages/shop/seckillList.vue | 17 ++-
pages/store/cart/cart.vue | 156 ++++++++++++++++++-----
8 files changed, 184 insertions(+), 106 deletions(-)
diff --git a/components/lf-indexFind/lf-indexFind.vue b/components/lf-indexFind/lf-indexFind.vue
index 96c6f28..225e401 100644
--- a/components/lf-indexFind/lf-indexFind.vue
+++ b/components/lf-indexFind/lf-indexFind.vue
@@ -8,7 +8,7 @@
@click="$url('/pages/discover/discoverdetails')"
v-for="(item, index) in list" :key="index">
- {{ item.associate.title }}
+ {{ item.associate.content }}
diff --git a/components/lf-nav/lf-nav.vue b/components/lf-nav/lf-nav.vue
index 4bad0f0..ebbbd71 100644
--- a/components/lf-nav/lf-nav.vue
+++ b/components/lf-nav/lf-nav.vue
@@ -155,7 +155,7 @@
top: 0;
left: 0;
z-index: 99999;
- transition: all .2;
+ transition: all .2s;
}
.head .head-nav{
position: absolute;
diff --git a/components/lf-seckill/lf-seckill.vue b/components/lf-seckill/lf-seckill.vue
index def0997..586c2e9 100644
--- a/components/lf-seckill/lf-seckill.vue
+++ b/components/lf-seckill/lf-seckill.vue
@@ -6,12 +6,12 @@
低价不等人，快来秒杀啦～
-
-
- 日本sk-ll小灯跑
+
+
+ {{ item.associate.goods.name }}
- ¥888
- ¥888
+ ¥{{ item.associate.goods.market_price }}
+ ¥{{ item.associate.goods.max_price }}
@@ -36,9 +36,6 @@
return {
}
- },
- onLoad(){
-
},
methods: {
@@ -106,12 +103,14 @@
}
.goods-price>text:nth-child(1n){
font-size: 28rpx;
- font-weight: #F63434;
+ color: #F63434;
+ font-weight: bold;
}
.goods-price>text:nth-child(2n){
font-size: 24rpx;
- font-weight: #777777;
+ color: #777777;
margin-left: 15rpx;
+ text-decoration: line-through;
}
}
}
diff --git a/pages/index/category/category.vue b/pages/index/category/category.vue
index 73913de..b74d5d4 100644
--- a/pages/index/category/category.vue
+++ b/pages/index/category/category.vue
@@ -40,7 +40,7 @@
{{ value.name }}
+ @click="clickFilterTab(key)">{{ value.name }}
@@ -306,6 +306,14 @@
// })
// }).exec()
// console.log('ttscrollH',this.$refs.left_0)
+ },
+ // 品牌筛选tab被点击
+ clickFilterTab(key){
+ if(this.filter_active == key){
+ this.filter_active = '';
+ }else{
+ this.filter_active = key;
+ }
}
}
}
diff --git a/pages/index/index/index.vue b/pages/index/index/index.vue
index 730de8f..a70729d 100644
--- a/pages/index/index/index.vue
+++ b/pages/index/index/index.vue
@@ -83,10 +83,10 @@
-
+
今日头条
- 来自太阳的宝石-8月生辰石
+ {{ item.title }}
@@ -104,7 +104,7 @@
-
+
@@ -129,10 +129,10 @@
-->
-
+
为你推荐
-
+
@@ -462,49 +462,7 @@
is_login:'',// 是否是登陆状态
show_ad: false, // 是否显示ad广告
ad_modal_list: [], // ad广告列表
- nav_bg_color: 'transparent' ,// 导航背景颜色
- recommend_list: [
- {
- id: 10,
- original_price: "4111.00",
- picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png",
- pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"],
- price: "2412.00",
- product_id: 1008,
- sale: 0,
- title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)"
- },
- {
- id: 10,
- original_price: "4111.00",
- picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png",
- pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"],
- price: "2412.00",
- product_id: 1008,
- sale: 0,
- title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)"
- },
- {
- id: 10,
- original_price: "4111.00",
- picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png",
- pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"],
- price: "2412.00",
- product_id: 1008,
- sale: 0,
- title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)"
- },
- {
- id: 10,
- original_price: "4111.00",
- picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png",
- pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"],
- price: "2412.00",
- product_id: 1008,
- sale: 0,
- title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)"
- }
- ]
+ nav_bg_color: 'rgba(255,255,255,0)' ,// 导航背景颜色
};
},
// 注册组件
@@ -533,7 +491,24 @@
lfMultiColumnAd,
lfSeckill
},
-
+ computed: {
+ transformList(){
+ return function(list=[]){
+ let new_list = list.map(item => {
+ return {
+ original_price: item.associate.market_price,
+ picture: item.associate.img,
+ pictures: [item.associate.img],
+ price: item.associate.max_price,
+ product_id: item.associate.id,
+ sale: item.associate.sale_count,
+ title: item.associate.name
+ }
+ });
+ return new_list;
+ }
+ }
+ },
onShow(e) {
@@ -595,13 +570,13 @@
// 页面滚动
onPageScroll(event){
if(event.scrollTop >= 100){
- this.nav_bg_color = '#ffffff';
+ this.nav_bg_color = 'rgba(255,255,255,1)';
uni.setNavigationBarColor({
frontColor: "#000000",
backgroundColor: "#0000000"
})
}else{
- this.nav_bg_color = 'transparent';
+ this.nav_bg_color = 'rgba(255,255,255,0)';
uni.setNavigationBarColor({
frontColor: "#ffffff",
backgroundColor: "#FFFFFF"
@@ -1193,21 +1168,23 @@
}
.fuwu-tips{
width: 686rpx;
- height: 70rpx;
+ min-height: 70rpx;
background-color: #eff6f7;
margin: 60rpx auto 0;
display: flex;
// justify-content: space-between;
box-sizing: border-box;
align-items: center;
- padding: 0 30rpx;
+ padding: 12rpx 30rpx;
border-radius: 40rpx;
+ line-height: 1.2;
.fuwu-tips-title{
font-size: 36rpx;
color: #186c6b;
margin-right: 15rpx;
font-weight: bold;
font-family: '华文行楷';
+ white-space: nowrap;
}
.fuwu-tips-desc1{
font-size: 28rpx;
diff --git a/pages/shop/search.vue b/pages/shop/search.vue
index d216786..17e9e15 100644
--- a/pages/shop/search.vue
+++ b/pages/shop/search.vue
@@ -94,6 +94,7 @@
},
// 点击了搜索按钮
customClick(value){
+ if(!value || !value.trim()) return this.$msg('搜索内容不能为空');
this.updateHistory(value).then(() => {
this.$url('/pages/shop/searchList?value='+ value);
})
diff --git a/pages/shop/seckillList.vue b/pages/shop/seckillList.vue
index b33c65d..db9c390 100644
--- a/pages/shop/seckillList.vue
+++ b/pages/shop/seckillList.vue
@@ -2,25 +2,27 @@
-
+
-
- 已有0人购买
+
+ TODO已有0人购买
- SK-II秋日宠粉体验套装
+ {{ item.goods.name }}
距离开始还剩余 20:34:18
- ¥888
- ¥10000
+ ¥{{ item.goods.max_price }}
+ ¥{{ item.goods.market_price }}
立即秒杀
+
@@ -30,7 +32,7 @@
export default {
data(){
return {
-
+ list: []
}
},
onLoad(){
@@ -42,6 +44,7 @@
api: 'api/seckill/all'
}).then(res => {
console.log("----", res);
+ this.list = res.data.data;
})
}
}
diff --git a/pages/store/cart/cart.vue b/pages/store/cart/cart.vue
index 8796616..3d99881 100644
--- a/pages/store/cart/cart.vue
+++ b/pages/store/cart/cart.vue
@@ -3,34 +3,30 @@
-
-
+
+
- 精品超市
+ {{ s_item.name }}
-
- 满减
-
- 母婴产品教师节满1200减200
+ 满减
+ {{s_item.full_minus}}
- 去凑单
+ 去凑单
-
-
-
-
-
-
+
+
+
+
-
-
- 爱他美较大婴儿配方奶粉较大婴儿配方奶粉较大婴儿配方奶粉2段 900g
+
+
+ {{g_item.name}}
- 1件；900g
- ￥385
+ {{g_item.count}}件；{{g_item.spec}}
+ ￥{{ g_item.price }}
@@ -39,20 +35,18 @@
-
-
-
-
-
- 全选
-
-
+
+
+ 全选
+
+
- 合计: ￥1150
+ 合计: ￥{{ total_price || 0 }}
-
- 结算 (6)
+
+ 结算
+ ({{ total_count }})
@@ -63,12 +57,105 @@
export default {
data() {
return {
- checked: false
+ token: '', // 用户token
+ allChecked: false, // 全选
+ list: [], // 购物车列表
+ total_price: '', // 总金额
+ total_count: '' // 总数量
}
},
+ watch: {
+ list: {
+ deep: true,
+ handler: function(val){
+ let total_count = 0;
+ let total_price = 0;
+ // TODO 真正对接接口时，使用精度计算
+ val.map(s => {
+ s.goods.map(g => {
+ if(g.checked){
+ total_count++;
+ total_price += (g.price * g.count)
+ }
+ })
+ })
+ this.total_count = total_count;
+ this.total_price = total_price;
+ }
+ }
+ },
+ onLoad(){
+ this.token = this.$cookieStorage.get('user_token');
+ this.getCartList();
+ },
methods: {
- checkboxChange(e) {
- console.log(e)
+ getCartList(){
+ this.$http.get({
+ api: 'api/cart',
+ header: {
+ Authorization: this.token
+ }
+ }).then(res => {
+ console.log("===", res);
+ // TODO 此处为假数据 ------------------
+ let list = [{
+ name: '精品超市',
+ full_minus: '母婴产品教师节满1200减200',
+ goods: [{
+ checked: false,
+ img: 'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png',
+ name: '爱他美较大婴儿配方奶粉较大婴儿配方奶粉较大婴儿配方奶粉2段 900g',
+ count: 1,
+ spec: '900g',
+ price: '385'
+ },{
+ checked: false,
+ img: 'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png',
+ name: '基尼泰煤2000G',
+ count: 2,
+ spec: '900g',
+ price: '197'
+ }]
+ },{
+ name: '精品超市',
+ full_minus: '母婴产品教师节满1200减200',
+ goods: [{
+ checked: false,
+ img: 'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png',
+ name: '爱他美较大婴儿配方奶粉较大婴儿配方奶粉较大婴儿配方奶粉2段 900g',
+ count: 4,
+ spec: '900g',
+ price: '99'
+ }]
+ }]
+ this.list = list;
+ // TODO 此处为假数据 end --------------
+ })
+ },
+ // 商品被勾选
+ goodsCheckChange(event, parentIndex, childIndex) {
+ this.list[parentIndex].goods[childIndex].checked = event.value;
+ let check_list = this.list.map(item => {
+ return item.goods.every(g => g.checked);
+ });
+ this.allChecked = check_list.every(a => a);
+ },
+ // 全选被改变
+ allCheckChange(event){
+ this.allChecked = event.value;
+ this.list.forEach(s => {
+ s.goods.forEach(g => {
+ g.checked = event.value;
+ })
+ })
+ },
+ // 结算
+ submit(){
+ if(this.total_count){
+ this.$url('/pages/order/confirm/confirm');
+ }else{
+ this.$msg('您未选择需要结算的商品');
+ }
}
}
}
@@ -119,6 +206,9 @@
height: 130rpx;
border-radius: 5rpx;
}
+ .content-info{
+ width: 410rpx;
+ }
.online-card {
width: 686rpx;
height: auto;