This commit is contained in:
syuilo 2018-03-15 19:53:46 +09:00
parent f02fcd0e2a
commit 1439c3245b
22 changed files with 446 additions and 101 deletions

View file

@ -173,6 +173,10 @@
<mk-switch v-model="enableExperimental" text="実験的機能を有効にする">
<span>実験的機能を有効にするとMisskeyの動作が不安定になる可能性がありますこの設定はブラウザに記憶されます</span>
</mk-switch>
<details v-if="debug">
<summary>ツール</summary>
<button class="ui button block" @click="taskmngr">タスクマネージャ</button>
</details>
</section>
<section class="other" v-show="page == 'other'">
@ -196,6 +200,7 @@ import XSignins from './settings.signins.vue';
import XDrive from './settings.drive.vue';
import { url, docsUrl, license, lang, version } from '../../../config';
import checkForUpdate from '../../../common/scripts/check-for-update';
import MkTaskManager from './taskmanager.vue';
export default Vue.extend({
components: {
@ -226,6 +231,11 @@ export default Vue.extend({
enableExperimental: localStorage.getItem('enableExperimental') == 'true'
};
},
computed: {
licenseUrl(): string {
return `${docsUrl}/${lang}/license`;
}
},
watch: {
autoPopout() {
localStorage.setItem('autoPopout', this.autoPopout ? 'true' : 'false');
@ -252,17 +262,15 @@ export default Vue.extend({
localStorage.setItem('enableExperimental', this.enableExperimental ? 'true' : 'false');
}
},
computed: {
licenseUrl(): string {
return `${docsUrl}/${lang}/license`;
}
},
created() {
(this as any).os.getMeta().then(meta => {
this.meta = meta;
});
},
methods: {
taskmngr() {
(this as any).os.new(MkTaskManager);
},
customizeHome() {
this.$router.push('/i/customize-home');
this.$emit('done');

View file

@ -0,0 +1,204 @@
<template>
<mk-window ref="window" width="750px" height="500px" @closed="$destroy" name="TaskManager">
<span slot="header" :class="$style.header">%fa:stethoscope%タスクマネージャ</span>
<el-tabs :class="$style.content">
<el-tab-pane label="Requests">
<el-table
:data="os.requests"
style="width: 100%"
:default-sort="{prop: 'date', order: 'descending'}"
>
<el-table-column type="expand">
<template slot-scope="props">
<pre>{{ props.row.data }}</pre>
<pre>{{ props.row.res }}</pre>
</template>
</el-table-column>
<el-table-column
label="Requested at"
prop="date"
sortable
>
<template slot-scope="scope">
<b style="margin-right: 8px">{{ scope.row.date.getTime() }}</b>
<span>(<mk-time :time="scope.row.date"/>)</span>
</template>
</el-table-column>
<el-table-column
label="Name"
>
<template slot-scope="scope">
<b>{{ scope.row.name }}</b>
</template>
</el-table-column>
<el-table-column
label="Status"
>
<template slot-scope="scope">
<span>{{ scope.row.status || '(pending)' }}</span>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="Streams">
<el-table
:data="os.connections"
style="width: 100%"
>
<el-table-column
label="Uptime"
>
<template slot-scope="scope">
<mk-timer v-if="scope.row.connectedAt" :time="scope.row.connectedAt"/>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column
label="Name"
>
<template slot-scope="scope">
<b>{{ scope.row.name == '' ? '[Home]' : scope.row.name }}</b>
</template>
</el-table-column>
<el-table-column
label="User"
>
<template slot-scope="scope">
<span>{{ scope.row.user || '(anonymous)' }}</span>
</template>
</el-table-column>
<el-table-column
prop="state"
label="State"
/>
<el-table-column
prop="in"
label="In"
/>
<el-table-column
prop="out"
label="Out"
/>
</el-table>
</el-tab-pane>
<el-tab-pane label="Streams (Inspect)">
<el-tabs type="card" style="height:50%">
<el-tab-pane v-for="c in os.connections" :label="c.name == '' ? '[Home]' : c.name" :key="c.id" :name="c.id" ref="connectionsTab">
<el-table
:data="c.inout"
style="width: 100%"
:default-sort="{prop: 'at', order: 'descending'}"
>
<el-table-column type="expand">
<template slot-scope="props">
<pre>{{ props.row.data }}</pre>
</template>
</el-table-column>
<el-table-column
label="Date"
prop="at"
sortable
>
<template slot-scope="scope">
<b style="margin-right: 8px">{{ scope.row.at.getTime() }}</b>
<span>(<mk-time :time="scope.row.at"/>)</span>
</template>
</el-table-column>
<el-table-column
label="Type"
>
<template slot-scope="scope">
<span>{{ getMessageType(scope.row.data) }}</span>
</template>
</el-table-column>
<el-table-column
label="Incoming / Outgoing"
prop="type"
/>
</el-table>
</el-tab-pane>
</el-tabs>
</el-tab-pane>
<el-tab-pane label="Windows">
<el-table
:data="Array.from(os.windows.windows)"
style="width: 100%"
>
<el-table-column
label="Name"
>
<template slot-scope="scope">
<b>{{ scope.row.name || '(unknown)' }}</b>
</template>
</el-table-column>
<el-table-column
label="Operations"
>
<template slot-scope="scope">
<el-button size="mini" type="danger" @click="scope.row.close">Close</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</mk-window>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
mounted() {
(this as any).os.windows.on('added', this.onWindowsChanged);
(this as any).os.windows.on('removed', this.onWindowsChanged);
},
beforeDestroy() {
(this as any).os.windows.off('added', this.onWindowsChanged);
(this as any).os.windows.off('removed', this.onWindowsChanged);
},
methods: {
getMessageType(data): string {
return data.type ? data.type : '-';
},
onWindowsChanged() {
this.$forceUpdate();
}
}
});
</script>
<style lang="stylus" module>
.header
> [data-fa]
margin-right 4px
.content
height 100%
overflow auto
</style>
<style>
.el-tabs__header {
margin-bottom: 0 !important;
}
.el-tabs__item {
padding: 0 20px !important;
}
</style>

View file

@ -68,7 +68,12 @@ export default Vue.extend({
default: 'auto'
},
popoutUrl: {
type: [String, Function]
type: [String, Function],
default: null
},
name: {
type: String,
default: null
}
},