93 lines
2.0 KiB
Vue
93 lines
2.0 KiB
Vue
<template>
|
|
<div class="flex flex-col h-auto overflow-auto">
|
|
<woot-modal-header
|
|
:header-title="$t('INTEGRATION_SETTINGS.LINEAR.ADD_OR_LINK.TITLE')"
|
|
:header-content="
|
|
$t('INTEGRATION_SETTINGS.LINEAR.ADD_OR_LINK.DESCRIPTION')
|
|
"
|
|
/>
|
|
|
|
<div class="flex flex-col h-auto overflow-auto">
|
|
<div class="flex flex-col px-8 pb-4">
|
|
<woot-tabs
|
|
class="ltr:[&>ul]:pl-0 rtl:[&>ul]:pr-0"
|
|
:index="selectedTabIndex"
|
|
@change="onClickTabChange"
|
|
>
|
|
<woot-tabs-item
|
|
v-for="tab in tabs"
|
|
:key="tab.key"
|
|
:name="tab.name"
|
|
:show-badge="false"
|
|
/>
|
|
</woot-tabs>
|
|
</div>
|
|
<div v-if="selectedTabIndex === 0" class="flex flex-col px-8 pb-4">
|
|
<create-issue
|
|
:account-id="accountId"
|
|
:conversation-id="conversationId"
|
|
@close="onClose"
|
|
/>
|
|
</div>
|
|
|
|
<div v-else class="flex flex-col px-8 pb-4">
|
|
<link-issue :conversation-id="conversationId" @close="onClose" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import alertMixin from 'shared/mixins/alertMixin';
|
|
import LinkIssue from './LinkIssue';
|
|
import CreateIssue from './CreateIssue';
|
|
|
|
import validations from './validations';
|
|
|
|
export default {
|
|
components: {
|
|
LinkIssue,
|
|
CreateIssue,
|
|
},
|
|
mixins: [alertMixin],
|
|
props: {
|
|
accountId: {
|
|
type: [Number, String],
|
|
required: true,
|
|
},
|
|
conversationId: {
|
|
type: [Number, String],
|
|
required: true,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
selectedTabIndex: 0,
|
|
};
|
|
},
|
|
validations,
|
|
computed: {
|
|
tabs() {
|
|
return [
|
|
{
|
|
key: 0,
|
|
name: this.$t('INTEGRATION_SETTINGS.LINEAR.CREATE'),
|
|
},
|
|
{
|
|
key: 1,
|
|
name: this.$t('INTEGRATION_SETTINGS.LINEAR.LINK.TITLE'),
|
|
},
|
|
];
|
|
},
|
|
},
|
|
methods: {
|
|
onClose() {
|
|
this.$emit('close');
|
|
},
|
|
onClickTabChange(index) {
|
|
this.selectedTabIndex = index;
|
|
},
|
|
},
|
|
};
|
|
</script>
|