donate-parent/donate-console/src/main/webapp/resources/view/project/project_launch_1.html

<!-- 发起项目 -->
<!--主体内容-->
<style>
    body{
        font-family: "Microsoft Yahei", "微软雅黑";
        box-sizing: border-box;
    }
    .clearfix {
        clear: both;
    }
    .section{
        margin: 0 auto;
        width: 1040px;
        background: #fff;
        padding: 30px 20px 0 20px;
        overflow: hidden;
        text-align: center;
        border: 1px solid #dcdcdc;
    }
    .instruction{
        padding-bottom: 20px;
        text-align: left;
        border-bottom: 2px solid #ef613b;
    }
    .instruction span:first-child{
        font-size: 18px;
        color: #1e1e1e;
    }
    .instruction span:last-child{
        font-size: 14px;
        color: #797979;
    }
    .choose .chooseNav{
        margin: 30px 0 36px 0;
    }
    .choose .chooseNav span{
        margin-right: -10px;
        display: inline-block;
        height: 30px;
        width: 150px;
        line-height: 30px;
        font-size: 14px;
        color: #fff;
    }
    .choose .chooseNav span.step1{
        background: url(static/images/step01.png)no-repeat center center;
    }
    .choose .chooseNav span.step2{
        margin-right: -13px;
        background: url(static/images/step02-1.png)no-repeat center center;
    }
    .choose .chooseNav span.step2.active{
        background: url(static/images/step02-2.png)no-repeat center center;
    }
    .choose .chooseNav span.step3{
        background: url(static/images/step03-1.png)no-repeat center center;
    }
    .choose .chooseNav span.step3.active{
        background: url(static/images/step03-2.png)no-repeat center center;
    }
    .choose .chooseDetail .detail .message{
        position: relative;
        margin: 0 auto;
        margin-bottom: 30px;
        width: 980px;
        height: 46px;
        line-height: 46px;
        text-align: left;
        background: #eeeeee;
    }
    .choose .chooseDetail .detail .message span{
        margin-left: 25px;
        font-size: 18px;
        font-weight: bold;
        color: #505050;
    }
    .choose .chooseDetail .detail .message span:before{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 10px;
        height: 46px;
        background: #ff6000;
    }
    /*.form {*/
    /*padding-left: 50px;*/
    /*}*/
    .form .form-group{
        margin-bottom: 22px;
        line-height: 34px;
    }
    .form .form-group label{
        margin-right: 60px;
        width: 80px;
        font-size: 16px;
        font-weight: normal;
        color: #505050;
    }
    .form .form-group input[type='text']{
        padding-left: 5px;
        width: 325px;
        height: 34px;
        border-radius: 0;
    }
    .form .form-group span.help-txt{
        margin-left: 10px;
        font-size: 12px;
        color: #969696;
    }
    .form .form-group div.sort{
        width: 800px;
        text-align: left;
    }
    .form .form-group div.sort span{
        margin: 0 20px 20px 0;
        padding: 0 13px;
        display: inline-block;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #313131;
        border: 2px solid #dcdcdc;
        cursor: pointer;
    }
    .form .form-group div.sort span.active,.form .form-group div.sort span:hover{
        border: 2px solid #ed6216;
    }
    .form .form-group select{
        padding-left: 5px;
        width: 130px;
        height: 34px;
        cursor: pointer;
    }
    .form .form-groups .fl span{
        margin: 0 15px;
        font-size: 14px;
        color: #313131;
    }
    .form .form-group textarea{
        padding-left: 5px;
        width: 680px;
        height: 130px;
    }
    .form .form-group span.txt{
        margin-top: 10px;
        font-size: 12px;
        color: #979797;
        display: inline-block;
        text-align: left;
        width: 670px;
        line-height: 20px;
    }
    .form .form-group input.valid{
        padding-left: 5px;
        width: 130px;
        height: 34px;
    }
    .form .form-group div.valida{
        text-align: left;
        padding-left: 140px;
    }
    .form .form-group div.valida span{
        display: inline-block;
        width: 120px;
        height: 40px;
    }
    .form .form-group div.valida a{
        margin-left: 5px;
        font-size: 12px;
        color: #2a5bfb;
    }
    .form .text-left{
        margin-left: 140px;
    }
    .form .text-left .agree{
        margin-top: -7px;
    }
    .form .text-left .agree span{
        margin: 0 10px;
        font-size: 12px;
        color: #777;
    }
    .form .text-left .agree a{
        font-size: 12px;
        color: #2a5bfb;
    }
    .form .text-left a.btn{
        margin-bottom: 60px;
        display: inline-block;
        width: 160px;
        height: 34px;
        font-size: 16px;
        color: #fff;
        text-align: center;
        border-radius: 3px;
        background: #ff7624;
        border: none;
        outline: none;
    }
    .form .text-left a.btn:hover{
        background: #be3b1b;
    }

    /*项目详情*/
    .detail .list-item{
        margin-bottom: 40px;
    }
    .detail .list-item:first-child{
        margin-top: 60px;
    }
    .detail .list-item span.fl{
        padding-left: 80px;
        font-size: 16px;
        color: #515151;
    }
    .detail .list-item div.fl{
        margin-left: 65px;
        text-align: left;
        width: 780px;
    }
    .detail .list-item div.fl p{
        font-size: 16px;
        color: #505050;
    }
    .detail .list-item div.fl .computer{
        position: relative;
        margin-top: 22px;
    }
    .detail .list-item div.fl .computer span{
        font-size: 16px;
        color: #505050;
    }
    .detail .list-item div.fl .computer button {
        margin: 0 10px 0 35px;
        width: 110px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #505050;
        border: 1px solid #dcdcdc;
        border-radius: 3px;
        background: -webkit-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: -o-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: -ms-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: linear-gradient(to bottom, #fdfdfd 0%,#dadada 100%);
    }
    .detail .list-item div.fl .computer input[type='file']{
        position: absolute;
        top: 6px;
        left: 110px;
        width: 110px;
        height: 34px;
        opacity: 0;
        outline: none;
    }
    .detail .list-item div.fl .computer em{
        font-style: normal;
        font-size: 12px;
        color: #969696;
    }
    .detail .list-item div.fl .phone{
        position: relative;
    }
    .detail .list-item div.fl .phone select{
        margin: 0 10px 0 20px;
        width: 180px;
        height: 34px;
        cursor: pointer;
    }
    .detail .list-item div.fl .phone em{
        position: absolute;
        top: 0;
        right: 0;
        display: inline-block;
        width: 430px;
    }
    .detail .list-item div.fl .upload{
        margin-top: 10px;
        position: relative;
        background: url(static/images/plus.png) no-repeat center center;
        margin-left: 104px;
        width: 180px;
        height: 180px;
        border: 1px dashed #dcdcdc;
    }
    .detail .list-item div.fl .upload input[type='file']{
        position: absolute ;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        outline: none;
        opacity: 0;
        cursor: pointer;
    }
    .detail .list-item div.fl .uploadImg button{
        margin-left: -15px;
    }
    .detail .list-item div.fl .uploadImg input[type='file']{
        top: 0;
        left: -14px;
        opacity: 0;
        outline: none;
    }
    .detail .list-item div.fl span.intro{
        font-size: 12px;
        color: #979797;
    }
    .detail .list-item div.fl .item{
        margin-top: 22px;
    }
    .detail .list-item div.fl .item span{
        margin: 5px 35px 0 0;
        padding-left: 0;
        width: 70px;
        text-align:left;
        font-size: 16px;
        color: #515151;
    }
    .detail .list-item div.fl .item input[type='text']{
        padding-left: 15px;
        width: 325px;
        height: 34px;
        font-size: 16px;
        color: #969696;
        border-radius: 0;
    }
    .detail .list-item div.fl .items{
        position: relative;
    }
    .detail .list-item div.fl .items{
        position: relative;
    }
    .detail .list-item div.fl .items .button{
        position: relative;
        margin-left: -40px;
        width: 520px;
    }
    .detail .list-item div.fl .items .button button{
        margin: 0 10px 0 40px;
        width: 110px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #505050;
        border: 1px solid #dcdcdc;
        border-radius: 3px;
        background: -webkit-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: -o-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: -ms-linear-gradient(top, #fdfdfd 0%,#dadada 100%);
        background: linear-gradient(to bottom, #fdfdfd 0%,#dadada 100%);
    }
    .detail .list-item div.fl .items .button input[type='file']{
        padding-left: 15px;
        position: absolute;
        top: 7px;
        left: 40px;
        opacity: 0;
        width: 110px;
        outline: none;
    }
    .detail .list-item div.fl .item textarea{
        padding-left: 15px;
        width: 585px;
        height: 100px;
        font-size: 16px;
        color: #505050;
    }
    .detail .list-item .simple textarea{
        width: 690px;
        height: 100px;
    }
    .detail .list-item .simple span{
        margin-top: 10px;
        font-size: 12px;
        color: #979797;
    }
    .detail .list-item .introduce{
        width: 780px;
        border: 1px solid #dcdcdc;
    }
    .detail .list-item .introduce .intro-header{
        width: 100%;
        height: 54px;
        line-height: 54px;
        background: -webkit-linear-gradient(top, #fff 0%,#dadada 100%);
        background: -o-linear-gradient(top, #fff 0%,#dadada 100%);
        background: -ms-linear-gradient(top, #fff 0%,#dadada 100%);
        background: linear-gradient(to bottom, #fff 0%,#dadada 100%);
    }
    .detail .list-item .introduce .intro-header span{
        font-size: 16px;
        color: #323232;
    }
    .detail .list-item .introduce .intro-header span img{
        margin-left: 30px;
    }
    .detail .list-item .introduce .intro-header span em{
        margin-left: 8px;
        font-size: 16px;
        color: #323232;
        font-style: normal;
    }
    .detail .list-item .introduce .intro-body{
        padding: 23px 20px 30px 20px;
    }
    .detail .list-item .introduce .intro-body p{
        font-size: 18px;
        font-weight: bold ;
        color: #323232;
    }
    .detail .list-item .introduce .intro-body span{
        margin-top: 15px;
        font-size: 14px;
        line-height: 21px;
        color: #505050;
    }
    .detail .list-item div.submitButton{
        margin: 34px 0 37px 208px;
        overflow: hidden;
        width: 850px;
    }
    .detail .list-item .submitButton div{
        float: left;
    }
    .detail .list-item .submitButton div button:first-child{
        margin-right: 25px;
        width: 160px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #fff;
        background: #ff7624;
        border-radius: 3px;
        border: none;
        outline: none;
    }
    .detail .list-item .submitButton div button:first-child:hover{
        background: #be3b1b;
    }
    .detail .list-item .submitButton div button:last-child{
        width: 110px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #ff7624;
        background: #fff;
        border: 1px solid #ff7624;
        border-radius: 3px;
        outline: none;
    }
    .detail .list-item .submitButton a{
        display: inline-block;
        width: 130px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #fff;
        text-align: center;
        background: #a0a0a0;
        border-radius: 3px;
        border: none;
        outline: none;
    }
    /*完成提交*/
    .detail .complete{
        margin: 60px auto 30px auto;
        text-align: center;
    }
    .detail .complete img{
        margin: -15px 20px 0 0;
        width: 45px;
        height: 45px;
    }
    .detail .complete span{
        font-size: 30px;
        font-weight: bold;
        color: #47b260;
    }
    .detail .txt-intro{
        margin-bottom: 34px;
        font-size: 12px;
        color: #969696;
    }
    .detail .look button{
        width: 140px;
        height: 34px;
        line-height: 34px;
        font-size: 16px;
        color: #fff;
        background: #ff7624;
        border-radius: 3px;
        border: none;
        outline: none;
    }
    .detail .look button:hover{
        background: #be3b1b;
    }
    .detail a.return{
        display: inherit;
        margin: 20px 0 60px 0;
        font-size: 16px;
        color: #1968f9;
    }

    .form .text-left button {
        margin-bottom: 60px;
        display: inline-block;
        width: 160px;
        height: 34px;
        font-size: 16px;
        color: #fff;
        text-align: center;
        border-radius: 3px;
        background: #ff7624;
        border: none;
        outline: none;
    }


    body{
        font-family: "Microsoft Yahei", "微软雅黑";
        box-sizing: border-box;
    }
    .clearfix {
        clear: both;
    }
    .skin-blue .content-wrapper .content-header{
        margin: 0 0 -15px 3px;
    }
    .content-header div.all{
        float: left;
        margin: 23px 0 10px 0;
        width: 700px;
    }
    .content-header div.all span{
        position: relative;
        margin-right: 28px;
        font-size: 14px;
        color: #787878;
        cursor: pointer ;
    }
    .content-header div.all span em{
        font-size: 14px;
        font-style: normal;
        color: #787878;
    }
    .content-header div.all span.active,.content-header div.all span:hover{
        font-weight: bold;
        color: #367fa9;
    }
    .content-header div.all span.active em,.content-header div.all span:hover em{
        font-weight: bold;
        color: #367fa9;
    }
    .content-header div.all span b.line:after{
        content: '';
        position: absolute;
        top: 5px;
        right: -14px;
        width: 1px;
        height: 12px;
        background: #d2d2d2;
    }
    .content-header .form-horizontal{
        float: right;
    }
    .content .jp-left{
        height: 32px;
        line-height: 32px;
    }
    .content .jp-left span{
        font-size: 14px;
        color: #333;
    }
    .content .jp-left a{
        margin-right: 15px;
        display: inline-block;
        width: 48px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        font-size: 14px;
        color: #367fa9;
        background: #fff;
        border: 1px solid #dcdcdc;
        border-radius: 3px;
    }
    .content .jp-left select{
        margin-right: 28px;
        width: 150px;
        height: 32px;
        border-radius: 0;
    }
    .content .boxes {
        position: relative;
        margin-top: 4px;
        border-radius: 3px;
        background: #ffffff;
        margin-bottom: 20px;
        width: 100%;
        height: 700px;
        border: 1px solid #dcdcdc;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    }
    .content .boxes-body table{
        width: 100%;
        max-width: 100%;
    }
    .content .boxes-body table tr{
        text-align: center;
        vertical-align: middle ;
    }
    .content .boxes-body table tr td:nth-child(2),.content .boxes-body table tr td:nth-child(3){
        text-align: left;
    }
    .content .boxes-body table thead{
        height: 40px;
        line-height: 40px;
        text-align: center;
    }
    .content .boxes-body table thead tr{
        border-bottom: 1px solid #dcdcdc;
    }
    .content .boxes-body table thead tr td{
        font-size: 14px;
        color: #8c8c8c;
        font-weight: bold;
    }
    .content .boxes-body table tbody{
        height: 655px;
    }
    .content .boxes-body table tbody tr{
        height: 60px;
        vertical-align: middle ;
        cursor: pointer;
    }
    .content .boxes-body table tbody tr:nth-child(even){
        background: #f7f7f7;
    }
    .content .boxes-body table tbody tr:hover{
        background: #f1f5ff;
    }
    .content .boxes-body table tbody tr td{
        padding-top: 6px;
        font-size: 14px;
        color: #323232;
    }
    .content .boxes-body table tbody tr td div.name{
        width: 220px;
    }
    .content .boxes-body table tbody tr td div.name p {
        font-size: 14px;
        font-weight: bold;
        color: #323232;
    }
    .content .boxes-body table tbody tr td div.name:hover p{
        text-decoration: underline;
    }
    /*.content .boxes-body table tbody tr td div.name div{*/
    /*display: none;*/
    /*}*/
    .content .boxes-body table tbody tr:hover td div.name div{
        margin-top: 5px;
        display: block;
    }
    .content .boxes-body table tbody tr td div.name span{
        margin-right: 25px;
        font-size: 14px;
        color: #367bcf;
        cursor: pointer;
    }
    .content .boxes-body table tbody tr td div.name span:last-child {
        margin-right: 0;
    }
    /*右侧内容部分*/
    .content-right{
        margin-top: 50px;
        position: absolute;
        top: 0;
        right: 0;
        /*width: 50%;*/
        width: 905px;
        height: auto;
        background: #fff;
        z-index: 100;
        /*box-shadow: -5px 2px 2px #f0f0f0;*/
        /*-moz-box-shadow: -5px 2px 2px #f0f0f0;*/
        /*-o-box-shadow: -5px 2px 2px #f0f0f0;*/
        /*-webkit-box-shadow: -5px 2px 2px #f0f0f0 ;*/
    }
    .right-header{
        padding: 0 25px;
        width: 100%;
        height: 64px;
        line-height: 64px;
    }
    .right-header span{
        margin-right: 17px;
        font-size: 24px;
        color: #333;
    }
    .right-header a{
        font-size: 14px;
        color: #1a6eb5;
    }
    .right-header .close{
        font-size: 40px;
    }
    .right-nav{
        margin-bottom: 14px;
        width: 100%;
        height: 34px;
        line-height: 34px;
        background: #e8f0f7;
    }
    .right-nav span{
        margin-right: 50px;
        padding-bottom: 5px;
        font-size: 14px;
        color: #333333;
        cursor: pointer;
    }

    .right-nav span:hover,.right-nav span.active{
        border-bottom: 2px solid #3c8dbc;
    }
    .content-right .right-list{
        width: 100%;
    }
    .content-right .right-list table{
        margin-top: 20px;
        width: 100%;
        table-layout: fixed ;
    }

    .content-right .right-list table thead{
        width: 100%;
        height: 40px;
        line-height: 40px;
        border: 1px solid #dcdcdc;
    }
    .content-right .right-list table thead tr{
        border: 1px solid #dcdcdc;
    }
    .content-right .right-list table thead th{
        font-size: 14px;
        color: #8c8c8c;
        text-align: center;
    }
    .content-right .right-list table thead th:nth-child(2){
        text-align: left;
    }
    .content-right .right-list table tbody tr{
        height: 60px;
        cursor: pointer;
    }
    .content-right .right-list table tbody tr:nth-child(even){
        background: #f7f7f7;
    }
    .content-right .right-list table tbody tr:hover{
        background: #f1f5ff;
    }
    .content-right .right-list table tbody tr td{
        font-size: 14px;
        color: #333;
        text-align: center;
    }
    .content-right .right-list table tbody tr td:nth-child(2) {
        /*font-weight: bold;*/
        text-align: left;
    }
    .content-right .right-list table tbody tr td:nth-child(3) {
        padding-right: 20px;
        text-align: right;
    }
    /*机构信息*/
    .right-list .list-message{
        padding: 0 20px 0 25px;
    }
    .right-list .list-header{
        position: relative;
        width: 100%;
        height: 43px;
        text-align: left;
        border-bottom: 1px solid #dcdcdc;
    }
    .right-list .list-header:first-child {
        margin-top: -10px;
    }
    .right-list .list-header span{
        margin-left: 15px;
        font-size: 15px;
        color: #000;
    }
    .right-list .list-header span:before {
        content: '';
        position: absolute;
        top: 13px;
        left: 0;
        width: 4px;
        height: 16px;
        background: #626262;
    }
    .showEmpty{
        border: 1px dashed red;
    }
    .form .form-group input[type='text']:focus {
        border: 1px solid #66afe9 !important ;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    }
    .form .form-group span.error{
        color: red;
    }
</style>
<!-- loading start -->
<div class="loading in" ng-class="{'in': loading}"><i></i></div>
<!-- loading end -->
<div class="content-wrapper" style="min-height: 924px;; z-index: 50;">
    <!-- Main content -->
    <section class="content">
        <div class="section">
            <div class="instruction"><span>公益项目申请</span><span>（以下所有信息均为必填项）</span></div>
            <div class="choose">
                <div class="chooseNav">
                    <span class="step1 active">1、基本信息</span>
                    <span class="step2">2、项目详情</span>
                    <span class="step3">3、完成提交</span>
                </div>
                <div class="chooseDetail">
                    <!--基本信息-->
                        <div class="detail">
                            <div class="message">
                                <span>项目基本信息</span>
                            </div>
                            <form action="" class="form" name="baseInfoForm">
                                <div class="form-group clearfix">
                                    <label for="" class="fl">项目名称</label>
                                    <input type="text" ng-model="project.name" class="form-control fl" name="projectName" ng-maxlength="9" required
                                                       ng-class="{'showEmpty': submited && baseInfoForm.projectName.$error.required ||submited && baseInfoForm.projectName.$error.maxlength}">
                                    <span class="fl help-txt">（不超过9个字）</span>

                                    <span class="error" ng-show="submited && baseInfoForm.projectName.$error.required">*项目名称不能为空</span>
                                    <span class="error" ng-show="submited && baseInfoForm.projectName.$error.maxlength">*项目名称不超过9个字</span>
                                </div>
                                <div class="form-group clearfix">
                                    <label class="control-label fl">项目时间</label>
                                    <div class="active-time fl">
                                        <input type="text" ng-model="project.startTime" readonly style="float:left" required
                                               class="date-choose f1 form-control" placeholder="开始时间"
                                               datepicker-popup="yyyy-MM-dd" is-open="project.$startTimeOpened"
                                               ng-required="true" max-date="project.endTime"
                                               current-text="今天" clear-text="清除" close-text="关闭"
                                               datepicker-options="{formatDayTitle: 'yyyy年M月', formatMonth: 'M月', showWeeks: false}"
                                               ng-click="openDatePicker($event, project, '$startTimeOpened')"
                                               ng-class="{'showEmpty': submited && project.startTime == null}"/>
                                        <span class="fl" style="margin-left: 10px;margin-right: 10px;">至</span>
                                        <input type="text" ng-model="project.endTime" readonly required
                                               class="date-choose f1 form-control" placeholder="结束时间"
                                               datepicker-popup="yyyy-MM-dd" is-open="project.$endTimeOpened" min-date="project.startTime"
                                               ng-required="true"
                                               current-text="今天" clear-text="清除" close-text="关闭"
                                               datepicker-options="{formatDayTitle: 'yyyy年M月', formatMonth: 'M月', showWeeks: false}"
                                               ng-click="openDatePicker($event, project, '$endTimeOpened')"
                                               ng-class="{'showEmpty': submited && project.endTime == null}"/>

                                        <span class="error" ng-show="submited && project.startTime == null">*请选择活动开始时间</span>
                                        <span class="error" ng-show="submited && project.endTime == null">*请选择活动结束时间</span>
                                        <span class="error" ng-show="submited && project.startTime != null && project.endTime != null && project.startTime == project.endTime">*项目开始时间与结束时间不能相同</span>
                                    </div>
                                </div>
                                <div class="form-group clearfix">
                                    <label for="" class="fl">捐助领域</label>
                                    <div class="fl sort">
                                        <!--<span ng-class="{'active':project.area == '疾病援助'}" ng-click="setArea('疾病援助')">疾病援助</span>-->
                                        <!--<span ng-class="{'active':project.area == '扶贫/救灾'}" ng-click="setArea('扶贫/救灾')">扶贫/救灾</span>-->
                                        <!--<span ng-class="{'active':project.area == '教育/助学'}" ng-click="setArea('教育/助学')">教育/助学</span>-->
                                        <!--<span ng-class="{'active':project.area == '环境/动物保护'}" ng-click="setArea('环境/动物保护')">环境/动物保护</span>-->
                                        <!--<span ng-class="{'active':project.area == '其他'}" ng-click="setArea('其他')">其他</span>-->
                                        <span ng-repeat="area in defaultAreas" ng-class="{'active':project.area == area}"
                                              ng-click="setArea(area)" ng-bind="area"></span>
                                    </div>
                                </div>
                                <div class="form-group clearfix">
                                    <label for="" class="fl">具体分类</label>
                                    <div class="fl sort">
                                        <!--<span class="active">白血病</span><span>早产儿</span><span>烧烫伤</span><span>罕见病</span>
                                        <span>癌症</span><span>唇腭裂</span><span>因病致贫</span><span>尘肺病</span><span>病情危急</span><span>其他</span>
                                        <span>尿毒症</span><span>渐冻症</span><span>意外受伤</span><span>贫困大病</span><span>视力健康</span><span>听障</span>-->
                                        <span ng-repeat="classify in areas[project.area]" ng-class="{'active':project.classify == classify}"
                                              ng-click="setClassify(classify)" ng-bind="classify">
                                        </span>
                                    </div>
                                </div>
                                <div class="form-group form-groups clearfix">
                                    <label for="" class="fl">常驻地址</label>
                                    <div class="fl">
                                        <select class="area-select" name="projectProvince" ng-model="project.province"
                                                ng-options="key as key for (key,value) in provinces"
                                                ng-change="project.city='';" required>
                                            <option value="">省</option>
                                        </select>
                                    </div>
                                    <div class="fl" style="margin: 0 20px;">
                                        <select class="area-select fl" name="projectCity" ng-model="project.city"
                                                ng-options="key as key for (key,value) in provinces[project.province]"
                                                required>
                                            <option value="">市</option>
                                        </select>
                                    </div>
                                    <div class="fl">
                                        <select class="area-select" name="projectDistrict" ng-model="project.district"
                                                ng-options="value as value for value in provinces[project.province][project.city]"
                                                required>
                                            <option value="">区</option>
                                        </select>
                                    </div>

                                    <span class="error" ng-show="submited && baseInfoForm.projectProvince.$error.required">*请选择省份</span>
                                    <span class="error" ng-show="submited && !baseInfoForm.projectProvince.$error.required && baseInfoForm.projectCity.$error.required">*请选择城市</span>
                                    <span class="error" ng-show="submited && !baseInfoForm.projectCity.$error.required && baseInfoForm.projectDistrict.$error.required">*请选择城区</span>
                                </div>

                                <div class="form-group clearfix">
                                    <label for="" class="fl">筹款目标</label>
                                    <input type="text" ng-model="project.target" class="form-control fl" name="projectTarget" ng-pattern="/^[1-9]\d{0,8}$/" required
                                    ng-class="{'showEmpty': submited && baseInfoForm.projectTarget.$error.required || submited && baseInfoForm.projectTarget.$error.pattern}"/>
                                    <span class="fl help-txt">（请输入整数金额，例如：5000）</span>

                                    <span class="error" ng-show="submited && baseInfoForm.projectTarget.$error.required">*筹款目标金额不能为空</span>
                                    <span class="error" ng-show="submited && baseInfoForm.projectTarget.$error.pattern">*输入金额有误</span>
                                </div>
                                <div class="form-group clearfix">
                                    <label for="" class="fl">资助人群</label>
                                    <div class="fl sort">
                                    <span ng-repeat="population in populations" ng-class="{'active':population == project.population}"
                                          ng-click="setPopulation($index)" ng-bind="population">

                                    </span>
                                    </div>
                                </div>
                                <div class="form-group clearfix">
                                    <label for="" class="fl">发起缘由</label>
                                    <textarea style="max-height: 200px; max-width: 600px;" ng-model="project.reason" ng-maxlength="54" name="projectReason" id="" cols="30" rows="10" class="fl" required
                                    ng-class="{'showEmpty': submited && baseInfoForm.projectReason.$error.required || submited && baseInfoForm.projectReason.$error.maxlength}"></textarea>
                                    <span class="txt">提示文字：请您填写真实的身份信息，与受助对象的关系，以及该项目的简要介绍，54字以内。</span>

                                    <span class="error" ng-show="submited && baseInfoForm.projectReason.$error.required">*发起缘由不能为空</span>
                                    <span class="error" ng-show="submited && baseInfoForm.projectReason.$error.maxlength">*发起缘由字数过长</span>
                                </div>
                                <!--<div class="form-group clearfix">-->
                                <!--<label for="" class="fl">验证码</label>-->
                                <!--<input type="text" class="form-control valid fl">-->
                                <!--<div class="clearfix valida">-->
                                <!--<span>BBPf</span><a href="">刷新验证码</a>-->
                                <!--</div>-->
                                <!--</div>-->
                                <div class="form-group clearfix text-left">
                                    <input type="checkbox" ng-click="changeChecked()" ng-checked="checked" required class="fl">
                                    <div class="agree">
                                        <span>我已阅读并同意《<a href="http://lj.ubtob.com/userAgreement" target="_blank">优软一元捐用户协议</a>》</span>
                                    </div>

                                    <span class="error" ng-show="submited && !checked">*请阅读并同意优软一元捐用户协议</span>
                                </div>
                                <div class="text-left">
                                    <button type="button" ng-click="saveBaseInfo(project, baseInfoForm.$invalid || !checked || !project.area || !project.population)" class="btn">保存，下一步</button>
                                </div>
                            </form>
                        </div>
                </div>
            </div>
        </div>
    </section>
</div>
<script>
    $('.right-nav').on('click', 'span', function () {
        var index = $(this).index();
        $(this).addClass('active').siblings().removeClass('active');
        $('.right-list').eq(index).addClass('show').siblings().removeClass('show');
    });
</script>