Update supplier/cost with components

resources/views/theme/backend/adminlte/supplier/widget/costs.blade.php

@@ -1,24 +1,9 @@
-<!-- $o = Supplier::class -->
+<!-- $spo=Supplier::class -->
+@use(App\Models\Cost)
+
 <div class="row">
 	<div class="col-4">
-		<div class="form-group has-validation">
-			<label for="cost_id">Supplier Invoice</label>
-			<select class="form-control form-control-border" id="cost_id" name="cost_id">
-				<option value=""></option>
-				<option value="">Add New</option>
-				@foreach(\App\Models\Cost::where('supplier_id',$o->id)->orderBy('billed_at','DESC')->get() as $oo)
-					<option value="{{ $oo->id }}">{{ $oo->billed_at->format('Y-m-d') }}: ${{ number_format($oo->total,2) }}</option>
-				@endforeach
-			</select>
-			<span class="invalid-feedback" role="alert">
-				@error('name')
-					{{ $message }}
-				@else
-					Date is required.
-				@enderror
-			</span>
-			<span class="input-helper">Suppliers Invoice</span>
-		</div>
+		<x-leenooks::form.select name="cost_id" icon="fa-list" label="Supplier Invoice" helper="Supplier invoice" addnew="Add New" :options="Cost::where('supplier_id',$spo->id)->orderBy('billed_at','DESC')->get()->map(fn($item,$key)=>['id'=>$item->id,'value'=>sprintf('%s: $%s',$item->billed_at->format('Y-m-d'),number_format($item->total,2))])"/>
 	</div>
 </div>
 
@@ -27,7 +12,7 @@
 		$(document).ready(function() {
 			$('#cost_id')
 				.on('change',function(item) {
-					window.location.href = '{{ url('a/supplier/cost') }}/'+(item.target.value ? item.target.value : 'new/'+{{ $o->id }});
+					window.location.href = '{{ url('a/supplier/cost') }}/'+(item.target.value !== 'new' ? item.target.value : 'new/'+{{ $spo->id }});
 				});
 		});
 	</script>