import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import axios from 'axios'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import dayjs from 'dayjs'
import App from './App.vue'
import pinia from './store'
import router from './router'
import useSettingsStore from './store/modules/settings'
import request from '@/api/index'
import indexDB from '@/utils/indexDB'
import '@/utils/getLocation'
// import 'amfe-flexible'
// 自定义指令
import { dragHeight } from '@/directives/drag-height/index'
import { dragWidth } from '@/directives/drag-width/index'
import tableAutoScroll from '@/directives/table-scroll/index'
import loadMore from './directives/load-more'
// 引入音频文件
import alarmAudio from '@/assets/audio/alarm.mp3'
import otherAudio from '@/assets/audio/other.mp3'
// 自定义指令
import directive from '@/utils/directive'
// 加载 svg 图标
import 'virtual:svg-icons-register'
// 全局样式
import '@/assets/styles/globals.scss'
// 加载 iconify 图标（element plus）
import { downloadAndInstall } from '@/iconify-ep'
import { hasPermission } from '@/utils/composables/permission'
import buttonPerm from '@/utils/buttonPerm'
import Vant from 'vant'
import { Lazyload } from 'vant'
// 2. 引入组件样式
import 'vant/lib/index.css'
// import TDesign from 'tdesign-mobile-vue'
// // 引入组件库的少量全局样式变量
// import 'tdesign-mobile-vue/es/style/index.css'


// vxe -table  虚拟滚动列表
import VxeUIAll from 'vxe-pc-ui'
import 'vxe-pc-ui/lib/style.css'
import VxeUITable from 'vxe-table'
import 'vxe-table/lib/style.css'

if (useSettingsStore().app.iconifyOfflineUse) {
  downloadAndInstall()
}


axios.get('./config/config.json', {
  headers: {
    'Cache-Control': 'no-cache',
  },
}).then((result) => {
  const app = createApp(App)
  // console.log('get config')
  console.log(window.localStorage.getItem('browser-type-bj-well'), '浏览器类型pc/mobile')
  // console.log(result)
  window.localStorage.setItem('url-bj-well', result.data.baseUrl)
  window.localStorage.setItem('securityJsCode', result.data.securityJsCode)
  window.localStorage.setItem('JsKey', result.data.JsKey)
  window.localStorage.setItem('areaCode', JSON.stringify(result.data.areaCode))
  window.localStorage.setItem('xuntengMap', result.data.xuntengMap)
  window.localStorage.setItem('project-name', result.data.title)
  if (window.localStorage.getItem('browser-type-bj-well') === 'pc') {
    axios.get(`${window.localStorage.getItem('xuntengMap') as string}/L16/R00006105/C0000d2ba.png?ts=${new Date().getTime()}`).then(() => {
      console.log('地图管线图层请求成功')
      window.sessionStorage.setItem('ping-xunteng-layer', '1')
    }).catch((error) => {
      console.log('地图管线图层请求失败')
      window.sessionStorage.setItem('ping-xunteng-layer', '')
      if (error.message) {
        console.log('地图管线图层请求失败')
        window.sessionStorage.setItem('ping-xunteng-layer', '')
      }
    })
  }
  request.defaults.baseURL = result.data.baseUrl // 设置默认请求网址
  app.config.globalProperties.config = result.data
  app.config.globalProperties.hasPerm = hasPermission
  app.config.globalProperties.buttonPerm = buttonPerm
  app.config.globalProperties.dayjs = dayjs
  console.log(`当前系统版本:${result.data.version}`)
  indexDB.init().then(() => {
    console.log('Database initialized successfully!')
  }).catch(() => {
    console.log('Database initialization failed!')
  })
  // 方法1：注册播放音频事件到Vue实例上
  app.config.globalProperties.playAudio = () => {
    const audio = document.getElementById('eventAudio') as HTMLAudioElement
    audio.setAttribute('src', otherAudio)
    audio.loop = true
    if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素
      audio.load()
    }
    else { // 否则
      // audio.pause()
      setTimeout(() => {
        // audio.play()
        const playPromise = audio.load()
        if (playPromise) {
          playPromise.then(() => {
            // 音频加载成功
            console.log('音频加载成功')
          }).catch((e) => {
            // 音频加载失败
            console.error(e.message)
          })
        }
      }, 10)
    }
  }
  app.config.globalProperties.pauseAudio = () => {
    const audio = document.getElementById('eventAudio') as HTMLAudioElement
    if (audio) {
      audio.pause()
    }

    // if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素
    //   audio.pause()
    // }
  }
  app.use(ElementPlus)
  app.use(Vant)
  app.use(pinia)
  app.use(router)
  app.use(VxeUIAll)
  app.use(VxeUITable)
  app.use(Lazyload, {
    lazyComponent: true,
  })
  for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
  }
  // 加载自定义指令
  app.directive('drag-height', (el, binding) => {
    dragHeight(el, binding)
  })
  app.directive('drag-width', (el, binding) => {
    dragWidth(el, binding)
  })
  app.directive('tableAutoScroll', tableAutoScroll)
  app.directive('loadmore', loadMore)
  directive(app)

  app.mount('#app')
}).catch((error) => {
  console.error(`get baseConfig error...${error}`)
})