From 2cc94c4adcf0b4ea3a59292acd5a70ecf12540fd Mon Sep 17 00:00:00 2001
From: Brandon Fergerson <bfergerson@apache.org>
Date: Fri, 29 Apr 2022 18:53:05 +0200
Subject: [PATCH] sidebar only in dashboard

---
 src/layout/components/SideBar.vue | 190 +++++++++++++++---------------
 1 file changed, 97 insertions(+), 93 deletions(-)

diff --git a/src/layout/components/SideBar.vue b/src/layout/components/SideBar.vue
index 78763cee..1c1df9f6 100644
--- a/src/layout/components/SideBar.vue
+++ b/src/layout/components/SideBar.vue
@@ -12,104 +12,108 @@ 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>-->
-<!--  <div class="side-bar">-->
-<!--    <div :class="isCollapse ? 'logo-icon-collapse' : 'logo-icon'">-->
-<!--      <Icon-->
-<!--        :size="isCollapse ? 'xl' : 'logo'"-->
-<!--        :iconName="isCollapse ? 'logo' : 'logo-sw'"-->
-<!--      />-->
-<!--    </div>-->
-<!--    <el-menu-->
-<!--      active-text-color="#448dfe"-->
-<!--      background-color="#252a2f"-->
-<!--      class="el-menu-vertical"-->
-<!--      :default-active="name"-->
-<!--      text-color="#efefef"-->
-<!--      :unique-opened="true"-->
-<!--      :collapse="isCollapse"-->
-<!--      :style="{ border: 'none' }"-->
-<!--    >-->
-<!--      <template v-for="(menu, index) in routes" :key="index">-->
-<!--        <el-sub-menu :index="String(menu.name)" v-if="menu.meta.hasGroup">-->
-<!--          <template #title>-->
-<!--            <router-link-->
-<!--              class="items"-->
-<!--              :to="menu.path"-->
-<!--              :exact="menu.meta.exact || false"-->
-<!--            >-->
-<!--              <el-icon class="menu-icons" :style="{ marginRight: '12px' }">-->
-<!--                <Icon size="lg" :iconName="menu.meta.icon" />-->
-<!--              </el-icon>-->
-<!--              <span :class="isCollapse ? 'collapse' : ''">-->
-<!--                {{ t(menu.meta.title) }}-->
-<!--              </span>-->
-<!--            </router-link>-->
-<!--          </template>-->
-<!--          <el-menu-item-group>-->
-<!--            <el-menu-item-->
-<!--              v-for="(m, idx) in filterMenus(menu.children)"-->
-<!--              :index="m.name"-->
-<!--              :key="idx"-->
-<!--            >-->
-<!--              <router-link-->
-<!--                class="items"-->
-<!--                :to="m.path"-->
-<!--                :exact="m.meta.exact || false"-->
-<!--              >-->
-<!--                <span>{{ t(m.meta.title) }}</span>-->
-<!--              </router-link>-->
-<!--            </el-menu-item>-->
-<!--          </el-menu-item-group>-->
-<!--        </el-sub-menu>-->
-<!--        <el-menu-item-->
-<!--          :index="String(menu.name)"-->
-<!--          @click="changePage(menu)"-->
-<!--          v-else-->
-<!--        >-->
-<!--          <el-icon class="menu-icons" :style="{ marginRight: '12px' }">-->
-<!--            <router-link-->
-<!--              class="items"-->
-<!--              :to="menu.children[0].path"-->
-<!--              :exact="menu.meta.exact"-->
-<!--            >-->
-<!--              <Icon size="lg" :iconName="menu.meta.icon" />-->
-<!--            </router-link>-->
-<!--          </el-icon>-->
-<!--          <template #title>-->
-<!--            <router-link-->
-<!--              class="items"-->
-<!--              :to="menu.children[0].path"-->
-<!--              :exact="menu.meta.exact"-->
-<!--            >-->
-<!--              <span>{{ t(menu.meta.title) }}</span>-->
-<!--            </router-link>-->
-<!--          </template>-->
-<!--        </el-menu-item>-->
-<!--      </template>-->
-<!--    </el-menu>-->
-<!--    <div-->
-<!--      class="menu-control"-->
-<!--      :class="isCollapse ? 'collapse' : ''"-->
-<!--      :style="{-->
-<!--        color: theme === 'light' ? '#eee' : '#252a2f',-->
-<!--      }"-->
-<!--    >-->
-<!--      <Icon-->
-<!--        size="middle"-->
-<!--        iconName="format_indent_decrease"-->
-<!--        @click="controlMenu"-->
-<!--      />-->
-<!--    </div>-->
-<!--  </div>-->
-<!--</template>-->
+<template>
+  <div class="side-bar" v-if="isFullview === false">
+    <div :class="isCollapse ? 'logo-icon-collapse' : 'logo-icon'">
+      <Icon
+        :size="isCollapse ? 'xl' : 'logo'"
+        :iconName="isCollapse ? 'logo' : 'logo-sw'"
+      />
+    </div>
+    <el-menu
+      active-text-color="#448dfe"
+      background-color="#252a2f"
+      class="el-menu-vertical"
+      :default-active="name"
+      text-color="#efefef"
+      :unique-opened="true"
+      :collapse="isCollapse"
+      :style="{ border: 'none' }"
+    >
+      <template v-for="(menu, index) in routes" :key="index">
+        <el-sub-menu :index="String(menu.name)" v-if="menu.meta.hasGroup">
+          <template #title>
+            <router-link
+              class="items"
+              :to="menu.path"
+              :exact="menu.meta.exact || false"
+            >
+              <el-icon class="menu-icons" :style="{ marginRight: '12px' }">
+                <Icon size="lg" :iconName="menu.meta.icon" />
+              </el-icon>
+              <span :class="isCollapse ? 'collapse' : ''">
+                {{ t(menu.meta.title) }}
+              </span>
+            </router-link>
+          </template>
+          <el-menu-item-group>
+            <el-menu-item
+              v-for="(m, idx) in filterMenus(menu.children)"
+              :index="m.name"
+              :key="idx"
+            >
+              <router-link
+                class="items"
+                :to="m.path"
+                :exact="m.meta.exact || false"
+              >
+                <span>{{ t(m.meta.title) }}</span>
+              </router-link>
+            </el-menu-item>
+          </el-menu-item-group>
+        </el-sub-menu>
+        <el-menu-item
+          :index="String(menu.name)"
+          @click="changePage(menu)"
+          v-else
+        >
+          <el-icon class="menu-icons" :style="{ marginRight: '12px' }">
+            <router-link
+              class="items"
+              :to="menu.children[0].path"
+              :exact="menu.meta.exact"
+            >
+              <Icon size="lg" :iconName="menu.meta.icon" />
+            </router-link>
+          </el-icon>
+          <template #title>
+            <router-link
+              class="items"
+              :to="menu.children[0].path"
+              :exact="menu.meta.exact"
+            >
+              <span>{{ t(menu.meta.title) }}</span>
+            </router-link>
+          </template>
+        </el-menu-item>
+      </template>
+    </el-menu>
+    <div
+      class="menu-control"
+      :class="isCollapse ? 'collapse' : ''"
+      :style="{
+        color: theme === 'light' ? '#eee' : '#252a2f',
+      }"
+    >
+      <Icon
+        size="middle"
+        iconName="format_indent_decrease"
+        @click="controlMenu"
+      />
+    </div>
+  </div>
+</template>
 
 <script lang="ts" setup>
-import { ref } from "vue";
-import { useRouter, RouteRecordRaw } from "vue-router";
+import { computed, ref } from "vue";
+import { useRouter, RouteRecordRaw, useRoute } from "vue-router";
 import { useI18n } from "vue-i18n";
 import Icon from "@/components/Icon.vue";
 
+const { path } = useRoute();
+const isFullview = computed(() => {
+  return path.includes("fullview");
+});
 const { t } = useI18n();
 const name = ref<any>(String(useRouter().currentRoute.value.name));
 const theme = ["VirtualMachine", "Kubernetes"].includes(name.value || "")