吉鹏 / gulu-vue

Blame view

src/components/CommodityCard/CommodityCard.vue 2.6 KB
edit raw normal view history
1003c53e8   Adam   go 
1
 
  <template>
c338b4909   BigBoss   完善页面跳转逻辑 
2
 
  	<view class="card" @tap="toGoods(goods.goods_id,goods.goodType)">
ab4209caf   喻鹏   update 
3
 
  		<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,
c338b4909   BigBoss   完善页面跳转逻辑 
29
30
 
  				slogan:String,
  				goodType:String,
fb85b244c   BigBoss   user页面 
31
32
33
34
 
  			}
  			
  		},
  		created() {
ab4209caf   喻鹏   update 
35
 
  			console.log(this.goods)
1003c53e8   Adam   go 
36
37
38
39
40
 
  		},
  		data() {
  			return {
  				
  			};
fb85b244c   BigBoss   user页面 
41
42
 
  		},
  		methods:{
c338b4909   BigBoss   完善页面跳转逻辑 
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
 
  			toGoods(id,type){
  				// console.log('toGoods    =====> id======>', id)
  				// console.log(type)
  				switch(type){
  					case 1:
  						uni.navigateTo({
  							url: `../frameDetail/frameDetail?oderId=`+id+`&goodType=`+type,
  							success: res => {},
  							fail: () => {},
  							complete: () => {}
  						});
  					break;
  					case 2:
  						uni.navigateTo({
  							url: `../frameDetail/frameDetail?oderId=`+id+`&goodType=`+type,
  							success: res => {},
  							fail: () => {},
  							complete: () => {}
  						});
  					break;
  					case 3:
  						uni.navigateTo({
  							url: `../frameDetail/frameDetail?oderId=`+id+`&goodType=`+type,
  							success: res => {},
  							fail: () => {},
  							complete: () => {}
  						});
  					break;
  					case 4:
  						uni.navigateTo({
  							url: `../frameDetail/frameDetail?oderId=`+id+`&goodType=`+type,
  							success: res => {},
  							fail: () => {},
  							complete: () => {}
  						});
  					break;
  					default :
  						break
  				}
fb85b244c   BigBoss   user页面 
82
 
  			}
1003c53e8   Adam   go 
83
84
85
86
 
  		}
  	}
  </script>
fb85b244c   BigBoss   user页面 
87
88
89
90
91
92
93
 
  <style lang="scss">
  	image{
  		width: 100%;
  		height: 120rpx;
  	}
  	.name{
  		width: 92%;
0444517bf   mullins   商品卡片高度添加 
94
 
  		height: 54rpx;
fb85b244c   BigBoss   user页面 
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
 
  		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 
131
132
 
  	}
  </style>