How can I pass date value to WebAPI from Angular Client? - javascript

I'm using a dynamic value to pass data from database. I'm not sure how to pass the value from the client to the server to get the expected data result.
Here the WebAPI Ctrl:
[HttpGet]
public IQueryable<getAllDayReps_Result> GetRepsByDate(DateTime datum)
{
//var dayReps = db.getAllDayReps(new DateTime(2014,05,13)).AsQueryable();
var dayReps = db.getAllDayReps(datum).AsQueryable();
return dayReps;
}
When I'm testing the commented static value, then it works fine and I'm getting the data from date 2014-05-13. But with the dynamic value I don't get data from the database.
Angular Ctrl:
//Button Send
$scope.sending = function (sel) {
$scope.selected = new Date(sel);
$scope.repDay = ResourceService.ds021.query({
'datum': $scope.selected
});
};
Service for REST:
return {
ds021: $resource(baseUrl + '/api/qr_ds021/:Id', {
Id: '#Id'
}, {})
};
View:
<div>
<input type="date" ng-model="selected" />
<button type="button" ng-click="sending(selected)">Send</button>
</div>
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>F_1 </th>
<th>F_2 </th>
<th>F_3 </th>
<th>F_4 </th>
<th>F_5 </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="rep in repDay>
<td>{{ rep.datum }}</td>
<td>{{ rep.isin }}</td>
<td>{{ rep.NameId }}</td>
<td>{{ rep.time_quot }}</td>
<td>{{ rep.num_quot }}</td>
</tr>
</tbody>
....
How you can see I'm typing an value in the input field. The ngModel value will sending with the button "send" to the service. But something is wrong in the service and I don't know what..
EDIT:
Here is the method from the Context.tt:
public virtual ObjectResult<getAllDayReps_Result> getAllDayReps(Nullable<System.DateTime> datumOut)
{
var datumOutParameter = datumOut.HasValue ?
new ObjectParameter("DatumOut", datumOut) :
new ObjectParameter("DatumOut", typeof(System.DateTime));
return ((IObjectContextAdapter)this).ObjectContext.ExecuteFunction<getAllDayReps_Result>("getAllDayReps", datumOutParameter);
}

Related

I cant seem to pass value from controller to view, Laravel 8

I can't seem to parse data that i got from db on controller to view, i have tried multiple solutions that i got from similiar question but none seem to work.
i simply want to show my employee list on my admin page.
Here's my login controller
The login function works just fine, its just doenst seem to parse the data i got from db to view
public function postLogin(Request $request){
$list = "";
$list = \DB::table('users')->where('role','1')->get();
if(Auth::attempt($request -> only('username','password'))){
if (Auth::user()->role == '0') {
return view('admin',['daftar' => $list]);
}else if (Auth::user()->role == '1') {
return redirect('/EPage');
}
}
return redirect('/');
}
Here's my admin blade view
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">name</th>
<th scope="col">email</th>
<th scope="col">phone</th>
</tr>
</thead>
<tbody>
<tr>
#foreach($list as $lists)
<th scope="row">1</th>
<td>{{ $lists->name }}</td>
<td>{{ $lists->email }}</td>
<td>{{ $lists->phone }}</td>
#endforeach
</tr>
</tbody>
Please help me understand my mistake, Thank you in advance.
i'm expecting the admin page with show user list with role equals to 1
After i tinker here and there, i finally found that i forgot to put an "s" on my user(s) table name. silly mistake but crucial hahaha
it seems previously the variable that i parse are actually empty.
Here are my final controller that worked
public function postLogin(Request $request){
if(Auth::attempt($request -> only('username','password'))){
if (Auth::user()->role == '0') {
$daftar = \DB::table('users')->where('role',1)->get();
return view('admin',['daftar' => $daftar]);
}else if (Auth::user()->role == '1') {
return redirect('/EPage');
}
}
return redirect('/');
}
and here's my blade view
<tbody>
#foreach($daftar as $lists)
<tr>
<th scope="row">1</th>
<td>{{ $lists->name }}</td>
<td>{{ $lists->email }}</td>
<td>{{ $lists->Phone }}</td>
</tr>
#endforeach
</tbody>
also thanks to waqar for correcting my previous mistakes
You can send list data with view using compact like:
public function postLogin(Request $request){
$list = "";
$list = \DB::table('users')->where('role','1')->get();
if(Auth::attempt($request -> only('username','password'))){
if (Auth::user()->role == '0') {
return view('admin',compact('list'));
}else if (Auth::user()->role == '1') {
return redirect('/EPage');
}
}
return redirect('/');
}
then you can use $list on your blade easily.

How to call Laravel Model function with parameter into Vuejs template?

I have a product table and stock table. In stock table data about product sale and purchase are stored. I need to show the stock of every product base on purchase and sale. So I need to call a model function with product Id in vuejs template to calculate the stock quantity of the product. How to do this, or is there any alternative way? please help me out.
My product controller function is-
public function stock() {
return Product::with(['category', 'stock'])->get();
}
My product model function is-
public function stock($id){
$purchase_quantity = Stock::where([['product_id', $id], ['stock_type', 'purchase']])->sum('quantity');
$sale_quantity = Stock::where([['product_id', $id], ['stock_type', 'sale']])->sum('quantity');
return $purchase_quantity - $sale_quantity;
}
My vuejs template code where in every v-for iteration I want to call the model function-
<tr v-for="product in products.data" :key="product.id">
<td>{{ product.id }}</td>
<td>{{ product.category.name }}</td>
<td>{{ product.name }}</td>
<td>{{ product.unit }}</td>
<td>{{ product.stock(product.id) }}</td>
</tr>
Here product.stock(product.id) is not working.
It shows the error-
Too few arguments to function App\Models\Product::stock(), 0 passed
you need to use accessor in this case so
in Product.php
protected $appends = ['stocks'];
/**
* Get the Product's stock
*
* #return int
*/
public function getStocksAttribute()
{
$purchase_quantity = Stock::where([['product_id', $this->id], ['stock_type', 'purchase']])->sum('quantity');
$sale_quantity = Stock::where([['product_id', $this->id], ['stock_type', 'sale']])->sum('quantity');
return $purchase_quantity - $sale_quantity;
}
then in side javascript you can you can get stock in each product row like product.stocks
your vuejs code will be like this
<tr v-for="product in products.data" :key="product.id">
<td>{{ product.id }}</td>
<td>{{ product.category.name }}</td>
<td>{{ product.name }}</td>
<td>{{ product.unit }}</td>
<td>{{ product.stocks }}</td>
</tr>
ref link https://laravel.com/docs/8.x/eloquent-mutators#defining-an-accessor

How to sort columns in Vue when the values to sort are the result of calculations

I've found many resources for sorting data that is already in an array but can't find anything on sorting dynamically generated data.
<table>
<thead>
<tr>
<th>Program</th>
<th>Rewards</th>
</tr>
</thead>
<tbody>
<tr v-for="program in programs" :key="program.id">
<td>{{ program.program_name }}</td>
<td>{{ pointValue(program) | percent }}</td>
</tr>
</tbody>
</table>
pointValue() is a method which calculates and returns a value which is displayed as a %. this is the Rewards column. i would like the table to be sortable by Programs and by Rewards. (Program is just a string).
Create computed array for programs using map and sort method and iterate it instead
computed: {
computedPrograms() {
return this.programs
.map(program => {
return {
...program,
value: this.pointValue(program)
}
})
.sort((a, b) => a.value - b.value)
}
}
<tr v-for="program in computedPrograms" :key="program.id">
<td>{{ program.program_name }}</td>
<td>{{ program.value | percent }}</td>
</tr>

split array elements from python into separate HTML tables based on specified attribute

I have a Drilling table containing, daily drilling and all time drilling record. we have project in which drill and the corresponding client in each record. now i am building a report in which i need to view a daily summary of all drilling PER Client rather. More precisely i need to see a list where i have client name, followed by the number of drilling records for that client (any number), then the total of the meters that were drilled.
In my code i get a filter based on day then client, after that i get the sum for all drilling of a particular client. all the data are correct and and i am getting all record for that day with their client. I put them all in arrays and send to HTML template. when i send it to HTML they all get in the table but formated in only one table row...my problem is how can i best format it the way i explained at the beginning of the question
this the view:
def report(request):
today = date.today()
clt_ = []
clt_day_t_m_ = []
result = []
client = []
drill_date = []
auger = []
vehicle = []
project_name = []
shift = []
meters_drilled = []
targetmeters = []
driller = []
comment = []
m_p_obj_day = Drilling.objects.filter(drilling_date=today)
_total = m_p_obj_day.aggregate(Sum('ms_drilled'))['ms_drilled__sum']
for ma_por_obj_day in m_p_obj_day:
client_ma_por_obj_day = Client.objects.filter(clt_nme=ma_por_obj_day.client)
for clt_s in client_ma_por_obj_day:
clt_.append(clt_s.clt_nme)
clt_s_=list(set(list(OrderedDict.fromkeys(clt_))))
_items = ""
for f in clt_s_:#
_client_obj = Client.objects.filter(clt_name=f)
_items = m_p_obj_day.filter(client=_client_obj)
for i in _items:
client.append(i.clt)
drill_date.append(i.drill_dte)
auger.append(i.auger)
vehicle.append(i.vehicle)
project_name.append(i.prjt_nme)
shift.append(i.shift)
meters_drilled.append(i.mtrs_drilled)
targetmeters.append(i.targetmeters_drilled)
driller.append(i.driller)
comment.append(i.comment)
ut_ = m_p_obj_day.filter(client=_client_obj).aggregate(Sum('ms_drilled'))['ms_drilled__sum']
clt_day_t_m_.append(u)
client_ = "\n".join(map(str, client))
drill_date_ = "\n".join(map(str, drill_date))
vehicle_ = "\n".join(map(str, vehicle))
auger_ = "\n".join(map(str, auger))
project_name_ = "\n".join(map(str, project_name))
shift_ = "\n".join(map(str, shift))
meters_drilled_ = "\n".join(map(str, meters_drilled))
targetmeters_drilled_ = "\n".join(map(str, targetmeters))
driller_ = "\n ".join(map(str, driller))
comment_ = "\n".join(map(str, comment))
clt_d_total_m_ = "\n".join(map(str, clt_day_t_m_))
context = {
"_total": _total,
"_items": _items,
"m_p_obj_day": m_p_obj_day,
"clt_s_": clt_s_,
"clt_d_total_m_": clt_d_total_m_,
"client_": client_,
"drill_date_": drill_date_,
"auger_": auger_,
"vehicle_": vehicle_,
"project_name_": project_name_,
"shift_": shift_,
"meters_drilled_": meters_drilled_,
"targetmeters": targetmeters,
"driller_": driller_,
"comment_": comment_,
}
return render(request, "jourly_report.html", context)
This is sample of a template portion:
<thead>
<th>Client</th>
<th>Drill Date</th>
<th>Auger</th>
<th>Vehicle km</th>
<th>Project Name</th>
<th>Shift</th>
<th>Meters Drilled</th>
<th>Target meters</th>
<th>Driller</th>
<th>Comment</th>
<th>Total for Each Client</th>
</thead>
<tbody>
{% for all_item in all_items %}
<tr>
<td>{{ client_ | linebreaks }}</td>
<td>{{ drill_date_ | linebreaks }}</td>
<td>{{ auger_ | linebreaks }}</td>
<td>{{ vehicle_ | linebreaks }}</td>
<td>{{ project_name_ | linebreaks}}</td>
<td>{{ shift_ | linebreaks }}</td>
<td>{{ meters_drilled_ | linebreaks }}</td>
<td>{{ targetmeters_ | linebreaks }}</td>
<td>{{ driller_ | linebreaks }}</td>
<td>{{ comment_ | linebreaks }}</td>
<td style="font-size: 13px!important; font-weight: bold!important; background-color: #BDBDBD;">{{ client_day_total_m_ | linebreaks }}
</td>
</tr>
{% endfor %}
<thead >
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th>Grand Total Meters Drilled: </th>
<th style="font-size: 14px!important; font-weight: bold!important; background-color: #FA5858;">{{ _total }}</th>
</thead>
as you can see on the image all the drillings are all in the same column or data cell. they are not in differents rows. i want any suggestion to help have access individual items in these array and put them in each of them their rows then create a table for each client where we will put only records of that client int the table (each client has their table)... if i was not clear please let me know.

ng-repeat takes too much time to render data

I know there are many questions already posted for the same issue but none of the solutions work in my case.
On calling a web service I get JSON response. In this JSON, there are around 2000+ objects from which I need to display data on the table. I want to display all (2000+) records in the table and Yes, I cannot limit or paginate, need to display it on a single page (I know it's stupid but it's the business requirement). I don't need sorting or searching.
Data transfer is about 2MB and the request completes in about 2-4 secs approx. but it takes around 10-15 secs to data render on the page.
Now, what I am looking for is either speed ng-repeat binding things up (if possible) or display the data as soon as I receive it and keep on adding it until all rows are displayed.
Check out the code below :
HTML
<table class="table table-bordered table-striped cf">
<thead style="color: #333;">
<tr>
<td>Asset Name</td>
<td>Date/ Time</td>
<td>Location</td>
<td>Ignition</td>
<td>Speed</td>
<td>Heading</td>
<td>Direction</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="cols in tableData">
<td>{{ cols.aN }}</td>
<td>{{ cols.dT }}</td>
<td>{{ cols.Lat }}, {{ cols.Lon }}</td>
<td>{{ cols.I }}</td>
<td>{{ cols.S }}</td>
<td>{{ cols.H }}</td>
<td>{{ cols.D }}</td>
</tr>
</tbody>
</table>
JS
var ignition_text = '';
var lat = '';
var lon = '';
for (var i = 0; i < data.length; i++) {
if (data[i].ignition = 1) {
ignition_text = "On";
} else {
ignition_text = "Off";
}
$scope.$apply(function() {
$scope.tableData.push({
aN: name,
dT: data[i].eventUTCTime,
Lat: data[i].latitudeDegrees,
Lon: data[i].longitudeDegrees,
I: ignition_text,
S: data[i].speedMPH,
H: data[i].longitudeDegrees,
D: data[i].latitudeDegrees
});
});
}
Thanks in advance!
You probably wont need $scope.$apply at all. And even if you need it, you should only use it once you pushed all data to the table. Otherwise, every added entry will force an digest-cycle. Just build your array and assign the finished array to the scope-variable. Then angular will only build the table once.
Depending on the nature of your variable name you may be able to eliminate the array building as well and just use the data you are downloading. Apart from nameyou just use that data anyway.
Here is a plunk that has a similar data size but loads much faster http://plnkr.co/edit/I4rN1ZMaR3e1mbcsJ9Ka. If you were to make a quick plunk I could use your data and edit your code but from the looks you just need the main assignment to the scope without the apply for the data and add a track by to the ng-repeat. SN: You would want to manipulate your data inside the for loop then do the assignment to the scope.
for (var i = 0; i < data.length; i++) {
if (data[i].ignition = 1) {
ignition_text = "On";
} else {
ignition_text = "Off";
}
}
$scope.tableData=data;
JS
$http.get("largeData.json").then(function(response) {
vm.test = response.data;
});
HTML
<tbody>
<tr ng-repeat="(key, value) in main.test track by $index ">
<td>{{ value.ask }}</td>
<td>{{ value.bid }}</td>
<td>{{ value.volume_btc }}, {{ value.volume_percent }}</td>
<td>{{ value.last }}</td>
<td>{{ value.timestamp }}</td>
</tr>
</tbody>

Categories