<script lang="ts" setup>
import { reactive } from 'vue'
import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
import { createChannelPublishColumn } from '../columns'
import { INDEX_URLS } from '@/config/base-url'
import useTableScrollY from '@/composables/useTableScrollY'
import { copyToClip } from '@/utils/copy'

const { t } = useI18n()

const { pageContentWrapRef, tableContentY } = useTableScrollY()

const router = useRouter()

const channelPublishList = reactive([
  {
    type: 'web',
  },
])

const columns = createChannelPublishColumn(handleClickChannelPublishTableAction)

function handleClickChannelPublishTableAction(actionType: string) {
  switch (actionType) {
    case 'accessPage':
      handleAccessPage()
      break
    case 'copyLink':
      handleCopyShareLink()
      break
  }
}

function handleAccessPage() {
  const channelUrl = `${INDEX_URLS[window.ENV || 'DEV']}share/web_source/${router.currentRoute.value.params.agentId}`
  location.href = channelUrl
}

function handleCopyShareLink() {
  const channelUrl = `${INDEX_URLS[window.ENV || 'DEV']}share/web_source/${router.currentRoute.value.params.agentId}`
  copyToClip(channelUrl)
  window.$message.success(
    t('personal_space_module.agent_module.agent_setting_module.agent_publish_module.copy_share_url_success_message'),
  )
}
</script>

<template>
  <div ref="pageContentWrapRef" class="h-full overflow-hidden p-5">
    <NDataTable
      :bordered="true"
      :bottom-bordered="true"
      :single-line="false"
      :data="channelPublishList"
      :columns="columns"
      :max-height="tableContentY"
      :scroll-x="1220"
    />
  </div>
</template>
