oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

wip

Browse source
This commit is contained in:
syuilo 2020-11-29 12:34:39 +09:00
parent 9bf5dc67f5
commit 17d62b689d
6 changed files with 215 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

57
src/client/pages/user/clips.vue Normal file
View file

@ -0,0 +1,57 @@
<template>
<div>
<MkPagination :pagination="pagination" #default="{items}" ref="list">
<MkA v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _vMargin">
<b>{{ item.name }}</b>
<div v-if="item.description" class="description">{{ item.description }}</div>
</MkA>
</MkPagination>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import MkPagination from '@/components/ui/pagination.vue';
import { userPage, acct } from '../../filters/user';
export default defineComponent({
components: {
MkPagination,
},
props: {
user: {
type: Object,
required: true
},
},
data() {
return {
pagination: {
endpoint: 'users/clips',
limit: 20,
params: {
userId: this.user.id,
}
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>
<style lang="scss" scoped>
</style>

20
src/client/pages/user/index.vue
View file

@ -60,12 +60,15 @@
<div class="main">
<div class="nav _vMargin">
<MkA :to="userPage(user)" :class="{ active: page === 'index' }" class="link">
<Fa :icon="faCommentAlt" class="icon"/>
<span>{{ $t('notes') }}</span>
</MkA>
<MkA :to="userPage(user, 'clips')" :class="{ active: page === 'clips' }" class="link">
<Fa :icon="faPaperclip" class="icon"/>
<span>{{ $t('clips') }}</span>
</MkA>
<MkA :to="userPage(user, 'pages')" :class="{ active: page === 'pages' }" class="link">
<Fa :icon="faFileAlt" class="icon"/>
<span>{{ $t('pages') }}</span>
</MkA>
<div class="actions">
@ -83,6 +86,8 @@
</template>
<XFollowList v-else-if="page === 'following'" type="following" :user="user" class="_vMargin"/>
<XFollowList v-else-if="page === 'followers'" type="followers" :user="user" class="_vMargin"/>
<XClips v-else-if="page === 'clips'" :user="user" class="_vMargin"/>
<XPages v-else-if="page === 'pages'" :user="user" class="_vMargin"/>
</div>
</div>
</div>
@ -193,8 +198,8 @@
<script lang="ts">
import { defineComponent, defineAsyncComponent, computed } from 'vue';
import { faExclamationTriangle, faEllipsisH, faRobot, faLock, faBookmark, faChartBar, faImage, faBirthdayCake, faMapMarker } from '@fortawesome/free-solid-svg-icons';
import { faCalendarAlt, faBookmark as farBookmark } from '@fortawesome/free-regular-svg-icons';
import { faExclamationTriangle, faEllipsisH, faRobot, faLock, faBookmark, faChartBar, faImage, faBirthdayCake, faMapMarker, faPaperclip, faFileAlt } from '@fortawesome/free-solid-svg-icons';
import { faCalendarAlt, faBookmark as farBookmark, faCommentAlt } from '@fortawesome/free-regular-svg-icons';
import * as age from 's-age';
import XUserTimeline from './index.timeline.vue';
import XNote from '@/components/note.vue';
@ -221,6 +226,8 @@ export default defineComponent({
MkFolder,
MkTab,
XFollowList: defineAsyncComponent(() => import('./follow-list.vue')),
XClips: defineAsyncComponent(() => import('./clips.vue')),
XPages: defineAsyncComponent(() => import('./pages.vue')),
XPhotos: defineAsyncComponent(() => import('./index.photos.vue')),
XActivity: defineAsyncComponent(() => import('./index.activity.vue')),
},
@ -251,7 +258,7 @@ export default defineComponent({
error: null,
parallaxAnimationId: null,
narrow: null,
faExclamationTriangle, faEllipsisH, faRobot, faLock, faBookmark, farBookmark, faChartBar, faImage, faBirthdayCake, faMapMarker, faCalendarAlt
faExclamationTriangle, faEllipsisH, faRobot, faLock, faBookmark, farBookmark, faChartBar, faImage, faBirthdayCake, faMapMarker, faCalendarAlt, faCommentAlt, faPaperclip, faFileAlt,
};
},
@ -471,7 +478,8 @@ export default defineComponent({
display: flex;
align-items: center;
margin-top: var(--margin);
font-size: 120%;
//font-size: 120%;
font-weight: bold;
> .link {
display: inline-block;
@ -479,6 +487,10 @@ export default defineComponent({
text-align: center;
border-bottom: solid 3px transparent;
&:hover {
text-decoration: none;
}
&.active {
color: var(--accent);
border-bottom-color: var(--accent);

56
src/client/pages/user/pages.vue Normal file
View file

@ -0,0 +1,56 @@
<template>
<div>
<MkPagination :pagination="pagination" #default="{items}" ref="list">
<MkPagePreview v-for="page in items" :page="page" :key="page.id" class="_vMargin"/>
</MkPagination>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import MkPagePreview from '@/components/page-preview.vue';
import MkPagination from '@/components/ui/pagination.vue';
import { userPage, acct } from '../../filters/user';
export default defineComponent({
components: {
MkPagination,
MkPagePreview,
},
props: {
user: {
type: Object,
required: true
},
},
data() {
return {
pagination: {
endpoint: 'users/pages',
limit: 20,
params: {
userId: this.user.id,
}
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
},
methods: {
userPage,
acct
}
});
</script>
<style lang="scss" scoped>
</style>