Skip to content

dev / zhiliang-light-mp

Go to a project
Toggle navigation
Toggle navigation pinning
fafba665 by simon
Options

版本提交

1 parent fca038b5
Inline Side-by-side
Showing 16 changed files with 598 additions and 53 deletions
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
27 justify-content: space-between; 27 justify-content: space-between;
28 // text-align: center; 28 // text-align: center;
29 box-sizing: border-box; 29 box-sizing: border-box;
30 font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif, FZY3JW-GB1-0; 30 font-family: PingFangSC-Regular, -apple-system-font, Helvetica Neue, Helvetica, sans-serif, FZY3JW-GB1-0;
31 } 31 }
32 32
33 .app__width { 33 .app__width {
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
89 89
90 @font-face { 90 @font-face {
91 font-family: "iconfont"; 91 font-family: "iconfont";
92 src:url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAOsAAsAAAAAB6gAAANdAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqDDIJmATYCJAMMCwgABCAFhG0HORuvBsgOJUHBwIABAAlgPHyN/f7c3UVEk0mi+3QSQxJNJCoexUrxUhhKIyT4UsKbL89+kizTNWb3wyt7UkR96ayA4xev1q04fZzIa32ey/Gt5wc26luWy5iT9qKFAcYBBbQ3RgEFWiAJesPYlRdxn0C9YccRqxl5ZcBCYSwLxJFS3gwsUk6lpj7UCtUle4t4Yqo2XaeXAHj0vx//QUhYkFRlxtq1w/Q2kPRz+iOmhipDoM51Gx7PD3aIjBlAITZLgxuoMDODUq8YTerLqxUhjRU3GgFfqeqrzT88kiCqGbWNYAJlEz+nbQmJP1h91rUZVMPcGeAZM51XhqohJw97O/vO23paqy3T6coNhsqQ1esr3nVWF19mTZ3YnOwtWwPk5bvMfvYCQV11V+xUzZx02tPO6H02TtP0y4dn5a7M9ravfPvs/poNl43TTmVrW87O66dcKzd3myo2Tjo5rW07l6+fcXXd3KmUDdBKXH240GtvAAw49qfa2BeatkTevUsumTJX5pzRRVy781FXe+YP15YALi0+kkDHQRm8OLz2sP/U1NGjIPxKdyVpafxHpKWvbajtddvnaxmZHLP0XGY1d2wvLarJWrd3LMD6Q1DiSPHusrPgvOxtlAKDyt7bk32nH3emP+npcwo2dKU/Vj040Jn2+HTvAU5VFtOf5vZDf683NVrpbEvIO7N3IX421A40MRbmdVIPQGXQhMi7/+o3vjanTBtt4/7Vygr4/p/GIHW7aqBWorXqz7QVQMVYCK4xXLnISlup57Ntpvcth3Ju8j8aod2b/tauu8+FWl0xkhpDyGqNEIWZQZUG86hWawH1pmUebtBBQolShynjAKHVFSTNPpG1ekUU5jWqdPuGaq1Bod56OJ7ZYCyUdKqEmjFqgy3dUNkqCozlwXRQX4Lk7VyzlNT4XAWSNMo4DA4IyuYzkYCkMTZoOuQhGDOQkUQeZoDHEMeJUC2JKtSKAxQYq2MCA5myFwW0ijygrZAgzTCkDdSiG6TUSiRg3MEYnft8CUSuHaeZVNNTka6ASDSUo0PBAgS1IDKNQquea3lGo4NcCAxjQAyJiAdlgFkIhyOC1OWzVJBWWABFj5RajECzH9PWGDC/mX++Q1DPGJsjRY6i5hgx1hSNwhTxatwNAAAAAA==') format('woff2'), 92 src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAOsAAsAAAAAB6gAAANdAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqDDIJmATYCJAMMCwgABCAFhG0HORuvBsgOJUHBwIABAAlgPHyN/f7c3UVEk0mi+3QSQxJNJCoexUrxUhhKIyT4UsKbL89+kizTNWb3wyt7UkR96ayA4xev1q04fZzIa32ey/Gt5wc26luWy5iT9qKFAcYBBbQ3RgEFWiAJesPYlRdxn0C9YccRqxl5ZcBCYSwLxJFS3gwsUk6lpj7UCtUle4t4Yqo2XaeXAHj0vx//QUhYkFRlxtq1w/Q2kPRz+iOmhipDoM51Gx7PD3aIjBlAITZLgxuoMDODUq8YTerLqxUhjRU3GgFfqeqrzT88kiCqGbWNYAJlEz+nbQmJP1h91rUZVMPcGeAZM51XhqohJw97O/vO23paqy3T6coNhsqQ1esr3nVWF19mTZ3YnOwtWwPk5bvMfvYCQV11V+xUzZx02tPO6H02TtP0y4dn5a7M9ravfPvs/poNl43TTmVrW87O66dcKzd3myo2Tjo5rW07l6+fcXXd3KmUDdBKXH240GtvAAw49qfa2BeatkTevUsumTJX5pzRRVy781FXe+YP15YALi0+kkDHQRm8OLz2sP/U1NGjIPxKdyVpafxHpKWvbajtddvnaxmZHLP0XGY1d2wvLarJWrd3LMD6Q1DiSPHusrPgvOxtlAKDyt7bk32nH3emP+npcwo2dKU/Vj040Jn2+HTvAU5VFtOf5vZDf683NVrpbEvIO7N3IX421A40MRbmdVIPQGXQhMi7/+o3vjanTBtt4/7Vygr4/p/GIHW7aqBWorXqz7QVQMVYCK4xXLnISlup57Ntpvcth3Ju8j8aod2b/tauu8+FWl0xkhpDyGqNEIWZQZUG86hWawH1pmUebtBBQolShynjAKHVFSTNPpG1ekUU5jWqdPuGaq1Bod56OJ7ZYCyUdKqEmjFqgy3dUNkqCozlwXRQX4Lk7VyzlNT4XAWSNMo4DA4IyuYzkYCkMTZoOuQhGDOQkUQeZoDHEMeJUC2JKtSKAxQYq2MCA5myFwW0ijygrZAgzTCkDdSiG6TUSiRg3MEYnft8CUSuHaeZVNNTka6ASDSUo0PBAgS1IDKNQquea3lGo4NcCAxjQAyJiAdlgFkIhyOC1OWzVJBWWABFj5RajECzH9PWGDC/mX++Q1DPGJsjRY6i5hgx1hSNwhTxatwNAAAAAA==') format('woff2'),
93 } 93 }
94 94
95 .iconfont { 95 .iconfont {
...@@ -98,7 +98,7 @@ ...@@ -98,7 +98,7 @@
98 font-style: normal; 98 font-style: normal;
99 -webkit-font-smoothing: antialiased; 99 -webkit-font-smoothing: antialiased;
100 -moz-osx-font-smoothing: grayscale; 100 -moz-osx-font-smoothing: grayscale;
101 } 101 }
102 102
103 .iconrefresh:before { 103 .iconrefresh:before {
104 content: "\e874"; 104 content: "\e874";
...@@ -111,3 +111,8 @@ ...@@ -111,3 +111,8 @@
111 .drop-down-item :last-child { 111 .drop-down-item :last-child {
112 border-bottom: none; 112 border-bottom: none;
113 } 113 }
114
115 .link {
116 color: $colorBlue;
117 }
118
......
...@@ -8,6 +8,24 @@ ...@@ -8,6 +8,24 @@
8 * 8 *
9 */ 9 */
10 10
11 // 居中按钮样式
12 @mixin btn-center($width, $height) {
13 width: $width;
14 height: $height;
15 line-height: $height;
16 text-align: center;
17 }
18
19 // 超过多少行自动省略 默认一行
20 @mixin ellipsis($line:1) {
21 display: -webkit-box;
22 word-break: break-all;
23 -webkit-box-orient: vertical;
24 -webkit-line-clamp: $line;
25 overflow: hidden;
26 text-overflow: ellipsis;
27 }
28
11 // 文字截取 29 // 文字截取
12 @mixin text-overflow() { 30 @mixin text-overflow() {
13 overflow: hidden; 31 overflow: hidden;
...@@ -32,11 +50,13 @@ ...@@ -32,11 +50,13 @@
32 50
33 // 清除浮动 51 // 清除浮动
34 @mixin clearfix() { 52 @mixin clearfix() {
53
35 &:before, 54 &:before,
36 &:after { 55 &:after {
37 content: " "; // 1 56 content: " "; // 1
38 display: table; // 2 57 display: table; // 2
39 } 58 }
59
40 &:after { 60 &:after {
41 clear: both; 61 clear: both;
42 } 62 }
......
...@@ -237,3 +237,8 @@ ...@@ -237,3 +237,8 @@
237 width: 100%; 237 width: 100%;
238 height: 100%; 238 height: 100%;
239 } 239 }
240
241 .shadow {
242 box-shadow: 0 6px 18px 0 rgba(0, 0, 0, 0.10);
243 border-radius: 8px;
244 }
......
1 let app = getApp(); 1 let app = getApp();
2 Page({ 2 Page({
3 data: {}, 3 data: {},
4 onLoad(options) {} 4 onLoad(options) {},
5 // 编辑收货地址
6 onAddressEditHandler() {
7 app.router.push({
8 path: "addressEdit"
9 })
10 },
11 // 添加收货地址
12 onAddressAddHandler() {
13 app.router.push({
14 path: "addressEdit"
15 })
16 }
5 }) 17 })
......
1 { 1 {
2 "navigationBarTitleText": "more" 2 "navigationBarTitleText": "我的收货地址"
3 } 3 }
......
1 @import '../../assets/scss/mixins'; 1 @import '../../assets/scss/mixins';
2 @import '../../assets/scss/utils'; 2 @import '../../assets/scss/utils';
3 3
4 $contentWidth:690px;
5
4 .page { 6 .page {
5 .bgc {} 7 .bgc {
8 background: #F8F8F8;
9 }
6 10
7 .bg {} 11 .bg {}
8 12
9 .main { 13 .main {
10 .top-space { 14 .top-space {
11 height: 0px; 15 height: 20px;
16 }
17
18 // 内容容器通用样式
19 .cont-wrap {
20 margin: 20px auto 0;
21 width: $contentWidth;
22 background: #fff;
23 padding: 30px 28px;
24 @extend .bb;
25 @extend .shadow;
12 } 26 }
13 27
14 .content { 28 .content {
15 position: relative; 29 position: relative;
30
31 .manage-wrap {}
32
33 // 表单
34 .form {
35 padding: 30px 30px;
36
37 &-tit {
38 margin-bottom: 28px;
39 display: flex;
40 justify-content: space-between;
41 font-size: 24px;
42
43 .address-message {
44 color: #333333;
45 display: flex;
46 align-content: center;
47 align-items: center;
48 height: 36px;
49
50 .address {
51 font-size: 32px;
52 margin-right: 20px;
53 vertical-align: middle;
54 }
55
56 .used {
57 color: #fff;
58 background: #FF7B21;
59 border-radius: 8px;
60 display: inline-block;
61 padding: 2px 12px;
62 text-align: center;
63 }
64 }
65
66 .address-edit {
67 color: #3680EB;
68 font-size: 28px;
69 }
70 }
71
72 &-item {
73 margin-bottom: 20px;
74 font-size: 28px;
75 display: flex;
76
77 .label {
78 min-width: 140px;
79 color: #666666;
80 }
81
82 .cont {
83 color: #333333;
84 @extend .bb;
85 padding-left: 20px;
86 }
87 }
88
89 }
90
91 // 添加地址
92 .manage-add {
93 width: $contentWidth;
94 margin: 20px auto;
95 @extend .bb;
96 background: #fff;
97 padding: 38px 30px;
98 font-size: 32px;
99 color: #3680EB;
100 @extend .shadow;
101 }
16 } 102 }
17 } 103 }
18 } 104 }
......
...@@ -3,6 +3,54 @@ ...@@ -3,6 +3,54 @@
3 <view class="app__bg bg"></view> 3 <view class="app__bg bg"></view>
4 <view class="app__content main"> 4 <view class="app__content main">
5 <view class="top-space"></view> 5 <view class="top-space"></view>
6 <view class="content"></view> 6 <view class="content">
7 <!-- 地址 item -->
8 <view class="manage-wrap">
9 <view class="cont-wrap form">
10 <view class="form-tit">
11 <view class="address-message">
12 <view class="address">地址一：默认地址</view>
13 <view class="used">当前使用</view>
14 </view>
15 <view bindtap="onAddressEditHandler" class="address-edit">编辑</view>
16 </view>
17 <view class="form-item">
18 <view class="label">收货人</view>
19 <view class="cont">郑亮亮</view>
20 </view>
21 <view class="form-item">
22 <view class="label">收货电话</view>
23 <view class="cont">13800000000</view>
24 </view>
25 <view class="form-item">
26 <view class="label">收货地址</view>
27 <view class="cont">深圳市龙岗区XXX路</view>
28 </view>
29 </view>
30 <view class="cont-wrap form">
31 <view class="form-tit">
32 <view class="address-message">
33 <view class="address">地址一：默认地址</view>
34 <view class="used">当前使用</view>
35 </view>
36 <view bindtap="onAddressEditHandler" class="address-edit">编辑</view>
37 </view>
38 <view class="form-item">
39 <view class="label">收货人</view>
40 <view class="cont">郑亮亮</view>
41 </view>
42 <view class="form-item">
43 <view class="label">收货电话</view>
44 <view class="cont">13800000000</view>
45 </view>
46 <view class="form-item">
47 <view class="label">收货地址</view>
48 <view class="cont">深圳市龙岗区XXX路</view>
49 </view>
50 </view>
51 </view>
52 <!-- 添加地址 -->
53 <view bindtap="onAddressAddHandler" class="manage-add">+添加地址</view>
54 </view>
7 </view> 55 </view>
8 </view> 56 </view>
......
1 let app = getApp(); 1 let app = getApp();
2 Page({ 2 Page({
3 data: {}, 3 data: {},
4 onLoad(options) {} 4 onLoad(options) {},
5 /**
6 * 确认兑换 / 提交订单
7 */
8 onSubmitHandler() {
9
10 },
11 /**
12 * 收获地址管理
13 */
14 onAddressManagementHandler() {
15 app.router.push({
16 path:"addressManagement"
17 })
18 }
5 }) 19 })
......
1 { 1 {
2 "navigationBarTitleText": "more" 2 "navigationBarTitleText": "礼物详情"
3 } 3 }
......
1 @import '../../assets/scss/mixins'; 1 @import '../../assets/scss/mixins';
2 @import '../../assets/scss/utils'; 2 @import '../../assets/scss/utils';
3 3
4 $contentWidth:690px;
5
4 .page { 6 .page {
5 .bgc {} 7 .bgc {
8 background: #F8F8F8;
9 }
6 10
7 .bg {} 11 .bg {}
8 12
9 .main { 13 .main {
10 .top-space { 14 .top-space {
11 height: 0px; 15 height: 20px;
12 } 16 }
13 17
14 .content { 18 .content {
15 position: relative; 19 position: relative;
20
21 // 内容容器通用样式
22 .cont-wrap {
23 margin: 20px auto 0;
24 width: $contentWidth;
25 background: #fff;
26 padding: 30px 28px;
27 @extend .bb;
28 @extend .shadow;
29 }
30
31 // 产品
32 .product {
33 width: $contentWidth;
34 margin: 0 auto;
35
36 &-item {
37 background: #fff;
38 width: $contentWidth;
39 height: 260px;
40 margin: 20px 0;
41 @extend .shadow;
42 @extend .bb;
43 padding: 30px;
44 display: flex;
45 justify-content: space-between;
46
47 .image-wrap {
48 width: 200px;
49 height: 200px;
50
51 .img {}
52 }
53
54 .cont {
55 position: relative;
56 flex: 1;
57 @extend .bb;
58 padding-left: 20px;
59 display: flex;
60 flex-wrap: wrap;
61 align-content: center;
62
63 .name {
64 font-size: 36px;
65 color: #333333;
66 @include ellipsis(2);
67 }
68
69 .integral {
70 margin-top: 16px;
71 font-size: 28px;
72 color: #FF7900;
73 }
74 }
75
76
77 }
78 }
79
80 // 京东卡使用规则
81 .use-rule {
82
83 color: #666666;
84 font-size: 28px;
85 line-height: 48px;
86 }
87
88 // 表单
89 .form {
90 padding: 30px 30px 40px;
91
92 &-tit {
93 margin-bottom: 22px;
94 display: flex;
95 justify-content: space-between;
96 font-size: 24px;
97
98 .address-message {
99 color: #333333;
100 }
101
102 .address-edit {
103 color: #3680EB;
104 }
105 }
106
107 &-item {
108 margin-bottom: 30px;
109 font-size: 28px;
110 display: flex;
111
112 .label {
113 min-width: 140px;
114 color: #666666;
115 }
116
117 .cont {
118 color: #333333;
119 @extend .bb;
120 padding-left: 20px;
121 }
122 }
123
124 &-remark {
125 background: #F8F8F8;
126 border: 0 solid #CCCCCC;
127 border-radius: 4px;
128 min-height: 200px;
129 @extend .bb;
130 padding: 20px;
131 color: #333333;
132 font-size: 28px;
133 }
134 }
135 }
136
137 // 底部
138 .bottom {
139 position: fixed;
140 bottom: 0;
141
142 // 提交栏
143 .submit-bar {
144 width: 750px;
145 height: 100px;
146 display: flex;
147 justify-content: space-between;
148 background-color: #fff;
149
150 &-cont {
151 flex: 1;
152 height: 100px;
153 line-height: 100px;
154 font-size: 32px;
155 @extend .bb;
156 padding: 0 30px;
157
158 .integral {
159 color: $colorBlue;
160 }
161 }
162
163 &-btn {
164 background: #3680EB;
165 color: #fff;
166 font-size: 32px;
167 @include btn-center(240px, 100px);
168 }
169 }
16 } 170 }
17 } 171 }
18 } 172 }
......
...@@ -3,6 +3,58 @@ ...@@ -3,6 +3,58 @@
3 <view class="app__bg bg"></view> 3 <view class="app__bg bg"></view>
4 <view class="app__content main"> 4 <view class="app__content main">
5 <view class="top-space"></view> 5 <view class="top-space"></view>
6 <view class="content"></view> 6 <view class="content">
7 <view class="product">
8 <view class="product-item">
9 <view class="image-wrap">
10 <!-- <image /> -->
11 </view>
12 <view class="cont">
13 <view class="name">某东购物卡200元某东购物卡200元</view>
14 <view class="integral">消耗积分：3000分</view>
15 </view>
16 </view>
17 </view>
18 <block wx:if="{{1<0}}">
19 <!-- 使用规则 (京东卡) -->
20 <view class="cont-wrap use-rule">
21 京东E卡可在京东商城
22 <span class="link">www.jd.com</span>
23 上购买自营商品（“自营商品”指在商品详情页明确标识为自营的商品），用户可在订单结算时输入E卡密码并使用。
24 </view>
25 </block>
26 <block wx:else>
27 <!-- 表单提交 (实物) -->
28 <view class="cont-wrap form">
29 <view class="form-tit">
30 <view class="address-message">收货信息</view>
31 <view bindtap="onAddressManagementHandler" class="address-edit">更改地址</view>
32 </view>
33 <view class="form-item">
34 <view class="label">收货人</view>
35 <view class="cont">郑亮亮</view>
36 </view>
37 <view class="form-item">
38 <view class="label">收货电话</view>
39 <view class="cont">13800000000</view>
40 </view>
41 <view class="form-item">
42 <view class="label">收货地址</view>
43 <view class="cont">深圳市龙岗区XXX路</view>
44 </view>
45 <textarea placeholder="备注您的其他要求" class="form-remark"></textarea>
46 </view>
47 </block>
48 </view>
49 <view class="bottom">
50 <view class="submit-bar">
51 <view class="submit-bar-cont">
52 现有积分
53 <span class="integral">350</span>
54 分
55 </view>
56 <view bindtap="onSubmitHandler" class="submit-bar-btn">确认兑换</view>
57 </view>
58 </view>
7 </view> 59 </view>
8 </view> 60 </view>
......
1 let app = getApp(); 1 let app = getApp();
2 Page({ 2 Page({
3 data: {}, 3 data: {
4 onLoad(options) {} 4 productList: ["", "", ""]
5 },
6 onLoad(options) {},
7 /**
8 * 显示礼物详情
9 */
10 onShowGiftDetailHandler() {
11 app.router.push({
12 path: "giftDetail"
13 });
14 }
5 }) 15 })
......
...@@ -82,10 +82,9 @@ $contentWidth:690px; ...@@ -82,10 +82,9 @@ $contentWidth:690px;
82 &-item { 82 &-item {
83 background: #fff; 83 background: #fff;
84 width: $contentWidth; 84 width: $contentWidth;
85 height: 260px; 85 // height: 260px;
86 margin: 20px 0; 86 margin: 20px 0;
87 box-shadow: 0 6px 18px 0 rgba(0, 0, 0, 0.10); 87 @extend .shadow;
88 border-radius: 8px;
89 @extend .bb; 88 @extend .bb;
90 padding: 30px; 89 padding: 30px;
91 display: flex; 90 display: flex;
...@@ -100,16 +99,20 @@ $contentWidth:690px; ...@@ -100,16 +99,20 @@ $contentWidth:690px;
100 .cont { 99 .cont {
101 position: relative; 100 position: relative;
102 flex: 1; 101 flex: 1;
102 @extend .bb;
103 padding-left: 20px;
103 104
104 .name { 105 .name {
105 font-size: 32px; 106 font-size: 32px;
106 color: #333333; 107 color: #333333;
108 @include ellipsis;
107 } 109 }
108 110
109 .desc { 111 .desc {
110 font-size: 24px; 112 font-size: 24px;
111 color: #999999; 113 color: #999999;
112 margin-top: 12px; 114 margin-top: 12px;
115 @include ellipsis(2);
113 } 116 }
114 117
115 .integral { 118 .integral {
...@@ -125,9 +128,9 @@ $contentWidth:690px; ...@@ -125,9 +128,9 @@ $contentWidth:690px;
125 bottom: 0; 128 bottom: 0;
126 right: 0; 129 right: 0;
127 130
128 width: 140px; 131 width: 142px;
129 height: 64px; 132 height: 60px;
130 line-height: 64px; 133 line-height: 60px;
131 text-align: center; 134 text-align: center;
132 color: #fff; 135 color: #fff;
133 border-radius: 8px; 136 border-radius: 8px;
......
...@@ -24,37 +24,15 @@ ...@@ -24,37 +24,15 @@
24 <view class="top-space"></view> 24 <view class="top-space"></view>
25 <view class="content"> 25 <view class="content">
26 <view class="product"> 26 <view class="product">
27 <view class="product-item"> 27 <view class="product-item" wx:for="{{productList}}" wx:key="{{index}}">
28 <view class="image-wrap"> 28 <view class="image-wrap">
29 <!-- <image /> --> 29 <!-- <image /> -->
30 </view> 30 </view>
31 <view class="cont"> 31 <view class="cont">
32 <view class="name">某东购物卡200元</view> 32 <view class="name">某东购物卡200元</view>
33 <view class="desc">可在xx超市使用，可够买xxx</view> 33 <view class="desc">可在xx超市使用，可够买xxx可在xx超市使用，可够买xxx可在xx超市使用，可够买xxx</view>
34 <view class="integral">消耗积分：3000分</view> 34 <view class="integral">消耗积分：3000分</view>
35 <view class="btn">查看</view> 35 <view bindtap="onShowGiftDetailHandler" data-data="{{item}}" class="btn">查看</view>
36 </view>
37 </view>
38 <view class="product-item">
39 <view class="image-wrap">
40 <!-- <image /> -->
41 </view>
42 <view class="cont">
43 <view class="name">某东购物卡200元</view>
44 <view class="desc">可在xx超市使用，可够买xxx</view>
45 <view class="integral">消耗积分：3000分</view>
46 <view class="btn">查看</view>
47 </view>
48 </view>
49 <view class="product-item">
50 <view class="image-wrap">
51 <!-- <image /> -->
52 </view>
53 <view class="cont">
54 <view class="name">某东购物卡200元</view>
55 <view class="desc">可在xx超市使用，可够买xxx</view>
56 <view class="integral">消耗积分：3000分</view>
57 <view class="btn">查看</view>
58 </view> 36 </view>
59 </view> 37 </view>
60 </view> 38 </view>
......
...@@ -28,8 +28,7 @@ $contentWidth:670px; ...@@ -28,8 +28,7 @@ $contentWidth:670px;
28 width: $contentWidth; 28 width: $contentWidth;
29 height: 100px; 29 height: 100px;
30 background: #FFFFFF; 30 background: #FFFFFF;
31 box-shadow: 0 6px 18px 0 rgba(0, 0, 0, 0.10); 31 @extend .shadow;
32 border-radius: 8px;
33 margin: 222px auto 0; 32 margin: 222px auto 0;
34 display: flex; 33 display: flex;
35 justify-content: space-between; 34 justify-content: space-between;
......
...@@ -8,6 +8,31 @@ function checkMobile(str) { ...@@ -8,6 +8,31 @@ function checkMobile(str) {
8 } 8 }
9 9
10 10
11 /**
12 * 链接参数转换为obj
13 * 入参 完整链接
14 * @param {*} url
15 */
16 function param2Obj(url) {
17 const search = url.split('?')[1]
18 if (!search) {
19 return {}
20 }
21 return JSON.parse(
22 '{"' +
23 decodeURIComponent(search)
24 .replace(/"/g, '\\"')
25 .replace(/&/g, '","')
26 .replace(/=/g, '":"') +
27 '"}'
28 )
29 }
30
31 /**
32 * 格式化日期常规日期
33 * 格式yyyy-MM-dd hh:mm:ss
34 * @param {*} date
35 */
11 function formatTime(date) { 36 function formatTime(date) {
12 var year = date.getFullYear() 37 var year = date.getFullYear()
13 var month = date.getMonth() + 1 38 var month = date.getMonth() + 1
...@@ -17,18 +42,18 @@ function formatTime(date) { ...@@ -17,18 +42,18 @@ function formatTime(date) {
17 var minute = date.getMinutes() 42 var minute = date.getMinutes()
18 var second = date.getSeconds() 43 var second = date.getSeconds()
19 44
20
21 return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') 45 return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
22 } 46 }
23 47
48 /**
49 * 格式化数字，不足一位补充0
50 * @param {*} n
51 */
24 function formatNumber(n) { 52 function formatNumber(n) {
25 n = n.toString() 53 n = n.toString()
26 return n[1] ? n : '0' + n 54 return n[1] ? n : '0' + n
27 } 55 }
28 56
29
30
31
32 /** 57 /**
33 * 获取屏幕剩余高度 58 * 获取屏幕剩余高度
34 * useHeight 单位是rpx 59 * useHeight 单位是rpx
...@@ -52,8 +77,142 @@ function getLastScreenHeight(useHeight = 0, unit = 'rpx') { ...@@ -52,8 +77,142 @@ function getLastScreenHeight(useHeight = 0, unit = 'rpx') {
52 return lastHeight; 77 return lastHeight;
53 } 78 }
54 79
80
81 /**
82 * px转rpx
83 * @param {*} value
84 */
85 function pxToRpx(value) {
86 let sysInfo = wx.getSystemInfoSync();
87 let clientWidth = sysInfo.windowWidth;
88 let result = value / 750 * clientWidth
89 return result;
90 }
91
92
93 // 格式化星期几
94 function formatWeek(week) {
95 let result = "";
96 switch (week) {
97 case 1:
98 result = "一";
99 break;
100 case 2:
101 result = "二";
102 break;
103 case 3:
104 result = "三";
105 break;
106 case 4:
107 result = "四";
108 break;
109 case 5:
110 result = "五";
111 break;
112 case 6:
113 result = "六";
114 break;
115 case 0:
116 result = "日";
117 break;
118
119 default:
120 break;
121 }
122 return result;
123 }
124
125 /**
126 * 获取点击传值
127 * @param {*} evt
128 * @param {*} key
129 */
130 function getBindtapData(evt, key = "data") {
131 let keyStr = key || "data";
132 return evt.currentTarget.dataset[keyStr];
133 }
134
135 /**
136 * 获取小程序码
137 * path = "/pages/index/index?pa=1"
138 * @param {*} path
139 */
140 function wxacodeGet(path) {
141 return " https://api.k.wxpai.cn/bizproxy/mzcfsapi/qrcode/create?path=" + encodeURIComponent(path);
142 }
143
144
145 /**
146 * @desc 函数防抖
147 * @param func 函数
148 * @param wait 延迟执行毫秒数
149 * @param immediate true 表立即执行，false 表非立即执行
150 */
151 function debounce(func, wait, immediate) {
152 let timeout;
153
154 return function () {
155 let context = this;
156 let args = arguments;
157
158 if (timeout) clearTimeout(timeout);
159 if (immediate) {
160 var callNow = !timeout;
161 timeout = setTimeout(() => {
162 timeout = null;
163 }, wait)
164 if (callNow) func.apply(context, args)
165 } else {
166 timeout = setTimeout(function () {
167 func.apply(context, args)
168 }, wait);
169 }
170 }
171 }
172
173 /**
174 * @desc 函数节流
175 * @param func 函数
176 * @param wait 延迟执行毫秒数
177 * @param type 1 表时间戳版，2 表定时器版
178 * 时间戳版的函数触发是在时间段内开始的时候，而定时器版的函数触发是在时间段内结束的时候。
179 */
180 function throttle(func, wait, type) {
181 if (type === 1) {
182 var previous = 0;
183 } else if (type === 2) {
184 var timeout;
185 }
186 return function () {
187 let context = this;
188 let args = arguments;
189 if (type === 1) {
190 let now = Date.now();
191
192 if (now - previous > wait) {
193 func.apply(context, args);
194 previous = now;
195 }
196 } else if (type === 2) {
197 if (!timeout) {
198 timeout = setTimeout(() => {
199 timeout = null;
200 func.apply(context, args)
201 }, wait)
202 }
203 }
204 }
205 }
206
55 module.exports = { 207 module.exports = {
56 formatTime: formatTime, 208 formatTime: formatTime,
57 checkMobile: checkMobile, 209 checkMobile: checkMobile,
58 getLastScreenHeight: getLastScreenHeight 210 getLastScreenHeight: getLastScreenHeight,
211 debounce: debounce,
212 throttle: throttle,
213 param2Obj: param2Obj,
214 pxToRpx: pxToRpx,
215 formatWeek: formatWeek,
216 getBindtapData: getBindtapData,
217 wxacodeGet: wxacodeGet,
59 } 218 }
......