{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;
		padding-left:0;
	}
    .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="{:url('vip/cameraman/index');}">返回摄影师列表</a></div>
            <div class="layui-btn"><a href="{:url('vip/cameraman/add');}">继续添加摄影师</a></div>
        </div>
        <form class="layui-form layui-form-pane1" action="" method="post" id="editform" enctype="multipart/form-data">
            <div class="layui-form-item">
                <input type="hidden" value="{$data.id}" name="id"/>
                <label class="layui-form-label" style="color:red">摄影师名称</label>
                <div class="layui-input-block">
                    <input type="text" name="c_name" class="layui-input" lay-verify="required|title" required placeholder="请输入标题" autocomplete="off" value="{$data.c_name}">
                </div>
            </div>
            <div class="layui-form-item" pane>
                <label class="layui-form-label">摄影师头像</label>
                <div class="layui-upload layui-form-label">
                    <input type="file" name="img"  id="imginput" class="" /><br/>
                    {if $data.c_img}
                        <img src="__PUBLIC__/uploads/cam/head/{$data.c_img}" id="imgbox" width="200" height="200" />
                    {else /}
                        <img src="" id="imgbox" width="200" height="200" style="margin-top:10px;" class="display"/>
                    {/if}
                </div>
            </div>
            <div class="layui-form-item" pane>
                <label class="layui-form-label">摄影师详情</label>
                <div class="layui-upload layui-form-label" style="padding-left:0;">
                    <input type="file" name="img_detail"  id="imgdinput" /><br/>
                    {if $data.c_detail}
                        <img src="__PUBLIC__/uploads/cam/head/{$data.c_detail}" id="detailbox" width="200" height="200" style="margin-top:10px;"/>
                    {else /}
                        <img src="" id="detailbox" width="200" height="200" style="margin-top:10px;" class="display"/>
                    {/if}
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">摄影师年龄</label>
                <div class="layui-input-block">
                    <input type="text" name="c_age" class="layui-input" value="{$data.c_age}" min="1" max="100">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="color:red">摄影师电话</label>
                <div class="layui-input-block">
                    <input type="text" name="c_tel" class="layui-input"  autocomplete="off"  value="{$data.c_tel}" maxlength="11">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">摄影师門店</label>
                <div class="layui-input-inline">
                    <input type="text" name="c_shop" class="layui-input" lay-verify="" placeholder="请输入门店" value="{$data.c_shop}" >
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">摄影师简介</label>
                <div class="layui-input-block">
                <textarea name="c_brief" class="layui-textarea" >
                </textarea>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">摄影师地点</label>
                    <div class="layui-input-inline">
                        <input type="text" name="c_address" class="layui-input" value="{$data.c_address}">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" >摄影师类型</label>
                    <div class="layui-input-inline">
                        <select name="c_type" id="">
                            <option {if condition="$data.c_type eq '请选择'"}selected=""{/if} value="请选择">请选择</option>
                            <option {if condition="$data.c_type eq '欧美'"}selected=""{/if} value="欧美">欧美</option>
                            <option {if condition="$data.c_type eq '中国'"}selected=""{/if} value="中国">中国</option>
                        </select>
                        <!--<input type="text" class="layui-input"  name="c_type" id="expiredays" value="">-->
                    </div>
                </div>
                <!-- <div class="layui-form-item" pane>
                    <label class="layui-form-label">摄影师作品</label>
                    <div class="layui-upload layui-form-label" style="padding-left:0;">
                        <input type="file" id="img1" name="img[]" class="imginput"/><br/>
                        <input type="file" id="img2" name="img[]" class="imginput"/>
                        <input type="file" id="img3" name="img[]" class="imginput"/>
                        <img src="__PUBLIC__/uploads/{$data.c_c_production}" id="imgboxs" width="200" height="200"  class="display"/>
                    </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="c_work" id="ordernum" value="{$data.c_work}" min="1" max="100">
                    </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="c_money"  value="{$data.c_money}" min="1">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" >摄影师等级</label>
                    <div class="layui-input-inline">
                        <select name="c_rank" >
                            <option value="请选择" {if condition="$data.c_rank eq '请选择'"}selected=''{/if}>请选择</option>
                            <option value="总监级" {if condition="$data.c_rank eq '总监级'"}selected=''{/if}>总监级</option>
                            <option value="大师级" {if condition="$data.c_rank eq '大师级'"}selected=''{/if}>大师级</option>
                            <option value="资深级" {if condition="$data.c_rank eq '资深级'"}selected=''{/if}>资深级</option>
                            <option value="专业级" {if condition="$data.c_rank eq '专业级'"}selected=''{/if}>专业级</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item height150">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="*">立即提交</button>
                    </div>
                </div>
        </form>
    </div>
</div></div>
<script>
    $(".back").on('click',function(){
        location.href="{:url('vip/cameraman/index')}";
    });
    layui.use('form', function(){
        var form = layui.form;
        //自定义验证规则
        form.verify({
            title: function(value){
                if(value.length < 2){
                    return '标题也太短了吧';
                }
            }
            ,pass: [/(.+){6,50}$/, '密码必须6到50位']
        });

        //事件监听
        form.on('select', function(data){
        });
        form.on('radio', function(data){
        });

        //监听提交
        form.on('submit(*)', function(data){
            title = $.trim($("input[name=c_name]").val());
            var formid = document.getElementById("editform");
            var sformData = new FormData(formid);
            if(title){
                $.ajax({
                    type:'post',
                    data:sformData,
                    processData: false,  // 不处理数据
                    contentType:false,
                    success:function(s){
                        if(s.status==1){
                            layer.open({
                                content: '恭喜您修改成功！',
                                btn: ['确认'],
                                yes: function(index, layero) {
                                    window.location.href="{:url('vip/cameraman/index')}";
                                }
                            });
                        }else{
            				layer.msg('修改失败',{
            				    icon: 2
            				});
                        }
                    }
                })
            }
            return false;
        });
    });

    // 头像图片显示
    $("#imginput").on('change',function(){
        // imgView(this);
        var showId = 'imgbox';
        imgView(this,showId);
        $("#imgbox").removeClass("display");
    });
    
    // 详情图片显示
    $("#imgdinput").on('change',function(){
        var showId = 'detailbox';
        imgView(this,showId);
        $("#detailbox").removeClass("display");
    });

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