47 lines
1.5 KiB
Plaintext
47 lines
1.5 KiB
Plaintext
<template>
|
|
<view class="subscribed-content">
|
|
<view class="section-title-container">
|
|
<view class="section-title-bar"></view>
|
|
<text class="section-title">{{ t("Mobile.MySubscriptions.subscribedContent") }}</text>
|
|
</view>
|
|
|
|
<segmented-control
|
|
:options="tabOptions"
|
|
:default-index="0"
|
|
@change="handleTabChange"
|
|
/>
|
|
|
|
<view class="tab-panel">
|
|
<SubscribedAgents v-show="activeTab === 'agents'" />
|
|
<SubscribedSkills v-show="activeTab === 'skills'" />
|
|
<SubscribedCredits v-show="activeTab === 'credits'" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import { useI18n } from '@/utils/i18n';
|
|
import SegmentedControl from '@/components/segmented-control/segmented-control.uvue';
|
|
import SubscribedAgents from './subscribed-agents/subscribed-agents.uvue';
|
|
import SubscribedSkills from './subscribed-skills/subscribed-skills.uvue';
|
|
import SubscribedCredits from './subscribed-credits/subscribed-credits.uvue';
|
|
|
|
const { t } = useI18n();
|
|
|
|
const activeTab = ref<string>('agents');
|
|
|
|
const tabOptions = [
|
|
{ label: 'Mobile.MySubscriptions.tabAgents', value: 'agents' },
|
|
{ label: 'Mobile.MySubscriptions.tabSkills', value: 'skills' },
|
|
{ label: 'Mobile.MySubscriptions.tabCredits', value: 'credits' },
|
|
];
|
|
|
|
const handleTabChange = (value: string | number) => {
|
|
activeTab.value = value as string;
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './subscribed-content.scss';
|
|
</style>
|