diff --git a/web/components.d.ts b/web/components.d.ts
index 13eb4c58..dcb8b214 100644
--- a/web/components.d.ts
+++ b/web/components.d.ts
@@ -46,6 +46,7 @@ declare module 'vue' {
     IEpCheck: typeof import('~icons/ep/check')['default']
     IEpCirclePlus: typeof import('~icons/ep/circle-plus')['default']
     IEpClose: typeof import('~icons/ep/close')['default']
+    IEpConnection: typeof import('~icons/ep/connection')['default']
     IEpCopyDocument: typeof import('~icons/ep/copy-document')['default']
     IEpDelete: typeof import('~icons/ep/delete')['default']
     IEpIphone: typeof import('~icons/ep/iphone')['default']
diff --git a/web/src/management/pages/list/components/MemberList.vue b/web/src/management/components/CooperModify/MemberList.vue
similarity index 100%
rename from web/src/management/pages/list/components/MemberList.vue
rename to web/src/management/components/CooperModify/MemberList.vue
diff --git a/web/src/management/pages/list/components/MemberSelect.vue b/web/src/management/components/CooperModify/MemberSelect.vue
similarity index 100%
rename from web/src/management/pages/list/components/MemberSelect.vue
rename to web/src/management/components/CooperModify/MemberSelect.vue
diff --git a/web/src/management/pages/list/components/CooperModify.vue b/web/src/management/components/CooperModify/ModifyDialog.vue
similarity index 99%
rename from web/src/management/pages/list/components/CooperModify.vue
rename to web/src/management/components/CooperModify/ModifyDialog.vue
index 6893d20b..1433d867 100644
--- a/web/src/management/pages/list/components/CooperModify.vue
+++ b/web/src/management/components/CooperModify/ModifyDialog.vue
@@ -43,10 +43,13 @@
 import { computed, ref, shallowRef, onMounted, watch } from 'vue'
 import { ElMessage } from 'element-plus'
 import 'element-plus/theme-chalk/src/message.scss'
-import MemberSelect from './MemberSelect.vue'
+
 import { getPermissionList, getCollaborator, saveCollaborator } from '@/management/api/space'
 import { type IMember, SurveyPermissions } from '@/management/utils/types/workSpace'
 import { CODE_MAP } from '@/management/api/base'
+
+import MemberSelect from './MemberSelect.vue'
+
 const emit = defineEmits(['on-close-codify', 'onFocus', 'change', 'blur'])
 const props = withDefaults(
   defineProps<{
diff --git a/web/src/management/pages/list/components/OperationSelect.vue b/web/src/management/components/CooperModify/OperationSelect.vue
similarity index 100%
rename from web/src/management/pages/list/components/OperationSelect.vue
rename to web/src/management/components/CooperModify/OperationSelect.vue
diff --git a/web/src/management/pages/edit/components/CooperationPanel.vue b/web/src/management/pages/edit/components/CooperationPanel.vue
deleted file mode 100644
index 13a8ddb9..00000000
--- a/web/src/management/pages/edit/components/CooperationPanel.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<template>
-  <slot name="content" :onCooper="onCooper"></slot>
-  <CooperModify :modifyId="cooperId" :visible="cooperModify" @on-close-codify="onCooperClose" />
-</template>
-<script setup lang="ts">
-import { ref } from 'vue'
-import 'element-plus/theme-chalk/src/message.scss'
-import CooperModify from '@/management/pages/list/components/CooperModify.vue';
-import { useRoute } from 'vue-router';
-
-defineSlots<{
-  content: (scope: { onCooper: () => void }) => any
-}>();
-
-const route = useRoute()
-const surveyId = route.params?.id as string;
-const cooperModify = ref<boolean>(false);
-const cooperId = ref<string>('');
-
-const onCooper = (): void => {
-  cooperId.value = surveyId;
-  cooperModify.value = true;
-};
-
-const onCooperClose = (): void => {
-  cooperModify.value = false;
-};
-
-</script>
-<style lang="scss" scoped>
-
-</style>
diff --git a/web/src/management/pages/edit/components/ModuleNavbar.vue b/web/src/management/pages/edit/components/ModuleNavbar.vue
index 59f8b303..9949b348 100644
--- a/web/src/management/pages/edit/components/ModuleNavbar.vue
+++ b/web/src/management/pages/edit/components/ModuleNavbar.vue
@@ -8,14 +8,7 @@
       <NavPanel></NavPanel>
     </div>
     <div class="right-group">
-      <CooperationPanel>
-        <template #content="{ onCooper }">
-          <div class="btn" @click="onCooper">
-            <i-ep-connection class="view-icon" :size="20" />
-            <span class="btn-txt">协作</span>
-          </div>
-        </template>
-      </CooperationPanel>
+      <CooperationPanel></CooperationPanel>
       <PreviewPanel></PreviewPanel>
       <HistoryPanel></HistoryPanel>
       <SavePanel></SavePanel>
@@ -35,18 +28,12 @@ import HistoryPanel from '../modules/contentModule/HistoryPanel.vue'
 import PreviewPanel from '../modules/contentModule/PreviewPanel.vue'
 import SavePanel from '../modules/contentModule/SavePanel.vue'
 import PublishPanel from '../modules/contentModule/PublishPanel.vue'
-import CooperationPanel from './CooperationPanel.vue';
+import CooperationPanel from '../modules/contentModule/CooperationPanel.vue'
 
 const store = useStore()
 const title = computed(() => _get(store.state, 'edit.schema.metaData.title'))
 </script>
 <style lang="scss" scoped>
-@import url('@/management/styles/edit-btn.scss');
-.view-icon {
-  font-size: 20px;
-  height: 29px;
-  line-height: 29px;
-}
 .nav {
   width: 100%;
   height: 56px;
diff --git a/web/src/management/pages/edit/modules/contentModule/CooperationPanel.vue b/web/src/management/pages/edit/modules/contentModule/CooperationPanel.vue
new file mode 100644
index 00000000..59508644
--- /dev/null
+++ b/web/src/management/pages/edit/modules/contentModule/CooperationPanel.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="btn" @click="onCooper">
+    <i-ep-connection class="view-icon" :size="20" />
+    <span class="btn-txt">协作</span>
+  </div>
+  <CooperModify :modifyId="cooperId" :visible="cooperModify" @on-close-codify="onCooperClose" />
+</template>
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useRoute } from 'vue-router'
+import 'element-plus/theme-chalk/src/message.scss'
+
+import CooperModify from '@/management/components/CooperModify/ModifyDialog.vue'
+
+defineSlots<{
+  content: (scope: { onCooper: () => void }) => any
+}>()
+
+const route = useRoute()
+const surveyId = route.params?.id as string
+const cooperModify = ref<boolean>(false)
+const cooperId = ref<string>('')
+
+const onCooper = (): void => {
+  cooperId.value = surveyId
+  cooperModify.value = true
+}
+
+const onCooperClose = (): void => {
+  cooperModify.value = false
+}
+</script>
+<style lang="scss" scoped>
+@import url('@/management/styles/edit-btn.scss');
+</style>
diff --git a/web/src/management/pages/edit/modules/contentModule/PreviewPanel.vue b/web/src/management/pages/edit/modules/contentModule/PreviewPanel.vue
index 7c51c200..18fcf08e 100644
--- a/web/src/management/pages/edit/modules/contentModule/PreviewPanel.vue
+++ b/web/src/management/pages/edit/modules/contentModule/PreviewPanel.vue
@@ -87,12 +87,6 @@ const closedDialog = () => {
     margin-left: 75px;
   }
 
-  .view-icon {
-    font-size: 20px;
-    height: 29px;
-    line-height: 29px;
-  }
-
   .preview-tab {
     display: flex;
     align-items: center;
diff --git a/web/src/management/pages/list/components/BaseList.vue b/web/src/management/pages/list/components/BaseList.vue
index fa1ff189..59ad68aa 100644
--- a/web/src/management/pages/list/components/BaseList.vue
+++ b/web/src/management/pages/list/components/BaseList.vue
@@ -120,6 +120,7 @@ import 'moment/locale/zh-cn'
 moment.locale('zh-cn')
 
 import EmptyIndex from '@/management/components/EmptyIndex.vue'
+import CooperModify from '@/management/components/CooperModify/ModifyDialog.vue'
 import { CODE_MAP } from '@/management/api/base'
 import { QOP_MAP } from '@/management/utils/constant.ts'
 import { deleteSurvey } from '@/management/api/survey'
@@ -130,7 +131,6 @@ import ToolBar from './ToolBar.vue'
 import TextSearch from './TextSearch.vue'
 import TextSelect from './TextSelect.vue'
 import TextButton from './TextButton.vue'
-import CooperModify from './CooperModify.vue'
 import { SurveyPermissions } from '@/management/utils/types/workSpace'
 
 import {
diff --git a/web/src/management/pages/list/components/SpaceModify.vue b/web/src/management/pages/list/components/SpaceModify.vue
index 668fd038..e9675467 100644
--- a/web/src/management/pages/list/components/SpaceModify.vue
+++ b/web/src/management/pages/list/components/SpaceModify.vue
@@ -48,10 +48,12 @@ import { useStore } from 'vuex'
 import { pick as _pick } from 'lodash-es'
 import { ElMessage } from 'element-plus'
 import 'element-plus/theme-chalk/src/message.scss'
+
 import { QOP_MAP } from '@/management/utils/constant'
-import MemberSelect from './MemberSelect.vue'
 import { type IMember, type IWorkspace, UserRole } from '@/management/utils/types/workSpace'
 
+import MemberSelect from '@/management/components/CooperModify/MemberSelect.vue'
+
 const store = useStore()
 const emit = defineEmits(['on-close-codify', 'onFocus', 'change', 'blur'])
 const props = defineProps({
diff --git a/web/src/management/styles/edit-btn.scss b/web/src/management/styles/edit-btn.scss
index 84cf2d68..0be725fa 100644
--- a/web/src/management/styles/edit-btn.scss
+++ b/web/src/management/styles/edit-btn.scss
@@ -15,4 +15,10 @@
   .btn-txt {
     font-size: 12px;
   }
+
+  .view-icon {
+    font-size: 20px;
+    height: 29px;
+    line-height: 29px;
+  }
 }