<template xmlns="">
  <view class="">
    <view v-if="props.showBack" :class="{'action':select === 0}" class="p-f back-box" @click="clickHandle">
      <ly-icon :color="color" :size="60" name="icon-fanhui"/>
    </view>
    <view class="p-f bottom-right"></view>
    <view class="p-f mac-info" @click="toSetting">
      mac:{{ userStore.mac || '未登录' }}
    </view>
  </view>
</template>

<script setup>
import {reactive} from "vue";
import {navigateBack, navTo, showToast} from "@/utils/app";
import {useUserStore} from "@/store/useUserStore";
import debounce from "@/utils/debounce";

const debounces = new debounce()

const userStore = useUserStore()

const pd = reactive({})
const emits = defineEmits(['backClick'])
const props = defineProps({
  showBack: {
    type: Boolean,
    default: true,
  },
  autoBack: {
    type: Boolean,
    default: true
  },
  color: {
    type: String,
    default: '#000'
  },
  select: {
    type: [String, Number],
    default: -1
  },
})

const clickHandle = () => {
  if (props.autoBack) {
    navigateBack()
  } else {
    emits('backClick')
  }
}

const toSetting = () => {
  debounces.secondCountDown('toSetting', {
    time: 5000,
    limit: 10,
    repetition_time: 0,
    run: (num, count, statue) => {
      if (count > 5) showToast(`再点击${10 - count}次`)
    },
    success: () => {
      console.log('success')
      navTo('pages/setting/index')
    },
    fail: () => {
      console.log('fail')
    },
  })
}
</script>

<style lang="scss" scoped>
.mac-info {
  bottom: 10rpx;
  right: 20rpx;
  font-size: 35rpx;
  color: #cccccc;
}

.back-box {
  //width: 30vw;
  height: 200px;
  z-index: 99;
}
</style>
