mirror of
https://github.com/Av0idD4rk/packmate.git
synced 2026-10-23 16:31:01 +00:00
Добавление и выбор паттернов
This commit is contained in:
parent
00f3eff447
commit
bc0156211b
13
src/App.vue
13
src/App.vue
@ -17,6 +17,7 @@
|
||||
<Settings/>
|
||||
<AddService @serviceAddComplete="$refs.navbar.updateServices()"/>
|
||||
<EditService @serviceEditComplete="$refs.navbar.updateServices()"/>
|
||||
<AddPattern/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -25,9 +26,11 @@
|
||||
import Settings from './views/Settings';
|
||||
import AddService from './views/AddService';
|
||||
import EditService from './views/EditService';
|
||||
import AddPattern from './views/AddPattern';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AddPattern,
|
||||
AddService,
|
||||
EditService,
|
||||
Settings,
|
||||
@ -127,6 +130,16 @@
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* Patterns dropdown fix */
|
||||
/*noinspection CssUnusedSymbol*/
|
||||
.dropdown-menu.show {
|
||||
position: fixed !important;
|
||||
/*transform: translate3d(15px, 38px, 0) !important;*/
|
||||
transform: none !important;
|
||||
left: 15px !important;
|
||||
top: 38px !important;
|
||||
}
|
||||
|
||||
[role="main"] {
|
||||
padding-top: 55px; /* Space for fixed navbar */
|
||||
}
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
<template>
|
||||
<nav class="navbar navbar-dark navbar-expand fixed-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<div class="navbar-brand col-sm-3 mr-0" style="cursor: pointer;">
|
||||
Паттерны
|
||||
<i class="fas fa-angle-down" style="margin-left: 0.5em"/>
|
||||
</div>
|
||||
<!-- <div class="navbar-brand col-sm-3 mr-0" style="cursor: pointer;">-->
|
||||
<!-- Паттерны-->
|
||||
<!-- <i class="fas fa-angle-down" style="margin-left: 0.5em"/>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<PatternsDropdown/>
|
||||
|
||||
<div class="navbar-collapse collapse">
|
||||
<ul class="navbar-nav px-3 mr-auto">
|
||||
@ -32,6 +34,7 @@
|
||||
|
||||
<script>
|
||||
import NavbarService from './NavbarService';
|
||||
import PatternsDropdown from './PatternsDropdown';
|
||||
|
||||
export default {
|
||||
name: 'Navbar',
|
||||
@ -65,6 +68,7 @@
|
||||
},
|
||||
},
|
||||
components: {
|
||||
PatternsDropdown,
|
||||
NavbarService,
|
||||
},
|
||||
};
|
||||
@ -84,15 +88,6 @@
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
padding-top: .5rem;
|
||||
padding-bottom: .5rem;
|
||||
|
||||
font-size: 1rem;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
nav {
|
||||
overflow-x: auto;
|
||||
}
|
||||
@ -112,5 +107,4 @@
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #C1C1C1
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
});
|
||||
},
|
||||
base64ToHtml(in_) {
|
||||
return this.escapeHtml(atob(in_)).split('\n').join('<br/>');
|
||||
return this.escapeHtml(atob(in_)).split('\n').join('<br/>'); // Replace all \n to <br/>
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
63
src/components/PatternsDropdown.vue
Normal file
63
src/components/PatternsDropdown.vue
Normal file
@ -0,0 +1,63 @@
|
||||
<template>
|
||||
<b-dropdown no-flip text="Паттерны" block variant="dark" class="col-sm-3 mr-0">
|
||||
<li role="presentation" style="padding-left: 0.5em; padding-right: 0.5em;">
|
||||
<button role="menuitem" type="button" class="btn btn-sm btn-primary btn-block"
|
||||
@click.stop.prevent="showAddService">
|
||||
<i class="fas fa-plus"/>
|
||||
</button>
|
||||
</li>
|
||||
<b-dropdown-divider/>
|
||||
<b-dropdown-item-button v-for="pattern in patterns"
|
||||
:key="pattern.id" @click.stop.prevent="openPattern(pattern.id)">
|
||||
<strong :style="`color: ${pattern.color};`">{{ pattern.name }}</strong>:
|
||||
<code>{{ pattern.regex ? `/${pattern.value}/` : `'${pattern.value}'` }}</code>;
|
||||
search
|
||||
<template v-if="pattern.type === 'BOTH'">anywhere</template>
|
||||
<template v-else-if="pattern.type === 'INPUT'">in request</template>
|
||||
<template v-else>in response</template>
|
||||
</b-dropdown-item-button>
|
||||
</b-dropdown>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'PatternsDropdown',
|
||||
data() {
|
||||
return {
|
||||
patterns: Array(),
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.updatePatterns();
|
||||
},
|
||||
methods: {
|
||||
showAddService() {
|
||||
this.$bvModal.show('addPatternModal');
|
||||
},
|
||||
updatePatterns() {
|
||||
this.$http.get('pattern/')
|
||||
.then(r => this.patterns = r.data)
|
||||
.catch(e => {
|
||||
this.$bvToast.toast(`Не удалось загрузить паттерны: ${e}`, {
|
||||
title: 'Сбой',
|
||||
variant: 'danger',
|
||||
});
|
||||
console.error('Failed to load patterns:', e);
|
||||
});
|
||||
},
|
||||
openPattern(patternId) {
|
||||
console.debug('Opening pattern w/ id', patternId);
|
||||
this.$router.push({
|
||||
name: 'stream',
|
||||
params: this.$route.params,
|
||||
query: {pattern: patternId,},
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
code {
|
||||
font-family: "Ubuntu Mono", "Lucida Console", monospace;
|
||||
font-size: 100%;
|
||||
}
|
||||
</style>
|
||||
108
src/views/AddPattern.vue
Normal file
108
src/views/AddPattern.vue
Normal file
@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<b-modal @ok="addPattern" @cancel="reset" id="addPatternModal"
|
||||
title="Добавить паттерн"
|
||||
cancel-title="Отмена"
|
||||
centered scrollable>
|
||||
<form ref="addPatternForm">
|
||||
<b-form-group
|
||||
label-cols-sm="4"
|
||||
label-cols-lg="3"
|
||||
label="Название"
|
||||
description="Отображается в списке и при успешном поиске"
|
||||
label-for="pattern-name">
|
||||
<b-form-input @keydown.native.enter="addPattern" id="pattern-name" required v-model="newPattern.name"/>
|
||||
</b-form-group>
|
||||
<b-form-group
|
||||
label-cols-sm="4"
|
||||
label-cols-lg="3"
|
||||
label="Паттерн"
|
||||
description="Подстрока или регулярное выражение"
|
||||
label-for="pattern-value">
|
||||
<b-form-input @keydown.native.enter="addPattern" id="pattern-value" required
|
||||
v-model="newPattern.value"/>
|
||||
</b-form-group>
|
||||
<b-form-group
|
||||
label-cols-sm="4"
|
||||
label-cols-lg="3"
|
||||
label="Цвет"
|
||||
description="Как выделять найденный паттерн в пакете и стриме"
|
||||
label-for="pattern-color">
|
||||
<b-form-input id="pattern-color" required type="color" v-model="newPattern.color"/>
|
||||
</b-form-group>
|
||||
<b-form-group
|
||||
label-cols-sm="4"
|
||||
label-cols-lg="3"
|
||||
label="Регулярное выражение?"
|
||||
description="Искать регулярное выражение в Java-формате вместо подстроки?"
|
||||
label-for="pattern-regex">
|
||||
<b-form-checkbox id="pattern-regex" required v-model="newPattern.isRegex"/>
|
||||
</b-form-group>
|
||||
<b-form-group
|
||||
label-cols-sm="4"
|
||||
label-cols-lg="3"
|
||||
label="Тип поиска"
|
||||
description="В каких пакетах искать паттерн"
|
||||
label-for="pattern-type">
|
||||
<b-form-select id="pattern-type" required v-model="newPattern.type">
|
||||
<option value="INPUT">Запрос</option>
|
||||
<option value="OUTPUT">Ответ</option>
|
||||
<option value="BOTH" selected>Везде</option>
|
||||
</b-form-select>
|
||||
</b-form-group>
|
||||
</form>
|
||||
</b-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AddPattern',
|
||||
data() {
|
||||
return {
|
||||
newPattern: {
|
||||
name: String(),
|
||||
value: String(),
|
||||
color: String(),
|
||||
isRegex: Boolean(),
|
||||
type: String(),
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
checkValidity() {
|
||||
return this.$refs.addPatternForm.reportValidity();
|
||||
},
|
||||
|
||||
reset() {
|
||||
this.newPattern = {};
|
||||
},
|
||||
|
||||
addPattern(ev) {
|
||||
ev.preventDefault();
|
||||
if (!this.checkValidity()) {
|
||||
console.debug('Form is invalid');
|
||||
return;
|
||||
}
|
||||
console.debug('Adding pattern...', this.newPattern);
|
||||
|
||||
this.$http.post('pattern/', this.newPattern)
|
||||
.then(response => {
|
||||
const data = response.data;
|
||||
console.debug('Done adding pattern', data);
|
||||
this.$emit('patternAddComplete');
|
||||
this.reset();
|
||||
this.$bvModal.hide('addPatternModal');
|
||||
}).catch(e => {
|
||||
this.$bvToast.toast(`Не удалось добавить паттерн: ${e}`, {
|
||||
title: 'Сбой',
|
||||
variant: 'danger',
|
||||
});
|
||||
console.error('Failed to add pattern', e);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user