<template>
  <div>
    <el-card shadow="always" :body-style="{ padding: '20px' }">
      <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handChange">
        <el-tab-pane label="广告主列表" name="advertiser">
          <advertiser v-if="activeName == 'advertiser'"></advertiser>
        </el-tab-pane>
        <el-tab-pane label="回传日志" name="log">
          <logList v-if="activeName == 'log'"></logList>
        </el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>

<script lang="ts" setup>
import { useRouter, useRoute } from 'vue-router'
import type { TabsPaneContext } from 'element-plus'
import advertiser from "./tabs/advertiserList/index.vue"
import logList from "./tabs/logList/index.vue"
const router = useRouter()
const route = useRoute()
const handChange = (tab: TabsPaneContext, event: Event) => {
  router.push({ path: '/payback/juliangAccount', query: { tab } })
  activeName.value = tab
}
const activeName = ref('advertiser')
onMounted(() => {
  activeName.value = route.query.tab || 'advertiser'
});
</script>

<style scoped lang="scss"></style>
