commie/im
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

7

Browse Source
This commit is contained in:
cansnow
2025-11-27 07:40:32 +08:00
parent 198c3dd4a5
commit ab625e6463
17 changed files with 1092 additions and 1135 deletions
Download Patch File Download Diff File Expand all files Collapse all files
App.vue
+6
View File
@@ -314,6 +314,12 @@
this.$store.dispatch("contact/getSentGroupApplications");
uni.switchTab({
url: "/pages/conversation/conversationList/index?isRedirect=true",
success() {
// uni.navigateTo({
// url:'/pages/workbench/friend-circle/friend-circle'
// })
}
});
};
getDbDir()
api/login.js
+41 -33
View File
@@ -1,4 +1,7 @@
import { reject } from "lodash";
import config from "@/common/config";
// 登录
export const businessConfig = (params) =>
uni.$u?.http.post("/common/init", JSON.stringify(params));
// 验证是否升级
@@ -78,40 +81,45 @@ export const businessSearchUser = (keyword,searchtype) =>
},
}
);
export const getArticle = (id,type) =>
uni.$u?.http.post(
"/article/detail",
JSON.stringify({
id,
type:(type? type : 'id')
}), {
header: {
token: uni.getStorageSync("BusinessToken"),
},
}
);
export const getArticle = (id,type) => uni.$u?.http.post("/article/detail",JSON.stringify({id,type:(type? type : 'id')}));
export const getFriendCircle = (page=1,limit=10) =>{
uni.$u?.http.get(
"/friend_circle/list",
JSON.stringify({
limit:limit,
page:page
}),
{
header: {
token: uni.getStorageSync("BusinessToken"),
},
}
);
return uni.$u?.http.get("/friendcircle/list",JSON.stringify({limit:limit,page:page}));
}
export const getFriendCircleNewcount = () =>{
uni.$u?.http.get(
"/friend_circle/newcount",
JSON.stringify({}),
{
header: {
token: uni.getStorageSync("BusinessToken"),
},
}
);
return uni.$u?.http.get("/friendcircle/newcount");
}
export const getFriendCircleInfo = () =>{
return uni.$u?.http.get("/friendcircle/info");
}
export const upload = (url,onProgress) =>{
return new Promise((resolve,reject)=>{
var u = uni.uploadFile({
url: config.getRegisterUrl()+"/user/upload", // 仅为示例，非真实的接口地址
filePath: url,
name: "file",
header:{
token:uni.getStorageSync("BusinessToken"),
},
success({data,errMsg}){
console.log(data);
data = JSON.parse(data);
if(data.code == 0){
resolve(data);
}else{
reject(data.msg);
}
},
fail(res) {
console.log(e);
reject(e);
}
});
u.onProgressUpdate((e)=>{
var res = {
'code' : 99999,
'progress' : e.progress
}
onProgress && onProgress.call(this,res);
})
})
}
common/config.js
+1 -1
View File
@@ -18,7 +18,7 @@ const getApiUrl = () => uni.getStorageSync("IMApiUrl") || API_URL;
const getWsUrl = () => uni.getStorageSync("IMWsUrl") || WS_URL;
module.exports = {
cdnUrl:BASE_DOMAIN,
cdnUrl:"http://"+BASE_DOMAIN,
version,
getRegisterUrl,
getApiUrl,
pages.json
+34 -3
View File
@@ -269,22 +269,53 @@
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/workbench/friend-circle/releaseFriendCircle",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/workbench/friend-circle/chooseLocation",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/workbench/friend-circle/chooseCircleBgImg",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/workbench/friend-circle/builtinBgImg",
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/common/userOrGroupQrCode",
"style": {
"navigationBarTitleText": ""
}
}
],
"tabBar": {
"color": "#171717",
"selectedColor": "#07c160",
"borderStyle": "#f4f4f4",
"backgroundColor": "#f4f4f4",
"backgroundColor": "rgba(244,244,244,0.8)",
"height": "55px",
"list": [{
"list": [
{
"pagePath": "pages/conversation/conversationList/index",
"iconPath": "./static/images/tabbar/conversation.png",
"selectedIconPath": "static/images/tabbar/conversation_active.png",
"text": "消息"
},
{
"pagePath": "pages/contact/index/index",
"pagePath": "pages/contact/friendList/index",
"iconPath": "./static/images/tabbar/contacts.png",
"selectedIconPath": "static/images/tabbar/contacts_active.png",
"text": "通讯录"
pages/common/userCard/index.vue
-1
View File
@@ -159,7 +159,6 @@
...imData,
...res.data[0],
};
console.log(info)
}
} catch (e) {
info = {};
pages/contact/applicationList/ApplicationItem.vue
+210 -221
View File
@@ -1,246 +1,235 @@
<template>
<view @click="clickItem" class="application_item">
<my-avatar
:src="getAvatarUrl"
:isGroup="isGroupApplication"
:desc="application[isRecv ? 'fromNickname' : 'toNickname']"
size="42"
/>
<view class="application_item_details">
<view class="content">
<text class="user_name">{{ getShowName }}</text>
<view @click="clickItem" class="application_item">
<my-avatar :src="getAvatarUrl" :isGroup="isGroupApplication"
:desc="application[isRecv ? 'fromNickname' : 'toNickname']" size="42" />
<view class="application_item_details">
<view class="content">
<text class="user_name">{{ getShowName }}</text>
<view v-if="isGroupApplication" class="title">
申请加入
<text class="group_name">{{ application.groupName }}</text>
</view>
<text class="req_message">{{ application.reqMsg }}</text>
</view>
<view v-if="isGroupApplication" class="title">
申请加入
<text class="group_name">{{ application.groupName }}</text>
</view>
<text class="req_message">{{ application.reqMsg }}</text>
</view>
<view class="application_action">
<text v-if="showStateStr" class="status_tip">{{ getStateStr }}</text>
<text v-if="showGreet" @tap.stop="greetToUser" class="status_tip greet"
>打招呼</text
>
<button
:loading="accessLoading"
v-if="showAccept"
class="access_btn"
@tap.stop="acceptApplication"
type="primary"
:plain="true"
size="mini"
>
{{ isGroupApplication ? "同意" : "接受" }}
</button>
</view>
<view class="application_action">
<text v-if="showStateStr" class="status_tip">{{ getStateStr }}</text>
<text v-if="showGreet" @tap.stop="greetToUser" class="status_tip greet">打招呼</text>
<button :loading="accessLoading" v-if="showAccept" class="access_btn" @tap.stop="acceptApplication"
type="primary" :plain="true" size="mini">
{{ isGroupApplication ? "同意" : "接受" }}
</button>
</view>
<view class="bottom_line"> </view>
</view>
</view>
<view class="bottom_line"> </view>
</view>
</view>
</template>
<script>
import { navigateToDesignatedConversation } from "@/util/imCommon";
import IMSDK, { SessionType } from "openim-uniapp-polyfill";
import MyAvatar from "@/components/MyAvatar/index.vue";
export default {
name: "ApplicationItem",
components: {
MyAvatar,
},
props: {
application: Object,
isRecv: Boolean,
},
data() {
return {
accessLoading: false,
};
},
computed: {
isGroupApplication() {
return this.application.groupID !== undefined;
},
getShowName() {
if (this.isRecv) {
return this.application[
this.isGroupApplication ? "nickname" : "fromNickname"
];
}
return this.application[
this.isGroupApplication ? "groupName" : "toNickname"
];
},
showGreet() {
return !this.isGroupApplication && this.application.handleResult === 1;
},
showStateStr() {
if (
(this.isRecv && this.application.handleResult === 0) ||
this.showGreet
) {
return false;
}
return true;
},
showAccept() {
return this.application.handleResult === 0 && this.isRecv;
},
getStateStr() {
if (this.application.handleResult === -1) {
return "已拒绝";
}
if (this.application.handleResult === 0) {
return "等待验证";
}
return "已同意";
},
getAvatarUrl() {
if (this.isGroupApplication) {
return this.application.groupFaceURL;
}
return this.application[this.isRecv ? "fromFaceURL" : "toFaceURL"];
},
},
methods: {
clickItem() {
if (this.showAccept) {
uni.navigateTo({
url: `/pages/contact/applicationDetails/index?application=${JSON.stringify(
import {
navigateToDesignatedConversation
} from "@/util/imCommon";
import IMSDK, {
SessionType
} from "openim-uniapp-polyfill";
import MyAvatar from "@/components/MyAvatar/index.vue";
export default {
name: "ApplicationItem",
components: {
MyAvatar,
},
props: {
application: Object,
isRecv: Boolean,
},
data() {
return {
accessLoading: false,
};
},
computed: {
isGroupApplication() {
return this.application.groupID !== undefined;
},
getShowName() {
if (this.isRecv) {
return this.application[
this.isGroupApplication ? "nickname" : "fromNickname"
];
}
return this.application[
this.isGroupApplication ? "groupName" : "toNickname"
];
},
showGreet() {
return !this.isGroupApplication && this.application.handleResult === 1;
},
showStateStr() {
if (
(this.isRecv && this.application.handleResult === 0) ||
this.showGreet
) {
return false;
}
return true;
},
showAccept() {
return this.application.handleResult === 0 && this.isRecv;
},
getStateStr() {
if (this.application.handleResult === -1) {
return "已拒绝";
}
if (this.application.handleResult === 0) {
return "等待验证";
}
return "已同意";
},
getAvatarUrl() {
if (this.isGroupApplication) {
return this.application.groupFaceURL;
}
return this.application[this.isRecv ? "fromFaceURL" : "toFaceURL"];
},
},
methods: {
clickItem() {
if (this.showAccept) {
uni.navigateTo({
url: `/pages/contact/applicationDetails/index?application=${JSON.stringify(
this.application,
)}`,
});
} else {
let sourceID =
this.application.groupID ??
(this.isRecv
? this.application.fromUserID
: this.application.toUserID);
let cardType = this.isGroupApplication ? "groupCard" : "userCard";
const url = `/pages/common/${cardType}/index?sourceID=${sourceID}`;
uni.navigateTo({
url,
});
}
},
acceptApplication() {
this.accessLoading = true;
let func;
if (this.isGroupApplication) {
func = IMSDK.asyncApi(
IMSDK.IMMethods.AcceptGroupApplication,
IMSDK.uuid(),
{
groupID: this.application.groupID,
fromUserID: this.application.userID,
handleMsg: "",
},
);
} else {
func = IMSDK.asyncApi(
IMSDK.IMMethods.AcceptFriendApplication,
IMSDK.uuid(),
{
toUserID: this.application.fromUserID,
handleMsg: "",
},
);
}
func
.then(() => uni.$u.toast("操作成功"))
.catch(() => uni.$u.toast("操作失败"))
.finally(() => (this.accessLoading = false));
},
greetToUser() {
navigateToDesignatedConversation(
this.application[this.isRecv ? "fromUserID" : "toUserID"],
SessionType.Single,
).catch(() => uni.$u.toast("获取会话信息失败"));
},
},
};
});
} else {
let sourceID =
this.application.groupID ??
(this.isRecv ?
this.application.fromUserID :
this.application.toUserID);
let cardType = this.isGroupApplication ? "groupCard" : "userCard";
const url = `/pages/common/${cardType}/index?sourceID=${sourceID}`;
uni.navigateTo({
url,
});
}
},
acceptApplication() {
this.accessLoading = true;
let func;
if (this.isGroupApplication) {
func = IMSDK.asyncApi(
IMSDK.IMMethods.AcceptGroupApplication,
IMSDK.uuid(), {
groupID: this.application.groupID,
fromUserID: this.application.userID,
handleMsg: "",
},
);
} else {
func = IMSDK.asyncApi(
IMSDK.IMMethods.AcceptFriendApplication,
IMSDK.uuid(), {
toUserID: this.application.fromUserID,
handleMsg: "",
},
);
}
func
.then(() => uni.$u.toast("操作成功"))
.catch(() => uni.$u.toast("操作失败"))
.finally(() => (this.accessLoading = false));
},
greetToUser() {
navigateToDesignatedConversation(
this.application[this.isRecv ? "fromUserID" : "toUserID"],
SessionType.Single,
).catch(() => uni.$u.toast("获取会话信息失败"));
},
},
};
</script>
<style lang="scss" scoped>
.application_item {
// @include vCenterBox();
display: flex;
justify-content: flex-start;
padding: 24rpx 44rpx;
color: $uni-text-color;
background-color: #fff;
.application_item {
// @include vCenterBox();
display: flex;
justify-content: flex-start;
padding: 24rpx 44rpx;
color: $uni-text-color;
background-color: #fff;
&_details {
@include vCenterBox();
margin-left: 24rpx;
width: 100%;
position: relative;
&_details {
@include vCenterBox();
margin-left: 24rpx;
width: 100%;
position: relative;
.content {
@include colBox(false);
font-size: 26rpx;
width: 100%;
.content {
@include colBox(false);
font-size: 26rpx;
width: 100%;
.user_name {
@include nomalEllipsis();
max-width: 400rpx;
font-size: 28rpx;
color: $uni-text-color;
margin-bottom: 10rpx;
}
.user_name {
@include nomalEllipsis();
max-width: 400rpx;
font-size: 28rpx;
color: $uni-text-color;
margin-bottom: 10rpx;
}
.req_message {
@include ellipsisWithLine(2);
max-width: 80%;
color: #999;
}
.req_message {
@include ellipsisWithLine(2);
max-width: 80%;
color: #999;
}
.title {
margin-bottom: 20rpx;
word-break: break-all;
width: 75%;
.title {
margin-bottom: 20rpx;
word-break: break-all;
width: 75%;
.group_name {
margin-left: 12rpx;
color: $uni-color-primary;
}
}
}
.group_name {
margin-left: 12rpx;
color: $uni-color-primary;
}
}
}
.application_action {
position: absolute;
right: 0;
.application_action {
position: absolute;
right: 0;
.status_tip {
font-size: 28rpx;
color: #666;
}
.status_tip {
font-size: 28rpx;
color: #666;
}
.access_btn {
padding: 0 12rpx;
height: 48rpx;
line-height: 48rpx;
}
.access_btn {
padding: 0 12rpx;
height: 48rpx;
line-height: 48rpx;
}
.greet {
color: #418ae5;
}
}
.greet {
color: #418ae5;
}
}
.bottom_line {
height: 1px;
width: 100%;
background-color: #f0f0f0;
position: absolute;
bottom: -24rpx;
}
}
}
.bottom_line {
height: 1px;
width: 100%;
background-color: #f0f0f0;
position: absolute;
bottom: -24rpx;
}
}
}
.u-list-item:last-child {
.bottom_line {
height: 0;
}
}
.u-list-item:last-child {
.bottom_line {
height: 0;
}
}
</style>
pages/contact/friendList/index.vue
+121 -83
View File
@@ -1,93 +1,131 @@
<template>
<view class="friend_list_container">
<custom-nav-bar title="我的好友" />
<view class="search_bar_wrap">
<u-search
class="search_bar"
shape="square"
placeholder="搜索"
:showAction="false"
disabled
/>
</view>
<view class="friend_list_container">
<view class="header">
<uni-nav-bar
right-icon="plus"
@clickRight="contactAddClick"
:border="false"
title="通讯录"
backgroundColor="transparent"
>
</uni-nav-bar>
<SearchbarPlace>搜索</SearchbarPlace>
</view>
<uni-list class="contact_menus">
<uni-list-item title="新的好友" :showBadge="storeUnHandleFriendApplicationNum>0" :badgeText="storeUnHandleFriendApplicationNum+''" badgeType="error" thumbSize="lg" to="/pages/contact/applicationList/index?applicationType=NewFriend" thumb="/static/images/contact_new_friend.png"></uni-list-item>
<uni-list-item title="新的群组" thumbSize="lg" to="/pages/contact/applicationList/index?applicationType=NewGroup" thumb="/static/images/contact_new_group.png"></uni-list-item>
<uni-list-item title="群聊" thumbSize="lg" to="/pages/contact/groupList/index" thumb="/static/images/contact_my_group.png"></uni-list-item>
</uni-list>
<choose-index-list
v-if="getIndexData.dataList.length > 0"
@itemClick="userClick"
:height="`${listHeight}px`"
:indexList="getIndexData.indexList"
:itemArr="getIndexData.dataList"
/>
<u-empty v-else mode="list" />
</view>
<choose-index-list v-if="getIndexData.dataList.length > 0" @itemClick="userClick" :height="`${listHeight}px`"
:indexList="getIndexData.indexList" :itemArr="getIndexData.dataList" />
<u-empty v-else mode="list" />
</view>
</template>
<script>
import { mapGetters } from "vuex";
import { formatChooseData } from "@/util/common";
import CustomNavBar from "@/components/CustomNavBar/index.vue";
import ChooseIndexList from "@/components/ChooseIndexList/index.vue";
export default {
components: {
CustomNavBar,
ChooseIndexList,
},
data() {
return {
keyword: "",
listHeight: 0,
};
},
computed: {
...mapGetters(["storeFriendList"]),
getIndexData() {
return formatChooseData(this.storeFriendList);
},
},
mounted() {
this.getListHeight();
},
methods: {
userClick(friend) {
uni.navigateTo({
url: `/pages/common/userCard/index?sourceID=${friend.userID}`,
});
},
async getListHeight() {
const windowInfo = uni.getWindowInfo();
const data = await this.getEl(".search_bar_wrap");
const searchBarHeight = Number(data.height.toFixed());
this.listHeight =
windowInfo.windowHeight -
windowInfo.statusBarHeight -
44 -
searchBarHeight;
},
getEl(el) {
return new Promise((resolve) => {
const query = uni.createSelectorQuery().in(this);
query
.select(el)
.boundingClientRect((data) => {
// 存在data，且存在宽和高，视为渲染完毕
resolve(data);
})
.exec();
});
},
},
};
import {mapGetters,mapActions} from "vuex";
import {formatChooseData} from "@/util/common";
import CustomNavBar from "@/components/CustomNavBar/index.vue";
import SearchbarPlace from "@/components/searchbar_place.vue";
import ChooseIndexList from "@/components/ChooseIndexList/index.vue";
import ContactMenus from "../index/components/ContactMenus.vue";
export default {
components: {
CustomNavBar,
ChooseIndexList,
ContactMenus,
SearchbarPlace
},
data() {
return {
keyword: "",
listHeight: 0,
};
},
computed: {
...mapGetters(["storeFriendList",'storeUnHandleFriendApplicationNum']),
getIndexData() {
return formatChooseData(this.storeFriendList);
},
},
mounted() {
this.getListHeight();
},
async onShow() {
await this.getFriendList();
},
methods: {
...mapActions('contact',['getFriendList']),
clear(){},
cancel(){},
input(){},
search() {},
contactAddClick() {
uni.navigateTo({
url: "/pages/contact/contactAdd/index",
});
},
goto(url){
uni.navigateTo({
url: url,
});
},
userClick(friend) {
uni.navigateTo({
url: `/pages/common/userCard/index?sourceID=${friend.userID}`,
});
},
async getListHeight() {
const windowInfo = uni.getWindowInfo();
//const data = await this.getEl(".search_bar_wrap");
const contact_menus = await this.getEl(".contact_menus");
const header = await this.getEl(".header");
//const searchBarHeight = Number(data.height.toFixed());
const contact_menusHeight = contact_menusHeight ? Number(contact_menus.height.toFixed()) : 0;
const headerBarHeight = header ? Number(header.height.toFixed()) : 0;
this.listHeight =
windowInfo.windowHeight -
windowInfo.statusBarHeight -
44 -
contact_menusHeight -
headerBarHeight;
},
getEl(el) {
return new Promise((resolve) => {
const query = uni.createSelectorQuery().in(this);
query
.select(el)
.boundingClientRect((data) => {
// 存在data，且存在宽和高，视为渲染完毕
resolve(data);
})
.exec();
});
},
},
};
</script>
<style lang="scss" scoped>
.friend_list_container {
.search_bar_wrap {
height: 34px;
padding: 12px 22px;
}
.friend_list_container {
padding-top: 36rpx;
.header{
background-color: #f4f4f4;
}
.search_bar_wrap {
height: 34px;
padding: 12px 22px;
}
.u-empty {
margin-top: 25vh !important;
}
}
.u-empty {
margin-top: 25vh !important;
}
.contact_menus{
::v-deep .uni-list-item__container{
padding: 24rpx 44rpx;
}
}
}
</style>
pages/conversation/conversationList/components/ChatHeader.vue
+84 -68
View File
@@ -1,10 +1,61 @@
<template>
<view class="chat_header">
<view class="self_info">
<my-avatar :src="storeSelfInfo.faceURL" :desc="storeSelfInfo.nickname" size="46" />
<uni-nav-bar
right-icon="plus"
@clickRight="showMore"
:border="false"
title="标题"
backgroundColor="transparent"
>
<template #right>
<uni-icons type="plus" size="26" class="more_icon"></uni-icons>
</template>
</uni-nav-bar>
<view class="right_action">
<u-overlay :show="moreMenuVisible" @click="moreMenuVisible = false" opacity="0">
<view :style="{ top: popMenuPosition.top, right: popMenuPosition.right }" class="more_menu">
<view @click="clickMenu({name:'createGroup'})" class="menu_item">
<uni-icons size="24" color="#FFF" type="chat"></uni-icons>
<text>创建群聊</text>
</view>
<view @click="clickMenu({name:'addFriend'})" class="menu_item">
<uni-icons size="24" color="#FFF" type="personadd"></uni-icons>
<text>添加好友</text>
</view>
<view @click="clickMenu({name:'createGroup'})" class="menu_item">
<uni-icons size="24" color="#FFF" type="scan"></uni-icons>
<text>扫一扫</text>
</view>
</view>
</u-overlay>
</view>
<uni-search-bar @confirm="search" :focus="false" bgColor="#fff"
placeholder="请输入您要搜索的内容"
v-model="searchValue" @input="input"
@cancel="cancel" @clear="clear">
</uni-search-bar>
<view class="status_notice">
<view class="tag" v-if="storeIsSyncing">
<img class="loading" style="height: 24rpx; width: 24rpx" src="static/images/loading.png"
alt="" />
<text class="status">同步中</text>
</view>
<view class="tag" v-if="connectStart == 0">
<img class="loading" style="height: 24rpx; width: 24rpx" src="static/images/loading.png"
alt="" />
<text class="status">连接中</text>
</view>
<view class="err-tag" v-if="connectStart == -1">
<img style="height: 24rpx; width: 24rpx" src="static/images/sync_error.png" alt="" />
<text class="status">连接失败</text>
</view>
</view>
<view class="self_info" v-if="1==2">
<my-avatar :src="storeSelfInfo.faceURL" :desc="storeSelfInfo.nickname || storeSelfInfo.remark" size="46" />
<view class="self_info_desc">
<view class="user_state">
<text class="nickname">{{ storeSelfInfo.nickname }}</text>
<text class="nickname">{{ storeSelfInfo.nickname || storeSelfInfo.remark }}</text>
<view v-if="!storeReinstall">
<view class="tag" v-if="storeIsSyncing">
<img class="loading" style="height: 24rpx; width: 24rpx" src="static/images/loading.png"
@@ -24,20 +75,7 @@
</view>
</view>
</view>
<view class="right_action">
<view class="call_icon"> </view>
<view @click="showMore" class="more_icon">
<image src="@/static/images/common_circle_add.png"></image>
</view>
<u-overlay :show="moreMenuVisible" @click="moreMenuVisible = false" opacity="0">
<view :style="{ top: popMenuPosition.top, right: popMenuPosition.right }" class="more_menu">
<view @click="clickMenu(item)" v-for="item in moreMenus" :key="item.idx" class="menu_item">
<image :src="item.icon" mode=""></image>
<text>{{ item.title }}</text>
</view>
</view>
</u-overlay>
</view>
</view>
</template>
@@ -47,6 +85,7 @@
} from "vuex";
import MyAvatar from "@/components/MyAvatar/index.vue";
import IMSDK from "openim-uniapp-polyfill";
import util from "@/util";
export default {
name: "ChatHeader",
components: {
@@ -55,28 +94,13 @@
props: {},
data() {
return {
searchValue:"",
connectStart: -2,
moreMenuVisible: false,
popMenuPosition: {
top: 0,
right: 0,
},
moreMenus: [{
idx: 1,
title: "添加好友",
icon: require("static/images/more_add_friend.png"),
},
{
idx: 2,
title: "添加群聊",
icon: require("static/images/more_add_group.png"),
},
{
idx: 3,
title: "创建群聊",
icon: require("static/images/more_create_group.png"),
},
],
}
};
},
computed: {
@@ -89,6 +113,12 @@
this.unsubscribeAll();
},
methods: {
search(){},
blur(){},
focus(){},
input(){},
cancel(){},
clear(){},
setStateStart() {
this.connectStart = 0;
},
@@ -108,18 +138,20 @@
IMSDK.unsubscribe(IMSDK.IMEvents.OnConnectSuccess, this.setStateSuccess);
IMSDK.unsubscribe(IMSDK.IMEvents.OnConnectFailed, this.setStateError);
},
clickMenu({idx}) {
switch (idx) {
case 1:
case 2:
clickMenu({name}) {
switch (name) {
case 'createGroup':
uni.navigateTo({
url: `/pages/common/createGroup/index`,
});
break;
case 'addFriend':
uni.navigateTo({
url: `/pages/common/searchUserOrGroup/index?isSearchGroup=${idx === 2}`,
});
break;
case 3:
uni.navigateTo({
url: `/pages/common/createGroup/index`,
});
case 'scan':
util.scan();
break;
default:
break;
@@ -160,9 +192,10 @@
}
.chat_header {
@include btwBox();
padding: 36rpx 44rpx;
margin-top: var(--status-bar-height);
@include colBox(true);
padding: 36rpx 24rpx 10rpx;
//margin-top: var(--status-bar-height);
background: #f4f4f4;
.self_info {
@include btwBox();
@@ -249,22 +282,6 @@
display: flex;
position: relative;
.call_icon {
margin-right: 24rpx;
image {
width: 56rpx;
height: 56rpx;
}
}
.more_icon {
image {
width: 56rpx;
height: 56rpx;
}
}
.more_menu {
position: absolute;
// bottom: 0;
@@ -274,7 +291,7 @@
box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.16);
width: max-content;
border-radius: 12rpx;
background-color: #fff;
background-color: rgba(76 ,76, 76, 0.9);
.menu_item {
display: flex;
@@ -282,13 +299,12 @@
align-items: center;
padding: 20rpx 24rpx;
font-size: 28rpx;
color: $uni-text-color;
border-bottom: 1px solid #f0f0f0;
color: #fff;
//border-bottom: 1px solid #f0f0f0;
image {
width: 24px;
height: 24px;
margin-right: 24rpx;
.uni-icons {
margin-right: 16rpx;
color: #FFF;
}
&:last-child {
pages/login/index.vue
+352 -374
View File
@@ -1,408 +1,386 @@
<template>
<view class="page_container">
<view class="login">
<view class="logo">
<img src="static/images/logo.png" alt="" />
<view class="title">欢迎使用{{config.name}}</view>
</view>
<u-tabs :list="list" :current="active" @click="click"></u-tabs>
<u-form class="loginForm" labelPosition="top" :model="loginInfo" :labelStyle="{
fontSize: '14px',
marginTop: '20rpx',
width: 'max-content',
}" ref="loginForm">
<u-form-item v-if="active === 0" label="" prop="phoneNumber">
<u-input v-model="loginInfo.phoneNumber" border="surround" placeholder="请输入手机号码" clearable>
<view slot="prefix" class="phoneNumber_areacode" @click="showPicker">
<text class="areacode_content">+{{ loginInfo.areaCode }}</text>
<u-icon class="arrow_down" name="arrow-down"></u-icon>
</view>
</u-input>
</u-form-item>
<u-form-item v-if="active === 1" label="" prop="email">
<u-input v-model="loginInfo.email" border="surround" placeholder="请输入您的邮箱" clearable>
</u-input>
</u-form-item>
<u-form-item v-if="active > 1 || isPwdLogin" label="" prop="password">
<u-input v-model="loginInfo.password" border="surround" placeholder="请输入密码" :password="!eying"
clearable>
<u-icon @click="updateEye" slot="suffix" :name="eying ? 'eye-off' : 'eye'">
</u-icon>
</u-input>
</u-form-item>
<u-form-item v-if="active <= 1 && !isPwdLogin" label="" prop="verificationCode">
<u-input v-model="loginInfo.verificationCode" border="surround" placeholder="请输入验证码">
<view class="code_btn" slot="suffix" @click="getCode">
{{ count !== 0 ? `${count} s` : "获取验证码" }}
</view>
</u-input>
</u-form-item>
</u-form>
<view v-if="active <= 1" class="other">
<text @click="toRegisterOrForget(false)">忘记密码</text>
<text class="forget" @click="toggleLoginMethod">{{ isPwdLogin ? "验证码登录" : "密码登录" }}</text>
</view>
<view class="login-btn">
<u-button :loading="loading" type="primary" @click="startLogin" :disabled="!canLogin">
登录
</u-button>
</view>
<view class="page_container">
<view class="login">
<view class="logo">
<img src="static/images/logo.png" alt="" />
<view class="title">欢迎使用{{ config.name }}</view>
</view>
<u-tabs v-if="1 == 2" :list="list" :current="active" @click="click"></u-tabs>
<u-form class="loginForm" labelPosition="top" :model="loginInfo" :labelStyle="{
fontSize: '14px',
marginTop: '20rpx',
width: 'max-content',
}" ref="loginForm">
<u-form-item v-if="active === 0" label="" prop="phoneNumber">
<u-input v-model="loginInfo.phoneNumber" border="surround" placeholder="请输入手机号码" clearable>
<view slot="prefix" class="phoneNumber_areacode" @click="showPicker">
<text class="areacode_content">+{{ loginInfo.region }}</text>
<u-icon class="arrow_down" name="arrow-down"></u-icon>
</view>
</u-input>
</u-form-item>
<u-form-item v-if="active === 1" label="" prop="email">
<u-input v-model="loginInfo.email" border="surround" placeholder="请输入您的邮箱" clearable>
</u-input>
</u-form-item>
<u-form-item v-if="active > 1 || isPwdLogin" label="" prop="password">
<u-input v-model="loginInfo.password" border="surround" placeholder="请输入密码" :password="!eying"
clearable>
<u-icon @click="updateEye" slot="suffix" :name="eying ? 'eye-off' : 'eye'">
</u-icon>
</u-input>
</u-form-item>
<u-form-item v-if="active <= 1 && !isPwdLogin" label="" prop="verificationCode">
<u-input v-model="loginInfo.verificationCode" border="surround" placeholder="请输入验证码">
<view class="code_btn" slot="suffix" @click="getCode">
{{ count !== 0 ? `${count} s` : "获取验证码" }}
</view>
</u-input>
</u-form-item>
</u-form>
<view v-if="active <= 1" class="other">
<text @click="toRegisterOrForget(false)">忘记密码</text>
<text class="forget" @click="toggleLoginMethod">{{ isPwdLogin ? "验证码登录" : "密码登录" }}</text>
</view>
<view class="login-btn">
<u-button :loading="loading" type="primary" @click="startLogin" :disabled="!canLogin">
登录
</u-button>
</view>
<AreaPicker ref="AreaPicker" @chooseArea="chooseArea" />
</view>
<AreaPicker ref="AreaPicker" @chooseArea="chooseArea" />
</view>
<view class="action_bar">
<text>还没有账号？<text class="register" @click="toRegisterOrForget(true)">立即注册</text></text>
<text style="margin-bottom: 16rpx" @click="copy">{{ appversion }}</text>
</view>
</view>
<view class="action_bar">
<text>还没有账号？<text class="register" @click="toRegisterOrForget(true)">立即注册</text></text>
<text style="margin-bottom: 16rpx" @click="copy">{{ appversion }}</text>
</view>
</view>
</template>
<script>
import { mapGetters } from "vuex";
import { v4 as uuidv4 } from "uuid";
import md5 from "md5";
import { businessLogin, businessSendSms } from "@/api/login";
import AreaPicker from "@/components/AreaPicker";
import { checkLoginError } from "@/util/common";
import { SmsUserFor } from "@/constant";
import IMSDK from "openim-uniapp-polyfill";
import { mapGetters } from "vuex";
import { v4 as uuidv4 } from "uuid";
import md5 from "md5";
import { businessLogin, businessSendSms } from "@/api/login";
import AreaPicker from "@/components/AreaPicker";
import { checkLoginError } from "@/util/common";
import { SmsUserFor } from "@/constant";
import IMSDK from "openim-uniapp-polyfill";
let timer;
let timer;
export default {
components: {
AreaPicker,
},
data() {
return {
list: [{
name: '手机号',
}, {
name: '邮箱',
}],
loginInfo: {
email: "",
phoneNumber: "",
password: "",
areaCode: "86",
verificationCode: "",
},
appversion:0,
eying: false,
loading: false,
count: 0,
isPwdLogin: true,
active: 1,
};
},
computed: {
...mapGetters(["config"]),
canLogin() {
return (
(this.loginInfo.phoneNumber || this.loginInfo.email) &&
(this.loginInfo.password || this.loginInfo.verificationCode)
);
},
},
onLoad(options) {
const _this = this;
plus.runtime.getProperty(plus.runtime.appid,(inf) => {
console.log(inf);
_this.appversion = inf.version
});
// if(options.isRedirect){
// plus.navigator.closeSplashscreen();
// }
this.init();
},
methods: {
click({index}) {
this.active = index;
},
copy() {
uni.setClipboardData({
showToast: false,
data: version,
success: function() {
uni.showToast({
icon: "none",
title: "复制成功",
});
},
});
},
init() {
this.loginInfo.areaCode = uni.getStorageSync("last_areaCode") || "86";
this.loginInfo.email = uni.getStorageSync("last_email") || "";
this.loginInfo.phoneNumber = uni.getStorageSync("last_phoneNumber") || "";
export default {
components: {
AreaPicker,
},
data() {
return {
list: [{
name: '手机号',
}, {
name: '邮箱',
}],
loginInfo: {
email: "",
phoneNumber: "",
password: "",
region: "86",
verificationCode: "",
},
appversion: 0,
eying: false,
loading: false,
count: 0,
isPwdLogin: true,
active: 0,
};
},
computed: {
...mapGetters(["config"]),
canLogin() {
return (
(this.loginInfo.phoneNumber || this.loginInfo.email) &&
(this.loginInfo.password || this.loginInfo.verificationCode)
);
},
},
onLoad(options) {
const _this = this;
plus.runtime.getProperty(plus.runtime.appid, (inf) => {
console.log(inf);
_this.appversion = inf.version
});
// if(options.isRedirect){
// plus.navigator.closeSplashscreen();
// }
this.init();
},
methods: {
click({ index }) {
this.active = index;
},
copy() {
uni.setClipboardData({
showToast: false,
data: version,
success: function () {
uni.showToast({
icon: "none",
title: "复制成功",
});
},
});
},
init() {
this.loginInfo.region = uni.getStorageSync("last_areaCode") || "86";
this.loginInfo.email = uni.getStorageSync("last_email") || "";
this.loginInfo.phoneNumber = uni.getStorageSync("last_phoneNumber") || "";
if(process.env.NODE_ENV == 'development'){
this.loginInfo.email = "commiu@outlook.com";
this.loginInfo.password = "qwe123";
}
},
updateEye() {
this.eying = !this.eying;
},
toRegisterOrForget(isRegister) {
uni.$u.route("/pages/login/registerOrForget/index", {
isRegister,
});
},
async startLogin() {
// this.$refs.loginForm.validate().then(async (valid) => {
this.loading = true;
this.saveLoginInfo();
let data = {};
try {
data = await businessLogin({
mobile: this.loginInfo.phoneNumber,
email: this.loginInfo.email,
areaCode: `+${this.loginInfo.areaCode}`,
password: this.isPwdLogin ? md5(this.loginInfo.password) : "",
platform: uni.$u.os(),
type: this.active === 0 ? 'mobile' : 'email',
code: this.loginInfo.verificationCode,
});
const {imToken,userID} = data;
await IMSDK.asyncApi(IMSDK.IMMethods.Login, uuidv4(), {
userID,
token: imToken,
});
this.saveLoginProfile(data);
this.$store.commit("user/SET_AUTH_DATA", data);
this.$store.dispatch("user/getSelfInfo");
this.$store.dispatch("conversation/getConversationList");
this.$store.dispatch("conversation/getUnReadCount");
// this.$store.dispatch("contact/getFriendList");
// this.$store.dispatch("contact/getGrouplist");
this.$store.dispatch("contact/getBlacklist");
this.$store.dispatch("contact/getRecvFriendApplications");
this.$store.dispatch("contact/getSentFriendApplications");
this.$store.dispatch("contact/getRecvGroupApplications");
this.$store.dispatch("contact/getSentGroupApplications");
uni.switchTab({
url: "/pages/conversation/conversationList/index",
});
this.loginInfo.password = "";
} catch (err) {
console.error(err);
uni.$u.toast(checkLoginError(err));
}
this.loading = false;
// });
},
saveLoginProfile(data) {
const {
imToken,
token,
userID
} = data;
uni.setStorage({
key: "IMUserID",
data: userID,
});
uni.setStorage({
key: "IMToken",
data: imToken,
});
uni.setStorage({
key: "BusinessToken",
data: token,
});
},
saveLoginInfo() {
uni.setStorage({
key: "last_areaCode",
data: this.loginInfo.areaCode,
});
uni.setStorage({
key: "last_phoneNumber",
data: this.loginInfo.phoneNumber,
});
uni.setStorage({
key: "last_email",
data: this.loginInfo.email,
});
},
showPicker() {
this.$refs.AreaPicker.init();
},
chooseArea(areaCode) {
this.loginInfo.areaCode = areaCode;
},
toggleLoginMethod() {
this.isPwdLogin = !this.isPwdLogin;
},
getCode() {
if (!this.loginInfo.phoneNumber) {
uni.$u.toast("请先输入手机号！");
return;
}
if (process.env.NODE_ENV == 'development') {
this.loginInfo.email = "commiu@outlook.com";
this.loginInfo.password = "qwe123";
}
},
updateEye() {
this.eying = !this.eying;
},
toRegisterOrForget(isRegister) {
uni.$u.route("/pages/login/registerOrForget/index", {
isRegister,
});
},
async startLogin() {
// this.$refs.loginForm.validate().then(async (valid) => {
this.loading = true;
this.saveLoginInfo();
let data = {};
try {
data = await businessLogin({
mobile: this.loginInfo.phoneNumber,
email: this.loginInfo.email,
region: `+${this.loginInfo.region}`,
password: this.isPwdLogin ? md5(this.loginInfo.password) : "",
platform: uni.$u.os(),
type: this.active === 0 ? 'mobile' : 'email',
code: this.loginInfo.verificationCode,
});
const { imToken, userID } = data;
await IMSDK.asyncApi(IMSDK.IMMethods.Login, uuidv4(), {
userID,
token: imToken,
});
this.saveLoginProfile(data);
this.$store.commit("user/SET_AUTH_DATA", data);
this.$store.dispatch("user/getSelfInfo");
this.$store.dispatch("conversation/getConversationList");
this.$store.dispatch("conversation/getUnReadCount");
// this.$store.dispatch("contact/getFriendList");
// this.$store.dispatch("contact/getGrouplist");
this.$store.dispatch("contact/getBlacklist");
this.$store.dispatch("contact/getRecvFriendApplications");
this.$store.dispatch("contact/getSentFriendApplications");
this.$store.dispatch("contact/getRecvGroupApplications");
this.$store.dispatch("contact/getSentGroupApplications");
uni.switchTab({
url: "/pages/conversation/conversationList/index",
});
this.loginInfo.password = "";
} catch (err) {
console.error(err);
uni.$u.toast(checkLoginError(err));
}
this.loading = false;
// });
},
saveLoginProfile(data) {
const { imToken, token, userID } = data;
uni.setStorage({ key: "IMUserID", data: userID, });
uni.setStorage({ key: "IMToken", data: imToken, });
uni.setStorage({ key: "BusinessToken", data: token, });
},
saveLoginInfo() {
uni.setStorage({key: "last_areaCode",data: this.loginInfo.region,});
uni.setStorage({key: "last_phoneNumber",data: this.loginInfo.phoneNumber,});
uni.setStorage({key: "last_email",data: this.loginInfo.email,});
},
showPicker() {
this.$refs.AreaPicker.init();
},
chooseArea(areaCode) {
this.loginInfo.region = areaCode;
},
toggleLoginMethod() {
this.isPwdLogin = !this.isPwdLogin;
},
getCode() {
if (!this.loginInfo.phoneNumber) {
uni.$u.toast("请先输入手机号！");
return;
}
if (this.count !== 0) {
return;
}
if (this.count !== 0) {
return;
}
const options = {
phoneNumber: this.loginInfo.phoneNumber,
areaCode: `+${this.loginInfo.areaCode}`,
usedFor: SmsUserFor.Login,
operationID: Date.now() + "",
};
businessSendSms(options)
.then(() => {
uni.$u.toast("验证码已发送！");
this.startCount();
})
.catch((err) => {
console.error(err);
uni.$u.toast(checkLoginError(err));
});
},
startCount() {
if (timer) {
clearInterval(timer);
}
this.count = 60;
timer = setInterval(() => {
if (this.count > 0) {
this.count--;
}
}, 1000);
},
},
};
const options = {
phoneNumber: this.loginInfo.phoneNumber,
region: `+${this.loginInfo.region}`,
usedFor: SmsUserFor.Login,
operationID: Date.now() + "",
};
businessSendSms(options)
.then(() => {
uni.$u.toast("验证码已发送！");
this.startCount();
})
.catch((err) => {
console.error(err);
uni.$u.toast(checkLoginError(err));
});
},
startCount() {
if (timer) {
clearInterval(timer);
}
this.count = 60;
timer = setInterval(() => {
if (this.count > 0) {
this.count--;
}
}, 1000);
},
},
};
</script>
<style lang="scss" scoped>
.page_container {
justify-content: space-between;
.page_container {
justify-content: space-between;
.login {
color: #0c1c33;
padding: 10vh 80rpx 0;
background: linear-gradient(180deg,
rgba(0, 137, 255, 0.1) 0%,
rgba(255, 255, 255, 0) 100%);
.login {
color: #0c1c33;
padding: 10vh 80rpx 0;
background: linear-gradient(180deg,
rgba(0, 137, 255, 0.1) 0%,
rgba(255, 255, 255, 0) 100%);
.title {
font-size: 34rpx;
font-weight: 700;
margin-bottom: 64rpx;
// color: $u-primary;
}
.title {
font-size: 34rpx;
font-weight: 700;
margin-bottom: 64rpx;
// color: $u-primary;
}
.logo {
display: flex;
flex-direction: column;
justify-content: start;
align-items: start;
.logo {
display: flex;
flex-direction: column;
justify-content: start;
align-items: start;
img {
width: 160rpx;
height: 160rpx;
}
}
img {
width: 160rpx;
height: 160rpx;
}
}
.loginType {
margin-bottom: 36rpx;
.loginType {
margin-bottom: 36rpx;
&-item {
margin-right: 68rpx;
font-size: 28rpx;
font-weight: 400;
border-radius: 4rpx;
padding: 2rpx 0;
}
&-item {
margin-right: 68rpx;
font-size: 28rpx;
font-weight: 400;
border-radius: 4rpx;
padding: 2rpx 0;
}
&-active {
color: $u-primary;
border-bottom: 4rpx solid $u-primary;
}
}
&-active {
color: $u-primary;
border-bottom: 4rpx solid $u-primary;
}
}
.loginForm {
.phoneNumber-code {
display: flex;
align-items: center;
font-size: 36rpx;
border-right: 2rpx solid #d8d8d8;
margin-right: 58rpx;
.loginForm {
.phoneNumber-code {
display: flex;
align-items: center;
font-size: 36rpx;
border-right: 2rpx solid #d8d8d8;
margin-right: 58rpx;
.code {
font-weight: 400;
margin-right: 20rpx;
}
.code {
font-weight: 400;
margin-right: 20rpx;
}
.icon {
margin-right: 40rpx;
}
}
.icon {
margin-right: 40rpx;
}
}
.eye {
.image {
width: 44rpx;
height: 32rpx;
}
}
.eye {
.image {
width: 44rpx;
height: 32rpx;
}
}
.code_btn {
color: $u-primary;
}
}
.code_btn {
color: $u-primary;
}
}
.other {
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 8rpx;
font-size: 24rpx;
font-weight: 400;
color: $u-tips-color;
.other {
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 8rpx;
font-size: 24rpx;
font-weight: 400;
color: $u-tips-color;
.forget {
color: $u-primary;
}
}
.forget {
color: $u-primary;
}
}
.login-btn {
margin-top: 8vh;
}
.login-btn {
margin-top: 8vh;
}
.agreement {
display: flex;
align-items: flex-start;
margin-top: 36rpx;
.agreement {
display: flex;
align-items: flex-start;
margin-top: 36rpx;
.detail {
font-size: 24rpx;
font-weight: 400;
color: $u-primary;
}
}
}
.detail {
font-size: 24rpx;
font-weight: 400;
color: $u-primary;
}
}
}
.action_bar {
display: flex;
justify-content: center;
flex-direction: column;
text-align: center;
margin-bottom: 96rpx;
font-size: 24rpx;
font-weight: 400;
color: $u-tips-color;
.action_bar {
display: flex;
justify-content: center;
flex-direction: column;
text-align: center;
margin-bottom: 96rpx;
font-size: 24rpx;
font-weight: 400;
color: $u-tips-color;
.register {
color: $u-primary;
}
.register {
color: $u-primary;
}
.tap_line {
width: 1px;
margin: 0 24rpx;
background-color: #999;
transform: scale(0.5, 0.8);
}
}
}
.tap_line {
width: 1px;
margin: 0 24rpx;
background-color: #999;
transform: scale(0.5, 0.8);
}
}
}
</style>
pages/profile/selfInfo/index.vue
+3 -1
View File
@@ -31,6 +31,7 @@
import MyAvatar from "@/components/MyAvatar/index.vue";
import dayjs from "dayjs";
import InfoItem from "./InfoItem.vue";
import util from "@/util";
import {
getPurePath
} from "@/util/common";
@@ -71,6 +72,7 @@
},
},
methods: {
...util,
updateNickname() {
uni.navigateTo({
url: `/pages/common/markOrIDPage/index?isSelfNickname=true&sourceInfo=${JSON.stringify(
@@ -124,7 +126,7 @@
},
toQrCode() {
uni.navigateTo({
url: `/pages/common/userOrGroupQrCode/index`,
url: `/pages/common/userOrGroupQrCode`,
});
},
copyID() {
pages/workbench/friend-circle/builtinBgImg.vue
+71
View File
@@ -0,0 +1,71 @@
<template>
<view class="content">
<u-navbar title="选择背景图" :background="{ background: '#ffffff'}"
:border-bottom="false">
<view class="slot-wrap" slot="right">
<u-button :custom-style="customBtnStyle" size="mini" :disabled="submitFlag"
:type="submitFlag?'info ':'success'" @click="handleLink()">设置</u-button>
</view>
</u-navbar>
<u-grid @click="clickGrid">
<u-grid-item v-for="(item, index) in bgList" :key="index" :index="index" :custom-style="item.isCheck?girdItemCustomStyle:{}">
<u-image :src="item.src" width="200rpx" height="200rpx" mode="aspectFill"></u-image>
</u-grid-item>
</u-grid>
</view>
</template>
<script>
export default {
data() {
return {
bgList:[],
customBtnStyle: {
fontSize: '30rpx',
padding: '28rpx',
width:'100rpx'
},
submitFlag:true,
girdItemCustomStyle:{
backgroundColor:'#71d5a1',
// maring:'0rpx',
padding:'20rpx'
}
};
},
methods: {
clickGrid(index){
this.bgList.forEach((item,i)=>{
if(index == i) item.isCheck = !item.isCheck;
else item.isCheck = false;
})
this.submitFlag=false;
},
//处理跳转逻辑
handleLink(){
const item = this.bgList.find(it=>it.isCheck);
if(item){
this.$u.vuex('circleBgImg', item.src);
uni.navigateBack({
delta:2
})
}
},
},
onShow() {
this.bgList = JSON.parse(JSON.stringify(this.circleBgList))
}
};
</script>
<style lang="scss" scoped>
.content {
.slot-wrap {
display: flex;
align-items: center;
padding: 0 30rpx;
}
}
</style>
pages/workbench/friend-circle/chooseCircleBgImg.vue
+80
View File
@@ -0,0 +1,80 @@
<template>
<view>
<u-cell-group>
<u-cell-item title="选择内置背景图" :title-style="titleStyle"
:border-bottom="false" :border-top="false"
@click="linkToBuiltinBgImg"></u-cell-item>
</u-cell-group>
<u-gap :height="16" bg-color="#f4f4f5"></u-gap>
<u-cell-group>
<u-cell-item title="通过手机选择" :title-style="titleStyle"
:border-bottom="false" :border-top="false"
@click="chooseImg"></u-cell-item>
</u-cell-group>
<u-toast ref="uToast" />
</view>
</template>
<script>
export default {
data() {
return {
titleStyle:{
marginLeft:"20rpx",
fontSize:"32rpx",
color:"#000000"
}
};
},
methods: {
chooseImg() {
let that=this;
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
sourceType: ['camera','album'], //从相册选择
success: function(res) {
console.log("res",res);
let tempFilePaths = res.tempFilePaths;
that.myUpload(tempFilePaths[0]);
return;
}
});
return;
},
//上传返回图片
myUpload(filePath) {
let that=this;
let obj = {
filePath:filePath,
savePath: "friendCircle" //文件存放目录
}
console.log("通过手机选择",obj);
this.globalUtil.globalUpload(that,{
param:obj,
success: (res1) => {
console.log("上传成功",res1);
let avatar= res1.result.url;
that.$u.vuex('circleBgImg',avatar);
uni.navigateBack();
},
fail:(res1) => {
console.log("上传失败",res1);
},
complete: (res1) => {
console.log("上传完成",res1);
}
});
},
linkToBuiltinBgImg() {
this.$u.route('/pages/tabbar/find/friend-circle/builtinBgImg');
},
},
};
</script>
<style></style>
pages/workbench/friend-circle/chooseLocation.vue
+24
View File
@@ -0,0 +1,24 @@
<template>
<view class="locationContainer">
<view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
}
}
</script>
<style lang="scss" scoped>
.locationContainer{
padding: 20rpx;
}
</style>
pages/workbench/index/index.vue
+34 -232
View File
@@ -1,177 +1,56 @@
<template>
<view class="content">
<u-navbar :is-back="false" title="发现" :background="{ background: '#f4f4f5' }" title-color="#404133"
:title-bold="true" title-size="34" :border-bottom="false" z-index="1001">
</u-navbar>
<view style="background-color: #FFFFFF;">
<view>
<u-cell-item title="" :title-style="titleStyle" :border-bottom="showBorder(0)" :border-top="false"
@tap="linkTo(cellList[0])">
<u-icon class="u-m-r-10" slot="icon" name="/static/image/workbench/01.png" color="inherit" :size="44"></u-icon>
<view slot="title" class="u-flex u-row-left u-col-center" style="min-width: 200rpx;">
<view class="u-m-r-20">
<text>朋友圈</text>
</view>
<view class="u-flex u-row-center u-col-center" v-if="vuex_friendCircleUnreadCount>0"
style="width:36rpx;height:36rpx;background-color:#fa3534;border-radius:18rpx;font-size:28rpx;color: #ffffff;">
<text>{{vuex_friendCircleUnreadCount}}</text>
</view>
</view>
<view slot="right-icon" v-if="newCircleInfo&&newCircleInfo.userHeadImg.length>0">
<u-avatar :src="newCircleInfo.userHeadImg" mode="square" :size="70"></u-avatar>
<u-badge :is-dot="true" type="error" :offset="[20,60]"></u-badge>
</view>
</u-cell-item>
<u-gap :height="16" bg-color="#f4f4f5" v-if="showGap(0)"></u-gap>
</view>
<view v-for="(item,index) in cellList" :key="index">
<template v-if="item.hidden==false&&index!=0">
<u-cell-item :title="item.title" :title-style="titleStyle"
:border-bottom="showBorder(index)" :border-top="false"
@tap="linkTo(item)">
<u-icon :class="item.title=='购物'?'u-m-l-6 u-m-r-10':'u-m-r-10'"
slot="icon" :name="item.icon" :color="item.color" :size="item.size"></u-icon>
</u-cell-item>
<u-gap :height="16" bg-color="#f4f4f5" v-if="showGap(index)"></u-gap>
</template>
</view>
</view>
<uni-nav-bar title="发现" background-color="transparent"></uni-nav-bar>
<uni-list>
<uni-list-item title="朋友圈"
thumb="/static/images/workbench/01.png"
:thumbSize="thumbSize"
showArrow
to="/pages/workbench/friend-circle/friend-circle">
<view slot="footer" v-if="newCircleInfo&&newCircleInfo.userHeadImg.length>0">
<u-avatar :src="newCircleInfo.userHeadImg" mode="square" :size="70"></u-avatar>
<u-badge :is-dot="true" type="error" :offset="[20,60]"></u-badge>
</view>
</uni-list-item>
</uni-list>
<u-gap :height="10"></u-gap>
<uni-list>
<uni-list-item title="扫一扫" thumb="/static/images/workbench/03.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
<uni-list-item title="摇一摇" thumb="/static/images/workbench/05.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
<uni-list-item title="看一看" thumb="/static/images/workbench/06.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
<uni-list-item title="听一听" thumb="/static/images/workbench/06.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
<uni-list-item title="附近" thumb="/static/images/workbench/08.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
<uni-list-item title="购物" thumb="/static/images/workbench/09.png" :thumbSize="thumbSize" to="/pages/workbench/friend-circle/friend-circle" showArrow></uni-list-item>
</uni-list>
</view>
</template>
<script>
import {getFriendCircleInfo } from "@/api/login";
export default {
data() {
return {
cellList: [
{
id: 1,
title: "朋友圈",
icon: "/static/image/workbench/01.png",
color: "inherit",
bind: "/pages/workbench/friend-circle/friend-circle",
hidden:false,
size:44,
},
{
id: 3,
title: "扫一扫",
//icon: "/static/image/wx/saoyisao.png",
icon: "/static/image/workbench/04.png",
color: "#409eff",
bind: "scan",
hidden:false,
size:44,
},
{
id: 4,
title: "摇一摇",
//icon: "/static/image/wx/yaoyiyao.png",
icon: "/static/image/workbench/05.png",
color: "#409eff",
bind: "/pages/tabbar/find/yaoyiyao/yyy-index",
hidden:false,
size:44,
},
{
id: 11,
title: "看一看",
icon: "/static/image/workbench/06.png",
color: "#f29100",
bind: "",
hidden:false,
size:44,
},
{
id: 13,
title: "附近",
icon: "/static/image/workbench/08.png",
color: "#fab6b6",
bind: "",
hidden:false,
size:44,
},
{
id: 14,
title: "购物",
icon: "/static/image/workbench/09.png",
color: "#fab6b6",
bind: "taobao",
hidden:false,
size:44,
},
{
id: 15,
title: "游戏",
icon: "/static/image/workbench/10.png",
color: "#fab6b6",
bind: "",
hidden:false,
size:44,
},
{
id: 6,
title: "小程序",
//icon: "/static/image/wx/xiaochengxu.png",
icon: "/static/image/workbench/11.png",
color: "#fab6b6",
bind: "",
hidden:false,
size:44,
},
{
id: 7,
title: "ChatGpt",
icon: "/static/image/find/chatgpt.png",
color: "#ff9900",
bind: "/pages/tabbar/group/chat/chat-gpt-conversion-wss",
hidden:true,
size:64,
},
{
id: 8,
title: "AI绘画",
icon: "http://open.yjai.art/assets/logo-9a019aa3.svg",
color: "#ff9900",
bind: "/pages/tabbar/find/AI/ai-text-to-create-img/ai-text-to-create-img",
hidden:true,
size:64,
},
{
id: 9,
title: "免费听歌",
icon: "/static/image/find/MP3.png",
color: "#19BE6B",
bind: "/pages/tabbar/find/music/free-music",
hidden:true,
size:64,
}
],
titleStyle: {
marginLeft: "20rpx",
fontSize: "34rpx",
color: "#000000"
},
thumbSize:"base",
newCircleInfo: {
userHeadImg:""
userHeadImg:"",
count:0
},
};
},
onShow: function() {
this.changeDefaultAvatar(1,10);
let unreadCount= 1;//this.vuex_friendCircleUnreadCount+"";
this.localGroupApi.setTabBarBadge(2,unreadCount);
let unreadCount= 1;
//this.vuex_friendCircleUnreadCount+"";
//this.localGroupApi.setTabBarBadge(2,unreadCount);
},
methods: {
changeDefaultAvatar:function(min,max){
let that=this;
that.$u.api.friendCircle.checkFriendCircleUpdate().then(res => {
getFriendCircleInfo().then(res => {
if(res.code==200){
console.log("查询朋友圈更新情况",res.data);
console.log("查询朋友圈更新情况",res.data);
if(res.data&&res.data.length>0){
that.newCircleInfo=res.data[0];
that.newCircleInfo=res.data;
}else{
that.newCircleInfo=null;
}
@@ -179,92 +58,15 @@
})
},
showBorder(index){
switch (index){
case 1:
return true;
case 3:
return true;
case 5:
return true;
case 8:
return true;
default:
return false;
}
},
showGap(index){
switch (index){
case 0:
return true;
case 2:
return true;
case 4:
return true;
case 6:
return true;
case 7:
return true;
case 9:
return true;
default:
return false;
}
},
linkTo(item) {
let that = this;
let url = item.bind;
console.log("跳转链接", url);
if (url != null && url.length > 0) {
if (url == 'taobao') {
if (plus.os.name == 'Android') {
plus.runtime.launchApplication({
pname: 'com.taobao.taobao'
},
function(e) {
console.log('Open system default browser failed: ' + e.message);
}
);
} else if (plus.os.name == 'iOS') {
//抖音 snssdk1128://
plus.runtime.launchApplication({
action: 'snssdk1128://'
}, function(e) {
console.log('Open system default browser failed: ' + e.message);
});
}
} else if (url == "scan") {
this.globalUtil.scanQRcode(that, {
complete: function(res) {
console.log("扫码结果", res);
if (res.resp_code == 1000) {
let respData = res.resp_result;
that.$u.route({
url: '/pages/chat/qr-info/qr-info',
params: {
qrInfo: respData
},
animationType: 'slide-in-bottom'
});
}
},
})
} else {
console.log("url", url);
this.$u.route(url);
return;
}
}
},
}
};
</script>
<style lang="scss" scoped>
.content {}
.content {padding-top: 36rpx;}
</style>
<style>
page {
background-color: #f4f4f5 !important;
background-color: #ececec !important;
}
</style>
static/images/friendCircle/at.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB

store/modules/contact.js
+23 -109
View File
@@ -40,21 +40,15 @@ const mutations = {
};
const actions = {
async getFriendList({
commit
}) {
async getFriendList({commit }) {
let offset = 0;
let friendInfoList = [];
let initialFetch = true;
while (true) {
try {
const count = initialFetch ? 10000 : 1000;
const {
data
} = await IMSDK.asyncApi("getFriendListPage", uuidv4(), {
offset,
count,
});
const {data} = await IMSDK.asyncApi("getFriendListPage", uuidv4(), {offset,count,});
//console.log(data);
friendInfoList = [
...friendInfoList,
...data,
@@ -68,9 +62,7 @@ const actions = {
}
commit("SET_FRIEND_LIST", friendInfoList);
},
async getGrouplist({
commit
}) {
async getGrouplist({commit}) {
let offset = 0;
let groupList = [];
while (true) {
@@ -93,18 +85,14 @@ const actions = {
}
commit("SET_GROUP_LIST", groupList);
},
getBlacklist({
commit
}) {
getBlacklist({commit}) {
IMSDK.asyncApi(IMSDK.IMMethods.GetBlackList, uuidv4()).then(({
data
}) => {
commit("SET_BLACK_LIST", data);
});
},
getRecvFriendApplications({
commit
}) {
getRecvFriendApplications({commit}) {
IMSDK.asyncApi(
IMSDK.IMMethods.GetFriendApplicationListAsRecipient,
uuidv4(),
@@ -114,9 +102,7 @@ const actions = {
commit("SET_RECV_FRIEND_APPLICATIONS", data);
});
},
getSentFriendApplications({
commit
}) {
getSentFriendApplications({ commit }) {
IMSDK.asyncApi(
IMSDK.IMMethods.GetFriendApplicationListAsApplicant,
uuidv4(),
@@ -126,9 +112,7 @@ const actions = {
commit("SET_SENT_FRIEND_APPLICATIONS", data);
});
},
getRecvGroupApplications({
commit
}) {
getRecvGroupApplications({ commit }) {
IMSDK.asyncApi(
IMSDK.IMMethods.GetGroupApplicationListAsRecipient,
uuidv4(),
@@ -138,9 +122,7 @@ const actions = {
commit("SET_RECV_GROUP_APPLICATIONS", data);
});
},
getSentGroupApplications({
commit
}) {
getSentGroupApplications({ commit }) {
IMSDK.asyncApi(
IMSDK.IMMethods.GetGroupApplicationListAsApplicant,
uuidv4(),
@@ -150,23 +132,14 @@ const actions = {
commit("SET_SENT_GROUP_APPLICATIONS", data);
});
},
pushNewFriend({
commit,
state
}, friendInfo) {
pushNewFriend({ commit, state}, friendInfo) {
const tmpList = [...state.friendList];
const idx = tmpList.findIndex((item) => item.userID === friendInfo.userID);
if (idx === -1) {
commit("SET_FRIEND_LIST", [...tmpList, friendInfo]);
}
},
updateFriendInfo({
commit,
state
}, {
friendInfo,
isRemove = false
}) {
updateFriendInfo({commit,state}, { friendInfo,isRemove = false}) {
const tmpList = [...state.friendList];
const idx = tmpList.findIndex((item) => item.userID === friendInfo.userID);
@@ -181,23 +154,14 @@ const actions = {
commit("SET_FRIEND_LIST", tmpList);
}
},
pushNewBlack({
commit,
state
}, blackInfo) {
pushNewBlack({ commit, state}, blackInfo) {
const tmpList = [...state.blackList];
const idx = tmpList.findIndex((item) => item.userID === blackInfo.userID);
if (idx === -1) {
commit("SET_BLACK_LIST", [...tmpList, blackInfo]);
}
},
updateBlackInfo({
commit,
state
}, {
blackInfo,
isRemove = false
}) {
updateBlackInfo({commit,state}, {blackInfo,isRemove = false}) {
const tmpList = [...state.blackList];
const idx = tmpList.findIndex((item) => item.userID === blackInfo.userID);
@@ -212,24 +176,14 @@ const actions = {
commit("SET_BLACK_LIST", tmpList);
}
},
pushNewGroup({
commit,
state
}, groupInfo) {
pushNewGroup({commit,state}, groupInfo) {
const tmpList = [...state.groupList];
const idx = tmpList.findIndex((item) => item.groupID === groupInfo.groupID);
if (idx === -1) {
commit("SET_GROUP_LIST", [...tmpList, groupInfo]);
}
},
updateGroupInfo({
commit,
state,
rootState
}, {
groupInfo,
isRemove = false
}, ) {
updateGroupInfo({commit,state,rootState}, {groupInfo,isRemove = false}, ) {
const tmpList = [...state.groupList];
const idx = tmpList.findIndex((item) => item.groupID === groupInfo.groupID);
@@ -250,10 +204,7 @@ const actions = {
commit("SET_GROUP_LIST", tmpList);
}
},
pushNewRecvFriendApplition({
commit,
state
}, application) {
pushNewRecvFriendApplition({commit,state}, application) {
const tmpList = [...state.recvFriendApplications];
const idx = tmpList.findIndex(
(item) => item.fromUserID === application.fromUserID,
@@ -263,14 +214,7 @@ const actions = {
}
commit("SET_RECV_FRIEND_APPLICATIONS", [...tmpList, application]);
},
updateRecvFriendApplition({
commit,
state,
rootState
}, {
application,
isRemove = false
}, ) {
updateRecvFriendApplition({commit,state,rootState}, {application,isRemove = false}, ) {
const tmpList = [...state.recvFriendApplications];
const idx = tmpList.findIndex(
(item) => item.fromUserID === application.fromUserID,
@@ -287,10 +231,7 @@ const actions = {
commit("SET_RECV_FRIEND_APPLICATIONS", tmpList);
}
},
pushNewSentFriendApplition({
commit,
state
}, application) {
pushNewSentFriendApplition({commit,state}, application) {
const tmpList = [...state.sentFriendApplications];
const idx = tmpList.findIndex(
(item) => item.toUserID === application.toUserID,
@@ -300,14 +241,7 @@ const actions = {
}
commit("SET_SENT_FRIEND_APPLICATIONS", [...tmpList, application]);
},
updateSentFriendApplition({
commit,
state,
rootState
}, {
application,
isRemove = false
}, ) {
updateSentFriendApplition({commit,state,rootState}, {application,isRemove = false}, ) {
const tmpList = [...state.sentFriendApplications];
const idx = tmpList.findIndex(
(item) => item.toUserID === application.toUserID,
@@ -324,10 +258,7 @@ const actions = {
commit("SET_SENT_FRIEND_APPLICATIONS", tmpList);
}
},
pushNewRecvGroupApplition({
commit,
state
}, application) {
pushNewRecvGroupApplition({commit,state}, application) {
const tmpList = [...state.recvGroupApplications];
const idx = tmpList.findIndex((item) => item.userID === application.userID);
if (idx !== -1) {
@@ -335,14 +266,7 @@ const actions = {
}
commit("SET_RECV_GROUP_APPLICATIONS", [...tmpList, application]);
},
updateRecvGroupApplition({
commit,
state,
rootState
}, {
application,
isRemove = false
}, ) {
updateRecvGroupApplition({commit,state,rootState}, {application,isRemove = false}, ) {
const tmpList = [...state.recvGroupApplications];
const idx = tmpList.findIndex((item) => item.userID === application.userID);
@@ -357,10 +281,7 @@ const actions = {
commit("SET_RECV_GROUP_APPLICATIONS", tmpList);
}
},
pushNewSentGroupApplition({
commit,
state
}, application) {
pushNewSentGroupApplition({commit,state}, application) {
const tmpList = [...state.sentGroupApplications];
const idx = tmpList.findIndex(
(item) => item.groupID === application.groupID,
@@ -370,14 +291,7 @@ const actions = {
}
commit("SET_SENT_GROUP_APPLICATIONS", [...tmpList, application]);
},
updateSentGroupApplition({
commit,
state,
rootState
}, {
application,
isRemove = false
}, ) {
updateSentGroupApplition({commit,state,rootState}, {application,isRemove = false}, ) {
const tmpList = [...state.sentGroupApplications];
const idx = tmpList.findIndex(
(item) => item.groupID === application.groupID,
uni.scss
+6 -7
View File
@@ -16,15 +16,13 @@
/* 颜色变量 */
@import "@/uni_modules/uview-ui/theme.scss";
text {
// line-height: 1.5;
}
// text element line-height can be customized if needed
/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;
$uni-color-primary: #997aff;
$uni-color-success: #07c160;
$uni-color-warning: #fa9d3b;
$uni-color-error: #fa5151;
/* 文字基本颜色 */
$uni-text-color: #0c1c33; //基本色
@@ -80,3 +78,4 @@ $uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle: 26px;
$uni-color-paragraph: #3f536e; // 文章段落颜色
$uni-font-size-paragraph: 15px;
//@import "@/styles/weui-overrides.scss";