Commit edc9171d by panjiangyi

成员ui

parent 7a06251d
<template>
<div class="chat-room-con h-100">
<div class="chat-room-con h-100 pos-rel">
<div class="room-title d-flex justify-content-between align-items-center">
<div class="title" @click="showMembers">
{{ chatTitle }}
......@@ -219,7 +219,9 @@ export default class ChatRoom extends Vue {
}
.chat-members {
position: absolute;
width: calc(100% - 350px);
// width: calc(100% - 350px);
left:0;
right:0;
padding: 30px;
padding-bottom: 0;
background: #fff;
......
......@@ -22,7 +22,12 @@
>
</div>
</div>
<ChatCreator v-show="visible" @submit="addMember" @hide="hideAddMember" />
<ChatCreator
v-if="visible"
:selected="chatMembersId"
@submit="addMember"
@hide="hideAddMember"
/>
</div>
<!-- </el-dialog> -->
</template>
......@@ -39,6 +44,9 @@ import { ChatStore, chatStore } from "@/customer-service/store/model";
@Component({ components: { MessageList, ChatRoom, ChatList, ChatCreator } })
export default class Chat extends Vue {
@chatStore.Getter(ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS)
private readonly chatMembers!: ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS;
@chatStore.State(ChatStore.STATE_CHAT_CURRENT_CHAT_ID)
private readonly chatId!: ChatStore.STATE_CHAT_CURRENT_CHAT_ID;
......@@ -48,8 +56,12 @@ export default class Chat extends Vue {
@chatStore.Action(ChatStore.ACTION_TERINATE_CHAT)
private readonly _terminate!: ChatStore.ACTION_TERINATE_CHAT;
@chatStore.Action(ChatStore.ACTION_CHAT_ADD_MEMBERS)
private readonly _addMember!: ChatStore.ACTION_CHAT_ADD_MEMBERS;
@chatStore.Action(ChatStore.ACTION_CHAT_ADD_MEMBERS)
private readonly _addMember!: ChatStore.ACTION_CHAT_ADD_MEMBERS;
private get chatMembersId() {
return this.chatMembers.map(k => +k.eid);
}
private visible = false;
@buttonThrottle()
......
......@@ -21,11 +21,14 @@
v-for="user in userList"
:key="user.id"
class="user-con"
:class="{ isChoosed: isChoosed(user.id) }"
@click="onClickUser(user.id)"
>
<avatar />
<span class="user-name">{{ user.name }}</span>
<span
class="user-name"
:class="{ isChoosed: isChoosed(user.id) }"
>{{ user.name }}</span
>
</div>
</div>
<el-pagination
......@@ -37,13 +40,13 @@
></el-pagination>
<span slot="footer" class="dialog-footer">
<el-button @click="hide">取 消</el-button>
<el-button type="primary" @click="createChat">确 定</el-button>
<el-button type="primary" @click="createChat">1</el-button>
</span>
</el-dialog>
</template>
<script lang="ts">
import { ListEasy, ListTypes } from "uniplat-sdk";
import { Component, Vue, Watch } from "vue-property-decorator";
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import buttonThrottle from "./utils/button-throttle";
......@@ -57,24 +60,20 @@ type User = {
type ThenArg<T> = T extends PromiseLike<infer U> ? U : T;
@Component({ components: { avatar } })
export default class ChatCreator extends Vue {
@chatStore.State(ChatStore.STATE_CHAT_CREATOR_VISIBLE)
private readonly visible!: ChatStore.STATE_CHAT_CREATOR_VISIBLE;
@chatStore.Action(ChatStore.ACTION_CREATE_NEW_CHAT_BY_SERVICE_MAN)
private readonly _createChat!: ChatStore.ACTION_CREATE_NEW_CHAT_BY_SERVICE_MAN;
@Prop({
type: Array,
default: () => [],
})
private selected!: number[];
@Watch("currentPage")
private pageChange() {
this.nextPage();
}
@Watch("visible")
private onvisibleChange() {
if (this.visible) {
this.selectedUsers = [];
}
}
private searchText = "";
private currentPage = 1;
private total = 0;
......@@ -87,8 +86,9 @@ export default class ChatCreator extends Vue {
private getList!: ThenArg<ReturnType<ListEasy["query"]>>["getList"];
public created() {
this.getUserList();
public async created() {
await this.getUserList();
this.selectedUsers = this.selected;
}
private async getUserList(searchText: string | null = null) {
......@@ -183,9 +183,6 @@ export default class ChatCreator extends Vue {
align-items: center;
margin-bottom: 40px;
cursor: pointer;
&.isChoosed {
outline: 1px solid #3285ff;
}
}
.user-name {
height: 15px;
......@@ -193,6 +190,9 @@ export default class ChatCreator extends Vue {
color: #000000;
line-height: 15px;
margin-left: 20px;
&.isChoosed {
color: #3285ff;
}
}
.search-bar {
display: flex;
......
......@@ -621,6 +621,7 @@ export default {
});
detailManager.done();
await action.execute();
await new Promise(resolve => setTimeout(resolve, 500));
await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
},
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment