{yun:}include file="$trainstyle/header.htm"{/yun}
<link rel="stylesheet" href="{yun:}$config.sy_weburl{/yun}/js/imgareaselect/imgareaselect.css?v={yun:}$config.cachecode{/yun}" type="text/css">
<script type="text/javascript" src="{yun:}$config.sy_weburl{/yun}/js/imgareaselect/jquery.imgareaselect.js?v={yun:}$config.cachecode{/yun}"></script>
<script type="text/javascript" src="{yun:}$config.sy_weburl{/yun}/js/imgareaselect/ajaxfileupload.js?v={yun:}$config.cachecode{/yun}"></script>
<script src="{yun:}$config.sy_weburl{/yun}/js/public.js?v={yun:}$config.cachecode{/yun}"></script>
<div class="clear"></div>

<div class="training_content training_w980">
    {yun:}include file="$trainstyle/left.htm"{/yun}
    <div class="right_column frt mt20">
        <div class="right_column_border">
            <div class="right_column_h1"><span class="right_column_h1_span flt">上传LOGO</span> </div>

            <div class="resume_box_list">
                <div class="uppic_msg">提示：有时因页面缓存问题，上传后照片不能及时更新请击刷新页面即可 </div>

                <div class="uppic_left" style="width:530px;">
                    <div class="uppic_tip">方法一：选择本地LOGO，上传编辑培训LOGO</div>
                    <div class="uppic_tip_bth">
                        <a class="uppic_tip_bthupload" href="javascript:;">选择LOGO</a>
                        <input id="image" class="uppic_tip_bthfile" type="file" name="image" onchange="ajaxfile();">
                    </div>
                    <div class="uppic_tip_gs">支持{yun:}$config.pic_type{/yun}文件格式，最大不要超过{yun:}$config.file_maxsize{/yun}M</div>
                    <div class="clear"></div>
                    <div class="uppic_tit">LOGO预览
						{yun:}if $info.logo{/yun}
						{yun:}if $info.logo_status=='1'{/yun}
							<font color="#f00">审核中</font>
						{yun:}else if $info.logo_status=='2'{/yun}
							<font color="#f00">未通过</font>
						{yun:}else{/yun}
							<font color="#f00">已审核</font>
						{yun:}/if{/yun}
						{yun:}/if{/yun}
					</div>
                    <div class="clear"></div>
                    <div class="oppic_img_big">
                        <div class="oppic_img_big_img" style="width:120px;height:120px;"><img src="{yun:}$info.logo_n{/yun}" width='120' height='120' onerror="showImgDelay(this,'{yun:}$config.sy_ossurl{/yun}/{yun:}$config.sy_px_icon{/yun}',2);" /></div>
                        <div class="oppic_img_big_p" style="width:120px;">标准LOGO尺寸 120×120</div>
                    </div>
                    <div class="clear"></div>
                    <div class="uppic_flash" style="display:none;width:480px;" id='uppic_flash'>
                        <div class="uppic_big_zx">
                            <img src="" style="float: left; margin-right: 10px;" id="thumbnail" />
                        </div>
                        <div style="width:150px; float:left">
                            <div id="preview1" class="uppic_previ1">
                                <img id="preview1_img" src="" style="position: relative;width:120px; height:120px; margin-top:0px;" />

                            </div>

                        </div>
                        <div class="uppic_pb">
                            <form name="form1" id="form1">
                                <input name="sizeit" id="sizeit" type="submit" value="保存头像" class="uppic_pb_bth" />
                            </form>
                        </div>
                    </div>

                </div>
                {yun:}*
                <div class="uppic_right">
                    <div class="uppic_right_tit">方式二：手机拍照上传</div>
                    <div class="uppic_ewm">
                        <img src="{yun:}url m=upload c=qrcode type=6{/yun}" alt="手机扫码拍照上传" width="130" height="130" />
                    </div>
                    <div class="uppic_ewm_p"> 扫描二维码 </div>
                </div>
                *{/yun}

            </div>

        </div>
    </div>
</div>

<script>
    function ajaxfile() {
        if($("#image").val() != '') {

            layer.load('图片上传中，请稍候....', 0);
            $.ajaxFileUpload({
                url: 'index.php?c=uppic&act=ajaxfileupload', //用于文件上传的服务器端请求地址
                secureuri: false, //是否需要安全协议，一般设置为false
                fileElementId: 'image', //文件上传域的ID
                dataType: 'json', //返回值类型 一般设置为json
                success: function(data, status) //服务器成功响应处理函数
                {
                    layer.closeAll();
                    if(data.s_thumb) {
                        layer.msg(data.s_thumb, 2, 8);

                        setTimeout(function() {
                            location.href = '';
                        }, 2000);
                    } else {

                        hideLoading(data.url);
                    }
                }
            })

        }

    }

    var size1 = {
        width: 120,
        height: 120
    }
    $('#preview1').width(size1.width);
    $('#preview1').height(size1.height);

    function hideLoading(pic) {
        $("#thumbnail").attr({
            'src': pic
        });
        $("#preview1_img").attr({
            'src': pic
        });

        $('#uppic_flash').show();
        var ias = $('#thumbnail')
            .imgAreaSelect({
                aspectRatio: '1:1', //长宽1:1的比例，在等待剪裁的图像上呈现出正方形的选择框
                onSelectChange: lis, //把用户当前的选择状态传给lis函数
                onInit: function() {
                    var _opt = ias.getOptions();
                    render($('#preview1_img'), $("#thumbnail")[0], {
                        height: _opt.y2 - _opt.y1,
                        width: _opt.x2 - _opt.x1,
                        x1: _opt.x1,
                        x2: _opt.x2,
                        y1: _opt.y1,
                        y2: _opt.y2
                    }, size1);
                },
                instance: true,
                keys: true,
                x1: 37, //选择框在图片里的初始位置，这里默认是图片左上角，宽度和高度都是200px，符合size1
                y1: 15,
                x2: size1.width,
                y2: size1.height
            });
    }

    function lis(img, sel) {

        render($('#preview1 img'), img, sel, size1);
    }

    function render(target, img, sel, size) {
        var scale = size.width / sel.width;
        target.css({
            width: Math.round(scale * $(img).width()),
            height: Math.round(scale * $(img).height())
        });
        target.css({
            marginLeft: '-' + Math.round(scale * sel.x1) + 'px',
            marginTop: '-' + Math.round(scale * sel.y1) + 'px'
        });
        target.data('scale', scale);
        target.data('width', sel.width);
        target.data('height', sel.height);
        target.data('x', sel.x1);
        target.data('y', sel.y1);
    }
    //ajax提交表单
    $(function() {
        $('#form1').submit(function(e) {
            e.preventDefault();
            e.stopPropagation();

            var preview1 = $('#preview1 img');
			loadlayer();
            $.post("index.php?c=uppic&act=savethumb", {
                sizeit: true,
                count: 2,
                /*图1*/
                width: preview1.data('width'),
                height: preview1.data('height'),
                x: preview1.data('x'),
                y: preview1.data('y'),
                img1: $('#preview1_img').attr('src'),
                scale: preview1.data('scale'),
            }, function(res) {
				layer.closeAll('loading');
                if(res){
                    var res = eval('('+res+')');
                    layer.msg(res.msg, 2, res.st,function(){location.reload();}); 
                }
            });

        });
    });
</script>
{yun:}include file="$trainstyle/footer.htm"{/yun}