Authored by 毕凯

个人中心增加公告

@@ -3,7 +3,8 @@ @@ -3,7 +3,8 @@
3 * @author: bikai<kai.bi@yoho.cn> 3 * @author: bikai<kai.bi@yoho.cn>
4 * @date: 2015/11/12 4 * @date: 2015/11/12
5 */ 5 */
6 -var $ = require('jquery'); 6 +var $ = require('jquery'),
  7 + noticeScroll = require('../plugin/notice-scroll');
7 var $userAvatar = $('.user-avatar'), 8 var $userAvatar = $('.user-avatar'),
8 $listItem = $('.list-item'); 9 $listItem = $('.list-item');
9 var myImage = new Image(), 10 var myImage = new Image(),
@@ -19,6 +20,8 @@ myImage.onload = function() { @@ -19,6 +20,8 @@ myImage.onload = function() {
19 $userAvatar.css('background-image', 'url(' + avatar + ')'); 20 $userAvatar.css('background-image', 'url(' + avatar + ')');
20 }; 21 };
21 22
  23 +noticeScroll('.notice');
  24 +
22 $('.yoho-page').on('touchstart', '.list-item, .type-item, .order-title', function() { 25 $('.yoho-page').on('touchstart', '.list-item, .type-item, .order-title', function() {
23 $listItem.removeClass('highlight'); 26 $listItem.removeClass('highlight');
24 $(this).addClass('highlight'); 27 $(this).addClass('highlight');
  1 +/**
  2 + * 公告栏目滚动
  3 + * bikai kai.bi@yoho.cn
  4 + */
  5 +
  6 +var $ = require('jquery');
  7 +
  8 +function noticeScroll(selecter, time) {
  9 + var $notice = $(selecter),
  10 + $noticeItem = $notice.find('.notice-item'),
  11 + count = $noticeItem.length,
  12 + i = 1;
  13 +
  14 + selecter = selecter || '.notice';
  15 + time = time || 3000;
  16 +
  17 + if (count > 1) {
  18 + setInterval(function() {
  19 + if (i >= count) {
  20 + i = 0;
  21 + }
  22 + $noticeItem.fadeOut();
  23 + $notice.find('.item-' + i).fadeIn();
  24 + i++;
  25 + }, time);
  26 + }
  27 +}
  28 +
  29 +module.exports = noticeScroll;
@@ -86,7 +86,6 @@ @@ -86,7 +86,6 @@
86 } 86 }
87 87
88 .my-link { 88 .my-link {
89 - margin-bottom: pxToRem(30px);  
90 padding: pxToRem(6px) 0; 89 padding: pxToRem(6px) 0;
91 text-align: center; 90 text-align: center;
92 background: rgba(0,0,0,0.8); 91 background: rgba(0,0,0,0.8);
@@ -133,6 +132,34 @@ @@ -133,6 +132,34 @@
133 } 132 }
134 } 133 }
135 134
  135 + .notice {
  136 + margin-bottom: pxToRem(30px);
  137 + padding: 0 pxToRem(30px);
  138 + background: #fff;
  139 + height: pxToRem(72px);
  140 + overflow: hidden;
  141 +
  142 + .notice-item {
  143 + display: block;
  144 + width: 100%;
  145 + font-size: pxToRem(24px);
  146 + line-height: pxToRem(72px);
  147 + color: #444;
  148 + white-space: nowrap;
  149 + overflow: hidden;
  150 + text-overflow: ellipsis;
  151 + }
  152 +
  153 + .notice-icon {
  154 + display: inline-block;
  155 + margin-right: pxToRem(10px);
  156 + width: pxToRem(28px);
  157 + height: pxToRem(28px);
  158 + @include rem-sprite($index, volume);
  159 + vertical-align: middle;
  160 + }
  161 + }
  162 +
136 .my-order { 163 .my-order {
137 margin-bottom: pxToRem(30px); 164 margin-bottom: pxToRem(30px);
138 border-top: 1px solid #e0e0e0; 165 border-top: 1px solid #e0e0e0;
@@ -206,17 +233,18 @@ @@ -206,17 +233,18 @@
206 padding: 0 pxToRem(30px); 233 padding: 0 pxToRem(30px);
207 font-size: 16px; 234 font-size: 16px;
208 line-height: pxToRem(88px); 235 line-height: pxToRem(88px);
  236 +
209 .opinion{ 237 .opinion{
210 width: 1.3rem; 238 width: 1.3rem;
211 height: 1.3rem; 239 height: 1.3rem;
212 overflow: hidden; 240 overflow: hidden;
213 display: inline-block; 241 display: inline-block;
214 - background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTkyQTQ3NkNCOEQ4MTFFNUIzNTY5MTI2NjU5ODYzQkQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTkyQTQ3NkJCOEQ4MTFFNUIzNTY5MTI2NjU5ODYzQkQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMkMzNzRFRkFFMEYxMUU1OEM0Q0U0Q0M3NkZCNzIyMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDMkMzNzRGMEFFMEYxMUU1OEM0Q0U0Q0M3NkZCNzIyMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhkYSdAAAAS0SURBVHja7FpZSFRhFL6TrUZJC0K2WFlmL0Y7thcjkWZlQfVQ0QJWD+09tEMb9BAkPlVQCYVESJtlhhbRJkVqiCHtqylRD5Ut0GLfyTPxe/zvvePM3JlJPPD537n33HPOd8+//7rq6uqM5iCtjGYizYZIa/rjcrn8MuJ2u/ugGAuMBgYD/YBoIEpR+wi8A54DlcAd4FZRUdErf3x7moaLLnwhguBjUSwGZgOJfsRSDpwGskHqZdCIgMBwFDuA6QGumr+BC8AuECpxjAgI9EaRyRlwWihDa0HodUCJgEQGiv1AJwu1x8B1oISvqe5/Ar4D7YHOALWlgQBldQJfm8lnYCPIHPabCAhEojgILDSxQ8EeAU7C4SMf2lk8ivnAMiapk+PACtj/6hMROIniOjtO8/4zYDdwAg5++luP4It6zwXAdqC/RuUmtUn4+tgkIjDcEcVVYJR4j4LeC+yD0e+BbhjwS1VwE7DVMzQocheYAr9fvCICYxEozgMpwtAbYC4MFTvd0hFDEopTQC/xKB+YgRh+SSK67nOzhsQDICkYJEjYTxL7VSWF42skDTKCLzGMUxih6DwFxsD4u2BPOxAPzQ5uA3HKbcrGKMRTapWRTEGC6mNqKEhwZshvKsfhkQiOUz9pBHtK23jxfA2MPQzlZJD9rxG3x3O82tnvaqFMk7qjYTK5PcrxGGbx/m0jycnJPXD9VjYsfI1L4TJNRwamca+lSkxhYWG1mpE0zYBXEGZLjgKOS5U0WbVk2ziHbITVGpjjOSfbiiQi1xM3wnQhKONKbLBChMRqBkC7FeFhnsLQuJMhV3qB0rGJK1ZmJEoovLf5MjnAVKALlzkO6ljFFWW3+fDbxuBYm9+B1PEqLg+RWnG/q43BRza/A6ljFVetJFItFOJtDC4Bavi6hn87pWMVV7UkUi4URtt0hbd5ik3bPr34tyM6NnGVy16Lps1zFIWZwE4bMjQLfREMHRGXKsUyI3lCYSi6xhHhNIBwPEPF7bwGRHjjoFQobQmzwVDGU6pueKjdb5ZQTMdXcIdJNiiOdHE7y2wan6Pp/rJho3uISZD/bE03naMlgjT9QLFevNATyIWxdiEiQX5zOQ5V1nO82owQmYsa9hOZTGSQSUQyiYmylnCchikRllVAhbhHG9aFMB4TJBKDuPpMF48qOD7DlgjY1vK2S5V4NAa4DyezHCZB9ss01amKV621tttBwuAAFFcM/Z4sLTm3wWhZAAnQGLFHs6dGQpvhw+HviXzg7SY2TR/OAGaDYz6vJ/Jl4/My+DYceIYJAY+Q7SHwUekTEaXnOACstHBEX+yyoRwrwOl7k65UPVagNUhnL3mT7UlyCe7LQc8kFIe8mBl75JvR+Hykg581cCmIHPOLCJOhSeYio377v28IhpYPQIKabatNbKuZ6k+ANsvieCvmLH9xf4TepyMMb7Zluxn1J2fe91pNHLjcRsPj6WiLVyjgf8fT9d+n6CvstMX1PGADNWwbt5PxzjWfq1YTyXnO2ck4eft7zm52hCben8LTpVQTlXuwM9JxIgH8IAko1nG7bK8ucUEk5r8hIrpt6v6Xc++3GkSyGxFpDtLy30EtRBySPwIMACKUEyE6TctsAAAAAElFTkSuQmCC");  
215 - background-size:100% 100%; 242 + @include rem-sprite($index, talk);
216 position: relative; 243 position: relative;
217 top: .36rem; 244 top: .36rem;
218 margin-right: pxToRem(12px); 245 margin-right: pxToRem(12px);
219 } 246 }
  247 +
220 &.highlight { 248 &.highlight {
221 background: #eee; 249 background: #eee;
222 } 250 }
1 $vip: sprite-map("me/vip/*.png", $spacing: 10px); 1 $vip: sprite-map("me/vip/*.png", $spacing: 10px);
2 $fav: sprite-map("me/fav/*.png", $spacing: 5px); 2 $fav: sprite-map("me/fav/*.png", $spacing: 5px);
  3 +$index: sprite-map("me/index/*.png", $spacing: 5px);
3 4
4 @import "home", "vip-grade", "order", "order-detail", "coupons", "personal-details", "yoho-coin", "fav", "suggest", "address", "online-service", "my-guang", "ihelp", "browse-record", "logistic", "pay","yoho-coin-new", "yoho-coin-detail"; 5 @import "home", "vip-grade", "order", "order-detail", "coupons", "personal-details", "yoho-coin", "fav", "suggest", "address", "online-service", "my-guang", "ihelp", "browse-record", "logistic", "pay","yoho-coin-new", "yoho-coin-detail";
@@ -33,6 +33,16 @@ @@ -33,6 +33,16 @@
33 <p>浏览记录</p> 33 <p>浏览记录</p>
34 </a> 34 </a>
35 </div> 35 </div>
  36 + {{#if notice}}
  37 + <div class="notice">
  38 + {{#notice}}
  39 + <a class="notice-item item-{{@index}}" href="{{url}}">
  40 + <span class="notice-icon"></span>
  41 + {{title}}
  42 + </a>
  43 + {{/notice}}
  44 + </div>
  45 + {{/if}}
36 <div class="my-order"> 46 <div class="my-order">
37 <a class="order-title" href="/home/orders"> 47 <a class="order-title" href="/home/orders">
38 我的订单 48 我的订单
@@ -51,6 +51,24 @@ class HomeController extends AbstractAction @@ -51,6 +51,24 @@ class HomeController extends AbstractAction
51 'myIndexPage' => true, 51 'myIndexPage' => true,
52 'showDownloadApp' => true, 52 'showDownloadApp' => true,
53 'navHome' => true, 53 'navHome' => true,
  54 + 'notice' => array(
  55 + array(
  56 + 'title' => '1. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容',
  57 + 'url' => 'http://www.yoho.cn'
  58 + ),
  59 + array(
  60 + 'title' => '2. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容',
  61 + 'url' => 'http://www.yoho.cn'
  62 + ),
  63 + array(
  64 + 'title' => '3. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容',
  65 + 'url' => 'http://www.yoho.cn'
  66 + ),
  67 + array(
  68 + 'title' => '4. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容',
  69 + 'url' => 'http://www.yoho.cn'
  70 + )
  71 + ),
54 'pageFooter' => true, 72 'pageFooter' => true,
55 'cartUrl' => Helpers::url('/cart/index/index', null), 73 'cartUrl' => Helpers::url('/cart/index/index', null),
56 'signinUrl' => Helpers::url('/signin.html', array('refer' => Helpers::url('/home'))), 74 'signinUrl' => Helpers::url('/signin.html', array('refer' => Helpers::url('/home'))),