刘文博 / gulu-vue

Download as
Browse Code »

Commit 089dce19da0a1073daa2d196144ffda8ef050f50

Authored by 范牧
1 parent 5f77f7e7e6
Exists in master

支付修改

Showing 10 changed files with 793 additions and 722 deletions   Show diff stats
1 module.exports = { 1 module.exports = {
2 "env": { 2 "env": {
3 "browser": true, 3 "browser": true,
4 "es6": true 4 "es6": true
5 }, 5 },
6 "extends": [ 6 "extends": [
7 'standard', 7 'standard',
8 "eslint:recommended", 8 "eslint:recommended",
9 "plugin:vue/essential", 9 "plugin:vue/essential",
10 "plugin:@typescript-eslint/eslint-recommended", 10 "plugin:@typescript-eslint/eslint-recommended",
11 ], 11 ],
12 "globals": { 12 "globals": {
13 "Atomics": "readonly", 13 "Atomics": "readonly",
14 "SharedArrayBuffer": "readonly", 14 "SharedArrayBuffer": "readonly",
15 "uni": true, 15 "uni": true,
16 "module": true 16 "module": true
17 }, 17 },
18 "parserOptions": { 18 "parserOptions": {
19 "ecmaVersion": 11, 19 "ecmaVersion": 11,
20 "parser": "@typescript-eslint/parser", 20 "parser": "@typescript-eslint/parser",
21 "sourceType": "module" 21 "sourceType": "module"
22 }, 22 },
23 "plugins": [ 23 "plugins": [
24 "vue", 24 "vue",
25 "@typescript-eslint" 25 "@typescript-eslint"
26 ], 26 ],
27 "rules": { 27 "rules": {
28 quotes: ['error', 'single'], 28 quotes: ['error', 'single'],
29 'space-before-function-paren': 0 29 'space-before-function-paren': 0,
30 // 数组和对象键值对最后一个逗号， never参数：不能带末尾的逗号, always参数：必须带末尾的逗号，
31 // always-multiline：多行模式必须带逗号，单行模式不能带逗号
32 "comma-dangle": [2, "always-multiline"],
33 // 控制逗号前后的空格
34 "comma-spacing": [2, { "before": false, "after": true }],
35 // 控制逗号在行尾出现还是在行首出现
36 // http://eslint.org/docs/rules/comma-style
37 "comma-style": [2, "last"],
30 } 38 }
31 }; 39 };
32 40
src/components/CommodityCard/CommodityCard.vue
Diff comments   View file @089dce1
1 <template> 1 <template>
2 <view 2 <view
3 class="card" 3 class="card"
4 @tap="toGoods(goods.id?goods.id:goods.pid)" 4 @tap="toGoods(goods.id?goods.id:goods.pid)"
5 > 5 >
6 <image 6 <image
7 mode="widthFix" 7 mode="widthFix"
8 :src="goods.imgurl?goods.imgurl:goods.pic" 8 :src="goods.imgurl?goods.imgurl:goods.pic"
9 ></image> 9 ></image>
10 <view class="name">{{goods.name?goods.name:goods.p_name}}</view> 10 <view class="name">{{goods.name?goods.name:goods.p_name}}</view>
11 <view class="info"> 11 <view class="info">
12 <view class="priceBox"> 12 <view class="priceBox">
13 <view class="price">{{goods.oldPrice !== undefined?goods.oldPrice:goods.old_price}}</view> 13 <view class="price">{{goods.old_price ? goods.old_price : (goods.rsSon && goods.rsSon.Min_Price)}}</view>
14 <view class="originCost"> 14 <view class="originCost">
15 {{goods.price !== undefined?goods.price:goods.real_price}} 15 <!-- {{goods.price !== undefined?goods.price:goods.real_price}} -->
16 {{goods.real_price ? goods.real_price : parseInt(goods.rsSon && goods.rsSon.Min_Price*(1 + Number(goods.rsSon.discount)/100))}}
16 </view> 17 </view>
17 </view> 18 </view>
18 <view class="trade_num">{{goods.trade_num}}人购买</view> 19 <view class="trade_num">{{goods.trade_num}}人购买</view>
19 </view> 20 </view>
20 </view> 21 </view>
21 </template> 22 </template>
22 23
23 <script> 24 <script>
24 export default { 25 export default {
25 props: { 26 props: {
26 /** 27 /**
27 * 商品数据 28 * 商品数据
28 */ 29 */
29 goods: { 30 goods: {
30 id: Number, 31 id: Number,
31 imgurl: String, 32 imgurl: String,
32 name: String, 33 name: String,
33 rsSon: Object, 34 rsSon: Object,
34 originCost: String, 35 originCost: String,
35 price: String, 36 price: String,
36 trade_num: String, 37 trade_num: String,
37 goodType: String 38 goodType: String,
38 } 39 },
39 40
40 }, 41 },
41 created () { 42 created () {
42 }, 43 },
43 data () { 44 data () {
44 return { 45 return {
45 46
46 } 47 }
47 }, 48 },
48 methods: { 49 methods: {
49 toGoods (id) { 50 toGoods (id) {
50 console.log('---', '../frameDetail/frameDetail?pid=' + id) 51 console.log('---', '../frameDetail/frameDetail?pid=' + id)
51 uni.navigateTo({ 52 uni.navigateTo({
52 url: '../frameDetail/frameDetail?pid=' + id, 53 url: '../frameDetail/frameDetail?pid=' + id,
53 success: res => {}, 54 success: res => {},
54 fail: () => {}, 55 fail: () => {},
55 complete: () => {} 56 complete: () => {},
56 }) 57 })
57 } 58 },
58 } 59 },
59 } 60 }
60 </script> 61 </script>
61 62
62 <style lang="scss"> 63 <style lang="scss">
63 image { 64 image {
64 width: 100%; 65 width: 100%;
65 height: 120rpx; 66 height: 120rpx;
66 } 67 }
67 .name { 68 .name {
68 width: 92%; 69 width: 92%;
69 height: 54rpx; 70 height: 54rpx;
70 padding: 5px 4%; 71 padding: 5px 4%;
71 display: -webkit-box; 72 display: -webkit-box;
72 -webkit-box-orient: vertical; 73 -webkit-box-orient: vertical;
73 -webkit-line-clamp: 2; 74 -webkit-line-clamp: 2;
74 text-align: justify; 75 text-align: justify;
75 overflow: hidden; 76 overflow: hidden;
76 font-size: 24rpx; 77 font-size: 24rpx;
77 color: #333333; 78 color: #333333;
78 } 79 }
79 .info { 80 .info {
80 display: flex; 81 display: flex;
81 justify-content: space-between; 82 justify-content: space-between;
82 align-items: center; 83 align-items: center;
83 width: 92%; 84 width: 92%;
84 padding: 5px 4% 5px 4%; 85 padding: 5px 4% 5px 4%;
85 .priceBox { 86 .priceBox {
86 display: flex; 87 display: flex;
87 justify-content: space-between; 88 justify-content: space-between;
88 align-items: center; 89 align-items: center;
89 .price { 90 .price {
90 color: #eb5d3b; 91 color: #eb5d3b;
91 font-size: 28rpx; 92 font-size: 28rpx;
92 font-weight: 600; 93 font-weight: 600;
93 margin-right: 10rpx; 94 margin-right: 10rpx;
94 } 95 }
95 .originCost { 96 .originCost {
96 text-decoration: line-through; 97 text-decoration: line-through;
97 color: #999999; 98 color: #999999;
98 font-size: 20rpx; 99 font-size: 20rpx;
99 } 100 }
100 } 101 }
101 .trade_num { 102 .trade_num {
102 color: #999999; 103 color: #999999;
103 font-size: 20rpx; 104 font-size: 20rpx;
104 } 105 }
105 } 106 }
106 </style> 107 </style>
107 108
src/pages/confirmOrder/confirmOrder.vue
Diff comments   View file @089dce1
1 <template> 1 <template>
2 <view class="wrap"> 2 <view class="wrap">
3 <view></view> 3 <view></view>
4 <view 4 <view
5 class="addAddress" 5 class="addAddress"
6 @tap="toaddAddress" 6 @tap="toaddAddress"
7 v-if="this.showAddress" 7 v-if="this.showAddress"
8 > 8 >
9 <view class="addIcon"> 9 <view class="addIcon">
10 <image 10 <image
11 src="../../static/add.png" 11 src="../../static/add.png"
12 mode="aspectFill" 12 mode="aspectFill"
13 ></image> 13 ></image>
14 </view> 14 </view>
15 <view class="addressText">{{addAddress}}</view> 15 <view class="addressText">{{addAddress}}</view>
16 <image 16 <image
17 src="../../static/right.png" 17 src="../../static/right.png"
18 mode="aspectFill" 18 mode="aspectFill"
19 ></image> 19 ></image>
20 </view> 20 </view>
21 <view 21 <view
22 v-else 22 v-else
23 @tap="toaddAddress" 23 @tap="toaddAddress"
24 class="list order-user" 24 class="list order-user"
25 > 25 >
26 <view class="order-user-head"> 26 <view class="order-user-head">
27 <view class="name"> 27 <view class="name">
28 <view 28 <view
29 v-if="addressInfo.default === '1'" 29 v-if="addressInfo.default === '1'"
30 class="default" 30 class="default"
31 ><text>默认</text></view>{{addressInfo.name}} 31 ><text>默认</text></view>{{addressInfo.name}}
32 </view> 32 </view>
33 <text class="mobile">{{addressInfo.mobile}}</text> 33 <text class="mobile">{{addressInfo.mobile}}</text>
34 </view> 34 </view>
35 <view class="order-user-body"> 35 <view class="order-user-body">
36 <image src="../../static/myorder-paying-location.png"></image> 36 <image src="../../static/myorder-paying-location.png"></image>
37 <text class="address">{{addressInfo.address.replace(/[-]/g,' ')}}\n{{addressInfo.add_detail}}</text> 37 <text class="address">{{addressInfo.address.replace(/[-]/g,' ')}}\n{{addressInfo.add_detail}}</text>
38 </view> 38 </view>
39 <image 39 <image
40 class="arrow" 40 class="arrow"
41 src="../../static/right.png" 41 src="../../static/right.png"
42 ></image> 42 ></image>
43 </view> 43 </view>
44 <view class="content"> 44 <view class="content">
45 <view class="orderInfo"> 45 <view class="orderInfo">
46 <view class="title"> 46 <view class="title">
47 <image 47 <image
48 src="../../static/store.png" 48 src="../../static/store.png"
49 mode="aspectFill" 49 mode="aspectFill"
50 style="width: 40rpx;height: 40rpx;" 50 style="width: 40rpx;height: 40rpx;"
51 ></image> 51 ></image>
52 <text>非常戴镜</text> 52 <text>非常戴镜</text>
53 </view> 53 </view>
54 <view class="infoBox"> 54 <view class="infoBox">
55 <view class="infoTop"> 55 <view class="infoTop">
56 <image 56 <image
57 :src="goodInfo.img_index_url" 57 :src="goodInfo.img_index_url"
58 mode="aspectFill" 58 mode="aspectFill"
59 ></image> 59 ></image>
60 <view class="infoRight"> 60 <view class="infoRight">
61 <text class="goodName">商品名称商品名称商品名称名称名称</text> 61 <text class="goodName">商品名称商品名称商品名称名称名称</text>
62 <text class="remarks">支持7天无理由退货 顺丰发货</text> 62 <text class="remarks">支持7天无理由退货 顺丰发货</text>
63 <view class="priceBox"> 63 <view class="priceBox">
64 <view class="price">￥198</view> 64 <view class="price">¥{{Number(skuInfo.real_price) * count}}<text class="originCost">
65 ¥{{parseInt(skuInfo.real_price * (1 + Number(skuInfo.discount) / 100))}}
66 </text></view>
65 <view class="counter"> 67 <view class="counter">
66 <view 68 <view
67 class="btn" 69 class="btn"
68 disabled="this.disabled" 70 disabled="this.disabled"
69 type="default" 71 type="default"
70 @click="counter(false)" 72 @click="counter(false)"
71 >-</view> 73 >-</view>
72 <text>{{count}}</text> 74 <text>{{count}}</text>
73 <view 75 <view
74 class="btn" 76 class="btn"
75 type="default" 77 type="default"
76 @click="counter(true)" 78 @click="counter(true)"
77 >+</view> 79 >+</view>
78 </view> 80 </view>
79 </view> 81 </view>
80 </view> 82 </view>
81 </view> 83 </view>
82 <view class="infoBottom"> 84 <view class="infoBottom">
83 <view class="norm">规格 <text>玫瑰金/钛合金</text></view> 85 <view class="norm">规格 <text >
86 <!-- 长度超出变省略号未做 -->
87 <block
88 v-for="(item, index) in current"
89 :key="index"
90 >{{attrList[index].attr[item].name}}<block v-if="index !== current.length -1">/</block></block>
91 </text></view>
84 <view class="shippingMethod">配送方式 <text>快递</text></view> 92 <view class="shippingMethod">配送方式 <text>快递</text></view>
85 <view class="message">买家留言 93 <view class="message">买家留言
86 <input 94 <input
87 type="text" 95 type="text"
88 :value="note" 96 :value="note"
89 placeholder="建议提前协商(50字以内)" 97 placeholder="建议提前协商(50字以内)"
90 /> 98 />
91 </view> 99 </view>
92 </view> 100 </view>
93 </view> 101 </view>
94 </view> 102 </view>
95 <view class="payWay"> 103 <view class="payWay">
96 <view class="item"> 104 <view class="item">
97 <text>支付方式</text> 105 <text>支付方式</text>
98 <view class="itemRight"> 106 <view class="itemRight">
99 <view class="rightText"> 107 <view class="rightText">
100 <view class="choosePayWay"> 108 <view class="choosePayWay">
101 <image 109 <image
102 src="../../static/store.png" 110 src="../../static/store.png"
103 mode="aspectFill" 111 mode="aspectFill"
104 ></image> 112 ></image>
105 <text>微信支付</text> 113 <text>微信支付</text>
106 </view> 114 </view>
107 <!-- <view class="randomSubstraction">最高随机立减￥99</view> --> 115 <!-- <view class="randomSubstraction">最高随机立减￥99</view> -->
108 </view> 116 </view>
109 <!-- <image 117 <!-- <image
110 src="../../static/right.png" 118 src="../../static/right.png"
111 mode="aspectFill" 119 mode="aspectFill"
112 ></image> --> 120 ></image> -->
113 </view> 121 </view>
114 </view> 122 </view>
115 <!-- <view class="item"> 123 <!-- <view class="item">
116 <text>优惠券</text> 124 <text>优惠券</text>
117 <view class="itemRight"> 125 <view class="itemRight">
118 <view class="rightText"> 126 <view class="rightText">
119 <view class="chooseOffers"> 127 <view class="chooseOffers">
120 <text>-￥70.00</text> 128 <text>-￥70.00</text>
121 </view> 129 </view>
122 <view class="preferentialWay">最大优惠</view> 130 <view class="preferentialWay">最大优惠</view>
123 </view> 131 </view>
124 <image 132 <image
125 src="../../static/right.png" 133 src="../../static/right.png"
126 mode="aspectFill" 134 mode="aspectFill"
127 ></image> 135 ></image>
128 </view> 136 </view>
129 </view> --> 137 </view> -->
130 <view class="item"> 138 <view class="item">
131 <text>运费</text> 139 <text>运费</text>
132 <view class="itemRight"> 140 <view class="itemRight">
133 <view class="freight">免运费</view> 141 <view class="freight">免运费</view>
134 </view> 142 </view>
135 </view> 143 </view>
136 <view class="item"> 144 <view class="item">
137 <text>合计</text> 145 <text>合计</text>
138 <view class="itemRight"> 146 <view class="itemRight">
139 <view class="total">￥{{total}}</view> 147 <view class="total">¥{{Number(skuInfo.real_price) * count}}</view>
140 </view> 148 </view>
141 </view> 149 </view>
142 </view> 150 </view>
143 <!-- 151 <!--
144 <view class="checkBox"> 152 <view class="checkBox">
145 <checkbox-group> 153 <checkbox-group>
146 <label> 154 <label>
147 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买 155 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买
148 </label> 156 </label>
149 </checkbox-group> 157 </checkbox-group>
150 </view> --> 158 </view> -->
151 </view> 159 </view>
152 <view class="footer"> 160 <view class="footer">
153 <view class="footerLeft">实付金额:<text>￥{{total}}</text></view> 161 <view class="footerLeft">实付金额:<text>¥{{Number(skuInfo.real_price) * count}}</text></view>
154 <view class="footerRight"> 162 <view class="footerRight">
155 <view 163 <view
156 class="paybtn" 164 class="paybtn"
157 @tap="orderBuild" 165 @tap="orderBuild"
158 >立即支付</view> 166 >立即支付</view>
159 </view> 167 </view>
160 </view> 168 </view>
161 </view> 169 </view>
162 </template> 170 </template>
163 171
164 <script> 172 <script>
165 import store from '@/store' 173 import store from '@/store'
166 174
167 export default { 175 export default {
168 data() { 176 data() {
169 return { 177 return {
170 addAddress: '添加收货地址', 178 addAddress: '添加收货地址',
171 count: 1, 179 count: 1,
172 pid: 0, 180 pid: 0,
173 disabled: false, 181 disabled: false,
174 total: 120,
175 freight: 0.00, 182 freight: 0.00,
176 showAddress: false, 183 showAddress: false,
177 note: '', 184 note: '',
178 addressInfo: { 185 addressInfo: {
179 address: '' 186 address: '',
180 } 187 },
181 // isAnonymous: 188 // isAnonymous:
182 } 189 }
183 }, 190 },
184 onLoad({ pid, addressId }) { 191 onLoad({ pid, addressId, isCart }) {
185 this.pid = pid 192 this.pid = pid
186 // 若已经选择地址 193 // 若已经选择地址
187 if (addressId) { 194 if (addressId) {
188 store.dispatch('address/details', { 195 store.dispatch('address/details', {
189 add_id: addressId 196 add_id: addressId,
190 }).then(({ code, data }) => { 197 }).then(({ code, data }) => {
191 if (code === 1) { 198 if (code === 1) {
192 console.log('code', code, data) 199 console.log('code', code, data)
193 this.showAddress = true 200 this.showAddress = true
194 this.addressInfo = data 201 this.addressInfo = data
195 } 202 }
196 }) 203 })
197 } else { 204 } else {
198 store.dispatch('address/default').then(({ code, data }) => { 205 store.dispatch('address/default').then(({ code, data }) => {
199 if (code === 1) { 206 if (code === 1) {
200 console.log('code', code, data) 207 console.log('code', code, data)
201 this.showAddress = true 208 this.showAddress = true
202 this.addressInfo = data 209 this.addressInfo = data
203 } 210 }
204 }) 211 })
205 } 212 }
206 store.dispatch('read/fetch', { 213 store.dispatch('read/fetch', {
207 pid 214 pid,
208 }) 215 })
209 }, 216 },
210 computed: { 217 computed: {
211 goodInfo () { 218 goodInfo () {
212 console.log(this.$store.state.read.goodInfo) 219 console.log('state', this.$store.state)
213 return this.$store.state.read.goodInfo 220 return this.$store.state.read.goodInfo
214 } 221 },
222 skuInfo () {
223 return this.$store.state.order.param.sk_id_arr
224 },
225 attrList () {
226 return this.$store.state.order.param.attrList
227 },
228 current () {
229 return this.$store.state.order.param.current
230 },
215 }, 231 },
216 methods: { 232 methods: {
217 counter(isadd) { 233 counter(isadd) {
218 if (isadd) { 234 if (isadd) {
219 this.count++ 235 this.count++
220 } else { 236 } else {
221 this.count <= 1 ? this.disabled = true : this.count-- 237 this.count <= 1 ? this.disabled = true : this.count--
222 } 238 }
223 }, 239 },
240 // 跳转添加地址页面
224 toaddAddress() { 241 toaddAddress() {
225 uni.navigateTo({ 242 uni.navigateTo({
226 url: `../address/addressList?edit=${1}`, 243 url: `../address/addressList?edit=${1}`,
227 success: res => {}, 244 success: res => {},
228 fail: (error) => { console.log('跳转到地址列表页面失败====>', error) }, 245 fail: (error) => { console.log('跳转到地址列表页面失败====>', error) },
229 complete: () => {} 246 complete: () => {},
230 }) 247 })
231 }, 248 },
232 // 下单 249 // 下单
233 orderBuild() { 250 orderBuild() {
234 console.log('this', this.$store.state) 251 console.log('this', this.$store.state)
235 // store.dispatch('order/build', { 252 const { sk_id_arr: skId, mp_id: mpId } = this.$store.state.order.param
236 // pid: 2, 253 store.dispatch('order/buyNow', {
237 // sk_id: '23', 254 pid: skId.pid,
238 // number: 2, 255 sk_id: skId.sk_id,
239 // mp_id: '201', 256 number: this.count,
240 // totalPrice: 101, 257 mp_id: mpId,
241 // address: this.addressInfo, 258 address: JSON.stringify(this.addressInfo),
242 // dir: 1 259 totalPrice: Number(this.skuInfo.real_price) * this.count * 100,
243 // }) 260 liuyan: this.note,
244 } 261 dir: 1,
262 }).then((res) => {
263 this.pay(res.data)
264 })
265 },
245 // 支付 266 // 支付
246 // pay() { 267 pay(res) {
247 // const openId = uni.getStorageSync('openid') 268 console.log('pay', res)
248 // const fieldSet = { 269 const { data, exKeyName: keyName } = res
249 // 'openid': this.$store.state.user.userInfo.openid, 270 const uid = uni.getStorageSync('uid')
250 // 'uid': this.$store.state.user.userInfo.uid, 271 const fieldSet = {
251 // 'shopid': 0, 272 openid: this.$store.state.user.userInfo.openid,
252 // 'payCate': 2020, 273 uid: this.$store.state.user.userInfo.uid,
253 // 'payMoney': , 274 shopid: 0,
254 // '' 275 payCate: 2020,
255 // } 276 payMoney: Number(this.skuInfo.real_price) * this.count * 100,
256 // } 277 payWoodId: `fcdj-${uid}-${keyName}`,
257 } 278 nonceStr: 'asfafasfasfasfasf',
279 signType: 'MD5',
280 app_uid: 2020,
281 timeStamp: new Date().getTime().toString(),
282 billInfo: JSON.stringify(data),
283 keyname: keyName,
284 }
285 console.log('fieldSet', fieldSet)
286 store.dispatch('order/pay', fieldSet).then((res) => {
287 console.log('res', res)
288 })
289 },
290 },
258 } 291 }
259 </script> 292 </script>
260 293
261 <style lang="scss"> 294 <style lang="scss">
262 .wrap { 295 .wrap {
263 height: 100vh; 296 height: 100vh;
264 background-color: #f2f2f2; 297 background-color: #f2f2f2;
265 font-family: PingFangSC-Regular; 298 font-family: PingFangSC-Regular;
266 letter-spacing: -0.23px; 299 letter-spacing: -0.23px;
267 position: absolute; 300 position: absolute;
268 } 301 }
269 .addAddress { 302 .addAddress {
270 background-color: #ffffff; 303 background-color: #ffffff;
271 box-sizing: border-box; 304 box-sizing: border-box;
272 height: 124rpx; 305 height: 124rpx;
273 width: 100%; 306 width: 100%;
274 display: flex; 307 display: flex;
275 align-items: center; 308 align-items: center;
276 padding: 0 40rpx; 309 padding: 0 40rpx;
277 .addIcon { 310 .addIcon {
278 background-color: #f2f2f2; 311 background-color: #f2f2f2;
279 height: 56rpx; 312 height: 56rpx;
280 width: 60rpx; 313 width: 60rpx;
281 border-radius: 4rpx; 314 border-radius: 4rpx;
282 display: flex; 315 display: flex;
283 justify-content: center; 316 justify-content: center;
284 align-items: center; 317 align-items: center;
285 margin-right: 40rpx; 318 margin-right: 40rpx;
286 } 319 }
287 image { 320 image {
288 height: 28rpx; 321 height: 28rpx;
289 width: 28rpx; 322 width: 28rpx;
290 } 323 }
291 .addressText { 324 .addressText {
292 font-size: 28rpx; 325 font-size: 28rpx;
293 color: #333333; 326 color: #333333;
294 margin-right: 364rpx; 327 margin-right: 364rpx;
295 } 328 }
296 } 329 }
297 .content { 330 .content {
298 background-color: #f2f2f2; 331 background-color: #f2f2f2;
299 width: 100%; 332 width: 100%;
300 display: flex; 333 display: flex;
301 flex-direction: column; 334 flex-direction: column;
302 justify-content: center; 335 justify-content: center;
303 align-items: center; 336 align-items: center;
304 padding: 40rpx; 337 padding: 40rpx;
305 box-sizing: border-box; 338 box-sizing: border-box;
306 .orderInfo { 339 .orderInfo {
307 width: 670rpx; 340 width: 670rpx;
308 height: 488rpx; 341 height: 488rpx;
309 background-color: #ffffff; 342 background-color: #ffffff;
310 border-radius: 20rpx; 343 border-radius: 20rpx;
311 box-sizing: border-box; 344 box-sizing: border-box;
312 padding: 0 40rpx 40rpx 40rpx; 345 padding: 0 40rpx 40rpx 40rpx;
313 .title { 346 .title {
314 display: flex; 347 display: flex;
315 align-items: center; 348 align-items: center;
316 font-size: 28rpx; 349 font-size: 28rpx;
317 color: #333333; 350 color: #333333;
318 height: 60rpx; 351 height: 60rpx;
319 line-height: 40rpx; 352 line-height: 40rpx;
320 padding: 10rpx 10rpx 10rpx 0rpx; 353 padding: 10rpx 10rpx 10rpx 0rpx;
321 image { 354 image {
322 margin-right: 20rpx; 355 margin-right: 20rpx;
323 } 356 }
324 } 357 }
325 .infoBox { 358 .infoBox {
326 margin-top: 42rpx; 359 margin-top: 42rpx;
327 .infoTop { 360 .infoTop {
328 display: flex; 361 display: flex;
329 flex-direction: row; 362 flex-direction: row;
330 image { 363 image {
331 height: 188rpx; 364 height: 188rpx;
332 width: 188rpx; 365 width: 188rpx;
333 margin-right: 24rpx; 366 margin-right: 24rpx;
334 } 367 }
335 .infoRight { 368 .infoRight {
336 width: 374rpx; 369 width: 374rpx;
337 display: flex; 370 display: flex;
338 flex-direction: column; 371 flex-direction: column;
339 align-items: flex-start; 372 align-items: flex-start;
340 justify-content: space-between; 373 justify-content: space-between;
341 .goodName { 374 .goodName {
342 font-size: 28rpx; 375 font-size: 28rpx;
343 color: #333333; 376 color: #333333;
344 } 377 }
345 .remarks { 378 .remarks {
346 font-size: 20rpx; 379 font-size: 20rpx;
347 color: #999999; 380 color: #999999;
348 } 381 }
349 .priceBox { 382 .priceBox {
350 display: flex; 383 display: flex;
351 justify-content: space-between; 384 justify-content: space-between;
352 align-items: center; 385 align-items: center;
353 width: 100%; 386 width: 100%;
354 .price { 387 .price {
355 color: #ff6b4a; 388 color: #ff6b4a;
356 font-size: 28rpx; 389 font-size: 28rpx;
357 } 390 }
391 .originCost {
392 text-decoration: line-through;
393 color: #999999;
394 font-size: 20rpx;
395 }
358 .counter { 396 .counter {
359 display: flex; 397 display: flex;
360 flex-direction: row; 398 flex-direction: row;
361 justify-content: space-between; 399 justify-content: space-between;
362 font-size: 28rpx; 400 font-size: 28rpx;
363 color: #333333; 401 color: #333333;
364 width: 122rpx; 402 width: 122rpx;
365 .btn { 403 .btn {
366 display: flex; 404 display: flex;
367 justify-content: center; 405 justify-content: center;
368 line-height: 32rpx; 406 line-height: 32rpx;
369 height: 32rpx; 407 height: 32rpx;
370 width: 32rpx; 408 width: 32rpx;
371 background-color: #f2f2f2; 409 background-color: #f2f2f2;
372 color: #cfcfcf; 410 color: #cfcfcf;
373 } 411 }
374 } 412 }
375 } 413 }
376 } 414 }
377 } 415 }
378 .infoBottom { 416 .infoBottom {
379 display: flex; 417 display: flex;
380 flex-direction: column; 418 flex-direction: column;
381 justify-content: flex-start; 419 justify-content: flex-start;
382 font-size: 24rpx; 420 font-size: 24rpx;
383 color: #333333; 421 color: #333333;
384 text { 422 text {
385 color: #999999; 423 color: #999999;
386 margin-left: 20rpx; 424 margin-left: 20rpx;
387 } 425 }
388 426
389 .norm { 427 .norm {
390 margin-top: 28rpx; 428 margin-top: 28rpx;
391 } 429 }
392 .shippingMethod { 430 .shippingMethod {
393 margin-top: 12rpx; 431 margin-top: 12rpx;
394 } 432 }
395 .message { 433 .message {
396 display: flex; 434 display: flex;
397 flex-direction: row; 435 flex-direction: row;
398 align-items: center; 436 align-items: center;
399 margin-top: 18rpx; 437 margin-top: 18rpx;
400 input { 438 input {
401 margin-left: 20rpx; 439 margin-left: 20rpx;
402 width: 75%; 440 width: 75%;
403 } 441 }
404 } 442 }
405 } 443 }
406 } 444 }
407 } 445 }
408 .payWay { 446 .payWay {
409 height: 464rpx; 447 height: 464rpx;
410 width: 670rpx; 448 width: 670rpx;
411 background-color: #ffffff; 449 background-color: #ffffff;
412 color: #333333; 450 color: #333333;
413 font-size: 24rpx; 451 font-size: 24rpx;
414 border-radius: 20rpx; 452 border-radius: 20rpx;
415 box-sizing: border-box; 453 box-sizing: border-box;
416 padding: 0 52rpx 0rpx 40rpx; 454 padding: 0 52rpx 0rpx 40rpx;
417 margin-top: 20rpx; 455 margin-top: 20rpx;
418 display: flex; 456 display: flex;
419 flex-direction: column; 457 flex-direction: column;
420 justify-content: center; 458 justify-content: center;
421 align-items: flex-start; 459 align-items: flex-start;
422 .item { 460 .item {
423 display: flex; 461 display: flex;
424 flex-direction: row; 462 flex-direction: row;
425 justify-content: space-between; 463 justify-content: space-between;
426 align-items: center; 464 align-items: center;
427 width: 100%; 465 width: 100%;
428 height: 115rpx; 466 height: 115rpx;
429 .itemRight { 467 .itemRight {
430 display: flex; 468 display: flex;
431 flex-direction: row; 469 flex-direction: row;
432 justify-content: space-between; 470 justify-content: space-between;
433 align-items: center; 471 align-items: center;
434 image { 472 image {
435 height: 24rpx; 473 height: 24rpx;
436 width: 12rpx; 474 width: 12rpx;
437 } 475 }
438 .rightText { 476 .rightText {
439 margin-right: 20rpx; 477 margin-right: 20rpx;
440 text-align: right; 478 text-align: right;
441 .choosePayWay { 479 .choosePayWay {
442 text { 480 text {
443 color: #333333; 481 color: #333333;
444 } 482 }
445 image { 483 image {
446 height: 26rpx; 484 height: 26rpx;
447 width: 30rpx; 485 width: 30rpx;
448 margin-right: 20px; 486 margin-right: 20px;
449 } 487 }
450 } 488 }
451 .randomSubstraction { 489 .randomSubstraction {
452 color: #ff6b4a; 490 color: #ff6b4a;
453 } 491 }
454 .preferentialWay { 492 .preferentialWay {
455 color: #999999; 493 color: #999999;
456 } 494 }
457 } 495 }
458 .freight, 496 .freight,
459 .total { 497 .total {
460 margin-right: 32rpx; 498 margin-right: 32rpx;
461 } 499 }
462 text { 500 text {
463 color: #ff6b4a; 501 color: #ff6b4a;
464 } 502 }
465 } 503 }
466 } 504 }
467 } 505 }
468 // .checkBox { 506 // .checkBox {
469 // height: 58rpx; 507 // height: 58rpx;
470 // line-height: 58rpx; 508 // line-height: 58rpx;
471 // width: 100%; 509 // width: 100%;
472 // margin-top: 36rpx; 510 // margin-top: 36rpx;
473 // margin-left: 40rpx; 511 // margin-left: 40rpx;
474 // font-size: 12px; 512 // font-size: 12px;
475 // color: #999999; 513 // color: #999999;
476 // } 514 // }
477 } 515 }
478 .footer { 516 .footer {
479 height: 112rpx; 517 height: 112rpx;
480 width: 100%; 518 width: 100%;
481 background-color: #fff; 519 background-color: #fff;
482 font-size: 16px; 520 font-size: 16px;
483 display: flex; 521 display: flex;
484 justify-content: space-between; 522 justify-content: space-between;
485 align-items: center; 523 align-items: center;
486 position: fixed; 524 position: fixed;
487 bottom: 0; 525 bottom: 0;
488 .footerLeft { 526 .footerLeft {
489 display: flex; 527 display: flex;
490 justify-content: center; 528 justify-content: center;
491 align-items: center; 529 align-items: center;
492 width: 50%; 530 width: 50%;
493 color: #333333; 531 color: #333333;
494 text { 532 text {
495 color: #ff6b4a; 533 color: #ff6b4a;
496 } 534 }
497 } 535 }
498 .footerRight { 536 .footerRight {
499 display: flex; 537 display: flex;
500 justify-content: flex-end; 538 justify-content: flex-end;
501 align-items: center; 539 align-items: center;
502 width: 50%; 540 width: 50%;
503 margin-right: 26rpx; 541 margin-right: 26rpx;
504 .paybtn { 542 .paybtn {
505 display: flex; 543 display: flex;
506 justify-content: center; 544 justify-content: center;
507 align-items: center; 545 align-items: center;
508 background: #ff6b4a; 546 background: #ff6b4a;
509 border-radius: 20px; 547 border-radius: 20px;
510 border-radius: 20px; 548 border-radius: 20px;
511 color: #ffffff; 549 color: #ffffff;
512 width: 204rpx; 550 width: 204rpx;
513 height: 80rpx; 551 height: 80rpx;
514 } 552 }
515 } 553 }
516 } 554 }
517 // 地址信息样式 555 // 地址信息样式
518 .order-user { 556 .order-user {
519 width: 670rpx; 557 width: 670rpx;
520 height: 228rpx; 558 height: 228rpx;
521 background: #ffffff; 559 background: #ffffff;
522 border-radius: 14rpx; 560 border-radius: 14rpx;
523 margin: 0 auto; 561 margin: 0 auto;
524 margin-top: 20rpx; 562 margin-top: 20rpx;
525 position: relative; 563 position: relative;
526 .order-user-head { 564 .order-user-head {
527 display: flex; 565 display: flex;
528 height: 108rpx; 566 height: 108rpx;
529 width: 100%; 567 width: 100%;
530 align-items: center; 568 align-items: center;
531 margin-left: 126rpx; 569 margin-left: 126rpx;
532 .name { 570 .name {
533 display: flex; 571 display: flex;
534 justify-content: space-between; 572 justify-content: space-between;
535 font-size: 14px; 573 font-size: 14px;
536 color: #333333; 574 color: #333333;
537 letter-spacing: -0.26px; 575 letter-spacing: -0.26px;
538 margin-right: 20rpx; 576 margin-right: 20rpx;
539 .default { 577 .default {
540 height: 40rpx; 578 height: 40rpx;
541 width: 80rpx; 579 width: 80rpx;
542 background-color: #4a90e2; 580 background-color: #4a90e2;
543 border-radius: 13px; 581 border-radius: 13px;
544 border-radius: 13px; 582 border-radius: 13px;
545 text-align: center; 583 text-align: center;
546 margin-right: 20rpx; 584 margin-right: 20rpx;
547 text { 585 text {
548 font-size: 12px; 586 font-size: 12px;
549 color: #ffffff; 587 color: #ffffff;
550 letter-spacing: -0.23px; 588 letter-spacing: -0.23px;
551 } 589 }
552 } 590 }
553 } 591 }
554 .mobile { 592 .mobile {
555 font-size: 14px; 593 font-size: 14px;
556 color: #999999; 594 color: #999999;
557 letter-spacing: -0.26px; 595 letter-spacing: -0.26px;
558 } 596 }
559 } 597 }
560 .order-user-body { 598 .order-user-body {
561 display: flex; 599 display: flex;
562 width: 100%; 600 width: 100%;
563 image { 601 image {
564 width: 24px; 602 width: 24px;
565 height: 26px; 603 height: 26px;
566 margin: 12rpx 32rpx 0 40rpx; 604 margin: 12rpx 32rpx 0 40rpx;
567 } 605 }
568 .address { 606 .address {
569 font-weight: bold; 607 font-weight: bold;
570 font-size: 14px; 608 font-size: 14px;
571 color: #333333; 609 color: #333333;
572 letter-spacing: -0.26px; 610 letter-spacing: -0.26px;
573 } 611 }
574 } 612 }
575 .arrow { 613 .arrow {
576 width: 6px; 614 width: 6px;
577 height: 12px; 615 height: 12px;
578 position: absolute; 616 position: absolute;
579 right: 40rpx; 617 right: 40rpx;
580 bottom: 104rpx; 618 bottom: 104rpx;
581 } 619 }
582 } 620 }
583 </style> 621 </style>
src/pages/frameDetail/frameDetail.vue
Diff comments   View file @089dce1
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.priceArea.Min_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="addCart()" 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 // 购物车数据 337 // 购物车数据
338 addCartList: { 338 addCartList: {
339 mp_id: 335, 339 mp_id: 335,
340 sk_id: 0, 340 sk_id: 0,
341 num: 1, 341 num: 1,
342 price: '' 342 price: '',
343 }, 343 },
344 screenItems: [ 344 screenItems: [
345 { current: 0, text: '商品介绍' }, 345 { current: 0, text: '商品介绍' },
346 { current: 1, text: '规格参数' }, 346 { current: 1, text: '规格参数' },
347 { current: 2, text: '售后保障' } 347 { current: 2, text: '售后保障' },
348 ], 348 ],
349 current: 0, 349 current: 0,
350 starCount: 5, 350 starCount: 5,
351 parameter: [ 351 parameter: [
352 { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: '139mm' }, 352 { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: '139mm' },
353 { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: '51mm' }, 353 { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: '51mm' },
354 { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: '45mm' }, 354 { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: '45mm' },
355 { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: '19mm' }, 355 { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: '19mm' },
356 { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: '138mm' }, 356 { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: '138mm' },
357 { key: 5, img: '/static/img/detail/d7.png', standard: '框架重', slength: '19mm' } 357 { key: 5, img: '/static/img/detail/d7.png', standard: '框架重', slength: '19mm' },
358 ], 358 ],
359 esvalue: '宝贝好评率', 359 esvalue: '宝贝好评率',
360 introduction: { 360 introduction: {
361 material: '钛合金', 361 material: '钛合金',
362 func: '抗疲劳/防辐射', 362 func: '抗疲劳/防辐射',
363 rate: '男/女' 363 rate: '男/女',
364 }, 364 },
365 imgAll: '/static/img/detail/d8.png', 365 imgAll: '/static/img/detail/d8.png',
366 photoes: [ 366 photoes: [
367 { value: '日常办公', img: '/static/img/detail/d9.png' }, 367 { value: '日常办公', img: '/static/img/detail/d9.png' },
368 { value: '上网', img: '/static/img/detail/d10.png' }, 368 { value: '上网', img: '/static/img/detail/d10.png' },
369 { value: '追剧', img: '/static/img/detail/d11.png' }, 369 { value: '追剧', img: '/static/img/detail/d11.png' },
370 { value: '玩游戏', img: '/static/img/detail/d12.png' } 370 { value: '玩游戏', img: '/static/img/detail/d12.png' },
371 ], 371 ],
372 imgDetail: '/static/img/detail/d13.png', 372 imgDetail: '/static/img/detail/d13.png',
373 imgShop: { 373 imgShop: {
374 img: '/static/tab-cart.png', 374 img: '/static/tab-cart.png',
375 IsShown: false 375 IsShown: false,
376 }, 376 },
377 tag: { 377 tag: {
378 prod_tag_freesend: [{ 378 prod_tag_freesend: [{
379 label: '眼镜盒', 379 label: '眼镜盒',
380 value: '262' 380 value: '262',
381 }] 381 }],
382 } 382 },
383 } 383 }
384 }, 384 },
385 onLoad: function ({ pid }) { 385 onLoad: function ({ pid }) {
386 this.pid = pid 386 this.pid = pid
387 store.dispatch('read/fetch', { 387 store.dispatch('read/fetch', {
388 pid 388 pid,
389 }).then(() => { 389 }).then(() => {
390 this.parameter[0].slength = `${this.goodInfo.frame_width}mm` 390 this.parameter[0].slength = `${this.goodInfo.frame_width}mm`
391 this.parameter[1].slength = `${this.goodInfo.glass_width}mm` 391 this.parameter[1].slength = `${this.goodInfo.glass_width}mm`
392 this.parameter[2].slength = `${this.goodInfo.glass_height}mm` 392 this.parameter[2].slength = `${this.goodInfo.glass_height}mm`
393 this.parameter[3].slength = `${this.goodInfo.nose_width}mm` 393 this.parameter[3].slength = `${this.goodInfo.nose_width}mm`
394 this.parameter[4].slength = `${this.goodInfo.leg_long}mm` 394 this.parameter[4].slength = `${this.goodInfo.leg_long}mm`
395 this.parameter[5].slength = `${this.goodInfo.weight}mm` 395 this.parameter[5].slength = `${this.goodInfo.weight}mm`
396 this.tag = this.goodInfo.tag 396 this.tag = this.goodInfo.tag
397 this.addCartList.price = this.goodInfo.p_sale_price 397 this.addCartList.price = this.goodInfo.p_sale_price
398 this.test = this.goodInfo.prodIntro1 398 this.test = this.goodInfo.prodIntro1
399 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" ')
400 }) 400 })
401 }, 401 },
402 computed: { 402 computed: {
403 updateGoodType () { 403 updateGoodType () {
404 return this.goodType 404 return this.goodType
405 }, 405 },
406 goodInfo () { 406 goodInfo () {
407 console.log(this.$store.state.read.goodInfo) 407 console.log(this.$store.state.read.goodInfo)
408 return this.$store.state.read.goodInfo 408 return this.$store.state.read.goodInfo
409 } 409 },
410 }, 410 },
411 methods: { 411 methods: {
412 // 前往购物车 412 // 前往购物车
413 toCart() { 413 toCart() {
414 uni.switchTab({ 414 uni.switchTab({
415 url: '/pages/cart/cart', 415 url: '/pages/cart/cart',
416 success: res => {}, 416 success: res => {},
417 fail: (error) => { console.log('跳转购物车失败======>', error) }, 417 fail: (error) => { console.log('跳转购物车失败======>', error) },
418 complete: () => { console.log('toCart') } 418 complete: () => { console.log('toCart') },
419 }) 419 })
420 }, 420 },
421 // 加入购物车 421 // 加入购物车
422 addCart () { 422 addCart () {
423 store.dispatch('cart/addCart', { 423 store.dispatch('cart/addCart', {
424 uid: this.$store.state.user.userInfo.uid, 424 uid: this.$store.state.user.userInfo.uid,
425 openid: this.$store.state.user.userInfo.openid, 425 openid: this.$store.state.user.userInfo.openid,
426 mp_id: this.addCartList.mp_id, 426 mp_id: this.addCartList.mp_id,
427 sk_id: this.addCartList.sk_id, 427 sk_id: this.addCartList.sk_id,
428 num: this.addCartList.num, 428 num: this.addCartList.num,
429 pid: this.pid, 429 pid: this.pid,
430 price: this.addCartList.price, 430 price: this.addCartList.price,
431 checkedSKU: {} 431 checkedSKU: {},
432 }) 432 })
433 store.dispatch('cart/getCartList', { 433 store.dispatch('cart/getCartList', {
434 uid: this.$store.state.user.userInfo.uid // 用户id 434 uid: this.$store.state.user.userInfo.uid, // 用户id
435 }) 435 })
436 }, 436 },
437 goPerchase () { 437 goPerchase () {
438 // switch (this.updateGoodType) { 438 // switch (this.updateGoodType) {
439 // case '1': 439 // case '1':
440 console.log('goPerchase') 440 console.log('goPerchase')
441 uni.navigateTo({ 441 uni.navigateTo({
442 url: `../purchaseLenses/purchaseLenses?pid=${this.pid}`, 442 url: `../purchaseLenses/purchaseLenses?pid=${this.pid}`,
443 success: res => {}, 443 success: res => {},
444 fail: (error) => { console.log('跳转参数选择失败======>', error) }, 444 fail: (error) => { console.log('跳转参数选择失败======>', error) },
445 complete: () => { console.log('goPerchase') } 445 complete: () => { console.log('goPerchase') },
446 }) 446 })
447 // break 447 // break
448 // case '2': 448 // case '2':
449 // uni.navigateTo({ 449 // uni.navigateTo({
450 // url: '../detailStandard/detailStandard_k', 450 // url: '../detailStandard/detailStandard_k',
451 // success: res => {}, 451 // success: res => {},
452 // fail: () => {}, 452 // fail: () => {},
453 // complete: () => {} 453 // complete: () => {}
454 // }) 454 // })
455 // break 455 // break
456 // case '3': 456 // case '3':
457 // uni.navigateTo({ 457 // uni.navigateTo({
458 // url: '../purchaseLenses/purchaseLenses', 458 // url: '../purchaseLenses/purchaseLenses',
459 // success: res => {}, 459 // success: res => {},
460 // fail: () => {}, 460 // fail: () => {},
461 // complete: () => {} 461 // complete: () => {}
462 // }) 462 // })
463 // break 463 // break
464 // case '4': 464 // case '4':
465 // uni.navigateTo({ 465 // uni.navigateTo({
466 // url: '../detailStandard/detailStandard_sun', 466 // url: '../detailStandard/detailStandard_sun',
467 // success: res => {}, 467 // success: res => {},
468 // fail: () => {}, 468 // fail: () => {},
469 // complete: () => {} 469 // complete: () => {}
470 // }) 470 // })
471 // break 471 // break
472 // default : 472 // default :
473 // break 473 // break
474 // } 474 // }
475 }, 475 },
476 // 加入购物车 476 // 加入购物车
477 addCart () { 477 addCart () {
478 store.dispatch('cart/addCart', { 478 store.dispatch('cart/addCart', {
479 uid: this.$store.state.user.userInfo.uid, 479 uid: this.$store.state.user.userInfo.uid,
480 openid: this.$store.state.user.userInfo.openid, 480 openid: this.$store.state.user.userInfo.openid,
481 pid: this.pid, 481 pid: this.pid,
482 checkedSKU: {} 482 checkedSKU: {},
483 }) 483 })
484 store.dispatch('cart/getCartList', { 484 store.dispatch('cart/getCartList', {
485 uid: this.$store.state.user.userInfo.uid // 用户id 485 uid: this.$store.state.user.userInfo.uid, // 用户id
486 }) 486 })
487 }, 487 },
488 tabChange (e) { 488 tabChange (e) {
489 if (this.current !== e) { 489 if (this.current !== e) {
490 this.current = e 490 this.current = e
491 } 491 }
492 } 492 },
493 } 493 },
494 } 494 }
495 </script> 495 </script>
496 <style lang='scss'> 496 <style lang='scss'>
497 .container { 497 .container {
498 background-color: #f8f8f8; 498 background-color: #f8f8f8;
499 } 499 }
500 .D1, 500 .D1,
501 .D2, 501 .D2,
502 .D3, 502 .D3,
503 .D4, 503 .D4,
504 .D6 { 504 .D6 {
505 background: #ffffff; 505 background: #ffffff;
506 margin-bottom: 10px; 506 margin-bottom: 10px;
507 padding: 8px 20px 8px 20px; 507 padding: 8px 20px 8px 20px;
508 box-sizing: border-box; 508 box-sizing: border-box;
509 .swiperImage { 509 .swiperImage {
510 width: 684rpx; 510 width: 684rpx;
511 height: 480rpx; 511 height: 480rpx;
512 image { 512 image {
513 max-width: 100%; 513 max-width: 100%;
514 max-height: 100%; 514 max-height: 100%;
515 border-radius: 16rpx; 515 border-radius: 16rpx;
516 } 516 }
517 } 517 }
518 } 518 }
519 .D5 { 519 .D5 {
520 background: #ffffff; 520 background: #ffffff;
521 padding: 8px 20px 8px 20px; 521 padding: 8px 20px 8px 20px;
522 box-sizing: border-box; 522 box-sizing: border-box;
523 } 523 }
524 .swiperImage { 524 .swiperImage {
525 width: 100%; 525 width: 100%;
526 height: 560rpx; 526 height: 560rpx;
527 .swiper-item { 527 .swiper-item {
528 width: 100%; 528 width: 100%;
529 image { 529 image {
530 width: 100%; 530 width: 100%;
531 } 531 }
532 } 532 }
533 } 533 }
534 .D1 { 534 .D1 {
535 .D1_price { 535 .D1_price {
536 color: #eb5d3b; 536 color: #eb5d3b;
537 font-size: 18px; 537 font-size: 18px;
538 margin-top: 5px; 538 margin-top: 5px;
539 font-family: "PingFangSC-Semibold"; 539 font-family: "PingFangSC-Semibold";
540 display: flex; 540 display: flex;
541 justify-content: space-between; 541 justify-content: space-between;
542 .D1_number { 542 .D1_number {
543 color: #999999; 543 color: #999999;
544 font-size: 14px; 544 font-size: 14px;
545 font-family: "PingFangSC-Regular"; 545 font-family: "PingFangSC-Regular";
546 } 546 }
547 } 547 }
548 .D1_name { 548 .D1_name {
549 font-size: 16px; 549 font-size: 16px;
550 font-family: "PingFangSC-Semibold"; 550 font-family: "PingFangSC-Semibold";
551 margin-top: 5px; 551 margin-top: 5px;
552 .D1_name1 { 552 .D1_name1 {
553 font-weight: bold; 553 font-weight: bold;
554 font-size: 16px; 554 font-size: 16px;
555 color: #333333; 555 color: #333333;
556 } 556 }
557 } 557 }
558 .D1_spans { 558 .D1_spans {
559 font-size: 10px; 559 font-size: 10px;
560 color: #999999; 560 color: #999999;
561 margin-top: 5px; 561 margin-top: 5px;
562 span { 562 span {
563 height: 14px; 563 height: 14px;
564 margin-right: 10px; 564 margin-right: 10px;
565 } 565 }
566 } 566 }
567 } 567 }
568 .D2 { 568 .D2 {
569 font-size: 14px; 569 font-size: 14px;
570 font-family: "PingFangSC-Regular"; 570 font-family: "PingFangSC-Regular";
571 view { 571 view {
572 height: 24px; 572 height: 24px;
573 } 573 }
574 .D2_span1 { 574 .D2_span1 {
575 color: #999999; 575 color: #999999;
576 } 576 }
577 .D2_span2 { 577 .D2_span2 {
578 color: #333333; 578 color: #333333;
579 } 579 }
580 } 580 }
581 .D3 { 581 .D3 {
582 .screenBar { 582 .screenBar {
583 width: 670rpx; 583 width: 670rpx;
584 margin-top: 20rpx; 584 margin-top: 20rpx;
585 margin-bottom: 24rpx; 585 margin-bottom: 24rpx;
586 display: flex; 586 display: flex;
587 flex-direction: row; 587 flex-direction: row;
588 justify-content: space-between; 588 justify-content: space-between;
589 align-items: center; 589 align-items: center;
590 font-size: 14px; 590 font-size: 14px;
591 color: #333333; 591 color: #333333;
592 transition: all 0.2s; 592 transition: all 0.2s;
593 } 593 }
594 .screen-item { 594 .screen-item {
595 font-size: 32rpx; 595 font-size: 32rpx;
596 color: #333333; 596 color: #333333;
597 display: flex; 597 display: flex;
598 transition: all 0.2s; 598 transition: all 0.2s;
599 .D3_list { 599 .D3_list {
600 margin-bottom: 4px; 600 margin-bottom: 4px;
601 } 601 }
602 .D3_list view { 602 .D3_list view {
603 display: flex; 603 display: flex;
604 align-content: center; 604 align-content: center;
605 font-size: 14px; 605 font-size: 14px;
606 color: #333333; 606 color: #333333;
607 } 607 }
608 .D3_list image { 608 .D3_list image {
609 width: 50px; 609 width: 50px;
610 height: 25px; 610 height: 25px;
611 margin-right: 6px; 611 margin-right: 6px;
612 } 612 }
613 .D3_list span { 613 .D3_list span {
614 margin-left: 6px; 614 margin-left: 6px;
615 margin-right: 5px; 615 margin-right: 5px;
616 font-family: "PingFangSC-Regular"; 616 font-family: "PingFangSC-Regular";
617 } 617 }
618 } 618 }
619 .active { 619 .active {
620 border-bottom: 4rpx solid #ff6b4a; 620 border-bottom: 4rpx solid #ff6b4a;
621 } 621 }
622 .customerService { 622 .customerService {
623 margin-bottom: 90rpx; 623 margin-bottom: 90rpx;
624 .serviceItem { 624 .serviceItem {
625 margin-bottom: 32rpx; 625 margin-bottom: 32rpx;
626 .title { 626 .title {
627 display: flex; 627 display: flex;
628 flex-direction: row; 628 flex-direction: row;
629 align-items: center; 629 align-items: center;
630 .titleText { 630 .titleText {
631 font-size: 14px; 631 font-size: 14px;
632 color: #333333; 632 color: #333333;
633 margin-bottom: 12rpx; 633 margin-bottom: 12rpx;
634 } 634 }
635 } 635 }
636 .itemContent { 636 .itemContent {
637 font-size: 14px; 637 font-size: 14px;
638 color: #999999; 638 color: #999999;
639 margin-left: 18rpx; 639 margin-left: 18rpx;
640 } 640 }
641 } 641 }
642 .serviceItem2 { 642 .serviceItem2 {
643 margin-left: 18rpx; 643 margin-left: 18rpx;
644 margin-bottom: 32rpx; 644 margin-bottom: 32rpx;
645 .titleText { 645 .titleText {
646 font-size: 14px; 646 font-size: 14px;
647 color: #ff6b4a; 647 color: #ff6b4a;
648 } 648 }
649 .itemContent { 649 .itemContent {
650 font-size: 14px; 650 font-size: 14px;
651 color: #999999; 651 color: #999999;
652 .itemContent-child { 652 .itemContent-child {
653 margin-bottom: 40rpx; 653 margin-bottom: 40rpx;
654 .contentTitle { 654 .contentTitle {
655 border-bottom: 1px solid #ff6b4a; 655 border-bottom: 1px solid #ff6b4a;
656 } 656 }
657 } 657 }
658 } 658 }
659 } 659 }
660 } 660 }
661 } 661 }
662 .D4 { 662 .D4 {
663 .D4_esvalue { 663 .D4_esvalue {
664 font-size: 14px; 664 font-size: 14px;
665 color: #333333; 665 color: #333333;
666 display: flex; 666 display: flex;
667 justify-content: space-between; 667 justify-content: space-between;
668 margin-bottom: 10px; 668 margin-bottom: 10px;
669 .D4_2 { 669 .D4_2 {
670 width: 90px; 670 width: 90px;
671 display: flex; 671 display: flex;
672 align-items: center; 672 align-items: center;
673 justify-content: space-between; 673 justify-content: space-between;
674 } 674 }
675 } 675 }
676 .D4_esvalue view { 676 .D4_esvalue view {
677 font-size: 14px; 677 font-size: 14px;
678 color: #333333; 678 color: #333333;
679 font-weight: bold; 679 font-weight: bold;
680 } 680 }
681 .D4_list{ 681 .D4_list{
682 display: grid; 682 display: grid;
683 grid-row-gap: 10px; 683 grid-row-gap: 10px;
684 grid-column-gap: 4px; 684 grid-column-gap: 4px;
685 } 685 }
686 .D4_list view { 686 .D4_list view {
687 display: flex; 687 display: flex;
688 justify-content: center; 688 justify-content: center;
689 align-items: center; 689 align-items: center;
690 font-size: 12px; 690 font-size: 12px;
691 width: 118px; 691 width: 118px;
692 height: 24px; 692 height: 24px;
693 border-radius: 2px; 693 border-radius: 2px;
694 background: #f2f2f2; 694 background: #f2f2f2;
695 color: #666666; 695 color: #666666;
696 // letter-spacing: 1px; 696 // letter-spacing: 1px;
697 } 697 }
698 } 698 }
699 .D5 { 699 .D5 {
700 .D5_fixed1 { 700 .D5_fixed1 {
701 display: flex; 701 display: flex;
702 justify-content: space-between; 702 justify-content: space-between;
703 align-content: center; 703 align-content: center;
704 margin-bottom: 12px; 704 margin-bottom: 12px;
705 view { 705 view {
706 font-size: 14px; 706 font-size: 14px;
707 color: #333333; 707 color: #333333;
708 font-weight: bold; 708 font-weight: bold;
709 font-family: "PingFangSC-Medium"; 709 font-family: "PingFangSC-Medium";
710 line-height: 24px; 710 line-height: 24px;
711 } 711 }
712 image { 712 image {
713 width: 240rpx; 713 width: 240rpx;
714 height: 3px; 714 height: 3px;
715 margin-top: 10px; 715 margin-top: 10px;
716 } 716 }
717 } 717 }
718 .D5_all { 718 .D5_all {
719 width: 100%; 719 width: 100%;
720 margin-top: 30rpx; 720 margin-top: 30rpx;
721 margin-right: 30rpx; 721 margin-right: 30rpx;
722 margin-bottom: 180rpx; 722 margin-bottom: 180rpx;
723 font-family: "PingFangSC-Regular"; 723 font-family: "PingFangSC-Regular";
724 // border: #999999 solid 1.5px; 724 // border: #999999 solid 1.5px;
725 } 725 }
726 } 726 }
727 .D6 { 727 .D6 {
728 width: 100%; 728 width: 100%;
729 height: 430px; 729 height: 430px;
730 background: #f9f6ed; 730 background: #f9f6ed;
731 margin-bottom: 74px; 731 margin-bottom: 74px;
732 view { 732 view {
733 text-align: center; 733 text-align: center;
734 } 734 }
735 .D6_v1 { 735 .D6_v1 {
736 font-weight: bold; 736 font-weight: bold;
737 } 737 }
738 .D6_v2 { 738 .D6_v2 {
739 font-size: 14px; 739 font-size: 14px;
740 margin-bottom: 30px; 740 margin-bottom: 30px;
741 } 741 }
742 .D6_v5 { 742 .D6_v5 {
743 .D6_v5_s1 { 743 .D6_v5_s1 {
744 font-weight: bold; 744 font-weight: bold;
745 } 745 }
746 .D6_v5_s2 { 746 .D6_v5_s2 {
747 font-size: 14px; 747 font-size: 14px;
748 } 748 }
749 } 749 }
750 } 750 }
751 .botton { 751 .botton {
752 position: fixed; 752 position: fixed;
753 bottom: 0; 753 bottom: 0;
754 height: 74px; 754 height: 74px;
755 width: 100%; 755 width: 100%;
756 background: #ffffff; 756 background: #ffffff;
757 padding: 20px 20px 8px 20px; 757 padding: 20px 20px 8px 20px;
758 font-family: "PingFangSC-Regular"; 758 font-family: "PingFangSC-Regular";
759 box-sizing: border-box; 759 box-sizing: border-box;
760 display: flex; 760 display: flex;
761 justify-content: space-between; 761 justify-content: space-between;
762 align-content: center; 762 align-content: center;
763 .botton_1 { 763 .botton_1 {
764 width: 20%; 764 width: 20%;
765 height: 100%; 765 height: 100%;
766 text-align: center; 766 text-align: center;
767 color: #989898; 767 color: #989898;
768 } 768 }
769 image { 769 image {
770 width: 60%; 770 width: 60%;
771 height: 30px; 771 height: 30px;
772 } 772 }
773 .botton_image { 773 .botton_image {
774 font-size: 12px; 774 font-size: 12px;
775 text-align: center; 775 text-align: center;
776 } 776 }
777 .botton_2 { 777 .botton_2 {
778 width: 74%; 778 width: 74%;
779 height: 86%; 779 height: 86%;
780 display: grid; 780 display: grid;
781 grid-template-columns: 50% 50%; 781 grid-template-columns: 50% 50%;
782 } 782 }
783 .botton_input { 783 .botton_input {
784 display: inline-flex; 784 display: inline-flex;
785 align-items: center; 785 align-items: center;
786 justify-content: space-around; 786 justify-content: space-around;
787 background: #fff0ec; 787 background: #fff0ec;
788 font-size: 16px; 788 font-size: 16px;
789 color: #ff6b4a; 789 color: #ff6b4a;
790 border-radius: 20px 0 0 20px; 790 border-radius: 20px 0 0 20px;
791 } 791 }
792 .botton_now { 792 .botton_now {
793 display: inline-flex; 793 display: inline-flex;
794 align-items: center; 794 align-items: center;
795 justify-content: space-around; 795 justify-content: space-around;
796 background: #ff6b4a; 796 background: #ff6b4a;
797 font-size: 16px; 797 font-size: 16px;
798 color: #ffffff; 798 color: #ffffff;
799 border-radius: 0 20px 20px 0; 799 border-radius: 0 20px 20px 0;
800 } 800 }
801 } 801 }
802 </style> 802 </style>
803 803
src/pages/myOrder/myOrder.vue
Diff comments   View file @089dce1
1 <template> 1 <template>
2 <view class="content"> 2 <view class="content">
3 <view class="header"> 3 <view class="header">
4 <!-- 搜索--> 4 <!-- 搜索-->
5 <!-- <view class="searchBar"> 5 <!-- <view class="searchBar">
6 <icon class="searchIcon" type="search" size="14"></icon> 6 <icon class="searchIcon" type="search" size="14"></icon>
7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/> 7 <input class="searchIpt" placeholder="搜索订单关键字..." confirm-type="search"/>
8 </view> --> 8 </view> -->
9 <view class="screenBar"> 9 <view class="screenBar">
10 <view 10 <view
11 v-for="item in screenItems" 11 v-for="item in screenItems"
12 :key="item.current" 12 :key="item.current"
13 @click="onClickItem(item.current)" 13 @click="onClickItem(item.current)"
14 > 14 >
15 <view 15 <view
16 class="screenItem" 16 class="screenItem"
17 v-bind:class="{ active: current === item.current }" 17 v-bind:class="{ active: current === item.current }"
18 >{{ item.text }}</view> 18 >{{ item.text }}</view>
19 </view> 19 </view>
20 </view> 20 </view>
21 </view> 21 </view>
22 <view class="orderList"> 22 <view class="orderList">
23 <view 23 <view
24 v-for="(order) in orderList" 24 v-for="(order) in orderList"
25 :key="order.orderId" 25 :key="order.orderId"
26 > 26 >
27 <OrderCard 27 <OrderCard
28 :order="order" 28 :order="order"
29 :current="current" 29 :current="current"
30 ></OrderCard> 30 ></OrderCard>
31 </view> 31 </view>
32 </view> 32 </view>
33 <view class="footer">没有更多订单了，去商城看看吧~</view> 33 <view class="footer">没有更多订单了，去商城看看吧~</view>
34 </view> 34 </view>
35 </template> 35 </template>
36 <script> 36 <script>
37 import OrderCard from './components/OrderCard.vue' 37 import OrderCard from './components/OrderCard.vue'
38 import store from '@/store' 38 import store from '@/store'
39 39
40 export default { 40 export default {
41 components: { 41 components: {
42 OrderCard: OrderCard 42 OrderCard: OrderCard,
43 }, 43 },
44 data() { 44 data() {
45 return { 45 return {
46 // 顶部筛选项 46 // 顶部筛选项
47 screenItems: [ 47 screenItems: [
48 { current: '10', text: '全部' }, 48 { current: '10', text: '全部' },
49 { current: '0', text: '待付款' }, 49 { current: '0', text: '待付款' },
50 { current: '1', text: '待收货' }, 50 { current: '1', text: '待收货' },
51 { current: '2', text: '已完成' } 51 { current: '2', text: '已完成' },
52 // {current:"3",text:'已评价'}, 52 // {current:"3",text:'已评价'},
53 // {current:"4",text:'退款'}, 53 // {current:"4",text:'退款'},
54 ], 54 ],
55 // 当前所在item 默认10-->全部 55 // 当前所在item 默认10-->全部
56 current: '10' 56 current: '10',
57 } 57 }
58 }, 58 },
59 59
60 onLoad: function(option) { 60 onLoad: function(option) {
61 // 获取订单列表 61 // 获取订单列表
62 store.dispatch('myOrder/getList', { 62 store.dispatch('myOrder/getList', {
63 uid: '1', 63 way: '',
64 way: ''
65 }) 64 })
66 // 从user过来传的status，给current，以显示对应item 65 // 从user过来传的status，给current，以显示对应item
67 this.current = option.status 66 this.current = option.status
68 }, 67 },
69 computed: { 68 computed: {
70 orderList() { 69 orderList() {
71 // console.log('orderList', this.$store.state.myOrder.orderList); 70 // console.log('orderList', this.$store.state.myOrder.orderList);
72 return this.$store.state.myOrder.orderList 71 return this.$store.state.myOrder.orderList
73 } 72 },
74 }, 73 },
75 methods: { 74 methods: {
76 // tab点击事件 75 // tab点击事件
77 onClickItem(e) { 76 onClickItem(e) {
78 if (this.current !== e) { 77 if (this.current !== e) {
79 this.current = e 78 this.current = e
80 } 79 }
81 } 80 },
82 81
83 } 82 },
84 } 83 }
85 </script> 84 </script>
86 85
87 <style lang="scss"> 86 <style lang="scss">
88 .content { 87 .content {
89 display: flex; 88 display: flex;
90 flex-direction: column; 89 flex-direction: column;
91 align-items: center; 90 align-items: center;
92 background-color: #f7f6f6; 91 background-color: #f7f6f6;
93 min-height: 100vh; 92 min-height: 100vh;
94 .header { 93 .header {
95 background-color: #ffffff; 94 background-color: #ffffff;
96 width: 100%; 95 width: 100%;
97 // height: 232rpx; 96 // height: 232rpx;
98 padding: 20rpx 40rpx 16rpx 40rpx; 97 padding: 20rpx 40rpx 16rpx 40rpx;
99 box-sizing: border-box; 98 box-sizing: border-box;
100 position: fixed; 99 position: fixed;
101 top: 0; 100 top: 0;
102 left: 0; 101 left: 0;
103 // .searchBar { 102 // .searchBar {
104 // width: 670rpx; 103 // width: 670rpx;
105 // display: flex; 104 // display: flex;
106 // justify-content: center; 105 // justify-content: center;
107 // align-items: center; 106 // align-items: center;
108 // box-sizing: border-box; 107 // box-sizing: border-box;
109 // padding: 0rpx 16rpx; 108 // padding: 0rpx 16rpx;
110 // border: 1px solid #ff6b4a; 109 // border: 1px solid #ff6b4a;
111 // border-radius: 8rpx; 110 // border-radius: 8rpx;
112 // background-color: #ffffff; 111 // background-color: #ffffff;
113 // } 112 // }
114 113
115 .screenBar { 114 .screenBar {
116 width: 670rpx; 115 width: 670rpx;
117 // height: 110rpx; 116 // height: 110rpx;
118 height: 70rpx; 117 height: 70rpx;
119 display: flex; 118 display: flex;
120 flex-direction: row; 119 flex-direction: row;
121 justify-content: space-between; 120 justify-content: space-between;
122 align-items: center; 121 align-items: center;
123 color: #333333; 122 color: #333333;
124 font-size: 32rpx; 123 font-size: 32rpx;
125 } 124 }
126 .screenItem { 125 .screenItem {
127 height: 50rpx; 126 height: 50rpx;
128 font-size: 32rpx; 127 font-size: 32rpx;
129 color: #333333; 128 color: #333333;
130 display: flex; 129 display: flex;
131 justify-content: center; 130 justify-content: center;
132 align-items: center; 131 align-items: center;
133 transition: all 0.2s; 132 transition: all 0.2s;
134 } 133 }
135 .active { 134 .active {
136 // font-size: 34rpx; 135 // font-size: 34rpx;
137 color: #ec5d3b; 136 color: #ec5d3b;
138 } 137 }
139 .searchIpt { 138 .searchIpt {
140 height: 68rpx; 139 height: 68rpx;
141 width: 670rpx; 140 width: 670rpx;
142 padding: 16rpx; 141 padding: 16rpx;
143 font-size: 28rpx; 142 font-size: 28rpx;
144 box-sizing: border-box; 143 box-sizing: border-box;
145 } 144 }
146 } 145 }
147 .orderList { 146 .orderList {
148 // margin-top: 232rpx; 147 // margin-top: 232rpx;
149 margin-top: 132rpx; 148 margin-top: 132rpx;
150 } 149 }
151 .footer { 150 .footer {
152 font-size: 14px; 151 font-size: 14px;
153 color: #b8b8b8; 152 color: #b8b8b8;
154 margin: 40rpx 0; 153 margin: 40rpx 0;
155 } 154 }
156 } 155 }
157 </style> 156 </style>
158 157
src/pages/purchaseLenses/purchaseLenses.vue
Diff comments   View file @089dce1
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 </template> 172 </template>
173 <template v-else> 173 <template v-else>
174 <view 174 <view
175 v-for="item in pickerInfoList" 175 v-for="item in pickerInfoList"
176 :key="item.key" 176 :key="item.key"
177 class="bodyBox" 177 class="bodyBox"
178 > 178 >
179 <template v-if="item.nameC==='验光日期'"> 179 <template v-if="item.nameC==='验光日期'">
180 <text class="names">{{item.nameC}}</text> 180 <text class="names">{{item.nameC}}</text>
181 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text> 181 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
182 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text> 182 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
183 <text>{{item.nameArray3[item.nameIndex2]}}日</text> 183 <text>{{item.nameArray3[item.nameIndex2]}}日</text>
184 </template> 184 </template>
185 <template v-else> 185 <template v-else>
186 <template v-if="item.nameC==='度数'"> 186 <template v-if="item.nameC==='度数'">
187 <text style="display: inline;">*</text> 187 <text style="display: inline;">*</text>
188 </template> 188 </template>
189 189
190 <text class="names">{{item.nameC}}</text> 190 <text class="names">{{item.nameC}}</text>
191 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text> 191 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
192 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text> 192 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
193 </template> 193 </template>
194 </view> 194 </view>
195 </template> 195 </template>
196 </view> 196 </view>
197 </view> 197 </view>
198 </view> 198 </view>
199 <view class="choose"> 199 <view class="choose">
200 <view 200 <view
201 class="chooseItem_1_content" 201 class="chooseItem_1_content"
202 v-for="(item,index) in attrList" 202 v-for="(item,index) in attrList"
203 :key="index" 203 :key="index"
204 > 204 >
205 <UniCollapse @change="change(index)"> 205 <UniCollapse @change="changeShow(index)">
206 <UniCollapseItem 206 <UniCollapseItem
207 :open="show[index]" 207 :open="show[index]"
208 :title="item.meta_name" 208 :title="item.meta_name"
209 showAnimation=false 209 showAnimation=false
210 > 210 >
211 <view class="chooseItem_1_content"> 211 <view class="chooseItem_1_content">
212 <view class="itemsWrap"> 212 <view class="itemsWrap">
213 <view 213 <view
214 class="item2" 214 class="item2"
215 v-for="(one,i) in item.attr" 215 v-for="(one,i) in item.attr"
216 :key="i" 216 :key="i"
217 :class="{ active2: current[index] === i }" 217 :class="{ active2: current[index] === i }"
218 @click="onClickItem(index, i)" 218 @click="onClickItem(index, i)"
219 >{{one.name}}</view> 219 >{{one.name}}</view>
220 </view> 220 </view>
221 </view> 221 </view>
222 </UniCollapseItem> 222 </UniCollapseItem>
223 </UniCollapse> 223 </UniCollapse>
224 <view 224 <view
225 class="chooseRes" 225 class="chooseRes"
226 v-show="!show[index]" 226 v-show="!show[index]"
227 >* {{attrList[index].attr[current[index]].name}}</view> 227 >* {{attrList[index].attr[current[index]].name}}</view>
228 </view> 228 </view>
229 <!-- <view class="chooseItem_1 chooseItem"> 229 <!-- <view class="chooseItem_1 chooseItem">
230 <UniCollapse @change="change(1)"> 230 <UniCollapse @change="change(1)">
231 <UniCollapseItem 231 <UniCollapseItem
232 open=true 232 open=true
233 title="款式挑选" 233 title="款式挑选"
234 showAnimation=false 234 showAnimation=false
235 > 235 >
236 <view 236 <view
237 class="chooseRes" 237 class="chooseRes"
238 v-show="show[1]" 238 v-show="show[1]"
239 >* {{chooseRes1}}</view> 239 >* {{chooseRes1}}</view>
240 <view class="chooseItem_1_content"> 240 <view class="chooseItem_1_content">
241 <view class="itemsWrap"> 241 <view class="itemsWrap">
242 <view 242 <view
243 class="item1" 243 class="item1"
244 v-for="(item,index) in chooseItem1" 244 v-for="(item,index) in chooseItem1"
245 :key="index" 245 :key="index"
246 :style="item.style" 246 :style="item.style"
247 :class="{ active1: current1 === index }" 247 :class="{ active1: current1 === index }"
248 @click="onClickItem1(index)" 248 @click="onClickItem1(index)"
249 ></view> 249 ></view>
250 </view> 250 </view>
251 </view> 251 </view>
252 </UniCollapseItem> 252 </UniCollapseItem>
253 </UniCollapse> 253 </UniCollapse>
254 <view 254 <view
255 class="chooseRes" 255 class="chooseRes"
256 v-show="show[1]" 256 v-show="show[1]"
257 >* {{chooseRes1}}</view> 257 >* {{chooseRes1}}</view>
258 </view> 258 </view>
259 <view class="chooseItem_2 chooseItem "> 259 <view class="chooseItem_2 chooseItem ">
260 <UniCollapse @change="change(2)"> 260 <UniCollapse @change="change(2)">
261 <UniCollapseItem 261 <UniCollapseItem
262 open=true 262 open=true
263 title="直径" 263 title="直径"
264 showAnimation=false 264 showAnimation=false
265 > 265 >
266 <view class="chooseItem_1_content"> 266 <view class="chooseItem_1_content">
267 <view class="itemsWrap"> 267 <view class="itemsWrap">
268 <view 268 <view
269 class="item2" 269 class="item2"
270 v-for="(item,index) in chooseItem2" 270 v-for="(item,index) in chooseItem2"
271 :key="index" 271 :key="index"
272 :class="{ active2: current2 === index }" 272 :class="{ active2: current2 === index }"
273 @click="onClickItem2(index)" 273 @click="onClickItem2(index)"
274 >{{item.num}}</view> 274 >{{item.num}}</view>
275 </view> 275 </view>
276 </view> 276 </view>
277 </UniCollapseItem> 277 </UniCollapseItem>
278 </UniCollapse> 278 </UniCollapse>
279 <view 279 <view
280 class="chooseRes" 280 class="chooseRes"
281 v-show="show[2]" 281 v-show="show[2]"
282 >* {{chooseRes2}}</view> 282 >* {{chooseRes2}}</view>
283 </view> 283 </view>
284 <view class="chooseItem_3 chooseItem"> 284 <view class="chooseItem_3 chooseItem">
285 <UniCollapse @change="change(3)"> 285 <UniCollapse @change="change(3)">
286 <UniCollapseItem 286 <UniCollapseItem
287 open=true 287 open=true
288 title="度数" 288 title="度数"
289 showAnimation=false 289 showAnimation=false
290 > 290 >
291 <view class="chooseItem_1_content"> 291 <view class="chooseItem_1_content">
292 <view class="itemsWrap"> 292 <view class="itemsWrap">
293 <view 293 <view
294 class="item2" 294 class="item2"
295 v-for="(item,index) in chooseItem3" 295 v-for="(item,index) in chooseItem3"
296 :key="index" 296 :key="index"
297 :class="{ active2: current3 === index }" 297 :class="{ active2: current3 === index }"
298 @click="onClickItem3(index)" 298 @click="onClickItem3(index)"
299 >{{item}}</view> 299 >{{item}}</view>
300 </view> 300 </view>
301 </view> 301 </view>
302 </UniCollapseItem> 302 </UniCollapseItem>
303 </UniCollapse> 303 </UniCollapse>
304 <view 304 <view
305 class="chooseRes" 305 class="chooseRes"
306 v-show="show[3]" 306 v-show="show[3]"
307 >* {{chooseRes3}}</view> 307 >* {{chooseRes3}}</view>
308 </view> --> 308 </view> -->
309 </view> 309 </view>
310 <view 310 <view
311 class="button" 311 class="button"
312 @click="toComfirmOrder" 312 @click="toComfirmOrder"
313 > 313 >
314 立即结算 314 立即结算
315 </view> 315 </view>
316 </view> 316 </view>
317 </template> 317 </template>
318 318
319 <script> 319 <script>
320 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 320 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
321 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 321 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
322 import store from '@/store' 322 import store from '@/store'
323 323
324 export default { 324 export default {
325 components: { 325 components: {
326 UniCollapse, 326 UniCollapse,
327 UniCollapseItem 327 UniCollapseItem,
328 }, 328 },
329 data() { 329 data() {
330 return { 330 return {
331 count: 1, 331 count: 1,
332 pid: 0, 332 pid: 0,
333 maxCount: 20, 333 maxCount: 20,
334 dataName: '', // 验光数据人员名称 334 dataName: '', // 验光数据人员名称
335 isDataName: false, // 是否是已存在的人员数据 335 isDataName: false, // 是否是已存在的人员数据
336 dataConfirm: false, // 已确认所输入验光数据 336 dataConfirm: false, // 已确认所输入验光数据
337 opIsOpen: true, 337 opIsOpen: true,
338 addDisabled: false, 338 addDisabled: false,
339 desDisabled: false, 339 desDisabled: false,
340 current1: 0, 340 current1: 0,
341 current2: 0, 341 current2: 0,
342 current3: 0, 342 current3: 0,
343 current: [], 343 current: [],
344 show: [], 344 show: [],
345 chooseRes1: { 345 chooseRes1: {
346 sku_name: 'Miss 黑二代【减龄自然】', 346 sku_name: 'Miss 黑二代【减龄自然】',
347 sk_id: '128' 347 sk_id: '128',
348 },
349 checkedData: {
350
351 }, 348 },
349 checkedData: {},
352 chooseRes2: '14.0', 350 chooseRes2: '14.0',
353 chooseRes3: 0, 351 chooseRes3: 0,
354 chooseItem1: [ 352 chooseItem1: [
355 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' }, 353 { style: 'opacity: 0.7;background-image: radial-gradient(50% 148%, #ECEAEA 50%, #8D8C8C 100%);', describ: 'Miss 黑1代【减龄自然】' },
356 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' }, 354 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑二代【防紫外线】' },
357 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' }, 355 { style: 'background-image: radial-gradient(50% 148%, #FDF8F6 50%, #94380B 100%);', describ: 'Miss 黑3代【防紫外线】' },
358 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 356 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
359 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 357 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
360 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 358 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
361 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 359 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
362 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 360 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
363 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 361 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
364 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 362 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
365 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' }, 363 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
366 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' }, 364 { style: 'background-image: radial-gradient(50% 148%, #FFFFFF 50%, #324A05 100%);', describ: 'Miss 黑4代【防紫外线】' },
367 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' }, 365 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #624B3F 100%);', describ: 'Miss 黑5代【防紫外线】' },
368 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' }, 366 { style: 'opacity: 0.7;background-image: radial-gradient(50% 150%, #F0EEE7 50%, #6F0838 100%);', describ: 'Miss 黑6代【防紫外线】' },
369 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' } 367 { style: 'background-image: radial-gradient(50% 143%, #AEA8A8 45%, #370B4E 100%);', describ: 'Miss 黑7代【防紫外线】' },
370 ], 368 ],
371 chooseItem2: [ 369 chooseItem2: [
372 { num: '14.0' }, 370 { num: '14.0' },
373 { num: '14.2' }, 371 { num: '14.2' },
374 { num: '14.4' }, 372 { num: '14.4' },
375 { num: '14.5' } 373 { num: '14.5' },
376 ], 374 ],
377 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000], 375 chooseItem3: [0, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 470, 500, 525, 550, 575, 600, 1000],
378 // 度数相关数据 376 // 度数相关数据
379 pickerInfoList:[ 377 pickerInfoList: [
380 {nameC:"度数",nameE:"(SPH)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:0}, 378 { nameC: '度数', nameE: '(SPH)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 0 },
381 {nameC:"散光",nameE:"(CYL)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:1}, 379 { nameC: '散光', nameE: '(CYL)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 1 },
382 {nameC:"散光轴位",nameE:"(AXI)",nameArray1:[''],nameIndex1:0,nameArray2:[''],nameIndex2:0,key:2}, 380 { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 2 },
383 {nameC:"验光日期",nameE:'',nameArray1:[''],nameIndex1:0,nameArray2:['',1,2,3,4,5,6,7,8,9,10,11,12],nameIndex2:0,nameArray3:[''],nameIndex3:0} 381 { nameC: '验光日期', nameE: '', nameArray1: [''], nameIndex1: 0, nameArray2: ['', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12], nameIndex2: 0, nameArray3: [''], nameIndex3: 0 },
384 ], 382 ],
385 confirm: false, // 用户是否确认 383 confirm: false, // 用户是否确认
386 tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'], 384 tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'],
387 name: '夏小花', 385 name: '夏小花',
388 oldname:'',// 用于判读用户是否改变名字 386 oldname: '', // 用于判读用户是否改变名字
389 pickerInfoChioce:{ 387 pickerInfoChioce: {
390 "leftSph": '', 388 leftSph: '',
391 "rightSph": '', 389 rightSph: '',
392 "leftCyl": '', 390 leftCyl: '',
393 "rightCyl": '', 391 rightCyl: '',
394 "leftAxi": '', 392 leftAxi: '',
395 "rightAxi": '', 393 rightAxi: '',
396 "time":{ 394 time: {
397 "year":0, 395 year: 0,
398 "month": 0, 396 month: 0,
399 "day":0 , 397 day: 0,
400 } 398 },
401 }, 399 },
402 pd: '',// 瞳距 400 pd: '', // 瞳距
403 oldpd: '',// 用于判断用户是否改变瞳距 401 oldpd: '', // 用于判断用户是否改变瞳距
404 kinds:1, // kinds=1，提交为新增验光，2为修改 402 kinds: 1, // kinds=1，提交为新增验光，2为修改
405 mp_id: Number 403 mp_id: Number,
406 } 404 }
407 }, 405 },
408 computed: { 406 computed: {
409 attrList() { 407 attrList() {
410 return this.$store.state.read.goodInfo.attrList 408 return this.$store.state.read.goodInfo.attrList
411 }, 409 },
412 skuList() { 410 skuList() {
413 return this.$store.state.read.goodInfo.skuList 411 return this.$store.state.read.goodInfo.skuList
414 }, 412 },
415 mpList() { 413 mpList() {
416 return this.$store.state.myLoveList.loveList 414 return this.$store.state.myLoveList.loveList
417 } 415 },
418 }, 416 },
419 onLoad({ pid }) { 417 onLoad({ pid }) {
420 this.pid = pid 418 this.pid = pid
421 store.dispatch('read/fetch', { 419 store.dispatch('read/fetch', {
422 pid 420 pid,
423 }).then(() => { 421 }).then(() => {
424 const current = [] 422 const current = []
425 const show = [] 423 const show = []
426 for (let index = 0; index < this.attrList.length; index++) { 424 for (let index = 0; index < this.attrList.length; index++) {
427 current.push(0) 425 current.push(0)
428 show.push(true) 426 show.push(true)
429 } 427 }
430 this.current = current 428 this.current = current
431 this.show = show 429 this.show = show
432 }) 430 })
433 store.dispatch('myLoveList/getLoveList') 431 store.dispatch('myLoveList/getLoveList')
434 432
435 // 初始化SPL、CYL、AXI的值 433 // 初始化SPL、CYL、AXI的值
436 for (let j = 0; j < 3; j++) { 434 for (let j = 0; j < 3; j++) {
437 for(let i=-12;i<6;i++){ 435 for (let i = -12; i < 6; i++) {
438 this.pickerInfoList[j].nameArray1.push(i) 436 this.pickerInfoList[j].nameArray1.push(i)
439 this.pickerInfoList[j].nameArray1.push(i+0.5) 437 this.pickerInfoList[j].nameArray1.push(i + 0.5)
440 this.pickerInfoList[j].nameArray2.push(i) 438 this.pickerInfoList[j].nameArray2.push(i)
441 this.pickerInfoList[j].nameArray2.push(i+0.5) 439 this.pickerInfoList[j].nameArray2.push(i + 0.5)
442 if(i>=-6){ 440 if (i >= -6) {
443 this.pickerInfoList[j].nameArray1.push(i+0.25) 441 this.pickerInfoList[j].nameArray1.push(i + 0.25)
444 this.pickerInfoList[j].nameArray1.push(i+0.75) 442 this.pickerInfoList[j].nameArray1.push(i + 0.75)
445 this.pickerInfoList[j].nameArray2.push(i+0.25) 443 this.pickerInfoList[j].nameArray2.push(i + 0.25)
446 this.pickerInfoList[j].nameArray2.push(i+0.75) 444 this.pickerInfoList[j].nameArray2.push(i + 0.75)
447 } 445 }
448 if(i==5){ 446 if (i === 5) {
449 this.pickerInfoList[j].nameArray1.push(i+1) 447 this.pickerInfoList[j].nameArray1.push(i + 1)
450 this.pickerInfoList[j].nameArray2.push(i+1) 448 this.pickerInfoList[j].nameArray2.push(i + 1)
451 } 449 }
452 } 450 }
453 } 451 }
454 // 初始化日期值 452 // 初始化日期值
455 for (let i = 1; i < 32; i++){ 453 for (let i = 1; i < 32; i++) {
456 this.pickerInfoList[3].nameArray3.push(i) 454 this.pickerInfoList[3].nameArray3.push(i)
457 } 455 }
458 // 初始化年份前后五年 456 // 初始化年份前后五年
459 let myDate = new Date(); 457 const myDate = new Date()
460 let nowYear = myDate.getFullYear(); 458 const nowYear = myDate.getFullYear()
461 for(let i=0;i<5;i++){ 459 for (let i = 0; i < 5; i++) {
462 this.pickerInfoList[3].nameArray1.push(nowYear-i) 460 this.pickerInfoList[3].nameArray1.push(nowYear - i)
463 } 461 }
464 }, 462 },
465 methods: { 463 methods: {
466 // picker相关功能 464 // picker相关功能
467 handleInput(e){ 465 handleInput(e) {
468 this.name=e.target.value 466 this.name = e.target.value
469 this.isDataName = false 467 this.isDataName = false
470 console.log('e---->', e) 468 console.log('e---->', e)
471 const mpList = this.mpList 469 const mpList = this.mpList
472 console.log('mpList===>',mpList) 470 console.log('mpList===>', mpList)
473 for (let index = 0; index < mpList.length; index++) { 471 for (let index = 0; index < mpList.length; index++) {
474 if (e.detail.value === mpList[index].name) { 472 if (e.detail.value === mpList[index].name) {
475 this.isDataName = true 473 this.isDataName = true
476 uni.showModal({ 474 uni.showModal({
477 title: '提示', 475 title: '提示',
478 content: `是否填充已有的"${e.detail.value}"的数据`, 476 content: `是否填充已有的"${e.detail.value}"的数据`,
479 success: (res) => { 477 success: (res) => {
480 if (res.confirm) { 478 if (res.confirm) {
481 this.kinds=2 479 this.kinds = 2
482 console.log('args===>',index) 480 console.log('args===>', index)
483 // const mpList=Object.assign({},this.$store.state.mympList.mpList) 481 // const mpList=Object.assign({},this.$store.state.mympList.mpList)
484 console.log('mpList===>',mpList) 482 console.log('mpList===>', mpList)
485 this.name=mpList[index].name 483 this.name = mpList[index].name
486 this.pd=mpList[index].pd 484 this.pd = mpList[index].pd
487 this.mp_id=mpList[index].mp_id 485 this.mp_id = mpList[index].mp_id
488 this.oldname=mpList[index].name 486 this.oldname = mpList[index].name
489 this.oldpd=mpList[index].pd 487 this.oldpd = mpList[index].pd
490 // 将kinds =2时的值传到该页面 488 // 将kinds =2时的值传到该页面
491 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph) 489 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph)
492 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph) 490 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph)
493 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl) 491 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl)
494 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl) 492 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl)
495 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi) 493 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi)
496 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi) 494 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi)
497 495 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0, 4))
498 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0,4)) 496 if (mpList[index].in_time.toString().slice(5, 6) === 0) {
499 if(mpList[index].in_time.toString().slice(5,6)==0){ 497 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6, 7))
500 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6,7)) 498 } else {
501 } else{ 499 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5, 7))
502 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5,7)) 500 }
503 } 501 if (mpList[index].in_time.toString().slice(8, 9) === 0) {
504 if(mpList[index].in_time.toString().slice(8,9)==0){ 502 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9, 10))
505 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9,10)) 503 } else {
506 } else{ 504 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8, 10))
507 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8,10)) 505 }
508 } 506 // this.checkedData = mpList[index]
509 // this.checkedData = mpList[index] 507 // console.log('checkedData', this.checkedData)
510 // console.log('checkedData', this.checkedData) 508 } else if (res.cancel) {
511 } else if(res.cancel){ 509 this.kinds = 2
512 this.kinds=2 510 }
513 } 511 },
514 } 512 })
515 }) 513 }
516 } 514 }
517 } 515 },
518 }, 516 handleInputPd(e) {
519 handleInputPd(e){ 517 // 只能输入正浮点数或正数
520 // 只能输入正浮点数或正数 518 if (/^\d+(\.\d+)?$/.test(e.target.value)) {
521 if(/^\d+(\.\d+)?$/.test(e.target.value)){ 519 this.pd = e.target.value
522 this.pd=e.target.value 520 } else {
523 } else { 521 uni.showToast({
524 uni.showToast({ 522 title: '请输入有效数据;示例:89',
525 title:"请输入有效数据;示例:89", 523 icon: 'none',
526 icon: "none", 524 duration: 2000,
527 duration: 2000, 525 })
528 }) 526 this.pd = ''
529 this.pd = '' 527 }
530 } 528 },
531
532 },
533 changeConfirm() { 529 changeConfirm() {
534 this.confirm = !this.confirm 530 this.confirm = !this.confirm
531 },
532 bindPickerChange01: function(e) {
533 this.pickerInfoList[0].nameIndex1 = e.target.value
534 this.pickerInfoChioce.leftSph = this.pickerInfoList[0].nameArray1[e.target.value]
535 },
536 bindPickerChange02: function(e) {
537 this.pickerInfoList[0].nameIndex2 = e.target.value
538 this.pickerInfoChioce.rightSph = this.pickerInfoList[0].nameArray2[e.target.value]
539 },
540
541 bindPickerChange11: function(e) {
542 this.pickerInfoList[1].nameIndex1 = e.target.value
543 this.pickerInfoChioce.leftCyl = this.pickerInfoList[1].nameArray1[e.target.value]
544 },
545 bindPickerChange12: function(e) {
546 this.pickerInfoList[1].nameIndex2 = e.target.value
547 this.pickerInfoChioce.rightCyl = this.pickerInfoList[1].nameArray2[e.target.value]
548 },
549
550 bindPickerChange21: function(e) {
551 this.pickerInfoList[2].nameIndex1 = e.target.value
552 this.pickerInfoChioce.leftAxi = this.pickerInfoList[2].nameArray1[e.target.value]
553 },
554 bindPickerChange22: function(e) {
555 this.pickerInfoList[2].nameIndex2 = e.target.value
556 this.pickerInfoChioce.rightAxi = this.pickerInfoList[2].nameArray2[e.target.value]
557 },
558
559 bindPickerChange41: function(e) {
560 this.pickerInfoList[3].nameIndex1 = e.target.value
561 this.pickerInfoChioce.time.year = this.pickerInfoList[3].nameArray1[e.target.value]
535 }, 562 },
536 bindPickerChange01: function(e) { 563 bindPickerChange42: function(e) {
537 this.pickerInfoList[0].nameIndex1 = e.target.value 564 this.pickerInfoList[3].nameIndex2 = e.target.value
538 this.pickerInfoChioce.leftSph=this.pickerInfoList[0].nameArray1[e.target.value] 565 this.pickerInfoChioce.time.month = this.pickerInfoList[3].nameArray2[e.target.value]
539 }, 566 },
540 bindPickerChange02: function(e) { 567 bindPickerChange43: function(e) {
541 this.pickerInfoList[0].nameIndex2 = e.target.value 568 this.pickerInfoList[3].nameIndex3 = e.target.value
542 this.pickerInfoChioce.rightSph=this.pickerInfoList[0].nameArray2[e.target.value] 569 this.pickerInfoChioce.time.day = this.pickerInfoList[3].nameArray3[e.target.value]
543 }, 570 },
544 571 changeShow(num) {
545 bindPickerChange11: function(e) {
546 this.pickerInfoList[1].nameIndex1 = e.target.value
547 this.pickerInfoChioce.leftCyl=this.pickerInfoList[1].nameArray1[e.target.value]
548 },
549 bindPickerChange12: function(e) {
550 this.pickerInfoList[1].nameIndex2 = e.target.value
551 this.pickerInfoChioce.rightCyl=this.pickerInfoList[1].nameArray2[e.target.value]
552 },
553
554 bindPickerChange21: function(e) {
555 this.pickerInfoList[2].nameIndex1 = e.target.value
556 this.pickerInfoChioce.leftAxi=this.pickerInfoList[2].nameArray1[e.target.value]
557 },
558 bindPickerChange22: function(e) {
559 this.pickerInfoList[2].nameIndex2 = e.target.value
560 this.pickerInfoChioce.rightAxi=this.pickerInfoList[2].nameArray2[e.target.value]
561 },
562
563 bindPickerChange41: function(e) {
564 this.pickerInfoList[3].nameIndex1 = e.target.value
565 this.pickerInfoChioce.time.year=this.pickerInfoList[3].nameArray1[e.target.value]
566 },
567 bindPickerChange42: function(e) {
568 this.pickerInfoList[3].nameIndex2 = e.target.value
569 this.pickerInfoChioce.time.month=this.pickerInfoList[3].nameArray2[e.target.value]
570 },
571 bindPickerChange43: function(e) {
572 this.pickerInfoList[3].nameIndex3 = e.target.value
573 this.pickerInfoChioce.time.day=this.pickerInfoList[3].nameArray3[e.target.value]
574 },
575
576 change(num) {
577 this.show[num] = !this.show[num] 572 this.show[num] = !this.show[num]
578 this.$forceUpdate() 573 this.$forceUpdate()
579 }, 574 },
580 onClickItem(index, i) { 575 onClickItem(index, i) {
581 if (this.current[index] !== i) { 576 if (this.current[index] !== i) {
582 this.current[index] = i 577 this.current[index] = i
583 } 578 }
584 this.$forceUpdate() 579 this.$forceUpdate()
585 }, 580 },
586 onClickItem1(index) { 581 // onClickItem1(index) {
587 if (this.current1 !== index) { 582 // if (this.current1 !== index) {
588 this.current1 = index 583 // this.current1 = index
589 this.chooseRes1 = this.chooseItem1[index].describ 584 // this.chooseRes1 = this.chooseItem1[index].describ
590 } 585 // }
591 }, 586 // },
592 onClickItem2(index) { 587 // onClickItem2(index) {
593 if (this.current2 !== index) { 588 // if (this.current2 !== index) {
594 this.current2 = index 589 // this.current2 = index
595 this.chooseRes2 = this.chooseItem2[index].num 590 // this.chooseRes2 = this.chooseItem2[index].num
596 } 591 // }
597 }, 592 // },
598 onClickItem3(index) { 593 // onClickItem3(index) {
599 if (this.current3 !== index) { 594 // if (this.current3 !== index) {
600 this.current3 = index 595 // this.current3 = index
601 this.chooseRes3 = this.chooseItem3[index] 596 // this.chooseRes3 = this.chooseItem3[index]
602 } 597 // }
603 }, 598 // },
604 counter(isadd) { 599 counter(isadd) {
605 if (isadd) { 600 if (isadd) {
606 this.count >= this.maxCount ? this.addDisabled = true : this.count++ 601 this.count >= this.maxCount ? this.addDisabled = true : this.count++
607 } else { 602 } else {
608 this.count <= 1 ? this.desDisabled = true : this.count-- 603 this.count <= 1 ? this.desDisabled = true : this.count--
609 } 604 }
610 }, 605 },
611 toComfirmOrder() { 606 toComfirmOrder() {
612 // 先处理验光部分的逻辑，如果ok在跳转 607 // 先处理验光部分的逻辑，如果ok在跳转
613 let flag=0; 608 let flag = 0
614 if(this.name==''){ 609 if (this.name === '') {
615 uni.showToast({ 610 uni.showToast({
616 title:"请输入验光单取名", 611 title: '请输入验光单取名',
617 icon: "none", 612 icon: 'none',
618 duration: 2000, 613 duration: 2000,
619 }) 614 })
620 }else{ 615 } else {
621 616 if (this.pd === '') {
622 if(this.pd==''){ 617 uni.showToast({
623 uni.showToast({ 618 title: '请输入瞳距',
624 title:"请输入瞳距", 619 icon: 'none',
625 icon: "none", 620 duration: 2000,
626 duration: 2000, 621 })
627 }) 622 } else {
628 }else{ 623 if (this.kinds === 1) {
629 624 // 添加用户验光单
630 if(this.kinds==1){ 625 console.log('kinds====>', this.pickerInfoChioce.leftSph)
631 // 添加用户验光单 626 console.log('kinds====>', this.pickerInfoChioce.leftSph === Number)
632 console.log('kinds====>',this.pickerInfoChioce.leftSph) 627 console.log('kinds====>', this.pickerInfoChioce.rightSph === Number)
633 console.log('kinds====>',this.pickerInfoChioce.leftSph==Number) 628 if (this.pickerInfoChioce.rightSph === '' || this.pickerInfoChioce.leftSph === '' ||
634 console.log('kinds====>',this.pickerInfoChioce.rightSph==Number) 629 this.pickerInfoChioce.leftCyl === '' || this.pickerInfoChioce.rightCyl === '' ||
635 if(this.pickerInfoChioce.rightSph==''||this.pickerInfoChioce.leftSph==''|| 630 this.pickerInfoChioce.leftAxi === '' || this.pickerInfoChioce.rightAxi === ''
636 this.pickerInfoChioce.leftCyl==''||this.pickerInfoChioce.rightCyl==''|| 631 ) {
637 this.pickerInfoChioce.leftAxi==''||this.pickerInfoChioce.rightAxi=='' 632 uni.showToast({
638 ){ 633 title: '请输入您的验光数据',
639 uni.showToast({ 634 icon: 'none',
640 title:"请输入您的验光数据", 635 duration: 2000,
641 icon: "none", 636 })
642 duration: 2000, 637 } else {
643 }) 638 if (this.confirm) {
644 }else{ 639 store.dispatch('myLoveList/addMylove', {
645 if(this.confirm){ 640 uid: this.$store.state.user.userInfo.uid,
646 store.dispatch('myLoveList/addMylove', { 641 openid: this.$store.state.user.userInfo.openid,
647 uid: this.$store.state.user.userInfo.uid, 642 // mp_name: this.$store.state.user.userInfo.mp_name,
648 openid: this.$store.state.user.userInfo.openid, 643 leftSph: this.pickerInfoChioce.leftSph,
649 // mp_name: this.$store.state.user.userInfo.mp_name, 644 rightSph: this.pickerInfoChioce.rightSph,
650 leftSph: this.pickerInfoChioce.leftSph, 645 leftCyl: this.pickerInfoChioce.leftCyl,
651 rightSph: this.pickerInfoChioce.rightSph, 646 rightCyl: this.pickerInfoChioce.rightCyl,
652 leftCyl: this.pickerInfoChioce.leftCyl, 647 leftAxi: this.pickerInfoChioce.leftAxi,
653 rightCyl: this.pickerInfoChioce.rightCyl, 648 rightAxi: this.pickerInfoChioce.rightAxi,
654 leftAxi: this.pickerInfoChioce.leftAxi, 649 pd: this.pd, // 瞳距
655 rightAxi: this.pickerInfoChioce.rightAxi, 650 mp_name: this.name,
656 pd: this.pd,// 瞳距 651 // time: this.pickerInfoChioce.time,
657 mp_name:this.name, 652 // img_url2: "http://localhost:8087/images/shop_1/1/",
658 // time: this.pickerInfoChioce.time, 653 }).then(({ mp_id: mpId }) => {
659 // img_url2: "http://localhost:8087/images/shop_1/1/", 654 this.mp_id = mpId
660 }); 655 })
661 flag=1 656 flag = 1
662 } else{ 657 } else {
663 uni.showToast({ 658 uni.showToast({
664 title:"请确认您的验光数据", 659 title: '请确认您的验光数据',
665 icon: "none", 660 icon: 'none',
666 duration: 3000, 661 duration: 3000,
667 }) 662 })
668 } 663 }
669 } 664 }
670 } 665 }
671 if(this.kinds==2){ 666 if (this.kinds === 2) {
672 // console.log('kinds====>',this.kinds) 667 // console.log('kinds====>',this.kinds)
673 // console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1) 668 // console.log('pickerindex=====>',this.pickerInfoList[0].nameIndex1)
674 // console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce)) 669 // console.log('this.pickerInfoChioce====>',type(this.pickerInfoChioce))
675 if(this.confirm){ 670 if (this.confirm) {
676 const leftList = ["leftSph","leftCyl","leftAxi"]; 671 const leftList = ['leftSph', 'leftCyl', 'leftAxi']
677 const rightList = ["rightSph", "rightCyl", "rightAxi"]; 672 const rightList = ['rightSph', 'rightCyl', 'rightAxi']
678 // let flag=0; 673 // let flag=0;
679 if(this.name!=this.oldname){ 674 if (this.name !== this.oldname) {
680 store.dispatch('myLoveList/updateMylove', { 675 store.dispatch('myLoveList/updateMylove', {
681 uid: this.$store.state.user.userInfo.uid, 676 uid: this.$store.state.user.userInfo.uid,
682 openid: this.$store.state.user.userInfo.openid, 677 openid: this.$store.state.user.userInfo.openid,
683 mp_id: this.mp_id, 678 mp_id: this.mp_id,
684 keyname: 'name', 679 keyname: 'name',
685 keyvalue: this.name, 680 keyvalue: this.name,
686 }); 681 })
687 flag=1 682 flag = 1
688 } 683 }
689 if(this.pd!=this.oldpd){ 684 if (this.pd !== this.oldpd) {
690 store.dispatch('myLoveList/updateMylove', { 685 store.dispatch('myLoveList/updateMylove', {
691 uid: this.$store.state.user.userInfo.uid, 686 uid: this.$store.state.user.userInfo.uid,
692 openid: this.$store.state.user.userInfo.openid, 687 openid: this.$store.state.user.userInfo.openid,
693 mp_id: this.mp_id, 688 mp_id: this.mp_id,
694 keyname: 'pd', 689 keyname: 'pd',
695 keyvalue: this.pd, 690 keyvalue: this.pd,
696 }); 691 })
697 flag=1 692 flag = 1
698 } 693 }
699 // 先验证是否输入有无空 694 // 先验证是否输入有无空
700 let q= true; 695 let q = true
701 for(let k=0; k<3;k++){ 696 for (let k = 0; k < 3; k++) {
702 q=q&&(this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1]!=''&& 697 q = q && (this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1] !== '' &&
703 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2]!='') 698 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2] !== '')
704 } 699 }
705 if(q){ 700 if (q) {
706 701 for (let j = 0; j < 3; j++) {
707 for (let j=0; j<3; j++) { 702 if (this.pickerInfoList[j].nameIndex1 !== 0) {
708 if(this.pickerInfoList[j].nameIndex1!=0){ 703 store.dispatch('myLoveList/updateMylove', {
709 store.dispatch('myLoveList/updateMylove', { 704 uid: this.$store.state.user.userInfo.uid,
710 uid: this.$store.state.user.userInfo.uid, 705 openid: this.$store.state.user.userInfo.openid,
711 openid: this.$store.state.user.userInfo.openid, 706 mp_id: this.mp_id,
712 mp_id: this.mp_id, 707 keyname: leftList[j],
713 keyname: leftList[j], 708 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
714 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1], 709 })
715 }); 710 }
716 } 711 if (this.pickerInfoList[j].nameIndex2 !== 0) {
717 if(this.pickerInfoList[j].nameIndex2!=0){ 712 store.dispatch('myLoveList/updateMylove', {
718 store.dispatch('myLoveList/updateMylove', { 713 uid: this.$store.state.user.userInfo.uid,
719 uid: this.$store.state.user.userInfo.uid, 714 openid: this.$store.state.user.userInfo.openid,
720 openid: this.$store.state.user.userInfo.openid, 715 mp_id: this.mp_id,
721 mp_id: this.mp_id, 716 keyname: rightList[j],
722 keyname: rightList[j], 717 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2],
723 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2] 718 })
724 }); 719 }
725 } 720 flag = 1
726 flag=1; 721 }
727 } 722 } else {
728 }else{ 723 flag = 0
729 flag=0; 724 uni.showToast({
730 uni.showToast({ 725 title: '请输入您的验光数据',
731 title:"请输入您的验光数据", 726 icon: 'none',
732 icon: "none", 727 duration: 2000,
733 duration: 2000, 728 })
734 }) 729 }
735 730 if (flag !== 0) {
736 } 731 store.dispatch('myLoveList/getLoveList', {
737 if(flag!=0){ 732 uid: this.$store.state.user.userInfo.uid,
738 store.dispatch('myLoveList/getLoveList', { 733 })
739 uid: this.$store.state.user.userInfo.uid, 734 }
740 }); 735 } else {
741 } 736 uni.showToast({
742 737 title: '请确认您的验光数据',
743 } else{ 738 icon: 'none',
744 uni.showToast({ 739 duration: 3000,
745 title:"请确认您的验光数据", 740 })
746 icon: "none", 741 }
747 duration: 3000, 742 }
748 }) 743 }
749 } 744 }
750 } 745 if (flag !== 0) {
751 } 746 // 如果数据验证无误，那么更新验光单的数据
752 747 store.dispatch('myLoveList/getLoveList', {
753 } 748 uid: this.$store.state.user.userInfo.uid,
754 if(flag!=0){ 749 })
755 // 如果数据验证无误，那么更新验光单的数据 750 let i = 0
756 store.dispatch('myLoveList/getLoveList', { 751 // 判断出是哪一个sku被选中
757 uid: this.$store.state.user.userInfo.uid, 752 for (let index = 0; index < this.current.length; index++) {
758 }); 753 console.log('index', index, i, index !== this.current.length - 1)
759 let i = 0 754 if (index !== this.current.length - 1) {
760 // 判断出是哪一个sku被选中 755 // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应
761 for (let index = 0; index < this.current.length; index++) { 756 i = this.current[index] * this.attrList[1].attr.length
762 console.log('index', index, i, index !== this.current.length - 1) 757 } else {
763 if (index !== this.current.length - 1) { 758 i += this.current[index]
764 console.log('----', this.current[index], this.attrList[1].attr.length, this.attrList) 759 }
765 i = this.current[index] * this.attrList[1].attr.length 760 }
766 } else { 761 // 判断是否其输入的人员数据是否已存在
767 i += this.current[index] 762 store.dispatch('order/saveParams', {
768 } 763 sk_id_arr: this.skuList[i],
769 console.log('i', i) 764 current: this.current,
770 } 765 mp_id: this.mp_id,
771 console.log('i------>', i) 766 attrList: this.attrList,
772 // 判断是否其输入的人员数据是否已存在 767 })
773 store.dispatch('order/saveParams', { 768 // 跳转到确认订单页面
774 sk_id_arr: this.skuList[i], 769 uni.navigateTo({
775 current: this.current 770 url: `../confirmOrder/confirmOrder?pid=${this.pid}`,
776 }) 771 })
777 772 }
778 uni.navigateTo({ 773 },
779 url: `../confirmOrder/confirmOrder?pid=${this.pid}` 774 },
780 })
781 }
782
783 }
784 }
785 } 775 }
786 </script> 776 </script>
787 777
788 <style lang="scss"> 778 <style lang="scss">
789 .content { 779 .content {
790 min-height: 100vh; 780 min-height: 100vh;
791 background-color: #f2f2f2; 781 background-color: #f2f2f2;
792 // padding-top: 20rpx; 782 // padding-top: 20rpx;
793 .goodInfo { 783 .goodInfo {
794 width: 100%; 784 width: 100%;
795 height: 272rpx; 785 height: 272rpx;
796 border-radius: 16rpx; 786 border-radius: 16rpx;
797 background-color: #ffffff; 787 background-color: #ffffff;
798 box-sizing: border-box; 788 box-sizing: border-box;
799 padding: 36rpx; 789 padding: 36rpx;
800 display: flex; 790 display: flex;
801 flex-direction: row; 791 flex-direction: row;
802 justify-content: flex-start; 792 justify-content: flex-start;
803 .imageWrap { 793 .imageWrap {
804 height: 188rpx; 794 height: 188rpx;
805 width: 188rpx; 795 width: 188rpx;
806 margin-right: 28rpx; 796 margin-right: 28rpx;
807 image { 797 image {
808 height: 188rpx; 798 height: 188rpx;
809 width: 188rpx; 799 width: 188rpx;
810 } 800 }
811 } 801 }
812 .infoRight { 802 .infoRight {
813 display: flex; 803 display: flex;
814 flex-direction: column; 804 flex-direction: column;
815 align-items: flex-start; 805 align-items: flex-start;
816 justify-content: space-between; 806 justify-content: space-between;
817 .goodName { 807 .goodName {
818 font-size: 28rpx; 808 font-size: 28rpx;
819 color: #333333; 809 color: #333333;
820 } 810 }
821 .remarks { 811 .remarks {
822 font-size: 20rpx; 812 font-size: 20rpx;
823 color: #999999; 813 color: #999999;
824 } 814 }
825 .priceBox { 815 .priceBox {
826 display: flex; 816 display: flex;
827 justify-content: space-between; 817 justify-content: space-between;
828 align-items: center; 818 align-items: center;
829 width: 100%; 819 width: 100%;
830 font-size: 14px; 820 font-size: 14px;
831 color: #999999; 821 color: #999999;
832 .price { 822 .price {
833 color: #ff6b4a; 823 color: #ff6b4a;
834 font-size: 28rpx; 824 font-size: 28rpx;
835 } 825 }
836 .counter { 826 .counter {
837 display: flex; 827 display: flex;
838 flex-direction: row; 828 flex-direction: row;
839 justify-content: space-between; 829 justify-content: space-between;
840 align-items: center; 830 align-items: center;
841 font-size: 28rpx; 831 font-size: 28rpx;
842 color: #333333; 832 color: #333333;
843 width: 122rpx; 833 width: 122rpx;
844 .btn { 834 .btn {
845 display: flex; 835 display: flex;
846 justify-content: center; 836 justify-content: center;
847 line-height: 32rpx; 837 line-height: 32rpx;
848 height: 32rpx; 838 height: 32rpx;
849 width: 32rpx; 839 width: 32rpx;
850 background-color: #f2f2f2; 840 background-color: #f2f2f2;
851 color: #cfcfcf; 841 color: #cfcfcf;
852 } 842 }
853 } 843 }
854 } 844 }
855 } 845 }
856 } 846 }
857 .goods-data { 847 .goods-data {
858 width: 100%; 848 width: 100%;
859 box-sizing: border-box; 849 box-sizing: border-box;
860 padding: 37rpx 40rpx 0 40rpx; 850 padding: 37rpx 40rpx 0 40rpx;
861 background: #ffffff; 851 background: #ffffff;
862 border-radius: 12rpx; 852 border-radius: 12rpx;
863 .opCollapse { 853 .opCollapse {
864 width: 100%; 854 width: 100%;
865 padding-bottom: 28rpx; 855 padding-bottom: 28rpx;
866 margin-top: 7px; 856 margin-top: 7px;
867 border-bottom: 1px solid #e9e9e9; 857 border-bottom: 1px solid #e9e9e9;
868 .head { 858 .head {
869 display: flex; 859 display: flex;
870 justify-content: space-between; 860 justify-content: space-between;
871 height: 24px; 861 height: 24px;
872 // font-family: PingFangSC-Medium; 862 // font-family: PingFangSC-Medium;
873 font-size: 16px; 863 font-size: 16px;
874 color: #333333; 864 color: #333333;
875 letter-spacing: -0.3px; 865 letter-spacing: -0.3px;
876 text-align: justify; 866 text-align: justify;
877 line-height: 24px; 867 line-height: 24px;
878 margin-bottom: 18rpx; 868 margin-bottom: 18rpx;
879 .headRighted { 869 .headRighted {
880 width: 0; 870 width: 0;
881 height: 0; 871 height: 0;
882 border-left: 4px solid transparent; 872 border-left: 4px solid transparent;
883 border-right: 4px solid transparent; 873 border-right: 4px solid transparent;
884 border-bottom: 4px solid #cfcfcf; 874 border-bottom: 4px solid #cfcfcf;
885 transform: scaleY(-1); 875 transform: scaleY(-1);
886 margin-top: 10px; 876 margin-top: 10px;
887 } 877 }
888 .headMid { 878 .headMid {
889 // font-family: PingFangSC-Regular; 879 // font-family: PingFangSC-Regular;
890 font-size: 10px; 880 font-size: 10px;
891 color: #999999; 881 color: #999999;
892 letter-spacing: -0.19px; 882 letter-spacing: -0.19px;
893 margin-left: -120rpx; 883 margin-left: -120rpx;
894 } 884 }
895 .headRight { 885 .headRight {
896 width: 0; 886 width: 0;
897 height: 0; 887 height: 0;
898 border-left: 4px solid transparent; 888 border-left: 4px solid transparent;
899 border-right: 4px solid transparent; 889 border-right: 4px solid transparent;
900 border-bottom: 4px solid #cfcfcf; 890 border-bottom: 4px solid #cfcfcf;
901 margin-top: 10px; 891 margin-top: 10px;
902 } 892 }
903 } 893 }
904 .body { 894 .body {
905 // font-family: PingFangSC-Regular; 895 // font-family: PingFangSC-Regular;
906 font-size: 12px; 896 font-size: 12px;
907 color: #666666; 897 color: #666666;
908 letter-spacing: 0; 898 letter-spacing: 0;
909 .bodyBox { 899 .bodyBox {
910 margin-top: 15px; 900 margin-top: 15px;
911 .names { 901 .names {
912 // font-family: PingFangSC-Regular; 902 // font-family: PingFangSC-Regular;
913 font-size: 12px; 903 font-size: 12px;
914 color: #151515; 904 color: #151515;
915 letter-spacing: 0; 905 letter-spacing: 0;
916 text-align: justify; 906 text-align: justify;
917 line-height: 17px; 907 line-height: 17px;
918 margin-left: 5px; 908 margin-left: 5px;
919 margin-right: 10px; 909 margin-right: 10px;
920 } 910 }
921 text { 911 text {
922 // font-family: PingFangSC-Regular; 912 // font-family: PingFangSC-Regular;
923 font-size: 12px; 913 font-size: 12px;
924 color: #666666; 914 color: #666666;
925 letter-spacing: 0; 915 letter-spacing: 0;
926 text-align: justify; 916 text-align: justify;
927 } 917 }
928 } 918 }
929 } 919 }
930 920
931 // .goods-form { 921 // .goods-form {
932 // display: flex; 922 // display: flex;
933 // flex-direction: column; 923 // flex-direction: column;
934 // align-items: center; 924 // align-items: center;
935 // justify-content: center; 925 // justify-content: center;
936 // background-color: #fff; 926 // background-color: #fff;
937 // width: 100%; 927 // width: 100%;
938 // .p1 { 928 // .p1 {
939 // font-size: 16px; 929 // font-size: 16px;
940 // color: #333333; 930 // color: #333333;
941 // letter-spacing: -0.3px; 931 // letter-spacing: -0.3px;
942 // text-align: justify; 932 // text-align: justify;
943 // line-height: 24px; 933 // line-height: 24px;
944 // margin: 4px 0; 934 // margin: 4px 0;
945 // } 935 // }
946 // .p2 { 936 // .p2 {
947 // font-size: 12px; 937 // font-size: 12px;
948 // color: #999999; 938 // color: #999999;
949 // letter-spacing: -0.23px; 939 // letter-spacing: -0.23px;
950 // margin-bottom: 18rpx; 940 // margin-bottom: 18rpx;
951 // } 941 // }
952 // image { 942 // image {
953 // width: 28rpx; 943 // width: 28rpx;
954 // height: 26rpx; 944 // height: 26rpx;
955 // } 945 // }
956 // .confirm { 946 // .confirm {
957 // display: flex; 947 // display: flex;
958 // align-items: center; 948 // align-items: center;
959 // font-size: 12px; 949 // font-size: 12px;
960 // color: #666666; 950 // color: #666666;
961 // letter-spacing: -0.23px; 951 // letter-spacing: -0.23px;
962 // width: 684rpx; 952 // width: 684rpx;
963 // image { 953 // image {
964 // margin-right: 25rpx; 954 // margin-right: 25rpx;
965 // } 955 // }
966 // } 956 // }
967 // .picker { 957 // .picker {
968 // display: flex; 958 // display: flex;
969 // flex-direction: column; 959 // flex-direction: column;
970 // justify-content: center; 960 // justify-content: center;
971 // align-items: center; 961 // align-items: center;
972 // width: 100%; 962 // width: 100%;
973 // image { 963 // image {
974 // width: 10px; 964 // width: 10px;
975 // height: 10px; 965 // height: 10px;
976 // margin-right: 5px; 966 // margin-right: 5px;
977 // } 967 // }
978 // .picker-choice { 968 // .picker-choice {
979 // display: flex; 969 // display: flex;
980 // width: 684rpx; 970 // width: 684rpx;
981 // align-items: center; 971 // align-items: center;
982 // margin-bottom: 40rpx; 972 // margin-bottom: 40rpx;
983 // .choice-left { 973 // .choice-left {
984 // width: 210rpx; 974 // width: 210rpx;
985 // .p11 { 975 // .p11 {
986 // font-size: 14px; 976 // font-size: 14px;
987 // color: #333333; 977 // color: #333333;
988 // letter-spacing: -0.26px; 978 // letter-spacing: -0.26px;
989 // text-align: justify; 979 // text-align: justify;
990 // line-height: 24px; 980 // line-height: 24px;
991 // } 981 // }
992 // .p12 { 982 // .p12 {
993 // font-size: 10px; 983 // font-size: 10px;
994 // color: #3f3f3f; 984 // color: #3f3f3f;
995 // letter-spacing: -0.19px; 985 // letter-spacing: -0.19px;
996 // text-align: justify; 986 // text-align: justify;
997 // line-height: 24px; 987 // line-height: 24px;
998 // } 988 // }
999 // } 989 // }
1000 // .p13 { 990 // .p13 {
1001 // font-size: 10px; 991 // font-size: 10px;
1002 // color: #999999; 992 // color: #999999;
1003 // letter-spacing: -0.19px; 993 // letter-spacing: -0.19px;
1004 // margin-right: 10px; 994 // margin-right: 10px;
1005 // } 995 // }
1006 // .p13-date { 996 // .p13-date {
1007 // font-size: 10px; 997 // font-size: 10px;
1008 // color: #999999; 998 // color: #999999;
1009 // letter-spacing: -0.19px; 999 // letter-spacing: -0.19px;
1010 // margin-right: 5px; 1000 // margin-right: 5px;
1011 // } 1001 // }
1012 // .p14 { 1002 // .p14 {
1013 // font-size: 14px; 1003 // font-size: 14px;
1014 // color: #666666; 1004 // color: #666666;
1015 // letter-spacing: -0.26px; 1005 // letter-spacing: -0.26px;
1016 // text-align: center; 1006 // text-align: center;
1017 // width: 124rpx; 1007 // width: 124rpx;
1018 // border-bottom: 1px solid #cfcfcf; 1008 // border-bottom: 1px solid #cfcfcf;
1019 // } 1009 // }
1020 // } 1010 // }
1021 // } 1011 // }
1022 // } 1012 // }
1023 .goods-form { 1013 .goods-form {
1024 display: flex; 1014 display: flex;
1025 flex-direction: column; 1015 flex-direction: column;
1026 align-items: center; 1016 align-items: center;
1027 justify-content: center; 1017 justify-content: center;
1028 background-color: #fff; 1018 background-color: #fff;
1029 width: 100%; 1019 width: 100%;
1030 padding: 40rpx 0; 1020 padding: 40rpx 0;
1031 .p1 { 1021 .p1 {
1032 font-size: 16px; 1022 font-size: 16px;
1033 color: #333333; 1023 color: #333333;
1034 letter-spacing: -0.3px; 1024 letter-spacing: -0.3px;
1035 text-align: justify; 1025 text-align: justify;
1036 line-height: 24px; 1026 line-height: 24px;
1037 margin: 4px 0; 1027 margin: 4px 0;
1038 1028
1039 } 1029 }
1040 .p2 { 1030 .p2 {
1041 font-size: 12px; 1031 font-size: 12px;
1042 color: #999999; 1032 color: #999999;
1043 letter-spacing: -0.23px; 1033 letter-spacing: -0.23px;
1044 margin-bottom: 32rpx; 1034 margin-bottom: 32rpx;
1045 } 1035 }
1046 .image2{ 1036 .image2{
1047 width: 42rpx; 1037 width: 42rpx;
1048 height: 34rpx; 1038 height: 34rpx;
1049 margin-right: 12rpx; 1039 margin-right: 12rpx;
1050 } 1040 }
1051 .confirm { 1041 .confirm {
1052 display: flex; 1042 display: flex;
1053 align-items: center; 1043 align-items: center;
1054 font-size: 12px; 1044 font-size: 12px;
1055 color: #666666; 1045 color: #666666;
1056 letter-spacing: -0.23px; 1046 letter-spacing: -0.23px;
1057 width: 684rpx; 1047 width: 684rpx;
1058 .image1{ 1048 .image1{
1059 margin-right:25rpx; 1049 margin-right:25rpx;
1060 width: 42rpx; 1050 width: 42rpx;
1061 height: 38rpx; 1051 height: 38rpx;
1062 } 1052 }
1063 } 1053 }
1064 .picker{ 1054 .picker{
1065 display: flex; 1055 display: flex;
1066 flex-direction: column; 1056 flex-direction: column;
1067 justify-content: center; 1057 justify-content: center;
1068 align-items: center; 1058 align-items: center;
1069 width: 100%; 1059 width: 100%;
1070 1060
1071 .picker-choice{ 1061 .picker-choice{
1072 display: flex; 1062 display: flex;
1073 width: 684rpx; 1063 width: 684rpx;
1074 align-items: center; 1064 align-items: center;
1075 margin-bottom: 40rpx; 1065 margin-bottom: 40rpx;
1076 .input{ 1066 .input{
1077 border-bottom: 1px solid #CFCFCF; 1067 border-bottom: 1px solid #CFCFCF;
1078 height: 40rpx; 1068 height: 40rpx;
1079 } 1069 }
1080 .choice-left{ 1070 .choice-left{
1081 width: 210rpx; 1071 width: 210rpx;
1082 .pd{ 1072 .pd{
1083 font-size: 14px; 1073 font-size: 14px;
1084 color: #333333; 1074 color: #333333;
1085 letter-spacing: -0.26px; 1075 letter-spacing: -0.26px;
1086 text-align: justify; 1076 text-align: justify;
1087 line-height: 24px; 1077 line-height: 24px;
1088 margin-right: 44rpx; 1078 margin-right: 44rpx;
1089 } 1079 }
1090 .p11 { 1080 .p11 {
1091 font-size: 14px; 1081 font-size: 14px;
1092 color: #333333; 1082 color: #333333;
1093 letter-spacing: -0.26px; 1083 letter-spacing: -0.26px;
1094 text-align: justify; 1084 text-align: justify;
1095 line-height: 24px; 1085 line-height: 24px;
1096 // margin-right: 10px; 1086 // margin-right: 10px;
1097 } 1087 }
1098 .p12 { 1088 .p12 {
1099 font-size: 10px; 1089 font-size: 10px;
1100 color: #3F3F3F; 1090 color: #3F3F3F;
1101 letter-spacing: -0.19px; 1091 letter-spacing: -0.19px;
1102 text-align: justify; 1092 text-align: justify;
1103 line-height: 24px; 1093 line-height: 24px;
1104 } 1094 }
1105 1095
1106 1096 }
1107 } 1097 .p13 {
1108 .p13 { 1098 font-size: 10px;
1109 font-size: 10px; 1099 color: #999999;
1110 color: #999999; 1100 letter-spacing: -0.19px;
1111 letter-spacing: -0.19px; 1101 margin-right: 10px;
1112 margin-right: 10px; 1102 }
1113 } 1103 .p13-date {
1114 .p13-date { 1104 font-size: 10px;
1115 font-size: 10px; 1105 color: #999999;
1116 color: #999999; 1106 letter-spacing: -0.19px;
1117 letter-spacing: -0.19px; 1107 margin-right: 5px;
1118 margin-right: 5px; 1108 }
1119 } 1109 picker{
1120 picker{ 1110 width: 144rpx;
1121 width: 144rpx; 1111 height: 40rpx;
1122 height: 40rpx; 1112 display: flex;
1123 display: flex; 1113 position: relative;
1124 position: relative; 1114 .p14 {
1125 .p14 { 1115 font-size: 14px;
1126 font-size: 14px; 1116 color: #666666;
1127 color: #666666; 1117 letter-spacing: -0.26px;
1128 letter-spacing: -0.26px; 1118 text-align: center;
1129 text-align: center; 1119 width: 124rpx;
1130 width: 124rpx; 1120 border-bottom: 1px solid #CFCFCF;
1131 border-bottom: 1px solid #CFCFCF; 1121 height: 38rpx;
1132 height: 38rpx; 1122 }
1133 } 1123 image{
1134 image{ 1124 width: 20rpx;
1135 width: 20rpx; 1125 height: 20rpx;
1136 height: 20rpx; 1126 position: absolute;
1137 position: absolute; 1127 right: 20rpx;
1138 right: 20rpx; 1128 top: 8rpx;
1139 top: 8rpx; 1129 }
1140 } 1130 }
1141 } 1131
1142 1132 }
1143 1133 }
1144 } 1134 }
1145 }
1146 }
1147 } 1135 }
1148 } 1136 }
1149 .choose { 1137 .choose {
1150 width: 100%; 1138 width: 100%;
1151 background: #ffffff; 1139 background: #ffffff;
1152 border-radius: 12rpx; 1140 border-radius: 12rpx;
1153 margin-top: 20rpx; 1141 margin-top: 20rpx;
1154 padding: 40rpx 40rpx 112rpx 40rpx; 1142 padding: 40rpx 40rpx 112rpx 40rpx;
1155 box-sizing: border-box; 1143 box-sizing: border-box;
1156 .chooseItem { 1144 .chooseItem {
1157 width: 100%; 1145 width: 100%;
1158 padding-bottom: 32rpx; 1146 padding-bottom: 32rpx;
1159 border-bottom: 1px solid #e9e9e9; 1147 border-bottom: 1px solid #e9e9e9;
1160 margin-bottom: 28rpx; 1148 margin-bottom: 28rpx;
1161 } 1149 }
1162 .chooseRes { 1150 .chooseRes {
1163 font-size: 12px; 1151 font-size: 12px;
1164 color: #666666; 1152 color: #666666;
1165 } 1153 }
1166 .itemsWrap { 1154 .itemsWrap {
1167 display: flex; 1155 display: flex;
1168 flex-direction: row; 1156 flex-direction: row;
1169 flex-wrap: wrap; 1157 flex-wrap: wrap;
1170 justify-content: flex-start; 1158 justify-content: flex-start;
1171 align-items: center; 1159 align-items: center;
1172 padding-top: 24rpx; 1160 padding-top: 24rpx;
1173 .item1 { 1161 .item1 {
1174 width: 64rpx; 1162 width: 64rpx;
1175 height: 64rpx; 1163 height: 64rpx;
1176 border-radius: 32rpx; 1164 border-radius: 32rpx;
1177 margin: 0 36rpx 24rpx 0; 1165 margin: 0 36rpx 24rpx 0;
1178 transition: all 0.3s; 1166 transition: all 0.3s;
1179 border: 1px solid #ffffff; 1167 border: 1px solid #ffffff;
1180 } 1168 }
1181 .item2 { 1169 .item2 {
1182 // width: 100rpx; 1170 // width: 100rpx;
1183 padding: 0 30rpx; 1171 padding: 0 30rpx;
1184 height: 60rpx; 1172 height: 60rpx;
1185 margin: 0 20rpx 20rpx 0; 1173 margin: 0 20rpx 20rpx 0;
1186 transition: all 0.3s; 1174 transition: all 0.3s;
1187 background: #f2f2f2; 1175 background: #f2f2f2;
src/store/modules/myLoveList.js
Diff comments   View file @089dce1
1 import urlAlias from '../url' 1 import urlAlias from '../url'
2 import request from '../request' 2 import request from '../request'
3 3
4 const { 4 const {
5 mylovelist, 5 mylovelist,
6 myloveadd, 6 myloveadd,
7 myloveupdate 7 myloveupdate,
8 } = urlAlias 8 } = urlAlias
9 9
10 const state = { 10 const state = {
11 loveList: [] 11 loveList: [],
12 } 12 }
13 13
14 const mutations = { 14 const mutations = {
15 INIT: (state, data) => { 15 INIT: (state, data) => {
16 state.loveList = data 16 state.loveList = data
17 }, 17 },
18 // 更新关心人验光单 18 // 更新关心人验光单
19 UPDATE: (state, data) => { 19 UPDATE: (state, data) => {
20 // state.loveList.push(data) 20 // state.loveList.push(data)
21 // console.log('UPDATA=====>',data) 21 // console.log('UPDATA=====>',data)
22 } 22 },
23 } 23 }
24 24
25 const actions = { 25 const actions = {
26 getLoveList({ commit }, param) { 26 getLoveList({ commit }, param) {
27 request({ 27 request({
28 url: mylovelist, 28 url: mylovelist,
29 data: param, 29 data: param,
30 success: (res) => { 30 success: (res) => {
31 // console.log(res.data); 31 // console.log(res.data);
32 commit('INIT', res.data.data) 32 commit('INIT', res.data.data)
33 } 33 },
34 }) 34 })
35 }, 35 },
36 addMylove({ commit }, param) { 36 addMylove({ commit }, param) {
37 console.log('myloveupdate-parm====>', param) 37 console.log('myloveupdate-parm====>', param)
38 request({ 38 return new Promise((resolve) => request({
39 url: myloveadd, 39 url: myloveadd,
40 data: param, 40 data: param,
41 success: (res) => { 41 success: (res) => {
42 console.log('addMylove-parm====>', param) 42 console.log('addMylove-parm====>', param)
43 console.log(res.data) 43 console.log(res.data)
44 resolve(res.data)
44 // commit("ADD", args); 45 // commit("ADD", args);
45 } 46 },
46 }) 47 }))
47 }, 48 },
48 updateMylove({ commit }, param) { 49 updateMylove({ commit }, param) {
49 request({ 50 request({
50 url: myloveupdate, 51 url: myloveupdate,
51 data: param, 52 data: param,
52 success: (res) => { 53 success: (res) => {
53 console.log('myloveupdate-parm====>', param) 54 console.log('myloveupdate-parm====>', param)
54 console.log(res) 55 console.log(res)
55 // commit("UPDATE", param); 56 // commit("UPDATE", param);
56 } 57 },
57 }) 58 })
58 } 59 },
59 60
60 } 61 }
61 62
62 export default { 63 export default {
63 namespaced: true, 64 namespaced: true,
64 state, 65 state,
65 mutations, 66 mutations,
66 actions 67 actions,
67 } 68 }
68 69
src/store/modules/order.js
Diff comments   View file @089dce1
1 import urlAlias from '../url' 1 import urlAlias from '../url'
2 import request from '../request' 2 import request from '../request'
3 3
4 const { orderBuild } = urlAlias 4 const { orderBuild, buyNow, pay } = urlAlias
5 5
6 const state = { list: [], param: {} } 6 const state = { list: [], param: {} }
7 7
8 const mutations = { 8 const mutations = {
9 LIST: (state, list) => { 9 LIST: (state, list) => {
10 state.list = list 10 state.list = list
11 }, 11 },
12 SAVE: (state, param) => { 12 SAVE: (state, param) => {
13 state.param = param 13 state.param = param
14 } 14 },
15 } 15 }
16 16
17 const actions = { 17 const actions = {
18 // 立即购买->创建订单
19 buyNow({ commit }, param) {
20 return new Promise((resolve) => request({
21 url: buyNow,
22 data: param,
23 success: (res) => {
24 resolve(res)
25 },
26 fail: () => {
27 uni.showModal({
28 content: '创建订单失败',
29 showCancel: false,
30 })
31 },
32 }))
33 },
34 // 购物车->创建订单
18 build({ commit }, param) { 35 build({ commit }, param) {
19 return new Promise((resolve, reject) => request({ 36 return new Promise((resolve, reject) => request({
20 url: orderBuild, 37 url: orderBuild,
21 data: param, 38 data: param,
22 success: (res) => { 39 success: (res) => {
23 resolve() 40 resolve(res.data)
24 }, 41 },
25 fail: () => { 42 fail: () => {
26 uni.showModal({ 43 uni.showModal({
27 content: '订单生成失败', 44 content: '订单生成失败',
28 showCancel: false 45 showCancel: false,
29 }) 46 })
30 } 47 },
31 })) 48 }))
32 }, 49 },
50 // 支付
51 pay({ commit }, param) {
52 return new Promise((resolve, reject) => request({
53 url: pay,
54 data: param,
55 success: (res) => {
56 resolve(res.data)
57 },
58 fail: () => {
59 uni.showModal({
60 content: '订单生成失败',
61 showCancel: false,
62 })
63 },
64 }))
65 },
66 // 储存创建订单参数
33 saveParams({ commit }, param) { 67 saveParams({ commit }, param) {
34 console.log('save', param) 68 console.log('save', param)
35 commit('SAVE', param) 69 commit('SAVE', param)
36 } 70 },
37 } 71 }
38 72
39 export default { 73 export default {
40 namespaced: true, 74 namespaced: true,
41 state, 75 state,
42 mutations, 76 mutations,
43 actions 77 actions,
44 } 78 }
45 79
src/store/request.js
Diff comments   View file @089dce1
1 const DOMAIN = 'https://api.glass.xiuyetang.com' 1 const DOMAIN = 'https://api.glass.xiuyetang.com'
2 2
3 export default async function request({ 3 export default async function request({
4 url, 4 url,
5 method = 'post', 5 method = 'post',
6 data = {}, 6 data = {},
7 header = { 7 header = {
8 'Content-Type': 'application/x-www-form-urlencoded' 8 'Content-Type': 'application/x-www-form-urlencoded',
9 }, 9 },
10 timeout = 3000, 10 timeout = 3000,
11 withCredentials = false, // 跨域请求时是否携带凭证（cookies） 11 withCredentials = false, // 跨域请求时是否携带凭证（cookies）
12 // sslVerify: true, // 验证 ssl 证书 12 // sslVerify: true, // 验证 ssl 证书
13 success, 13 success,
14 fail = (res) => { 14 fail = (res) => {
15 console.log('fail status === > ', res) 15 console.log('fail status === > ', res)
16 }, 16 },
17 complete = (res) => { 17 complete = (res) => {
18 console.log('complete status === > ', res) 18 console.log('complete status === > ', res)
19 } 19 },
20 }) { 20 }) {
21 const uid = uni.getStorageSync('uid') 21 const uid = uni.getStorageSync('uid')
22 const openid = uni.getStorageSync('uid') 22 const openid = uni.getStorageSync('openid')
23 data = { 23 data = {
24 uid, 24 uid,
25 openid, 25 openid,
26 ...data 26 ...data,
27 } 27 }
28 uni 28 uni
29 .request({ 29 .request({
30 url: DOMAIN + url, 30 url: DOMAIN + url,
31 method, 31 method,
32 data, 32 data,
33 header, 33 header,
34 timeout, 34 timeout,
35 withCredentials, 35 withCredentials,
36 success, 36 success,
37 fail, 37 fail,
38 complete 38 complete,
39 }) 39 })
40 } 40 }
41 41
1 const urlAlias = { 1 const urlAlias = {
2 // 详情 2 // 详情
3 read: '/app/prod/read', // 获取商品信息 3 read: '/app/prod/read', // 获取商品信息
4 4
5 // 首页 5 // 首页
6 shopList: '/app/prod/list', // 获取首页商品列表 6 shopList: '/app/prod/list', // 获取首页商品列表
7 category: '/app/prod/category2', // 获取首页商品分类 7 category: '/app/prod/category2', // 获取首页商品分类
8 search: '/app/prod/search', // 首页搜索商品 8 search: '/app/prod/search', // 首页搜索商品
9 9
10 // 登陆 10 // 登陆
11 login: '/app/glass/getOpenId', // 登陆 11 login: '/app/glass/getOpenId', // 登陆
12 getUserInfo: '/app/glass/userinfo', // 获取用户信息 12 getUserInfo: '/app/glass/userinfo', // 获取用户信息
13 13
14 // 我的订单 14 // 我的订单
15 orderList: '/app/order/list', // 获取订单列表 15 orderList: '/app/order/list', // 获取订单列表
16 myOrderList: '/app/order/list3', // 获取订单列表 16 myOrderList: '/app/order/list3', // 获取订单列表
17 orderRead: '/app/order/read', // 获取订单详情 17 orderRead: '/app/order/read', // 获取订单详情
18 cancelOrder: '/app/order/wait/del', // 取消订单 18 cancelOrder: '/app/order/wait/del', // 取消订单
19 statusConfirm: '/app/order/statusConfirm', // 订单操作 19 statusConfirm: '/app/order/statusConfirm', // 订单操作
20 payLog: '/app/pay/log', // 调起支付 20 payLog: '/app/pay/log', // 调起支付
21 orderBuild: '/app/order/build', // 生成订单 21 orderBuild: '/app/order/build', // 加购后生成订单
22 buyNow: '/app/order/buynow', // 立即购买生成订单
23 pay: '/app/pay/log', // 支付接口
22 24
23 // 购物车 25 // 购物车
24 cartList: '/app/cart/list', // 获取购物车列表 26 cartList: '/app/cart/list', // 获取购物车列表
25 cartModi: '/app/cart/modi', // 修改购物车 27 cartModi: '/app/cart/modi', // 修改购物车
26 cartDel: '/app/cart/del', // 删除购物车 28 cartDel: '/app/cart/del', // 删除购物车
27 cartAdd: '/app/cart/add', // 添加购物车 29 cartAdd: '/app/cart/add', // 添加购物车
28 30
29 // 我的 31 // 我的
30 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品 32 recommandList: '/app/prod/recommand', // 获取用户个性化推荐商品
31 33
32 // 镜框选购页 34 // 镜框选购页
33 detailStandardList: '/app/prod/read', // 获取商品的详细信息 35 detailStandardList: '/app/prod/read', // 获取商品的详细信息
34 // 选购页 36 // 选购页
35 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息 37 detailStandardUrl: '/app/prod/read', // 获取商品的详细信息
36 38
37 // 地址管理 39 // 地址管理
38 editAddress: '/app/address/edit_address', // 编辑地址 40 editAddress: '/app/address/edit_address', // 编辑地址
39 addressList: '/app/address/get_address_list', // 获取用户地址列表 41 addressList: '/app/address/get_address_list', // 获取用户地址列表
40 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息 42 getAddress: '/app/address/get_address_by_id', // 获取用户某一地址信息
41 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息 43 getDefaultAddress: '/app/address/get_default_address', // 获取用户默认地址信息
42 44
43 // 用户数据 45 // 用户数据
44 mylovelist: '/app/user/mylovelist', // 关心的人的数据 46 mylovelist: '/app/user/mylovelist', // 关心的人的数据
45 myloveadd: '/app/user/myloveadd', // 添加关心的人 47 myloveadd: '/app/user/myloveadd', // 添加关心的人
46 myloveupdate: '/app/user/myloveupdate' // 更新关心人的数据 48 myloveupdate: '/app/user/myloveupdate', // 更新关心人的数据
47 } 49 }
48 50
49 export default urlAlias 51 export default urlAlias
50 52