<template>
  <div style="width: 100%;height: 100%;">
    <!--  <el-config-provider :locale="locale">-->
    <router-view />
    <!--  </el-config-provider>-->
    
    <reset-pwd ref="resetPwdRef" />
    <binding-number ref="bindingNumberRef" />
    <examinationDialog ref="examinationDialogRef" />
  </div>
</template>

<script setup>
import useSettingsStore from '@/store/modules/settings'
import { getMyRecent } from '@/api/system/userInfo'
import { handleThemeStyle } from '@/utils/theme'
import { nextTick, onMounted, watch, getCurrentInstance, ref } from 'vue'
import { getToken } from '@/utils/auth'
import { dayjs } from 'element-plus'
import useUserStore from '@/store/modules/user'
import ResetPwd from '@/views/system/user/profile/components/resetPwd'
import BindingNumber from '/@/views/system/user/profile/components/bindingNumber.vue'
import examinationDialog from '@/views/system/user/profile/components/examinationDialog.vue'

const userStore = useUserStore()
const { proxy } = getCurrentInstance()
const canShowByExamStatus = ref(false)

onMounted(() => {
  document.body.style.setProperty('--el-color-primary', '#1561CB')
  // 鼠标移动到按钮上方时显示的颜色，默认蓝色，可以和primary设置的颜色不一样
  document.body.style.setProperty('--el-color-primary-light-3', '#1357b7')
  
  document.body.style.setProperty('--el-color-success', '#29c490')
  document.body.style.setProperty('--el-color-success-light-3', '#54d0a6')
  // danger
  document.body.style.setProperty('--el-color-danger', '#d51515')
  document.body.style.setProperty('--el-color-danger-light-3', '#d44')
  // warning
  document.body.style.setProperty('--el-color-warning', '#e6a23c')
  document.body.style.setProperty('--el-color-warning-light-3', '#ebb563')
  if (userStore.deptType === '6') {
    getMyRecentFn()
  }
  nextTick(() => {
    // 初始化主题样式
    handleThemeStyle(useSettingsStore().theme)
  })
  
  checkToken()
  setInterval(() => {
    if (dayjs().format('HH:mm') == '02:00') {
      location.reload()
    }
  }, 1000 * 60)
})

async function getMyRecentFn() {
  const res = await getMyRecent()
  const examData = res?.data ?? {}
  canShowByExamStatus.value = !examData.auditStatus || examData.auditStatus === '3'
}

watch(() => [
  userStore.user?.changePassFlag,
  userStore.memberInfo.activeStatus, // 0未激活，1已激活
  userStore.authenticationStatus,
  userStore.user?.phonenumber,
  userStore.user?.checkFlag,
  userStore.user?.hintFlag,
  userStore.deptType,
  userStore.memberInfo?.isPoints,
  canShowByExamStatus.value
], (val) => {
  if (val[0] == '1' && val[1] == '1' && val[2] == 2) {
    if (location.hash.indexOf('/download') == -1) {
      // proxy.$modal.confirm('密码长期未更新，请及时更新').then(() => {
      //   proxy.$refs['resetPwdRef'].open()
      // })
      proxy.$modal.msgWarning('密码长期未更新，请及时更新!')
    }
    // if (val[2] == 2) {
    //   proxy.$refs['bindingNumberRef'].open()
    // }
    if (val[2] == 2 && !val[3] && val[4] == 1) {
      proxy.$refs['bindingNumberRef'].open()
    }
  }
  // console.log(window.location.hash.indexOf('/group/examination'))
  if (val[8] && val[1] == 1 && val[2] == 2 && val[5] == 1 && val[6] == 6 && val[7] == 1 && window.location.hash.indexOf('/group/examination') == -1) {
    proxy.$refs['examinationDialogRef'].open()
  }
})

let handleToken = null

function checkToken() {
  if (handleToken) clearTimeout(handleToken)
  handleToken = setTimeout(() => {
    if (userStore.token != getToken()) {
      clearTimeout(handleToken)
      handleToken = null
      location.reload()
    } else {
      checkToken()
    }
  }, 3000)
}


</script>
<style lang="scss">
.app-container {
  background-color: #F5F7F9;
  padding: 20px;
  min-height: calc(100vh - 85px);
}

//鼠标样式
.s {
  cursor: pointer;
}

/* 搜索栏 */
.from-Card {
  background-color: #fff;
  padding: 20px;
}

.btn-card {
  padding: 20px;
  background: #fff;
  border-radius: 10px;
  
}

/* 表格 */
.table {
  background-color: #fff;
  padding: 0 20px 10px;
  position: relative;
  
}

.box {
  background: #fff;
  border-radius: 5px;
  padding: 10px;
}

/* 分页 */
.foot {
  background-color: #fff;
  height: 50px;
}


.btn-top {
  margin-top: 10px;
}

.el-table {
  background: url("@/assets/logo/tableBg.png") #F5FBFE no-repeat top;
  background-color: #F5FBFE !important;
  background-size: 750px;
  --el-bg-color: #F5FBFE;
  --el-table-border-color: #e1e4ec;
  --el-fill-color-blank: transparent;
  --el-fill-color-light: #fff;
}

// 审核通过添加背景色
.success-row {
  --el-table-tr-bg-color: rgba(41, 196, 144, .15);
}

.totalCost {
  font-weight: 700;
  font-size: 16px;
  margin-top: 10px;
  position: absolute;
  bottom: 30px;
  left: 20px;
  z-index: 999;
  
  span {
    color: orange;
    margin-right: 20px;
  }
  
}

// 禁选背景色
.disabled-row {
  --el-table-tr-bg-color: rgba(36, 37, 37, 0.1);
}

.largeBtn {
  width: 180px;
  font-size: 18px !important;
  height: 40px !important;
}

.el-button:focus-visible {
  outline: none !important;
}
</style>