diff --git a/frontend/src/components/pure/ms-card/index.vue b/frontend/src/components/pure/ms-card/index.vue
index 6ee8f48545..00081018fe 100644
--- a/frontend/src/components/pure/ms-card/index.vue
+++ b/frontend/src/components/pure/ms-card/index.vue
@@ -1,29 +1,31 @@
 <template>
-  <div class="relative h-full">
-    <div class="card-header">
-      <div class="back-btn" @click="back"><icon-arrow-left /></div>
-      <div class="text-[var(--color-text-000)]">{{ props.title }}</div>
-    </div>
-    <a-divider class="my-[16px]" />
-    <a-scrollbar class="mt-[16px]" style="overflow-y: auto; height: calc(100vh - 256px)">
-      <slot></slot>
-    </a-scrollbar>
-    <div
-      v-if="!hideFooter"
-      class="relative z-10 m-[0_-24px_-24px] flex justify-end gap-[16px] p-[24px] shadow-[0_-1px_4px_rgba(2,2,2,0.1)]"
-    >
-      <div class="ml-0 mr-auto">
-        <slot name="footerLeft"></slot>
+  <a-spin style="display: block" :loading="props.loading">
+    <div class="relative h-full">
+      <div class="card-header">
+        <div class="back-btn" @click="back"><icon-arrow-left /></div>
+        <div class="text-[var(--color-text-000)]">{{ props.title }}</div>
+      </div>
+      <a-divider class="my-[16px]" />
+      <a-scrollbar class="mt-[16px]" style="overflow-y: auto; height: calc(100vh - 256px)">
+        <slot></slot>
+      </a-scrollbar>
+      <div
+        v-if="!hideFooter"
+        class="relative z-10 m-[0_-24px_-24px] flex justify-end gap-[16px] p-[24px] shadow-[0_-1px_4px_rgba(2,2,2,0.1)]"
+      >
+        <div class="ml-0 mr-auto">
+          <slot name="footerLeft"></slot>
+        </div>
+        <slot name="footerRight">
+          <a-button type="secondary" @click="back">{{ t('mscard.defaultCancelText') }}</a-button>
+          <a-button v-if="!props.hideContinue" type="secondary" @click="emit('saveAndContinue')">
+            {{ t('mscard.defaultSaveAndContinueText') }}
+          </a-button>
+          <a-button type="primary" @click="emit('save')">{{ t('mscard.defaultConfirm') }}</a-button>
+        </slot>
       </div>
-      <slot name="footerRight">
-        <a-button type="secondary" @click="back">{{ t('mscard.defaultCancelText') }}</a-button>
-        <a-button v-if="!props.hideContinue" type="secondary" @click="emit('saveAndContinue')">
-          {{ t('mscard.defaultSaveAndContinueText') }}
-        </a-button>
-        <a-button type="primary" @click="emit('save')">{{ t('mscard.defaultConfirm') }}</a-button>
-      </slot>
     </div>
-  </div>
+  </a-spin>
 </template>
 
 <script setup lang="ts">
@@ -36,6 +38,7 @@
       hideContinue?: boolean;
       handleBack?: () => void;
       hideFooter?: boolean;
+      loading?: boolean;
     }>(),
     {
       hideContinue: false,
diff --git a/frontend/src/components/pure/ms-description/index.vue b/frontend/src/components/pure/ms-description/index.vue
index 08c7e03de2..7bceca1fda 100644
--- a/frontend/src/components/pure/ms-description/index.vue
+++ b/frontend/src/components/pure/ms-description/index.vue
@@ -1,9 +1,9 @@
 <template>
-  <a-descriptions :data="props.descriptions" size="large" :column="1">
+  <a-descriptions :data="(props.descriptions as unknown as DescData[])" size="large" :column="1">
     <a-descriptions-item v-for="item of props.descriptions" :key="item.label" :label="item.label">
       <template v-if="item.isTag">
         <a-tag
-          v-for="tag of item.value.split(',')"
+          v-for="tag of item.value"
           :key="tag"
           color="var(--color-text-n8)"
           class="mr-[8px] font-normal !text-[var(--color-text-1)]"
@@ -11,19 +11,32 @@
           {{ tag }}
         </a-tag>
       </template>
-      <div v-else>{{ item.value }}</div>
+      <a-button v-else-if="item.isButton" type="text" @click="handleItemClick(item)">{{ item.value }}</a-button>
+      <div v-else>
+        {{ item.value }}
+      </div>
     </a-descriptions-item>
   </a-descriptions>
 </template>
 
 <script setup lang="ts">
+  import type { DescData } from '@arco-design/web-vue';
+
   export interface Description {
     label: string;
-    value: string;
+    value: (string | number) | (string | number)[];
     isTag?: boolean;
+    isButton?: boolean;
+    onClick?: () => void;
   }
 
   const props = defineProps<{ descriptions: Description[] }>();
+
+  function handleItemClick(item: Description) {
+    if (typeof item.onClick === 'function') {
+      item.onClick();
+    }
+  }
 </script>
 
 <style lang="less" scoped>
diff --git a/frontend/src/components/pure/ms-drawer/index.vue b/frontend/src/components/pure/ms-drawer/index.vue
index bcfd22e786..fa9b7fb030 100644
--- a/frontend/src/components/pure/ms-drawer/index.vue
+++ b/frontend/src/components/pure/ms-drawer/index.vue
@@ -7,6 +7,7 @@
     :class="props.mask ? '' : 'ms-drawer-no-mask'"
     @ok="handleOk"
     @cancel="handleCancel"
+    @close="handleCancel"
   >
     <template #title>
       <slot name="title">
@@ -37,11 +38,13 @@
     titleTagColor?: string;
     descriptions?: Description[];
     footer?: boolean;
+    mask?: boolean;
     [key: string]: any;
   }
 
   const props = withDefaults(defineProps<DrawerProps>(), {
     footer: true,
+    mask: true,
   });
   const emit = defineEmits(['update:visible']);
 
diff --git a/frontend/src/components/pure/navbar/index.vue b/frontend/src/components/pure/navbar/index.vue
index 3061f015e1..7dcc0a7f2a 100644
--- a/frontend/src/components/pure/navbar/index.vue
+++ b/frontend/src/components/pure/navbar/index.vue
@@ -198,8 +198,12 @@
   const projectList: Ref<ProjectListItem[]> = ref([]);
 
   onBeforeMount(async () => {
-    const res = await getProjectList(appStore.getCurrentOrgId);
-    projectList.value = res;
+    try {
+      const res = await getProjectList(appStore.getCurrentOrgId);
+      projectList.value = res;
+    } catch (error) {
+      console.log(error);
+    }
   });
 
   const showProjectSelect = computed(() => {