{layout name="layout" /}
<style>
	a ,a:hover{
		color: #fff;
		text-decoration: none;
	}
	.set_con {
		width: 100%;
		height: auto;
		float: left;
		background-color: #fff;
		min-width: 1130px;
		overflow: auto;
		box-sizing: border-box;
		padding-left: 50px;
	}
	.layui-form-item {
		/* margin-bottom: 15px; */
		clear: both;
		width: 1130px;
		margin: 10px 0;
		float: left;
	}
	.layui-input, .layui-textarea {
		width: 190px;
	}
	#if_con {
		overflow: auto;
		background:#fff;
	}
	.height150{
		height:150px;
	}
	.layui-form-label {
		width: 100px;
	}
	.display{ display:none}
	.layui-form-checkbox {
	    margin-left: 10px;
	    margin-top: 10px;
	}
</style>
<div class="if_wrap">
	<div id="if_con">
		<div class="cus-con">
			<div class="set-top"><div class="layui-btn"><a href="/vip/Package/index">套系列表</a></div></div>
			<form class="layui-form layui-form-pane1" id="addform" enctype="multipart/form-data">
				<div class="layui-form-item">
					<label class="layui-form-label">选择分类</label>
					<div class="layui-input-inline">
						<select id="cList">
							<option value="">请选择分类</option>
							{volist name="cList" id="cl"}
							<option value="{$cl.id}">{$cl.name}</option>
							{/volist}
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">选择套系</label>
						<div class="layui-input-inline">
							<select id="shoplist" lay-filter="shoplist">
								<option value="">请选择店</option>
								{volist name="shop_list" id="in"}
								<option value="{$in.shop_code}" s-data='{$in.sn}' {if $in.select eq '1'}selected{/if}>{$in.shop_name}</option>
								{/volist}
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<!-- <div class="layui-input-block " style="width:214px;"> -->
							<select id="packagelist" lay-filter="packagelist" lay-search>
								<option value="">请选择套系</option>
								{volist name="package_list" id="in"}
								<option value="{$in.package_name}" p-data='{$in.package_price}' s-data='{$in.shop_code}'>{$in.package_name}</option>
								{/volist}
							</select>
						<!-- </div> -->
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">套系名称</label>
					<div class="layui-input-block">
						<input type="text" name="package_name" id="package_name" class="layui-input" placeholder="请输入标题" value="">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">套系价格</label>
					<div class="layui-input-block">
						<input type="text" name="package_price" id="package_price" onkeyup="value=value.replace(/[^\d.]/g,'')" maxlength="10" class="layui-input" placeholder="请输入价格" value="">
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">套系定金价格</label>
					<div class="layui-input-block">
						<input type="text" name="package_price_down" id="package_price_down" onkeyup="value=value.replace(/[^\d.]/g,'')" maxlength="10" class="layui-input" placeholder="请输入价格" value="">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">套系封面图片<br/></label>
					<div class="layui-upload layui-form-label" style="padding-left:0;">
						<input type="file" name="package_title_img" id="package_title_img" lay-verify="package_title_img"/>
						<!-- <span style="color: red">图片比例:200*200</span> -->
						<br/>
						<img src="" id="imgbox" style='width:200px;height:200px;' class="display"/>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">套系内容<br/></label>
					<div class="layui-input-block" style="margin-left:130px;">
                        <!-- <textarea style="display: none;" class="package_contents" name='package_contents' id="package_contents"></textarea> -->
                        <textarea placeholder="请输入内容" name="content"  id="editor"></textarea>
                    </div>
				</div>
				<!-- <div class="layui-form-item">
					<label class="layui-form-label">店长推荐</label>
					<div class="layui-input-inline">
						<input type="radio" id="is_recommend" name="is_recommend" value="1" title="推荐" >
      					<input type="radio" id="is_recommend" name="is_recommend" value="2" title="不推荐" checked >
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">店长推荐封面<br/></label>
					<div class="layui-upload layui-form-label" style="padding-left:0;">
						<input type="file" name="rec_img" id="rec_img" lay-verify="rec_img"/>
						<br/>
						<img src="" id="rec_img_box" style='width:200px;height:200px;' class="display"/>
					</div>
				</div> -->
				<!-- <div class="layui-form-item">
					<label class="layui-form-label">选择摄影师</label>
					<div class="layui-input-block">
						{volist name="camList" id="cl"}
							<input type="checkbox" class="cams" value="{$cl.id}" title="{$cl.c_name}">
						{/volist}
					</div>
				</div> -->
				<!--<div class="layui-form-item">-->
					<!--<label class="layui-form-label">选择作品</label>-->
					<!--<div class="layui-input-block">-->
						<!--{volist name="proList" id="pl"}-->
							<!--<input type="checkbox" class="pros" value="{$pl.id}" title="{$pl.title}">-->
						<!--{/volist}-->
					<!--</div>-->
				<!--</div>-->
				<div class="layui-form-item">
					<label class="layui-form-label" >排序数字</label>
					<div class="layui-input-inline">
						<input type="text" class="layui-input"  name="p_sort" id="p_sort"  value="100" onkeyup="value=value.replace(/[^\d.]/g,'')" placeholder="请输入数字" >
					</div>
					<div class="layui-form-mid layui-word-aux">数字越大后台显示越靠前</div>
				</div>
                <div class="layui-form-item">
                    <label class="layui-form-label">消费类型</label>
                    <div class="layui-input-inline">
                        <select id="consumption_type">
                            <option value="">请选择消费类型</option>
                            {volist name="consumptionType" id="con"}
                            <option value="{$con.consumption_name}">{$con.consumption_name}</option>
                            {/volist}
                        </select>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label" >是否可用优惠券</label>
                    <div class="layui-input-inline">
                        <input type="radio" class="layui-input" name="use_coupon" value="1" title="是" checked>
                        <input type="radio" class="layui-input" name="use_coupon" value="2" title="否">
                    </div>
                </div>

				<div class="layui-form-item height150">
					<div class="layui-input-block">
						<span class="layui-btn" id='sub'>立即提交</span>
						<button type="reset" class="layui-btn layui-btn-primary back">返回</button>
					</div>
				</div>
			</form>
		</div>
	</div>
</div>
</body>
</html>
<script type="text/javascript" charset="utf-8" src="__PUBLIC__/admin/editor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="__PUBLIC__/admin/editor/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="__PUBLIC__/admin/editor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
// 联动 获取套系信息
layui.use('form', function() {
	var form = layui.form;
	form.on('select(shoplist)', function(data){
        var shop_code = $('#shoplist option:selected').val();
        var data = {};
        data.shop_code = shop_code;
        $.ajax({
            type: "POST",
            url: "/vip/Package/getPackageList",
            data: data,
            dataType: "json",
            success: function (ret) {
                if(ret){
                    $('#packagelist').html("");
                    // $('#packagelist').append('<option value="">请选择</option>');
                    var opt = '<option value="">请选择套系</option>';
                    for(var i=0;i<ret.length;i++){
                        opt += '<option value="'+ret[i]['package_name']+'" p-data="'+ret[i]['package_price']+'" s-data="'+ret[i]['shop_code']+'">'+ret[i]['package_name']+'</option>';
                    }
                    // console.log(opt);
                    $('#packagelist').append(opt);
                    form.render();
                }else{
                    $('#packagelist').html("");
                    form.render();
                }
            }
        })
    });

    form.on('select(packagelist)', function(data){
        // var id = $('#packagelist option:selected').val();
        var packagename = $('#packagelist option:selected').html();
        var packageprice= $('#packagelist option:selected').attr('p-data');
        if($('#package_name').val() == ''){
	        $('#package_name').val(packagename);
	        $('#package_price').val(packageprice);
	    }
        return false;
    });
})

// 富文本编辑器
var uploadContent = "";
layui.use(['layedit','element','form'], function(){
    var layedit = layui.layedit,
        form=layui.form,
        element=layui.element;
    // 图片上传
    layedit.set({
        uploadImage: {
            url: '/vip/Mcpost/upload_img', //接口url
            type: 'post'//默认post
        }
    });
    uploadContent = layedit.build('package_contents',{
        width:400,
        height:700,
        tool:[
            'strong' //加粗
            ,'italic' //斜体
            ,'underline' //下划线
            ,'del' //删除线
            ,'|' //分割线
            ,'left' //左对齐
            ,'center' //居中对齐
            ,'right' //右对齐
            // ,'face' //表情
            ,'image' //插入图片
        ]
    }); //建立编辑器
});

// 获取编辑器内容
function getupContent(){
    var layedit = layui.layedit;
    return layedit.getContent(uploadContent)
}

$(".back").on('click',function(){
	location.href="{:url('vip/Package/index')}";
});

// 标题图片显示
$("#package_title_img").on('change',function(){
	$("#imgbox").removeClass("display");
	imgView(this,'imgbox');
});
// 店长推荐封面图
$("#rec_img").on('change',function(){
	$("#rec_img_box").removeClass("display");
	imgView(this,'rec_img_box');
});

// 标题图片显示处理函数
function imgView(filedom, id){
	// console.log(filedom);
	// 判断是否支持fileReader
	if(window.FileReader){
		var reader = new FileReader();
		// 获取文件
		var file = filedom.files[0];
		var imagetype = /^image\//;
		// 判断是否是图片
		if(!imagetype.test(file.type)){
			layer.msg('请上传正确图片类型文件', {
				icon: 2,
			});
			return;
		}
		// 读取完成
		reader.onload = function(e){
			// 获取图片dom
			var img = document.getElementById(id);
			// 图片路径设置为读取的图片
			img.src = e.target.result;
		};
		reader.readAsDataURL(file);
	}
}

// 提交表单
$("#sub").click(function () {

	var shop_code = $('#shoplist option:selected').val();
	if (typeof(shop_code)=='undefined' || shop_code == null  || shop_code.length <= 0 || shop_code == '' || shop_code == undefined) {
        layer.alert('请选择店面');
        return false;
    }
	var shop_name = $('#shoplist option:selected').html();
	var shop_sn   = $('#shoplist option:selected').attr('s-data');

	var erp_package_name = $('#packagelist option:selected').html();
    var erp_package_price= $('#packagelist option:selected').attr('p-data');
    var erp_package_shop_code= $('#packagelist option:selected').attr('s-data');
	if (!$('#packagelist').val() || !erp_package_name ||typeof(erp_package_name)=='undefined' || erp_package_name == null  || erp_package_name.length <= 0 || erp_package_name == '' || erp_package_name == undefined || erp_package_name == '请选择套系') {
        layer.alert('请选择套系');
        return false;
    }
    var package_name = $('#package_name').val();
    if (typeof(package_name)=='undefined' || package_name == null  || package_name.length <= 0 || package_name == '' || package_name == undefined) {
        layer.alert('请输入套系名称');
        return false;
    }
    var package_price = $('#package_price').val();
    if (typeof(package_price)=='undefined' || package_price == null  || package_price.length <= 0 || package_price == '' || package_price == undefined) {
        layer.alert('请输入套系价格');
        return false;
    }
    var package_price_down = $('#package_price_down').val();
    //if (typeof(package_price_down)=='undefined' || package_price_down == null  || package_price_down.length <= 0 || package_price_down == '' || package_price_down == undefined) {
        //layer.alert('请输入套系定金价格');
        //return false;
    //}

    var consumption_type = $('#consumption_type').val();
    // 必须为int且不能小于0
    if (package_price <= 0) {
    	layer.alert('套系价格不能小于等于0');
        return false;
    }
	//if (package_price_down <= 0) {
    	//layer.alert('套系定金价格不能小于等于0');
        //return false;
    //}

    var p_sort = $('#p_sort').val();    
    var src = $('#imgbox').attr('src');
    var package_title_img = '<img src="'+src+'" />';

    var c_id = $('#cList option:selected').val();
    var is_recommend = $('#is_recommend:checked').val();
    var src_rec = $('#rec_img_box').attr('src');
    var rec_img = '<img src="'+src_rec+'" />';
    var camArr=[];
    $.each($(".cams"),function (ind,dom) {
    	if($(dom).is(':checked')) {
			camArr.push($(dom).val());
		}
    });
    
    var proArr=[];
    $.each($(".pros"),function (ind,dom) {
    	if($(dom).is(':checked')) {
			proArr.push($(dom).val());
		}
    });
	var package_contents = $("textarea").val();
    var use_coupon = $('input[name="use_coupon"]:checked').val();


    var index = layer.load(1, {shade: false});
    var data = {};
    data.shop_code = shop_code;
    data.shop_name = shop_name;
    data.shop_sn   = shop_sn;
    data.erp_package_name = erp_package_name;
    data.erp_package_price= erp_package_price;
    data.erp_package_shop_code = erp_package_shop_code
    data.package_name = package_name;
    data.package_price= package_price;
    data.package_price_down = package_price_down;
    data.package_title_img= package_title_img;
    data.package_contents = package_contents;
    data.p_sort = p_sort;
    data.consumption_type = consumption_type;
    data.use_coupon = use_coupon;//是否可使用优惠券

    data.c_id = c_id;
    data.is_recommend = is_recommend;
    data.rec_img = rec_img;
    data.cam_ids = camArr;
    data.pro_ids = proArr;
    
    $.ajax({
        url: '/vip/Package/addPackageAction',
        type: "POST",
        data: data,
        success: function (msg) {
            if (msg.code == 200) {
                layer.close(index);
                layer.open({
					content: msg.msg,
					btn: ['确认'],
					yes: function(index, layero) {
						window.location.href="{:url('vip/Package/index')}";
					}
				});
            }else{
                layer.alert(msg.msg);
                layer.close(index);
            }
        }
    })
});

// 实例化编辑器
var ue = UE.getEditor('editor',{
	initialFrameWidth :800,//设置编辑器宽度
	initialFrameHeight:520,//设置编辑器高度
	scaleEnabled:true,//设置不自动调整高度
	
});
UE.registerUI('combox',function(editor,uiName){
    // 注册下拉菜单时执行时的command命令
	editor.registerCommand(uiName,{
        execCommand:function(cmdName,value){
            this.execCommand('insertHtml',value);
        },
        queryCommandValue:function(){
			return this.queryCommandValue('src')
        }
    });

});
// 实例化ueditor
UE.getEditor('editor', {
    toolbars:[['combox']]
});


</script>