added clipart category

This commit is contained in:
franknstayn
2019-12-04 16:41:41 +08:00
parent c539b41371
commit 85a729f85d
8 changed files with 560 additions and 102 deletions

View File

@@ -41,7 +41,9 @@ scratch. This page gets rid of all links and provides the needed markup only.
<link href="{{ asset('/bower_components/select2/dist/css/select2.min.css') }}" rel="stylesheet" />
<!-- Theme style -->
<link rel="stylesheet" href="{{ asset('/bower_components/admin-lte/dist/css/AdminLTE.min.css') }}">
<!-- jquery-ui -->
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<style>
/* .store-password-field {
@@ -152,6 +154,50 @@ desired effect
immediately after the control sidebar -->
<div class="control-sidebar-bg"></div>
</div>
<div class="modal fade" id="modal_add_category" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<form id="frm_add_category">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Adding Category</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div id="modal_add_category_msg"></div>
<div class="form-group">
Category Name *
<div class="row">
<div class="col-sm-12">
<input type="text" name="category" class="form-control" placeholder="Enter category name">
</div>
</div>
</div>
<div class="form-group">
Category Status *
<div class="row">
<div class="col-sm-12">
<select name="is_active" class="form-control">
<option value="1">Active</option>
<option value="0">Inactive</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary btn-custom-save">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
<!-- ./wrapper -->
<!-- REQUIRED JS SCRIPTS -->
@@ -184,6 +230,8 @@ desired effect
<script src="http://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.15/fabric.min.js"></script>
<!-- select2 -->
<script src="{{ asset('/bower_components/select2/dist/js/select2.min.js') }}"></script>
<!-- jquery-ui -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(document).ready(function() {
@@ -198,7 +246,16 @@ desired effect
}catch(e){
}
var tblbody_clipart_cat = $('#tblbody_clipart_cat');
tblbody_clipart_cat.sortable({
revert: 100,
placeholder: 'placeholder'
});
tblbody_clipart_cat.disableSelection();
$('#svg_clipart').on('change', function(event) {
var tmppath = URL.createObjectURL(event.target.files[0]);
// $("img").fadeIn("fast").attr('src', URL.createObjectURL(event.target.files[0]));
@@ -276,8 +333,6 @@ desired effect
$('#store_owners_table').DataTable();
$('#list').click(function(event){
event.preventDefault();
$('#products .item').addClass('list-group-item');
@@ -520,8 +575,7 @@ desired effect
},
submitHandler: submitAddCategoryForm
});
$(document).on('hidden.bs.modal', '.modal-close-reload', function(){
location.reload();
});
@@ -702,13 +756,137 @@ desired effect
});
}
$(document).on('button click', '.btn-delete-clipart-cat', function() {
var getId = $(this).data('id');
$.ajax({
type : 'POST',
url : "{{ url('admin/clipart/delete-clipart-category') }}",
data : {
id : getId
},
beforeSend: function(xhr){
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
success : function(response){
if(response.success){
alert(response.message)
location.reload();
}
}
});
});
$(document).on('button click', '.btn-edit-clipart-cat', function() {
var getId = $(this).data('id');
var getCategory = $(this).data('category');
var getStatus = $(this).data('status');
$('#modal_edit_category').modal('show');
$('#edit_category').val(getCategory);
$('#edit_is_active').val(getStatus);
$('#cat_id').val(getId);
});
$("#frm_edit_category").validate({
rules: {
category: {
required: true
},
is_active: {
required: true
}
},
messages: {},
errorPlacement: function(error, element) {
var placement = $(element).data('error');
if (placement) {
$(placement).append(error);
}else {
error.insertAfter(element);
}
},
submitHandler: submitEditCategoryForm
});
$('#btn_save_clipart_cat_sorting').on('click', function(e) {
e.preventDefault();
var sorted_data = tblbody_clipart_cat.sortable('serialize');
// console.log(sorted_data);
$.ajax({
data: sorted_data,
type: 'POST',
url : "{{ url('admin/clipart/save-clipart-cat-ordering') }}",
beforeSend:function(xhr){
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
xhr.setRequestHeader( 'X-Requested-With', 'XMLHttpRequest');
},
success:function(result) {
if(result.success){
alert(result.message);
}
}
});
});
}); // end document ready
function submitEditCategoryForm(){
var data = $("#frm_edit_category").serializeArray();
$.ajax({
type : 'POST',
url : "{{ url('admin/clipart/update-clipart-category') }}",
data : data,
beforeSend: function(xhr){
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
success : function(response){
if(response.success){
$('#modal_edit_category_msg').html('<div class="alert alert-success alert-dismissible"> ' +
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> ' +
'<h4><i class="icon fa fa-check"></i> Success!</h4> ' +
'<p>'+response.message+'</p> ' +
'</div>').fadeIn().delay(2000).fadeOut(function (){
$('#modal_edit_category').modal('hide');
location.reload();
});
var form = $('#frm_edit_category')
form.validate().resetForm();
form[0].reset();
}else{
$('#modal_edit_category_msg').html('<div class="alert alert-danger alert-dismissible"> ' +
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> ' +
'<h4><i class="icon fa fa-ban"></i> Error!</h4> ' +
'<p>'+response.message+'</p> ' +
'</div>').fadeIn().delay(2000).fadeOut();
}
}
});
}
function submitAddCategoryForm(){
var data = $("#frm_add_category").serialize();
var data = $("#frm_add_category").serializeArray();
$.ajax({
type : 'POST',
@@ -722,18 +900,23 @@ desired effect
},
success : function(response){
if(response.success){
$('#modal_add_category').addClass(response.addClass);
var getURL = "{{ Request::is('admin/clipart-categories') }}";
$('#modal_add_category_msg').html('<div class="alert alert-success alert-dismissible"> ' +
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> ' +
'<h4><i class="icon fa fa-check"></i> Success!</h4> ' +
'<p>'+response.message+'</p> ' +
'</div>').fadeIn().delay(5000).fadeOut();
'</div>').fadeIn().delay(2000).fadeOut(function (){
$('#modal_add_category').modal('hide');
if(getURL){
location.reload();
}else{
$("#sel_clipart_category").append('<option value="'+response.last_inserted_id+'">'+data[0]['value']+'</option>');
}
});
var form = $('#frm_add_category')
form.validate().resetForm();
form[0].reset();
}else{
$('#modal_add_category_msg').html('<div class="alert alert-danger alert-dismissible"> ' +
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> ' +