<script lang="ts" setup>
import { dateZhCN, zhCN } from 'naive-ui'
import { computed } from 'vue'
import { AppProvider } from '@/components/Application'
import { lighten } from '@/utils/index'

const getThemeOverrides = computed(() => {
  const theme = '#1980FF'
  const lightenStr = lighten(theme, 6)

  return {
    common: {
      primaryColor: theme,
      primaryColorHover: lightenStr,
      primaryColorPressed: lightenStr,
      primaryColorSuppl: theme,
    },
    Switch: {
      railColorActive: '#07C984',
    },
    Input: {
      borderHover: '0px',
      borderFocus: '0px',
      boxShadowFocus: '#ff0000',
    },
    Tag: {
      colorCheckedHover: '#507afd',
      colorCheckedPressed: '#507afd',
    },
    Slider: {
      fillColor: '#1980FF',
      dotBorderActive: '#1980FF',
      fillColorHover: '#1980FF',
    },
    Card: {
      padding: '0px',
    },
    Dropdown: {
      optionColorHover: '#e8f2ff',
    },
    Upload: {
      draggerBorder: '1px dashed #1980FF',
      draggerBorderHover: '1px dashed #1980FF',
    },
  }
})
</script>

<template>
  <NConfigProvider :locale="zhCN" :date-locale="dateZhCN" :theme-overrides="getThemeOverrides">
    <AppProvider>
      <RouterView />
    </AppProvider>
  </NConfigProvider>
</template>

<style lang="less"></style>
