parent
							
								
									3796a3edea
								
							
						
					
					
						commit
						ce6cc21bcd
					
				
					 6 changed files with 195 additions and 182 deletions
				
			
		|  | @ -1,13 +1,19 @@ | |||
| <template> | ||||
| <div class="bcekxzvu _card _gap"> | ||||
| 	<div class="_content target"> | ||||
| 		<MkAvatar class="avatar" :user="report.targetUser" :show-indicator="true"/> | ||||
| 		<MkA v-user-preview="report.targetUserId" class="info" :to="userPage(report.targetUser)"> | ||||
| 			<MkUserName class="name" :user="report.targetUser"/> | ||||
| 			<MkAcct class="acct" :user="report.targetUser" style="display: block;"/> | ||||
| <div class="bcekxzvu _gap _panel"> | ||||
| 	<div class="target"> | ||||
| 		<MkA v-user-preview="report.targetUserId" class="info" :to="`/user-info/${report.targetUserId}`" :behavior="'window'"> | ||||
| 			<MkAvatar class="avatar" :user="report.targetUser" :show-indicator="true" :disable-link="true"/> | ||||
| 			<div class="names"> | ||||
| 				<MkUserName class="name" :user="report.targetUser"/> | ||||
| 				<MkAcct class="acct" :user="report.targetUser" style="display: block;"/> | ||||
| 			</div> | ||||
| 		</MkA> | ||||
| 		<MkKeyValue class="_formBlock"> | ||||
| 			<template #key>{{ $ts.registeredDate }}</template> | ||||
| 			<template #value>{{ new Date(report.targetUser.createdAt).toLocaleString() }} (<MkTime :time="report.targetUser.createdAt"/>)</template> | ||||
| 		</MkKeyValue> | ||||
| 	</div> | ||||
| 	<div class="_content"> | ||||
| 	<div class="detail"> | ||||
| 		<div> | ||||
| 			<Mfm :text="report.comment"/> | ||||
| 		</div> | ||||
|  | @ -18,85 +24,84 @@ | |||
| 			<MkAcct :user="report.assignee"/> | ||||
| 		</div> | ||||
| 		<div><MkTime :time="report.createdAt"/></div> | ||||
| 	</div> | ||||
| 	<div class="_footer"> | ||||
| 		<MkSwitch v-model="forward" :disabled="report.targetUser.host == null || report.resolved"> | ||||
| 			{{ $ts.forwardReport }} | ||||
| 			<template #caption>{{ $ts.forwardReportIsAnonymous }}</template> | ||||
| 		</MkSwitch> | ||||
| 		<MkButton v-if="!report.resolved" primary @click="resolve">{{ $ts.abuseMarkAsResolved }}</MkButton> | ||||
| 		<div class="action"> | ||||
| 			<MkSwitch v-model="forward" :disabled="report.targetUser.host == null || report.resolved"> | ||||
| 				{{ $ts.forwardReport }} | ||||
| 				<template #caption>{{ $ts.forwardReportIsAnonymous }}</template> | ||||
| 			</MkSwitch> | ||||
| 			<MkButton v-if="!report.resolved" primary @click="resolve">{{ $ts.abuseMarkAsResolved }}</MkButton> | ||||
| 		</div> | ||||
| 	</div> | ||||
| </div> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| 
 | ||||
| <script lang="ts" setup> | ||||
| import MkButton from '@/components/ui/button.vue'; | ||||
| import MkSwitch from '@/components/form/switch.vue'; | ||||
| import MkKeyValue from '@/components/key-value.vue'; | ||||
| import { acct, userPage } from '@/filters/user'; | ||||
| import * as os from '@/os'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		MkButton, | ||||
| 		MkSwitch, | ||||
| 	}, | ||||
| const props = defineProps<{ | ||||
| 	report: any; | ||||
| }>(); | ||||
| 
 | ||||
| 	props: { | ||||
| 		report: { | ||||
| 			type: Object, | ||||
| 			required: true, | ||||
| 		} | ||||
| 	}, | ||||
| const emit = defineEmits<{ | ||||
| 	(ev: 'resolved', reportId: string): void; | ||||
| }>(); | ||||
| 
 | ||||
| 	emits: ['resolved'], | ||||
| let forward = $ref(props.report.forwarded); | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			forward: this.report.forwarded, | ||||
| 		}; | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
| 		acct, | ||||
| 		userPage, | ||||
| 
 | ||||
| 		resolve() { | ||||
| 			os.apiWithDialog('admin/resolve-abuse-user-report', { | ||||
| 				forward: this.forward, | ||||
| 				reportId: this.report.id, | ||||
| 			}).then(() => { | ||||
| 				this.$emit('resolved', this.report.id); | ||||
| 			}); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| function resolve() { | ||||
| 	os.apiWithDialog('admin/resolve-abuse-user-report', { | ||||
| 		forward: forward, | ||||
| 		reportId: props.report.id, | ||||
| 	}).then(() => { | ||||
| 		emit('resolved', props.report.id); | ||||
| 	}); | ||||
| } | ||||
| </script> | ||||
| 
 | ||||
| <style lang="scss" scoped> | ||||
| .bcekxzvu { | ||||
| 	display: flex; | ||||
| 
 | ||||
| 	> .target { | ||||
| 		display: flex; | ||||
| 		width: 100%; | ||||
| 		width: 35%; | ||||
| 		box-sizing: border-box; | ||||
| 		text-align: left; | ||||
| 		align-items: center; | ||||
| 
 | ||||
| 		> .avatar { | ||||
| 			width: 42px; | ||||
| 			height: 42px; | ||||
| 		} | ||||
| 		padding: 24px; | ||||
| 		border-right: solid 1px var(--divider); | ||||
| 
 | ||||
| 		> .info { | ||||
| 			margin-left: 0.3em; | ||||
| 			padding: 0 8px; | ||||
| 			flex: 1; | ||||
| 			display: flex; | ||||
| 			box-sizing: border-box; | ||||
| 			align-items: center; | ||||
| 			padding: 14px; | ||||
| 			border-radius: 8px; | ||||
| 			background-image: linear-gradient(45deg, rgb(255 196 0 / 15%) 16.67%, transparent 16.67%, transparent 50%, rgb(255 196 0 / 15%) 50%, rgb(255 196 0 / 15%) 66.67%, transparent 66.67%, transparent 100%); | ||||
| 			background-size: 16px 16px; | ||||
| 
 | ||||
| 			> .name { | ||||
| 				font-weight: bold; | ||||
| 			> .avatar { | ||||
| 				width: 42px; | ||||
| 				height: 42px; | ||||
| 			} | ||||
| 
 | ||||
| 			> .names { | ||||
| 				margin-left: 0.3em; | ||||
| 				padding: 0 8px; | ||||
| 				flex: 1; | ||||
| 
 | ||||
| 				> .name { | ||||
| 					font-weight: bold; | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
| 
 | ||||
| 	> .detail { | ||||
| 		flex: 1; | ||||
| 		padding: 24px; | ||||
| 	} | ||||
| } | ||||
| </style> | ||||
|  |  | |||
|  | @ -107,10 +107,15 @@ export class Router extends EventEmitter<{ | |||
| 						} | ||||
| 						break pathMatchLoop; | ||||
| 					} else { | ||||
| 						if (p.startsWith && (parts[0] == null || !parts[0].startsWith(p.startsWith))) continue forEachRouteLoop; | ||||
| 						if (p.startsWith) { | ||||
| 							if (parts[0] == null || !parts[0].startsWith(p.startsWith)) continue forEachRouteLoop; | ||||
| 
 | ||||
| 						props.set(p.name, parts[0]); | ||||
| 						parts.shift(); | ||||
| 							props.set(p.name, parts[0].substring(p.startsWith.length)); | ||||
| 							parts.shift(); | ||||
| 						} else { | ||||
| 							props.set(p.name, parts[0]); | ||||
| 							parts.shift(); | ||||
| 						} | ||||
| 					} | ||||
| 				} | ||||
| 			} | ||||
|  |  | |||
|  | @ -151,21 +151,21 @@ watch($$(eyeCatchingImageId), async () => { | |||
| 
 | ||||
| function getSaveOptions() { | ||||
| 	return { | ||||
| 		title: tatitle.trim(), | ||||
| 		name: taname.trim(), | ||||
| 		summary: tasummary, | ||||
| 		font: tafont, | ||||
| 		script: tascript, | ||||
| 		hideTitleWhenPinned: tahideTitleWhenPinned, | ||||
| 		alignCenter: taalignCenter, | ||||
| 		content: tacontent, | ||||
| 		variables: tavariables, | ||||
| 		eyeCatchingImageId: taeyeCatchingImageId, | ||||
| 		title: title.trim(), | ||||
| 		name: name.trim(), | ||||
| 		summary: summary, | ||||
| 		font: font, | ||||
| 		script: script, | ||||
| 		hideTitleWhenPinned: hideTitleWhenPinned, | ||||
| 		alignCenter: alignCenter, | ||||
| 		content: content, | ||||
| 		variables: variables, | ||||
| 		eyeCatchingImageId: eyeCatchingImageId, | ||||
| 	}; | ||||
| } | ||||
| 
 | ||||
| function save() { | ||||
| 	const options = tagetSaveOptions(); | ||||
| 	const options = getSaveOptions(); | ||||
| 
 | ||||
| 	const onError = err => { | ||||
| 		if (err.id == '3d81ceae-475f-4600-b2a8-2bc116157532') { | ||||
|  | @ -184,11 +184,11 @@ function save() { | |||
| 		} | ||||
| 	}; | ||||
| 
 | ||||
| 	if (tapageId) { | ||||
| 		options.pageId = tapageId; | ||||
| 	if (pageId) { | ||||
| 		options.pageId = pageId; | ||||
| 		os.api('pages/update', options) | ||||
| 		.then(page => { | ||||
| 			tacurrentName = taname.trim(); | ||||
| 			currentName = name.trim(); | ||||
| 			os.alert({ | ||||
| 				type: 'success', | ||||
| 				text: i18n.ts._pages.updated, | ||||
|  | @ -197,8 +197,8 @@ function save() { | |||
| 	} else { | ||||
| 		os.api('pages/create', options) | ||||
| 		.then(created => { | ||||
| 			tapageId = created.id; | ||||
| 			tacurrentName = name.trim(); | ||||
| 			pageId = created.id; | ||||
| 			currentName = name.trim(); | ||||
| 			os.alert({ | ||||
| 				type: 'success', | ||||
| 				text: i18n.ts._pages.created, | ||||
|  | @ -227,11 +227,11 @@ function del() { | |||
| } | ||||
| 
 | ||||
| function duplicate() { | ||||
| 	tatitle = tatitle + ' - copy'; | ||||
| 	taname = taname + '-copy'; | ||||
| 	os.api('pages/create', tagetSaveOptions()).then(created => { | ||||
| 		tapageId = created.id; | ||||
| 		tacurrentName = taname.trim(); | ||||
| 	title = title + ' - copy'; | ||||
| 	name = name + '-copy'; | ||||
| 	os.api('pages/create', getSaveOptions()).then(created => { | ||||
| 		pageId = created.id; | ||||
| 		currentName = name.trim(); | ||||
| 		os.alert({ | ||||
| 			type: 'success', | ||||
| 			text: i18n.ts._pages.created, | ||||
|  | @ -244,12 +244,12 @@ async function add() { | |||
| 	const { canceled, result: type } = await os.select({ | ||||
| 		type: null, | ||||
| 		title: i18n.ts._pages.chooseBlock, | ||||
| 		groupedItems: tagetPageBlockList(), | ||||
| 		groupedItems: getPageBlockList(), | ||||
| 	}); | ||||
| 	if (canceled) return; | ||||
| 
 | ||||
| 	const id = uuid(); | ||||
| 	tacontent.push({ id, type }); | ||||
| 	content.push({ id, type }); | ||||
| } | ||||
| 
 | ||||
| async function addVariable() { | ||||
|  | @ -260,7 +260,7 @@ async function addVariable() { | |||
| 
 | ||||
| 	name = name.trim(); | ||||
| 
 | ||||
| 	if (tahpml.isUsedName(name)) { | ||||
| 	if (hpml.isUsedName(name)) { | ||||
| 		os.alert({ | ||||
| 			type: 'error', | ||||
| 			text: i18n.ts._pages.variableNameIsAlreadyUsed, | ||||
|  | @ -269,11 +269,11 @@ async function addVariable() { | |||
| 	} | ||||
| 
 | ||||
| 	const id = uuid(); | ||||
| 	tavariables.push({ id, name, type: null }); | ||||
| 	variables.push({ id, name, type: null }); | ||||
| } | ||||
| 
 | ||||
| function removeVariable(v) { | ||||
| 	tavariables = tavariables.filter(x => x.name !== v.name); | ||||
| 	variables = variables.filter(x => x.name !== v.name); | ||||
| } | ||||
| 
 | ||||
| function getPageBlockList() { | ||||
|  | @ -352,7 +352,7 @@ function setEyeCatchingImage(e) { | |||
| } | ||||
| 
 | ||||
| function removeEyeCatchingImage() { | ||||
| 	taeyeCatchingImageId = null; | ||||
| 	eyeCatchingImageId = null; | ||||
| } | ||||
| 
 | ||||
| function highlighter(code) { | ||||
|  |  | |||
|  | @ -1,63 +1,65 @@ | |||
| <template><MkStickyContainer> | ||||
| <template> | ||||
| <MkStickyContainer> | ||||
| 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> | ||||
| 		<MkSpacer :content-max="700"> | ||||
| 	<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> | ||||
| 		<div v-if="page" :key="page.id" v-size="{ max: [450] }" class="xcukqgmh"> | ||||
| 			<div class="_block main"> | ||||
| 				<!-- | ||||
| 	<MkSpacer :content-max="700"> | ||||
| 		<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in"> | ||||
| 			<div v-if="page" :key="page.id" v-size="{ max: [450] }" class="xcukqgmh"> | ||||
| 				<div class="_block main"> | ||||
| 					<!-- | ||||
| 				<div class="header"> | ||||
| 					<h1>{{ page.title }}</h1> | ||||
| 				</div> | ||||
| 				--> | ||||
| 				<div class="banner"> | ||||
| 					<img v-if="page.eyeCatchingImageId" :src="page.eyeCatchingImage.url"/> | ||||
| 				</div> | ||||
| 				<div class="content"> | ||||
| 					<XPage :page="page"/> | ||||
| 				</div> | ||||
| 				<div class="actions"> | ||||
| 					<div class="like"> | ||||
| 						<MkButton v-if="page.isLiked" v-tooltip="$ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> | ||||
| 						<MkButton v-else v-tooltip="$ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> | ||||
| 					<div class="banner"> | ||||
| 						<img v-if="page.eyeCatchingImageId" :src="page.eyeCatchingImage.url"/> | ||||
| 					</div> | ||||
| 					<div class="other"> | ||||
| 						<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button> | ||||
| 						<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button> | ||||
| 					<div class="content"> | ||||
| 						<XPage :page="page"/> | ||||
| 					</div> | ||||
| 					<div class="actions"> | ||||
| 						<div class="like"> | ||||
| 							<MkButton v-if="page.isLiked" v-tooltip="$ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> | ||||
| 							<MkButton v-else v-tooltip="$ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> | ||||
| 						</div> | ||||
| 						<div class="other"> | ||||
| 							<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button> | ||||
| 							<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button> | ||||
| 						</div> | ||||
| 					</div> | ||||
| 					<div class="user"> | ||||
| 						<MkAvatar :user="page.user" class="avatar"/> | ||||
| 						<div class="name"> | ||||
| 							<MkUserName :user="page.user" style="display: block;"/> | ||||
| 							<MkAcct :user="page.user"/> | ||||
| 						</div> | ||||
| 						<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/> | ||||
| 					</div> | ||||
| 					<div class="links"> | ||||
| 						<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ $ts._pages.viewSource }}</MkA> | ||||
| 						<template v-if="$i && $i.id === page.userId"> | ||||
| 							<MkA :to="`/pages/edit/${page.id}`" class="link">{{ $ts._pages.editThisPage }}</MkA> | ||||
| 							<button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ $ts.unpin }}</button> | ||||
| 							<button v-else class="link _textButton" @click="pin(true)">{{ $ts.pin }}</button> | ||||
| 						</template> | ||||
| 					</div> | ||||
| 				</div> | ||||
| 				<div class="user"> | ||||
| 					<MkAvatar :user="page.user" class="avatar"/> | ||||
| 					<div class="name"> | ||||
| 						<MkUserName :user="page.user" style="display: block;"/> | ||||
| 						<MkAcct :user="page.user"/> | ||||
| 					</div> | ||||
| 					<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/> | ||||
| 				</div> | ||||
| 				<div class="links"> | ||||
| 					<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ $ts._pages.viewSource }}</MkA> | ||||
| 					<template v-if="$i && $i.id === page.userId"> | ||||
| 						<MkA :to="`/pages/edit/${page.id}`" class="link">{{ $ts._pages.editThisPage }}</MkA> | ||||
| 						<button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ $ts.unpin }}</button> | ||||
| 						<button v-else class="link _textButton" @click="pin(true)">{{ $ts.pin }}</button> | ||||
| 					</template> | ||||
| 				<div class="footer"> | ||||
| 					<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div> | ||||
| 					<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div> | ||||
| 				</div> | ||||
| 				<MkAd :prefer="['horizontal', 'horizontal-big']"/> | ||||
| 				<MkContainer :max-height="300" :foldable="true" class="other"> | ||||
| 					<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> | ||||
| 					<MkPagination v-slot="{items}" :pagination="otherPostsPagination"> | ||||
| 						<MkPagePreview v-for="page in items" :key="page.id" :page="page" class="_gap"/> | ||||
| 					</MkPagination> | ||||
| 				</MkContainer> | ||||
| 			</div> | ||||
| 			<div class="footer"> | ||||
| 				<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div> | ||||
| 				<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div> | ||||
| 			</div> | ||||
| 			<MkAd :prefer="['horizontal', 'horizontal-big']"/> | ||||
| 			<MkContainer :max-height="300" :foldable="true" class="other"> | ||||
| 				<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> | ||||
| 				<MkPagination v-slot="{items}" :pagination="otherPostsPagination"> | ||||
| 					<MkPagePreview v-for="page in items" :key="page.id" :page="page" class="_gap"/> | ||||
| 				</MkPagination> | ||||
| 			</MkContainer> | ||||
| 		</div> | ||||
| 		<MkError v-else-if="error" @retry="fetch()"/> | ||||
| 		<MkLoading v-else/> | ||||
| 	</transition> | ||||
| </MkSpacer></MkStickyContainer> | ||||
| 			<MkError v-else-if="error" @retry="fetchPage()"/> | ||||
| 			<MkLoading v-else/> | ||||
| 		</transition> | ||||
| 	</MkSpacer> | ||||
| </MkStickyContainer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts" setup> | ||||
|  |  | |||
|  | @ -109,23 +109,7 @@ function focus(): void { | |||
| 	tlComponent.focus(); | ||||
| } | ||||
| 
 | ||||
| const headerActions = $computed(() => [{ | ||||
| 	icon: 'fas fa-list-ul', | ||||
| 	text: i18n.ts.lists, | ||||
| 	handler: chooseList, | ||||
| }, { | ||||
| 	icon: 'fas fa-satellite', | ||||
| 	text: i18n.ts.antennas, | ||||
| 	handler: chooseAntenna, | ||||
| }, { | ||||
| 	icon: 'fas fa-satellite-dish', | ||||
| 	text: i18n.ts.channel, | ||||
| 	handler: chooseChannel, | ||||
| }, { | ||||
| 	icon: 'fas fa-calendar-alt', | ||||
| 	text: i18n.ts.jumpToSpecifiedDate, | ||||
| 	handler: timetravel, | ||||
| }]); | ||||
| const headerActions = $computed(() => []); | ||||
| 
 | ||||
| const headerTabs = $computed(() => [{ | ||||
| 	active: src === 'home', | ||||
|  | @ -151,7 +135,22 @@ const headerTabs = $computed(() => [{ | |||
| 	icon: 'fas fa-globe', | ||||
| 	iconOnly: true, | ||||
| 	onClick: () => { saveSrc('global'); }, | ||||
| }] : [])]); | ||||
| }] : []), { | ||||
| 	icon: 'fas fa-list-ul', | ||||
| 	title: i18n.ts.lists, | ||||
| 	iconOnly: true, | ||||
| 	onClick: chooseList, | ||||
| }, { | ||||
| 	icon: 'fas fa-satellite', | ||||
| 	title: i18n.ts.antennas, | ||||
| 	iconOnly: true, | ||||
| 	onClick: chooseAntenna, | ||||
| }, { | ||||
| 	icon: 'fas fa-satellite-dish', | ||||
| 	title: i18n.ts.channel, | ||||
| 	iconOnly: true, | ||||
| 	onClick: chooseChannel, | ||||
| }]); | ||||
| 
 | ||||
| definePageMetadata(computed(() => ({ | ||||
| 	title: i18n.ts.timeline, | ||||
|  |  | |||
|  | @ -1,17 +1,20 @@ | |||
| <template> | ||||
| <div ref="rootEl" v-hotkey.global="keymap" v-size="{ min: [800] }" class="eqqrhokj"> | ||||
| 	<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> | ||||
| 	<div class="tl _block"> | ||||
| 		<XTimeline | ||||
| 			ref="tlEl" :key="listId" | ||||
| 			class="tl" | ||||
| 			src="list" | ||||
| 			:list="listId" | ||||
| 			:sound="true" | ||||
| 			@queue="queueUpdated" | ||||
| 		/> | ||||
| <MkStickyContainer> | ||||
| 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> | ||||
| 	<div ref="rootEl" v-size="{ min: [800] }" class="eqqrhokj"> | ||||
| 		<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> | ||||
| 		<div class="tl _block"> | ||||
| 			<XTimeline | ||||
| 				ref="tlEl" :key="listId" | ||||
| 				class="tl" | ||||
| 				src="list" | ||||
| 				:list="listId" | ||||
| 				:sound="true" | ||||
| 				@queue="queueUpdated" | ||||
| 			/> | ||||
| 		</div> | ||||
| 	</div> | ||||
| </div> | ||||
| </MkStickyContainer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts" setup> | ||||
|  | @ -61,7 +64,15 @@ async function timetravel() { | |||
| 	tlEl.timetravel(date); | ||||
| } | ||||
| 
 | ||||
| const headerActions = $computed(() => []); | ||||
| const headerActions = $computed(() => list ? [{ | ||||
| 	icon: 'fas fa-calendar-alt', | ||||
| 	text: i18n.ts.jumpToSpecifiedDate, | ||||
| 	handler: timetravel, | ||||
| }, { | ||||
| 	icon: 'fas fa-cog', | ||||
| 	text: i18n.ts.settings, | ||||
| 	handler: settings, | ||||
| }] : []); | ||||
| 
 | ||||
| const headerTabs = $computed(() => []); | ||||
| 
 | ||||
|  | @ -69,15 +80,6 @@ definePageMetadata(computed(() => list ? { | |||
| 	title: list.name, | ||||
| 	icon: 'fas fa-list-ul', | ||||
| 	bg: 'var(--bg)', | ||||
| 	actions: [{ | ||||
| 		icon: 'fas fa-calendar-alt', | ||||
| 		text: i18n.ts.jumpToSpecifiedDate, | ||||
| 		handler: timetravel, | ||||
| 	}, { | ||||
| 		icon: 'fas fa-cog', | ||||
| 		text: i18n.ts.settings, | ||||
| 		handler: settings, | ||||
| 	}], | ||||
| } : null)); | ||||
| </script> | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue