fe / YOHOBUYPC · Commits

Go to a project

Authored by xuqi
Commit 9541f4e070d22aaa80a33cefb18059e6106beb65 2 parents 2c108053 5b306078

Merge branch 'develop' of http://git.dev.yoho.cn/web/yohobuy into develop

Inline Side-by-side
Showing 22 changed files with 1060 additions and 568 deletions
... ... @@ -18,18 +18,18 @@ class Yohobuy
{
// /* 正式环境 */
// const API_URL = 'http://api2.open.yohobuy.com/';
// const API_URL2 = 'http://api.open.yohobuy.com/';
// const SERVICE_URL = 'http://service.api.yohobuy.com/';
// const YOHOBUY_URL = 'http://www.yohobuy.com/';
// const API_URL = 'http://api2.open.yohobuy.com/';
// const API_URL2 = 'http://api.open.yohobuy.com/';
// const SERVICE_URL = 'http://service.api.yohobuy.com/';
// const YOHOBUY_URL = 'http://www.yohobuy.com/';
/* 测试环境 */
const API_URL = 'http://test2.open.yohobuy.com/';
const SERVICE_URL = 'http://test.service.api.yohobuy.com/';
const YOHOBUY_URL = 'http://www.yohobuy.com/';
const API_URL_MYCENTER = 'http://192.168.102.213:8080/api-gateway-web/'; // 我的个人中心接口URL
const API_URL_SHOPINGCART = 'http://192.168.102.213:8080/api-gateway-web/'; // 我的购物车接口URL
const API_URL_PRODUCTDETAIL = 'http://172.16.6.145:8080/'; // 商品详情页
const API_URL = 'http://test2.open.yohobuy.com/';
const SERVICE_URL = 'http://test.service.api.yohobuy.com/';
const YOHOBUY_URL = 'http://www.yohobuy.com/';
const API_URL_MYCENTER = 'http://192.168.102.213:8080/api-gateway-web/'; // 我的个人中心接口URL
const API_URL_SHOPINGCART = 'http://192.168.102.213:8080/api-gateway-web/'; // 我的购物车接口URL
const API_URL_PRODUCTDETAIL = 'http://172.16.6.145:8080/'; // 商品详情页
/**
* 私钥列表
... ...
... ... @@ -214,7 +214,7 @@ function tsAnimate() {
setTimeout(tsAnimate, 3000);
$('.home-header .search-btn').on('touchstart', function() {
$('.home-header .iconfont').on('touchstart', function() {
$(this).addClass('highlight');
}).on('touchend touchcancel', function() {
$(this).removeClass('highlight');
... ...
... ... @@ -83,6 +83,28 @@ $addressForm.on('submit', function() {
if (isSubmiting) {
return false;
}
// 简单的表单校验
if (!$(this).find('[name="consignee"]').val()) {
tip.show('收件人不能为空');
$(this).find('[name="consignee"]').focus();
return false;
}
if (!$(this).find('[name="mobile"]').val()) {
tip.show('手机号不能为空');
$(this).find('[name="mobile"]').focus();
return false;
}
if (!$(this).find('[name="area_code"]').val() || !$(this).find('[name="area"]').val()) {
tip.show('省市区不能为空');
return false;
}
if (!$(this).find('[name="address"]').val()) {
tip.show('地址不能为空');
$(this).find('[name="address"]').focus();
return false;
}
isSubmiting = true;
$.ajax({
method: 'POST',
... ...
... ... @@ -3,5 +3,12 @@
* @author: bikai<kai.bi@yoho.cn>
* @date: 2015/11/12
*/
var $ = require('jquery');
var $userAvatar = $('.user-avatar');
var myImage = new Image();
require('../product/recommend-for-you.js');
\ No newline at end of file
require('../product/recommend-for-you.js');
myImage.src = $userAvatar.attr('src');
myImage.onerror = function() {
$userAvatar.attr('src', 'http://static.dev.yohobuy.com/img/me/index/user-avatar.png');
};
... ...
/**
* 个人信息
* @author: bikai<kai.bi@yoho.cn>
* @date: 2015/11/19
*/
var $ = require('jquery');
var $userAvatar = $('.user-avatar');
var myImage = new Image();
myImage.src = $userAvatar.attr('src');
myImage.onerror = function() {
$userAvatar.attr('src', 'http://static.dev.yohobuy.com/img/me/index/user-avatar.png');
};
... ...
... ... @@ -24,8 +24,8 @@ goodsSwiper = new Swiper('.banner-swiper', {
loop: true,
paginationClickable: true,
pagination: '.banner-top .pagination-inner',
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev'
nextButton: '.my-swiper-button-next',
prevButton: '.my-swiper-button-prev'
});
... ...
... ... @@ -75,10 +75,10 @@
font-size: 40rem / $pxConvertRem;
line-height: 90rem / $pxConvertRem;
}
}
&.highlight {
background: rgba(200,200,200,.4);
}
.iconfont.highlight {
background: rgba(200,200,200,.4);
}
}
... ...
... ... @@ -153,6 +153,7 @@ a {
@import "home/index";
@import "category/index";
@import "product/index";
@import "product/comments-consults";
@import "index/index";
@import "shopping-cart/index";
@import "me/index"; //个人中心
... ...
.goods-comments-page{
.goods-comments{
.comment-item{
border: 1px solid $borderC;
padding: 0 pxToRem(28px);
.user-name{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
font-size: pxToRem(28px);
line-height: pxToRem(36px);
}
.goods-spec,
.detail-content{
color:$mainFontC;
}
.comment-time{
color:#c1c1c1;
}
}
}
}
.goods-consults-page{
.goto-consult{
padding: 0 pxToRem(28px);
height: pxToRem(120px);
background-color: #ffffff;
i,span{
line-height: pxToRem(120px);
font-size: pxToRem(28px);
color:$mainFontC;
}
.consult-logo{
padding-right: pxToRem(15px);
}
.enter-consult-page{
float: right;
color:$subFontC;
}
}
.goods-consults{
.consult-item{
padding: pxToRem(20px) pxToRem(28px);
background-color: #fff;
.question{
font-size: pxToRem(24px);
color:$mainFontC;
span{
display: block;
float: left;
font-size: inherit;
padding-right: pxToRem(15px);
}
p{
overflow: hidden;
padding-bottom: pxToRem(15px);
border-bottom: 1px solid $borderC;
}
}
.time{
font-size: pxToRem(22px);
color:$subFontC;
}
.answer{
font-size: pxToRem(24px);
line-height: pxToRem(36px);
color:$subFontC;
margin-top: pxToRem(14px);
span{
display: block;
float: left;
font-size: inherit;
color:$mainFontC;
padding-right: pxToRem(15px);
}
p{
overflow: hidden;
}
}
}
}
.gap-block{
min-height: 30rem/$pxConvertRem;
background-color: #f0f0f0;
}
}
.consult-form-page{
padding: pxToRem(28px);
text-align: center;
textarea{
box-sizing:border-box;
width: 100%;
height: pxToRem(400px);
font-size: pxToRem(28px);
padding:pxToRem(10px);
color:$mainFontC;
}
a{
display: inline-block;
height: pxToRem(80px);
width: pxToRem(360px);
color: #fff;
background-color: #444;
font-size: pxToRem(40px);
line-height: pxToRem(80px);
text-align: center;
margin-top: pxToRem(20px);
}
}
\ No newline at end of file
... ...
... ... @@ -4,536 +4,608 @@ $borderC:#e0e0e0;
$tableCellC:#eee;
$basicBtnC:#eb0313;
.good-detail-page {
overflow: hidden;
/* basic component */
.page-block{
box-sizing:border-box;
width: 100%;
border-bottom: 2px solid $borderC;
border-top: 1px solid $borderC;
padding: 0 pxToRem(28px);
>.title{
line-height: pxToRem(88px);
color: $mainFontC;
font-size : pxToRem(28px);
border-bottom: 1px solid $borderC;
span{
color:#a0a0a0;
font-size:pxToRem(18px);
}
}
.detail{
margin-top: pxToRem(20px);
margin-bottom: pxToRem(20px);
font-size: pxToRem(24px);
line-height: pxToRem(36px);
&.table{
display: table;
width: 100%;
.row{
display: table-row;
.column{
display: table-cell;
padding: 0.4em 0.8em;
border:1px solid #fff;
font-size: pxToRem(24px);
background-color: $tableCellC;
}
}
}
}
.my-swiper-button-prev,
.my-swiper-button-next {
position: absolute;
top: 50%;
width: pxToRem(48px);
height: pxToRem(48px);
margin-top: pxToRem(-44px);
cursor: pointer;
-moz-background-size: pxToRem(48px) pxToRem(48px);
-webkit-background-size: pxToRem(48px) pxToRem(48px);
background-size: pxToRem(48px) pxToRem(48px);
background-position: center;
background-repeat: no-repeat;
}
.next-grey {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23f0f0f0'%2F%3E%3C%2Fsvg%3E");
right: pxToRem(30px);
left: auto;
}
.gap-block{
min-height: 30rem/$pxConvertRem;
background-color: #f0f0f0;
.prev-grey {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23f0f0f0'%2F%3E%3C%2Fsvg%3E");
left: pxToRem(30px);
right: auto;
}
.banner-container{
position: relative;
// overflow: hidden;
.is-new-lable{
position: absolute;
left: pxToRem(108px);
top:pxToRem(40px);
height: pxToRem(35px);
width:pxToRem(70px);
color:#fff;
text-align: center;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
background-color: #7cd881;
z-index: 16;
}
}
.banner-top{
// width: 100%;
min-height: 660rem / $pxConvertRem;
overflow: hidden;
position: relative;
.swiper-pagination{
position:absolute;
bottom: pxToRem(40px);
.swiper-pagination-bullet {
margin-right: 2px;
.good-detail-page {
overflow: hidden;
.page-block{
box-sizing:border-box;
width: 100%;
border-bottom: 2px solid $borderC;
border-top: 1px solid $borderC;
padding: 0 pxToRem(28px);
>.title{
line-height: pxToRem(88px);
color: $mainFontC;
font-size : pxToRem(28px);
border-bottom: 1px solid $borderC;
span{
color:#a0a0a0;
font-size:pxToRem(18px);
}
.swiper-pagination-bullet-active {
background-color: #000;
}
}
}
.banner-swiper {
min-height: pxToRem(600px);
min-width: pxToRem(448px);
margin: pxToRem(30px) pxToRem(96px);
// position: relative;
overflow: hidden;
ul {
position: relative;
height: 100%;
li {
float: left;
height: 100%;
}
}
}
.goodsName {
min-height: pxToRem(83px);
font-size: pxToRem(28px);
color: #fff;
padding-left: pxToRem(25px);
padding-right: pxToRem(25px);
line-height: pxToRem(36px);
background-color: #515150;
}
.goodsSubtitle{
min-height: pxToRem(87px);
font-size: pxToRem(24px);
line-height: pxToRem(36px);
color:$subFontC;
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
border-bottom:1px solid $borderC;
background-color: #f4f4f4;
}
.price-date{
// width: 100%;
color:$subFontC;
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
border-bottom: 1px solid $borderC;
}
.detail{
margin-top: pxToRem(20px);
margin-bottom: pxToRem(20px);
font-size: pxToRem(24px);
line-height: pxToRem(36px);
&.table{
display: table;
width: 100%;
.row{
display: table-row;
.column{
display: table-cell;
padding: 0.4em 0.8em;
border:1px solid #fff;
font-size: pxToRem(24px);
background-color: $tableCellC;
}
}
}
}
}
.gap-block{
min-height: 30rem/$pxConvertRem;
background-color: #f0f0f0;
}
.banner-container{
position: relative;
// overflow: hidden;
.is-new-lable{
position: absolute;
left: pxToRem(108px);
top:pxToRem(40px);
height: pxToRem(35px);
width:pxToRem(70px);
color:#fff;
text-align: center;
font-size: pxToRem(20px);
line-height: pxToRem(35px);
background-color: #7cd881;
// z-index: 16;
}
}
.banner-top{
// width: 100%;
min-height: 660rem / $pxConvertRem;
overflow: hidden;
position: relative;
.swiper-pagination{
position:absolute;
bottom: pxToRem(40px);
.swiper-pagination-bullet {
margin-right: 2px;
}
.swiper-pagination-bullet-active {
background-color: #000;
}
}
}
.banner-swiper {
min-height: pxToRem(600px);
min-width: pxToRem(448px);
margin: pxToRem(30px) pxToRem(96px);
// position: relative;
overflow: hidden;
ul {
position: relative;
height: 100%;
li {
float: left;
height: 100%;
}
}
}
.goodsName {
min-height: pxToRem(83px);
font-size: pxToRem(28px);
color: #fff;
padding-left: pxToRem(25px);
padding-right: pxToRem(25px);
line-height: pxToRem(36px);
background-color: #515150;
}
.goodsSubtitle{
min-height: pxToRem(87px);
font-size: pxToRem(24px);
line-height: pxToRem(36px);
color:$subFontC;
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
border-bottom:1px solid $borderC;
background-color: #f4f4f4;
}
.price-date{
// width: 100%;
color:$subFontC;
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
border-bottom: 1px solid $borderC;
}
.goodsPrice{
float: left;
font-size: pxToRem(34.59px);
h1{
display: inline-block;
line-height: pxToRem(88px);
}
.currentPrice{
color:red;
margin-right: pxToRem(10px);
}
.previousPrice{
text-decoration:line-through;
}
}
.periodOfMarket{
font-size: pxToRem(24px);
float: right;
h1{
display: inline-block;
line-height: pxToRem(88px);
}
}
.goodsName,
.goodsSubtitle{
// width: 100%;
display:table;
span{
display: table-cell;
vertical-align: middle;
}
}
.goodsPrice{
float: left;
font-size: pxToRem(34.59px);
h1{
display: inline-block;
line-height: pxToRem(88px);
}
.currentPrice{
color:red;
margin-right: pxToRem(10px);
}
.previousPrice{
text-decoration:line-through;
}
}
.periodOfMarket{
font-size: pxToRem(24px);
float: right;
h1{
display: inline-block;
line-height: pxToRem(88px);
}
}
.goodsName,
.goodsSubtitle{
// width: 100%;
display:table;
span{
display: table-cell;
vertical-align: middle;
}
}
.vipLevel {
width: 100%;
box-sizing:border-box;
display: table;
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
font-size: pxToRem(22px);
color: #999999;
border-bottom: 1px solid $borderC;
span{
display: table-cell;
vertical-align: middle;
}
.vip-img{
padding-right: pxToRem(22px);
img{
width: pxToRem(52px);
height: pxToRem(32px);
}
}
.vip-price{
padding-right: pxToRem(55px);
}
.vip-price:last-child{
padding-right: 0;
}
}
.goodsDiscount{
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
font-size: pxToRem(28px);
color: $mainFontC;
line-height: pxToRem(88px);
border-bottom: 1px solid $borderC;
.iconfont{
display: inline-block;
width: pxToRem(35px);
font-size: pxToRem(45px);
float: right;
color:#e0e0e0;
// padding-left:pxToRem(50px);
}
}
.goodsSubtitle,
.goodsDiscount{
text-indent: pxToRem(-14px);
}
.feedback-list-page {
padding-top: pxToRem(30px);
background-color: #f0f0f0;
.nav-tab{
width: 100%;
}
.nav-tab {
height: pxToRem(60px);
padding: pxToRem(10px) 0;
background-color: #fff;
border-top: 1px solid $borderC;
border-bottom: 1px solid $borderC;
}
.comment-nav, .consult-nav {
box-sizing: border-box;
float: left;
width: 50%;
height: pxToRem(60px);
line-height: pxToRem(60px);
font-size: pxToRem(28px);
text-align: center;
color: #ccc;
&.focus {
color: #000;
}
}
.comment-nav {
border-right: 1px solid #ccc;
}
.comment-content{
.comment-content-main{
background-color: #fff;
border-bottom: 1px solid $borderC;
.user-name{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
padding-left: pxToRem(28px);
padding-right: pxToRem(18px);
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
font-size: pxToRem(28px);
line-height: pxToRem(36px);
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
padding-left: pxToRem(28px);
padding-right: pxToRem(18px);
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
font-size: pxToRem(28px);
line-height: pxToRem(36px);
}
.goods-spec,
.detail-content{
color:$mainFontC;
}
.detail-content,
.comment-time{
padding-left: pxToRem(28px);
}
.detail-content{
padding-right: pxToRem(28px);
padding-left: pxToRem(28px);
}
.detail-content{
padding-right: pxToRem(28px);
}
.comment-time{
color:#c1c1c1;
}
}
.comment-content-footer{
min-height: pxToRem(88px);
text-align: center;
background-color: #fff;
border-bottom: 1px solid $borderC;
line-height: pxToRem(88px);
font-size: pxToRem(28px);
a{
color: #e0e0e0;
.iconfont{
font-size: inherit;
}
}
}
.vipLevel {
width: 100%;
box-sizing:border-box;
display: table;
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
font-size: pxToRem(22px);
color: #999999;
border-bottom: 1px solid $borderC;
span{
display: table-cell;
vertical-align: middle;
}
.vip-img{
padding-right: pxToRem(22px);
img{
width: pxToRem(52px);
height: pxToRem(32px);
}
}
.vip-price{
padding-right: pxToRem(55px);
}
.vip-price:last-child{
padding-right: 0;
}
}
.goodsDiscount{
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
font-size: pxToRem(28px);
color: $mainFontC;
line-height: pxToRem(88px);
border-bottom: 1px solid $borderC;
.iconfont{
display: inline-block;
width: pxToRem(35px);
font-size: pxToRem(45px);
float: right;
color:#e0e0e0;
// padding-left:pxToRem(50px);
}
}
.goodsSubtitle,
.goodsDiscount{
text-indent: pxToRem(-14px);
}
.feedback-list-page {
padding-top: pxToRem(30px);
background-color: #f0f0f0;
.nav-tab{
width: 100%;
}
.nav-tab {
height: pxToRem(60px);
padding: pxToRem(10px) 0;
background-color: #fff;
border-top: 1px solid $borderC;
border-bottom: 1px solid $borderC;
}
.comment-nav, .consult-nav {
box-sizing: border-box;
float: left;
width: 50%;
height: pxToRem(60px);
line-height: pxToRem(60px);
font-size: pxToRem(28px);
text-align: center;
color: #ccc;
&.focus {
color: #000;
}
}
.comment-nav {
border-right: 1px solid #ccc;
}
.content{
.content-main{
background-color: #fff;
border-bottom: 1px solid $borderC;
&.comment-content-main{
.user-name{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
padding-left: pxToRem(28px);
padding-right: pxToRem(18px);
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
// font-size: pxToRem(28px);
// line-height: pxToRem(36px);
font-size: pxToRem(24px);
line-height: pxToRem(62px);
color:$mainFontC;
padding-left: pxToRem(28px);
padding-right: pxToRem(18px);
}
.goods-spec,
.comment-time{
font-size: pxToRem(24px);
line-height: pxToRem(62px);
}
.detail-content{
font-size: pxToRem(28px);
line-height: pxToRem(36px);
}
.goods-spec,
.detail-content{
color:$mainFontC;
}
.detail-content,
.comment-time{
padding-left: pxToRem(28px);
}
.detail-content{
padding-right: pxToRem(28px);
padding-left: pxToRem(28px);
}
.detail-content{
padding-right: pxToRem(28px);
}
.comment-time{
color:#c1c1c1;
}
}
&.consult-content-main{
padding-right: pxToRem(28px);
padding-left: pxToRem(28px);
padding-top: pxToRem(20px);
padding-bottom: pxToRem(20px);
.question{
font-size: pxToRem(24px);
color:$mainFontC;
span{
display: block;
float: left;
font-size: inherit;
padding-right: pxToRem(15px);
}
p{
overflow: hidden;
}
}
.time{
font-size: pxToRem(22px);
color:$subFontC;
}
.answer{
font-size: pxToRem(24px);
line-height: pxToRem(36px);
color:$subFontC;
margin-top: pxToRem(14px);
span{
display: block;
float: left;
font-size: inherit;
color:$mainFontC;
padding-right: pxToRem(15px);
}
p{
overflow: hidden;
}
}
}
}
}
.content.hide {
display: none;
}
}
.enter-store{
min-height: pxToRem(100px);
display: table;
a{
display: table-cell;
vertical-align: middle;
text-align: left;
}
.store-logo{
// padding-right: 35rem/$pxConvertRem;
img{
width: pxToRem(109px);
height: pxToRem(68px);
margin-left: 0;
margin-right: pxToRem(-25px);
}
}
.store-name{
font-size: pxToRem(34px);
color:$mainFontC;
}
.store-link{
font-size:pxToRem(28px) ;
color:$subFontC;
text-align: right;
span{
font-size: inherit;
}
}
}
.goods-desc{
.service{
width: pxToRem(489px);
height: pxToRem(28px);
margin-top: pxToRem(22px);
}
}
.tips{
color:$subFontC;
font-size: pxToRem(18px);
margin-top: pxToRem(20px);
}
.materials{
.detail{
img{
display: block;
overflow: hidden;
width: pxToRem(90px);
height: pxToRem(120px);
padding-right: pxToRem(20px);
float: left;
}
.material-desc{
font-size: pxToRem(24px);
overflow: hidden;
}
}
.material-type{
width: pxToRem(581px);
height: pxToRem(99px);
border-top: 1px solid $borderC;
padding: pxToRem(17px) 0;
}
}
.product-detail{
.detail{
img{
margin-top: pxToRem(20px);
width: pxToRem(581px);
height: pxToRem(772px);
}
}
margin-bottom: pxToRem(120px);
}
.detail-swiper{
.swiper-wrapper{
.swiper-slide{
width: pxToRem(114px);
div{
text-align: center;
&.cell{
font-size: pxToRem(24px);
background-color: $tableCellC;
padding:pxToRem(15px) 0;
border: 1px solid #fff;
}
}
}
}
}
#reference-swiper-container{
.first-group{
width: pxToRem(70px);
margin-top: pxToRem(66px);
.avatar{
line-height: pxToRem(40px);
width: pxToRem(40px);
height: pxToRem(40px);
margin: pxToRem(18px) 0;
}
}
}
.measurement-method{
.detail{
width: 100%;
// height: pxToRem(300px);
img{
float:left;
width: pxToRem(270px);
height: pxToRem(239px);
margin-top: pxToRem(18px);
margin-right: pxToRem(28px);
}
.right-part{
overflow: hidden;
.title{
>h1{
margin-top: pxToRem(10px);
display: inline-block;
padding-right: pxToRem(10px);
border-right: 1px solid $borderC;
line-height: 100%;
}
>span{
font-size: pxToRem(12px);
}
}
ul.items{
margin-top: pxToRem(20px);
padding: 0;
line-height: pxToRem(30px);
font-size: pxToRem(13px);
li{
span{
display: inline-block;
width: pxToRem(15px);
height: pxToRem(15px);
background-color: $basicBtnC;
border-radius: 50%;
color:#fff;
text-align: center;
line-height: pxToRem(15px);
font-size: pxToRem(13px);
margin-right: pxToRem(12px);
vertical-align: text-bottom;
}
}
.comment-content-footer,
.consult-content-footer{
min-height: pxToRem(88px);
text-align: center;
background-color: #fff;
border-bottom: 1px solid $borderC;
line-height: pxToRem(88px);
font-size: pxToRem(28px);
a{
color: #e0e0e0;
.iconfont{
font-size: inherit;
}
}
}
clear:both;
}
}
.cart-bar{
position: relative;
box-sizing:border-box;
width: 100%;
height: pxToRem(120px);
position:fixed;
bottom: 0;
background-color: #fff;
z-index: 64;
padding:pxToRem(20px) pxToRem(28px);
text-align: center;
a{
display: inline-block;
&.num-incart{
font-size: pxToRem(47px);
color:#444;
}
&.favorite{
font-size: pxToRem(34px);
color:$basicBtnC;
}
&.addto-cart{
height: pxToRem(80px);
width: pxToRem(260px);
margin:0 pxToRem(100px) 0 pxToRem(115px);
color: #fff;
background-color: $basicBtnC;
font-size: pxToRem(40px);
line-height: pxToRem(80px);
text-align: center;
}
}
.num-tag{
position: absolute;
left:pxToRem(66px);
height: pxToRem(20px);
display: block;
width: pxToRem(36px);
height: pxToRem(36px);
background-color: $basicBtnC;
border-radius: 50%;
color:#fff;
font-size: pxToRem(24px);
}
}
}
.content.hide {
display: none;
}
}
.enter-store{
min-height: pxToRem(100px);
display: table;
a{
display: table-cell;
vertical-align: middle;
text-align: left;
}
.store-logo{
// padding-right: 35rem/$pxConvertRem;
img{
width: pxToRem(109px);
height: pxToRem(68px);
margin-left: 0;
margin-right: pxToRem(-25px);
}
}
.store-name{
font-size: pxToRem(34px);
color:$mainFontC;
}
.store-link{
font-size:pxToRem(28px) ;
color:$subFontC;
text-align: right;
span{
font-size: inherit;
}
}
}
.goods-desc{
.service{
width: pxToRem(489px);
height: pxToRem(28px);
margin-top: pxToRem(22px);
}
}
.tips{
color:$subFontC;
font-size: pxToRem(18px);
margin-top: pxToRem(20px);
}
.materials{
.detail{
img{
display: block;
overflow: hidden;
width: pxToRem(90px);
height: pxToRem(120px);
padding-right: pxToRem(20px);
float: left;
}
.material-desc{
font-size: pxToRem(24px);
overflow: hidden;
}
}
.material-type{
width: pxToRem(581px);
height: pxToRem(99px);
border-top: 1px solid $borderC;
padding: pxToRem(17px) 0;
}
}
.product-detail{
.detail{
img{
margin-top: pxToRem(20px);
width: pxToRem(581px);
height: pxToRem(772px);
}
}
margin-bottom: pxToRem(120px);
}
.detail-swiper{
.swiper-wrapper{
.swiper-slide{
width: pxToRem(114px);
div{
text-align: center;
&.cell{
font-size: pxToRem(24px);
background-color: $tableCellC;
padding:pxToRem(15px) 0;
border: 1px solid #fff;
}
}
}
}
}
#reference-swiper-container{
.first-group{
width: pxToRem(70px);
margin-top: pxToRem(66px);
.avatar{
line-height: pxToRem(40px);
width: pxToRem(40px);
height: pxToRem(40px);
margin: pxToRem(18px) 0;
}
}
}
.measurement-method{
.detail{
width: 100%;
// height: pxToRem(300px);
img{
float:left;
width: pxToRem(270px);
height: pxToRem(239px);
margin-top: pxToRem(18px);
margin-right: pxToRem(28px);
}
.right-part{
overflow: hidden;
.title{
>h1{
margin-top: pxToRem(10px);
display: inline-block;
padding-right: pxToRem(10px);
border-right: 1px solid $borderC;
line-height: 100%;
}
>span{
font-size: pxToRem(12px);
}
}
ul.items{
margin-top: pxToRem(20px);
padding: 0;
line-height: pxToRem(30px);
font-size: pxToRem(13px);
li{
span{
display: inline-block;
width: pxToRem(15px);
height: pxToRem(15px);
background-color: $basicBtnC;
border-radius: 50%;
color:#fff;
text-align: center;
line-height: pxToRem(15px);
font-size: pxToRem(13px);
margin-right: pxToRem(12px);
vertical-align: text-bottom;
}
}
}
}
clear:both;
}
}
.cart-bar{
position: relative;
box-sizing:border-box;
width: 100%;
height: pxToRem(120px);
position:fixed;
bottom: 0;
background-color: #fff;
z-index:2;
padding:pxToRem(20px) pxToRem(28px);
text-align: center;
a{
display: inline-block;
&.num-incart{
font-size: pxToRem(47px);
color:#444;
}
&.favorite{
font-size: pxToRem(34px);
color:$basicBtnC;
}
&.addto-cart{
height: pxToRem(80px);
width: pxToRem(260px);
margin:0 pxToRem(100px) 0 pxToRem(115px);
color: #fff;
background-color: $basicBtnC;
font-size: pxToRem(40px);
line-height: pxToRem(80px);
text-align: center;
}
}
.num-tag{
position: absolute;
left:pxToRem(66px);
height: pxToRem(20px);
display: block;
width: pxToRem(36px);
height: pxToRem(36px);
background-color: $basicBtnC;
border-radius: 50%;
color:#fff;
font-size: pxToRem(24px);
}
}
}
... ...
... ... @@ -21,15 +21,15 @@
</div>
<div class="my-link clearfix {{^isLogin}}no-login{{/isLogin}}">
<a class="link-item" href="/home/favorite">
{{#if product_favorite_total}}{{product_favorite_total}}{{/if}}
{{#isLogin}}{{product_favorite_total}}{{/isLogin}}
<p>收藏的商品</p>
</a>
<a class="link-item" href="/home/favorite?tab=brand">
{{#if brand_favorite_total}}{{brand_favorite_total}}{{/if}}
{{#isLogin}}{{brand_favorite_total}}{{/isLogin}}
<p>收藏的品牌</p>
</a>
<a class="link-item" href="/home/">
{{#if product_browse}}{{product_browse}}{{/if}}
{{#isLogin}}{{product_browse}}{{/isLogin}}
<p>浏览记录</p>
</a>
</div>
... ...
{{> layout/header}}
<div class="personal-details">
<ul>
<li><span>头像</span><span><i class="head-portrait"><img src="{{ head_ico }}"></i></span></li>
<li><span>头像</span><span><i class="head-portrait"><img class="user-avatar" src="{{ head_ico }}"></i></span></li>
<li><span>昵称</span><span>{{ username }}</span></li>
<li><span>性别</span><span>{{ gender }}</span></li>
<li><span>生日</span><span>{{ birthday }}</span></li>
... ...
{{> layout/header}}
<div class="goods-comments-page yoho-page">
{{#comments}}
<div class="goods-comments">
{{#list}}
<div class="comment-item">
<span class="user-name">
{{userName}}
</span>
<span class="goods-spec">
{{desc}}
</span>
<p class="detail-content">
{{content}}
</p>
<span class="comment-time">
{{time}}
</span>
</div>
{{/list}}
</div>
{{/comments}}
</div>
{{> layout/footer}}
... ...
{{> layout/header}}
<div class="consult-form-page">
<form class="consult-form">
<textarea>这款衣服有WS吗？</textarea>
<a href="" type="submit">提交</a>
</form>
</div>
{{> layout/footer}}
\ No newline at end of file
... ...
{{> layout/header}}
<div class="goods-consults-page yoho-page">
<div class="goto-consult">
<i class="iconfont consult-logo">&#xe639;</i>
<span>我要咨询</span>
<i class="iconfont enter-consult-page">&#xe604;</i>
</div>
{{# consults}}
<div class="goods-consults">
{{#list}}
<div class="gap-block"></div>
<div class="consult-item">
<div class="question">
<span class="iconfont">&#xe639;</span>
<p>
{{question}}
<span class="time">
{{time}}
</span>
</p>
</div>
<div class="answer">
<span class="iconfont">&#xe63c;</span>
<p>{{answer}}</p>
</div>
</div>
{{/list}}
</div>
{{/ consults}}
</div>
{{> layout/footer}}
... ...
... ... @@ -47,15 +47,24 @@
</div>
{{/goodsDiscount}}
<div class="feedback-list-page ">
<div class="feedback-list ">
{{# feedbacks}}
{{#if nodata}}
<div class="nodata">
<span>暂无商品评价和咨询</span>
<a class="go-consult">我要咨询<i class="iconfont"><span class="iconfont">&#xe604;</span></a>
</div>
{{else}}
<ul id="nav-tab" class="nav-tab clearfix">
<li class="comment-nav focus">{{commentName}}</li>
<li class="consult-nav">{{consultName}}</li>
<li class="comment-nav focus">{{commentName}}({{commentsNum}})</li>
<li class="consult-nav">{{consultName}}({{consultsNum}})</li>
</ul>
<div id="feedback-content" >
<div class="comment-content content ">
<div class="comment-content-main">
{{#if commentsNum}}
<div class="comment-content-main content-main">
{{# comments}}
<span class="user-name">
{{userName}}
... ... @@ -71,16 +80,55 @@
</span>
{{/ comments}}
</div>
{{else}}
<div class="comment-content-main content-main no-item">
<span class="iconfont">&#xe63c;</span>暂无评论
</div>
{{/if}}
<div class="comment-content-footer">
<a href="{{moreComments}}">查看更多 <span class="iconfont">&#xe604;</span></a>
</div>
</div>
<div class="consult-content content hide">
{{# consults}}
<!-- {{> guang/ps_item}} -->
{{/ consults}}
<div class="consult-content content hide ">
{{#if consultsNum}}
<div class="consult-content-main content-main">
{{# consults}}
<div class="question">
<span class="iconfont">&#xe639;</span>
<p>{{question}}
<span class="time">
{{time}}
</span>
</p>
</div>
<div class="answer">
<span class="iconfont">&#xe63c;</span>
<p>{{answer}}</p>
</div>
{{/ consults}}
</div>
<div class="consult-content-footer">
<a href="{{moreConsults}}">
查看更多
<span class="iconfont">&#xe604;</span></a>
</div>
{{else}}
<div class="comment-content-main content-main no-item">
<span class="iconfont">&#xe63c;</span>暂无咨询
</div>
<div class="consult-content-footer">
<a href="{{gotoConsults}}">
我要咨询
<span class="iconfont">&#xe604;</span></a>
</div>
{{/if}}
</div>
</div>
{{/if}}
{{/ feedbacks}}
</div>
... ...
... ... @@ -163,6 +163,12 @@
seajs.use('js/product/detail/detail');
</script>
{{/if}}
{{!-- 商品详情评论 --}}
{{#if goodsCommentsPage}}
<script>
seajs.use('js/product/detail/comments');
</script>
{{/if}}
{{!-- 品类 --}}
{{#if categoryPage}}
<script>
... ... @@ -247,4 +253,9 @@
<script>
seajs.use('js/me/my-guang');
</script>
{{/if}}
{{#if personalDetailsPage}}
<script>
seajs.use('js/me/personal-details');
</script>
{{/if}}
\ No newline at end of file
... ...
... ... @@ -16,6 +16,6 @@
</div>
<!-- 如果需要导航按钮 -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev swiper-button-grey"></div>
<div class="swiper-button-next swiper-button-grey"></div>
</div>
\ No newline at end of file
... ...
... ... @@ -27,7 +27,8 @@ class HomeController extends AbstractAction
// {
// // 检查用户是否登录, 未登录则跳转到登录页
// $uid = $this->getUid(true);
// if (!$uid) {
// $action = $this->getRequest()->getActionName();
// if (!$uid && $action !== 'index') {
// $this->go(Helpers::url('/signin.html'));
// }
//
... ... @@ -43,18 +44,22 @@ class HomeController extends AbstractAction
$this->setTitle('个人中心');
$this->setNavHeader('个人中心');
// $uid = $this->getUid();
$uid = 8826435;
$data = \Index\UserModel::getUserProfileData($uid);
$data += \Index\UserModel::getInfoNumData($uid);
// 优选新品数据
$channel = Helpers::getChannelByCookie();
$data['recommendForYou'] = \Index\UserModel::getPreferenceData($channel);
// print_r($data);
$data = array(
'myIndexPage' => true,
'pageFooter' => true
);
// echo $this->getRequest()->getActionName();
$uid = $this->getUid();
if ($uid) {
$data['isLogin'] = true;
$uid = 8826435;
$data += \Index\UserModel::getUserProfileData($uid);
$data += \Index\UserModel::getInfoNumData($uid);
$data['myIndexPage'] = true;
$data['pageFooter'] = true;
// 优选新品数据
$channel = Helpers::getChannelByCookie();
$data['recommendForYou'] = \Index\UserModel::getPreferenceData($channel);
}
$this->_view->display('index', $data);
}
... ... @@ -127,6 +132,7 @@ class HomeController extends AbstractAction
// $uid = $this->getUid();
$uid = 967016;
$data = \Index\UserModel::getUserProfileData($uid);
$data['personalDetailsPage'] = true;
$data['pageFooter'] = true;
$this->_view->display('personal-details', $data);
}
... ... @@ -520,7 +526,7 @@ class HomeController extends AbstractAction
{
echo " ";
}
elseif ($page = 1)
elseif ($page == 1)
{
$order['walkwayUrl'] = self::strollAction();
}
... ...
... ... @@ -13,6 +13,10 @@ class DetailController extends AbstractAction
*/
public function indexAction()
{
$commentsNum = 0;
$consultsNum = 0;
$nodate =0;
$data = array (
'goodsDetailPage' => true,
'pageHeader' => array (
... ... @@ -20,6 +24,7 @@ class DetailController extends AbstractAction
'navHome' => 'sss ',
'navTitle' => '商品详情TEST'
),
'bannerTop' => array (
'list' => array (
array (
... ... @@ -65,11 +70,15 @@ SHOE BQT KEN BLOCK',
),
'goodsDiscount'=>'【summer final sale】满¥499立享6.8折',
'feedbacks'=>array(
'commentName'=>'商品评价(15)',
'consultName' =>'购买咨询(2)',
'commentsNum'=>0,
'consultsNum'=>0,
'nodata' =>0,
'commentName'=>'商品评价',
'consultName' =>'购买咨询',
'moreComments'=>'http://www.baidu.com',
'moreConsults'=>'http://www.baidu.com',
'gotoConsults'=>'http://www.baidu.com',
'comments'=>array(
array(
'userName'=>'Lynnic',
'desc'=>'购买了白色Mate7',
... ... @@ -79,8 +88,14 @@ SHOE BQT KEN BLOCK',
)
),
'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',
... ... @@ -224,9 +239,109 @@ SHOE BQT KEN BLOCK',
);
$this->_view->assign('title', '商品详情');
//$this->_view->display('brand', compact('brands'));
// $this->_view->display('brand', compact('brands'));
// 渲染模板
$this->_view->display('index', $data);
}
public function commentsAction(){
$data = array(
'goodsCommentsPage' =>true,
'pageHeader' => array (
'navBack' => 'sss ',
// 'navHome' => 'sss ',
'navTitle' => '购买评价（6）'
),
'pageFooter' => true,
'comments'=>array(
'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);
}
public function consultsAction(){
$data = array(
'goodsConsultsPage' =>true,
'pageHeader' => array (
'navBack' => 'sss ',
// 'navHome' => 'sss ',
'navTitle' => '购买咨询（6）'
),
'pageFooter' => true,
'consults'=>array(
'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的款式，由于版型和个人穿衣风格不同，需要'
)
)
),
);
$this->_view->assign('title', '购买咨询');
//$this->_view->display('brand', compact('brands'));
// 渲染模板
$this->_view->display('consults', $data);
}
public function consultformAction(){
$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', $data);
}
}
\ No newline at end of file
... ...