Commit a10da174bc9065b03a8c83d2f1d1f4717610cf6f
1 parent
2d595433
添加客户
Showing
4 changed files
with
580 additions
and
0 deletions
packageA/pages/addCustomer/addCustomer.js
0 → 100644
1 | +// packageA//pages/quan/quan.js | |
2 | +Page({ | |
3 | + | |
4 | + /** | |
5 | + * 页面的初始数据 | |
6 | + */ | |
7 | + data: { | |
8 | + | |
9 | + }, | |
10 | + | |
11 | + /** | |
12 | + * 生命周期函数--监听页面加载 | |
13 | + */ | |
14 | + onLoad: function (options) { | |
15 | + | |
16 | + }, | |
17 | + | |
18 | + /** | |
19 | + * 生命周期函数--监听页面初次渲染完成 | |
20 | + */ | |
21 | + onReady: function () { | |
22 | + | |
23 | + }, | |
24 | + | |
25 | + /** | |
26 | + * 生命周期函数--监听页面显示 | |
27 | + */ | |
28 | + onShow: function () { | |
29 | + | |
30 | + }, | |
31 | + | |
32 | + /** | |
33 | + * 生命周期函数--监听页面隐藏 | |
34 | + */ | |
35 | + onHide: function () { | |
36 | + | |
37 | + }, | |
38 | + | |
39 | + /** | |
40 | + * 生命周期函数--监听页面卸载 | |
41 | + */ | |
42 | + onUnload: function () { | |
43 | + | |
44 | + }, | |
45 | + | |
46 | + /** | |
47 | + * 页面相关事件处理函数--监听用户下拉动作 | |
48 | + */ | |
49 | + onPullDownRefresh: function () { | |
50 | + | |
51 | + }, | |
52 | + | |
53 | + /** | |
54 | + * 页面上拉触底事件的处理函数 | |
55 | + */ | |
56 | + onReachBottom: function () { | |
57 | + | |
58 | + }, | |
59 | + | |
60 | + /** | |
61 | + * 用户点击右上角分享 | |
62 | + */ | |
63 | + onShareAppMessage: function () { | |
64 | + | |
65 | + } | |
66 | +}) | |
0 | 67 | \ No newline at end of file | ... | ... |
packageA/pages/addCustomer/addCustomer.json
0 → 100644
packageA/pages/addCustomer/addCustomer.wxml
0 → 100644
1 | +<view class="container"> | |
2 | + <view class="panel t-c"> | |
3 | + <view class="avatar"></view> | |
4 | + <view class="nickname">微信昵称</view> | |
5 | + <view class="gray">hello,我是您的专属顾问</view> | |
6 | + <view class="gray">扫描下方二维码,加我微信吧~</view> | |
7 | + <view class="qrcode"></view> | |
8 | + </view> | |
9 | + <view class="flex bottom t-c gray pdv10"> | |
10 | + <view class="w50"> | |
11 | + <image src="../../images/wx.png" class="wx"></image> | |
12 | + <view class="fs26">发给客户</view> | |
13 | + </view> | |
14 | + <view class="w50 save"> | |
15 | + <text class="iconfont icon-save"></text> | |
16 | + <view class="fs26 mgt12">保存图片</view> | |
17 | + </view> | |
18 | + </view> | |
19 | +</view> | |
0 | 20 | \ No newline at end of file | ... | ... |
packageA/pages/addCustomer/addCustomer.wxss
0 → 100644
1 | + | |
2 | +.red { | |
3 | + color: #FE6867; | |
4 | +} | |
5 | +.gray { | |
6 | + color: #7b7b7b; | |
7 | +} | |
8 | +.w25 { | |
9 | + width: 25%; | |
10 | +} | |
11 | +.w50 { | |
12 | + width: 50%; | |
13 | +} | |
14 | +.w164 { | |
15 | + width: 164rpx; | |
16 | +} | |
17 | +.bold { | |
18 | + font-weight: bold; | |
19 | +} | |
20 | +.mgt12 { | |
21 | + margin-top: 12rpx; | |
22 | +} | |
23 | +view, text { | |
24 | + line-height: normal; | |
25 | +} | |
26 | +page, | |
27 | +.container { | |
28 | + /* background-color: #f2f2f2; */ | |
29 | + height: 100%; | |
30 | + /* background-color: pink; */ | |
31 | +} | |
32 | +.container { | |
33 | + /* background-color: white; */ | |
34 | + /* position: fixed; | |
35 | + width: 100%; | |
36 | + bottom: 0; */ | |
37 | + box-sizing: border-box; | |
38 | + padding: 160rpx 40rpx 0; | |
39 | + background-image: linear-gradient(to top, #4481eb 0%, #04befe 100%); | |
40 | + /* padding-bottom: 128rpx; */ | |
41 | +} | |
42 | +.search-container { | |
43 | + display: flex; | |
44 | + padding: 26rpx 20rpx; | |
45 | + border-bottom: 2rpx solid #f8f8f8; | |
46 | +} | |
47 | +.input-container { | |
48 | + flex: 1; | |
49 | + border-radius: 6rpx 0 0 6rpx; | |
50 | + overflow: hidden; | |
51 | +} | |
52 | +.search { | |
53 | + background-color: #f0f0f0; | |
54 | + padding: 10rpx 20rpx; | |
55 | + font-size: 28rpx; | |
56 | +} | |
57 | +.btn-search { | |
58 | + background-color: #FE6867; | |
59 | + color: white; | |
60 | + padding: 0 30rpx; | |
61 | + display: flex; | |
62 | + align-items: center; | |
63 | + border-radius: 0 6rpx 6rpx 0; | |
64 | +} | |
65 | +.title { | |
66 | + display: flex; | |
67 | + font-size: 30rpx; | |
68 | + border-bottom: 2rpx solid #f8f8f8; | |
69 | +} | |
70 | +.title .iconfont { | |
71 | + color: #ccc; | |
72 | + font-size: 16rpx; | |
73 | + margin-left: 8rpx; | |
74 | +} | |
75 | +.title-item { | |
76 | + width: 25%; | |
77 | + box-sizing: border-box; | |
78 | + text-align: center; | |
79 | + padding: 20rpx; | |
80 | + position: relative; | |
81 | +} | |
82 | +.title-item.active { | |
83 | + color: #FE6867; | |
84 | + font-weight: bold; | |
85 | +} | |
86 | +.title-item.active:after { | |
87 | + content:''; | |
88 | + position: absolute; | |
89 | + width: 50%; | |
90 | + height: 4rpx; | |
91 | + background-color: #FE6867; | |
92 | + left: 0; | |
93 | + right: 0; | |
94 | + bottom: 0; | |
95 | + margin: 0 auto; | |
96 | +} | |
97 | +.list-container { | |
98 | + height: calc(100% - 118rpx); | |
99 | +} | |
100 | +.list { | |
101 | + box-sizing: border-box; | |
102 | + height: calc(100% - 82rpx); | |
103 | + background-color: #f2f2f2; | |
104 | + /* padding-bottom: 102rpx; */ | |
105 | +} | |
106 | +.list.active1 { | |
107 | + height: calc(100% - 82rpx - 78rpx); | |
108 | + padding-bottom: 0; | |
109 | +} | |
110 | +.list.active2 { | |
111 | + padding-bottom: 0; | |
112 | +} | |
113 | +.list-item { | |
114 | + display: flex; | |
115 | + padding: 20rpx; | |
116 | + border-bottom: 2rpx solid #f8f8f8; | |
117 | + background-color: white; | |
118 | +} | |
119 | +.img-container { | |
120 | + background-color: #f0f0f0; | |
121 | + width: 280rpx; | |
122 | + height: 248rpx; | |
123 | + display: flex; | |
124 | + align-items: center; | |
125 | + justify-content: center; | |
126 | + position: relative; | |
127 | +} | |
128 | +.img-container:after { | |
129 | + font-family: iconfont; | |
130 | + content: '\e8c1'; | |
131 | + color: #bbb; | |
132 | + font-size: 80rpx; | |
133 | +} | |
134 | + | |
135 | + | |
136 | +.img-container.live:before { | |
137 | + content: '\e664'; | |
138 | +} | |
139 | +.img-container.coming:before { | |
140 | + content: '\e608'; | |
141 | +} | |
142 | +.img-container.playback:before { | |
143 | + content: '\e603'; | |
144 | +} | |
145 | +.img-container.live:before, | |
146 | +.img-container.coming:before, | |
147 | +.img-container.playback:before { | |
148 | + font-family: iconfont; | |
149 | + background-color: #FE6867; | |
150 | + color: white; | |
151 | + width: 50rpx; | |
152 | + height: 50rpx; | |
153 | + line-height: 50rpx; | |
154 | + text-align: center; | |
155 | + border-radius: 50%; | |
156 | + position: absolute; | |
157 | + left: 10rpx; | |
158 | + top: 10rpx; | |
159 | +} | |
160 | +.details { | |
161 | + flex: 1; | |
162 | + padding-left: 20rpx; | |
163 | +} | |
164 | +.btn-share { | |
165 | + box-sizing: border-box; | |
166 | + display: inline-block; | |
167 | + background-color: #FE6867; | |
168 | + color: white; | |
169 | + padding: 8rpx 30rpx; | |
170 | + border-radius: 6rpx; | |
171 | + text-align: center; | |
172 | +} | |
173 | +.pdt10 { | |
174 | + padding-top: 10rpx; | |
175 | +} | |
176 | +.pdt14 { | |
177 | + padding-top: 14rpx; | |
178 | +} | |
179 | +.pdtb6 { | |
180 | + padding-top: 6rpx; | |
181 | + padding-bottom: 6rpx; | |
182 | +} | |
183 | +.pdtb8 { | |
184 | + padding-top: 8rpx; | |
185 | + padding-bottom: 8rpx; | |
186 | +} | |
187 | +.pdl20 { | |
188 | + padding-left: 104rpx; | |
189 | +} | |
190 | + | |
191 | + | |
192 | +.no-more { | |
193 | + line-height: 3; | |
194 | + color: #ccc; | |
195 | + /* background-color: #f2f2f2; */ | |
196 | +} | |
197 | +.nodata { | |
198 | + text-align: center; | |
199 | + background-color: #f2f2f2; | |
200 | +} | |
201 | +.progress-container { | |
202 | + width: 55%; | |
203 | + padding-right: 10rpx; | |
204 | + position: relative; | |
205 | + text-align: center; | |
206 | +} | |
207 | +.retail { | |
208 | + color: #7b7b7b; | |
209 | + text-decoration: line-through; | |
210 | + font-size: 22rpx; | |
211 | + padding-left: 20rpx; | |
212 | +} | |
213 | +.name { | |
214 | + height: 76rpx; | |
215 | + overflow: hidden; | |
216 | +} | |
217 | + | |
218 | +.percent { | |
219 | + position: absolute; | |
220 | + top: 0; | |
221 | + bottom: 0; | |
222 | + left: 0; | |
223 | + right: 0; | |
224 | + margin: auto; | |
225 | + color: white; | |
226 | +} | |
227 | +.tabbar { | |
228 | + position: fixed; | |
229 | + width: 100%; | |
230 | + bottom: 0; | |
231 | + background-color: white; | |
232 | +} | |
233 | +.tabbar:after { | |
234 | + position: absolute; | |
235 | + content: ''; | |
236 | + width: 2rpx; | |
237 | + height: 50%; | |
238 | + top: 0; | |
239 | + bottom: 0; | |
240 | + left: 0; | |
241 | + right: 0; | |
242 | + margin: auto; | |
243 | + background-color: #f0f0f0; | |
244 | +} | |
245 | +.tabbar-item { | |
246 | + width: 50%; | |
247 | + text-align: center; | |
248 | + padding-top: 30rpx; | |
249 | + padding-bottom: 30rpx; | |
250 | +} | |
251 | +.tabbar-item .iconfont { | |
252 | + margin-right: 10rpx; | |
253 | +} | |
254 | +.tabbar-item.active { | |
255 | + color: #FE6867; | |
256 | +} | |
257 | + | |
258 | + | |
259 | +.group-type, | |
260 | +.group-num { | |
261 | + position: relative; | |
262 | + font-size: 22rpx; | |
263 | +} | |
264 | +.group-type:before, | |
265 | +.group-num:before { | |
266 | + font-family: iconfont; | |
267 | +} | |
268 | +.group-type:before { | |
269 | + content: '\e66a'; | |
270 | + color: white; | |
271 | + background-color: #FE6867; | |
272 | + position: absolute; | |
273 | + left: 0; | |
274 | + top: 0; | |
275 | + bottom: 0; | |
276 | + padding-left: 6rpx; | |
277 | + padding-right: 10rpx; | |
278 | + line-height: 30rpx; | |
279 | +} | |
280 | +.group-num:before { | |
281 | + padding-right: 6rpx; | |
282 | +} | |
283 | +.group-num:before { | |
284 | + content: '\e694'; | |
285 | + position: relative; | |
286 | +} | |
287 | +.group-num { | |
288 | + color: white; | |
289 | + background-color: #FE6867; | |
290 | + border-radius: 34rpx; | |
291 | + padding-left: 10rpx; | |
292 | + padding-right: 10rpx; | |
293 | + margin-right: 14rpx; | |
294 | +} | |
295 | +.group-type { | |
296 | + color: #FE6867; | |
297 | + border: 2rpx solid #FE6867; | |
298 | + padding-left: 42rpx; | |
299 | + padding-right: 4rpx; | |
300 | + border-radius: 6rpx; | |
301 | +} | |
302 | + | |
303 | +.badge { | |
304 | + color: white; | |
305 | + padding: 0 20rpx; | |
306 | + border-radius: 6rpx; | |
307 | + background-color: #FE6867; | |
308 | + margin-right: 10rpx; | |
309 | +} | |
310 | + | |
311 | +.subTab-title { | |
312 | + text-align: center; | |
313 | + justify-content: center; | |
314 | + align-items: center; | |
315 | + font-size: 28rpx; | |
316 | +} | |
317 | +.subTab-list { | |
318 | + padding: 20rpx; | |
319 | +} | |
320 | +.subTab-titleItem { | |
321 | + box-sizing: border-box; | |
322 | + width: calc(100% / 3); | |
323 | + padding: 20rpx 40rpx; | |
324 | + background-color: white; | |
325 | + border-right: 2rpx solid #f8f8f8; | |
326 | +} | |
327 | +.subTab-titleItem:last-child { | |
328 | + border-right: none; | |
329 | +} | |
330 | +.subTab-titleItem.active { | |
331 | + background-color: #FE6867; | |
332 | + color: white; | |
333 | +} | |
334 | +.subTab-item { | |
335 | + padding: 20rpx; | |
336 | + border-bottom: 2rpx solid #f8f8f8; | |
337 | + background-color: white; | |
338 | + border-radius: 8rpx; | |
339 | + box-shadow: 0 8px 12px #e7e9eb; | |
340 | +} | |
341 | +.subTab-item ~ .subTab-item { | |
342 | + margin-top: 20rpx; | |
343 | +} | |
344 | +.pdv10 { | |
345 | + padding-top: 10rpx; | |
346 | + padding-bottom: 10rpx; | |
347 | +} | |
348 | +.pdv20 { | |
349 | + padding-top: 20rpx; | |
350 | + padding-bottom: 20rpx; | |
351 | +} | |
352 | +.pdb10 { | |
353 | + padding-bottom: 10rpx; | |
354 | +} | |
355 | +.pdb20 { | |
356 | + padding-bottom: 20rpx; | |
357 | +} | |
358 | +.bdr-b { | |
359 | + border-bottom: 2rpx solid #f8f8f8; | |
360 | +} | |
361 | +.dash-b { | |
362 | + border-bottom: 2rpx dashed #ddd; | |
363 | +} | |
364 | +.btn-container { | |
365 | + display: flex; | |
366 | + align-items: flex-end; | |
367 | + font-size: 26rpx; | |
368 | +} | |
369 | + | |
370 | + | |
371 | +/* .popup-container { | |
372 | + content:''; | |
373 | + position: fixed; | |
374 | + top: 0; | |
375 | + bottom: 0; | |
376 | + left: 0; | |
377 | + right: 0; | |
378 | + z-index: 3; | |
379 | + background-color: rgba(0,0,0,.6); | |
380 | + display: flex; | |
381 | + align-items: center; | |
382 | + justify-content: center; | |
383 | +} | |
384 | +.popup { | |
385 | + width: 90%; | |
386 | +} | |
387 | +.popup-content { | |
388 | + box-sizing: border-box; | |
389 | + width: 100%; | |
390 | + background-color: white; | |
391 | + padding: 0 20rpx; | |
392 | + border-radius: 10rpx; | |
393 | + max-height: 1038rpx; | |
394 | +} | |
395 | +.icon-close { | |
396 | + font-size: 60rpx; | |
397 | + color: white; | |
398 | +} | |
399 | +.popup-btn { | |
400 | + padding-top: 30rpx; | |
401 | +} | |
402 | + | |
403 | +.popup-title { | |
404 | + /* font-size: 28rpx; */ | |
405 | + /* font-weight: bold; | |
406 | + padding: 20rpx 0; | |
407 | +} | |
408 | +.popup-title2 { */ | |
409 | + /* padding: 10rpx 0; */ | |
410 | + /* padding-bottom: 8rpx; | |
411 | +} | |
412 | +.popup-title3 { | |
413 | + padding-left: 34rpx; | |
414 | + font-size: 30rpx; | |
415 | +} | |
416 | +.popup-list { | |
417 | + max-height: 602rpx; | |
418 | + overflow-y: auto; | |
419 | +} | |
420 | + | |
421 | + | |
422 | +radio .wx-radio-input { | |
423 | + width: 28rpx; | |
424 | + height: 28rpx; | |
425 | +} | |
426 | + | |
427 | + | |
428 | +radio .wx-radio-input.wx-radio-input-checked { | |
429 | + background-color: #FE6867; | |
430 | + border-color: #FE6867; | |
431 | +} | |
432 | +radio .wx-radio-input.wx-radio-input-checked::before{ | |
433 | + color: white; | |
434 | +} | |
435 | + | |
436 | +.popup-content.active { | |
437 | + max-height: 982rpx; | |
438 | + overflow: auto; | |
439 | +} */ | |
440 | + | |
441 | +.panel { | |
442 | + box-sizing: border-box; | |
443 | + background-color: white; | |
444 | + height: 100%; | |
445 | + border-radius: 16rpx; | |
446 | + position: relative; | |
447 | + padding-top: 140rpx; | |
448 | + box-shadow: 0 8px 12px #ccc; | |
449 | +} | |
450 | +.avatar { | |
451 | + width: 220rpx; | |
452 | + height: 220rpx; | |
453 | + border-radius: 50%; | |
454 | + background-color: skyblue; | |
455 | + position: absolute; | |
456 | + top: -100rpx; | |
457 | + left: 0; | |
458 | + right: 0; | |
459 | + margin: 0 auto; | |
460 | +} | |
461 | +.nickname { | |
462 | + padding-bottom: 60rpx; | |
463 | +} | |
464 | +.bottom { | |
465 | + background-color: white; | |
466 | + border-top: 2rpx solid #f0f0f0; | |
467 | + /* box-shadow: 0 -6px 8px #e7e9eb; */ | |
468 | + width: 100%; | |
469 | + position: fixed; | |
470 | + left: 0; | |
471 | + bottom: 0; | |
472 | +} | |
473 | +.wx { | |
474 | + width: 60rpx; | |
475 | + height: 60rpx; | |
476 | +} | |
477 | +.save { | |
478 | + box-sizing: border-box; | |
479 | + padding-top: 6rpx; | |
480 | +} | |
481 | +.icon-save { | |
482 | + font-size: 50rpx; | |
483 | +} | |
484 | +.qrcode { | |
485 | + width: 480rpx; | |
486 | + height: 480rpx; | |
487 | + background-color: red; | |
488 | + margin: 60rpx auto 0; | |
489 | +} | |
490 | + | |
491 | + | ... | ... |