<template>
  <div>
    <div>
      <div
        v-if="!getUseShopManager"
        class="mb-10"
      >
        <widget-shop-manager />
      </div>

      <Alert
        type="warning"
        show-icon
      >
        {{ $t('SHOPEE_REQUIRE_PRODUCT_LINK') }}
      </Alert>

      <div>
        <shopee-shop />
      </div>

      <Tabs
        v-if="false"
        v-model="tabActive"
        :value="tabActive"
        :animated="false"
      >
        <TabPane
          :label="$t('SHOPEE_SHOP')"
          name="shopee-shop"
        >
          <shopee-shop />
        </TabPane>
        <TabPane
          v-if="getBetaMode"
          :label="$t('SHOPEE_AFFILIATE')"
          name="shopee-affiliate"
        >
          <shopee-affiliate v-if="tabActive === 'shopee-affiliate'" />
        </TabPane>
      </Tabs>
    </div>
  </div>
</template>
<script>
import { TabPane } from 'view-design';
import ShopeeAffiliate from '@/vue/components/Shopee/Affiliate.vue';
import ShopeeShop from '@/vue/components/Shopee/Seller/Popup.vue';
import WidgetShopManager from '@/vue/components/Widget/ShopManager.vue';

export default {
  name: 'ShopeePage',
  components: {
    'shopee-affiliate': ShopeeAffiliate,
    'shopee-shop': ShopeeShop,
    'widget-shop-manager': WidgetShopManager,
    TabPane,
  },
  data() {
    return {
      tabActive: 'shopee-shop',
    };
  },
  created() {
    this.ShopeeSellerInit().catch(() => {});
  },
};
</script>
