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