| <!-- |
| - Licensed to the Apache Software Foundation (ASF) under one or more |
| - contributor license agreements. See the NOTICE file distributed with |
| - this work for additional information regarding copyright ownership. |
| - The ASF licenses this file to You under the Apache License, Version 2.0 |
| - (the "License"); you may not use this file except in compliance with |
| - the License. You may obtain a copy of the License at |
| - |
| - http://www.apache.org/licenses/LICENSE-2.0 |
| - |
| - Unless required by applicable law or agreed to in writing, software |
| - distributed under the License is distributed on an "AS IS" BASIS, |
| - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| - See the License for the specific language governing permissions and |
| - limitations under the License. |
| --> |
| <template> |
| <v-container grid-list-xl fluid> |
| <v-layout row wrap> |
| <v-flex lg12> |
| <breadcrumb title="serviceTest" :items="breads"></breadcrumb> |
| </v-flex> |
| <v-layout row wrap> |
| <v-flex lg12> |
| <v-card flat color="transparent"> |
| <v-card-text> |
| <v-form> |
| <v-layout row wrap> |
| <v-combobox |
| id="serviceTestSearch" |
| :loading="searchLoading" |
| :items="typeAhead" |
| :search-input.sync="input" |
| v-model="filter" |
| flat |
| append-icon="" |
| hide-no-data |
| :hint="$t('testModule.searchServiceHint')" |
| :label="$t('placeholders.searchService')" |
| @keyup.enter="submit" |
| ></v-combobox> |
| <v-btn @click="submit" color="primary" large>{{ $t('search') }}</v-btn> |
| </v-layout> |
| </v-form> |
| </v-card-text> |
| </v-card> |
| </v-flex> |
| </v-layout> |
| <v-flex xs12> |
| <h3>{{$t('methods')}}</h3> |
| </v-flex> |
| <v-flex xs12> |
| <v-data-table :headers="headers" :items="methods" hide-actions class="elevation-1"> |
| <template slot="items" slot-scope="props"> |
| <td>{{ props.item.name }}</td> |
| <td><v-chip xs v-for="(type, index) in props.item.parameterTypes" :key="index" label>{{ type }}</v-chip></td> |
| <td><v-chip label>{{ props.item.returnType }}</v-chip></td> |
| <td class="text-xs-right"> |
| <v-tooltip bottom> |
| <v-btn |
| fab dark small color="blue" slot="activator" |
| :href="getHref(props.item.application, props.item.service, props.item.signature)" |
| > |
| <v-icon>edit</v-icon> |
| </v-btn> |
| <span>{{$t('test')}}</span> |
| </v-tooltip> |
| </td> |
| </template> |
| </v-data-table> |
| </v-flex> |
| </v-layout> |
| </v-container> |
| </template> |
| |
| <script> |
| import JsonEditor from '@/components/public/JsonEditor' |
| import Search from '@/components/public/Search' |
| import Breadcrumb from '@/components/public/Breadcrumb' |
| |
| export default { |
| name: 'ServiceTest', |
| components: { |
| JsonEditor, |
| Search, |
| Breadcrumb |
| }, |
| data () { |
| return { |
| typeAhead: [], |
| input: null, |
| searchLoading: false, |
| timerID: null, |
| filter: '', |
| breads: [ |
| { |
| text: 'serviceSearch', |
| href: '/test' |
| } |
| ], |
| headers: [ |
| ], |
| service: null, |
| methods: [], |
| services: [], |
| loading: false |
| } |
| }, |
| methods: { |
| querySelections (v) { |
| if (this.timerID) { |
| clearTimeout(this.timerID) |
| } |
| // Simulated ajax query |
| this.timerID = setTimeout(() => { |
| if (v && v.length >= 4) { |
| this.searchLoading = true |
| this.typeAhead = this.$store.getters.getServiceItems(v) |
| this.searchLoading = false |
| this.timerID = null |
| } else { |
| this.typeAhead = [] |
| } |
| }, 500) |
| }, |
| submit () { |
| this.filter = document.querySelector('#serviceTestSearch').value.trim() |
| if (this.filter) { |
| let filter = this.filter.replace('/', '*') |
| this.search(filter) |
| } else { |
| this.$notify.error('service is needed') |
| return false |
| } |
| }, |
| |
| setHeaders: function () { |
| this.headers = [ |
| { |
| text: this.$t('methodName'), |
| value: 'method', |
| sortable: false |
| }, |
| { |
| text: this.$t('parameterList'), |
| value: 'parameter', |
| sortable: false |
| }, |
| { |
| text: this.$t('returnType'), |
| value: 'returnType', |
| sortable: false |
| }, |
| { |
| text: '', |
| value: 'operation', |
| sortable: false |
| } |
| ] |
| }, |
| search (filter) { |
| if (!filter) { |
| return |
| } |
| this.$axios.get('/service/' + filter).then(response => { |
| this.service = response.data |
| this.methods = [] |
| if (this.service.metadata) { |
| let methods = this.service.metadata.methods |
| for (let i = 0; i < methods.length; i++) { |
| let method = {} |
| let sig = methods[i].name + '~' |
| let parameters = methods[i].parameterTypes |
| let length = parameters.length |
| for (let j = 0; j < length; j++) { |
| sig = sig + parameters[j] |
| if (j !== length - 1) { |
| sig = sig + ';' |
| } |
| } |
| method.signature = sig |
| method.name = methods[i].name |
| method.parameterTypes = methods[i].parameterTypes |
| method.returnType = methods[i].returnType |
| method.service = response.data.service |
| method.application = response.data.application |
| this.methods.push(method) |
| } |
| } |
| }).catch(error => { |
| this.showSnackbar('error', error.response.data.message) |
| }) |
| }, |
| searchServices () { |
| let filter = this.filter || '' |
| if (!filter.startsWith('*')) { |
| filter = '*' + filter |
| } |
| if (!filter.endsWith('*')) { |
| filter += '*' |
| } |
| const pattern = 'service' |
| this.loading = true |
| this.$axios.get('/service', { |
| params: { |
| pattern, filter |
| } |
| }).then(response => { |
| this.services = response.data |
| }).finally(() => { |
| this.loading = false |
| }) |
| }, |
| getHref (application, service, method) { |
| return `/#/testMethod?application=${application}&service=${service}&method=${method}` |
| } |
| }, |
| computed: { |
| area () { |
| return this.$i18n.locale |
| } |
| }, |
| watch: { |
| input (val) { |
| this.querySelections(val) |
| }, |
| area () { |
| this.setHeaders() |
| } |
| }, |
| mounted () { |
| this.$store.dispatch('loadServiceItems') |
| let query = this.$route.query |
| this.filter = query['service'] |
| if ('group' in query) { |
| this.filter = query['group'] + '/' + this.filter |
| } |
| if ('version' in query) { |
| this.filter = this.filter + ':' + query['version'] |
| } |
| if (this.filter) { |
| this.search(this.filter.replace('/', '*')) |
| } |
| } |
| } |
| </script> |
| <style> |
| .v-breadcrumbs { |
| padding-left: 0; |
| } |
| </style> |