hengmei-one/components/shop-list.vue

122 lines
5.8 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="pad20 shop_list_box">
<view style="width: 48.6%;float: left;">
<view class="bacf radius15 mar-x20" @tap="goPage">
<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
<view class="pad-zy20 pad-s10 pad-x30">
<view class="fon28 bold col3 clips2">99皮皮节种植发际 线1000单位FUE技术...</view>
<view class="disac fon20 mar-sx20">
<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
</view>
<view class="disac">
<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">3888</view>
<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">4205</view>
</view>
</view>
</view>
<view class="bacf radius15 mar-x20">
<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
<view class="pad-zy20 pad-s10 pad-x30">
<view class="fon28 bold col3 clips2">99皮皮节种植发际 线1000单位FUE技术...</view>
<view class="disac fon20 mar-sx20">
<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
</view>
<view>
<view class="disjbac">
<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">拼团价3888</view>
<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">4205</view>
</view>
<view class="disjbac mar-s20">
<view class="fon24 col80">已拼团10组</view>
<view class="disac">
<image src="../../../static/tabbar/mya.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;"></image>
<image src="../../../static/tabbar/mym.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;margin-left: -20rpx;"></image>
<image src="../../../static/tabbar/homeAc.png" mode="" style="width: 40rpx;height: 40rpx;border-radius: 100%;margin-left: -20rpx;"></image>
</view>
</view>
</view>
</view>
</view>
<view class="bacf radius15 mar-x20">
<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
<view class="pad-zy20 pad-s10 pad-x30">
<view class="fon28 bold col3 clips2">99皮皮节种植发际 线1000单位FUE技术...</view>
<view class="disac fon20 mar-sx20">
<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
</view>
<view>
<view class="disjbac">
<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">促销价3888</view>
<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">4205</view>
</view>
<view class="fon24 col80 mar-s20">结束时间15小时00分00秒</view>
</view>
</view>
</view>
</view>
<view style="width: 48.6%;float: right;">
<view class="bacf radius15 mar-x20">
<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
<view class="pad-zy20 pad-s10 pad-x30">
<view class="fon28 bold col3 clips2">99皮皮节种植发际 线1000单位FUE技术...</view>
<view class="disac fon20 mar-sx20">
<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
</view>
<view>
<view class="disjbac">
<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">拼团价3888</view>
<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">4205</view>
</view>
<view class="disjbac">
<view class="fon24 col80">已拼团10组</view>
<view>
<image src="" mode="" style="width: 40rpx;height: 40rpx;"></image>
</view>
</view>
</view>
</view>
</view>
<view class="bacf radius15 mar-x20">
<image src="../../../static/public/wen-one.png" mode="aspectFill" style="width: 100%;border-top-left-radius: 15rpx;border-top-right-radius: 15rpx;height: 325rpx;"></image>
<view class="pad-zy20 pad-s10 pad-x30">
<view class="fon28 bold col3 clips2">99皮皮节种植发际 线1000单位FUE技术...</view>
<view class="disac fon20 mar-sx20">
<view class="radius10 colf" style="padding: 6rpx 10rpx;margin-right: 10rpx;" :style="{background:publicColor}">秃顶种植</view>
<view class="radius10 colf" style="padding: 6rpx 10rpx;background: #F85050;">团购</view>
</view>
<view class="disac">
<view class="fon28 bold" style="color: #F85050;margin-right: 8rpx;">3888</view>
<view class="fon24" style="text-decoration: line-through;color: #C7C7C7;">4205</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
name:"shop-list",
data() {
return {
publicColor:uni.getStorageSync('publicColor'),
};
},
methods:{
goPage(){//进入商品详情事件
uni.navigateTo({
url:'/pagesB/shopDetail/shopDetail'
})
}
}
}
</script>
<style>
</style>