wxd / MEIDD_MSCP_PHP

<style type="text/css">
    .flexigrid .bDiv tr {
        display: block;
    }

    .bd-line {
        font-size: 0;
    }

    .flexigrid .bDiv td {
        border: 0;
    }

    .flexigrid div.bDiv tr:hover td {
        background-color: #F4FCFA;
    }

    .flexigrid div.bDiv tr.trSelected td {
        background: #ffffdf none repeat scroll 0 0;
    }

    .flexigrid .bDiv a {
        color: #999;
    }

    .flexigrid .bDiv .active a, .flexigrid .bDiv span a:hover {
        color: #FFF;
    }

    .flexigrid .bDiv .row a:hover {
        text-decoration: none;
        color: #C4182E;
        background-color: #EEEEEE;
        text-decoration: underline;
    }

    .flexigrid .bDiv .row .active a:hover {
        text-decoration: none;
        color: #fff;
        background-color: #999;
        text-decoration: underline;
    }

    .ncsc-default-table thead {
        font-size: 0;
    }

    .ncsc-default-table thead th {
        font-size: 12px;
        vertical-align: middle;
        display: inline-block;
        text-align: left;
        *display: inline;
        *zoom: 1;
    }

    .w100 {
        width: 10% !important;
    }

    .w400 {
        width: 40% !important;
    }

    .w200 {
        width: 20% !important;
    }

    .w300 {
        width: 30% !important;
    }

    .layui-layer-content {
        text-align: center;
    }

    .layui-layer-btn {
        text-align: center;
    }

</style>
<table class="ncsc-default-table">
    <thead>
    <tr>
        <th class="w100">&nbsp;</th>
        <th class="w400">商品名称</th>
        <th class="w200">商家名称</th>
        <th class="w300" style="text-align: center">操作</th>
    </tr>
    </thead>
    <tbody>
    <empty name="goodsList">
        <tr>
            <td colspan="20" class="norecord">
                <div class="warning-option"><i class="icon-warning-sign"></i><span>暂无符合条件的数据记录</span></div>
            </td>
        </tr>
        <else/>
        <volist name="goodsList" id="list">
            <tr class="bd-line">
                <td class=" w100">
                    <div class="pic-thumb">
                        <a {$list.url}>
                            <img style="width:32px;height:32px" src="{:getImg($list.original_img,'/public/images/not_adv.jpg',0,0)}"/>
                        </a>
                    </div>
                </td>

                <td class="tl w400">
                    <dl class="goods-name">
                        <dt style="max-width: 450px !important;">
                            <a {$list.url}>{$list.goods_name|getSubstr=0,33}</a></dt>
                        <dd>商品货号：{$list.goods_sn}</dd>
                        <dd class="serve">
                            <a href="javascript:" onclick="show(this)"><span title="商品详情">
                            <i class="icon-tablet"></i></span>
                            </a>
                        </dd>
                    </dl>
                </td>

                <td class="tl w200">{$list.store_name}</td>

                <td style="display: none">
                    <textarea>{$list.goods_content}</textarea>
                </td>


                <td align="center" axis="col0" class="w300">
                    <div style="text-align: center;">
                        <if condition='$list[is_enable] eq 1'>
                            <span class="yes" data-id="{$list.goods_id}" data-img="{$list.goods_id}" data-name="{$list.store_id}"
                                  onClick="changeTable(this)">
                                <i class="fa fa-check-circle"></i>启用</span>
                            <else/>
                            <span class="no" data-id="{$list.goods_id}" data-name="{$list.store_id}"
                                  onClick="changeTable(this)">
                                <i class="fa fa-ban"></i>未启用</span>
                        </if>
                    </div>
                </td>
            </tr>
        </volist>
    </empty>
    </tbody>
</table>
<!--分页位置-->
{$page}
<script>
    // 点击分页触发的事件
    $(".pagination  a").click(function () {
        cur_page = $(this).data('p');
        ajax_get_table('search-form2', cur_page);
    });

    function changeTable(obj) {
        if (trim($(obj).text()) == '启用') {
            layer.msg('已启用', {icon: 2, time: 2000});
            return;
        }
        var o = $('span').filter('.yes');
        layer.confirm('确认选择商品详情', {
            btn: ['确定提交'], //按钮
            shade: 0.01,
            title: '',
            closeBtn: 0,
            shadeClose: true
        }, function () {
            $.ajax({
                type: "POST",
                url: "/index.php/Manager/mztk/change_enable",
                data: {
                    id: $(obj).attr('data-id'),
                    ed_id: o.attr('data-id'),
                    store:$(obj).attr('data-name'),
                    bar_id: $("input[name='bar_id']").val(),
                    html: $(obj).parent().parent().prev().children().val()
                },
                beforeSend: function () {
                    index = layer.msg('处理中...', {
                        icon: 16,
                        shade: [0.5, '#f5f5f5'],
                        scrollbar: false,
                        offset: '200px',
                        time: 0
                    });
                },
                success: function (data) {
                    layer.closeAll();
                    o.removeClass('yes').addClass('no').html('<i class="fa fa-ban"></i>未启用');
                    $(obj).removeClass('no').addClass('yes').html('<i class="fa fa-check-circle"></i>启用');
                    layer.msg(data.msg, {icon: 1, time: 2000});
                }
            });
        });
    }

    function show(obj) {
        layer.open({
            type: 1,
            title: '商品详情',
            shadeClose: true,
            shade: 0.2,
            area: ['72%', '75%'],
            content: $(obj).parent().parent().parent().next().next().children().val()
        });
    }
</script>