produce_list.html 14.7 KB
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>鹿鸣社_双创项目</title>
    <link href="__TMPL__Public/assets/css/reset.css" rel="stylesheet" type="text/css" />
    <link href="__TMPL__Public/assets/css/common.css" rel="stylesheet" type="text/css" />
    <link href="__TMPL__Public/assets/css/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="__TMPL__Public/assets/css/modal.css">
    <style>
        .img_box{
            width:100%;
            position: absolute;
            top: 0;
            left: 0;
            z-index:1;
            background-color: #FFF;
            overflow: hidden;
            max-height: 100%;

        }
        .img_box img{
            width: auto;
        }
        .upload{
            z-index: 2;
        }
    </style>
</head>

<body>
<tc_include file="Public:header"/>
<tc_include file="Public:nav"/>
<div class="inbanner" style="background-image: url(__TMPL__Public/assets/images/banner/inbanner.jpg);">
    <!--分类-->
    <div class="catebox">
        <div class="in-catebox">
            <div class="in-cate-tit">鹿鸣社</div>
            <ul class="in-cate-nav">
                <li><a href="{:U('Will/explain')}">入会说明</a></li>
                <li><a href="#myModal" data-toggle="modal">入会申请</a></li>
                <li><a href="{:U('Will/mission_list')}">任务发布</a></li>
                <li><a href="{:U('Will/events_list')}">近期活动</a></li>
                <li class="active"><a href="{:U('Will/produce_list')}">双创项目</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="page-container">
    <div class="main">
        <div class="page-top-button">
            <a href="#myModal" class="btn" data-toggle="modal">申请双创项目</a>
        </div>
        <ul class="sc-double">
            <volist name="list" id="vo">
                <li>
                    <a href="{:U('Will/produce_detail',array('id'=>$vo['id']))}" class="sc-more">
                        <span>查看详情</span>
                    </a>
                    <div class="sc-box">
                        <div class="sc-in-lt">
                            <div class="sc-title"><a href="{:U('Will/produce_detail',array('id'=>$vo['id']))}">{$vo.name}</a></div>
                            <div class="sc-desc">{$vo.description}</div>
                        </div>
                        <div class="sc-in-pic">
                            <a href="{:U('Will/produce_detail',array('id'=>$vo['id']))}" class="scale"><img src="{:sp_get_asset_upload_path($vo['thumb'])}"/></a>
                        </div>
                    </div>
                </li>
            </volist>
        </ul>
    </div>
</div>
<tc_include file="Public:footer"/>
<div id="myModal" class="modal fade" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4>双创项目申请表</h4>
            </div>
            <div class="modal-body">
                <form action="" method="post">
                    <div class="row">
                        <div class="row-title">
                            <h5>双创团队信息</h5>
                        </div>
                        <div class="row-con cf">
                            <div class="ipt-container lf">
                                <input type="text" name="name" placeholder="团队联系人(或主持人)">
                            </div>
                            <div class="slt-list lf" id="city">
                                <div class="slt-container lf">
                                    <select name="province" class="mm-select prov">
                                        <option value="天津"></option>
                                    </select>
                                </div>
                                <div class="slt-container lf">
                                    <select name="city" class="mm-select city"><option value="天津"></option></select>
                                </div>
                            </div>
                            <div class="ipt-container lf">
                                <input id="d11" type="text" name="birth" placeholder="出生年月" onClick="WdatePicker({skin:'twoer'})"/>
                            </div>
                            <div class="ipt-container lf">
                                <input type="text" name="school" placeholder="所在公司或高校">
                            </div>
                            <div class="radio-container lf">
                                <label>性别:</label>
                                <input type="radio" name="sex" value="1" checked>
                                <input type="radio" name="sex" value="2">
                            </div>
                            <div class="ipt-container lf">
                                <input type="text" name="major" placeholder="专业">
                            </div>
                            <div class="ipt-container lf">
                                <input type="text" name="mobile" placeholder="手机号">
                            </div>
                            <div class="slt-container lf">
                                <select name="classes" id="slt_0">
                                    <option selected>一年级</option>
                                    <option>二年级</option>
                                    <option>三年级</option>
                                </select>
                            </div>
                            <div class="ipt-container lf">
                                <input type="text" name="email" placeholder="邮箱">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="row-title">
                            <h5>专业经验</h5>
                        </div>
                        <div class="row-con">
                            <div class="textarea-container">
                                <textarea name="experience" placeholder="团队成员或个人相关专业经验(绘画、设计、广告、文创、营销等)简要描述"></textarea>
                            </div>
                            <div class="textarea-container">
                                <textarea name="product" placeholder="团队成员或个人相关双创经验简要描述"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="row-title">
                            <h5>双创项目描述</h5>
                        </div>
                        <div class="row-con">
                            <div class="file-container">
                                上传详细附件
                                <input type="file" name="att" id="att">
                            </div>
                            <div class="file-container" style="display:none;border:none;" id="att_file"></div>
                            <div class="textarea-container">
                                <textarea id="txt" name="product_description" placeholder="双创项目创意概述"></textarea>
                                <p>
                                    <span id="txt_num">0</span>/500字
                                </p>
                            </div>
                            <div class="pic-container">
                                <div class="pic-title">
                                    <p>上传双创项目图片,3~5张,jpg、png或jif格式。</p>
                                </div>
                                <div class="btn-list cf">
                                    <div class="btn-item lf">
                                        <div class="img_box">
                                        </div>
                                        <i class="icon"></i>
                                        <p>上传双创项目图片</p>
                                        <input type="file" name="images[]" class="upload" id="id_photos">
                                    </div>
                                    <div class="btn-item lf">
                                        <div class="img_box">
                                        </div>
                                        <i class="icon"></i>
                                        <p>上传双创项目图片</p>
                                        <input type="file" name="images[]" class="upload" id="id_photos1">
                                    </div>
                                    <div class="btn-item lf">
                                        <div class="img_box">
                                        </div>
                                        <i class="icon"></i>
                                        <p>上传双创项目图片</p>
                                        <input type="file" name="images[]" class="upload" id="id_photos2">
                                    </div>
                                    <div class="btn-item lf">
                                        <div class="img_box">
                                        </div>
                                        <i class="icon"></i>
                                        <p>上传双创项目图片</p>
                                        <input type="file" name="images[]" class="upload" id="id_photos3">
                                    </div>
                                    <div class="btn-item lf">
                                        <div class="img_box">
                                        </div>
                                        <i class="icon"></i>
                                        <p>上传双创项目图片</p>
                                        <input type="file" name="images[]" class="upload" id="id_photos4">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="sub-container">
                            <input type="button" name="submit" value="确认提交">
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!-- js -->
<!--<script src="__TMPL__Public/assets/js/jquery.min.js"></script>-->
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="__TMPL__Public/assets/js/common.js"></script>
<script src="__TMPL__Public/assets/js/modal.js"></script>
<script src="__TMPL__Public/assets/js/pop.js"></script>
<script type="text/javascript" src="__TMPL__Public/assets/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="__TMPL__Public/assets/js/jquery.cityselect1.js"></script>
<script type="text/javascript" src="__PUBLIC__/js/ajaxfileupload.js"></script>
<script>
    // $('#myModal').modal({

    // })
    $('#myModal').on('shown.bs.modal', function () {
        document.documentElement.style.overflow='hidden';
    })
    $('#myModal').on('hidden.bs.modal', function () {
        document.documentElement.style.overflow='auto';
    })
</script>
<!--城市-->
<script type="text/javascript">
    $("#city").citySelect({nodata:"none",required:false});
</script>
<script>
    showOptionInfo('#slt_0');
    countWrodNum('#txt','#txt_num',500);
    // 附件上传
    $('#att').on('change',function(){
        var fileId = $(this).attr('id');
        $.ajaxFileUpload({
            url: "{:U('personalUploadAtt')}",   //处理图片的脚本路径
            type: 'post',       //提交的方式
            secureuri: false,   //是否启用安全提交
            fileElementId: fileId,     //file控件ID
            dataType: 'json',  //服务器返回的数据类型
            success: function (data) {  //提交成功后自动执行的处理函数
                if(data.status) {
                    $('#att_file').show();
                    $('#att_file').append('<a target="_blank" href="'+data.file+'">我上传的附件</a><input type="hidden" name="att" value="'+data.data+'"/>');
                } else {
                    alert(data.msg);
                }
            },
            error: function (data, status, e) {   //提交失败自动执行的处理函数
                alert(e);
            }
        })
    });
    // 图片上传
    $('.upload').on('change',function(){
        var imgHidden = $(this).parent();
        var imgWarp = $(this).parent().find('.img_box');
        var fileId = $(this).attr('id');
        $.ajaxFileUpload({
            url: "{:U('personalUpload')}",   //处理图片的脚本路径
            type: 'post',       //提交的方式
            secureuri: false,   //是否启用安全提交
            fileElementId: fileId,     //file控件ID
            dataType: 'json',  //服务器返回的数据类型
            success: function (data) {  //提交成功后自动执行的处理函数
                if(data.status) {
                    imgWarp.append('<img src="'+ data.file +'" height="100%" />');
                    imgHidden.append('<input type="hidden" name="images[]" value="'+data.data+'"/>');
                } else {
                    alert(data.msg);
                }
            },
            error: function (data, status, e) {   //提交失败自动执行的处理函数
                alert(e);
            }
        })
    });
</script>
<script>
    $('input[name=submit]').click(function(){
        var btn = $(this);
        var text = btn.val();
        var form = $('form').serialize();
        $.ajax({
            url:"{:U('Will/submit')}",
            type:"POST",
            data:form,
            dateType:"json",
            beforeSend: function () {
                // Handle the beforeSend event
                btn.val('提交中...').attr('disabled', true);
            },
            success:function (data) {
                if(data.status) {
                    alert(data.msg);
                    location.reload();
                } else {
                    alert(data.msg);
                }
            },
            error: function (data, status, e) {   //提交失败自动执行的处理函数
                alert(e);
            },
            complete: function () {
                // Handle the complete event
                btn.val(text).attr('disabled', false);
            }
        })
    })
    $('#txt').keyup(function() {
        var len=$(this).val().length;
        $('#txt_num').html(len);
    });
</script>
</body>
</html>