datagrid refactoring completed to 80%
This commit is contained in:
parent
6d3bcca6f8
commit
d68e14f12e
|
|
@ -91,9 +91,23 @@ abstract class AbsGrid
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* To find the alias of the column and by taking the column name.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function findColumnType($columnAlias) {
|
||||
foreach($this->allColumns as $column) {
|
||||
if($column['alias'] == $columnAlias) {
|
||||
return [$column['type'], $column['column']];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public function sortOrFilterCollection($collection, $parseInfo) {
|
||||
foreach($parseInfo as $key => $info) {
|
||||
// dd($key);
|
||||
$columnType = $this->findColumnType($key)[0];
|
||||
$columnName = $this->findColumnType($key)[1];
|
||||
|
||||
if($key == "sort") {
|
||||
//case that don't need any resolving
|
||||
|
|
@ -117,28 +131,26 @@ abstract class AbsGrid
|
|||
throw new \Exception('Multiple Search keys Found, Please Resolve the URL Manually');
|
||||
}
|
||||
} else {
|
||||
$column_name = $this->findColumnAlias($key);
|
||||
|
||||
if (array_keys($value)[0] == "like" || array_keys($value)[0] == "nlike") {
|
||||
foreach ($value as $condition => $filter_value) {
|
||||
if (array_keys($info)[0] == "like" || array_keys($info)[0] == "nlike") {
|
||||
foreach ($info as $condition => $filter_value) {
|
||||
$collection->where(
|
||||
$column_name,
|
||||
$this->operators[$condition],
|
||||
$columnName,
|
||||
config("datagrid.operators.{$condition}"),
|
||||
'%'.$filter_value.'%'
|
||||
);
|
||||
}
|
||||
} else {
|
||||
foreach ($value as $condition => $filter_value) {
|
||||
if($column_type == 'datetime') {
|
||||
foreach ($info as $condition => $filter_value) {
|
||||
if($columnType == 'datetime') {
|
||||
$collection->whereDate(
|
||||
$column_name,
|
||||
$this->operators[$condition],
|
||||
$columnName,
|
||||
config("datagrid.operators.{$condition}"),
|
||||
$filter_value
|
||||
);
|
||||
} else {
|
||||
$collection->where(
|
||||
$column_name,
|
||||
$this->operators[$condition],
|
||||
$columnName,
|
||||
config("datagrid.operators.{$condition}"),
|
||||
$filter_value
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -162,6 +162,7 @@
|
|||
//remove the filter and from clicking on cross icon on tag
|
||||
$('.remove-filter').on('click', function() {
|
||||
var id = $(this).parents('.filter-one').attr('id');
|
||||
|
||||
if(allFilters.length == 1) {
|
||||
allFilters.pop();
|
||||
var uri = window.location.href.toString();
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
<select class="filter-column-select" v-model="filterColumn" v-on:click="getColumnOrAlias(filterColumn)">
|
||||
<option selected disabled>Select Column</option>
|
||||
@foreach($results['columns'] as $column)
|
||||
<option value="{{ $column['column'] }}">
|
||||
<option value="{{ $column['alias'] }}">
|
||||
{{ $column['label'] }}
|
||||
</option>
|
||||
@endforeach
|
||||
|
|
@ -149,8 +149,8 @@
|
|||
template: '#testgrid-filters',
|
||||
|
||||
data: () => ({
|
||||
url: new URL(document.location),
|
||||
sort: null,
|
||||
url: new URL(window.location.href),
|
||||
currentSort: null,
|
||||
sortDesc: 'desc',
|
||||
sortAsc: 'asc',
|
||||
isActive: false,
|
||||
|
|
@ -183,7 +183,7 @@
|
|||
this.columnOrAlias = columnOrAlias;
|
||||
|
||||
for(column in this.columns) {
|
||||
if (this.columns[column].column == this.columnOrAlias) {
|
||||
if (this.columns[column].alias == this.columnOrAlias) {
|
||||
this.type = this.columns[column].type;
|
||||
|
||||
if(this.type == 'string') {
|
||||
|
|
@ -229,74 +229,81 @@
|
|||
getResponse() {
|
||||
if(this.type == 'string') {
|
||||
console.log(this.columnOrAlias, this.stringCondition, this.stringValue);
|
||||
this.formURL(this.columnOrAlias, this.stringCondition, this.stringValue)
|
||||
} else if(this.type == 'number') {
|
||||
console.log(this.columnOrAlias, this.numberCondition, this.numberValue);
|
||||
this.formURL(this.columnOrAlias, this.numberCondition, this.numberValue);
|
||||
} else if(this.type == 'boolean') {
|
||||
console.log(this.columnOrAlias, this.booleanCondition, this.booleanValue);
|
||||
this.formURL(this.columnOrAlias, this.booleanCondition, this.booleanValue);
|
||||
} else if(this.type == 'datetime') {
|
||||
console.log(this.columnOrAlias, this.datetimeCondition, this.datetimeValue);
|
||||
this.formURL(this.columnOrAlias, this.datetimeCondition, this.datetimeValue);
|
||||
}
|
||||
},
|
||||
|
||||
sortCollection(alias) {
|
||||
this.formURL("sort", alias, this.sortDesc, params);
|
||||
this.formURL("sort", alias, this.sortAsc, params);
|
||||
},
|
||||
|
||||
searchCollection(alias) {
|
||||
this.formURL("search", alias, 'search', params);
|
||||
},
|
||||
|
||||
//function triggered to check whether the query exists or not and then call the make filters from the url
|
||||
setParamsAndUrl() {
|
||||
params = (new URL(document.location)).search;
|
||||
params = (new URL(window.location.href)).search;
|
||||
|
||||
if(params.length > 0) {
|
||||
if(this.filters.length == 0) {
|
||||
//call reverse url function
|
||||
this.arrayFromUrl(params.slice(1, params.length));
|
||||
}
|
||||
if(params.slice(1, params.length).length > 0) {
|
||||
this.arrayFromUrl();
|
||||
}
|
||||
|
||||
this.arrayFromUrl();
|
||||
},
|
||||
|
||||
findCurrentSort() {
|
||||
for(i in this.filters) {
|
||||
if(this.filters[i].column == 'sort') {
|
||||
this.currentSort = this.filters[i].val;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
//make array of filters, sort and search
|
||||
formURL(column, condition, response, urlparams) {
|
||||
formURL(column, condition, response) {
|
||||
var obj = {};
|
||||
|
||||
if(column == "" || condition == "" || response == "") {
|
||||
if(column == "" || condition == "" || response == "" || column == null || condition == null || response == null) {
|
||||
alert('{{ __('ui::app.datagrid.filter-fields-missing') }}');
|
||||
|
||||
return false;
|
||||
} else {
|
||||
if(this.filters.length > 0) {
|
||||
|
||||
//case for repeated filter
|
||||
if(column != "sort" && column != "search") {
|
||||
filter_repeated = 0;
|
||||
|
||||
for(j = 0; j < this.filters.length; j++) {
|
||||
if(this.filters[j].column == column && this.filters[j].cond == condition && this.filters[j].val == response) {
|
||||
filter_repeated = 1;
|
||||
if(this.filters[j].column == column) {
|
||||
if(this.filters[j].cond == condition && this.filters[j].val == response) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return false;
|
||||
} else if(this.filters[j].column == column) {
|
||||
filter_repeated = 1;
|
||||
|
||||
this.filters[j].cond = condition;
|
||||
this.filters[j].val = response;
|
||||
|
||||
this.makeURL(true);
|
||||
this.makeURL();
|
||||
}
|
||||
}
|
||||
|
||||
if(filter_repeated == 0) {
|
||||
obj1.column = column;
|
||||
obj1.cond = condition;
|
||||
obj1.val = response;
|
||||
obj.column = column;
|
||||
obj.cond = condition;
|
||||
obj.val = response;
|
||||
|
||||
|
||||
this.filters.push(obj1);
|
||||
obj1 = {};
|
||||
this.filters.push(obj);
|
||||
obj = {};
|
||||
|
||||
this.makeURL();
|
||||
}
|
||||
|
|
@ -304,21 +311,26 @@
|
|||
|
||||
if(column == "sort") {
|
||||
sort_exists = 0;
|
||||
for(j = 0; j<this.filters.length; j++) {
|
||||
if(this.filters[j].column == "sort") {
|
||||
if(this.filters[j].column == column && this.filters[j].cond == condition && this.filters[j].val == response) {
|
||||
|
||||
if(response == "asc") {
|
||||
console.log(column, condition, response);
|
||||
console.log(this.filters);
|
||||
for(j = 0; j < this.filters.length; j++) {
|
||||
if(this.filters[j].column == "sort") {
|
||||
if(this.filters[j].column == column && this.filters[j].cond == condition) {
|
||||
this.findCurrentSort();
|
||||
|
||||
if(this.currentSort == "asc") {
|
||||
this.filters[j].column = column;
|
||||
this.filters[j].cond = condition;
|
||||
this.filters[j].val = "desc";
|
||||
this.filters[j].val = this.sortDesc;
|
||||
|
||||
this.makeURL();
|
||||
|
||||
} else {
|
||||
this.filters[j].column = column;
|
||||
this.filters[j].cond = condition;
|
||||
this.filters[j].val = "asc";
|
||||
this.filters[j].val = this.sortAsc;
|
||||
|
||||
console.log(this.filters[j].val, 2);
|
||||
|
||||
this.makeURL();
|
||||
}
|
||||
|
|
@ -329,8 +341,25 @@
|
|||
|
||||
this.makeURL();
|
||||
}
|
||||
|
||||
sort_exists = 1;
|
||||
}
|
||||
}
|
||||
|
||||
if(sort_exists == 0) {
|
||||
if(this.currentSort == null)
|
||||
this.currentSort = this.sortAsc;
|
||||
|
||||
obj.column = column;
|
||||
obj.cond = condition;
|
||||
obj.val = this.currentSort;
|
||||
|
||||
this.filters.push(obj);
|
||||
|
||||
obj = {};
|
||||
|
||||
this.makeURL();
|
||||
}
|
||||
}
|
||||
|
||||
if(column == "search") {
|
||||
|
|
@ -352,72 +381,58 @@
|
|||
}
|
||||
|
||||
if(search_found == 0) {
|
||||
obj1.column = column;
|
||||
obj1.cond = condition;
|
||||
obj1.val = response;
|
||||
obj.column = column;
|
||||
obj.cond = condition;
|
||||
obj.val = response;
|
||||
|
||||
|
||||
this.filters.push(obj1);
|
||||
this.filters.push(obj);
|
||||
|
||||
obj1 = {};
|
||||
obj = {};
|
||||
|
||||
this.makeURL();
|
||||
}
|
||||
}
|
||||
} else {
|
||||
obj1.column = column;
|
||||
obj1.cond = condition;
|
||||
obj1.val = response;
|
||||
obj.column = column;
|
||||
obj.cond = condition;
|
||||
obj.val = response;
|
||||
|
||||
this.filters.push(obj);
|
||||
|
||||
this.filters.push(obj1);
|
||||
|
||||
obj1 = {};
|
||||
obj = {};
|
||||
|
||||
this.makeURL();
|
||||
}
|
||||
} //pend
|
||||
}
|
||||
},
|
||||
|
||||
// make the url from the array and redirect
|
||||
makeURL(repetition = false) {
|
||||
if(this.filters.length > 0 && repetition == false)
|
||||
{
|
||||
for(i = 0; i < this.filters.length; i++) {
|
||||
if(i == 0) {
|
||||
url = '?' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
} else {
|
||||
url = url + '&' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
}
|
||||
makeURL() {
|
||||
newParams = '';
|
||||
|
||||
for(i = 0; i < this.filters.length; i++) {
|
||||
if(i == 0) {
|
||||
newParams = '?' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
} else {
|
||||
newParams = newParams + '&' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
}
|
||||
|
||||
document.location = url;
|
||||
} else if(this.filters.length > 0 && repetition == true) {
|
||||
//this is the case when the filter is being repeated on a single column with different condition and value
|
||||
for(i=0;i<this.filters.length;i++) {
|
||||
if(i==0) {
|
||||
url = '?' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
} else {
|
||||
url = url + '&' + this.filters[i].column + '[' + this.filters[i].cond + ']' + '=' + this.filters[i].val;
|
||||
}
|
||||
}
|
||||
|
||||
document.location = url;
|
||||
} else {
|
||||
var uri = window.location.href.toString();
|
||||
var clean_uri = uri.substring(0, uri.indexOf("?"));
|
||||
|
||||
document.location = clean_uri;
|
||||
}
|
||||
|
||||
var uri = window.location.href.toString();
|
||||
|
||||
var clean_uri = uri.substring(0, uri.indexOf("?")).trim();
|
||||
|
||||
window.location.href = clean_uri+newParams;
|
||||
},
|
||||
|
||||
//make the filter array from url after being redirected
|
||||
arrayFromUrl() {
|
||||
var allFilters;
|
||||
var obj = {};
|
||||
processedUrl = this.url.search.slice(1, this.url.length);
|
||||
splitted = [];
|
||||
moreSplitted = [];
|
||||
|
||||
splitted = processedUrl.split('&');
|
||||
|
||||
for(i = 0; i < splitted.length; i++) {
|
||||
|
|
@ -435,11 +450,9 @@
|
|||
|
||||
if(col != undefined && cond != undefined && val != undefined)
|
||||
this.filters.push(obj);
|
||||
}
|
||||
|
||||
// console.log(this.filters);
|
||||
return false;
|
||||
// makeTags();
|
||||
obj = {};
|
||||
}
|
||||
}
|
||||
|
||||
// //Use the label to prevent the display of column name on the body
|
||||
|
|
|
|||
Loading…
Reference in New Issue