From 10d81f738daab1da5e8b384a3ef13835f40ab294 Mon Sep 17 00:00:00 2001 From: pplokijuhyg <1162963624@qq.com> Date: Sat, 14 Dec 2019 10:25:59 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 6 +- components/order/commodity/index.js | 8 ++ components/order/commodity/index.json | 6 ++ components/order/commodity/index.scss | 81 +++++++++++++++ components/order/commodity/index.wxml | 14 +++ components/order/commodity/index.wxss | 1 + components/order/message/index.js | 8 ++ components/order/message/index.json | 3 + components/order/message/index.scss | 40 ++++++++ components/order/message/index.wxml | 14 +++ components/order/message/index.wxss | 1 + components/order/tab/index.js | 8 ++ components/order/tab/index.json | 8 ++ components/order/tab/index.scss | 3 + components/order/tab/index.wxml | 9 ++ components/order/tab/index.wxss | 1 + pages/order/order.json | 3 +- pages/order/order.scss | 85 +--------------- pages/order/order.wxml | 140 +------------------------- pages/order/order.wxss | 2 +- 20 files changed, 214 insertions(+), 227 deletions(-) create mode 100644 components/order/commodity/index.js create mode 100644 components/order/commodity/index.json create mode 100644 components/order/commodity/index.scss create mode 100644 components/order/commodity/index.wxml create mode 100644 components/order/commodity/index.wxss create mode 100644 components/order/message/index.js create mode 100644 components/order/message/index.json create mode 100644 components/order/message/index.scss create mode 100644 components/order/message/index.wxml create mode 100644 components/order/message/index.wxss create mode 100644 components/order/tab/index.js create mode 100644 components/order/tab/index.json create mode 100644 components/order/tab/index.scss create mode 100644 components/order/tab/index.wxml create mode 100644 components/order/tab/index.wxss diff --git a/README.md b/README.md index 048a2f6..82b7dd4 100644 --- a/README.md +++ b/README.md @@ -33,4 +33,8 @@ - orderconfirm/chooseway 选择方式 - orderconfirm/ordershopinfo 顶部的商品信息 - orderconfirm/orderyf 运费 - - pages/order/order 订单列表 +- pages/order/order 订单列表
+ 组件 + - order/tab 切换列表 + - order/commodity 商品信息操作 + - order/message 商品信息 diff --git a/components/order/commodity/index.js b/components/order/commodity/index.js new file mode 100644 index 0000000..9f59aa7 --- /dev/null +++ b/components/order/commodity/index.js @@ -0,0 +1,8 @@ +Component({ + properties: { + }, + data: { + }, + methods: { + } +}) \ No newline at end of file diff --git a/components/order/commodity/index.json b/components/order/commodity/index.json new file mode 100644 index 0000000..9800f6a --- /dev/null +++ b/components/order/commodity/index.json @@ -0,0 +1,6 @@ +{ + "component": true, + "usingComponents": { + "message":"../message/index" + } +} \ No newline at end of file diff --git a/components/order/commodity/index.scss b/components/order/commodity/index.scss new file mode 100644 index 0000000..e558039 --- /dev/null +++ b/components/order/commodity/index.scss @@ -0,0 +1,81 @@ +.commodity { + margin-top: 20rpx; + background-color: #fff; + .message { + padding: 35rpx; + display: flex; + align-items: center; + border-bottom: 1rpx solid #F2F2F2; + .image { + width: 141rpx; + height: 150rpx; + background-color: #000; + margin-left: 34rpx; + } + .introduce { + margin-left: 32rpx; + height: 120rpx; + display: flex; + flex-direction: column; + justify-content: space-between; + width: 362rpx; + .title { + font-size: 28rpx; + color: #333; + } + .count { + font-size: 24rpx; + color: #999; + display: flex; + > view { + margin-right: 27rpx; + } + } + } + .parameter { + width: 150rpx; + height: 120rpx; + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: flex-end; + } + } + .aggregate{ + display: flex; + box-sizing: border-box; + padding: 30rpx; + justify-content: flex-end; + font-size: 22rpx; + color: #999; + height: 78rpx; + border-bottom: 1rpx solid #F2F2F2; + + >text{ + color: #333; + margin: 0 5rpx; + } + } + .operation{ + height: 84rpx; + display: flex; + justify-content: flex-end; + padding:0 30rpx; + align-items: center; + .button{ + width: 133rpx; + height: 51rpx; + border:2rpx solid #999999; + border-radius: 26rpx; + text-align: center; + font-size: 22rpx; + color:#999999; + line-height: 51rpx; + margin-right: 8rpx; + } + .hlight{ + border:2rpx solid rgba(71,200,119,1); + color: #47C877; + } + } +} \ No newline at end of file diff --git a/components/order/commodity/index.wxml b/components/order/commodity/index.wxml new file mode 100644 index 0000000..e7264f2 --- /dev/null +++ b/components/order/commodity/index.wxml @@ -0,0 +1,14 @@ + + + + 共计1件商品 合计: + ￥29.80 + (含运费￥0.00) + + + 评价 + + 评价 + + + \ No newline at end of file diff --git a/components/order/commodity/index.wxss b/components/order/commodity/index.wxss new file mode 100644 index 0000000..e025d4a --- /dev/null +++ b/components/order/commodity/index.wxss @@ -0,0 +1 @@ +.commodity{margin-top:20rpx;background-color:#fff}.commodity .message{padding:35rpx;display:flex;align-items:center;border-bottom:1rpx solid #F2F2F2}.commodity .message .image{width:141rpx;height:150rpx;background-color:#000;margin-left:34rpx}.commodity .message .introduce{margin-left:32rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;width:362rpx}.commodity .message .introduce .title{font-size:28rpx;color:#333}.commodity .message .introduce .count{font-size:24rpx;color:#999;display:flex}.commodity .message .introduce .count>view{margin-right:27rpx}.commodity .message .parameter{width:150rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}.commodity .aggregate{display:flex;box-sizing:border-box;padding:30rpx;justify-content:flex-end;font-size:22rpx;color:#999;height:78rpx;border-bottom:1rpx solid #F2F2F2}.commodity .aggregate>text{color:#333;margin:0 5rpx}.commodity .operation{height:84rpx;display:flex;justify-content:flex-end;padding:0 30rpx;align-items:center}.commodity .operation .button{width:133rpx;height:51rpx;border:2rpx solid #999999;border-radius:26rpx;text-align:center;font-size:22rpx;color:#999999;line-height:51rpx;margin-right:8rpx}.commodity .operation .hlight{border:2rpx solid #47c877;color:#47C877} diff --git a/components/order/message/index.js b/components/order/message/index.js new file mode 100644 index 0000000..9f59aa7 --- /dev/null +++ b/components/order/message/index.js @@ -0,0 +1,8 @@ +Component({ + properties: { + }, + data: { + }, + methods: { + } +}) \ No newline at end of file diff --git a/components/order/message/index.json b/components/order/message/index.json new file mode 100644 index 0000000..32640e0 --- /dev/null +++ b/components/order/message/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} \ No newline at end of file diff --git a/components/order/message/index.scss b/components/order/message/index.scss new file mode 100644 index 0000000..cfa585f --- /dev/null +++ b/components/order/message/index.scss @@ -0,0 +1,40 @@ +.message { + padding: 35rpx; +display: flex; +align-items: center; +border-bottom: 1rpx solid #F2F2F2; +.image { + width: 141rpx; + height: 150rpx; + background-color: #000; + margin-left: 34rpx; +} +.introduce { + margin-left: 32rpx; + height: 120rpx; + display: flex; + flex-direction: column; + justify-content: space-between; + width: 362rpx; + .title { + font-size: 28rpx; + color: #333; + } + .count { + font-size: 24rpx; + color: #999; + display: flex; + > view { + margin-right: 27rpx; + } + } +} +.parameter { + width: 150rpx; + height: 120rpx; + display: flex; + flex-direction: column; + justify-content: space-between; + align-items: flex-end; +} +} \ No newline at end of file diff --git a/components/order/message/index.wxml b/components/order/message/index.wxml new file mode 100644 index 0000000..055d05c --- /dev/null +++ b/components/order/message/index.wxml @@ -0,0 +1,14 @@ + + + + 001|德国双心药房版 胶原蛋白美容口服液养颜 + + 30只 + 1.0356kg + + + + ￥29.80 + x2 + + \ No newline at end of file diff --git a/components/order/message/index.wxss b/components/order/message/index.wxss new file mode 100644 index 0000000..6221a43 --- /dev/null +++ b/components/order/message/index.wxss @@ -0,0 +1 @@ +.message{padding:35rpx;display:flex;align-items:center;border-bottom:1rpx solid #F2F2F2}.message .image{width:141rpx;height:150rpx;background-color:#000;margin-left:34rpx}.message .introduce{margin-left:32rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;width:362rpx}.message .introduce .title{font-size:28rpx;color:#333}.message .introduce .count{font-size:24rpx;color:#999;display:flex}.message .introduce .count>view{margin-right:27rpx}.message .parameter{width:150rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end} diff --git a/components/order/tab/index.js b/components/order/tab/index.js new file mode 100644 index 0000000..9f59aa7 --- /dev/null +++ b/components/order/tab/index.js @@ -0,0 +1,8 @@ +Component({ + properties: { + }, + data: { + }, + methods: { + } +}) \ No newline at end of file diff --git a/components/order/tab/index.json b/components/order/tab/index.json new file mode 100644 index 0000000..86d254c --- /dev/null +++ b/components/order/tab/index.json @@ -0,0 +1,8 @@ +{ + "component": true, + "usingComponents": { + "commodity":"../commodity/index", + "van-tab": "../utils/dist/tab/index", + "van-tabs": "../utils/dist/tabs/index" + } +} \ No newline at end of file diff --git a/components/order/tab/index.scss b/components/order/tab/index.scss new file mode 100644 index 0000000..5003c84 --- /dev/null +++ b/components/order/tab/index.scss @@ -0,0 +1,3 @@ +.tab { + width: 750rpx; +} \ No newline at end of file diff --git a/components/order/tab/index.wxml b/components/order/tab/index.wxml new file mode 100644 index 0000000..332394c --- /dev/null +++ b/components/order/tab/index.wxml @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/components/order/tab/index.wxss b/components/order/tab/index.wxss new file mode 100644 index 0000000..77cc1ab --- /dev/null +++ b/components/order/tab/index.wxss @@ -0,0 +1 @@ +.tab{width:750rpx} diff --git a/pages/order/order.json b/pages/order/order.json index bb72bac..f3c80a3 100644 --- a/pages/order/order.json +++ b/pages/order/order.json @@ -1,6 +1,5 @@ { "usingComponents": { - "van-tab": "../utils/dist/tab/index", - "van-tabs": "../utils/dist/tabs/index" + "tab":"../components/order/tab/index" } } \ No newline at end of file diff --git a/pages/order/order.scss b/pages/order/order.scss index f2e63ec..ffb81b1 100644 --- a/pages/order/order.scss +++ b/pages/order/order.scss @@ -2,90 +2,7 @@ display: flex; flex-direction: column; align-items: center; - .tab { - width: 100%; - .commodity { - margin-top: 20rpx; - background-color: #fff; - .message { - padding: 35rpx; - display: flex; - align-items: center; - border-bottom: 1rpx solid #F2F2F2; - .image { - width: 141rpx; - height: 150rpx; - background-color: #000; - margin-left: 34rpx; - } - .introduce { - margin-left: 32rpx; - height: 120rpx; - display: flex; - flex-direction: column; - justify-content: space-between; - width: 362rpx; - .title { - font-size: 28rpx; - color: #333; - } - .count { - font-size: 24rpx; - color: #999; - display: flex; - > view { - margin-right: 27rpx; - } - } - } - .parameter { - width: 150rpx; - height: 120rpx; - display: flex; - flex-direction: column; - justify-content: space-between; - align-items: flex-end; - } - } - .aggregate{ - display: flex; - box-sizing: border-box; - padding: 30rpx; - justify-content: flex-end; - font-size: 22rpx; - color: #999; - height: 78rpx; - border-bottom: 1rpx solid #F2F2F2; - - >text{ - color: #333; - margin: 0 5rpx; - } - } - .operation{ - height: 84rpx; - display: flex; - justify-content: flex-end; - padding:0 30rpx; - align-items: center; - .button{ - width: 133rpx; - height: 51rpx; - border:2rpx solid #999999; - border-radius: 26rpx; - text-align: center; - font-size: 22rpx; - color:#999999; - line-height: 51rpx; - margin-right: 8rpx; - } - .hlight{ - border:2rpx solid rgba(71,200,119,1); - color: #47C877; - } - } - } - } + width: 100%; } page { background-color: #efefef; diff --git a/pages/order/order.wxml b/pages/order/order.wxml index 2d3df92..388926d 100644 --- a/pages/order/order.wxml +++ b/pages/order/order.wxml @@ -1,141 +1,3 @@ - - - - - - - 001|德国双心药房版 胶原蛋白美容口服液养颜 - - 30只 - 1.0356kg - - - - ￥29.80 - x2 - - - - 共计1件商品 合计: - ￥29.80 - (含运费￥0.00) - - - 评价 - - 评价 - - - - - - - - - 001|德国双心药房版 胶原蛋白美容口服液养颜 - - 30只 - 1.0356kg - - - - ￥29.80 - x2 - - - - 共计1件商品 合计: - ￥29.80 - (含运费￥0.00) - - - 评价 - - 评价 - - - - - - - - 001|德国双心药房版 胶原蛋白美容口服液养颜 - - 30只 - 1.0356kg - - - - ￥29.80 - x2 - - - - 共计1件商品 合计: - ￥29.80 - (含运费￥0.00) - - - 评价 - - 评价 - - - - - - - - 001|德国双心药房版 胶原蛋白美容口服液养颜 - - 30只 - 1.0356kg - - - - ￥29.80 - x2 - - - - 共计1件商品 合计: - ￥29.80 - (含运费￥0.00) - - - 评价 - - 评价 - - - - - - - - 001|德国双心药房版 胶原蛋白美容口服液养颜 - - 30只 - 1.0356kg - - - - ￥29.80 - x2 - - - - 共计1件商品 合计: - ￥29.80 - (含运费￥0.00) - - - 评价 - - 评价 - - - - + \ No newline at end of file diff --git a/pages/order/order.wxss b/pages/order/order.wxss index 25f60da..069fac9 100644 --- a/pages/order/order.wxss +++ b/pages/order/order.wxss @@ -1 +1 @@ -.box{display:flex;flex-direction:column;align-items:center}.box .tab{width:100%}.box .tab .commodity{margin-top:20rpx;background-color:#fff}.box .tab .commodity .message{padding:35rpx;display:flex;align-items:center;border-bottom:1rpx solid #F2F2F2}.box .tab .commodity .message .image{width:141rpx;height:150rpx;background-color:#000;margin-left:34rpx}.box .tab .commodity .message .introduce{margin-left:32rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;width:362rpx}.box .tab .commodity .message .introduce .title{font-size:28rpx;color:#333}.box .tab .commodity .message .introduce .count{font-size:24rpx;color:#999;display:flex}.box .tab .commodity .message .introduce .count>view{margin-right:27rpx}.box .tab .commodity .message .parameter{width:150rpx;height:120rpx;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}.box .tab .commodity .aggregate{display:flex;box-sizing:border-box;padding:30rpx;justify-content:flex-end;font-size:22rpx;color:#999;height:78rpx;border-bottom:1rpx solid #F2F2F2}.box .tab .commodity .aggregate>text{color:#333;margin:0 5rpx}.box .tab .commodity .operation{height:84rpx;display:flex;justify-content:flex-end;padding:0 30rpx;align-items:center}.box .tab .commodity .operation .button{width:133rpx;height:51rpx;border:2rpx solid #999999;border-radius:26rpx;text-align:center;font-size:22rpx;color:#999999;line-height:51rpx;margin-right:8rpx}.box .tab .commodity .operation .hlight{border:2rpx solid #47c877;color:#47C877}page{background-color:#efefef} +.box{display:flex;flex-direction:column;align-items:center;width:100%}page{background-color:#efefef}