re
This commit is contained in:
唐明明
@@ -1,19 +1,28 @@
|
||||
import {
|
||||
request
|
||||
} from '../index'
|
||||
|
||||
const getImToken = () => {
|
||||
return request({
|
||||
url: 'im/token',
|
||||
}, true)
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Web唐明明
|
||||
* 匆匆数载恍如梦，岁月迢迢华发增。
|
||||
* 碌碌无为枉半生，一朝惊醒万事空。
|
||||
* moduleName: 聊聊
|
||||
*/
|
||||
|
||||
import { request } from '../index'
|
||||
|
||||
// 获取好友列表
|
||||
const getFriends = () => {
|
||||
return request({
|
||||
url: 'im/friends',
|
||||
}, true)
|
||||
}
|
||||
|
||||
|
||||
// 获取融云token
|
||||
const getImToken = () => {
|
||||
return request({
|
||||
url: 'im/token',
|
||||
}, true)
|
||||
}
|
||||
|
||||
// 获取用户信息
|
||||
const getUserInfo = (targetId) => {
|
||||
return request({
|
||||
url: 'im/userInfo/' + targetId,
|
||||
@@ -29,7 +38,6 @@ const getPedings = () => {
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export {
|
||||
getImToken,
|
||||
getFriends,
|
||||
|
||||
18
pages.json
18
pages.json
@@ -420,14 +420,28 @@
|
||||
"path": "pages/im/friends/index",
|
||||
"name": "imFriends",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的好友"
|
||||
"navigationBarTitleText": "我的好友",
|
||||
"app-plus": {
|
||||
"titleNView": {
|
||||
"type": "default",
|
||||
"buttons": [
|
||||
{
|
||||
"float": "right",
|
||||
"fontSrc": "/static/iconfont.ttf",
|
||||
"text": "\ue603",
|
||||
"fontSize": "20px"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/im/friends/pending",
|
||||
"name": "imFriendsPending",
|
||||
"style": {
|
||||
"navigationBarTitleText": "新的朋友"
|
||||
"navigationBarTitleText": "新的朋友",
|
||||
"navigationBarBackgroundColor":"#FFFFFF"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@@ -6,135 +6,120 @@
|
||||
<text class="list__item__user-name">新的朋友</text>
|
||||
</view>
|
||||
<u-line></u-line>
|
||||
<view class="list__item" @click="toGroup">
|
||||
<view class="list__item" @click="showToast">
|
||||
<u-avatar size="35" icon="account-fill" fontSize="26" bg-color="#4cd964"></u-avatar>
|
||||
<text class="list__item__user-name">我的群聊</text>
|
||||
</view>
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
|
||||
<u-index-list :indexList="indexList" activeColor="#34CE98">
|
||||
<template v-for="(item, index) in itemArr">
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<u-index-anchor bgColor="#F3F6FB" color="#666" :text="indexList[index]" :key="index"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<u-index-item :key="index">
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<u-index-anchor :text="indexList[index]" bgColor="#F3F6FB" color="#666"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<view class="list" v-for="(item1, index1) in item" :key="index1">
|
||||
<view class="list__item" @click="toInfo(10047)">
|
||||
<image class="list__item__avatar" :src="item1.url"></image>
|
||||
<!-- <u-avatar size="35" icon="chrome-circle-fill" fontSize="26" randomBgColor></u-avatar> -->
|
||||
<text class="list__item__user-name">{{item1.name}}</text>
|
||||
</view>
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
</u-index-item>
|
||||
</template>
|
||||
<view slot="footer" class="u-safe-area-inset--bottom">
|
||||
<text class="list__footer">共305位好友</text>
|
||||
</view>
|
||||
</u-index-list>
|
||||
<block v-if="friendsArr.length > 0">
|
||||
<u-index-list activeColor="#34CE98">
|
||||
<template v-for="(item, index) in friendsArr">
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<u-index-anchor bgColor="#F3F6FB" color="#666" :text="indexList[index]" :key="index"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<u-index-item :key="index">
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<u-index-anchor :text="indexList[index]" bgColor="#F3F6FB" color="#666"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<view class="list" v-for="(item1, index1) in item" :key="index1">
|
||||
<view class="list__item" @click="toInfo(10047)">
|
||||
<image class="list__item__avatar" :src="item1.url"></image>
|
||||
<!-- <u-avatar size="35" icon="chrome-circle-fill" fontSize="26" randomBgColor></u-avatar> -->
|
||||
<text class="list__item__user-name">{{item1.name}}</text>
|
||||
</view>
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
</u-index-item>
|
||||
</template>
|
||||
<view slot="footer" class="u-safe-area-inset--bottom">
|
||||
<text class="list__footer">共305位好友</text>
|
||||
</view>
|
||||
</u-index-list>
|
||||
</block>
|
||||
<block v-else>
|
||||
<u-empty
|
||||
class="pages-null"
|
||||
mode="data"
|
||||
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
||||
text="暂未添加好友"
|
||||
>
|
||||
</u-empty>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const indexList = () => {
|
||||
const indexList = []
|
||||
const charCodeOfA = 'A'.charCodeAt(0)
|
||||
indexList.push("↑")
|
||||
indexList.push("☆")
|
||||
for (let i = 0; i < 26; i++) {
|
||||
indexList.push(String.fromCharCode(charCodeOfA + i))
|
||||
}
|
||||
indexList.push('#')
|
||||
return indexList
|
||||
}
|
||||
<script>
|
||||
import { getFriends } from '@/apis/interfaces/im'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
indexList: indexList(),
|
||||
urls: [
|
||||
'https://cdn.uviewui.com/uview/album/1.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/2.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/3.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/4.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/5.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/6.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/7.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/8.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/9.jpg',
|
||||
'https://cdn.uviewui.com/uview/album/10.jpg',
|
||||
],
|
||||
names: ["勇往无敌", "疯狂的迪飙", "磊爱可", "梦幻梦幻梦", "枫中飘瓢", "飞翔天使",
|
||||
"曾经第一", "追风幻影族长", "麦小姐", "胡格罗雅", "Red磊磊", "乐乐立立", "青龙爆风", "跑跑卡叮车", "山里狼", "supersonic超"
|
||||
]
|
||||
friendsArr: []
|
||||
}
|
||||
},
|
||||
},
|
||||
onShow() {
|
||||
getFriends().then(res => {
|
||||
this.friendsArr = res
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
itemArr() {
|
||||
return this.indexList.map(item => {
|
||||
const arr = []
|
||||
for (let i = 0; i < 10; i++) {
|
||||
arr.push({
|
||||
name: this.names[uni.$u.random(0, this.names.length - 1)],
|
||||
url: this.urls[uni.$u.random(0, this.urls.length - 1)]
|
||||
})
|
||||
}
|
||||
return arr
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
methods: {
|
||||
// 扫码提示
|
||||
showToast(){
|
||||
uni.showToast({
|
||||
title: "群聊功能暂未开放，敬请期待",
|
||||
icon : "none"
|
||||
})
|
||||
},
|
||||
// 新朋友
|
||||
toPending() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/im/friends/pending'
|
||||
})
|
||||
},
|
||||
toGroup() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/im/group/index',
|
||||
fail: (err) => {
|
||||
console.log(err);
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
// 用户资料
|
||||
toInfo(targetId) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/im/friends/info?targeId=' + targetId
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
onNavigationBarButtonTap(e) {
|
||||
this.toPending()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.list {
|
||||
|
||||
&__item {
|
||||
@include flex;
|
||||
padding: 6px 12px;
|
||||
align-items: center;
|
||||
|
||||
&__avatar {
|
||||
height: 35px;
|
||||
width: 35px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
&__user-name {
|
||||
font-size: 16px;
|
||||
margin-left: 10px;
|
||||
color: $u-main-color;
|
||||
}
|
||||
}
|
||||
|
||||
&__footer {
|
||||
color: $u-tips-color;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
margin: 15px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 页面空
|
||||
.pages-null{
|
||||
height: 70vh;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,14 +1,69 @@
|
||||
<template>
|
||||
<div>
|
||||
<search></search>
|
||||
|
||||
<list></list>
|
||||
好友搜索，好友申请列表 都会在这个页面
|
||||
</div>
|
||||
<view>
|
||||
<!-- 搜索 -->
|
||||
<view class="header-search">
|
||||
<u-search placeholder="输入手机号码搜索" v-model="searchValue"></u-search>
|
||||
</view>
|
||||
<!-- 新朋友 -->
|
||||
<view class="lists">
|
||||
<view class="lists-item" v-for="(item, index) in 10" :key="index">
|
||||
<image class="lists-item-cover" src="" mode="aspectFill"></image>
|
||||
<view class="">好友</view>
|
||||
<view class="">
|
||||
<text>通过</text>
|
||||
<text>拒绝</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空列表 -->
|
||||
<view class="">
|
||||
空列表
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default{
|
||||
data(){
|
||||
return{
|
||||
searchValue: "",
|
||||
listsArr: []
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style lang="scss" scoped>
|
||||
.header-search{
|
||||
padding: $padding/2 $padding;
|
||||
background: white;
|
||||
}
|
||||
// 好友列表
|
||||
.lists{
|
||||
.lists-item{
|
||||
padding: 20rpx $padding;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
&::after{
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: $margin;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 1rpx;
|
||||
background-color: $border-color;
|
||||
}
|
||||
&:last-child::after{
|
||||
display: none;
|
||||
}
|
||||
.lists-item-cover{
|
||||
width: 98rpx;
|
||||
height: 98rpx;
|
||||
border-radius: 50%;
|
||||
background: $window-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -90,10 +90,12 @@
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
if (e.index == 1) {
|
||||
this.$Router.push({
|
||||
name: 'imFriends'
|
||||
})
|
||||
if (e.index == 1) {
|
||||
if(this.toLogin()){
|
||||
this.$Router.push({
|
||||
name: 'imFriends'
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<view class="chat-content">
|
||||
<scroll-view class="chat-scrool" :scroll-y="true" :scroll-into-view="scrollIntoID"
|
||||
:scroll-with-animation="false">
|
||||
<scroll-view class="chat-scrool" :scroll-y="true" :scroll-into-view="scrollIntoID" :scroll-with-animation="false">
|
||||
<!-- 聊天窗口 -->
|
||||
<view class="chat-item" v-for="(item,index) in messages" :key="index" :id="'chatId_'+index">
|
||||
<view class="chat-item-time">
|
||||
|
||||
Reference in New Issue
Block a user