<div class="content-wrapper" ng-if="!myAccess.projectAdd && !myAccess.projectEdit">
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6 offset-sm-1 offset-md-2 offset-lg-3 mt-5">
                <div class="alert alert-warning alert-dismissible">
                    <h5><i class="icon fas fa-ban"></i> Warning!</h5>
                    Unauthorised Access.
                </div>
            </div>
        </div>
    </div>
</div>
<div class="content-wrapper" ng-if="myAccess.projectAdd || myAccess.projectEdit">
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="text-success">
                        <go-back/>
                        <i class="fas fa-table"></i> {{btn.name}}
                    </h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a ng-href="{{baseurl}}/dashboard">Home</a></li>
                        <li class="breadcrumb-item"><a ng-href="{{baseurl}}/projects/list">Projects</a></li>
                        <li class="breadcrumb-item active">{{btn.screen}}</li>
                    </ol>
                </div>
            </div>
        </div>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                <div class="card card-outline card-success">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-sm-12 col-lg-5">
                                <h3 class="card-title">Project Information</h3>
                                <div class="form-group mt-2">
                                    <label for="proj_account">Account Name</label>
                                    <select id="proj_account" class="form-control custom-select"
                                            ng-model="project.proj_account" ng-options="o.accountid as o.acc_company_name for o in accountOptions"/>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="proj_name">Project Name</label>
                                    <input type="text" id="proj_name" class="form-control" ng-model="project.proj_name" placeholder="Project Name">
                                </div>
                                <div class="form-group mt-2">
                                    <label for="proj_nature">Nature Of Project</label>
                                    <select id="proj_nature" class="form-control custom-select"
                                    ng-model="project.proj_nature" ng-options="pn.value as pn.label for pn in projNature">
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="proj_name">Send Notifications to:</label>
                                    <input type="text" id="proj_notification_email" class="form-control" ng-model="project.proj_notification_email" placeholder="Email List">
                                </div>
                                <div class="form-group">
                                    <div class="custom-control custom-switch custom-switch-off-danger custom-switch-on-success">
                                        <input type="checkbox" ng-model="project.proj_sendnotifications" class="custom-control-input" id="customSwitch1">
                                        <label class="custom-control-label no-select pointer" for="customSwitch1">Send Unfilled Diary Notifications</label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="proj_description">Project Description</label>
                                    <textarea id="proj_description" class="form-control" rows="2" ng-model="project.proj_description" placeholder="Project Description"></textarea>
                                </div>
                                <div class="form-group">
                                    <label for="proj_manager">Project Manager</label>
                                    <select id="proj_manager" class="form-control custom-select"
                                            ng-model="project.proj_manager" ng-options="o.employeeid as (o.emp_first_name +' '+o.emp_last_name) for o in projectManagerOptions"/>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="proj_status">Start Date
                                        <small data-toggle="tooltip" title="DD-MM-YYYY"><i class="fas fa-question-circle"></i></small>
                                    </label>
                                    <input id="proj_start_date"
                                           type=text date-picker
                                           placeholder='Start Date (DD-MM-YYYY)'
                                           dateformat='dd-mm-yy'
                                           maxlength="10"
                                           ng-required='true'
                                           class='form-control'
                                           ng-model='project.proj_start_date'>
                                </div>
                                <div class="form-group">
                                    <label for="proj_status">Expected End Date
                                        <small data-toggle="tooltip" title="DD-MM-YYYY"><i class="fas fa-question-circle"></i></small>
                                    </label>
                                    <input id="proj_expected_end_date" type=text date-picker
                                           placeholder='Expected End Date(DD-MM-YYYY)'
                                           dateformat='dd-mm-yy'
                                           maxlength="10"
                                           ng-required='false'
                                           class='form-control'
                                           ng-model='project.proj_expected_end_date'>
                                           <!-- min-date="{{project.proj_start_date}}" -->
                                </div>
                                <div class="form-group" >
                                    <label for="proj_status">Status</label>
                                    <select id="proj_status" class="form-control custom-select"
                                            ng-model="project.proj_status" ng-options="ps.value as ps.label for ps in projStatus" ng-if="!params.projectid">
                                    </select>
                                    <span ng-if="params.projectid">{{project.proj_status | titlecase}}</span>
                                </div>

                                <div class="form-group" >
                                    <label for="proj_type">Project Type</label>
                                    <select id="proj_type" class="form-control custom-select"
                                            ng-model="project.proj_type" ng-options="ps.id as ps.proj_type for ps in projectType">
                                    </select>
                                </div>
                                <div class="form-group"> 
                                    <label for="emp_allocation_type">Billing Type</label> 
                                    <select id="emp_allocation_type" class="form-control custom-select" ng-model="project.proj_billing_type" ng-options="l.value as l.label for l in billing_type"> 
                                    </select> 
                                </div> 
                            </div>
                            <div class="col-sm-12 col-lg-7">
                                <h3 class="card-title">
                                    <button ng-if="estimateTeamEffortOptions.length > 0" ng-click="addEffort()" class="btn btn-success float-right btn-sm mb-1"><i class="fas fa-plus"></i> Add</button>
                                    Min. Team Effort
                                </h3>
                                <div class="table-responsive mt-2">
                                    <table class="table m-0 table-bordered table-sm">
                                        <thead>
                                        <tr>
                                            <td>Type</td>
                                            <td>No. Hero</td>
                                            <td>(hours / day)</td>
                                            <td>As on</td>
                                            <td>Action</td>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr ng-repeat="ete in estimateTeamEffort">
                                            <td><select id="desg-name" class="form-control custom-select" ng-model="ete.desg_id" ng-options="ps.id as ps.desg_name for ps in estimateTeamEffortOptions"/></td>
                                            <td><input type="number" min="1" max="50" id="desg-qty" class="form-control w-75 p-1" ng-model="ete.desg_qty"></td>
                                            <td><input type="number" min="0" max="8" id="desg-hours" class="form-control w-75 p-1" ng-model="ete.desg_hours"></td>
                                            <td>
                                                <span class="no-calender-btn">
                                                    <input type=text date-picker placeholder='DD-MM-YYYY' dateformat='dd-mm-yy' maxlength="10" class='form-control p-0' ng-model='ete.desg_date' style="width:70px;"/>
                                                </span>
                                            </td>
                                            <td>
                                                <button ng-if="$index > 0" ng-click="removeEffort($index)" class="btn"><i class="fas fa-trash"></i></button>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card-footer">
                        <div class="col-12">
                            <button type="button" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#modal-default">Cancel</button>
                            <button type="submit" ng-click="createProject()" class="btn btn-success float-right btn-xs"><i class="fas {{btn.icon}}"></i> {{btn.name}}</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="modal fade" id="modal-default">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <p>Are you sure to leave this page!</p>
                </div>
                <div class="modal-footer justify-content-between">
                    <button type="button" class="btn btn-default btn-xs" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary btn-xs" data-dismiss="modal" ng-click="goTo($event,'projectList')">Proceed</button>
                </div>
            </div>
        </div>
    </div>
</div>
