From b29ea1bba577ade60e965cc3c37d96ae6f30117a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=BCneyt=20=C5=9Eent=C3=BCrk?= <cneytsenturk@gmail.com>
Date: Tue, 1 Jun 2021 14:43:27 +0300
Subject: [PATCH] Search and filter set default filter..

---
 app/View/Components/SearchString.php          |   5 +-
 .../assets/js/components/AkauntingSearch.vue  | 236 +++++++++++-------
 .../views/components/search-string.blade.php  |   1 +
 3 files changed, 151 insertions(+), 91 deletions(-)

diff --git a/app/View/Components/SearchString.php b/app/View/Components/SearchString.php
index 1746285b2..44354bac0 100644
--- a/app/View/Components/SearchString.php
+++ b/app/View/Components/SearchString.php
@@ -12,6 +12,8 @@ class SearchString extends Component
 
     public $filters;
 
+    public $filtered;
+
     /** string */
     public $model;
 
@@ -20,10 +22,11 @@ class SearchString extends Component
      *
      * @return void
      */
-    public function __construct(string $model = '', $filters = false)
+    public function __construct(string $model = '', $filters = false, $filtered = false)
     {
         $this->model = $model;
         $this->filters = $filters;
+        $this->filtered = $filtered;
     }
 
     /**
diff --git a/resources/assets/js/components/AkauntingSearch.vue b/resources/assets/js/components/AkauntingSearch.vue
index 53646901a..7948273db 100644
--- a/resources/assets/js/components/AkauntingSearch.vue
+++ b/resources/assets/js/components/AkauntingSearch.vue
@@ -142,6 +142,11 @@ export default {
             default: () => [],
             description: 'List of filters'
         },
+        defaultFiltered: {
+            type: Array,
+            default: () => [],
+            description: 'List of filters'
+        },
 
         dateConfig: null,
     },
@@ -195,7 +200,7 @@ export default {
                 });
             }
 
-            console.log('Focus :' + this.filter_last_step);
+            //console.log('Focus :' + this.filter_last_step);
         },
 
         onInputDateSelected(selectedDates, dateStr, instance) {
@@ -537,7 +542,7 @@ export default {
             this.onInputConfirm();
         },
 
-        convertOption (options) {
+        convertOption(options) {
             let values = [];
 
             // Option set sort_option data
@@ -656,6 +661,57 @@ export default {
                     this.filter_index++;
                 }
             }, this);
+        }else if (this.defaultFiltered) {
+            this.defaultFiltered.forEach(function (filter) {
+                let option = '';
+                let operator = '=';
+                let value = '';
+
+                this.filter_list.forEach(function (_filter, i) {
+                    let filter_values = this.convertOption(_filter.values);
+
+                    if (_filter.key == filter.option) {
+                        console.log('Filter YES');
+
+                        option = _filter.value;
+                        operator = filter.operator;
+
+                        filter_values.forEach(function (_value) {
+                            if (_value.key == filter.value) {
+                                value = _value.value;
+                            }
+                        }, this);
+
+                        this.selected_options.push(this.filter_list[i]);
+
+                        console.log(operator);
+
+                        this.selected_operator.push({
+                            key: operator,
+                        });
+
+                        this.filter_list.splice(i, 1);
+
+                        this.option_values[_filter.key] = filter_values;
+
+                        filter_values.forEach(function (value, j) {
+                            if (value.key == filter.value) {
+                                this.selected_values.push(value);
+
+                                this.option_values[_filter.key].splice(j, 1);
+                            }
+                        }, this);
+                    }
+                }, this);
+
+                this.filtered.push({
+                    option: option,
+                    operator: operator,
+                    value: value
+                });
+
+                this.filter_index++;
+            }, this);
         }
     },
 
@@ -719,109 +775,109 @@ export default {
 </script>
 
 <style>
-.searh-field {
-    border: 1px solid #dee2e6;
-    border-radius: 0.25rem;
-}
+    .searh-field {
+        border: 1px solid #dee2e6;
+        border-radius: 0.25rem;
+    }
 
-.searh-field .tags-group {
-  display: contents;
-}
+    .searh-field .tags-group {
+        display: contents;
+    }
 
-.searh-field .el-tag.el-tag--primary {
-  background: #f6f9fc;
-  background-color: #f6f9fc;
-  border-color: #f6f9fc;
-  color: #8898aa;
-  margin-top: 7px;
-}
+    .searh-field .el-tag.el-tag--primary {
+        background: #f6f9fc;
+        background-color: #f6f9fc;
+        border-color: #f6f9fc;
+        color: #8898aa;
+        margin-top: 7px;
+    }
 
-.searh-field .tags-group:hover > span {
-  background:#cbd4de;
-  background-color: #cbd4de;
-  border-color: #cbd4de;
-}
+    .searh-field .tags-group:hover > span {
+        background:#cbd4de;
+        background-color: #cbd4de;
+        border-color: #cbd4de;
+    }
 
-.searh-field .el-tag.el-tag--primary .el-tag__close.el-icon-close {
-  color: #8898aa;
-}
+    .searh-field .el-tag.el-tag--primary .el-tag__close.el-icon-close {
+        color: #8898aa;
+    }
 
-.searh-field .el-tag-option {
-  border-radius: 0.25rem 0 0 0.25rem;
-  margin-left: 10px;
-}
+    .searh-field .el-tag-option {
+        border-radius: 0.25rem 0 0 0.25rem;
+        margin-left: 10px;
+    }
 
-.searh-field .el-tag-operator {
-  border-radius: 0;
-  margin-left: -1px;
-  margin-right: -1px;
-}
+    .searh-field .el-tag-operator {
+        border-radius: 0;
+        margin-left: -1px;
+        margin-right: -1px;
+    }
 
-.searh-field .el-tag-value {
-  border-radius: 0 0.25rem 0.25rem 0;
-  margin-right: 10px;
-}
+    .searh-field .el-tag-value {
+        border-radius: 0 0.25rem 0.25rem 0;
+        margin-right: 10px;
+    }
 
-.searh-field .el-select.input-new-tag {
-    width: 100%;
-}
+    .searh-field .el-select.input-new-tag {
+        width: 100%;
+    }
 
-.searh-field .input-full {
-  width: 100%;
-}
+    .searh-field .input-full {
+        width: 100%;
+    }
 
-.searh-field .btn.btn-link {
-  width: inherit;
-  text-align: left;
-  display: flex;
-  margin: 0;
-  text-overflow: inherit;
-  text-align: left;
-  text-overflow: ellipsis;
-  padding: unset;
-  color: #212529;
-}
+    .searh-field .btn.btn-link {
+        width: inherit;
+        text-align: left;
+        display: flex;
+        margin: 0;
+        text-overflow: inherit;
+        text-align: left;
+        text-overflow: ellipsis;
+        padding: unset;
+        color: #212529;
+    }
 
-.searh-field .btn.btn-link.clear {
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: 45px;
-  height: 45px;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  color: #adb5bd;
-  opacity: 1;
-}
+    .searh-field .btn.btn-link.clear {
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 45px;
+        height: 45px;
+        -webkit-box-pack: center;
+        -ms-flex-pack: center;
+        justify-content: center;
+        -webkit-box-align: center;
+        -ms-flex-align: center;
+        align-items: center;
+        color: #adb5bd;
+        opacity: 1;
+    }
 
-.searh-field .btn.btn-link.clear:hover {
-  color: #8898aa;
-}
+    .searh-field .btn.btn-link.clear:hover {
+        color: #8898aa;
+    }
 
-.searh-field .btn-helptext {
-  margin-left: auto;
-  color: var(--gray);
-}
+    .searh-field .btn-helptext {
+        margin-left: auto;
+        color: var(--gray);
+    }
 
-.searh-field .btn:not(:disabled):not(.disabled):active:focus,
-.searh-field .btn:not(:disabled):not(.disabled).active:focus {
-  -webkit-box-shadow: none !important;
-    box-shadow: none !important;
-}
+    .searh-field .btn:not(:disabled):not(.disabled):active:focus,
+    .searh-field .btn:not(:disabled):not(.disabled).active:focus {
+    -webkit-box-shadow: none !important;
+        box-shadow: none !important;
+    }
 
-.searh-field .form-control.datepicker.flatpickr-input {
-  padding: inherit !important;
-}
+    .searh-field .form-control.datepicker.flatpickr-input {
+        padding: inherit !important;
+    }
 
-.searh-field .dropdown-menu.operator {
-    min-width: 50px !important;
-}
+    .searh-field .dropdown-menu.operator {
+        min-width: 50px !important;
+    }
 
-.searh-field .dropdown-menu.operator .btn i:not(:last-child), .btn svg:not(:last-child) {
-    margin-right: inherit !important;
-}
+    .searh-field .dropdown-menu.operator .btn i:not(:last-child), .btn svg:not(:last-child) {
+        margin-right: inherit !important;
+    }
 </style>
diff --git a/resources/views/components/search-string.blade.php b/resources/views/components/search-string.blade.php
index 23101ab01..8d045ee2b 100644
--- a/resources/views/components/search-string.blade.php
+++ b/resources/views/components/search-string.blade.php
@@ -7,6 +7,7 @@
     no-matching-data-text="{{ trans('general.no_matching_data') }}"
     value="{{ request()->get('search', null) }}"
     :filters="{{ json_encode($filters) }}"
+    :default-filtered="{{ json_encode($filtered) }}"
     :date-config="{
         allowInput: true,
         altInput: true,