fe / YOHOBUYPC · Commits

Go to a project

Authored by xiaowei
Commit 3b740bfad88914d23feeaf379b6f3276aa5fc325 1 parent e193115a

HIT拆单相关代码合并

Inline Side-by-side
Showing 8 changed files with 2553 additions and 2375 deletions

Too many changes to show.
Reload with full diff Plain diff Email patch

To preserve performance only 8 of 8+ files are displayed.

... ... @@ -503,5 +503,13 @@ class ChannelConfig
public static $completeType = 5; //已完成订单
public static $cancelType = 7; //取消订单
public static $historyType = 8; //历史订单
//order标签
public static $orderTagArr = array(
'gift' => array('name' => '赠品','classname' => 'freebie-tag'),
'price_gift' => array('name' => '加价购','classname' => 'advance-buy-tag'),
'advance' => array('name' => '预售','classname' => 'presall-tag'),
'ticket' => array('name' => '虚拟商品','classname' => 'virtual-good-tag')
);
}
... ...
... ... @@ -3,5 +3,91 @@
* @author: xuqi<qi.xu@yoho.cn>
* @date: 2016/2/17
*/
var $ = require('yoho.jquery');
require('./order-block');
\ No newline at end of file
require('./order-block');
//不同订单包裹提示
$('.why').click(function() {
$('#differentBag').show();
return false;
});
$('#differentBag').click(function() {
return false;
});
$(document).click(function() {
$('#differentBag').hide();
});
//订单包裹左右切换
function lunBo($pre, $next, $ul, $iWidth) {
var i = 1,
j = 1;
var iSpeed = 0,
isMoving = false;
$pre.click(function() {
if (isMoving) {
return;
}
if ($ul.css('left') === '0px') {
iSpeed = 0;
} else {
iSpeed += j * $iWidth;
isMoving = true;
}
$ul.stop().animate({
left: iSpeed
}, 300, function() {
isMoving = false;
});
});
$next.click(function() {
var $largeLeft = $ul.parent().width() - $ul.width() + 'px';
if (isMoving) {
return;
}
if ($ul.css('left') === $largeLeft) {
$ul.css('left', $largeLeft);
} else {
iSpeed += -i * $iWidth;
isMoving = true;
}
$ul.stop().animate({
left: iSpeed
}, 300, function() {
isMoving = false;
});
});
}
//订单分类
$('.bag').find('ul').each(function() {
var $pre = $(this).parent().parent().find('.pre');
var $next = $(this).parent().parent().find('.next');
var $iWidth = $(this).find('li').eq(0).width();
var $length = $(this).find('li').size();
var $ulWidth = $iWidth * $length;
$(this).css('width', $ulWidth);
if ($length > 5) {
$pre.show();
$next.show();
lunBo($pre, $next, $(this), $iWidth);
} else {
$pre.hide();
$next.hide();
}
});
... ...
/**
* @description: 订单保存
* @time: 2015/12/21
*/
var $ = require('yoho.jquery');
var address = require('./address');
var dialog = require('../common/dialog');
var Order = {
/*业务数据(人民币)*/
Data: {
product: 0,//商品价格
activity: 0,//活动
carriage: 0,//邮费
juan: 0,//优惠卷
yohocoin: 0//YOHO币
},
/*view 交互*/
UI: {
e: {
$pan: $('.pan'),
$jc: $('#juancode'),
$bp: $('#biprice'),
$statistics: $('li', '.play-total'),
$tobi: $('p em', '.play-bi-pan .play-pan'),
$cancel: $('.cancel', '.btn-group'),
$total: $('em', '.to-play'),
$tbody: $('table tbody', '.pay-wapper'),
//请填写并核对一下信息
$orderSelectionSave: $('.address-list h2 span'),
$addAddress: $('.add-address'),
$addressManage: $('.address-manage'),
$spanPayTypeLegend: $('span.pay-type-legend'),
$supportType: $('.support-type'),
$existAddressListWrap: $('.exist-address-list'),
$existAddressList: $('.exist-address-list').find('li'),
$existAddress: $('.exist-address-list').find('input[name="exist-address"]'),
$payTimeModify: $('.pay-time-modify'),
$switchPayModify: $('.switch-pay-modify'),
$modityPayInfo: $('.modity-pay-info'),
$payTotal: $('.play-total'),
$toPay: $('.to-play em'),
$redEnvelopes: $('.red-envelopes'),
$useEnvelopes: $('.use-envelopes'),
$hasEnvelopes: $('.has-envelopes span'),
$useEnvelopesInput: $('.use-envelopes').find('input')
},
init: function() {
var e = this.e,
d = Order.Data,
c = Order.Common;
//初始化产品价格(表格中的价格)
e.$tbody.find('tr').each(function(index) {
var td = $(this).find('td');
var len = e.$tbody.find('tr').length;
var subtotal = parseFloat(td.eq(1).html()) * parseInt(td.eq(3).html());
td.eq(1).html('￥' + td.eq(1).html());
if (td.hasClass('xforone')) {
td.eq(4).find('del').html('￥' + c.strFixed(subtotal));
subtotal = 0;
} else {
td.eq(4).html('￥' + c.strFixed(subtotal));
}
d.product += subtotal;
if (!index) {
td.last().attr('rowspan', len);
} else {
td.last().remove();
}
if (index === len - 1) {
e.$tbody.find('tr').eq(0).find('td').last().html('<strong>￥' + c.strFixed(d.product) + '</strong>');
}
});
// 使用优惠券、使用yoho币点击展开
e.$pan.find('dt').click(function() {
var pan = $(this).parent('dl.pan');
if (pan.find('dd').is(':hidden')) {
c.winShow(pan);
$(this).addClass('active');
} else {
c.winHide(pan);
$(this).removeClass('active');
}
});
//请填写并核对一下信息
e.$orderSelectionSave.click(function() {
var i = 0,
$addressLi = $('.exist-address-list li'),
liLen = $addressLi.length,
notSelect = 0;
if (!$(this).attr('expand')) {
$(this).attr('expand', 'expand').text('[不保存并关闭]');
$('.exist-address-list li').removeClass('hide');
$('.save-btn').removeClass('hide');
e.$existAddressListWrap.addClass('address-expand');
if (liLen === 1) {
e.$addressManage.removeClass('hide');
}
} else {
for (i = 0; i < liLen; i++) {
if ($addressLi.eq(i).hasClass('address_select')) {
notSelect++;
}
if (!$addressLi.eq(i).hasClass('address_select')) {
$addressLi.eq(i).addClass('hide');
}
}
if (notSelect === 0) {
$('.exist-address-list li:not(".use-new-address")').removeClass('hide');
$('.use-new-address input').removeAttr('checked');
}
$('.address-list-inner li.address_select input').attr('checked', 'checked');
$('.address-list-inner li').removeClass('active');
$('.address-list-inner li.address_select').addClass('active');
$(this).removeAttr('expand').text('[修改]');
$('.save-btn').addClass('hide');
e.$existAddressListWrap.removeClass('address-expand');
e.$addressManage.addClass('hide');
}
});
//支付及送货时间
e.$switchPayModify.click(function() {
if (e.$payTimeModify.hasClass('hide')) {
e.$payTimeModify.removeClass('hide');
e.$modityPayInfo.addClass('hide');
$(this).text('[不保存并关闭]');
} else {
e.$payTimeModify.addClass('hide');
e.$modityPayInfo.removeClass('hide');
$(this).text('[修改]');
e.$payTimeModify.find('input[name="pay-type"]').filter('.checked').attr('checked', 'checked');
e.$payTimeModify.find('input[name="pay-time-radio"]').filter('.checked').attr('checked', 'checked');
e.$payTimeModify.find('input[name="call-me"]').filter('.checked').attr('checked', 'checked');
}
});
e.$spanPayTypeLegend.click(function() {
$(this).toggleClass('active');
e.$supportType.toggleClass('hide');
});
$(document).on('click', '.exist-address-list li', function() {
$('.exist-address-list li').removeClass('active');
$(this).addClass('active');
$(this).find('input').attr('checked', 'checked');
if ($(this).hasClass('use-new-address')) {
e.$addressManage.removeClass('hide');
$('.address-manage input').val('');
$('.save-btn').removeAttr('data-id');
// 0表示获取所有省的列表，'000000'表示无匹配的区域码
address.newAddress(0, '000000');
}
});
},
//渲染价格明细
render: function(data, tips) {
// 下面这段是在服务端算价格
var e = this.e,
i,
dArr = data.promotion_formula_list,
str = '',
isExpress = '';
var tipsStr;
var envelopesVal;
if (!!tips) {
tipsStr = tips;
} else {
tipsStr = '';
}
for (i = 0; i < dArr.length; i++) {
if (dArr[i].promotion === '优惠券：') {
dArr[i].promotion = (tipsStr ? tipsStr : '优惠券') + '<span class="juan-modify">[修改]</span>：';
}
if (dArr[i].promotion === 'YOHO币：') {
dArr[i].promotion = 'YOHO币<span class="bi-modify">[修改]</span>：';
}
if (dArr[i].isExpress) {
isExpress = 'total-express-w';
} else {
isExpress = '';
}
str += '<li class="' + isExpress + '">' +
'<label>' + dArr[i].promotion + '</label>' +
'<em>' + dArr[i].promotion_amount + '</em>' +
'</li>';
}
e.$payTotal.html(str);
e.$toPay.html((data.last_order_amount).toFixed(2));
//有货币清零状态更新
$('#biprice').val(100 * data.use_yoho_coin);
if (~~data.use_yoho_coin === 0) {
$('.errbitip').text('');
} else {
$('.errbitip').text('抵扣' + data.use_yoho_coin.toFixed(2) + '元');
}
envelopesVal = e.$useEnvelopesInput.data('all') - data.use_red_envelopes;
if (~~data.use_red_envelopes > 0) {
e.$useEnvelopes.find('span').html('-￥' + data.use_red_envelopes.toFixed(2));
e.$useEnvelopes.find('input').attr('data-use', data.use_red_envelopes);
} else {
e.$useEnvelopes.find('span').html('-￥0.00');
e.$hasEnvelopes.html('￥' + (e.$useEnvelopesInput.attr('data-all') * 1).toFixed(2));
e.$redEnvelopes.removeClass('active');
e.$useEnvelopesInput.prop('checked', false);
}
e.$hasEnvelopes.html('￥' + envelopesVal.toFixed(2));
}
},
/*公共方法*/
Common: {
enterNUM: function(str1, str2) {
str1 = str1.replace(/[^\d]/g, '');
if (str1 && str2) {
str1 = parseInt(str1);
str2 = parseInt(str2);
if (str1 > str2) {
str1 = str2;
}
}
return str1;
},
calucate: function() {
var p = Order.Data;
$.each(Order.Data, function(key, index) {
p[key] = parseFloat(Order.Data[key]);
});
return p.product - p.activity + p.carriage - p.juan - p.yohocoin;
},
winShow: function(pan) {
pan.find('dt').show();
pan.find('dd').show();
if (pan.attr('class').match(/(-bi-)|(-juan-)/g)) {
pan.find('dt').hide();
}
},
winHide: function(pan) {
pan.find('dt').show();
pan.find('dd').hide();
/*if (pan.hasClass('play-juan-pan') && $('.juan-modify').length > 0) {
pan.find('dt').hide();
}
if (pan.hasClass('play-bi-pan') && $('.bi-modify').length > 0) {
pan.find('dt').hide();
}*/
},
strFixed: function(str) {
return parseFloat(str).toFixed(2);
}
},
/*业务逻辑*/
Bll: {
e: {
$juanok: $('#juansubmit'),
$juantip: $('.errtip', '.play-juan-pan'),
$biok: $('#bisubmit'),
$carriageGroup: $('input[name="carriagegroup"]'),
$selectExpress: $('.express-list input'),
$bp: $('#biprice'),
$errorTip: $('.errbitip'),
$useEnvelopes: $('.use-envelopes'),
$hasEnvelopes: $('.has-envelopes span'),
$useEnvelopesInput: $('.use-envelopes').find('input'),
$redEnvelopes: $('.red-envelopes'),
$loading: $('.loading')
},
init: function() {
var e = this.e,
u = Order.UI,
options,
c = Order.Common,
envelopesVal;
function getSelectData(callback) {
var $juangroupInput = $('.play-juan.is-select input[name="juangroup"]:checked');
var expressVal = $('.express-list input[name="carriagegroup"]').val();
var biVal = $('#biprice.is-select').val();
var codeVal = $juangroupInput.val();
var cartType = $('.address-manage').attr('cart-type');
var redEnvelopes = $('.use-envelopes input:checked').attr('data-use');
var resultData;
codeVal = !!codeVal ? codeVal : $juangroupInput.closest('li').find('#juancode').val();
resultData = {
cartType: cartType,
deliveryWay: expressVal,
couponCode: codeVal,
yohoCoin: biVal
//redEnvelopes: e.$useEnvelopesInput.length > 0 ? ~~e.$hasEnvelopes.text().substring(1) : '0'
};
if (!!redEnvelopes) {
resultData.redEnvelopes = redEnvelopes;
}
callback(resultData);
}
// 选择快递
e.$selectExpress.click(function() {
var expressId = $(this).val();
e.$loading.show();
getSelectData(function(d) {
d.deliveryWay = expressId;
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data);
if (expressId === '1') {
$('.express-list.sf').addClass('hide');
} else if (expressId === '2') {
$('.express-list.sf').removeClass('hide');
}
} else {
new dialog.Alert(data.message).show();
}
}
};
$.ajax(options);
});
});
//点击 优惠卷支付 确认按钮
e.$juanok.click(function() {
var pan = $(this).parents('dl.pan');
var juanText = '';
$('.play-juan').addClass('is-select');
getSelectData(function(d) {
var code = d.couponCode;
if (!code) {
e.$juantip.html('请选择或填写一个优惠券');
$('.play-juan').removeClass('is-select');
} else {
e.$loading.show();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
juanText = $('.play-juan input[value="' + code + '"]').next().text();
u.render(data.data, juanText);
//$('#juancode').val(code);
c.winHide(pan);
e.$juantip.html('');
//$('.play-juan-pan dt').hide();
} else {
e.$juantip.html(data.message);
$('.play-juan').removeClass('is-select');
}
}
};
$.ajax(options);
}
});
});
// 优惠券修改
$(document).on('click', '.juan-modify', function() {
var $pan = $('.play-juan-pan');
c.winShow($pan);
});
e.$biok.click(function() {
var pan = $(this).parents('dl.pan');
var juanText;
$('#biprice').addClass('is-select');
getSelectData(function(d) {
if (!!d.couponCode) {
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
}
//if (d.yohoCoin * 1 === 0) {
if (!/^\d+$/.test(d.yohoCoin + '') || d.yohoCoin * 1 === 0) {
$('.errbitip').html('请输入一个正整数');
$('#biprice').removeClass('is-select');
} else if (d.yohoCoin * 1 > $('.play-pan em').text() * 1) {
$('.errbitip').html('您的YOHO币不足');
$('#biprice').removeClass('is-select');
} else {
e.$loading.show();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
c.winHide(pan);
//$('.play-bi-pan dt').hide();
} else {
$('.errbitip').html(data.message);
$('#biprice').removeClass('is-select');
}
}
};
$.ajax(options);
}
});
});
// 修改yoho币
$(document).on('click', '.bi-modify', function() {
var $pan = $('.play-bi-pan');
c.winShow($pan);
});
e.$bp.keyup(function() {
var val = $(this).val();
//if (val * 1 < 0 || val.indexOf('.') > 0) {
if (!/^\d+$/.test(val + '')) {
e.$errorTip.html('请输入一个正整数');
} else if (val * 1 > $(this).data('bi') * 1) {
e.$errorTip.html('您的YOHO币不足');
} else {
e.$errorTip.html('抵扣' + (val / 100).toFixed(2) + '元');
}
});
// 取消yoho 币
$('.cancel-bi').click(function() {
var $pan = $('.play-bi-pan');
var juanText;
$('.errbitip').html('');
if ($('#biprice').hasClass('is-select')) {
e.$loading.show();
getSelectData(function(d) {
d.yohoCoin = 0;
if (!!d.couponCode) {
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
}
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
c.winHide($pan);
$('#biprice').val('0');
//$('.play-bi-pan dt').hide();
$('#biprice').removeClass('is-select');
$('.errbitip').html('');
// $('.use-envelopes input').attr('checked', 'checked');
// $('.red-envelopes').addClass('active');
} else {
$('.errbitip').html(data.message);
}
}
};
$.ajax(options);
});
} else {
c.winHide($pan);
$('#biprice').val('0');
}
});
// 取消优惠券
$('.cancel-code').click(function() {
var $pan = $('.play-juan-pan');
if ($('.play-juan').hasClass('is-select')) {
e.$loading.show();
getSelectData(function(d) {
d.couponCode = '';
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data);
c.winHide($pan);
$('.play-juan').removeClass('is-select');
$('#juancode').val('')
.siblings('input[name="juangroup"]').attr('checked', 'checked');
// $('.use-envelopes input').attr('checked', 'checked');
// $('.red-envelopes').addClass('active');
} else {
e.$juantip.html(data.message);
}
}
};
$.ajax(options);
});
} else {
c.winHide($pan);
}
});
// 红包
envelopesVal = e.$useEnvelopesInput.data('all') - e.$useEnvelopesInput.data('use'); // 剩余的红包
e.$hasEnvelopes.text('￥' + envelopesVal.toFixed(2));
e.$useEnvelopes.find('input').click(function() {
var $this = $(this),
juanText;
e.$loading.show();
$this.attr('disabled', 'disabled');
getSelectData(function(d) {
if (!!$this.attr('checked')) {
//d.redEnvelopes = $this.val();
d.redEnvelopes = $this.data('use');
} else {
d.redEnvelopes = 0;
}
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
$this.removeAttr('disabled');
if (!!$this.attr('checked')) {
e.$redEnvelopes.addClass('active');
} else {
e.$useEnvelopes.find('span').html('-￥0.00');
e.$hasEnvelopes.html('￥' + ($this.attr('data-all') * 1).toFixed(2));
e.$redEnvelopes.removeClass('active');
}
} else {
new dialog.Alert(data.message).show();
}
}
};
$.ajax(options);
});
});
//发票抬头和备注字数限制
function limitStrLen($obj, len) {
var $this = $obj;
$this.keyup(function() {
if ($this.val().length > len) {
$this.val($this.val().substr(0, len));
}
});
}
limitStrLen($('#piaodesc'), 30);
limitStrLen($('#notedesc'), 100);
}
}
};
Order.Data.activity = 0;
Order.Data.carriage = 0;
Order.UI.init();
Order.Bll.init();
address.getUserAddressList();
// 0表示获取所有省的列表，'000000'表示无匹配的区域码
address.newAddress(0, '000000');
address.modifyAddress();
address.saveAddress();
/**
* @description: 订单保存
* @time: 2015/12/21
*/
var $ = require('yoho.jquery');
var address = require('./address');
var dialog = require('../common/dialog');
var Order = {
/*业务数据(人民币)*/
Data: {
product: 0, //商品价格
activity: 0, //活动
carriage: 0, //邮费
juan: 0, //优惠卷
yohocoin: 0 //YOHO币
},
/*view 交互*/
UI: {
e: {
$pan: $('.pan'),
$jc: $('#juancode'),
$bp: $('#biprice'),
$statistics: $('li', '.play-total'),
$tobi: $('p em', '.play-bi-pan .play-pan'),
$cancel: $('.cancel', '.btn-group'),
$total: $('em', '.to-play'),
$tbody: $('table tbody', '.pay-wapper'),
//请填写并核对一下信息
$orderSelectionSave: $('.address-list h2 span'),
$addAddress: $('.add-address'),
$addressManage: $('.address-manage'),
$spanPayTypeLegend: $('span.pay-type-legend'),
$supportType: $('.support-type'),
$existAddressListWrap: $('.exist-address-list'),
$existAddressList: $('.exist-address-list').find('li'),
$existAddress: $('.exist-address-list').find('input[name="exist-address"]'),
$payTimeModify: $('.pay-time-modify'),
$switchPayModify: $('.switch-pay-modify'),
$modityPayInfo: $('.modity-pay-info'),
$payTotal: $('.play-total'),
$toPay: $('.to-play em'),
$redEnvelopes: $('.red-envelopes'),
$useEnvelopes: $('.use-envelopes'),
$hasEnvelopes: $('.has-envelopes span'),
$useEnvelopesInput: $('.use-envelopes').find('input')
},
init: function() {
var e = this.e,
d = Order.Data,
c = Order.Common;
//初始化产品价格(表格中的价格)
e.$tbody.find('tr').each(function(index) {
var td = $(this).find('td');
var len = e.$tbody.find('tr').length;
var subtotal = parseFloat(td.eq(1).html()) * parseInt(td.eq(3).html());
td.eq(1).html('￥' + td.eq(1).html());
if (td.hasClass('xforone')) {
td.eq(4).find('del').html('￥' + c.strFixed(subtotal));
subtotal = 0;
} else {
td.eq(4).html('￥' + c.strFixed(subtotal));
}
d.product += subtotal;
if (!index) {
td.last().attr('rowspan', len);
} else {
td.last().remove();
}
if (index === len - 1) {
e.$tbody.find('tr').eq(0).find('td').last().html('<strong>￥' + c.strFixed(d.product) + '</strong>');
}
});
// 使用优惠券、使用yoho币点击展开
e.$pan.find('dt').click(function() {
var pan = $(this).parent('dl.pan');
if (pan.find('dd').is(':hidden')) {
c.winShow(pan);
$(this).addClass('active');
} else {
c.winHide(pan);
$(this).removeClass('active');
}
});
//请填写并核对一下信息
e.$orderSelectionSave.click(function() {
var i = 0,
$addressLi = $('.exist-address-list li'),
liLen = $addressLi.length,
notSelect = 0;
if (!$(this).attr('expand')) {
$(this).attr('expand', 'expand').text('[不保存并关闭]');
$('.exist-address-list li').removeClass('hide');
$('.save-btn').removeClass('hide');
e.$existAddressListWrap.addClass('address-expand');
if (liLen === 1) {
e.$addressManage.removeClass('hide');
}
} else {
for (i = 0; i < liLen; i++) {
if ($addressLi.eq(i).hasClass('address_select')) {
notSelect++;
}
if (!$addressLi.eq(i).hasClass('address_select')) {
$addressLi.eq(i).addClass('hide');
}
}
if (notSelect === 0) {
$('.exist-address-list li:not(".use-new-address")').removeClass('hide');
$('.use-new-address input').removeAttr('checked');
}
$('.address-list-inner li.address_select input').attr('checked', 'checked');
$('.address-list-inner li').removeClass('active');
$('.address-list-inner li.address_select').addClass('active');
$(this).removeAttr('expand').text('[修改]');
$('.save-btn').addClass('hide');
e.$existAddressListWrap.removeClass('address-expand');
e.$addressManage.addClass('hide');
}
});
//支付及送货时间
e.$switchPayModify.click(function() {
if (e.$payTimeModify.hasClass('hide')) {
e.$payTimeModify.removeClass('hide');
e.$modityPayInfo.addClass('hide');
$(this).text('[不保存并关闭]');
} else {
e.$payTimeModify.addClass('hide');
e.$modityPayInfo.removeClass('hide');
$(this).text('[修改]');
e.$payTimeModify.find('input[name="pay-type"]').filter('.checked').attr('checked', 'checked');
e.$payTimeModify.find('input[name="pay-time-radio"]').filter('.checked').attr('checked', 'checked');
e.$payTimeModify.find('input[name="call-me"]').filter('.checked').attr('checked', 'checked');
}
});
e.$spanPayTypeLegend.click(function() {
$(this).toggleClass('active');
e.$supportType.toggleClass('hide');
});
$(document).on('click', '.exist-address-list li', function() {
$('.exist-address-list li').removeClass('active');
$(this).addClass('active');
$(this).find('input').attr('checked', 'checked');
if ($(this).hasClass('use-new-address')) {
e.$addressManage.removeClass('hide');
$('.address-manage input').val('');
$('.save-btn').removeAttr('data-id');
// 0表示获取所有省的列表，'000000'表示无匹配的区域码
address.newAddress(0, '000000');
}
});
},
//渲染价格明细
render: function(data, tips) {
// 下面这段是在服务端算价格
var e = this.e,
i,
dArr = data.promotion_formula_list,
str = '',
isExpress = '';
var tipsStr;
var envelopesVal;
if (!!tips) {
tipsStr = tips;
} else {
tipsStr = '';
}
for (i = 0; i < dArr.length; i++) {
if (dArr[i].promotion === '优惠券：') {
dArr[i].promotion = (tipsStr ? tipsStr : '优惠券') + '<span class="juan-modify">[修改]</span>：';
}
if (dArr[i].promotion === 'YOHO币：') {
dArr[i].promotion = 'YOHO币<span class="bi-modify">[修改]</span>：';
}
if (dArr[i].isExpress) {
isExpress = 'total-express-w';
} else {
isExpress = '';
}
str += '<li class="' + isExpress + '">' +
'<label>' + dArr[i].promotion + '</label>' +
'<em>' + dArr[i].promotion_amount + '</em>' +
'</li>';
}
e.$payTotal.html(str);
e.$toPay.html((data.last_order_amount).toFixed(2));
//有货币清零状态更新
$('#biprice').val(100 * data.use_yoho_coin);
if (~~data.use_yoho_coin === 0) {
$('.errbitip').text('');
} else {
$('.errbitip').text('抵扣' + data.use_yoho_coin.toFixed(2) + '元');
}
envelopesVal = e.$useEnvelopesInput.data('all') - data.use_red_envelopes;
if (~~data.use_red_envelopes > 0) {
e.$useEnvelopes.find('span').html('-￥' + data.use_red_envelopes.toFixed(2));
e.$useEnvelopes.find('input').attr('data-use', data.use_red_envelopes);
} else {
e.$useEnvelopes.find('span').html('-￥0.00');
e.$hasEnvelopes.html('￥' + (e.$useEnvelopesInput.attr('data-all') * 1).toFixed(2));
e.$redEnvelopes.removeClass('active');
e.$useEnvelopesInput.prop('checked', false);
}
e.$hasEnvelopes.html('￥' + envelopesVal.toFixed(2));
}
},
/*公共方法*/
Common: {
enterNUM: function(str1, str2) {
str1 = str1.replace(/[^\d]/g, '');
if (str1 && str2) {
str1 = parseInt(str1);
str2 = parseInt(str2);
if (str1 > str2) {
str1 = str2;
}
}
return str1;
},
calucate: function() {
var p = Order.Data;
$.each(Order.Data, function(key, index) {
p[key] = parseFloat(Order.Data[key]);
});
return p.product - p.activity + p.carriage - p.juan - p.yohocoin;
},
winShow: function(pan) {
pan.find('dt').show();
pan.find('dd').show();
if (pan.attr('class').match(/(-bi-)|(-juan-)/g)) {
pan.find('dt').hide();
}
},
winHide: function(pan) {
pan.find('dt').show();
pan.find('dd').hide();
/*if (pan.hasClass('play-juan-pan') && $('.juan-modify').length > 0) {
pan.find('dt').hide();
}
if (pan.hasClass('play-bi-pan') && $('.bi-modify').length > 0) {
pan.find('dt').hide();
}*/
},
strFixed: function(str) {
return parseFloat(str).toFixed(2);
}
},
/*业务逻辑*/
Bll: {
e: {
$juanok: $('#juansubmit'),
$juantip: $('.errtip', '.play-juan-pan'),
$biok: $('#bisubmit'),
$carriageGroup: $('input[name="carriagegroup"]'),
$selectExpress: $('.express-list input'),
$bp: $('#biprice'),
$errorTip: $('.errbitip'),
$useEnvelopes: $('.use-envelopes'),
$hasEnvelopes: $('.has-envelopes span'),
$useEnvelopesInput: $('.use-envelopes').find('input'),
$redEnvelopes: $('.red-envelopes'),
$loading: $('.loading')
},
init: function() {
var e = this.e,
u = Order.UI,
options,
c = Order.Common,
envelopesVal;
function getSelectData(callback) {
var $juangroupInput = $('.play-juan.is-select input[name="juangroup"]:checked');
var expressVal = $('.express-list input[name="carriagegroup"]').val();
var biVal = $('#biprice.is-select').val();
var codeVal = $juangroupInput.val();
var cartType = $('.address-manage').attr('cart-type');
var redEnvelopes = $('.use-envelopes input:checked').attr('data-use');
var resultData;
codeVal = !!codeVal ? codeVal : $juangroupInput.closest('li').find('#juancode').val();
resultData = {
cartType: cartType,
deliveryWay: expressVal,
couponCode: codeVal,
yohoCoin: biVal
//redEnvelopes: e.$useEnvelopesInput.length > 0 ? ~~e.$hasEnvelopes.text().substring(1) : '0'
};
if (!!redEnvelopes) {
resultData.redEnvelopes = redEnvelopes;
}
callback(resultData);
}
// 选择快递
e.$selectExpress.click(function() {
var expressId = $(this).val();
e.$loading.show();
getSelectData(function(d) {
d.deliveryWay = expressId;
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data);
if (expressId === '1') {
$('.express-list.sf').addClass('hide');
} else if (expressId === '2') {
$('.express-list.sf').removeClass('hide');
}
} else {
new dialog.Alert(data.message).show();
}
}
};
$.ajax(options);
});
});
//点击 优惠卷支付 确认按钮
e.$juanok.click(function() {
var pan = $(this).parents('dl.pan');
var juanText = '';
$('.play-juan').addClass('is-select');
getSelectData(function(d) {
var code = d.couponCode;
if (!code) {
e.$juantip.html('请选择或填写一个优惠券');
$('.play-juan').removeClass('is-select');
} else {
e.$loading.show();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
juanText = $('.play-juan input[value="' + code + '"]').next().text();
u.render(data.data, juanText);
//$('#juancode').val(code);
c.winHide(pan);
e.$juantip.html('');
//$('.play-juan-pan dt').hide();
} else {
e.$juantip.html(data.message);
$('.play-juan').removeClass('is-select');
}
}
};
$.ajax(options);
}
});
});
// 优惠券修改
$(document).on('click', '.juan-modify', function() {
var $pan = $('.play-juan-pan');
c.winShow($pan);
});
e.$biok.click(function() {
var pan = $(this).parents('dl.pan');
var juanText;
$('#biprice').addClass('is-select');
getSelectData(function(d) {
if (!!d.couponCode) {
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
}
//if (d.yohoCoin * 1 === 0) {
if (!/^\d+$/.test(d.yohoCoin + '') || d.yohoCoin * 1 === 0) {
$('.errbitip').html('请输入一个正整数');
$('#biprice').removeClass('is-select');
} else if (d.yohoCoin * 1 > $('.play-pan em').text() * 1) {
$('.errbitip').html('您的YOHO币不足');
$('#biprice').removeClass('is-select');
} else {
e.$loading.show();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
c.winHide(pan);
//$('.play-bi-pan dt').hide();
} else {
$('.errbitip').html(data.message);
$('#biprice').removeClass('is-select');
}
}
};
$.ajax(options);
}
});
});
// 修改yoho币
$(document).on('click', '.bi-modify', function() {
var $pan = $('.play-bi-pan');
c.winShow($pan);
});
e.$bp.keyup(function() {
var val = $(this).val();
//if (val * 1 < 0 || val.indexOf('.') > 0) {
if (!/^\d+$/.test(val + '')) {
e.$errorTip.html('请输入一个正整数');
} else if (val * 1 > $(this).data('bi') * 1) {
e.$errorTip.html('您的YOHO币不足');
} else {
e.$errorTip.html('抵扣' + (val / 100).toFixed(2) + '元');
}
});
// 取消yoho 币
$('.cancel-bi').click(function() {
var $pan = $('.play-bi-pan');
var juanText;
$('.errbitip').html('');
if ($('#biprice').hasClass('is-select')) {
e.$loading.show();
getSelectData(function(d) {
d.yohoCoin = 0;
if (!!d.couponCode) {
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
}
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
c.winHide($pan);
$('#biprice').val('0');
//$('.play-bi-pan dt').hide();
$('#biprice').removeClass('is-select');
$('.errbitip').html('');
// $('.use-envelopes input').attr('checked', 'checked');
// $('.red-envelopes').addClass('active');
} else {
$('.errbitip').html(data.message);
}
}
};
$.ajax(options);
});
} else {
c.winHide($pan);
$('#biprice').val('0');
}
});
// 取消优惠券
$('.cancel-code').click(function() {
var $pan = $('.play-juan-pan');
if ($('.play-juan').hasClass('is-select')) {
e.$loading.show();
getSelectData(function(d) {
d.couponCode = '';
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data);
c.winHide($pan);
$('.play-juan').removeClass('is-select');
$('#juancode').val('')
.siblings('input[name="juangroup"]').attr('checked', 'checked');
// $('.use-envelopes input').attr('checked', 'checked');
// $('.red-envelopes').addClass('active');
} else {
e.$juantip.html(data.message);
}
}
};
$.ajax(options);
});
} else {
c.winHide($pan);
}
});
// 红包
envelopesVal = e.$useEnvelopesInput.data('all') - e.$useEnvelopesInput.data('use'); // 剩余的红包
e.$hasEnvelopes.text('￥' + envelopesVal.toFixed(2));
e.$useEnvelopes.find('input').click(function() {
var $this = $(this),
juanText;
e.$loading.show();
$this.attr('disabled', 'disabled');
getSelectData(function(d) {
if (!!$this.attr('checked')) {
//d.redEnvelopes = $this.val();
d.redEnvelopes = $this.data('use');
} else {
d.redEnvelopes = 0;
}
juanText = $('.play-juan input[value="' + d.couponCode + '"]').next().text();
options = {
type: 'POST',
url: '/cart/index/orderCompute',
data: d,
success: function(data) {
e.$loading.hide();
if (data.code === 200) {
u.render(data.data, juanText);
$this.removeAttr('disabled');
if (!!$this.attr('checked')) {
e.$redEnvelopes.addClass('active');
} else {
e.$useEnvelopes.find('span').html('-￥0.00');
e.$hasEnvelopes.html('￥' + ($this.attr('data-all') * 1).toFixed(2));
e.$redEnvelopes.removeClass('active');
}
} else {
new dialog.Alert(data.message).show();
}
}
};
$.ajax(options);
});
});
//发票抬头和备注字数限制
function limitStrLen($obj, len) {
var $this = $obj;
$this.keyup(function() {
if ($this.val().length > len) {
$this.val($this.val().substr(0, len));
}
});
}
limitStrLen($('#piaodesc'), 30);
limitStrLen($('#notedesc'), 100);
}
}
};
Order.Data.activity = 0;
Order.Data.carriage = 0;
Order.UI.init();
Order.Bll.init();
address.getUserAddressList();
// 0表示获取所有省的列表，'000000'表示无匹配的区域码
address.newAddress(0, '000000');
address.modifyAddress();
address.saveAddress();
//不同订单包裹提示
$('.why').click(function() {
$('#differentBag').show();
return false;
});
$('#differentBag').click(function() {
return false;
});
$(document).click(function() {
$('#differentBag').hide();
});
//订单包裹左右切换
function lunBo($pre, $next, $ul, $iWidth) {
var i = 1,
j = 1;
var iSpeed = 0,
isMoving = false;
$pre.click(function() {
if (isMoving) {
return;
}
if ($ul.css('left') === '0px') {
iSpeed = 0;
} else {
iSpeed += j * $iWidth;
isMoving = true;
}
$ul.stop().animate({
left: iSpeed
}, 300, function() {
isMoving = false;
});
});
$next.click(function() {
var $largeLeft = $ul.parent().width() - $ul.width() + 'px';
if (isMoving) {
return;
}
if ($ul.css('left') === $largeLeft) {
$ul.css('left', $largeLeft);
} else {
iSpeed += -i * $iWidth;
isMoving = true;
}
$ul.stop().animate({
left: iSpeed
}, 300, function() {
isMoving = false;
});
});
}
//订单分类
$('.bag').find('ul').each(function() {
var $pre = $(this).parent().parent().find('.pre');
var $next = $(this).parent().parent().find('.next');
var $iWidth = $(this).find('li').eq(0).width();
var $length = $(this).find('li').size();
var $ulWidth = $iWidth * $length;
$(this).css('width', $ulWidth);
if ($length > 5) {
$pre.show();
$next.show();
lunBo($pre, $next, $(this), $iWidth);
} else {
$pre.hide();
$next.hide();
}
});
... ...
/**
* 支付页面
*/
//切换选项卡
var $ = require('yoho.jquery'),
$choseTag = $('.mode div'),
$mode = $('.mode'),
$showPayImg = $('#show-pay-img'),
$btnty = $('#btnby'),
$lightBox = $('.light-box'),
$choosePay = $('#choosePay').val(),
$chooseMoid = $('.mode div[id="' + $choosePay + '"]').parent().data('value'),
$showValue = $choosePay ? $chooseMoid : $('.mode').eq(0).data('value'),
$payUrl = $('#payUrl').val(),
$modeData,
activeTab,
showDiv,
imgAlt,
imgSrc,
orderCode;
$.jqtab = function(tabtit, tabcon) {
$(tabtit + ' li').click(function() {
activeTab = $(this).find('a').attr('tab');
$(tabtit + ' li').removeClass('thistab');
$(this).addClass('thistab');
$(tabcon).hide();
$('#' + activeTab).fadeIn();
return false;
});
};
$.jqtab('#tabs', '.tab-con');
//选项卡点击
function choosed() {
if ($choosePay) {
$('.mode div[id="' + $choosePay + '"]').addClass('choosed-tag').parent().addClass('choose-type');
} else {
$mode.eq(0).addClass('choose-type').show();
$mode.eq(0).find('div').addClass('choosed-tag');
}
$btnty.attr('value', '前往' + $('#' + $chooseMoid).attr('alt'));
$showPayImg.attr('src', $('#' + $chooseMoid).attr('src'));
}
choosed();
$mode.click(function() {
$modeData = $(this).data();
showDiv = $modeData.id;
$showValue = $modeData.value;
imgAlt = $('#' + $showValue).attr('alt');
imgSrc = $('#' + $showValue).attr('src');
$mode.removeClass('choose-type');
$(this).addClass('choose-type');
$choseTag.removeClass('choosed-tag');
$('#' + showDiv).addClass('choosed-tag');
$btnty.attr('value', '前往' + imgAlt);
$showPayImg.attr('src', imgSrc);
return false;
});
$('.close').click(function() {
$lightBox.hide();
});
$('.change').click(function() {
$lightBox.hide();
});
//支付方式选择按钮
function getData(payment,orderCode){
$.ajax({
type:"get",
url:"/common/addpaymentinterval",
dataType:'json',
data:{
orderCode:orderCode,
payment:payment
}
});
}
$("#btnby").click(function(){
payment = $(".choose-type").attr("data-id");
orderCode = $('.order-num').text();
getData(payment,orderCode);
window.open($payUrl + '?order_code=' + orderCode + '&payment_type=' + $showValue);
$lightBox.show();
})
/**
* 支付页面
*/
//切换选项卡
var $ = require('yoho.jquery'),
$choseTag = $('.mode div'),
$mode = $('.mode'),
$showPayImg = $('#show-pay-img'),
$btnty = $('#btnby'),
$lightBox = $('.light-box'),
$choosePay = $('#choosePay').val(),
$chooseMoid = $('.mode div[id="' + $choosePay + '"]').parent().data('value'),
$showValue = $choosePay ? $chooseMoid : $('.mode').eq(0).data('value'),
$payUrl = $('#payUrl').val(),
$modeData,
activeTab,
showDiv,
imgAlt,
imgSrc,
orderCode;
$.jqtab = function(tabtit, tabcon) {
$(tabtit + ' li').click(function() {
activeTab = $(this).find('a').attr('tab');
$(tabtit + ' li').removeClass('thistab');
$(this).addClass('thistab');
$(tabcon).hide();
$('#' + activeTab).fadeIn();
return false;
});
};
$.jqtab('#tabs', '.tab-con');
//选项卡点击
function choosed() {
if ($choosePay) {
$('.mode div[id="' + $choosePay + '"]').addClass('choosed-tag').parent().addClass('choose-type');
} else {
$mode.eq(0).addClass('choose-type').show();
$mode.eq(0).find('div').addClass('choosed-tag');
}
$btnty.attr('value', '前往' + $('#' + $chooseMoid).attr('alt'));
$showPayImg.attr('src', $('#' + $chooseMoid).attr('src'));
}
choosed();
$mode.click(function() {
$modeData = $(this).data();
showDiv = $modeData.id;
$showValue = $modeData.value;
imgAlt = $('#' + $showValue).attr('alt');
imgSrc = $('#' + $showValue).attr('src');
$mode.removeClass('choose-type');
$(this).addClass('choose-type');
$choseTag.removeClass('choosed-tag');
$('#' + showDiv).addClass('choosed-tag');
$btnty.attr('value', '前往' + imgAlt);
$showPayImg.attr('src', imgSrc);
return false;
});
$('.close').click(function() {
$lightBox.hide();
});
$('.change').click(function() {
$lightBox.hide();
});
//支付方式选择按钮
function getData(payment,orderCode){
$.ajax({
type:"get",
url:"/common/addpaymentinterval",
dataType:'json',
data:{
orderCode:orderCode,
payment:payment
}
});
}
$("#btnby").click(function(){
payment = $(".choose-type").attr("data-id");
orderCode = $('.order-num').text();
getData(payment,orderCode);
window.open($payUrl + '?order_code=' + orderCode + '&payment_type=' + $showValue);
$lightBox.show();
})
... ...
.yoho-notice {
width: 100%;
height: 100px;
font-size: 12px;
background-color: #555;
font-family: '微软雅黑';
.notice-title{
height: 100px;
line-height: 100px;
font-size: 27px;
font-weight: bold;
color: #fff;
width: 245px;
position: absolute;
}
.notice-content {
padding: 16px 0 0 300px;
color: #e8e8e8;
.tips {
margin-bottom: 10px;
}
.detail {
line-height: 16px;
}
}
}
.yoho-header {
.header-topwrapper {
width: 100%;
background-color: #f4f4f4;
min-width: 1150px;
}
.header-top {
width: 1150px;
height: 32px;
line-height: 32px;
margin: 0 auto;
position: relative;
}
.leftpart {
position: relative;
padding-left: 5px;
padding-right: 5px;
}
.leftpart:hover {
background-color: #dcdcdc;
.yohoproducts-list {
display: block !important;
}
}
.leftpart .acttags {
background-color: #dcdcdc;
}
.yohoproducts-list {
position: absolute;
display: none;
width: 170px;
left: 0;
top: 32px;
background-color: #f4f4f4;
padding-top: 30px;
padding-bottom: 10px;
padding-left: 20px;
z-index: 10000000;
}
.yohoproducts-item {
height: 14px;
line-height: 14px;
margin-bottom: 20px;
a {
color: #9196a0;
font-size: 14px;
}
&:hover a {
color: black;
}
}
.rightpart {
position: absolute;
right: 0;
top: 0;
.acttags {
background-color: #dcdcdc;
}
.tag-seprate {
border-color: #dcdcdc;
}
}
.hi,
.loginbar,
.registbar {
display: inline-block;
float: left;
}
.hi {
color: #8e8e8e;
font-size: 12px;
}
#loginBox a,
#loginBox span {
color: black;
font-size: 12px;
}
.header-yoho,
.loginbar,
.login-out,
.registbar {
color: black;
font-size: 12px;
}
.registbar {
margin-left: 7px;
}
.tag-list-wrapper {
margin-left: 13px;
float: left;
}
.tag-list {
margin-left: 13px;
height: 34px;
}
.tag-seprate {
margin-top: 11px;
width: 0;
height: 14px;
display: inline-block;
float: left;
border-left: 1px solid #dcdcdc;
}
.tag-item {
display: inline-block;
float: left;
line-height: 32px;
box-sizing: border-box;
margin-left: -1px;
a {
color: #8e8e8e;
font-size: 12px;
display: inline-block;
}
span {
display: inline-block;
}
}
.myyoho {
padding-right: 10px;
position: relative;
.tag-seprate {
margin-right: 12px;
}
}
.myyoho-info {
position: absolute;
display: none;
top: 32px;
left: -110px;
width: 300px;
background-color: #f8f8f8;
z-index: 1000000;
}
.myyoho-photo {
overflow: hidden;
img{
display: block;
margin:0 auto;
width: 63px;
height: 63px;
border-radius: 50%;
}
}
.myyoho-info-header {
margin: 17px auto 0;
width: 257px;
border-bottom: 1px solid #dcdcdc;
text-align: center;
padding-bottom: 15px;
}
.user-email {
margin-top: 14px;
color: black;
height: 25px;
line-height: 20px;
font-size: 18px;
}
.user-level {
color: black;
height: 20px;
line-height: 20px;
font-size: 18px;
.leveldetail {
color: #8cc4f9;
}
}
.levelinfo {
width: 100%;
padding-top: 10px;
clear: both;
height: 15px;
}
.levelwrapper {
width: 150px;
height: 14px;
background-color: #e2e2e2;
margin-left: 40px;
position: relative;
}
.levelspan {
position: absolute;
left: 2px;
height: 14px;
top: 0;
line-height: 16px;
}
.levelwrapper .integrate {
height: 14px;
line-height: 15px;
background-color: #ceae64;
text-align: left;
padding-left: 5px;
}
.cardcate {
font-size: 14px;
line-height: 14px;
margin-left: 5px;
}
.myyoho-info-content {
margin: 20px auto 0;
padding-left: 35px;
padding-right: 29px;
border-bottom: 1px solid #dcdcdc;
.item {
height: 12px;
line-height: 12px;
margin-bottom: 16px;
a {
font-size: 14px;
color: black;
}
}
}
.myyoho-info-footer {
height: 51px;
line-height: 51px;
text-align: center;
a {
color: black;
font-size: 14px;
}
}
.myorder {
padding-right: 10px;
.tag-seprate {
margin-right: 11px;
}
}
.mycollect {
padding-right: 11px;
.tag-seprate {
margin-right: 11px;
}
}
.message {
padding-right: 10px;
.tag-seprate {
margin-right: 11px;
}
}
.phone {
padding-right: 8px;
position: relative;
.tag-seprate {
margin-right: 10px;
}
}
.qr {
position: absolute;
display: none;
top: 32px;
left: -100px;
width: 231px;
height: 290px;
background-color: #f8f8f8;
z-index: 10000000;
}
.qr-img {
position: relative;
background-image: resolve(/header/qr.png);
background-repeat: no-repeat;
background-size: 100% 100%;
margin: 32px auto 15px;
width: 143px;
height: 147px;
}
.qr-words {
height: 25px;
line-height: 25px;
font-size: 16px;
text-align: center;
}
.qr-more {
margin-top: 6px;
line-height: 25px;
font-size: 14px;
text-align: center;
}
.onlineserver .tag-seprate {
margin-right: 10px;
}
.header-navwrapper {
width: 100%;
height: 130px;
position: relative;
min-width: 1150px;
}
.header-navcontent {
width: 1150px;
height: 130px;
margin: 0 auto;
}
.first-nav-list {
margin-top: 45px;
}
.first-nav-item {
float: left;
padding: 8px 23px 0;
}
.all a,
.girls a,
.boys a,
.kids a,
.lifestyle a {
color: white !important;
}
.all span,
.girls span,
.boys span,
.kids span,
.lifestyle span {
color: white !important;
}
.all {
background-color: #5e4b3c;
.sub-nav-wrapper {
background-color: black;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid black;
}
}
.searchcateboys {
.searchinput {
border: 1px solid #3a3a3a
}
.icon-search {
background-color: #3a3a3a!important
}
}
.searchcategirls {
.searchinput {
border: 1px solid #ff88ae
}
.icon-search {
background-color: #ff88ae!important
}
}
.searchcatewoman {
.searchinput {
border: 1px solid #ff88ae
}
.icon-search {
background-color: #ff88ae!important
}
}
.searchcatekids {
.searchinput {
border: 1px solid #7bd3f9 !important
}
.icon-search {
background-color: #7bd3f9!important
}
}
.gobuyboys {
background: url(/header/cart/boys.png) no-repeat;
}
.gobuygirls {
background: url(/header/cart/girls.png) no-repeat;
}
.gobuykids {
background: url(/header/cart/kids.png) no-repeat;
}
.gobuylifestyle {
background: url(/header/cart/lifestyle.png) no-repeat;
}
.searchcatelifestyle {
.searchinput {
border: 1px solid #5e4b3c !important
}
.icon-search {
background-color: #5e4b3c !important
}
}
.boys {
background-color: #3a3a3a;
.sub-nav-wrapper {
background-color: #3a3a3a;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #3a3a3a;
}
}
.girls {
background-color: #ff88ae;
.sub-nav-wrapper {
background-color: #ff88ae;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #ff88ae;
}
}
.kids {
background-color: #7bd3f9;
.sub-nav-wrapper {
background-color: #7bd3f9;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #7bd3f9;
}
}
.lifestyle {
background-color: #5e4b3c;
.sub-nav-wrapper {
background-color: #5e4b3c;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #5e4b3c;
}
}
.name-cn {
text-align: center;
line-height: 16px !important;
a {
color: black;
font-size: 16px !important;
}
}
.name-en {
text-align: center;
line-height: 14px !important;
margin-bottom: 6px;
a {
color: #8e8e8e;
font-size: 12px;
line-height: 14px !important;
font-family: 'arial' !important;
}
}
.sub-nav-wrapper {
display: none;
height: 40px;
left: 0;
width: 100%;
position: absolute;
z-index: 1000;
}
.sub-nav-list {
width: 1150px;
height: 40px;
margin: 0 auto;
overflow: hidden;
}
.sub-nav-item {
float: left;
padding: 12px 46px 12px 0;
box-sizing: border-box;
margin-right: 38px;
&:last-child {
margin-right: 0 !important;
}
a {
position: relative;
color: white;
font-size: 14px;
line-height: 14px;
display: inline-block;
}
}
.newlogo {
display: block;
width: 26px;
height: 12px;
background-image: resolve(/header/new.png);
background-repeat: no-repeat;
position: absolute;
right: -29px;
top: -6px;
}
.sub-nav-item:hover > a {
padding-bottom: 3px;
border-bottom: 2px solid white;
}
.actsecondnav {
padding-bottom: 3px;
border-bottom: 2px solid white;
}
.sub-nav-item:hover .third-nav-wrapper {
display: block;
}
.third-nav-wrapper {
box-sizing: border-box;
height: 410px;
position: absolute;
left: 0;
top: 38px;
width: 100%;
min-width: 1150px;
display: none;
z-index: 10000;
padding-top: 30px;
padding-bottom: 30px;
background-color: #f8f8f8;
}
.third-nav {
width: 1150px;
height: 100%;
margin: 0 auto;
}
.category {
width: 880px;
float: left;
overflow: hidden;
.thirdnavlist {
box-sizing: border-box;
width: 220px;
height: 240px;
float: left;
padding-left: 20px;
border-right: 1px solid #dcdcdc;
padding-right: 20px;
}
}
.category-title {
color: black;
font-size: 16px;
width: 178px;
padding-bottom: 12px;
border-bottom: 1px solid #000;
line-height: 16px;
margin-bottom: 20px;
a {
color: black !important;
}
}
.category-list {
margin-top: 16px;
margin-bottom: 30px;
}
.category-item {
line-height: 28px;
}
.category-list a {
color: #a1a1a1 !important;
font-size: 14px;
}
.category-list .category-item .hot {
color: #ee0011 !important;
font-size: 14px;
}
.category-item-act a {
color: black !important;
}
.showdetail {
box-sizing: border-box;
padding-left: 19px;
padding-right: 19px;
width: 337px;
height: 250px;
float: right;
}
[class^="icon-"], [class*=" icon-"] {
display: inline-block;
vertical-align: middle;
background-repeat: none;
}
.icon-hamburger {
background: url(/header/hamburger.png) no-repeat;
width: 13px;
height: 11px;
}
.icon-headphones {
background: url(/header/iphone.png) no-repeat;
width: 15px;
height: 10px;
margin-top: 2px;
}
.icon-heart {
background: url(/header/heart.png) no-repeat;
width: 12px;
height: 11px;
margin-top: -2px;
}
.icon-mail {
background: url(/header/mail.png) no-repeat;
width: 16px;
height: 10px;
margin-top: -2px;
}
.icon-iphone {
background: url(/header/iphone.png) no-repeat;
width: 8px;
height: 14px;
margin-top: -2px;
}
.icon-papers {
background: url(/header/paper.png) no-repeat;
width: 10px;
height: 14px;
margin-top: -2px;
}
.icon-bottomarrow {
background: url(/header/bottom-arrow.png) no-repeat;
width: 10px;
height: 5px;
margin-top: -2px;
}
.icon-logo {
background: resolve(/header/logo.png) no-repeat center center;
width: 182px;
height: 53px;
top: 22px;
left: 44.2%;
position: absolute;
.main-link {
display: block;
width: 100%;
height: 100%;
}
}
.search {
position: relative;
}
.searchspan {
margin-top: 45px;
float: left;
display: inline-block;
overflow: hidden;
}
.searchinput {
float: left;
width: 240px;
height: 28px;
border: 1px solid #000;
box-sizing: border-box;
padding: 6px 0 5px 10px;
border-right: none;
}
.icon-search {
background: resolve(/header/search.png) no-repeat center center;
width: 80px;
height: 28px;
float: left;
border: none;
margin-top: 45px;
background-color: #3a3a3a;
}
.search-list {
position: absolute;
top: 73px;
left: 0;
z-index: 1000;
box-sizing: border-box;
display: none;
background-color: white;
padding-top: 20px;
width: 100%;
max-height: 500px;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}
.search-item {
position: relative;
padding: 5px;
height: 25px;
line-height: 25px;
font: 12px;
&:hover {
background-color: #f4f4f4;
}
}
.searchvalue {
position: absolute;
left: 10px;
max-width: 192px;
font-size: 12px;
@mixin ellipsis;
}
.valuenum {
position: absolute;
right: 10px;
font-size: 12px;
}
.header-tool {
padding-right: 23px;
}
.gobuy {
margin-top: 47px;
margin-left: 23px;
width: 26px;
height: 26px;
position: relative;
cursor: pointer;
}
.gobuy-wrapper {
position: absolute;
display: none;
top: 24px;
right: -14px;
width: 378px;
padding-top: 6px;
z-index: 10000000;
}
.gobuy-empty {
position: absolute;
width: 100%;
height: 507px;
z-index: 1;
background: #f8f8f8 resolve(/header/empty_car.png) no-repeat 106px 132px;
.information {
margin-top: 300px;
width: 100%;
height: 18px;
line-height: 18px;
font-size: 18px;
text-align: center;
}
}
.gobuy-loading {
position: absolute;
width: 100%;
height: 407px;
z-index: 1;
background: #f8f8f8 resolve(/header/loading.gif) no-repeat center 150px;
.information {
margin-top: 180px;
width: 100%;
height: 12px;
line-height: 12px;
font-size: 12px;
text-align: center;
}
}
.gobuy-notempty {
position: absolute;
width: 100%;
z-index: 1;
background-color: #f8f8f8;
overflow: hidden;
}
.goods-list-wrapper {
width: 100%;
max-height: 444px;
margin-bottom: 19px;
overflow-y: auto;
overflow-x: hidden;
}
.goods-list {
margin-top: 40px;
}
.goods-item {
height: 64px;
margin-bottom: 18px;
padding-left: 18px;
}
.goods-img {
display: inline-block;
float: left;
width: 46px;
height: 62px;
margin-right: 13px;
}
.goods-detail {
margin-right: 16px;
.content {
width: 170px;
height: 14px;
line-height: 14px;
font-size: 14px;
margin-bottom: 13px;
@mixin ellipsis;
a {
color: #666;
outline: none;
text-decoration: none;
}
}
.style {
height: 14px;
line-height: 14px;
font-size: 14px;
color: #b0b0b0;
}
}
.goods-price .priceandnum {
height: 14px;
line-height: 14px;
font-size: 14px;
margin-bottom: 13px;
min-width: 75px;
text-align: right;
}
.goods-price .delete {
display: inline-block;
float: right;
font-size: 14px;
color: #000;
}
.activity-item {
margin-bottom: 8px;
padding-left: 18px;
}
.activity-name {
display: inline-block;
box-sizing:border-box;
border: none;
width: 60px;
height: 18px;
line-height: 18px;
background-color: #3a3a3a;
color: white;
font-size: 14px;
text-align: center;
margin-right: 13px;
vertical-align: top;
}
.activity-content {
display: inline-block;
line-height: 14px;
width: 250px;
color: #3a3a3a;
font-size: 12px;
word-break: break-all;
}
.gobuy-notempty-footer {
width: 100%;
height: 61px;
text-align: center;
h3 {
box-sizing: border-box;
width: 349px;
margin: 0 auto;
height: 61px;
line-height: 61px;
border-top: 1px solid #dcdcdc;
}
a {
font-size: 18px;
color: #444;
}
}
.ic-infomation {
position: absolute;
background: url(/header/ic-information.png) no-repeat;
width: 27px;
height: 20px;
top: -10px;
right: -15px;
color: white;
text-align: center;
line-height: 20px;
font-size: 12px;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
.showdetail img {
display: block;
box-sizing: border-box;
width: 337px;
height: 250px;
}
.showdetail .title {
display: block;
margin-top: 40px;
width: 100%;
height: 15px;
text-align: center;
line-height: 15px;
font-size: 14px;
color: black !important;
@mixin ellipsis;
}
.cate_row {
float:left;
height:352px;
box-sizing:border-box;
li {
box-sizing:border-box;
}
}
.cate_row1 {
width:253px;
}
.cate_row2 {
width:278px;
border-left:1px solid #ccc;
padding-left: 50px;
}
.cate_row3 {
width: 270px;
border-left:1px solid #ccc;
padding-left: 50px;
}
.third-nav .cattitle {
width: 180px;
padding-bottom: 10px;
border-bottom: 1px solid #000;
line-height: 18px;
margin-bottom: 20px;
}
.third-nav .cattitle h3 a {
color: black !important;
font-size: 14px;
}
.third-nav .catdetail {
line-height: 14px;
height: 14px;
margin-bottom: 24px;
min-width: 200px;
a {
color: #a1a1a1 !important;
font-size: 14px;
}
.hot {
color: #ee0011 !important ;
}
}
.thirdcatelink:hover {
text-decoration: underline !important ;
}
.hovercontent {
display: none;
}
}
.simple-header {
height: 66px;
margin: 0 0 20px 0;
border-bottom: 2px solid #222;
.header-inner {
width: 990px;
height: 100%;
margin: 0 auto;
}
.logo {
float: left;
line-height: 66px;
font-size: 0;
img {
vertical-align: middle;
}
}
}
.simple-header .header-tool {
float: right;
line-height: 66px;
font-size: 0;
li {
display: inline-block;
padding: 0 10px;
line-height: 28px;
font-size: 12px;
vertical-align: middle;
span, a {
font-size: 12px;
vertical-align: middle;
}
.tell-icon {
font-size: 12px;
}
.tell-icon ~ span {
font-weight: bold;
}
}
.login-box a {
color: #666;
}
.tool-options {
position: relative;
font-size: 0;
cursor: pointer;
&:hover {
background-color: #eaeceb;
.iconfont {
&.up {
display: inline-block;
}
&.down {
display: none;
}
}
}
.iconfont, span{
display: inline-block;
font-size: 12px;
height: 28px;
line-height: 28px;
vertical-align: top;
&.up {
display: none;
}
}
.tool-select {
display: none;
position: absolute;
width: 74px;
left: 0;
background: #eaeceb;
z-index: 9;
a {
display: block;
padding: 0 0 0 10px;
border-top: 1px solid #ddd;
}
}
}
}
.min-screen .yoho-header {
.header-topwrapper {
min-width: 990px;
}
.header-top {
width: 990px;
}
.header-navwrapper {
min-width: 990px;
}
.header-wrapper {
width: 990px;
}
.header-navcontent {
width: 990px;
}
.icon-logo {
left: 39.2%;
.main-link {
display: block;
width: 100%;
height: 100%;
}
}
.sub-nav-list {
width: 990px;
min-width: 990px;
}
.sub-nav-item {
margin-right:15px;
}
.first-nav-item {
float: left;
padding: 10px 14px 0;
margin-right: 3px;
}
.third-nav {
width: 990px;
}
.third-nav-wrapper {
min-width: 990px;
}
.category {
width: 800px;
}
.cate_row1 {
width: 204px;
}
.cate_row2 {
width: 244px;
border-left: 1px solid #ccc;
padding-left: 39px;
}
.cate_row3 {
width: 163px;
border-left: 1px solid #ccc;
padding-left: 28px;
}
.category .thirdnavlist {
width: 200px;
}
.category-title {
width: 152px;
}
.showdetail {
width: 190px;
padding-right: 0;
img {
width: 174px;
height: 155px;
}
}
}
#cover {
left: 0px;
top: 0px;
width: 100%;
height: 100%;
position: fixed;
z-index: 1001;
.con {
background: rgba(0, 0, 0, 0.6) !important;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
position: absolute;
z-index: 1002;
opacity: 0.5;
}
.tag_img_warpper {
margin: 0px auto;
width: 180px;
height: 168px;
img {
width: 100%;
height: 100%;
}
}
.guide-box {
background: rgb(255, 255, 255);
margin: 0px auto;
height: 400px;
position: relative;
z-index: 1003;
.close {
top: -15px;
text-align: center;
right: -15px;
color: rgb(255, 255, 255);
line-height: 22px;
font-size: 24px;
position: absolute;
background: rgb(0, 0, 0);
border-radius: 50px;
border: currentColor;
border-image: none;
width: 28px;
height: 28px;
line-height: 25px;
display: block;
}
li {
padding: 10px;
width: 200px;
height: 400px;
float: left;
box-sizing: border-box;
&.girls {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.lifestyle {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.kids {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.boys .goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
.go {
margin: 26px auto 0px;
width: 100%;
height: 18px;
text-align: center;
color: rgb(176, 176, 176);
line-height: 18px;
font-size: 18px;
font-style: italic;
font-weight: lighter;
display: block;
}
}
}
.boys .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.girls .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.kids .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.lifestyle .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.boys .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.girls .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.kids .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.lifestyle .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.boys .block_cn,
.boys .block_en {
color: #000;
}
.girls .block_cn,
.girls .block_en {
color: rgb(255, 136, 174);
}
.kids .block_cn,
.kids .block_en {
color: rgb(122, 217, 248);
}
.lifestyle .block_cn,
.lifestyle .block_en {
color: rgb(79, 64, 55) !important;
}
.boys .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.girls .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.kids .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.lifestyle .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
}
.yoho-notice {
width: 100%;
height: 100px;
font-size: 12px;
background-color: #555;
font-family: '微软雅黑';
.notice-title{
height: 100px;
line-height: 100px;
font-size: 27px;
font-weight: bold;
color: #fff;
width: 245px;
position: absolute;
}
.notice-content {
padding: 16px 0 0 300px;
color: #e8e8e8;
.tips {
margin-bottom: 10px;
}
.detail {
line-height: 16px;
}
}
}
.yoho-header {
.header-topwrapper {
width: 100%;
background-color: #f4f4f4;
min-width: 1150px;
}
.header-top {
width: 1150px;
height: 32px;
line-height: 32px;
margin: 0 auto;
position: relative;
}
.leftpart {
position: relative;
padding-left: 5px;
padding-right: 5px;
}
.leftpart:hover {
background-color: #dcdcdc;
.yohoproducts-list {
display: block !important;
}
}
.leftpart .acttags {
background-color: #dcdcdc;
}
.yohoproducts-list {
position: absolute;
display: none;
width: 170px;
left: 0;
top: 32px;
background-color: #f4f4f4;
padding-top: 30px;
padding-bottom: 10px;
padding-left: 20px;
z-index: 10000000;
}
.yohoproducts-item {
height: 14px;
line-height: 14px;
margin-bottom: 20px;
a {
color: #9196a0;
font-size: 14px;
}
&:hover a {
color: black;
}
}
.rightpart {
position: absolute;
right: 0;
top: 0;
.acttags {
background-color: #dcdcdc;
}
.tag-seprate {
border-color: #dcdcdc;
}
}
.hi,
.loginbar,
.registbar {
display: inline-block;
float: left;
}
.hi {
color: #8e8e8e;
font-size: 12px;
}
#loginBox a,
#loginBox span {
color: black;
font-size: 12px;
}
.header-yoho,
.loginbar,
.login-out,
.registbar {
color: black;
font-size: 12px;
}
.registbar {
margin-left: 7px;
}
.tag-list-wrapper {
margin-left: 13px;
float: left;
}
.tag-list {
margin-left: 13px;
height: 34px;
}
.tag-seprate {
margin-top: 11px;
width: 0;
height: 14px;
display: inline-block;
float: left;
border-left: 1px solid #dcdcdc;
}
.tag-item {
display: inline-block;
float: left;
line-height: 32px;
box-sizing: border-box;
margin-left: -1px;
a {
color: #8e8e8e;
font-size: 12px;
display: inline-block;
}
span {
display: inline-block;
}
}
.myyoho {
padding-right: 10px;
position: relative;
.tag-seprate {
margin-right: 12px;
}
}
.myyoho-info {
position: absolute;
display: none;
top: 32px;
left: -110px;
width: 300px;
background-color: #f8f8f8;
z-index: 1000000;
}
.myyoho-photo {
overflow: hidden;
img{
display: block;
margin:0 auto;
width: 63px;
height: 63px;
border-radius: 50%;
}
}
.myyoho-info-header {
margin: 17px auto 0;
width: 257px;
border-bottom: 1px solid #dcdcdc;
text-align: center;
padding-bottom: 15px;
}
.user-email {
margin-top: 14px;
color: black;
height: 25px;
line-height: 20px;
font-size: 18px;
}
.user-level {
color: black;
height: 20px;
line-height: 20px;
font-size: 18px;
.leveldetail {
color: #8cc4f9;
}
}
.levelinfo {
width: 100%;
padding-top: 10px;
clear: both;
height: 15px;
}
.levelwrapper {
width: 150px;
height: 14px;
background-color: #e2e2e2;
margin-left: 40px;
position: relative;
}
.levelspan {
position: absolute;
left: 2px;
height: 14px;
top: 0;
line-height: 16px;
}
.levelwrapper .integrate {
height: 14px;
line-height: 15px;
background-color: #ceae64;
text-align: left;
padding-left: 5px;
}
.cardcate {
font-size: 14px;
line-height: 14px;
margin-left: 5px;
}
.myyoho-info-content {
margin: 20px auto 0;
padding-left: 35px;
padding-right: 29px;
border-bottom: 1px solid #dcdcdc;
.item {
height: 12px;
line-height: 12px;
margin-bottom: 16px;
a {
font-size: 14px;
color: black;
}
}
}
.myyoho-info-footer {
height: 51px;
line-height: 51px;
text-align: center;
a {
color: black;
font-size: 14px;
}
}
.myorder {
padding-right: 10px;
.tag-seprate {
margin-right: 11px;
}
}
.mycollect {
padding-right: 11px;
.tag-seprate {
margin-right: 11px;
}
}
.message {
padding-right: 10px;
.tag-seprate {
margin-right: 11px;
}
}
.phone {
padding-right: 8px;
position: relative;
.tag-seprate {
margin-right: 10px;
}
}
.qr {
position: absolute;
display: none;
top: 32px;
left: -100px;
width: 231px;
height: 290px;
background-color: #f8f8f8;
z-index: 10000000;
}
.qr-img {
position: relative;
background-image: resolve(/header/qr.png);
background-repeat: no-repeat;
background-size: 100% 100%;
margin: 32px auto 15px;
width: 143px;
height: 147px;
}
.qr-words {
height: 25px;
line-height: 25px;
font-size: 16px;
text-align: center;
}
.qr-more {
margin-top: 6px;
line-height: 25px;
font-size: 14px;
text-align: center;
}
.onlineserver .tag-seprate {
margin-right: 10px;
}
.header-navwrapper {
width: 100%;
height: 130px;
position: relative;
min-width: 1150px;
}
.header-navcontent {
width: 1150px;
height: 130px;
margin: 0 auto;
}
.first-nav-list {
margin-top: 45px;
}
.first-nav-item {
float: left;
padding: 8px 23px 0;
}
.all a,
.girls a,
.boys a,
.kids a,
.lifestyle a {
color: white !important;
}
.all span,
.girls span,
.boys span,
.kids span,
.lifestyle span {
color: white !important;
}
.all {
background-color: #5e4b3c;
.sub-nav-wrapper {
background-color: black;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid black;
}
}
.searchcateboys {
.searchinput {
border: 1px solid #3a3a3a
}
.icon-search {
background-color: #3a3a3a!important
}
}
.searchcategirls {
.searchinput {
border: 1px solid #ff88ae
}
.icon-search {
background-color: #ff88ae!important
}
}
.searchcatewoman {
.searchinput {
border: 1px solid #ff88ae
}
.icon-search {
background-color: #ff88ae!important
}
}
.searchcatekids {
.searchinput {
border: 1px solid #7bd3f9 !important
}
.icon-search {
background-color: #7bd3f9!important
}
}
.gobuyboys {
background: url(/header/cart/boys.png) no-repeat;
}
.gobuygirls {
background: url(/header/cart/girls.png) no-repeat;
}
.gobuykids {
background: url(/header/cart/kids.png) no-repeat;
}
.gobuylifestyle {
background: url(/header/cart/lifestyle.png) no-repeat;
}
.searchcatelifestyle {
.searchinput {
border: 1px solid #5e4b3c !important
}
.icon-search {
background-color: #5e4b3c !important
}
}
.boys {
background-color: #3a3a3a;
.sub-nav-wrapper {
background-color: #3a3a3a;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #3a3a3a;
}
}
.girls {
background-color: #ff88ae;
.sub-nav-wrapper {
background-color: #ff88ae;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #ff88ae;
}
}
.kids {
background-color: #7bd3f9;
.sub-nav-wrapper {
background-color: #7bd3f9;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #7bd3f9;
}
}
.lifestyle {
background-color: #5e4b3c;
.sub-nav-wrapper {
background-color: #5e4b3c;
display: block !important;
}
.third-nav-wrapper {
border-top: 2px solid #5e4b3c;
}
}
.name-cn {
text-align: center;
line-height: 16px !important;
a {
color: black;
font-size: 16px !important;
}
}
.name-en {
text-align: center;
line-height: 14px !important;
margin-bottom: 6px;
a {
color: #8e8e8e;
font-size: 12px;
line-height: 14px !important;
font-family: 'arial' !important;
}
}
.sub-nav-wrapper {
display: none;
height: 40px;
left: 0;
width: 100%;
position: absolute;
z-index: 1000;
}
.sub-nav-list {
width: 1150px;
height: 40px;
margin: 0 auto;
overflow: hidden;
}
.sub-nav-item {
float: left;
padding: 12px 46px 12px 0;
box-sizing: border-box;
margin-right: 38px;
&:last-child {
margin-right: 0 !important;
}
a {
position: relative;
color: white;
font-size: 14px;
line-height: 14px;
display: inline-block;
}
}
.newlogo {
display: block;
width: 26px;
height: 12px;
background-image: resolve(/header/new.png);
background-repeat: no-repeat;
position: absolute;
right: -29px;
top: -6px;
}
.sub-nav-item:hover > a {
padding-bottom: 3px;
border-bottom: 2px solid white;
}
.actsecondnav {
padding-bottom: 3px;
border-bottom: 2px solid white;
}
.sub-nav-item:hover .third-nav-wrapper {
display: block;
}
.third-nav-wrapper {
box-sizing: border-box;
height: 410px;
position: absolute;
left: 0;
top: 38px;
width: 100%;
min-width: 1150px;
display: none;
z-index: 10000;
padding-top: 30px;
padding-bottom: 30px;
background-color: #f8f8f8;
}
.third-nav {
width: 1150px;
height: 100%;
margin: 0 auto;
}
.category {
width: 880px;
float: left;
overflow: hidden;
.thirdnavlist {
box-sizing: border-box;
width: 220px;
height: 240px;
float: left;
padding-left: 20px;
border-right: 1px solid #dcdcdc;
padding-right: 20px;
}
}
.category-title {
color: black;
font-size: 16px;
width: 178px;
padding-bottom: 12px;
border-bottom: 1px solid #000;
line-height: 16px;
margin-bottom: 20px;
a {
color: black !important;
}
}
.category-list {
margin-top: 16px;
margin-bottom: 30px;
}
.category-item {
line-height: 28px;
}
.category-list a {
color: #a1a1a1 !important;
font-size: 14px;
}
.category-list .category-item .hot {
color: #ee0011 !important;
font-size: 14px;
}
.category-item-act a {
color: black !important;
}
.showdetail {
box-sizing: border-box;
padding-left: 19px;
padding-right: 19px;
width: 337px;
height: 250px;
float: right;
}
[class^="icon-"], [class*=" icon-"] {
display: inline-block;
vertical-align: middle;
background-repeat: none;
}
.icon-hamburger {
background: url(/header/hamburger.png) no-repeat;
width: 13px;
height: 11px;
}
.icon-headphones {
background: url(/header/iphone.png) no-repeat;
width: 15px;
height: 10px;
margin-top: 2px;
}
.icon-heart {
background: url(/header/heart.png) no-repeat;
width: 12px;
height: 11px;
margin-top: -2px;
}
.icon-mail {
background: url(/header/mail.png) no-repeat;
width: 16px;
height: 10px;
margin-top: -2px;
}
.icon-iphone {
background: url(/header/iphone.png) no-repeat;
width: 8px;
height: 14px;
margin-top: -2px;
}
.icon-papers {
background: url(/header/paper.png) no-repeat;
width: 10px;
height: 14px;
margin-top: -2px;
}
.icon-bottomarrow {
background: url(/header/bottom-arrow.png) no-repeat;
width: 10px;
height: 5px;
margin-top: -2px;
}
.icon-logo {
background: resolve(/header/logo.png) no-repeat center center;
width: 182px;
height: 53px;
top: 22px;
left: 44.2%;
position: absolute;
.main-link {
display: block;
width: 100%;
height: 100%;
}
}
.search {
position: relative;
}
.searchspan {
margin-top: 45px;
float: left;
display: inline-block;
overflow: hidden;
}
.searchinput {
float: left;
width: 240px;
height: 28px;
border: 1px solid #000;
box-sizing: border-box;
padding: 6px 0 5px 10px;
border-right: none;
}
.icon-search {
background: resolve(/header/search.png) no-repeat center center;
width: 80px;
height: 28px;
float: left;
border: none;
margin-top: 45px;
background-color: #3a3a3a;
}
.search-list {
position: absolute;
top: 73px;
left: 0;
z-index: 1000;
box-sizing: border-box;
display: none;
background-color: white;
padding-top: 20px;
width: 100%;
max-height: 500px;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}
.search-item {
position: relative;
padding: 5px;
height: 25px;
line-height: 25px;
font: 12px;
&:hover {
background-color: #f4f4f4;
}
}
.searchvalue {
position: absolute;
left: 10px;
max-width: 192px;
font-size: 12px;
@mixin ellipsis;
}
.valuenum {
position: absolute;
right: 10px;
font-size: 12px;
}
.header-tool {
padding-right: 23px;
}
.gobuy {
margin-top: 47px;
margin-left: 23px;
width: 26px;
height: 26px;
position: relative;
cursor: pointer;
}
.gobuy-wrapper {
position: absolute;
display: none;
top: 24px;
right: -14px;
width: 378px;
padding-top: 6px;
z-index: 10000000;
}
.gobuy-empty {
position: absolute;
width: 100%;
height: 507px;
z-index: 1;
background: #f8f8f8 resolve(/header/empty_car.png) no-repeat 106px 132px;
.information {
margin-top: 300px;
width: 100%;
height: 18px;
line-height: 18px;
font-size: 18px;
text-align: center;
}
}
.gobuy-loading {
position: absolute;
width: 100%;
height: 407px;
z-index: 1;
background: #f8f8f8 resolve(/header/loading.gif) no-repeat center 150px;
.information {
margin-top: 180px;
width: 100%;
height: 12px;
line-height: 12px;
font-size: 12px;
text-align: center;
}
}
.gobuy-notempty {
position: absolute;
width: 100%;
z-index: 1;
background-color: #f8f8f8;
overflow: hidden;
}
.goods-list-wrapper {
width: 100%;
max-height: 444px;
margin-bottom: 19px;
overflow-y: auto;
overflow-x: hidden;
}
.goods-list {
margin-top: 40px;
}
.goods-item {
height: 64px;
margin-bottom: 18px;
padding-left: 18px;
}
.goods-img {
display: inline-block;
float: left;
width: 46px;
height: 62px;
margin-right: 13px;
}
.goods-detail {
margin-right: 16px;
.content {
width: 170px;
height: 14px;
line-height: 14px;
font-size: 14px;
margin-bottom: 13px;
@mixin ellipsis;
a {
color: #666;
outline: none;
text-decoration: none;
}
}
.style {
height: 14px;
line-height: 14px;
font-size: 14px;
color: #b0b0b0;
}
}
.goods-price .priceandnum {
height: 14px;
line-height: 14px;
font-size: 14px;
margin-bottom: 13px;
min-width: 75px;
text-align: right;
}
.goods-price .delete {
display: inline-block;
float: right;
font-size: 14px;
color: #000;
}
.activity-item {
margin-bottom: 8px;
padding-left: 18px;
}
.activity-name {
display: inline-block;
box-sizing:border-box;
border: none;
width: 60px;
height: 18px;
line-height: 18px;
background-color: #3a3a3a;
color: white;
font-size: 14px;
text-align: center;
margin-right: 13px;
vertical-align: top;
}
.activity-content {
display: inline-block;
line-height: 14px;
width: 250px;
color: #3a3a3a;
font-size: 12px;
word-break: break-all;
}
.gobuy-notempty-footer {
width: 100%;
height: 61px;
text-align: center;
h3 {
box-sizing: border-box;
width: 349px;
margin: 0 auto;
height: 61px;
line-height: 61px;
border-top: 1px solid #dcdcdc;
}
a {
font-size: 18px;
color: #444;
}
}
.ic-infomation {
position: absolute;
background: url(/header/ic-information.png) no-repeat;
width: 27px;
height: 20px;
top: -10px;
right: -15px;
color: white;
text-align: center;
line-height: 20px;
font-size: 12px;
}
.float-left {
float: left;
}
.float-right {
float: right;
}
.showdetail img {
display: block;
box-sizing: border-box;
width: 337px;
height: 250px;
}
.showdetail .title {
display: block;
margin-top: 40px;
width: 100%;
height: 15px;
text-align: center;
line-height: 15px;
font-size: 14px;
color: black !important;
@mixin ellipsis;
}
.cate_row {
float:left;
height:352px;
box-sizing:border-box;
li {
box-sizing:border-box;
}
}
.cate_row1 {
width:253px;
}
.cate_row2 {
width:278px;
border-left:1px solid #ccc;
padding-left: 50px;
}
.cate_row3 {
width: 270px;
border-left:1px solid #ccc;
padding-left: 50px;
}
.third-nav .cattitle {
width: 180px;
padding-bottom: 10px;
border-bottom: 1px solid #000;
line-height: 18px;
margin-bottom: 20px;
}
.third-nav .cattitle h3 a {
color: black !important;
font-size: 14px;
}
.third-nav .catdetail {
line-height: 14px;
height: 14px;
margin-bottom: 24px;
min-width: 200px;
a {
color: #a1a1a1 !important;
font-size: 14px;
}
.hot {
color: #ee0011 !important ;
}
}
.thirdcatelink:hover {
text-decoration: underline !important ;
}
.hovercontent {
display: none;
}
}
.simple-header {
height: 66px;
margin: 0 0 20px 0;
border-bottom: 2px solid #222;
.header-inner {
width: 990px;
height: 100%;
margin: 0 auto;
}
.logo {
float: left;
line-height: 66px;
font-size: 0;
img {
vertical-align: middle;
}
}
}
.simple-header .header-tool {
float: right;
line-height: 66px;
font-size: 0;
li {
display: inline-block;
padding: 0 10px;
line-height: 28px;
font-size: 12px;
vertical-align: middle;
span, a {
font-size: 12px;
vertical-align: middle;
}
.tell-icon {
font-size: 12px;
}
.tell-icon ~ span {
font-weight: bold;
}
}
.login-box a {
color: #666;
}
.tool-options {
position: relative;
font-size: 0;
cursor: pointer;
&:hover {
background-color: #eaeceb;
.iconfont {
&.up {
display: inline-block;
}
&.down {
display: none;
}
}
}
.iconfont, span{
display: inline-block;
font-size: 12px;
height: 28px;
line-height: 28px;
vertical-align: top;
&.up {
display: none;
}
}
.tool-select {
display: none;
position: absolute;
width: 74px;
left: 0;
background: #eaeceb;
z-index: 9;
a {
display: block;
padding: 0 0 0 10px;
border-top: 1px solid #ddd;
}
}
}
}
.min-screen .yoho-header {
.header-topwrapper {
min-width: 990px;
}
.header-top {
width: 990px;
}
.header-navwrapper {
min-width: 990px;
}
.header-wrapper {
width: 990px;
}
.header-navcontent {
width: 990px;
}
.icon-logo {
left: 39.2%;
.main-link {
display: block;
width: 100%;
height: 100%;
}
}
.sub-nav-list {
width: 990px;
min-width: 990px;
}
.sub-nav-item {
margin-right:15px;
}
.first-nav-item {
float: left;
padding: 10px 14px 0;
margin-right: 3px;
}
.third-nav {
width: 990px;
}
.third-nav-wrapper {
min-width: 990px;
}
.category {
width: 800px;
}
.cate_row1 {
width: 204px;
}
.cate_row2 {
width: 244px;
border-left: 1px solid #ccc;
padding-left: 39px;
}
.cate_row3 {
width: 163px;
border-left: 1px solid #ccc;
padding-left: 28px;
}
.category .thirdnavlist {
width: 200px;
}
.category-title {
width: 152px;
}
.showdetail {
width: 190px;
padding-right: 0;
img {
width: 174px;
height: 155px;
}
}
}
#cover {
left: 0px;
top: 0px;
width: 100%;
height: 100%;
position: fixed;
z-index: 1001;
.con {
background: rgba(0, 0, 0, 0.6) !important;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
position: absolute;
z-index: 1002;
opacity: 0.5;
}
.tag_img_warpper {
margin: 0px auto;
width: 180px;
height: 168px;
img {
width: 100%;
height: 100%;
}
}
.guide-box {
background: rgb(255, 255, 255);
margin: 0px auto;
height: 400px;
position: relative;
z-index: 1003;
.close {
top: -15px;
text-align: center;
right: -15px;
color: rgb(255, 255, 255);
line-height: 22px;
font-size: 24px;
position: absolute;
background: rgb(0, 0, 0);
border-radius: 50px;
border: currentColor;
border-image: none;
width: 28px;
height: 28px;
line-height: 25px;
display: block;
}
li {
padding: 10px;
width: 200px;
height: 400px;
float: left;
box-sizing: border-box;
&.girls {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.lifestyle {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.kids {
border-left-color: rgb(238, 238, 238);
border-left-width: 1px;
border-left-style: solid;
.goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
}
&.boys .goods-num {
text-align: center;
color: rgb(187, 187, 187);
line-height: 12px;
font-size: 12px;
margin-top: 16px;
}
.go {
margin: 26px auto 0px;
width: 100%;
height: 18px;
text-align: center;
color: rgb(176, 176, 176);
line-height: 18px;
font-size: 18px;
font-style: italic;
font-weight: lighter;
display: block;
}
}
}
.boys .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.girls .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.kids .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.lifestyle .block_cn {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 30px;
}
.boys .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.girls .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.kids .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.lifestyle .block_en {
text-align: center;
line-height: 26px;
font-size: 26px;
font-weight: bold;
margin-top: 19px;
}
.boys .block_cn,
.boys .block_en {
color: #000;
}
.girls .block_cn,
.girls .block_en {
color: rgb(255, 136, 174);
}
.kids .block_cn,
.kids .block_en {
color: rgb(122, 217, 248);
}
.lifestyle .block_cn,
.lifestyle .block_en {
color: rgb(79, 64, 55) !important;
}
.boys .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.girls .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.kids .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
.lifestyle .block_line {
margin: 20px auto 0px;
width: 50px;
height: 0px;
border-bottom-color: rgb(204, 204, 204);
border-bottom-width: 1px;
border-bottom-style: solid;
}
}
... ...