<template>
    <Tooltip :infos="[t('saveGame.0'), t('saveGame.1')]" width="12rem">
        <img class="menu-img" :src="menu_icons.saveGame" @click="saveGame">
    </Tooltip>
</template>

<script lang="ts" setup>
import { useStore } from "vuex";
import { onBeforeUnmount, onMounted, ref } from "vue";
import { useI18n } from "vue3-i18n";
import { Tooltip } from "@/components"
import { menu_icons, archive_name } from "@/config";
import { Base64 } from "js-base64";

const { t } = useI18n();
const { state, commit, dispatch } = useStore();
let interval = 0;

const saveGame = () => {
    dispatch('saveGame');
}

const keydown = (e) => {
    if (e.keyCode == 83 && e.ctrlKey) {
        saveGame();
        e.preventDefault();
    }
}

onMounted(() => {
    dispatch('loadGame');
    //每5分钟保存一次存档
    interval = setInterval(saveGame, 5 * 60 * 1000);
    document.addEventListener('keydown', keydown);
});
onBeforeUnmount(() => {
    document.removeEventListener('keydown', keydown);
})
</script>
<style lang="scss" scoped></style>