[同步数据]

This commit is contained in:
2022-01-27 17:40:41 +08:00
parent 4d5d595329
commit e147e1c09c

View File

@@ -1,302 +1,275 @@
<template> <template>
<view class="content"> <view class="content">
<!-- 用户信息 --> <!-- 用户信息 -->
<view class="info-flex"> <view class="info-flex">
<u-avatar <u-avatar :src="userInfo.portraitUrl" shape="square" size="50" bg-color="#fff" />
:src="userInfo.portraitUrl" <view class="info-text">
shape="square" <view class="nickname">{{ userInfo.name }}</view>
size="50" <view class="address" @longpress="copyAddress">地址{{ userInfo.address }}</view>
bg-color="#fff" </view>
></u-avatar> </view>
<view class="info-text"> <!-- 用户资料 -->
<view class="nickname">{{userInfo.name}}</view> <view class="info-btns">
<view class="address" @longpress="copyAddress">地址{{userInfo.address}}</view> <view class="item">
</view> <label>性别</label>
</view> <view class="text" v-if="userInfo.gender === 0">保密</view>
<!-- 用户资料 --> <view class="text" v-if="userInfo.gender === 1"></view>
<view class="info-btns"> <view class="text" v-if="userInfo.gender === 2"></view>
<view class="item"> </view>
<label>性别</label> </view>
<view class="text" v-if="userInfo.gender === 0">保密</view>
<view class="text" v-if="userInfo.gender === 1"></view> <block v-if="userInfo.is_friend">
<view class="text" v-if="userInfo.gender === 2"></view> <view class="info-btns">
</view> <view class="item" @click="setRemark">
</view> <label>设置备注</label>
<u-icon name="arrow-right" color="#999" size="16" />
<block v-if="userInfo.is_friend"> </view>
<view class="info-btns"> <view class="item" @click="setRemark">
<view class="item" @click="setRemark"> <label>设置标签</label>
<label>设置备注</label> <u-icon name="arrow-right" color="#999" size="16" />
<u-icon name="arrow-right" color="#999" size="16"></u-icon> </view>
</view> <view class="item">
<view class="item" @click="setRemark"> <label>聊天免打扰</label>
<label>设置标签</label> <u-switch size="22" v-model="status" activeColor="#34CE98" @change="setStatus"></u-switch>
<u-icon name="arrow-right" color="#999" size="16"></u-icon> </view>
</view> <view class="item">
<view class="item"> <label>聊天置顶</label>
<label>聊天免打扰</label> <u-switch size="22" v-model="isTop" activeColor="#34CE98" @change="setTop"></u-switch>
<u-switch size="22" v-model="status" activeColor="#34CE98" @change="setStatus"></u-switch> </view>
</view> </view>
<view class="item"> <view class="footer">
<label>聊天置顶</label> <view class="footer-item" @click="deleteFriend">
<u-switch size="22" v-model="isTop" activeColor="#34CE98" @change="setTop"></u-switch> <view class="icon"><u-icon class="icon-u" name="close-circle-fill" color="#fff" size="26" /></view>
</view> <view class="text">删除好友</view>
</view> </view>
<view class="footer"> <view class="footer-item" @click="toPrivate">
<view class="footer-item" @click="deleteFriend"> <view class="icon"><u-icon class="icon-u" name="chat-fill" color="#fff" size="26" /></view>
<view class="icon"> <view class="text">发送消息</view>
<u-icon class="icon-u" name="close-circle-fill" color="#fff" size="26"></u-icon> </view>
</view> <view class="footer-item" @click="toPrivate">
<view class="text">删除好友</view> <view class="icon"><u-icon class="icon-u" name="camera-fill" color="#fff" size="26" /></view>
</view> <view class="text">视频通话</view>
<view class="footer-item" @click="toPrivate"> </view>
<view class="icon">
<u-icon class="icon-u" name="chat-fill" color="#fff" size="26"></u-icon>
</view>
<view class="text">发送消息</view>
</view>
<view class="footer-item" @click="toPrivate">
<view class="icon">
<u-icon class="icon-u" name="camera-fill" color="#fff" size="26"></u-icon>
</view>
<view class="text">视频通话</view>
</view>
</view> </view>
</block> </block>
<block v-else> <block v-else>
<view class="footer"> <view class="footer">
<view class="footer-item" @click="toBeFriend"> <view class="footer-item" @click="toBeFriend">
<view class="icon"> <view class="icon"><u-icon class="icon-u" name="plus-people-fill" color="#fff" size="26" /></view>
<u-icon class="icon-u" name="plus-people-fill" color="#fff" size="26"></u-icon> <view class="text">申请好友</view>
</view> </view>
<view class="text">申请好友</view>
</view>
</view> </view>
</block> </block>
</view> </view>
</template> </template>
<script> <script>
import { import { getFriendInfo, pedingFriend, deleteFriend } from '@/apis/interfaces/im.js';
getFriendInfo, import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index';
pedingFriend,
deleteFriend
} from '@/apis/interfaces/im.js'
import * as RongIMLib from "@/uni_modules/RongCloud-IMWrapper/js_sdk/index"
export default { export default {
data() { data() {
return { return {
targetId: '', targetId: '',
userInfo: {}, userInfo: {},
status: false, // 0 是免打扰1是正常通知 status: false, // 0 是免打扰1是正常通知
isTop: false, isTop: false,
block: false, block: false,
conversationType: 1 conversationType: 1
};
},
onLoad(e) {
this.targetId = e.targetId;
getFriendInfo(e.targetId).then(res => {
this.userInfo = res;
uni.setNavigationBarTitle({
title: res.name
});
});
RongIMLib.getConversationNotificationStatus(this.conversationType, this.targetId, ({ status }) => {
this.status = !Boolean(status);
});
RongIMLib.getConversation(this.conversationType, this.targetId, ({ code, conversation }) => {
if (code == 0) {
this.isTop = conversation.isTop;
} }
}, });
onLoad(e) { },
this.targetId = e.targetId methods: {
getFriendInfo(e.targetId).then(res => { copyAddress() {
this.userInfo = res uni.setClipboardData({
uni.setNavigationBarTitle({ data: this.userInfo.address,
title: res.name success: () => {
}) uni.showToast({
}) icon: 'none',
RongIMLib.getConversationNotificationStatus(this.conversationType, this.targetId, ({ title: '复制区块链成功'
status });
}) => {
this.status = !Boolean(status)
})
RongIMLib.getConversation(this.conversationType, this.targetId, ({
code,
conversation
}) => {
if (code == 0) {
this.isTop = conversation.isTop
} }
}) });
}, },
methods: { toPrivate() {
copyAddress() { uni.redirectTo({
uni.setClipboardData({ url: '/pages/im/private/index?conversationType=1&targetId=' + this.targetId
data: this.userInfo.address, });
success: () => { },
uni.showToast({ setRemark() {
icon: 'none', uni.showToast({
title: '复制区块链成功' title: '开发中',
}) icon: 'none'
});
},
deleteFriend() {
uni.showModal({
title: '删除确认',
content: '确认删除后不可恢复',
success: e => {
if (e.confirm) {
deleteFriend(this.targetId).then(res => {
// 删除聊天记录
RongIMLib.deleteMessages(1, this.targetId);
RongIMLib.removeConversation(1, this.targetId);
uni.showToast({
icon: 'none',
title: '好友删除成功',
success() {
uni.switchTab({
url: '/pages/im/index'
});
}
});
});
} }
}) }
}, });
toPrivate() { },
uni.redirectTo({ setStatus() {
url: '/pages/im/private/index?conversationType=1&targetId=' + this.targetId RongIMLib.setConversationNotificationStatus(this.conversationType, this.targetId, this.status, ({ status }) => {
}) this.status = !Boolean(status);
}, });
setRemark() { },
uni.showToast({ setTop() {
title: '开发中', RongIMLib.setConversationToTop(this.conversationType, this.targetId, this.isTop, res => {
icon : 'none' RongIMLib.getConversation(this.conversationType, this.targetId, ({ conversation }) => {
}) this.isTop = conversation.isTop;
}, });
deleteFriend() { });
uni.showModal({ },
title: '删除确认', setBlock() {},
content: '确认删除后不可恢复', // 申请好友
success: (e) => { toBeFriend() {
if (e.confirm) { pedingFriend(this.targetId)
deleteFriend(this.targetId).then(res => { .then(res => {
// 删除聊天记录
RongIMLib.deleteMessages(1, this.targetId)
RongIMLib.removeConversation(1, this.targetId)
uni.showToast({
icon: 'none',
title: '好友删除成功',
success() {
uni.switchTab({
url: '/pages/im/index'
})
}
})
})
}
}
})
},
setStatus() {
RongIMLib.setConversationNotificationStatus(this.conversationType, this.targetId, this.status, ({
status
}) => {
this.status = !Boolean(status)
})
},
setTop() {
RongIMLib.setConversationToTop(this.conversationType, this.targetId, this.isTop, (res) => {
RongIMLib.getConversation(this.conversationType, this.targetId, ({
conversation
}) => {
this.isTop = conversation.isTop
})
})
},
setBlock() {
},
// 申请好友
toBeFriend() {
pedingFriend(this.targetId).then(res => {
uni.showToast({ uni.showToast({
title: '申请成功', title: '申请成功',
icon: "none" icon: 'none'
}) });
}).catch(err => { })
.catch(err => {
uni.showToast({ uni.showToast({
icon: 'error', icon: 'error',
title: err.message, title: err.message,
duration: 2000 duration: 2000
}) });
}) });
}
} }
}; }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
min-height: 100vh; min-height: 100vh;
background: $window-color; background: $window-color;
padding-top: $padding; padding-top: $padding;
box-sizing: border-box;
}
// 用户信息
.info-flex {
padding: $padding;
margin: 0 $margin;
display: flex;
background: white;
border-radius: $radius;
.info-text {
width: calc(100% - 50px);
padding-left: $padding;
box-sizing: border-box; box-sizing: border-box;
} .nickname {
line-height: 30px;
// 用户信息 font-size: $title-size + 6;
.info-flex{ color: $text-color;
padding: $padding; text-align: left;
margin: 0 $margin; }
display: flex; .address {
background: white; line-height: 20px;
border-radius: $radius; font-size: $title-size-sm;
.info-text{ color: $text-gray;
width: calc(100% - 50px); text-align: left;
padding-left: $padding; @extend .nowrap;
box-sizing: border-box; }
.nickname{ }
line-height: 30px; }
font-size: $title-size + 6;
color: $text-color; // footer
text-align: left; .footer {
} position: fixed;
.address{ bottom: 0;
line-height: 20px; left: 0;
font-size: $title-size-sm; right: 0;
color: $text-gray; padding: $padding * 2 $padding;
text-align: left; display: flex;
@extend .nowrap; justify-content: space-around;
} .footer-item {
} margin: 0 $margin/2;
} text-align: center;
.icon {
// footer background: $main-color;
.footer{ width: 88rpx;
position: fixed; height: 88rpx;
bottom: 0; line-height: 88rpx;
left: 0; display: inline-block;
right: 0; border-radius: 50%;
padding: $padding*2 $padding; .icon-u {
display: flex; margin-top: calc((88rpx / 2) - 13px);
justify-content: space-around; margin-left: calc((88rpx / 2) - 13px);
.footer-item{ }
margin: 0 $margin/2; }
text-align: center; .text {
.icon{ color: $main-color;
background: $main-color; font-size: $title-size-m;
width: 88rpx; text-align: center;
height: 88rpx; padding-top: 10rpx;
line-height: 88rpx; }
display: inline-block; }
border-radius: 50%; }
.icon-u{
margin-top: calc((88rpx/2) - 13px); // btns
margin-left: calc((88rpx/2) - 13px);
} .info-btns {
} background: white;
.text{ margin: $margin;
color: $main-color; border-radius: $radius;
font-size: $title-size-m; .item {
text-align: center; line-height: 100rpx;
padding-top: 10rpx; border-bottom: solid 1rpx $border-color;
} display: flex;
} align-items: center;
} padding: 0 $padding;
justify-content: space-between;
// btns font-size: $title-size-lg;
&:last-child {
.info-btns{ border-bottom: none;
background: white; }
margin: $margin; label {
border-radius: $radius; width: 200rpx;
.item{ }
line-height: 100rpx; .text {
border-bottom: solid 1rpx $border-color; width: calc(100% - 200rpx);
display: flex; color: $text-gray-m;
align-items: center; text-align: right;
padding: 0 $padding; @extend .nowrap;
justify-content: space-between; }
font-size: $title-size-lg; }
&:last-child{ }
border-bottom: none;
}
label{
width: 200rpx;
}
.text{
width: calc(100% - 200rpx);
color: $text-gray-m;
text-align: right;
@extend .nowrap;
}
}
}
</style> </style>