My question is very simple
I am trying to call this source in my public folder in img folder:
src="img/vcc3logo.png"
But I can't display it on my pdf print form
When the customer print for a certification form it needed to display the image. The file of the print.blade.php is located in resources/views/customer-relations/dashboard/print.blade.php
Here is the code in my print.blade.php
{{-- <div class="content">
<div class="clearfix"></div>
<div class="box-body"> --}}
<img src="" height="50" width="50" style="float: right">
<img src="img/vcc3logo.png" height="50" width="50" style="float: left">
<div class="container">
<div class="row">
<div class="text-center">
<p class="text-center maliit">
Republic of the Philippines<br>
National Capital Region<br>
<font>City Government of Valenzuela</font><br>
Office of the City Mayor<br>
Valenzuela City Command and Communications Center<br>
2nd Floor, City ALERT Center, Mc-Arthur Hi-way, Malinta, Valenzuela City<br>
</p>
<h3>Application Number:{{ $application_number }}</h3>
</div>
<h5><b>Business Name:</b> {{ $business_name }}</h5>
<h5><b>Owner:</b> {{ $owner }}</h5>
<h5><b>Location:</b> {{ $location }}</h5>
</span>
<table class="table table-hover">
<thead>
<tr>
<th>Fees</th>
<th></th>
<th class="text-center"></th>
<th class="text-center"></th>
</tr>
</thead>
<tbody>
<tr>
<td class="col-md-9"><em>Inspection Fee:</em></h4></td>
<td class="col-md-1" style="text-align: center"></td>
<td class="col-md-1 text-center"></td>
<td class="col-md-1 text-center">{{ $inspection_fee }}</td>
</tr>
<tr>
<td class="col-md-9"><em>Certificate Fee:</em></h4></td>
<td class="col-md-1" style="text-align: center"></td>
<td class="col-md-1 text-center"></td>
<td class="col-md-1 text-center">{{ $cert_fee }}</td>
</tr>
<tr>
<td class="col-md-9"><em>Local Fee:</em></h4></td>
<td class="col-md-1" style="text-align: center"></td>
<td class="col-md-1 text-center"></td>
<td class="col-md-1 text-center">{{ $local_fee }}</td>
</tr>
<tr>
<td class="col-md-9"><em>Others Fee:</em></h4></td>
<td class="col-md-1" style="text-align: center"></td>
<td class="col-md-1 text-center"></td>
<td class="col-md-1 text-center">{{ $others_fee }}</td>
</tr>
</tbody>
</table>
<p><i>Note: Please print and present to Customer Relations Officer</i></p>
</td>
</div>
{{-- </div>
</div>
</div>
--}}
I tried to change it to
src="url('/img/cctv_camera.jpg')"
but ended up with this error:
(1/1) RuntimeException
The exit status code '1' says something went wrong:
stderr: "Loading pages (1/6)
If image file is located inside public folder then you need to add asset() which give full path of image like
<img src="{{asset('/img/vcc3logo.png')}}" height="50" width="50" style="float: left">
I think you can try this hope its help for you :
<img src="{{url('')}}/img/vcc3logo.png" height="50" width="50" style="float: left">
OR
<img src="{{asset('/img/vcc3logo.png')}}" height="50" width="50" style="float: left">
Hope this work for you !!!
Related
I would like to know how to put a list of the last 5 items in the dashboard using backpack?
I made the table
<div class="table-responsive">
<table class="table table-hover m-0 table-actions-bar">
<thead>
<tr>
<th>
<div class="btn-group dropdown">
<button type="button" class="btn btn-light btn-xs dropdown-toggle waves-effect waves-light"
data-toggle="dropdown" aria-expanded="false"><i class="mdi mdi-chevron-down"></i></button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Dropdown link</a>
<a class="dropdown-item" href="#">Dropdown link</a>
</div>
</div>
</th>
<th>Titolo Post</th>
<th>Data</th>
<th>Stato</th>
<th>Categria</th>
<th>Azione</th>
</tr>
</thead>
<tbody>
<tr>
<td>
</td>
<td>
<h5 class="m-0 font-weight-medium"></h5>
</td>
<td>
<i class="mdi mdi-map-marker text-primary"></i>
</td>
<td>
<i class="mdi mdi-clock-outline text-success"></i>
</td>
<td>
<i class="mdi mdi-currency-usd text-warning"></i>
</td>
<td>
<i class="mdi mdi-pencil"></i>
<i class="mdi mdi-close"></i>
</td>
</tr>
</tbody>
</table>
</div>
I made the table inside the jumbotron.blade.php then the function that prints you on screen the last 5 posts I put it here? within the dashboard method?
$recentPost : Article::orderBy('id', 'desc')>limit(5)->get()
any other solution?
This line will get you the last 5 articles.
$articles = Article::orderBy('id', 'desc')->limit(5)->get();
You need to pass it to the view. Ex:
return view('dashboard', ['articles' => $articles]);
And loop the articles on the blade file table. Ex:
<table class="table">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Title</th>
<th scope="col">Author</th>
<th scope="col">Date</th>
</tr>
</thead>
<tbody>
#foreach($articles as $article)
<tr>
<th scope="row">{{ $article->id }}</th>
<td>{{ $article->title }}</td>
<td>{{ $article->author }}</td>
<td>{{ $article->created_at }}</td>
</tr>
#endforeach
</tbody>
</table>
I'm using larashop admin panel.The datatable shows blank spaces below the datatable..The height blank spaces increases with increase in datatable entries.I don't know what to do..
I tried some css.but none of them helped me.
#extends('templates.admin.layout')
#section('title', 'All Courses')
#section('content')
<div class="">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2>Courses <i class="fa fa-plus"></i> Create New </h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<table id="datatable-buttons" class="table table-responsive">
<thead>
<tr>
<th>Course Name</th>
<th>Action</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Course Name</th>
<th>Action</th>
</tr>
</tfoot>
<tbody>
#if(count($courses))
#foreach ($courses as $row)
<tr>
<td>{{$row->name}}</td>
<td>
<i class="fa fa-pencil" title="Edit"></i>
<i class="fa fa-trash-o" title="Delete"></i>
</td>
</tr>
#endforeach
#endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
#stop
The screenshot of the issue is provided..please check...
https://i.stack.imgur.com/avqf5.png
I am creating a friends component that lists users friends based on a response from an endpoint.
I want to render the responses into rows of a table as part of this I would like to use the bootstrap striped-table class
https://getbootstrap.com/docs/4.0/content/tables/#striped-rows
when I do a v-for the table renders correctly but the rows are only showing one background color
This is my template code
<template>
<div>
<h5 class="mb-4">Friends</h5>
<table class="table table-borderless table-striped ">
<tbody>
<div v-for="(friend, index) in UserStore.friends">
<tr>
<td class="text-center" style="width: 100px;">
<img style="width: 100px;" :src="friend.avatar" alt="User Image" class="rounded-circle">
</td>
<td>
{{friend.name}}<br>
<small>29 years old on Friday</small>
</td>
<td class="text-center" style="width: 80px;">
<i class="fa fa-gift"></i>
</td>
</tr>
</div>
</tbody>
</table>
<div v-if="!UserStore.friends">
<h6>You don't have any friends :(</h6>
Lets solve that Right now!
</div>
</div>
</template>
You should use a template element to render these rows. .table-striped works with sibling rows and in your code the rows are not siblings because they each have a div parent, so each row is seen as the first row.
<tbody>
<template v-for="(friend, index) in UserStore.friends">
<tr>
<td class="text-center" style="width: 100px;">
<img style="width: 100px;" :src="friend.avatar" alt="User Image" class="rounded-circle">
</td>
<td>
{{friend.name}}<br>
<small>29 years old on Friday</small>
</td>
<td class="text-center" style="width: 80px;">
<i class="fa fa-gift"></i>
</td>
</tr>
</template>
</tbody>
I'm really new to MVC hope you can give me a detailed instructions on this.
I have a query in my repository that returns pending users who have a certain role_id. Now my issue is this I when the administrator clicks on the anchor tag of id idMessenger below
<li> Messenger<span class="label label-danger pull-right">{{$messenger->count()}}</span> </li>
I want to show the pending messengers only in the
<div class="col-md-2 left-aside">
<div class="scrollable">
<ul class="inbox-nav capitalize-font">
<li>All Pending Applications </li>
<li>Clients<span class="label label-danger pull-right">{{$elderly->count()}}</span></li>
<li> Messenger<span class="label label-danger pull-right">{{$messenger->count()}}</span> </li>
</ul>
</div>
</div>
<!-- /.left-aside-column-->
<div class="col-md-10 right-aside">
<div class="scrollable">
<div class="table-responsive">
<table id="datable_1" class="table display table-hover contact-list" data-page-size="10">
<thead>
<tr>
<th>Appication ID</th>
<th>Name</th>
<th>Email</th>
<th>Senior Citizen Number</th>
<th>Role/Submitted as</th>
<th>Date of Submission</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
#foreach($allPending as $user)
<tr>
<td>{{$user->id}}</td>
<td>{{$user->name}}</td>
<td>{{$user->email}}</td>
<td>{{$user->scn}}</td>
<td><span class="label label-danger">{{$user->roles->name}}</span></td>
<td>{{$user->created_at}}</td>
<td>
<i class="fa fa-check"></i>Approve
</td>
<td>
<i class="fa fa-trash"></i>Delete
</td>
</tr>
#endforeach
</tbody>
</table>
</div>
</div>
</div>
Can you please teach me how to do it in ajax.
I have set both the header and the footer to fixed but still cannot get the content to adjust in IPhone.
Here is my layout code
<body>
<div data-role="page" #(Page.Id == null ? string.Empty : "id=" + Page.Id) data-fullscreen="false">
#* #RenderSection("MoreCode", false)*#
#if (IsSectionDefined("Header"))
{
<div data-role="header" data-position="fixed">
#RenderSection("Header", false)
</div><!-- /header -->
}
<div data-role="content">
#RenderBody()
</div><!-- /content -->
<div data-role="footer" data-tap-toggle="false" data-position="fixed">
<div class="center-wrapper">
<table border="0">
<tr>
<td>
<label for="basic">
Place Of Interest
</label>
</td>
</tr>
<tr>
<td>
<table border="0">
<tr>
<td>
Terms of Use
</td>
<td>
<label for="basic">
|
</label>
</td>
<td>
Privacy Policy
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</body>
Here is my View
<h3 style='color:#4FA600; font-weight:bold;'>#ViewBag.Number</h3>
<table border="1" width="100%">
<tr>
<td align="center" valign=middle style=' font-weight:bold; color:#FFFFFF; background:#4FA600; '>
<label for="basic">Available Documents</label>
</td>
</tr>
<tr>
<td>
<table width="100%" height="100%">
<tr>
<td align="left" valign="middle" style=' font-weight:bold;'>
Type
</td>
<td align="center" valign="middle" style=' font-weight:bold;'>
Description
</td>
</tr>
#{
foreach(var row in Model)
{
<tr>
<td align="left" valign="middle">
#row.DocType
</td>
<td align="center" valign="middle">
#row.Description
</td>
</tr>
}
}
</table>
</td>
</tr>
</table>
Isnt jquerymobile suppose to manually adjust? It renders fine in firefox. What can I do to make the content fully display?
\The issue was I had this in my css:
[data-role=page]{height: 100% !important; position:relative !important;}
I got this code from use theme roller not sure why this messed it up. Maybe someone can clarify would be appreciated