From 727314fb054de20faf52d50518aa1b504372d43d Mon Sep 17 00:00:00 2001
From: xuqi <xuqi9010@gmail.com>
Date: Tue, 10 Nov 2015 22:45:44 +0800
Subject: [PATCH] build my order
---
docs/data-structure.md | 33 +++++++++++++++++++++++++++++++++
static/index.js | 1 +
static/js/me/entry.js | 7 +++++++
static/js/me/order.js | 38 ++++++++++++++++++++++++++++++++++++++
static/sass/me/_index.scss | 2 +-
static/sass/me/_order.scss | 143 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
template/m.yohobuy.com/actions/index/home/order.phtml | 31 +++++++++++++++++++++++++++++++
template/m.yohobuy.com/partials/layout/use.phtml | 7 +++++++
template/m.yohobuy.com/partials/me/order/good.phtml | 30 ++++++++++++++++++++++++++++++
template/m.yohobuy.com/partials/me/order/order.phtml | 14 ++++++++++++++
yohobuy/m.yohobuy.com/application/controllers/Home.php | 45 +++++++++++++++++++++++++++++++++++++++------
11 files changed, 344 insertions(+), 7 deletions(-)
create mode 100644 static/js/me/entry.js
create mode 100644 static/js/me/order.js
create mode 100644 static/sass/me/_order.scss
create mode 100644 template/m.yohobuy.com/actions/index/home/order.phtml
create mode 100644 template/m.yohobuy.com/partials/me/order/good.phtml
create mode 100644 template/m.yohobuy.com/partials/me/order/order.phtml
diff --git a/docs/data-structure.md b/docs/data-structure.md
index 98db288..ceb67c4 100644
--- a/docs/data-structure.md
+++ b/docs/data-structure.md
@@ -893,4 +893,37 @@
//查看全部VIP特权页面
all: true
}
+ }
+
+
+### 我的订单
+ {
+ order: {
+ allOrders: [
+ ...
+ ]
+ }
+ }
+
+
+ //订单
+ {
+ orderNum: '',
+ tradingStatus: '',
+ goods: [
+ {
+ id: '',
+ thumb: '',
+ gift: true, //是否赠品
+ advanceBuy: true, //是否加价购
+ name: '',
+ color: '黄色',
+ size: 'X',
+ price: '588',
+ count: 2
+ },
+ ...
+ ],
+ count: 1,
+ sumCost: '199.00'
}
\ No newline at end of file
diff --git a/static/index.js b/static/index.js
index 0bcbcfa..92c0f67 100644
--- a/static/index.js
+++ b/static/index.js
@@ -8,5 +8,6 @@ require('./js/home/entry');
require('./js/index/entry');
require('./js/passport/entry');
require('./js/product/entry');
+require('./js/me/entry');
module.exports = yohobuy;
diff --git a/static/js/me/entry.js b/static/js/me/entry.js
new file mode 100644
index 0000000..05a45fb
--- /dev/null
+++ b/static/js/me/entry.js
@@ -0,0 +1,7 @@
+/**
+ * 个人中心js打包入口文件
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/11/10
+ */
+
+require('./order');
\ No newline at end of file
diff --git a/static/js/me/order.js b/static/js/me/order.js
new file mode 100644
index 0000000..b9d5b5b
--- /dev/null
+++ b/static/js/me/order.js
@@ -0,0 +1,38 @@
+/**
+ * 个人中心--我的订单
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/11/10
+ */
+
+var $ = require('jquery'),
+ Hammer = require('yoho.hammer'),
+ lazyLoad = require('yoho.lazyload');
+
+var $navLi = $('#order-nav > li'),
+ $orderContainer = $('#order-container');
+
+var $curContainer = $orderContainer.children('.orders').first();//保存当前显示的order-container
+
+var navHammer;
+
+lazyLoad();
+
+navHammer = new Hammer(document.getElementById('order-nav'));
+navHammer.on('tap', function(e) {
+ var $cur = $(e.target).closest('li'),
+ index;
+
+ if ($cur.length === 0 || $cur.hasClass('active')) {
+ return;
+ }
+
+ index = $cur.index();
+
+ $navLi.filter('.active').removeClass('active');
+ $cur.addClass('active');
+
+ $curContainer.addClass('hide');
+ $curContainer = $orderContainer.children(':eq(' + index + ')').removeClass('hide');
+});
+
+
diff --git a/static/sass/me/_index.scss b/static/sass/me/_index.scss
index c626519..8b025e5 100644
--- a/static/sass/me/_index.scss
+++ b/static/sass/me/_index.scss
@@ -1 +1 @@
-@import "home", "vip-grade";
\ No newline at end of file
+@import "home", "vip-grade", "order";
\ No newline at end of file
diff --git a/static/sass/me/_order.scss b/static/sass/me/_order.scss
new file mode 100644
index 0000000..87275b0
--- /dev/null
+++ b/static/sass/me/_order.scss
@@ -0,0 +1,143 @@
+.order-page {
+ background: #f0f0f0;
+
+ .order {
+ background: #fff;
+ margin: 30rem / $pxConvertRem 0;
+ border-top: 1px solid #e0e0e0;
+ border-bottom: 1px solid #e0e0e0;
+
+ .header, .footer {
+ height: 90rem / $pxConvertRem;
+ line-height: 90rem / $pxConvertRem;
+ font-size: 30rem / $pxConvertRem;
+ padding: 0 30rem / $pxConvertRem;
+ }
+
+ .header {
+ border-bottom: 1px solid #e0e0e0;
+ }
+
+ .trading-status {
+ float: right;
+ }
+
+ .footer {
+ text-align: right;
+ border-top: 1px solid #e0e0e0;
+ }
+
+ .sum-cost {
+ color: #e01;
+ }
+ }
+}
+
+.order-nav {
+ border-bottom: 1px solid #e0e0e0;
+ background: #fff;
+
+ > li{
+ float: left;
+ height: 90rem / $pxConvertRem;
+ width: 25%;
+ line-height: 90rem / $pxConvertRem;
+ color: #b0b0b0;
+ font-size: 26rem / $pxConvertRem;
+ text-align: center;
+
+ &.active {
+ color: #000;
+ }
+ }
+}
+
+.order-good {
+ position: relative;
+ padding: 20rem / $pxConvertRem 0;
+ margin-left: 34rem / $pxConvertRem;
+ height: 160rem / $pxConvertRem;
+ border-bottom: 1px solid #e0e0e0;
+ font-size: 26rem / $pxConvertRem;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .thumb-wrap {
+ position: relative;
+ float: left;
+ width: 120rem / $pxConvertRem;
+ height: 160rem / $pxConvertRem;
+ }
+
+ .thumb {
+ width: 100%;
+ height: 100%;
+ }
+
+ .tag {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ color: #fff;
+ text-align: center;
+ font-size: 12px;
+ }
+
+ .gift-tag {
+ height: 25rem / $pxConvertRem;
+ background: #a1ce4e;
+ &:before {
+ content: '赠品';
+ }
+ }
+
+ .advance-buy-tag {
+ height: 25rem / $pxConvertRem;
+ background: #eb76aa;
+ &:before {
+ content: '加价购';
+ }
+ }
+
+ .deps {
+ margin-left: 135rem / $pxConvertRem;
+ }
+
+ .name {
+ font-size: 28rem / $pxConvertRem;
+ max-width: 70%;
+ }
+
+ .row:nth-child(2) {
+ height: 45rem / $pxConvertRem;
+ line-height: 45rem / $pxConvertRem;
+
+ > span {
+ margin-right: 15rem / $pxConvertRem;
+ }
+ }
+
+ .color, .size {
+ color: #b6b6b6;
+ }
+
+ .price-wrap {
+ position: absolute;
+ top: 20rem / $pxConvertRem;
+ right: 30rem / $pxConvertRem;
+ }
+
+ .price {
+ color: #e01;
+ }
+
+ .count {
+ display: block;
+ color: #999;
+ text-align: right;
+ line-height: 45rem / $pxConvertRem;
+ }
+}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/actions/index/home/order.phtml b/template/m.yohobuy.com/actions/index/home/order.phtml
new file mode 100644
index 0000000..7863582
--- /dev/null
+++ b/template/m.yohobuy.com/actions/index/home/order.phtml
@@ -0,0 +1,31 @@
+{{> layout/header}}
+<div class="order-page yoho-page">
+ {{# order}}
+ <ul id="order-nav" class="order-nav clearfix">
+ <li class="active">
+ 全部
+ </li>
+ <li>
+ 待付款
+ </li>
+ <li>
+ 待发货
+ </li>
+ <li>
+ 待收货
+ </li>
+ </ul>
+
+ <div id="order-container" class="order-container">
+ <div class="all orders">
+ {{# allOrders}}
+ {{> me/order/order}}
+ {{/ allOrders}}
+ </div>
+ <div class="obligation orders hide"></div>
+ <div class="unshipped orders hide"></div>
+ <div class="unreceived orders hide"></div>
+ </div>
+ {{/ order}}
+</div>
+{{> layout/footer}}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/partials/layout/use.phtml b/template/m.yohobuy.com/partials/layout/use.phtml
index a2c26c9..cd01d9f 100644
--- a/template/m.yohobuy.com/partials/layout/use.phtml
+++ b/template/m.yohobuy.com/partials/layout/use.phtml
@@ -187,4 +187,11 @@
<script>
seajs.use('js/shopping-cart/gift-advance');
</script>
+{{/if}}
+
+{{!-- 个人中心 --}}
+{{#if orderPage}}
+<script>
+ seajs.use('js/me/order');
+</script>
{{/if}}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/partials/me/order/good.phtml b/template/m.yohobuy.com/partials/me/order/good.phtml
new file mode 100644
index 0000000..f031f0c
--- /dev/null
+++ b/template/m.yohobuy.com/partials/me/order/good.phtml
@@ -0,0 +1,30 @@
+<div class="order-good" data-id={{id}}>
+ <div class="thumb-wrap">
+ <img class="thumb lazy" data-original={{thumb}}>
+ <p class="tag{{#if gift}} gift-tag{{/if}}{{#if advanceBuy}} advance-buy-tag{{/if}}"></p>
+ </div>
+ <div class="deps">
+ <p class="name row">{{name}}</p>
+ <p class="row">
+ {{#if color}}
+ <span class="color">
+ 颜色:{{color}}
+ </span>
+ {{/if}}
+
+ {{#if size}}
+ <span class="size">
+ 尺码:{{size}}
+ </span>
+ {{/if}}
+ </p>
+ <p class="row price-wrap">
+ <span class="price">
+ ¥{{price}}
+ </span>
+ <span class="count">
+ ×{{count}}
+ </span>
+ </p>
+ </div>
+</div>
\ No newline at end of file
diff --git a/template/m.yohobuy.com/partials/me/order/order.phtml b/template/m.yohobuy.com/partials/me/order/order.phtml
new file mode 100644
index 0000000..e7812ba
--- /dev/null
+++ b/template/m.yohobuy.com/partials/me/order/order.phtml
@@ -0,0 +1,14 @@
+<div class="order">
+ <header class="header">
+ 订单编号：{{orderNum}}
+ <span class="trading-status">{{tradingStatus}}</span>
+ </header>
+ <section class="order-goods">
+ {{# goods}}
+ {{> me/order/good}}
+ {{/ goods}}
+ </section>
+ <footer class="footer">
+ 共{{count}}件商品 实付<span class="sum-cost">¥{{sumCost}}</span>
+ </footer>
+</div>
\ No newline at end of file
diff --git a/yohobuy/m.yohobuy.com/application/controllers/Home.php b/yohobuy/m.yohobuy.com/application/controllers/Home.php
index 3c23b82..13cc02f 100644
--- a/yohobuy/m.yohobuy.com/application/controllers/Home.php
+++ b/yohobuy/m.yohobuy.com/application/controllers/Home.php
@@ -39,12 +39,45 @@ class HomeController extends AbstractAction
*/
public function ordersAction()
{
- $uid = $this->getUid();
- $type = $this->get('type', 1);
-
- $orders = \Index\UserModel::getUserOrderData(967016, $type);
-
- print_r($orders);
+ // $uid = $this->getUid();
+ // $type = $this->get('type', 1);
+
+ // $orders = \Index\UserModel::getUserOrderData(967016, $type);
+
+ $order = array(
+ 'allOrders' => array(
+ array(
+ 'orderNum' => '408539077',
+ 'tradingStatus' => '交易成功',
+ 'goods' => array(
+ array(
+ 'id' => 1,
+ 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/11/04/05/01ce2aff32fc3c90584f516167cd526d91.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
+ 'name' => 'Adidas Originals ZX FLUXM22508',
+ 'color' => '黄',
+ 'size' => '43',
+ 'price' => '699.00',
+ 'count' => '2'
+ ),
+ array(
+ 'id' => 1,
+ 'thumb' => 'http://img10.static.yhbimg.com/goodsimg/2015/11/04/05/0188f1aca49ac478a565ec029b5d2d4a6c.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
+ 'name' => 'B.Duck浴室玩伴mini浮水鸭',
+ 'gift' => true,
+ 'color' => '黄',
+ 'size' => '43',
+ 'price' => '0.00',
+ 'count' => '1'
+ )
+ ),
+ 'count' => 2,
+ 'sumCost' => '699.00'
+ )
+ )
+ );
+
+ $this->_view->display('order', array('order' => $order, 'orderPage' => true));
+ // print_r($orders);
}
/**
--
libgit2 0.24.0