smartai2dian0/src/views/common/header-btns/ModalLogout.vue

<template>
  <a-modal width="420px" :visible="showModal" @ok="handleOk" @cancel="handleCancel" :okText="$t('login.okBtn')"
    :cancelText="$t('login.cancelBtn')" unmountOnClose>
    <template #title><icon-exclamation-circle-fill class="tips-icon" /> {{ $t('login.tip') }} </template>
    <div>{{ $t('login.okText') }}</div>
  </a-modal>
</template>

<script setup>
import { computed } from 'vue';
import { useRouter } from 'vue-router';
import { kuky_Authorization } from '../../../base/storage';
import { resetHasRouteFlag } from '../../../router/guard';
const props = defineProps({
  visible: {
    type: Boolean,
    default: false
  }
});
const emit = defineEmits(['update:visible']);
const router = useRouter();
const showModal = computed(() => props.visible);

const handleOk = () => {
  kuky_Authorization.remove();

  // 重置路由守卫标志位
  resetHasRouteFlag();
  router.push({ path: '/login', replace: true });
  emit('update:visible', false);
};
const handleCancel = () => {
  emit('update:visible', false);
};
</script>
<style scoped lang="css">
.tips-icon {
  font-size: 20px;
  color: rgb(var(--orange-6));
}
</style>