37 lines
1.1 KiB
Vue
37 lines
1.1 KiB
Vue
<template>
|
|
<span :class="linkClasses" v-if="character">
|
|
<slot v-if="deleted">[Deleted] {{ name }}</slot>
|
|
<a :href="characterUrl" class="characterLinkLink" v-else :target="target"><slot>{{ name }}</slot></a>
|
|
</span>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {Component, Prop} from '@f-list/vue-ts';
|
|
import Vue from 'vue';
|
|
import {SimpleCharacter} from '../interfaces';
|
|
import * as Utils from '../site/utils';
|
|
|
|
@Component
|
|
export default class CharacterLink extends Vue {
|
|
@Prop({required: true})
|
|
readonly character!: SimpleCharacter | string;
|
|
@Prop({default: '_blank'})
|
|
readonly target!: string;
|
|
|
|
get deleted(): boolean {
|
|
return typeof(this.character) === 'string' ? false : this.character.deleted;
|
|
}
|
|
|
|
get linkClasses(): string {
|
|
return this.deleted ? 'characterLinkDeleted' : 'characterLink';
|
|
}
|
|
|
|
get characterUrl(): string {
|
|
return Utils.characterURL(this.name);
|
|
}
|
|
|
|
get name(): string {
|
|
return typeof(this.character) === 'string' ? this.character : this.character.name;
|
|
}
|
|
}
|
|
</script> |