Subversion Repositories SmartDukaan

<link href="https://cdn.datatables.net/fixedcolumns/3.3.0/css/fixedColumns.bootstrap.css" rel="stylesheet"/>

<style>

.dot {

  height: 25px;

  width: 25px;

  border: 3px solid #BADA55;

  border-radius: 50px;

  display: inline-block;

}

</style>

<section class="wrapper">

    <div class="row">

        <div class="col-lg-12">

            <h3 class="page-header">TIMELINE</h3>

            <ol class="breadcrumb">

                <li><i class="fa fa-home"></i><a href="${rc.contextPath}/dashboard">Home</a></li>

                <li><i class="icon_document_alt"></i>Onboarding Timeline</li>

            </ol>

        </div>

    </div>

    <div class="col-lg-12">

        <table class="table table-border table-condensed table-bordered" id="storeTimeline" style="width:100%">

            <thead class="row htable" style="background:#F5F5F5;">

            <tr style="color:black;">

                <th>Id</th>

                <th>Outlet Name</th>

                <th>Code</th>

	            <th>Status</th>

	            <th>Verification</th>

	            <th>Documents</th>

		        <th>Store Code</th>

		        <th>Training</th>

		        <th>Recce</th>

		        <th>Advance Stock</th>

		        <th>Branding</th> 

		        <th>Full Stock</th>

		        <th>Billing</th>

                <th>Inaugration</th>

                <th>Fin Services</th>

                <th>Promoter </th>

		    </tr>

            </thead>

            <tbody>

           #foreach($st in $storeTimelines)

           <tr>

               <td>$st.getOnboardingId()</td>

               <td>$st.getOutletName() ($st.getCity())</td>

               #if($st.getCode())

                   <td>$st.getCode()</td>

               #else

                   <td>-</td>

               #end

               <td>$st.getStatus()</td>

               #foreach($obtm in $st.getObtm())

                   #if($obtm.getStatus() == "COMPLETED")

                       <td><span class="dot"

                                 style="background-color:#3bb143"></span> $obtm.getCompletedTimestamp().format($dateFormatter)

                       </td>

                   #elseif($obtm.getStatus() == "DELAY")

                       <td><span class="dot"

                                 style="background-color:#d3181f"></span>$obtm.getCompletedTimestamp().format($dateFormatter)

                       </td>

                   #elseif($obtm.getStatus() == "WIP")

                       <td><span class="dot"

                                 style="background-color:#ffd300"></span>$obtm.getCompletedTimestamp().format($dateFormatter)

                       </td>

                   #elseif($obtm.getStatus() == "NOT_STARTED")

                       <td><span class="dot"

                                 style="background-color:#999DA0"></span> $obtm.getCompletedTimestamp().format($dateFormatter)

                       </td>

                   #else

                       <td>Invalid state</td>

                   #end

               #end

           </tr>

            #end

            </tbody>

        </table>

    </div>

</section>

<script type="text/javascript">

    $(document).ready(function () {

      var dtable = $('#storeTimeline').DataTable({

       "scrollX": true,

        orderCellsTop: true,

             "order": [[ 0, "desc" ]]

       });

     });

  </script>