Loki
/
fish-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修改为你推荐显示旧价格的问题

master
Gao xiaosong 4 years ago
parent
c2d0529ab5
commit
1b141d0256
2 changed files with 350 additions and 347 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 411
      components/PromotionGood.vue
  2. 286
      pages/user/promotion/Poster/index.vue

411
components/PromotionGood.vue
Unescape View File

@ -1,215 +1,212 @@
<template> <template>
<view> <view>
<view class="sh-title-card mb10"> <view class="sh-title-card mb10">
<view class="title-box"> <view class="title-box">
<image class="title-bg" :src="`${$VUE_APP_RESOURCES_URL}/images/title1.png`" mode="aspectFill" /> <image class="title-bg" :src="`${$VUE_APP_RESOURCES_URL}/images/title1.png`" mode="aspectFill" />
<view class="title-text">为你推荐</view> <view class="title-text">为你推荐</view>
<!-- <view class="title-text" :style="{ color: detail.color }">为你推荐</view> --> <!-- <view class="title-text" :style="{ color: detail.color }">为你推荐</view> -->
</view> </view>
</view> </view>
<view class="hot-goods mx20 mb10" v-if="benefit.length"> <view class="hot-goods mx20 mb10" v-if="benefit.length">
<view class="goods-list x-f"> <view class="goods-list x-f">
<view class="goods-item" v-for="(item, promotionGoodIndex) in benefit" :key="promotionGoodIndex"> <view class="goods-item" v-for="(item, promotionGoodIndex) in benefit" :key="promotionGoodIndex">
<view class="goods-box" @tap="routerGo(item)"> <view class="goods-box" @tap="routerGo(item)">
<view class="img-box"> <view class="img-box">
<!-- <image class="tag-img" :src="item.image" mode=""></image> --> <!-- <image class="tag-img" :src="item.image" mode=""></image> -->
<image class="img" :src="item.image" lazy-load mode="aspectFill"></image> <image class="img" :src="item.image" lazy-load mode="aspectFill"></image>
</view> </view>
<view class="tip one-t">{{ item.storeName }}</view> <view class="tip one-t">{{ item.storeName }}</view>
<view class="title more-t">{{ item.storeName }}</view> <view class="title more-t">{{ item.storeName }}</view>
<view class="price-box"> <view class="price-box">
<view class="flex x-bc align-end"> <view class="flex x-bc align-end">
<view class="current">{{ item.activity_type === 'groupon' ? item.price : item.otPrice }} <view class="current">{{ item.price }} </view>
</view> <view class="sales miso-font">仅剩：{{ item.stock }}{{ item.unitName }}</view>
<view class="sales miso-font">仅剩：{{ item.stock }}{{ item.unitName }}</view> </view>
</view> <view class="x-f tag-box">
<view class="x-f tag-box"> <!-- <view class="discount">新人礼</view>
<!-- <view class="discount">新人礼</view>
<view class="discount">满100减60</view> --> <view class="discount">满100减60</view> -->
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
name: 'PromotionGood', name: 'PromotionGood',
props: ['benefit'], props: ['benefit'],
data: function () { data: function() {
return {}; return {}
}, },
methods: { methods: {
routerGo(item) { routerGo(item) {
this.$yrouter.push({ this.$yrouter.push({
path: '/pages/shop/GoodsCon/index', path: '/pages/shop/GoodsCon/index',
query: { query: {
id: item.id id: item.id,
} },
}); })
} },
}, },
mounted() { mounted() {},
} }
};
</script> </script>
<style lang="scss"> <style lang="scss">
.sh-title-card { .sh-title-card {
width: 750rpx; width: 750rpx;
} }
.title-box { .title-box {
width: 710rpx; width: 710rpx;
height: 88rpx; height: 88rpx;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
border-radius: 30rpx; border-radius: 30rpx;
.title-bg { .title-bg {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.title-text { .title-text {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
font-weight: bold; font-weight: bold;
} }
} }
.goods-box { .goods-box {
width: 345rpx; width: 345rpx;
background: #fff; background: #fff;
padding-bottom: 20rpx; padding-bottom: 20rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
.img-box { .img-box {
width: 345rpx; width: 345rpx;
height: 345rpx; height: 345rpx;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
.tag-img { .tag-img {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
z-index: 2; z-index: 2;
width: 80rpx; width: 80rpx;
height: 40rpx; height: 40rpx;
} }
.img { .img {
width: 345rpx; width: 345rpx;
height: 345rpx; height: 345rpx;
background-color: #ccc; background-color: #ccc;
} }
} }
.tip { .tip {
width: 346rpx; width: 346rpx;
line-height: 56rpx; line-height: 56rpx;
background: rgba(246, 242, 234, 1); background: rgba(246, 242, 234, 1);
font-size: 22rpx; font-size: 22rpx;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: 400; font-weight: 400;
color: rgba(168, 112, 13, 1); color: rgba(168, 112, 13, 1);
padding: 0 20rpx; padding: 0 20rpx;
} }
.title { .title {
font-size: 24rpx; font-size: 24rpx;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: 500; font-weight: 500;
line-height: 36rpx; line-height: 36rpx;
height: 72rpx; height: 72rpx;
margin: 20rpx 20rpx 10rpx; margin: 20rpx 20rpx 10rpx;
} }
.price-box { .price-box {
padding: 10rpx 20rpx 0; padding: 10rpx 20rpx 0;
width: 344rpx; width: 344rpx;
box-sizing: border-box; box-sizing: border-box;
.sales { .sales {
font-size: 20rpx; font-size: 20rpx;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: 400; font-weight: 400;
color: rgba(153, 153, 153, 1); color: rgba(153, 153, 153, 1);
line-height: 20rpx; line-height: 20rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.current { .current {
font-size: 30rpx; font-size: 30rpx;
font-weight: 500; font-weight: 500;
color: rgba(225, 33, 43, 1); color: rgba(225, 33, 43, 1);
line-height: 30rpx; line-height: 30rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
&:before { &:before {
content: '￥'; content: '￥';
font-size: 26rpx; font-size: 26rpx;
} }
} }
.original { .original {
font-size: 22rpx; font-size: 22rpx;
font-weight: 400; font-weight: 400;
text-decoration: line-through; text-decoration: line-through;
color: rgba(153, 153, 153, 1); color: rgba(153, 153, 153, 1);
margin-left: 14rpx; margin-left: 14rpx;
line-height: 22rpx; line-height: 22rpx;
margin-bottom: 10rpx; margin-bottom: 10rpx;
&:before { &:before {
content: '￥'; content: '￥';
font-size: 20rpx; font-size: 20rpx;
} }
} }
.tag-box { .tag-box {
.discount { .discount {
line-height: 28rpx; line-height: 28rpx;
border: 1rpx solid rgba(225, 33, 43, 1); border: 1rpx solid rgba(225, 33, 43, 1);
border-radius: 8rpx; border-radius: 8rpx;
font-size: 18rpx; font-size: 18rpx;
font-family: PingFang SC; font-family: PingFang SC;
font-weight: 500; font-weight: 500;
color: rgba(225, 33, 43, 1); color: rgba(225, 33, 43, 1);
padding: 0 8rpx; padding: 0 8rpx;
margin-right: 10rpx; margin-right: 10rpx;
} }
} }
} }
} }
// 为你推荐 // 为你推荐
.hot-goods { .hot-goods {
// background: linear-gradient(#fff 200rpx, #f6f6f6 500rpx, #f6f6f6); // background: linear-gradient(#fff 200rpx, #f6f6f6 500rpx, #f6f6f6);
// border-radius: 20rpx; // border-radius: 20rpx;
.goods-list { .goods-list {
flex-wrap: wrap; flex-wrap: wrap;
width: 710rpx; width: 710rpx;
.goods-item { .goods-item {
margin-right: 20rpx; margin-right: 20rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
width: 345rpx; width: 345rpx;
box-shadow: 0px 0px 10rpx 4rpx rgba(199, 199, 199, 0.22); box-shadow: 0px 0px 10rpx 4rpx rgba(199, 199, 199, 0.22);
border-radius: 20rpx; border-radius: 20rpx;
&:nth-child(2n) { &:nth-child(2n) {
margin-right: 0; margin-right: 0;
} }
} }
} }
} }
</style> </style>

286
pages/user/promotion/Poster/index.vue
Unescape View File

@ -13,160 +13,166 @@
</view> </view>
</template> </template>
<script> <script>
// import { swiper, swiperSlide } from "vue-awesome-swiper"; // import { swiper, swiperSlide } from "vue-awesome-swiper";
import { import { getSpreadImg } from '@/api/user'
getSpreadImg
} from "@/api/user";
export default { export default {
name: "Poster", name: 'Poster',
components: { components: {
// swiper, // swiper,
// swiperSlide // swiperSlide
}, },
props: {}, props: {},
data: function () { data: function() {
return { return {
swiperPosters: { swiperPosters: {
speed: 1000, speed: 1000,
effect: "coverflow", effect: 'coverflow',
slidesPerView: "auto", slidesPerView: 'auto',
centeredSlides: true, centeredSlides: true,
coverflowEffect: { coverflowEffect: {
rotate: 0, // 旋转的角度 rotate: 0, // 旋转的角度
stretch: -20, // 拉伸 图片间左右的间距和密集度 stretch: -20, // 拉伸 图片间左右的间距和密集度
depth: 100, // 深度 切换图片间上下的间距和密集度 depth: 100, // 深度 切换图片间上下的间距和密集度
modifier: 3, // 修正值 该值越大前面的效果越明显 modifier: 3, // 修正值 该值越大前面的效果越明显
slideShadows: false // 页面阴影效果 slideShadows: false, // 页面阴影效果
},
observer: true,
observeParents: true
}, },
info: [], observer: true,
activeIndex: 0 observeParents: true,
}; },
}, info: [],
mounted: function () { activeIndex: 0,
this.getIndex(); }
let that = this; },
// this.swiper.on("slideChange", function() { mounted: function() {
// that.activeIndex = that.swiper.activeIndex; this.getIndex()
// }); let that = this
// this.swiper.on("slideChange", function() {
// that.activeIndex = that.swiper.activeIndex;
// });
},
computed: {
swiper() {
// return this.$refs.mySwiper.swiper;
}, },
computed: { },
swiper() { methods: {
// return this.$refs.mySwiper.swiper; getIndex: function() {
} let that = this
getSpreadImg({
from: this.$deviceType == 'weixin' || this.$deviceType == 'weixinh5' ? 'uniappH5' : this.$deviceType,
}).then(
res => {
that.info = res.data
},
err => {
uni.showToast({
title: err.msg || err.response.data.msg || err.response.data.message,
icon: 'none',
duration: 2000,
})
}
)
}, },
methods: { downloadIamge(imgsrc, name) {
getIndex: function () { var that = this
let that = this; this.isDown = true
getSpreadImg({ var downloadUrl = imgsrc
from: this.$deviceType == 'weixin' || this.$deviceType == 'weixinh5' ? 'uniappH5' : this.$deviceType
}).then(
res => {
that.info = res.data;
},
err => {
uni.showToast({
title: err.msg || err.response.data.msg || err.response.data.message,
icon: "none",
duration: 2000
});
}
);
},
downloadIamge (imgsrc, name) {
var that = this;
this.isDown = true;
var downloadUrl = imgsrc;
if (!wx.saveImageToPhotosAlbum) { // if (!wx.saveImageToPhotosAlbum) {
uni.showModal({ // uni.showModal({
title: "提示", // title: '提示',
content: "当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。" // content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。',
}); // })
that.openDialogVisible = true; // that.openDialogVisible = true
return; // return
} // }
// 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.writePhotosAlbum" 这个 scope that.downloadFile(downloadUrl)
wx.getSetting({
success(res) {
if (!res.authSetting["scope.writePhotosAlbum"]) {
that.openDialogVisible = true;
// 接口调用询问 // 可以通过 uni.getSetting 先查询一下用户是否授权了 "scope.writePhotosAlbum" 这个 scope
wx.authorize({ // uni.getSetting({
scope: "scope.writePhotosAlbum", // success(res) {
success() { // if (!res.authSetting["scope.writePhotosAlbum"]) {
that.downloadFile(downloadUrl); // that.openDialogVisible = true;
},
fail() { // // 接口调用询问
// 用户拒绝了授权 // uni.authorize({
// 打开设置页面 // scope: "scope.writePhotosAlbum",
wx.openSetting({ // success() {
success: function (data) {}, // that.downloadFile(downloadUrl);
fail: function (data) {} // },
}); // fail() {
} // // 用户拒绝了授权
}); // // 打开设置页面
} else { // uni.openSetting({
that.downloadFile(downloadUrl); // success: function (data) {},
} // fail: function (data) {}
}, // });
fail(res) { // }
that.openDialogVisible = true; // });
} // } else {
}); // that.downloadFile(downloadUrl);
}, // }
saveImg: function () { // },
this.downloadIamge( // fail(res) {
this.info[this.activeIndex].wap_poster, // that.openDialogVisible = true;
"poster" + this.activeIndex // }
); // });
}, },
downloadFile(url){ saveImg: function() {
uni.downloadFile({ this.downloadIamge(this.info[this.activeIndex].wap_poster, 'poster' + this.activeIndex)
url, },
fail: function(res) { downloadFile(url) {
uni.showModal({ uni.downloadFile({
title: "提示", url,
content: "保存失败" fail: function(res) {
}); uni.showModal({
}, title: '提示',
success: function(res) { content: '保存失败',
uni.showModal({ })
title: "提示", },
content: "保存成功" success: function(res) {
}); uni.showModal({
} title: '提示',
}); content: '保存成功',
} })
} },
}; })
},
},
}
</script> </script>
<style lang="less"> <style lang="less">
page { page {
height: 100%; height: 100%;
} }
.distribution-posters { .distribution-posters {
height: 100%; height: 100%;
} }
.banenr { .banenr {
height: 100%; height: 100%;
} }
.banner swiper { .banner swiper {
height: 100%; height: 100%;
} }
.banner .slide-image { .banner .slide-image {
width: 100%; width: 100%;
height: auto; height: auto;
}
.distribution-posters {
.keep {
position: absolute;
bottom: 60rpx;
left: 60rpx;
right: 60rpx;
width: auto;
} }
}
</style> </style>

Write Preview
Loading…
Cancel
Save