mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2025-12-19 00:45:54 +08:00
commit message
This commit is contained in:
Chopper
266
pages/promotion/sale.vue
Normal file
266
pages/promotion/sale.vue
Normal file
@@ -0,0 +1,266 @@
|
||||
<template>
|
||||
<view class="sale">
|
||||
<view class="status_bar">
|
||||
<!-- 这里是状态栏 -->
|
||||
</view>
|
||||
|
||||
<view class="prohibition" :style="'overscroll-behavior: unset;height:' + header.height + 'px;'">
|
||||
<view class="header">
|
||||
<view class="left">
|
||||
<u-icon @click="goMainPage()" size="40" name="arrow-left"></u-icon>
|
||||
</view>
|
||||
特惠推荐
|
||||
<view @click="goCart" class="right"><text class="alifont icon-gouwuche1"
|
||||
style="font-size: 40rpx;"></text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sale-head">
|
||||
<image :style="'margin-top:' + header.height + 'px;'" src="/pages/floor/imgs/recommend/head-sample.png"
|
||||
mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="sale-title">
|
||||
<view>今日特惠</view>
|
||||
</view>
|
||||
<view class="sale-items">
|
||||
<view class="sale-item" v-for="item in goods" @click="navigateTo(item)">
|
||||
<view class="sale-item-img">
|
||||
<image :src="item.thumbnail" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="sale-item-content">
|
||||
<view class="sale-item-title">
|
||||
{{ item.name }}
|
||||
<view class="sale-item-title-desc">{{ item.category }}</view>
|
||||
</view>
|
||||
<view class="sale-item-price">
|
||||
<text class="sale-item-price-now">¥{{ item.price | unitPrice }}
|
||||
<!-- <text v-if="item.point">+{{ item.point || 0 }}积分</text> -->
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getPlateformTagGoods
|
||||
} from '@/api/goods.js';
|
||||
import storage from '@/utils/storage.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
header: {
|
||||
top: 0,
|
||||
height: 40
|
||||
},
|
||||
goods: [],
|
||||
tag_id: 1,
|
||||
loadStatus: 'more'
|
||||
};
|
||||
},
|
||||
async onLoad(options) {
|
||||
if (options.title) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: options.title
|
||||
});
|
||||
}
|
||||
let response = await getPlateformTagGoods(this.tag_id);
|
||||
this.goods = response.data;
|
||||
},
|
||||
onBackPress() {
|
||||
// uni.preloadPage({
|
||||
// url: '/pages/tabbar/home/index',
|
||||
// success: function(res) {
|
||||
// // 通过eventChannel向被打开页面传送数据
|
||||
// console.log(res)
|
||||
// }
|
||||
// });
|
||||
|
||||
// //莫名其妙的，无法后退，尝试追加参数解决缓存问题
|
||||
// uni.switchTab({
|
||||
// url: '/pages/tabbar/home/index?' + new Date().getTime(),
|
||||
// success: function(res) {
|
||||
// // 通过eventChannel向被打开页面传送数据
|
||||
// console.log(res);
|
||||
// }
|
||||
// });
|
||||
},
|
||||
methods: {
|
||||
// 跳转
|
||||
navigateTo(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/product/goods?id=' + item.goods_id
|
||||
});
|
||||
},
|
||||
goCart() {
|
||||
//跳转购物车
|
||||
let obj = {
|
||||
from: 'sale',
|
||||
id: ''
|
||||
};
|
||||
storage.setCartBackbtn(obj);
|
||||
uni.preloadPage({
|
||||
url: '/pages/tabbar/cart/cartList'
|
||||
});
|
||||
},
|
||||
goMainPage() {
|
||||
//莫名其妙的，无法后退，尝试追加参数解决缓存问题
|
||||
uni.switchTab({
|
||||
url: '/pages/tabbar/home/index'
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.sale {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.index {
|
||||
padding-top: var(--status-bar-height);
|
||||
}
|
||||
|
||||
.prohibition {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
top: var(--status-bar-height);
|
||||
}
|
||||
|
||||
.status_bar {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
height: var(--status-bar-height);
|
||||
width: 100%;
|
||||
background: #1abc9c;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: #1abc9c;
|
||||
position: relative;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26rpx;
|
||||
font-size: 34rpx;
|
||||
height: 80rpx;
|
||||
|
||||
.left,
|
||||
.right {
|
||||
position: absolute;
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 20rpx;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
right: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sale-head {
|
||||
padding-top: var(--status-bar-height);
|
||||
|
||||
image {
|
||||
width: 750 rpx;
|
||||
height: 280 rpx;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
margin-bottom: 20 rpx;
|
||||
}
|
||||
|
||||
.sale-title {
|
||||
width: 710 rpx;
|
||||
height: 100 rpx;
|
||||
margin: 0 auto;
|
||||
font-size: 28 rpx;
|
||||
color: #666;
|
||||
border-radius: 14 rpx 14 rpx 0 0;
|
||||
background-color: #f1f1f1;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
|
||||
view {
|
||||
margin-left: 40 rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC, PingFang SC-Regular;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.sale-items {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
flex-direction: column;
|
||||
margin: 0 20rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.sale-item {
|
||||
width: 710 rpx;
|
||||
padding: 0 20rpx;
|
||||
height: 180 rpx;
|
||||
border-bottom: 1px solid #eeeeee;
|
||||
// position: relative;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
.sale-item-img {
|
||||
margin-right: 20 rpx;
|
||||
|
||||
image {
|
||||
width: 124 rpx;
|
||||
height: 124 rpx;
|
||||
border-radius: 8 rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sale-item-content {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.sale-item-title {
|
||||
font-size: 28 rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.sale-item-title-desc {
|
||||
font-size: 25 rpx;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.sale-item-price-now {
|
||||
font-size: 28 rpx;
|
||||
color: #ff5a10;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user