添加IM接口

src/api/path/im.api.js

@@ -11,7 +11,28 @@ export function uploadFile(param) {
   return service.post('file', param);
 }
 
-// 获取用户信息
+// 修改用户信息
 export function userInfoEdit(param) {
   return service.put('user', param );
 }
+
+// 获取用户列表 
+export function userList(params) {
+  return service.get('user', { params });
+}
+
+// 添加好友
+export function userFriend(param) {
+  return service.post('friend', param);
+}
+
+// 获取用户详情
+export function userUuid(id) {
+  return service.get(`user/${id}`);
+}
+
+// 获取消息
+export function getmessage(params) {
+  return service.get('message', { params });
+}
+

src/views/im/chat/index.vue

@@ -70,8 +70,11 @@
 <script setup> 
 import { useRouter } from "vue-router";
 import { Keyboard } from '@capacitor/keyboard';
-
+import { getmessage } from "@/api/path/im.api";
+import { useWalletStore } from "@/stores/modules/walletStore";
+const walletStore = useWalletStore();
 const router = useRouter();
+const route = useRoute();
 
 const text = ref("");
 const keyboardHeight = ref(10);
@@ -99,8 +102,15 @@ const setupKeyboardListeners = async () => {
     keyboardHeight.value = 10;
   });
 };
+// 获取消息数据
+const getmessageList = async () => {
+  const res = await getmessage({messageType:1,uuid:walletStore.account,friendUsername:route.query.uuid});
+  console.log(res)
+}
 
-
+onMounted(()=>{
+  getmessageList();
+})
 onUnmounted(() => {
   Keyboard.removeAllListeners();
 });

src/views/im/index.vue

@@ -31,16 +31,16 @@
         <span>请输入关键词</span>
       </div>
       <div class="message-list">
-        <div class="list-item" v-for="item in 20" :key="item" @click="goToChat">
-          <van-image class="item-img" round src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"/>
+        <div class="list-item" v-for="(item,i) in list" :key="i" @click="goToChat(item.uuid)">
+          <van-image class="item-img" round :src="item.avatar"/>
           <div class="item-content">
             <div class="item-top">
-              <div>素</div>
-              <div class="col">18:05</div>
+              <div>{{item.nickname}}</div>
+              <div class="col">{{item.createAt}}</div>
             </div>
             <div class="item-bottom">
-              <div class="col m-ellipsis">我们已经相互关注，开始聊天吧我们已经相互关注，开始聊天吧我们已经相互关注，开始聊天吧我们已经相互关注，开始聊天吧</div>
-              <div class="notice">1</div>
+              <div class="col m-ellipsis">我们已经相互关注，开始聊天吧</div>
+              <div class="notice" v-if="notice">1</div>
             </div>
           </div>
         </div>
@@ -74,49 +74,38 @@
 </template>
 
 <script setup>
+import { useWalletStore } from "@/stores/modules/walletStore";
+import { userList } from "@/api/path/im.api";
 import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 import Discover from './components/Discover/Discover.vue'
 import { onMounted } from "vue"
-import { LocalNotifications } from '@capacitor/local-notifications';
-
+const walletStore = useWalletStore();
 const router = useRouter();
+
+
 const activeTab = ref(0)
 const showDot = ref(true)
 const showSheet = ref(false);
+const list = ref([]);
+const notice = ref(false)
 
-// 请求通知权限
-const   requestPermissions = async   () => {
-  // 获取权限
-  const result = await LocalNotifications.requestPermissions();
-  console.log('Permission result:', result);
-}
-
-const scheduleNotification = async   () => {
- 
-  await requestPermissions()
-
-  await LocalNotifications.schedule({
-    notifications: [
-      {
-        title: "更新通知。",
-        body: "最新版本：1.0.0 「重大升级」",
-        id: 1, // 唯一ID
-        sound: "default", // iOS必须设置声音:cite[5]
-        schedule: { at: new Date(Date.now() + 5000) } // 5秒后触发
-      }
-    ]
-  });
+const getuserList = async () => {
+  const res = await userList({uuid:walletStore.account});
+  list.value = res.data;
 }
 
-const goToChat = () => {
-  router.push('chat')
+const goToChat = (uuid) => {
+  router.push({
+    path: 'chat',
+    query:{uuid}
+  })
 }
 const goToPage = (url) => {
   router.push(url)
 }
 onMounted(()=>{
-  // scheduleNotification()
+  getuserList();
 })
 </script>
 

src/views/im/personal/index.vue

@@ -1,14 +1,14 @@
 <template>
     <div class="container">
         <div class="personal-box">
-            <van-image class="box-img" round src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"/>
+            <van-image class="box-img" round :src="userInfo.avatar"/>
             <div class="box-text">
-                <div class="box-name">名字名字</div>
-                <div>2545455767</div>
+                <div class="box-name">{{userInfo.nickname}}</div>
+                <div>{{userInfo.uuid}}</div>
             </div>
         </div>
         <van-cell-group class="user-bar-list">
-            <van-cell title="备注" value="未设置" @click="showNote = true">
+            <van-cell title="备注" value="未设置" @click="showNote = true" v-if="route.query.type != 1">
                 <template #icon>
                     <svg-icon class="user-bar-list-icon" name="bz"/>
                 </template>
@@ -27,19 +27,22 @@
                 </template>
             </van-cell>
         </van-cell-group>
-        <div class="card-box">
+        <div class="card-box" v-if="route.query.type != 1">
             <div class="card-box-text green">发消息</div>
             <div class="card-box-text blue">音视频通话</div>
             <div class="card-box-text red">删除好友</div>
         </div>
-        <van-button class="add-btn" type="primary" size="large" color="#4765DD">添加好友</van-button>
+        <van-button 
+            v-if="route.query.type == 1" 
+            class="add-btn" type="primary" size="large" color="#4765DD" @click="showNote = true">添加好友
+        </van-button>
         <van-popup v-model:show="showNote" :style="{ borderRadius:'25px' }">
             <div class="pop-content-password">
-                <div class="pop-title-password">请修改备注</div>
+                <div class="pop-title-password">{{route.query.type == 1?'请输入验证信息':'请修改备注'}}</div>
                 <van-field v-model="note" class="pop-input"/>
                 <div class="pop-btn-password">
-                    <van-button type="default" class="btn-password cancel" @click="showNote = false">{{ $t('wallet.Cancel') }}</van-button>
-                    <van-button type="default" class="btn-password confirm" @click="showNote = false">{{ $t('wallet.Sure') }}</van-button>
+                    <van-button type="default" class="btn-password cancel" @click="cancel">{{ $t('wallet.Cancel') }}</van-button>
+                    <van-button type="default" class="btn-password confirm" @click="confirm">{{ $t('wallet.Sure') }}</van-button>
                 </div>
             </div>
         </van-popup>
@@ -47,8 +50,40 @@
 </template>
 
 <script setup>
+import { userUuid,userFriend } from "@/api/path/im.api";
+import { useWalletStore } from "@/stores/modules/walletStore";
+const route = useRoute();
+const walletStore = useWalletStore();
+// route.query.type // 1:添加好友   2.查看用户信息
+
 const showNote = ref(false);
-const note = ref('')
+const note = ref('');
+const userInfo = ref({});
+// 获取用户信息
+const getuserUuid = async () => {
+    const res = await userUuid(route.query.uuid);
+    userInfo.value = res.data || null;
+}
+// 取消
+const cancel = () => {
+    showNote.value = false;
+    note.value = ''
+}
+// 确定
+const confirm = () => {
+    if(route.query.type == 1){
+        getuserFriend();
+    }
+}
+// 添加好友接口
+const getuserFriend = async () => {
+    const res = await userFriend({uuid:walletStore.account,friendUsername:route.query.uuid});
+    showNote.value = false;
+}
+
+onMounted(()=>{
+    getuserUuid();
+})
 </script>
 
 <style lang="less" scoped>

src/views/im/search/index.vue

@@ -1,41 +1,53 @@
 <template>
     <div class="container">
         <van-search class="search-item"
-            v-model="value"
+            v-model="userAddress"
             show-action
             placeholder="请输入用户账号进行搜索"
-            @search="onSearch"
         >
             <template #left-icon>
                 <svg-icon class="search-icon" name="search" />
             </template>
             <template #action>
-                <van-button type="default" class="action-btn">搜索</van-button>
+                <van-button type="default" class="action-btn" @click="changeSearch">搜索</van-button>
             </template>
         </van-search>
-        <div class="content">
+        <div class="content" v-if="Object.keys(userInfo).length > 0">
             <div class="text-lf">
-                <van-image class="lf-img" round src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"/>
-                <div>哈哈哈哈</div>
+                <van-image class="lf-img" round :src="userInfo.avatar"/>
+                <div>{{userInfo.nickname}}</div>
             </div>
             <div class="rg-color" @click="goToPage">查看</div>
         </div>
-        <!-- <div class="no-more">
+        <div class="no-more" v-else>
             <svg-icon class="no-more-img" name="no-more" />
             <div>暂无数据</div>
-        </div> -->
+        </div>
     </div>
 </template>
 
 <script setup>
+import { userUuid } from "@/api/path/im.api";
 const router = useRouter()
 
-const value = ref('');
-const onSearch = () => {
-    
-}
+const userAddress = ref('');
+const userInfo = ref({});
+
+
 const goToPage = () => {
-    router.push('personal')
+    router.push({
+        path: 'personal',
+        query:{
+            uuid:userAddress.value,
+            type:1
+        }
+    })
+}
+// 搜索
+const changeSearch = async () => {
+    if(!userAddress.value) return;
+    const res = await userUuid(userAddress.value);
+    userInfo.value = res.data || null;
 }
 </script>