user index

service/Application/Home/Lang/zh-cn.php

@@ -62,7 +62,7 @@ return array(
 									'action'	=>	'Index',
 									'name'		=>	'我的地址',
 									'is_show'	=>	1,
-									'icon'		=>	'am-icon-map-marker',
+									'icon'		=>	'am-icon-street-view',
 								),
 							array(
 									'control'	=>	'Safety',

service/Application/Home/View/Default/User/Index.html

@@ -36,26 +36,26 @@
                     <div class="items">
                         <a href="{{:U('Home/Personal/Avatar')}}" class="am-icon-camera-retro"> 修改头像</a>
                         <a href="{{:U('Home/Personal/SaveInfo')}}" class="am-icon-edit"> 修改资料</a>
-                        <a href="{{:U('Home/UserAddress/Index')}}" class="am-icon-map-marker"> 我的地址</a>
+                        <a href="{{:U('Home/UserAddress/Index')}}" class="am-icon-street-view"> 我的地址</a>
                     </div>
                 </div>
                 <div class="user-base-right">
                     <a href="{{:U('Home/Message/Index')}}" class="am-icon-bell-o message"> 消息</a>
                 </div>
                 <ul class="user-base-icon">
-                    <li class="icon-items">
+                    <li>
                         <a href="{{:U('Home/Order/Index')}}">
                             <p>0</p>
                             <p>订单总数</p>
                         </a>
                     </li>
-                    <li class="icon-items">
+                    <li>
                         <a href="{{:U('Home/UserFavor/Goods')}}">
                             <p>0</p>
                             <p>商品收藏</p>
                         </a>
                     </li>
-                    <li class="icon-items">
+                    <li>
                         <a href="{{:U('Home/History/Index')}}">
                             <p>0</p>
                             <p>我的足迹</p>
@@ -65,9 +65,45 @@
             </div>
 
             <!-- 订单信息 -->
-            <div class="order-base">
-                order
+            <div class="order-nav">
+                <a href="{{:U('Home/Order/Index')}}">
+                    <span class="nav-name">
+                        <i class="order-icon"></i>
+                        我的订单
+                    </span>
+                    <span class="am-fr icon-tips">
+                        查看全部订单
+                        <i class="am-icon-angle-right"></i>
+                    </span>
+                </a>
             </div>
+            <ul class="order-base">
+                <li>
+                    <a href="{{:U('Home/Order/Index')}}">
+                        <i class="icon-1"></i>
+                        <p>待付款</p>
+                        <span class="am-badge am-badge-danger am-round">6</span>
+                    </a>
+                </li>
+                <li>
+                    <a href="{{:U('Home/Order/Index')}}">
+                        <i class="icon-2"></i>
+                        <p>待发货</p>
+                    </a>
+                </li>
+                <li>
+                    <a href="{{:U('Home/Order/Index')}}">
+                        <i class="icon-3"></i>
+                        <p>待收货</p>
+                    </a>
+                </li>
+                <li>
+                    <a href="{{:U('Home/Order/Index')}}">
+                        <i class="icon-100"></i>
+                        <p>待付款</p>
+                    </a>
+                </li>
+            </ul>
         </div>
     </div>
     <!-- content end -->

service/Public/Home/Default/Css/User.Index.css

@@ -1,6 +1,9 @@
 /**
  * 用户中心
  */
+.user-base, ul.order-base {
+    overflow: hidden;
+}
 .user-base {
     -webkit-animation: changeBg 20s infinite;
     -moz-animation: changeBg 20s infinite;
@@ -11,16 +14,12 @@
     width: 100%;
     position: relative;
     padding: 20px 10px;
-    overflow: hidden;
 }
 .user-base p, .user-base span, .user-base a {
     color: #fff;
 }
-.user-base a {
+.user-base a, .order-base a, .order-nav a {
     text-decoration: none;
-}
-.user-base-left, .user-base-right {
-    
 }
 .user-avatar {
     text-align: center;
@@ -33,7 +32,7 @@
     height: 80px;
     border-radius: 100%;
 }
-.user-avatar .user-name, .order-base {
+.user-avatar .user-name {
     margin-top: 5px;
 }
 
@@ -44,12 +43,75 @@
 .user-base-right a:not(:last-child) {
     margin-right: 15px;
 }
-.user-base-icon {
+ul.user-base-icon {
     background: rgba(0,0,0,0.1);
     position: absolute;
 }
 
 
+.order-nav {
+    padding: 10px 5px;
+    border-bottom: 1px solid #f1f1f1;
+}
+.order-nav i {
+    width: 20px;
+    height: 20px;
+    background-repeat: no-repeat;
+    background-position: 50% 50%;
+    background-size: 70%;
+    display: inline-block;
+    vertical-align: bottom;
+}
+.order-nav .nav-name i.order-icon {
+    background-image: url(../images/user-index-nav-order-icon.png);
+}
+.order-nav .icon-tips, .order-base a {
+    color: #888;
+}
+.order-nav .icon-tips i {
+padding-left: 5px;
+}
+
+ul.order-base {
+    margin-bottom: 10px;
+    border-bottom: 1px solid #f1f1f1;
+    padding: 13px 0 5px 0;
+}
+ul.order-base li {
+    float: left;
+    width: 25%;
+    text-align: center;
+    position: relative;
+}
+ul.order-base li i {
+    width: 20px;
+    height: 20px;
+    background-repeat: no-repeat;
+    display: inline-block;
+    vertical-align: bottom;
+    opacity: 0.5;
+    background-size: cover;
+    margin-bottom: 2px;
+}
+ul.order-base i.icon-1 {
+    background-image: url(../Images/user-index-nav-order-icon-1.png);
+}
+ul.order-base i.icon-2 {
+    background-image: url(../Images/user-index-nav-order-icon-2.png);
+}
+ul.order-base i.icon-3 {
+    background-image: url(../Images/user-index-nav-order-icon-3.png);
+}
+ul.order-base i.icon-100 {
+    background-image: url(../Images/user-index-nav-order-icon-100.png);
+}
+ul.order-base li span.am-badge {
+    position: absolute;
+    top: -7px;
+    left: 55%;
+}
+
+
 /**
  * PC
  */
@@ -67,16 +129,16 @@
         display: block;
         line-height: 28px;
     }
-    .user-base-icon {
+    ul.user-base-icon {
         bottom: 20px;
         right: 10px;
     }
-    .user-base-icon li {
+    ul.user-base-icon li {
         float: left;
         padding: 5px 20px;
         text-align: center;
     }
-    .user-base-icon li p {
+    ul.user-base-icon li p {
         font-weight: 500;
     }
 }
@@ -113,13 +175,13 @@
         right: 10px;
         top: 10px;
     }
-    .user-base-icon {
+    ul.user-base-icon {
         left: 0;
         bottom: 0;
         width: 100%;
         padding: 5px 0;
     }
-    .user-base-icon li {
+    ul.user-base-icon li {
         float: left;
         width: 33.33%;
     }