1

src/main.ts

@@ -20,7 +20,7 @@ Vue.use(utils).use(service)
 Vue.prototype.$dsbridge = dsbridge
 Vue.prototype.$global = global
 
-// new VConsole()
+new VConsole()
 
 new Vue({
   router,

src/views/team/add-department.vue

@@ -3,7 +3,7 @@
   <main-page
     left-arrow
     :loading="loading"
-    @click-left="$router.replace('/team/team-frame')"
+    @click-left="goBack"
   >
     <member-selector
       :show.sync="showMemberSelector"
@@ -117,6 +117,9 @@ export default Vue.extend({
     this.getDepInfo(depId)
   },
   methods: {
+    goBack() {
+      this.$router.replace('/team/team-frame')
+    },
     addDepConfirm(){
       if (this.name === '') {
         this.$toast('请输入部门名称')
@@ -132,7 +135,7 @@ export default Vue.extend({
         const {data} = res
         if (data.code === this.$global.success) {
           this.$toast('添加成功')
-          this.$router.push('/team/team-frame')
+          this.goBack()
         } else {
           this.$toast(data.msg)
         }

src/views/team/add-member.vue

@@ -8,8 +8,8 @@
     />
     <main-page left-arrow :loading="loading" @click-left="handleClickLeft">
       <template #right>
-        <div @click="$router.push({ name: 'Import' })">
-          <img class="w-6 h-6" src="@/assets/icons/add_many_people.png" alt />
+        <div class="text-color-primary" @click="$router.push({ name: 'Import' })">
+          批量导入
         </div>
       </template>
       <div class="px-4 pt-14 pb-16">
@@ -64,8 +64,8 @@
           @confirm="selectJoinTime"
         />
         <!-- 选择部门 -->
-        <group-cell dot required class="mt-4" title="所属部门" @click.native="selectDep">
-          <c-cell :title="currentDep.name" />
+        <group-cell required class="mt-4" title="所属部门" @click.native="selectDep">
+          <c-cell dot :title="currentDep.name" />
         </group-cell>
         <!--按钮-->
         <div class="fixed bottom-0 left-0 w-full px-4 py-1.5 bg-common-bg">
@@ -142,7 +142,7 @@ export default Vue.extend({
   },
   async created() {
     this.selectedDepId = this.depId = this.$route.query.id as string
-    this.entId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').id
+    this.entId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').id || '168398222891421696'
     // this.acceptJoin = Object.assign(this.acceptJoin, this.$store.state.acceptJoin)
     const dep = await this.getSub(this.depId)
     this.currentDep = dep.dep
@@ -196,7 +196,7 @@ export default Vue.extend({
       }
     },
     handleClickLeft() {
-      this.$router.push('/team/team-frame')
+      this.$router.replace('/team/team-frame')
     },
     // 入职日期
     selectJoinTime(date: Date) {

src/views/team/components/contact-selector.vue

@@ -83,7 +83,7 @@ export default Vue.extend({
         }
       }
     },
-    actionType: String,
+    action: String,
     contactTitle: String
   },
   data() {
@@ -91,22 +91,13 @@ export default Vue.extend({
     return {
       loading: false,
       changed: false,
-      changedVal
+      changedVal,
+      checkedMember: [] as string[],
     }
   },
-  computed: {
-    checkedMember: {
-      get(): string[] {
-        if (!this.changed) {
-          return this.checkedMemberId
-        } else {
-          return this.changedVal
-        }
-      },
-      set(val:string[]) {
-        this.changed = true
-        this.changedVal = val
-      }
+  watch: {
+    checkedMemberId(val: string[]) {
+      this.checkedMember = val
     }
   },
   methods: {
@@ -116,35 +107,36 @@ export default Vue.extend({
         this.$toast('请选择成员')
         return
       }
-      this.loading=true
       const data = {
         entId: this.entId,
         depId: '',
         ids: this.checkedMember as Array<string>
       }
-      if (this.actionType === 'add') {
-        data.depId = this.dep.id
-      }
-      if (this.actionType === 'remove') {
+      if (this.action === 'remove') {
         const rootDepId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').rootDepId
         data.depId = rootDepId
+        this.$dialog.confirm({
+          title: '提示',
+          message: '移出成员后，将移出对应的部门群，若是主管，则对应部门群群主将随机抽取群管理员或群内成员临时担任，确定移出吗？'
+          // confirmButtonText: '解散'
+        }).then(() => {
+          this.loading=true
+          this.$service.staff.changeDep(data).then((res:any) => {
+            this.loading=false
+            const {data} = res
+            if (data.code===this.$global.success) {
+              if (this.action === 'remove') {
+                this.$toast('移除成功')
+                this.$emit('update:show', false)
+                this.$emit('update:checkedMemberId', this.checkedMember)
+                this.checkedMember=[]
+              }
+            } else {
+              this.$toast(data.msg)
+            }
+          })
+        }).catch(()=>{})
       }
-      this.$service.staff.changeDep(data).then((res:any) => {
-        this.loading=false
-        const {data} = res
-        if (data.code===this.$global.success) {
-          if (this.actionType === 'remove') {
-            this.$toast('移除成功')
-          } else {
-            this.$toast('添加成功')
-          }
-        } else {
-          this.$toast(data.msg)
-        }
-      })
-      this.$emit('update:checkedMemberId', this.checkedMember)
-      this.$emit('update:show', false)
-      this.checkedMember=[]
     },
     goBack(){
       this.$emit('update:show', false)

src/views/team/components/member-selector.vue

@@ -21,11 +21,10 @@
           <!-- 团队架构详情 -->
           <team-tree
             v-if="showTeam"
-            :is-detail="isDepDetail"
-            :pre-team="preDep"
-            :tree-data="team"
+            :tree-data="tree"
+            :teams="teamArr"
             @click-child="clickItem"
-            @go-pre="goPre"
+            @click-bread="goPre"
           />
           <!-- 显示成员是否包含子部门成员 -->
           <switch-cell
@@ -90,10 +89,15 @@ export default Vue.extend({
     title: {
       type: String,
       default: '选择主管'
-    }
+    },
+    action: {
+      type: String,
+      default: 'select'
+    },
+    depId: String
   },
   data() {
-    const team: Array<Department> = []
+    const tree: Array<Department> = []
     const currentDep: Department = {
       entId: '',
       id: '',
@@ -103,20 +107,17 @@ export default Vue.extend({
     }
     let changedVal: Array<string> = []
     return {
-      team,
+      tree,
+      teamArr: [] as Department[],
       loading: false,
       contacts: [] as Array<Staff>,
       parentId: '',
       entId: '',
-      ifContainChildDep: false,
-      enterpriseInfo: {},
+      ifContainChildDep: true,
       currentDep,
-      preDep: {},
-      // 是否显示check
-      // checkedMember: [],
+
+      checkedMember: [] as string[],
       showRadio: true,
-      changed: false,
-      changedVal,
       leaders: {} as{list: Staff[], title?: string},
     }
   },
@@ -124,24 +125,6 @@ export default Vue.extend({
     this.entId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').id
     this.getEntInfo()
   },
-  computed: {
-    isDepDetail(): boolean {
-      return this.currentDep.parentId !== '-1'
-    },
-    checkedMember: {
-      get(): Array<String> {
-        if (!this.changed) {
-          return this.checkedMemberId
-        } else {
-          return this.changedVal
-        }
-      },
-      set(val:Array<string>) {
-        this.changed = true
-        this.changedVal = val
-      }
-    }
-  },
   methods: {
     goPre(dep: Department) {
       this.parentId = dep.id
@@ -149,8 +132,34 @@ export default Vue.extend({
     },
     // 确认选择
     confirmSelect() {
-      this.$emit('update:checkedMemberId', this.checkedMember)
-      this.$emit('update:show', false)
+      if (this.action === 'select') {
+        this.$emit('update:show', false)
+        this.$emit('update:checkedMemberId', this.checkedMember)
+        return
+      }
+      if (this.action === 'add') {
+        this.$dialog.confirm({
+          title: '提示',
+          message: `确定要添加选中的成员吗？`
+          // confirmButtonText: '解散'
+        }).then(() => {
+          this.loading=true
+          const data = {
+            entId: this.entId,
+            depId: this.depId,
+            ids: this.checkedMember as Array<string>
+          }
+          this.$service.staff.changeDep(data).then((res:any) => {
+            this.loading=false
+            const {data} = res
+            if (data.code===this.$global.success) {
+              this.$toast('添加成功')
+            } else {
+              this.$toast(data.msg)
+            }
+          }).catch(err=> this.loading = false)
+        }).catch(()=>{})
+      }
     },
     goBack(){
       this.$emit('update:show', false)
@@ -170,22 +179,6 @@ export default Vue.extend({
         }
       })
     },
-    // 获取部门信息
-    getDepInfo(depId: string) {
-      this.loading = true
-      this.$service.department.getDep({
-        entId: this.entId,
-        id: depId
-      }).then((res: any) => {
-        const {data} = res
-        this.loading = false
-        if (data.code === this.$global.success) {
-          this.preDep = data.data
-        } else {
-          this.$toast(data.msg)
-        }
-      })
-    },
     // 获取成员
     getStaff() {
       this.loading = true
@@ -193,20 +186,25 @@ export default Vue.extend({
         parentId: this.parentId,
         entId: this.entId,
         hasStaff: true,
-        isDirect: this.ifContainChildDep
+        isDirect: !this.ifContainChildDep
       }).then((res: any) => {
         const { data } = res
         this.loading = false
         if (data.code === this.$global.success) {
-          this.currentDep = data.data.dep
+          // this.currentDep = data.data.dep
           // 负责人/管理员
-          this.leaders.list = data.data.staffList.filter((i: Staff) => i.role !== 3)
+          this.leaders.list = data.data.staffList?.filter((i: Staff) => i.role !== 3)
           // 普通成员
-          this.contacts = data.data.staffList.filter((i: Staff) => i.role === 3)
+          this.contacts = data.data.staffList?.filter((i: Staff) => i.role === 3)
           // 部门树
           const depTree = data.data.dep
-          depTree.children = data.data.subDepList
-          this.team = [depTree]
+          const index = this.teamArr.findIndex(d => d.id === this.parentId)
+          if (index < 0) {
+            this.teamArr.push(depTree)
+          } else {
+            this.teamArr = this.teamArr.slice(0, index + 1)
+          }
+          this.tree = data.data.subDepList || []
         } else {
           this.$toast(data.msg)
         }
@@ -223,12 +221,8 @@ export default Vue.extend({
     }
   },
   watch: {
-    currentDep: {
-      handler(newDep) {
-        if (newDep.parentId !== '-1') {
-          this.getDepInfo(newDep.parentId)
-        }
-      }
+    checkedMemberId(val: string[]) {
+      this.checkedMember = val
     }
   },
 })

src/views/team/components/team-tree.vue

 <template>
   <!-- 团队架构树 -->
   <div class="tree text-text-primary">
+    <!-- 显示面包屑 -->
     <div
-      v-for="(member, index) in treeData"
-      :key="index"
-      class=""
+      class="bread py-3 flex items-center overflow-x-scroll"
     >
-      <!-- 显示标题 -->
       <div
-        v-if="!isDetail"
-        class="title font-medium py-3"
-      >
-        {{ member.name }}
-      </div>
-      <!-- 显示面包屑 -->
+        v-for="(d, index) in teams"
+        :key="d.id"
+        class="pre text-text-secondary flex items-center flex-shrink-0"
+        @click="goPre(d)">
+          <div class="flex-shrink-0">{{ d.name }}</div>
+          <div v-if="index < teams.length - 1">
+            <app-icon
+              icon-name="left-arrow"
+              class-name="w-3 h-3 transform rotate-180 ml-1 mr-2"
+            />
+          </div>
+        </div>
+      <!-- <div class="pre text-text-primary font-medium">{{ member.name }}</div> -->
+    </div>
+    <!-- 子部门 -->
+    <div v-if="treeData.length > 0" class="children">
       <div
-        v-else
-        class="bread py-3 flex items-center"
+        v-for="(t, tIndex) in treeData"
+        :key="t.id"
+        class="child-wrapper py-3 relative pl-10"
+        @click="clickChild(t, t.name)"
       >
-        <div class="pre text-text-secondary" @click="goPre(preTeam)">{{ preTeam.name }}</div>
-        <div class="text-xs text-text-secondary px-2">></div>
-        <div class="pre text-text-primary font-medium">{{ member.name }}</div>
-      </div>
-      <!-- 子部门 -->
-      <div v-if="member.children && member.children.length > 0" class="children">
+        <!-- 左边框 -->
         <div
-          v-for="(child, childIndex) in member.children"
-          :key="child.id"
-          class="child-wrapper py-3 relative pl-10"
-          @click="clickChild(child, member.name)"
+          class="left-border w-0.5 bg-border-lighter absolute left-3 top-0"
+          :class="tIndex <treeData.length - 1
+            ? 'h-full'
+            : 'h-1/2'"
+        />
+        <!-- 左icon -->
+        <div class="left absolute z-10 left-6 h-1.5 w-1.5 bg-color-primary rounded-sm top-1/2 transform -translate-y-1/2" />
+        <!-- 横线 -->
+        <div class="absolute w-3 h-0.5 left-3 bg-border-lighter top-1/2 transform -translate-y-1/2" />
+        <!-- 标题 -->
+        <div class="title">{{ t.name }} {{ t.children && t.children.length ? `(${t.children.length})` : "" }}</div>
+        <!-- 右icon -->
+        <div
+          class="dot absolute right-3 top-1/2 transform -translate-y-1/2"
         >
-          <!-- 左边框 -->
-          <div
-            class="left-border w-0.5 bg-border-lighter absolute left-3 top-0"
-            :class="childIndex < member.children.length - 1
-              ? 'h-full'
-              : 'h-1/2'"
+          <app-icon
+            type="png"
+            :path="require('@/assets/icons/dot.png')"
+            class-name="h-5 w-1"
           />
-          <!-- 左icon -->
-          <div class="left absolute z-10 left-6 h-1.5 w-1.5 bg-color-primary rounded-sm top-1/2 transform -translate-y-1/2" />
-          <!-- 横线 -->
-          <div class="absolute w-3 h-0.5 left-3 bg-border-lighter top-1/2 transform -translate-y-1/2" />
-          <!-- 标题 -->
-          <div class="title">{{ child.name }} {{ child.children && child.children.length ? `(${child.children.length})` : "" }}</div>
-          <!-- 右icon -->
-          <div
-            class="dot absolute right-3 top-1/2 transform -translate-y-1/2"
-          >
-            <app-icon
-              type="png"
-              :path="require('@/assets/icons/dot.png')"
-              class-name="h-5 w-1"
-            />
-          </div>
         </div>
       </div>
     </div>
@@ -60,7 +57,7 @@
 </template>
 
 <script lang="ts">
-import Vue from 'vue'
+import Vue, { PropType } from 'vue'
 import { Department } from '@/Interface'
 
 export default Vue.extend({
@@ -75,11 +72,12 @@ export default Vue.extend({
         return []
       }
     },
-    isDetail: {
-      type: Boolean,
-      default: false
+    teams: {
+      type: Array as PropType<Department[]>,
+      default() {
+        return []
+      }
     },
-    preTeam: Object
   },
   methods: {
     clickChild(team: Department, parentName: string) {
@@ -89,8 +87,8 @@ export default Vue.extend({
       })
     },
     goPre(team: Department) {
-      this.$emit('go-pre', team)
-    }
+      this.$emit('click-bread', team)
+    },
   }
 })
 </script>

src/views/team/create-team/create-team.vue

@@ -4,7 +4,7 @@
     @click-left="handleClickLeft"
   >
     <div class="mx-4 pt-14 pb-2">
-      <div class="text-xs text-color-primary bg-color-primary-light px-4 py-3 rounded">
+      <div class="text-sm text-color-primary bg-color-primary-light px-4 py-3 rounded">
         创建团队需选择或添加一台服务器为默认服务器，用于保存企业模块信息，聊天服务器和区块链节点自动配置。
       </div>
       <div class="mt-4">

src/views/team/department-management.vue

@@ -7,10 +7,12 @@
   >
     <member-selector
       :show-team="true"
+      :dep-id="depId"
       :title="memberSelectorTitle"
       :show.sync="showMemberSelector"
       :multiple="multiple"
       :checked-member-id.sync="selectedMemberId"
+      :action="actionType"
     />
     <contact-selector
       :contact-title="contactTitle"
@@ -19,7 +21,7 @@
       :title="contactSelectorTitle"
       :show.sync="showContactSelector"
       :multiple="multiple"
-      :action-type="actionType"
+      :action="actionType"
       :contacts="contacts"
       :leader="leader"
     />
@@ -119,15 +121,16 @@ export default Vue.extend({
   async created() {
     this.depId = this.$route.params.id
     this.entId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').id
-    const dep = await this.getDepInfo(this.depId)
-    this.depInfo = dep
-    this.selectedMemberId = [this.depInfo.leaderId]
+    this.depInfo = await this.getDepInfo(this.depId)
     if (this.depInfo.parentId === '-1') {
+      // 父级部门parentId -1 上级部门显示企业名称
       this.parentDepName = JSON.parse(localStorage.getItem('ENT_INFO') as string).name
     } else {
+      // 查询上级部门显示
       const parentDep = await this.getDepInfo(this.depInfo.parentId)
       this.parentDepName = parentDep.name
     }
+    // 获取成员信息
     this.getStaffInfo(this.depInfo.leaderId)
   },
   methods: {
@@ -176,7 +179,7 @@ export default Vue.extend({
           // 通讯录
           this.contacts = data.data.staffList || []
           if (this.actionType === 'add') {
-            this.leader.list = data.data.staffList.filter((i: Staff) => i.role !== 3)
+            this.leader.list = data.data.staffList?.filter((i: Staff) => i.role !== 3)
             this.leader.title = ''
             this.contactTitle = JSON.parse(localStorage.getItem('ENT_INFO') as string).name
           } else {
@@ -191,15 +194,16 @@ export default Vue.extend({
     selectLeader() {
       this.showMemberSelector = true
       this.multiple=false
+      this.actionType='select'
+      this.memberSelectorTitle='选择主管'
       this.selectedMemberId = [this.leaderInfo.id]
     },
     addMember() {
-      this.showContactSelector = true
-      this.actionType="add"
-      this.contactSelectorTitle = '添加成员'
-      this.multiple = true
-      const rootDepId = JSON.parse(localStorage.getItem('ENT_INFO') || '{}').rootDepId
-      this.getStaff(rootDepId, false)
+      this.showMemberSelector = true
+      this.actionType='add'
+      this.multiple=true
+      this.memberSelectorTitle='添加成员'
+      this.selectedMemberId = []
     },
     removeMember() {
       this.showContactSelector = true
@@ -211,7 +215,7 @@ export default Vue.extend({
     deleteDep() {
       this.$dialog.confirm({
         title: '提示',
-        message: '确定要删除当前部门吗？'
+        message: '确定删除该部门吗？若该部门有子部门、部门群，则子部门和对应群消息、群文件都会删除！'
         // confirmButtonText: '解散'
       }).then(() => {
         const data = {
@@ -224,13 +228,13 @@ export default Vue.extend({
           this.loading=false
           if (data.code === this.$global.success) {
             this.$toast('删除成功')
-            this.$router.push('/team/team-frame')
+            this.$router.replace('/team/team-frame')
           } else {
             this.$toast(data.msg)
           }
         })
       }).catch(() => {
-        console.log('取消解散')
+        console.log('取消')
       })
     },
     save() {
@@ -247,7 +251,7 @@ export default Vue.extend({
         this.loading = false
         if (data.code === this.$global.success) {
           this.$toast('保存成功')
-          this.$router.push('/team/team-frame')
+          this.$router.replace('/team/team-frame')
         } else {
           this.$toast(data.msg)
         }
@@ -256,7 +260,9 @@ export default Vue.extend({
   },
   watch: {
     selectedMemberId(newVal) {
-      this.getStaffInfo(newVal[0])
+      if(this.actionType === 'select') {
+        this.getStaffInfo(newVal[0])
+      }
     }
   }
 })

src/views/team/team-frame.vue

@@ -18,11 +18,10 @@
       <div class="px-4 pt-14">
         <!-- 团队架构详情 -->
         <team-tree
-          :is-detail="isDepDetail"
-          :pre-team="preDep"
-          :tree-data="team"
+          :tree-data="tree"
+          :teams="teamArr"
           @click-child="clickItem"
-          @go-pre="goPre"
+          @click-bread="goPre"
         />
         <!-- 显示成员是否包含子部门成员 -->
         <switch-cell
@@ -71,7 +70,7 @@ export default Vue.extend({
     'switch-cell': () => import('@/components/common/switch-cell.vue')
   },
   data() {
-    const team: Department[]= []
+    const tree: Department[]= []
     const currentDep: Department = {
       entId: '',
       id: '',
@@ -81,7 +80,7 @@ export default Vue.extend({
     }
     return {
       title: '导航',
-      team,
+      tree,
       loading: false,
       contacts: [] as Staff[],
       parentId: '',
@@ -89,12 +88,12 @@ export default Vue.extend({
       ifContainChildDep: true,
       enterpriseInfo: {},
       currentDep,
-      preDep: {},
       // 是否显示check
       checkedMemberId: [],
       role:3,
       leaders: {} as{list: Staff[], title?: string},
-      commonMember: [] as Staff[]
+      commonMember: [] as Staff[],
+      teamArr: [] as Department[]
     }
   },
   async mounted() {
@@ -105,9 +104,6 @@ export default Vue.extend({
     this.getEntInfo()
   },
   computed: {
-    isDepDetail(): boolean {
-      return this.currentDep.parentId !== '-1'
-    },
     isNotDepRoot():boolean {
       return this.currentDep.parentId !== '-1'
     },
@@ -138,22 +134,6 @@ export default Vue.extend({
         }
       })
     },
-    // 获取部门信息
-    getDepInfo(depId: string) {
-      this.loading = true
-      this.$service.department.getDep({
-        entId: this.entId,
-        id: depId
-      }).then((res: any) => {
-        const {data} = res
-        this.loading = false
-        if (data.code === this.$global.success) {
-          this.preDep = data.data
-        } else {
-          this.$toast(data.msg)
-        }
-      })
-    },
     // 获取成员
     getStaff() {
       this.loading = true
@@ -174,15 +154,21 @@ export default Vue.extend({
             this.leaders.list = typeof data.data.leader === 'undefined' ? [] : [data.data.leader]
             this.leaders.title = '主管'
           } else {
-            this.leaders.list = data.data.staffList.filter((i: Staff) => i.role !== 3)
+            this.leaders.list = data.data.staffList?.filter((i: Staff) => i.role !== 3)
             this.leaders.title = ''
           }
+          // breadcrumds constructor
           // 普通成员
-          this.commonMember = data.data.staffList.filter((i: Staff) => i.role === 3)
+          this.commonMember = data.data.staffList?.filter((i: Staff) => i.role === 3)
           // 部门树
           const depTree = data.data.dep
-          depTree.children = data.data.subDepList
-          this.team = [depTree]
+          const index = this.teamArr.findIndex(d => d.id === this.parentId)
+          if (index < 0) {
+            this.teamArr.push(depTree)
+          } else {
+            this.teamArr = this.teamArr.slice(0, index + 1)
+          }
+          this.tree = data.data.subDepList || []
         } else {
           this.$toast(data.msg)
         }
@@ -236,13 +222,6 @@ export default Vue.extend({
         this.getStaff()
       },
       immediate: false
-    },
-    currentDep: {
-      handler(newDep) {
-        if (newDep.parentId !== '-1') {
-          this.getDepInfo(newDep.parentId)
-        }
-      }
     }
   },
 })

src/views/team/two-code.vue

@@ -5,7 +5,7 @@
       :loading="loading"
       @click-left="handleClickLeft"
     >  
-    <div class="mx-4 pt-14">
+    <div class="mx-4 pt-14 pb-4">
       <div class="shadow-md rounded overflow-hidden" id="qrcode">
         <div class="bg-color-primary text-center h-24 pt-6">
           <div class="text-white flex-initial">{{entName}}</div>
@@ -41,18 +41,20 @@
           <div class=" text-center text-gray-400 pb-8 pt-4">扫描二维码加入{{entName}}</div>
         </div>
       </div>
-      <div class="flex justify-center  pt-8 text-color-primary font-medium text-sm text-center px-7">
-        <div class=" flex-initial mx-3">
-          <code-icon :path="require('@/assets/icons/y-chat33.png')" class-name="h-9 w-9"/> Chat33     
-        </div>
-        <!-- <div class="flex-initial mx-3">
-          <code-icon :path="require('@/assets/icons/y-weixin.png')" class-name="h-9 w-9"/>微信
-        </div> -->
-        <div class="flex-initial mx-3" @click="saveQrcode">
-          <code-icon :path="require('@/assets/icons/y-downlode.png')" class-name="h-9 w-9"/>保存
-        </div>  
+      <div class="w-24 ml-auto mt-4">
+        <c-button @click="saveQrcode">保存</c-button>
+      </div>
+      <div class="mt-4 border text-sm text-text-secondary border border-border rounded break-all p-2">
+        {{copyText}}
+      </div>
+      <div class="w-24 ml-auto mt-4">
+        <c-button
+          id="copyBtn"
+          :data-clipboard-text="qrCodeText"
+          data-clipboard-action="copy"
+          @click="copy">复制</c-button>
       </div>
-      <c-button type="secondary" class="mt-16" @click="handleClickLeft">进入团队工作台</c-button>
+      <c-button type="secondary" class="mt-4" @click="handleClickLeft">进入团队工作台</c-button>
     </div>  
     </main-page>
   </div>
@@ -114,7 +116,11 @@ export default Vue.extend({
     console.log(this.joinInfo, 'joinInfo')
     this.getDepInfo(this.joinInfo.entId, this.joinInfo.depId)
   },
-
+  computed: {
+    copyText(): string {
+      return `我和${this.entName}的小伙伴都在三生有信等你，用这个专属链接加入我们吧！${this.qrCodeText}`
+    }
+  },
   methods: {
     outputUrl(item:Object){
       let res =''
@@ -135,7 +141,6 @@ export default Vue.extend({
       this.$router.replace('/team/team-frame')
     },
     dpr() {
-      console.log(window.devicePixelRatio, 'pixel')
       if (window.devicePixelRatio && window.devicePixelRatio > 1) {
         return window.devicePixelRatio
       }
@@ -169,6 +174,15 @@ export default Vue.extend({
     async saveQrcode() {
       await this.drawCanvas('qrcode')
     },
+    copy() {
+      const clipboard = new this.$util.clipboard('#copyBtn')
+      clipboard.on('success', () => {
+        this.$toast('已经复制到剪切板')
+      })
+      clipboard.on('error', () => {
+        this.$toast('复制失败')
+      })
+    },
     getDepInfo(entId: string, depId: string) {
       this.loading=true
       this.$service.department.getDep({