tweak ui
This commit is contained in:
		
							parent
							
								
									89053d5747
								
							
						
					
					
						commit
						76b2561893
					
				
					 2 changed files with 79 additions and 102 deletions
				
			
		|  | @ -1,28 +1,18 @@ | |||
| <template> | ||||
| <FormBase> | ||||
| <MkSpacer :content-max="700" :margin-min="16" :margin-max="32"> | ||||
| 	<FormSuspense v-slot="{ result: database }" :p="databasePromiseFactory"> | ||||
| 		<FormGroup v-for="table in database" :key="table[0]"> | ||||
| 			<template #label>{{ table[0] }}</template> | ||||
| 			<FormKeyValueView> | ||||
| 				<template #key>Size</template> | ||||
| 				<template #value>{{ bytes(table[1].size) }}</template> | ||||
| 			</FormKeyValueView> | ||||
| 			<FormKeyValueView> | ||||
| 				<template #key>Records</template> | ||||
| 				<template #value>{{ number(table[1].count) }}</template> | ||||
| 			</FormKeyValueView> | ||||
| 		</FormGroup> | ||||
| 		<MkKeyValue v-for="table in database" :key="table[0]" oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ table[0] }}</template> | ||||
| 			<template #value>{{ bytes(table[1].size) }} ({{ number(table[1].count) }} recs)</template> | ||||
| 		</MkKeyValue> | ||||
| 	</FormSuspense> | ||||
| </FormBase> | ||||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| import FormSuspense from '@/components/debobigego/suspense.vue'; | ||||
| import FormKeyValueView from '@/components/debobigego/key-value-view.vue'; | ||||
| import FormLink from '@/components/debobigego/link.vue'; | ||||
| import FormBase from '@/components/debobigego/base.vue'; | ||||
| import FormGroup from '@/components/debobigego/group.vue'; | ||||
| import FormSuspense from '@/components/form/suspense.vue'; | ||||
| import MkKeyValue from '@/components/key-value.vue'; | ||||
| import * as os from '@/os'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import bytes from '@/filters/bytes'; | ||||
|  | @ -31,10 +21,7 @@ import number from '@/filters/number'; | |||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		FormSuspense, | ||||
| 		FormKeyValueView, | ||||
| 		FormBase, | ||||
| 		FormGroup, | ||||
| 		FormLink, | ||||
| 		MkKeyValue, | ||||
| 	}, | ||||
| 
 | ||||
| 	emits: ['info'], | ||||
|  |  | |||
|  | @ -1,144 +1,139 @@ | |||
| <template> | ||||
| <FormBase> | ||||
| 	<FormKeyValueView> | ||||
| <div class="_formRoot"> | ||||
| 	<MkKeyValue> | ||||
| 		<template #key>ID</template> | ||||
| 		<template #value><span class="_monospace">{{ $i.id }}</span></template> | ||||
| 	</FormKeyValueView> | ||||
| 	</MkKeyValue> | ||||
| 
 | ||||
| 	<FormGroup> | ||||
| 		<FormKeyValueView> | ||||
| 	<FormSection> | ||||
| 		<MkKeyValue> | ||||
| 			<template #key>{{ $ts.registeredDate }}</template> | ||||
| 			<template #value><MkTime :time="$i.createdAt" mode="detail"/></template> | ||||
| 		</FormKeyValueView> | ||||
| 	</FormGroup> | ||||
| 		</MkKeyValue> | ||||
| 	</FormSection> | ||||
| 
 | ||||
| 	<FormGroup v-if="stats"> | ||||
| 	<FormSection v-if="stats"> | ||||
| 		<template #label>{{ $ts.statistics }}</template> | ||||
| 		<FormKeyValueView> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.notesCount }}</template> | ||||
| 			<template #value>{{ number(stats.notesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.repliesCount }}</template> | ||||
| 			<template #value>{{ number(stats.repliesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.renotesCount }}</template> | ||||
| 			<template #value>{{ number(stats.renotesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.repliedCount }}</template> | ||||
| 			<template #value>{{ number(stats.repliedCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.renotedCount }}</template> | ||||
| 			<template #value>{{ number(stats.renotedCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.pollVotesCount }}</template> | ||||
| 			<template #value>{{ number(stats.pollVotesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.pollVotedCount }}</template> | ||||
| 			<template #value>{{ number(stats.pollVotedCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.sentReactionsCount }}</template> | ||||
| 			<template #value>{{ number(stats.sentReactionsCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.receivedReactionsCount }}</template> | ||||
| 			<template #value>{{ number(stats.receivedReactionsCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.noteFavoritesCount }}</template> | ||||
| 			<template #value>{{ number(stats.noteFavoritesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followingCount }}</template> | ||||
| 			<template #value>{{ number(stats.followingCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followingCount }} ({{ $ts.local }})</template> | ||||
| 			<template #value>{{ number(stats.localFollowingCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followingCount }} ({{ $ts.remote }})</template> | ||||
| 			<template #value>{{ number(stats.remoteFollowingCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followersCount }}</template> | ||||
| 			<template #value>{{ number(stats.followersCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followersCount }} ({{ $ts.local }})</template> | ||||
| 			<template #value>{{ number(stats.localFollowersCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.followersCount }} ({{ $ts.remote }})</template> | ||||
| 			<template #value>{{ number(stats.remoteFollowersCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.pageLikesCount }}</template> | ||||
| 			<template #value>{{ number(stats.pageLikesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.pageLikedCount }}</template> | ||||
| 			<template #value>{{ number(stats.pageLikedCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.driveFilesCount }}</template> | ||||
| 			<template #value>{{ number(stats.driveFilesCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.driveUsage }}</template> | ||||
| 			<template #value>{{ bytes(stats.driveUsage) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>{{ $ts.reversiCount }}</template> | ||||
| 			<template #value>{{ number(stats.reversiCount) }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 	</FormGroup> | ||||
| 		</MkKeyValue> | ||||
| 	</FormSection> | ||||
| 
 | ||||
| 	<FormGroup> | ||||
| 	<FormSection> | ||||
| 		<template #label>{{ $ts.other }}</template> | ||||
| 		<FormKeyValueView> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>emailVerified</template> | ||||
| 			<template #value>{{ $i.emailVerified ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>twoFactorEnabled</template> | ||||
| 			<template #value>{{ $i.twoFactorEnabled ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>securityKeys</template> | ||||
| 			<template #value>{{ $i.securityKeys ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>usePasswordLessLogin</template> | ||||
| 			<template #value>{{ $i.usePasswordLessLogin ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>isModerator</template> | ||||
| 			<template #value>{{ $i.isModerator ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 		<FormKeyValueView> | ||||
| 		</MkKeyValue> | ||||
| 		<MkKeyValue oneline style="margin: 1em 0;"> | ||||
| 			<template #key>isAdmin</template> | ||||
| 			<template #value>{{ $i.isAdmin ? $ts.yes : $ts.no }}</template> | ||||
| 		</FormKeyValueView> | ||||
| 	</FormGroup> | ||||
| </FormBase> | ||||
| 		</MkKeyValue> | ||||
| 	</FormSection> | ||||
| </div> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineAsyncComponent, defineComponent } from 'vue'; | ||||
| import FormSwitch from '@/components/form/switch.vue'; | ||||
| import FormSelect from '@/components/form/select.vue'; | ||||
| import FormLink from '@/components/debobigego/link.vue'; | ||||
| import FormBase from '@/components/debobigego/base.vue'; | ||||
| import FormGroup from '@/components/debobigego/group.vue'; | ||||
| import FormButton from '@/components/debobigego/button.vue'; | ||||
| import FormKeyValueView from '@/components/debobigego/key-value-view.vue'; | ||||
| import FormSection from '@/components/form/section.vue'; | ||||
| import MkKeyValue from '@/components/key-value.vue'; | ||||
| import * as os from '@/os'; | ||||
| import number from '@/filters/number'; | ||||
| import bytes from '@/filters/bytes'; | ||||
|  | @ -146,13 +141,8 @@ import * as symbols from '@/symbols'; | |||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		FormBase, | ||||
| 		FormSelect, | ||||
| 		FormSwitch, | ||||
| 		FormButton, | ||||
| 		FormLink, | ||||
| 		FormGroup, | ||||
| 		FormKeyValueView, | ||||
| 		FormSection, | ||||
| 		MkKeyValue, | ||||
| 	}, | ||||
| 
 | ||||
| 	emits: ['info'], | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue