[Client] Improve UI
This commit is contained in:
		
							parent
							
								
									90429b787c
								
							
						
					
					
						commit
						d063d59a91
					
				
					 4 changed files with 38 additions and 20 deletions
				
			
		| 
						 | 
				
			
			@ -141,11 +141,10 @@ export default (opts: Opts = {}) => ({
 | 
			
		|||
			this.$root.api('notes/favorites/create', {
 | 
			
		||||
				noteId: this.appearNote.id
 | 
			
		||||
			}).then(() => {
 | 
			
		||||
				// TODO
 | 
			
		||||
				/*this.$root.alert({
 | 
			
		||||
					pointer: false,
 | 
			
		||||
					autoClose: true
 | 
			
		||||
				});*/
 | 
			
		||||
				this.$root.alert({
 | 
			
		||||
					type: 'success',
 | 
			
		||||
					splash: true
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,11 +1,11 @@
 | 
			
		|||
<template>
 | 
			
		||||
<div class="felqjxyj" :class="{ pointer }">
 | 
			
		||||
<div class="felqjxyj" :class="{ splash }">
 | 
			
		||||
	<div class="bg" ref="bg" @click="onBgClick"></div>
 | 
			
		||||
	<div class="main" ref="main">
 | 
			
		||||
		<div class="icon" :class="type"><fa :icon="icon"/></div>
 | 
			
		||||
		<header v-if="title" v-html="title"></header>
 | 
			
		||||
		<div class="body" v-if="text" v-html="text"></div>
 | 
			
		||||
		<ui-horizon-group no-grow class="buttons">
 | 
			
		||||
		<ui-horizon-group no-grow class="buttons" v-if="!splash">
 | 
			
		||||
			<ui-button @click="ok" primary autofocus>OK</ui-button>
 | 
			
		||||
			<ui-button @click="cancel" v-if="showCancelButton">Cancel</ui-button>
 | 
			
		||||
		</ui-horizon-group>
 | 
			
		||||
| 
						 | 
				
			
			@ -31,15 +31,15 @@ export default Vue.extend({
 | 
			
		|||
		},
 | 
			
		||||
		text: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			required: true
 | 
			
		||||
			required: false
 | 
			
		||||
		},
 | 
			
		||||
		showCancelButton: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false
 | 
			
		||||
		},
 | 
			
		||||
		pointer: {
 | 
			
		||||
		splash: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: true
 | 
			
		||||
			default: false
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -72,6 +72,12 @@ export default Vue.extend({
 | 
			
		|||
				duration: 300,
 | 
			
		||||
				easing: [0, 0.5, 0.5, 1]
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			if (this.splash) {
 | 
			
		||||
				setTimeout(() => {
 | 
			
		||||
					this.close();
 | 
			
		||||
				}, 1000);
 | 
			
		||||
			}
 | 
			
		||||
		});
 | 
			
		||||
	},
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -125,8 +131,13 @@ export default Vue.extend({
 | 
			
		|||
	width 100%
 | 
			
		||||
	height 100%
 | 
			
		||||
 | 
			
		||||
	&:not(.pointer)
 | 
			
		||||
		pointer-events none
 | 
			
		||||
	&.splash
 | 
			
		||||
		&, *
 | 
			
		||||
			pointer-events none !important
 | 
			
		||||
 | 
			
		||||
		> .main
 | 
			
		||||
			min-width 0
 | 
			
		||||
			width initial
 | 
			
		||||
 | 
			
		||||
	> .bg
 | 
			
		||||
		display block
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -78,8 +78,10 @@ export default Vue.extend({
 | 
			
		|||
			this.$root.api('i/pin', {
 | 
			
		||||
				noteId: this.note.id
 | 
			
		||||
			}).then(() => {
 | 
			
		||||
				// TODO
 | 
			
		||||
				//this.$root.new(Ok);
 | 
			
		||||
				this.$root.alert({
 | 
			
		||||
					type: 'success',
 | 
			
		||||
					splash: true
 | 
			
		||||
				});
 | 
			
		||||
				this.destroyDom();
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
| 
						 | 
				
			
			@ -112,8 +114,10 @@ export default Vue.extend({
 | 
			
		|||
			this.$root.api('notes/favorites/create', {
 | 
			
		||||
				noteId: this.note.id
 | 
			
		||||
			}).then(() => {
 | 
			
		||||
				// TODO
 | 
			
		||||
				//this.$root.new(Ok);
 | 
			
		||||
				this.$root.alert({
 | 
			
		||||
					type: 'success',
 | 
			
		||||
					splash: true
 | 
			
		||||
				});
 | 
			
		||||
				this.destroyDom();
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
| 
						 | 
				
			
			@ -122,8 +126,10 @@ export default Vue.extend({
 | 
			
		|||
			this.$root.api('notes/favorites/delete', {
 | 
			
		||||
				noteId: this.note.id
 | 
			
		||||
			}).then(() => {
 | 
			
		||||
				// TODO
 | 
			
		||||
				//this.$root.new(Ok);
 | 
			
		||||
				this.$root.alert({
 | 
			
		||||
					type: 'success',
 | 
			
		||||
					splash: true
 | 
			
		||||
				});
 | 
			
		||||
				this.destroyDom();
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -307,8 +307,10 @@ export default Vue.extend({
 | 
			
		|||
							listId: list.id,
 | 
			
		||||
							userId: this.user.id
 | 
			
		||||
						});
 | 
			
		||||
						// TODO
 | 
			
		||||
						//this.$root.new(Ok);
 | 
			
		||||
						this.$root.alert({
 | 
			
		||||
							type: 'success',
 | 
			
		||||
							splash: true
 | 
			
		||||
						});
 | 
			
		||||
					});
 | 
			
		||||
				}
 | 
			
		||||
			}];
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue