diff --git a/packages/ui/certd-client/src/views/sys/enterprise/project/index.vue b/packages/ui/certd-client/src/views/sys/enterprise/project/index.vue
index f89d92e85..b953b8b71 100644
--- a/packages/ui/certd-client/src/views/sys/enterprise/project/index.vue
+++ b/packages/ui/certd-client/src/views/sys/enterprise/project/index.vue
@@ -12,7 +12,7 @@
         </a-tooltip>
       </template>
     </fs-crud>
-    <AdminModeIntro v-if="!projectStore.isEnterprise"></AdminModeIntro>
+    <AdminModeIntro v-if="!projectStore.isEnterprise" title="当前为SaaS管理模式，项目管理需要切换到企业模式" :open="true"></AdminModeIntro>
   </fs-page>
 </template>
 
diff --git a/packages/ui/certd-client/src/views/sys/enterprise/project/intro.vue b/packages/ui/certd-client/src/views/sys/enterprise/project/intro.vue
index c8bd57d0b..8e8e55f2e 100644
--- a/packages/ui/certd-client/src/views/sys/enterprise/project/intro.vue
+++ b/packages/ui/certd-client/src/views/sys/enterprise/project/intro.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="admin-mode-intro">
-    <div class="mask">
+  <div v-if="open" class="admin-mode-intro" :style="fixed ? 'position: fixed;' : 'position: absolute;'">
+    <div class="mask" @click="close()">
       <div class="intro-content">
-        <h2 class="intro-title text-xl font-bold">当前为SaaS管理模式，项目管理需要切换到企业模式</h2>
+        <h2 class="intro-title text-xl font-bold">{{ title || "管理模式介绍" }}</h2>
         <div class="mt-8 image-block">
           <div class="flex gap-8">
             <div class="intro-desc flex-1">SaaS模式：每个用户管理自己的流水线和授权资源，独立使用。</div>
@@ -22,12 +22,23 @@
 
 <script setup lang="tsx">
 import { ref } from "vue";
-import { useI18n } from "/src/locales";
 import { useRouter } from "vue-router";
 defineOptions({
   name: "AdminModeIntro",
 });
 
+const props = defineProps<{
+  title?: string;
+  open?: boolean;
+  fixed?: boolean;
+}>();
+
+const emit = defineEmits(["update:open"]);
+
+function close() {
+  emit("update:open", false);
+}
+
 const src = ref("static/images/ent/admin_mode.png");
 
 const router = useRouter();
diff --git a/packages/ui/certd-client/src/views/sys/settings/tabs/mode.vue b/packages/ui/certd-client/src/views/sys/settings/tabs/mode.vue
index 5ba3f39b2..1cdb86422 100644
--- a/packages/ui/certd-client/src/views/sys/settings/tabs/mode.vue
+++ b/packages/ui/certd-client/src/views/sys/settings/tabs/mode.vue
@@ -8,12 +8,15 @@
         </div>
         <div class="intro-desc helper">SaaS模式：每个用户管理自己的流水线和授权资源，独立使用。</div>
         <div class="intro-desc helper">企业模式：企业内部员工使用，通过项目合作管理流水线证书和授权资源。</div>
+        <div><a @click="adminModeIntroOpen = true"> 查看示意图</a></div>
       </a-form-item>
 
       <a-form-item label=" " :colon="false" :wrapper-col="{ span: 8 }">
         <a-button :loading="saveLoading" type="primary" html-type="submit">{{ t("certd.saveButton") }}</a-button>
       </a-form-item>
     </a-form>
+
+    <AdminModeIntro v-model:open="adminModeIntroOpen" fixed></AdminModeIntro>
   </div>
 </template>
 
@@ -27,12 +30,15 @@ import { notification } from "ant-design-vue";
 import { useI18n } from "/src/locales";
 import { dict } from "@fast-crud/fast-crud";
 import { useProjectStore } from "/@/store/project";
+import AdminModeIntro from "/@/views/sys/enterprise/project/intro.vue";
 const { t } = useI18n();
 
 defineOptions({
   name: "SettingMode",
 });
 
+const adminModeIntroOpen = ref(false);
+
 const adminModeDict = dict({
   data: [
     {