You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

242 lines
13 KiB

@extends('layouts.admin.app')
@section('title',translate('messages.attributes'))
@push('css_or_js')
@endpush
@section('content')
<div class="content container-fluid">
<!-- Page Header -->
<div class="page-header">
<div class="row align-items-center">
<div class="col-sm mb-2 mb-sm-0">
<h1 class="page-header-title">{{translate('messages.attribute')}} {{translate('messages.setup')}}</h1>
</div>
</div>
</div>
<!-- End Page Header -->
<div class="row gx-2 gx-lg-3">
<div class="col-md-12">
<div class="card mb-3">
<div class="card-body">
<form action="{{route('admin.attribute.store')}}" method="post">
@csrf
<div class="row">
<div class="col-12">
<div class="form-group">
<label class="input-label text--black" for="exampleFormControlInput1">{{ translate('Attribute') }} {{translate('messages.name')}}</label>
<input type="text" name="name" class="form-control h--45px" placeholder="{{ translate('Ex: Attribute Name') }}" maxlength="191" required>
</div>
</div>
</div>
<div class="btn--container justify-content-end">
<button type="reset" class="btn btn--reset">{{translate('messages.reset')}}</button>
<button type="submit" class="btn btn--primary">{{translate('messages.submit')}}</button>
</div>
</form>
</div>
</div>
</div>
<div class="col-sm-12 col-lg-12 mb-3 mb-lg-2">
<div class="card">
<div class="card-header py-2 border-0">
<div class="search--button-wrapper">
<h5 class="card-title">{{translate('messages.attribute')}} {{translate('messages.list')}}<span class="badge badge-soft-dark ml-2" id="itemCount">{{$attributes->total()}}</span></h5>
<form action="javascript:" id="search-form" >
<!-- Search -->
@csrf
<div class="input--group input-group input-group-merge input-group-flush">
<input id="datatableSearch_" type="search" name="search" class="form-control"
placeholder="{{ translate('messages.Search_by_name') }}" aria-label="Search" required>
<button type="submit" class="btn btn--secondary">
<i class="tio-search"></i>
</button>
</div>
<!-- End Search -->
</form>
<div class="hs-unfold ml-3">
<a class="js-hs-unfold-invoker btn btn-sm btn-white dropdown-toggle btn export-btn btn-outline-primary btn--primary font--sm" href="javascript:;"
data-hs-unfold-options='{
"target": "#usersExportDropdown",
"type": "css-animation"
}'>
<i class="tio-download-to mr-1"></i> {{translate('messages.export')}}
</a>
<div id="usersExportDropdown"
class="hs-unfold-content dropdown-unfold dropdown-menu dropdown-menu-sm-right">
{{--<span class="dropdown-header">{{translate('messages.options')}}</span>
<a id="export-copy" class="dropdown-item" href="javascript:;">
<img class="avatar avatar-xss avatar-4by3 mr-2"
src="{{asset('public/assets/admin')}}/svg/illustrations/copy.svg"
alt="Image Description">
{{translate('messages.copy')}}
</a>
<a id="export-print" class="dropdown-item" href="javascript:;">
<img class="avatar avatar-xss avatar-4by3 mr-2"
src="{{asset('public/assets/admin')}}/svg/illustrations/print.svg"
alt="Image Description">
{{translate('messages.print')}}
</a>
<div class="dropdown-divider"></div>--}}
<span class="dropdown-header">{{translate('messages.download')}} {{translate('messages.options')}}</span>
<a id="export-excel" class="dropdown-item" href="{{route('admin.attribute.export-attributes', ['type'=>'excel'])}}">
<img class="avatar avatar-xss avatar-4by3 mr-2"
src="{{asset('public/assets/admin')}}/svg/components/excel.svg"
alt="Image Description">
{{translate('messages.excel')}}
</a>
<a id="export-csv" class="dropdown-item" href="{{route('admin.attribute.export-attributes', ['type'=>'excel'])}}">
<img class="avatar avatar-xss avatar-4by3 mr-2"
src="{{asset('public/assets/admin')}}/svg/components/placeholder-csv-format.svg"
alt="Image Description">
.{{translate('messages.csv')}}
</a>
{{--<a id="export-pdf" class="dropdown-item" href="javascript:;">
<img class="avatar avatar-xss avatar-4by3 mr-2"
src="{{asset('public/assets/admin')}}/svg/components/pdf.svg"
alt="Image Description">
{{translate('messages.pdf')}}
</a>--}}
</div>
</div>
</div>
</div>
<!-- Table -->
<div class="table-responsive datatable-custom">
<table id="columnSearchDatatable"
class="table table-borderless table-hover table-thead-bordered table-nowrap table-align-middle card-table text-center"
data-hs-datatables-options='{
"order": [],
"orderCellsTop": true,
"paging":false
}'>
<thead class="thead-light">
<tr>
<th class="w-20p">{{ translate('messages.sl') }}</th>
<th class="w-50p">{{translate('messages.name')}}</th>
<th class="w-20p">{{translate('messages.action')}}</th>
</tr>
</thead>
<tbody id="set-rows">
@foreach($attributes as $key=>$attribute)
<tr>
<td>
<span class="d-inline-block pr-3">
{{$key+$attributes->firstItem()}}
</span>
</td>
<td>
<span class="d-block font-size-sm text-body">
{{Str::limit($attribute['name'],20,'...')}}
</span>
</td>
<td>
<div class="btn--container justify-content-center">
<a class="btn btn-sm btn--primary btn-outline-primary action-btn" href="{{route('admin.attribute.edit',[$attribute['id']])}}" title="{{translate('messages.edit')}}"><i class="tio-edit"></i>
</a>
<a class="btn btn-sm btn--danger btn-outline-danger action-btn" href="javascript:" onclick="form_alert('attribute-{{$attribute['id']}}','{{ translate('Want to delete this attribute ?') }}')" title="{{translate('messages.delete')}}"><i class="tio-delete-outlined"></i>
</a>
<form action="{{route('admin.attribute.delete',[$attribute['id']])}}"
method="post" id="attribute-{{$attribute['id']}}">
@csrf @method('delete')
</form>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
@if(count($attributes) === 0)
<div class="empty--data">
<img src="{{asset('/public/assets/admin/img/empty.png')}}" alt="public">
<h5>
{{translate('no_data_found')}}
</h5>
</div>
@endif
<div class="page-area px-4 pb-3">
<div class="d-flex align-items-center justify-content-end">
{{-- <div>
1-15 of 380
</div> --}}
<div>
{!! $attributes->links() !!}
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Table -->
</div>
</div>
@endsection
@push('script_2')
<script>
$(document).on('ready', function () {
// INITIALIZATION OF DATATABLES
// =======================================================
var datatable = $.HSCore.components.HSDatatables.init($('#columnSearchDatatable'));
$('#column1_search').on('keyup', function () {
datatable
.columns(1)
.search(this.value)
.draw();
});
$('#column3_search').on('change', function () {
datatable
.columns(2)
.search(this.value)
.draw();
});
// INITIALIZATION OF SELECT2
// =======================================================
$('.js-select2-custom').each(function () {
var select2 = $.HSCore.components.HSSelect2.init($(this));
});
});
</script>
<script>
$('#search-form').on('submit', function () {
var formData = new FormData(this);
console.log(formData);
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.post({
url: '{{route('admin.attribute.search')}}',
data: formData,
cache: false,
contentType: false,
processData: false,
beforeSend: function () {
$('#loading').show();
},
success: function (data) {
$('#set-rows').html(data.view);
$('#itemCount').html(data.count);
$('.page-area').hide();
},
complete: function () {
$('#loading').hide();
},
});
});
</script>
@endpush