laravel redis 购物车
一、购物车redis 类
<?php
/**
* Created by PhpStorm.
* User: Lenovo
* Date: 29/4/2020
* Time: 下午4:26
*/
namespace App\Library;
use Illuminate\Support\Facades\Cache;
use Illuminate\Support\Facades\Redis;
class Cart
{
/**
* 购物车增加数量
* @param $member_id
* @param $goods_id
* @return mixed
*/
public static function addCart($member_id, $goods_id){
$hashKey = "cart_".$member_id; //hash键名
$key = $goods_id; //键名
//加入
return Redis::hincrby($hashKey, $key, 1);
}
/**
* 购物车减少数量
* @param $member_id
* @param $goods_id
* @return mixed
*/
public static function reduceCart($member_id, $goods_id){
$hashKey = "cart_".$member_id; //hash键名
$key = $goods_id; //键名
//减少
return Redis::hincrby($hashKey, $key, -1);
}
public static function updateCart($member_id,$goods_id,$value){
$hashKey = "cart_".$member_id; //hash键名
$key = $goods_id; //键名
//减少
return Redis::hset($hashKey, $key, $value);
}
/**
* 移除购物车某个产品
* @param $member_id
* @param $goods_id
* @return mixed
*/
public static function removeCart($member_id, $goods_id){
$hashKey = "cart_".$member_id; //hash键名
$key = $goods_id; //键名
return Redis::hdel($hashKey, $key);
}
/**
* 获取某个产品的值
* @param $member_id
* @param $goods_id
* @return mixed
*/
public static function getCart($member_id, $goods_id){
$hashKey = "cart_".$member_id; //hash键名
$key = $goods_id; //键名
return Redis::hget($hashKey, $key);
}
/**
* 清空购物车
* @param $member_id
* @return mixed
*/
public static function flushCart($member_id){
$hashKey = "cart_".$member_id; //hash键名
return Redis::del($hashKey);
}
/**
* 获取购物车列表
* @param $member_id
* @return mixed
*/
public static function listCart($member_id){
$hashKey = "cart_".$member_id; //hash键名
return Redis::hgetall($hashKey);
}
}
二、业务web页
商城首页
@extends('mall.base')
@section('content')
<div class="clearfix rt"> </div>
<div class="sh_contain bg_blue">
<div class="sh_content pb30">
<div class="sh_search">
<h2 class="fz32">**商城——品牌**商城</h2>
<h1 class="fz42 mt20"><span>63001</span> 种品牌现货在线选购</h1>
<form action="{{route('mall.search_prods')}}" method="post" id="search_shop_form" class="mt50">
@csrf
<input type="hidden" name="search_cas" id="search_cas">
<div class="sh_search_box">
<div class="sh_search_input">
<input class="search_input" type="text" name="keyword" id="keyword" placeholder="请输入化学品的中文名,英文名或CAS号" autocomplete="off">
<input type="button" value="搜索" name="sh_search_btn" id="shSearchBtn" class="sh_search_btn">
<div class="loading hidden"></div>
</div>
<div class="sh_search_res hidden" id="search_res_items">
{{--<a class="sh_res" href=""><div class="sh_res_item">【63084-98-0】对氨基苯酚,硫酸盐</div></a>--}}
</div>
</div>
</form>
<div class="sh_quick_link">
<a href="{{route('mall.show', array('cas'=>'24424-99-5'))}}">BOC酸酐</a>
<a href="{{route('mall.show', array('cas'=>'530-62-1'))}}">N,N'-羰基二咪唑</a>
<a href="{{route('mall.show', array('cas'=>'87413-09-0'))}}">戴斯-马丁氧化剂</a>
<a href="{{route('mall.show', array('cas'=>'1122-58-3'))}}">DMAP</a>
<a href="{{route('mall.show', array('cas'=>'128-08-5'))}}">NBS</a>
<a href="{{route('mall.show', array('cas'=>'603-35-0'))}}">三苯基膦</a>
</div>
<div class="sh_brand_list mt50">
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo1-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo2-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo3-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo4-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo5-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo6-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo7-1.jpg"></a></div>
<div class="item"><a href="javascript:void(0);"><img src="/static/new/images/brand/logo8-1.jpg"></a></div>
</div>
<div class="clearfix rt"> </div>
</div>
</div>
</div>
<div class="clearfix rt"> </div>
@endsection
@section('js')
<script type="text/javascript" src="/static/new/js/mall.js"></script>
@endsection
列表页面
@extends('mall.main')
@section('content')
<div class="clearfix rt"> </div>
<div class="sh_contain">
<div class="sh_content">
<div class="sh_nav mt20">当前位置:<a href="/">首页</a> > <a href="{{route('mall.index')}}">试剂商城</a> > 试剂价格</div>
<div class="sh_prod mt20">
<div class="sh_prod_img"><img src="{{$prod->img}}" onerror="javascript:this.src='/static/new/images/no_pic.png'"></div>
<div class="sh_prod_item">
<table class="sh_table">
<tbody>
<tr class="bg">
<td class="st1">cas</td>
<td class="st2">{{$prod->cas}}</td>
</tr>
<tr>
<td class="st1">产品名称</td>
<td class="st2">{{$prod->name_cn ?$prod->name_cn : $prod->name}}</td>
</tr>
<tr class="bg">
<td class="st1">分子式</td>
<td class="st2">{{$prod->mf}}</td>
</tr>
<tr>
<td class="st1">分子量</td>
<td class="st2">{{$prod->mw}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="clearfix rt"> </div>
<div class="sh_condition">
<div class="sh_cond_list">
<dl>
<dt>纯度:</dt>
<dd><a href="" class="all">全部</a> <a href="">95+%</a><a href="">97%</a><a href="">98%</a><a href="">99%</a><a href="">分析标准品,≥99.5%(GC)</a> </dd>
</dl>
<dl>
<dt>品牌:</dt>
<dd><a href="" class="all">全部</a><a href="">毕得</a><a href="">韶远</a><a href="">阿拉丁</a><a href="">浩鸿</a><a href="">麦克林</a><a href="">乐研</a><a href="">药石</a> </dd>
</dl>
<dl>
<dt>规格:</dt>
<dd><a href="" class="all">全部</a><a href="">100g</a><a href="">1000g</a><a href="">25g</a><a href="">2.5g</a><a href="">1kg</a><a href="">5g</a><a href="">25ml</a> </dd>
</dl>
</div>
<div class="clearfix rt"> </div>
</div>
<div class="clearfix rt"> </div>
<!--<div class="sh_sort">
</div>-->
<div class="sh_search_list mt20">
@csrf
<table class="search_res">
<thead>
<tr>
<th>品牌</th>
<th>规格</th>
<th width="20%">纯度</th>
<th width="20%">货期</th>
<th width="15%">市场价/一览价</th>
<th width="10%">操作</th>
</tr>
</thead>
<tbody>
@foreach($list as $key=>$value)
@foreach($value as $k=>$v)
<tr>
@if($k == 0)
<td rowspan="{{count($value)}}" class="lft">{{$key}}</td>
@endif
<td>{{$v['packsize']}}{{$v['packunit']}}</td>
<td>{{$v['purity']}}</td>
<td>现货</td>
<td><em>¥{{$v['origin_price']}}</em> / <span class="money">¥{{$v['price']}}</span></td>
<td><a href="javascript:add_cart({{$v['id']}});" class="blue">加入购物车</a></td>
</tr>
@endforeach
@endforeach
</tbody>
</table>
</div>
</div>
</div>
<div class="clearfix rt"> </div>
@endsection
@section('js')
<script type="text/javascript" src="/static/new/js/mall.js"></script>
@endsection
购物车页面
@extends('mall.main')
@section('content')
<div class="clearfix rt"> </div>
<div class="sh_contain">
<div class="sh_content">
<div class="sh_nav mt20">当前位置:<a href="/">首页</a> > <a href="{{route('mall.index')}}">试剂商城</a> > 购物车</div>
<div class="sh_search_list mt20">
@csrf
<table class="search_res">
<thead>
<tr>
<th width="15%">产品</th>
<th>规格 / 品牌</th>
<th width="15%">纯度</th>
<th width="15%">货期</th>
<th width="10%">单价</th>
<th width="10%">数量</th>
<th width="10%">总价</th>
<th width="10%">操作</th>
</tr>
</thead>
<tbody>
@foreach($list as $key=>$value)
@foreach($value['goods'] as $k=>$v)
<tr>
@if($k == 0)
<td rowspan="{{count($value['goods'])}}" class="lftg">
<img src="{{$value['info']['img']}}">
<br><a href="{{route('product_detail',['cas'=>$value['info']['cas']??''])}}" class="blue">{{$value['info']['cas']}}</a><br>{{$value['info']['name_cn'] ? $value['info']['name_cn'] : $value['info']['name']}}
</td>
@endif
<td><input type="checkbox" name="goods_id" value="{{$v['id']}}" checked> {{$v['packsize']}}{{$v['packunit']}} <span class="orange">({{$v['brand']}})</span></td>
<td>{{$v['purity']}}</td>
<td>现货</td>
<td>¥{{$v['price']}}<input type="hidden" name="price" class="price" value="{{$v['price']}}"></td>
<td><div class="cart_num_block"><div class="reduce_num fl" gid="{{$v['id']}}">-</div><input type="text" value="{{$v['num']}}" name="num" class="num fl"><div class="add_num fr" gid="{{$v['id']}}">+</div></div></td>
<td><span class="money">¥{{$v['total_price']}}</span></td>
<td><a href="javascript:remove_cart({{$v['id']}});" class="blue">删除</a></td>
</tr>
@endforeach
@endforeach
</tbody>
<tfoot>
<tr>
<td colspan="8">
<div class="cart_check"><input type="checkbox" class="select_all" checked="checked"> 全选</div>
<div class="cart_choose"> 已选择 <span class="orange fz18" id="cart_selected_num">{{$cart_num}}</span> 件商品 合计(不含运费):<span class="orange fz18 mr10" id="cart_total_price">¥{{$total_price}}元</span> <a href="javascript:void(0);" id="new_create_order" class="cart_submit">结算</a> </div>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
<div class="clearfix rt"> </div>
@endsection
@section('js')
<script type="text/javascript" src="/static/new/js/mall.js"></script>
@endsection
三、购物车js页
/**
* Created by Lenovo on 23/4/2020.
*/
//产品搜索
$("#shSearchBtn").click(function () {
var keyword = $.trim($("#keyword").val());
if(keyword){
getProdByKeywords(keyword);
}else{
alert_message('提示','请输入搜索关键词!',null,function(){
close_alert_div();
})
}
});
$("#keyword").blur(function () {
var keyword = $.trim($("#keyword").val());
if(keyword){
getProdByKeywords(keyword);
}
});
$("#keyword").keyup(function () {
var keyword = $.trim($("#keyword").val());
if(keyword){
getProdByKeywords(keyword);
}
});
/**
* 搜索产品
* @param keywords
*/
function getProdByKeywords(keyword) {
var _token = $("input[name='_token']").val();
$(".loading").show();
$.ajax({
url: '/mall/search_prods',
data: {keyword: keyword,_token: _token},
type: 'post',
cache: false,
dataType: 'json',
success: function (result) {
var items_str = '';
$(".loading").hide();
if (result.code == 0)
{
if(result.data.length > 0){
$.each(result.data, function (i, item) {
var prod_name ='';
if(item.name_cn != ''){prod_name = item.name_cn}else{prod_name = item.name}
items_str +='<a class="sh_res" href="/mall/show/'+item.cas+'.html"><div class="sh_res_item">【'+item.cas+'】'+prod_name+'</div></a>';
});
}else{
items_str +='<a class="sh_res" href="javascript:void(0);"><div class="sh_res_item">暂无匹配到您的查询信息</div></a>';
}
}
else
{
items_str +='<a class="sh_res" href="javascript:void(0);"><div class="sh_res_item">暂无匹配到您的查询信息</div></a>';
}
$("#search_res_items").html(items_str);
$("#search_res_items").show();
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}
//点击页面搜索input以外其他地方,隐藏搜索下拉结果页
$(document).on('click',':not(.sh_search_box)',function(){
$("#search_res_items").html('');
$("#search_res_items").hide();
return;
})
/**
* 添加产品进入购物车
* @param goods_id
*/
function add_cart(goods_id) {
var _token = $("input[name='_token']").val();
$.ajax({
url: '/mall/cart/add',
data: {goods_id: goods_id,_token: _token},
type: 'post',
cache: false,
dataType: 'json',
success: function (result) {
if (result.code == 0)
{
$("#cart_num").html(result.data.cart_num);
alert_message('提示',result.msg,null,function(){
close_alert_div();
})
}
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}
/**
* 移除购物车某个产品
* @param goods_id
*/
function remove_cart(goods_id) {
alert_confirm_message('提示','确定移除购物车吗?',null,function(){
close_alert_div();
var _token = $("input[name='_token']").val();
$.ajax({
url: '/mall/cart/remove',
data: {goods_id: goods_id,_token: _token},
type: 'post',
cache: false,
dataType: 'json',
success: function (result) {
if (result.code == 0)
{
alert_message('提示',result.msg,null,function(){
close_alert_div();
window.location.href = "/mall/cart.html";
})
}
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}, function(){
close_alert_div();
});
}
//全局显示购物车数量
showCartNum();
function showCartNum() {
$.ajax({
url: '/mall/cart/count',
data: {},
type: 'get',
cache: false,
dataType: 'json',
success: function (result) {
var num = 0;
if (result.code == 0)
{
num = result.data;
}
$("#cart_num").html(num);
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}
/**
* 购物车商品减少数量
*/
$(".reduce_num").click(function () {
var goods_id = $(this).attr('gid');
var number = Number($(this).parent().children(".num").val());
var price = $(this).parent().parent().parent().find(".price").val();
var num = 1;
if(number > 1){
num = number -1;
}
$(this).parent().children(".num").val(num);
update_cart_goods_count(goods_id, num);
//小计金额
var xjprice = "¥"+(num * price).toFixed(2);
$(this).parent().parent().parent().find(".money").html(xjprice);
});
/**
* 购物车商品新增数量
*/
$(".add_num").click(function () {
var goods_id = $(this).attr('gid');
var num = Number($(this).parent().children(".num").val()) + 1;
//var price = $(this).parent().parent().parent().children(".price").val();
var price = $(this).parent().parent().parent().find(".price").val();
//console.log(price);
$(this).parent().children(".num").val(num);
update_cart_goods_count(goods_id, num);
//小计金额
var xjprice = "¥"+(num * price).toFixed(2);
$(this).parent().parent().parent().find(".money").html(xjprice);
});
/**
* 更新购物车产品数量
* @param goods_id
*/
function update_cart_goods_count(goods_id, num) {
$.ajax({
url: '/mall/cart/update_cart',
data: {goods_id: goods_id, num: num},
type: 'get',
cache: false,
dataType: 'json',
success: function (result) {
if (result.code == 0)
{
calculate();
}
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}
//全选
$(".select_all").click(function () {
if(this.checked) {
$("input[name='goods_id']").attr('checked',true);
}else {
$("input[name='goods_id']").attr('checked',false);
}
calculate();
});
//设置购物车价格和数量
function setCartSelected(price, num) {
$("#cart_selected_num").html(num);
$("#cart_total_price").html('¥'+price+'元');
}
/**
* 获取选中的值
* @returns {Array}
*/
function getCheckIds() {
var checkIds = new Array();
$("input[name='goods_id']:checked").each(function () {
//console.log(this.value);
checkIds.push(this.value);
});
return checkIds;
}
//设置金额和数量
$("input[name='goods_id']").click(function () {
calculate();
});
//计算选中的金额和数量
function calculate() {
var checkIds = getCheckIds();
if(checkIds.length == 0){
setCartSelected(0, 0);
}else{
calculateCheckIds(checkIds);
}
}
//计算选中的金额和数量
function calculateCheckIds(checkIds) {
$.ajax({
url: '/mall/cart/calculate',
data: {checkIds: checkIds},
type: 'get',
cache: false,
dataType: 'json',
success: function (result) {
if (result.code == 0)
{
setCartSelected(result.data.total_price, result.data.cart_num);
}
},
error: function () {
close_loading_div();
alert_message('提示','系统异常,请联系客服人员!',null,function(){
close_alert_div();
})
}
});
}
四、后端业务逻辑
<?php
namespace App\Http\Controllers\Mall;
use App\Library\Cart;
use App\Library\Common;
use App\Library\Y;
use App\Models\Prod\Prod;
use App\Models\Prod\ReagentProd;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\Cache;
class IndexController extends Controller
{
//
public function index(Request $request)
{
return view('mall.index');
}
public function show(Request $request, $cas){
if(!$cas) return '缺少cas参数';
$prod = Common::getProdByCas($cas);
if(!$prod) return '查找不到产品cas';
//查找报价
$reagentProds = Common::getReagentProds($cas);
$list = [];
//按试剂厂商聚合
foreach ($reagentProds as $key=>$value){
$list[$value['reagent_name']][] = $value;
}
return view('mall.show', compact('prod', 'list', 'member_id'));
}
/**
* 加入购物车
* @param Request $request
* @return mixed
*/
public function cart_add(Request $request){
$goods_id = $request->get('goods_id');
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
$res = Cart::addCart($member_id, $goods_id);
$goods = Cart::listCart($member_id);
$cart_num = count($goods);
$data = array(
'res'=>$res,
'cart_num'=>$cart_num
);
return Y::success('加入购物车成功!',$data);
}
/**
* 删除购物车某个产品
* @param Request $request
* @return mixed
*/
public function cart_remove(Request $request){
$goods_id = $request->get('goods_id');
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
$res = Cart::removeCart($member_id, $goods_id);
$data = array(
'res'=>$res
);
return Y::success('移除购物车成功!',$data);
}
/**
* 获取购物车数量
* @param Request $request
* @return mixed
*/
public function cart_count(Request $request){
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
$goods = Cart::listCart($member_id);
return Y::success('获取购物车数量成功!',count($goods));
}
/**
* 更新购物车数量信息
* @param Request $request
* @return mixed
*/
public function update_cart(Request $request){
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
$goods_id = $request->get('goods_id');
$num = $request->get('num', 1);
if($num <=1) $num = 1;
$res = Cart::updateCart($member_id, $goods_id, $num);
$data = array(
'res'=>$res
);
return Y::success('更新购物车成功!',$data);
}
/**
* 购物车
* @param Request $request
* @return mixed
*/
public function cart(Request $request){
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
//Cart::flushCart($member_id);
$goods = Cart::listCart($member_id);
$goods_id_arr = array_keys($goods);
$cart_num = count($goods);
$items = ReagentProd::whereIn('id', $goods_id_arr)->get()->toArray();
$temp = [];
$list = [];
$total_price = 0;
//cas集合,主要查找图片
$cas_arr = [];
//按产品先聚合 试剂厂商聚合
foreach ($items as $key=>$value){
$value['num'] = isset($goods[$value['id']]) ?$goods[$value['id']] : 1;
$value['total_price'] = sprintf("%.2f", $value['num'] * $value['price']);
$total_price +=$value['total_price'];
array_push($cas_arr, $value['cas']);
$temp[$value['cas']][] = $value;
}
//查找cas 对应的图片
//去重
$cas_arr = array_unique($cas_arr);
$prod = Prod::whereIn('cas', $cas_arr)->select('cas','img', 'name_cn', 'name')->get()->toArray();
$cas_img_arr = array_column($prod, null, 'cas');
foreach ($temp as $k=>$v){
$list[$k] = array(
'info'=>$cas_img_arr[$k],
'goods'=>$v,
);
}
return view('mall.cart', compact('list','cart_num', 'total_price'));
}
/**
* 计算选中金额和价格
* @param Request $request
* @return mixed
*/
public function calculate(Request $request){
$member_id = isset(auth('member')->user()->id) ?auth('member')->user()->id : 0;
$checkIds = $request->get('checkIds');
$checkCart = [];
foreach ($checkIds as $k=>$v){
$count = Cart::getCart($member_id,$v);
$checkCart[$v] = $count;
}
$cart_num = count($checkIds);
$total_price = 0;
$items = ReagentProd::whereIn('id', $checkIds)->get()->toArray();
foreach ($items as $k=>$v){
$total_price += sprintf("%.2f", $v['price'] * $checkCart[$v['id']]);
}
$data = array(
'cart_num'=>$cart_num,
'total_price'=>sprintf("%.2f", $total_price)
);
return Y::success('计算成功!',$data);
}
/**
* 搜索产品
* @param Request $request
* @return mixed
*/
public function search_prods(Request $request){
$keyword = $request->get('keyword');
$data = Common::searchProds($keyword);
return Y::success('获取成功!',$data);
}
}
五、css样式
/*
头部
*/
a.blues{
color: #1388ff;
}
.s_top{
width: 100%;
height: 37px;
background: #2d323e;
color: #ffffff;
}
.s_top a{
color: #ffffff;
}
.s_top .s_top_bar{
width: 1200px;
margin: 0px auto;
height: 37px;
line-height: 37px;
clear: both;
}
.s_top .s_top_bar .s_bar_left{
width: 350px;
float: left;
text-align: left;
}
.s_top .s_top_bar .s_bar_left em{
color: #fe6b00;
font-size: 16px;
font-weight: bold;
}
.s_top .s_top_bar .s_bar_right{
width: 750px;
float: right;
text-align: right;
}
.bg_blue{
background: #157790;
}
.bg_white{
background: #ffffff;
}
.sh_contain {
width: 100%;
height: auto;
clear: both;
padding: 1px 0px;
}
.sh_content {
width: 1200px;
margin: 10px auto;
}
.sh_search{
padding-top: 65px;
text-align: center;
color: #fff;
}
.fz18{
font-size: 18px;
}
.fz32 {
font-size: 32px;
font-weight: inherit;
}
.fz42 {
font-size: 42px;
font-weight: inherit;
}
.sh_search_box{
width: 900px;
height: 50px;
margin: 0 auto;
padding: 0px;
position: relative;
}
.sh_search_input{
width: 100%;
font-size: 14px;
height: 50px;
border: 0px;
padding: 0px;
margin: 0px;
}
.search_input {
width: 820px;
height: 50px;
border: 0px;
margin: 0px;
padding: 0px;
font-size: 14px;
text-indent: 20px;
float: left;
}
.sh_search_btn {
width: 80px;
line-height: 50px;
height: 50px;
background-color: #089ad0;
border:0px;
color: #FFF;
font-size: 16px;
outline: none;
cursor: pointer;
float: right;
}
.sh_search_res{
background: #ffffff;
position: absolute;
top: 100%;
left: 0px;
width: 820px;
margin-top: 1px;
}
.sh_res{
cursor: pointer;
display: block;
overflow: hidden;
font-size: 12px;
padding: 5px;
color: rgba(0,0,0,0.87);
line-height: 30px;
border-bottom: 1px solid #dddddd;
text-align: left;
text-indent: 20px;
}
.sh_res_item{
height: auto;
margin: -.14285em 0 0;
font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
font-weight: 700;
font-size: 1em;
color: rgba(0,0,0,0.85);
border: 0px;
padding: 0px;
}
.sh_quick_link {
width: 900px;
margin: 15px auto 0;
font-size: 14px;
text-align: left;
}
.sh_quick_link a {
color: #fff;
margin-right: 15px;
}
.sh_brand_list{
width: 1200px;
}
.sh_brand_list >.item{
float: left;
width: 280px;
height: 100px;
margin-right: 15px;
}
.sh_brand_list >.item img{
width: 250px;
height: 100px;
}
.footer{
width:100%;
background: #ffffff;
height: auto;
clear: both;
border-top:1px solid #eeeeee;
margin-top: 20px;
}
.foot{
width:1200px;
margin:20px auto;
}
.foot dl dt{
font-size: 16px;
text-align: left;
}
.foot dl dd{
float: left;
margin-right: 10px;
height: 30px;
line-height: 30px;
margin-top: 10px;
}
.f-fast{
float: left;
width: 33%;
height: auto;
}
.f-terms{
float: left;
width: 33%;
height: auto;
}
.f-partner{
float: right;
width: 270px;
height: auto;
}
.copyright{
margin: 20px auto;
clear: both;
height: 40px;
line-height: 40px;
text-align: center;
}
/*详情页*/
.sh_prod{
width: 100%;
}
.sh_prod_img{
width: 300px;
float: left;
}
.sh_prod_img img{
width: 200px;
height: 200px;
}
.sh_prod_item{
width: 800px;
float: right;
}
.sh_table{
width: 100%;
}
.sh_table tr.bg{
background: #f9f9f9;
}
.sh_table tr td{
border: 1px solid #e6e6e6;
height: 45px;
line-height: 45px;
}
.sh_table .st1{
width: 20%;
text-indent: 20px;
}
.sh_table .st2{
width: 80%;
text-indent: 20px;
}
.sh_condition{
width: 1198px;
border: 1px solid #e6e6e6;
}
.sh_cond_list{
width: 1150px;
margin: 10px auto;
}
.sh_cond_list dl{
margin: 10px 0px;
clear: both;
}
.sh_cond_list dl dt{
width: 60px;
line-height: 40px;
float: left;
color: #1483c5;
}
.sh_cond_list dl dd{
width: 1090px;
float: right;
line-height: 40px;
text-align: left;
}
.sh_cond_list dl dd a{
margin-right: 20px;
}
.sh_cond_list dl dd a.all{
color: #fff;
background-color: #507edf;
padding: 5px;
}
.search_res{
width: 100%;
border: 1px solid #e6e6e6;
}
.search_res thead tr{
background: #f9f9f9;
}
.search_res thead tr th{
height: 40px;
line-height: 40px;
text-indent: 20px;
border: 1px solid #e6e6e6;
font-weight: bold;
}
.search_res tbody tr >td{
height: 40px;
line-height: 40px;
text-indent: 20px;
color: #0b3138;
border-bottom: 1px solid #e6e6e6;
}
.search_res tbody tr:hover{
background: #f9f9f9;
}
.search_res tbody tr td em{
text-decoration: line-through;
color: #999999;
}
.search_res tbody tr.bg1{
border-bottom: 1px solid #e6e6e6;
}
.search_res tbody tr td.lft{
border-bottom: 1px solid #e6e6e6;
border-right: 1px solid #e6e6e6;
background: #ffffff;
}
.search_res tbody tr td.lftg{
border-bottom: 1px solid #e6e6e6;
border-right: 1px solid #e6e6e6;
background: #ffffff;
line-height: 25px;
text-align: center;
}
.search_res tbody tr td img{
width: 80px;
height: 80px;
}
.search_res tbody tr td .num{
width: 50px;
height: 20px;
line-height: 20px;
text-align: center;
margin: 0px 1px;
text-indent: 0px;
}
.reduce_num{
width: 18px;
height: 22px;
text-align: center;
background: none #FFFFFF;
border: 1px solid #999999;
color: #666666;
box-shadow: none;
line-height: 20px;
font-size: 12px;
cursor: pointer;
display: block;
text-indent: 0px;
}
.add_num{
display: block;
width: 18px;
height: 22px;
text-align: center;
background: none #FFFFFF;
border: 1px solid #999999;
color: #666666;
box-shadow: none;
line-height: 20px;
font-size: 12px;
cursor: pointer;
text-indent: 0px;
}
.cart_num_block{
width: 96px;
}
.search_res tfoot tr td{
height: 60px;
line-height: 60px;
}
/*table tr:nth-child(odd)
{
background: #ffffff;
}*/
/*设置偶数行颜色*/
/*table tr:nth-child(even)
{
background: #f9f9f9;
}*/
.money{
color: #ff9600;
}
.sh_nav{
height:50px;
line-height: 50px;
border-bottom: 1px solid #e6e6e6;
}
.orange{
color: #ff9600;
}
.cart_check{
width: 30%;
float: left;
margin-left: 10px;
}
.cart_choose{
width: 60%;
float: right;
text-align: right;
}
a.cart_submit{
width: 166px;
height: 50px;
background-color: #089ad0;
text-align: center;
line-height: 50px;
font-size: 20px;
color: #fff;
display: inline-block;
}
.loading{
background: url('/static/new/images/loading2.gif') no-repeat;
right: 150px;
top:10px;
position: absolute;
width: 32px;
height: 32px;
}