mashangyoujiu/Application/Retail/View/Group/edit.html

<!DOCTYPE html>
<html>
<!--[1.4.36]-->
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/layui/css/layui.css"/>
    <style>
        .layui-form-label {
            width: 120px;
        }

        .layui-card-body{
            margin-top:-15px;
        }
        .likeInput{
            line-height: 38px;
            border: 1px solid #e6e6e6;
            padding-left: 10px;
            color:#ccc;
        }
    </style>
</head>
<body>
<div class="layui-col-md12">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>商品</legend>
    </fieldset>
    <form class="layui-form" style="margin:10px 30px;">
        <div class="layui-card">
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>商品图片：</span>
                </label>
                <div class="layui-col-md6">
                    <div class="layui-upload">
                        <div class="layui-upload-list">
                            <img class="layui-upload-img" src="{$group_info['goods_image']}" id="_image" style="width: 95px;height: 95px;border: 1px dashed #c2ccd1;">
                            <p id="demoText"></p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>商品名称：</span>
                </label>
                <div class="layui-col-md6">
                    <input type="text" name="goods_name" id="goods_name" value="{$group_info['goods_name']}" disabled style="color: #ccc" placeholder="请输入" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>商品价格：</span>
                </label>
                <div class="layui-col-md6">
                    <input type="text" name="goods_price" id="goods_price" value="{$group_info['online_price']}" disabled style="color: #ccc" placeholder="请输入" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>商品库存：</span>
                </label>
                <div class="layui-col-md6">
                    <input type="text" name="goods_num" id="goods_num" value="{$group_info['goods_num']}" disabled style="color: #ccc" placeholder="请输入" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>
    </form>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
        <legend>活动</legend>
    </fieldset>
    <form class="layui-form" style="margin:10px 30px;">
        <div class="layui-card">
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>拼团活动标题</span>
                </label>
                <div class="layui-col-md6">
                    <input class="layui-input" style="width:500px;" type="text" name="actname" id="actname" value="{$group_info['actname']}" placeholder="请输入拼团活动标题"  autocomplete="off">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10" id="actpricediv">
                    <label class="layui-form-label" style="margin:5px auto;">
                        <span style="color:red;">*&nbsp;</span>
                        <span>活动售价：</span>
                    </label>
                    <div class="layui-col-md2">
                        <input type="text" name="actprice" id="actprice" value="{$group_info['actprice']}" placeholder="请输入拼团出售价格" autocomplete="off" class="layui-input" onkeyup="value=value.replace(/[^\d\.]/g,'')">
                    </div>
                    <div class="layui-col-md1"></div>
                    <div class="layui-col-md5" style="margin-top: 5px;">
                        <span style="color:red;font-size:12px;">规格商品只作为展示作用。</span>
                    </div>
                </div>
            <if condition="$group_info['attribute_state'] == 1">
                <div class="layui-card-body layui-row layui-col-space10">
                    <label class="layui-form-label" style="margin:5px auto;">
                        <span style="color:red;">*&nbsp;</span>
                        <span >活动库存：</span>
                    </label>
                    <div class="layui-col-md6">
                        <input type="text" style="width:500px;" name="actnum" id="actnum" value="{$group_info['actnum']}" disabled placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
            <else/>
                <div class="layui-card-body layui-row layui-col-space10">
                    <label class="layui-form-label" style="margin:5px auto;">
                        <span style="color:red;">*&nbsp;</span>
                        <span>规格：</span>
                    </label>
                    <div class="layui-col-md8">
                        <table class="layui-hide" id="skutest" lay-filter="demo"></table>
                    </div>
                </div>
            </if>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>起止日期：</span>
                </label>
                <div class="layui-col-md3">
                    <input type="text" class="layui-input" id="starttime" value="{$group_info['starttime']}" disabled style="color: #ccc" placeholder="起始日期" autocomplete="off">
                </div>
                <div class="layui-col-md3">
                    <input type="text" class="layui-input" id="endtime" value="{$group_info['endtime']}" placeholder="截止日期" autocomplete="off">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>有效时间：</span>
                </label>
                <div class="layui-col-md6">
                    <input type="text" name="effective" id="effective" value="{$group_info['effective']}" disabled style="color: #ccc" placeholder="请输入" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>拼团人数：</span>
                </label>
                <div class="layui-col-md2">
                    <div class="likeInput">{$group_info['number']}</div>
                </div>
                <div class="layui-col-md1"></div>
                <div class="layui-col-md5" style="margin-top: 5px;">
                    <span style="color:red;font-size:12px;">拼团人数，最少2人。</span>
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span>限制购买次数：</span>
                </label>
                <div class="layui-col-md2">
                    <input type="text" name="join_time" value="{$group_info['join_time']}" id="join_time" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-col-md1"></div>
                <div class="layui-col-md5" style="margin-top: 5px;">
                    <span style="color:red;font-size:12px;">每人限制参与活动次数，默认一次。0为不限制</span>
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span> 单次商品限购：</span>
                </label>
                <div class="layui-col-md3">
                    <input type="text" name="item" id="item" value="{$group_info['item']}" placeholder="每次限购几件" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label" style="margin:5px auto;">
                    <span style="color:red;">*&nbsp;</span>
                    <span> 起购数量：</span>
                </label>
                <div class="layui-col-md3">
                    <input type="text" name="rise_num" id="rise_num" value="{$group_info['rise_num']}" placeholder="起购数量" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label">
                    <span style="color:red;">*&nbsp;</span>
                    <span>配送方式设置：</span>
                </label>
                <div style="display: flex;align-items: center;margin-top: 5px;">
                    <input type="checkbox" lay-filter="send_type" lay-skin="primary" name="send_type"
                           value="1" title="自提" <if condition="in_array('1',$group_info['send_type'])">checked</if>>
                    <input type="checkbox" lay-filter="send_type" lay-skin="primary" name="send_type"
                           value="2" title="配送" <if condition="in_array('2',$group_info['send_type'])">checked</if>>
                    <input type="checkbox" lay-filter="send_type" lay-skin="primary" name="send_type"
                           value="3" title="快递" <if condition="in_array('3',$group_info['send_type'])">checked</if>>
                </div>
            </div>
            <div id="template" class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label"><span style="color:red;">*&nbsp;</span><span>配送模板：</span></label>
                <div style="display: flex;align-items: center;">
                    <select name="delivery_template_id" lay-filter="delivery_template" lay-search>
                        <volist name="delivery_template" id="vo">
                            <option value="{$vo.id}" <eq name="group_info.delivery_template_id" value="$vo.id">selected</eq>>{$vo.title}</option>
                        </volist>
                    </select>
                </div>
            </div>
            <div class="layui-card-body layui-row layui-col-space10">
                <label class="layui-form-label"><span>推荐：</span></label>
                <div style="display: flex;align-items: center;margin-top: -5px;">
                    <input type="checkbox" name="is_recommend" lay-skin="switch" <eq name="group_info.is_recommend" value="1">checked</eq>>
                </div>
            </div>
        </div>
    </form>
</div>
<form class="layui-form" action="">
    <div class="layui-form-item" style="margin-top:5%;">
        <label class="layui-form-label"></label>
        <div class="layui-input-block" style="margin-left:14%;">
            <button class="layui-btn" type="button" id="submit">修改</button>
        </div>
    </div>
</form>
<script src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/layui/layui.js"></script>
<script>
    layui.use(['form', 'layedit', 'laydate','table'], function () {
        var form = layui.form;
        var layer = layui.layer;
        var laydate = layui.laydate;
        var table = layui.table;

        // layer日期选择器
        laydate.render({
            elem: '#endtime'
            , type: 'datetime'
        });

        // 判断规格 
        var group_skuid = "{$group_info['group_skuid']}";
        var attribute = "{$group_info['attribute_state']}";
        var actnum_old = parseInt("{$group_info['actnum']}");
        if(group_skuid && attribute == 2){
            table.render({
                elem: '#skutest',
                url: "{:U('getGroupSku')}",
                method : 'post',
                where:{group_skuid:group_skuid},
                cols: 
                    [[ 
                        { field: 'sku_name', title: '商品规格' }, 
                        { field: 'goods_num', title: '规格数量' }, 
                        { field: 'sku_num', title: '基数' },
                        { field: 'actnum', title: '活动数量' }, 
                        { field: 'actprice', title: '活动售价', edit: 'text' }
                    ]],
                id:"sku_table"
            });
        }
        var send_type = {$send_type};
        if(send_type.indexOf('3')!=-1){
            $('#template').show();
        }else{
            $('#template').hide();
        }

        form.on('checkbox(send_type)', function (data) {
            var obj = data.elem;
            var index = send_type.indexOf(obj.value);
            if (obj.checked) {
                if (index == -1) {
                    send_type.push(obj.value);
                }
                if(obj.value==3){
                    $('#template').show();
                }
            } else {
                if (index != -1) {
                    send_type.splice(index, 1);
                }
                if(obj.value==3){
                    $('#template').hide();
                }
            }
        })
        form.on('select(delivery_template)',function (data) {
            console.log(data);
        })
        // 提交修改
        $("#submit").click(function () {
            // 判断是否输入活动名称
            if (!$('#actname').val()) {
                layer.msg('请输入拼团活动标题',{icon:7,time:1500});
                return;
            }
            // 判断售价
            if (!$('#actprice').val() || parseFloat($('#actprice').val()) <= 0) {
                layer.msg('活动售价设置有误',{icon:7,time:1500});
                return;
            }
            // 判断规格
            if (attribute == 2) {
                // 判断规格
                var skuarr = table.cache.sku_table;
                for (var i = 0; i < skuarr.length; i++) {
                    if (skuarr[i].actprice <= 0) {
                        layer.msg('请为每种规格商品设置合理的售价',{icon:7,time:1500});
                        return;
                    }
                }
            }
            // 判断活动时间
            var d = new Date();
            var starttime = $('#starttime').val();
            var d_starttime = Date.parse(new Date(starttime));
            var endtime = $('#endtime').val();
            var d_endtime = Date.parse(new Date(endtime));
            if (!endtime) {
                layer.msg('请选择活动截日期',{icon:7,time:1500});
                return;
            } else if (d_endtime <= d_starttime) {
                layer.msg('截止日期必须晚于起始日期',{icon:7,time:1500});
                return;
            }
            // 判断限制购买
            if(!$('#join_time').val() || $('#join_time').val() < 0 || parseInt($('#join_time').val()) != $('#join_time').val()){
                layer.msg('限制购买次数',{icon:7,time:1500});
                return;
            }
            // 判断单次限购
            if (!$('#item').val() || parseInt($('#item').val()) != $('#item').val() || $('#item').val() < 1 || $('#item').val() > 10) {
                layer.msg('请输入单件限购数量，最少一件，最多不能超过十件!',{icon:7,time:1500});
                return;
            }
            if (!$('#rise_num').val() || parseInt($('#rise_num').val()) != $('#rise_num').val() || $('#rise_num').val() < 1 || $('#rise_num').val() > 10) {
                layer.msg('请输入起购数量，最多不能超过十件!',{icon:7,time:1500});
                return;
            }
            if(parseFloat($('#rise_num').val()) > parseFloat($('#item').val())){
                layer.msg('起购数量不能大于限购数量', {icon: 7, time: 1500});
                return;
            }
            if (!send_type.length) {
                layer.msg('请选择配送方式');
                return;
            }
            if (!$("select[name='delivery_template_id']").val() && send_type.indexOf('3') != -1) {
                layer.msg('请选择配送模板');
                return;
            }
            var group_id = "{:I('get.id')}";
            var data = {
                group_id: group_id,
                actname: $('#actname').val(),
                actprice: $('#actprice').val(),
                endtime: endtime,
                join_time: $('#join_time').val(),
                item: $('#item').val(),
                rise_num: $('#rise_num').val(),
                send_type: send_type.join(','),
                delivery_template_id: $("select[name='delivery_template_id']").val(),
                skuarr:skuarr ? skuarr : new Array,
                is_recommend: $('[name="is_recommend"]').prop('checked') ? 1 : 0
            }
            $.ajax({
                url: "{:U('update')}",
                type: "post",
                data: data,
                success: function (res) {
                    if (res.status == 1) {
                        layer.msg(res.msg, { time:1000,icon: 1}, function () {
                            var index = parent.layer.getFrameIndex(window.name);    //先得到当前iframe层的索引
                            parent.layer.close(index);                              //再执行关闭
                        });
                    } else {
                        layer.msg(res.msg,{time:1000,icon:2});
                    }
                }
            })
        })

        //监听提交
        form.on('submit(demo1)', function (data) {
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            })
            return false;
        });
    });
</script>

</body>
</html>