goodsDetail.vue
5.26 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
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
82
83
84
85
86
87
88
89
90
91
92
93
94
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
<template>
<div class="zj-main">
<mt-header title="商品详情页">
<router-link to="/" slot="left">
<mt-button icon="back"></mt-button>
</router-link>
</mt-header>
<div class="cyc-scroll1">
<!--轮播广告-->
<mt-swipe :auto="4000" style="height:7.5rem">
<mt-swipe-item style="background:lightskyblue">
</mt-swipe-item>
<mt-swipe-item style="background:yellow">
</mt-swipe-item>
<mt-swipe-item style="background:green">
</mt-swipe-item>
</mt-swipe>
<div class="swipe-info">
<p class="title">星期六2016秋冬新款牛皮尖头系带低跟粗跟单鞋女鞋星期六2016秋冬新款牛皮尖头系带低跟粗跟单鞋女鞋</p>
<p class="coin">99联盟币</p>
<p class="refer-money">市场参考价：¥ 1459.00</p>
<p class="freight-sale"><span class="freight">运费：¥ 1.00</span><span class="sale">销量：89</span></p>
</div>
<div class="goods-comment">
<div class="comment-num">商品评价（89）</div>
<div class="item">
<div>
<img src="../../static/images/defaultface.png" alt="" class="face"/>
<span class="name-time">
<span class="name">啊啊啊</span>
<span class="time">2016-11-09 13:55</span>
</span>
</div>
<div class="content">
鞋子收到了，真的很喜欢，下次还会光临，鞋子收到了，真 的很喜欢，下次还会光临。鞋子收到了，真的很喜欢，下次还会光临，鞋子收到了，真
的很喜欢，下次还会光临。鞋子收到了，真的很喜欢，下次还会光临，鞋子收到了，真 的很喜欢，下次还会光临。鞋子收到了，真的很喜欢，下次还会光临，鞋子收到了，真 的很喜欢，下次还会光临。
</div>
<div class="link-all">查看全部评价</div>
</div>
</div>
<ul class="common-tab">
<li class="selected">商品详情</li>
<li>商品规格</li>
<li>商品推荐</li>
</ul>
<mt-popup v-model="popupVisible" position="bottom">
</mt-popup>
<div class="goodsPopup">
<div class="box">
<div class="simple-info">
<img src="../../static/images/u35.jpg"/>
<div class="font">
<p class="coin">599联盟币</p>
<p class="store">库存：8889件</p>
</div>
</div>
<div class="select">
<p class="s-color">请选择颜色</p>
<ul class="color-list">
<li class="selected">黑色</li>
<li>黑色</li>
<li>黑色</li>
</ul>
</div>
<div class="select">
<p class="s-color">请选择尺码</p>
<ul class="color-list">
<li class="selected">36</li>
<li>37</li>
<li>38</li>
</ul>
</div>
<div class="buy-number"><span>购买数量</span>
<div class="mui-numbox">
<button type="button" class="mui-btn mui-btn-numbox-minus">-</button>
<input type="number" value="1" min="1" max="10" class="mui-input-numbox">
<button type="button" class="mui-btn mui-btn-numbox-plus">+</button>
</div>
</div>
</div>
<div class="confirm">确定</div>
</div>
<div class="goods-detail-bottom">
<div class="nav">
<div class="nav-item">
<img src="../../static/images/home.svg"/>
<p>主页</p>
</div>
<div class="nav-item">
<img src="../../static/images/colbefore.svg"/>
<p>收藏</p>
</div>
<div class="nav-item">
<img src="../../static/images/car.svg"/>
<p>购物车</p>
<span class="num">22</span>
</div>
</div>
<div class="right"><span class="to-carlist">加入购物车</span><span class="buy-now">立即购买</span></div>
</div>
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
data() {
return {}
},
components: {},
methods: {},
beforeRouteEnter(to, from, next) {
next();
},
beforeRouteLeave(to, from, next) {
next();
},
}
</script>