<script setup lang="ts">
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app'
import { useCounterStore } from '@/store/store'
import { useRouter } from 'vue-router'
import { onMounted } from 'vue'
const store = useCounterStore()
// store.getSystemInfo()
// store.getUserInfo()

const i = 'orientationchange' in window ? 'orientationchange' : 'resize'
const setViewHeight = () => {
  const windowVH = window.innerHeight / 100
  document.documentElement.style.setProperty('--vh', windowVH + 'px')
}
document.addEventListener('DOMContentLoaded', setViewHeight)
window.addEventListener(i, setViewHeight)

onLaunch(() => {
  store.token = uni.getStorageSync('token') || null
  store.userId = uni.getStorageSync('userId') || null
  store.userInfo = uni.getStorageSync('userInfo') || null

  // show()
  const router = useRouter()
  router.beforeEach((to, from, next) => {
    // hide(next)
    next()
  })
  router.afterEach(() => {
    // setTimeout(() => show(), 50)
  })
})
onMounted(() => {
  // setTimeout(() => {
  //   // eslint-disable-next-line no-unused-expressions
  //   document.body.scrollHeight // 触发页面重新计算高度
  // }, 100)
  // const viewportWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
  // const viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
  // console.log('Viewport Width: ' + viewportWidth)
  // console.log('Viewport Height: ' + viewportHeight)
  // const documentHeight = document.documentElement.scrollHeight || document.body.scrollHeight

  // console.log('Document Width: ' + documentWidth)
  // function getViewportHeight() {
  //   const vh = window.innerHeight
  //   const vhCalc = (window.innerWidth / document.documentElement.clientWidth) * 100
  //   return (window.innerHeight / vhCalc) * vh
  // }

  // const viewportHeight = getViewportHeight()
  // showToast('document.body.clientHeight ' + document.body.clientHeight)
  store.pageHeight = document.body.clientHeight + 'px'
  document.body.style.height = document.body.clientHeight + 'px'
  // showToast('document.body.clientHeight ' + document.body.style.height)
  // console.log('Calculated Viewport height:', viewportHeight)
  // console.log('Document Height: ' + documentHeight)
})
onShow(() => {})
onHide(() => {})

// const hide = (callback) => {
//   const classList = document.querySelector('uni-page').classList
//   classList.add('animation-before', 'animation-leave')
//   classListNaNpxove('animation-show')
//   setTimeout(() => {
//     classListNaNpxove('animation-before', 'animation-leave')
//     callback && callback()
//   }, 300)
// }
// const show = () => {
//   const classList = document.querySelector('uni-page')?.classList
//   classList.add('animation-before')
//   setTimeout(() => {
//     classList.add('animation-enter', 'animation-after', 'animation-show')
//     setTimeout(() => {
//       classListNaNpxove('animation-before', 'animation-after', 'animation-enter')
//     }, 300)
//   }, 20)
// }
</script>
<style lang="scss">
html,
body {
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch; /* 启用惯性滚动 */
}
.hh2 {
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.hh {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  word-break: break-all;
}
.uni-input-input {
  color: $color-black;
}
.tabbar {
  border-radius: 0.625rem 0.625rem 0px 0px;
  // box-shadow: 0px 0px 5px 2px #f4f4f4;
}
body {
  background: #fff;
  // fill: linear-gradient(191deg, #f3e0eb 0.38%, #f2e7fd 10.66%, #fff 26.2%);
}
::v-deep .uni-toast__icon {
  margin: 0.625rem auto 0 !important;
}

::v-deep .van-loading__line:before {
  color: #fff !important;
  background: #fff !important;
}

.uni-modal {
  padding: 0 1.25rem 1.25rem 1.25rem;
  border-radius: 0.625rem;
  .uni-modal__ft:after {
    display: none;
  }
  .uni-modal__btn:after {
    display: none;
  }
  .uni-modal__btn_default {
    width: 8.4375rem;
    height: 3.0625rem;
    border-radius: 1.5625rem;
    background: #08182b;
    color: #fff !important;
    font-size: 1rem;
    margin-right: 0.625rem;
  }
  .uni-modal__btn_primary {
    width: 8.4375rem;
    height: 3.0625rem;
    border-radius: 1.5625rem;
    background: #ee2560;
    font-size: 1rem;
    color: #fff !important;
  }
}

.up {
  color: $color-red !important;
}
.down {
  color: $color-green !important;
}
.ping {
  color: $uni-text-color;
}
.red {
  color: $color-red !important;
}
.green {
  color: $color-green !important;
}
.rotate {
  transform: rotate(180deg);
}
.nodata {
  font-size: $uni-font-size-lg;
  text-align: center;
  margin-top: 25.6px;
}
uni-tabbar {
  display: none;
}

/* #ifdef H5 */
uni-page {
  opacity: 1;
  transition: all 0.3s ease;
}

uni-page.animation-before {
  /* 在页面上使用 transform 会导致页面内的 fixed 定位渲染为 absolute，需要在动画完成后移除 */
  transform: translateY(0.625rem);
  opacity: 0;
}

uni-page.animation-leave {
  transition: all 0.3s ease;
}

uni-page.animation-enter {
  transition: all 0.3s ease;
}

uni-page.animation-show {
  opacity: 1;
}

uni-page.animation-after {
  /* 在页面上使用 transform 会导致页面内的 fixed 定位渲染为 absolute，需要在动画完成后移除 */
  transform: translateY(0);
}

/* #endif */
</style>
