fe / YOHOBUYWAP · Commits

Go to a project

Authored by xuqi
Commit 7d7dcbe4568369b8d729f1a2d95e211375cc2f50 1 parent a4ccbe95

product opt banner

Inline Side-by-side
Showing 7 changed files with 203 additions and 4 deletions
@@ -219,7 +219,69 @@ @@ -219,7 +219,69 @@
219 </div> 219 </div>
220 220
221 <div class="opt-banner"> 221 <div class="opt-banner">
222 - 222 + {{# sortType}}
  223 + <a class="sort-type{{#if active}} active{{/if}}" href="{{href}}">
  224 + {{name}}
  225 + {{#if hasSortOrient}}
  226 + {{#if active}}
  227 + {{#if desc}}
  228 + <span class="active-icon iconfont">&#xe603;</span>
  229 + {{^}}
  230 + <span class="active-icon iconfont">&#xe604;</span>
  231 + {{/if}}
  232 + {{^}}
  233 + <span class="iconfont">&#xe614;</span>
  234 + {{/if}}
  235 + {{^}}
  236 + <span class="iconfont">&#xe604;</span>
  237 + {{/if}}
  238 + </a>
  239 + {{/ sortType}}
  240 +
  241 + {{# checks}}
  242 + <a class="checks{{#if checked}} checked{{/if}}" href="{{href}}">
  243 + {{#if checked}}
  244 + <span class="iconfont">&#xe612;</span>
  245 + {{^}}
  246 + <span class="iconfont">&#xe613;</span>
  247 + {{/if}}
  248 + {{name}}
  249 + </a>
  250 + {{/ checks}}
  251 +
  252 + <div class="pager">
  253 + <a class="line-count clearfix {{#if fivePerLine}}active{{/if}}" href="{{fivePerLineHref}}">
  254 + <span></span>
  255 + <span></span>
  256 + <span></span>
  257 + <span></span>
  258 + <span></span>
  259 + </a>
  260 +
  261 + <a class="line-count clearfix {{#if sixPerLine}}active{{/if}}" href="{{sixPerLineHref}}">
  262 + <span></span>
  263 + <span></span>
  264 + <span></span>
  265 + <span></span>
  266 + <span></span>
  267 + <span></span>
  268 + </a>
  269 +
  270 + <div class="page-count">
  271 + <span>
  272 + {{countPerPage}}
  273 + <i class="iconfont">&#xe604;</i>
  274 + </span>
  275 + 每页
  276 + <ul>
  277 + {{# pageCounts}}
  278 + <li>
  279 + <a href="{{href}}">{{count}}</a>
  280 + </li>
  281 + {{/ pageCounts}}
  282 + </ul>
  283 + </div>
  284 + </div>
223 </div> 285 </div>
224 286
225 <div class="goods-container"> 287 <div class="goods-container">
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > 2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
3 <svg xmlns="http://www.w3.org/2000/svg"> 3 <svg xmlns="http://www.w3.org/2000/svg">
4 <metadata> 4 <metadata>
5 -Created by FontForge 20120731 at Thu Nov 26 10:18:10 2015 5 +Created by FontForge 20120731 at Mon Nov 30 17:26:23 2015
6 By Ads 6 By Ads
7 </metadata> 7 </metadata>
8 <defs> 8 <defs>
@@ -16,10 +16,10 @@ Created by FontForge 20120731 at Thu Nov 26 10:18:10 2015 @@ -16,10 +16,10 @@ Created by FontForge 20120731 at Thu Nov 26 10:18:10 2015
16 ascent="896" 16 ascent="896"
17 descent="-128" 17 descent="-128"
18 x-height="792" 18 x-height="792"
19 - bbox="0 -214 1024 812" 19 + bbox="0 -214 1024 864"
20 underline-thickness="50" 20 underline-thickness="50"
21 underline-position="-100" 21 underline-position="-100"
22 - unicode-range="U+0078-E613" 22 + unicode-range="U+0078-E614"
23 /> 23 />
24 <missing-glyph horiz-adv-x="374" 24 <missing-glyph horiz-adv-x="374"
25 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" /> 25 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
@@ -77,5 +77,7 @@ d="M939 -212h-854q-23 0 -42.5 11.5t-31 31t-11.5 42.5v854q0 35 25 60t60 25h854q23 @@ -77,5 +77,7 @@ d="M939 -212h-854q-23 0 -42.5 11.5t-31 31t-11.5 42.5v854q0 35 25 60t60 25h854q23
77 M457 99q-5 -6 -13 -9t-17 -3q-21 0 -30 12l-171 171q-13 10 -13 30q0 18 12.5 30.5t30.5 12.5q10 0 17.5 -3.5t12.5 -9.5l141 -141l311 312q13 12 30 12q18 0 30.5 -12.5t12.5 -29.5q0 -21 -13 -30z" /> 77 M457 99q-5 -6 -13 -9t-17 -3q-21 0 -30 12l-171 171q-13 10 -13 30q0 18 12.5 30.5t30.5 12.5q10 0 17.5 -3.5t12.5 -9.5l141 -141l311 312q13 12 30 12q18 0 30.5 -12.5t12.5 -29.5q0 -21 -13 -30z" />
78 <glyph glyph-name="uniE613" unicode="&#xe613;" 78 <glyph glyph-name="uniE613" unicode="&#xe613;"
79 d="M877 812h-730q-61 0 -104 -43t-43 -104v-730q0 -61 43 -104t104 -43h730q61 0 104 43t43 104v730q0 61 -43 104t-104 43zM939 -65q0 -26 -18 -44t-44 -18h-730q-26 0 -44 18t-18 44v730q0 17 8.5 31t22.5 22.5t31 8.5h730q26 0 44 -18t18 -44v-730z" /> 79 d="M877 812h-730q-61 0 -104 -43t-43 -104v-730q0 -61 43 -104t104 -43h730q61 0 104 43t43 104v730q0 61 -43 104t-104 43zM939 -65q0 -26 -18 -44t-44 -18h-730q-26 0 -44 18t-18 44v730q0 17 8.5 31t22.5 22.5t31 8.5h730q26 0 44 -18t18 -44v-730z" />
  80 + <glyph glyph-name="uniE614" unicode="&#xe614;"
  81 +d="M160 996zM865 247q0 -18 -13 -31l-308 -308q-13 -13 -31 -13t-31 13l-309 308q-13 13 -13 31t13.5 31t30.5 13h617q18 0 31 -13t13 -31zM865 511q0 -18 -13 -31t-31 -13h-617q-18 0 -31 13t-13 31t13 31l309 309q13 13 31 13t31 -13l308 -309q13 -13 13 -31z" />
80 </font> 82 </font>
81 </defs></svg> 83 </defs></svg>
@@ -285,4 +285,83 @@ @@ -285,4 +285,83 @@
285 .multi .checkbox { 285 .multi .checkbox {
286 display: inline; 286 display: inline;
287 } 287 }
  288 +
  289 + .opt-banner {
  290 + height: 48px;
  291 + background: #f5f7f6;
  292 + line-height: 48px;
  293 +
  294 + .sort-type,
  295 + .checks {
  296 + color: #ccc;
  297 + font-size: 14px;
  298 + padding: 0 10px;
  299 +
  300 + .iconfont {
  301 + font-size: 14px;
  302 + }
  303 +
  304 + &.active,
  305 + &.checked {
  306 + color: #000;
  307 + }
  308 + }
  309 +
  310 + .pager {
  311 + float: right;
  312 + padding: 15px 0;
  313 + }
  314 +
  315 + .line-count {
  316 + float: left;
  317 + padding: 3px 1px 3px 3px;
  318 + border: 1px solid #ccc;
  319 + margin-right: 10px;
  320 +
  321 + span {
  322 + float: left;
  323 + width: 5px;
  324 + height: 10px;
  325 + background: #ccc;
  326 + margin-right: 2px;
  327 + }
  328 +
  329 + &.active {
  330 + border-color: #222;
  331 + span {
  332 + background: #222;
  333 + }
  334 + }
  335 + }
  336 +
  337 + .page-count {
  338 + position: relative;
  339 + height: 18px;
  340 + float: left;
  341 + font-size: 12px;
  342 + line-height: 18px;
  343 +
  344 + > span {
  345 + float: left;
  346 + display: block;
  347 + height: 10px;
  348 + line-height: 10px;
  349 + padding: 3px;
  350 + border: 1px solid #ccc;
  351 + color: #222;
  352 + font-size: 12px;
  353 + cursor: pointer;
  354 + margin-right: 10px;
  355 + }
  356 +
  357 + .iconfont {
  358 + font-size: 12px;
  359 + color: #ccc;
  360 + }
  361 +
  362 + > ul {
  363 + display: none;
  364 + }
  365 + }
  366 + }
288 } 367 }
@@ -238,6 +238,62 @@ class IndexController extends AbstractAction @@ -238,6 +238,62 @@ class IndexController extends AbstractAction
238 ) 238 )
239 ) 239 )
240 ) 240 )
  241 + ),
  242 + 'sortType' => array(
  243 + array(
  244 + 'href' => '',
  245 + 'name' => '默认'
  246 + ),
  247 + array(
  248 + 'active' => true,
  249 + 'href' => '',
  250 + 'name' => '最新',
  251 + 'hasSortOrient' => true,
  252 + 'desc' => true
  253 + ),
  254 + array(
  255 + 'href' => '',
  256 + 'name' => '价格',
  257 + 'hasSortOrient' => true
  258 + ),
  259 + array(
  260 + 'href' => '',
  261 + 'name' => '折扣',
  262 + 'hasSortOrient' => true
  263 + )
  264 + ),
  265 + 'checks' => array(
  266 + array(
  267 + 'name' => '新品',
  268 + 'checked' => true,
  269 + 'href' => ''
  270 + ),
  271 + array(
  272 + 'name' => '打折',
  273 + 'href' => ''
  274 + ),
  275 + array(
  276 + 'name' => '限量',
  277 + 'checked' => true,
  278 + 'href' => ''
  279 + )
  280 + ),
  281 + 'fivePerLine' => true,
  282 + 'fivePerLineHref' => '',
  283 + 'countPerPage' => '120',
  284 + 'pageCounts' => array(
  285 + array(
  286 + 'href' => '',
  287 + 'count' => 60
  288 + ),
  289 + array(
  290 + 'href' => '',
  291 + 'count' => 100
  292 + ),
  293 + array(
  294 + 'href' => '',
  295 + 'count' => 120
  296 + )
241 ) 297 )
242 ); 298 );
243 $this->_view->display('list', $data); 299 $this->_view->display('list', $data);