<script lang="ts" setup>
import {useUserStore} from "@/store";
import {debounce} from "throttle-debounce";
import Config from "@/config";
import {appUserLogoutPost} from "@/service";

const {t} = useI18n();
const userStore = useUserStore();

const show = ref(false);

function init() {
  show.value = true;
}

function close() {
  show.value = false;
}

// 退出登录
async function confirmLogout() {
  try {
    close();
    await appUserLogoutPost({});
    userStore.clear();
    await uni.showToast({title: t("pages.mine.log-out-successfully"), icon: "none"});
  } catch (error) {
  }
}

const handleConfirmLogout = debounce(Config.debounceLongTime, confirmLogout, {
  atBegin: true
});

defineOptions({
  name: "LogOut",
});

defineExpose({
  show,
  init,
  close,
});
</script>
<template>
  <wd-popup
      v-model="show"
      custom-class="!bg-transparent"
      position="bottom"
      safe-area-inset-bottom
      @close="close"
  >
    <view class="p-[40rpx+20rpx]">
      <view
          class="mb-20rpx py-46rpx px-102rpx flex items-center justify-center text-center text-28rpx text-primary font-bold bg-white shadow-[0rpx_3rpx_6rpx_rgba(0,0,0,0.16)] rounded-12rpx"
      >
        {{ t("pages.mine.login-out-tip") }}
      </view>
      <view
          class="h-100rpx flex items-center justify-center text-28rpx text-primary font-bold shadow-[0rpx_3rpx_6rpx_rgba(0,0,0,0.16)] bg-white rounded-12rpx"
          @click="handleConfirmLogout"
      >
        {{ t("common.confirm") }}
      </view>
    </view>
  </wd-popup>
</template>

<style lang="scss" scoped></style>
