Merge branch 'master' of https://git.yuzhankeji.cn/TmOct5/ZhHealth
This commit is contained in:
2
App.vue
2
App.vue
@@ -5,7 +5,7 @@
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
im.initIm('lmxuhwaglu76d')
|
||||
|
||||
return
|
||||
//#ifdef APP-PLUS
|
||||
// 获取系统版本号
|
||||
getVersions({
|
||||
|
||||
@@ -12,7 +12,7 @@ import {
|
||||
// 获取好友列表
|
||||
const getFriends = () => {
|
||||
return request({
|
||||
url: 'im/friends',
|
||||
url: 'im/friends/letter',
|
||||
}, true)
|
||||
}
|
||||
|
||||
|
||||
24
pages.json
24
pages.json
@@ -372,28 +372,8 @@
|
||||
"path": "pages/im/index",
|
||||
"name": "IM",
|
||||
"style": {
|
||||
"navigationBarTitleText": "聊聊",
|
||||
"navigationBarBackgroundColor": "#F3F6FB",
|
||||
"app-plus": {
|
||||
"titleNView": {
|
||||
"buttons": [
|
||||
{
|
||||
"float": "left",
|
||||
"text": "\ue605",
|
||||
"fontSrc": "/static/iconfont.ttf",
|
||||
"color": "#000",
|
||||
"fontSize": "20px"
|
||||
},
|
||||
{
|
||||
"float": "right",
|
||||
"text": "\ue606",
|
||||
"fontSrc": "/static/iconfont.ttf",
|
||||
"color": "#000",
|
||||
"fontSize": "20px"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
"navigationBarBackgroundColor": "#FFFFFF",
|
||||
"navigationStyle":"custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@@ -1,28 +1,37 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-list height="auto">
|
||||
<u-list-item>
|
||||
<u-cell title="新的朋友" @click="toPending">
|
||||
<u-avatar slot="icon" size="35" font-size="24" icon="plus-people-fill" shape="square"
|
||||
bg-color="#f0ad4e"></u-avatar>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
<u-list-item>
|
||||
<u-cell title="我的群聊" @click="showToast">
|
||||
<u-avatar slot="icon" size="35" font-size="24" icon="account-fill" shape="square"
|
||||
bg-color="#4cd964"></u-avatar>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
|
||||
<block v-if="friends.length > 0">
|
||||
<u-list height="auto">
|
||||
<u-list-item v-for="(item, index) in friends" :key="index">
|
||||
<u-cell :title="item.name + item.userId" @click="toInfo(item.userId)">
|
||||
<u-avatar slot="icon" shape="square" size="35" :src="item.portraitUrl"></u-avatar>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
<u-index-list :index-list="indexs" inactiveColor="#666" activeColor="#34CE98">
|
||||
<view>
|
||||
<view class="friend-flex" @click="toPending">
|
||||
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_01.png')"></u-avatar>
|
||||
<view class="name">新的朋友</view>
|
||||
</view>
|
||||
<view class="friend-flex" @click="showToast">
|
||||
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_00.png')"></u-avatar>
|
||||
<view class="name">我的群聊</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-for="(item, friend) in friends">
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<u-index-anchor :text="indexs[friend]" bgColor="#F3F6FB" height="20" size="12" color="#666"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<u-index-item>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<u-index-anchor :text="indexs[friend]" bgColor="#F3F6FB" height="20" size="12" color="#666"></u-index-anchor>
|
||||
<!-- #endif -->
|
||||
<view v-for="(friendItem, index) in item" :key="friendItem.userId" class="friend-flex">
|
||||
<block v-if="friendItem.portraitUrl != ''">
|
||||
<u-avatar class="cover" size="40" shape="square" :src="friendItem.portraitUrl || ''" :default-url="require('@/static/user/cover.png')"></u-avatar>
|
||||
</block>
|
||||
<block v-else>
|
||||
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/user/cover.png')"></u-avatar>
|
||||
</block>
|
||||
<view class="name">{{friendItem.name}}</view>
|
||||
</view>
|
||||
</u-index-item>
|
||||
</template>
|
||||
</u-index-list>
|
||||
</block>
|
||||
<block v-else>
|
||||
<u-empty class="pages-null" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" text="暂无好友">
|
||||
@@ -38,12 +47,16 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
indexs : [],
|
||||
friends: []
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
getFriends().then(res => {
|
||||
this.friends = res
|
||||
this.indexs = res.indexList
|
||||
this.friends = res.itemArr
|
||||
|
||||
console.log(res.itemArr)
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
@@ -76,9 +89,36 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
<style lang="scss" scoped>
|
||||
// 页面空
|
||||
.pages-null {
|
||||
height: 70vh;
|
||||
}
|
||||
// 好友列表
|
||||
.friend-flex{
|
||||
position: relative;
|
||||
padding: 20rpx $padding;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
// .cover
|
||||
.name{
|
||||
flex: 1;
|
||||
padding-left: $padding;
|
||||
font-size: $title-size;
|
||||
@extend .nowrap;
|
||||
}
|
||||
&::after{
|
||||
position: absolute;
|
||||
height: 1rpx;
|
||||
background: $border-color;
|
||||
left: calc(40px + #{$padding * 2});
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
content: " ";
|
||||
}
|
||||
&:last-child::after{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,5 +1,24 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="contents">
|
||||
<view class="ios-top"></view>
|
||||
<!-- header -->
|
||||
<view class="custom-header">
|
||||
<view class="header-flex">
|
||||
<view class="tabs">
|
||||
<view class="item show">私聊</view>
|
||||
<view class="item" @click="onNav('', {})">群聊</view>
|
||||
</view>
|
||||
<view class="btns">
|
||||
<view class="item" @click="onNav('imFriends', {})">
|
||||
<uni-icons color="#555" custom-prefix="iconfont" type="icon-tuandui" size="22"></uni-icons>
|
||||
</view>
|
||||
<view class="item" @click="onNav('', {})">
|
||||
<uni-icons color="#555" custom-prefix="iconfont" type="icon-gengduo2" size="22"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- content -->
|
||||
<view v-if="$store.state.token != ''">
|
||||
<block v-if="conversations.length < 1">
|
||||
<view class="vertical null-list">
|
||||
@@ -12,28 +31,20 @@
|
||||
</block>
|
||||
<block v-else>
|
||||
<u-alert type="warning" v-if="connection != 0" description="网络似乎断开了" :show-icon="true"></u-alert>
|
||||
|
||||
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]"
|
||||
@tap="toDetail(item)" @longpress="onLongPress" :data-item="item">
|
||||
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]" @tap="toDetail(item)" @longpress="onLongPress" :data-item="item">
|
||||
<view class="avatar">
|
||||
<u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-5, -5]"
|
||||
:value="item.unreadMessageCount" />
|
||||
<u-avatar size="44" v-if="!friend(item.targetId).portraitUrl"
|
||||
:text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'"
|
||||
font-size="14" randomBgColor></u-avatar>
|
||||
<u-avatar v-else :src="friend(item.targetId).portraitUrl" size="44">
|
||||
</u-avatar>
|
||||
<u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-5, -5]" :value="item.unreadMessageCount" />
|
||||
<u-avatar size="44" v-if="!friend(item.targetId).portraitUrl" shape="square" :text="friend(item.targetId).name ? friend(item.targetId).name.substring(0,1) : '未'" font-size="16" randomBgColor></u-avatar>
|
||||
<u-avatar v-else :src="friend(item.targetId).portraitUrl" shape="square" size="44"></u-avatar>
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<view class="header">
|
||||
<view class="name">{{ friend(item.targetId).name || '未知用户' }}</view>
|
||||
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
|
||||
</view>
|
||||
<view class="preview">{{ item.latestMessage.content || ' ' }}</view>
|
||||
<view class="preview">{{ item.latestMessage.content || '' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="shade" @tap="hidePop">
|
||||
<view class="pop" :style="popStyle" :class="{'show':showPop}">
|
||||
<view v-for="(item, index) in popButton" :key="index" @tap="pickerMenu" :data-index="index">
|
||||
@@ -58,9 +69,7 @@
|
||||
import * as RongIMLib from '@rongcloud/imlib-uni'
|
||||
import im from '@/utils/im/index.js'
|
||||
import userAuth from '@/public/userAuth'
|
||||
import {
|
||||
getImToken
|
||||
} from '@/apis/interfaces/im.js'
|
||||
import { getImToken } from '@/apis/interfaces/im.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@@ -194,82 +203,128 @@
|
||||
url: '/pages/im/private/index?targetId=' + item.targetId + '&conversationType=' + item
|
||||
.conversationType
|
||||
})
|
||||
},
|
||||
// 点击按钮
|
||||
onNav(name, params){
|
||||
if(this.toLogin){
|
||||
if(name === ''){
|
||||
uni.showToast({
|
||||
title: '开发中,敬请期待',
|
||||
icon : 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$Router.push({name, params})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
// header
|
||||
.custom-header{
|
||||
@extend .ios-top;
|
||||
background: white;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 9999;
|
||||
.header-flex{
|
||||
padding: 20rpx $padding;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
.tabs{
|
||||
.item{
|
||||
margin-left: $margin;
|
||||
display: inline-block;
|
||||
font-size: $title-size-lg;
|
||||
color: $text-gray;
|
||||
padding: 0 ($padding - 10);
|
||||
border-radius: 30rpx;
|
||||
&:first-child{
|
||||
margin: 0;
|
||||
}
|
||||
&.show{
|
||||
background: rgba($color: $main-color, $alpha: .1);
|
||||
color: $main-color;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btns{
|
||||
.item{
|
||||
display: inline-block;
|
||||
margin-left: $margin;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// contents
|
||||
.contents {
|
||||
background-color: $window-color;
|
||||
min-height: 100vh;
|
||||
|
||||
padding-top: 90rpx;
|
||||
box-sizing: border-box;
|
||||
.null-list {
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
|
||||
&-btn {
|
||||
margin-top: $margin * 2;
|
||||
line-height: 70rpx;
|
||||
color: $main-color;
|
||||
border: solid 1rpx $main-color;
|
||||
border: solid 2rpx $main-color;
|
||||
padding: 0 ($padding*3);
|
||||
font-size: $title-size-m;
|
||||
border-radius: 35rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.message {
|
||||
background: white;
|
||||
padding: 20rpx 30rpx;
|
||||
position: relative;
|
||||
display: flex;
|
||||
background: white;
|
||||
padding: 24rpx 24rpx 20rpx 24rpx;
|
||||
|
||||
&.is-top {
|
||||
background: $window-color;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
position: relative;
|
||||
|
||||
.u-badge {
|
||||
z-index: 999;
|
||||
z-index: 998;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-left: 16rpx;
|
||||
flex: 1;
|
||||
|
||||
padding-left: 30rpx;
|
||||
width: calc(100% - 44px);
|
||||
box-sizing: border-box;
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.name {
|
||||
font-size: 36rpx
|
||||
font-size: $title-size + 4;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: 24rpx;
|
||||
font-size: $title-size-sm;
|
||||
color: $text-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.preview {
|
||||
width: 520rpx;
|
||||
word-break: break-all;
|
||||
color: $text-gray;
|
||||
font-size: 26rpx;
|
||||
font-size: $title-size-sm;
|
||||
@extend .nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.message:not(:last-child) {
|
||||
&::after {
|
||||
position: absolute;
|
||||
left: $padding + 108;
|
||||
left: calc(44px + #{$padding} + 30rpx);
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
content: " ";
|
||||
|
||||
BIN
static/.DS_Store
vendored
BIN
static/.DS_Store
vendored
Binary file not shown.
@@ -11,6 +11,10 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-gengduo2:before {
|
||||
content: "\e608";
|
||||
}
|
||||
|
||||
.icon-gengduo:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
Binary file not shown.
BIN
static/im/im_00.png
Normal file
BIN
static/im/im_00.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
BIN
static/im/im_01.png
Normal file
BIN
static/im/im_01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
Reference in New Issue
Block a user