刘文博 / gulu-vue

Download as
Browse Code »

Commit 25c2e9dd7effcee972e8999b63a0f804a6c97f65

Authored by 喻鹏
2 parents f3bc89a33d 3a0878cc77
Exists in master

合并冲突

Showing 5 changed files   Show diff stats
src/pages/cart/cart.vue
Diff comments   View file @25c2e9d
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <block v-if="cartList.length==0"> 3 <block v-if="cartList.length==0">
4 4
5 </block> 5 </block>
6 <block v-else> 6 <block v-else>
7 <view class="card"> 7 <view class="card">
8 <view class="cardHeader"> 8 <view class="cardHeader">
9 <view v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'" 9 <view v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"
10 @tap="pChange(pIsoPen)"> 10 @tap="pChange(pIsoPen)">
11 <span class="correct"></span> 11 <span class="correct"></span>
12 </view> 12 </view>
13 <image src="../../static/store.png" mode="aspectFill"></image> 13 <image src="../../static/store.png" mode="aspectFill"></image>
14 <text>非常戴镜</text> 14 <text>非常戴镜</text>
15 </view> 15 </view>
16 16
17 <view class="cardBody" v-for="(item,index) in cartList" :key="item.cart_id" 17 <view class="cardBody" v-for="(item,index) in cartList" :key="item.cart_id"
18 @longpress="delCart(item.cart_id,index)"> 18 @longpress="delCart(item.cart_id,index)">
19 <view v-bind:class="childIsOpen[index]? 'partentChecked':'partentCheck'" 19 <view v-bind:class="childIsOpen[index]? 'partentChecked':'partentCheck'"
20 @tap="Change(childIsOpen[index],index)"> 20 @tap="Change(childIsOpen[index],index)">
21 <span class="correct"></span> 21 <span class="correct"></span>
22 </view> 22 </view>
23 <view class="imageWrap"> 23 <view class="imageWrap">
24 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image> 24 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>
25 </view> 25 </view>
26 <view class="goodInfo"> 26 <view class="goodInfo">
27 <!-- <view class="imageWrap"> 27 <!-- <view class="imageWrap">
28 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image> 28 <image :src="item.img_index_url" mode="aspectFit" style="width: 188rpx;height: 168rpx;"></image>
29 </view> --> 29 </view> -->
30 <view class="infoRight"> 30 <view class="infoRight">
31 <view class="goodName" @tap="toGoods(item.pid,item.p_root_index)">{{item.p_name}}</view> 31 <view class="goodName" @tap="toGoods(item.pid,item.p_root_index)">{{item.p_name}}</view>
32 <!-- <view class="describ"> --> 32 <!-- <view class="describ"> -->
33 <uni-collapse accordion="true" > 33 <uni-collapse accordion="true" >
34 <uni-collapse-item showAnimation='true' 34 <uni-collapse-item showAnimation='true'
35 :title="item.tag.prod_tag_fun[0].label+'/'+item.tag.prod_tag_fun[1].label+'/'+item.tag.prod_tag_fun[2].label+'...'" > 35 :title="item.tag.prod_tag_fun[0].label+'/'+item.tag.prod_tag_fun[1].label+'/'+item.tag.prod_tag_fun[2].label+'...'" >
36 <text class="describ"> 36 <text class="describ">
37 <block v-for="tag in item.tag.prod_tag_fun" :key="tag.value"> 37 <block v-for="tag in item.tag.prod_tag_fun" :key="tag.value">
38 {{tag.label+`&nbsp;&nbsp;`}} 38 {{tag.label+`&nbsp;&nbsp;`}}
39 </block> 39 </block>
40 </text> 40 </text>
41 <!-- <text> 41 <!-- <text>
42 <block v-for="tag in item.tag.prod_tag_style" :key="tag.value"> 42 <block v-for="tag in item.tag.prod_tag_style" :key="tag.value">
43 {{tag.label+`&nbsp;&nbsp;`}} 43 {{tag.label+`&nbsp;&nbsp;`}}
44 </block> 44 </block>
45 </text> --> 45 </text> -->
46 </uni-collapse-item> 46 </uni-collapse-item>
47 </uni-collapse> 47 </uni-collapse>
48 <!-- <view v-bind:class="collapseList[index]? 'icon':'iconed'"></view> --> 48 <!-- <view v-bind:class="collapseList[index]? 'icon':'iconed'"></view> -->
49 <!-- </view> --> 49 <!-- </view> -->
50 <view class="priceBox"> 50 <view class="priceBox">
51 <view class="price">￥{{item.nowPrice*item.num}}</view> 51 <view class="price">￥{{item.nowPrice*item.num}}</view>
52 <text class="maxCount">(限购{{maxCount}}副)</text> 52 <text class="maxCount">(限购{{maxCount}}副)</text>
53 <view class="counter"> 53 <view class="counter">
54 <view class="btn" disabled="this.addDisabled" type="default" 54 <view class="btn" disabled="this.addDisabled" type="default"
55 @tap="counter(index,false,item.mp_id,item.sk_id,item.num,item.cart_id)">-</view> 55 @tap="counter(index,false,item.mp_id,item.sk_id,item.num,item.cart_id)">-</view>
56 <text>{{item.num}}</text> 56 <text>{{item.num}}</text>
57 <view class="btn" disabled="this.desDisabled" type="default" 57 <view class="btn" disabled="this.desDisabled" type="default"
58 @tap="counter(index,true,item.mp_id,item.sk_id,item.num,item.cart_id)">+</view> 58 @tap="counter(index,true,item.mp_id,item.sk_id,item.num,item.cart_id)">+</view>
59 </view> 59 </view>
60 </view> 60 </view>
61 </view> 61 </view>
62 </view> 62 </view>
63 </view> 63 </view>
64 </view> 64 </view>
65 </block> 65 </block>
66 <view class="footer"> 66 <view class="footer">
67 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view> 67 <view class="footerLeft">实付金额:<text>￥{{totalPrice}}</text></view>
68 <view class="footerRight"> 68 <view class="footerRight">
69 <navigator url="/pages/confirmOrder/confirmOrder" hover-class="navigator-hover"> 69 <navigator url="/pages/confirmOrder/confirmOrder" hover-class="navigator-hover">
70 <view class="paybtn" >立即结算</view> 70 <view class="paybtn" >立即结算</view>
71 </navigator> 71 </navigator>
72 </view> 72 </view>
73 </view> 73 </view>
74 74
75 </view> 75 </view>
76 </template> 76 </template>
77 77
78 <script> 78 <script>
79 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 79 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
80 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 80 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
81 import store from '@/store' 81 import store from '@/store'
82 82
83 export default { 83 export default {
84 components: { UniCollapse, UniCollapseItem }, 84 components: { UniCollapse, UniCollapseItem },
85 data() { 85 data() {
86 return { 86 return {
87 totalPrice: 0, 87 totalPrice: 0,
88 pIsoPen: false, 88 pIsoPen: false,
89 // childIsOpen:[], 89 // childIsOpen:[],
90 maxCount: 20 90 maxCount: 20
91 } 91 }
92 }, 92 },
93 computed: { 93 computed: {
94 94
95 cartList() { 95 cartList() {
96 // console.log('cart-list', this.$store.state.cart.cartList); 96 // console.log('cart-list', this.$store.state.cart.cartList);
97 return this.$store.state.cart.cartList 97 return this.$store.state.cart.cartList
98 }, 98 },
99 childIsOpen() { 99 childIsOpen() {
100 const temp = [] 100 const temp = []
101 temp.length = this.$store.state.cart.cartList.length 101 temp.length = this.$store.state.cart.cartList.length
102 for (let i = 0; i < temp.length; i++) { 102 for (let i = 0; i < temp.length; i++) {
103 temp[i] = false 103 temp[i] = false
104 } 104 }
105 console.log('this.childisOPne===>', temp) 105 console.log('this.childisOPne===>', temp)
106 return temp 106 return temp
107 } 107 }
108 }, 108 },
109 onLoad: function() { 109 onLoad: function() {
110 // store.dispatch('cart/addCart', { 110 // store.dispatch('cart/addCart', {
111 // uid: this.$store.state.user.userInfo.uid, 111 // uid: this.$store.state.user.userInfo.uid,
112 // openid: this.$store.state.user.userInfo.openid, 112 // openid: this.$store.state.user.userInfo.openid,
113 // mp_id: 7, 113 // mp_id: 7,
114 // sk_id: 7, 114 // sk_id: 7,
115 // num: 1, 115 // num: 1,
116 // pid: 8, 116 // pid: 8,
117 // price: 128, 117 // price: 128,
118 // checkedSKU:{}, 118 // checkedSKU:{},
119 // }) 119 // })
120 store.dispatch('cart/getCartList', { 120 store.dispatch('cart/getCartList', {
121 uid: this.$store.state.user.userInfo.uid // 用户id 121 uid: this.$store.state.user.userInfo.uid // 用户id
122 }) 122 })
123
124 }, 123 },
125 124
126 methods: { 125 methods: {
127 126
128 toGoods(id, type) { 127 toGoods(id, type) {
129 uni.navigateTo({ 128 uni.navigateTo({
130 url: '../frameDetail/frameDetail?oderId=' + id, 129 url: '../frameDetail/frameDetail?oderId=' + id,
131 success: res => {}, 130 success: res => {},
132 fail: () => {}, 131 fail: () => {},
133 complete: () => {} 132 complete: () => {}
134 }) 133 })
135 console.log('toGoods =====> id:' + id + '======>type:' + type) 134 console.log('toGoods =====> id:' + id + '======>type:' + type)
136 switch (type) { 135 switch (type) {
137 case 1: 136 case 1:
138 uni.navigateTo({ 137 uni.navigateTo({
139 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type, 138 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type,
140 success: res => {}, 139 success: res => {},
141 fail: () => {}, 140 fail: () => {},
142 complete: () => {} 141 complete: () => {}
143 }) 142 })
144 break 143 break
145 case 2: 144 case 2:
146 uni.navigateTo({ 145 uni.navigateTo({
147 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type, 146 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type,
148 success: res => {}, 147 success: res => {},
149 fail: () => {}, 148 fail: () => {},
150 complete: () => {} 149 complete: () => {}
151 }) 150 })
152 break 151 break
153 case 3: 152 case 3:
154 uni.navigateTo({ 153 uni.navigateTo({
155 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type, 154 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type,
156 success: res => {}, 155 success: res => {},
157 fail: () => {}, 156 fail: () => {},
158 complete: () => {} 157 complete: () => {}
159 }) 158 })
160 break 159 break
161 case 4: 160 case 4:
162 uni.navigateTo({ 161 uni.navigateTo({
163 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type, 162 url: '../frameDetail/frameDetail?oderId=' + id + '&goodType=' + type,
164 success: res => {}, 163 success: res => {},
165 fail: () => {}, 164 fail: () => {},
166 complete: () => {} 165 complete: () => {}
167 }) 166 })
168 break 167 break
169 default : 168 default :
170 break 169 break
171 } 170 }
172 }, 171 },
173 172
174 counter(index, isadd, mp_id, sk_id, num, cart_id) { 173 counter(index, isadd, mp_id, sk_id, num, cart_id) {
175 // console.log('===>>counter ===>num',num) 174 // console.log('===>>counter ===>num',num)
176 // console.log('===>>counter ===>isadd',isadd) 175 // console.log('===>>counter ===>isadd',isadd)
177 num = parseInt(num) 176 num = parseInt(num)
178 if (isadd) { 177 if (isadd) {
179 if (num >= this.maxCount) { 178 if (num >= this.maxCount) {
180 this.addDisabled = true 179 this.addDisabled = true
181 } else { 180 } else {
182 this.addDisabled = true 181 this.addDisabled = true
183 // 修改num 182 // 修改num
184 if(this.childIsOpen[index]){ 183 if (this.childIsOpen[index]) {
185 this.totalPrice = this.totalPrice + this.$store.state.cart.cartList[index].nowPrice 184 this.totalPrice = this.totalPrice + this.$store.state.cart.cartList[index].nowPrice
186 } 185 }
187 store.dispatch('cart/modiCart', { 186 store.dispatch('cart/modiCart', {
188 uid: this.$store.state.user.userInfo.uid, 187 uid: this.$store.state.user.userInfo.uid,
189 openid: this.$store.state.user.userInfo.openid, 188 openid: this.$store.state.user.userInfo.openid,
190 mp_id: mp_id, 189 mp_id: mp_id,
191 sk_id: sk_id, 190 sk_id: sk_id,
192 cart_id: cart_id, 191 cart_id: cart_id,
193 num: num + 1, 192 num: num + 1,
194 args: { 193 args: {
195 index: index, 194 index: index,
196 isadd: isadd 195 isadd: isadd
197 } 196 }
198 }) 197 })
199 this.addDisabled = false 198 this.addDisabled = false
200 } 199 }
201 } else { 200 } else {
202 if (num <= 1) { 201 if (num <= 1) {
203 this.desDisabled = true 202 this.desDisabled = true
204 } else { 203 } else {
205 this.desDisabled = false 204 this.desDisabled = false
206 // post 请求修改相关参数 205 // post 请求修改相关参数
207 if(this.childIsOpen[index]){ 206 if (this.childIsOpen[index]) {
208 this.totalPrice = this.totalPrice - this.$store.state.cart.cartList[index].nowPrice 207 this.totalPrice = this.totalPrice - this.$store.state.cart.cartList[index].nowPrice
209 } 208 }
210 store.dispatch('cart/modiCart', { 209 store.dispatch('cart/modiCart', {
211 uid: this.$store.state.user.userInfo.uid, 210 uid: this.$store.state.user.userInfo.uid,
212 openid: this.$store.state.user.userInfo.openid, 211 openid: this.$store.state.user.userInfo.openid,
213 mp_id: mp_id, 212 mp_id: mp_id,
214 sk_id: sk_id, 213 sk_id: sk_id,
215 cart_id: cart_id, 214 cart_id: cart_id,
216 num: num - 1, 215 num: num - 1,
217 args: { 216 args: {
218 index: index, 217 index: index,
219 isadd: isadd 218 isadd: isadd
220 } 219 }
221 }) 220 })
222 this.desDisabled = true 221 this.desDisabled = true
223 } 222 }
224 } 223 }
225 // store.dispatch('cart/getCartList', { 224 // store.dispatch('cart/getCartList', {
226 // uid: this.$store.state.user.userInfo.uid // 用户id 225 // uid: this.$store.state.user.userInfo.uid // 用户id
227 // }) 226 // })
228 }, 227 },
229 228
230 Change(isopen, indexC) { 229 Change(isopen, indexC) {
231 // console.log('lalla===>',isopen) 230 // console.log('lalla===>',isopen)
232 this.childIsOpen[indexC] = !isopen 231 this.childIsOpen[indexC] = !isopen
233 if (!isopen) { 232 if (!isopen) {
234 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice) 233 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
235 } else { 234 } else {
236 this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice) 235 this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
237 } 236 }
238 let m = true 237 let m = true
239 for (let i = 0; i < this.childIsOpen.length; i++) { 238 for (let i = 0; i < this.childIsOpen.length; i++) {
240 m = m & this.childIsOpen[i] 239 m = m & this.childIsOpen[i]
241 } 240 }
242 if (m == 1) { 241 if (m == 1) {
243 this.pIsoPen = true 242 this.pIsoPen = true
244 } else { 243 } else {
245 this.pIsoPen = false 244 this.pIsoPen = false
246 } 245 }
247 }, 246 },
248 pChange(isopen) { 247 pChange(isopen) {
249 this.pIsoPen = !isopen 248 this.pIsoPen = !isopen
250 for (let i = 0; i < this.childIsOpen.length; i++) { 249 for (let i = 0; i < this.childIsOpen.length; i++) {
251 this.childIsOpen[i] = !isopen 250 this.childIsOpen[i] = !isopen
252 } 251 }
253 if (this.pIsoPen) { 252 if (this.pIsoPen) {
254 // 计算总价逻辑 253 // 计算总价逻辑
255 if (this.childIsOpen.length != 0) { 254 if (this.childIsOpen.length != 0) {
256 for (let i = 0; i < this.childIsOpen.length; i++) { 255 for (let i = 0; i < this.childIsOpen.length; i++) {
257 if (this.childIsOpen[i]) { 256 if (this.childIsOpen[i]) {
258 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[i].num * this.$store.state.cart.cartList[i].nowPrice) 257 this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[i].num * this.$store.state.cart.cartList[i].nowPrice)
259 } 258 }
260 } 259 }
261 } 260 }
262 } else { 261 } else {
263 this.totalPrice = 0 262 this.totalPrice = 0
264 } 263 }
265 }, 264 },
266 delCart(cart_id, index) { 265 delCart(cart_id, index) {
267 // console.log('userInfo',this.$store.state.user.userInfo) 266 // console.log('userInfo',this.$store.state.user.userInfo)
268 cart_id = parseInt(cart_id) 267 cart_id = parseInt(cart_id)
269 // console.log('delcart------>cart_id',cart_id) 268 // console.log('delcart------>cart_id',cart_id)
270 // console.log('cartlist====>delcart',this.$store.state.cart.cartList) 269 // console.log('cartlist====>delcart',this.$store.state.cart.cartList)
271 // console.log('delcart======>index',index) 270 // console.log('delcart======>index',index)
272 uni.showModal({ 271 uni.showModal({
273 title: '是否删除该商品', 272 title: '是否删除该商品',
274 // content: '是否删除该商品', 273 // content: '是否删除该商品',
275 success: function (res) { 274 success: function (res) {
276 if (res.confirm) { 275 if (res.confirm) {
277 // this.$store.state.cart.cartList.splice(index,1) 276 // this.$store.state.cart.cartList.splice(index,1)
278 store.dispatch('cart/delCart', { 277 store.dispatch('cart/delCart', {
279 uid: this.$store.state.user.userInfo.uid, 278 uid: this.$store.state.user.userInfo.uid,
280 openid: this.$store.state.user.userInfo.openid, 279 openid: this.$store.state.user.userInfo.openid,
281 cart_id: cart_id, // 要修改的购物车id 280 cart_id: cart_id, // 要修改的购物车id
282 arg: index // 由于action 传参是能接收两参数，因此将index放入对象 281 arg: index // 由于action 传参是能接收两参数，因此将index放入对象
283 }) 282 })
284 console.log('用户点击确定') 283 console.log('用户点击确定')
285 } 284 }
286 } 285 }
287 }) 286 })
288 } 287 }
289 } 288 }
290 } 289 }
291 </script> 290 </script>
292 291
293 <style lang="scss"> 292 <style lang="scss">
294 .content { 293 .content {
295 min-height: 100vh; 294 min-height: 100vh;
296 background-color: #f2f2f2; 295 background-color: #f2f2f2;
297 display: flex; 296 display: flex;
298 flex-direction: column; 297 flex-direction: column;
299 align-items: center; 298 align-items: center;
300 justify-content: space-between; 299 justify-content: space-between;
301 padding: 20rpx 40rpx; 300 padding: 20rpx 40rpx;
302 box-sizing: border-box; 301 box-sizing: border-box;
303 302
304 .partentCheck{ 303 .partentCheck{
305 width: 16px; 304 width: 16px;
306 height: 16px; 305 height: 16px;
307 border-radius: 22px; 306 border-radius: 22px;
308 border: 1px solid #CFCFCF; 307 border: 1px solid #CFCFCF;
309 background-color: #FFFFFF; 308 background-color: #FFFFFF;
310 margin: 6px; 309 margin: 6px;
311 } 310 }
312 .partentChecked{ 311 .partentChecked{
313 width: 18px; 312 width: 18px;
314 height: 18px; 313 height: 18px;
315 border-radius: 22px; 314 border-radius: 22px;
316 background-color: #FF6B4A; 315 background-color: #FF6B4A;
317 margin: 6px; 316 margin: 6px;
318 .correct { 317 .correct {
319 display: inline-block; 318 display: inline-block;
320 position: relative; 319 position: relative;
321 width: 10rpx; 320 width: 10rpx;
322 height: 2rpx; 321 height: 2rpx;
323 background: #FFFFFF; 322 background: #FFFFFF;
324 line-height: 0; 323 line-height: 0;
325 font-size: 0; 324 font-size: 0;
326 position: relative; 325 position: relative;
327 top: -7px; 326 top: -7px;
328 left: 4px; 327 left: 4px;
329 -webkit-transform: rotate(45deg); 328 -webkit-transform: rotate(45deg);
330 } 329 }
331 .correct:after { 330 .correct:after {
332 content: '/'; 331 content: '/';
333 display: block; 332 display: block;
334 width: 16rpx; 333 width: 16rpx;
335 height: 2rpx; 334 height: 2rpx;
336 background: #FFFFFF; 335 background: #FFFFFF;
337 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%); 336 -webkit-transform: rotate(-90deg) translateY(50%) translateX(50%);
338 } 337 }
339 } 338 }
340 339
341 .card{ 340 .card{
342 background-color: #FFFFFF; 341 background-color: #FFFFFF;
343 border-radius: 16rpx; 342 border-radius: 16rpx;
344 box-sizing: border-box; 343 box-sizing: border-box;
345 padding: 36rpx 36rpx 36rpx 18rpx; 344 padding: 36rpx 36rpx 36rpx 18rpx;
346 display: flex; 345 display: flex;
347 flex-direction: column; 346 flex-direction: column;
348 align-items: center; 347 align-items: center;
349 justify-content: space-between; 348 justify-content: space-between;
350 margin-bottom: 180rpx; 349 margin-bottom: 180rpx;
351 .cardHeader{ 350 .cardHeader{
352 width: 100%; 351 width: 100%;
353 height: 36rpx; 352 height: 36rpx;
354 display: flex; 353 display: flex;
355 align-items: center; 354 align-items: center;
356 justify-content: flex-start; 355 justify-content: flex-start;
357 margin-bottom: 20rpx; 356 margin-bottom: 20rpx;
358 image{ 357 image{
359 height: 32rpx; 358 height: 32rpx;
360 width: 32rpx; 359 width: 32rpx;
361 padding-left: 6px; 360 padding-left: 6px;
362 padding-right: 10px; 361 padding-right: 10px;
363 } 362 }
364 text{ 363 text{
365 // font-family: PingFangSC-Regular; 364 // font-family: PingFangSC-Regular;
366 font-size: 14px; 365 font-size: 14px;
367 color: #333333; 366 color: #333333;
368 letter-spacing: -0.26px; 367 letter-spacing: -0.26px;
369 } 368 }
370 } 369 }
371 .cardBody{ 370 .cardBody{
372 width: 100%; 371 width: 100%;
373 min-height: 300rpx; 372 min-height: 300rpx;
374 display: flex; 373 display: flex;
375 align-items: center; 374 align-items: center;
376 justify-content: space-between; 375 justify-content: space-between;
377 .goodInfo{ 376 .goodInfo{
378 width: 390rpx; 377 width: 390rpx;
379 display: flex; 378 display: flex;
380 flex-direction: row; 379 flex-direction: row;
381 justify-content: flex-start; 380 justify-content: flex-start;
382 padding-left: 6px; 381 padding-left: 6px;
383 382
384 .imageWrap{ 383 .imageWrap{
385 height: 188rpx; 384 height: 188rpx;
386 width: 188rpx; 385 width: 188rpx;
387 margin-right: 28rpx; 386 margin-right: 28rpx;
388 387
389 image{ 388 image{
390 border-radius: 4px; 389 border-radius: 4px;
391 height: 188rpx; 390 height: 188rpx;
392 width: 188rpx; 391 width: 188rpx;
393 } 392 }
394 } 393 }
395 .infoRight{ 394 .infoRight{
396 display: flex; 395 display: flex;
397 flex-direction: column; 396 flex-direction: column;
398 align-items: flex-start; 397 align-items: flex-start;
399 justify-content: space-between; 398 justify-content: space-between;
400 min-height: 240rpx; 399 min-height: 240rpx;
401 .goodName{ 400 .goodName{
402 display: -webkit-box; 401 display: -webkit-box;
403 -webkit-box-orient: vertical; 402 -webkit-box-orient: vertical;
404 -webkit-line-clamp: 2; 403 -webkit-line-clamp: 2;
405 text-align: justify; 404 text-align: justify;
406 overflow: hidden; 405 overflow: hidden;
407 font-size: 28rpx; 406 font-size: 28rpx;
408 color: #333333; 407 color: #333333;
409 } 408 }
410 .describ{ 409 .describ{
411 width: 100%; 410 width: 100%;
412 // min-height: 80rpx; 411 // min-height: 80rpx;
413 // box-sizing: border-box; 412 // box-sizing: border-box;
414 // padding: 10rpx; 413 // padding: 10rpx;
415 font-size: 20rpx; 414 font-size: 20rpx;
416 letter-spacing: -0.23px; 415 letter-spacing: -0.23px;
417 text-align: justify; 416 text-align: justify;
418 color: #999999; 417 color: #999999;
419 // background: #F9F9F9; 418 // background: #F9F9F9;
420 // display: flex; 419 // display: flex;
421 // justify-content: center; 420 // justify-content: center;
422 // align-items: center; 421 // align-items: center;
423 // text{ 422 // text{
424 // text-overflow: -o-ellipsis-lastline; 423 // text-overflow: -o-ellipsis-lastline;
425 // overflow: hidden; 424 // overflow: hidden;
426 // text-overflow: ellipsis; 425 // text-overflow: ellipsis;
427 // display: -webkit-box; 426 // display: -webkit-box;
428 // -webkit-line-clamp: 2; 427 // -webkit-line-clamp: 2;
429 // line-clamp: 2; 428 // line-clamp: 2;
430 // -webkit-box-orient: vertical; 429 // -webkit-box-orient: vertical;
431 // } 430 // }
432 // .icon { 431 // .icon {
433 // width: 0; 432 // width: 0;
434 // height: 0; 433 // height: 0;
435 // border-left: 5px transparent; 434 // border-left: 5px transparent;
436 // border-right: 5px transparent; 435 // border-right: 5px transparent;
437 // border-top: 5px #979797; 436 // border-top: 5px #979797;
438 // border-bottom: 0 transparent; 437 // border-bottom: 0 transparent;
439 // border-style: solid; 438 // border-style: solid;
440 // position: relative; 439 // position: relative;
441 // margin-left: 10px; 440 // margin-left: 10px;
442 // // transform: scaleY(-1); 441 // // transform: scaleY(-1);
443 // } 442 // }
444 // .icon::after{ 443 // .icon::after{
445 // content: ''; 444 // content: '';
446 // position: absolute; 445 // position: absolute;
447 // top: -6.5px; 446 // top: -6.5px;
448 // left: -5px; 447 // left: -5px;
449 // border-left: 5px transparent; 448 // border-left: 5px transparent;
450 // border-right: 5px transparent; 449 // border-right: 5px transparent;
451 // border-top: 5px #FFFFFF; 450 // border-top: 5px #FFFFFF;
452 // border-bottom: 0 transparent; 451 // border-bottom: 0 transparent;
453 // border-style: solid; 452 // border-style: solid;
454 // } 453 // }
455 } 454 }
456 .priceBox{ 455 .priceBox{
457 display: flex; 456 display: flex;
458 justify-content: space-between; 457 justify-content: space-between;
459 align-items: center; 458 align-items: center;
460 // margin-top: 26px; 459 // margin-top: 26px;
461 width: 100%; 460 width: 100%;
462 font-size: 14px; 461 font-size: 14px;
463 color: #999999; 462 color: #999999;
464 .maxCount{ 463 .maxCount{
465 color: #999999; 464 color: #999999;
466 font-size: 24rpx; 465 font-size: 24rpx;
467 } 466 }
468 .price{ 467 .price{
469 color: #FF6B4A; 468 color: #FF6B4A;
470 font-size: 28rpx; 469 font-size: 28rpx;
471 } 470 }
472 .counter{ 471 .counter{
473 display: flex; 472 display: flex;
474 flex-direction: row; 473 flex-direction: row;
475 justify-content: space-between; 474 justify-content: space-between;
476 align-items: center; 475 align-items: center;
477 font-size: 28rpx; 476 font-size: 28rpx;
478 color: #333333; 477 color: #333333;
479 width: 122rpx; 478 width: 122rpx;
480 .btn{ 479 .btn{
481 display: flex; 480 display: flex;
482 justify-content: center; 481 justify-content: center;
483 line-height: 32rpx; 482 line-height: 32rpx;
484 height: 32rpx; 483 height: 32rpx;
485 width: 32rpx; 484 width: 32rpx;
486 background-color: #F2F2F2; 485 background-color: #F2F2F2;
487 color: #CFCFCF; 486 color: #CFCFCF;
488 } 487 }
489 } 488 }
490 } 489 }
491 } 490 }
492 } 491 }
493 } 492 }
494 } 493 }
495 494
496 .footer{ 495 .footer{
497 position: fixed; 496 position: fixed;
498 left: 0; 497 left: 0;
499 bottom: 0px; 498 bottom: 0px;
500 height: 112rpx; 499 height: 112rpx;
501 width: 100%; 500 width: 100%;
502 background-color: #FFFFFF; 501 background-color: #FFFFFF;
503 font-size: 16px; 502 font-size: 16px;
504 display: flex; 503 display: flex;
505 justify-content: space-between; 504 justify-content: space-between;
506 align-items: center; 505 align-items: center;
507 .footerLeft{ 506 .footerLeft{
508 display: flex; 507 display: flex;
509 justify-content: center; 508 justify-content: center;
510 align-items: center; 509 align-items: center;
511 width: 50%; 510 width: 50%;
512 color: #333333; 511 color: #333333;
513 text{ 512 text{
514 color: #FF6B4A; 513 color: #FF6B4A;
515 } 514 }
516 } 515 }
517 .footerRight{ 516 .footerRight{
518 display: flex; 517 display: flex;
519 justify-content: flex-end; 518 justify-content: flex-end;
520 align-items: center; 519 align-items: center;
521 width: 50%; 520 width: 50%;
522 margin-right: 26rpx; 521 margin-right: 26rpx;
523 .paybtn{ 522 .paybtn{
524 display: flex; 523 display: flex;
525 justify-content: center; 524 justify-content: center;
526 align-items: center; 525 align-items: center;
527 background: #FF6B4A; 526 background: #FF6B4A;
528 border-radius: 20px; 527 border-radius: 20px;
529 border-radius: 20px; 528 border-radius: 20px;
530 color: #FFFFFF; 529 color: #FFFFFF;
531 width: 204rpx; 530 width: 204rpx;
532 height: 80rpx; 531 height: 80rpx;
533 } 532 }
534 } 533 }
535 534
536 } 535 }
537 } 536 }
538 537
539 </style> 538 </style>
540 539
src/pages/frameDetail/frameDetail.vue
Diff comments   View file @25c2e9d
1 <template> 1 <template>
2 <view class="container"> 2 <view class="container">
3 <view class="D1"> 3 <view class="D1">
4 <!-- 轮播图 --> 4 <!-- 轮播图 -->
5 <swiper 5 <swiper
6 class="swiperImage" 6 class="swiperImage"
7 :indicator-dots="true" 7 :indicator-dots="true"
8 :autoplay="true" 8 :autoplay="true"
9 :interval="4000" 9 :interval="4000"
10 :duration="500" 10 :duration="500"
11 > 11 >
12 <swiper-item 12 <swiper-item
13 v-for="(item, index) in goodInfo.pics" 13 v-for="(item, index) in goodInfo.pics"
14 :key="index" 14 :key="index"
15 > 15 >
16 <image 16 <image
17 :src="item" 17 :src="item"
18 mode="scaleToFill" 18 mode="scaleToFill"
19 ></image> 19 ></image>
20 </swiper-item> 20 </swiper-item>
21 </swiper> 21 </swiper>
22 <view class="D1_price">￥{{goodInfo.p_sale_price || '暂无'}}<span class="D1_number">{{goodInfo.trade_num || '暂无'}}人购买过</span></view> 22 <view class="D1_price">￥{{goodInfo.p_sale_price || '暂无'}}<span class="D1_number">{{goodInfo.trade_num || '暂无'}}人购买过</span></view>
23 <view class="D1_name"><span class="D1_name1">{{goodInfo.p_name || '暂无'}}</span></view> 23 <view class="D1_name"><span class="D1_name1">{{goodInfo.p_name || '暂无'}}</span></view>
24 <view class="D1_spans"><span>支持7天无理由退货</span><span>顺丰发货</span><span>30天质量保证</span></view> 24 <view class="D1_spans"><span>支持7天无理由退货</span><span>顺丰发货</span><span>30天质量保证</span></view>
25 </view> 25 </view>
26 <view 26 <view
27 class="D2" 27 class="D2"
28 v-if="updateGoodType == 2 || updateGoodType == 4" 28 v-if="updateGoodType == 2 || updateGoodType == 4"
29 > 29 >
30 <view><span class="D2_span1">框架材质：</span><span class="D2_span2">{{introduction.material}}</span></view> 30 <view><span class="D2_span1">框架材质：</span><span class="D2_span2">{{introduction.material}}</span></view>
31 <view><span class="D2_span1">风格：</span><span class="D2_span2">{{introduction.func}}</span></view> 31 <view><span class="D2_span1">风格：</span><span class="D2_span2">{{introduction.func}}</span></view>
32 <view><span class="D2_span1">适用性别：</span><span class="D2_span2">{{introduction.rate}}</span></view> 32 <view><span class="D2_span1">适用性别：</span><span class="D2_span2">{{introduction.rate}}</span></view>
33 </view> 33 </view>
34 <view 34 <view
35 class="D2" 35 class="D2"
36 v-if="updateGoodType == 1" 36 v-if="updateGoodType == 1"
37 > 37 >
38 <view><span class="D2_span1">镜片材质：</span><span class="D2_span2">{{introduction.material}}</span></view> 38 <view><span class="D2_span1">镜片材质：</span><span class="D2_span2">{{introduction.material}}</span></view>
39 <view><span class="D2_span1">功能：</span><span class="D2_span2">{{introduction.func}}</span></view> 39 <view><span class="D2_span1">功能：</span><span class="D2_span2">{{introduction.func}}</span></view>
40 <view><span class="D2_span1">使用场景：</span><span class="D2_span2">{{introduction.rate}}</span></view> 40 <view><span class="D2_span1">使用场景：</span><span class="D2_span2">{{introduction.rate}}</span></view>
41 </view> 41 </view>
42 <view 42 <view
43 class="D2" 43 class="D2"
44 v-if="updateGoodType == 3" 44 v-if="updateGoodType == 3"
45 > 45 >
46 <view><span class="D2_span1">材质：</span><span class="D2_span2">{{introduction.material}}</span></view> 46 <view><span class="D2_span1">材质：</span><span class="D2_span2">{{introduction.material}}</span></view>
47 <view><span class="D2_span1">直径/基弧：</span><span class="D2_span2">{{introduction.func}}</span></view> 47 <view><span class="D2_span1">直径/基弧：</span><span class="D2_span2">{{introduction.func}}</span></view>
48 <view><span class="D2_span1">适用性别：</span><span class="D2_span2">{{introduction.rate}}</span></view> 48 <view><span class="D2_span1">适用性别：</span><span class="D2_span2">{{introduction.rate}}</span></view>
49 </view> 49 </view>
50 <view class="D3"> 50 <view class="D3">
51 <view class="screenBar"> 51 <view class="screenBar">
52 <view 52 <view
53 v-for="item in screenItems" 53 v-for="item in screenItems"
54 :key="item.current" 54 :key="item.current"
55 @click="tabChange(item.current)" 55 @click="tabChange(item.current)"
56 > 56 >
57 <view 57 <view
58 class="screenItem" 58 class="screenItem"
59 v-bind:class="{ active: current === item.current }" 59 v-bind:class="{ active: current === item.current }"
60 >{{ item.text || '暂无' }}</view> 60 >{{ item.text || '暂无' }}</view>
61 </view> 61 </view>
62 </view> 62 </view>
63 <view 63 <view
64 class="screen-item" 64 class="screen-item"
65 v-if="current === 1" 65 v-if="current === 1"
66 > 66 >
67 <view class="D3_list"> 67 <view class="D3_list">
68 <view 68 <view
69 v-for="(item) in parameter" 69 v-for="(item) in parameter"
70 :key="item.key" 70 :key="item.key"
71 > 71 >
72 <image 72 <image
73 class="D3_image" 73 class="D3_image"
74 v-bind:src="item.img" 74 v-bind:src="item.img"
75 ></image> 75 ></image>
76 <span>{{item.standard || '暂无'}}</span> 76 <span>{{item.standard || '暂无'}}</span>
77 <span>{{item.slength || '暂无'}}</span> 77 <span>{{item.slength || '暂无'}}</span>
78 </view> 78 </view>
79 </view> 79 </view>
80 </view> 80 </view>
81 <view 81 <view
82 class="screen-item" 82 class="screen-item"
83 v-if="current === 0" 83 v-if="current === 0"
84 > 84 >
85 <view class="D3_list"> 85 <view class="D3_list">
86 <!-- <block> 86 <!-- <block>
87 <view>主体</view> 87 <view>主体</view>
88 <view>商品产地：韩国</view> 88 <view>商品产地：韩国</view>
89 <view>包装清单：彩色隐形 * 1</view> 89 <view>包装清单：彩色隐形 * 1</view>
90 </block> --> 90 </block> -->
91 <!-- 迭代时建议配合接口修改 为数组 --> 91 <!-- 迭代时建议配合接口修改 为数组 -->
92 <view v-if="tag.prod_tag_age && tag.prod_tag_age.length !== 0"> 92 <view v-if="tag.prod_tag_age && tag.prod_tag_age.length !== 0">
93 <view class=""> 93 <view class="">
94 年龄：<view 94 年龄：<view
95 v-for="(item,index) in tag.prod_tag_age" 95 v-for="(item,index) in tag.prod_tag_age"
96 :key="index" 96 :key="index"
97 > 97 >
98 {{item.label}}<text v-if="index !== tag.prod_tag_age.length - 1">/</text> 98 {{item.label}}<text v-if="index !== tag.prod_tag_age.length - 1">/</text>
99 </view> 99 </view>
100 </view> 100 </view>
101 </view> 101 </view>
102 <view v-if="tag.prod_tag_color && tag.prod_tag_color.length !== 0"> 102 <view v-if="tag.prod_tag_color && tag.prod_tag_color.length !== 0">
103 <view class=""> 103 <view class="">
104 颜色：<view 104 颜色：<view
105 v-for="(item,index) in tag.prod_tag_color" 105 v-for="(item,index) in tag.prod_tag_color"
106 :key="index" 106 :key="index"
107 > 107 >
108 {{item.label}}<text v-if="index !== tag.prod_tag_color.length - 1">/</text> 108 {{item.label}}<text v-if="index !== tag.prod_tag_color.length - 1">/</text>
109 </view> 109 </view>
110 </view> 110 </view>
111 </view> 111 </view>
112 <view v-if="tag.prod_tag_face && tag.prod_tag_face.length !== 0"> 112 <view v-if="tag.prod_tag_face && tag.prod_tag_face.length !== 0">
113 <view class=""> 113 <view class="">
114 脸型：<view 114 脸型：<view
115 v-for="(item,index) in tag.prod_tag_face" 115 v-for="(item,index) in tag.prod_tag_face"
116 :key="index" 116 :key="index"
117 > 117 >
118 {{item.label}}<text v-if="index !== tag.prod_tag_face.length - 1">/</text> 118 {{item.label}}<text v-if="index !== tag.prod_tag_face.length - 1">/</text>
119 </view> 119 </view>
120 </view> 120 </view>
121 </view> 121 </view>
122 <view v-if="tag.prod_tag_freesend && tag.prod_tag_freesend.length !== 0"> 122 <view v-if="tag.prod_tag_freesend && tag.prod_tag_freesend.length !== 0">
123 <view class=""> 123 <view class="">
124 赠品：<view 124 赠品：<view
125 v-for="(item,index) in tag.prod_tag_freesend" 125 v-for="(item,index) in tag.prod_tag_freesend"
126 :key="index" 126 :key="index"
127 > 127 >
128 {{item.label}}<text v-if="index !== tag.prod_tag_freesend.length - 1">/</text> 128 {{item.label}}<text v-if="index !== tag.prod_tag_freesend.length - 1">/</text>
129 </view> 129 </view>
130 </view> 130 </view>
131 </view> 131 </view>
132 <view v-if="tag.prod_tag_insurance && tag.prod_tag_insurance.length !== 0"> 132 <view v-if="tag.prod_tag_insurance && tag.prod_tag_insurance.length !== 0">
133 <view class=""> 133 <view class="">
134 保险：<view 134 保险：<view
135 v-for="(item,index) in tag.prod_tag_insurance" 135 v-for="(item,index) in tag.prod_tag_insurance"
136 :key="index" 136 :key="index"
137 > 137 >
138 {{item.label}}<text v-if="index !== tag.prod_tag_insurance.length - 1">/</text> 138 {{item.label}}<text v-if="index !== tag.prod_tag_insurance.length - 1">/</text>
139 </view> 139 </view>
140 </view> 140 </view>
141 </view> 141 </view>
142 <view v-if="tag.prod_tag_metal && tag.prod_tag_metal.length !== 0"> 142 <view v-if="tag.prod_tag_metal && tag.prod_tag_metal.length !== 0">
143 <view class=""> 143 <view class="">
144 材质：<view 144 材质：<view
145 v-for="(item,index) in tag.prod_tag_metal" 145 v-for="(item,index) in tag.prod_tag_metal"
146 :key="index" 146 :key="index"
147 > 147 >
148 {{item.label}}<text v-if="index !== tag.prod_tag_metal.length - 1">/</text> 148 {{item.label}}<text v-if="index !== tag.prod_tag_metal.length - 1">/</text>
149 </view> 149 </view>
150 </view> 150 </view>
151 </view> 151 </view>
152 <view v-if="tag.prod_tag_personal && tag.prod_tag_personal.length !== 0"> 152 <view v-if="tag.prod_tag_personal && tag.prod_tag_personal.length !== 0">
153 <view class=""> 153 <view class="">
154 个性：<view 154 个性：<view
155 v-for="(item,index) in tag.prod_tag_personal" 155 v-for="(item,index) in tag.prod_tag_personal"
156 :key="index" 156 :key="index"
157 > 157 >
158 {{item.label}}<text v-if="index !== tag.prod_tag_personal.length - 1">/</text> 158 {{item.label}}<text v-if="index !== tag.prod_tag_personal.length - 1">/</text>
159 </view> 159 </view>
160 </view> 160 </view>
161 </view> 161 </view>
162 <view v-if="tag.prod_tag_sense && tag.prod_tag_sense.length !== 0"> 162 <view v-if="tag.prod_tag_sense && tag.prod_tag_sense.length !== 0">
163 <view class=""> 163 <view class="">
164 场景：<view 164 场景：<view
165 v-for="(item,index) in tag.prod_tag_sense" 165 v-for="(item,index) in tag.prod_tag_sense"
166 :key="index" 166 :key="index"
167 > 167 >
168 {{item.label}}<text v-if="index !== tag.prod_tag_sense.length - 1">/</text> 168 {{item.label}}<text v-if="index !== tag.prod_tag_sense.length - 1">/</text>
169 </view> 169 </view>
170 </view> 170 </view>
171 </view> 171 </view>
172 <view v-if="tag.prod_tag_sex && tag.prod_tag_sex.length !== 0"> 172 <view v-if="tag.prod_tag_sex && tag.prod_tag_sex.length !== 0">
173 <view class=""> 173 <view class="">
174 性别：<view 174 性别：<view
175 v-for="(item,index) in tag.prod_tag_sex" 175 v-for="(item,index) in tag.prod_tag_sex"
176 :key="index" 176 :key="index"
177 > 177 >
178 {{item.label}}<text v-if="index !== tag.prod_tag_sex.length - 1">/</text> 178 {{item.label}}<text v-if="index !== tag.prod_tag_sex.length - 1">/</text>
179 </view> 179 </view>
180 </view> 180 </view>
181 </view> 181 </view>
182 <view v-if="tag.prod_tag_style && tag.prod_tag_style.length !== 0"> 182 <view v-if="tag.prod_tag_style && tag.prod_tag_style.length !== 0">
183 <view class=""> 183 <view class="">
184 风格：<view 184 风格：<view
185 v-for="(item,index) in tag.prod_tag_style" 185 v-for="(item,index) in tag.prod_tag_style"
186 :key="index" 186 :key="index"
187 > 187 >
188 {{item.label}}<text v-if="index !== tag.prod_tag_style.length - 1">/</text> 188 {{item.label}}<text v-if="index !== tag.prod_tag_style.length - 1">/</text>
189 </view> 189 </view>
190 </view> 190 </view>
191 </view> 191 </view>
192 <view v-if="tag.prod_tag_weight && tag.prod_tag_weight.length !== 0"> 192 <view v-if="tag.prod_tag_weight && tag.prod_tag_weight.length !== 0">
193 <view class=""> 193 <view class="">
194 重量：<view 194 重量：<view
195 v-for="(item,index) in tag.prod_tag_weight" 195 v-for="(item,index) in tag.prod_tag_weight"
196 :key="index" 196 :key="index"
197 > 197 >
198 {{item.label}}<text v-if="index !== tag.prod_tag_weight.length - 1">/</text> 198 {{item.label}}<text v-if="index !== tag.prod_tag_weight.length - 1">/</text>
199 </view> 199 </view>
200 </view> 200 </view>
201 </view> 201 </view>
202 </view> 202 </view>
203 </view> 203 </view>
204 <view 204 <view
205 class="screen-item " 205 class="screen-item "
206 v-if="current ===2" 206 v-if="current ===2"
207 > 207 >
208 <view class="customerService"> 208 <view class="customerService">
209 <view class="serviceItem"> 209 <view class="serviceItem">
210 <view class="title"> 210 <view class="title">
211 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view> 211 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view>
212 <text class="titleText">卖家服务</text> 212 <text class="titleText">卖家服务</text>
213 </view> 213 </view>
214 <view class="itemContent">平台卖家服务，为您在平台获得最优的购买体验</view> 214 <view class="itemContent">平台卖家服务，为您在平台获得最优的购买体验</view>
215 </view> 215 </view>
216 <view class="serviceItem"> 216 <view class="serviceItem">
217 <view class="title"> 217 <view class="title">
218 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view> 218 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view>
219 <text class="titleText">平台承诺</text> 219 <text class="titleText">平台承诺</text>
220 </view> 220 </view>
221 <view class="itemContent">平台卖家服务，为您在平台获得最优的购买体验阿斯蒂芬的发射点发射点发生的房贷首付的发护法国会国家和国际会更加和</view> 221 <view class="itemContent">平台卖家服务，为您在平台获得最优的购买体验阿斯蒂芬的发射点发射点发生的房贷首付的发护法国会国家和国际会更加和</view>
222 </view> 222 </view>
223 <view class="serviceItem"> 223 <view class="serviceItem">
224 <view class="title"> 224 <view class="title">
225 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view> 225 <view style="width: 6rpx;height: 6rpx;border-radius: 3rpx;background-color: #FF6B4A;margin-right: 12rpx;"></view>
226 <text class="titleText">正品保证</text> 226 <text class="titleText">正品保证</text>
227 </view> 227 </view>
228 <view class="itemContent">向您保证所售商品均为正品行货</view> 228 <view class="itemContent">向您保证所售商品均为正品行货</view>
229 </view> 229 </view>
230 <view class="serviceItem2"> 230 <view class="serviceItem2">
231 <view class="title"> 231 <view class="title">
232 <text class="titleText">权利申明</text> 232 <text class="titleText">权利申明</text>
233 </view> 233 </view>
234 <view class="itemContent">任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知。</view> 234 <view class="itemContent">任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知。</view>
235 </view> 235 </view>
236 <view class="serviceItem2"> 236 <view class="serviceItem2">
237 <view class="title"> 237 <view class="title">
238 <text class="titleText">价格保证</text> 238 <text class="titleText">价格保证</text>
239 </view> 239 </view>
240 <view class="itemContent"> 240 <view class="itemContent">
241 <view class="itemContent-child"> 241 <view class="itemContent-child">
242 <text class="contentTitle">平台价:</text> 242 <text class="contentTitle">平台价:</text>
243 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text> 243 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text>
244 </view> 244 </view>
245 <view class="itemContent-child"> 245 <view class="itemContent-child">
246 <text class="contentTitle">划线价:</text> 246 <text class="contentTitle">划线价:</text>
247 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text> 247 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text>
248 </view> 248 </view>
249 <view class="itemContent-child"> 249 <view class="itemContent-child">
250 <text class="contentTitle">平折扣:</text> 250 <text class="contentTitle">平折扣:</text>
251 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text> 251 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text>
252 </view> 252 </view>
253 <view class="itemContent-child"> 253 <view class="itemContent-child">
254 <text class="contentTitle">异常问题:</text> 254 <text class="contentTitle">异常问题:</text>
255 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text> 255 <text>任何个人或单位如果同时符合以下两个条件：1. 权利人发现网络用户利用网络服务侵害其合法权益；2. 百度的搜索引擎系统以自动检索方式而链接到第三方网站的内容侵犯了上述权利人的合法权益。请上述个人或单位务必以书面的通讯方式向百度提交权利通知</text>
256 </view> 256 </view>
257 257
258 </view> 258 </view>
259 </view> 259 </view>
260 </view> 260 </view>
261 </view> 261 </view>
262 </view> 262 </view>
263 <view 263 <view
264 class="D4" 264 class="D4"
265 v-if="current !==2" 265 v-if="current !==2"
266 > 266 >
267 <view class="D4_esvalue"> 267 <view class="D4_esvalue">
268 <view>{{esvalue}}&nbsp;&nbsp;{{goodInfo.judgeInfo.good}}</view> 268 <view>{{esvalue}}&nbsp;&nbsp;{{goodInfo.judgeInfo.good}}</view>
269 <view class="D4_2"> 269 <view class="D4_2">
270 <view 270 <view
271 class="star" 271 class="star"
272 v-for="o in starCount" 272 v-for="o in starCount"
273 :key="o" 273 :key="o"
274 > 274 >
275 <image 275 <image
276 src="../../static/img/detail/d_star.png" 276 src="../../static/img/detail/d_star.png"
277 mode="aspectFill" 277 mode="aspectFill"
278 style="height: 26rpx; width: 28rpx;" 278 style="height: 26rpx; width: 28rpx;"
279 ></image> 279 ></image>
280 </view> 280 </view>
281 </view> 281 </view>
282 </view> 282 </view>
283 <view class="D4_list"> 283 <view class="D4_list">
284 <view 284 <view
285 v-for="(assess) in goodInfo.judge_tag" 285 v-for="(assess) in goodInfo.judge_tag"
286 :key="assess.key" 286 :key="assess.key"
287 >{{assess.name}}</view> 287 >{{assess.name}}</view>
288 </view> 288 </view>
289 </view> 289 </view>
290 <view 290 <view
291 class="D5" 291 class="D5"
292 v-if="current !==2" 292 v-if="current !==2"
293 > 293 >
294 <view class="D5_fixed1" @click="consolg(goodInfo.prodIntro1)"> 294 <view class="D5_fixed1" @click="consolg(goodInfo.prodIntro1)">
295 <image src="/static/img/detail/hr.png"></image> 295 <image src="/static/img/detail/hr.png"></image>
296 <view>商品详细</view> 296 <view>商品详细</view>
297 <image src="/static/img/detail/hr.png"></image> 297 <image src="/static/img/detail/hr.png"></image>
298 </view> 298 </view>
299 <view class="D5_all" v-html="test"> 299 <view class="D5_all" v-html="test">
300 <!-- <block> 300 <!-- <block>
301 <rich-text :nodes="goodInfo.prodIntro1"></rich-text> 301 <rich-text :nodes="goodInfo.prodIntro1"></rich-text>
302 </block> --> 302 </block> -->
303 </view> 303 </view>
304 </view> 304 </view>
305 305
306 <!-- 底部菜单 --> 306 <!-- 底部菜单 -->
307 <view class="botton"> 307 <view class="botton">
308 <view 308 <view
309 @tap="toCart()" 309 @tap="toCart()"
310 class="botton_1" 310 class="botton_1"
311 > 311 >
312 <image v-bind:src="imgShop.img"></image> 312 <image v-bind:src="imgShop.img"></image>
313 <view class="botton_image">购物车</view> 313 <view class="botton_image">购物车</view>
314 </view> 314 </view>
315 <view class="botton_2"> 315 <view class="botton_2">
316 <view 316 <view
317 class="botton_input" 317 class="botton_input"
318 @tap="toCart()" 318 @tap="addCart()"
319 >加入购物车</view> 319 >加入购物车</view>
320 <view 320 <view
321 class="botton_now" 321 class="botton_now"
322 @tap="goPerchase()" 322 @tap="goPerchase()"
323 >立即购买</view> 323 >立即购买</view>
324 </view> 324 </view>
325 </view> 325 </view>
326 </view> 326 </view>
327 </template> 327 </template>
328 328
329 <script> 329 <script>
330 import store from '@/store' 330 import store from '@/store'
331 export default { 331 export default {
332 data () { 332 data () {
333 return { 333 return {
334 test: '', 334 test: '',
335 goodType: 2, 335 goodType: 2,
336 pid: 0, 336 pid: 0,
337 // 购物车数据
338 addCartList: {
339 mp_id: 335,
340 sk_id: 0,
341 num: 1,
342 price: ''
343 },
337 screenItems: [ 344 screenItems: [
338 { current: 0, text: '商品介绍' }, 345 { current: 0, text: '商品介绍' },
339 { current: 1, text: '规格参数' }, 346 { current: 1, text: '规格参数' },
340 { current: 2, text: '售后保障' } 347 { current: 2, text: '售后保障' }
341 ], 348 ],
342 current: 0, 349 current: 0,
343 starCount: 5, 350 starCount: 5,
344 parameter: [ 351 parameter: [
345 { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: '139mm' }, 352 { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: '139mm' },
346 { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: '51mm' }, 353 { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: '51mm' },
347 { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: '45mm' }, 354 { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: '45mm' },
348 { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: '19mm' }, 355 { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: '19mm' },
349 { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: '138mm' }, 356 { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: '138mm' },
350 { key: 5, img: '/static/img/detail/d7.png', standard: '框架重', slength: '19mm' } 357 { key: 5, img: '/static/img/detail/d7.png', standard: '框架重', slength: '19mm' }
351 ], 358 ],
352 esvalue: '宝贝好评率', 359 esvalue: '宝贝好评率',
353 introduction: { 360 introduction: {
354 material: '钛合金', 361 material: '钛合金',
355 func: '抗疲劳/防辐射', 362 func: '抗疲劳/防辐射',
356 rate: '男/女' 363 rate: '男/女'
357 }, 364 },
358 imgAll: '/static/img/detail/d8.png', 365 imgAll: '/static/img/detail/d8.png',
359 photoes: [ 366 photoes: [
360 { value: '日常办公', img: '/static/img/detail/d9.png' }, 367 { value: '日常办公', img: '/static/img/detail/d9.png' },
361 { value: '上网', img: '/static/img/detail/d10.png' }, 368 { value: '上网', img: '/static/img/detail/d10.png' },
362 { value: '追剧', img: '/static/img/detail/d11.png' }, 369 { value: '追剧', img: '/static/img/detail/d11.png' },
363 { value: '玩游戏', img: '/static/img/detail/d12.png' } 370 { value: '玩游戏', img: '/static/img/detail/d12.png' }
364 ], 371 ],
365 imgDetail: '/static/img/detail/d13.png', 372 imgDetail: '/static/img/detail/d13.png',
366 imgShop: { 373 imgShop: {
367 img: '/static/tab-cart.png', 374 img: '/static/tab-cart.png',
368 IsShown: false 375 IsShown: false
369 }, 376 },
370 tag: { 377 tag: {
371 prod_tag_freesend: [{ 378 prod_tag_freesend: [{
372 label: '眼镜盒', 379 label: '眼镜盒',
373 value: '262' 380 value: '262'
374 }] 381 }]
375 } 382 }
376 } 383 }
377 }, 384 },
378 onLoad: function ({ pid }) { 385 onLoad: function ({ pid }) {
379 this.pid = pid 386 this.pid = pid
380 store.dispatch('read/fetch', { 387 store.dispatch('read/fetch', {
381 pid 388 pid
382 }).then(() => { 389 }).then(() => {
383 this.parameter[0].slength = `${this.goodInfo.frame_width}mm` 390 this.parameter[0].slength = `${this.goodInfo.frame_width}mm`
384 this.parameter[1].slength = `${this.goodInfo.glass_width}mm` 391 this.parameter[1].slength = `${this.goodInfo.glass_width}mm`
385 this.parameter[2].slength = `${this.goodInfo.glass_height}mm` 392 this.parameter[2].slength = `${this.goodInfo.glass_height}mm`
386 this.parameter[3].slength = `${this.goodInfo.nose_width}mm` 393 this.parameter[3].slength = `${this.goodInfo.nose_width}mm`
387 this.parameter[4].slength = `${this.goodInfo.leg_long}mm` 394 this.parameter[4].slength = `${this.goodInfo.leg_long}mm`
388 this.parameter[5].slength = `${this.goodInfo.weight}mm` 395 this.parameter[5].slength = `${this.goodInfo.weight}mm`
389 this.tag = this.goodInfo.tag 396 this.tag = this.goodInfo.tag
397 this.addCartList.price = this.goodInfo.p_sale_price
390 this.test = this.goodInfo.prodIntro1 398 this.test = this.goodInfo.prodIntro1
391 this.test = this.test.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ') 399 this.test = this.test.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')
392 }) 400 })
393 }, 401 },
394 computed: { 402 computed: {
395 updateGoodType () { 403 updateGoodType () {
396 return this.goodType 404 return this.goodType
397 }, 405 },
398 goodInfo () { 406 goodInfo () {
399 console.log(this.$store.state.read.goodInfo) 407 console.log(this.$store.state.read.goodInfo)
400 return this.$store.state.read.goodInfo 408 return this.$store.state.read.goodInfo
401 } 409 }
402 }, 410 },
403 methods: { 411 methods: {
404 // 前往购物车 412 // 前往购物车
405 toCart() { 413 toCart() {
406 uni.switchTab({ 414 uni.switchTab({
407 url: '/pages/cart/cart', 415 url: '/pages/cart/cart',
408 success: res => {}, 416 success: res => {},
409 fail: (error) => { console.log('跳转购物车失败======>', error) }, 417 fail: (error) => { console.log('跳转购物车失败======>', error) },
410 complete: () => { console.log('toCart') } 418 complete: () => { console.log('toCart') }
411 }) 419 })
412 }, 420 },
421 // 加入购物车
422 addCart () {
423 store.dispatch('cart/addCart', {
424 uid: this.$store.state.user.userInfo.uid,
425 openid: this.$store.state.user.userInfo.openid,
426 mp_id: this.addCartList.mp_id,
427 sk_id: this.addCartList.sk_id,
428 num: this.addCartList.num,
429 pid: this.pid,
430 price: this.addCartList.price,
431 checkedSKU: {}
432 })
433 store.dispatch('cart/getCartList', {
434 uid: this.$store.state.user.userInfo.uid // 用户id
435 })
436 },
413 goPerchase () { 437 goPerchase () {
414 // switch (this.updateGoodType) { 438 // switch (this.updateGoodType) {
415 // case '1': 439 // case '1':
416 console.log('goPerchase') 440 console.log('goPerchase')
417 uni.navigateTo({ 441 uni.navigateTo({
418 url: `../purchaseLenses/purchaseLenses?pid=${this.pid}`, 442 url: `../purchaseLenses/purchaseLenses?pid=${this.pid}`,
419 success: res => {}, 443 success: res => {},
420 fail: (error) => { console.log('跳转参数选择失败======>', error) }, 444 fail: (error) => { console.log('跳转参数选择失败======>', error) },
421 complete: () => { console.log('goPerchase') } 445 complete: () => { console.log('goPerchase') }
422 }) 446 })
423 // break 447 // break
424 // case '2': 448 // case '2':
425 // uni.navigateTo({ 449 // uni.navigateTo({
426 // url: '../detailStandard/detailStandard_k', 450 // url: '../detailStandard/detailStandard_k',
427 // success: res => {}, 451 // success: res => {},
428 // fail: () => {}, 452 // fail: () => {},
429 // complete: () => {} 453 // complete: () => {}
430 // }) 454 // })
431 // break 455 // break
432 // case '3': 456 // case '3':
433 // uni.navigateTo({ 457 // uni.navigateTo({
434 // url: '../purchaseLenses/purchaseLenses', 458 // url: '../purchaseLenses/purchaseLenses',
435 // success: res => {}, 459 // success: res => {},
436 // fail: () => {}, 460 // fail: () => {},
437 // complete: () => {} 461 // complete: () => {}
438 // }) 462 // })
439 // break 463 // break
440 // case '4': 464 // case '4':
441 // uni.navigateTo({ 465 // uni.navigateTo({
442 // url: '../detailStandard/detailStandard_sun', 466 // url: '../detailStandard/detailStandard_sun',
443 // success: res => {}, 467 // success: res => {},
444 // fail: () => {}, 468 // fail: () => {},
445 // complete: () => {} 469 // complete: () => {}
446 // }) 470 // })
447 // break 471 // break
448 // default : 472 // default :
449 // break 473 // break
450 // } 474 // }
451 }, 475 },
476 // 加入购物车
477 addCart () {
478 store.dispatch('cart/addCart', {
479 uid: this.$store.state.user.userInfo.uid,
480 openid: this.$store.state.user.userInfo.openid,
481 pid: this.pid,
482 checkedSKU: {}
483 })
484 store.dispatch('cart/getCartList', {
485 uid: this.$store.state.user.userInfo.uid // 用户id
486 })
487 },
452 tabChange (e) { 488 tabChange (e) {
453 if (this.current !== e) { 489 if (this.current !== e) {
454 this.current = e 490 this.current = e
455 } 491 }
456 } 492 }
457 } 493 }
458 } 494 }
459 </script> 495 </script>
460 <style lang='scss'> 496 <style lang='scss'>
461 .container { 497 .container {
462 background-color: #f8f8f8; 498 background-color: #f8f8f8;
463 } 499 }
464 .D1, 500 .D1,
465 .D2, 501 .D2,
466 .D3, 502 .D3,
467 .D4, 503 .D4,
468 .D6 { 504 .D6 {
469 background: #ffffff; 505 background: #ffffff;
470 margin-bottom: 10px; 506 margin-bottom: 10px;
471 padding: 8px 20px 8px 20px; 507 padding: 8px 20px 8px 20px;
472 box-sizing: border-box; 508 box-sizing: border-box;
473 .swiperImage { 509 .swiperImage {
474 width: 684rpx; 510 width: 684rpx;
475 height: 512rpx; 511 height: 480rpx;
476 image { 512 image {
477 width: 100%; 513 max-width: 100%;
478 height: 100%; 514 max-height: 100%;
479 border-radius: 16rpx; 515 border-radius: 16rpx;
480 } 516 }
481 } 517 }
482 } 518 }
483 .D5 { 519 .D5 {
484 background: #ffffff; 520 background: #ffffff;
485 padding: 8px 20px 8px 20px; 521 padding: 8px 20px 8px 20px;
486 box-sizing: border-box; 522 box-sizing: border-box;
487 } 523 }
488 .swiperImage { 524 .swiperImage {
489 width: 100%; 525 width: 100%;
490 height: 560rpx; 526 height: 560rpx;
491 .swiper-item { 527 .swiper-item {
492 width: 100%; 528 width: 100%;
493 image { 529 image {
494 width: 100%; 530 width: 100%;
495 } 531 }
496 } 532 }
497 } 533 }
498 .D1 { 534 .D1 {
499 .D1_price { 535 .D1_price {
500 color: #eb5d3b; 536 color: #eb5d3b;
501 font-size: 18px; 537 font-size: 18px;
502 margin-top: 5px; 538 margin-top: 5px;
503 font-family: "PingFangSC-Semibold"; 539 font-family: "PingFangSC-Semibold";
504 display: flex; 540 display: flex;
505 justify-content: space-between; 541 justify-content: space-between;
506 .D1_number { 542 .D1_number {
507 color: #999999; 543 color: #999999;
508 font-size: 14px; 544 font-size: 14px;
509 font-family: "PingFangSC-Regular"; 545 font-family: "PingFangSC-Regular";
510 } 546 }
511 } 547 }
512 .D1_name { 548 .D1_name {
513 font-size: 16px; 549 font-size: 16px;
514 font-family: "PingFangSC-Semibold"; 550 font-family: "PingFangSC-Semibold";
515 margin-top: 5px; 551 margin-top: 5px;
516 .D1_name1 { 552 .D1_name1 {
517 font-weight: bold; 553 font-weight: bold;
518 font-size: 16px; 554 font-size: 16px;
519 color: #333333; 555 color: #333333;
520 } 556 }
521 } 557 }
522 .D1_spans { 558 .D1_spans {
523 font-size: 10px; 559 font-size: 10px;
524 color: #999999; 560 color: #999999;
525 margin-top: 5px; 561 margin-top: 5px;
526 span { 562 span {
527 height: 14px; 563 height: 14px;
528 margin-right: 10px; 564 margin-right: 10px;
529 } 565 }
530 } 566 }
531 } 567 }
532 .D2 { 568 .D2 {
533 font-size: 14px; 569 font-size: 14px;
534 font-family: "PingFangSC-Regular"; 570 font-family: "PingFangSC-Regular";
535 view { 571 view {
536 height: 24px; 572 height: 24px;
537 } 573 }
538 .D2_span1 { 574 .D2_span1 {
539 color: #999999; 575 color: #999999;
540 } 576 }
541 .D2_span2 { 577 .D2_span2 {
542 color: #333333; 578 color: #333333;
543 } 579 }
544 } 580 }
545 .D3 { 581 .D3 {
546 .screenBar { 582 .screenBar {
547 width: 670rpx; 583 width: 670rpx;
548 margin-top: 20rpx; 584 margin-top: 20rpx;
549 margin-bottom: 24rpx; 585 margin-bottom: 24rpx;
550 display: flex; 586 display: flex;
551 flex-direction: row; 587 flex-direction: row;
552 justify-content: space-between; 588 justify-content: space-between;
553 align-items: center; 589 align-items: center;
554 font-size: 14px; 590 font-size: 14px;
555 color: #333333; 591 color: #333333;
556 transition: all 0.2s; 592 transition: all 0.2s;
557 } 593 }
558 .screen-item { 594 .screen-item {
559 font-size: 32rpx; 595 font-size: 32rpx;
560 color: #333333; 596 color: #333333;
561 display: flex; 597 display: flex;
562 transition: all 0.2s; 598 transition: all 0.2s;
563 .D3_list { 599 .D3_list {
564 margin-bottom: 4px; 600 margin-bottom: 4px;
565 } 601 }
566 .D3_list view { 602 .D3_list view {
567 display: flex; 603 display: flex;
568 align-content: center; 604 align-content: center;
569 font-size: 14px; 605 font-size: 14px;
570 color: #333333; 606 color: #333333;
571 } 607 }
572 .D3_list image { 608 .D3_list image {
573 width: 50px; 609 width: 50px;
574 height: 25px; 610 height: 25px;
575 margin-right: 6px; 611 margin-right: 6px;
576 } 612 }
577 .D3_list span { 613 .D3_list span {
578 margin-left: 6px; 614 margin-left: 6px;
579 margin-right: 5px; 615 margin-right: 5px;
580 font-family: "PingFangSC-Regular"; 616 font-family: "PingFangSC-Regular";
581 } 617 }
582 } 618 }
583 .active { 619 .active {
584 border-bottom: 4rpx solid #ff6b4a; 620 border-bottom: 4rpx solid #ff6b4a;
585 } 621 }
586 .customerService { 622 .customerService {
587 margin-bottom: 90rpx; 623 margin-bottom: 90rpx;
588 .serviceItem { 624 .serviceItem {
589 margin-bottom: 32rpx; 625 margin-bottom: 32rpx;
590 .title { 626 .title {
591 display: flex; 627 display: flex;
592 flex-direction: row; 628 flex-direction: row;
593 align-items: center; 629 align-items: center;
594 .titleText { 630 .titleText {
595 font-size: 14px; 631 font-size: 14px;
596 color: #333333; 632 color: #333333;
597 margin-bottom: 12rpx; 633 margin-bottom: 12rpx;
598 } 634 }
599 } 635 }
600 .itemContent { 636 .itemContent {
601 font-size: 14px; 637 font-size: 14px;
602 color: #999999; 638 color: #999999;
603 margin-left: 18rpx; 639 margin-left: 18rpx;
604 } 640 }
605 } 641 }
606 .serviceItem2 { 642 .serviceItem2 {
607 margin-left: 18rpx; 643 margin-left: 18rpx;
608 margin-bottom: 32rpx; 644 margin-bottom: 32rpx;
609 .titleText { 645 .titleText {
610 font-size: 14px; 646 font-size: 14px;
611 color: #ff6b4a; 647 color: #ff6b4a;
612 } 648 }
613 .itemContent { 649 .itemContent {
614 font-size: 14px; 650 font-size: 14px;
615 color: #999999; 651 color: #999999;
616 .itemContent-child { 652 .itemContent-child {
617 margin-bottom: 40rpx; 653 margin-bottom: 40rpx;
618 .contentTitle { 654 .contentTitle {
619 border-bottom: 1px solid #ff6b4a; 655 border-bottom: 1px solid #ff6b4a;
620 } 656 }
621 } 657 }
622 } 658 }
623 } 659 }
624 } 660 }
625 } 661 }
626 .D4 { 662 .D4 {
627 .D4_esvalue { 663 .D4_esvalue {
628 font-size: 14px; 664 font-size: 14px;
629 color: #333333; 665 color: #333333;
630 display: flex; 666 display: flex;
631 justify-content: space-between; 667 justify-content: space-between;
632 margin-bottom: 10px; 668 margin-bottom: 10px;
633 .D4_2 { 669 .D4_2 {
634 width: 90px; 670 width: 90px;
635 display: flex; 671 display: flex;
636 align-items: center; 672 align-items: center;
637 justify-content: space-between; 673 justify-content: space-between;
638 } 674 }
639 } 675 }
640 .D4_esvalue view { 676 .D4_esvalue view {
641 font-size: 14px; 677 font-size: 14px;
642 color: #333333; 678 color: #333333;
643 font-weight: bold; 679 font-weight: bold;
644 } 680 }
645 .D4_list{ 681 .D4_list{
646 display: grid; 682 display: grid;
647 grid-row-gap: 10px; 683 grid-row-gap: 10px;
648 grid-column-gap: 4px; 684 grid-column-gap: 4px;
649 } 685 }
650 .D4_list view { 686 .D4_list view {
651 display: flex; 687 display: flex;
652 justify-content: center; 688 justify-content: center;
653 align-items: center; 689 align-items: center;
654 font-size: 12px; 690 font-size: 12px;
655 width: 118px; 691 width: 118px;
656 height: 24px; 692 height: 24px;
657 border-radius: 2px; 693 border-radius: 2px;
658 background: #f2f2f2; 694 background: #f2f2f2;
659 color: #666666; 695 color: #666666;
660 // letter-spacing: 1px; 696 // letter-spacing: 1px;
661 } 697 }
662 } 698 }
663 .D5 { 699 .D5 {
664 .D5_fixed1 { 700 .D5_fixed1 {
665 display: flex; 701 display: flex;
666 justify-content: space-between; 702 justify-content: space-between;
667 align-content: center; 703 align-content: center;
668 margin-bottom: 12px; 704 margin-bottom: 12px;
669 view { 705 view {
670 font-size: 14px; 706 font-size: 14px;
671 color: #333333; 707 color: #333333;
672 font-weight: bold; 708 font-weight: bold;
673 font-family: "PingFangSC-Medium"; 709 font-family: "PingFangSC-Medium";
674 line-height: 24px; 710 line-height: 24px;
675 } 711 }
676 image { 712 image {
677 width: 240rpx; 713 width: 240rpx;
678 height: 3px; 714 height: 3px;
679 margin-top: 10px; 715 margin-top: 10px;
680 } 716 }
681 } 717 }
682 .D5_all { 718 .D5_all {
683 width: 100%; 719 width: 100%;
684 margin-top: 30rpx; 720 margin-top: 30rpx;
685 margin-right: 30rpx; 721 margin-right: 30rpx;
686 margin-bottom: 180rpx; 722 margin-bottom: 180rpx;
687 font-family: "PingFangSC-Regular"; 723 font-family: "PingFangSC-Regular";
688 // border: #999999 solid 1.5px; 724 // border: #999999 solid 1.5px;
689 } 725 }
690 } 726 }
691 .D6 { 727 .D6 {
692 width: 100%; 728 width: 100%;
693 height: 430px; 729 height: 430px;
694 background: #f9f6ed; 730 background: #f9f6ed;
695 margin-bottom: 74px; 731 margin-bottom: 74px;
696 view { 732 view {
697 text-align: center; 733 text-align: center;
698 } 734 }
699 .D6_v1 { 735 .D6_v1 {
700 font-weight: bold; 736 font-weight: bold;
701 } 737 }
702 .D6_v2 { 738 .D6_v2 {
703 font-size: 14px; 739 font-size: 14px;
704 margin-bottom: 30px; 740 margin-bottom: 30px;
705 } 741 }
706 .D6_v5 { 742 .D6_v5 {
707 .D6_v5_s1 { 743 .D6_v5_s1 {
708 font-weight: bold; 744 font-weight: bold;
709 } 745 }
710 .D6_v5_s2 { 746 .D6_v5_s2 {
711 font-size: 14px; 747 font-size: 14px;
712 } 748 }
713 } 749 }
714 } 750 }
715 .botton { 751 .botton {
716 position: fixed; 752 position: fixed;
717 bottom: 0; 753 bottom: 0;
718 height: 74px; 754 height: 74px;
719 width: 100%; 755 width: 100%;
720 background: #ffffff; 756 background: #ffffff;
721 padding: 20px 20px 8px 20px; 757 padding: 20px 20px 8px 20px;
722 font-family: "PingFangSC-Regular"; 758 font-family: "PingFangSC-Regular";
723 box-sizing: border-box; 759 box-sizing: border-box;
724 display: flex; 760 display: flex;
725 justify-content: space-between; 761 justify-content: space-between;
726 align-content: center; 762 align-content: center;
727 .botton_1 { 763 .botton_1 {
728 width: 20%; 764 width: 20%;
729 height: 100%; 765 height: 100%;
730 text-align: center; 766 text-align: center;
731 color: #989898; 767 color: #989898;
732 } 768 }
733 image { 769 image {
734 width: 60%; 770 width: 60%;
735 height: 30px; 771 height: 30px;
736 } 772 }
737 .botton_image { 773 .botton_image {
738 font-size: 12px; 774 font-size: 12px;
739 text-align: center; 775 text-align: center;
740 } 776 }
741 .botton_2 { 777 .botton_2 {
742 width: 74%; 778 width: 74%;
743 height: 86%; 779 height: 86%;
744 display: grid; 780 display: grid;
745 grid-template-columns: 50% 50%; 781 grid-template-columns: 50% 50%;
746 } 782 }
747 .botton_input { 783 .botton_input {
748 display: inline-flex; 784 display: inline-flex;
749 align-items: center; 785 align-items: center;
750 justify-content: space-around; 786 justify-content: space-around;
751 background: #fff0ec; 787 background: #fff0ec;
752 font-size: 16px; 788 font-size: 16px;
753 color: #ff6b4a; 789 color: #ff6b4a;
754 border-radius: 20px 0 0 20px; 790 border-radius: 20px 0 0 20px;
755 } 791 }
756 .botton_now { 792 .botton_now {
757 display: inline-flex; 793 display: inline-flex;
758 align-items: center; 794 align-items: center;
759 justify-content: space-around; 795 justify-content: space-around;
760 background: #ff6b4a; 796 background: #ff6b4a;
761 font-size: 16px; 797 font-size: 16px;
762 color: #ffffff; 798 color: #ffffff;
763 border-radius: 0 20px 20px 0; 799 border-radius: 0 20px 20px 0;
764 } 800 }
765 } 801 }
766 </style> 802 </style>
767 803
src/pages/myOrderPaying/myOrderPaying.vue
Diff comments   View file @25c2e9d
1 <!-- 订单待付款 待收货 --> 1 <!-- 订单待付款 待收货 -->
2 <template> 2 <template>
3 <view class="content"> 3 <view class="content">
4 <!-- 待付款 --> 4 <!-- 待付款 -->
5 <view 5 <view
6 class="order-time" 6 class="order-time"
7 v-if="status == '0'" 7 v-if="status == '0'"
8 > 8 >
9 <text>请在</text> 9 <text>请在</text>
10 <uni-countdown 10 <uni-countdown
11 color="#EC5D3B" 11 color="#EC5D3B"
12 splitor-color="#EC5D3B" 12 splitor-color="#EC5D3B"
13 :show-day="false" 13 :show-day="false"
14 :hour="0" 14 :hour="0"
15 :second="getTime" 15 :second="getTime"
16 @timeup=timeup 16 @timeup=timeup
17 ></uni-countdown> 17 ></uni-countdown>
18 <text>内完成付款</text> 18 <text>内完成付款</text>
19 </view> 19 </view>
20 <!-- 待收货 --> 20 <!-- 待收货 -->
21 <view 21 <view
22 class="headerBanner" 22 class="headerBanner"
23 v-if="status == '1'" 23 v-if="status == '1'"
24 > 24 >
25 <view class="bannerLeft"> 25 <view class="bannerLeft">
26 <view class="T1">卖家已发货</view> 26 <view class="T1">卖家已发货</view>
27 <view class="T2">还剩 确认收货</view> 27 <view class="T2">还剩 确认收货</view>
28 </view> 28 </view>
29 <image 29 <image
30 src="../../static/car.png" 30 src="../../static/car.png"
31 mode="aspectFill" 31 mode="aspectFill"
32 ></image> 32 ></image>
33 </view> 33 </view>
34 <view class="order"> 34 <view class="order">
35 <view class="order-user"> 35 <view class="order-user">
36 <view class="order-user-head"> 36 <view class="order-user-head">
37 <text class="p1">{{orderAddressInfo.userName}}</text> 37 <text class="p1">{{orderAddressInfo.userName}}</text>
38 <text class="p2">{{orderAddressInfo.telNumber}}</text> 38 <text class="p2">{{orderAddressInfo.telNumber}}</text>
39 </view> 39 </view>
40 <view class="order-user-body"> 40 <view class="order-user-body">
41 <image src="../../static/myorder-paying-location.png"></image> 41 <image src="../../static/myorder-paying-location.png"></image>
42 <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text> 42 <text class="p3">{{orderAddressInfo.provinceName}} {{orderAddressInfo.cityName}} {{orderAddressInfo.countyName}}\n{{orderAddressInfo.detailInfo}}</text>
43 </view> 43 </view>
44 </view> 44 </view>
45 <view class="order-info"> 45 <view class="order-info">
46 <view 46 <view
47 class="order-info-head" 47 class="order-info-head"
48 v-for="(orderInfoListItem,index) in orderInfoList" 48 v-for="(orderInfoListItem,index) in orderInfoList"
49 :key="index" 49 :key="index"
50 > 50 >
51 <image 51 <image
52 :src="orderInfoListItem.imgUrl" 52 :src="orderInfoListItem.imgUrl"
53 mode="aspectFill" 53 mode="aspectFill"
54 ></image> 54 ></image>
55 <view class="order-info-head-r"> 55 <view class="order-info-head-r">
56 <text class="p1">{{orderInfoListItem.p_name}}</text> 56 <text class="p1">{{orderInfoListItem.p_name}}</text>
57 <view 57 <view
58 class="p2" 58 class="p2"
59 style="margin: 0;" 59 style="margin: 0;"
60 > 60 >
61 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻 61 规格：玫瑰金 / 钛合金 / 防日光防紫外线 / 超薄超轻
62 <!-- <view class="arrow"></view> --> 62 <!-- <view class="arrow"></view> -->
63 </view> 63 </view>
64 <view class="infoText-bottom"> 64 <view class="infoText-bottom">
65 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view> 65 <view class="markPrice">{{orderInfoListItem.nowPrice}}</view>
66 <view class="buy-num">X {{orderInfoListItem.num}}</view> 66 <view class="buy-num">X {{orderInfoListItem.num}}</view>
67 </view> 67 </view>
68 </view> 68 </view>
69 </view> 69 </view>
70 <!-- <view class="order-info-goodsnum"> 70 <!-- <view class="order-info-goodsnum">
71 <text>X1</text> 71 <text>X1</text>
72 </view> --> 72 </view> -->
73 <text class="order-info-freight"> 73 <text class="order-info-freight">
74 <text class="p1">运费</text> 74 <text class="p1">运费</text>
75 <text class="p2">{{orderInfo.trans_price}}</text> 75 <text class="p2">{{orderInfo.trans_price}}</text>
76 </text> 76 </text>
77 <text class="order-info-discount"> 77 <text class="order-info-discount">
78 <text class="p1">优惠</text> 78 <text class="p1">优惠</text>
79 <text class="p2">-￥{{totalDiscount}}</text> 79 <text class="p2">-￥{{totalDiscount}}</text>
80 </text> 80 </text>
81 <text class="order-info-price"> 81 <text class="order-info-price">
82 <text class="p1">实付</text> 82 <text class="p1">实付</text>
83 <text class="p2">￥{{orderInfo.order_info[0].total_fee}}</text> 83 <text class="p2">￥{{orderInfo.order_info[0].total_fee}}</text>
84 </text> 84 </text>
85 <text class="order-info-num"> 85 <text class="order-info-num">
86 <text>订单号：{{payId}}</text> 86 <text>订单号：{{payId}}</text>
87 </text> 87 </text>
88 <text class="order-info-time"> 88 <text class="order-info-time">
89 <text>下单时间：{{orderInfo.order_info[0].pay_time | timerChange}}</text> 89 <text>下单时间：{{orderInfo.order_info[0].pay_time | timerChange}}</text>
90 </text> 90 </text>
91 <view class="order-info-hr"></view> 91 <view class="order-info-hr"></view>
92 <view class="order-info-contact"> 92 <view class="order-info-contact">
93 <image src="../../static/myorder-paying-contact.png"></image> 93 <image src="../../static/myorder-paying-contact.png"></image>
94 <text>联系客服</text> 94 <text>联系客服</text>
95 </view> 95 </view>
96 </view> 96 </view>
97 </view> 97 </view>
98 <view 98 <view
99 class="order-confim" 99 class="order-confim"
100 v-if="status == '0'" 100 v-if="status == '0'"
101 > 101 >
102 <button 102 <button
103 class="b1" 103 class="b1"
104 @click="cancleOrder" 104 @click="cancleOrder"
105 >取消订单</button> 105 >取消订单</button>
106 <button 106 <button
107 class="b2" 107 class="b2"
108 @click="paylog" 108 @click="paylog"
109 >立即支付</button> 109 >立即支付</button>
110 </view> 110 </view>
111 111
112 <view 112 <view
113 class="order-confim" 113 class="order-confim"
114 v-if="status == '1'" 114 v-if="status == '1'"
115 > 115 >
116 <!-- <button class="b1">取消订单</button> --> 116 <!-- <button class="b1">取消订单</button> -->
117 <button 117 <button
118 class="b2" 118 class="b2"
119 @click="confirmOrder" 119 @click="confirmOrder"
120 >确认收货</button> 120 >确认收货</button>
121 </view> 121 </view>
122 </view> 122 </view>
123 </template> 123 </template>
124 124
125 <script> 125 <script>
126 import store from '@/store' 126 import store from '@/store'
127 import UniCountdown from '../../components/UniCountdown/UniCountdown.vue' 127 import UniCountdown from '../../components/UniCountdown/UniCountdown.vue'
128 export default { 128 export default {
129 components: { 129 components: {
130 UniCountdown 130 UniCountdown
131 }, 131 },
132 data () { 132 data () {
133 return { 133 return {
134 payId: '', 134 payId: '',
135 payTime: '', 135 payTime: '',
136 status: '', 136 status: '',
137 uid: '', 137 uid: '',
138 openid: '', 138 openid: '',
139 lefttime: 0 139 lefttime: 0
140 } 140 }
141 }, 141 },
142 onLoad: function (option) { 142 onLoad: function (option) {
143 console.log(option) 143 console.log(option)
144 this.payId = option.payId 144 this.payId = option.payId
145 this.status = option.status 145 this.status = option.status
146 const openid = uni.getStorageSync('openid') 146 const openid = uni.getStorageSync('openid')
147 const uid = this.$store.state.user.uid 147 const uid = this.$store.state.user.uid
148 this.uid = uid 148 this.uid = uid
149 this.openid = openid 149 this.openid = openid
150 store.dispatch('orderRead/getOrderInfo', { 150 store.dispatch('orderRead/getOrderInfo', {
151 pay_id: this.payId, 151 pay_id: this.payId,
152 uid: '1', 152 uid: '1',
153 openid: openid 153 openid: openid
154 }) 154 })
155 155
156 // this.orderInfo = this.$store.state.orderRead.orderInfo 156 // this.orderInfo = this.$store.state.orderRead.orderInfo
157 }, 157 },
158 computed: { 158 computed: {
159 // 获取订单详细信息 159 // 获取订单详细信息
160 orderInfo () { 160 orderInfo () {
161 console.log('orderInfo', this.$store.state.orderRead.orderInfo) 161 console.log('orderInfo', this.$store.state.orderRead.orderInfo)
162 return this.$store.state.orderRead.orderInfo || {} 162 return this.$store.state.orderRead.orderInfo || {}
163 }, 163 },
164 orderInfoList () { 164 orderInfoList () {
165 const orderInfoList = this.orderInfo.order_info[0].list 165 const orderInfoList = this.orderInfo.order_info[0].list
166 return orderInfoList 166 return orderInfoList
167 }, 167 },
168 // 获取订单地址信息 168 // 获取订单地址信息
169 orderAddressInfo () { 169 orderAddressInfo () {
170 return this.orderInfo.order_info[0].address 170 return this.orderInfo.order_info[0].address
171 }, 171 },
172 // 订单付款时间 172 // 订单付款时间
173 getTime () { 173 getTime () {
174 return this.orderInfo.order_info[0].lefttime 174 return this.orderInfo.order_info[0].lefttime
175 }, 175 },
176 // 计算总优惠额 176 // 计算总优惠额
177 totalDiscount () { 177 totalDiscount () {
178 const discountInfoList = this.orderInfo.discount_info 178 const discountInfoList = this.orderInfo.discount_info
179 let totalDiscount = 0 179 let totalDiscount = 0
180 if (discountInfoList) { 180 if (discountInfoList) {
181 discountInfoList.map((discountItem, index) => { 181 discountInfoList.map((discountItem, index) => {
182 totalDiscount += Number(discountItem.value) 182 totalDiscount += Number(discountItem.value)
183 }) 183 })
184 } 184 }
185 // console.log(totalDiscount) 185 // console.log(totalDiscount)
186 return totalDiscount 186 return totalDiscount
187 } 187 }
188 }, 188 },
189 methods: { 189 methods: {
190 // 取消订单 190 // 取消订单
191 timeup () { 191 timeup () {
192 this.cancleOrder() 192 this.cancleOrder()
193 }, 193 },
194 cancleOrder () { 194 cancleOrder () {
195 const uid = this.uid 195 const uid = this.uid
196 const openid = this.openid 196 const openid = this.openid
197 uni.showModal({ 197 uni.showModal({
198 title: '提示', 198 title: '提示',
199 content: '现在取消，订单不可恢复哦，确认取消吗？', 199 content: '现在取消，订单不可恢复哦，确认取消吗？',
200 success: function (res) { 200 success: function (res) {
201 if (res.confirm) { 201 if (res.confirm) {
202 store.dispatch('cancelOrder/cancel', { 202 store.dispatch('cancelOrder/cancel', {
203 keyname: '1', 203 keyname: '1',
204 uid: uid, 204 uid: uid,
205 openid: openid 205 openid: openid
206 }) 206 })
207 } else if (res.cancel) { 207 } else if (res.cancel) {
208 console.log('用户点击取消') 208 console.log('用户点击取消')
209 } 209 }
210 } 210 }
211 }) 211 })
212 }, 212 },
213 paylog () { 213 paylog () {
214 214
215 }, 215 },
216 confirmOrder () { 216 confirmOrder () {
217 store.dispatch('statusConfirm/confirm', { 217 store.dispatch('statusConfirm/confirm', {
218 uid: this.uid, 218 uid: this.uid,
219 openid: this.openid, 219 openid: this.openid,
220 oldway: '1', 220 oldway: '1',
221 way: '2', 221 way: '2',
222 pay_id: this.payId, 222 pay_id: this.payId,
223 judgeContent: '', 223 judgeContent: '',
224 orderInfo: this.orderInfo.order_info 224 orderInfo: this.orderInfo.order_info
225 }).then( 225 }).then(
226 setTimeout(() => { 226 setTimeout(() => {
227 uni.navigateBack() 227 uni.navigateBack()
228 }, 1500) 228 }, 1500)
229 ) 229 )
230 } 230 }
231 }, 231 },
232 filters: { 232 filters: {
233 timerChange: function(value) { 233 timerChange: function(value) {
234 var newDate = new Date() 234 var newDate = new Date()
235 newDate.setTime(value * 1000) 235 newDate.setTime(value * 1000)
236 console.log(newDate.toLocaleString())
237 return newDate.toLocaleString() 236 return newDate.toLocaleString()
238 } 237 }
239 } 238 }
240 } 239 }
241 </script> 240 </script>
242 241
243 <style lang="scss" scoped> 242 <style lang="scss" scoped>
244 .content { 243 .content {
245 min-height: 100vh; 244 min-height: 100vh;
246 display: flex; 245 display: flex;
247 flex-direction: column; 246 flex-direction: column;
248 justify-content: flex-start; 247 justify-content: flex-start;
249 align-items: center; 248 align-items: center;
250 background-color: #f2f2f2; 249 background-color: #f2f2f2;
251 } 250 }
252 251
253 .order { 252 .order {
254 margin-bottom: 112rpx; 253 margin-bottom: 112rpx;
255 background: #f2f2f2; 254 background: #f2f2f2;
256 margin-top: 140rpx; 255 margin-top: 140rpx;
257 width: 670rpx; 256 width: 670rpx;
258 } 257 }
259 258
260 .order-time { 259 .order-time {
261 width: 100%; 260 width: 100%;
262 height: 140rpx; 261 height: 140rpx;
263 background-color: #fff; 262 background-color: #fff;
264 display: flex; 263 display: flex;
265 justify-content: center; 264 justify-content: center;
266 align-items: center; 265 align-items: center;
267 position: fixed; 266 position: fixed;
268 top: 0; 267 top: 0;
269 left: 0; 268 left: 0;
270 text { 269 text {
271 // font-family: PingFangSC-Regular; 270 // font-family: PingFangSC-Regular;
272 // margin-top: 48rpx; 271 // margin-top: 48rpx;
273 font-size: 14px; 272 font-size: 14px;
274 color: #333333; 273 color: #333333;
275 letter-spacing: -0.26px; 274 letter-spacing: -0.26px;
276 } 275 }
277 .p2 { 276 .p2 {
278 // font-family: DINAlternate-Bold; 277 // font-family: DINAlternate-Bold;
279 margin: 42rpx 20rpx 0 20rpx; 278 margin: 42rpx 20rpx 0 20rpx;
280 font-size: 18px; 279 font-size: 18px;
281 color: #ec5d3b; 280 color: #ec5d3b;
282 letter-spacing: -0.34px; 281 letter-spacing: -0.34px;
283 } 282 }
284 } 283 }
285 .headerBanner { 284 .headerBanner {
286 width: 100%; 285 width: 100%;
287 height: 140rpx; 286 height: 140rpx;
288 background: #4a90e2; 287 background: #4a90e2;
289 padding: 26rpx 60rpx 24rpx 60rpx; 288 padding: 26rpx 60rpx 24rpx 60rpx;
290 box-sizing: border-box; 289 box-sizing: border-box;
291 color: #ffffff; 290 color: #ffffff;
292 display: flex; 291 display: flex;
293 justify-content: space-between; 292 justify-content: space-between;
294 align-items: center; 293 align-items: center;
295 position: fixed; 294 position: fixed;
296 top: 0; 295 top: 0;
297 left: 0; 296 left: 0;
298 .bannerLeft { 297 .bannerLeft {
299 font-size: 36rpx; 298 font-size: 36rpx;
300 display: flex; 299 display: flex;
301 flex-direction: column; 300 flex-direction: column;
302 justify-content: center; 301 justify-content: center;
303 align-items: center; 302 align-items: center;
304 .T2 { 303 .T2 {
305 font-size: 24rpx; 304 font-size: 24rpx;
306 } 305 }
307 } 306 }
308 image { 307 image {
309 height: 56rpx; 308 height: 56rpx;
310 width: 72rpx; 309 width: 72rpx;
311 } 310 }
312 } 311 }
313 312
314 .order-user { 313 .order-user {
315 height: 228rpx; 314 height: 228rpx;
316 background: #ffffff; 315 background: #ffffff;
317 border-radius: 14rpx; 316 border-radius: 14rpx;
318 margin: 0 auto; 317 margin: 0 auto;
319 margin-top: 20rpx; 318 margin-top: 20rpx;
320 margin-bottom: 20rpx; 319 margin-bottom: 20rpx;
321 .order-user-head { 320 .order-user-head {
322 display: flex; 321 display: flex;
323 height: 108rpx; 322 height: 108rpx;
324 align-items: center; 323 align-items: center;
325 margin-left: 126rpx; 324 margin-left: 126rpx;
326 .p1 { 325 .p1 {
327 // font-family: PingFangSC-Regular; 326 // font-family: PingFangSC-Regular;
328 font-size: 14px; 327 font-size: 14px;
329 color: #333333; 328 color: #333333;
330 letter-spacing: -0.26px; 329 letter-spacing: -0.26px;
331 margin-right: 20rpx; 330 margin-right: 20rpx;
332 } 331 }
333 .p2 { 332 .p2 {
334 // font-family: PingFangSC-Regular; 333 // font-family: PingFangSC-Regular;
335 font-size: 14px; 334 font-size: 14px;
336 color: #999999; 335 color: #999999;
337 letter-spacing: -0.26px; 336 letter-spacing: -0.26px;
338 } 337 }
339 } 338 }
340 .order-user-body { 339 .order-user-body {
341 display: flex; 340 display: flex;
342 width: 100%; 341 width: 100%;
343 image { 342 image {
344 width: 24px; 343 width: 24px;
345 height: 26px; 344 height: 26px;
346 margin: 12rpx 32rpx 0 40rpx; 345 margin: 12rpx 32rpx 0 40rpx;
347 } 346 }
348 .p3 { 347 .p3 {
349 // font-family: PingFangSC-Semibold; 348 // font-family: PingFangSC-Semibold;
350 font-size: 14px; 349 font-size: 14px;
351 color: #333333; 350 color: #333333;
352 letter-spacing: -0.26px; 351 letter-spacing: -0.26px;
353 } 352 }
354 } 353 }
355 } 354 }
356 355
357 .order-info { 356 .order-info {
358 background-color: #fff; 357 background-color: #fff;
359 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06); 358 box-shadow: 0 0 20rpx 0 rgba(177, 128, 128, 0.06);
360 border-radius: 16rpx; 359 border-radius: 16rpx;
361 margin: 0 auto; 360 margin: 0 auto;
362 view { 361 view {
363 margin-left: 40rpx; 362 margin-left: 40rpx;
364 } 363 }
365 text { 364 text {
366 font-size: 14px; 365 font-size: 14px;
367 } 366 }
368 .order-info-head { 367 .order-info-head {
369 display: flex; 368 display: flex;
370 padding-top: 40rpx; 369 padding-top: 40rpx;
371 image { 370 image {
372 height: 188rpx; 371 height: 188rpx;
373 width: 188rpx; 372 width: 188rpx;
374 } 373 }
375 .order-info-head-r { 374 .order-info-head-r {
376 margin: 0; 375 margin: 0;
377 width: 368rpx; 376 width: 368rpx;
378 margin-left: 24rpx; 377 margin-left: 24rpx;
379 // margin-top: 40rpx; 378 // margin-top: 40rpx;
380 text { 379 text {
381 display: block; 380 display: block;
382 } 381 }
383 // .arrow{ 382 // .arrow{
384 // width: 0; 383 // width: 0;
385 // height: 0; 384 // height: 0;
386 // border-left: 5px transparent; 385 // border-left: 5px transparent;
387 // border-right: 5px transparent; 386 // border-right: 5px transparent;
388 // border-top: 5px #979797; 387 // border-top: 5px #979797;
389 // border-bottom: 0 transparent; 388 // border-bottom: 0 transparent;
390 // border-style: solid; 389 // border-style: solid;
391 // position: relative; 390 // position: relative;
392 // // transform: scaleY(-1); 391 // // transform: scaleY(-1);
393 // } 392 // }
394 // .arrow::after{ 393 // .arrow::after{
395 // content: ''; 394 // content: '';
396 // position: absolute; 395 // position: absolute;
397 // top: -6.5px; 396 // top: -6.5px;
398 // left: -5px; 397 // left: -5px;
399 // border-left: 5px transparent; 398 // border-left: 5px transparent;
400 // border-right: 5px transparent; 399 // border-right: 5px transparent;
401 // border-top: 5px #FFFFFF; 400 // border-top: 5px #FFFFFF;
402 // border-bottom: 0 transparent; 401 // border-bottom: 0 transparent;
403 // border-style: solid; 402 // border-style: solid;
404 // } 403 // }
405 .p1 { 404 .p1 {
406 min-height: 40px; 405 min-height: 40px;
407 // font-family: PingFangSC-Regular; 406 // font-family: PingFangSC-Regular;
408 font-size: 14px; 407 font-size: 14px;
409 color: #333333; 408 color: #333333;
410 letter-spacing: -0.26px; 409 letter-spacing: -0.26px;
411 line-height: 18px; 410 line-height: 18px;
412 // line-height: 20px; 411 // line-height: 20px;
413 } 412 }
414 .p2 { 413 .p2 {
415 height: 34px; 414 height: 34px;
416 padding: 1px 0 3px 0; 415 padding: 1px 0 3px 0;
417 // font-family: PingFangSC-Regular; 416 // font-family: PingFangSC-Regular;
418 font-size: 12px; 417 font-size: 12px;
419 color: #999999; 418 color: #999999;
420 letter-spacing: -0.23px; 419 letter-spacing: -0.23px;
421 } 420 }
422 .infoText-bottom { 421 .infoText-bottom {
423 display: flex; 422 display: flex;
424 flex-direction: row; 423 flex-direction: row;
425 justify-content: flex-start; 424 justify-content: flex-start;
426 align-items: center; 425 align-items: center;
427 width: 100%; 426 width: 100%;
428 margin-left: 0; 427 margin-left: 0;
429 .markPrice { 428 .markPrice {
430 font-size: 14px; 429 font-size: 14px;
431 color: #ff6b4a; 430 color: #ff6b4a;
432 margin-right: 20rpx; 431 margin-right: 20rpx;
433 margin-left: 0rpx; 432 margin-left: 0rpx;
434 } 433 }
435 .buy-num { 434 .buy-num {
436 font-size: 12px; 435 font-size: 12px;
437 color: #999999; 436 color: #999999;
438 } 437 }
439 } 438 }
440 } 439 }
441 } 440 }
442 // .order-info-goodsnum { 441 // .order-info-goodsnum {
443 // display: flex; 442 // display: flex;
444 // align-items: center; 443 // align-items: center;
445 // justify-content: flex-end; 444 // justify-content: flex-end;
446 // text { 445 // text {
447 // margin-right: 44rpx; 446 // margin-right: 44rpx;
448 // // ont-family: PingFangSC-Regular; 447 // // ont-family: PingFangSC-Regular;
449 // font-size: 12px; 448 // font-size: 12px;
450 // color: #999999; 449 // color: #999999;
451 // letter-spacing: -0.23px; 450 // letter-spacing: -0.23px;
452 // } 451 // }
453 // } 452 // }
454 .order-info-freight { 453 .order-info-freight {
455 display: block; 454 display: block;
456 margin-left: 40rpx; 455 margin-left: 40rpx;
457 margin-top: 22rpx; 456 margin-top: 22rpx;
458 .p1 { 457 .p1 {
459 // font-family: PingFangSC-Regular; 458 // font-family: PingFangSC-Regular;
460 font-size: 14px; 459 font-size: 14px;
461 color: #333333; 460 color: #333333;
462 letter-spacing: -0.26px; 461 letter-spacing: -0.26px;
463 line-height: 18px; 462 line-height: 18px;
464 margin-right: 24px; 463 margin-right: 24px;
465 } 464 }
466 .p2 { 465 .p2 {
467 // font-family: PingFangSC-Regular; 466 // font-family: PingFangSC-Regular;
468 font-size: 14px; 467 font-size: 14px;
469 color: #ff6b4a; 468 color: #ff6b4a;
470 letter-spacing: -0.26px; 469 letter-spacing: -0.26px;
471 } 470 }
472 } 471 }
473 .order-info-discount { 472 .order-info-discount {
474 display: block; 473 display: block;
475 margin-left: 40rpx; 474 margin-left: 40rpx;
476 margin-top: 24rpx; 475 margin-top: 24rpx;
477 .p1 { 476 .p1 {
478 // font-family: PingFangSC-Regular; 477 // font-family: PingFangSC-Regular;
479 font-size: 14px; 478 font-size: 14px;
480 color: #333333; 479 color: #333333;
481 letter-spacing: -0.26px; 480 letter-spacing: -0.26px;
482 line-height: 18px; 481 line-height: 18px;
483 margin-right: 24px; 482 margin-right: 24px;
484 } 483 }
485 .p2 { 484 .p2 {
486 // font-family: PingFangSC-Regular; 485 // font-family: PingFangSC-Regular;
487 font-size: 14px; 486 font-size: 14px;
488 color: #ff6b4a; 487 color: #ff6b4a;
489 letter-spacing: -0.26px; 488 letter-spacing: -0.26px;
490 } 489 }
491 } 490 }
492 .order-info-price { 491 .order-info-price {
493 display: block; 492 display: block;
494 margin-left: 40rpx; 493 margin-left: 40rpx;
495 margin-top: 24rpx; 494 margin-top: 24rpx;
496 .p1 { 495 .p1 {
497 // font-family: PingFangSC-Semibold; 496 // font-family: PingFangSC-Semibold;
498 font-size: 14px; 497 font-size: 14px;
499 color: #333333; 498 color: #333333;
500 letter-spacing: -0.26px; 499 letter-spacing: -0.26px;
501 line-height: 18px; 500 line-height: 18px;
502 margin-right: 24px; 501 margin-right: 24px;
503 } 502 }
504 .p2 { 503 .p2 {
505 // font-family: PingFangSC-Semibold; 504 // font-family: PingFangSC-Semibold;
506 font-size: 14px; 505 font-size: 14px;
507 color: #ff6b4a; 506 color: #ff6b4a;
508 letter-spacing: -0.26px; 507 letter-spacing: -0.26px;
509 } 508 }
510 } 509 }
511 .order-info-num { 510 .order-info-num {
512 display: block; 511 display: block;
513 margin-left: 40rpx; 512 margin-left: 40rpx;
514 margin-top: 44rpx; 513 margin-top: 44rpx;
515 text { 514 text {
516 // font-family: PingFangSC-Regular; 515 // font-family: PingFangSC-Regular;
517 font-size: 12px; 516 font-size: 12px;
518 color: #999999; 517 color: #999999;
519 letter-spacing: -0.23px; 518 letter-spacing: -0.23px;
520 } 519 }
521 } 520 }
522 .order-info-time { 521 .order-info-time {
523 display: block; 522 display: block;
524 margin: 8rpx 0 48rpx 40rpx; 523 margin: 8rpx 0 48rpx 40rpx;
525 text { 524 text {
526 // font-family: PingFangSC-Regular; 525 // font-family: PingFangSC-Regular;
527 font-size: 12px; 526 font-size: 12px;
528 color: #999999; 527 color: #999999;
529 letter-spacing: -0.23px; 528 letter-spacing: -0.23px;
530 } 529 }
531 } 530 }
532 .order-info-hr { 531 .order-info-hr {
533 width: 520rpx; 532 width: 520rpx;
534 height: 1px; 533 height: 1px;
535 background-color: #e9e9e9; 534 background-color: #e9e9e9;
536 margin-bottom: 20rpx; 535 margin-bottom: 20rpx;
537 } 536 }
538 .order-info-contact { 537 .order-info-contact {
539 display: flex; 538 display: flex;
540 padding-bottom: 28rpx; 539 padding-bottom: 28rpx;
541 image { 540 image {
542 width: 19px; 541 width: 19px;
543 height: 16px; 542 height: 16px;
544 } 543 }
545 text { 544 text {
546 // font-family: PingFangSC-Regular; 545 // font-family: PingFangSC-Regular;
547 margin-left: 20rpx; 546 margin-left: 20rpx;
548 font-size: 14px; 547 font-size: 14px;
549 color: #333333; 548 color: #333333;
550 letter-spacing: -0.26px; 549 letter-spacing: -0.26px;
551 line-height: 18px; 550 line-height: 18px;
552 } 551 }
553 } 552 }
554 } 553 }
555 554
556 .order-confim { 555 .order-confim {
557 display: flex; 556 display: flex;
558 align-items: center; 557 align-items: center;
559 justify-content: flex-end; 558 justify-content: flex-end;
560 // z-index: 999; 559 // z-index: 999;
561 width: 100%; 560 width: 100%;
562 height: 112rpx; 561 height: 112rpx;
563 position: fixed; 562 position: fixed;
564 bottom: 0; 563 bottom: 0;
565 background: #ffffff; 564 background: #ffffff;
566 button { 565 button {
567 width: 204rpx; 566 width: 204rpx;
568 height: 80rpx; 567 height: 80rpx;
569 border: 1px solid #ff6b4a; 568 border: 1px solid #ff6b4a;
570 border-radius: 40rpx; 569 border-radius: 40rpx;
571 font-size: 32rpx; 570 font-size: 32rpx;
572 letter-spacing: -0.3px; 571 letter-spacing: -0.3px;
573 margin-right: 0; 572 margin-right: 0;
574 } 573 }
575 .b1 { 574 .b1 {
576 // font-family: PingFangSC-Regular; 575 // font-family: PingFangSC-Regular;
577 color: #ff6b4a; 576 color: #ff6b4a;
578 background-color: #ffffff; 577 background-color: #ffffff;
579 } 578 }
580 .b2 { 579 .b2 {
581 // font-family: PingFangSC-Regular; 580 // font-family: PingFangSC-Regular;
582 background-color: #ff6b4a; 581 background-color: #ff6b4a;
583 color: #ffffff; 582 color: #ffffff;
584 margin: 0 26rpx 0 20rpx; 583 margin: 0 26rpx 0 20rpx;
585 } 584 }
586 } 585 }
587 </style> 586 </style>
588 587
src/pages/purchaseLenses/purchaseLenses.vue
Diff comments   View file @25c2e9d
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="goodInfo"> 3 <view class="goodInfo">
4 <view class="imageWrap"> 4 <view class="imageWrap">
5 <image 5 <image
6 src="../../static/img/detail/d1.png" 6 src="../../static/img/detail/d1.png"
7 mode="aspectFill" 7 mode="aspectFill"
8 style="width: 188rpx;height: 168rpx;" 8 style="width: 188rpx;height: 168rpx;"
9 ></image> 9 ></image>
10 </view> 10 </view>
11 <view class="infoRight"> 11 <view class="infoRight">
12 <text class="goodName">商品名称商品名称商品名称名称名称商品名称名商品名称名</text> 12 <text class="goodName">商品名称商品名称商品名称名称名称商品名称名商品名称名</text>
13 <text class="remarks">支持7天无理由退货 顺丰发货</text> 13 <text class="remarks">支持7天无理由退货 顺丰发货</text>
14 <view class="priceBox"> 14 <view class="priceBox">
15 <view class="price">￥198</view> 15 <view class="price">￥198</view>
16 <text>(限购{{maxCount}}副)</text> 16 <text>(限购{{maxCount}}副)</text>
17 <view class="counter"> 17 <view class="counter">
18 <view 18 <view
19 class="btn" 19 class="btn"
20 disabled="this.addDisabled" 20 disabled="this.addDisabled"
21 type="default" 21 type="default"
22 @click="counter(false)" 22 @click="counter(false)"
23 >-</view> 23 >-</view>
24 <text>{{count}}</text> 24 <text>{{count}}</text>
25 <view 25 <view
26 class="btn" 26 class="btn"
27 disabled="this.desDisabled" 27 disabled="this.desDisabled"
28 type="default" 28 type="default"
29 @click="counter(true)" 29 @click="counter(true)"
30 >+</view> 30 >+</view>
31 </view> 31 </view>
32 </view> 32 </view>
33 </view> 33 </view>
34 </view> 34 </view>
35 <view class="goods-data"> 35 <view class="goods-data">
36 <view class="opCollapse"> 36 <view class="opCollapse">
37 <view class="body"> 37 <view class="body">
38 <template v-if="opIsOpen"> 38 <template v-if="opIsOpen">
39 <view class="goods-form"> 39 <view class="goods-form">
40 <view class="p1"> 40 <view class="p1">
41 <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image> 41 <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
42 填写验光数据 42 填写验光数据
43 </view> 43 </view>
44 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text> 44 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
45 <view class="picker"> 45 <view class="picker">
46 <view class="picker-choice"> 46 <view class="picker-choice">
47 <view class="choice-left"> 47 <view class="choice-left">
48 <text class="pd">验光单取名:</text> 48 <text class="pd">验光单取名:</text>
49 </view> 49 </view>
50 <input type="text" @blur="handleInput" class="input" 50 <input type="text" @blur="handleInput" class="input"
51 placeholder="请输入名称" maxlength="20" :value="name" /> 51 placeholder="请输入名称" maxlength="20" :value="name" />
52 </view> 52 </view>
53 </view> 53 </view>
54 <view class="picker" > 54 <view class="picker" >
55 <view class="picker-choice"> 55 <view class="picker-choice">
56 <view class="choice-left"> 56 <view class="choice-left">
57 <text class="p11">{{pickerInfoList[0].nameC}}</text> 57 <text class="p11">{{pickerInfoList[0].nameC}}</text>
58 <text class="p12">{{pickerInfoList[0].nameE}}</text> 58 <text class="p12">{{pickerInfoList[0].nameE}}</text>
59 </view> 59 </view>
60 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 60 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
61 <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> --> 61 <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
62 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1"> 62 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
63 <view class="p14"> 63 <view class="p14">
64 {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}} 64 {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
65 <image src="../../static/detail-tabicon.png" ></image> 65 <image src="../../static/detail-tabicon.png" ></image>
66 </view> 66 </view>
67 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 67 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
68 </picker> 68 </picker>
69 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 69 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
70 <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> --> 70 <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
71 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2"> 71 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
72 <view class="p14"> 72 <view class="p14">
73 {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}} 73 {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
74 <image src="../../static/detail-tabicon.png" ></image> 74 <image src="../../static/detail-tabicon.png" ></image>
75 </view> 75 </view>
76 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 76 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
77 </picker> 77 </picker>
78 </view> 78 </view>
79 </view> 79 </view>
80 <view class="picker" > 80 <view class="picker" >
81 <view class="picker-choice"> 81 <view class="picker-choice">
82 <view class="choice-left"> 82 <view class="choice-left">
83 <text class="p11">{{pickerInfoList[1].nameC}}</text> 83 <text class="p11">{{pickerInfoList[1].nameC}}</text>
84 <text class="p12">{{pickerInfoList[1].nameE}}</text> 84 <text class="p12">{{pickerInfoList[1].nameE}}</text>
85 </view> 85 </view>
86 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 86 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
87 <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> --> 87 <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
88 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1"> 88 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
89 <view class="p14"> 89 <view class="p14">
90 {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}} 90 {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
91 <image src="../../static/detail-tabicon.png" ></image> 91 <image src="../../static/detail-tabicon.png" ></image>
92 </view> 92 </view>
93 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 93 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
94 </picker> 94 </picker>
95 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 95 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
96 <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> --> 96 <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
97 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2"> 97 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
98 <view class="p14"> 98 <view class="p14">
99 {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}} 99 {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
100 <image src="../../static/detail-tabicon.png" ></image> 100 <image src="../../static/detail-tabicon.png" ></image>
101 </view> 101 </view>
102 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 102 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
103 </picker> 103 </picker>
104 </view> 104 </view>
105 </view> 105 </view>
106 <view class="picker" > 106 <view class="picker" >
107 <view class="picker-choice"> 107 <view class="picker-choice">
108 <view class="choice-left"> 108 <view class="choice-left">
109 <text class="p11">{{pickerInfoList[2].nameC}}</text> 109 <text class="p11">{{pickerInfoList[2].nameC}}</text>
110 <text class="p12">{{pickerInfoList[2].nameE}}</text> 110 <text class="p12">{{pickerInfoList[2].nameE}}</text>
111 </view> 111 </view>
112 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 112 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
113 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1"> 113 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
114 <view class="p14"> 114 <view class="p14">
115 {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}} 115 {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
116 <image src="../../static/detail-tabicon.png" ></image> 116 <image src="../../static/detail-tabicon.png" ></image>
117 </view> 117 </view>
118 </picker> 118 </picker>
119 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 119 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
120 <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> --> 120 <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
121 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2"> 121 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
122 <view class="p14"> 122 <view class="p14">
123 {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}} 123 {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
124 <image src="../../static/detail-tabicon.png" ></image> 124 <image src="../../static/detail-tabicon.png" ></image>
125 </view> 125 </view>
126 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 126 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
127 </picker> 127 </picker>
128 </view> 128 </view>
129 </view> 129 </view>
130 <view class="picker"> 130 <view class="picker">
131 <view class="picker-choice"> 131 <view class="picker-choice">
132 <view class="choice-left"> 132 <view class="choice-left">
133 <text class="pd">瞳距:</text> 133 <text class="pd">瞳距:</text>
134 </view> 134 </view>
135 <input type="digit" @change="handleInputPd" class="input" 135 <input type="digit" @change="handleInputPd" class="input"
136 placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" /> 136 placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
137 </view> 137 </view>
138 </view> 138 </view>
139 <view class="picker" > 139 <view class="picker" >
140 <view class="picker-choice"> 140 <view class="picker-choice">
141 <view class="choice-left"> 141 <view class="choice-left">
142 <text class="p11">{{pickerInfoList[3].nameC}}</text> 142 <text class="p11">{{pickerInfoList[3].nameC}}</text>
143 </view> 143 </view>
144 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text> 144 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
145 <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1"> 145 <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
146 <view class="p14" style="width: 30px;"> 146 <view class="p14" style="width: 30px;">
147 {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}} 147 {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
148 <image src="../../static/detail-tabicon.png" ></image> 148 <image src="../../static/detail-tabicon.png" ></image>
149 </view> 149 </view>
150 </picker> 150 </picker>
151 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text> 151 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
152 <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2"> 152 <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
153 <view class="p14" style="width: 30px;"> 153 <view class="p14" style="width: 30px;">
154 {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}} 154 {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
155 <image src="../../static/detail-tabicon.png" ></image> 155 <image src="../../static/detail-tabicon.png" ></image>
156 </view> 156 </view>
157 </picker> 157 </picker>
158 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text> 158 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
159 <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3"> 159 <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
160 <view class="p14" style="width: 30px;"> 160 <view class="p14" style="width: 30px;">
161 {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}} 161 {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
162 <image src="../../static/detail-tabicon.png" ></image> 162 <image src="../../static/detail-tabicon.png" ></image>
163 </view> 163 </view>
164 </picker> 164 </picker>
165 </view> 165 </view>
166 </view> 166 </view>
167 <view class="confirm"> 167 <view class="confirm">
168 <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image> 168 <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image>
169 <text>确认以上输入信息来源于我的验光数据!</text> 169 <text>确认以上输入信息来源于我的验光数据!</text>
170 </view> 170 </view>
171 </view> 171 </view>
172 <!-- <view class="goods-form"> 172 <!-- <view class="goods-form">
173 <view class="data-title"> 173 <view class="data-title">
174 <image src="../../static/icon-data.png"></image> 174 <image src="../../static/icon-data.png"></image>
175 <text class="p1">填写验光数据</text> 175 <text class="p1">填写验光数据</text>
176 </view> 176 </view>
177 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text> 177 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
178 <view class="picker"> 178 <view class="picker">
179 <view class="picker-choice"> 179 <view class="picker-choice">
180 <view class="choice-left"> 180 <view class="choice-left">
181 <text class="p11">验光单取名:</text> 181 <text class="p11">验光单取名:</text>
182 </view> 182 </view>
183 <input 183 <input
184 class="choice-name uni-input" 184 class="choice-name uni-input"
185 :value="dataName" 185 :value="dataName"
186 @blur="fillData" 186 @blur="fillData"
187 placeholder="下系" 187 placeholder="下系"
188 /> 188 />
189 </view> 189 </view>
190 </view> 190 </view>
191 <view class="picker"> 191 <view class="picker">
192 <view class="picker-choice"> 192 <view class="picker-choice">
193 <view class="choice-left"> 193 <view class="choice-left">
194 <text class="p11">{{pickerInfoList[0].nameC}}</text> 194 <text class="p11">{{pickerInfoList[0].nameC}}</text>
195 <text class="p12">{{pickerInfoList[0].nameE}}</text> 195 <text class="p12">{{pickerInfoList[0].nameE}}</text>
196 </view> 196 </view>
197 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 197 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
198 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> 198 <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
199 <picker 199 <picker
200 @change="bindPickerChange01" 200 @change="bindPickerChange01"
201 :value="pickerInfoList[0].nameIndex1" 201 :value="pickerInfoList[0].nameIndex1"
202 :range="pickerInfoList[0].nameArray1" 202 :range="pickerInfoList[0].nameArray1"
203 > 203 >
204 <image src="../../static/detail-tabicon.png"></image> 204 <image src="../../static/detail-tabicon.png"></image>
205 </picker> 205 </picker>
206 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 206 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
207 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> 207 <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
208 <picker 208 <picker
209 @change="bindPickerChange02" 209 @change="bindPickerChange02"
210 :value="pickerInfoList[0].nameIndex2" 210 :value="pickerInfoList[0].nameIndex2"
211 :range="pickerInfoList[0].nameArray2" 211 :range="pickerInfoList[0].nameArray2"
212 > 212 >
213 <image src="../../static/detail-tabicon.png"></image> 213 <image src="../../static/detail-tabicon.png"></image>
214 </picker> 214 </picker>
215 </view> 215 </view>
216 </view> 216 </view>
217 <view class="picker"> 217 <view class="picker">
218 <view class="picker-choice"> 218 <view class="picker-choice">
219 <view class="choice-left"> 219 <view class="choice-left">
220 <text class="p11">{{pickerInfoList[1].nameC}}</text> 220 <text class="p11">{{pickerInfoList[1].nameC}}</text>
221 <text class="p12">{{pickerInfoList[1].nameE}}</text> 221 <text class="p12">{{pickerInfoList[1].nameE}}</text>
222 </view> 222 </view>
223 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 223 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
224 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> 224 <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
225 <picker 225 <picker
226 @change="bindPickerChange11" 226 @change="bindPickerChange11"
227 :value="pickerInfoList[1].nameIndex1" 227 :value="pickerInfoList[1].nameIndex1"
228 :range="pickerInfoList[1].nameArray1" 228 :range="pickerInfoList[1].nameArray1"
229 > 229 >
230 <image src="../../static/detail-tabicon.png"></image> 230 <image src="../../static/detail-tabicon.png"></image>
231 </picker> 231 </picker>
232 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 232 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
233 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> 233 <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
234 <picker 234 <picker
235 @change="bindPickerChange12" 235 @change="bindPickerChange12"
236 :value="pickerInfoList[1].nameIndex2" 236 :value="pickerInfoList[1].nameIndex2"
237 :range="pickerInfoList[1].nameArray2" 237 :range="pickerInfoList[1].nameArray2"
238 > 238 >
239 <image src="../../static/detail-tabicon.png"></image> 239 <image src="../../static/detail-tabicon.png"></image>
240 </picker> 240 </picker>
241 </view> 241 </view>
242 </view> 242 </view>
243 <view class="picker"> 243 <view class="picker">
244 <view class="picker-choice"> 244 <view class="picker-choice">
245 <view class="choice-left"> 245 <view class="choice-left">
246 <text class="p11">{{pickerInfoList[2].nameC}}</text> 246 <text class="p11">{{pickerInfoList[2].nameC}}</text>
247 <text class="p12">{{pickerInfoList[2].nameE}}</text> 247 <text class="p12">{{pickerInfoList[2].nameE}}</text>
248 </view> 248 </view>
249 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 249 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
250 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text> 250 <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
251 <picker 251 <picker
252 @change="bindPickerChange21" 252 @change="bindPickerChange21"
253 :value="pickerInfoList[2].nameIndex1" 253 :value="pickerInfoList[2].nameIndex1"
254 :range="pickerInfoList[2].nameArray1" 254 :range="pickerInfoList[2].nameArray1"
255 > 255 >
256 <image src="../../static/detail-tabicon.png"></image> 256 <image src="../../static/detail-tabicon.png"></image>
257 </picker> 257 </picker>
258 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 258 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
259 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> 259 <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
260 <picker 260 <picker
261 @change="bindPickerChange22" 261 @change="bindPickerChange22"
262 :value="pickerInfoList[2].nameIndex2" 262 :value="pickerInfoList[2].nameIndex2"
263 :range="pickerInfoList[2].nameArray2" 263 :range="pickerInfoList[2].nameArray2"
264 > 264 >
265 <image src="../../static/detail-tabicon.png"></image> 265 <image src="../../static/detail-tabicon.png"></image>
266 </picker> 266 </picker>
267 </view> 267 </view>
268 </view> 268 </view>
269 <view class="picker"> 269 <view class="picker">
270 <view class="picker-choice"> 270 <view class="picker-choice">
271 <view class="choice-left"> 271 <view class="choice-left">
272 <text class="p11">{{pickerInfoList[3].nameC}}</text> 272 <text class="p11">{{pickerInfoList[3].nameC}}</text>
273 <text class="p12">{{pickerInfoList[3].nameE}}</text> 273 <text class="p12">{{pickerInfoList[3].nameE}}</text>
274 </view> 274 </view>
275 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 275 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
276 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text> 276 <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
277 <picker 277 <picker
278 @change="bindPickerChange31" 278 @change="bindPickerChange31"
279 :value="pickerInfoList[3].nameIndex1" 279 :value="pickerInfoList[3].nameIndex1"
280 :range="pickerInfoList[3].nameArray1" 280 :range="pickerInfoList[3].nameArray1"
281 > 281 >
282 <image src="../../static/detail-tabicon.png"></image> 282 <image src="../../static/detail-tabicon.png"></image>
283 </picker> 283 </picker>
284 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 284 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
285 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text> 285 <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
286 <picker 286 <picker
287 @change="bindPickerChange32" 287 @change="bindPickerChange32"
288 :value="pickerInfoList[3].nameIndex2" 288 :value="pickerInfoList[3].nameIndex2"
289 :range="pickerInfoList[3].nameArray2" 289 :range="pickerInfoList[3].nameArray2"
290 > 290 >
291 <image src="../../static/detail-tabicon.png"></image> 291 <image src="../../static/detail-tabicon.png"></image>
292 </picker> 292 </picker>
293 </view> 293 </view>
294 </view> 294 </view>
295 <view class="picker"> 295 <view class="picker">
296 <view class="picker-choice"> 296 <view class="picker-choice">
297 <view class="choice-left"> 297 <view class="choice-left">
298 <text class="p11">{{pickerInfoList[4].nameC}}</text> 298 <text class="p11">{{pickerInfoList[4].nameC}}</text>
299 </view> 299 </view>
300 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text> 300 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
301 <text 301 <text
302 class="p14" 302 class="p14"
303 style="width: 34px;" 303 style="width: 34px;"
304 >{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text> 304 >{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text>
305 <picker 305 <picker
306 @change="bindPickerChange41" 306 @change="bindPickerChange41"
307 :value="pickerInfoList[4].nameIndex1" 307 :value="pickerInfoList[4].nameIndex1"
308 :range="pickerInfoList[4].nameArray1" 308 :range="pickerInfoList[4].nameArray1"
309 > 309 >
310 <image src="../../static/detail-tabicon.png"></image> 310 <image src="../../static/detail-tabicon.png"></image>
311 </picker> 311 </picker>
312 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text> 312 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
313 <text 313 <text
314 class="p14" 314 class="p14"
315 style="width: 30px;" 315 style="width: 30px;"
316 >{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text> 316 >{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text>
317 <picker 317 <picker
318 @change="bindPickerChange42" 318 @change="bindPickerChange42"
319 :value="pickerInfoList[4].nameIndex2" 319 :value="pickerInfoList[4].nameIndex2"
320 :range="pickerInfoList[4].nameArray2" 320 :range="pickerInfoList[4].nameArray2"
321 > 321 >
322 <image src="../../static/detail-tabicon.png"></image> 322 <image src="../../static/detail-tabicon.png"></image>
323 </picker> 323 </picker>
324 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text> 324 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
325 <text 325 <text
326 class="p14" 326 class="p14"
327 style="width: 30px;" 327 style="width: 30px;"
328 >{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text> 328 >{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text>
329 <picker 329 <picker
330 @change="bindPickerChange43" 330 @change="bindPickerChange43"
331 :value="pickerInfoList[4].nameIndex3" 331 :value="pickerInfoList[4].nameIndex3"
332 :range="pickerInfoList[4].nameArray3" 332 :range="pickerInfoList[4].nameArray3"
333 > 333 >
334 <image src="../../static/detail-tabicon.png"></image> 334 <image src="../../static/detail-tabicon.png"></image>
335 </picker> 335 </picker>
336 </view> 336 </view>
337 </view> 337 </view>
338 <view class="confirm"> 338 <view class="confirm">
339 <image 339 <image
340 :src="tablist.confirm ? tabicon[0] : tabicon[1]" 340 :src="tablist.confirm ? tabicon[0] : tabicon[1]"
341 @click="changeConfirm" 341 @click="changeConfirm"
342 ></image> 342 ></image>
343 <text>确认以上输入信息来源于我的验光数据!</text> 343 <text>确认以上输入信息来源于我的验光数据!</text>
344 </view> 344 </view>
345 </view> --> 345 </view> -->
346 346
347 </template> 347 </template>
348 <template v-else> 348 <template v-else>
349 <view 349 <view
350 v-for="item in pickerInfoList" 350 v-for="item in pickerInfoList"
351 :key="item.key" 351 :key="item.key"
352 class="bodyBox" 352 class="bodyBox"
353 > 353 >
354 <template v-if="item.nameC==='验光日期'"> 354 <template v-if="item.nameC==='验光日期'">
355 <text class="names">{{item.nameC}}</text> 355 <text class="names">{{item.nameC}}</text>
356 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text> 356 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
357 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text> 357 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
358 <text>{{item.nameArray3[item.nameIndex2]}}日</text> 358 <text>{{item.nameArray3[item.nameIndex2]}}日</text>
359 </template> 359 </template>
360 <template v-else> 360 <template v-else>
361 <template v-if="item.nameC==='度数'"> 361 <template v-if="item.nameC==='度数'">
362 <text style="display: inline;">*</text> 362 <text style="display: inline;">*</text>
363 </template> 363 </template>
364 364
365 <text class="names">{{item.nameC}}</text> 365 <text class="names">{{item.nameC}}</text>
366 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text> 366 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
367 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text> 367 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
368 </template> 368 </template>
369 </view> 369 </view>
370 </template> 370 </template>
371 </view> 371 </view>
372 </view> 372 </view>
373 </view> 373 </view>
374 <view class="choose"> 374 <view class="choose">
375 <view 375 <view
376 class="chooseItem_1_content" 376 class="chooseItem_1_content"
377 v-for="(item,index) in attrList" 377 v-for="(item,index) in attrList"
378 :key="index"
378 :key="index" 379 >
379 > 380 <UniCollapse @change="change(index)">
380 <UniCollapse @change="change(index)"> 381 <UniCollapseItem
381 <UniCollapseItem 382 :open="show[index]"
382 :open="show[index]" 383 :title="item.meta_name"
383 :title="item.meta_name" 384 showAnimation=false
384 showAnimation=false 385 >
385 > 386 <view class="chooseItem_1_content">
386 <view class="chooseItem_1_content"> 387 <view class="itemsWrap">
387 <view class="itemsWrap"> 388 <view
388 <view 389 class="item2"
389 class="item2" 390 v-for="(one,i) in item.attr"
390 v-for="(one,i) in item.attr" 391 :key="i"
391 :key="i" 392 :class="{ active2: current[index] === i }"
392 :class="{ active2: current[index] === i }" 393 @click="onClickItem(index, i)"
393 @click="onClickItem(index, i)" 394 >{{one.name}}</view>
394 >{{one.name}}</view> 395 </view>
395 </view> 396 </view>
396 </view> 397 </UniCollapseItem>
397 </UniCollapseItem> 398 </UniCollapse>
398 </UniCollapse> 399 <view
399 <view 400 class="chooseRes"
400 class="chooseRes" 401 v-show="!show[index]"
401 v-show="!show[index]" 402 >* {{attrList[index].attr[current[index]].name}}</view>
402 >* {{attrList[index].attr[current[index]].name}}</view> 403 </view>
403 </view> 404 <!-- <view class="chooseItem_1 chooseItem">
404 <!-- <view class="chooseItem_1 chooseItem"> 405 <UniCollapse @change="change(1)">
405 <UniCollapse @change="change(1)"> 406 <UniCollapseItem
406 <UniCollapseItem 407 open=true
407 open=true 408 title="款式挑选"
408 title="款式挑选" 409 showAnimation=false
409 showAnimation=false 410 >
410 > 411 <view
411 <view 412 class="chooseRes"
412 class="chooseRes" 413 v-show="show[1]"
413 v-show="show[1]" 414 >* {{chooseRes1}}</view>
414 >* {{chooseRes1}}</view> 415 <view class="chooseItem_1_content">
415 <view class="chooseItem_1_content"> 416 <view class="itemsWrap">
416 <view class="itemsWrap"> 417 <view
417 <view 418 class="item1"
418 class="item1" 419 v-for="(item,index) in chooseItem1"
419 v-for="(item,index) in chooseItem1" 420 :key="index"
420 :key="index" 421 :style="item.style"
421 :style="item.style" 422 :class="{ active1: current1 === index }"
422 :class="{ active1: current1 === index }" 423 @click="onClickItem1(index)"
423 @click="onClickItem1(index)" 424 ></view>
424 ></view> 425 </view>
425 </view> 426 </view>
426 </view> 427 </UniCollapseItem>
427 </UniCollapseItem> 428 </UniCollapse>
428 </UniCollapse> 429 <view
429 <view 430 class="chooseRes"
430 class="chooseRes" 431 v-show="show[1]"
431 v-show="show[1]" 432 >* {{chooseRes1}}</view>
432 >* {{chooseRes1}}</view> 433 </view>
433 </view> 434 <view class="chooseItem_2 chooseItem ">
434 <view class="chooseItem_2 chooseItem "> 435 <UniCollapse @change="change(2)">
435 <UniCollapse @change="change(2)"> 436 <UniCollapseItem
436 <UniCollapseItem 437 open=true
437 open=true 438 title="直径"
438 title="直径" 439 showAnimation=false
439 showAnimation=false 440 >
440 > 441 <view class="chooseItem_1_content">
441 <view class="chooseItem_1_content"> 442 <view class="itemsWrap">
442 <view class="itemsWrap"> 443 <view
443 <view 444 class="item2"
444 class="item2" 445 v-for="(item,index) in chooseItem2"
445 v-for="(item,index) in chooseItem2" 446 :key="index"
446 :key="index" 447 :class="{ active2: current2 === index }"
447 :class="{ active2: current2 === index }" 448 @click="onClickItem2(index)"
448 @click="onClickItem2(index)" 449 >{{item.num}}</view>
449 >{{item.num}}</view> 450 </view>
450 </view> 451 </view>
451 </view> 452 </UniCollapseItem>
452 </UniCollapseItem> 453 </UniCollapse>
453 </UniCollapse> 454 <view
454 <view 455 class="chooseRes"
455 class="chooseRes" 456 v-show="show[2]"
456 v-show="show[2]" 457 >* {{chooseRes2}}</view>
457 >* {{chooseRes2}}</view> 458 </view>
458 </view> 459 <view class="chooseItem_3 chooseItem">
459 <view class="chooseItem_3 chooseItem"> 460 <UniCollapse @change="change(3)">
460 <UniCollapse @change="change(3)"> 461 <UniCollapseItem
461 <UniCollapseItem 462 open=true
462 open=true 463 title="度数"
463 title="度数" 464 showAnimation=false
464 showAnimation=false 465 >
465 > 466 <view class="chooseItem_1_content">
466 <view class="chooseItem_1_content"> 467 <view class="itemsWrap">
467 <view class="itemsWrap"> 468 <view
468 <view 469 class="item2"
469 class="item2" 470 v-for="(item,index) in chooseItem3"
470 v-for="(item,index) in chooseItem3" 471 :key="index"
471 :key="index" 472 :class="{ active2: current3 === index }"
472 :class="{ active2: current3 === index }" 473 @click="onClickItem3(index)"
473 @click="onClickItem3(index)" 474 >{{item}}</view>
474 >{{item}}</view> 475 </view>
475 </view> 476 </view>
476 </view> 477 </UniCollapseItem>
477 </UniCollapseItem> 478 </UniCollapse>
478 </UniCollapse> 479 <view
480 class="chooseRes"
481 v-show="show[3]"
482 >* {{chooseRes3}}</view>
483 </view> -->
479 <view 484 </view>
480 class="chooseRes" 485 <view
481 v-show="show[3]" 486 class="button"
482 >* {{chooseRes3}}</view> 487 @click="toComfirmOrder"
483 </view> --> 488 >
484 </view> 489 立即结算
485 <view 490 </view>
486 class="button" 491 </view>
487 @click="toComfirmOrder" 492 </template>
488 > 493
489 立即结算 494 <script>
490 </view> 495 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
491 </view> 496 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
492 </template> 497 import store from '@/store'
493 498
494 <script> 499 export default {
495 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 500 components: {
496 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 501 UniCollapse,
497 import store from '@/store' 502 UniCollapseItem
498 503 },
499 export default { 504 data() {
500 components: { 505 return {
501 UniCollapse, 506 count: 1,
502 UniCollapseItem 507 pid: 0,
503 }, 508 maxCount: 20,
504 data() { 509 dataName: '', // 验光数据人员名称
505 return { 510 isDataName: false, // 是否是已存在的人员数据
506 count: 1, 511 dataConfirm: false, // 已确认所输入验光数据
507 pid: 0, 512 opIsOpen: true,
508 maxCount: 20, 513 addDisabled: false,
509 dataName: '', // 验光数据人员名称 514 desDisabled: false,
510 isDataName: false, 515 current1: 0,
511 opIsOpen: true, 516 current2: 0,
512 addDisabled: false, 517 current3: 0,
513 desDisabled: false, 518 current: [],
514 current1: 0, 519 show: [],
515 current2: 0, 520 chooseRes1: {
516 current3: 0, 521 sku_name: 'Miss 黑二代【减龄自然】',
517 current: [], 522 sk_id: '128'
518 show: [], 523 },
519 chooseRes1: { 524 checkedData: {
520 sku_name: 'Miss 黑二代【减龄自然】', 525
521 sk_id: '128' 526 },
522 }, 527 chooseRes2: '14.0',
523 checkedData: { 528 chooseRes3: 0,
524 529 chooseItem1: [
525 }, 530 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' },
526 chooseRes2: '14.0', 531 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' },
527 chooseRes3: 0, 532 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' },
528 chooseItem1: [ 533 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
529 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' }, 534 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
530 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' }, 535 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
531 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' }, 536 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
532 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 537 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
533 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 538 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
534 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 539 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
535 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 540 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
536 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 541 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
537 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 542 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
538 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 543 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
539 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 544 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }
540 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 545 ],
541 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 546 chooseItem2: [
542 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 547 { num: '14.0' },
543 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' } 548 { num: '14.2' },
544 ], 549 { num: '14.4' },
545 chooseItem2: [ 550 { num: '14.5' }
546 { num: '14.0' }, 551 ],
547 { num: '14.2' }, 552 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000],
548 { num: '14.4' }, 553 // 度数相关数据
549 { num: '14.5' } 554 pickerInfoList:[
550 ], 555 {nameC:"度数",nameE:"(SPH)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:0},
551 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000], 556 {nameC:"散光",nameE:"(CYL)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:1},
552 // 度数相关数据 557 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:2},
553 pickerInfoList:[ 558 {nameC:"验光日期",nameE:'',nameArray1:[''],nameIndex1:0,nameArray2:['',1,2,3,4,5,6,7,8,9,10,11,12],nameIndex2:0,nameArray3:[''],nameIndex3:0}
554 {nameC:"度数",nameE:"(SPH)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:0}, 559 ],
555 {nameC:"散光",nameE:"(CYL)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:1}, 560 confirm: false, // 用户是否确认
556 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:2}, 561 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
557 {nameC:"验光日期",nameE:'',nameArray1:[''],nameIndex1:0,nameArray2:['',1,2,3,4,5,6,7,8,9,10,11,12],nameIndex2:0,nameArray3:[''],nameIndex3:0} 562 name: '夏小花',
558 ], 563 oldname:'',// 用于判读用户是否改变名字
559 confirm: false, // 用户是否确认 564 pickerInfoChioce:{
560 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'], 565 "leftSph": '',
561 name: '夏小花', 566 "rightSph": '',
562 oldname:'',// 用于判读用户是否改变名字 567 "leftCyl": '',
563 pickerInfoChioce:{ 568 "rightCyl": '',
564 "leftSph": '', 569 "leftAxi": '',
565 "rightSph": '', 570 "rightAxi": '',
566 "leftCyl": '', 571 "time":{
567 "rightCyl": '', 572 "year":0,
568 "leftAxi": '', 573 "month": 0,
569 "rightAxi": '', 574 "day":0 ,
570 "time":{ 575 }
571 "year":0, 576 },
572 "month": 0, 577 pd: '',// 瞳距
573 "day":0 , 578 oldpd: '',// 用于判断用户是否改变瞳距
574 } 579 kinds:1, // kinds=1，提交为新增验光，2为修改
575 }, 580 mp_id: Number
576 pd: '',// 瞳距 581 }
577 oldpd: '',// 用于判断用户是否改变瞳距 582 },
578 kinds:1, // kinds=1，提交为新增验光，2为修改 583 computed: {
579 mp_id: Number 584 attrList() {
580 } 585 return this.$store.state.read.goodInfo.attrList
581 }, 586 },
582 computed: { 587 skuList() {
583 attrList() { 588 return this.$store.state.read.goodInfo.skuList
584 return this.$store.state.read.goodInfo.attrList 589 },
585 }, 590 mpList() {
586 skuList() { 591 return this.$store.state.myLoveList.loveList
587 return this.$store.state.read.goodInfo.skuList 592 }
588 }, 593 },
589 mpList() { 594 onLoad({ pid }) {
590 return this.$store.state.myLoveList.loveList 595 this.pid = pid
591 } 596 store.dispatch('read/fetch', {
592 }, 597 pid
593 onLoad({ pid }) { 598 }).then(() => {
594 this.pid = pid 599 const current = []
595 store.dispatch('read/fetch', { 600 const show = []
596 pid 601 for (let index = 0; index < this.attrList.length; index++) {
597 }).then(() => { 602 current.push(0)
598 const current = [] 603 show.push(true)
599 const show = [] 604 }
600 for (let index = 0; index < this.attrList.length; index++) { 605 this.current = current
601 current.push(0) 606 this.show = show
602 show.push(true) 607 })
603 } 608 store.dispatch('myLoveList/getLoveList')
604 this.current = current 609
605 this.show = show 610 // 初始化SPL、CYL、AXI的值
606 }) 611 for (let j = 0; j < 3; j++) {
607 store.dispatch('myLoveList/getLoveList') 612 for(let i=-12;i<6;i++){
608 613 this.pickerInfoList[j].nameArray1.push(i)
609 // 初始化SPL、CYL、AXI的值 614 this.pickerInfoList[j].nameArray1.push(i+0.5)
610 for (let j = 0; j < 3; j++) { 615 this.pickerInfoList[j].nameArray2.push(i)
611 for(let i=-12;i<6;i++){ 616 this.pickerInfoList[j].nameArray2.push(i+0.5)
612 this.pickerInfoList[j].nameArray1.push(i) 617 if(i>=-6){
613 this.pickerInfoList[j].nameArray1.push(i+0.5) 618 this.pickerInfoList[j].nameArray1.push(i+0.25)
614 this.pickerInfoList[j].nameArray2.push(i) 619 this.pickerInfoList[j].nameArray1.push(i+0.75)
615 this.pickerInfoList[j].nameArray2.push(i+0.5) 620 this.pickerInfoList[j].nameArray2.push(i+0.25)
616 if(i>=-6){ 621 this.pickerInfoList[j].nameArray2.push(i+0.75)
617 this.pickerInfoList[j].nameArray1.push(i+0.25) 622 }
618 this.pickerInfoList[j].nameArray1.push(i+0.75) 623 if(i==5){
619 this.pickerInfoList[j].nameArray2.push(i+0.25) 624 this.pickerInfoList[j].nameArray1.push(i+1)
620 this.pickerInfoList[j].nameArray2.push(i+0.75) 625 this.pickerInfoList[j].nameArray2.push(i+1)
621 } 626 }
622 if(i==5){ 627 }
623 this.pickerInfoList[j].nameArray1.push(i+1) 628 }
624 this.pickerInfoList[j].nameArray2.push(i+1) 629 // 初始化日期值
625 } 630 for (let i = 1; i < 32; i++){
626 } 631 this.pickerInfoList[3].nameArray3.push(i)
627 } 632 }
628 // 初始化日期值 633 // 初始化年份前后五年
629 for (let i = 1; i < 32; i++){ 634 let myDate = new Date();
630 this.pickerInfoList[3].nameArray3.push(i) 635 let nowYear = myDate.getFullYear();
631 } 636 for(let i=0;i<5;i++){
632 // 初始化年份前后五年 637 this.pickerInfoList[3].nameArray1.push(nowYear-i)
633 let myDate = new Date(); 638 }
634 let nowYear = myDate.getFullYear(); 639 },
635 for(let i=0;i<5;i++){ 640 methods: {
636 this.pickerInfoList[3].nameArray1.push(nowYear-i) 641 // picker相关功能
637 } 642 handleInput(e){
638 }, 643 this.name=e.target.value
639 methods: { 644 this.isDataName = false
640 // picker相关功能 645 console.log('e---->', e)
641 handleInput(e){ 646 const mpList = this.mpList
642 this.name=e.target.value 647 console.log('mpList===>',mpList)
643 this.isDataName = false 648 for (let index = 0; index < mpList.length; index++) {
644 console.log('e---->', e) 649 if (e.detail.value === mpList[index].name) {
645 const mpList = this.mpList 650 this.isDataName = true
646 console.log('mpList===>',mpList) 651 uni.showModal({
647 for (let index = 0; index < mpList.length; index++) { 652 title: '提示',
648 if (e.detail.value === mpList[index].name) { 653 content: `是否填充已有的"${e.detail.value}"的数据`,
649 this.isDataName = true 654 success: ({ confirm }) => {
650 uni.showModal({ 655 if (confirm) {
651 title: '提示', 656 this.kinds=2
652 content: `是否填充已有的"${e.detail.value}"的数据`, 657 console.log('args===>',index)
653 success: ({ confirm }) => { 658 // const mpList=Object.assign({},this.$store.state.mympList.mpList)
654 if (confirm) { 659 console.log('mpList===>',mpList)
655 this.kinds=2 660 this.name=mpList[index].name
656 console.log('args===>',index) 661 this.pd=mpList[index].pd
657 // const mpList=Object.assign({},this.$store.state.mympList.mpList) 662 this.mp_id=mpList[index].mp_id
658 console.log('mpList===>',mpList) 663 this.oldname=mpList[index].name
659 this.name=mpList[index].name 664 this.oldpd=mpList[index].pd
660 this.pd=mpList[index].pd 665 // 将kinds =2时的值传到该页面
661 this.mp_id=mpList[index].mp_id 666 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph)
662 this.oldname=mpList[index].name 667 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph)
663 this.oldpd=mpList[index].pd 668 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl)
664 // 将kinds =2时的值传到该页面 669 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl)
665 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph) 670 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi)
666 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph) 671 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi)
667 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl) 672
668 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl) 673 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0,4))
669 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi) 674 if(mpList[index].in_time.toString().slice(5,6)==0){
670 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi) 675 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6,7))
671 676 } else{
672 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0,4)) 677 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5,7))
673 if(mpList[index].in_time.toString().slice(5,6)==0){ 678 }
674 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6,7)) 679 if(mpList[index].in_time.toString().slice(8,9)==0){
675 } else{ 680 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9,10))
676 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5,7)) 681 } else{
677 } 682 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8,10))
678 if(mpList[index].in_time.toString().slice(8,9)==0){ 683 }
679 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9,10)) 684 // this.checkedData = mpList[index]
680 } else{ 685 // console.log('checkedData', this.checkedData)
681 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8,10)) 686 }
682 } 687 }
683 // this.checkedData = mpList[index] 688 })
684 // console.log('checkedData', this.checkedData) 689 }
685 } 690 }
686 } 691 },
687 }) 692 handleInputPd(e){
688 } 693 // 只能输入正浮点数或正数
689 } 694 if(/^\d+(\.\d+)?$/.test(e.target.value)){
690 }, 695 this.pd=e.target.value
691 handleInputPd(e){ 696 } else {
692 // 只能输入正浮点数或正数 697 uni.showToast({
693 if(/^\d+(\.\d+)?$/.test(e.target.value)){ 698 title:"请输入有效数据;示例:89",
694 this.pd=e.target.value 699 icon: "none",
695 } else { 700 duration: 2000,
696 uni.showToast({ 701 })
697 title:"请输入有效数据;示例:89", 702 this.pd = ''
698 icon: "none", 703 }
699 duration: 2000, 704
700 }) 705 },
701 this.pd = '' 706 changeConfirm() {
702 } 707 this.confirm = !this.confirm
703 708 },
704 }, 709 bindPickerChange01: function(e) {
705 changeConfirm() { 710 this.pickerInfoList[0].nameIndex1 = e.target.value
706 this.confirm = !this.confirm 711 this.pickerInfoChioce.leftSph=this.pickerInfoList[0].nameArray1[e.target.value]
707 }, 712 },
708 bindPickerChange01: function(e) { 713 bindPickerChange02: function(e) {
709 this.pickerInfoList[0].nameIndex1 = e.target.value 714 this.pickerInfoList[0].nameIndex2 = e.target.value
710 this.pickerInfoChioce.leftSph=this.pickerInfoList[0].nameArray1[e.target.value] 715 this.pickerInfoChioce.rightSph=this.pickerInfoList[0].nameArray2[e.target.value]
711 }, 716 },
712 bindPickerChange02: function(e) { 717
713 this.pickerInfoList[0].nameIndex2 = e.target.value 718 bindPickerChange11: function(e) {
714 this.pickerInfoChioce.rightSph=this.pickerInfoList[0].nameArray2[e.target.value] 719 this.pickerInfoList[1].nameIndex1 = e.target.value
715 }, 720 this.pickerInfoChioce.leftCyl=this.pickerInfoList[1].nameArray1[e.target.value]
716 721 },
717 bindPickerChange11: function(e) { 722 bindPickerChange12: function(e) {
718 this.pickerInfoList[1].nameIndex1 = e.target.value 723 this.pickerInfoList[1].nameIndex2 = e.target.value
719 this.pickerInfoChioce.leftCyl=this.pickerInfoList[1].nameArray1[e.target.value] 724 this.pickerInfoChioce.rightCyl=this.pickerInfoList[1].nameArray2[e.target.value]
720 }, 725 },
721 bindPickerChange12: function(e) { 726
722 this.pickerInfoList[1].nameIndex2 = e.target.value 727 bindPickerChange21: function(e) {
723 this.pickerInfoChioce.rightCyl=this.pickerInfoList[1].nameArray2[e.target.value] 728 this.pickerInfoList[2].nameIndex1 = e.target.value
724 }, 729 this.pickerInfoChioce.leftAxi=this.pickerInfoList[2].nameArray1[e.target.value]
725 730 },
726 bindPickerChange21: function(e) { 731 bindPickerChange22: function(e) {
727 this.pickerInfoList[2].nameIndex1 = e.target.value 732 this.pickerInfoList[2].nameIndex2 = e.target.value
728 this.pickerInfoChioce.leftAxi=this.pickerInfoList[2].nameArray1[e.target.value] 733 this.pickerInfoChioce.rightAxi=this.pickerInfoList[2].nameArray2[e.target.value]
729 }, 734 },
730 bindPickerChange22: function(e) { 735
731 this.pickerInfoList[2].nameIndex2 = e.target.value 736 bindPickerChange41: function(e) {
732 this.pickerInfoChioce.rightAxi=this.pickerInfoList[2].nameArray2[e.target.value] 737 this.pickerInfoList[3].nameIndex1 = e.target.value
733 }, 738 this.pickerInfoChioce.time.year=this.pickerInfoList[3].nameArray1[e.target.value]
734 739 },
735 bindPickerChange41: function(e) { 740 bindPickerChange42: function(e) {
736 this.pickerInfoList[3].nameIndex1 = e.target.value 741 this.pickerInfoList[3].nameIndex2 = e.target.value
737 this.pickerInfoChioce.time.year=this.pickerInfoList[3].nameArray1[e.target.value] 742 this.pickerInfoChioce.time.month=this.pickerInfoList[3].nameArray2[e.target.value]
738 }, 743 },
739 bindPickerChange42: function(e) { 744 bindPickerChange43: function(e) {
740 this.pickerInfoList[3].nameIndex2 = e.target.value 745 this.pickerInfoList[3].nameIndex3 = e.target.value
741 this.pickerInfoChioce.time.month=this.pickerInfoList[3].nameArray2[e.target.value] 746 this.pickerInfoChioce.time.day=this.pickerInfoList[3].nameArray3[e.target.value]
742 }, 747 },
743 bindPickerChange43: function(e) { 748
744 this.pickerInfoList[3].nameIndex3 = e.target.value 749 // 是否填充人员数据
745 this.pickerInfoChioce.time.day=this.pickerInfoList[3].nameArray3[e.target.value] 750 // fillData(e) {
746 }, 751 // this.isDataName = false
747 752 // console.log('e---->', e)
748 // 是否填充人员数据 753 // const mpList = this.mpList
749 // fillData(e) { 754
750 // this.isDataName = false 755 <<<<<<< HEAD
751 // console.log('e---->', e) 756 // for (let index = 0; index < mpList.length; index++) {
752 // const mpList = this.mpList 757 // if (e.detail.value === mpList[index].name) {
753 758 // this.isDataName = true
754 // for (let index = 0; index < mpList.length; index++) { 759 // uni.showModal({
755 // if (e.detail.value === mpList[index].name) { 760 // title: '提示',
756 // this.isDataName = true 761 // content: `是否填充已有的${e.detail.value}的数据`,
757 // uni.showModal({ 762 // success: ({ confirm }) => {
758 // title: '提示', 763 // if (confirm) {
759 // content: `是否填充已有的${e.detail.value}的数据`, 764 // this.checkedData = mpList[index]
760 // success: ({ confirm }) => { 765 // console.log('checkedData', this.checkedData)
761 // if (confirm) { 766 // }
762 // this.checkedData = mpList[index] 767 // }
763 // console.log('checkedData', this.checkedData) 768 // })
764 // } 769 // }
765 // } 770 // }
766 // }) 771 // },
767 // } 772 =======
768 // } 773 for (let index = 0; index < mpList.length; index++) {
769 // }, 774 if (e.detail.value === mpList[index].name) {
770 change(num) { 775 this.isDataName = true
771 this.show[num] = !this.show[num] 776 uni.showModal({
772 this.$forceUpdate() 777 title: '提示',
773 }, 778 content: `是否自动填充已保存的${e.detail.value}的数据`,
774 onClickItem(index, i) { 779 success: ({ confirm }) => {
775 if (this.current[index] !== i) { 780 if (confirm) {
776 this.current[index] = i 781 this.checkedData = mpList[index]
777 } 782 console.log('checkedData', this.checkedData)
778 this.$forceUpdate() 783 }
779 }, 784 }
780 onClickItem1(index) { 785 })
781 if (this.current1 !== index) { 786 }
782 this.current1 = index 787 }
783 this.chooseRes1 = this.chooseItem1[index].describ 788 },
784 } 789 // 确认验光数据
785 }, 790 changeConfirm() {
786 onClickItem2(index) { 791
787 if (this.current2 !== index) { 792 },
788 this.current2 = index 793 >>>>>>> 3a0878cc773855146d390a935b133980a5c0ee88
789 this.chooseRes2 = this.chooseItem2[index].num 794 change(num) {
790 } 795 this.show[num] = !this.show[num]
791 }, 796 this.$forceUpdate()
792 onClickItem3(index) { 797 },
793 if (this.current3 !== index) { 798 onClickItem(index, i) {
794 this.current3 = index 799 if (this.current[index] !== i) {
795 this.chooseRes3 = this.chooseItem3[index] 800 this.current[index] = i
796 } 801 }
797 }, 802 this.$forceUpdate()
798 counter(isadd) { 803 },
799 if (isadd) { 804 onClickItem1(index) {
800 this.count >= this.maxCount ? this.addDisabled = true : this.count++ 805 if (this.current1 !== index) {
801 } else { 806 this.current1 = index
802 this.count <= 1 ? this.desDisabled = true : this.count-- 807 this.chooseRes1 = this.chooseItem1[index].describ
803 } 808 }
804 }, 809 },
805 toComfirmOrder() { 810 onClickItem2(index) {
806 // 先处理验光部分的逻辑，如果ok在跳转 811 if (this.current2 !== index) {
807 let flag=0; 812 this.current2 = index
808 if(this.name==''){ 813 this.chooseRes2 = this.chooseItem2[index].num
809 uni.showToast({ 814 }
810 title:"请输入验光单取名", 815 },
811 icon: "none", 816 onClickItem3(index) {
812 duration: 2000, 817 if (this.current3 !== index) {
813 }) 818 this.current3 = index
814 }else{ 819 this.chooseRes3 = this.chooseItem3[index]
815 820 }
816 if(this.pd==''){ 821 },
817 uni.showToast({ 822 counter(isadd) {
818 title:"请输入瞳距", 823 if (isadd) {
819 icon: "none", 824 this.count >= this.maxCount ? this.addDisabled = true : this.count++
820 duration: 2000, 825 } else {
821 }) 826 this.count <= 1 ? this.desDisabled = true : this.count--
822 }else{ 827 }
823 828 },
824 if(this.kinds==1){ 829 toComfirmOrder() {
825 // 添加用户验光单 830 // 先处理验光部分的逻辑，如果ok在跳转
826 console.log('kinds====>',this.pickerInfoChioce.leftSph) 831 let flag=0;
827 console.log('kinds====>',this.pickerInfoChioce.leftSph==Number) 832 if(this.name==''){
828 console.log('kinds====>',this.pickerInfoChioce.rightSph==Number) 833 uni.showToast({
829 if(this.pickerInfoChioce.rightSph==''||this.pickerInfoChioce.leftSph==''|| 834 title:"请输入验光单取名",
830 this.pickerInfoChioce.leftCyl==''||this.pickerInfoChioce.rightCyl==''|| 835 icon: "none",
831 this.pickerInfoChioce.leftAxi==''||this.pickerInfoChioce.rightAxi=='' 836 duration: 2000,
832 ){ 837 })
833 uni.showToast({ 838 }else{
834 title:"请输入您的验光数据", 839
835 icon: "none", 840 if(this.pd==''){
836 duration: 2000, 841 uni.showToast({
837 }) 842 title:"请输入瞳距",
838 }else{ 843 icon: "none",
839 if(this.confirm){ 844 duration: 2000,
840 store.dispatch('myLoveList/addMylove', { 845 })
841 uid: this.$store.state.user.userInfo.uid, 846 }else{
842 openid: this.$store.state.user.userInfo.openid, 847
843 // mp_name: this.$store.state.user.userInfo.mp_name, 848 if(this.kinds==1){
844 leftSph: this.pickerInfoChioce.leftSph, 849 // 添加用户验光单
845 rightSph: this.pickerInfoChioce.rightSph, 850 console.log('kinds====>',this.pickerInfoChioce.leftSph)
846 leftCyl: this.pickerInfoChioce.leftCyl, 851 console.log('kinds====>',this.pickerInfoChioce.leftSph==Number)
847 rightCyl: this.pickerInfoChioce.rightCyl, 852 console.log('kinds====>',this.pickerInfoChioce.rightSph==Number)
848 leftAxi: this.pickerInfoChioce.leftAxi, 853 if(this.pickerInfoChioce.rightSph==''||this.pickerInfoChioce.leftSph==''||
849 rightAxi: this.pickerInfoChioce.rightAxi, 854 this.pickerInfoChioce.leftCyl==''||this.pickerInfoChioce.rightCyl==''||
850 pd: this.pd,// 瞳距 855 this.pickerInfoChioce.leftAxi==''||this.pickerInfoChioce.rightAxi==''
851 mp_name:this.name, 856 ){
852 // time: this.pickerInfoChioce.time, 857 uni.showToast({
853 // img_url2: "http://localhost:8087/images/shop_1/1/", 858 title:"请输入您的验光数据",
854 }); 859 icon: "none",
855 store.dispatch('myLoveList/getLoveList', { 860 duration: 2000,
856 uid: this.$store.state.user.userInfo.uid, 861 })
857 }); 862 }else{
858 flag=1 863 if(this.confirm){
859 } else{ 864 store.dispatch('myLoveList/addMylove', {
860 uni.showToast({ 865 uid: this.$store.state.user.userInfo.uid,
861 title:"请确认您的验光数据", 866 openid: this.$store.state.user.userInfo.openid,
862 icon: "none", 867 // mp_name: this.$store.state.user.userInfo.mp_name,
863 duration: 3000, 868 leftSph: this.pickerInfoChioce.leftSph,
864 }) 869 rightSph: this.pickerInfoChioce.rightSph,
865 } 870 leftCyl: this.pickerInfoChioce.leftCyl,
866 } 871 rightCyl: this.pickerInfoChioce.rightCyl,
867 } 872 leftAxi: this.pickerInfoChioce.leftAxi,
868 if(this.kinds==2){ 873 rightAxi: this.pickerInfoChioce.rightAxi,
869 // console.log('kinds====>',this.kinds) 874 pd: this.pd,// 瞳距
870 // console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1) 875 mp_name:this.name,
871 // console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce)) 876 // time: this.pickerInfoChioce.time,
872 if(this.confirm){ 877 // img_url2: "http://localhost:8087/images/shop_1/1/",
873 const leftList = ["leftSph","leftCyl","leftAxi"]; 878 });
874 const rightList = ["rightSph", "rightCyl", "rightAxi"]; 879 store.dispatch('myLoveList/getLoveList', {
875 // let flag=0; 880 uid: this.$store.state.user.userInfo.uid,
876 if(this.name!=this.oldname){ 881 });
877 store.dispatch('myLoveList/updateMylove', { 882 flag=1
878 uid: this.$store.state.user.userInfo.uid, 883 } else{
879 openid: this.$store.state.user.userInfo.openid, 884 uni.showToast({
880 mp_id: this.mp_id, 885 title:"请确认您的验光数据",
881 keyname: 'name', 886 icon: "none",
882 keyvalue: this.name, 887 duration: 3000,
883 }); 888 })
884 flag=1 889 }
885 } 890 }
886 if(this.pd!=this.oldpd){ 891 }
887 store.dispatch('myLoveList/updateMylove', { 892 if(this.kinds==2){
888 uid: this.$store.state.user.userInfo.uid, 893 // console.log('kinds====>',this.kinds)
889 openid: this.$store.state.user.userInfo.openid, 894 // console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1)
890 mp_id: this.mp_id, 895 // console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce))
891 keyname: 'pd', 896 if(this.confirm){
892 keyvalue: this.pd, 897 const leftList = ["leftSph","leftCyl","leftAxi"];
893 }); 898 const rightList = ["rightSph", "rightCyl", "rightAxi"];
894 flag=1 899 // let flag=0;
895 } 900 if(this.name!=this.oldname){
896 // 先验证是否输入有无空 901 store.dispatch('myLoveList/updateMylove', {
897 let q= true; 902 uid: this.$store.state.user.userInfo.uid,
898 for(let k=0; k<3;k++){ 903 openid: this.$store.state.user.userInfo.openid,
899 q=q&&(this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1]!=''&& 904 mp_id: this.mp_id,
900 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2]!='') 905 keyname: 'name',
901 } 906 keyvalue: this.name,
902 if(q){ 907 });
903 908 flag=1
904 for (let j=0; j<3; j++) { 909 }
905 if(this.pickerInfoList[j].nameIndex1!=0){ 910 if(this.pd!=this.oldpd){
906 store.dispatch('myLoveList/updateMylove', { 911 store.dispatch('myLoveList/updateMylove', {
907 uid: this.$store.state.user.userInfo.uid, 912 uid: this.$store.state.user.userInfo.uid,
908 openid: this.$store.state.user.userInfo.openid, 913 openid: this.$store.state.user.userInfo.openid,
909 mp_id: this.mp_id, 914 mp_id: this.mp_id,
910 keyname: leftList[j], 915 keyname: 'pd',
911 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1], 916 keyvalue: this.pd,
912 }); 917 });
913 } 918 flag=1
914 if(this.pickerInfoList[j].nameIndex2!=0){ 919 }
915 store.dispatch('myLoveList/updateMylove', { 920 // 先验证是否输入有无空
916 uid: this.$store.state.user.userInfo.uid, 921 let q= true;
917 openid: this.$store.state.user.userInfo.openid, 922 for(let k=0; k<3;k++){
918 mp_id: this.mp_id, 923 q=q&&(this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1]!=''&&
919 keyname: rightList[j], 924 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2]!='')
920 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2] 925 }
921 }); 926 if(q){
922 } 927
923 flag=1; 928 for (let j=0; j<3; j++) {
924 } 929 if(this.pickerInfoList[j].nameIndex1!=0){
925 }else{ 930 store.dispatch('myLoveList/updateMylove', {
926 flag=0; 931 uid: this.$store.state.user.userInfo.uid,
927 uni.showToast({ 932 openid: this.$store.state.user.userInfo.openid,
928 title:"请输入您的验光数据", 933 mp_id: this.mp_id,
929 icon: "none", 934 keyname: leftList[j],
930 duration: 2000, 935 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
931 }) 936 });
932 937 }
933 } 938 if(this.pickerInfoList[j].nameIndex2!=0){
934 if(flag!=0){ 939 store.dispatch('myLoveList/updateMylove', {
935 store.dispatch('myLoveList/getLoveList', { 940 uid: this.$store.state.user.userInfo.uid,
936 uid: this.$store.state.user.userInfo.uid, 941 openid: this.$store.state.user.userInfo.openid,
937 }); 942 mp_id: this.mp_id,
938 } 943 keyname: rightList[j],
939 944 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2]
940 } else{ 945 });
941 uni.showToast({ 946 }
942 title:"请确认您的验光数据", 947 flag=1;
943 icon: "none", 948 }
944 duration: 3000, 949 }else{
945 }) 950 flag=0;
946 } 951 uni.showToast({
947 } 952 title:"请输入您的验光数据",
948 } 953 icon: "none",
949 954 duration: 2000,
950 } 955 })
951 if(flag!=0){ 956
952 let i = 0 957 }
953 // 判断出是哪一个sku被选中 958 if(flag!=0){
954 for (let index = 0; index < this.current.length; index++) { 959 store.dispatch('myLoveList/getLoveList', {
955 console.log('index', index, i, index !== this.current.length - 1) 960 uid: this.$store.state.user.userInfo.uid,
956 if (index !== this.current.length - 1) { 961 });
957 console.log('----', this.current[index], this.attrList[1].attr.length, this.attrList) 962 }
958 i = this.current[index] * this.attrList[1].attr.length 963
959 } else { 964 } else{
960 i += this.current[index] 965 uni.showToast({
961 } 966 title:"请确认您的验光数据",
962 console.log('i', i) 967 icon: "none",
963 } 968 duration: 3000,
964 console.log('i------>', i) 969 })
965 // 判断是否其输入的人员数据是否已存在 970 }
966 store.dispatch('order/saveParams', { 971 }
967 sk_id_arr: this.skuList[i], 972 }
968 current: this.current 973
969 }) 974 }
970 975 if(flag!=0){
971 uni.navigateTo({ 976 let i = 0
972 url: `../confirmOrder/confirmOrder?pid=${this.pid}` 977 // 判断出是哪一个sku被选中
973 }) 978 for (let index = 0; index < this.current.length; index++) {
974 } 979 console.log('index', index, i, index !== this.current.length - 1)
975 980 if (index !== this.current.length - 1) {
976 } 981 console.log('----', this.current[index], this.attrList[1].attr.length, this.attrList)
977 } 982 i = this.current[index] * this.attrList[1].attr.length
978 } 983 } else {
979 </script> 984 i += this.current[index]
980 985 }
981 <style lang="scss"> 986 console.log('i', i)
982 .content { 987 }
983 min-height: 100vh; 988 console.log('i------>', i)
984 background-color: #f2f2f2; 989 // 判断是否其输入的人员数据是否已存在
985 // padding-top: 20rpx; 990 store.dispatch('order/saveParams', {
986 .goodInfo { 991 sk_id_arr: this.skuList[i],
987 width: 100%; 992 current: this.current
988 height: 272rpx; 993 })
989 border-radius: 16rpx; 994
990 background-color: #ffffff; 995 uni.navigateTo({
991 box-sizing: border-box; 996 url: `../confirmOrder/confirmOrder?pid=${this.pid}`
992 padding: 36rpx; 997 })
993 display: flex; 998 }
994 flex-direction: row; 999
995 justify-content: flex-start; 1000 }
996 .imageWrap { 1001 }
997 height: 188rpx; 1002 }
998 width: 188rpx; 1003 </script>
999 margin-right: 28rpx; 1004
1000 image { 1005 <style lang="scss">
1001 height: 188rpx; 1006 .content {
1002 width: 188rpx; 1007 min-height: 100vh;
1003 } 1008 background-color: #f2f2f2;
1004 } 1009 // padding-top: 20rpx;
1005 .infoRight { 1010 .goodInfo {
1006 display: flex; 1011 width: 100%;
1007 flex-direction: column; 1012 height: 272rpx;
1008 align-items: flex-start; 1013 border-radius: 16rpx;
1009 justify-content: space-between; 1014 background-color: #ffffff;
1010 .goodName { 1015 box-sizing: border-box;
1011 font-size: 28rpx; 1016 padding: 36rpx;
1012 color: #333333; 1017 display: flex;
1013 } 1018 flex-direction: row;
1014 .remarks { 1019 justify-content: flex-start;
1015 font-size: 20rpx; 1020 .imageWrap {
1016 color: #999999; 1021 height: 188rpx;
1017 } 1022 width: 188rpx;
1018 .priceBox { 1023 margin-right: 28rpx;
1019 display: flex; 1024 image {
1020 justify-content: space-between; 1025 height: 188rpx;
1021 align-items: center; 1026 width: 188rpx;
1022 width: 100%; 1027 }
1023 font-size: 14px; 1028 }
1024 color: #999999; 1029 .infoRight {
1025 .price { 1030 display: flex;
1026 color: #ff6b4a; 1031 flex-direction: column;
1027 font-size: 28rpx; 1032 align-items: flex-start;
1028 } 1033 justify-content: space-between;
1029 .counter { 1034 .goodName {
1030 display: flex; 1035 font-size: 28rpx;
1031 flex-direction: row; 1036 color: #333333;
1032 justify-content: space-between; 1037 }
1033 align-items: center; 1038 .remarks {
1034 font-size: 28rpx; 1039 font-size: 20rpx;
1035 color: #333333; 1040 color: #999999;
1036 width: 122rpx; 1041 }
1037 .btn { 1042 .priceBox {
1038 display: flex; 1043 display: flex;
1039 justify-content: center; 1044 justify-content: space-between;
1040 line-height: 32rpx; 1045 align-items: center;
1041 height: 32rpx; 1046 width: 100%;
1042 width: 32rpx; 1047 font-size: 14px;
1043 background-color: #f2f2f2; 1048 color: #999999;
1044 color: #cfcfcf; 1049 .price {
1045 } 1050 color: #ff6b4a;
1046 } 1051 font-size: 28rpx;
1047 } 1052 }
1048 } 1053 .counter {
1049 } 1054 display: flex;
1050 .goods-data { 1055 flex-direction: row;
1051 width: 100%; 1056 justify-content: space-between;
1052 box-sizing: border-box; 1057 align-items: center;
1053 padding: 37rpx 40rpx 0 40rpx; 1058 font-size: 28rpx;
1054 background: #ffffff; 1059 color: #333333;
1055 border-radius: 12rpx; 1060 width: 122rpx;
1056 .opCollapse { 1061 .btn {
1057 width: 100%; 1062 display: flex;
1058 padding-bottom: 28rpx; 1063 justify-content: center;
1059 margin-top: 7px; 1064 line-height: 32rpx;
1060 border-bottom: 1px solid #e9e9e9; 1065 height: 32rpx;
1061 .head { 1066 width: 32rpx;
1062 display: flex; 1067 background-color: #f2f2f2;
1063 justify-content: space-between; 1068 color: #cfcfcf;
1064 height: 24px; 1069 }
1065 // font-family: PingFangSC-Medium; 1070 }
1066 font-size: 16px; 1071 }
1067 color: #333333; 1072 }
1068 letter-spacing: -0.3px; 1073 }
1069 text-align: justify; 1074 .goods-data {
1070 line-height: 24px; 1075 width: 100%;
1071 margin-bottom: 18rpx; 1076 box-sizing: border-box;
1072 .headRighted { 1077 padding: 37rpx 40rpx 0 40rpx;
1073 width: 0; 1078 background: #ffffff;
1074 height: 0; 1079 border-radius: 12rpx;
1075 border-left: 4px solid transparent; 1080 .opCollapse {
1076 border-right: 4px solid transparent; 1081 width: 100%;
1077 border-bottom: 4px solid #cfcfcf; 1082 padding-bottom: 28rpx;
1078 transform: scaleY(-1); 1083 margin-top: 7px;
1079 margin-top: 10px; 1084 border-bottom: 1px solid #e9e9e9;
1080 } 1085 .head {
1081 .headMid { 1086 display: flex;
1082 // font-family: PingFangSC-Regular; 1087 justify-content: space-between;
1083 font-size: 10px; 1088 height: 24px;
1084 color: #999999; 1089 // font-family: PingFangSC-Medium;
1085 letter-spacing: -0.19px; 1090 font-size: 16px;
1086 margin-left: -120rpx; 1091 color: #333333;
1087 } 1092 letter-spacing: -0.3px;
1088 .headRight { 1093 text-align: justify;
1089 width: 0; 1094 line-height: 24px;
1090 height: 0; 1095 margin-bottom: 18rpx;
1091 border-left: 4px solid transparent; 1096 .headRighted {
1092 border-right: 4px solid transparent; 1097 width: 0;
1093 border-bottom: 4px solid #cfcfcf; 1098 height: 0;
1094 margin-top: 10px; 1099 border-left: 4px solid transparent;
1095 } 1100 border-right: 4px solid transparent;
1096 } 1101 border-bottom: 4px solid #cfcfcf;
1097 .body { 1102 transform: scaleY(-1);
1098 // font-family: PingFangSC-Regular; 1103 margin-top: 10px;
1099 font-size: 12px; 1104 }
1100 color: #666666; 1105 .headMid {
1101 letter-spacing: 0; 1106 // font-family: PingFangSC-Regular;
1102 .bodyBox { 1107 font-size: 10px;
1103 margin-top: 15px; 1108 color: #999999;
1104 .names { 1109 letter-spacing: -0.19px;
1105 // font-family: PingFangSC-Regular; 1110 margin-left: -120rpx;
1106 font-size: 12px; 1111 }
1107 color: #151515; 1112 .headRight {
1108 letter-spacing: 0; 1113 width: 0;
1109 text-align: justify; 1114 height: 0;
1110 line-height: 17px; 1115 border-left: 4px solid transparent;
1111 margin-left: 5px; 1116 border-right: 4px solid transparent;
1112 margin-right: 10px; 1117 border-bottom: 4px solid #cfcfcf;
1113 } 1118 margin-top: 10px;
1114 text { 1119 }
1115 // font-family: PingFangSC-Regular; 1120 }
1116 font-size: 12px; 1121 .body {
1117 color: #666666; 1122 // font-family: PingFangSC-Regular;
1118 letter-spacing: 0; 1123 font-size: 12px;
1119 text-align: justify; 1124 color: #666666;
1120 } 1125 letter-spacing: 0;
1121 } 1126 .bodyBox {
1122 } 1127 margin-top: 15px;
1123 1128 .names {
1124 // .goods-form { 1129 // font-family: PingFangSC-Regular;
1125 // display: flex; 1130 font-size: 12px;
1126 // flex-direction: column; 1131 color: #151515;
1127 // align-items: center; 1132 letter-spacing: 0;
1128 // justify-content: center; 1133 text-align: justify;
1129 // background-color: #fff; 1134 line-height: 17px;
1130 // width: 100%; 1135 margin-left: 5px;
1131 // .p1 { 1136 margin-right: 10px;
1132 // font-size: 16px; 1137 }
1133 // color: #333333; 1138 text {
1134 // letter-spacing: -0.3px; 1139 // font-family: PingFangSC-Regular;
1135 // text-align: justify; 1140 font-size: 12px;
1136 // line-height: 24px; 1141 color: #666666;
1137 // margin: 4px 0; 1142 letter-spacing: 0;
1138 // } 1143 text-align: justify;
1139 // .p2 { 1144 }
1140 // font-size: 12px; 1145 }
1141 // color: #999999; 1146 }
1142 // letter-spacing: -0.23px; 1147
1143 // margin-bottom: 18rpx; 1148 // .goods-form {
1144 // } 1149 // display: flex;
1145 // image { 1150 // flex-direction: column;
1146 // width: 28rpx; 1151 // align-items: center;
1147 // height: 26rpx; 1152 // justify-content: center;
1148 // } 1153 // background-color: #fff;
1149 // .confirm { 1154 // width: 100%;
1150 // display: flex; 1155 // .p1 {
1151 // align-items: center; 1156 // font-size: 16px;
1152 // font-size: 12px; 1157 // color: #333333;
1153 // color: #666666; 1158 // letter-spacing: -0.3px;
1154 // letter-spacing: -0.23px; 1159 // text-align: justify;
1155 // width: 684rpx; 1160 // line-height: 24px;
1156 // image { 1161 // margin: 4px 0;
1157 // margin-right: 25rpx; 1162 // }
1158 // } 1163 // .p2 {
1159 // } 1164 // font-size: 12px;
1160 // .picker { 1165 // color: #999999;
1161 // display: flex; 1166 // letter-spacing: -0.23px;
1162 // flex-direction: column; 1167 // margin-bottom: 18rpx;
1163 // justify-content: center; 1168 // }
1164 // align-items: center; 1169 // image {
1165 // width: 100%; 1170 // width: 28rpx;
1166 // image { 1171 // height: 26rpx;
1167 // width: 10px; 1172 // }
1168 // height: 10px; 1173 // .confirm {
1169 // margin-right: 5px; 1174 // display: flex;
1170 // } 1175 // align-items: center;
1171 // .picker-choice { 1176 // font-size: 12px;
1172 // display: flex; 1177 // color: #666666;
1173 // width: 684rpx; 1178 // letter-spacing: -0.23px;
1174 // align-items: center; 1179 // width: 684rpx;
1175 // margin-bottom: 40rpx; 1180 // image {
1176 // .choice-left { 1181 // margin-right: 25rpx;
1177 // width: 210rpx; 1182 // }
1178 // .p11 { 1183 // }
1179 // font-size: 14px; 1184 // .picker {
1180 // color: #333333; 1185 // display: flex;
1181 // letter-spacing: -0.26px; 1186 // flex-direction: column;
1182 // text-align: justify; 1187 // justify-content: center;
1183 // line-height: 24px; 1188 // align-items: center;
1184 // } 1189 // width: 100%;
1185 // .p12 { 1190 // image {
1186 // font-size: 10px; 1191 // width: 10px;
1187 // color: #3f3f3f; 1192 // height: 10px;
1188 // letter-spacing: -0.19px; 1193 // margin-right: 5px;
1189 // text-align: justify; 1194 // }
1190 // line-height: 24px; 1195 // .picker-choice {
1191 // } 1196 // display: flex;
1192 // } 1197 // width: 684rpx;
1193 // .p13 { 1198 // align-items: center;
1194 // font-size: 10px; 1199 // margin-bottom: 40rpx;
1195 // color: #999999; 1200 // .choice-left {
1196 // letter-spacing: -0.19px; 1201 // width: 210rpx;
1197 // margin-right: 10px; 1202 // .p11 {
1198 // } 1203 // font-size: 14px;
1199 // .p13-date { 1204 // color: #333333;
1200 // font-size: 10px; 1205 // letter-spacing: -0.26px;
1201 // color: #999999; 1206 // text-align: justify;
1202 // letter-spacing: -0.19px; 1207 // line-height: 24px;
1203 // margin-right: 5px; 1208 // }
1204 // } 1209 // .p12 {
1205 // .p14 { 1210 // font-size: 10px;
1206 // font-size: 14px; 1211 // color: #3f3f3f;
1207 // color: #666666; 1212 // letter-spacing: -0.19px;
1208 // letter-spacing: -0.26px; 1213 // text-align: justify;
1209 // text-align: center; 1214 // line-height: 24px;
1210 // width: 124rpx; 1215 // }
1211 // border-bottom: 1px solid #cfcfcf; 1216 // }
1212 // } 1217 // .p13 {
1213 // } 1218 // font-size: 10px;
1214 // } 1219 // color: #999999;
1215 // } 1220 // letter-spacing: -0.19px;
1216 .goods-form { 1221 // margin-right: 10px;
1217 display: flex; 1222 // }
1218 flex-direction: column; 1223 // .p13-date {
1219 align-items: center; 1224 // font-size: 10px;
1220 justify-content: center; 1225 // color: #999999;
1221 background-color: #fff; 1226 // letter-spacing: -0.19px;
1222 width: 100%; 1227 // margin-right: 5px;
1223 padding: 40rpx 0; 1228 // }
1224 .p1 { 1229 // .p14 {
1225 font-size: 16px; 1230 // font-size: 14px;
1226 color: #333333; 1231 // color: #666666;
1227 letter-spacing: -0.3px; 1232 // letter-spacing: -0.26px;
1228 text-align: justify; 1233 // text-align: center;
1229 line-height: 24px; 1234 // width: 124rpx;
1230 margin: 4px 0; 1235 // border-bottom: 1px solid #cfcfcf;
1231 1236 // }
1232 } 1237 // }
1233 .p2 { 1238 // }
1234 font-size: 12px; 1239 // }
1235 color: #999999; 1240 .goods-form {
1236 letter-spacing: -0.23px; 1241 display: flex;
1237 margin-bottom: 32rpx; 1242 flex-direction: column;
1238 } 1243 align-items: center;
1239 .image2{ 1244 justify-content: center;
1240 width: 42rpx; 1245 background-color: #fff;
1241 height: 34rpx; 1246 width: 100%;
1242 margin-right: 12rpx; 1247 padding: 40rpx 0;
1243 } 1248 .p1 {
1244 .confirm { 1249 font-size: 16px;
1245 display: flex; 1250 color: #333333;
1246 align-items: center; 1251 letter-spacing: -0.3px;
1247 font-size: 12px; 1252 text-align: justify;
1248 color: #666666; 1253 line-height: 24px;
1249 letter-spacing: -0.23px; 1254 margin: 4px 0;
1250 width: 684rpx; 1255
1251 .image1{ 1256 }
1252 margin-right:25rpx; 1257 .p2 {
1253 width: 42rpx; 1258 font-size: 12px;
1254 height: 38rpx; 1259 color: #999999;
1255 } 1260 letter-spacing: -0.23px;
1256 } 1261 margin-bottom: 32rpx;
1257 .picker{ 1262 }
1258 display: flex; 1263 .image2{
1259 flex-direction: column; 1264 width: 42rpx;
1260 justify-content: center; 1265 height: 34rpx;
1261 align-items: center; 1266 margin-right: 12rpx;
1262 width: 100%; 1267 }
1263 1268 .confirm {
1264 .picker-choice{ 1269 display: flex;
1265 display: flex; 1270 align-items: center;
1266 width: 684rpx; 1271 font-size: 12px;
1267 align-items: center; 1272 color: #666666;
1268 margin-bottom: 40rpx; 1273 letter-spacing: -0.23px;
1269 .input{ 1274 width: 684rpx;
1270 border-bottom: 1px solid #CFCFCF; 1275 .image1{
1271 height: 40rpx; 1276 margin-right:25rpx;
1272 } 1277 width: 42rpx;
1273 .choice-left{ 1278 height: 38rpx;
1274 width: 210rpx; 1279 }
1275 .pd{ 1280 }
1276 font-size: 14px; 1281 .picker{
1277 color: #333333; 1282 display: flex;
1278 letter-spacing: -0.26px; 1283 flex-direction: column;
1279 text-align: justify; 1284 justify-content: center;
1280 line-height: 24px; 1285 align-items: center;
1281 margin-right: 44rpx; 1286 width: 100%;
1282 } 1287
1283 .p11 { 1288 .picker-choice{
1284 font-size: 14px; 1289 display: flex;
1285 color: #333333; 1290 width: 684rpx;
1286 letter-spacing: -0.26px; 1291 align-items: center;
1287 text-align: justify; 1292 margin-bottom: 40rpx;
1288 line-height: 24px; 1293 .input{
1289 // margin-right: 10px; 1294 border-bottom: 1px solid #CFCFCF;
1290 } 1295 height: 40rpx;
1291 .p12 { 1296 }
1292 font-size: 10px; 1297 .choice-left{
1293 color: #3F3F3F; 1298 width: 210rpx;
1294 letter-spacing: -0.19px; 1299 .pd{
1295 text-align: justify; 1300 font-size: 14px;
1296 line-height: 24px; 1301 color: #333333;
1297 } 1302 letter-spacing: -0.26px;
1298 1303 text-align: justify;
1299 1304 line-height: 24px;
1300 } 1305 margin-right: 44rpx;
1301 .p13 { 1306 }
1302 font-size: 10px; 1307 .p11 {
1303 color: #999999; 1308 font-size: 14px;
1304 letter-spacing: -0.19px; 1309 color: #333333;
1305 margin-right: 10px; 1310 letter-spacing: -0.26px;
1306 } 1311 text-align: justify;
1307 .p13-date { 1312 line-height: 24px;
1308 font-size: 10px; 1313 // margin-right: 10px;
1309 color: #999999; 1314 }
1310 letter-spacing: -0.19px; 1315 .p12 {
1311 margin-right: 5px; 1316 font-size: 10px;
1312 } 1317 color: #3F3F3F;
1313 picker{ 1318 letter-spacing: -0.19px;
1314 width: 144rpx; 1319 text-align: justify;
1315 height: 40rpx; 1320 line-height: 24px;
1316 display: flex; 1321 }
1317 position: relative; 1322
1318 .p14 { 1323
1319 font-size: 14px; 1324 }
1320 color: #666666; 1325 .p13 {
1321 letter-spacing: -0.26px; 1326 font-size: 10px;
1322 text-align: center; 1327 color: #999999;
1323 width: 124rpx; 1328 letter-spacing: -0.19px;
1324 border-bottom: 1px solid #CFCFCF; 1329 margin-right: 10px;
1325 height: 38rpx; 1330 }
1326 } 1331 .p13-date {
1327 image{ 1332 font-size: 10px;
1328 width: 20rpx; 1333 color: #999999;
1329 height: 20rpx; 1334 letter-spacing: -0.19px;
1330 position: absolute; 1335 margin-right: 5px;
1331 right: 20rpx; 1336 }
1332 top: 8rpx; 1337 picker{
1333 } 1338 width: 144rpx;
1334 } 1339 height: 40rpx;
1335 1340 display: flex;
1336 1341 position: relative;
1337 } 1342 .p14 {
1338 } 1343 font-size: 14px;
1339 } 1344 color: #666666;
1340 } 1345 letter-spacing: -0.26px;
1341 } 1346 text-align: center;
1342 .choose { 1347 width: 124rpx;
1343 width: 100%; 1348 border-bottom: 1px solid #CFCFCF;
1344 background: #ffffff; 1349 height: 38rpx;
1345 border-radius: 12rpx; 1350 }
1346 margin-top: 20rpx; 1351 image{
1347 padding: 40rpx 40rpx 112rpx 40rpx; 1352 width: 20rpx;
1348 box-sizing: border-box; 1353 height: 20rpx;
1349 .chooseItem { 1354 position: absolute;
1350 width: 100%; 1355 right: 20rpx;
1351 padding-bottom: 32rpx; 1356 top: 8rpx;
1352 border-bottom: 1px solid #e9e9e9; 1357 }
1353 margin-bottom: 28rpx; 1358 }
1354 } 1359
1355 .chooseRes { 1360
1356 font-size: 12px; 1361 }
1357 color: #666666; 1362 }
1358 } 1363 }
1359 .itemsWrap { 1364 }
1360 display: flex; 1365 }
1361 flex-direction: row; 1366 .choose {
1362 flex-wrap: wrap; 1367 width: 100%;
1363 justify-content: flex-start; 1368 background: #ffffff;
1364 align-items: center; 1369 border-radius: 12rpx;
1365 padding-top: 24rpx; 1370 margin-top: 20rpx;
1366 .item1 { 1371 padding: 40rpx 40rpx 112rpx 40rpx;
1367 width: 64rpx; 1372 box-sizing: border-box;
1368 height: 64rpx; 1373 .chooseItem {
1369 border-radius: 32rpx; 1374 width: 100%;
1370 margin: 0 36rpx 24rpx 0; 1375 padding-bottom: 32rpx;
1371 transition: all 0.3s; 1376 border-bottom: 1px solid #e9e9e9;
1372 border: 1px solid #ffffff; 1377 margin-bottom: 28rpx;
1373 } 1378 }
1374 .item2 { 1379 .chooseRes {
1375 // width: 100rpx; 1380 font-size: 12px;
1376 padding: 0 30rpx; 1381 color: #666666;
1377 height: 60rpx; 1382 }
1378 margin: 0 20rpx 20rpx 0; 1383 .itemsWrap {
1379 transition: all 0.3s; 1384 display: flex;
1380 background: #f2f2f2; 1385 flex-direction: row;
1381 border-radius: 2px; 1386 flex-wrap: wrap;
1382 border-radius: 2px; 1387 justify-content: flex-start;
1383 line-height: 60rpx; 1388 align-items: center;
1384 text-align: center; 1389 padding-top: 24rpx;
1385 color: #666666; 1390 .item1 {
1386 font-size: 12px; 1391 width: 64rpx;
1387 } 1392 height: 64rpx;
1388 .active1 { 1393 border-radius: 32rpx;
1389 opacity: 0.7; 1394 margin: 0 36rpx 24rpx 0;
1390 border: 1px solid #ff6b4a; 1395 transition: all 0.3s;
1391 } 1396 border: 1px solid #ffffff;
1392 .active2 { 1397 }
1393 background: rgba(255, 107, 74, 0.15); 1398 .item2 {
1394 color: #ff6b4a; 1399 // width: 100rpx;
1395 } 1400 padding: 0 30rpx;
1396 } 1401 height: 60rpx;
1397 } 1402 margin: 0 20rpx 20rpx 0;
1398 .button { 1403 transition: all 0.3s;
1399 width: 100%; 1404 background: #f2f2f2;
1400 height: 112rpx; 1405 border-radius: 2px;
1401 background-color: #ff6b4a; 1406 border-radius: 2px;
1402 font-size: 16px; 1407 line-height: 60rpx;
1403 color: #ffffff; 1408 text-align: center;
1404 line-height: 112rpx; 1409 color: #666666;
1405 text-align: center; 1410 font-size: 12px;
1406 position: fixed; 1411 }
1407 bottom: 0; 1412 .active1 {
1408 left: 0; 1413 opacity: 0.7;
1409 } 1414 border: 1px solid #ff6b4a;
1410 } 1415 }
1411 </style> 1416 .active2 {
1412 1417 background: rgba(255, 107, 74, 0.15);
1418 color: #ff6b4a;
1419 }
1420 }
1421 }
1422 .button {
1423 width: 100%;
1424 height: 112rpx;
1425 background-color: #ff6b4a;
1426 font-size: 16px;
1427 color: #ffffff;
1428 line-height: 112rpx;
1429 text-align: center;
1430 position: fixed;
1431 bottom: 0;
1432 left: 0;
1433 }
1434 }
1435 </style>
1436
src/store/modules/cart.js
Diff comments   View file @25c2e9d
1 import urlAlias from '../url' 1 import urlAlias from '../url'
2 import request from '../request' 2 import request from '../request'
3 3
4 const { cartList, cartModi, cartDel, cartAdd } = urlAlias 4 const { cartList, cartModi, cartDel, cartAdd } = urlAlias
5 5
6 const state = { 6 const state = {
7 cartList: [] 7 cartList: []
8 } 8 }
9 9
10 const mutations = { 10 const mutations = {
11 INIT: (state, cartList) => { 11 INIT: (state, cartList) => {
12 state.cartList = cartList 12 state.cartList = cartList
13 }, 13 },
14 DEL: (state, index) => { 14 DEL: (state, index) => {
15 console.log('mutations====>', state.cartList) 15 console.log('mutations====>', state.cartList)
16 state.cartList.splice(index, 1) 16 state.cartList.splice(index, 1)
17 console.log('mutations====>index', index) 17 console.log('mutations====>index', index)
18 // state.cartList=delList 18 // state.cartList=delList
19 }, 19 },
20 MODI: (state, args) => { 20 MODI: (state, args) => {
21 console.log('the num', state.cartList[args.index].num) 21 console.log('the num', state.cartList[args.index].num)
22 console.log('mutations====>isadd', args) 22 console.log('mutations====>isadd', args)
23 state.cartList[args.index].num = args.num 23 state.cartList[args.index].num = args.num
24 console.log('the num', state.cartList[args.index].num) 24 console.log('the num', state.cartList[args.index].num)
25 } 25 }
26 26
27 } 27 }
28 28
29 const actions = { 29 const actions = {
30 getCartList({ commit }, param) { 30 getCartList({ commit }, param) {
31 request({ 31 request({
32 url: cartList, 32 url: cartList,
33 data: param, 33 data: param,
34 success: (res) => { 34 success: (res) => {
35 console.log('cart===>接口数据', res.data.data) 35 console.log('cart===>接口数据', res.data.data)
36 // const resData = { 36 // const resData = {
37 // ...res, 37 // ...res,
38 // data, 38 // data,
39 // } 39 // }
40 commit('INIT', res.data.data) 40 commit('INIT', res.data.data)
41 }, 41 },
42 fail: (res) => { 42 fail: (res) => {
43 console.log('fail status === > ', res) 43 console.log('fail status === > ', res)
44 }, 44 },
45 complete: (res) => { 45 complete: (res) => {
46 console.log('complete status === > ', res) 46 console.log('complete status === > ', res)
47 } 47 }
48 }) 48 })
49 }, 49 },
50 50
51 modiCart({ commit }, param) { 51 modiCart({ commit }, param) {
52 const arg = Object.assign({ num: param.num }, param.args) 52 const arg = Object.assign({ num: param.num }, param.args)
53 delete param.args 53 delete param.args
54 request({ 54 request({
55 url: cartModi, 55 url: cartModi,
56 data: param, 56 data: param,
57 success: (res) => { 57 success: (res) => {
58 console.log('modiCart-res=====>',res.data) 58 console.log('modiCart-res=====>', res.data)
59 console.log('modi-parm', param) 59 console.log('modi-parm', param)
60 commit('MODI', arg) 60 commit('MODI', arg)
61 }, 61 },
62 fail: (res) => { 62 fail: (res) => {
63 console.log('fail status === > ', res) 63 console.log('fail status === > ', res)
64 }, 64 },
65 complete: (res) => { 65 complete: (res) => {
66 console.log('complete status === > ', res) 66 console.log('complete status === > ', res)
67 } 67 }
68 }) 68 })
69 }, 69 },
70 70
71 delCart({ commit }, param) { 71 delCart({ commit }, param) {
72 const arg = param.arg 72 const arg = param.arg
73 delete param.arg 73 delete param.arg
74 request({ 74 request({
75 url: cartDel, 75 url: cartDel,
76 data: param, 76 data: param,
77 success: (res) => { 77 success: (res) => {
78 console.log('del-parm', param) 78 console.log('del-parm', param)
79 console.log('del-myparms==>', arg) 79 console.log('del-myparms==>', arg)
80 // console.log('deacart====>cartList',this.$store.state.cart.cartList) 80 // console.log('deacart====>cartList',this.$store.state.cart.cartList)
81 81
82 commit('DEL', arg) 82 commit('DEL', arg)
83 }, 83 },
84 fail: (res) => { 84 fail: (res) => {
85 console.log('fail status === > ', res) 85 console.log('fail status === > ', res)
86 }, 86 },
87 complete: (res) => { 87 complete: (res) => {
88 console.log('complete status === > ', res) 88 console.log('complete status === > ', res)
89 } 89 }
90 }) 90 })
91 }, 91 },
92 92
93 addCart({ commit }, param) { 93 addCart({ commit }, param) {
94 console.log('请求接口开始') 94 console.log('请求接口开始')
95 request({ 95 request({
96 url: cartAdd, 96 url: cartAdd,
97 data: param, 97 data: param,
98 success: (res) => { 98 success: (res) => {
99 console.log('add-parm', param) 99 console.log('add-parm', param)
100 console.log('addcart===>res.data===>', res.data) 100 console.log('addcart===>res.data===>', res.data)
101 // commit('INIT', res.data.data) 101 // commit('INIT', res.data.data)
102 }, 102 },
103 fail: (res) => { 103 fail: (res) => {
104 console.log('fail status === > ', res) 104 console.log('fail status === > ', res)
105 }, 105 },
106 complete: (res) => { 106 complete: (res) => {
107 console.log('complete status === > ', res) 107 console.log('complete status === > ', res)
108 } 108 }
109 }) 109 })
110 } 110 }
111 111
112 } 112 }
113 113
114 export default { 114 export default {
115 namespaced: true, 115 namespaced: true,
116 state, 116 state,
117 mutations, 117 mutations,
118 actions 118 actions
119 } 119 }
120 120