From 40074fb16275f4eba6d444f60cf2773ff6478e0e Mon Sep 17 00:00:00 2001
From: xue jiahao <hsuehchiahao@gmail.com>
Date: Mon, 18 Nov 2024 23:25:45 +0800
Subject: [PATCH] [UI] prevent change domain in /chartflow and loading

---
 frontend/src/components/DomainSelector.vue | 21 +++++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/DomainSelector.vue b/frontend/src/components/DomainSelector.vue
index c5747a6..2fb7c60 100644
--- a/frontend/src/components/DomainSelector.vue
+++ b/frontend/src/components/DomainSelector.vue
@@ -1,12 +1,15 @@
 <template>
     <q-btn-dropdown
-      color="primay"
+      class="customized-disabled-btn"
       push
       flat
       no-caps
       icon="share"
       size="md"
       :label="userStore.currentDomain.domainName"
+      :disable-dropdown="isUnclickable"
+      :dropdown-icon="isUnclickable ? 'none' : ''"
+      :disable="isUnclickable"
     >
       <q-list>
         <q-item v-for="domain in domains" :key="domain.domainName"
@@ -26,18 +29,32 @@
 <script setup lang="ts" >
 import { IDomainInfo } from 'src/types/ActionTypes';
 import { useAuthStore,IUserState } from 'stores/useAuthStore';
-import { ref } from 'vue';
+import { ref, computed } from 'vue';
+import { useRoute } from 'vue-router';
 const userStore = useAuthStore();
+const route = useRoute()
 const domains = ref<IDomainInfo[]>([]);
 (async ()=>{
   domains.value = await userStore.getUserDomains();
 })();
 
+const isUnclickable = computed(()=>{
+  return route.path.startsWith('/FlowChart/') || domains.value === undefined || domains.value.length === 0;
+});
+
+
 const onItemClick=(domain:IDomainInfo)=>{
   console.log(domain);
   userStore.setCurrentDomain(domain);
 }
 </script>
 <style lang="scss">
+.q-btn.disabled.customized-disabled-btn {
+  opacity: 1 !important;
+  cursor: default !important;
+}
 
+.q-btn.disabled.customized-disabled-btn * {
+  cursor: default !important;
+}
 </style>