This commit is contained in:
syuilo 2018-02-22 21:15:24 +09:00
parent 62d16db008
commit 4fd3192791
11 changed files with 71 additions and 47 deletions

View file

@ -1,15 +1,15 @@
<template> <template>
<div class="mk-messaging-form"> <div class="mk-messaging-form">
<textarea v-model="text" @keypress="onKeypress" @paste="onPaste" placeholder="%i18n:common.input-message-here%"></textarea> <textarea v-model="text" @keypress="onKeypress" @paste="onPaste" placeholder="%i18n:common.input-message-here%"></textarea>
<div class="files"></div> <div class="file" v-if="file">{{ file.name }}</div>
<mk-uploader ref="uploader"/> <mk-uploader ref="uploader"/>
<button class="send" @click="send" :disabled="sending" title="%i18n:common.send%"> <button class="send" @click="send" :disabled="sending" title="%i18n:common.send%">
<template v-if="!sending">%fa:paper-plane%</template><template v-if="sending">%fa:spinner .spin%</template> <template v-if="!sending">%fa:paper-plane%</template><template v-if="sending">%fa:spinner .spin%</template>
</button> </button>
<button class="attach-from-local" type="button" title="%i18n:common.tags.mk-messaging-form.attach-from-local%"> <button class="attach-from-local" title="%i18n:common.tags.mk-messaging-form.attach-from-local%">
%fa:upload% %fa:upload%
</button> </button>
<button class="attach-from-drive" type="button" title="%i18n:common.tags.mk-messaging-form.attach-from-drive%"> <button class="attach-from-drive" @click="chooseFileFromDrive" title="%i18n:common.tags.mk-messaging-form.attach-from-drive%">
%fa:R folder-open% %fa:R folder-open%
</button> </button>
<input name="file" type="file" accept="image/*"/> <input name="file" type="file" accept="image/*"/>

View file

@ -1,8 +1,11 @@
import { url } from '../../config';
import MkChooseFileFromDriveWindow from '../views/components/choose-file-from-drive-window.vue'; import MkChooseFileFromDriveWindow from '../views/components/choose-file-from-drive-window.vue';
export default function(opts) { export default function(opts) {
return new Promise((res, rej) => { return new Promise((res, rej) => {
const o = opts || {}; const o = opts || {};
if (document.body.clientWidth > 800) {
const w = new MkChooseFileFromDriveWindow({ const w = new MkChooseFileFromDriveWindow({
propsData: { propsData: {
title: o.title, title: o.title,
@ -14,5 +17,14 @@ export default function(opts) {
res(file); res(file);
}); });
document.body.appendChild(w.$el); document.body.appendChild(w.$el);
} else {
window['cb'] = file => {
res(file);
};
window.open(url + '/selectdrive',
'drive_window',
'height=500, width=800');
}
}); });
} }

View file

@ -24,6 +24,7 @@ import MkUser from './views/pages/user/user.vue';
import MkSelectDrive from './views/pages/selectdrive.vue'; import MkSelectDrive from './views/pages/selectdrive.vue';
import MkDrive from './views/pages/drive.vue'; import MkDrive from './views/pages/drive.vue';
import MkHomeCustomize from './views/pages/home-customize.vue'; import MkHomeCustomize from './views/pages/home-customize.vue';
import MkMessagingRoom from './views/pages/messaging-room.vue';
/** /**
* init * init
@ -70,6 +71,7 @@ init(async (launch) => {
app.$router.addRoutes([ app.$router.addRoutes([
{ path: '/', name: 'index', component: MkIndex }, { path: '/', name: 'index', component: MkIndex },
{ path: '/i/customize-home', component: MkHomeCustomize }, { path: '/i/customize-home', component: MkHomeCustomize },
{ path: '/i/messaging/:username', component: MkMessagingRoom },
{ path: '/i/drive', component: MkDrive }, { path: '/i/drive', component: MkDrive },
{ path: '/i/drive/folder/:folder', component: MkDrive }, { path: '/i/drive/folder/:folder', component: MkDrive },
{ path: '/selectdrive', component: MkSelectDrive }, { path: '/selectdrive', component: MkSelectDrive },

View file

@ -1,5 +1,5 @@
<template> <template>
<mk-window ref="window" width="500px" height="560px" :popout="popout" @closed="$destroy"> <mk-window ref="window" width="500px" height="560px" :popout-url="popout" @closed="$destroy">
<span slot="header" :class="$style.header">%fa:comments%メッセージ: {{ user.name }}</span> <span slot="header" :class="$style.header">%fa:comments%メッセージ: {{ user.name }}</span>
<mk-messaging-room :user="user" :class="$style.content"/> <mk-messaging-room :user="user" :class="$style.content"/>
</mk-window> </mk-window>

View file

@ -111,9 +111,6 @@ export default Vue.extend({
} }
}); });
}, },
beforeDestroy() {
this.autocomplete.detach();
},
methods: { methods: {
focus() { focus() {
(this.$refs.text as any).focus(); (this.$refs.text as any).focus();

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="mk-api-setting"> <div class="root api">
<p>Token: <code>{{ os.i.token }}</code></p> <p>Token: <code>{{ os.i.token }}</code></p>
<p>%i18n:desktop.tags.mk-api-info.intro%</p> <p>%i18n:desktop.tags.mk-api-info.intro%</p>
<div class="ui info warn"><p>%fa:exclamation-triangle%%i18n:desktop.tags.mk-api-info.caution%</p></div> <div class="ui info warn"><p>%fa:exclamation-triangle%%i18n:desktop.tags.mk-api-info.caution%</p></div>
@ -10,12 +10,14 @@
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue';
import passwordDialog from '../../scripts/password-dialog';
export default Vue.extend({ export default Vue.extend({
methods: { methods: {
regenerateToken() { regenerateToken() {
passwordDialog('%i18n:desktop.tags.mk-api-info.enter-password%', password => { (this as any).apis.input({
title: '%i18n:desktop.tags.mk-api-info.enter-password%',
type: 'password'
}).then(password => {
(this as any).api('i/regenerate_token', { (this as any).api('i/regenerate_token', {
password: password password: password
}); });
@ -26,7 +28,7 @@ export default Vue.extend({
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.mk-api-setting .root.api
color #4a535a color #4a535a
code code

View file

@ -60,7 +60,7 @@
<section class="api" v-show="page == 'api'"> <section class="api" v-show="page == 'api'">
<h1>API</h1> <h1>API</h1>
<mk-api-info/> <x-api/>
</section> </section>
<section class="other" v-show="page == 'other'"> <section class="other" v-show="page == 'other'">
@ -77,13 +77,15 @@ import XProfile from './settings.profile.vue';
import XMute from './settings.mute.vue'; import XMute from './settings.mute.vue';
import XPassword from './settings.password.vue'; import XPassword from './settings.password.vue';
import X2fa from './settings.2fa.vue'; import X2fa from './settings.2fa.vue';
import XApi from './settings.api.vue';
export default Vue.extend({ export default Vue.extend({
components: { components: {
XProfile, XProfile,
XMute, XMute,
XPassword, XPassword,
X2fa X2fa,
XApi
}, },
data() { data() {
return { return {

View file

@ -3,14 +3,14 @@ import MkAutocomplete from '../components/autocomplete.vue';
export default { export default {
bind(el, binding, vn) { bind(el, binding, vn) {
const self = el._userPreviewDirective_ = {} as any; const self = el._autoCompleteDirective_ = {} as any;
self.x = new Autocomplete(el); self.x = new Autocomplete(el);
self.x.attach(); self.x.attach();
}, },
unbind(el, binding, vn) { unbind(el, binding, vn) {
const self = el._userPreviewDirective_; const self = el._autoCompleteDirective_;
self.x.close(); self.x.detach();
} }
}; };

View file

@ -1,6 +1,6 @@
<template> <template>
<div class="mk-messaging-room-page"> <div class="mk-messaging-room-page">
<mk-messaging-room v-if="user" :user="user" is-naked/> <mk-messaging-room v-if="user" :user="user" :is-naked="true"/>
</div> </div>
</template> </template>
@ -9,20 +9,28 @@ import Vue from 'vue';
import Progress from '../../../common/scripts/loading'; import Progress from '../../../common/scripts/loading';
export default Vue.extend({ export default Vue.extend({
props: ['username'],
data() { data() {
return { return {
fetching: true, fetching: true,
user: null user: null
}; };
}, },
watch: {
$route: 'fetch'
},
created() {
this.fetch();
},
mounted() { mounted() {
Progress.start();
document.documentElement.style.background = '#fff'; document.documentElement.style.background = '#fff';
},
methods: {
fetch() {
Progress.start();
this.fetching = true;
(this as any).api('users/show', { (this as any).api('users/show', {
username: this.username username: this.$route.params.username
}).then(user => { }).then(user => {
this.user = user; this.user = user;
this.fetching = false; this.fetching = false;
@ -32,6 +40,7 @@ export default Vue.extend({
Progress.done(); Progress.done();
}); });
} }
}
}); });
</script> </script>

View file

@ -1,15 +1,15 @@
<template> <template>
<div class="mk-selectdrive"> <div class="mkp-selectdrive">
<mk-drive ref="browser" <mk-drive ref="browser"
:multiple="multiple" :multiple="multiple"
@selected="onSelected" @selected="onSelected"
@change-selection="onChangeSelection" @change-selection="onChangeSelection"
/> />
<div> <footer>
<button class="upload" title="%i18n:desktop.tags.mk-selectdrive-page.upload%" @click="upload">%fa:upload%</button> <button class="upload" title="%i18n:desktop.tags.mk-selectdrive-page.upload%" @click="upload">%fa:upload%</button>
<button class="cancel" @click="close">%i18n:desktop.tags.mk-selectdrive-page.cancel%</button> <button class="cancel" @click="close">%i18n:desktop.tags.mk-selectdrive-page.cancel%</button>
<button class="ok" @click="ok">%i18n:desktop.tags.mk-selectdrive-page.ok%</button> <button class="ok" @click="ok">%i18n:desktop.tags.mk-selectdrive-page.ok%</button>
</div> </footer>
</div> </div>
</template> </template>
@ -54,7 +54,7 @@ export default Vue.extend({
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.mk-selectdrive .mkp-selectdrive
display block display block
position fixed position fixed
width 100% width 100%
@ -64,7 +64,7 @@ export default Vue.extend({
> .mk-drive > .mk-drive
height calc(100% - 72px) height calc(100% - 72px)
> div > footer
position fixed position fixed
bottom 0 bottom 0
left 0 left 0

View file

@ -29,12 +29,12 @@ export default Vue.extend({
user: null user: null
}; };
}, },
created() {
this.fetch();
},
watch: { watch: {
$route: 'fetch' $route: 'fetch'
}, },
created() {
this.fetch();
},
methods: { methods: {
fetch() { fetch() {
this.fetching = true; this.fetching = true;