wangshusheng / YOHOBUYPC · Commits

Go to a project

Authored by xuqi
Commit d0efe235a2f10ae872180764359994c014abe7a0 1 parent 9c9d6d49

build guang detail

Inline Side-by-side
Showing 19 changed files with 763 additions and 32 deletions
@@ -323,24 +323,19 @@ @@ -323,24 +323,19 @@
323 intro: '', 323 intro: '',
324 url: '' 324 url: ''
325 }, 325 },
326 - article: { 326 + detail: {
327 title: '', 327 title: '',
328 publishTime: '', 328 publishTime: '',
329 pageView: 3445, 329 pageView: 3445,
330 content: [ 330 content: [
331 { 331 {
332 - text: {  
333 - deps: ''  
334 - } 332 + text: ''
335 }, 333 },
336 { 334 {
337 - bigImage: {  
338 - src: ''  
339 - } 335 + bigImage: ''
340 }, 336 },
341 { 337 {
342 - smallImage: {  
343 - imgs: [ 338 + smallImage: [
344 { 339 {
345 src: '' 340 src: ''
346 }, 341 },
@@ -348,23 +343,30 @@ @@ -348,23 +343,30 @@
348 src: '' 343 src: ''
349 } 344 }
350 ] 345 ]
351 - }  
352 }, 346 },
353 { 347 {
354 - recommendation: {  
355 - list: [ 348 + //onlyOne
  349 + relatedReco: {
  350 + onlyOne: true, //若只有一个商品，传此字段为true
  351 + thumb: '',
  352 + name: '',
  353 + salePrice: 123,
  354 + price: 213,
  355 + url: ''
  356 + }
  357 +
  358 + //多个
  359 + relatedReco: [
356 {...}, //商品信息 360 {...}, //商品信息
357 ... 361 ...
358 ] 362 ]
359 - }  
360 }， 363 }，
361 { 364 {
362 - collocation: {  
363 - list: [ 365 + collocation: [
364 { 366 {
365 thumb: '', 367 thumb: '',
366 type: 'pants', 368 type: 'pants',
367 - products: [ 369 + goods: [
368 {...}, //商品信息 370 {...}, //商品信息
369 ... 371 ...
370 ] 372 ]
@@ -372,31 +374,27 @@ @@ -372,31 +374,27 @@
372 ... 374 ...
373 ] 375 ]
374 } 376 }
375 - }  
376 ] 377 ]
377 }, 378 },
378 - relatedBrands: {  
379 - list: [ 379 + relatedBrand: [
380 { 380 {
381 thumb: '', 381 thumb: '',
382 name: '', 382 name: '',
383 url: '' 383 url: ''
384 }, 384 },
385 ... 385 ...
386 - ]  
387 - },  
388 - tags: {  
389 - list: [ 386 + ],
  387 + relatedTag: [
390 { 388 {
391 name: '', 389 name: '',
392 url: '' 390 url: ''
393 }, 391 },
394 ... 392 ...
395 - ]  
396 - },  
397 - relatedArticles: [ 393 + ],
  394 + relatedInfo: [
398 { 395 {
399 thumb: '', 396 thumb: '',
  397 + squareThumb: true, //是否为方图
400 title: '', 398 title: '',
401 url: '', 399 url: '',
402 publishTime: '' 400 publishTime: ''
  1 +/**
  2 + * 逛详情页
  3 + * @author: xuqi<qi.xu@yoho.cn>
  4 + * @date: 2015/10/13
  5 + */
  6 +
  7 +var $ = require('yoho.zepto'),
  8 + ellipsis = require('mlellipsis'),
  9 + lazyLoad = require('yoho.lazyload');
  10 +
  11 +ellipsis.init();
  12 +
  13 +lazyLoad($('.lazy'));
  14 +
  15 +//title mlellipsis
  16 +$('.info-list .title, .one-good .reco-name').each(function() {
  17 + this.mlellipsis(2);
  18 +});
  1 +@import "guang/clothes/*.png";
  2 +$clothes: sprite-map("guang/clothes/*.png");
  3 +
  4 +@mixin retina-sprite($map, $sprite, $scale) {
  5 + $width: image-width(sprite-file($map, $sprite));
  6 + $height: image-height(sprite-file($map, $sprite));
  7 + $offsetY: ceil(nth(sprite-position($map, $sprite), 2) / $scale);
  8 + background: sprite-url($map) 0 $offsetY no-repeat;
  9 + $zoomX: ceil(image_width(sprite-path($map)) / $scale);
  10 + $zoomY: auto;
  11 + @include background-size($zoomX $zoomY);
  12 + display: block;
  13 +}
  14 +
  15 +@mixin relatedTitle {
  16 + margin: 0 29rem / $pxConvertRem;
  17 + background: #fff;
  18 + border: 1px solid #e0e0e0;
  19 + border-bottom: none;
  20 + line-height: 72rem / $pxConvertRem;
  21 + font-size: 30rem / $pxConvertRem;
  22 + color: #b0b0b0;
  23 + text-align: center;
  24 +}
  25 +
  26 +.guang-detail-page {
  27 + #wrapper.ios {
  28 + position: absolute;
  29 + top: 0;
  30 + bottom: 0;
  31 + left: 0;
  32 + right: 0;
  33 + overflow: hidden;
  34 + }
  35 +
  36 + .author {
  37 + border-bottom: 1px solid #e0e0e0;
  38 + background: #fff;
  39 +
  40 + > a {
  41 + display: block;
  42 + height: 100%;
  43 + }
  44 +
  45 + .avatar {
  46 + float: left;
  47 + margin-top: 20rem / $pxConvertRem;
  48 + margin-left: 30rem / $pxConvertRem;
  49 + width: 50rem / $pxConvertRem;
  50 + height: 50rem / $pxConvertRem;
  51 + @include border-radius(50%);
  52 + }
  53 +
  54 + .name {
  55 + float: left;
  56 + font-size: 28rem / $pxConvertRem;
  57 + color: #000;
  58 + padding: 30rem / $pxConvertRem;
  59 + margin-left: 30rem / $pxConvertRem 0;
  60 + }
  61 +
  62 + .intro {
  63 + float: left;
  64 + font-size: 28rem / $pxConvertRem;
  65 + color: #b0b0b0;
  66 + padding: 30rem / $pxConvertRem;
  67 + margin-left: 30rem / $pxConvertRem 0;
  68 + }
  69 + }
  70 +
  71 + .post-title {
  72 + padding: 16rem / $pxConvertRem 0 26rem / $pxConvertRem 30rem / $pxConvertRem;
  73 + background: #fff;
  74 +
  75 + .title {
  76 + line-height: 60rem / $pxConvertRem;
  77 + font-size: 40rem / $pxConvertRem;
  78 + color: #000;
  79 + font-weight: bold;
  80 + }
  81 + }
  82 +
  83 + .text-block {
  84 + padding: 20rem / $pxConvertRem 30rem / $pxConvertRem;
  85 + line-height: 46rem / $pxConvertRem;
  86 + font-size: 28rem / $pxConvertRem;
  87 + background: #fff;
  88 + color: #444;
  89 + }
  90 +
  91 + .big-img-block {
  92 + padding-bottom: 5rem / $pxConvertRem;
  93 + background: #fff;
  94 +
  95 + img {
  96 + width: 100%;
  97 + height: 640rem / $pxConvertRem;
  98 + }
  99 + }
  100 +
  101 + .small-img-block {
  102 + padding-bottom: 8rem / $pxConvertRem;
  103 + background: #fff;
  104 +
  105 + img {
  106 + float: right;
  107 + width: 315rem / $pxConvertRem;
  108 + height: 420rem / $pxConvertRem;
  109 +
  110 + &:first-child {
  111 + float: left;
  112 + }
  113 + }
  114 + }
  115 +
  116 + .collocation-block {
  117 + background: #fff;
  118 +
  119 + .thumb-container {
  120 + padding-top: 30rem / $pxConvertRem;
  121 + padding-left: 30rem / $pxConvertRem;
  122 + background: transparent image-url('guang/thumb-container-bg.png') no-repeat;
  123 + background-size: 100% 100%;
  124 +
  125 + &.fixed-top {
  126 + position: fixed;
  127 + left: 0;
  128 + right: 0;
  129 + top: 0;
  130 + }
  131 +
  132 + &.fixed-bottom {
  133 + position: fixed;
  134 + left: 0;
  135 + right: 0;
  136 + bottom: 0;
  137 + background: rgba(255,255,255,0.9);
  138 + }
  139 +
  140 + &.absolute {
  141 + position: absolute;
  142 + left: 0;
  143 + right: 0;
  144 + }
  145 +
  146 + &.static {
  147 + position: static;
  148 + }
  149 + }
  150 +
  151 + .thumb {
  152 + display: inline-block;
  153 + position: relative;
  154 + margin-right: 22rem / $pxConvertRem;
  155 + padding-bottom: 30rem / $pxConvertRem;
  156 +
  157 + &:last-child {
  158 + margin-right: 0;
  159 + }
  160 +
  161 + &.focus .thumb-img {
  162 + border-color: #000;
  163 + }
  164 + }
  165 +
  166 + .thumb-img {
  167 + height: 134rem / $pxConvertRem;
  168 + width: 96rem / $pxConvertRem;
  169 + border: 1px solid transparent;
  170 + }
  171 +
  172 + .good-list {
  173 + padding-left:15rem / $pxConvertRem;
  174 + }
  175 +
  176 + .clothe-type {
  177 + position: absolute;
  178 + right: 6rem / $pxConvertRem;
  179 + bottom: 34rem / $pxConvertRem;
  180 + width: 20px;
  181 + height: 20px;
  182 + @include border-radius(50%);
  183 +
  184 + &.bag {
  185 + @include retina-sprite ($clothes, bag, 80/20);
  186 + background-color: #fff;
  187 + background-size: 100%;
  188 + }
  189 +
  190 + &.cloth {
  191 + @include retina-sprite ($clothes, cloth, 80/20);
  192 + background-color: #fff;
  193 + background-size: 100%;
  194 + }
  195 +
  196 + &.dress {
  197 + @include retina-sprite ($clothes, dress, 80/20);
  198 + background-color: #fff;
  199 + background-size: 100%;
  200 + }
  201 +
  202 + &.headset {
  203 + @include retina-sprite ($clothes, headset, 80/20);
  204 + background-color: #fff;
  205 + background-size: 100%;
  206 + }
  207 +
  208 + &.lamp {
  209 + @include retina-sprite ($clothes, lamp, 80/20);
  210 + background-color: #fff;
  211 + background-size: 100%;
  212 + }
  213 +
  214 + &.pants {
  215 + @include retina-sprite ($clothes, pants, 80/20);
  216 + background-color: #fff;
  217 + background-size: 100%;
  218 + }
  219 +
  220 + &.shoe {
  221 + @include retina-sprite ($clothes, shoe, 80/20);
  222 + background-color: #fff;
  223 + background-size: 100%;
  224 + }
  225 +
  226 + &.swim-suit {
  227 + @include retina-sprite ($clothes, swim-suit, 80/20);
  228 + background-color: #fff;
  229 + background-size: 100%;
  230 + }
  231 +
  232 + &.under {
  233 + @include retina-sprite ($clothes, under, 80/20);
  234 + background-color: #fff;
  235 + background-size: 100%;
  236 + }
  237 +
  238 + &.watch {
  239 + @include retina-sprite ($clothes, watch, 80/20);
  240 + background-color: #fff;
  241 + background-size: 100%;
  242 + }
  243 + }
  244 + }
  245 +
  246 + .related-reco-block {
  247 + background: #fff;
  248 + padding-left: 15rem / $pxConvertRem;
  249 + border-top: 1px solid #e0e0e0;
  250 +
  251 + h2 {
  252 + margin-left: -15rem / $pxConvertRem;
  253 + line-height: 104rem / $pxConvertRem;
  254 + font-size: 30rem / $pxConvertRem;
  255 + color: #b0b0b0;
  256 + text-align: center;
  257 + }
  258 +
  259 + .one-good {
  260 + padding-left: 15rem / $pxConvertRem;
  261 + padding-right: 30rem / $pxConvertRem;
  262 + margin-bottom: 20rem / $pxConvertRem;
  263 +
  264 + .thumb {
  265 + float: left;
  266 + height: 134rem / $pxConvertRem;
  267 + width: 96rem / $pxConvertRem;
  268 + }
  269 +
  270 + .content-container {
  271 + padding-left: 120rem / $pxConvertRem;
  272 + height: 134rem / $pxConvertRem;
  273 + line-height: 1;
  274 + font-size: 24rem / $pxConvertRem;
  275 +
  276 + > p {
  277 + height: 50%;
  278 + line-height: 94rem / $pxConvertRem;
  279 + }
  280 +
  281 + span {
  282 + display: inline-block;
  283 + line-height: 24rem / $pxConvertRem;
  284 + }
  285 +
  286 + .price {
  287 + line-height: 47rem / $pxConvertRem;
  288 + }
  289 + }
  290 +
  291 + .sale-price {
  292 + color: #d62927;
  293 + line-height: 1.5;
  294 + }
  295 +
  296 + .sale-price.no-price {
  297 + color: #000;
  298 + }
  299 +
  300 + .market-price {
  301 + margin-left: 5rem / $pxConvertRem;
  302 + color: #b0b0b0;
  303 + text-decoration: line-through;
  304 + line-height: 1.5;
  305 + }
  306 +
  307 + .check-detail {
  308 + display: inline-block;
  309 + color: #000;
  310 + border: 1px solid;
  311 + border-radius: 2px;
  312 + float: right;
  313 + padding: 0 5px;
  314 + line-height: 1.5;
  315 + }
  316 + }
  317 + }
  318 +
  319 + .related-brand {
  320 + margin-top: 30rem / $pxConvertRem;
  321 +
  322 + h2 {
  323 + @include relatedTitle;
  324 + }
  325 +
  326 + .brand-list {
  327 + border-top: 1px solid #e0e0e0;
  328 + border-bottom: 1px solid #e0e0e0;
  329 + padding: 30rem / $pxConvertRem 0 30rem / $pxConvertRem;
  330 + background: #fff;
  331 + }
  332 +
  333 + .brand {
  334 + float: left;
  335 + width: 158rem / $pxConvertRem;
  336 + height: 128rem / $pxConvertRem;
  337 + border-right: 1px solid #e0e0e0;
  338 + margin-bottom: 10rem / $pxConvertRem;
  339 +
  340 + a {
  341 + display: block;
  342 + }
  343 +
  344 + &:nth-child(4n) {
  345 + border-right: none;
  346 + }
  347 + }
  348 +
  349 + .brand-logo {
  350 + display: table-cell;
  351 + width: 158rem / $pxConvertRem;
  352 + height: 94rem / $pxConvertRem;
  353 + vertical-align: middle;
  354 +
  355 + img {
  356 + display: block;
  357 + max-width: 158rem / $pxConvertRem;
  358 + max-height: 94rem / $pxConvertRem;
  359 + vertical-align: middle;
  360 + margin: 0 auto;
  361 + }
  362 + }
  363 +
  364 + .brand-name {
  365 + margin: 10rem / $pxConvertRem 0 0 0;
  366 + line-height: 24rem / $pxConvertRem;
  367 + font-size: 18rem / $pxConvertRem;
  368 + color: #babac2;
  369 + text-align: center;
  370 + text-decoration: none;
  371 + border-bottom: none;
  372 + overflow: hidden;
  373 + text-overflow: ellipsis;
  374 + white-space: nowrap;
  375 + }
  376 + }
  377 +
  378 + .related-tag {
  379 + position: relative;
  380 + padding-bottom: 30rem / $pxConvertRem;
  381 + border-bottom: 1px solid #e0e0e0;
  382 + background: #fff;
  383 +
  384 + .tag-bg {
  385 + position: absolute;
  386 + height: 40rem / $pxConvertRem;
  387 + width: 40rem / $pxConvertRem;
  388 + background: image-url('guang/tag.png') no-repeat;
  389 + background-size: 100% 100%;
  390 + top: 35rem / $pxConvertRem;
  391 + left: 20rem / $pxConvertRem;
  392 + }
  393 +
  394 + .tag-list {
  395 + margin-left: 50rem / $pxConvertRem;
  396 + }
  397 +
  398 + li {
  399 + float: left;
  400 + margin-top: 31rem / $pxConvertRem;
  401 + margin-left: 31rem / $pxConvertRem;
  402 + }
  403 +
  404 + a {
  405 + height: 50rem / $pxConvertRem;
  406 + line-height: 50rem / $pxConvertRem;
  407 + font-size: 30rem / $pxConvertRem;
  408 + color: #000;
  409 + text-decoration: underline;
  410 + white-space: nowrap;
  411 + }
  412 + }
  413 +
  414 + .related-info {
  415 + margin-top: 30rem / $pxConvertRem;
  416 +
  417 + h2 {
  418 + @include relatedTitle;
  419 + }
  420 +
  421 + .info-list {
  422 + background: #fff;
  423 + padding-bottom: 30rem / $pxConvertRem;
  424 + border-top: 1px solid #e0e0e0;
  425 + }
  426 +
  427 + li {
  428 + padding-top: 30rem / $pxConvertRem;
  429 + margin-bottom: 10rem / $pxConvertRem;
  430 +
  431 + a {
  432 + display: block;
  433 + }
  434 +
  435 + img {
  436 + float: left;
  437 + margin-left: 30rem / $pxConvertRem;
  438 + width: 182rem / $pxConvertRem;
  439 + height: 114rem / $pxConvertRem;
  440 +
  441 + &.square {
  442 + height: 182rem / $pxConvertRem;
  443 + }
  444 + }
  445 + }
  446 +
  447 + .title, .publish-time {
  448 + float: left;
  449 + width: 360rem / $pxConvertRem;
  450 + margin-left: 30rem / $pxConvertRem;
  451 + line-height: 40rem / $pxConvertRem;
  452 + color: #444;
  453 + font-size: 28rem / $pxConvertRem;
  454 +
  455 + }
  456 +
  457 + .publish-time {
  458 + font-size: 18rem / $pxConvertRem;
  459 + margin-top: 0;
  460 + color: #b0b0b0;
  461 +
  462 + .iconfont {
  463 + font-size: 18rem / $pxConvertRem;
  464 + }
  465 + }
  466 + }
  467 +}
1 -@import "tvls", "info", "plus-star", "info-list";  
  1 +@import "tvls", "info", "plus-star", "info-list", "detail";
  1 +{{>layout/header}}
  2 +<div class="guang-detail-page guang-page yoho-page">
  3 + {{# guang}}
  4 + <div id="wrapper">
  5 + <div id="scroller">
  6 + {{# author}}
  7 + <div class="author" data-id={{id}}>
  8 + <a class="clearfix" href={{url}}>
  9 + <img class="avatar" src={{avatar}}>
  10 + <span class="name">{{name}}</span>
  11 + <span class="intro">{{intro}}</span>
  12 + </a>
  13 + </div>
  14 + {{/ author}}
  15 +
  16 + {{# detail}}
  17 + <div class="detail">
  18 + <div class="post-title">
  19 + <p class="title">{{title}}</p>
  20 + {{> guang/tvls}}
  21 + </div>
  22 + <div class="post-content">
  23 + {{# content}}
  24 + {{#if text}}
  25 + <div class="post-block text-block">
  26 + {{text}}
  27 + </div>
  28 + {{/if}}
  29 +
  30 + {{#if bigImage}}
  31 + <div class="post-block big-img-block">
  32 + <img class="lazy" data-original={{bigImage}}>
  33 + </div>
  34 + {{/if}}
  35 +
  36 + {{#if smallImage}}
  37 + <div class="post-block small-img-block clearfix">
  38 + {{# smallImage}}
  39 + <img class="lazy" data-original={{src}}>
  40 + {{/ smallImage}}
  41 + </div>
  42 + {{/if}}
  43 +
  44 + {{#if collocation}}
  45 + <div class="post-block collocation-block">
  46 + <ul class="thumb-container">
  47 + {{#each collocation}}
  48 + <li class="thumb {{#if @first}}focus{{/if}}">
  49 + <img class="thumb-img lazy" data-original={{thumb}}>
  50 + <span class="clothe-type {{type}}"></span>
  51 + </li>
  52 + {{/each}}
  53 + </ul>
  54 + <div class="good-list clearfix">
  55 + {{#each collocation}}
  56 + <div class="prod {{#unless @first}}hide{{/unless}}">
  57 + {{# goods}}
  58 + {{> good}}
  59 + {{/ goods}}
  60 + </div>
  61 + {{/each}}
  62 + </div>
  63 + </div>
  64 + {{/if}}
  65 +
  66 + {{#if relatedReco}}
  67 + <div class="post-block related-reco-block clearfix">
  68 + <h2>相关推荐</h2>
  69 + {{#if relatedReco.onlyOne}}
  70 + {{#with relatedReco}}
  71 + <div class="one-good">
  72 + <img class="thumb lazy" data-original={{thumb}}>
  73 + <div class="content-container">
  74 + <p>
  75 + <span class="reco-name">{{name}}</span>
  76 + </p>
  77 + <p class="price">
  78 + <span class="sale-price {{^price}}no-price{{/price}}">￥{{salePrice}}</span>
  79 + {{#price}}
  80 + <span class="market-price">￥{{.}}</span>
  81 + {{/price}}
  82 + <a class="check-detail" href={{url}}>
  83 + 查看详情
  84 + </a>
  85 + </p>
  86 + </div>
  87 + </div>
  88 + {{/with}}
  89 + {{^}}
  90 + <div class="good-list clearfix">
  91 + {{# relatedReco}}
  92 + {{> good}}
  93 + {{/ relatedReco}}
  94 + </div>
  95 + {{/if}}
  96 + </div>
  97 + {{/if}}
  98 + {{/ content}}
  99 + </div>
  100 + </div>
  101 + {{/ detail}}
  102 +
  103 + {{#if relatedBrand}}
  104 + <div class="related-brand">
  105 + <h2>相关品牌</h2>
  106 + <ul class="brand-list clearfix">
  107 + {{# relatedBrand}}
  108 + <li class="brand">
  109 + <a href={{url}}>
  110 + <div class="brand-logo">
  111 + <img class="lazy" data-original={{thumb}}>
  112 + </div>
  113 + <p class="brand-name">{{name}}</p>
  114 + </a>
  115 + </li>
  116 + {{/ relatedBrand}}
  117 + </ul>
  118 + </div>
  119 + {{/if}}
  120 +
  121 + {{#if relatedTag}}
  122 + <div class="related-tag">
  123 + <div class="tag-bg"></div>
  124 + <ul class="tag-list clearfix">
  125 + {{# relatedTag}}
  126 + <li>
  127 + <a href={{url}}>{{name}}</a>
  128 + </li>
  129 + {{/ relatedTag}}
  130 + </ul>
  131 + </div>
  132 + {{/if}}
  133 +
  134 + {{#if relatedInfo}}
  135 + <div class="related-info">
  136 + <h2>相关文章</h2>
  137 + <ul class="info-list">
  138 + {{# relatedInfo}}
  139 + <li>
  140 + <a href={{url}}>
  141 + <img class="lazy {{#if squareThumb}}square{{/if}}" data-original={{thumb}}>
  142 + <span class="title">{{title}}</span>
  143 + <span class="publish-time">
  144 + <i class="iconfont">&#xe603;</i>
  145 + {{publishTime}}
  146 + </span>
  147 + </a>
  148 + </li>
  149 + {{/ relatedInfo}}
  150 + </ul>
  151 + </div>
  152 + {{/if}}
  153 + </div>
  154 + </div>
  155 + {{/ guang}}
  156 +</div>
  157 +{{> layout/footer}}
1 <?php 1 <?php
  2 +use Action\AbstractAction;
2 3
3 -/*  
4 - * To change this license header, choose License Headers in Project Properties.  
5 - * To change this template file, choose Tools | Templates  
6 - * and open the template in the editor.  
7 - */ 4 +class DetailController extends AbstractAction
  5 +{
8 6
  7 + public function indexAction()
  8 + {
  9 + $data = array(
  10 + 'id' => 1,
  11 + 'author' => array(
  12 + 'avatar' => 'http://7xidk0.com1.z0.glb.clouddn.com/avater.png',
  13 + 'name' => '山本耀司',
  14 + 'intro' => '日本设计界一代宗师,分享一些个人区委分享内容不求有用但求有趣区委分享内容不求有用但求有趣区委分享内容不求有用但求有趣区委分享内容不求有用但求有趣',
  15 + 'url' => ''
  16 + ),
  17 + 'detail' => array(
  18 + 'title' => 'Skin Art Series INN 2015新品',
  19 + 'publishTime' => '2月13日 12:34',
  20 + 'pageView' => 3445,
  21 + 'content' => array(
  22 + array(
  23 + 'text' => '复古风劲吹，在各路复古跑鞋嚣张跋扈的当下，历史悠久的Onitsuka也动作频频'
  24 + ),
  25 + array(
  26 + 'bigImage' => 'http://img10.static.yhbimg.com/yhb-img01/2015/06/11/15/017b3fa0478e26a3ded2ac75d341fe3ab6.jpg?imageView/2/w/640/h/640'
  27 + ),
  28 + array(
  29 + 'relatedReco' => array(
  30 + 'onlyOne' => true,
  31 + 'id' => 1,
  32 + 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/03/02/07/01ebfb219e22770ffb0c2c3a2cbb2b4bef.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
  33 + 'name' => 'GAWS DIGI 丛林数码印花拼接卫衣看看两行文字以上能不能切字啦，样式应该不会乱的吧',
  34 + 'isLike' => false,
  35 + 'price' => 1268,
  36 + 'salePrice' => 589,
  37 + 'url' => ''
  38 + )
  39 + ),
  40 + array(
  41 + 'collocation' => array(
  42 + array(
  43 + 'thumb' => 'http://7xidk0.com1.z0.glb.clouddn.com/clothe.png',
  44 + 'type' => 'pants',
  45 + 'goods' => array(
  46 + 'id' => 1,
  47 + 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/03/02/07/01ebfb219e22770ffb0c2c3a2cbb2b4bef.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
  48 + 'name' => 'GAWS DIGI 丛林数码印花拼接卫衣',
  49 + 'price' => 1268,
  50 + 'salePrice' => 589,
  51 + 'tags' => array(
  52 + array(
  53 + 'isNew' => true
  54 + )
  55 + ),
  56 + 'isFew' => true,
  57 + 'url' => ''
  58 + )
  59 + )
  60 + )
  61 + )
  62 + )
  63 + ),
  64 + 'relatedBrand' => array(
  65 + array(
  66 + 'thumb' => 'http://7xidk0.com1.z0.glb.clouddn.com/logo.png',
  67 + 'name' => 'HALFGIRL测试名字长的情况',
  68 + 'url' => ''
  69 + ),
  70 + array(
  71 + 'thumb' => 'http://7xidk0.com1.z0.glb.clouddn.com/logo.png',
  72 + 'name' => '黄伟文Wyman',
  73 + 'url' => ''
  74 + ),
  75 + array(
  76 + 'thumb' => 'http://7xidk0.com1.z0.glb.clouddn.com/logo.png',
  77 + 'name' => 'HIPANDA',
  78 + 'url' => ''
  79 + )
  80 + ),
  81 + 'relatedTag' => array(
  82 + array(
  83 + 'name' => '棒球服',
  84 + 'url' => ''
  85 + )
  86 + ),
  87 + 'relatedInfo' => array(
  88 + array(
  89 + 'thumb' => 'http://7xidk0.com1.z0.glb.clouddn.com/pant.png',
  90 + 'title' => '复古风劲吹，在各路复古跑鞋嚣张跋扈的当下，历史悠久的Onitsuka',
  91 + 'url' => '',
  92 + 'publishTime' => '2月13日 12:34'
  93 + )
  94 + )
  95 + );
  96 + $this->_view->assign('title', 'YOHO!有货');
  97 + $this->_view->display('index', array('modulePath' => 'guang/detail', 'guang' => $data));
  98 + }
  99 +}