<div class="content-wrapper" class="modal-demo">
    <section class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="text-warning">
                        <go-back/>
                        <i class="fas fa-user"></i> My Projects
                    </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 active">My Projects</li>
                    </ol>
                </div>
            </div>
        </div>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-sm-12 p-5 bg-white" ng-if="projects.length <= 0">
                <h4 class="text-center">Currently, you are not assigned to any active project at the moment.<br>
                        <!-- Please log your hours under the <br>"R&D, POC, Project Co-ordinations, Self Study, Training, Helping Others, etc..." <br>project from "My Diary." -->
                </h4>
            </div>

            <div data-info="My Projects for admin" class="col-md-12" ng-if="projects.length > 0">
                <div class="card card-outline card-warning">
                    <div class="card-header border-transparent">
                        <h3 class="card-title"><strong>My Projects</strong></h3>
                        <div class="card-tools">
                            <div class="btn-group">
                                <button type="button" title="Fullscreen Toggle" class="btn btn-dark toggle-fullscreen"><i class="fas fa-expand"></i></button>
                                <button type="button" class="btn btn-dark" data-widget="collapse"><i class="fas fa-minus"></i></button>
                            </div>
                        </div>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table id="myProjectList" class="table table-bordered table-striped">
                                <thead>
                                <tr>
                                    <th>Account</th>
                                    <!--<th class="d-none d-lg-table-cell">Account Details</th>-->
                                    <th>Project</th>
                                    <th data-toggle="tooltip" title="Hours Per/day">Allocation <i class="fas fa-question-circle"></i></th>
                                    <th>Date
                                        <small data-toggle="tooltip" title="Date of Project start"><i class="fas fa-question-circle"></i></small>
                                    </th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr ng-repeat="project in projects">
                                    <td><a href="/accounts/view/{{project.accountid}}">{{project.acc_company_name}}</a></td>
                                    <!--<td  class="d-none d-lg-table-cell">
                                        <span class="nowrap"><a href="mailto:{{project.acc_email}}" target="_blank">{{project.acc_email}}</a></span><br>
                                        <span class="nowrap"><a href="tel:{{project.acc_primany_contact}}" target="_blank">{{project.acc_primany_contact}}</a></span>
                                    </td>-->
                                    <td><a ng-href="/projects/view/{{project.projectid}}">{{project.proj_name}}</a></td>
                                    <td>{{project.partialHours ? project.partialHours : '-' }}</td>
                                    <td><span class="nowrap" ng-bind="formatDate(project.proj_start_date) | date:'dd MMM yyyy'"></span></td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
