feat: Compare SidebarStates API done.

This commit is contained in:
chiayin
2024-02-20 17:40:19 +08:00
parent 1eadcdd506
commit a6a007abd2
5 changed files with 167 additions and 127 deletions

View File

@@ -20,7 +20,7 @@
</section>
</aside>
<!-- graph -->
<article class="w-full h-full overflow-x-hidden overflow-y-auto scrollbar scroll-smooth">
<article class="w-full h-full pr-2 mr-2 overflow-x-hidden overflow-y-auto scrollbar scroll-smooth">
<section>
<p class="h2 px-4 border-b border-neutral-900"><span class="material-symbols-outlined mr-2 align-middle">schedule</span>Time Usage</p>
<ul class="list-disc list-inside px-4 pl-7">
@@ -80,21 +80,19 @@
</ul>
</section>
</article>
<!-- Sidebar: State -->
<div class="bg-transparent z-10">
<ul class="flex flex-col justify-center items-center">
<li class="inline-flex items-center justify-center border border-neutral-500 rounded-full w-9 h-9 cursor-pointer bg-neutral-50 drop-shadow hover:border-primary" @click="sidebarState = !sidebarState" :class="{'border-primary': sidebarState}" id="iconState">
<span class="material-symbols-outlined text-2xl text-neutral-500 hover:text-primary p-1.5" :class="[sidebarState ? 'text-primary' : 'text-neutral-500']">
info
</span>
</li>
</ul>
</div>
<SidebarStates v-model:visible="sidebarState"></SidebarStates>
</div>
</div>
<!-- Sidebar: State -->
<div class="bg-transparent py-4 w-14 h-screen-main z-10 bottom-0 right-0 absolute">
<ul class="flex flex-col justify-center items-center">
<li class="inline-flex items-center justify-center border border-neutral-500 rounded-full w-9 h-9 cursor-pointer bg-neutral-50 drop-shadow hover:border-primary" @click="sidebarState = !sidebarState" :class="{'border-primary': sidebarState}" id="iconState">
<span class="material-symbols-outlined text-2xl text-neutral-500 hover:text-primary p-1.5" :class="[sidebarState ? 'text-primary' : 'text-neutral-500']">
info
</span>
</li>
</ul>
</div>
<SidebarStates v-model:visible="sidebarState"></SidebarStates>
</main>
</template>
<script>
@@ -104,7 +102,6 @@ import CompareStore from '@/stores/compare.js';
import SidebarStates from '@/components/Compare/SidebarStates.vue';
import { setLineChartData } from '@/module/setChartData.js';
import { simpleTimeLabel, followTimeLabel, dateLabel } from '@/module/timeLabel.js';
// import { compareDashboardData } from '@/views/Compare/Dashboard/data.js';
export default {
setup() {