<template>
  <a-tabs class="upms-notify-channel" default-active-key="1" :position="mdScreen ? 'left' : 'top'">
    <a-tab-pane key="1" title="邮箱"
      ><mail-view type="mail" :entity="configObj['mail']"></mail-view>
    </a-tab-pane>
    <a-tab-pane key="2" title="钉钉"> 暂未开放 </a-tab-pane>
    <a-tab-pane key="3" title="企业微信">
      <wechat-view type="wechat" :entity="configObj['wechat']"></wechat-view>
    </a-tab-pane>
  </a-tabs>
</template>
<script lang="ts" setup>
import { computed, inject, ref, Ref } from 'vue'
import { SystemInfo } from '@/types/types'
import MailView from './mail.vue'
import WechatView from './wechat.vue'
import { getConfig } from '@/api/upms/notify-channel'

const systemInfo = inject<Ref<SystemInfo>>('systemInfo')
const mdScreen = computed(() => systemInfo && systemInfo.value.mdScreen)

const configObj = ref<any>({
  mail: {},
  wechat: {}
})
getConfig().then((res) => {
  configObj.value = res
})
</script>
<style scope lang="scss">
.upms-notify-channel {
  .arco-tabs-content {
    max-width: 600px;
  }
  .arco-tabs-nav-vertical {
    min-height: 600px;
    .arco-tabs-tab-title {
      padding: 4px 0;
      min-width: 80px;
      text-align: right;
    }
  }
}
</style>
