@tripup-company/element-ui-extended 0.0.66 → 0.0.69

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tripup-company/element-ui-extended",
-  "version": "0.0.66",
+  "version": "0.0.69",
   "main": "./dist/element-ui-extended.umd.js",
   "scripts": {
     "serve": "vue-cli-service serve && tsc --emitDeclarationOnly",

package/src/components/GenericFilters/FilterRow.vue

@@ -51,6 +51,7 @@
           :remote="remote"
           :remote-method="remoteMethodHandler"
           :loading="loading"
+          :value-key="objectValueKey"
           clearable
           @change="updateSearch"
         >
@@ -58,7 +59,7 @@
             v-for="item in selectListLocal"
             :key="item[selectKey]"
             :label="item[selectLabel]"
-            :value="item[selectValue]"
+            :value="selectJson ? item : item[selectValue]"
           />
         </el-select>
       </el-col>
@@ -66,7 +67,7 @@
   </el-row>
 </template>
 <script>
-import { upperFirst } from 'lodash'
+import { upperFirst } from "lodash";
 import Vue from "vue";
 export default {
   props: {
@@ -84,7 +85,7 @@ export default {
     },
     name: {
       type: String,
-      default: '',
+      default: "",
     },
   },
   data() {
@@ -93,6 +94,16 @@ export default {
       { value: true, name: "true" },
       { value: false, name: "false" },
     ];
+    let selectValues = [];
+    if (this.column.selectList && this.column.selectList.length) {
+      selectValues = this.column.selectList;
+    } else if (this.search.selectList && this.search.selectList.length) {
+      selectValues = this.search.selectList;
+    } else if (this.column.type === "enum") {
+      selectValues = this.column.values;
+    } else {
+      selectValues = boolValues;
+    }
     return {
       searchLocal: this.search,
       loading: false,
@@ -100,13 +111,10 @@ export default {
       selectLabel: this.column.selectLabel ?? "name",
       selectValue: this.column.selectValue ?? "value",
       filterable: this.column.filterable ?? false,
+      objectValueKey: this.column.objectValueKey ?? "value",
+      selectJson: this.column.selectJson ?? false,
       remote: this.column.remote ?? false,
       remoteMethod: this.column.remoteMethod ?? null,
-      selectListLocal: this.column.selectList
-        ? this.column.selectList
-        : this.column.type === "enum"
-        ? this.column.values
-        : boolValues,
       showFilter: this.search.operator !== "",
       stringOperators: [
         { value: "equal", label: "is equal" },
@@ -124,6 +132,8 @@ export default {
       enumOperatorsInObject: [{ value: "in_object", label: "in_object" }],
       dateOperators: [{ value: "between", label: "between" }],
       boolOperators: [{ value: "equal", label: "is" }],
+      selectListLocal: selectValues,
+
     };
   },
   computed: {
@@ -135,7 +145,12 @@ export default {
           break;
         case ("enum", "select"):
           if (this.column.operator) {
-            operators = [{ value: this.column.operator, label: upperFirst(this.column.operator.replace('_', ' ')) }];
+            operators = [
+              {
+                value: this.column.operator,
+                label: upperFirst(this.column.operator.replace("_", " ")),
+              },
+            ];
           } else if (this.column.selectMultiple) {
             operators = this.enumOperatorsMultiple;
           } else {
@@ -168,12 +183,15 @@ export default {
       if (this.showFilter === false) {
         this.searchLocal.operator = "";
         this.searchLocal.value = "";
-      } else if (this.searchLocal.operator === "" && this.operators.length === 1) {
+      } else if (
+        this.searchLocal.operator === "" &&
+        this.operators.length === 1
+      ) {
         this.searchLocal.operator = this.operators[0].value;
       }
     },
-    search (newValue ) {
-      console.log('seach updated');
+    search(newValue) {
+      console.log("seach updated");
       if (newValue !== this.search) {
         this.searchLocal = Object.assign({}, this.search);
       }
@@ -183,13 +201,16 @@ export default {
     searchLocal: {
       deep: true,
       handler() {
-        console.log('searchLocal updated');
-        this.$emit("update:search", { name: this.name, value: this.searchLocal});
+        console.log("searchLocal updated");
+        this.$emit("update:search", {
+          name: this.name,
+          value: this.searchLocal,
+        });
         console.log(this.searchLocal);
-        if (this.searchLocal.operator == '') {
+        if (this.searchLocal.operator == "") {
           this.showFilter = false;
         }
-      }
+      },
     },
   },
   methods: {