Discover: fix sidebarTraces style :deep code.

This commit is contained in:
chiayin
2023-03-27 15:42:59 +08:00
parent 6a50ae5f71
commit 7107ca6ee3
3 changed files with 37 additions and 11 deletions

View File

@@ -8,7 +8,7 @@
</span>
</li>
<li class="inline-flex items-center justify-center border border-neutral-500 rounded-full w-9 h-9 cursor-pointer bg-neutral-100 drop-shadow hover:border-primary" @click="sidebarFilter = true" :class="{'border-primary': sidebarFilter}">
<span class="material-symbols-outlined text-2xl text-neutral-500 hover:text-primary p-1.5" :class="[sidebarFilter ? 'text-primary' : 'text-neutral-500']">
<span class="material-symbols-outlined text-2xl hover:text-primary p-1.5" :class="[sidebarFilter ? 'text-primary' : 'text-neutral-500']">
tornado
</span>
</li>
@@ -53,8 +53,28 @@
<Sidebar v-model:visible="sidebarFilter" :closeIcon="'pi pi-chevron-left'" :modal="false" position="left" :dismissable="true" class="!w-11/12">
<template #header>
<ul class="flex space-x-4">
<li class="h1 border-r-2 border-neutral-300 pr-4 cursor-pointer hover:text-neutral-900 hover:duration-700" @click="switchTab('filter')" :class="tab === 'filter'? 'text-neutral-900': ''">Filter</li>
<li class="h1 border-r-2 border-neutral-300 pr-4 cursor-pointer hover:text-neutral-900 hover:duration-700" @click="switchTab('funnel')" :class="tab === 'funnel'? 'text-neutral-900': ''">Funnel</li>
</ul>
</template>
<!-- header: filter -->
<div v-if="tab === 'filter'" class="pt-4 bg-neutral-100">
<!-- filter silect -->
<div>
<div>
<p class="h2">Filter Type</p>
</div>
</div>
</div>
<!-- header: funnel -->
<div v-if="tab === 'funnel'"></div>
</Sidebar>
</template>
@@ -106,16 +126,23 @@ export default {
sidebarState: false, // SideBar: Summary & Insight
sidebarTraces: false, // SideBar: Traces
sidebarFilter: false, // SideBar: Filter
iii:null,
tab: 'filter',
}
},
computed:{
sidebarLeftValue: function() {
let result = this.sidebarView === true || this.sidebarTraces === true;
let result = this.sidebarView === true || this.sidebarTraces === true || this.sidebarFilter === true;
return result;
}
},
methods: {
/**
* @param {string} switch Summary or Insight
*/
switchTab(tab) {
this.tab = tab;
},
/**
* switch map type
* @param {string} type processMap | bpmn