diff --git a/src/views/statuses/show.vue b/src/views/statuses/show.vue index c1e6dd21..8ba6b189 100644 --- a/src/views/statuses/show.vue +++ b/src/views/statuses/show.vue @@ -29,6 +29,18 @@
+
+

{{ $t('userProfile.recentStatuses') }} by {{ user.display_name }}

+ + {{ $t('statuses.showPrivateStatuses') }} + + + + + +

{{ $t('userProfile.noStatuses') }}

+
+
@@ -42,7 +54,7 @@ export default { components: { ModerationDropdown, RebootButton, Status }, data() { return { - showPrivate: true, + showPrivate: false, resetPasswordDialogOpen: false } }, @@ -62,6 +74,12 @@ export default { status() { return this.$store.state.status.fetchedStatus }, + statuses() { + return this.$store.state.userProfile.statuses + }, + statusesLoading() { + return this.$store.state.userProfile.statusesLoading + }, user() { return this.$store.state.status.fetchedStatus.account } @@ -70,11 +88,15 @@ export default { this.$store.dispatch('NeedReboot') this.$store.dispatch('GetNodeInfo') this.$store.dispatch('FetchStatus', this.$route.params.id) + this.$store.dispatch('FetchUserStatuses', { userId: this.user.id, godmode: this.showPrivate }) }, methods: { accountExists(account, key) { return account[key] }, + onTogglePrivate() { + this.$store.dispatch('FetchUserStatuses', { userId: this.user.id, godmode: this.showPrivate }) + }, openResetPasswordDialog() { this.resetPasswordDialogOpen = true } @@ -87,13 +109,31 @@ export default { display: flex; align-items: center; } +.no-statuses { + margin-left: 28px; + color: #606266; +} .reboot-button { padding: 10px; margin-left: 6px; } +.recent-statuses { + margin-left: 28px; +} +.recent-statuses-container { + display: flex; + flex-direction: column; +} +.show-private-statuses { + margin-left: 28px; + margin-bottom: 20px; +} .status-container { margin: 0 15px 0 20px; } +.statuses { + padding: 0 20px 0 0; +} .user-page-header { display: flex; justify-content: space-between; @@ -113,6 +153,16 @@ export default { display: flex; justify-content: space-between; } + .recent-statuses { + margin: 20px 10px 15px 10px; + } + .recent-statuses-container { + width: 100%; + margin: 0 10px; + } + .show-private-statuses { + margin: 0 10px 20px 10px; + } .user-page-header { padding: 0; margin: 7px 15px 15px 10px; @@ -125,6 +175,16 @@ export default { } } @media only screen and (max-width:801px) and (min-width: 481px) { + .recent-statuses { + margin: 20px 10px 15px 0; + } + .recent-statuses-container { + width: 97%; + margin: 0 20px; + } + .show-private-statuses { + margin: 0 10px 20px 0; + } .user-page-header { padding: 0; margin: 7px 15px 20px 20px;