code review cleanup: center chat show view on page and remove unused chat index page

This commit is contained in:
Mary Kate 2020-10-25 12:35:18 -05:00 committed by Angelina Filippova
parent 4cfab828e7
commit 5bd81b1901
3 changed files with 5 additions and 188 deletions

View file

@ -35,21 +35,6 @@ const statuses = {
]
}
const chatsDisabled = disabledFeatures.includes('chats')
const chats = {
path: '/chats',
component: Layout,
children: [
{
path: 'index',
component: () => import('@/views/chats/index'),
name: 'Chats',
meta: { title: 'chats', icon: 'form', noCache: true }
}
],
hidden: true
}
const reportsDisabled = disabledFeatures.includes('reports')
const reports = {
path: '/reports',
@ -184,7 +169,6 @@ export const asyncRouterMap = [
]
},
...(statusesDisabled ? [] : [statuses]),
...(chatsDisabled ? [] : [chats]),
...(reportsDisabled ? [] : [reports]),
...(invitesDisabled ? [] : [invites]),
...(emojiPacksDisabled ? [] : [emojiPacks]),

View file

@ -1,167 +0,0 @@
<template>
<div v-if="!loadingPeers" class="chats-container">
<div class="chats-header">
<h1>
{{ $t('chats.chats') }}
</h1>
<reboot-button/>
</div>
<div class="chats-header-container"/>
</div>
</template>
<script>
import RebootButton from '@/components/RebootButton'
export default {
name: 'Chats',
components: {
RebootButton
},
data() {
return {
}
},
computed: {
allLoaded() {
return this.$store.state.chat.chatsByInstance.allLoaded
},
buttonLoading() {
return this.$store.state.chat.chatsByInstance.buttonLoading
},
currentInstance() {
return this.selectedInstance === this.$store.state.user.authHost
},
isDesktop() {
return this.$store.state.app.device === 'desktop'
},
isMobile() {
return this.$store.state.app.device === 'mobile'
},
isTablet() {
return this.$store.state.app.device === 'tablet'
},
page() {
return this.$store.state.chat.chatsByInstance.page
},
pageSize() {
return this.$store.state.chat.chatsByInstance.pageSize
}
},
mounted() {
this.$store.dispatch('GetNodeInfo')
this.$store.dispatch('NeedReboot')
},
destroyed() {
this.clearSelection()
this.$store.dispatch('ClearState')
},
methods: {
clearSelection() {
this.selectedUsers = []
},
handleLoadMore() {
this.$store.dispatch('HandlePageChange', this.page + 1)
}
}
}
</script>
<style rel='stylesheet/scss' lang='scss'>
.chats-container {
padding: 0 15px;
h1 {
margin: 10px 0 15px 0;
}
.chat-container {
margin: 0 0 10px;
}
}
.chats-header-container {
.el-button.is-plain:focus, .el-button.is-plain:hover {
border-color: #DCDFE6;
color: #606266;
cursor: default
}
}
.checkbox-container {
margin-bottom: 15px;
}
.filter-container {
display: flex;
height: 36px;
justify-content: space-between;
align-items: center;
margin: 22px 0 15px 0;
}
.reboot-button {
padding: 10px;
margin: 0;
width: 145px;
}
.select-instance {
width: 396px;
}
.chats-header {
display: flex;
align-items: center;
justify-content: space-between;
}
.chats-header-container {
display: flex;
align-items: center;
justify-content: space-between;
}
.chats-pagination {
padding: 15px 0;
text-align: center;
}
@media only screen and (max-width:480px) {
.checkbox-container {
margin-bottom: 10px;
}
.filter-container {
display: flex;
height: 36px;
flex-direction: column;
margin: 10px 0;
}
.select-field {
width: 100%;
margin-bottom: 5px;
}
.select-instance {
width: 100%;
}
.chats-header-container {
flex-direction: column;
align-items: flex-start;
.el-button-group {
width: 100%;
}
.el-button {
padding: 10px 6.5px;
width: 50%;
}
.el-button-group>.el-button:first-child {
border-bottom-left-radius: 0;
}
.el-button-group>.el-button:not(:first-child):not(:last-child).private-button {
border-top-right-radius: 4px;
}
.el-button-group>.el-button:not(:first-child):not(:last-child).public-button {
border-bottom-left-radius: 4px;
border-top: white;
}
.el-button-group>.el-button:last-child {
border-top-right-radius: 0;
border-top: white;
}
.reboot-button {
margin: 10px 0 0 0;
}
}
}
</style>

View file

@ -113,6 +113,7 @@ export default {
.chat-page-header {
display: flex;
margin: 22px 15px 22px 20px;
justify-content: center;
padding: 0;
h1 {
display: inline
@ -141,10 +142,10 @@ export default {
.chat-messages-container {
display: flex;
flex-direction: column;
max-width: 1000px;
.el-timeline-item {
margin-left: 20px;
}
align-items: center;
}
.messages.el-timeline {
padding: 0;
}
.no-chats {
margin-left: 28px;
@ -189,7 +190,6 @@ export default {
}
.messages.el-timeline {
padding-left: 10px;
max-width: 97%;
}
.el-timeline-item__wrapper {
padding-left: 18px;