1
0
mirror of https://github.com/hotomoe/hotomoe synced 2024-12-18 00:28:16 +09:00
hotomoe/src/client/components/ui/a.vue

130 lines
2.8 KiB
Vue
Raw Normal View History

<template>
<a :href="to" :class="active ? activeClass : null" @click.prevent="nav" @contextmenu.prevent.stop="onContextmenu">
<slot></slot>
</a>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { faExpandAlt, faColumns, faExternalLinkAlt, faLink, faWindowMaximize } from '@fortawesome/free-solid-svg-icons';
import * as os from '@/os';
import copyToClipboard from '@/scripts/copy-to-clipboard';
import { router } from '@/router';
2020-11-03 17:00:47 +09:00
import { ui, url } from '@/config';
import { popout } from '@/scripts/popout';
export default defineComponent({
inject: {
navHook: {
default: null
},
sideViewHook: {
default: null
}
},
props: {
to: {
type: String,
required: true,
},
activeClass: {
type: String,
required: false,
},
behavior: {
type: String,
required: false,
},
},
computed: {
active() {
if (this.activeClass == null) return false;
const resolved = router.resolve(this.to);
if (resolved.path == this.$route.path) return true;
if (resolved.name == null) return false;
if (this.$route.name == null) return false;
return resolved.name == this.$route.name;
}
},
methods: {
onContextmenu(e) {
if (window.getSelection().toString() !== '') return;
os.contextMenu([{
type: 'label',
text: this.to,
}, {
icon: faWindowMaximize,
text: this.$t('openInWindow'),
action: () => {
os.pageWindow(this.to);
}
}, this.sideViewHook ? {
icon: faColumns,
text: this.$t('openInSideView'),
action: () => {
this.sideViewHook(this.to);
}
} : undefined, {
icon: faExpandAlt,
text: this.$t('showInPage'),
action: () => {
this.$router.push(this.to);
}
}, null, {
icon: faExternalLinkAlt,
text: this.$t('openInNewTab'),
action: () => {
window.open(this.to, '_blank');
}
}, {
icon: faLink,
text: this.$t('copyLink'),
action: () => {
copyToClipboard(`${url}${this.to}`);
}
}], e);
},
window() {
os.pageWindow(this.to);
},
popout() {
popout(this.to);
},
nav() {
if (this.to.startsWith('/my/messaging')) {
if (this.$store.state.device.chatOpenBehavior === 'window') return this.window();
if (this.$store.state.device.chatOpenBehavior === 'popout') return this.popout();
}
if (this.behavior) {
if (this.behavior === 'window') {
return this.window();
}
}
if (this.navHook) {
this.navHook(this.to);
} else {
if (this.$store.state.device.defaultSideView && this.sideViewHook && this.to !== '/') {
return this.sideViewHook(this.to);
}
2020-11-03 17:00:47 +09:00
if (this.$store.state.device.deckNavWindow && (ui === 'deck') && this.to !== '/') {
return this.window();
}
if (ui === 'desktop') {
return this.window();
}
this.$router.push(this.to);
}
}
}
});
</script>