<!--_meta 作为公共模版分离出去-->
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
    String base = pageContext.getServletContext().getContextPath();
%>
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript">
        window.UEDITOR_SERVER_URL = '<%=base%>';
    </script>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <LINK rel="Bookmark" href="/favicon.ico" >
    <LINK rel="Shortcut Icon" href="/favicon.ico" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/Hui-iconfont/1.0.7/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/icheck/icheck.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/manage/h-ui.admin/css/style.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/admin/css/layui.css" />
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/videoUpload/layer.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/js/WdatePicker.js"></script>
    <title>后台管理</title>
    <meta name="keywords" content="H-ui.admin v2.3,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
    <meta name="description" content="H-ui.admin v2.3，是一款由国人开发的轻量级扁平化网站后台模板，完全免费开源的网站后台管理系统模版，适合中小型CMS后台系统。">


    <style>
        .selfprozslidim dd {
            border: 1px solid #ccc;
            display: inline-block;
            height: 68px;
            margin: 0 0 10px 10px ;
            position: relative;
            width: 68px;
        }
        .selfprozslidim dd img {
            display: block;
            height: 68px;
            width: 68px;
        }
        .selfprozslidim dd i {
            background: #999;
            border: 1px solid #ccc;
            cursor: pointer;
            display: none;
            height: 13px;
            position: absolute;
            right: 3px;
            top: 3px;
            width: 13px;
        }
        #albummore a{cursor:pointer;}
        .selfprozslidim dd:hover i {
            display: block;
        }
        .selfprozslidim dd i:hover {
            background-color: #3388ff;
        }
        .delwarp {
            background: rgba(0, 0, 0, 0) url("${pageContext.request.contextPath}/static/imgs/tmbg4.png") repeat scroll 0 0;
            display:none;
            padding: 5px 7px;
            position: absolute;
            right: 0;
            top: 0;
            z-index: 2;
        }
        .delete {
            background: rgba(0, 0, 0, 0) url("${pageContext.request.contextPath}/static/imgs/del.png") no-repeat scroll 0 0 / 15px 19px;
            display: block;
            height: 19px;
            text-indent: -9999px;
            width: 15px;
        }
        .selfprozslidim dd.del:hover .delwarp {
            display: block;
        }
    </style>



</head>



<body>
<nav class="breadcrumb">
    <i class="Hui-iconfont">&#xe67f;</i> 首页
    <span class="c-gray en">&gt;</span> 做区块链
    <span class="c-gray en">&gt;</span> 找技术
    <span class="c-gray en">&gt;</span> 编辑
        <a class="btn btn-primary radius r" style="line-height:1.6em;margin-top:3px;" href="javascript:window.history.back();" title="返回上一层" ><i class="Hui-iconfont">&#xe66b;</i></a>
    <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
</nav>
<article class="page-container">
    <form class="form form-horizontal" action="findskill_add"  id="addtra" method="post" enctype="multipart/form-data"   >


        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">姓名：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入姓名" id="name" name="name">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">所在地区：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入地区" id="addr" name="addr">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">所在公司：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入公司" id="company" name="company">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">担任职位：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入职位" id="position" name="position">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">个人标签：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入标签" id="labels" name="labels">
            </div>
        </div>



        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">分类：</label>
            <div class="formControls col-xs-8 col-sm-9 skin-minimal">
                <div class="check-box">
                    <input type="checkbox" value="1" name="type">
                    <label >区块链开发</label>
                </div>

                <div class="check-box">
                    <input type="checkbox"  value="2" name="type">
                    <label >智能合约</label>
                </div>

                <div class="check-box">
                    <input type="checkbox" value="4" name="type">
                    <label >APP开发</label>
                </div>

                <div class="check-box">
                    <input type="checkbox"value="6" name="type">
                    <label >网站平台</label>
                </div>
                <div class="check-box">
                    <input type="checkbox" value="5" name="type">
                    <label >其他程序开发</label>
                </div>
            </div>
        </div>



        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">技术类别类型：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select class="input-text"   style=" display: inline-block; vertical-align: top;" name="twotype">
                    <option value="">全部</option>
                    <option  value="1" >智能合约</option>
                    <option value="2" >区块链开发</option>
                    <option  value="3" >APP开发</option>
                    <option  value="4" >平台搭建</option>
                    <option  value="5" >其他</option>
                </select>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">从业年限：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select class="input-text"   style=" display: inline-block; vertical-align: top;" name="years">
                    <option value="">不限</option>
                    <option  value="1" >无经验</option>
                    <option value="2" >1-3年</option>
                    <option  value="3" >3-5年</option>
                    <option  value="4" >5-10年</option>
                    <option  value="5" >10年以上</option>
                </select>
            </div>
        </div>


        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">封面图：</label>

            <div class="formControls col-xs-8 col-sm-4">
                <div style="width:100%;height:30px;border:1px solid #EEEEEE;">
                    <button type="button"  onclick="$('#imgurl').click();" style="margin:5px;">选择图片</button>&nbsp;&nbsp;<span style="margin:5px;" id="filexls">未选择图片</span>
                </div>
                <input type="file" style="display: none;" id="imgurl" class="input-text" name="imgurl">
                <input type="hidden" name="img" value="" >
            </div>
            <div class="formControls col-xs-8 col-sm-2">
               <%-- <img  width="60px"  height="40px" id="ims"  src="${pageContext.request.contextPath}/static/imgs/nopic.png"  >--%>
            </div>
            <div class="formControls col-xs-8 col-sm-4">
               <%-- <span class="c-red">图片最佳尺寸(像素)：263 x 287</span>--%>
            </div>
            <!--<div class="formControls col-xs-8 col-sm-3">
                <span class="c-red">图片最佳尺寸（像素）：155 x 97</span>
            </div>-->
        </div>


        <%--<div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">图册：</label>
            <div class="formControls col-xs-8 col-sm-7">
                <div style="width:100%;height:80px;border:1px solid #DDDDDD;padding:8px 5px 0 0;" class="selfprozslidim">
                    <input type="file" style="display: none;" name="fileToUpload" class="selfbasetlimgedup" id="fileToUpload">
                    <dl  id="mgs">

                            &lt;%&ndash;<dd  class="del"> <img  src="" width="68" height="68" /><input type="hidden" name="imgsurl" value="${item}"/><div class="delwarp"><a class="delete" onclick="delalbum(this)">删除</a></div></dd>&ndash;%&gt;
                        <dd id="albummore"><a onclick="$('#fileToUpload').click();"><img  src="../static/images/addmore.jpg" alt="" id="img"></a></dd>
                    </dl>
                </div>
            </div>
            <div class="formControls col-xs-8 col-sm-3">
              &lt;%&ndash;  <span class="c-red">图片最佳尺寸(像素)：1000 x 1000</span>&ndash;%&gt;
            </div>
        </div>--%>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red"></span>添加时间：</label>
            <div class="formControls col-xs-8 col-sm-3">
                <input type="text"  class="input-text  Wdate"  placeholder="请输入添加时间" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd' })"  value=""   name="adddate" >
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">排序：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="0" placeholder="请输入排序" id="sort" name="sort">
            </div>
        </div>
        <%--<c:if test="${skillitems.typeid==0}" >
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">担保地址：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入担保地址" id="address" name="address">
            </div>
        </div>

        </c:if>--%>
      <%--  <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">联系电话：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text"  placeholder="请输入联系电话" id="phone" name="phone">
            </div>
        </div>--%>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">联系电话：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="" placeholder="请输入联系电话" id="phone" name="phone">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2">详细说明：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <textarea class="textarea" placeholder="说点什么..." rows="" cols="" name="outline"></textarea>
            </div>
        </div>

                <div class="row cl">
                    <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
                    <input class="btn btn-primary radius" type="submit"    value="保存">
                    </div>
                    </div>
                    </form>
                    </article>

                    <!--_footer 作为公共模版分离出去-->
                    <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/js/jquery-1.7.2.min.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/icheck/jquery.icheck.min.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/h-ui/js/H-ui.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/js/layui.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/h-ui.admin/js/H-ui.admin.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/js/jquery.validate.min.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/js/validate-methods.js"></script>
                <script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/manage/js/messages_zh.min.js"></script>
                <!--/_footer /作为公共模版分离出去-->
                <!-- 百度文本编辑器   引用文件 -->
                <link href="<%=base%>/static/ue/themes/default/css/ueditor.css" type="text/css" rel="stylesheet">
                <script src="<%=base%>/static/ue/ueditor.config.js" type="text/javascript"></script>
                <script src="<%=base%>/static/ue/ueditor.all.js" type="text/javascript"></script>
                <script type="text/javascript" src="<%=base%>/static/ue/lang/zh-cn/zh-cn.js"></script>

                <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/ajaxfileupload.js"></script>

                <script type="text/javascript">

                    $('.skin-minimal input').iCheck({
                        checkboxClass: 'icheckbox-blue',
                        radioClass: 'iradio-blue',
                        increaseArea: '20%'
                    });

                    $(function(){
                        $("#addtra").validate({
                            rules:{
                                name:{
                                    required:true,
                                },
                                sort:{
                                    required:true,
                                    digits:true,
                                },
                                outline:{
                                    required:true,
                                },
                                addr:{
                                    required:true,
                                },
                                company:{
                                    required:true,
                                },
                                position:{
                                    required:true,
                                },
                                labels:{
                                    required:true,
                                },
                                type:{
                                    required:true,
                                },
                                img:{
                                    required:true,
                                },
                                adddate:{
                                    required:true,
                                }
                                ,
                                twotype:{
                                    required:true,
                                }
                                ,
                                years:{
                                    required:true,
                                }
                            },
                            onkeyup:false,
                            focusCleanup:true,
                            success:"valid",
                            submitHandler:function(form){


                                $(form).ajaxSubmit();

                                var index = layer.load( {shade: false}); //0代表加载的风格，支持0-2
                                //loading层

                                var index = layer.load(1, {
                                    shade: [0.1,'#fff'] //0.1透明度的白色背景
                                });


                                var index = parent.layer.getFrameIndex(window.name);
                                parent.$('.btn-refresh').click();
                                parent.layer.close(index);
                            }
                        });
                    });


                    var ue = UE.getEditor('editor');
                    $(function(){
                        $('.skin-minimal input').iCheck({
                            checkboxClass: 'icheckbox-blue',
                            radioClass: 'iradio-blue',
                            increaseArea: '20%'
                        })});


                    var currentBrowserId;
                    function browserImage(targetId){
                        currentBrowserId = targetId;
                        var weboxTemp = $.webox({
                            height:600,
                            width:1024,
                            bgvisibel:true,
                            title:'图片管理',
                            iframe:'<%=base%>/admin/image/imgbox.html?'+Math.random()
                        });
                    }

                    function setImagepath(imgPath){
                        $('#'+currentBrowserId).val(imgPath);
                    }

                    function closeFrame(){
                        $('#locked .span').click();
                    }




                    $(function(){
                        $("#imgurl").change(function(){
                            $.ajaxFileUpload({
                                fileElementId : 'imgurl',
                                url : 'uploadFindSkillImages',
                                dataType : 'json',
                                data : {},
                                async : true,
                                error : function(data) {
                                },
                                success : function(message) {
                                   /* $("#ims").attr("src",message.msg);*/
                                    $("[name=img]").val(message.msg);
                                    $("#filexls").html(message.data);
                                    imgss();
                                }

                            });
                        });

                    })


                    function imgss(){

                        $("#imgurl").change(function(){
                            $.ajaxFileUpload({
                                fileElementId : 'imgurl',
                                url : 'uploadFindSkillImages',
                                dataType : 'json',
                                data : {},
                                async : true,
                                error : function(data) {
                                    alert("网络异常，请重试");
                                },
                                success : function(message) {
                                   /* $("#ims").attr("src",message.msg);*/
                                    $("[name=img]").val(message.msg);
                                    $("#filexls").html(message.data);
                                    imgss();
                                }
                            });
                        });
                    }







                    $(function(){
                        $("#fileToUpload").change(function(){
                            var f = document.getElementById('fileToUpload').files[0];
                            $.ajaxFileUpload({
                                fileElementId : 'fileToUpload',
                                url : 'uploadFindSkillImages',
                                dataType : 'json',
                                data : {},
                                async : true,
                                success : function(message) {
                                    $("#albummore").before('<dd class="del"><img  src="'+message.msg+'" width="68" height="68" /><input type="hidden" name="imgsurl" value="'+message.msg+'"/><div class="delwarp"><a class="delete" onclick="delalbum(this)">删除</a></div></dd>');
                                    changesa();
                                },
                                error : function(data) {
                                    alert("网络异常，请重试");
                                }

                            });
                        });

                    })


                    function changesa(){

                        $("#fileToUpload").change(function(){
                            var f = document.getElementById('fileToUpload').files[0];
                            $.ajaxFileUpload({
                                fileElementId : 'fileToUpload',
                                url : 'uploadFindSkillImages',
                                dataType : 'json',
                                data : {},
                                async : true,
                                error : function(data) {
                                    alert("网络异常，请重试");
                                },
                                success : function(message) {
                                    $("#albummore").before('<dd class="del"><img  src="'+message.msg+'" width="68" height="68" /><input type="hidden" name="imgsurl" value="'+message.msg+'"/><div class="delwarp"><a class="delete" onclick="delalbum(this)">删除</a></div></dd>');
                                    changesa();
                                }
                            });
                        });
                    }
                    function delalbum(obj){
                        $(obj).parents(".del").remove();
                    }



                </script>

</body>
</html>