user index

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

@@ -26,7 +26,48 @@
     <!-- content start -->
     <div class="user-content">
         <div class="user-content-body">
-            ShopXO
+            <!-- 基础信息 -->
+            <div class="user-base">
+                <div class="user-base-left">
+                    <div class="user-avatar">
+                        <img src="<if condition="!empty($user['avatar'])">{{$user.avatar}}<else />__PUBLIC__/Home/{{$default_theme}}/Images/default-user-avatar.jpg</if>" />
+                        <p class="user-name">{{$user.user_name_view}}</p>
+                    </div>
+                    <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>
+                    </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">
+                        <a href="{{:U('Home/Order/Index')}}">
+                            <p>0</p>
+                            <p>订单总数</p>
+                        </a>
+                    </li>
+                    <li class="icon-items">
+                        <a href="{{:U('Home/UserFavor/Goods')}}">
+                            <p>0</p>
+                            <p>商品收藏</p>
+                        </a>
+                    </li>
+                    <li class="icon-items">
+                        <a href="{{:U('Home/History/Index')}}">
+                            <p>0</p>
+                            <p>我的足迹</p>
+                        </a>
+                    </li>
+                </ul>
+            </div>
+
+            <!-- 订单信息 -->
+            <div class="order-base">
+                order
+            </div>
         </div>
     </div>
     <!-- content end -->

service/Public/Home/Default/Css/Common.css

@@ -667,11 +667,11 @@ background:url(../Images/ibar_sprites.png) no-repeat;background-position:0px -23
 .user-content-body {-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto; }
 .user-offcanvas-bar { z-index: 900; }
 @media only screen and (min-width:640px) {
-    .user-sidebar {display:block;position:static;background:none; border-top: 5px solid #e94353;}
+    .user-sidebar {display:block;position:static;background:none; border-top: 5px solid #ED5564;}
     .user-offcanvas-bar {position:static;width:auto;background:none;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0);overflow-y:hidden;}
     .user-offcanvas-bar:after {content:none;}
     .user-main { padding: 0 5px; }
-    .user-content-body { padding: 0 5px 5px 10px; }
+    .user-content-body { padding: 0 0 5px 10px; }
 }
 @media only screen and (min-width: 1025px) {
     .user-main { padding: 0; }

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

@@ -1,3 +1,126 @@
+/**
+ * 用户中心
+ */
+.user-base {
+    -webkit-animation: changeBg 20s infinite;
+    -moz-animation: changeBg 20s infinite;
+    animation: changeBg 20s infinite;
+    background-color: #ED5564;
+    background-image: url(../Images/member_top_bg.png);
+    background-size: cover;
+    width: 100%;
+    position: relative;
+    padding: 20px 10px;
+    overflow: hidden;
+}
+.user-base p, .user-base span, .user-base a {
+    color: #fff;
+}
+.user-base a {
+    text-decoration: none;
+}
+.user-base-left, .user-base-right {
+    
+}
+.user-avatar {
+    text-align: center;
+}
+.user-avatar .user-name {
+    font-weight: 500;
+}
+.user-avatar img {
+    width: 80px;
+    height: 80px;
+    border-radius: 100%;
+}
+.user-avatar .user-name, .order-base {
+    margin-top: 5px;
+}
+
+.user-base-left .items a {
+    color: #f8f8f8;
+}
+
+.user-base-right a:not(:last-child) {
+    margin-right: 15px;
+}
+.user-base-icon {
+    background: rgba(0,0,0,0.1);
+    position: absolute;
+}
+
+
+/**
+ * PC
+ */
+@media only screen and (min-width: 641px) {
+    .user-base-left, .user-avatar, .user-base-left .items {
+        float: left;
+    }
+    .user-base-right {
+        float: right;
+    }
+    .user-base-left .items {
+        margin-left: 15px;
+    }
+    .user-base-left .items a {
+        display: block;
+        line-height: 28px;
+    }
+    .user-base-icon {
+        bottom: 20px;
+        right: 10px;
+    }
+    .user-base-icon li {
+        float: left;
+        padding: 5px 20px;
+        text-align: center;
+    }
+    .user-base-icon li p {
+        font-weight: 500;
+    }
+}
+
+/**
+ * 手机
+ */
 @media only screen and (max-width:640px)  {
-    .am-footer { padding-bottom: 55px; }
+    .am-footer {
+        padding-bottom: 55px;
+    }
+
+    .nav-search {
+        display: none;
+    }
+    .user-main {
+        padding-top: 0;
+    }
+    .user-content-body {
+        padding: 0;
+    }
+    .user-base {
+        text-align: center;
+        height: 210px;
+    }
+    .user-avatar {
+        margin-bottom: 10px;
+    }
+    .user-base-left .items a:not(:last-child) {
+        margin-right: 20px;
+    }
+    .user-base-right {
+        position: absolute;
+        right: 10px;
+        top: 10px;
+    }
+    .user-base-icon {
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        padding: 5px 0;
+    }
+    .user-base-icon li {
+        float: left;
+        width: 33.33%;
+    }
 }

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

@@ -1,3 +1,6 @@
+/**
+ * 登录/注册
+ */
 form.form-validation, .reg-switch-view { margin: 30px 0 60px 0; }
 .reg-switch-view .am-btn { width: 49%; line-height: 100px; font-size: 16px; }
 
@@ -5,18 +8,4 @@ form.form-validation, .reg-switch-view { margin: 30px 0 60px 0; }
 .reg-switch-tips { font-weight: 100; font-size: 12px; color: #f87689; margin-left: 20px; }
 #verify-win .am-modal-bd { margin-top: 10px; }
 #verify-win .am-modal-bd .base { overflow: hidden; }
-#verify-win .am-modal-bd .base .verify-tips { font-size: 12px; }
-
-/**
- * PC
- */
-@media only screen and (min-width: 641px) {
-
-}
-
-/**
- * 手机
- */
-@media only screen and (max-width: 641px) {
-
-}
+#verify-win .am-modal-bd .base .verify-tips { font-size: 12px; }