La123123.
/
im-backed
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修复键盘遮挡问题

master
xsx 1 year ago
parent
7e1a3ecd41
commit
460ac80e78
4 changed files with 228 additions and 109 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      im-platform/src/main/java/com/bx/implatform/vo/UserVO.java
  2. 110
      im-uniapp/pages/group/group-edit.vue
  3. 91
      im-uniapp/pages/group/group-info.vue
  4. 124
      im-uniapp/pages/mine/mine-edit.vue

6
im-platform/src/main/java/com/bx/implatform/vo/UserVO.java
View File

@ -15,12 +15,12 @@ public class UserVO {
private Long id;
@NotEmpty(message = "用户名不能为空")
@Length(max = 64, message = "用户名不能大于64字符")
@Length(max = 20, message = "用户名不能大于20字符")
@Schema(description = "用户名")
private String userName;
@NotEmpty(message = "用户昵称不能为空")
@Length(max = 64, message = "昵称不能大于64字符")
@Length(max = 20, message = "昵称不能大于20字符")
@Schema(description = "用户昵称")
private String nickName;
@ -30,7 +30,7 @@ public class UserVO {
@Schema(description = "用户类型 1:普通用户 2:审核账户")
private Integer type;
@Length(max = 1024, message = "个性签名不能大于1024个字符")
@Length(max = 128, message = "个性签名不能大于128个字符")
@Schema(description = "个性签名")
private String signature;

110
im-uniapp/pages/group/group-edit.vue
View File

@ -1,31 +1,33 @@
<template>
<view class="page group-edit">
<view class="page group-edit">
<nav-bar back>修改群资料</nav-bar>
<uni-card :is-shadow="false" is-full :border="false">
<uni-forms ref="form" :modelValue="group" :rules="rules" validate-trigger="bind" label-position="top"
label-width="100%">
<uni-forms-item name="headImage" class="avatar">
<image-upload v-if="isOwner" :onSuccess="onUnloadImageSuccess">
<image :src="group.headImageThumb" class="group-image"></image>
</image-upload>
<head-image v-if="!isOwner" :name="group.showGroupName" :url="group.headImageThumb"
:size="200"></head-image>
</uni-forms-item>
<uni-forms-item label="群聊名称" name="name" :required="true">
<uni-easyinput type="text" v-model="group.name" :disabled="!isOwner" placeholder="请输入群聊名称" />
</uni-forms-item>
<uni-forms-item label="群聊备注" name="remarkGroupName">
<uni-easyinput v-model="group.remarkGroupName" type="text" :placeholder="group.name" />
</uni-forms-item>
<uni-forms-item label="我在本群的昵称" name="remarkNickName">
<uni-easyinput v-model="group.remarkNickName" type="text"
:placeholder="userStore.userInfo.nickName" />
</uni-forms-item>
<uni-forms-item label="群公告" name="notice">
<uni-easyinput type="textarea" v-model="group.notice" :disabled="!isOwner" placeholder="请输入群公告" />
</uni-forms-item>
</uni-forms>
</uni-card>
<view class="form">
<view class="form-item">
<view class="label">群聊头像</view>
<view class="value"></view>
<image-upload v-if="isOwner" :onSuccess="onUnloadImageSuccess">
<image :src="group.headImageThumb" class="group-image"></image>
</image-upload>
<head-image v-else class="group-image" :name="group.showGroupName" :url="group.headImageThumb"
:size="120"></head-image>
</view>
<view class="form-item">
<view class="label">群聊名称</view>
<input class="input" :class="isOwner?'':'disable'" maxlength="20" v-model="group.name" :disabled="!isOwner" placeholder="请输入群聊名称"/>
</view>
<view class="form-item">
<view class="label">群聊备注</view>
<input class="input" maxlength="20" v-model="group.remarkGroupName" :placeholder="group.name"/>
</view>
<view class="form-item">
<view class="label">我在本群的昵称</view>
<input class="input" maxlength="20" v-model="group.remarkNickName" :placeholder="userStore.userInfo.nickName"/>
</view>
<view class="form-item">
<view class="label">群公告</view>
<textarea class="notice" :class="isOwner?'':'disable'" maxlength="512" :disabled="!isOwner" v-model="group.notice" :placeholder="isOwner?'请输入群公告':''"></textarea>
</view>
</view>
<button class="bottom-btn" type="primary" @click="submit()">提交</button>
</view>
</template>
@ -46,6 +48,7 @@ export default {
}
}
},
methods: {
submit() {
if (this.group.id) {
@ -141,17 +144,54 @@ export default {
<style lang="scss" scoped>
.group-edit {
//padding: 20rpx;
.group-image {
width: 200rpx;
height: 200rpx;
border: 1px solid #ccc;
border-radius: 5%;
.form {
margin-top: 20rpx;
.form-item {
padding: 0 40rpx;
display: flex;
background: white;
align-items: center;
margin-bottom: 2rpx;
.label {
width: 220rpx;
line-height: 100rpx;
font-size: $im-font-size;
white-space: nowrap;
}
.value{
flex: 1;
}
.input {
flex: 1;
text-align: right;
line-height: 100rpx;
font-size: $im-font-size-small;
}
.disable {
color: $im-text-color-lighter;
}
.notice {
flex: 1;
font-size: $im-font-size-small;
max-height: 200rpx;
padding: 14rpx 0;
}
.group-image {
width: 120rpx;
height: 120rpx;
border-radius: 5%;
border: 1px solid #ccc;
}
}
}
}
.avatar {
margin-top: -30px;
}
</style>

91
im-uniapp/pages/group/group-info.vue
View File

@ -18,33 +18,33 @@
</view>
<view class="member-more" @click="onShowMoreMmeber()">{{ `查看全部群成员${groupMembers.length}人` }}></view>
</view>
<view class="group-detail">
<uni-section title="群聊名称">
<template v-slot:right>
<text class="detail-text">{{ group.name }}</text>
</template>
</uni-section>
<uni-section title="群主">
<template v-slot:right>
<text class="detail-text">{{ ownerName }}</text>
</template>
</uni-section>
<uni-section title="群名备注">
<template v-slot:right>
<text class="detail-text"> {{ group.remarkGroupName }}</text>
</template>
</uni-section>
<uni-section title="我在本群的昵称">
<template v-slot:right>
<text class="detail-text"> {{ group.showNickName }}</text>
</template>
</uni-section>
<uni-section v-if="group.notice" title="群公告">
<view class="form">
<view class="form-item">
<view class="label">群聊名称</view>
<view class="value">{{group.name}}</view>
</view>
<view class="form-item">
<view class="label">群主</view>
<view class="value">{{ownerName}}</view>
</view>
<view class="form-item">
<view class="label">群名备注</view>
<view class="value">{{group.remarkGroupName}}</view>
</view>
<view class="form-item">
<view class="label">我在本群的昵称</view>
<view class="value">{{group.showNickName}}</view>
</view>
<view v-if="group.notice" class="form-item" >
<view class="label">群公告</view>
</view>
<view v-if="group.notice" class="form-item" >
<uni-notice-bar :text="group.notice" />
</uni-section>
</view>
<view v-if="!group.quit" class="group-edit" @click="onEditGroup()">修改群聊资料 > </view>
</view>
<bar-group v-if="!group.quit">
<btn-bar type="primary" title="发送消息" @tap="onSendMessage()"></btn-bar>
<btn-bar v-if="!isOwner" type="danger" title="退出群聊" @tap="onQuitGroup()"></btn-bar>
@ -63,7 +63,7 @@ export default {
}
},
methods: {
onFocusSearch() { },
onFocusSearch() {},
onInviteMember() {
uni.navigateTo({
url: `/pages/group/group-invite?id=${this.groupId}`
@ -113,7 +113,8 @@ export default {
url: "/pages/group/group"
});
this.groupStore.removeGroup(this.groupId);
this.chatStore.removeGroupChat(this.groupId);
this.chatStore.removeGroupChat(this
.groupId);
}, 100)
}
})
@ -142,7 +143,8 @@ export default {
url: "/pages/group/group"
});
this.groupStore.removeGroup(this.groupId);
this.chatStore.removeGroupChat(this.groupId);
this.chatStore.removeGroupChat(this
.groupId);
}, 100)
}
})
@ -194,7 +196,7 @@ export default {
}
</script>
<style lang="scss" scoped>
<style lang="scss">
.group-info {
.group-members {
padding: 30rpx;
@ -245,19 +247,38 @@ export default {
}
}
.form {
margin-top: 20rpx;
.group-detail {
margin-top: 30rpx;
padding: 20rpx 20rpx;
background: white;
.form-item {
padding: 0 40rpx;
display: flex;
background: white;
align-items: center;
margin-top: 2rpx;
.label {
width: 220rpx;
line-height: 100rpx;
font-size: $im-font-size;
white-space: nowrap;
}
.detail-text {
font-size: $im-font-size;
.value {
flex: 1;
text-align: right;
line-height: 100rpx;
color: $im-text-color-lighter;
font-size: $im-font-size-small;
white-space: nowrap;
overflow: hidden;
}
}
.group-edit {
padding-top: 30rpx;
padding: 10rpx 40rpx 30rpx 40rpx ;
text-align: center;
background: white;
font-size: $im-font-size-small;
color: $im-text-color-lighter;
}

124
im-uniapp/pages/mine/mine-edit.vue
View File

@ -1,28 +1,35 @@
<template>
<view class="page mine-edit">
<nav-bar back>修改我的信息</nav-bar>
<uni-card :is-shadow="false" is-full :border="false">
<uni-forms ref="form" :modelValue="userInfo" label-position="top" label-width="100%">
<uni-forms-item name="headImage" class="avatar">
<image-upload :onSuccess="onUnloadImageSuccess">
<image :src="userInfo.headImageThumb" class="head-image"></image>
</image-upload>
</uni-forms-item>
<uni-forms-item label="用户名" name="userName">
<uni-easyinput type="text" v-model="userInfo.userName" :disabled="true" />
</uni-forms-item>
<uni-forms-item label="昵称" name="nickName">
<uni-easyinput v-model="userInfo.nickName" type="text" :placeholder="userInfo.userName" />
</uni-forms-item>
<uni-forms-item label="性别" name="sex">
<uni-data-checkbox v-model="userInfo.sex"
:localdata="[{ text: '男', value: 0 }, { text: '女', value: 1 }]"></uni-data-checkbox>
</uni-forms-item>
<uni-forms-item label="签名" name="signature">
<uni-easyinput type="textarea" v-model="userInfo.signature" placeholder="编辑个性标签,展示我的独特态度" />
</uni-forms-item>
</uni-forms>
</uni-card>
<view class="form">
<view class="form-item">
<view class="label">头像</view>
<image-upload class="value" :onSuccess="onUnloadImageSuccess">
<image :src="userInfo.headImageThumb" class="head-image"></image>
</image-upload>
</view>
<view class="form-item">
<view class="label">账号</view>
<view class="value">{{userInfo.userName}}</view>
</view>
<view class="form-item">
<view class="label">昵称</view>
<input class="input" maxlength="20" v-model="userInfo.nickName" placeholder="请输入您的昵称" />
</view>
<view class="form-item">
<view class="label">性别</view>
<radio-group class="radio-group" @change="onSexChange">
<radio class="radio" :value="0" :checked="userInfo.sex==0">男</radio>
<radio class="radio" :value="1" :checked="userInfo.sex==1">女</radio>
</radio-group>
</view>
<view class="form-item">
<view class="label">个性签名</view>
<textarea class="signature" maxlength="128" auto-height v-model="userInfo.signature"
:style="{'text-align': signTextAlign}" @linechange="onLineChange"
placeholder="编辑个性签名,展示我的独特态度"></textarea>
</view>
</view>
<button type="primary" class="bottom-btn" @click="onSubmit()">提交</button>
</view>
</template>
@ -31,11 +38,12 @@
export default {
data() {
return {
signTextAlign: 'right',
userInfo: {}
}
},
methods: {
onSexchange(e) {
onSexChange(e) {
this.userInfo.sex = e.detail.value;
},
onUnloadImageSuccess(file, res) {
@ -53,10 +61,10 @@ export default {
title: "修改成功",
icon: 'none'
});
setTimeout(() => {
uni.navigateBack();
}, 1000);
})
},
onLineChange(e) {
this.signTextAlign = e.detail.lineCount > 1 ? "left" : "right";
}
},
onLoad() {
@ -69,13 +77,63 @@ export default {
<style scoped lang="scss">
.mine-edit {
.head-image {
width: 200rpx;
height: 200rpx;
}
}
.avatar {
margin-top: -30px;
.form {
margin-top: 20rpx;
.form-item {
padding: 0 40rpx;
display: flex;
background: white;
align-items: center;
margin-bottom: 2rpx;
.label {
width: 200rpx;
line-height: 100rpx;
font-size: $im-font-size;
}
.value {
flex: 1;
text-align: right;
line-height: 100rpx;
color: $im-text-color-lighter;
font-size: $im-font-size-small;
}
.radio-group {
flex: 1;
text-align: right;
.radio {
margin-left: 50rpx;
}
}
.input {
flex: 1;
text-align: right;
line-height: 100rpx;
font-size: $im-font-size-small;
}
.signature {
flex: 1;
font-size: $im-font-size-small;
max-height: 160rpx;
padding: 14rpx 0;
text-align: right;
}
.head-image {
width: 120rpx;
height: 120rpx;
border-radius: 5%;
}
}
}
}
</style>
Write Preview
Loading…
Cancel
Save