diff --git a/README.md b/README.md index 5d30550..048a2f6 100644 --- a/README.md +++ b/README.md @@ -33,3 +33,4 @@ - orderconfirm/chooseway 选择方式 - orderconfirm/ordershopinfo 顶部的商品信息 - orderconfirm/orderyf 运费 + - pages/order/order 订单列表 diff --git a/app.json b/app.json index 772589e..9441bb2 100644 --- a/app.json +++ b/app.json @@ -1,5 +1,6 @@ { "pages": [ + "pages/order/order", "pages/orderconfirm/orderconfirm", "pages/message/message", "pages/personal/personal", diff --git a/pages/order/order.js b/pages/order/order.js new file mode 100644 index 0000000..8e1eeab --- /dev/null +++ b/pages/order/order.js @@ -0,0 +1,66 @@ +// pages/order/order.js +Page({ + + /** + * 页面的初始数据 + */ + data: { + + }, + + /** + * 生命周期函数--监听页面加载 + */ + onLoad: function (options) { + + }, + + /** + * 生命周期函数--监听页面初次渲染完成 + */ + onReady: function () { + + }, + + /** + * 生命周期函数--监听页面显示 + */ + onShow: function () { + + }, + + /** + * 生命周期函数--监听页面隐藏 + */ + onHide: function () { + + }, + + /** + * 生命周期函数--监听页面卸载 + */ + onUnload: function () { + + }, + + /** + * 页面相关事件处理函数--监听用户下拉动作 + */ + onPullDownRefresh: function () { + + }, + + /** + * 页面上拉触底事件的处理函数 + */ + onReachBottom: function () { + + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage: function () { + + } +}) \ No newline at end of file diff --git a/pages/order/order.json b/pages/order/order.json new file mode 100644 index 0000000..bb72bac --- /dev/null +++ b/pages/order/order.json @@ -0,0 +1,6 @@ +{ + "usingComponents": { + "van-tab": "../utils/dist/tab/index", + "van-tabs": "../utils/dist/tabs/index" + } +} \ No newline at end of file diff --git a/pages/order/order.scss b/pages/order/order.scss new file mode 100644 index 0000000..f2e63ec --- /dev/null +++ b/pages/order/order.scss @@ -0,0 +1,92 @@ +.box { + 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; + } + } + } + } +} +page { + background-color: #efefef; +} diff --git a/pages/order/order.wxml b/pages/order/order.wxml new file mode 100644 index 0000000..2d3df92 --- /dev/null +++ b/pages/order/order.wxml @@ -0,0 +1,141 @@ + + + + + + + + 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 new file mode 100644 index 0000000..25f60da --- /dev/null +++ b/pages/order/order.wxss @@ -0,0 +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}