Authored by Lynnic

滚动页面固定咨询页面顶部&goodsSubtile不能超过两行 -- code reviewed by liangz

hifeng
... ... @@ -16,7 +16,9 @@ var consultFooterEle = document.getElementById('consult-content-footer'),
navtabHammer = navtabEle && new Hammer(navtabEle),
gotoConsultEle = document.getElementById('goto-consult'),
gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle);
gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle),
$gotoConsult = $('#goto-consult');
... ... @@ -78,3 +80,21 @@ if (gotoConsultHammer) {
location.href = $(gotoConsultEle).find('a').attr('href');
});
}
function fixConsultBar() {
if ($(window).scrollTop() > $('#yoho-header').outerHeight()) {
$gotoConsult.css('position', 'fixed');
$gotoConsult.css('top', '0');
} else {
$gotoConsult.css('position', 'static');
}
}
//滚动时顶部固定 我要咨询
function scrollHandler() {
fixConsultBar();
}
$(window).scroll(function() {
window.requestAnimationFrame(scrollHandler);
});
... ...
... ... @@ -15,7 +15,10 @@ var goodsSwiper,
var goodsDiscountEl = document.getElementById('goodsDiscount'),
goodsDiscountHammer = goodsDiscountEl && new Hammer(goodsDiscountEl);
var $cart = $('.cart-bar');
var $cart = $('.cart-bar'),
$goodsSubtitle = $('.goodsSubtitle'),
divH,
$goodsSubtitleSpan;
require('./desc');
require('./comments-consults');
... ... @@ -82,4 +85,12 @@ $.ajax({
}
});
//限制goodsSubtitle为两行
if ($goodsSubtitle[0]) {
divH = $goodsSubtitle.height();
$goodsSubtitleSpan = $goodsSubtitle.find('span');
while ($goodsSubtitleSpan.outerHeight() > divH) {
$goodsSubtitleSpan.text($goodsSubtitleSpan.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, '...'));
}
}
require('./like');
... ...
... ... @@ -41,6 +41,8 @@
.goods-consults-page {
background-color: #f0f0f0;
.goto-consult {
width: 100%;
box-sizing:border-box;
padding: 0 pxToRem(28px);
height: pxToRem(120px);
background-color: #ffffff;
... ...
... ... @@ -211,14 +211,19 @@ $basicBtnC:#eb0313;
background-color: #515150;
}
.goodsSubtitle {
min-height: pxToRem(87px);
height: pxToRem(88px);
font-size: pxToRem(24px);
line-height: pxToRem(36px);
color: $subFontC;
padding-left: pxToRem(28px);
padding-right: pxToRem(28px);
padding-top: pxToRem(14px);
border-bottom: 1px solid $borderC;
background-color: #f4f4f4;
span{
display: block;
line-height: pxToRem(36px);
margin: 0;
}
}
.price-date {
// width: 100%;
... ... @@ -253,8 +258,7 @@ $basicBtnC:#eb0313;
line-height: pxToRem(88px);
}
}
.goodsName,
.goodsSubtitle {
.goodsName {
// width: 100%;
display: table;
span {
... ...
<?php
use Action\AbstractAction;
use Plugin\Helpers;
use LibModels\Wap\Product\DetailData;
/**
* 商品详情的控制器
... ... @@ -18,185 +16,510 @@ class DetailController extends AbstractAction
*/
public function indexAction()
{
$productId = $this->param('productId');
if (!is_numeric($productId)) {
$this->error();
}
$goodsId = $this->param('goodsId');
if (!is_numeric($goodsId)) {
$this->error();
}
$productId = $this->param('productId', 123);
$goodsId = $this->param('goodsId', 3241);
$uid = $this->getUid();
$vipLevel = 0;
if (isset($this->_vip)) {
$vipLevel = Helpers::getVipLevel($this->_vip);
}
$data = \Product\DetailModel::getBaseInfo($productId, $goodsId, $uid, $vipLevel);
if (array() === $data) {
$this->error();
}
$data['goodsDetailPage'] = true;
$data['pageFooter'] = true;
if (isset($data['goodsName'])) {
$this->setTitle($data['goodsName']);
}
$this->setNavHeader('商品详情');
// $data = \Product\DetailModel::getBaseInfo($productId, $goodsId, $uid);
// $data['goodsDetailPage'] = true;
// if (isset($data['goodsName'])) {
// $this->setTitle($data['goodsName']);
// }
// $this->setNavHeader('商品详情');
$data = array (
'goodsDetailPage' => true,
'pageHeader' => array (
'navBack' => 'sss ',
'navHome' => 'sss ',
'navTitle' => '商品详情TEST'
),
'pageFooter' => true,
'bannerTop' => array (
'list' => array (
array (
'url' => '',
'img' => 'http://img13.static.yhbimg.com/goodsimg/2015/10/18/03/0250c3935f86dbd2baa7d45603d19fd637.jpg?imageMogr2/thumbnail/450x600/extent/450x600/background/d2hpdGU=/position/center/quality/90'
),
array (
'url' => '',
'img' => 'http://img11.static.yhbimg.com/goodsimg/2015/10/12/03/01bf4cf4444035a1930d33a9d0f8bff4fa.jpg?imageMogr2/thumbnail/450x600/extent/450x600/background/d2hpdGU=/position/center/quality/90'
),
array (
'url' => '',
'img' => 'http://img11.static.yhbimg.com/goodsimg/2015/10/12/03/01d7ef2f624eeea15e80bb374607aea317.jpg?imageMogr2/thumbnail/450x600/extent/450x600/background/d2hpdGU=/position/center/quality/90'
)
)
),
'goodsName' => 'Stussy No. 4 BOX TEE DC SPAR HIGH WC
SHOE BQT KEN BLOCK',
'goodsSubtitle'=>'【全民拼抢购】经典印花T恤,满4件免一件!全场低至
9.9元,拼购时代High起来。【全民拼抢购】经典印花T恤,满4件免一件!全场低至
9.9元,拼购时代High起来。',
'goodsPrice' =>array(
'currentPrice'=>'¥298.00',
'previousPrice'=>'¥598.00'
),
'periodOfMarket'=>'11月',
'goodsTitle' => '¥298.00',
'vipLevel' => array (
'list' => array (
array (
'img'=>'http://static.dev.yohobuy.com/img/product/silver.png',
'text' => '¥284.00'
),
array (
'img'=>'http://static.dev.yohobuy.com/img/product/golden.png',
'text' => '¥269.00'
),
array (
'img'=>'http://static.dev.yohobuy.com/img/product/platinum.png',
'text' => '¥263.00'
)
)
),
'goodsDiscount'=>array(
'list'=>array(
array(
'text' =>' 【summer final sale】满¥499立享6.8折'
),
array(
'text' =>' 【BACK TO SCHOOL】满¥499赠送Paul
Franke帽子一个,多买多送!'
),
array(
'text' =>' 【BACK TO SCHOOL】满¥499赠送Paul
Franke帽子一个,多买多送!'
)
)
),
'feedbacks'=>array(
'commentsNum'=>0,
'consultsNum'=>1,
// 'commentName'=>'商品评价',
// 'consultName' =>'购买咨询',
'link'=>'',
'comments'=>array(
array(
'userName'=>'Lynnic',
'desc'=>'购买了白色Mate7',
'content'=>'活动时买的,挺超值。上身效果也不错。质量
很好,买送人的,很满意。而且物流相当给...',
'time'=>'2014-08-12 10:24:26'
)
),
'consults'=>array(
array(
'question' =>'您好 我一米七七 140斤 穿M的行吗',
'time'=>'2014-08-12 10:24:26',
'answer'=>'您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
)
)
),
'enterStore'=>array(
'img'=>'http://static.dev.yohobuy.com/img/product/store.png',
'storeName'=>'Stussy',
'url'=>'http://stussy.m.yohobuy.com/'
),
'goodsDescription'=>array(
'title' =>'商品描述',
'enTitle'=>'DESCRIPTON',
'detail'=>array(
'list' =>array(
array(
'param'=>'编号:100101'
),
array(
'param'=>'编号:100101'
),
array(
'param'=>'编号:100101'
)
)
),
'desc'=>'fafdfafsafsafffffloremadfaffasfsfas 我fsadfasfasfsfdafasfffdasfasffa'
),
'sizeInfo'=>array(
'title' => '尺码信息',
'enTitle' =>'xSIZE INFO',
'detail' =>array(
'list'=>array(
array(
'params'=>array(
array(
'param' =>'M'
),
array(
'param' =>'XL'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'43'
),
array(
'param' =>'46'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'102'
),
array(
'param' =>'107'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'11'
),
array(
'param' =>'22'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'bb'
),
array(
'param' =>'cc'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'kk'
),
array(
'param' =>'bb'
),
array(
'param' =>'XXL'
)
)
)
)
)
),
'measurementMethod'=>array(
'title' => '测量方式',
'enTitle' =>'MEASUREMENT METHOD',
'img'=>'http://static.yohobuy.com/images/1.jpg'
),
'reference' => array(
'title' => '模特试穿',
'enTitle' =>'REFERENCE',
'detail' =>array(
'list'=>array(
array(
'params'=>array(
array(
'param' =>'M'
),
array(
'param' =>'http://static.dev.yohobuy.com/img/product/avatar1.png'
),
array(
'param' =>'http://static.dev.yohobuy.com/img/product/avatar2.png'
)
)
),
array(
'params'=>array(
array(
'param' =>'模特'
),
array(
'param' =>'Oliver'
),
array(
'param' =>'http://static.dev.yohobuy.com/img/product/avatar2.png'
)
)
),
array(
'params'=>array(
array(
'param' =>'102'
),
array(
'param' =>'107'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'11'
),
array(
'param' =>'22'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'bb'
),
array(
'param' =>'cc'
),
array(
'param' =>'XXL'
)
)
),
array(
'params'=>array(
array(
'param' =>'kk'
),
array(
'param' =>'bb'
),
array(
'param' =>'XXL'
)
)
)
)
)
),
'materials' => array(
'title' => '商品材质',
'enTitle' =>'MATERIALS',
'list' => array(
array(
'img' => 'http://static.dev.yohobuy.com/img/product/material.png',
'desc' =>'用各种洗涤剂,可手洗机洗,但不宜氯漂,宜阴干,避免曝晒,以免深色衣物褪色,在日光下晾晒时,将里面朝外。浸泡时间不能太长,避免褪色,深色与浅色衣服最好请分开洗涤,避免染色。'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/material.png',
'desc' =>'用各种洗涤剂,可手洗机洗,但不宜氯漂,宜阴干,避免曝晒,以免深色衣物褪色,在日光下晾晒时,将里面朝外。浸泡时间不能太长,避免褪色,深色与浅色衣服最好请分开洗涤,避免染色。'
)
)
),
'washTips' => array(
'list' => array(
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
),
array(
'img' => 'http://static.dev.yohobuy.com/img/product/washtips/washtip-1.png',
'caption'=>'不可干燥不可干洗'
)
)
),
'productDetail' =>array(
'title' => '商品详情',
'enTitle' =>'DETAILS',
'desc' => 'Married to the MOB是由Leah McSweeney创立的女装品牌,一向标榜不羁、大胆的女性streetwear设计。喜欢恶搞的女生们,赶紧入手吧。',
'list' => array (
array('img' =>'http://static.dev.yohobuy.com/img/product/product.png'),
array('img' =>'http://static.dev.yohobuy.com/img/product/product.png')
)
),
'cartInfo' =>array(
'numInCart' => 3,
'notForSale'=>1
)
);
// 渲染模板
$this->_view->display('index', $data);
}
/**
* 尺码描述信息
*/
public function introAction()
{
$productSkn = $this->param('productSkn');
if (!is_numeric($productSkn)) {
$this->error();
}
$data = \Product\DetailModel::getSizeInfo($productSkn);
if (array() === $data) {
echo ' ';
exit();
}
$this->_view->display('intro', $data);
}
/**
* 购买评价列表
*
* @param int productId
* @param int total
*/
public function commentsAction()
{
$productId = $this->get('product_id', 0);
$total = $this->get('total');
if (!is_numeric($total)) {
$total = 0;
}
if ($total) {
$this->setNavHeader('购买评价(' . $total . ')');
} else {
$this->setNavHeader('购买评价');
}
$this->setTitle('购买评价');
$data = array(
'goodsCommentsPage' => true,
'pageHeader' => array(
'navBack' => 'sss ',
// 'navHome' => 'sss ',
'navTitle' => '购买评价(6)'
),
'pageFooter' => true,
'comments' => array(
'list' => \Product\DetailModel::getConsults($productId),
'list' => array(
array(
'userName' => 'Lynnic',
'desc' => '购买了白色Mate7',
'content' => '活动时买的,挺超值。上身效果也不错。质量
很好,买送人的,很满意。而且物流相当给...',
'time' => '2014-08-12 10:24:26'
),
array(
'userName' => 'Lynnic',
'desc' => '购买了白色Mate7',
'content' => '活动时买的,挺超值。上身效果也不错。质量
很好,买送人的,很满意。而且物流相当给...',
'time' => '2014-08-12 10:24:26'
),
array(
'userName' => 'Lynnic',
'desc' => '购买了白色Mate7',
'content' => '活动时买的,挺超值。上身效果也不错。质量
很好,买送人的,很满意。而且物流相当给...',
'time' => '2014-08-12 10:24:26'
)
)
),
);
$this->_view->assign('title', '购买评价');
//$this->_view->display('brand', compact('brands'));
// 渲染模板
$this->_view->display('comments', $data);
}
/**
* 购买咨询列表
*
* @param int productId
* @param int total
*/
public function consultsAction()
{
$productId = $this->get('product_id', 0);
$total = $this->get('total', 0);
if (!is_numeric($total)) {
$total = 0;
}
if ($total) {
$this->setNavHeader('购买咨询(' . $total . ')');
} else {
$this->setNavHeader('购买咨询');
}
$this->setTitle('购买咨询');
$data = array(
'goodsConsultsPage' => true,
'pageHeader' => array(
'navBack' => 'sss ',
// 'navHome' => 'sss ',
'navTitle' => '购买咨询(6)'
),
'pageFooter' => true,
'consults' => array(
'list' => \Product\DetailModel::getConsults($productId),
'list' => array(
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
),
array(
'question' => '您好 我一米七七 140斤 穿M的行吗',
'time' => '2014-08-12 10:24:26',
'answer' => '您好,建议您参考XL的款式,由于版型和个人穿衣风格不同,需要'
)
)
),
'link' => Helpers::url('/product/detail/consultform', array('product_id' => $productId)),
);
$this->_view->assign('title', '购买咨询');
//$this->_view->display('brand', compact('brands'));
// 渲染模板
$this->_view->display('consults', $data);
}
/**
* 我要咨询表单
*/
public function consultformAction()
{
$uid = $this->getUid();
if (!$uid) {
$this->go(Helpers::url('/signin.html', array('refer' => $this->server('HTTP_REFERER', '/'))));
}
$this->setTitle('我要咨询');
$this->setNavHeader('我要咨询');
$productId = $this->get('product_id', 0);
$data = array(
'consultform' => true,
'pageHeader' => array(
'navBack' => 'sss ',
// 'navHome' => 'sss ',
'navTitle' => '我要咨询'
)
);
$this->_view->assign('title', '我要咨询');
//$this->_view->display('brand', compact('brands'));
// 渲染模板
$this->_view->display('consultform', array(
'consultformPage' => true,
'productId' => $productId,
'formUrl' => Helpers::url('/product/detail/consultsubmit'),
));
}
/**
* 添加咨询操作
*
* @param int product_id 商品ID
* @param string content 咨询内容
* @return json
*/
public function consultsubmitAction()
{
$result = array('code' => 400, 'message' => '请输入咨询内容', 'data' => '');
if ($this->isAjax()) {
$uid = $this->getUid();
$productId = $this->post('product_id', 0);
$content = $this->post('content');
$result = DetailData::addConsult($uid, $productId, $content);
}
$this->echoJson($result);
}
/**
* 为你优选
*
* @param int productSkn 商品SKN号
* @return json
*/
public function preferenceAction()
{
$result = array();
if ($this->isAjax()) {
$productSkn = $this->get('productSkn');
$brandId = $this->get('brandId');
$channel = Helpers::getChannelByCookie();
$result = \Product\DetailModel::getPreference($productSkn, $channel, $brandId);
}
if (empty($result)) {
echo ' ';
} else {
$this->_view->display('preference', $result);
}
$this->_view->display('consultform', $data);
}
}
... ...