|
Server : Apache/2.4.41 (Ubuntu) System : Linux vmi1525618.contaboserver.net 5.4.0-105-generic #119-Ubuntu SMP Mon Mar 7 18:49:24 UTC 2022 x86_64 User : www-data ( 33) PHP Version : 8.2.12 Disable Function : NONE Directory : /var/www/leadai/leadai.co.in/storage/framework/views/ |
Upload File : |
<?php $__env->startSection('content'); ?>
<style>
.male {
background: #8c85ff;
text-transform: capitalize;
color: white;
}
.female {
background: #e16498;
text-transform: capitalize;
color: white;
}
.id-card-box{
max-width:240px;
border:1px solid #ddd;
}
.id-card p{
padding:0;
margin:0;
font-size:12px;
}
.school-title{
font-size:14px;
font-weight:bold;
}
.s-name{
font-size:16px;
font-weight:bold;
}
.school-name{
text-align:center;
background:blue;
color:white;
width:100%;
display:flex;
justify-content:center;
align-items:center;
border-radius: 0px 0px 0px 100px;
}
.id-card-box .footer{
background:blue;
text-align:center;
color:white;
}
.id-card-box .footer p{
padding:0;
margin:0;
}
/* vertical smooth card design */
.vs-idcard{
width: 220px;
border: 2px solid #ddd;
border-radius: 10px;
}
.vs-school-title{
font-size: 15px;
font-weight: bold;
}
.vs-idcard-info p{
padding: 0;
margin: 0;
padding-left: 5px;
font-size: 12px;
}
.vs-student-address, .vs-school-address{
padding: 0;
margin: 0;
font-size: 11px;
}
.vs-idcard-footer p{
padding: 0;
margin: 0;
font-size: 12px;
}
.hr{
border: 1px solid #ddd;
margin: 5px 0;
}
/* horizontal idcard */
.horizontal-idcard {
width: 360px;
border: 1px solid #ccc;
border-radius: 5px;
font-family: Arial, sans-serif;
}
.h-school-header{
padding: 5px 5px;
}
.h-school-header h5{
font-size: 22px;
font-weight: bold;
padding: 0 10px;
margin: 0;
}
.h-student-photo{
width: 80px;
}
.h-student-info p{
font-size: 13px;
padding: 0;
margin: 0;
}
.h-footer p{
font-size: 12px;
}
.h-issue-date p{
font-size: 12px;
}
</style>
<!-- begin::main content -->
<main class="main-content">
<div class="container">
<!-- begin::page header -->
<div class="page-header">
<h3>Add Id Card Template</h3>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a
href="<?php echo e(asset('superadmin/dashboard')); ?>"><?php echo e(__('message.dashboard')); ?></a></li>
<li class="breadcrumb-item active" aria-current="page">Id Card Template</li>
</ol>
</nav>
</div>
<!-- end::page header -->
<?php if (isset($component)) { $__componentOriginal8a5ba9c90b64d384232e9948b1023e746ba08e74 = $component; } ?>
<?php $component = $__env->getContainer()->make(App\View\Components\FlashMessage::class, []); ?>
<?php $component->withName('flashMessage'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal8a5ba9c90b64d384232e9948b1023e746ba08e74)): ?>
<?php $component = $__componentOriginal8a5ba9c90b64d384232e9948b1023e746ba08e74; ?>
<?php unset($__componentOriginal8a5ba9c90b64d384232e9948b1023e746ba08e74); ?>
<?php endif; ?>
</div>
<div class="container">
<div class="alert alert-success d-none alert-message"></div>
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<h4>Create Template</h4>
<form class="card-design-form" enctype="multipart/form-data">
<?php echo csrf_field(); ?>
<input type="hidden" name="school_id" value="<?php echo e($school_id); ?>" >
<input type="hidden" name="admin_id" value="<?php echo e($admin_id); ?>" >
<div class="form-group">
<label>Background Image</label>
<input type="file" accept="image/*" name="bg_image" class="form-control bg_image">
</div>
<div class="form-group">
<label>Background Color</label>
<input type="color" name="bg_color" class="form-control bg_color">
</div>
<div class="form-group">
<label>Text Color</label>
<input type="color" name="text_color" class="form-control text_color">
</div>
<div class="form-group">
<label>Header & Footer Color</label>
<input type="color" name="header_color" class="form-control header_color">
</div>
<div class="form-group">
<label>Header & Footer Text Color</label>
<input type="color" name="header_text_color" class="form-control header_text_color">
</div>
<div class="form-group">
<label>Align Content</label>
<select class="form-control alignment" name="alignment">
<option value="left">LEFT</option>
<option value="right">RIGHT</option>
<option value="center">CENTER</option>
</select>
</div>
<div class="form-group">
<label>Template Type</label>
<select class="form-control template_type" name="template_type">
<option value="V">Vertical</option>
<option value="H">Horizontal</option>
<option value="VS">Vertical Smooth</option>
</select>
</div>
<div class="form-group">
<button class="btn btn-primary" type="submit">Submit</button>
</div>
</form>
</div>
<div class="col-md-6">
<div class="vertical-idcard">
<div class="id-card-box">
<div class="d-flex">
<div class="d-flex justify-content-start px-2">
<img src="https://png.pngtree.com/png-vector/20230415/ourmid/pngtree-school-logo-design-template-vector-png-image_6705854.png" width="50" alt="logo">
</div>
<div class="school-name d-flex justify-content-center">
<h4 class="school-title">Sai Valley World School</h4>
</div>
</div>
<div class="id-card px-3 py-2">
<div class="id-card-section">
<div class="image-box">
<img src="https://i.pinimg.com/originals/a6/82/f0/a682f04aaa23b09cf5c3ce162fd7fc79.jpg" alt="student" class="p-0 m-0" width="80" />
</div>
<div class="text-section">
<p class="s-name">Ajay Kumar</p>
<p class="f-name"><strong>Father Name :</strong> Jai Singh</p>
<p><strong>Phone :</strong> 9985999999</p>
<p><strong>Class :</strong> 11th B</p>
<p><strong>Address :</strong> C-2/114 Sector 12, Noida UP 245874</p>
</div>
</div>
</div>
<div class="footer py-1">
<p>Address : Sector 12, Noida UP<p>
<p>Phone : 9855685542</p>
</div>
</div>
</div>
<div class="vertical-smooth-idcard d-none">
<div class="vs-idcard p-2">
<div class="id-header-smooth">
<div class="d-flex justify-content-center">
<img src="https://png.pngtree.com/png-vector/20230415/ourmid/pngtree-school-logo-design-template-vector-png-image_6705854.png" alt="Logo" width="50">
</div>
<div class="text-center">
<h4 class="vs-school-title">Sai Velly World School</h4>
</div>
</div>
<div class="hr"></div>
<div class="vs-section-box d-flex">
<div class="vs-student-photo-box">
<img src="https://pbs.twimg.com/media/EeUI99bUcAMiRFa.jpg:large" alt="photo" width="60">
</div>
<div class="vs-idcard-info">
<p ><strong>Name:</strong> John Doe</p>
<p><strong>Father:</strong> Shri Virendra Singh</p>
<p><strong>Phone:</strong> 9898989898</p>
<p><strong>Class:</strong> ABC123</p>
</div>
</div>
<div class="pt-1">
<p class="vs-student-address"><strong>Address:</strong> C-24/117 Sector 12, Noida 245874</p>
</div>
<div class="vs-idcard-footer text-center" >
<p><strong>Issued on:</strong> 01/03/2024</p>
<p><strong>Phone:</strong> 989859898</p>
</div>
<div class="hr"></div>
<div class="vs-idcard-footer text-center">
<p class="vs-school-address p-0 m-0">Railway road, Glaxy plazza C-60 rohini, New Delhi 124551</p>
</div>
</div>
</div>
<div class="horizontal-idcard d-none">
<div class="">
<div class="d-flex h-school-header align-items-center px-2">
<img src="https://png.pngtree.com/png-vector/20230415/ourmid/pngtree-school-logo-design-template-vector-png-image_6705854.png" alt="School Logo" width="50" height="50">
<div>
<h5>Sai Vally World School</h5>
</div>
</div>
<div class="h-idcard">
<div class="card-body d-flex py-1">
<div>
<img src="https://pbs.twimg.com/media/EeUI99bUcAMiRFa.jpg:large" alt="Student Photo" class="h-student-photo border">
</div>
<div class="h-student-info pl-3">
<p><strong>Name:</strong> John Doe</p>
<p><strong>Father:</strong> John Doe</p>
<p><strong>Class:</strong> 10</p>
<p><strong>Phone:</strong> 9856235415</p>
<p><strong>Address:</strong> 12345</p>
</div>
</div>
<div class="h-issue-date pb-1 d-flex justify-content-between px-2">
<p class="p-0 m-0"><strong>Issued Date:</strong> 01-03-2023</p>
<p class="p-0 m-0"><strong>Principal</strong></p>
</div>
<div class="border"></div>
</div>
<div class="h-footer p-1 text-center">
<p class="h-school-address p-0 m-0">Mill road, C-14/170 Harsh Vihar, Meerut 2458745</p>
<p class="h-school-phone p-0 m-0"><strong>Phone:</strong>9869856985</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<!-- end::main content -->
<?php $__env->stopSection(); ?>
<?php $__env->startPush('footer-script'); ?>
<script src="<?php echo e(asset('public/admin/vendors/dataTable/jquery.dataTables.min.js')); ?>"></script>
<script src="<?php echo e(asset('public/admin/vendors/dataTable/dataTables.bootstrap4.min.js')); ?>"></script>
<script src="<?php echo e(asset('public/admin/vendors/dataTable/dataTables.responsive.min.js')); ?>"></script>
<script src="https://cdn.jsdelivr.net/npm/@editorjs/editorjs@latest"></script>
<script>
$(".get-preview-btn").click(function(){
let code = $(".html-code").val();
$(".id-card-preview").html(code);
});
$(".bg_color").on("change",function(){
let color = $(this).val();
$(".id-card").css({'background':color});
});
$(".text_color").on("change",function(){
let color = $(this).val();
$(".id-card").css({'color':color});
});
$(".header_color").on("change",function(){
let color = $(this).val();
$(".school-name").css({'background':color});
$(".footer").css({'background':color});
});
$(".header_text_color").on("change",function(){
let color = $(this).val();
$(".school-title").css({'color':color});
$(".footer").css({'color':color});
});
//horizontal idcard code start
$(".bg_color").on("change",function(){
let color = $(this).val();
$(".h-idcard").css({'background':color});
});
$(".text_color").on("change",function(){
let color = $(this).val();
$(".h-idcard").css({'color':color});
});
$(".header_color").on("change",function(){
let color = $(this).val();
$(".h-school-header").css({'background':color});
$(".h-footer").css({'background':color});
});
$(".header_text_color").on("change",function(){
let color = $(this).val();
$(".h-school-header").css({'color':color});
$(".h-footer").css({'color':color});
});
//horizontal idcard code end
$(".alignment").on("change",function(){
let alignment = $(this).val();
if(alignment=="left")
{
$(".id-card").css({'display':'flex','justify-content':'left'});
$(".id-card p").css({'text-align':'left'});
$(".image-box").css({'display':'flex','justify-content':'left'});
}
else if(alignment=="right")
{
$(".id-card").css({'display':'flex','justify-content':'end'});
$(".id-card p").css({'text-align':'right'});
$(".image-box").css({'display':'flex','justify-content':'end'});
}
else if(alignment=="center")
{
$(".id-card").css({'display':'flex','justify-content':'center'});
$(".id-card p").css({'text-align':'center'});
$(".image-box").css({'display':'flex','justify-content':'center'});
}
else if(alignment=="column")
{
$(".id-card-section").css({'display':'flex','flex-direction':'row'});
$(".text-section").css({'width':'60%','text-align':'left'});
$(".image-box").css({'width':'40%','display':'flex','justify-content':'left'});
}
else
{
window.alert("Please select alignment");
}
});
$(".card-design-form").submit(function(e){
e.preventDefault();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
type:"POST",
url:"<?php echo e(asset('submit-card-design')); ?>",
data: new FormData(this),
contentType:false,
processData:false,
cache:false,
success:function(response)
{
if(response.message == "success")
{
$(".alert-message").removeClass("d-none");
$(".alert-message").html("Template Add Successfully !");
setTimeout(() => {
$(".alert-message").addClass("d-none");
$(".alert-message").html("");
}, 3000);
}
else
{
$(".alert-message").removeClass("d-none");
$(".alert-message").removeClass("alert-success");
$(".alert-message").addClass("alert-error");
$(".alert-message").html("Failed ! To Add Template");
setTimeout(() => {
$(".alert-message").addClass("d-none");
$(".alert-message").html("");
}, 3000);
}
}
});
});
$(".template_type").on("change",function(){
var type = $(this).val();
if(type =="H")
{
$(".horizontal-idcard").removeClass("d-none");
$(".vertical-idcard").addClass("d-none");
$(".vertical-smooth-idcard").addClass("d-none");
}
else if(type == "V")
{
$(".vertical-idcard").removeClass("d-none");
$(".horizontal-idcard").addClass("d-none");
$(".vertical-smooth-idcard").addClass("d-none");
}
else
{
$(".vertical-smooth-idcard").removeClass("d-none");
$(".horizontal-idcard").addClass("d-none");
$(".vertical-idcard").addClass("d-none");
$(".bg_color").on("change",function(){
let color = $(this).val();
$(".vs-idcard").css({'background':color});
});
$(".text_color").on("change",function(){
let color = $(this).val();
$(".vs-idcard").css({'color':color});
});
}
});
$(".bg_image").on("change",function(){
var file = this.files[0];
var url = URL.createObjectURL(file);
console.log($(".template_type").val());
if($(".template_type").val() == "VS")
{
$('.vs-idcard').css({'background-image':'url('+url+')'});
}
else if($(".template_type").val() == "V")
{
$('.id-card').css({'background-image':'url('+url+')'});
}
else
{
$('.h-idcard').css({'background-image':'url('+url+')'});
}
});
</script>
<!-- end::dataTable -->
<?php $__env->stopPush(); ?>
<?php echo $__env->make('layout', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH F:\xampp\htdocs\school_saas_erp\resources\views/template/idcard-template.blade.php ENDPATH**/ ?>