Refactor
This commit is contained in:
parent
e85dec030a
commit
d399241e65
19
src/client/app/common/views/components/error.vue
Normal file
19
src/client/app/common/views/components/error.vue
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<template>
|
||||||
|
<div class="wjqjnyhzogztorhrdgcpqlkxhkmuetgj">
|
||||||
|
<p>%fa:exclamation-triangle% %i18n:common.error.title%</p>
|
||||||
|
<ui-button @click="() => $emit('retry')">%i18n:common.error.retry%</ui-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="stylus" scoped>
|
||||||
|
.wjqjnyhzogztorhrdgcpqlkxhkmuetgj
|
||||||
|
max-width 350px
|
||||||
|
margin 0 auto
|
||||||
|
padding 32px
|
||||||
|
text-align center
|
||||||
|
color var(--text)
|
||||||
|
|
||||||
|
> p
|
||||||
|
margin 0 0 8px 0
|
||||||
|
|
||||||
|
</style>
|
@ -1,5 +1,6 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
|
import error from './error.vue';
|
||||||
import apiSettings from './api-settings.vue';
|
import apiSettings from './api-settings.vue';
|
||||||
import driveSettings from './drive-settings.vue';
|
import driveSettings from './drive-settings.vue';
|
||||||
import profileEditor from './profile-editor.vue';
|
import profileEditor from './profile-editor.vue';
|
||||||
@ -49,6 +50,7 @@ import uiInfo from './ui/info.vue';
|
|||||||
import formButton from './ui/form/button.vue';
|
import formButton from './ui/form/button.vue';
|
||||||
import formRadio from './ui/form/radio.vue';
|
import formRadio from './ui/form/radio.vue';
|
||||||
|
|
||||||
|
Vue.component('mk-error', error);
|
||||||
Vue.component('mk-api-settings', apiSettings);
|
Vue.component('mk-api-settings', apiSettings);
|
||||||
Vue.component('mk-drive-settings', driveSettings);
|
Vue.component('mk-drive-settings', driveSettings);
|
||||||
Vue.component('mk-profile-editor', profileEditor);
|
Vue.component('mk-profile-editor', profileEditor);
|
||||||
|
@ -4,10 +4,7 @@
|
|||||||
|
|
||||||
<slot name="empty" v-if="notes.length == 0 && !fetching && requestInitPromise == null"></slot>
|
<slot name="empty" v-if="notes.length == 0 && !fetching && requestInitPromise == null"></slot>
|
||||||
|
|
||||||
<div v-if="!fetching && requestInitPromise != null" class="error">
|
<mk-error v-if="!fetching && requestInitPromise != null" @retry="resolveInitPromise"/>
|
||||||
<p>%fa:exclamation-triangle% %i18n:common.error.title%</p>
|
|
||||||
<ui-button @click="resolveInitPromise">%i18n:common.error.retry%</ui-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="placeholder" v-if="fetching">
|
<div class="placeholder" v-if="fetching">
|
||||||
<template v-for="i in 10">
|
<template v-for="i in 10">
|
||||||
@ -215,16 +212,6 @@ export default Vue.extend({
|
|||||||
> *
|
> *
|
||||||
transition transform .3s ease, opacity .3s ease
|
transition transform .3s ease, opacity .3s ease
|
||||||
|
|
||||||
> .error
|
|
||||||
max-width 300px
|
|
||||||
margin 0 auto
|
|
||||||
padding 32px
|
|
||||||
text-align center
|
|
||||||
color var(--text)
|
|
||||||
|
|
||||||
> p
|
|
||||||
margin 0 0 8px 0
|
|
||||||
|
|
||||||
> .placeholder
|
> .placeholder
|
||||||
padding 32px
|
padding 32px
|
||||||
opacity 0.3
|
opacity 0.3
|
||||||
|
@ -8,10 +8,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="!fetching && requestInitPromise != null" class="error">
|
<mk-error v-if="!fetching && requestInitPromise != null" @retry="resolveInitPromise"/>
|
||||||
<p>%fa:exclamation-triangle% %i18n:common.error.title%</p>
|
|
||||||
<ui-button @click="resolveInitPromise">%i18n:common.error.retry%</ui-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- トランジションを有効にするとなぜかメモリリークする -->
|
<!-- トランジションを有効にするとなぜかメモリリークする -->
|
||||||
<!--<transition-group name="mk-notes" class="transition" ref="notes">-->
|
<!--<transition-group name="mk-notes" class="transition" ref="notes">-->
|
||||||
@ -221,13 +218,6 @@ export default Vue.extend({
|
|||||||
> *
|
> *
|
||||||
transition transform .3s ease, opacity .3s ease
|
transition transform .3s ease, opacity .3s ease
|
||||||
|
|
||||||
> .error
|
|
||||||
max-width 300px
|
|
||||||
margin 0 auto
|
|
||||||
padding 16px
|
|
||||||
text-align center
|
|
||||||
color var(--text)
|
|
||||||
|
|
||||||
> .placeholder
|
> .placeholder
|
||||||
padding 16px
|
padding 16px
|
||||||
opacity 0.3
|
opacity 0.3
|
||||||
|
Loading…
Reference in New Issue
Block a user