Adam / gulu-vue

Download as
Browse Code »

Commit 78ed60987acddc7fd4a81580ac27bb1dfce614d9

Authored by BigBoss
1 parent 3fb0f5bf46
Exists in master

build下单修改

Showing 2 changed files with 3 additions and 4 deletions   Show diff stats
src/components/BottomSheet/BottomSheet.vue
Diff comments   View file @78ed609
1 <template> 1 <template>
2 <view class="BottomSheetContent"> 2 <view class="BottomSheetContent">
3 <view class="sheet" :class="{sheetShow:isShowBottom,sheeHide:!isShowBottom}" @touchmove.stop.prevent="moveHandle" @click="closeSheet()"> 3 <view class="sheet" :class="{sheetShow:isShowBottom,sheeHide:!isShowBottom}" @touchmove.stop.prevent="moveHandle" @click="closeSheet()">
4 <scroll-view scroll-y="true" class="sheetView" :class="{sheetView_active:isShowBottom}" @click.stop="stopEvent()" > 4 <scroll-view scroll-y="true" class="sheetView" :class="{sheetView_active:isShowBottom}" @click.stop="stopEvent()" >
5 <view class="BottomSheetContent"> 5 <view class="BottomSheetContent">
6 <view class="goodInfo"> 6 <view class="goodInfo">
7 <view class="imageWrap"> 7 <view class="imageWrap">
8 <image 8 <image
9 :src="skuItem.pic" 9 :src="skuItem.pic"
10 mode="aspectFill" 10 mode="aspectFill"
11 style="width: 188rpx;height: 168rpx;" 11 style="width: 188rpx;height: 168rpx;"
12 12
13 ></image> 13 ></image>
14 14
15 </view> 15 </view>
16 <view class="infoRight"> 16 <view class="infoRight">
17 <text class="goodName">{{goodInfo.p_name}}</text> 17 <text class="goodName">{{goodInfo.p_name}}</text>
18 <text class="remarks">支持7天无理由退货 顺丰发货</text> 18 <text class="remarks">支持7天无理由退货 顺丰发货</text>
19 <view class="priceBox"> 19 <view class="priceBox">
20 <view class="price">￥{{skuItem.real_price || '暂无'}}</view> 20 <view class="price">￥{{skuItem.real_price || '暂无'}}</view>
21 <text>(限购{{maxCount}}副)</text> 21 <text>(限购{{maxCount}}副)</text>
22 <view class="counter"> 22 <view class="counter">
23 <view 23 <view
24 class="btn" 24 class="btn"
25 disabled="this.addDisabled" 25 disabled="this.addDisabled"
26 type="default" 26 type="default"
27 @click="counter(false)" 27 @click="counter(false)"
28 >-</view> 28 >-</view>
29 <text>{{count}}</text> 29 <text>{{count}}</text>
30 <view 30 <view
31 class="btn" 31 class="btn"
32 disabled="this.desDisabled" 32 disabled="this.desDisabled"
33 type="default" 33 type="default"
34 @click="counter(true)" 34 @click="counter(true)"
35 >+</view> 35 >+</view>
36 </view> 36 </view>
37 </view> 37 </view>
38 </view> 38 </view>
39 </view> 39 </view>
40 <view class="peopleChoose"> 40 <view class="peopleChoose">
41 <view class="title">选择使用人</view> 41 <view class="title">选择使用人</view>
42 <view class="loveList"> 42 <view class="loveList">
43 <view class="peopleName" v-for="(item,index) in loveList" :key='index' :class="{ active2: loveCurrent === index }" 43 <view class="peopleName" v-for="(item,index) in loveList" :key='index' :class="{ active2: loveCurrent === index }"
44 @click="onClickLoveItem(index,item.name)"> 44 @click="onClickLoveItem(index,item.name)">
45 {{item.name}} 45 {{item.name}}
46 </view> 46 </view>
47 </view> 47 </view>
48 </view> 48 </view>
49 <view class="goods-data" v-if="isCart !== 3"> 49 <view class="goods-data" v-if="isCart !== 3">
50 <view class="opCollapse"> 50 <view class="opCollapse">
51 <view class="body"> 51 <view class="body">
52 <template v-if="opIsOpen"> 52 <template v-if="opIsOpen">
53 <view class="goods-form"> 53 <view class="goods-form">
54 <view class="p1"> 54 <view class="p1">
55 <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image> 55 <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
56 填写验光数据 56 填写验光数据
57 </view> 57 </view>
58 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text> 58 <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
59 <view class="picker"> 59 <view class="picker">
60 <view class="picker-choice"> 60 <view class="picker-choice">
61 <view class="choice-left"> 61 <view class="choice-left">
62 <text class="pd">验光单取名:</text> 62 <text class="pd">验光单取名:</text>
63 </view> 63 </view>
64 <input type="text" @blur="handleInput" class="input" 64 <input type="text" @blur="handleInput" class="input"
65 placeholder="请输入名称" maxlength="20" :value="name" /> 65 placeholder="请输入名称" maxlength="20" :value="name" />
66 </view> 66 </view>
67 </view> 67 </view>
68 <view class="picker" > 68 <view class="picker" >
69 <view class="picker-choice"> 69 <view class="picker-choice">
70 <view class="choice-left"> 70 <view class="choice-left">
71 <text class="p11">{{pickerInfoList[0].nameC}}</text> 71 <text class="p11">{{pickerInfoList[0].nameC}}</text>
72 <text class="p12">{{pickerInfoList[0].nameE}}</text> 72 <text class="p12">{{pickerInfoList[0].nameE}}</text>
73 </view> 73 </view>
74 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 74 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
75 <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> --> 75 <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
76 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1"> 76 <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
77 <view class="p14"> 77 <view class="p14">
78 {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}} 78 {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
79 <image src="../../static/detail-tabicon.png" ></image> 79 <image src="../../static/detail-tabicon.png" ></image>
80 </view> 80 </view>
81 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 81 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
82 </picker> 82 </picker>
83 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 83 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
84 <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> --> 84 <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
85 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2"> 85 <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
86 <view class="p14"> 86 <view class="p14">
87 {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}} 87 {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
88 <image src="../../static/detail-tabicon.png" ></image> 88 <image src="../../static/detail-tabicon.png" ></image>
89 </view> 89 </view>
90 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 90 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
91 </picker> 91 </picker>
92 </view> 92 </view>
93 </view> 93 </view>
94 <view class="picker" > 94 <view class="picker" >
95 <view class="picker-choice"> 95 <view class="picker-choice">
96 <view class="choice-left"> 96 <view class="choice-left">
97 <text class="p11">{{pickerInfoList[1].nameC}}</text> 97 <text class="p11">{{pickerInfoList[1].nameC}}</text>
98 <text class="p12">{{pickerInfoList[1].nameE}}</text> 98 <text class="p12">{{pickerInfoList[1].nameE}}</text>
99 </view> 99 </view>
100 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 100 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
101 <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> --> 101 <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
102 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1"> 102 <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
103 <view class="p14"> 103 <view class="p14">
104 {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}} 104 {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
105 <image src="../../static/detail-tabicon.png" ></image> 105 <image src="../../static/detail-tabicon.png" ></image>
106 </view> 106 </view>
107 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 107 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
108 </picker> 108 </picker>
109 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 109 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
110 <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> --> 110 <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
111 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2"> 111 <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
112 <view class="p14"> 112 <view class="p14">
113 {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}} 113 {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
114 <image src="../../static/detail-tabicon.png" ></image> 114 <image src="../../static/detail-tabicon.png" ></image>
115 </view> 115 </view>
116 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 116 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
117 </picker> 117 </picker>
118 </view> 118 </view>
119 </view> 119 </view>
120 <view class="picker" > 120 <view class="picker" >
121 <view class="picker-choice"> 121 <view class="picker-choice">
122 <view class="choice-left"> 122 <view class="choice-left">
123 <text class="p11">{{pickerInfoList[2].nameC}}</text> 123 <text class="p11">{{pickerInfoList[2].nameC}}</text>
124 <text class="p12">{{pickerInfoList[2].nameE}}</text> 124 <text class="p12">{{pickerInfoList[2].nameE}}</text>
125 </view> 125 </view>
126 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text> 126 <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
127 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1"> 127 <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
128 <view class="p14"> 128 <view class="p14">
129 {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}} 129 {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
130 <image src="../../static/detail-tabicon.png" ></image> 130 <image src="../../static/detail-tabicon.png" ></image>
131 </view> 131 </view>
132 </picker> 132 </picker>
133 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text> 133 <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
134 <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> --> 134 <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
135 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2"> 135 <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
136 <view class="p14"> 136 <view class="p14">
137 {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}} 137 {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
138 <image src="../../static/detail-tabicon.png" ></image> 138 <image src="../../static/detail-tabicon.png" ></image>
139 </view> 139 </view>
140 <!-- <image src="../../static/detail-tabicon.png" ></image> --> 140 <!-- <image src="../../static/detail-tabicon.png" ></image> -->
141 </picker> 141 </picker>
142 </view> 142 </view>
143 </view> 143 </view>
144 <view class="picker"> 144 <view class="picker">
145 <view class="picker-choice"> 145 <view class="picker-choice">
146 <view class="choice-left"> 146 <view class="choice-left">
147 <text class="pd">瞳距:</text> 147 <text class="pd">瞳距:</text>
148 </view> 148 </view>
149 <input type="digit" @change="handleInputPd" class="input" 149 <input type="digit" @change="handleInputPd" class="input"
150 placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" /> 150 placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
151 </view> 151 </view>
152 </view> 152 </view>
153 <view class="picker" > 153 <view class="picker" >
154 <view class="picker-choice"> 154 <view class="picker-choice">
155 <view class="choice-left"> 155 <view class="choice-left">
156 <text class="p11">{{pickerInfoList[3].nameC}}</text> 156 <text class="p11">{{pickerInfoList[3].nameC}}</text>
157 </view> 157 </view>
158 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text> 158 <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
159 <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1"> 159 <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
160 <view class="p14" style="width: 30px;"> 160 <view class="p14" style="width: 30px;">
161 {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}} 161 {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
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 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text> 165 <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
166 <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2"> 166 <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
167 <view class="p14" style="width: 30px;"> 167 <view class="p14" style="width: 30px;">
168 {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}} 168 {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
169 <image src="../../static/detail-tabicon.png" ></image> 169 <image src="../../static/detail-tabicon.png" ></image>
170 </view> 170 </view>
171 </picker> 171 </picker>
172 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text> 172 <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
173 <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3"> 173 <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
174 <view class="p14" style="width: 30px;"> 174 <view class="p14" style="width: 30px;">
175 {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}} 175 {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
176 <image src="../../static/detail-tabicon.png" ></image> 176 <image src="../../static/detail-tabicon.png" ></image>
177 </view> 177 </view>
178 </picker> 178 </picker>
179 </view> 179 </view>
180 </view> 180 </view>
181 <view class="ipts"> 181 <view class="ipts">
182 <view class="inputItem"> 182 <view class="inputItem">
183 <text class="text">镜片宽度</text> 183 <text class="text">镜片宽度</text>
184 <input class="input" @input="glassInfoInput($event,0)" type="text" :value="glassInfo.glassWidth" placeholder="请输入镜片宽度"/> 184 <input class="input" @input="glassInfoInput($event,0)" type="text" :value="glassInfo.glassWidth" placeholder="请输入镜片宽度"/>
185 </view> 185 </view>
186 <view class="inputItem"> 186 <view class="inputItem">
187 <text class="text">鼻梁宽度</text> 187 <text class="text">鼻梁宽度</text>
188 <input class="input" @input="glassInfoInput($event,1)" type="text" :value="glassInfo.norseWidth" placeholder="请输入鼻梁宽度"/> 188 <input class="input" @input="glassInfoInput($event,1)" type="text" :value="glassInfo.norseWidth" placeholder="请输入鼻梁宽度"/>
189 </view> 189 </view>
190 <view class="inputItem"> 190 <view class="inputItem">
191 <text class="text">镜腿长度</text> 191 <text class="text">镜腿长度</text>
192 <input class="input" @input="glassInfoInput($event,2)" type="text" :value="glassInfo.legWidth" placeholder="请输入镜腿长度"/> 192 <input class="input" @input="glassInfoInput($event,2)" type="text" :value="glassInfo.legWidth" placeholder="请输入镜腿长度"/>
193 </view> 193 </view>
194 194
195 </view> 195 </view>
196 <view class="confirm"> 196 <view class="confirm">
197 <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image> 197 <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image>
198 <text>确认以上输入信息来源于我的验光数据!</text> 198 <text>确认以上输入信息来源于我的验光数据!</text>
199 </view> 199 </view>
200 </view> 200 </view>
201 </template> 201 </template>
202 <template v-else> 202 <template v-else>
203 <view 203 <view
204 v-for="item in pickerInfoList" 204 v-for="item in pickerInfoList"
205 :key="item.key" 205 :key="item.key"
206 class="bodyBox" 206 class="bodyBox"
207 > 207 >
208 <template v-if="item.nameC==='验光日期'"> 208 <template v-if="item.nameC==='验光日期'">
209 <text class="names">{{item.nameC}}</text> 209 <text class="names">{{item.nameC}}</text>
210 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text> 210 <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
211 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text> 211 <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
212 <text>{{item.nameArray3[item.nameIndex2]}}日</text> 212 <text>{{item.nameArray3[item.nameIndex2]}}日</text>
213 </template> 213 </template>
214 <template v-else> 214 <template v-else>
215 <template v-if="item.nameC==='度数'"> 215 <template v-if="item.nameC==='度数'">
216 <text style="display: inline;">*</text> 216 <text style="display: inline;">*</text>
217 </template> 217 </template>
218 218
219 <text class="names">{{item.nameC}}</text> 219 <text class="names">{{item.nameC}}</text>
220 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text> 220 <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
221 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text> 221 <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
222 </template> 222 </template>
223 </view> 223 </view>
224 </template> 224 </template>
225 </view> 225 </view>
226 </view> 226 </view>
227 </view> 227 </view>
228 <view class="choose"> 228 <view class="choose">
229 <view 229 <view
230 class="chooseItem_1_content" 230 class="chooseItem_1_content"
231 v-for="(item,index) in attrList" 231 v-for="(item,index) in attrList"
232 :key="index" 232 :key="index"
233 > 233 >
234 <UniCollapse @change="changeShow(index)"> 234 <UniCollapse @change="changeShow(index)">
235 <UniCollapseItem 235 <UniCollapseItem
236 :open="show[index]" 236 :open="show[index]"
237 :title="item.meta_name" 237 :title="item.meta_name"
238 showAnimation=false 238 showAnimation=false
239 > 239 >
240 <view class="chooseItem_1_content"> 240 <view class="chooseItem_1_content">
241 <view class="itemsWrap" v-if="isCart ==3"> 241 <view class="itemsWrap" v-if="isCart ==3">
242 <view 242 <view
243 class="item2" 243 class="item2"
244 v-for="(one,i) in item.attr" 244 v-for="(one,i) in item.attr"
245 :key="i" 245 :key="i"
246 :class="{ active2: current[index] === i}" 246 :class="{ active2: current[index] === i}"
247 @click="cartOnClickItem(index, i,one.aid)" 247 @click="cartOnClickItem(index, i,one.aid)"
248 >{{one.name}}</view> 248 >{{one.name}}</view>
249 </view> 249 </view>
250 <view class="itemsWrap" v-else> 250 <view class="itemsWrap" v-else>
251 <view 251 <view
252 class="item2" 252 class="item2"
253 v-for="(one,i) in item.attr" 253 v-for="(one,i) in item.attr"
254 :key="i" 254 :key="i"
255 :class="{ active2: current[index] === i }" 255 :class="{ active2: current[index] === i }"
256 @click="cartOnClickItem(index, i,one.aid)" 256 @click="cartOnClickItem(index, i,one.aid)"
257 >{{one.name}}</view> 257 >{{one.name}}</view>
258 </view> 258 </view>
259 </view> 259 </view>
260 </UniCollapseItem> 260 </UniCollapseItem>
261 </UniCollapse> 261 </UniCollapse>
262 <view 262 <view
263 class="chooseRes" 263 class="chooseRes"
264 v-show="!show[index]" 264 v-show="!show[index]"
265 >* {{attrList[index].attr[current[index]].name}}</view> 265 >* {{attrList[index].attr[current[index]].name}}</view>
266 </view> 266 </view>
267 </view> 267 </view>
268 <view 268 <view
269 class="button" 269 class="button"
270 @click.native="addCart" 270 @click.native="addCart"
271 v-if="isCart == 1" 271 v-if="isCart == 1"
272 > 272 >
273 加入购物车 273 加入购物车
274 </view> 274 </view>
275 <view 275 <view
276 class="button" 276 class="button"
277 @click="toComfirmOrder" 277 @click="toComfirmOrder"
278 v-if="isCart == 2" 278 v-if="isCart == 2"
279 > 279 >
280 立即结算 280 立即结算
281 </view> 281 </view>
282 <view 282 <view
283 class="button" 283 class="button"
284 @click="comfirmChoose" 284 @click="comfirmChoose"
285 v-if="isCart == 3" 285 v-if="isCart == 3"
286 > 286 >
287 确定 287 确定
288 </view> 288 </view>
289 </view> 289 </view>
290 </scroll-view> 290 </scroll-view>
291 </view> 291 </view>
292 </view> 292 </view>
293 </template> 293 </template>
294 <script> 294 <script>
295 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue' 295 import UniCollapse from '@/components/UniCollapse/UniCollapse.vue'
296 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue' 296 import UniCollapseItem from '@/components/UniCollapseItem/UniCollapseItem.vue'
297 import store from '@/store' 297 import store from '@/store'
298 export default { 298 export default {
299 components: { 299 components: {
300 UniCollapse, 300 UniCollapse,
301 UniCollapseItem, 301 UniCollapseItem,
302 }, 302 },
303 props: { 303 props: {
304 isShowBottom : Boolean, 304 isShowBottom : Boolean,
305 pid: Number, 305 pid: Number,
306 sk_id:String, 306 sk_id:String,
307 propMpId:String, 307 propMpId:String,
308 goodInfo:Object, 308 goodInfo:Object,
309 isCart:Number, 309 isCart:Number,
310 cart_id:Number, 310 cart_id:Number,
311 index:Number 311 index:Number
312 }, 312 },
313 data() { 313 data() {
314 return { 314 return {
315 loveCurrent:Number, 315 loveCurrent:Number,
316 count: 1, 316 count: 1,
317 // pid: 0, 317 // pid: 0,
318 maxCount: 20, 318 maxCount: 20,
319 dataName: '', // 验光数据人员名称 319 dataName: '', // 验光数据人员名称
320 isDataName: false, // 是否是已存在的人员数据 320 isDataName: false, // 是否是已存在的人员数据
321 dataConfirm: false, // 已确认所输入验光数据 321 dataConfirm: false, // 已确认所输入验光数据
322 opIsOpen: true, 322 opIsOpen: true,
323 addDisabled: false, 323 addDisabled: false,
324 desDisabled: false, 324 desDisabled: false,
325 current: [], 325 current: [],
326 show: [true,true], 326 show: [true,true],
327 checkedData: {}, 327 checkedData: {},
328 // 度数相关数据 328 // 度数相关数据
329 pickerInfoList: [ 329 pickerInfoList: [
330 { nameC: '度数', nameE: '(SPH)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 0 }, 330 { nameC: '度数', nameE: '(SPH)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 0 },
331 { nameC: '散光', nameE: '(CYL)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 1 }, 331 { nameC: '散光', nameE: '(CYL)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 1 },
332 { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 2 }, 332 { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [''], nameIndex1: 0, nameArray2: [''], nameIndex2: 0, key: 2 },
333 { nameC: '验光日期', nameE: '', nameArray1: [''], nameIndex1: 0, nameArray2: ['', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12], nameIndex2: 0, nameArray3: [''], nameIndex3: 0 }, 333 { nameC: '验光日期', nameE: '', nameArray1: [''], nameIndex1: 0, nameArray2: ['', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12], nameIndex2: 0, nameArray3: [''], nameIndex3: 0 },
334 ], 334 ],
335 confirm: false, // 用户是否确认 335 confirm: false, // 用户是否确认
336 tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'], 336 tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'],
337 name: '', 337 name: '',
338 oldname: '', // 用于判读用户是否改变名字 338 oldname: '', // 用于判读用户是否改变名字
339 pickerInfoChioce: { 339 pickerInfoChioce: {
340 leftSph: '', 340 leftSph: '',
341 rightSph: '', 341 rightSph: '',
342 leftCyl: '', 342 leftCyl: '',
343 rightCyl: '', 343 rightCyl: '',
344 leftAxi: '', 344 leftAxi: '',
345 rightAxi: '', 345 rightAxi: '',
346 time: { 346 time: {
347 year: 0, 347 year: 0,
348 month: 0, 348 month: 0,
349 day: 0, 349 day: 0,
350 }, 350 },
351 }, 351 },
352 glassInfo:{ 352 glassInfo:{
353 norseWidth:Number,//鼻宽 353 norseWidth:Number,//鼻宽
354 glassWidth:Number,//镜片宽度 354 glassWidth:Number,//镜片宽度
355 legWidth:Number//镜腿长度 355 legWidth:Number//镜腿长度
356 }, 356 },
357 pd: '', // 瞳距 357 pd: '', // 瞳距
358 oldpd: '', // 用于判断用户是否改变瞳距 358 oldpd: '', // 用于判断用户是否改变瞳距
359 kinds: 1, // kinds=1，提交为新增验光，2为修改 359 kinds: 1, // kinds=1，提交为新增验光，2为修改
360 mp_id: Number, 360 mp_id: Number,
361 skuValueArray:[], 361 skuValueArray:[],
362 skId:String 362 skId:String
363 } 363 }
364 }, 364 },
365 computed: { 365 computed: {
366 //进购物车选择的人的index 366 //进购物车选择的人的index
367 p_current(){ 367 p_current(){
368 const getLoveItemIndex = (item) => item.mp_id == this.propMpId 368 const getLoveItemIndex = (item) => item.mp_id == this.propMpId
369 const p_current = this.$store.state.myLoveList.loveList.findIndex(getLoveItemIndex ) 369 const p_current = this.$store.state.myLoveList.loveList.findIndex(getLoveItemIndex )
370 if(this.isCart == 3){ 370 if(this.isCart == 3){
371 this.loveCurrent = p_current 371 this.loveCurrent = p_current
372 } 372 }
373 return p_current 373 return p_current
374 }, 374 },
375 arr_current(){ 375 arr_current(){
376 if(this.isCart == 3){ 376 if(this.isCart == 3){
377 const skId = this.sk_id 377 const skId = this.sk_id
378 const skuValue = this.skuItem.sku_value 378 const skuValue = this.skuItem.sku_value
379 const skuValueArray = skuValue.split('_') 379 const skuValueArray = skuValue.split('_')
380 this.skuValueArray = skuValueArray 380 this.skuValueArray = skuValueArray
381 const attrList = this.$store.state.read.goodInfo.attrList 381 const attrList = this.$store.state.read.goodInfo.attrList
382 for (let i = 0;i<attrList.length;i++) { 382 for (let i = 0;i<attrList.length;i++) {
383 const getArrIndex = (item) => item.aid == skuValueArray[i] 383 const getArrIndex = (item) => item.aid == skuValueArray[i]
384 const arr_current = this.$store.state.read.goodInfo.attrList[i].attr.findIndex(getArrIndex ) 384 const arr_current = this.$store.state.read.goodInfo.attrList[i].attr.findIndex(getArrIndex )
385 // console.log('arr_current',arr_current) 385 // console.log('arr_current',arr_current)
386 this.current.push(arr_current) 386 this.current.push(arr_current)
387 } 387 }
388 }else{ 388 }else{
389 return null 389 return null
390 } 390 }
391 }, 391 },
392 loveList() { 392 loveList() {
393 return this.$store.state.myLoveList.loveList || [] 393 return this.$store.state.myLoveList.loveList || []
394 }, 394 },
395 attrList() { 395 attrList() {
396 // console.log('attrList',this.$store.state.read.goodInfo.attrList) 396 // console.log('attrList',this.$store.state.read.goodInfo.attrList)
397 let attrList = this.$store.state.read.goodInfo.attrList 397 let attrList = this.$store.state.read.goodInfo.attrList
398 if(attrList !== undefined){ 398 if(attrList !== undefined){
399 return attrList 399 return attrList
400 }else{ 400 }else{
401 return [] 401 return []
402 } 402 }
403 }, 403 },
404 skuList() { 404 skuList() {
405 // console.log('skuList',this.$store.state.read.goodInfo.skuList) 405 // console.log('skuList',this.$store.state.read.goodInfo.skuList)
406 return this.$store.state.read.goodInfo.skuList 406 return this.$store.state.read.goodInfo.skuList
407 }, 407 },
408 skuItem(){ 408 skuItem(){
409 // if(this.isCart == 3){ 409 // if(this.isCart == 3){
410 const skuList = this.$store.state.read.goodInfo.skuList 410 const skuList = this.$store.state.read.goodInfo.skuList
411 const skuItem = skuList.filter(item => item.sk_id === this.skId)[0] 411 const skuItem = skuList.filter(item => item.sk_id === this.skId)[0]
412 return skuItem 412 return skuItem
413 // }else{ 413 // }else{
414 // const skuList = this.$store.state.read.goodInfo.skuList 414 // const skuList = this.$store.state.read.goodInfo.skuList
415 // const skuItem = skuList[0] 415 // const skuItem = skuList[0]
416 // return skuItem 416 // return skuItem
417 // } 417 // }
418 }, 418 },
419 mpList() { 419 mpList() {
420 420
421 return this.$store.state.myLoveList.loveList 421 return this.$store.state.myLoveList.loveList
422 }, 422 },
423 }, 423 },
424 created() { 424 created() {
425 this.skuValueArray = this.skuList[0].sku_value.split("_") 425 this.skuValueArray = this.skuList[0].sku_value.split("_")
426 // console.log(this.sk_id) 426 // console.log(this.sk_id)
427 this.mp_id = this.propMpId 427 this.mp_id = this.propMpId
428 const pid = this.pid 428 const pid = this.pid
429 if(this.isCart!==3){ 429 if(this.isCart!==3){
430 this.skId = this.skuList[0].sk_id 430 this.skId = this.skuList[0].sk_id
431 const current = [] 431 const current = []
432 const show = [] 432 const show = []
433 for (let index = 0; index < this.attrList.length; index++) { 433 for (let index = 0; index < this.attrList.length; index++) {
434 current.push(0) 434 current.push(0)
435 show.push(true) 435 show.push(true)
436 } 436 }
437 this.current = current 437 this.current = current
438 this.show = show 438 this.show = show
439 }else{ 439 }else{
440 this.skId = this.sk_id 440 this.skId = this.sk_id
441 } 441 }
442 442
443 //获取关心的人列表 443 //获取关心的人列表
444 store.dispatch('myLoveList/getLoveList', { 444 store.dispatch('myLoveList/getLoveList', {
445 uid: this.$store.state.user.userInfo.uid, 445 uid: this.$store.state.user.userInfo.uid,
446 }); 446 });
447 447
448 448
449 // 初始化SPL、CYL、AXI的值 449 // 初始化SPL、CYL、AXI的值
450 for (let j = 0; j < 3; j++) { 450 for (let j = 0; j < 3; j++) {
451 for (let i = -12; i < 6; i++) { 451 for (let i = -12; i < 6; i++) {
452 this.pickerInfoList[j].nameArray1.push(i) 452 this.pickerInfoList[j].nameArray1.push(i)
453 this.pickerInfoList[j].nameArray1.push(i + 0.5) 453 this.pickerInfoList[j].nameArray1.push(i + 0.5)
454 this.pickerInfoList[j].nameArray2.push(i) 454 this.pickerInfoList[j].nameArray2.push(i)
455 this.pickerInfoList[j].nameArray2.push(i + 0.5) 455 this.pickerInfoList[j].nameArray2.push(i + 0.5)
456 if (i >= -6) { 456 if (i >= -6) {
457 this.pickerInfoList[j].nameArray1.push(i + 0.25) 457 this.pickerInfoList[j].nameArray1.push(i + 0.25)
458 this.pickerInfoList[j].nameArray1.push(i + 0.75) 458 this.pickerInfoList[j].nameArray1.push(i + 0.75)
459 this.pickerInfoList[j].nameArray2.push(i + 0.25) 459 this.pickerInfoList[j].nameArray2.push(i + 0.25)
460 this.pickerInfoList[j].nameArray2.push(i + 0.75) 460 this.pickerInfoList[j].nameArray2.push(i + 0.75)
461 } 461 }
462 if (i === 5) { 462 if (i === 5) {
463 this.pickerInfoList[j].nameArray1.push(i + 1) 463 this.pickerInfoList[j].nameArray1.push(i + 1)
464 this.pickerInfoList[j].nameArray2.push(i + 1) 464 this.pickerInfoList[j].nameArray2.push(i + 1)
465 } 465 }
466 } 466 }
467 } 467 }
468 // 初始化日期值 468 // 初始化日期值
469 for (let i = 1; i < 32; i++) { 469 for (let i = 1; i < 32; i++) {
470 this.pickerInfoList[3].nameArray3.push(i) 470 this.pickerInfoList[3].nameArray3.push(i)
471 } 471 }
472 // 初始化年份前后五年 472 // 初始化年份前后五年
473 const myDate = new Date() 473 const myDate = new Date()
474 const nowYear = myDate.getFullYear() 474 const nowYear = myDate.getFullYear()
475 for (let i = 0; i < 5; i++) { 475 for (let i = 0; i < 5; i++) {
476 this.pickerInfoList[3].nameArray1.push(nowYear - i) 476 this.pickerInfoList[3].nameArray1.push(nowYear - i)
477 } 477 }
478 }, 478 },
479 name : "bottomSheet", 479 name : "bottomSheet",
480 methods: { 480 methods: {
481 checkGlassInfo(){ 481 checkGlassInfo(){
482 const glassInfoArr = Object.values(this.glassInfo) 482 const glassInfoArr = Object.values(this.glassInfo)
483 // console.log(glassInfoArr)
484 if(glassInfoArr.find(item => item == '0') !=='undefind'){ 483 if(glassInfoArr.find(item => item == '0') !=='undefind'){
485 uni.showToast({ 484 uni.showModal({
486 title:'请完善镜框数据~' 485 title:'请完善镜框数据~'
487 }) 486 })
488 } 487 }
489 }, 488 },
490 updateMylove(){ 489 updateMylove(){
491 const loveItem = this.loveList[this.loveCurrent] 490 const loveItem = this.loveList[this.loveCurrent]
492 const glassWidth = this.glassInfo.glassWidth 491 const glassWidth = this.glassInfo.glassWidth
493 const norseWidth = this.glassInfo.norseWidth 492 const norseWidth = this.glassInfo.norseWidth
494 const legWidth = this.glassInfo.legWidth 493 const legWidth = this.glassInfo.legWidth
495 console.log(loveItem.glassWidth) 494 console.log(loveItem.glassWidth)
496 console.log(glassWidth) 495 console.log(glassWidth)
497 if(loveItem.glassWidth !== glassWidth){ 496 if(loveItem.glassWidth !== glassWidth){
498 store.dispatch('myLoveList/updateMylove', { 497 store.dispatch('myLoveList/updateMylove', {
499 uid: this.$store.state.user.userInfo.uid, 498 uid: this.$store.state.user.userInfo.uid,
500 openid: this.$store.state.user.userInfo.openid, 499 openid: this.$store.state.user.userInfo.openid,
501 mp_id: this.mp_id, 500 mp_id: this.mp_id,
502 keyname: 'glassWidth', 501 keyname: 'glassWidth',
503 keyvalue: glassWidth 502 keyvalue: glassWidth
504 }); 503 });
505 } 504 }
506 if(loveItem.norseWidth !== norseWidth){ 505 if(loveItem.norseWidth !== norseWidth){
507 store.dispatch('myLoveList/updateMylove', { 506 store.dispatch('myLoveList/updateMylove', {
508 uid: this.$store.state.user.userInfo.uid, 507 uid: this.$store.state.user.userInfo.uid,
509 openid: this.$store.state.user.userInfo.openid, 508 openid: this.$store.state.user.userInfo.openid,
510 mp_id: this.mp_id, 509 mp_id: this.mp_id,
511 keyname: 'norseWidth', 510 keyname: 'norseWidth',
512 keyvalue: norseWidth 511 keyvalue: norseWidth
513 }); 512 });
514 } 513 }
515 if(loveItem.legWidth !== legWidth){ 514 if(loveItem.legWidth !== legWidth){
516 store.dispatch('myLoveList/updateMylove', { 515 store.dispatch('myLoveList/updateMylove', {
517 uid: this.$store.state.user.userInfo.uid, 516 uid: this.$store.state.user.userInfo.uid,
518 openid: this.$store.state.user.userInfo.openid, 517 openid: this.$store.state.user.userInfo.openid,
519 mp_id: this.mp_id, 518 mp_id: this.mp_id,
520 keyname: 'legWidth', 519 keyname: 'legWidth',
521 keyvalue: legWidth 520 keyvalue: legWidth
522 }); 521 });
523 } 522 }
524 }, 523 },
525 glassInfoInput(e,type){ 524 glassInfoInput(e,type){
526 switch(type){ 525 switch(type){
527 case 0: 526 case 0:
528 this.glassInfo.glassWidth = e.detail.value 527 this.glassInfo.glassWidth = e.detail.value
529 break; 528 break;
530 case 1: 529 case 1:
531 this.glassInfo.norseWidth = e.detail.value 530 this.glassInfo.norseWidth = e.detail.value
532 break; 531 break;
533 case 2: 532 case 2:
534 this.glassInfo.legWidth = e.detail.value 533 this.glassInfo.legWidth = e.detail.value
535 break; 534 break;
536 default: 535 default:
537 break; 536 break;
538 } 537 }
539 }, 538 },
540 //参数点击事件==》改变对应图片 539 //参数点击事件==》改变对应图片
541 cartOnClickItem(index, i,aid) { 540 cartOnClickItem(index, i,aid) {
542 //根据aid拼接skuValue 541 //根据aid拼接skuValue
543 this.skuValueArray[index] = aid 542 this.skuValueArray[index] = aid
544 const sku_value = this.skuValueArray.join('_') 543 const sku_value = this.skuValueArray.join('_')
545 //根据sku_value获取对应的sk_id 544 //根据sku_value获取对应的sk_id
546 const itemSk_id = this.skuList.filter(item=>item.sku_value == sku_value)[0].sk_id 545 const itemSk_id = this.skuList.filter(item=>item.sku_value == sku_value)[0].sk_id
547 //修改sk_id 546 //修改sk_id
548 this.skId = itemSk_id 547 this.skId = itemSk_id
549 if (this.current[index] !== i) { 548 if (this.current[index] !== i) {
550 this.current[index] = i 549 this.current[index] = i
551 } 550 }
552 this.$forceUpdate() 551 this.$forceUpdate()
553 }, 552 },
554 comfirmChoose(){ 553 comfirmChoose(){
555 this.checkGlassInfo() 554 this.checkGlassInfo()
556 this.updateMylove() 555 this.updateMylove()
557 const price = this.skuList.filter(item=>item.sk_id == this.skId)[0].real_price 556 const price = this.skuList.filter(item=>item.sk_id == this.skId)[0].real_price
558 this.$emit("chooseCartModi",this.mp_id,this.skId,price,this.pid,this.count,this.cart_id,this.index)//添加购物车 557 this.$emit("chooseCartModi",this.mp_id,this.skId,price,this.pid,this.count,this.cart_id,this.index)//添加购物车
559 this.$emit("closeBottom") 558 this.$emit("closeBottom")
560 }, 559 },
561 addCart(){ 560 addCart(){
562 this.checkGlassInfo() 561 this.checkGlassInfo()
563 this.updateMylove() 562 this.updateMylove()
564 const that = this 563 const that = this
565 const checkedSKUName = [that.goodInfo.attrList[0].meta_name,that.goodInfo.attrList[1].meta_name] 564 const checkedSKUName = [that.goodInfo.attrList[0].meta_name,that.goodInfo.attrList[1].meta_name]
566 const checkedSKU = [] 565 const checkedSKU = []
567 let j; 566 let j;
568 for (let i = 0;i<that.current.length;i++) { 567 for (let i = 0;i<that.current.length;i++) {
569 checkedSKU.push(that.goodInfo.attrList[i].attr[that.current[i]]) 568 checkedSKU.push(that.goodInfo.attrList[i].attr[that.current[i]])
570 // console.log('i', i, j, i !== this.current.length - 1) 569 // console.log('i', i, j, i !== this.current.length - 1)
571 if (i !== this.current.length - 1) { 570 if (i !== this.current.length - 1) {
572 // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应 571 // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应
573 j = this.current[i] * this.attrList[1].attr.length 572 j = this.current[i] * this.attrList[1].attr.length
574 } else { 573 } else {
575 j += this.current[i] 574 j += this.current[i]
576 } 575 }
577 } 576 }
578 const price = this.skuList.filter(item=>item.sk_id == this.skuList[j].sk_id)[0].real_price 577 const price = this.skuList.filter(item=>item.sk_id == this.skuList[j].sk_id)[0].real_price
579 let sk_id = this.skuList[j].sk_id 578 let sk_id = this.skuList[j].sk_id
580 // console.log('选择的商品sk_id',sk_id,'选择的商品参数',checkedSKU) 579 // console.log('选择的商品sk_id',sk_id,'选择的商品参数',checkedSKU)
581 // console.log('mp_id',this.mp_id,'数量',this.count) 580 // console.log('mp_id',this.mp_id,'数量',this.count)
582 this.$emit("addCart",this.mp_id,this.count,checkedSKU,sk_id,price)//添加购物车 581 this.$emit("addCart",this.mp_id,this.count,checkedSKU,sk_id,price)//添加购物车
583 this.$emit("closeBottom")//关闭弹窗 582 this.$emit("closeBottom")//关闭弹窗
584 }, 583 },
585 onClickLoveItem(index,name){ 584 onClickLoveItem(index,name){
586 const loveList = this.loveList 585 const loveList = this.loveList
587 this.glassInfo.glassWidth = loveList[index].glassWidth 586 this.glassInfo.glassWidth = loveList[index].glassWidth
588 this.glassInfo.norseWidth = loveList[index].norseWidth 587 this.glassInfo.norseWidth = loveList[index].norseWidth
589 this.glassInfo.legWidth = loveList[index].legWidth 588 this.glassInfo.legWidth = loveList[index].legWidth
590 for (let index = 0; index < loveList.length; index++) { 589 for (let index = 0; index < loveList.length; index++) {
591 if (name === loveList[index].name && name!==this.name) { 590 if (name === loveList[index].name && name!==this.name) {
592 this.isDataName = true 591 this.isDataName = true
593 this.kinds = 2 592 this.kinds = 2
594 this.name = loveList[index].name 593 this.name = loveList[index].name
595 this.pd = loveList[index].pd 594 this.pd = loveList[index].pd
596 this.mp_id = loveList[index].mp_id 595 this.mp_id = loveList[index].mp_id
597 this.oldname = loveList[index].name 596 this.oldname = loveList[index].name
598 this.oldpd = loveList[index].pd 597 this.oldpd = loveList[index].pd
599 this.pickerInfoList[0].nameArray1.unshift(loveList[index].leftSph) 598 this.pickerInfoList[0].nameArray1.unshift(loveList[index].leftSph)
600 this.pickerInfoList[0].nameArray2.unshift(loveList[index].rightSph) 599 this.pickerInfoList[0].nameArray2.unshift(loveList[index].rightSph)
601 this.pickerInfoList[1].nameArray1.unshift(loveList[index].leftCyl) 600 this.pickerInfoList[1].nameArray1.unshift(loveList[index].leftCyl)
602 this.pickerInfoList[1].nameArray2.unshift(loveList[index].rightCyl) 601 this.pickerInfoList[1].nameArray2.unshift(loveList[index].rightCyl)
603 this.pickerInfoList[2].nameArray1.unshift(loveList[index].leftAxi) 602 this.pickerInfoList[2].nameArray1.unshift(loveList[index].leftAxi)
604 this.pickerInfoList[2].nameArray2.unshift(loveList[index].rightAxi) 603 this.pickerInfoList[2].nameArray2.unshift(loveList[index].rightAxi)
605 this.pickerInfoList[3].nameArray1.unshift(loveList[index].in_time.toString().slice(0, 4)) 604 this.pickerInfoList[3].nameArray1.unshift(loveList[index].in_time.toString().slice(0, 4))
606 if (loveList[index].in_time.toString().slice(5, 6) === 0) { 605 if (loveList[index].in_time.toString().slice(5, 6) === 0) {
607 this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(6, 7)) 606 this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(6, 7))
608 } else { 607 } else {
609 this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(5, 7)) 608 this.pickerInfoList[3].nameArray2.unshift(loveList[index].in_time.toString().slice(5, 7))
610 } 609 }
611 if (loveList[index].in_time.toString().slice(8, 9) === 0) { 610 if (loveList[index].in_time.toString().slice(8, 9) === 0) {
612 this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(9, 10)) 611 this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(9, 10))
613 } else { 612 } else {
614 this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(8, 10)) 613 this.pickerInfoList[3].nameArray3.unshift(loveList[index].in_time.toString().slice(8, 10))
615 } 614 }
616 } 615 }
617 } 616 }
618 this.name = name; 617 this.name = name;
619 this.loveCurrent = index; 618 this.loveCurrent = index;
620 }, 619 },
621 closeSheet(){ 620 closeSheet(){
622 this.$emit('closeBottom'); 621 this.$emit('closeBottom');
623 }, 622 },
624 stopEvent(){ //@click.stop防止事件冒泡 623 stopEvent(){ //@click.stop防止事件冒泡
625 624
626 }, 625 },
627 moveHandle(){ //不让页面滚动 626 moveHandle(){ //不让页面滚动
628 627
629 }, 628 },
630 // picker相关功能 629 // picker相关功能
631 handleInput(e) { 630 handleInput(e) {
632 this.name = e.target.value 631 this.name = e.target.value
633 this.isDataName = false 632 this.isDataName = false
634 const mpList = this.mpList 633 const mpList = this.mpList
635 // console.log('mpList===>', mpList) 634 // console.log('mpList===>', mpList)
636 for (let index = 0; index < mpList.length; index++) { 635 for (let index = 0; index < mpList.length; index++) {
637 if (e.detail.value === mpList[index].name) { 636 if (e.detail.value === mpList[index].name) {
638 this.isDataName = true 637 this.isDataName = true
639 uni.showModal({ 638 uni.showModal({
640 title: '提示', 639 title: '提示',
641 content: `是否填充已有的"${e.detail.value}"的数据`, 640 content: `是否填充已有的"${e.detail.value}"的数据`,
642 success: (res) => { 641 success: (res) => {
643 if (res.confirm) { 642 if (res.confirm) {
644 this.kinds = 2 643 this.kinds = 2
645 // console.log('args===>', index) 644 // console.log('args===>', index)
646 // const mpList=Object.assign({},this.$store.state.mympList.mpList) 645 // const mpList=Object.assign({},this.$store.state.mympList.mpList)
647 this.name = mpList[index].name 646 this.name = mpList[index].name
648 this.pd = mpList[index].pd 647 this.pd = mpList[index].pd
649 this.mp_id = mpList[index].mp_id 648 this.mp_id = mpList[index].mp_id
650 this.oldname = mpList[index].name 649 this.oldname = mpList[index].name
651 this.oldpd = mpList[index].pd 650 this.oldpd = mpList[index].pd
652 // 将kinds =2时的值传到该页面 651 // 将kinds =2时的值传到该页面
653 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph) 652 this.pickerInfoList[0].nameArray1.unshift(mpList[index].leftSph)
654 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph) 653 this.pickerInfoList[0].nameArray2.unshift(mpList[index].rightSph)
655 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl) 654 this.pickerInfoList[1].nameArray1.unshift(mpList[index].leftCyl)
656 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl) 655 this.pickerInfoList[1].nameArray2.unshift(mpList[index].rightCyl)
657 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi) 656 this.pickerInfoList[2].nameArray1.unshift(mpList[index].leftAxi)
658 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi) 657 this.pickerInfoList[2].nameArray2.unshift(mpList[index].rightAxi)
659 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0, 4)) 658 this.pickerInfoList[3].nameArray1.unshift(mpList[index].in_time.toString().slice(0, 4))
660 if (mpList[index].in_time.toString().slice(5, 6) === 0) { 659 if (mpList[index].in_time.toString().slice(5, 6) === 0) {
661 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6, 7)) 660 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(6, 7))
662 } else { 661 } else {
663 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5, 7)) 662 this.pickerInfoList[3].nameArray2.unshift(mpList[index].in_time.toString().slice(5, 7))
664 } 663 }
665 if (mpList[index].in_time.toString().slice(8, 9) === 0) { 664 if (mpList[index].in_time.toString().slice(8, 9) === 0) {
666 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9, 10)) 665 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(9, 10))
667 } else { 666 } else {
668 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8, 10)) 667 this.pickerInfoList[3].nameArray3.unshift(mpList[index].in_time.toString().slice(8, 10))
669 } 668 }
670 // this.checkedData = mpList[index] 669 // this.checkedData = mpList[index]
671 // console.log('checkedData', this.checkedData) 670 // console.log('checkedData', this.checkedData)
672 } else if (res.cancel) { 671 } else if (res.cancel) {
673 this.kinds = 2 672 this.kinds = 2
674 } 673 }
675 }, 674 },
676 }) 675 })
677 } 676 }
678 } 677 }
679 }, 678 },
680 handleInputPd(e) { 679 handleInputPd(e) {
681 // 只能输入正浮点数或正数 680 // 只能输入正浮点数或正数
682 if (/^\d+(\.\d+)?$/.test(e.target.value)) { 681 if (/^\d+(\.\d+)?$/.test(e.target.value)) {
683 this.pd = e.target.value 682 this.pd = e.target.value
684 } else { 683 } else {
685 uni.showToast({ 684 uni.showToast({
686 title: '请输入有效数据;示例:89', 685 title: '请输入有效数据;示例:89',
687 icon: 'none', 686 icon: 'none',
688 duration: 2000, 687 duration: 2000,
689 }) 688 })
690 this.pd = '' 689 this.pd = ''
691 } 690 }
692 }, 691 },
693 changeConfirm() { 692 changeConfirm() {
694 this.confirm = !this.confirm 693 this.confirm = !this.confirm
695 }, 694 },
696 bindPickerChange01: function(e) { 695 bindPickerChange01: function(e) {
697 this.pickerInfoList[0].nameIndex1 = e.target.value 696 this.pickerInfoList[0].nameIndex1 = e.target.value
698 this.pickerInfoChioce.leftSph = this.pickerInfoList[0].nameArray1[e.target.value] 697 this.pickerInfoChioce.leftSph = this.pickerInfoList[0].nameArray1[e.target.value]
699 }, 698 },
700 bindPickerChange02: function(e) { 699 bindPickerChange02: function(e) {
701 this.pickerInfoList[0].nameIndex2 = e.target.value 700 this.pickerInfoList[0].nameIndex2 = e.target.value
702 this.pickerInfoChioce.rightSph = this.pickerInfoList[0].nameArray2[e.target.value] 701 this.pickerInfoChioce.rightSph = this.pickerInfoList[0].nameArray2[e.target.value]
703 }, 702 },
704 703
705 bindPickerChange11: function(e) { 704 bindPickerChange11: function(e) {
706 this.pickerInfoList[1].nameIndex1 = e.target.value 705 this.pickerInfoList[1].nameIndex1 = e.target.value
707 this.pickerInfoChioce.leftCyl = this.pickerInfoList[1].nameArray1[e.target.value] 706 this.pickerInfoChioce.leftCyl = this.pickerInfoList[1].nameArray1[e.target.value]
708 }, 707 },
709 bindPickerChange12: function(e) { 708 bindPickerChange12: function(e) {
710 this.pickerInfoList[1].nameIndex2 = e.target.value 709 this.pickerInfoList[1].nameIndex2 = e.target.value
711 this.pickerInfoChioce.rightCyl = this.pickerInfoList[1].nameArray2[e.target.value] 710 this.pickerInfoChioce.rightCyl = this.pickerInfoList[1].nameArray2[e.target.value]
712 }, 711 },
713 712
714 bindPickerChange21: function(e) { 713 bindPickerChange21: function(e) {
715 this.pickerInfoList[2].nameIndex1 = e.target.value 714 this.pickerInfoList[2].nameIndex1 = e.target.value
716 this.pickerInfoChioce.leftAxi = this.pickerInfoList[2].nameArray1[e.target.value] 715 this.pickerInfoChioce.leftAxi = this.pickerInfoList[2].nameArray1[e.target.value]
717 }, 716 },
718 bindPickerChange22: function(e) { 717 bindPickerChange22: function(e) {
719 this.pickerInfoList[2].nameIndex2 = e.target.value 718 this.pickerInfoList[2].nameIndex2 = e.target.value
720 this.pickerInfoChioce.rightAxi = this.pickerInfoList[2].nameArray2[e.target.value] 719 this.pickerInfoChioce.rightAxi = this.pickerInfoList[2].nameArray2[e.target.value]
721 }, 720 },
722 721
723 bindPickerChange41: function(e) { 722 bindPickerChange41: function(e) {
724 this.pickerInfoList[3].nameIndex1 = e.target.value 723 this.pickerInfoList[3].nameIndex1 = e.target.value
725 this.pickerInfoChioce.time.year = this.pickerInfoList[3].nameArray1[e.target.value] 724 this.pickerInfoChioce.time.year = this.pickerInfoList[3].nameArray1[e.target.value]
726 }, 725 },
727 bindPickerChange42: function(e) { 726 bindPickerChange42: function(e) {
728 this.pickerInfoList[3].nameIndex2 = e.target.value 727 this.pickerInfoList[3].nameIndex2 = e.target.value
729 this.pickerInfoChioce.time.month = this.pickerInfoList[3].nameArray2[e.target.value] 728 this.pickerInfoChioce.time.month = this.pickerInfoList[3].nameArray2[e.target.value]
730 }, 729 },
731 bindPickerChange43: function(e) { 730 bindPickerChange43: function(e) {
732 this.pickerInfoList[3].nameIndex3 = e.target.value 731 this.pickerInfoList[3].nameIndex3 = e.target.value
733 this.pickerInfoChioce.time.day = this.pickerInfoList[3].nameArray3[e.target.value] 732 this.pickerInfoChioce.time.day = this.pickerInfoList[3].nameArray3[e.target.value]
734 }, 733 },
735 changeShow(num) { 734 changeShow(num) {
736 this.show[num] = !this.show[num] 735 this.show[num] = !this.show[num]
737 this.$forceUpdate() 736 this.$forceUpdate()
738 }, 737 },
739 counter(isadd) { 738 counter(isadd) {
740 if (isadd) { 739 if (isadd) {
741 this.count >= this.maxCount ? this.addDisabled = true : this.count++ 740 this.count >= this.maxCount ? this.addDisabled = true : this.count++
742 } else { 741 } else {
743 this.count <= 1 ? this.desDisabled = true : this.count-- 742 this.count <= 1 ? this.desDisabled = true : this.count--
744 } 743 }
745 }, 744 },
746 toComfirmOrder() { 745 toComfirmOrder() {
747 746 this.checkGlassInfo()
748 this.updateMylove() 747 this.updateMylove()
749 // 先处理验光部分的逻辑，如果ok在跳转 748 // 先处理验光部分的逻辑，如果ok在跳转
750 let flag = 0 749 let flag = 0
751 if (this.name === '') { 750 if (this.name === '') {
752 uni.showToast({ 751 uni.showToast({
753 title: '请输入验光单取名', 752 title: '请输入验光单取名',
754 icon: 'none', 753 icon: 'none',
755 duration: 2000, 754 duration: 2000,
756 }) 755 })
757 } else { 756 } else {
758 if (this.pd === '') { 757 if (this.pd === '') {
759 uni.showToast({ 758 uni.showToast({
760 title: '请输入瞳距', 759 title: '请输入瞳距',
761 icon: 'none', 760 icon: 'none',
762 duration: 2000, 761 duration: 2000,
763 }) 762 })
764 } else { 763 } else {
765 if (this.kinds === 1) { 764 if (this.kinds === 1) {
766 // 添加用户验光单 765 // 添加用户验光单
767 console.log('kinds====>', this.pickerInfoChioce.leftSph) 766 console.log('kinds====>', this.pickerInfoChioce.leftSph)
768 console.log('kinds====>', this.pickerInfoChioce.leftSph === Number) 767 console.log('kinds====>', this.pickerInfoChioce.leftSph === Number)
769 console.log('kinds====>', this.pickerInfoChioce.rightSph === Number) 768 console.log('kinds====>', this.pickerInfoChioce.rightSph === Number)
770 if (this.pickerInfoChioce.rightSph === '' || this.pickerInfoChioce.leftSph === '' || 769 if (this.pickerInfoChioce.rightSph === '' || this.pickerInfoChioce.leftSph === '' ||
771 this.pickerInfoChioce.leftCyl === '' || this.pickerInfoChioce.rightCyl === '' || 770 this.pickerInfoChioce.leftCyl === '' || this.pickerInfoChioce.rightCyl === '' ||
772 this.pickerInfoChioce.leftAxi === '' || this.pickerInfoChioce.rightAxi === '' 771 this.pickerInfoChioce.leftAxi === '' || this.pickerInfoChioce.rightAxi === ''
773 ) { 772 ) {
774 uni.showToast({ 773 uni.showToast({
775 title: '请输入您的验光数据', 774 title: '请输入您的验光数据',
776 icon: 'none', 775 icon: 'none',
777 duration: 2000, 776 duration: 2000,
778 }) 777 })
779 } else { 778 } else {
780 if (this.confirm) { 779 if (this.confirm) {
781 store.dispatch('myLoveList/addMylove', { 780 store.dispatch('myLoveList/addMylove', {
782 uid: this.$store.state.user.userInfo.uid, 781 uid: this.$store.state.user.userInfo.uid,
783 openid: this.$store.state.user.userInfo.openid, 782 openid: this.$store.state.user.userInfo.openid,
784 // mp_name: this.$store.state.user.userInfo.mp_name, 783 // mp_name: this.$store.state.user.userInfo.mp_name,
785 leftSph: this.pickerInfoChioce.leftSph, 784 leftSph: this.pickerInfoChioce.leftSph,
786 rightSph: this.pickerInfoChioce.rightSph, 785 rightSph: this.pickerInfoChioce.rightSph,
787 leftCyl: this.pickerInfoChioce.leftCyl, 786 leftCyl: this.pickerInfoChioce.leftCyl,
788 rightCyl: this.pickerInfoChioce.rightCyl, 787 rightCyl: this.pickerInfoChioce.rightCyl,
789 leftAxi: this.pickerInfoChioce.leftAxi, 788 leftAxi: this.pickerInfoChioce.leftAxi,
790 rightAxi: this.pickerInfoChioce.rightAxi, 789 rightAxi: this.pickerInfoChioce.rightAxi,
791 pd: this.pd, // 瞳距 790 pd: this.pd, // 瞳距
792 mp_name: this.name, 791 mp_name: this.name,
793 // time: this.pickerInfoChioce.time, 792 // time: this.pickerInfoChioce.time,
794 // img_url2: "http://localhost:8087/images/shop_1/1/", 793 // img_url2: "http://localhost:8087/images/shop_1/1/",
795 }).then(({ mp_id: mpId }) => { 794 }).then(({ mp_id: mpId }) => {
796 this.mp_id = mpId 795 this.mp_id = mpId
797 }) 796 })
798 flag = 1 797 flag = 1
799 } else { 798 } else {
800 uni.showToast({ 799 uni.showToast({
801 title: '请确认您的验光数据', 800 title: '请确认您的验光数据',
802 icon: 'none', 801 icon: 'none',
803 duration: 3000, 802 duration: 3000,
804 }) 803 })
805 } 804 }
806 } 805 }
807 } 806 }
808 if (this.kinds === 2) { 807 if (this.kinds === 2) {
809 if (this.confirm) { 808 if (this.confirm) {
810 const leftList = ['leftSph', 'leftCyl', 'leftAxi'] 809 const leftList = ['leftSph', 'leftCyl', 'leftAxi']
811 const rightList = ['rightSph', 'rightCyl', 'rightAxi'] 810 const rightList = ['rightSph', 'rightCyl', 'rightAxi']
812 // let flag=0; 811 // let flag=0;
813 if (this.name !== this.oldname) { 812 if (this.name !== this.oldname) {
814 store.dispatch('myLoveList/updateMylove', { 813 store.dispatch('myLoveList/updateMylove', {
815 uid: this.$store.state.user.userInfo.uid, 814 uid: this.$store.state.user.userInfo.uid,
816 openid: this.$store.state.user.userInfo.openid, 815 openid: this.$store.state.user.userInfo.openid,
817 mp_id: this.mp_id, 816 mp_id: this.mp_id,
818 keyname: 'name', 817 keyname: 'name',
819 keyvalue: this.name, 818 keyvalue: this.name,
820 }) 819 })
821 flag = 1 820 flag = 1
822 } 821 }
823 if (this.pd !== this.oldpd) { 822 if (this.pd !== this.oldpd) {
824 store.dispatch('myLoveList/updateMylove', { 823 store.dispatch('myLoveList/updateMylove', {
825 uid: this.$store.state.user.userInfo.uid, 824 uid: this.$store.state.user.userInfo.uid,
826 openid: this.$store.state.user.userInfo.openid, 825 openid: this.$store.state.user.userInfo.openid,
827 mp_id: this.mp_id, 826 mp_id: this.mp_id,
828 keyname: 'pd', 827 keyname: 'pd',
829 keyvalue: this.pd, 828 keyvalue: this.pd,
830 }) 829 })
831 flag = 1 830 flag = 1
832 } 831 }
833 // 先验证是否输入有无空 832 // 先验证是否输入有无空
834 let q = true 833 let q = true
835 for (let k = 0; k < 3; k++) { 834 for (let k = 0; k < 3; k++) {
836 q = q && (this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1] !== '' && 835 q = q && (this.pickerInfoList[k].nameArray1[this.pickerInfoList[k].nameIndex1] !== '' &&
837 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2] !== '') 836 this.pickerInfoList[k].nameArray2[this.pickerInfoList[k].nameIndex2] !== '')
838 } 837 }
839 if (q) { 838 if (q) {
840 for (let j = 0; j < 3; j++) { 839 for (let j = 0; j < 3; j++) {
841 if (this.pickerInfoList[j].nameIndex1 !== 0) { 840 if (this.pickerInfoList[j].nameIndex1 !== 0) {
842 store.dispatch('myLoveList/updateMylove', { 841 store.dispatch('myLoveList/updateMylove', {
843 uid: this.$store.state.user.userInfo.uid, 842 uid: this.$store.state.user.userInfo.uid,
844 openid: this.$store.state.user.userInfo.openid, 843 openid: this.$store.state.user.userInfo.openid,
845 mp_id: this.mp_id, 844 mp_id: this.mp_id,
846 keyname: leftList[j], 845 keyname: leftList[j],
847 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1], 846 keyvalue: this.pickerInfoList[j].nameArray1[this.pickerInfoList[j].nameIndex1],
848 }) 847 })
849 } 848 }
850 if (this.pickerInfoList[j].nameIndex2 !== 0) { 849 if (this.pickerInfoList[j].nameIndex2 !== 0) {
851 store.dispatch('myLoveList/updateMylove', { 850 store.dispatch('myLoveList/updateMylove', {
852 uid: this.$store.state.user.userInfo.uid, 851 uid: this.$store.state.user.userInfo.uid,
853 openid: this.$store.state.user.userInfo.openid, 852 openid: this.$store.state.user.userInfo.openid,
854 mp_id: this.mp_id, 853 mp_id: this.mp_id,
855 keyname: rightList[j], 854 keyname: rightList[j],
856 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2], 855 keyvalue: this.pickerInfoList[j].nameArray2[this.pickerInfoList[j].nameIndex2],
857 }) 856 })
858 } 857 }
859 flag = 1 858 flag = 1
860 } 859 }
861 } else { 860 } else {
862 flag = 0 861 flag = 0
863 uni.showToast({ 862 uni.showToast({
864 title: '请输入您的验光数据', 863 title: '请输入您的验光数据',
865 icon: 'none', 864 icon: 'none',
866 duration: 2000, 865 duration: 2000,
867 }) 866 })
868 } 867 }
869 if (flag !== 0) { 868 if (flag !== 0) {
870 store.dispatch('myLoveList/getLoveList', { 869 store.dispatch('myLoveList/getLoveList', {
871 uid: this.$store.state.user.userInfo.uid, 870 uid: this.$store.state.user.userInfo.uid,
872 }) 871 })
873 } 872 }
874 } else { 873 } else {
875 uni.showToast({ 874 uni.showToast({
876 title: '请确认您的验光数据', 875 title: '请确认您的验光数据',
877 icon: 'none', 876 icon: 'none',
878 duration: 3000, 877 duration: 3000,
879 }) 878 })
880 } 879 }
881 } 880 }
882 } 881 }
883 } 882 }
884 if (flag !== 0) { 883 if (flag !== 0) {
885 // 如果数据验证无误，那么更新验光单的数据 884 // 如果数据验证无误，那么更新验光单的数据
886 store.dispatch('myLoveList/getLoveList', { 885 store.dispatch('myLoveList/getLoveList', {
887 uid: this.$store.state.user.userInfo.uid, 886 uid: this.$store.state.user.userInfo.uid,
888 }) 887 })
889 let i = 0 888 let i = 0
890 // 判断出是哪一个sku被选中 889 // 判断出是哪一个sku被选中
891 for (let index = 0; index < this.current.length; index++) { 890 for (let index = 0; index < this.current.length; index++) {
892 // console.log('index', index, i, index !== this.current.length - 1) 891 // console.log('index', index, i, index !== this.current.length - 1)
893 if (index !== this.current.length - 1) { 892 if (index !== this.current.length - 1) {
894 // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应 893 // 后续需修改算法：目前暂定只有两个参数选择，后续若有多个参数需要修改实现自适应
895 i = this.current[index] * this.attrList[1].attr.length 894 i = this.current[index] * this.attrList[1].attr.length
896 } else { 895 } else {
897 i += this.current[index] 896 i += this.current[index]
898 } 897 }
899 } 898 }
900 // 判断是否其输入的人员数据是否已存在 899 // 判断是否其输入的人员数据是否已存在
901 store.dispatch('order/saveParams', { 900 store.dispatch('order/saveParams', {
902 sk_id_arr: this.skuList[i], 901 sk_id_arr: this.skuList[i],
903 current: this.current, 902 current: this.current,
904 mp_id: this.mp_id, 903 mp_id: this.mp_id,
905 attrList: this.attrList, 904 attrList: this.attrList,
906 }) 905 })
907 this.$store.state.cart.buyItem = this.skuItem 906 this.$store.state.cart.buyItem = this.skuItem
908 // 跳转到确认订单页面 907 // 跳转到确认订单页面
909 uni.navigateTo({ 908 uni.navigateTo({
910 url: `../confirmOrder/confirmOrder?pid=${this.pid}&count=${this.count}&name=${this.name}&isCart=false`, 909 url: `../confirmOrder/confirmOrder?pid=${this.pid}&count=${this.count}&name=${this.name}&isCart=false`,
911 }) 910 })
912 } 911 }
913 }, 912 },
914 } 913 }
915 } 914 }
916 </script> 915 </script>
917 916
918 <style lang="scss"> 917 <style lang="scss">
919 .BottomSheetContent { 918 .BottomSheetContent {
920 min-height: 100vh; 919 min-height: 100vh;
921 background-color: #f2f2f2; 920 background-color: #f2f2f2;
922 // padding-top: 20rpx; 921 // padding-top: 20rpx;
923 .goodInfo { 922 .goodInfo {
924 width: 100%; 923 width: 100%;
925 height: 272rpx; 924 height: 272rpx;
926 border-radius: 16rpx; 925 border-radius: 16rpx;
927 background-color: #ffffff; 926 background-color: #ffffff;
928 box-sizing: border-box; 927 box-sizing: border-box;
929 padding: 36rpx; 928 padding: 36rpx;
930 display: flex; 929 display: flex;
931 flex-direction: row; 930 flex-direction: row;
932 justify-content: flex-start; 931 justify-content: flex-start;
933 position: sticky; 932 position: sticky;
934 top: 0rpx; 933 top: 0rpx;
935 left: 0rpx; 934 left: 0rpx;
936 z-index: 99999; 935 z-index: 99999;
937 .imageWrap { 936 .imageWrap {
938 height: 188rpx; 937 height: 188rpx;
939 width: 188rpx; 938 width: 188rpx;
940 margin-right: 28rpx; 939 margin-right: 28rpx;
941 image { 940 image {
942 height: 188rpx; 941 height: 188rpx;
943 width: 188rpx; 942 width: 188rpx;
944 } 943 }
945 } 944 }
946 .infoRight { 945 .infoRight {
947 display: flex; 946 display: flex;
948 flex-direction: column; 947 flex-direction: column;
949 align-items: flex-start; 948 align-items: flex-start;
950 justify-content: space-between; 949 justify-content: space-between;
951 width: 100%; 950 width: 100%;
952 .goodName { 951 .goodName {
953 font-size: 28rpx; 952 font-size: 28rpx;
954 color: #333333; 953 color: #333333;
955 } 954 }
956 .remarks { 955 .remarks {
957 font-size: 20rpx; 956 font-size: 20rpx;
958 color: #999999; 957 color: #999999;
959 } 958 }
960 .priceBox { 959 .priceBox {
961 display: flex; 960 display: flex;
962 justify-content: space-between; 961 justify-content: space-between;
963 align-items: center; 962 align-items: center;
964 width: 100%; 963 width: 100%;
965 font-size: 14px; 964 font-size: 14px;
966 color: #999999; 965 color: #999999;
967 .price { 966 .price {
968 color: #ff6b4a; 967 color: #ff6b4a;
969 font-size: 28rpx; 968 font-size: 28rpx;
970 } 969 }
971 .counter { 970 .counter {
972 display: flex; 971 display: flex;
973 flex-direction: row; 972 flex-direction: row;
974 justify-content: space-between; 973 justify-content: space-between;
975 align-items: center; 974 align-items: center;
976 font-size: 28rpx; 975 font-size: 28rpx;
977 color: #333333; 976 color: #333333;
978 width: 122rpx; 977 width: 122rpx;
979 .btn { 978 .btn {
980 display: flex; 979 display: flex;
981 justify-content: center; 980 justify-content: center;
982 line-height: 32rpx; 981 line-height: 32rpx;
983 height: 32rpx; 982 height: 32rpx;
984 width: 32rpx; 983 width: 32rpx;
985 background-color: #f2f2f2; 984 background-color: #f2f2f2;
986 color: #cfcfcf; 985 color: #cfcfcf;
987 } 986 }
988 } 987 }
989 } 988 }
990 } 989 }
991 } 990 }
992 .peopleChoose{ 991 .peopleChoose{
993 width: 100%; 992 width: 100%;
994 min-height: 200rpx; 993 min-height: 200rpx;
995 border-radius: 16rpx; 994 border-radius: 16rpx;
996 background-color: #ffffff; 995 background-color: #ffffff;
997 box-sizing: border-box; 996 box-sizing: border-box;
998 padding: 36rpx; 997 padding: 36rpx;
999 margin: 10px 0; 998 margin: 10px 0;
1000 display: flex; 999 display: flex;
1001 flex-direction: column; 1000 flex-direction: column;
1002 justify-content: flex-start; 1001 justify-content: flex-start;
1003 align-items: center; 1002 align-items: center;
1004 .title{ 1003 .title{
1005 font-size: 16px; 1004 font-size: 16px;
1006 color: #333333; 1005 color: #333333;
1007 letter-spacing: -0.3px; 1006 letter-spacing: -0.3px;
1008 text-align: justify; 1007 text-align: justify;
1009 line-height: 24px; 1008 line-height: 24px;
1010 margin: 4px 0; 1009 margin: 4px 0;
1011 } 1010 }
1012 .loveList{ 1011 .loveList{
1013 display: flex; 1012 display: flex;
1014 flex-direction: row; 1013 flex-direction: row;
1015 flex-wrap: wrap; 1014 flex-wrap: wrap;
1016 justify-content: flex-start; 1015 justify-content: flex-start;
1017 align-items: center; 1016 align-items: center;
1018 padding-top: 24rpx; 1017 padding-top: 24rpx;
1019 width: 100%; 1018 width: 100%;
1020 .peopleName { 1019 .peopleName {
1021 padding: 0 30rpx; 1020 padding: 0 30rpx;
1022 height: 60rpx; 1021 height: 60rpx;
1023 margin: 0 20rpx 20rpx 0; 1022 margin: 0 20rpx 20rpx 0;
1024 transition: all 0.3s; 1023 transition: all 0.3s;
1025 background: #f2f2f2; 1024 background: #f2f2f2;
1026 border-radius: 2px; 1025 border-radius: 2px;
1027 border-radius: 2px; 1026 border-radius: 2px;
1028 line-height: 60rpx; 1027 line-height: 60rpx;
1029 text-align: center; 1028 text-align: center;
1030 color: #666666; 1029 color: #666666;
1031 font-size: 12px; 1030 font-size: 12px;
1032 } 1031 }
1033 .active2 { 1032 .active2 {
1034 background: rgba(255, 107, 74, 0.15); 1033 background: rgba(255, 107, 74, 0.15);
1035 color: #ff6b4a; 1034 color: #ff6b4a;
1036 } 1035 }
1037 } 1036 }
1038 } 1037 }
1039 .goods-data { 1038 .goods-data {
1040 width: 100%; 1039 width: 100%;
1041 box-sizing: border-box; 1040 box-sizing: border-box;
1042 padding: 37rpx 40rpx 0 40rpx; 1041 padding: 37rpx 40rpx 0 40rpx;
1043 background: #ffffff; 1042 background: #ffffff;
1044 border-radius: 12rpx; 1043 border-radius: 12rpx;
1045 .opCollapse { 1044 .opCollapse {
1046 width: 100%; 1045 width: 100%;
1047 padding-bottom: 28rpx; 1046 padding-bottom: 28rpx;
1048 margin-top: 7px; 1047 margin-top: 7px;
1049 border-bottom: 1px solid #e9e9e9; 1048 border-bottom: 1px solid #e9e9e9;
1050 .head { 1049 .head {
1051 display: flex; 1050 display: flex;
1052 justify-content: space-between; 1051 justify-content: space-between;
1053 height: 24px; 1052 height: 24px;
1054 // font-family: PingFangSC-Medium; 1053 // font-family: PingFangSC-Medium;
1055 font-size: 16px; 1054 font-size: 16px;
1056 color: #333333; 1055 color: #333333;
1057 letter-spacing: -0.3px; 1056 letter-spacing: -0.3px;
1058 text-align: justify; 1057 text-align: justify;
1059 line-height: 24px; 1058 line-height: 24px;
1060 margin-bottom: 18rpx; 1059 margin-bottom: 18rpx;
1061 .headRighted { 1060 .headRighted {
1062 width: 0; 1061 width: 0;
1063 height: 0; 1062 height: 0;
1064 border-left: 4px solid transparent; 1063 border-left: 4px solid transparent;
1065 border-right: 4px solid transparent; 1064 border-right: 4px solid transparent;
1066 border-bottom: 4px solid #cfcfcf; 1065 border-bottom: 4px solid #cfcfcf;
1067 transform: scaleY(-1); 1066 transform: scaleY(-1);
1068 margin-top: 10px; 1067 margin-top: 10px;
1069 } 1068 }
1070 .headMid { 1069 .headMid {
1071 font-size: 10px; 1070 font-size: 10px;
1072 color: #999999; 1071 color: #999999;
1073 letter-spacing: -0.19px; 1072 letter-spacing: -0.19px;
1074 margin-left: -120rpx; 1073 margin-left: -120rpx;
1075 } 1074 }
1076 .headRight { 1075 .headRight {
1077 width: 0; 1076 width: 0;
1078 height: 0; 1077 height: 0;
1079 border-left: 4px solid transparent; 1078 border-left: 4px solid transparent;
1080 border-right: 4px solid transparent; 1079 border-right: 4px solid transparent;
1081 border-bottom: 4px solid #cfcfcf; 1080 border-bottom: 4px solid #cfcfcf;
1082 margin-top: 10px; 1081 margin-top: 10px;
1083 } 1082 }
1084 } 1083 }
1085 .body { 1084 .body {
1086 font-size: 12px; 1085 font-size: 12px;
1087 color: #666666; 1086 color: #666666;
1088 letter-spacing: 0; 1087 letter-spacing: 0;
1089 .bodyBox { 1088 .bodyBox {
1090 margin-top: 15px; 1089 margin-top: 15px;
1091 .names { 1090 .names {
1092 font-size: 12px; 1091 font-size: 12px;
1093 color: #151515; 1092 color: #151515;
1094 letter-spacing: 0; 1093 letter-spacing: 0;
1095 text-align: justify; 1094 text-align: justify;
1096 line-height: 17px; 1095 line-height: 17px;
1097 margin-left: 5px; 1096 margin-left: 5px;
1098 margin-right: 10px; 1097 margin-right: 10px;
1099 } 1098 }
1100 text { 1099 text {
1101 font-size: 12px; 1100 font-size: 12px;
1102 color: #666666; 1101 color: #666666;
1103 letter-spacing: 0; 1102 letter-spacing: 0;
1104 text-align: justify; 1103 text-align: justify;
1105 } 1104 }
1106 } 1105 }
1107 } 1106 }
1108 .goods-form { 1107 .goods-form {
1109 display: flex; 1108 display: flex;
1110 flex-direction: column; 1109 flex-direction: column;
1111 align-items: center; 1110 align-items: center;
1112 justify-content: center; 1111 justify-content: center;
1113 background-color: #fff; 1112 background-color: #fff;
1114 width: 100%; 1113 width: 100%;
1115 padding: 40rpx 0; 1114 padding: 40rpx 0;
1116 .p1 { 1115 .p1 {
1117 font-size: 16px; 1116 font-size: 16px;
1118 color: #333333; 1117 color: #333333;
1119 letter-spacing: -0.3px; 1118 letter-spacing: -0.3px;
1120 text-align: justify; 1119 text-align: justify;
1121 line-height: 24px; 1120 line-height: 24px;
1122 margin: 4px 0; 1121 margin: 4px 0;
1123 1122
1124 } 1123 }
1125 .p2 { 1124 .p2 {
1126 font-size: 12px; 1125 font-size: 12px;
1127 color: #999999; 1126 color: #999999;
1128 letter-spacing: -0.23px; 1127 letter-spacing: -0.23px;
1129 margin-bottom: 32rpx; 1128 margin-bottom: 32rpx;
1130 } 1129 }
1131 .image2{ 1130 .image2{
1132 width: 42rpx; 1131 width: 42rpx;
1133 height: 34rpx; 1132 height: 34rpx;
1134 margin-right: 12rpx; 1133 margin-right: 12rpx;
1135 } 1134 }
1136 .confirm { 1135 .confirm {
1137 display: flex; 1136 display: flex;
1138 align-items: center; 1137 align-items: center;
1139 font-size: 12px; 1138 font-size: 12px;
1140 color: #666666; 1139 color: #666666;
1141 letter-spacing: -0.23px; 1140 letter-spacing: -0.23px;
1142 width: 684rpx; 1141 width: 684rpx;
1143 .image1{ 1142 .image1{
1144 margin-right:25rpx; 1143 margin-right:25rpx;
1145 width: 42rpx; 1144 width: 42rpx;
1146 height: 38rpx; 1145 height: 38rpx;
1147 } 1146 }
1148 } 1147 }
1149 .picker{ 1148 .picker{
1150 display: flex; 1149 display: flex;
1151 flex-direction: column; 1150 flex-direction: column;
1152 justify-content: center; 1151 justify-content: center;
1153 align-items: center; 1152 align-items: center;
1154 width: 100%; 1153 width: 100%;
1155 1154
1156 .picker-choice{ 1155 .picker-choice{
1157 display: flex; 1156 display: flex;
1158 width: 684rpx; 1157 width: 684rpx;
1159 align-items: center; 1158 align-items: center;
1160 margin-bottom: 40rpx; 1159 margin-bottom: 40rpx;
1161 .input{ 1160 .input{
1162 border-bottom: 1px solid #CFCFCF; 1161 border-bottom: 1px solid #CFCFCF;
1163 height: 40rpx; 1162 height: 40rpx;
1164 } 1163 }
1165 .choice-left{ 1164 .choice-left{
1166 width: 210rpx; 1165 width: 210rpx;
1167 .pd{ 1166 .pd{
1168 font-size: 14px; 1167 font-size: 14px;
1169 color: #333333; 1168 color: #333333;
1170 letter-spacing: -0.26px; 1169 letter-spacing: -0.26px;
1171 text-align: justify; 1170 text-align: justify;
1172 line-height: 24px; 1171 line-height: 24px;
1173 margin-right: 44rpx; 1172 margin-right: 44rpx;
1174 } 1173 }
1175 .p11 { 1174 .p11 {
1176 font-size: 14px; 1175 font-size: 14px;
1177 color: #333333; 1176 color: #333333;
1178 letter-spacing: -0.26px; 1177 letter-spacing: -0.26px;
1179 text-align: justify; 1178 text-align: justify;
1180 line-height: 24px; 1179 line-height: 24px;
1181 // margin-right: 10px; 1180 // margin-right: 10px;
1182 } 1181 }
1183 .p12 { 1182 .p12 {
1184 font-size: 10px; 1183 font-size: 10px;
1185 color: #3F3F3F; 1184 color: #3F3F3F;
1186 letter-spacing: -0.19px; 1185 letter-spacing: -0.19px;
1187 text-align: justify; 1186 text-align: justify;
1188 line-height: 24px; 1187 line-height: 24px;
1189 } 1188 }
1190 1189
1191 } 1190 }
1192 .p13 { 1191 .p13 {
1193 font-size: 10px; 1192 font-size: 10px;
1194 color: #999999; 1193 color: #999999;
1195 letter-spacing: -0.19px; 1194 letter-spacing: -0.19px;
1196 margin-right: 10px; 1195 margin-right: 10px;
1197 } 1196 }
1198 .p13-date { 1197 .p13-date {
1199 font-size: 10px; 1198 font-size: 10px;
1200 color: #999999; 1199 color: #999999;
1201 letter-spacing: -0.19px; 1200 letter-spacing: -0.19px;
1202 margin-right: 5px; 1201 margin-right: 5px;
1203 } 1202 }
1204 picker{ 1203 picker{
1205 width: 144rpx; 1204 width: 144rpx;
1206 height: 40rpx; 1205 height: 40rpx;
1207 display: flex; 1206 display: flex;
1208 position: relative; 1207 position: relative;
1209 .p14 { 1208 .p14 {
1210 font-size: 14px; 1209 font-size: 14px;
1211 color: #666666; 1210 color: #666666;
1212 letter-spacing: -0.26px; 1211 letter-spacing: -0.26px;
1213 text-align: center; 1212 text-align: center;
1214 width: 124rpx; 1213 width: 124rpx;
1215 border-bottom: 1px solid #CFCFCF; 1214 border-bottom: 1px solid #CFCFCF;
1216 height: 38rpx; 1215 height: 38rpx;
1217 } 1216 }
1218 image{ 1217 image{
1219 width: 20rpx; 1218 width: 20rpx;
1220 height: 20rpx; 1219 height: 20rpx;
1221 position: absolute; 1220 position: absolute;
1222 right: 20rpx; 1221 right: 20rpx;
1223 top: 8rpx; 1222 top: 8rpx;
1224 } 1223 }
1225 } 1224 }
1226 1225
1227 } 1226 }
1228 } 1227 }
1229 1228
1230 .ipts{ 1229 .ipts{
1231 width: 100%; 1230 width: 100%;
1232 display: flex; 1231 display: flex;
1233 flex-direction: column; 1232 flex-direction: column;
1234 justify-content: center; 1233 justify-content: center;
1235 align-items: flex-start; 1234 align-items: flex-start;
1236 // padding: 20rpx 36rpx; 1235 // padding: 20rpx 36rpx;
1237 box-sizing: border-box; 1236 box-sizing: border-box;
1238 .inputItem{ 1237 .inputItem{
1239 display: flex; 1238 display: flex;
1240 flex-direction: row; 1239 flex-direction: row;
1241 justify-content: center; 1240 justify-content: center;
1242 align-items: center; 1241 align-items: center;
1243 margin-bottom: 36rpx; 1242 margin-bottom: 36rpx;
1244 .text{ 1243 .text{
1245 margin-right: 100rpx; 1244 margin-right: 100rpx;
1246 } 1245 }
1247 .input{ 1246 .input{
1248 border-bottom: 1px solid #CFCFCF; 1247 border-bottom: 1px solid #CFCFCF;
1249 } 1248 }
1250 } 1249 }
1251 1250
1252 } 1251 }
1253 } 1252 }
1254 } 1253 }
1255 } 1254 }
1256 .choose { 1255 .choose {
1257 width: 100%; 1256 width: 100%;
1258 background: #ffffff; 1257 background: #ffffff;
1259 border-radius: 12rpx; 1258 border-radius: 12rpx;
1260 margin-top: 20rpx; 1259 margin-top: 20rpx;
1261 padding: 40rpx 40rpx 112rpx 40rpx; 1260 padding: 40rpx 40rpx 112rpx 40rpx;
1262 box-sizing: border-box; 1261 box-sizing: border-box;
1263 .chooseItem { 1262 .chooseItem {
1264 width: 100%; 1263 width: 100%;
1265 padding-bottom: 32rpx; 1264 padding-bottom: 32rpx;
1266 border-bottom: 1px solid #e9e9e9; 1265 border-bottom: 1px solid #e9e9e9;
1267 margin-bottom: 28rpx; 1266 margin-bottom: 28rpx;
1268 } 1267 }
1269 .chooseRes { 1268 .chooseRes {
1270 font-size: 12px; 1269 font-size: 12px;
1271 color: #666666; 1270 color: #666666;
1272 } 1271 }
1273 .itemsWrap { 1272 .itemsWrap {
1274 display: flex; 1273 display: flex;
1275 flex-direction: row; 1274 flex-direction: row;
1276 flex-wrap: wrap; 1275 flex-wrap: wrap;
1277 justify-content: flex-start; 1276 justify-content: flex-start;
1278 align-items: center; 1277 align-items: center;
1279 padding-top: 24rpx; 1278 padding-top: 24rpx;
1280 .item1 { 1279 .item1 {
1281 width: 64rpx; 1280 width: 64rpx;
1282 height: 64rpx; 1281 height: 64rpx;
1283 border-radius: 32rpx; 1282 border-radius: 32rpx;
1284 margin: 0 36rpx 24rpx 0; 1283 margin: 0 36rpx 24rpx 0;
1285 transition: all 0.3s; 1284 transition: all 0.3s;
1286 border: 1px solid #ffffff; 1285 border: 1px solid #ffffff;
1287 } 1286 }
1288 .item2 { 1287 .item2 {
1289 // width: 100rpx; 1288 // width: 100rpx;
1290 padding: 0 30rpx; 1289 padding: 0 30rpx;
1291 height: 60rpx; 1290 height: 60rpx;
1292 margin: 0 20rpx 20rpx 0; 1291 margin: 0 20rpx 20rpx 0;
1293 transition: all 0.3s; 1292 transition: all 0.3s;
1294 background: #f2f2f2; 1293 background: #f2f2f2;
1295 border-radius: 2px; 1294 border-radius: 2px;
1296 border-radius: 2px; 1295 border-radius: 2px;
1297 line-height: 60rpx; 1296 line-height: 60rpx;
1298 text-align: center; 1297 text-align: center;
1299 color: #666666; 1298 color: #666666;
1300 font-size: 12px; 1299 font-size: 12px;
1301 } 1300 }
1302 .active1 { 1301 .active1 {
1303 opacity: 0.7; 1302 opacity: 0.7;
1304 border: 1px solid #ff6b4a; 1303 border: 1px solid #ff6b4a;
1305 } 1304 }
1306 .active2 { 1305 .active2 {
1307 background: rgba(255, 107, 74, 0.15); 1306 background: rgba(255, 107, 74, 0.15);
1308 color: #ff6b4a; 1307 color: #ff6b4a;
1309 } 1308 }
1310 } 1309 }
1311 } 1310 }
1312 .button { 1311 .button {
1313 width: 100%; 1312 width: 100%;
1314 height: 112rpx; 1313 height: 112rpx;
1315 background-color: #ff6b4a; 1314 background-color: #ff6b4a;
1316 font-size: 16px; 1315 font-size: 16px;
1317 color: #ffffff; 1316 color: #ffffff;
1318 line-height: 112rpx; 1317 line-height: 112rpx;
1319 text-align: center; 1318 text-align: center;
1320 position: sticky; 1319 position: sticky;
1321 bottom: 0rpx; 1320 bottom: 0rpx;
1322 left: 0rpx; 1321 left: 0rpx;
1323 z-index: 9999; 1322 z-index: 9999;
1324 } 1323 }
1325 } 1324 }
1326 /* sheet弹窗 */ 1325 /* sheet弹窗 */
1327 .sheet{ 1326 .sheet{
1328 width: 100%; 1327 width: 100%;
1329 height: 100%; 1328 height: 100%;
1330 position: fixed; 1329 position: fixed;
1331 top: 150%; 1330 top: 150%;
1332 left: 0upx; 1331 left: 0upx;
1333 bottom: 0upx; 1332 bottom: 0upx;
1334 right: 0upx; 1333 right: 0upx;
1335 background:rgba(0,0,0,0.3); 1334 background:rgba(0,0,0,0.3);
1336 z-index: 10000; 1335 z-index: 10000;
1337 } 1336 }
1338 1337
1339 /* 显示时候的动画默认0.5s */ 1338 /* 显示时候的动画默认0.5s */
1340 .sheetView{ 1339 .sheetView{
1341 width: 100%; 1340 width: 100%;
1342 height: 0upx; 1341 height: 0upx;
1343 position: absolute; 1342 position: absolute;
1344 bottom: 0upx; 1343 bottom: 0upx;
1345 background: white; 1344 background: white;
1346 z-index: 10001; 1345 z-index: 10001;
1347 transition: all 0.5s; 1346 transition: all 0.5s;
1348 } 1347 }
1349 .sheetShow{ 1348 .sheetShow{
1350 top:0upx !important; 1349 top:0upx !important;
1351 } 1350 }
1352 /* 关闭时的动画，时间自己可以设置0.5s*/ 1351 /* 关闭时的动画，时间自己可以设置0.5s*/
1353 .sheeHide{ 1352 .sheeHide{
1354 top:120% !important; 1353 top:120% !important;
1355 transition: all 0.5s; 1354 transition: all 0.5s;
1356 } 1355 }
1357 1356
1358 /* 项目需求根据设计稿要展示的高度,超出这个高度就自动滚动*/ 1357 /* 项目需求根据设计稿要展示的高度,超出这个高度就自动滚动*/
1359 .sheetView_active{ 1358 .sheetView_active{
1360 height: 1042upx; 1359 height: 1042upx;
1361 } 1360 }
1362 1361
1363 </style> 1362 </style>
1364 1363
src/pages/confirmOrder/confirmOrder.vue
Diff comments   View file @78ed609
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}}\n{{addressInfo.add_detail}}</text> 37 <text class="address">{{addressInfo.address}}\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 mode="aspectFill" 42 mode="aspectFill"
43 ></image> 43 ></image>
44 </view> 44 </view>
45 <view class="content"> 45 <view class="content">
46 <view class="orderInfo"> 46 <view class="orderInfo">
47 <view class="title"> 47 <view class="title">
48 <image 48 <image
49 src="../../static/store.png" 49 src="../../static/store.png"
50 mode="aspectFill" 50 mode="aspectFill"
51 style="width: 40rpx;height: 40rpx;" 51 style="width: 40rpx;height: 40rpx;"
52 ></image> 52 ></image>
53 <text>非常戴镜</text> 53 <text>非常戴镜</text>
54 </view> 54 </view>
55 55
56 <view 56 <view
57 class="infoBox" 57 class="infoBox"
58 v-if="isCart == 'true'" 58 v-if="isCart == 'true'"
59 v-for="(item, index) in checkedCartLst" 59 v-for="(item, index) in checkedCartLst"
60 :key="index" 60 :key="index"
61 > 61 >
62 <view class="infoTop"> 62 <view class="infoTop">
63 <image 63 <image
64 :src="item.img_index_url" 64 :src="item.img_index_url"
65 mode="aspectFill" 65 mode="aspectFill"
66 ></image> 66 ></image>
67 <view class="infoRight"> 67 <view class="infoRight">
68 <text class="goodName">{{item.p_name}}</text> 68 <text class="goodName">{{item.p_name}}</text>
69 <text class="remarks">支持7天无理由退货 顺丰发货</text> 69 <text class="remarks">支持7天无理由退货 顺丰发货</text>
70 <view class="priceBox"> 70 <view class="priceBox">
71 <view class="price">¥{{Number(item.nowPrice) * item.num}}<text class="originCost"> 71 <view class="price">¥{{Number(item.nowPrice) * item.num}}<text class="originCost">
72 ¥{{item.oldPrice*item.num}} 72 ¥{{item.oldPrice*item.num}}
73 </text></view> 73 </text></view>
74 <view class="counter"> 74 <view class="counter">
75 <view 75 <view
76 class="btn" 76 class="btn"
77 disabled="this.disabled" 77 disabled="this.disabled"
78 type="default" 78 type="default"
79 @click="counter(false,index)" 79 @click="counter(false,index)"
80 >-</view> 80 >-</view>
81 <text>{{checkedCartLst[index].num}}</text> 81 <text>{{checkedCartLst[index].num}}</text>
82 <view 82 <view
83 class="btn" 83 class="btn"
84 type="default" 84 type="default"
85 @click="counter(true,index)" 85 @click="counter(true,index)"
86 >+</view> 86 >+</view>
87 </view> 87 </view>
88 </view> 88 </view>
89 </view> 89 </view>
90 </view> 90 </view>
91 <view class="infoBottom"> 91 <view class="infoBottom">
92 <view class="norm">规格 <text> 92 <view class="norm">规格 <text>
93 <!-- 长度超出变省略号未做 --> 93 <!-- 长度超出变省略号未做 -->
94 <block>{{item.sku_name}}<block v-if="index !== current.length -1">/</block> 94 <block>{{item.sku_name}}<block v-if="index !== current.length -1">/</block>
95 </block> 95 </block>
96 </text></view> 96 </text></view>
97 <view class="shippingMethod">使用人 <text> 97 <view class="shippingMethod">使用人 <text>
98 {{item.peopleName}} 98 {{item.peopleName}}
99 </text></view> 99 </text></view>
100 <view class="shippingMethod">配送方式 <text>快递</text></view> 100 <view class="shippingMethod">配送方式 <text>快递</text></view>
101 <view class="message">买家留言 101 <view class="message">买家留言
102 <input 102 <input
103 type="text" 103 type="text"
104 :value="note" 104 :value="note"
105 placeholder="建议提前协商(50字以内)" 105 placeholder="建议提前协商(50字以内)"
106 /> 106 />
107 </view> 107 </view>
108 </view> 108 </view>
109 </view> 109 </view>
110 110
111 <view 111 <view
112 class="infoBox" 112 class="infoBox"
113 v-if="isCart !== 'true'" 113 v-if="isCart !== 'true'"
114 > 114 >
115 <view class="infoTop"> 115 <view class="infoTop">
116 <image 116 <image
117 :src="buyItem.pic" 117 :src="buyItem.pic"
118 mode="aspectFill" 118 mode="aspectFill"
119 ></image> 119 ></image>
120 <view class="infoRight"> 120 <view class="infoRight">
121 <text class="goodName">{{goodInfo.p_name}}</text> 121 <text class="goodName">{{goodInfo.p_name}}</text>
122 <text class="remarks">支持7天无理由退货 顺丰发货</text> 122 <text class="remarks">支持7天无理由退货 顺丰发货</text>
123 <view class="priceBox"> 123 <view class="priceBox">
124 <view class="price">¥{{buyItem.real_price * count}}<text class="originCost"> 124 <view class="price">¥{{buyItem.real_price * count}}<text class="originCost">
125 ¥{{buyItem.out_price * count}} 125 ¥{{buyItem.out_price * count}}
126 </text></view> 126 </text></view>
127 <view class="counter"> 127 <view class="counter">
128 <view 128 <view
129 class="btn" 129 class="btn"
130 disabled="this.disabled" 130 disabled="this.disabled"
131 type="default" 131 type="default"
132 @click="counter(false)" 132 @click="counter(false)"
133 >-</view> 133 >-</view>
134 <text>{{count}}</text> 134 <text>{{count}}</text>
135 <view 135 <view
136 class="btn" 136 class="btn"
137 type="default" 137 type="default"
138 @click="counter(true)" 138 @click="counter(true)"
139 >+</view> 139 >+</view>
140 </view> 140 </view>
141 </view> 141 </view>
142 </view> 142 </view>
143 </view> 143 </view>
144 <view class="infoBottom"> 144 <view class="infoBottom">
145 <view class="norm">规格 <text> 145 <view class="norm">规格 <text>
146 <!-- 长度超出变省略号未做 --> 146 <!-- 长度超出变省略号未做 -->
147 <block 147 <block
148 v-for="(item, index) in current" 148 v-for="(item, index) in current"
149 :key="index" 149 :key="index"
150 >{{attrList[index].attr[item].name}}<block v-if="index !== current.length -1">/</block> 150 >{{attrList[index].attr[item].name}}<block v-if="index !== current.length -1">/</block>
151 </block> 151 </block>
152 </text></view> 152 </text></view>
153 <view class="shippingMethod">使用人 <text> 153 <view class="shippingMethod">使用人 <text>
154 {{name}} 154 {{name}}
155 </text></view> 155 </text></view>
156 <view class="shippingMethod">配送方式 <text>快递</text></view> 156 <view class="shippingMethod">配送方式 <text>快递</text></view>
157 <view class="message">买家留言 157 <view class="message">买家留言
158 <input 158 <input
159 type="text" 159 type="text"
160 :value="note" 160 :value="note"
161 placeholder="建议提前协商(50字以内)" 161 placeholder="建议提前协商(50字以内)"
162 /> 162 />
163 </view> 163 </view>
164 </view> 164 </view>
165 </view> 165 </view>
166 </view> 166 </view>
167 <view class="payWay"> 167 <view class="payWay">
168 <view class="item"> 168 <view class="item">
169 <text>支付方式</text> 169 <text>支付方式</text>
170 <view class="itemRight"> 170 <view class="itemRight">
171 <view class="rightText"> 171 <view class="rightText">
172 <view class="choosePayWay"> 172 <view class="choosePayWay">
173 <image 173 <image
174 src="../../static/chat_logo.png" 174 src="../../static/chat_logo.png"
175 mode="aspectFill" 175 mode="aspectFill"
176 ></image> 176 ></image>
177 <text>微信支付</text> 177 <text>微信支付</text>
178 </view> 178 </view>
179 <!-- <view class="randomSubstraction">最高随机立减￥99</view> --> 179 <!-- <view class="randomSubstraction">最高随机立减￥99</view> -->
180 </view> 180 </view>
181 <!-- <image 181 <!-- <image
182 src="../../static/right.png" 182 src="../../static/right.png"
183 mode="aspectFill" 183 mode="aspectFill"
184 ></image> --> 184 ></image> -->
185 </view> 185 </view>
186 </view> 186 </view>
187 <!-- <view class="item"> 187 <!-- <view class="item">
188 <text>优惠券</text> 188 <text>优惠券</text>
189 <view class="itemRight"> 189 <view class="itemRight">
190 <view class="rightText"> 190 <view class="rightText">
191 <view class="chooseOffers"> 191 <view class="chooseOffers">
192 <text>-￥70.00</text> 192 <text>-￥70.00</text>
193 </view> 193 </view>
194 <view class="preferentialWay">最大优惠</view> 194 <view class="preferentialWay">最大优惠</view>
195 </view> 195 </view>
196 <image 196 <image
197 src="../../static/right.png" 197 src="../../static/right.png"
198 mode="aspectFill" 198 mode="aspectFill"
199 ></image> 199 ></image>
200 </view> 200 </view>
201 </view> --> 201 </view> -->
202 <view class="item"> 202 <view class="item">
203 <text>运费</text> 203 <text>运费</text>
204 <view class="itemRight"> 204 <view class="itemRight">
205 <view class="freight">免运费</view> 205 <view class="freight">免运费</view>
206 </view> 206 </view>
207 </view> 207 </view>
208 <view class="item"> 208 <view class="item">
209 <text>合计</text> 209 <text>合计</text>
210 <view class="itemRight"> 210 <view class="itemRight">
211 <view class="total">¥{{totalPrice}}</view> 211 <view class="total">¥{{totalPrice}}</view>
212 <!-- <view class="total" v-else>¥{{Number(skuInfo.real_price) * count}}</view> --> 212 <!-- <view class="total" v-else>¥{{Number(skuInfo.real_price) * count}}</view> -->
213 </view> 213 </view>
214 </view> 214 </view>
215 </view> 215 </view>
216 <!-- 216 <!--
217 <view class="checkBox"> 217 <view class="checkBox">
218 <checkbox-group> 218 <checkbox-group>
219 <label> 219 <label>
220 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买 220 <checkbox color="#FF6B4A" value="isAnonymous" checked="true" />匿名购买
221 </label> 221 </label>
222 </checkbox-group> 222 </checkbox-group>
223 </view> --> 223 </view> -->
224 </view> 224 </view>
225 <view class="last_zhanwei"></view> 225 <view class="last_zhanwei"></view>
226 <view class="footer"> 226 <view class="footer">
227 <view class="footerLeft">实付金额: 227 <view class="footerLeft">实付金额:
228 <text>¥{{totalPrice}}</text> 228 <text>¥{{totalPrice}}</text>
229 <!-- <text v-else>¥{{Number(skuInfo.real_price) * count}}</text> --> 229 <!-- <text v-else>¥{{Number(skuInfo.real_price) * count}}</text> -->
230 </view> 230 </view>
231 <view class="footerRight"> 231 <view class="footerRight">
232 <view 232 <view
233 class="paybtn" 233 class="paybtn"
234 @tap="orderBuild" 234 @tap="orderBuild"
235 >立即支付</view> 235 >立即支付</view>
236 </view> 236 </view>
237 </view> 237 </view>
238 </view> 238 </view>
239 </template> 239 </template>
240 240
241 <script> 241 <script>
242 import store from '@/store' 242 import store from '@/store'
243 import MD5Util from '../../utils/md5' 243 import MD5Util from '../../utils/md5'
244 244
245 export default { 245 export default {
246 data() { 246 data() {
247 return { 247 return {
248 name: String, 248 name: String,
249 addAddress: '添加收货地址', 249 addAddress: '添加收货地址',
250 count: 1, 250 count: 1,
251 pid: 0, 251 pid: 0,
252 disabled: false, 252 disabled: false,
253 freight: 0.0, 253 freight: 0.0,
254 showAddress: false, 254 showAddress: false,
255 note: '', 255 note: '',
256 addressInfo: { 256 addressInfo: {
257 address: '', 257 address: '',
258 }, 258 },
259 isCart: Boolean, 259 isCart: Boolean,
260 // isAnonymous: 260 // isAnonymous:
261 checkedCartLst: [], 261 checkedCartLst: [],
262 } 262 }
263 }, 263 },
264 onShow(addressId) { 264 onShow(addressId) {
265 // console.log('+-+-*-*-+-+',addressId) 265 // console.log('+-+-*-*-+-+',addressId)
266 if (addressId) { 266 if (addressId) {
267 store 267 store
268 .dispatch('address/details', { 268 .dispatch('address/details', {
269 add_id: addressId, 269 add_id: addressId,
270 }) 270 })
271 .then(({ code, data }) => { 271 .then(({ code, data }) => {
272 if (code === 1) { 272 if (code === 1) {
273 // console.log('code', code, data) 273 // console.log('code', code, data)
274 this.showAddress = true 274 this.showAddress = true
275 this.addressInfo = data 275 this.addressInfo = data
276 } 276 }
277 }) 277 })
278 } 278 }
279 }, 279 },
280 onLoad({ pid, addressId, isCart, count, name }) { 280 onLoad({ pid, addressId, isCart, count, name }) {
281 if (isCart == 'false') { 281 if (isCart == 'false') {
282 this.pid = pid 282 this.pid = pid
283 store.dispatch('read/fetch', { 283 store.dispatch('read/fetch', {
284 pid, 284 pid,
285 }) 285 })
286 } 286 }
287 this.count = count 287 this.count = count
288 this.name = name 288 this.name = name
289 this.isCart = isCart 289 this.isCart = isCart
290 290
291 console.log('++++++++++++' + pid, addressId, isCart) 291 console.log('++++++++++++' + pid, addressId, isCart)
292 this.checkedCartLst = this.$store.state.cart.checkedCartLst 292 this.checkedCartLst = this.$store.state.cart.checkedCartLst
293 // console.log('++++++++++6666666666++',this.$store.state.cart.checkedCartLst) 293 // console.log('++++++++++6666666666++',this.$store.state.cart.checkedCartLst)
294 // 若已经选择地址 294 // 若已经选择地址
295 if (addressId) { 295 if (addressId) {
296 store 296 store
297 .dispatch('address/details', { 297 .dispatch('address/details', {
298 add_id: addressId, 298 add_id: addressId,
299 }) 299 })
300 .then(({ code, data }) => { 300 .then(({ code, data }) => {
301 if (code === 1) { 301 if (code === 1) {
302 // console.log('code', code, data) 302 // console.log('code', code, data)
303 this.showAddress = true 303 this.showAddress = true
304 this.addressInfo = data 304 this.addressInfo = data
305 } 305 }
306 }) 306 })
307 } else { 307 } else {
308 store.dispatch('address/default').then(({ code, data }) => { 308 store.dispatch('address/default').then(({ code, data }) => {
309 if (code === 1) { 309 if (code === 1) {
310 // console.log('code', code, data) 310 // console.log('code', code, data)
311 this.showAddress = true 311 this.showAddress = true
312 this.addressInfo = data 312 this.addressInfo = data
313 } 313 }
314 }) 314 })
315 } 315 }
316 }, 316 },
317 computed: { 317 computed: {
318 totalPrice() { 318 totalPrice() {
319 if (this.isCart == 'true') { 319 if (this.isCart == 'true') {
320 let total = 0 320 let total = 0
321 this.$store.state.cart.checkedCartLst.map(item => { 321 this.$store.state.cart.checkedCartLst.map(item => {
322 total += item.nowPrice * item.num 322 total += item.nowPrice * item.num
323 }) 323 })
324 return total 324 return total
325 } else { 325 } else {
326 return this.buyItem.real_price * this.count 326 return this.buyItem.real_price * this.count
327 } 327 }
328 }, 328 },
329 buyItem() { 329 buyItem() {
330 return this.$store.state.cart.buyItem 330 return this.$store.state.cart.buyItem
331 }, 331 },
332 // checkedCartLst(){ 332 // checkedCartLst(){
333 // console.log('checkedCartLst',this.$store.state.cart.checkedCartLst) 333 // console.log('checkedCartLst',this.$store.state.cart.checkedCartLst)
334 // return this.$store.state.cart.checkedCartLst 334 // return this.$store.state.cart.checkedCartLst
335 // }, 335 // },
336 goodInfo() { 336 goodInfo() {
337 console.log('state', this.$store.state.read.goodInfo) 337 console.log('state', this.$store.state.read.goodInfo)
338 return this.$store.state.read.goodInfo 338 return this.$store.state.read.goodInfo
339 }, 339 },
340 skuInfo() { 340 skuInfo() {
341 return this.$store.state.order.param.sk_id_arr 341 return this.$store.state.order.param.sk_id_arr
342 }, 342 },
343 attrList() { 343 attrList() {
344 return this.$store.state.order.param.attrList 344 return this.$store.state.order.param.attrList
345 }, 345 },
346 current() { 346 current() {
347 return this.$store.state.order.param.current 347 return this.$store.state.order.param.current
348 }, 348 },
349 }, 349 },
350 methods: { 350 methods: {
351 counter(isadd, index) { 351 counter(isadd, index) {
352 if (isadd) { 352 if (isadd) {
353 if (this.isCart == 'true') { 353 if (this.isCart == 'true') {
354 this.checkedCartLst[index].num++ 354 this.checkedCartLst[index].num++
355 } else { 355 } else {
356 this.count++ 356 this.count++
357 } 357 }
358 } else { 358 } else {
359 if (this.isCart == 'true') { 359 if (this.isCart == 'true') {
360 this.checkedCartLst[index].num <= 1 ? (this.disabled = true) : this.checkedCartLst[index].num-- 360 this.checkedCartLst[index].num <= 1 ? (this.disabled = true) : this.checkedCartLst[index].num--
361 } else { 361 } else {
362 this.count <= 1 ? (this.disabled = true) : this.count-- 362 this.count <= 1 ? (this.disabled = true) : this.count--
363 } 363 }
364 } 364 }
365 }, 365 },
366 // 跳转添加地址页面 366 // 跳转添加地址页面
367 toaddAddress() { 367 toaddAddress() {
368 uni.navigateTo({ 368 uni.navigateTo({
369 url: `../address/addressList?edit=${1}`, 369 url: `../address/addressList?edit=${1}`,
370 success: res => {}, 370 success: res => {},
371 fail: error => { 371 fail: error => {
372 console.log('跳转到地址列表页面失败====>', error) 372 console.log('跳转到地址列表页面失败====>', error)
373 }, 373 },
374 complete: () => {}, 374 complete: () => {},
375 }) 375 })
376 }, 376 },
377 // 下单 377 // 下单
378 orderBuild() { 378 orderBuild() {
379 uni.showLoading({ 379 uni.showLoading({
380 title: '支付中', 380 title: '支付中',
381 }) 381 })
382 if (this.isCart === 'true') { 382 if (this.isCart === 'true') {
383 const checkedGoods = [] 383 const checkedGoods = []
384 const sk_id_arr = [] 384 const sk_id_arr = []
385 this.checkedCartLst.map(item => { 385 this.checkedCartLst.map(item => {
386 checkedGoods.push(item.pid) 386 checkedGoods.push(item.cart_id)
387 sk_id_arr.push(item.sk_id) 387 sk_id_arr.push(item.sk_id)
388 }) 388 })
389 store.dispatch('order/build', { 389 store.dispatch('order/build', {
390 uid: this.$store.state.user.userInfo.uid, 390 uid: this.$store.state.user.userInfo.uid,
391 address: JSON.stringify(this.addressInfo), 391 address: JSON.stringify(this.addressInfo),
392 checkedGoods: checkedGoods, 392 checkedGoods: checkedGoods,
393 sk_id_arr: sk_id_arr, 393 sk_id_arr: sk_id_arr,
394 totalPrice: this.totalPrice, 394 totalPrice: this.totalPrice,
395 }).then((res) => { 395 }).then((res) => {
396 this.pay(res) 396 this.pay(res)
397 }) 397 })
398 } 398 }
399 if (this.isCart === 'false') { 399 if (this.isCart === 'false') {
400 const { sk_id_arr: skId, mp_id: mpId } = this.$store.state.order.param 400 const { sk_id_arr: skId, mp_id: mpId } = this.$store.state.order.param
401 store.dispatch('order/buyNow', { 401 store.dispatch('order/buyNow', {
402 pid: skId.pid, 402 pid: skId.pid,
403 sk_id: skId.sk_id, 403 sk_id: skId.sk_id,
404 number: this.count, 404 number: this.count,
405 mp_id: mpId, 405 mp_id: mpId,
406 address: JSON.stringify(this.addressInfo), 406 address: JSON.stringify(this.addressInfo),
407 totalPrice: this.totalPrice, 407 totalPrice: this.totalPrice,
408 liuyan: this.note, 408 liuyan: this.note,
409 dir: 1, 409 dir: 1,
410 }).then((res) => { 410 }).then((res) => {
411 this.pay(res) 411 this.pay(res)
412 }) 412 })
413 } 413 }
414 }, 414 },
415 // 支付 415 // 支付
416 pay(res) { 416 pay(res) {
417 console.log('pay', res) 417 console.log('pay', res)
418 const { data, exKeyName: keyName } = res 418 const { data, exKeyName: keyName } = res
419 const uid = uni.getStorageSync('uid') 419 const uid = uni.getStorageSync('uid')
420 const timeStamp = new Date().getTime().toString() 420 const timeStamp = new Date().getTime().toString()
421 const nonceStr = 'asfafasfasfasfasf' 421 const nonceStr = 'asfafasfasfasfasf'
422 // 支付参数 422 // 支付参数
423 const fieldSet = { 423 const fieldSet = {
424 openid: this.$store.state.user.userInfo.openid, 424 openid: this.$store.state.user.userInfo.openid,
425 uid: this.$store.state.user.userInfo.uid, 425 uid: this.$store.state.user.userInfo.uid,
426 shopid: 0, 426 shopid: 0,
427 payCate: 2020, 427 payCate: 2020,
428 payMoney: this.totalPrice, 428 payMoney: this.totalPrice,
429 payWoodId: `fcdj-${uid}-${keyName}`, 429 payWoodId: `fcdj-${uid}-${keyName}`,
430 payWoodDesc: '在【非常戴镜】的微信付款凭证', 430 payWoodDesc: '在【非常戴镜】的微信付款凭证',
431 nonceStr, 431 nonceStr,
432 signType: 'MD5', 432 signType: 'MD5',
433 app_uid: 2020, 433 app_uid: 2020,
434 timeStamp, 434 timeStamp,
435 keyname: keyName, 435 keyname: keyName,
436 billInfo: JSON.stringify(data), 436 billInfo: JSON.stringify(data),
437 } 437 }
438 // 请求后台支付接口 438 // 请求后台支付接口
439 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => { 439 store.dispatch('order/pay', fieldSet).then(({ data, data2, pay_id: payId }) => {
440 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') { 440 if (data.return_code === 'SUCCESS' && data.result_code === 'SUCCESS') {
441 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}` 441 const stringA = `appId=wx115b25aa396d27ac&nonceStr=${nonceStr}&package=prepay_id=${data.prepay_id}&signType=MD5&timeStamp=${timeStamp}`
442 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789' 442 const stringSignTemp = stringA + '&key=NewMoney2017hatemydaddy123456789'
443 443
444 // 微信支付接口 444 // 微信支付接口
445 uni.requestPayment({ 445 uni.requestPayment({
446 appId: data.appid, 446 appId: data.appid,
447 timeStamp, 447 timeStamp,
448 nonceStr, 448 nonceStr,
449 total_fee: this.totalPrice, 449 total_fee: this.totalPrice,
450 package: `prepay_id=${data.prepay_id}`, 450 package: `prepay_id=${data.prepay_id}`,
451 signType: 'MD5', 451 signType: 'MD5',
452 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(), 452 paySign: MD5Util.MD5(stringSignTemp).toUpperCase(),
453 success: (res) => { 453 success: (res) => {
454 // 支付成功 454 // 支付成功
455 uni.showModal({ 455 uni.showModal({
456 content: '支付成功', 456 content: '支付成功',
457 showCancel: false, 457 showCancel: false,
458 }) 458 })
459 // 跳转订单详情页->状态 待收货 459 // 跳转订单详情页->状态 待收货
460 uni.reLaunch({ 460 uni.reLaunch({
461 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`, 461 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=1&isPay=1`,
462 }) 462 })
463 }, 463 },
464 fail: (res) => { 464 fail: (res) => {
465 // 支付失败 465 // 支付失败
466 uni.showModal({ 466 uni.showModal({
467 content: '支付失败', 467 content: '支付失败',
468 showCancel: false, 468 showCancel: false,
469 }) 469 })
470 // 跳转订单详情页->状态 待付款 470 // 跳转订单详情页->状态 待付款
471 uni.reLaunch({ 471 uni.reLaunch({
472 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`, 472 url: `../myOrderPaying/myOrderPaying?payId=${payId}&status=0&isPay=1`,
473 }) 473 })
474 }, 474 },
475 complete: () => { 475 complete: () => {
476 uni.hideLoading() 476 uni.hideLoading()
477 }, 477 },
478 }) 478 })
479 } else { 479 } else {
480 uni.showModal({ 480 uni.showModal({
481 content: '支付失败', 481 content: '支付失败',
482 showCancel: false, 482 showCancel: false,
483 }) 483 })
484 console.log('支付失败') 484 console.log('支付失败')
485 uni.hideLoading() 485 uni.hideLoading()
486 } 486 }
487 }) 487 })
488 }, 488 },
489 }, 489 },
490 } 490 }
491 </script> 491 </script>
492 492
493 <style lang="scss"> 493 <style lang="scss">
494 .wrap { 494 .wrap {
495 height: 100vh; 495 height: 100vh;
496 background-color: #f2f2f2; 496 background-color: #f2f2f2;
497 font-family: PingFangSC-Regular; 497 font-family: PingFangSC-Regular;
498 letter-spacing: -0.23px; 498 letter-spacing: -0.23px;
499 position: absolute; 499 position: absolute;
500 } 500 }
501 .addAddress { 501 .addAddress {
502 background-color: #ffffff; 502 background-color: #ffffff;
503 box-sizing: border-box; 503 box-sizing: border-box;
504 height: 124rpx; 504 height: 124rpx;
505 width: 100%; 505 width: 100%;
506 display: flex; 506 display: flex;
507 align-items: center; 507 align-items: center;
508 padding: 0 40rpx; 508 padding: 0 40rpx;
509 .addIcon { 509 .addIcon {
510 background-color: #f2f2f2; 510 background-color: #f2f2f2;
511 height: 56rpx; 511 height: 56rpx;
512 width: 60rpx; 512 width: 60rpx;
513 border-radius: 4rpx; 513 border-radius: 4rpx;
514 display: flex; 514 display: flex;
515 justify-content: center; 515 justify-content: center;
516 align-items: center; 516 align-items: center;
517 margin-right: 40rpx; 517 margin-right: 40rpx;
518 } 518 }
519 image { 519 image {
520 height: 28rpx; 520 height: 28rpx;
521 width: 30rpx; 521 width: 30rpx;
522 } 522 }
523 .addressText { 523 .addressText {
524 font-size: 28rpx; 524 font-size: 28rpx;
525 color: #333333; 525 color: #333333;
526 margin-right: 364rpx; 526 margin-right: 364rpx;
527 } 527 }
528 } 528 }
529 .content { 529 .content {
530 background-color: #f2f2f2; 530 background-color: #f2f2f2;
531 width: 100%; 531 width: 100%;
532 display: flex; 532 display: flex;
533 flex-direction: column; 533 flex-direction: column;
534 justify-content: center; 534 justify-content: center;
535 align-items: center; 535 align-items: center;
536 padding: 40rpx; 536 padding: 40rpx;
537 box-sizing: border-box; 537 box-sizing: border-box;
538 .orderInfo { 538 .orderInfo {
539 width: 670rpx; 539 width: 670rpx;
540 min-height: 488rpx; 540 min-height: 488rpx;
541 background-color: #ffffff; 541 background-color: #ffffff;
542 border-radius: 20rpx; 542 border-radius: 20rpx;
543 box-sizing: border-box; 543 box-sizing: border-box;
544 padding: 0 40rpx 40rpx 40rpx; 544 padding: 0 40rpx 40rpx 40rpx;
545 .title { 545 .title {
546 display: flex; 546 display: flex;
547 align-items: center; 547 align-items: center;
548 font-size: 28rpx; 548 font-size: 28rpx;
549 color: #333333; 549 color: #333333;
550 height: 60rpx; 550 height: 60rpx;
551 line-height: 40rpx; 551 line-height: 40rpx;
552 padding: 10rpx 10rpx 10rpx 0rpx; 552 padding: 10rpx 10rpx 10rpx 0rpx;
553 image { 553 image {
554 margin-right: 20rpx; 554 margin-right: 20rpx;
555 } 555 }
556 } 556 }
557 .infoBox { 557 .infoBox {
558 margin-top: 42rpx; 558 margin-top: 42rpx;
559 .infoTop { 559 .infoTop {
560 display: flex; 560 display: flex;
561 flex-direction: row; 561 flex-direction: row;
562 image { 562 image {
563 height: 188rpx; 563 height: 188rpx;
564 width: 188rpx; 564 width: 188rpx;
565 margin-right: 24rpx; 565 margin-right: 24rpx;
566 } 566 }
567 .infoRight { 567 .infoRight {
568 width: 374rpx; 568 width: 374rpx;
569 display: flex; 569 display: flex;
570 flex-direction: column; 570 flex-direction: column;
571 align-items: flex-start; 571 align-items: flex-start;
572 justify-content: space-between; 572 justify-content: space-between;
573 .goodName { 573 .goodName {
574 font-size: 28rpx; 574 font-size: 28rpx;
575 color: #333333; 575 color: #333333;
576 } 576 }
577 .remarks { 577 .remarks {
578 font-size: 20rpx; 578 font-size: 20rpx;
579 color: #999999; 579 color: #999999;
580 } 580 }
581 .priceBox { 581 .priceBox {
582 display: flex; 582 display: flex;
583 justify-content: space-between; 583 justify-content: space-between;
584 align-items: center; 584 align-items: center;
585 width: 100%; 585 width: 100%;
586 .price { 586 .price {
587 color: #ff6b4a; 587 color: #ff6b4a;
588 font-size: 28rpx; 588 font-size: 28rpx;
589 } 589 }
590 .originCost { 590 .originCost {
591 text-decoration: line-through; 591 text-decoration: line-through;
592 color: #999999; 592 color: #999999;
593 font-size: 20rpx; 593 font-size: 20rpx;
594 } 594 }
595 .counter { 595 .counter {
596 display: flex; 596 display: flex;
597 flex-direction: row; 597 flex-direction: row;
598 justify-content: space-between; 598 justify-content: space-between;
599 font-size: 28rpx; 599 font-size: 28rpx;
600 color: #333333; 600 color: #333333;
601 width: 122rpx; 601 width: 122rpx;
602 .btn { 602 .btn {
603 display: flex; 603 display: flex;
604 justify-content: center; 604 justify-content: center;
605 line-height: 32rpx; 605 line-height: 32rpx;
606 height: 32rpx; 606 height: 32rpx;
607 width: 32rpx; 607 width: 32rpx;
608 background-color: #f2f2f2; 608 background-color: #f2f2f2;
609 color: #cfcfcf; 609 color: #cfcfcf;
610 } 610 }
611 } 611 }
612 } 612 }
613 } 613 }
614 } 614 }
615 .infoBottom { 615 .infoBottom {
616 display: flex; 616 display: flex;
617 flex-direction: column; 617 flex-direction: column;
618 justify-content: flex-start; 618 justify-content: flex-start;
619 font-size: 24rpx; 619 font-size: 24rpx;
620 color: #333333; 620 color: #333333;
621 text { 621 text {
622 color: #999999; 622 color: #999999;
623 margin-left: 20rpx; 623 margin-left: 20rpx;
624 } 624 }
625 625
626 .norm { 626 .norm {
627 margin-top: 28rpx; 627 margin-top: 28rpx;
628 } 628 }
629 .shippingMethod { 629 .shippingMethod {
630 margin-top: 12rpx; 630 margin-top: 12rpx;
631 } 631 }
632 .message { 632 .message {
633 display: flex; 633 display: flex;
634 flex-direction: row; 634 flex-direction: row;
635 align-items: center; 635 align-items: center;
636 margin-top: 18rpx; 636 margin-top: 18rpx;
637 input { 637 input {
638 margin-left: 20rpx; 638 margin-left: 20rpx;
639 width: 75%; 639 width: 75%;
640 } 640 }
641 } 641 }
642 } 642 }
643 } 643 }
644 } 644 }
645 .payWay { 645 .payWay {
646 height: 464rpx; 646 height: 464rpx;
647 width: 670rpx; 647 width: 670rpx;
648 background-color: #ffffff; 648 background-color: #ffffff;
649 color: #333333; 649 color: #333333;
650 font-size: 24rpx; 650 font-size: 24rpx;
651 border-radius: 20rpx; 651 border-radius: 20rpx;
652 box-sizing: border-box; 652 box-sizing: border-box;
653 padding: 0 52rpx 0rpx 40rpx; 653 padding: 0 52rpx 0rpx 40rpx;
654 margin-top: 20rpx; 654 margin-top: 20rpx;
655 display: flex; 655 display: flex;
656 flex-direction: column; 656 flex-direction: column;
657 justify-content: center; 657 justify-content: center;
658 align-items: flex-start; 658 align-items: flex-start;
659 .item { 659 .item {
660 display: flex; 660 display: flex;
661 flex-direction: row; 661 flex-direction: row;
662 justify-content: space-between; 662 justify-content: space-between;
663 align-items: center; 663 align-items: center;
664 width: 100%; 664 width: 100%;
665 height: 115rpx; 665 height: 115rpx;
666 .itemRight { 666 .itemRight {
667 display: flex; 667 display: flex;
668 flex-direction: row; 668 flex-direction: row;
669 justify-content: space-between; 669 justify-content: space-between;
670 align-items: center; 670 align-items: center;
671 image { 671 image {
672 height: 24rpx; 672 height: 24rpx;
673 width: 12rpx; 673 width: 12rpx;
674 } 674 }
675 .rightText { 675 .rightText {
676 margin-right: 20rpx; 676 margin-right: 20rpx;
677 text-align: right; 677 text-align: right;
678 .choosePayWay { 678 .choosePayWay {
679 display: flex; 679 display: flex;
680 align-items: center; 680 align-items: center;
681 text { 681 text {
682 color: #333333; 682 color: #333333;
683 } 683 }
684 image { 684 image {
685 height: 36rpx; 685 height: 36rpx;
686 width: 40rpx; 686 width: 40rpx;
687 margin-right: 8px; 687 margin-right: 8px;
688 } 688 }
689 } 689 }
690 .randomSubstraction { 690 .randomSubstraction {
691 color: #ff6b4a; 691 color: #ff6b4a;
692 } 692 }
693 .preferentialWay { 693 .preferentialWay {
694 color: #999999; 694 color: #999999;
695 } 695 }
696 } 696 }
697 .freight, 697 .freight,
698 .total { 698 .total {
699 margin-right: 32rpx; 699 margin-right: 32rpx;
700 } 700 }
701 text { 701 text {
702 color: #ff6b4a; 702 color: #ff6b4a;
703 } 703 }
704 } 704 }
705 } 705 }
706 } 706 }
707 // .checkBox { 707 // .checkBox {
708 // height: 58rpx; 708 // height: 58rpx;
709 // line-height: 58rpx; 709 // line-height: 58rpx;
710 // width: 100%; 710 // width: 100%;
711 // margin-top: 36rpx; 711 // margin-top: 36rpx;
712 // margin-left: 40rpx; 712 // margin-left: 40rpx;
713 // font-size: 12px; 713 // font-size: 12px;
714 // color: #999999; 714 // color: #999999;
715 // } 715 // }
716 } 716 }
717 .footer { 717 .footer {
718 height: 112rpx; 718 height: 112rpx;
719 width: 100%; 719 width: 100%;
720 background-color: #fff; 720 background-color: #fff;
721 font-size: 16px; 721 font-size: 16px;
722 display: flex; 722 display: flex;
723 justify-content: space-between; 723 justify-content: space-between;
724 align-items: center; 724 align-items: center;
725 position: fixed; 725 position: fixed;
726 bottom: 0; 726 bottom: 0;
727 z-index: 9999; 727 z-index: 9999;
728 .footerLeft { 728 .footerLeft {
729 display: flex; 729 display: flex;
730 justify-content: center; 730 justify-content: center;
731 align-items: center; 731 align-items: center;
732 width: 50%; 732 width: 50%;
733 color: #333333; 733 color: #333333;
734 text { 734 text {
735 color: #ff6b4a; 735 color: #ff6b4a;
736 } 736 }
737 } 737 }
738 .footerRight { 738 .footerRight {
739 display: flex; 739 display: flex;
740 justify-content: flex-end; 740 justify-content: flex-end;
741 align-items: center; 741 align-items: center;
742 width: 50%; 742 width: 50%;
743 margin-right: 26rpx; 743 margin-right: 26rpx;
744 .paybtn { 744 .paybtn {
745 display: flex; 745 display: flex;
746 justify-content: center; 746 justify-content: center;
747 align-items: center; 747 align-items: center;
748 background: #ff6b4a; 748 background: #ff6b4a;
749 border-radius: 20px; 749 border-radius: 20px;
750 border-radius: 20px; 750 border-radius: 20px;
751 color: #ffffff; 751 color: #ffffff;
752 width: 204rpx; 752 width: 204rpx;
753 height: 80rpx; 753 height: 80rpx;
754 } 754 }
755 } 755 }
756 } 756 }
757 // 地址信息样式 757 // 地址信息样式
758 .order-user { 758 .order-user {
759 width: 670rpx; 759 width: 670rpx;
760 height: 228rpx; 760 height: 228rpx;
761 background: #ffffff; 761 background: #ffffff;
762 border-radius: 14rpx; 762 border-radius: 14rpx;
763 margin: 0 auto; 763 margin: 0 auto;
764 margin-top: 20rpx; 764 margin-top: 20rpx;
765 position: relative; 765 position: relative;
766 .order-user-head { 766 .order-user-head {
767 display: flex; 767 display: flex;
768 height: 108rpx; 768 height: 108rpx;
769 width: 100%; 769 width: 100%;
770 align-items: center; 770 align-items: center;
771 padding-left: 126rpx; 771 padding-left: 126rpx;
772 box-sizing: border-box; 772 box-sizing: border-box;
773 .name { 773 .name {
774 display: flex; 774 display: flex;
775 justify-content: space-between; 775 justify-content: space-between;
776 font-size: 14px; 776 font-size: 14px;
777 color: #333333; 777 color: #333333;
778 letter-spacing: -0.26px; 778 letter-spacing: -0.26px;
779 margin-right: 20rpx; 779 margin-right: 20rpx;
780 .default { 780 .default {
781 height: 40rpx; 781 height: 40rpx;
782 width: 80rpx; 782 width: 80rpx;
783 background-color: #4a90e2; 783 background-color: #4a90e2;
784 border-radius: 13px; 784 border-radius: 13px;
785 border-radius: 13px; 785 border-radius: 13px;
786 text-align: center; 786 text-align: center;
787 margin-right: 20rpx; 787 margin-right: 20rpx;
788 text { 788 text {
789 display: flex; 789 display: flex;
790 justify-content: center; 790 justify-content: center;
791 align-items: center; 791 align-items: center;
792 font-size: 12px; 792 font-size: 12px;
793 color: #ffffff; 793 color: #ffffff;
794 letter-spacing: -0.23px; 794 letter-spacing: -0.23px;
795 } 795 }
796 } 796 }
797 } 797 }
798 .mobile { 798 .mobile {
799 font-size: 14px; 799 font-size: 14px;
800 color: #999999; 800 color: #999999;
801 letter-spacing: -0.26px; 801 letter-spacing: -0.26px;
802 } 802 }
803 } 803 }
804 .order-user-body { 804 .order-user-body {
805 display: flex; 805 display: flex;
806 width: 100%; 806 width: 100%;
807 image { 807 image {
808 width: 24px; 808 width: 24px;
809 height: 28px; 809 height: 28px;
810 margin: 12rpx 32rpx 0 40rpx; 810 margin: 12rpx 32rpx 0 40rpx;
811 } 811 }
812 .address { 812 .address {
813 font-weight: bold; 813 font-weight: bold;
814 font-size: 14px; 814 font-size: 14px;
815 color: #333333; 815 color: #333333;
816 letter-spacing: -0.26px; 816 letter-spacing: -0.26px;
817 } 817 }
818 } 818 }
819 .arrow { 819 .arrow {
820 width: 12px; 820 width: 12px;
821 height: 12px; 821 height: 12px;
822 position: absolute; 822 position: absolute;
823 right: 40rpx; 823 right: 40rpx;
824 bottom: 104rpx; 824 bottom: 104rpx;
825 } 825 }
826 } 826 }
827 .last_zhanwei { 827 .last_zhanwei {
828 background: #f2f2f2; 828 background: #f2f2f2;
829 height: 60px; 829 height: 60px;
830 } 830 }
831 </style> 831 </style>
832 832