{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}
</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/indexCat">分类列表</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">
						<input type="text" class="layui-input" id="name" data-id="{$catInfo.id}" name="name" placeholder="请输入分类名称" value="{$catInfo.name}">
					</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="sort" id="sort"  value="{$catInfo.sort}" onkeyup="value=value.replace(/[^\d.]/g,'')" placeholder="请输入数字" >
					</div>
					<div class="layui-form-mid layui-word-aux">数字越小排序越靠前</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">
// 提交表单
$("#sub").click(function () {
	
    var name = $('#name').val();
    if (typeof(name)=='undefined' || name == null  || name.length <= 0 || name == '' || name == undefined) {
        layer.alert('请输入分类名称');
        return false;
    }
    var index = layer.load(1, {shade: false});
    var id = $('#name').attr('data-id');
    var sort = $('#sort').val();

    var data = {};
    data.id = id;
    data.name = name;
    data.sort = sort;
    // console.log(data);
    // return false;
    $.ajax({
        url: '/vip/Package/editCatAction',
        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/indexCat')}";
					}
				});
            }else{
                layer.alert(msg.msg);
                layer.close(index);
            }
        }
    })
});

// 富文本编辑器
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);
});

// 标题图片显示处理函数
function imgView(filedom){
	// 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('imgbox');
			// 图片路径设置为读取的图片
			img.src = e.target.result;
		};
		reader.readAsDataURL(file);
	}
}
</script>