diff --git a/env.d.ts b/env.d.ts
index 11f02fe2..a5628a4d 100644
--- a/env.d.ts
+++ b/env.d.ts
@@ -1 +1,9 @@
 /// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import { ComponentOptions } from 'vue'
+  const componentOptions: ComponentOptions
+  export default componentOptions
+}
+
+declare module 'quill-image-uploader'
diff --git a/src/components/common/DialogApi.vue b/src/components/common/DialogApi.vue
index 561a48fe..6a33f014 100644
--- a/src/components/common/DialogApi.vue
+++ b/src/components/common/DialogApi.vue
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 import { defineComponent, getCurrentInstance } from 'vue'
 import { useDialog } from 'naive-ui'
 
diff --git a/src/components/common/MessageApi.vue b/src/components/common/MessageApi.vue
index aeee8eff..f6eb2e1f 100644
--- a/src/components/common/MessageApi.vue
+++ b/src/components/common/MessageApi.vue
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 import { defineComponent, getCurrentInstance } from 'vue'
 import { useMessage } from 'naive-ui'
 
diff --git a/src/components/common/NotificationApi.vue b/src/components/common/NotificationApi.vue
index 00aa24e5..e4e9bb30 100644
--- a/src/components/common/NotificationApi.vue
+++ b/src/components/common/NotificationApi.vue
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 import { defineComponent, getCurrentInstance } from 'vue'
 import { useNotification } from 'naive-ui'
 
diff --git a/src/components/editor/Editor.vue b/src/components/editor/Editor.vue
index 79d2fa93..1b9dc6d8 100644
--- a/src/components/editor/Editor.vue
+++ b/src/components/editor/Editor.vue
@@ -664,6 +664,13 @@ html[theme-mode='dark'] {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    display: flex;
+    justify-content: space-between;
+
+    .quote-card-remove {
+      margin-right: 15px;
+      font-size: 18px;
+    }
   }
 
   .quote-card-meta {
diff --git a/src/components/editor/MeEditorCode.vue b/src/components/editor/MeEditorCode.vue
index c1b33faa..0975b478 100644
--- a/src/components/editor/MeEditorCode.vue
+++ b/src/components/editor/MeEditorCode.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, reactive, computed } from 'vue'
 import { NModal, NInput, NPopselect } from 'naive-ui'
 import { options } from '@/constant/highlight.js'
@@ -17,11 +17,7 @@ const langText = computed(() => {
     return item.value == model.lang
   })
 
-  if (data) {
-    return data.label
-  }
-
-  return '请选择语言类型'
+  return data ? data.label : '请选择语言类型'
 })
 
 const isCanSubmit = computed(() => {
diff --git a/src/components/editor/MeEditorEmoticon.vue b/src/components/editor/MeEditorEmoticon.vue
index e3706069..706bc40f 100644
--- a/src/components/editor/MeEditorEmoticon.vue
+++ b/src/components/editor/MeEditorEmoticon.vue
@@ -1,14 +1,14 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, computed } from 'vue'
 import { useEditorStore } from '@/store'
 import { UploadOne, Delete } from '@icon-park/vue-next'
-import { emojiList as emoji } from '@/utils/emojis'
+import { emojis } from '@/utils/emojis'
 
 const emit = defineEmits(['on-select'])
 const editorStore = useEditorStore()
 const fileImageRef = ref()
 const tabIndex = ref(0)
-const items = computed(() => editorStore.emoticon.items)
+const items = computed<any[]>(() => editorStore.emoticon.items)
 
 // 触发上传按钮事件
 const onTriggerUpload = () => {
@@ -16,22 +16,22 @@ const onTriggerUpload = () => {
 }
 
 // 上传表情包
-const onUpload = (e) => {
+const onUpload = (e: any) => {
   let file = e.target.files[0]
 
   editorStore.uploadUserEmoticon(file)
 }
 
 // 删除表情包
-const onDelete = (index, id) => {
+const onDelete = (index: number, id: number) => {
   editorStore.removeUserEmoticon({ index, id })
 }
 
-const onTabs = (index) => {
+const onTabs = (index: number) => {
   tabIndex.value = index
 }
 
-const onSendEmoticon = (type, value, img = '') => {
+const onSendEmoticon = (type: any, value: any, img = '') => {
   if (img) {
     const imgSrcReg = /<img.*?src='(.*?)'/g
     let match = imgSrcReg.exec(img)
@@ -57,7 +57,7 @@ const onSendEmoticon = (type, value, img = '') => {
       <div class="symbol-box" v-if="tabIndex == 0">
         <div class="options">
           <div
-            v-for="(img, key) in emoji.emojis"
+            v-for="(img, key) in emojis"
             v-html="img"
             :key="key"
             @click="onSendEmoticon(1, key, img)"
diff --git a/src/components/editor/MeEditorImage.vue b/src/components/editor/MeEditorImage.vue
index 69d95893..2f9c0b0b 100644
--- a/src/components/editor/MeEditorImage.vue
+++ b/src/components/editor/MeEditorImage.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, onMounted } from 'vue'
 import { NModal } from 'naive-ui'
 import { fileFormatSize } from '@/utils/strings'
@@ -12,7 +12,7 @@ const props = defineProps({
   }
 })
 
-const state = reactive({
+const state: any = reactive({
   show: true,
   src: '',
   size: '',
diff --git a/src/components/editor/MeEditorRecorder.vue b/src/components/editor/MeEditorRecorder.vue
index 7aaa5641..d0fcf947 100644
--- a/src/components/editor/MeEditorRecorder.vue
+++ b/src/components/editor/MeEditorRecorder.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, onUnmounted } from 'vue'
 import { NModal } from 'naive-ui'
 import { Voice } from '@icon-park/vue-next'
@@ -11,7 +11,7 @@ const isShow = ref(true)
 const status = ref(0) // 0 未开始 1录制中 2已结束
 const animation = ref(false)
 const duration = ref(0)
-let recorder = null
+let recorder: any = null
 
 const onMaskClick = () => {
   onDestroy()
diff --git a/src/components/editor/MeEditorVote.vue b/src/components/editor/MeEditorVote.vue
index 180ac326..eef46282 100644
--- a/src/components/editor/MeEditorVote.vue
+++ b/src/components/editor/MeEditorVote.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, computed, ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput, NRadioGroup, NSpace, NRadio } from 'naive-ui'
 import { Delete } from '@icon-park/vue-next'
@@ -31,7 +31,7 @@ const addOption = () => {
   model.options.push({ value: '' })
 }
 
-const delOption = (index) => {
+const delOption = (index: number) => {
   model.options.length > 2 && model.options.splice(index, 1)
 }
 
diff --git a/src/components/editor/formats/quote.ts b/src/components/editor/formats/quote.ts
index 5cf34826..b3a25c5d 100644
--- a/src/components/editor/formats/quote.ts
+++ b/src/components/editor/formats/quote.ts
@@ -7,7 +7,7 @@ class QuoteBlot extends BlockEmbed {
   static tagName = 'div'
   static className = 'quote-card'
 
-  static create(value): any {
+  static create(value: any): any {
     const node = super.create(value)
 
     const { id, title, describe, image } = value
@@ -22,9 +22,18 @@ class QuoteBlot extends BlockEmbed {
     const quoteCardContent = document.createElement('span')
     quoteCardContent.classList.add('quote-card-content')
 
+    const close = document.createElement('span')
+    close.classList.add('quote-card-remove')
+    close.textContent = '×'
+    close.addEventListener('click', () => {
+      node.remove()
+    })
+
     const quoteCardTitle = document.createElement('span')
     quoteCardTitle.classList.add('quote-card-title')
     quoteCardTitle.textContent = title
+    quoteCardTitle.appendChild(close)
+
     quoteCardContent.appendChild(quoteCardTitle)
 
     if (image.length == 0) {
@@ -35,16 +44,20 @@ class QuoteBlot extends BlockEmbed {
     } else {
       const iconImg = document.createElement('img')
       iconImg.setAttribute('src', image)
-      iconImg.style = 'max-width:30px;max-height:30px;'
+      iconImg.setAttribute('style', 'width:30px;height:30px;margin-right:10px;')
       quoteCardContent.appendChild(iconImg)
     }
 
+    node.ondblclick = () => {
+      console.log('quote card ondblclick')
+    }
+
     node.appendChild(quoteCardContent)
 
     return node
   }
 
-  static value(node): any {
+  static value(node: HTMLElement): any {
     return {
       id: node.dataset.id,
       title: node.dataset.title,
diff --git a/src/components/editor/util.ts b/src/components/editor/util.ts
index 646453fd..bb569b4d 100644
--- a/src/components/editor/util.ts
+++ b/src/components/editor/util.ts
@@ -1,4 +1,4 @@
-import { Delta } from 'quill'
+import { Delta } from '@vueup/vue-quill'
 
 interface Item {
   type: number
@@ -13,11 +13,11 @@ interface AnalysisResp {
   quoteId: string // 引用的消息ID
 }
 
-function removeLeadingNewlines(str) {
+function removeLeadingNewlines(str: string) {
   return str.replace(/^[\n\s]+/, '')
 }
 
-function removeTrailingNewlines(str) {
+function removeTrailingNewlines(str: string) {
   return str.replace(/[\n\s]+$/, '')
 }
 
@@ -31,30 +31,32 @@ export function deltaToMessage(delta: Delta): AnalysisResp {
   }
 
   for (const iterator of delta.ops) {
+    const insert: any = iterator.insert
+
     let node: any = null
     if (resp.items.length) {
       node = resp.items[resp.items.length - 1]
     }
 
-    if (typeof iterator.insert === 'string') {
-      if (!iterator.insert || iterator.insert == '\n') continue
+    if (typeof insert === 'string') {
+      if (!insert || insert == '\n') continue
 
       if (node && node.type == 1) {
-        node.content = node.content + iterator.insert
+        node.content = node.content + insert
         continue
       }
 
       resp.items.push({
         type: 1,
-        content: iterator.insert
+        content: insert
       })
 
       continue
     }
 
     // @好友
-    if (iterator.insert.mention) {
-      const mention = iterator.insert.mention
+    if (insert && insert.mention) {
+      const mention = insert.mention
 
       resp.mentions.push({
         name: `${mention.denotationChar}${mention.value}`,
@@ -75,17 +77,17 @@ export function deltaToMessage(delta: Delta): AnalysisResp {
     }
 
     // 图片
-    if (iterator.insert.image) {
+    if (insert && insert.image) {
       resp.items.push({
         type: 3,
-        content: iterator.insert.image
+        content: insert.image
       })
       continue
     }
 
     // 表情
-    if (iterator.insert.emoji) {
-      const emoji = iterator.insert.emoji
+    if (insert && insert.emoji) {
+      const { emoji } = insert
 
       if (node && node.type == 1) {
         node.content = node.content + emoji.alt
@@ -100,8 +102,8 @@ export function deltaToMessage(delta: Delta): AnalysisResp {
       continue
     }
 
-    if (iterator.insert.quote) {
-      resp.quoteId = iterator.insert.quote.id
+    if (insert && insert.quote) {
+      resp.quoteId = insert.quote.id
       continue
     }
   }
@@ -136,29 +138,31 @@ export function deltaToString(delta: Delta): string {
   let content = ''
 
   for (const o of delta.ops) {
-    if (typeof o.insert === 'string') {
-      if (!o.insert || o.insert == '\n') continue
+    const insert: any = o.insert
+
+    if (typeof insert === 'string') {
+      if (!insert || insert == '\n') continue
 
-      content += o.insert
+      content += insert
       continue
     }
 
     // @好友
-    if (o.insert.mention) {
-      const mention = o.insert.mention
+    if (insert && insert.mention) {
+      const { mention } = insert
       content += ` ${mention.denotationChar}${mention.value} `
       continue
     }
 
     // 图片
-    if (o.insert.image) {
+    if (insert && insert.image) {
       content += '[图片]'
       continue
     }
 
     // 表情
-    if (o.insert.emoji) {
-      content += o.insert.emoji.alt
+    if (insert && insert.emoji) {
+      content += insert.emoji.alt
       continue
     }
   }
diff --git a/src/components/group/GroupApply.vue b/src/components/group/GroupApply.vue
index 7280969a..b41e7086 100644
--- a/src/components/group/GroupApply.vue
+++ b/src/components/group/GroupApply.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput } from 'naive-ui'
 import { ServeCreateGroupApply } from '@/api/group'
@@ -23,12 +23,12 @@ const onMaskClick = () => {
 const onSubmit = () => {
   loading.value = true
 
-  let response = ServeCreateGroupApply({
+  let resp = ServeCreateGroupApply({
     group_id: props.gid,
     remark: remark.value
   })
 
-  response.then((res) => {
+  resp.then((res) => {
     if (res.code == 200) {
       window['$message'].success('入群申请提交成功...')
       onMaskClick()
@@ -37,7 +37,7 @@ const onSubmit = () => {
     }
   })
 
-  response.finally(() => {
+  resp.finally(() => {
     loading.value = false
   })
 }
diff --git a/src/components/group/GroupLaunch.vue b/src/components/group/GroupLaunch.vue
index 540eb68e..3e20cf56 100644
--- a/src/components/group/GroupLaunch.vue
+++ b/src/components/group/GroupLaunch.vue
@@ -1,10 +1,10 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, reactive, computed } from 'vue'
 import { NModal, NInput, NScrollbar, NDivider, NCheckbox, NForm, NFormItem } from 'naive-ui'
 import { Search, Delete } from '@icon-park/vue-next'
 import { ServeCreateGroup, ServeInviteGroup, ServeGetInviteFriends } from '@/api/group'
 
-const emit = defineEmits(['close', 'on-submit'])
+const emit = defineEmits(['close', 'on-submit', 'on-invite'])
 const props = defineProps({
   gid: {
     type: Number,
@@ -12,7 +12,7 @@ const props = defineProps({
   }
 })
 
-const items = ref([])
+const items = ref<any[]>([])
 const model = reactive({
   keywords: '',
   name: ''
@@ -82,7 +82,7 @@ const onTriggerContact = (item) => {
   data && (data.checked = !data.checked)
 }
 
-const onCreateSubmit = (ids) => {
+const onCreateSubmit = (ids: number[]) => {
   ServeCreateGroup({
     avatar: '',
     name: model.name,
@@ -98,7 +98,7 @@ const onCreateSubmit = (ids) => {
   })
 }
 
-const onInviteSubmit = (ids) => {
+const onInviteSubmit = (ids: number[]) => {
   ServeInviteGroup({
     group_id: props.gid,
     ids: ids.join(',')
@@ -112,7 +112,7 @@ const onInviteSubmit = (ids) => {
 }
 
 const onSubmit = () => {
-  let ids = checkedFilter.value.map((item) => item.id)
+  const ids = checkedFilter.value.map((item) => item.id)
 
   if (props.gid == 0) {
     onCreateSubmit(ids)
diff --git a/src/components/group/GroupNotice.vue b/src/components/group/GroupNotice.vue
index ab641928..0d2050b8 100644
--- a/src/components/group/GroupNotice.vue
+++ b/src/components/group/GroupNotice.vue
@@ -1,6 +1,5 @@
-<script setup>
-import { ref, reactive } from 'vue'
-import { NModal } from 'naive-ui'
+<script lang="ts" setup>
+import { ref, onMounted } from 'vue'
 import { Up, Down, Close } from '@icon-park/vue-next'
 import Loading from '@/components/base/Loading.vue'
 import { ServeGetGroupNotices } from '@/api/group'
@@ -13,39 +12,37 @@ const props = defineProps({
   }
 })
 
-const isShow = ref(true)
 const title = ref('群公告')
-
-const state = reactive({
-  loading: false,
-  items: []
-})
+const loading = ref(false)
+const items = ref<any[]>([])
 
 const onClose = () => {
   emit('close')
 }
 
 const onLoadData = () => {
-  state.loading = true
+  loading.value = true
   ServeGetGroupNotices({
     group_id: props.groupId
   }).then((res) => {
     if (res.code == 200) {
-      let items = res.data.items || []
+      let list = res.data.items || []
 
-      items.forEach((item) => {
-        item.isShow = false
+      list.forEach((item: any) => {
+        item.is_show = false
       })
 
-      state.items = items
-      title.value = `群公告(${state.items.length})`
+      items.value = list
+      title.value = `群公告(${items.value.length})`
     }
 
-    state.loading = false
+    loading.value = false
   })
 }
 
-onLoadData()
+onMounted(() => {
+  onLoadData()
+})
 </script>
 
 <template>
@@ -61,11 +58,11 @@ onLoadData()
     </header>
 
     <main class="el-main me-scrollbar me-scrollbar-thumb">
-      <div v-if="state.loading" class="flex-box flex-center">
+      <div v-if="loading" class="flex-box flex-center">
         <Loading />
       </div>
 
-      <div v-else-if="state.items.length === 0" class="flex-box flex-center">
+      <div v-else-if="items.length === 0" class="flex-box flex-center">
         <n-empty size="200" description="暂无相关数据">
           <template #icon>
             <img src="@/assets/image/no-data.svg" alt="" />
@@ -73,7 +70,7 @@ onLoadData()
         </n-empty>
       </div>
 
-      <div v-for="item in state.items" :key="item.id" class="items">
+      <div v-for="item in items" :key="item.id" class="items">
         <div class="title text-ellipsis">
           {{ item.title }}
         </div>
@@ -82,13 +79,13 @@ onLoadData()
           <n-avatar round :size="15" :src="item.avatar" />
           <span class="nickname text-ellipsis">{{ item.nickname }}</span>
           <span class="datetime">发表于 {{ item.created_at }}</span>
-          <span class="btn" @click="item.isShow = !item.isShow">
-            <n-icon :size="18" :component="item.isShow ? Up : Down" />
-            {{ item.isShow ? '收起' : '展开' }}
+          <span class="btn" @click="item.is_show = !item.is_show">
+            <n-icon :size="18" :component="item.is_show ? Up : Down" />
+            {{ item.is_show ? '收起' : '展开' }}
           </span>
         </div>
 
-        <div class="detail" v-show="item.isShow">
+        <div class="detail" v-show="item.is_show">
           {{ item.content }}
         </div>
       </div>
diff --git a/src/components/group/GroupPanel.vue b/src/components/group/GroupPanel.vue
index e66d8071..65b23faa 100644
--- a/src/components/group/GroupPanel.vue
+++ b/src/components/group/GroupPanel.vue
@@ -41,34 +41,39 @@ const state = reactive({
     visit_card: '',
     notice: ''
   },
-  members: [],
   remark: ''
 })
 
-const search = computed(() => {
+const members = ref<any[]>([])
+
+const search = computed<any[]>(() => {
   if (state.keywords) {
-    return state.members.filter((item: any) => {
+    return members.value.filter((item: any) => {
       return (
         item.nickname.match(state.keywords) != null || item.remark.match(state.keywords) != null
       )
     })
   }
 
-  return state.members
+  return members.value
 })
 
 const isLeader = computed(() => {
-  return state.members.some((item: any) => {
+  return members.value.some((item: any) => {
     return item.user_id == userStore.uid && item.leader >= 1
   })
 })
 
 const isAdmin = computed(() => {
-  return state.members.some((item: any) => {
+  return members.value.some((item: any) => {
     return item.user_id == userStore.uid && item.leader == 2
   })
 })
 
+const onShowManage = (vallue: any) => {
+  isShowManage.value = vallue
+}
+
 const onGroupCallBack = () => {}
 
 const onToInfo = (item: any) => {
@@ -105,7 +110,7 @@ function loadMembers() {
     group_id: props.gid
   }).then((res) => {
     if (res.code == 200) {
-      state.members = res.data.items || []
+      members.value = res.data.items || []
     }
   })
 }
@@ -133,6 +138,7 @@ const onChangeRemark = () => {
     visit_card: state.remark
   }).then(({ code, message }) => {
     if (code == 200) {
+      // @ts-ignore
       editCardPopover.value.setShow(false)
       state.detail.visit_card = state.remark
       window['$message'].success('已更新群名片')
@@ -200,7 +206,7 @@ loadMembers()
         <div class="b-box">
           <div class="block">
             <div class="title">群成员：</div>
-            <div class="text">{{ state.members.length }}人</div>
+            <div class="text">{{ members.length }}人</div>
           </div>
           <div class="describe">群主已开启“新成员入群可查看所有聊天记录</div>
         </div>
@@ -287,7 +293,7 @@ loadMembers()
         type="primary"
         text-color="#ffffff"
         v-if="isLeader"
-        @click="isShowManage = true"
+        @click="onShowManage(true)"
       >
         群聊管理
       </n-button>
@@ -301,7 +307,7 @@ loadMembers()
     @on-submit="onGroupCallBack"
   />
 
-  <GroupManage v-if="isShowManage" :gid="gid" @close="isShowManage = false" />
+  <GroupManage v-if="isShowManage" :gid="gid" @close="onShowManage(false)" />
 </template>
 <style lang="less" scoped>
 .section {
diff --git a/src/components/group/manage/ApplyTab.vue b/src/components/group/manage/ApplyTab.vue
index da993265..045c4c98 100644
--- a/src/components/group/manage/ApplyTab.vue
+++ b/src/components/group/manage/ApplyTab.vue
@@ -1,10 +1,22 @@
-<script setup>
-import { ref, computed, h } from 'vue'
-import { NSpace, NPopconfirm, NInput } from 'naive-ui'
-import { Search, RefreshOne, CheckSmall, Close } from '@icon-park/vue-next'
+<script lang="ts" setup>
+import { ref, computed, h, inject, onMounted } from 'vue'
+import { NSpace, NInput } from 'naive-ui'
+import { Search, CheckSmall, Close, Redo } from '@icon-park/vue-next'
 import { ServeGetGroupApplyList, ServeDeleteGroupApply, ServeAgreeGroupApply } from '@/api/group'
 import { throttle } from '@/utils/common'
 
+interface Item {
+  id: number
+  user_id: number
+  group_id: number
+  avatar: string
+  nickname: string
+  remark: string
+  created_at: string
+}
+
+const emit = defineEmits(['close'])
+
 const props = defineProps({
   id: {
     type: Number,
@@ -14,7 +26,9 @@ const props = defineProps({
 
 const keywords = ref('')
 const batchDelete = ref(false)
-const items = ref([])
+const items = ref<Item[]>([])
+
+const user: any = inject('$user')
 
 const filterSearch = computed(() => {
   if (!keywords.value.length) {
@@ -37,13 +51,17 @@ const onLoadData = () => {
   })
 }
 
-const onRowClick = (item) => {
+const onUserInfo = (item: Item) => {
+  user(item.user_id)
+}
+
+const onRowClick = (item: Item) => {
   if (batchDelete.value == true) {
     console.log(item)
   }
 }
 
-const onAgree = throttle((item) => {
+const onAgree = throttle((item: Item) => {
   let loading = window['$message'].loading('请稍等，正在处理')
 
   ServeAgreeGroupApply({
@@ -60,7 +78,7 @@ const onAgree = throttle((item) => {
   })
 }, 1000)
 
-const onDelete = (item) => {
+const onDelete = (item: Item) => {
   let remark = ''
   let dialog = window['$dialog'].create({
     title: '拒绝入群申请',
@@ -100,7 +118,9 @@ const onDelete = (item) => {
   })
 }
 
-onLoadData()
+onMounted(() => {
+  onLoadData()
+})
 </script>
 <template>
   <section class="section el-container is-vertical height100">
@@ -121,7 +141,7 @@ onLoadData()
           </n-input>
 
           <n-button circle @click="onLoadData">
-            <template #icon> <n-icon :component="RefreshOne" /> </template>
+            <template #icon> <n-icon :component="Redo" /> </template>
           </n-button>
         </n-space>
       </div>
@@ -142,7 +162,7 @@ onLoadData()
         :key="item.id"
         @click="onRowClick(item)"
       >
-        <div class="avatar pointer" @click="onUserInfo(member)">
+        <div class="avatar pointer" @click="onUserInfo(item)">
           <im-avatar :size="40" :src="item.avatar" :username="item.nickname" />
         </div>
         <div class="content pointer o-hidden">
diff --git a/src/components/group/manage/ConfigTab.vue b/src/components/group/manage/ConfigTab.vue
index 9bc68867..0ef72053 100644
--- a/src/components/group/manage/ConfigTab.vue
+++ b/src/components/group/manage/ConfigTab.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive } from 'vue'
 import { NForm, NFormItem, NSwitch, NPopconfirm } from 'naive-ui'
 import { ServeDismissGroup, ServeMuteGroup, ServeGroupDetail, ServeOvertGroup } from '@/api/group'
@@ -19,29 +19,27 @@ const detail = reactive({
   overt_loading: false
 })
 
-const onLoadData = () => {
-  ServeGroupDetail({ group_id: props.id }).then((res) => {
-    if (res.code == 200) {
-      detail.is_mute = res.data.is_mute == 1
-      detail.is_overt = res.data.is_overt == 1
-    }
-  })
+const onLoadData = async () => {
+  const { data, code } = await ServeGroupDetail({ group_id: props.id })
+
+  if (code === 200) {
+    detail.is_mute = data.is_mute === 1
+    detail.is_overt = data.is_overt === 1
+  }
 }
 
-const onDismiss = () => {
-  ServeDismissGroup({
-    group_id: props.id
-  }).then((res) => {
-    if (res.code == 200) {
-      window['$message'].success('群聊已解散')
-      emit('close')
-    } else {
-      window['$message'].info(res.message)
-    }
-  })
+const onDismiss = async () => {
+  const { code, message } = await ServeDismissGroup({ group_id: props.id })
+
+  if (code === 200) {
+    emit('close')
+    window['$message'].success('群聊已解散')
+  } else {
+    window['$message'].info(message)
+  }
 }
 
-const onMute = (value) => {
+const onMute = (value: boolean) => {
   detail.mute_loading = true
 
   ServeMuteGroup({
@@ -60,7 +58,7 @@ const onMute = (value) => {
     })
 }
 
-const onOvert = (value) => {
+const onOvert = (value: boolean) => {
   detail.overt_loading = true
 
   ServeOvertGroup({
diff --git a/src/components/group/manage/DetailTab.vue b/src/components/group/manage/DetailTab.vue
index d35ce5dd..50fc5447 100644
--- a/src/components/group/manage/DetailTab.vue
+++ b/src/components/group/manage/DetailTab.vue
@@ -1,9 +1,11 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, reactive, onMounted } from 'vue'
 import { NForm, NFormItem, NInput } from 'naive-ui'
 import AvatarCropper from '@/components/base/AvatarCropper.vue'
 import { ServeGroupDetail, ServeEditGroup } from '@/api/group'
 
+const emit = defineEmits(['close'])
+
 const props = defineProps({
   id: {
     type: Number,
@@ -73,7 +75,7 @@ onMounted(() => {
           maxWidth: '350px'
         }"
       >
-        <n-form-item label="群头像" path="name">
+        <n-form-item label="群头像:" path="name">
           <n-avatar v-if="modelDetail.avatar" :size="60" :src="modelDetail.avatar" />
           <n-avatar
             v-else
@@ -96,11 +98,11 @@ onMounted(() => {
           </n-button>
         </n-form-item>
 
-        <n-form-item label="群名称" required path="name">
+        <n-form-item label="群名称:" required path="name">
           <n-input placeholder="必填" type="text" v-model:value="modelDetail.name" />
         </n-form-item>
 
-        <n-form-item label="群简介" path="profile">
+        <n-form-item label="群简介:" path="profile">
           <n-input placeholder="选填" type="textarea" v-model:value="modelDetail.profile" />
         </n-form-item>
         <n-form-item label="">
diff --git a/src/components/group/manage/MemberTab.vue b/src/components/group/manage/MemberTab.vue
index bf543701..7bacbb6d 100644
--- a/src/components/group/manage/MemberTab.vue
+++ b/src/components/group/manage/MemberTab.vue
@@ -4,6 +4,7 @@ import { NSpace, NDropdown, NCheckbox } from 'naive-ui'
 import { Search, Plus } from '@icon-park/vue-next'
 import GroupLaunch from '../GroupLaunch.vue'
 import { useUserStore } from '@/store'
+import { StateDropdown } from '@/types/global'
 
 import {
   ServeGetGroupMembers,
@@ -13,6 +14,7 @@ import {
   ServeGroupNoSpeak
 } from '@/api/group'
 
+const emit = defineEmits(['close'])
 const props = defineProps({
   id: {
     type: Number,
@@ -20,12 +22,24 @@ const props = defineProps({
   }
 })
 
+interface Item {
+  user_id: number
+  avatar: string
+  nickname: string
+  gender: number
+  remark: string
+  is_mute: number
+  leader: number
+  is_delete: boolean
+  motto?: string
+}
+
 const user: any = inject('$user')
 const userStore = useUserStore()
 const isGroupLaunch = ref(false)
 const keywords = ref('')
 const batchDelete = ref(false)
-const items = ref([])
+const items = ref<Item[]>([])
 
 const filterCheck = computed(() => {
   return items.value.filter((item: any) => item.is_delete)
@@ -47,7 +61,7 @@ const isAdmin = computed(() => {
   })
 })
 
-const dropdown = reactive({
+const dropdown = reactive<StateDropdown>({
   options: [],
   show: false,
   dropdownX: 0,
@@ -62,7 +76,7 @@ const onLoadData = () => {
     if (res.code == 200) {
       let data = res.data.items || []
 
-      data.forEach((item) => {
+      data.forEach((item: Item) => {
         item.is_delete = false
       })
 
@@ -71,7 +85,7 @@ const onLoadData = () => {
   })
 }
 
-const onDelete = (item) => {
+const onDelete = (item: Item) => {
   let title = `删除 [${item.nickname}] 群成员？`
 
   window['$dialog'].create({
@@ -94,9 +108,7 @@ const onDelete = (item) => {
 }
 
 const onBatchDelete = () => {
-  if (!filterCheck.value.length) {
-    return
-  }
+  if (!filterCheck.value.length) return
 
   window['$dialog'].create({
     title: '温馨提示',
@@ -106,7 +118,7 @@ const onBatchDelete = () => {
     onPositiveClick: () => {
       ServeRemoveMembersGroup({
         group_id: props.id,
-        members_ids: filterCheck.value.map((item: any) => item.user_id).join(',')
+        members_ids: filterCheck.value.map((item: Item) => item.user_id).join(',')
       }).then((res) => {
         if (res.code == 200) {
           batchDelete.value = false
@@ -118,7 +130,7 @@ const onBatchDelete = () => {
   })
 }
 
-const onRowClick = (item: any) => {
+const onRowClick = (item: Item) => {
   if (batchDelete.value == true) {
     if (item.leader < 2) {
       item.is_delete = !item.is_delete
@@ -129,18 +141,18 @@ const onRowClick = (item: any) => {
 }
 
 const onCancelDelete = () => {
-  items.value.forEach((item: any) => {
+  items.value.forEach((item: Item) => {
     item.is_delete = false
   })
 
   batchDelete.value = false
 }
 
-const onUserInfo = (item: any) => {
+const onUserInfo = (item: Item) => {
   user(item.user_id)
 }
 
-const onAssignAdmin = (item: any) => {
+const onAssignAdmin = (item: Item) => {
   let title =
     item.leader == 0
       ? `确定要给 [${item.nickname}] 分配管理员权限吗？`
@@ -155,7 +167,7 @@ const onAssignAdmin = (item: any) => {
       ServeGroupAssignAdmin({
         mode: item.leader == 0 ? 1 : 2,
         group_id: props.id,
-        user_id: parseInt(item.user_id)
+        user_id: item.user_id
       }).then((res) => {
         if (res.code == 200) {
           window['$message'].success('操作成功')
@@ -168,7 +180,7 @@ const onAssignAdmin = (item: any) => {
   })
 }
 
-const onTransfer = (item) => {
+const onTransfer = (item: Item) => {
   window['$dialog'].create({
     title: '温馨提示',
     content: `确定把群主权限转交给 [${item.nickname}] ？`,
@@ -177,7 +189,7 @@ const onTransfer = (item) => {
     onPositiveClick: () => {
       ServeGroupHandover({
         group_id: props.id,
-        user_id: parseInt(item.user_id)
+        user_id: item.user_id
       }).then((res) => {
         if (res.code == 200) {
           window['$message'].success('操作成功')
@@ -190,7 +202,7 @@ const onTransfer = (item) => {
   })
 }
 
-const onForbidden = (item: any) => {
+const onForbidden = (item: Item) => {
   let content = `确定要禁言 [${item.nickname}] 此用户吗？`
 
   if (item.is_mute === 1) {
@@ -206,7 +218,7 @@ const onForbidden = (item: any) => {
       ServeGroupNoSpeak({
         mode: item.is_mute == 0 ? 1 : 2,
         group_id: props.id,
-        user_id: parseInt(item.user_id)
+        user_id: item.user_id
       }).then((res) => {
         if (res.code == 200) {
           window['$message'].success('操作成功')
@@ -220,7 +232,7 @@ const onForbidden = (item: any) => {
 }
 
 // 会话列表右键显示菜单
-const onContextMenu = (e: any, item: any) => {
+const onContextMenu = (e: any, item: Item) => {
   if (batchDelete.value == true || item.leader == 2) {
     return
   }
@@ -273,7 +285,7 @@ const onContextMenuHandle = (key: string) => {
     transfer: onTransfer,
     forbidden: onForbidden,
     delete: onDelete,
-    batch_delete: (data: any) => {
+    batch_delete: () => {
       batchDelete.value = true
     }
   }
@@ -320,32 +332,32 @@ onLoadData()
     </main>
 
     <main v-else class="el-main main me-scrollbar me-scrollbar-thumb">
-      <div class="member-item" v-for="member in filterSearch" :key="member.user_id">
+      <div class="member-item" v-for="item in filterSearch" :key="item.user_id">
         <div class="tool flex-center" v-show="batchDelete">
-          <n-checkbox :disabled="member.leader === 2" size="small" :checked="member.is_delete" />
+          <n-checkbox :disabled="item.leader === 2" size="small" :checked="item.is_delete" />
         </div>
-        <div class="avatar pointer" @click="onUserInfo(member)">
-          <im-avatar :size="40" :src="member.avatar" :username="member.nickname" />
+        <div class="avatar pointer" @click="onUserInfo(item)">
+          <im-avatar :size="40" :src="item.avatar" :username="item.nickname" />
         </div>
         <div
           class="content pointer o-hidden"
-          @click="onRowClick(member)"
-          @contextmenu.prevent="onContextMenu($event, member)"
+          @click="onRowClick(item)"
+          @contextmenu.prevent="onContextMenu($event, item)"
         >
           <div class="item-title">
             <p class="nickname text-ellipsis">
-              <span>{{ member.nickname || '未设置昵称' }}</span>
-              <span v-show="member.user_card"> ({{ member.user_card }})</span>
+              <span>{{ item.nickname || '未设置昵称' }}</span>
+              <span v-show="item.remark"> ({{ item.remark }})</span>
             </p>
             <p>
-              <span class="badge master" v-show="member.leader == 2">群主</span>
-              <span class="badge leader" v-show="member.leader == 1">管理员</span>
-              <span class="badge muted" v-show="member.is_mute == 1">已禁言</span>
+              <span class="badge master" v-show="item.leader == 2">群主</span>
+              <span class="badge leader" v-show="item.leader == 1">管理员</span>
+              <span class="badge muted" v-show="item.is_mute == 1">已禁言</span>
               <!-- <span class="badge qiye">企业</span> -->
             </p>
           </div>
           <div class="item-text text-ellipsis">
-            {{ member.motto || '暂无简介' }}
+            {{ item.motto || '暂无简介' }}
           </div>
         </div>
       </div>
diff --git a/src/components/group/manage/NoticeEditor.vue b/src/components/group/manage/NoticeEditor.vue
index 267a9a4b..c9a6f831 100644
--- a/src/components/group/manage/NoticeEditor.vue
+++ b/src/components/group/manage/NoticeEditor.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput } from 'naive-ui'
 import { ServeEditGroupNotice } from '@/api/group'
diff --git a/src/components/group/manage/NoticeTab.vue b/src/components/group/manage/NoticeTab.vue
index 244dfdbf..e90fc1bf 100644
--- a/src/components/group/manage/NoticeTab.vue
+++ b/src/components/group/manage/NoticeTab.vue
@@ -1,10 +1,11 @@
-<script setup>
-import { ref, computed, reactive } from 'vue'
+<script lang="ts" setup>
+import { ref, computed, reactive, onMounted } from 'vue'
 import { NSpace, NEmpty } from 'naive-ui'
 import { Search, Plus } from '@icon-park/vue-next'
 import NoticeEditor from './NoticeEditor.vue'
 import { ServeGetGroupNotices } from '@/api/group'
 
+const emit = defineEmits(['close'])
 const props = defineProps({
   id: {
     type: Number,
@@ -12,9 +13,22 @@ const props = defineProps({
   }
 })
 
+interface Item {
+  id: number
+  title: string
+  content: string
+  is_confirm: number
+  is_top: number
+  creator_id: number
+  created_at: string
+  updated_at: string
+  confirm_users: string
+  is_delete: boolean
+}
+
 const keywords = ref('')
 const batchDelete = ref(false)
-const items = ref([])
+const items = ref<Item[]>([])
 const editor = reactive({
   isShow: false,
   id: 0,
@@ -24,7 +38,7 @@ const editor = reactive({
 })
 
 const filterCheck = computed(() => {
-  return items.value.filter((item) => item.is_delete)
+  return items.value.filter((item: Item) => item.is_delete)
 })
 
 const filterSearch = computed(() => {
@@ -32,7 +46,7 @@ const filterSearch = computed(() => {
     return items.value
   }
 
-  return items.value.filter((item) => {
+  return items.value.filter((item: Item) => {
     return item.title.match(keywords.value) != null
   })
 })
@@ -51,11 +65,9 @@ const onBatchDelete = () => {
   if (!filterCheck.value.length) {
     return
   }
-
-  let ids = filterCheck.value.map((item) => item.user_id).join(',')
 }
 
-const onRowClick = (item) => {
+const onRowClick = (item: any) => {
   if (batchDelete.value == true) {
     console.log(item)
   } else {
@@ -76,7 +88,7 @@ const onAdd = () => {
 }
 
 const onCancelDelete = () => {
-  items.value.forEach((item) => {
+  items.value.forEach((item: Item) => {
     item.is_delete = false
   })
 
@@ -88,7 +100,9 @@ const onEditorSuccess = () => {
   onLoadData()
 }
 
-onLoadData()
+onMounted(() => {
+  onLoadData()
+})
 </script>
 <template>
   <section class="section el-container is-vertical height100">
@@ -120,7 +134,7 @@ onLoadData()
     <main v-if="filterSearch.length === 0" class="el-main main flex-center">
       <n-empty size="200" description="暂无相关数据">
         <template #icon>
-          <img src="@/assets/image/no-data.svg" alt="" />
+          <img src="@/assets/image/no-data.svg" />
         </template>
       </n-empty>
     </main>
@@ -141,9 +155,7 @@ onLoadData()
               <span class="date">{{ item.updated_at }}</span>
             </p>
           </div>
-          <div class="item-text text-ellipsis">
-            {{ item.content }}
-          </div>
+          <div class="item-text text-ellipsis">{{ item.content }}</div>
         </div>
       </div>
     </main>
@@ -212,7 +224,8 @@ onLoadData()
     .item-text {
       width: inherit;
       height: 20px;
-      color: rgb(255 255 255 / 52%);
+      color: var(--im-text-color-grey);
+
       font-size: 12px;
     }
   }
diff --git a/src/components/group/manage/index.vue b/src/components/group/manage/index.vue
index 1ecb34ba..ec8f5b29 100644
--- a/src/components/group/manage/index.vue
+++ b/src/components/group/manage/index.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { ref } from 'vue'
 import { NModal } from 'naive-ui'
 import DetailTab from './DetailTab.vue'
@@ -9,7 +9,7 @@ import ConfigTab from './ConfigTab.vue'
 
 const emit = defineEmits(['close'])
 
-const props = defineProps({
+defineProps({
   gid: {
     type: Number,
     default: 0
diff --git a/src/components/talk/ForwardRecord.vue b/src/components/talk/ForwardRecord.vue
index 6c76a092..ff607b71 100644
--- a/src/components/talk/ForwardRecord.vue
+++ b/src/components/talk/ForwardRecord.vue
@@ -1,8 +1,9 @@
 <script lang="ts" setup>
-import { ref, inject } from 'vue'
+import { ref, inject, onMounted } from 'vue'
 import Loading from '@/components/base/Loading.vue'
 import { ServeGetForwardRecords } from '@/api/chat'
 import { MessageComponents } from '@/constant/message'
+import { ITalkRecord } from '@/types/chat'
 
 const emit = defineEmits(['close'])
 const props = defineProps({
@@ -11,9 +12,9 @@ const props = defineProps({
     default: 0
   }
 })
-const user = inject('$user')
+const user: any = inject('$user')
 const isShow = ref(true)
-const records = ref([])
+const items = ref<ITalkRecord[]>([])
 const title = ref('会话记录')
 
 const onMaskClick = () => {
@@ -22,18 +23,19 @@ const onMaskClick = () => {
 
 const onLoadData = () => {
   ServeGetForwardRecords({
-    pid: 0,
     record_id: props.recordId
   }).then((res) => {
     if (res.code == 200) {
-      records.value = res.data.items || []
+      items.value = res.data.items || []
 
-      title.value = `会话记录(${records.value.length})`
+      title.value = `会话记录(${items.value.length})`
     }
   })
 }
 
-onLoadData()
+onMounted(() => {
+  onLoadData()
+})
 </script>
 
 <template>
@@ -55,9 +57,9 @@ onLoadData()
     }"
   >
     <div class="main-box me-scrollbar me-scrollbar-thumb">
-      <Loading v-if="records.length === 0" />
+      <Loading v-if="items.length === 0" />
 
-      <div v-for="item in records" :key="item.msg_id" class="message-item">
+      <div v-for="item in items" :key="item.msg_id" class="message-item">
         <div class="left-box pointer" @click="user(item.user_id)">
           <im-avatar :src="item.avatar" :size="30" :username="item.nickname" />
         </div>
diff --git a/src/components/talk/HistoryRecord.vue b/src/components/talk/HistoryRecord.vue
index 5f06e4cc..2c539568 100644
--- a/src/components/talk/HistoryRecord.vue
+++ b/src/components/talk/HistoryRecord.vue
@@ -1,9 +1,10 @@
-<script setup>
-import { ref, reactive, inject } from 'vue'
+<script lang="ts" setup>
+import { ref, reactive, inject, onMounted } from 'vue'
 import Loading from '@/components/base/Loading.vue'
 import { ServeFindTalkRecords } from '@/api/chat'
 import { Down, Calendar } from '@icon-park/vue-next'
 import * as message from '@/constant/message'
+import { ITalkRecord } from '@/types/chat'
 
 const emit = defineEmits(['close'])
 const props = defineProps({
@@ -16,7 +17,7 @@ const props = defineProps({
     default: 0
   }
 })
-const showUserModal = inject('$user')
+const showUserModal: any = inject('$user')
 const model = reactive({
   cursor: 0,
   limit: 30,
@@ -27,7 +28,7 @@ const model = reactive({
 })
 
 const isShow = ref(true)
-const records = ref([])
+const items = ref<ITalkRecord[]>([])
 
 const tabs = [
   { name: '全部', type: 0, show: true },
@@ -64,30 +65,30 @@ const loadChatRecord = () => {
     if (res.code != 200) return
 
     if (data.cursor === 0) {
-      records.value = []
+      items.value = []
     }
 
-    let items = res.data.items || []
-
-    records.value.push(...items)
-
-    if (items.length) {
+    let list = res.data.items || []
+    if (list.length) {
       model.cursor = res.data.cursor
     }
 
     model.loading = false
     model.loadMore = false
-    model.isLoadMore = items.length >= model.limit
+    model.isLoadMore = list.length >= model.limit
+    items.value.push(...list)
   })
 }
 
-const triggerType = (type) => {
+const triggerType = (type: number) => {
   model.msgType = type
   model.cursor = 0
   loadChatRecord()
 }
 
-loadChatRecord()
+onMounted(() => {
+  loadChatRecord()
+})
 </script>
 
 <template>
@@ -147,7 +148,7 @@ loadChatRecord()
         <Loading />
       </main>
 
-      <main v-else-if="records.length === 0" class="el-main flex-center">
+      <main v-else-if="items.length === 0" class="el-main flex-center">
         <n-empty size="200" description="暂无相关数据">
           <template #icon>
             <img src="@/assets/image/no-data.svg" alt="" />
@@ -156,7 +157,7 @@ loadChatRecord()
       </main>
 
       <main v-else class="el-main me-scrollbar me-scrollbar-thumb">
-        <div v-for="item in records" :key="item.id" class="message-item">
+        <div v-for="item in items" :key="item.id" class="message-item">
           <div class="left-box">
             <im-avatar
               :src="item.avatar"
diff --git a/src/components/user/Avatar.vue b/src/components/user/Avatar.vue
deleted file mode 100644
index e69de29b..00000000
diff --git a/src/components/user/EditorEmail.vue b/src/components/user/EditorEmail.vue
index 821a8804..5f900c10 100644
--- a/src/components/user/EditorEmail.vue
+++ b/src/components/user/EditorEmail.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput } from 'naive-ui'
 import { ServeUpdateEmail } from '@/api/user'
diff --git a/src/components/user/EditorMobile.vue b/src/components/user/EditorMobile.vue
index 07c4c4cc..8db2dab6 100644
--- a/src/components/user/EditorMobile.vue
+++ b/src/components/user/EditorMobile.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput } from 'naive-ui'
 import { ServeUpdateMobile } from '@/api/user'
diff --git a/src/components/user/EditorPassword.vue b/src/components/user/EditorPassword.vue
index f881c6cb..8d974a46 100644
--- a/src/components/user/EditorPassword.vue
+++ b/src/components/user/EditorPassword.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import { NModal, NForm, NFormItem, NInput, NButton } from 'naive-ui'
 import { ServeUpdatePassword } from '@/api/user'
@@ -9,29 +9,30 @@ const emit = defineEmits(['update:modelValue', 'close'])
 const formRef = ref()
 
 const model = reactive({
-  oldPassword: '',
-  newPassword: '',
-  newPassword2: ''
+  old_password: '',
+  new_password: '',
+  new_password2: ''
 })
 
 const rules = {
-  oldPassword: {
+  old_password: {
     required: true,
     trigger: ['blur', 'input'],
     message: '登录密码不能为空！'
   },
-  newPassword: {
+  new_password: {
     required: true,
     trigger: ['blur', 'input'],
     message: '新密码不能为空！'
   },
-  newPassword2: {
+  new_password2: {
     required: true,
     trigger: ['blur', 'change'],
     validator(rule, value) {
+      console.log(rule)
       if (!value) {
         return new Error('确认密码不能为空！')
-      } else if (model.newPassword != model.newPassword2) {
+      } else if (model.new_password != model.new_password2) {
         return new Error('两次密码填写不一致！')
       }
 
@@ -46,8 +47,8 @@ const onSubmit = () => {
   loading.value = true
 
   let response = ServeUpdatePassword({
-    old_password: model.oldPassword,
-    new_password: model.newPassword
+    old_password: model.old_password,
+    new_password: model.new_password
   })
 
   response.then((res) => {
@@ -87,19 +88,19 @@ const onValidate = (e) => {
     "
   >
     <n-form ref="formRef" :model="model" :rules="rules">
-      <n-form-item label="登录密码" path="oldPassword">
-        <n-input placeholder="请填写登录密码" type="password" v-model:value="model.oldPassword" />
+      <n-form-item label="登录密码" path="old_password">
+        <n-input placeholder="请填写登录密码" type="password" v-model:value="model.old_password" />
       </n-form-item>
 
-      <n-form-item label="设置新密码" path="newPassword">
-        <n-input placeholder="请填写新密码" type="password" v-model:value="model.newPassword" />
+      <n-form-item label="设置新密码" path="new_password">
+        <n-input placeholder="请填写新密码" type="password" v-model:value="model.new_password" />
       </n-form-item>
 
-      <n-form-item label="确认新密码" path="newPassword2">
+      <n-form-item label="确认新密码" path="new_password2">
         <n-input
           placeholder="请再次填写新密码"
           type="password"
-          v-model:value="model.newPassword2"
+          v-model:value="model.new_password2"
         />
       </n-form-item>
     </n-form>
diff --git a/src/components/user/UserCardModal.vue b/src/components/user/UserCardModal.vue
index 2664e833..ad5c82f0 100644
--- a/src/components/user/UserCardModal.vue
+++ b/src/components/user/UserCardModal.vue
@@ -14,8 +14,14 @@ const talkStore = useTalkStore()
 const emit = defineEmits(['update:show', 'update:uid', 'updateRemark'])
 
 const props = defineProps({
-  show: Boolean,
-  uid: Number
+  show: {
+    type: Boolean,
+    default: false
+  },
+  uid: {
+    type: Number,
+    default: 0
+  }
 })
 
 const loading = ref(true)
diff --git a/src/hooks/useUtil.ts b/src/hooks/useUtil.ts
new file mode 100644
index 00000000..a88b4b85
--- /dev/null
+++ b/src/hooks/useUtil.ts
@@ -0,0 +1,19 @@
+import { getCurrentInstance } from 'vue'
+import type { MessageApiInjection } from 'naive-ui/es/message/src/MessageProvider'
+import type { DialogApiInjection } from 'naive-ui/es/dialog/src/DialogProvider'
+import type { NotificationApiInjection } from 'naive-ui/es/notification/src/NotificationProvider'
+
+export function useUtil() {
+  const ctx = getCurrentInstance()
+
+  if (!ctx) {
+    throw new Error('useUtil must be called in setup function')
+  }
+
+  const message: MessageApiInjection = ctx.appContext.config.globalProperties.$message
+  const dialog: DialogApiInjection = ctx.appContext.config.globalProperties.$dialog
+  const notification: NotificationApiInjection =
+    ctx.appContext.config.globalProperties.$notification
+
+  return { message, dialog, notification }
+}
diff --git a/src/utils/emojis.js b/src/utils/emojis.js
index 12ce13aa..0928019f 100644
--- a/src/utils/emojis.js
+++ b/src/utils/emojis.js
@@ -1,7 +1,7 @@
 /**
  * 动态表情
  */
-const emojis = {
+export const emojis = {
   '[微笑]':
     "<img class='emoji' src='https://res.wx.qq.com/mpres/htmledition/images/icon/emotion/0.gif'>",
   '[撇嘴]':
@@ -170,72 +170,8 @@ const emojis = {
     "<img class='emoji' src='https://res.wx.qq.com/mpres/htmledition/images/icon/emotion/89.gif'>"
 }
 
-/**
- * 符号表情
- */
-const symbol = [
-  '😠',
-  '😩',
-  '😲',
-  '😞',
-  '😵',
-  '😰',
-  '😒',
-  '😍',
-  '😤',
-  '😜',
-  '😝',
-  '😋',
-  '😘',
-  '😚',
-  '😷',
-  '😳',
-  '😃',
-  '😅',
-  '😆',
-  '😁',
-  '😂',
-  '😊',
-  '☺',
-  '😄',
-  '😢',
-  '😭',
-  '😨',
-  '😣',
-  '😡',
-  '😌',
-  '😖',
-  '😔',
-  '😱',
-  '😪',
-  '😏',
-  '😓',
-  '😥',
-  '😫',
-  '😉',
-  '✊',
-  '✋',
-  '✌',
-  '👊',
-  '👍',
-  '☝',
-  '👆',
-  '👇',
-  '👈',
-  '👉',
-  '👋',
-  '👏',
-  '👌',
-  '👎'
-]
-
 const emojisKeys = Object.keys(emojis)
 
-export const emojiList = {
-  symbol,
-  emojis
-}
-
 const regEmoji = emojisKeys
   .map((value) => '|\\' + value)
   .join('')
diff --git a/src/views/contact/inner/FriendApply.vue b/src/views/contact/inner/FriendApply.vue
index af23a99d..7f8c8776 100644
--- a/src/views/contact/inner/FriendApply.vue
+++ b/src/views/contact/inner/FriendApply.vue
@@ -1,4 +1,4 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, onMounted, inject, watch, computed } from 'vue'
 import { NPopconfirm } from 'naive-ui'
 import { Close, CheckSmall } from '@icon-park/vue-next'
@@ -9,10 +9,20 @@ import { useUserStore } from '@/store'
 
 const userStore = useUserStore()
 
-const items = ref([])
+type Item = {
+  id: number
+  user_id: number
+  friend_id: number
+  remark: string
+  nickname: string
+  avatar: string
+  created_at: string
+}
+
+const items = ref<Item[]>([])
 const loading = ref(true)
 
-const user = inject('$user')
+const user: any = inject('$user')
 
 const isContactApply = computed(() => userStore.isContactApply)
 
@@ -32,11 +42,11 @@ const onLoadData = (isClearTip = false) => {
     })
 }
 
-const onInfo = (item) => {
+const onInfo = (item: Item) => {
   user(item.user_id)
 }
 
-const onAccept = throttle((item) => {
+const onAccept = throttle((item: Item) => {
   let loading = window['$message'].loading('请稍等，正在处理')
 
   ServeApplyAccept({
diff --git a/src/views/message/index.vue b/src/views/message/index.vue
index fca556c9..759d6178 100644
--- a/src/views/message/index.vue
+++ b/src/views/message/index.vue
@@ -6,7 +6,6 @@ import IndexSider from './inner/IndexSider.vue'
 import IndexAmicable from './inner/IndexAmicable.vue'
 
 const dialogueStore = useDialogueStore()
-
 const indexName = computed(() => dialogueStore.index_name)
 
 onUnmounted(() => {
diff --git a/src/views/message/inner/IndexContent.vue b/src/views/message/inner/IndexContent.vue
index aabba33d..1c746738 100644
--- a/src/views/message/inner/IndexContent.vue
+++ b/src/views/message/inner/IndexContent.vue
@@ -35,17 +35,17 @@ const state = reactive({
   isShowGroupNotice: false
 })
 
-// Header 工具栏事件
-const onPanelHeaderEvent = (eventType) => {
-  const events = {
-    notice: () => {
-      state.isShowGroupNotice = !state.isShowGroupNotice
-    },
-    group: () => {
-      state.isShowGroupAside = !state.isShowGroupAside
-    }
+const events = {
+  notice: () => {
+    state.isShowGroupNotice = !state.isShowGroupNotice
+  },
+  group: () => {
+    state.isShowGroupAside = !state.isShowGroupAside
   }
+}
 
+// Header 工具栏事件
+const onPanelHeaderEvent = (eventType: string) => {
   events[eventType] && events[eventType]()
 }
 </script>
diff --git a/src/views/message/inner/IndexSider.vue b/src/views/message/inner/IndexSider.vue
index 812a6b84..c80cd2b6 100644
--- a/src/views/message/inner/IndexSider.vue
+++ b/src/views/message/inner/IndexSider.vue
@@ -54,8 +54,6 @@ const onTabTalk = (item: ISession, follow = false) => {
   // 更新编辑信息
   dialogueStore.setDialogue(item)
 
-  // dialogueStore.index_name = `${item.talk_type}_${item.receiver_id}`
-
   // 清空消息未读数
   if (item.unread_num > 0) {
     ServeClearTalkUnreadNum({