ElsQuery
Elastic Search Query Builder Of Vuejs which is Like Kibana Query Builder. See also :
Demo
Environment
vue 2.5.13
buefy 0.6.6
Installation
npm i -S els-query
Usage
main.js
;;;;; Vue;Vue; const store = ; Vue;
index.html
template
<els-query @change="(query) => yourMethod(query)" :update-interval="10000"></els-query>
Features
-
Filters
ADD
EDIT
DELETE
DISABLE, ENABLE
-
TimeRange
QUICK
ABSOLUTE
-
QueryString
WILDCARD
-
AutoRefresh
Options
- Props
key | description | type | default |
---|---|---|---|
label |
label of panel |
String |
ElsQuery |
filterFactors |
factors of elastic search |
Array |
[] |
filterFields |
fields of _source |
Array |
[{"duration":"duration"},{"user_id":"user.udid"},{"user_name":"user.name"},{"device_model":"user.device_info.model"},{"device_system":"user.device_info.system_name"},{"device_system_api":"user.device_info.system_api_id"},{"device_system_build":"user.device_info.system_build_number"},{"device_system_version":"user.device_info.system_version"},{"zone_id":"zone.id"},{"zone_name":"zone.name"},{"zone_tags":"zone.tags"},{"event_title":"event.title"},{"event_type":"event.type"},{"event_style":"event.style"},{"latitude":"location.lat"},{"longitude":"location.lon"}] |
updateInterval |
auto refresh interval |
Number |
1000 |
- Events
name | description | arguments |
---|---|---|
change |
query has changed, perhaps caused by filters, queryString, dateTimeStart, dateTimeEnd |
(query) |
Example
"query": "bool": "must": "range": "timestamp": "gte": 1522739455974 "lte": 1522740355974 "format": "epoch_millis" "range": "duration": "gte": "asa" "bool": "should": "match_phrase": "zone.id": "sas" "minimum_should_match": 1 "must_not":
Store
state
// TimeRange modulethis$storestateTimeRangedateTimeStart;this$storestateTimeRangedateTimeEnd; // ElsQuery modulethis$storestateElsQueryquery;
getters
// recommend to deep clone this query so that you won't change the internal query
this.$store.getters['ElsQuery/GET_QUERY'];
mutations
this$store;this$store;
License
MIT