Ecshop模板开发（四）：商品详情页的显示配置

1、本店售价+市场价格

{$goods.shop_price} <del>{$good.market_price}</del>

2、促销价格

<!--{if $goods.is_promote and $goods.gmt_end_time } 促销-->
            {insert_scripts files='lefttime.js'}
            <li class="padd loop" style="margin-bottom:5px; border-bottom:1px dashed #ccc;">
                <strong>{$lang.promote_price}</strong><font class="shop">{$goods.promote_price}</font><br
                <strong>{$lang.residual_time}</strong>
                <font class="f4" id="leftTime">{$lang.please_waiting}</font><br
            </li>
            <!--{/if}-->
            <script>var gmt_end_time = {$goods.gmt_end_time};
                var hour="时";
                var day="天";
                var minute="分";
                var second="秒";
                onload_leftTime();
            </script>

4、不同用户类型显示不同价格

{foreach from=$rank_prices key=key item=abc}
     <p>
       {$abc.rank_name}   {$abc.price}<br>
     </p>
{/foreach}

5、商品点击数

{$goods.click_count}

6、人气和评分

<img src="images/stars{$goods.comment_rank}.gif" alt="">
   
<span style="color: red">{$goods.comment_rank} 分</span>

7、商品属性
层级关系如下：
单选—-radio、select
多选—-checkbox

{foreach from=$specification item=spec key=key}
                <div class="clearfix"></div>
                <p>{$spec.name}</p>
                    {if $spec.attr_type eq 1}
                        {if $cfg.goodsattr_style eq 1}
                            {foreach from=$spec.values key=key_attr item=value}
                                <div class="attr_radio">
                                    <label for="" title="{if $value.price gt 0}加{else /}减{/if}{$value.format_price}">{$value.label}</label>
                                </div>
                            {/foreach}

                        {else /}
                            <select name="" id="">
                                {foreach from=$spec.values key=key_attr item=value}
                                    <div class="attr_select">
                                        <option value="">{$value.label}--{if $value.price gt 0}加{else /}减{/if}{$value.format_price}</option>
                                    </div>
                                {/foreach}
                            </select>

                        {/if}
                    {else /}

                        {foreach from=$spec.values key=key_attr item=value}
                            <div class="attr_checkbox">

                                <label for="" title="{if $value.price gt 0}加{else /}减{/if}{$value.format_price}"><input
                                            type="checkbox">{$value.label}</label>
                            </div>
                        {/foreach}
                    {/if}
        <br>
                {/foreach}

7、商品属性的改变引起价格动态变化
html

div class="attr-form">
                {foreach from=$specification item=spec key=key}
                <div class="clearfix"></div>
                <p>{$spec.name}</p>
                    {if $spec.attr_type eq 1}
                        {if $cfg.goodsattr_style eq 1}
                            <div class="attr-radio-area">
                            {foreach from=$spec.values key=key_attr item=value}
                                <div class="attr_radio {if $key_attr eq 0}attr_radio_checked{/if}">
                                    <label for="" title="{if $value.price gt 0}加{else /}减{/if}{$value.format_price}">{$value.label}
                                        <input  value="{$value.id}"  type="radio" {if $key_attr eq 0}checked{/if} class="hn-hide"></label>
                                </div>
                            {/foreach}
                            </div>
                        {else /}
                            {*<select name="" id="">
                                {foreach from=$spec.values key=key_attr item=value}
                                    <div class="attr_select">
                                        <option value="">{$value.label}--{if $value.price gt 0}加{else /}减{/if}{$value.format_price}</option>
                                    </div>
                                {/foreach}
                            </select>*}

                        {/if}
                    {else /}

                        {foreach from=$spec.values key=key_attr item=value}
                            <div class="attr_radio  {if $key_attr eq 0}attr_radio_checked{/if}">

                                <label for="" title="{if $value.price gt 0}加{else /}减{/if}{$value.format_price}"><input
                                           value="{$value.id}" type="checkbox" class="hn-hide" {if $key_attr eq 0}checked{/if} >{$value.label}</label>
                            </div>
                        {/foreach}
                    {/if}
        <br>
                {/foreach}
            </div>

js

<script>var goodsid={$goods.goods_id};//获取商品id

    //点击属性label时执行的函数
    $('.attr_radio label').click(function ()

         if($(this).children('input').attr('type')=='radio'){
         $(this).parents('.attr-radio-area').children('.attr_radio').removeClass('attr_radio_checked');
         $(this).parents('.attr-radio-area').find(':input').attr('checked',false);
         }

        if($(this).children('input').attr('type')=='checkbox' && $(this).parent().is('.attr_radio_checked')) {

            $(this).parent().removeClass('attr_radio_checked');
            $(this).children('input').attr('checked', false);
            changePrice();
            return false;
        }
        $(this).children('input').attr('checked',true);
        $(this).parent().addClass('attr_radio_checked');
        changePrice();
        return false;
     });

    //获得商品属性选定的值并转化为字符串
    function getAttrValue()

        var attr_arr=[];
        $('.attr-form :input:checked').each(function ()
            attr_arr.push($(this).val());
        });
        return attr_arr.join(',');
    }

    //商品数量input框失去焦点时候
    $('#buy_num').blur(function ()
        changePrice();
    });

    //发送ajax请求
    function changePrice()
        $.get('goods.php',{"act":"price","id":goodsid,"attr":getAttrValue(),"number":$('#buy_num').val()},execTotalPrice,'json');

    }


    //接收ajax返回值并处理
    function execTotalPrice(data)
        if(data.err_msg.length>0){
            alert(data.err_msg);
        }else{

            $('#buy_num').val(data.qty);
            $('#total_price').html(data.result)

        }

    }

</script>