刘文博 / gulu-vue

Blame view

src/components/CommodityCard/CommodityCard.vue 1.79 KB
edit raw normal view history
1003c53e8   Adam   go 
1
 
  <template>
ab4209caf   喻鹏   update 
2
3
 
  	<view class="card" @tap="toGoods(goods.goods_id)">
  		<image mode="widthFix" :src="goods.img" ></image>
fb85b244c   BigBoss   user页面 
4
5
6
 
  		<view class="name">{{goods.name}}</view>
  		<view class="info">
  			<view class="priceBox">
ab4209caf   喻鹏   update 
7
8
9
 
  				<view class="price">{{goods.price}}</view>
  				<view class="originCost">
  					{{goods.originCost}}
1003c53e8   Adam   go 
10
 
  				</view>
fb85b244c   BigBoss   user页面 
11
 
  			</view>
ab4209caf   喻鹏   update 
12
 
  			<view class="slogan">{{goods.slogan}}</view>
1003c53e8   Adam   go 
13
14
15
 
  		</view>
  	</view>
  </template>
fb85b244c   BigBoss   user页面 
16
17
18
19
20
21
22
23
 
  
  <script>
  	export default {
  		props: {
  			/**
  			 * 商品数据
  			 */
  			goods: {
ab4209caf   喻鹏   update 
24
25
 
  				goods_id: Number, 
  				img: String,
fb85b244c   BigBoss   user页面 
26
 
  				name: String,
ab4209caf   喻鹏   update 
27
 
  				originCost:String,
fb85b244c   BigBoss   user页面 
28
 
  				price: String,
ab4209caf   喻鹏   update 
29
 
  				slogan:String
fb85b244c   BigBoss   user页面 
30
31
32
33
 
  			}
  			
  		},
  		created() {
ab4209caf   喻鹏   update 
34
 
  			console.log(this.goods)
1003c53e8   Adam   go 
35
36
37
38
39
 
  		},
  		data() {
  			return {
  				
  			};
fb85b244c   BigBoss   user页面 
40
41
42
 
  		},
  		methods:{
  			toGoods(id){
1003c53e8   Adam   go 
43
 
  				console.log('toGoods    =====> id======>', id)
fb85b244c   BigBoss   user页面 
44
45
46
47
48
49
50
 
  				uni.navigateTo({
  					url: `../detail/detail?oderId=1`,
  					success: res => {},
  					fail: () => {},
  					complete: () => {}
  				});
  			}
1003c53e8   Adam   go 
51
52
53
54
 
  		}
  	}
  </script>
fb85b244c   BigBoss   user页面 
55
56
57
58
59
60
61
 
  <style lang="scss">
  	image{
  		width: 100%;
  		height: 120rpx;
  	}
  	.name{
  		width: 92%;
0444517bf   范牧   商品卡片高度添加 
62
 
  		height: 54rpx;
fb85b244c   BigBoss   user页面 
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
 
  		padding: 5px 4%;
  		display: -webkit-box;
  		-webkit-box-orient: vertical;
  		-webkit-line-clamp: 2;
  		text-align: justify;
  		overflow: hidden;
  		font-size: 24rpx;
  		color: #333333;
  	}
  	.info{
  		display: flex;
  		justify-content: space-between;
  		align-items: center;
  		width: 92%;
  		padding: 5px 4% 5px 4%;
  		.priceBox{
  			display: flex;
  			justify-content: space-between;
  			align-items: center;
  			.price{
  				color: #EB5D3B;
  				font-size: 28rpx;
  				font-weight: 600;
  				margin-right: 10rpx;
  			}
  			.originCost{
  				text-decoration:line-through;
  				color: #999999;
  				font-size: 20rpx;
  			}
  			
  		}
  		.slogan{
  			color: #999999;
  			font-size: 20rpx;
  		}
1003c53e8   Adam   go 
99
100
 
  	}
  </style>