mirror of
https://iceshrimp.dev/crimekillz/iceshrimp-161sh.git
synced 2024-11-23 20:49:06 +01:00
wip
This commit is contained in:
parent
37e4719d7d
commit
3ce5803bb0
@ -6,6 +6,7 @@ import forkit from './forkit.vue';
|
|||||||
import nav from './nav.vue';
|
import nav from './nav.vue';
|
||||||
import postHtml from './post-html';
|
import postHtml from './post-html';
|
||||||
import reactionIcon from './reaction-icon.vue';
|
import reactionIcon from './reaction-icon.vue';
|
||||||
|
import time from './time.vue';
|
||||||
|
|
||||||
Vue.component('mk-signin', signin);
|
Vue.component('mk-signin', signin);
|
||||||
Vue.component('mk-signup', signup);
|
Vue.component('mk-signup', signup);
|
||||||
@ -13,3 +14,4 @@ Vue.component('mk-forkit', forkit);
|
|||||||
Vue.component('mk-nav', nav);
|
Vue.component('mk-nav', nav);
|
||||||
Vue.component('mk-post-html', postHtml);
|
Vue.component('mk-post-html', postHtml);
|
||||||
Vue.component('mk-reaction-icon', reactionIcon);
|
Vue.component('mk-reaction-icon', reactionIcon);
|
||||||
|
Vue.component('mk-time', time);
|
||||||
|
@ -6,38 +6,51 @@
|
|||||||
</time>
|
</time>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="typescript">
|
<script lang="ts">
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
props: ['time', 'mode'],
|
props: {
|
||||||
|
time: {
|
||||||
|
type: [Date, String],
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
mode: {
|
||||||
|
type: String,
|
||||||
|
default: 'relative'
|
||||||
|
}
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
mode: 'relative',
|
|
||||||
tickId: null,
|
tickId: null,
|
||||||
now: new Date()
|
now: new Date()
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
absolute() {
|
_time(): Date {
|
||||||
return (
|
return typeof this.time == 'string' ? new Date(this.time) : this.time;
|
||||||
this.time.getFullYear() + '年' +
|
|
||||||
(this.time.getMonth() + 1) + '月' +
|
|
||||||
this.time.getDate() + '日' +
|
|
||||||
' ' +
|
|
||||||
this.time.getHours() + '時' +
|
|
||||||
this.time.getMinutes() + '分');
|
|
||||||
},
|
},
|
||||||
relative() {
|
absolute(): string {
|
||||||
const ago = (this.now - this.time) / 1000/*ms*/;
|
const time = this._time;
|
||||||
return (
|
return (
|
||||||
ago >= 31536000 ? '%i18n:common.time.years_ago%' .replace('{}', ~~(ago / 31536000)) :
|
time.getFullYear() + '年' +
|
||||||
ago >= 2592000 ? '%i18n:common.time.months_ago%' .replace('{}', ~~(ago / 2592000)) :
|
(time.getMonth() + 1) + '月' +
|
||||||
ago >= 604800 ? '%i18n:common.time.weeks_ago%' .replace('{}', ~~(ago / 604800)) :
|
time.getDate() + '日' +
|
||||||
ago >= 86400 ? '%i18n:common.time.days_ago%' .replace('{}', ~~(ago / 86400)) :
|
' ' +
|
||||||
ago >= 3600 ? '%i18n:common.time.hours_ago%' .replace('{}', ~~(ago / 3600)) :
|
time.getHours() + '時' +
|
||||||
ago >= 60 ? '%i18n:common.time.minutes_ago%'.replace('{}', ~~(ago / 60)) :
|
time.getMinutes() + '分');
|
||||||
ago >= 10 ? '%i18n:common.time.seconds_ago%'.replace('{}', ~~(ago % 60)) :
|
},
|
||||||
|
relative(): string {
|
||||||
|
const time = this._time;
|
||||||
|
const ago = (this.now.getTime() - time.getTime()) / 1000/*ms*/;
|
||||||
|
return (
|
||||||
|
ago >= 31536000 ? '%i18n:common.time.years_ago%' .replace('{}', (~~(ago / 31536000)).toString()) :
|
||||||
|
ago >= 2592000 ? '%i18n:common.time.months_ago%' .replace('{}', (~~(ago / 2592000)).toString()) :
|
||||||
|
ago >= 604800 ? '%i18n:common.time.weeks_ago%' .replace('{}', (~~(ago / 604800)).toString()) :
|
||||||
|
ago >= 86400 ? '%i18n:common.time.days_ago%' .replace('{}', (~~(ago / 86400)).toString()) :
|
||||||
|
ago >= 3600 ? '%i18n:common.time.hours_ago%' .replace('{}', (~~(ago / 3600)).toString()) :
|
||||||
|
ago >= 60 ? '%i18n:common.time.minutes_ago%'.replace('{}', (~~(ago / 60)).toString()) :
|
||||||
|
ago >= 10 ? '%i18n:common.time.seconds_ago%'.replace('{}', (~~(ago % 60)).toString()) :
|
||||||
ago >= 0 ? '%i18n:common.time.just_now%' :
|
ago >= 0 ? '%i18n:common.time.just_now%' :
|
||||||
ago < 0 ? '%i18n:common.time.future%' :
|
ago < 0 ? '%i18n:common.time.future%' :
|
||||||
'%i18n:common.time.unknown%');
|
'%i18n:common.time.unknown%');
|
||||||
|
@ -4,7 +4,7 @@
|
|||||||
@mousemove="onMousemove"
|
@mousemove="onMousemove"
|
||||||
@mouseleave="onMouseleave"
|
@mouseleave="onMouseleave"
|
||||||
@click.prevent="onClick"
|
@click.prevent="onClick"
|
||||||
:style="styles"
|
:style="style"
|
||||||
:title="image.name"></a>
|
:title="image.name"></a>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="mk-posts-post" tabindex="-1" :title="title" @keydown="onKeydown" @dblclick="onDblClick">
|
<div class="mk-posts-post" tabindex="-1" :title="title" @keydown="onKeydown">
|
||||||
<div class="reply-to" v-if="p.reply">
|
<div class="reply-to" v-if="p.reply">
|
||||||
<mk-posts-post-sub post="p.reply"/>
|
<mk-posts-post-sub post="p.reply"/>
|
||||||
</div>
|
</div>
|
||||||
@ -58,7 +58,7 @@
|
|||||||
<button @click="menu" ref="menuButton">
|
<button @click="menu" ref="menuButton">
|
||||||
%fa:ellipsis-h%
|
%fa:ellipsis-h%
|
||||||
</button>
|
</button>
|
||||||
<button @click="toggleDetail" title="%i18n:desktop.tags.mk-timeline-post.detail">
|
<button title="%i18n:desktop.tags.mk-timeline-post.detail">
|
||||||
<template v-if="!isDetailOpened">%fa:caret-down%</template>
|
<template v-if="!isDetailOpened">%fa:caret-down%</template>
|
||||||
<template v-if="isDetailOpened">%fa:caret-up%</template>
|
<template v-if="isDetailOpened">%fa:caret-up%</template>
|
||||||
</button>
|
</button>
|
||||||
@ -94,6 +94,7 @@ export default Vue.extend({
|
|||||||
props: ['post'],
|
props: ['post'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
isDetailOpened: false,
|
||||||
connection: null,
|
connection: null,
|
||||||
connectionId: null
|
connectionId: null
|
||||||
};
|
};
|
||||||
@ -109,7 +110,11 @@ export default Vue.extend({
|
|||||||
return this.isRepost ? this.post.repost : this.post;
|
return this.isRepost ? this.post.repost : this.post;
|
||||||
},
|
},
|
||||||
reactionsCount(): number {
|
reactionsCount(): number {
|
||||||
return this.p.reaction_counts ? Object.keys(this.p.reaction_counts).map(key => this.p.reaction_counts[key]).reduce((a, b) => a + b) : 0;
|
return this.p.reaction_counts
|
||||||
|
? Object.keys(this.p.reaction_counts)
|
||||||
|
.map(key => this.p.reaction_counts[key])
|
||||||
|
.reduce((a, b) => a + b)
|
||||||
|
: 0;
|
||||||
},
|
},
|
||||||
title(): string {
|
title(): string {
|
||||||
return dateStringify(this.p.created_at);
|
return dateStringify(this.p.created_at);
|
||||||
|
Loading…
Reference in New Issue
Block a user