aqm-web/application/home/view/product/form.html

{extend name="layout:home" /}

{block name="container"}

<form class="layui-form" method="post" enctype="multipart/form-data" >
    <div class="layui-tab layui-tab-card">
        {include file="layout/admin_items" /}
        <div class="layui-tab-content page-tab-content">
            <div class="layui-tab-item layui-show ">
                
                <div class="layui-collapse">
                    <div class="layui-colla-item">
                        <h2 class="layui-colla-title">基本设置</h2>
                        <div class="layui-colla-content layui-show">
                            <div class="layui-form-item">
                                <label class="layui-form-label">所属类别</label>
                                <div class="layui-input-inline">
                                    <select name="product_type" id="product_type" lay-search>
                                        <option value="{$product['product_type']}">{if $product.product_type==1}客服常用语{elseif $product.product_type==2}客户常用问题{elseif $product.product_type==3}客服快捷回复{elseif $product.product_type==4}自动回复{else}请选择类别{/if}</option>
                                        <option value="1">客服常用语</option>
                                        <option value="2">客户常用问题</option>
                                        <option value="3">客服快捷回复</option>
                                        <option value="4">自动回复</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">时间段</label>
                                <div class="layui-input-inline">
                                    <select name="product_usetime" id="product_usetime" lay-search>
                                        <option value="{$product['product_usetime']}">{if $product.product_usetime==1}凌晨{elseif $product.product_usetime==2}上午{elseif $product.product_usetime==3}下午{elseif $product.product_usetime==4}晚上{else}请选择时间段{/if}</option>
                                        <option value="1">凌晨</option>
                                        <option value="2">上午</option>
                                        <option value="3">下午</option>
                                        <option value="4">晚上</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">关键字</label>
                                <div class="layui-input-inline">
                                    <input type="text" class="layui-input field-name" name="product_keywords" id="product_keywords" value="{$product.product_keywords|default=''}" lay-verify="product_keywords" autocomplete="off" placeholder="{$Think.lang.ds_please_enter}关键字" required />
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">状态</label>
                                <div class="layui-input-inline">
                                    <input type="checkbox" name="product_status" lay-skin="switch" lay-text="{$Think.lang.ds_yes}|{$Think.lang.ds_no}" value="1" {if condition="$product.product_status eq '1'"}checked{/if}>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="layui-colla-item">
                        <h2 class="layui-colla-title">详情内容</h2>
                        <div class="layui-colla-content">
                            <div class="layui-form-item">
                                <label class="layui-form-label">{$Think.lang.product_content}</label>
                                <div class="layui-input-block">
                                    {:build_editor(['name'=>'product_content','content'=>isset($product.product_content)?$product.product_content:''])}
                                    <textarea name="product_content" id="product_content" style="min-height:400px;"></textarea>
                                </div>
                            </div>
                            <!-- <button type="button" class="layui-btn" id="upload_productpic"><i class="layui-icon"></i>{$Think.lang.ds_uploading_files}</button> -->
                            <div class="selected_pic clearfix">
                                <ul>
                                    {foreach name="pic_list" id="productpic"}
                                    <li id="{$productpic.pic_id}">
                                        <img src="{:get_product_img($productpic['pic_cover'])}"/>
                                        <i class="delect layui-icon" title="{$Think.lang.ds_insert_editor}" onclick="insert_editor('{:get_product_img($productpic['pic_cover'])}')">&#xe654;</i>
                                        <i class="insert layui-icon" title="{$Think.lang.ds_delete_picture}" onclick="del_productpic({$productpic.pic_id})">&#xe640;</i>
                                    </li>
                                    {/foreach}
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="layui-form-item mt20">
                    <div class="layui-input-inline">
                        <input type="submit" class="layui-btn layui-btn-normal" lay-submit value="{:lang('ds_submit')}" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
<script>
    layui.use('form', function () {
        var form = layui.form;
    });
    layui.use('element', function () {
        var element = layui.element;
    });
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        laydate.render({
            elem: '#product_addtime'
        });
    });
    /**
     * 图片异步上传
     */
    layui.use('upload', function () {
        var $ = layui.jquery, upload = layui.upload;
        //指定允许上传的文件类型
        upload.render({
            elem: '#upload_productpic'
            , url: "{:url('pic/upload',['pic_type_id'=>$Request.param.product_id,'pic_type'=>$product_pic_type.pic_type])}"
            , accept: 'file' //普通文件
            , done: function (res) {
                add_uploadedfile(res);
//                console.log(res)
            }
        });
    });
    function add_uploadedfile(file_data)
    {
        var newImg = '<li id="' + file_data.file_id + '"><img src="' + file_data.file_url + '"/><i class="delect layui-icon" title="插入编辑器" onclick="insert_editor(\''+file_data.file_url+'\')">&#xe654;</i><i class="insert layui-icon" title="删除图片" onclick="del_productpic(' + file_data.file_id + ')">&#xe640;</i></li>'
        $('.selected_pic ul').prepend(newImg);
    }


    /**
     * 插入编辑器
     */
    function insert_editor(file_path){
        ue.execCommand('insertimage', {src:file_path});
    }

    function del_productpic(file_id)
    {
        layer.open({
            content: '{$Think.lang.ds_confirm_cancel}',
            yes: function(index, layero){
                $.getJSON("{:url('pic/del')}",{file_id: + file_id,pic_type:'product'}, function(result){
                    if(result){
                        $('#' + file_id).remove();
                        layer.msg('{$Think.lang.del_succ}');
                        layer.close(index);
                        return;
                    }else{
                        layer.msg('{$Think.lang.del_fail}');
                        layer.close(index);
                        return;
                    }
                });
            }
        });
    }
</script>
{/block}