forked from mirror/misskey
[Client] Improve admin panel
This commit is contained in:
parent
1dba82aae5
commit
50fe67b99b
@ -176,6 +176,7 @@
|
||||
"pug": "2.0.3",
|
||||
"punycode": "2.1.1",
|
||||
"qrcode": "1.3.2",
|
||||
"randomcolor": "0.5.3",
|
||||
"ratelimiter": "3.2.0",
|
||||
"recaptcha-promise": "0.1.3",
|
||||
"reconnecting-websocket": "4.1.10",
|
||||
@ -218,6 +219,7 @@
|
||||
"vue-i18n": "8.3.1",
|
||||
"vue-js-modal": "1.3.26",
|
||||
"vue-loader": "15.4.2",
|
||||
"vue-marquee-text-component": "1.1.0",
|
||||
"vue-router": "3.0.1",
|
||||
"vue-style-loader": "4.1.2",
|
||||
"vue-svg-inline-loader": "1.2.1",
|
||||
|
@ -37,6 +37,10 @@
|
||||
</div>
|
||||
</nav>
|
||||
<main>
|
||||
<marquee-text v-if="instances.length > 0" v-show="!isMobile" class="instances" :repeat="10" :duration="10">
|
||||
<span v-for="instance in instances" class="instance"><b :style="{ background: instance.bg }">{{ instance.host }}</b>{{ instance.notesCount | number }}</span>
|
||||
</marquee-text>
|
||||
<div class="page">
|
||||
<div v-if="page == 'dashboard'"><x-dashboard/></div>
|
||||
<div v-if="page == 'instance'"><x-instance/></div>
|
||||
<div v-if="page == 'moderators'"><x-moderators/></div>
|
||||
@ -46,6 +50,7 @@
|
||||
<div v-if="page == 'hashtags'"><x-hashtags/></div>
|
||||
<div v-if="page == 'drive'"></div>
|
||||
<div v-if="page == 'update'"></div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
@ -63,6 +68,8 @@ import XHashtags from "./hashtags.vue";
|
||||
import XUsers from "./users.vue";
|
||||
import { faHeadset, faArrowLeft } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faGrin } from '@fortawesome/free-regular-svg-icons';
|
||||
import MarqueeText from 'vue-marquee-text-component';
|
||||
import randomColor from 'randomcolor';
|
||||
|
||||
// Detect the user agent
|
||||
const ua = navigator.userAgent.toLowerCase();
|
||||
@ -77,7 +84,8 @@ export default Vue.extend({
|
||||
XEmoji,
|
||||
XAnnouncements,
|
||||
XHashtags,
|
||||
XUsers
|
||||
XUsers,
|
||||
MarqueeText
|
||||
},
|
||||
provide: {
|
||||
isMobile
|
||||
@ -88,11 +96,23 @@ export default Vue.extend({
|
||||
version,
|
||||
isMobile,
|
||||
navOpend: !isMobile,
|
||||
instances: [],
|
||||
faGrin,
|
||||
faArrowLeft,
|
||||
faHeadset
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.$root.api('instances').then(instances => {
|
||||
instances.forEach(i => {
|
||||
i.bg = randomColor({
|
||||
seed: i.host,
|
||||
luminosity: 'dark'
|
||||
});
|
||||
});
|
||||
this.instances = instances;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
nav(page: string) {
|
||||
this.page = page;
|
||||
@ -101,7 +121,7 @@ export default Vue.extend({
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
<style lang="stylus" scoped>
|
||||
.mk-admin
|
||||
$headerHeight = 48px
|
||||
|
||||
@ -262,6 +282,22 @@ export default Vue.extend({
|
||||
> main
|
||||
width 100%
|
||||
padding 0 0 0 250px
|
||||
|
||||
> .instances
|
||||
padding 8px
|
||||
background rgba(0, 0, 0, 0.7)
|
||||
color #fff
|
||||
font-size 14px
|
||||
|
||||
>>> .instance
|
||||
margin 0 10px
|
||||
|
||||
> b
|
||||
padding 0px 6px
|
||||
margin-right 4px
|
||||
border-radius 4px
|
||||
|
||||
> .page
|
||||
max-width 1300px
|
||||
|
||||
&.isMobile
|
||||
|
Loading…
Reference in New Issue
Block a user