[Client] Improve UI

This commit is contained in:
syuilo 2018-11-15 00:01:49 +09:00
parent 90429b787c
commit d063d59a91
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
4 changed files with 38 additions and 20 deletions

View file

@ -141,11 +141,10 @@ export default (opts: Opts = {}) => ({
this.$root.api('notes/favorites/create', { this.$root.api('notes/favorites/create', {
noteId: this.appearNote.id noteId: this.appearNote.id
}).then(() => { }).then(() => {
// TODO this.$root.alert({
/*this.$root.alert({ type: 'success',
pointer: false, splash: true
autoClose: true });
});*/
}); });
}, },

View file

@ -1,11 +1,11 @@
<template> <template>
<div class="felqjxyj" :class="{ pointer }"> <div class="felqjxyj" :class="{ splash }">
<div class="bg" ref="bg" @click="onBgClick"></div> <div class="bg" ref="bg" @click="onBgClick"></div>
<div class="main" ref="main"> <div class="main" ref="main">
<div class="icon" :class="type"><fa :icon="icon"/></div> <div class="icon" :class="type"><fa :icon="icon"/></div>
<header v-if="title" v-html="title"></header> <header v-if="title" v-html="title"></header>
<div class="body" v-if="text" v-html="text"></div> <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="ok" primary autofocus>OK</ui-button>
<ui-button @click="cancel" v-if="showCancelButton">Cancel</ui-button> <ui-button @click="cancel" v-if="showCancelButton">Cancel</ui-button>
</ui-horizon-group> </ui-horizon-group>
@ -31,15 +31,15 @@ export default Vue.extend({
}, },
text: { text: {
type: String, type: String,
required: true required: false
}, },
showCancelButton: { showCancelButton: {
type: Boolean, type: Boolean,
default: false default: false
}, },
pointer: { splash: {
type: Boolean, type: Boolean,
default: true default: false
} }
}, },
@ -72,6 +72,12 @@ export default Vue.extend({
duration: 300, duration: 300,
easing: [0, 0.5, 0.5, 1] easing: [0, 0.5, 0.5, 1]
}); });
if (this.splash) {
setTimeout(() => {
this.close();
}, 1000);
}
}); });
}, },
@ -125,8 +131,13 @@ export default Vue.extend({
width 100% width 100%
height 100% height 100%
&:not(.pointer) &.splash
pointer-events none &, *
pointer-events none !important
> .main
min-width 0
width initial
> .bg > .bg
display block display block

View file

@ -78,8 +78,10 @@ export default Vue.extend({
this.$root.api('i/pin', { this.$root.api('i/pin', {
noteId: this.note.id noteId: this.note.id
}).then(() => { }).then(() => {
// TODO this.$root.alert({
//this.$root.new(Ok); type: 'success',
splash: true
});
this.destroyDom(); this.destroyDom();
}); });
}, },
@ -112,8 +114,10 @@ export default Vue.extend({
this.$root.api('notes/favorites/create', { this.$root.api('notes/favorites/create', {
noteId: this.note.id noteId: this.note.id
}).then(() => { }).then(() => {
// TODO this.$root.alert({
//this.$root.new(Ok); type: 'success',
splash: true
});
this.destroyDom(); this.destroyDom();
}); });
}, },
@ -122,8 +126,10 @@ export default Vue.extend({
this.$root.api('notes/favorites/delete', { this.$root.api('notes/favorites/delete', {
noteId: this.note.id noteId: this.note.id
}).then(() => { }).then(() => {
// TODO this.$root.alert({
//this.$root.new(Ok); type: 'success',
splash: true
});
this.destroyDom(); this.destroyDom();
}); });
}, },

View file

@ -307,8 +307,10 @@ export default Vue.extend({
listId: list.id, listId: list.id,
userId: this.user.id userId: this.user.id
}); });
// TODO this.$root.alert({
//this.$root.new(Ok); type: 'success',
splash: true
});
}); });
} }
}]; }];