github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-18 13:25:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

set tag selector

Browse Source
This commit is contained in:
Qiuxia Fan 2022-05-12 10:33:49 +08:00
parent 1551fb6194
commit 310b6289a7
1 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/views/components/ConditionTags.vue
View File

@ -38,23 +38,21 @@ limitations under the License. -->
size="small" size="small"
v-model="tags" v-model="tags"
class="trace-new-tag" class="trace-new-tag"
@change="addLabels"
:placeholder="t('addTags')" :placeholder="t('addTags')"
@click="showClick" @click="showClick"
:autofocus="true"
/> />
<el-dropdown <el-dropdown
ref="dropdown1" ref="dropdownTag"
trigger="contextmenu" trigger="contextmenu"
style="margin: 20px 0 0 -130px" style="margin: 20px 0 0 -130px"
> >
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item <el-dropdown-item v-for="(item, index) in tagArr" :key="index">
v-for="(item, index) in tagArr" <span @click="selectTag(item)" class="tag-item">
:key="index" {{ item }}
@click="selectTag(item)" </span>
>
<span class="tag-item">{{ item }}</span>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
@ -94,12 +92,13 @@ const theme = ref<string>("dark");
const tags = ref<string>(""); const tags = ref<string>("");
const tagsList = ref<string[]>([]); const tagsList = ref<string[]>([]);
const tagArr = ref<string[]>([]); const tagArr = ref<string[]>([]);
const tagKeys = ref<string[]>([]);
const tipsMap = { const tipsMap = {
LOG: "logTagsTip", LOG: "logTagsTip",
TRACE: "traceTagsTip", TRACE: "traceTagsTip",
ALARM: "alarmTagsTip", ALARM: "alarmTagsTip",
}; };
const dropdown1 = ref(); const dropdownTag = ref();
fetchTagKeys(); fetchTagKeys();
function removeTags(index: number) { function removeTags(index: number) {
@ -132,6 +131,7 @@ async function fetchTagKeys() {
return; return;
} }
tagArr.value = resp.data.tagKeys; tagArr.value = resp.data.tagKeys;
tagKeys.value = resp.data.tagKeys;
} }
async function fetchTagValues() { async function fetchTagValues() {
@ -147,18 +147,18 @@ async function fetchTagValues() {
function selectTag(item: string) { function selectTag(item: string) {
if (tags.value.includes("=")) { if (tags.value.includes("=")) {
tags.value = tags.value + item; tags.value += item;
fetchTagValues(); addLabels();
} else { tagArr.value = tagKeys.value;
tags.value = item + "="; return;
} }
tags.value = item + "=";
fetchTagValues();
dropdownTag.value.handleOpen();
} }
function showClick() { function showClick() {
dropdown1.value.handleOpen(); dropdownTag.value.handleOpen();
if (tags.value.includes("=")) {
fetchTagValues();
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>