added print files uploader

This commit is contained in:
franknstayn
2020-03-07 21:35:12 +08:00
parent a958c158e4
commit 8685f93b29
7 changed files with 252 additions and 18 deletions

View File

@@ -1,7 +1,7 @@
<header class="main-header">
<!-- Logo -->
<a href="index2.html" class="logo">
<a href="{{ url('/admin') }}" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>C</b></span>
<!-- logo for regular state and mobile devices -->

View File

@@ -114,7 +114,26 @@ scratch. This page gets rid of all links and provides the needed markup only.
width: 45px;
margin: 2px;
}
#image_preview img {
height: 65px;
width: 100%;
}
/* div#image_preview {
column-count: 4;
}
*/
.print-file-name{
padding: 5px;
text-align: center;
border-top: 1px solid #e2e2e2;
}
.print-file-holder{
border: 1px solid #e2e2e2;
margin-bottom: 10px;
height: 100px;
padding: 5px;
}
</style>
</head>
<!--
@@ -1222,6 +1241,22 @@ desired effect
submitHandler: submitFormEditVisualizer
});
$("#frm_upload_print_files").validate({
rules: {},
messages: {},
errorPlacement: function(error, element) {
var placement = $(element).data('error');
if (placement) {
$(placement).append(error);
}else {
error.insertAfter(element);
}
},
submitHandler: submitFormUploadPrintFiles
});
$(document).on('button click', '#btn_delete_visualizer', function() {
if (!confirm("Are you sure you want to delete this Visualizer?")) {
@@ -1282,7 +1317,25 @@ desired effect
});
$("#uploadPrintFiles").change(function(){
$('#image_preview').html("");
var total_file=document.getElementById("uploadPrintFiles").files.length;
for(var i=0;i<total_file;i++)
{
$('#image_preview').append("<div class='col-sm-3'> " +
"<div class='print-file-holder'> " +
"<img class='svg-print-file-preview' src='"+URL.createObjectURL(event.target.files[i])+"'> " +
"<div class='print-file-name'>"+event.target.files[i]['name']+
"</div> " +
"</div> " +
"</div>");
}
});
}); // end document ready
@@ -1472,7 +1525,36 @@ desired effect
return false;
}
function submitFormUploadPrintFiles(){
$.ajax({
type: "POST",
url: "{{ url('admin/upload-print-file/save') }}",
data: new FormData($('#frm_upload_print_files')[0]),
processData: false,
contentType: false,
dataType: 'json',
beforeSend: function(xhr){
$("#submitSaveBtn").attr('disabled', true);
$("#submitSaveBtn").html('<i class="fa fa-spinner fa-spin"></i> Saving...');
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
success: function (response) {
console.log(response)
if(response.success){
alert(response.message);
location.reload();
}
}
});
return false;
}
function submitFormCreateStore(){
$.ajax({

View File

@@ -59,9 +59,9 @@
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Store Logo</label>
<label class="col-sm-4 control-label">Select Print Files</label>
<div class="col-sm-8">
<input type="file" data-use-id="img_store_logo" class="form-control upload_img" name="store_logo" placeholder="Store Logo" reqiured="required" />
<input type="file" data-use-id="img_store_logo" class="form-control upload_img" name="store_logo" placeholder="SVG Print Files" reqiured="required" />
<small><i style="color: red;">Size: H:300px - W:300px</i></small>
</div>
</div>

View File

@@ -0,0 +1,91 @@
@extends('admin.main')
@section('content')
<style>
.additional-info{
display:none;
}
</style>
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Upload Print Files
<!-- <small>Optional description</small> -->
</h1>
<ol class="breadcrumb">
<li><a href="{{ url ('admin') }}"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="{{ url ('admin') }}"><i class="fa fa-paint-brush"></i> Print File Management</a></li>
<li class="active">Upload Print File</li>
</ol>
</section>
<!-- Main content -->
<section class="content container-fluid">
<div class="row">
<div class="col-md-12">
<div class="box">
<form class="form-horizontal" id="frm_upload_print_files" enctype="multipart/form-data">
<div class="box-header with-border">
<h4 class="box-title">Upload Print File</h4>
</div>
<div class="box-body">
<div id="create_store_msg"></div>
<div class="col-lg-8 col-sm-8">
<div class="form-group">
<label class="col-sm-4 control-label">Select Visualizer</label>
<div class="col-sm-8">
<select class="form-control" name="print_file_for">
@foreach ($vilualizer_array as $item)
<option value="{{ $item->TemplateCode }}">{{ $item->TemplateCode . " -- " . $item->TemplateName }}</option>
@endforeach
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Select Type</label>
<div class="col-sm-8">
<select class="form-control" name="print_file_type">
<option>Jersey</option>
<option>Shorts</option>
<option>Shirts</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Print File(s)</label>
<div class="col-sm-8">
<input type="file" id="uploadPrintFiles" class="form-control" name="uploadPrintFiles[]" multiple required/>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">&nbsp;</label>
<div class="col-sm-8">
<div class="row">
<div id="image_preview"></div>
</div>
</div>
</div>
</div>
</div>
<div class="box-footer">
<div class="col-sm-8">
<div class="form-group">
<label class="col-sm-4 control-label">&nbsp;</label>
<div class="col-sm-8">
<button type="submit" id="submitSaveBtn" class="btn btn-primary" style="width: 100px;">Save</button>
<button type="button" onclick="cancelButton();" class="btn btn-default">Cancel</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- /.content -->
</div>
@endsection