Commit 8ef48222980d2db49e806982ced559ba927c8718
1 parent
de0dd94b
product manage
Showing
7 changed files
with
164 additions
and
6 deletions
css/style/common-2.0.css
css/style/m2.0/list-view.less
... | ... | @@ -69,7 +69,7 @@ |
69 | 69 | } |
70 | 70 | } |
71 | 71 | } |
72 | - | |
72 | + | |
73 | 73 | .cell-block{ |
74 | 74 | padding: 8px 10px; |
75 | 75 | h3{ |
... | ... | @@ -102,7 +102,7 @@ |
102 | 102 | } |
103 | 103 | } |
104 | 104 | } |
105 | - | |
105 | + | |
106 | 106 | .cell-pic{ |
107 | 107 | padding: 15px; |
108 | 108 | .pic{ |
... | ... | @@ -167,4 +167,4 @@ |
167 | 167 | font-size: 15px; |
168 | 168 | } |
169 | 169 | } |
170 | -} | |
171 | 170 | \ No newline at end of file |
171 | +} | ... | ... |
css/style/m2.0/utilities.less
... | ... | @@ -172,6 +172,10 @@ |
172 | 172 | color: #23ac38 !important; |
173 | 173 | } |
174 | 174 | |
175 | +.font-blue{ | |
176 | + color: #1b6ba5 !important; | |
177 | +} | |
178 | + | |
175 | 179 | .background-gray{ |
176 | 180 | background-color: #666 !important; |
177 | 181 | } |
... | ... | @@ -195,4 +199,4 @@ |
195 | 199 | } |
196 | 200 | .width-auto{ |
197 | 201 | width: auto !important; |
198 | -} | |
199 | 202 | \ No newline at end of file |
203 | +} | ... | ... |
css/style/product_manage.css
1 | +#prodtctManagePage .m-tab .on a{color:#1b6ba5}#prodtctManagePage .m-tab .on a:after{background-color:#1b6ba5}#prodtctManagePage .m-list-view .cell{padding:15px 15px 10px}#prodtctManagePage .m-list-view .cell label{display:block;box-sizing:border-box;padding-bottom:15px}#prodtctManagePage .m-list-view .cell .cont{margin-left:110px}#prodtctManagePage .m-list-view .cell .m-radio{float:left;margin-top:20px}#prodtctManagePage .m-list-view .cell .pic{margin-left:15px;display:inline-block}#prodtctManagePage .m-list-view .cell h3{line-height:1.2;font-size:15px;margin-bottom:4px}#prodtctManagePage .m-list-view .cell p{font-size:14px;line-height:1.4}#prodtctManagePage .m-list-view .action{padding:10px 0 0 35px}#prodtctManagePage .m-list-view .action .m-btn{border-radius:3px;line-height:30px;min-width:46px}#prodtctManagePage .m-footer label{float:left;margin-top:10px;font-size:16px;color:#666}#prodtctManagePage .m-footer label span{display:inline-block;vertical-align:middle}#prodtctManagePage .m-footer .m-radio{margin-right:15px}#prodtctManagePage .m-footer .m-btn{line-height:40px;font-size:16px;background-color:#ddd;color:#999;border-radius:3px} | |
0 | 2 | \ No newline at end of file | ... | ... |
css/style/product_manage.less
1 | -#prodtctManagePage{ | |
2 | - | |
1 | +#prodtctManagePage { | |
2 | + .m-tab { | |
3 | + .on { | |
4 | + a { | |
5 | + color: #1b6ba5; | |
6 | + &:after { | |
7 | + background-color: #1b6ba5; | |
8 | + } | |
9 | + } | |
10 | + } | |
11 | + } | |
12 | + .m-list-view{ | |
13 | + .cell{ | |
14 | + padding: 15px 15px 10px; | |
15 | + label{ | |
16 | + display: block; | |
17 | + // font-size: 0; | |
18 | + box-sizing: border-box; | |
19 | + padding-bottom: 15px; | |
20 | + } | |
21 | + .cont{ | |
22 | + margin-left: 110px; | |
23 | + } | |
24 | + .m-radio{ | |
25 | + float: left; | |
26 | + margin-top: 20px; | |
27 | + } | |
28 | + .pic{ | |
29 | + margin-left: 15px; | |
30 | + display: inline-block; | |
31 | + } | |
32 | + h3{ | |
33 | + line-height: 1.2; | |
34 | + font-size: 15px; | |
35 | + margin-bottom: 4px; | |
36 | + } | |
37 | + p{ | |
38 | + font-size: 14px; | |
39 | + line-height: 1.4; | |
40 | + } | |
41 | + } | |
42 | + .action{ | |
43 | + padding: 10px 0 0 35px; | |
44 | + .m-btn{ | |
45 | + border-radius: 3px; | |
46 | + line-height: 30px; | |
47 | + min-width: 46px; | |
48 | + } | |
49 | + } | |
50 | + } | |
51 | + | |
52 | + .m-footer{ | |
53 | + label{ | |
54 | + float: left; | |
55 | + margin-top: 10px; | |
56 | + font-size: 16px; | |
57 | + color: #666; | |
58 | + span{ | |
59 | + display: inline-block; | |
60 | + vertical-align: middle; | |
61 | + } | |
62 | + } | |
63 | + .m-radio{ | |
64 | + margin-right: 15px; | |
65 | + } | |
66 | + .m-btn{ | |
67 | + line-height: 40px; | |
68 | + font-size: 16px; | |
69 | + background-color: #ddd; | |
70 | + color: #999; | |
71 | + border-radius: 3px; | |
72 | + } | |
73 | + } | |
3 | 74 | } | ... | ... |
temp/pic_120.jpg
0 → 100644
7.14 KB
wx-1.1/product_manage.html
0 → 100644
1 | +<!DOCTYPE html> | |
2 | +<html lang="en"> | |
3 | + | |
4 | +<head> | |
5 | + <meta name="viewport" content="user-scalable=0, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> | |
6 | + <meta content="telephone=no" name="format-detection" /> | |
7 | + <meta content="black" name="apple-mobile-web-app-status-bar-style" /> | |
8 | + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
9 | + <title>商品管理</title> | |
10 | + <link rel="stylesheet" href="../css/style/common-2.0.css"> | |
11 | +</head> | |
12 | + | |
13 | +<body> | |
14 | + <link rel="stylesheet" href="../css/style/product_manage.css"> | |
15 | + <div class="m-page" data-role="page" id="prodtctManagePage"> | |
16 | + <!-- header --> | |
17 | + <header class="m-header header-light border-1px border-bottom"> | |
18 | + <a href="#" class="lt-bar"><i class="m-icon icon-back"></i></a> | |
19 | + <div class="head"> | |
20 | + <h1 class="font-gray">商品管理</h1> | |
21 | + </div> | |
22 | + </header> | |
23 | + <div class="m-content"> | |
24 | + <!-- 排序tab --> | |
25 | + <ul class="m-tab tab-col-3"> | |
26 | + <li class="on"><a href="#">在售商品</a></li> | |
27 | + <li><a href="#">待售商品</a></li> | |
28 | + <li><a href="#">审核商品</a></li> | |
29 | + </ul> | |
30 | + <ul class="m-list-view border-1px border-top"> | |
31 | + <li class="cell cell-pic border-1px border-bottom"> | |
32 | + <label class="border-1px border-bottom"> | |
33 | + <input type="checkbox" class="m-radio"> | |
34 | + <img src="../temp/pic_120.jpg" width="60" height="60" alt="" class="pic"> | |
35 | + <div class="cont"> | |
36 | + <h3>泰国皇帝蕉</h3> | |
37 | + <p>价格:1.2元/斤</p> | |
38 | + <p>库存:10000斤</p> | |
39 | + </div> | |
40 | + </label> | |
41 | + <div class="action text-center clearfix"><span class="m-btn btn-default float-left">改价格</span><span class="m-btn btn-default">改库存</span><span class="m-btn btn-default float-right">改详情</span></div> | |
42 | + </li> | |
43 | + </ul> | |
44 | + <ul class="m-list-view border-1px border-top"> | |
45 | + <li class="cell cell-pic border-1px border-bottom"> | |
46 | + <label class="border-1px border-bottom"> | |
47 | + <input type="checkbox" class="m-radio"> | |
48 | + <img src="../temp/pic_120.jpg" width="60" height="60" alt="" class="pic"> | |
49 | + <div class="cont"> | |
50 | + <h3>泰国皇帝蕉</h3> | |
51 | + <p>价格:1.2元/斤</p> | |
52 | + <p>库存:10000斤</p> | |
53 | + </div> | |
54 | + </label> | |
55 | + <div class="action text-center clearfix"><span class="m-btn btn-default float-left">改价格</span><span class="m-btn btn-default">改库存</span><span class="m-btn btn-default float-right">改详情</span></div> | |
56 | + </li> | |
57 | + </ul> | |
58 | + <ul class="m-list-view border-1px border-top"> | |
59 | + <li class="cell cell-pic border-1px border-bottom"> | |
60 | + <label class="border-1px border-bottom"> | |
61 | + <input type="checkbox" class="m-radio"> | |
62 | + <img src="../temp/pic_120.jpg" width="60" height="60" alt="" class="pic"> | |
63 | + <div class="cont"> | |
64 | + <h3>泰国皇帝蕉</h3> | |
65 | + <p>价格:1.2元/斤</p> | |
66 | + <p>库存:10000斤</p> | |
67 | + </div> | |
68 | + </label> | |
69 | + <div class="action text-center clearfix"><span class="m-btn btn-default float-left">改价格</span><span class="m-btn btn-default">改库存</span><span class="m-btn btn-default float-right">改详情</span></div> | |
70 | + </li> | |
71 | + </ul> | |
72 | + </div> | |
73 | + <div class="m-footer border-1px border-top"> | |
74 | + <label><input type="checkbox" class="m-radio"><span>全选</span></label> | |
75 | + <a href="#product-buy" data-popup class="m-btn disabled float-right">批量下架</a> | |
76 | + </div> | |
77 | + </div> | |
78 | +</body> | |
79 | +</html> | ... | ... |