<div class="task-group-inner">
	<div class="row">
		<div class="headline">
			<h4><i class="fa fa-wrench fa-fw"></i> Parts assigned to {[{ related.name }]}</h4>
		</div>
	</div>
	<div class="row">
		<div class="col-sm-5">
			<input class="form-control" type="text" placeholder="Search and add parts" ng-model="part_search" search-clear="true" search-callback="addPart(ev, data)" autocomplete="off" product-search>
		</div>
		<div class="col-sm-3">
			<div request-existing-part="parts" related="related" related-type="user"></div>
		</div>
		<div class="col-sm-4">
			<div request-non-existing-part="parts" related="related" related-type="user"></div>
		</div>
	</div>
	<br>
	<table class="table table-condensed">
		<thead>
			<th></th>
			<th>Name</th>
			<th class="centered">Price</th>
			<th class="centered">Quantity</th>
			<th class="centered">VAT</th>
			<th class="centered">Total</th>
			<th></th>
		</thead>
		<tbody>
			<tr ng-repeat="part in parts">
				<td><span class="text-warning" ng-show="part.on_order == '1'" tooltip="On order"><i class="fa fa-clock-o"></i></span></td>
				<td><a ng-href="#/stock?query={[{part.stock.name}]}" style="color:black">{[{ part.stock.name }]}</a></td>
				<td class="centered"><span editable-text="part.price" e-class="input-tiny" onaftersave="updatePart(part)">{[{ part.price | currency:"£" }]}</span></td>
				<td class="centered"><span editable-number="part.quantity" onbeforesave="updatePartProperty(part, 'quantity', $data)">{[{ part.quantity }]}</span></td>
				<td class="centered">{[{ part.price * part.vat * part.quantity / 100 | currency:"£" }]}</td>
				<td class="centered"><span editable-text="part.total_price" e-class="input-tiny" onaftersave="updateTotalPrice(part)">{[{ part.total_price | currency:"£" }]}</span></td>
				<td><a href="#" ng-click="removePart(part)" data-eat-click><span class="text-danger">Remove</span></a></td>
			</tr>
			<tr >
				<td colspan="7" ng-if="parts.length == 0"> <br><strong>No parts found for this {[{related_type}]}.</strong><br></td>
			</tr>
		</tbody>
	</table>
	<br>
	<div class="text-right parts-row" ng-show="parts.length > 0">
		<div>Subtotal: {[{ subtotal() | currency:"£" }]}</div>
		<div>Tax: {[{ tax() | currency:"£" }]}</div>
		<div><strong>Total: {[{ total() | currency:"£" }]}</strong></div>
	</div>
	<hr>
</div>



<script type="text/ng-template" id="modals/request-existing-part.html">
	@include('bookings::templates.modals.request-existing-part')
</script>
<script type="text/ng-template" id="modals/request-non-existing-part.html">
	@include('bookings::templates.modals.request-non-existing-part')
</script>