salesman_goods.html 11.5 KB
<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>学考无忧-商品管理</title>
    <link rel="stylesheet" href="__TMPL__/public/assets/css/reset.css" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/log.css" />
</head>
<style>
    .log_five_list_center{
        width: 3.4rem;
        padding-top: 0.04rem;
    }
    .tx_maskCon_money {
        cursor: pointer;
         width: 5.6rem;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }
    .tx_mask_delete {
        display: none;
        z-index: 2;
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(0, 0, 0, 0.5);
    }

    .delete_school {
        font-size: 0.32rem;
        color: #333;
        text-align: center;
    }

    .delete_btn {
        display: flex;
        display: -webkit-flex;
        justify-content: space-around;
        align-items: center;
    }

    .tx_maskcancel {
        width: 100%;
        height: 0.8rem;
        background: #f2f2f2;
        border-radius: 0.08rem;
        text-align: center;
        line-height: 0.8rem;
        color: #333;
        font-size: 0.32rem;
        margin-top: 0.4rem;
        margin-right: 0.5rem;
    }

    .tx_maskYes {
        width: 100%;
        height: 0.8rem;
        background: linear-gradient(338deg, rgba(255, 78, 0, 1) 0%, rgba(255, 157, 45, 1) 100%);
        border-radius: 0.08rem;
        text-align: center;
        line-height: 0.8rem;
        color: white;
        font-size: 0.32rem;
        margin-top: 0.4rem;
        margin-left: 0.5rem;
    }
</style>
<body>

<!-- 删除弹窗 -->
<div class="tx_mask_delete" onclick="$(this).hide()">
    <div class="tx_maskCon" onclick="zZFun(this)">
        <div class="tx_maskCon2" style="border-radius: 0.1rem;">
            <div class="delete_school">
                是否确定删除?
            </div>

            <div class="delete_btn">
                <div class="tx_maskcancel">取消</div>
                <div class="tx_maskYes">确定</div>
            </div>
        </div>
    </div>
</div>


<!-- 弹窗 -->
<div class="tx_mask"  onclick="$(this).hide()">
    <div class="tx_maskCon_money"  onclick="zZFun(this)">
        <div class="tx_maskCon2" >
            <div class="log_three_model">
                <div class="log_three_model_one" style="padding-bottom: 0.2rem;">
                    <div class="log_three_model_left">价钱</div>
                    <div class="log_three_model_right">
                        <input style="width: 2rem;" type="text" placeholder="请输入价钱" value="" id="price" />
                    </div>
                    <input type="hidden" name="" id="goods_id" value="">
                </div>
                <div class="log_three_model_one" style="padding-bottom: 0.2rem;">
                    <div class="log_three_model_left">佣金</div>
                    <div class="log_three_model_right">
                        <input style="width: 2rem;" type="text" placeholder="请输入佣金" value="" id="money" />
                    </div>
                </div>
            </div>
            <!-- 确定 -->
            <div class="tx_maskOk" onclick="moneyedit()" style="cursor: pointer;">确定</div>
        </div>
    </div>
</div>
<div class="log_top_co">
    <!-- 顶部 -->
    <div class=" order_top log_top_co order_tops">
        <a href="javascript:history.back(-1)">
            <img src="__TMPL__/public/assets/images/left.png" alt="" />
        </a>
        <p>商品管理</p>
    </div>
</div>
<div class="dom" style="margin-top: 40px;">
    <volist name="data_goods" id="vo">
        <div class="com del{$vo.id}">
            <!-- 商品列表 -->
            <div class="log_five_list" style="cursor: pointer">
                <div class="log_five_list_left">
                    <img src="{:cmf_get_image_url($vo.show_img)}" alt="" style="width: 100%;height: 100%;"/>
                </div>
                <div class="log_five_list_center">
                    <div class="log_five_list_center_one txt-cut" style="-webkit-line-clamp: 2; ">
                        {$vo.book_name}
                    </div>
                    <div class="log_four_zong_shu" style="margin-top: 0.16rem">
                        <span></span>{$vo.price0}.<span>{$vo.price1}</span>
                    </div>
                    <div class="log_five_list_center_three">
                        销量:{$vo.sales}
                    </div>
                </div>
                <div class="log_five_list_right" style="cursor: pointer">
                    <img src="__TMPL__/public/assets/images/shenglve.png" alt="" />
                </div>
            </div>
            <!-- 操作 -->
            <div class="log_five_shanxian">
                <div class="log_five_handle">
                    <div class="log_five_handle_one" onclick="goods_edit({$vo.id})">
                        <div class="log_five_handle_img">
                            <img src="__TMPL__/public/assets/images/87.png" alt="" />
                        </div>
                        <div class="log_five_handle_word log_five_handle_add"  style="cursor: pointer;">
                            编辑
                        </div>
                    </div>
                    <div class="log_five_handle_one" >
                        <div class="log_five_handle_img">
                            <img src="__TMPL__/public/assets/images/86.png" alt="" />
                        </div>
                        <div class="log_five_handle_word log_five_handle_del" data-id="{$vo.id}"  style="cursor: pointer;">
                            删除
                        </div>
                    </div>
                    <div class="log_five_handle_one" onclick="move_up({$vo.id})">
                        <div class="log_five_handle_img">
                            <img src="__TMPL__/public/assets/images/85.png" alt="" />
                        </div>
                        <div class="log_five_handle_word log_five_handle_up"  style="cursor: pointer;">
                            上移
                        </div>
                    </div>
                    <div class="log_five_handle_one" onclick="cost({$vo.id})">
                        <div class="log_five_handle_img">
                            <img src="__TMPL__/public/assets/images/84.png" alt="" />
                        </div>
                        <div class="log_five_handle_word log_five_handle_pay"  style="cursor: pointer;">
                            费用
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </volist>
</div>
<div class="log_seven_btn log_seven_btn9">
    <a href="{:url('Salesmangoods/Salesman_goods_add')}">
        <div class="log_seven_btn_contant">
            新增商品
        </div>
    </a>
</div>
<script src="__TMPL__/public/assets/js/jquery.js"></script>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script>
    let index = '';
    let id
    //删除商品
    $('.log_five_handle_del').each(function() {
        $(this).click(function() {
            id = $(this).data("id");
            index = $(this).parents(".com").index();
            console.log(index)
            $(".tx_mask_delete").css({
                display: "block"
            });
        })
    })
    $(".tx_maskYes").click(function() {
        console.log(index)

        var len = $(".com");
        console.log(len)
        for(var i = 0; i < len.length; i++) {
            if(i == index) {
                $(len[i]).remove()
            };
            $(".tx_mask_delete").css({
                display: "none"
            });
        }
        $.post("{:url('Salesmangoods/goods_del')}",{goods_id:id},function(data){
            if(data){
                $('.del'+id).remove();
            }else{
                alert('删除失败!');
            }
        });

    })
    $(".tx_maskcancel").click(function() {
        $(".tx_mask_delete").css({
            display: "none"
        });
    })

    function zZFun(e) {
        window.event ? (window.event.cancelBubble = true) : e.stopPropagation();
    }
</script>
<script>
    function zZFun(e) {
        window.event ? (window.event.cancelBubble = true) : e.stopPropagation();
    }
    /**
     * 点击编辑
     */
     function goods_edit(id) {
        window.location.href = "{:url('Salesmangoods/Salesman_goods_edit')}?goods_id="+id;
    }


    /**
     * 点击上移
     */
    function move_up(id){
        $.post("{:url('Salesmangoods/goods_move_up')}",{goods_id:id},function(data){
        });
    }

    /**
     *点击删除
     */
    function goods_del(id){

    }

    /**
     *费用
     */
    function cost(id){
        $.post("{:url('Salesmangoods/goods_cost')}",{goods_id:id},function(data){
            arr = JSON.parse(data);
            $('#price').val(arr.price);
            $('#money').val(arr.money);
            $('#goods_id').val(arr.id);
        });
    }

    /**
     *费用编辑
     */
    function moneyedit(){
        price = $('#price').val();
        money = $('#money').val();
        goods_id = $('#goods_id').val();
        if(price == ''){
            alert('不能为空');
        }else if(money == ''){
            alert('不能为空');
        }else{
            $.post("{:url('Salesmangoods/moneyedit')}",{price:price,money:money,goods_id:goods_id},function(data){
                if(data){
                }else{
                    alert('保存失败');
                }
            });
        }

    }

</script>
<script>
    $(document).on('click', '.log_five_list_right', function() {
        if($(this).find("img").attr("src") == "__TMPL__/public/assets/images/shenglve.png") {
            $(this).find("img").attr("src", "__TMPL__/public/assets/images/83.png");
            $(this).parents('.com').find('.log_five_shanxian').slideToggle();
        } else {
            $(this).find("img").attr("src", "__TMPL__/public/assets/images/shenglve.png");
            $(this).parents('.com').find('.log_five_shanxian').slideToggle();
        }

        var $up = $(this).parent('.log_five_list').parent(".com").children('.log_five_shanxian').find('.log_five_handle_up');
        $up.click(function() {
            console.log(123)
            var index = $(this).closest(".com").index();
            var txt = $(this).closest(".com").html();
            var txt1 = $(this).closest(".com").prev().html();
            var prev = $(this).closest(".com").prev();
            console.log(txt);
            if(index == 0) {
                alert("已经在最顶端了,不能上移了");
                $('.log_five_shanxian').css('display', 'none');
                return false;
            }

            $(this).closest(".com").html(txt1);
            prev.closest(".com").html(txt);
            $('.log_five_shanxian').css('display', 'none');

        })

    });

    // 编辑
    $(".log_five_handle_pay").click(function() {
        $(".tx_mask").css({
            display: "block"
        });
    });

    $(".tx_maskOk").click(function() {
        $(".tx_mask").css({
            display: "none"
        });
    });
</script>
</body>

</html>