refactor(client): use composition api
This commit is contained in:
		
							parent
							
								
									f02ed78a20
								
							
						
					
					
						commit
						298e950e81
					
				
					 4 changed files with 41 additions and 77 deletions
				
			
		|  | @ -1,9 +1,7 @@ | |||
| <template> | ||||
| <div class="jmelgwjh"> | ||||
| 	<div class="body"> | ||||
| 		<XNotes class="notes" :pagination="pagination" :detail="true" :prop="'note'"/> | ||||
| 	</div> | ||||
| </div> | ||||
| <MkSpacer :content-max="800"> | ||||
| 	<XNotes :pagination="pagination" :detail="true" :prop="'note'"/> | ||||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts" setup> | ||||
|  | @ -15,7 +13,7 @@ const pagination = { | |||
| 	endpoint: 'i/favorites', | ||||
| 	limit: 10, | ||||
| 	params: () => ({ | ||||
| 	}) | ||||
| 	}), | ||||
| }; | ||||
| 
 | ||||
| defineExpose({ | ||||
|  | @ -26,16 +24,3 @@ defineExpose({ | |||
| 	}, | ||||
| }); | ||||
| </script> | ||||
| 
 | ||||
| <style lang="scss" scoped> | ||||
| .jmelgwjh { | ||||
| 	background: var(--bg); | ||||
| 
 | ||||
| 	> .body { | ||||
| 		box-sizing: border-box; | ||||
| 		max-width: 800px; | ||||
| 		margin: 0 auto; | ||||
| 		padding: 16px; | ||||
| 	} | ||||
| } | ||||
| </style> | ||||
|  |  | |||
|  | @ -4,29 +4,22 @@ | |||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| <script lang="ts" setup> | ||||
| import XNotes from '@/components/notes.vue'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import { i18n } from '@/i18n'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		XNotes | ||||
| 	}, | ||||
| const pagination = { | ||||
| 	endpoint: 'notes/featured', | ||||
| 	limit: 10, | ||||
| 	offsetMode: true, | ||||
| }; | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: this.$ts.featured, | ||||
| 				icon: 'fas fa-fire-alt', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			pagination: { | ||||
| 				endpoint: 'notes/featured', | ||||
| 				limit: 10, | ||||
| 				offsetMode: true, | ||||
| 			}, | ||||
| 		}; | ||||
| defineExpose({ | ||||
| 	[symbols.PAGE_INFO]: { | ||||
| 		title: i18n.locale.featured, | ||||
| 		icon: 'fas fa-fire-alt', | ||||
| 		bg: 'var(--bg)', | ||||
| 	}, | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
|  | @ -4,28 +4,21 @@ | |||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| <script lang="ts" setup> | ||||
| import XNotes from '@/components/notes.vue'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import { i18n } from '@/i18n'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		XNotes | ||||
| 	}, | ||||
| const pagination = { | ||||
| 	endpoint: 'notes/mentions', | ||||
| 	limit: 10, | ||||
| }; | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: this.$ts.mentions, | ||||
| 				icon: 'fas fa-at', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			pagination: { | ||||
| 				endpoint: 'notes/mentions', | ||||
| 				limit: 10, | ||||
| 			}, | ||||
| 		}; | ||||
| defineExpose({ | ||||
| 	[symbols.PAGE_INFO]: { | ||||
| 		title: i18n.locale.mentions, | ||||
| 		icon: 'fas fa-at', | ||||
| 		bg: 'var(--bg)', | ||||
| 	}, | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
|  | @ -4,31 +4,24 @@ | |||
| </MkSpacer> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import { defineComponent } from 'vue'; | ||||
| <script lang="ts" setup> | ||||
| import XNotes from '@/components/notes.vue'; | ||||
| import * as symbols from '@/symbols'; | ||||
| import { i18n } from '@/i18n'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		XNotes | ||||
| 	}, | ||||
| const pagination = { | ||||
| 	endpoint: 'notes/mentions', | ||||
| 	limit: 10, | ||||
| 	params: () => ({ | ||||
| 		visibility: 'specified' | ||||
| 	}), | ||||
| }; | ||||
| 
 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			[symbols.PAGE_INFO]: { | ||||
| 				title: this.$ts.directNotes, | ||||
| 				icon: 'fas fa-envelope', | ||||
| 				bg: 'var(--bg)', | ||||
| 			}, | ||||
| 			pagination: { | ||||
| 				endpoint: 'notes/mentions', | ||||
| 				limit: 10, | ||||
| 				params: () => ({ | ||||
| 					visibility: 'specified' | ||||
| 				}) | ||||
| 			}, | ||||
| 		}; | ||||
| defineExpose({ | ||||
| 	[symbols.PAGE_INFO]: { | ||||
| 		title: i18n.locale.directNotes, | ||||
| 		icon: 'fas fa-envelope', | ||||
| 		bg: 'var(--bg)', | ||||
| 	}, | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue