优化怪物手册，状态栏初步

src/ui/book.vue

@@ -39,13 +39,21 @@ import { sleep } from 'mutate-animate';
 import { onMounted, onUnmounted, ref } from 'vue';
 import EnemyOne from '../components/enemyOne.vue';
 import Scroll from '../components/scroll.vue';
-import { getDamageColor, keycode } from '../plugin/utils';
+import { getDamageColor, has, keycode } from '../plugin/utils';
 import BookDetail from './bookDetail.vue';
 import { LeftOutlined } from '@ant-design/icons-vue';
 import { KeyCode } from '../plugin/keyCodes';
+import { noClosePanel } from '../plugin/uiController';
 
 const floorId =
-    core.floorIds[core.status.event?.ui as number] ?? core.status.floorId;
+    // @ts-ignore
+    core.floorIds[core.status.event?.ui?.index] ?? core.status.floorId;
+// 清除浏览地图时的光环缓存
+if (floorId !== core.status.floorId && core.status.checkBlock) {
+    // @ts-ignore
+    core.status.checkBlock.cache = {};
+}
+
 const enemy = core.getCurrentEnemys(floorId);
 
 const scroll = ref(0);
@@ -116,8 +124,17 @@ async function show() {
 /**
  * 退出怪物手册
  */
-function exit() {
+async function exit() {
+    noClosePanel.value = true;
     core.plugin.bookOpened.value = false;
+    if (core.events.recoverEvents(core.status.event.interval)) {
+        return;
+    } else if (has(core.status.event.ui)) {
+        core.status.boxAnimateObjs = [];
+        // @ts-ignore
+        core.ui._drawViewMaps(core.status.event.ui);
+    } else core.ui.closePanel();
+    await sleep(650);
 }
 
 function checkScroll() {

src/ui/statusBar.vue

@@ -0,0 +1,49 @@
+<template>
+    <div id="status-bar"></div>
+</template>
+
+<script lang="ts" setup>
+import { ref, shallowReactive, watch } from 'vue';
+import { isMobile } from '../plugin/use';
+import { status } from '../plugin/ui/statusBar';
+
+const width = ref(isMobile ? window.innerWidth : 300);
+const height = ref(isMobile ? 300 : window.innerHeight - 100);
+const left = ref(isMobile ? 0 : 50);
+const top = ref(50);
+const hero = shallowReactive<Partial<HeroStatus>>({});
+const floor = ref<string>();
+/**
+ * 要展示的勇士属性
+ */
+const toShow: (keyof NumbericHeroStatus)[] = [
+    'hp', // 生命
+    'atk', // 攻击
+    'def', // 防御
+    'mdef', // 智力
+    'hpmax', // 生命回复
+    'mana', // 额外攻击
+    'money', // 金币
+    'exp' // 经验
+];
+
+watch(status, update);
+
+/**
+ * 更新显示内容
+ */
+function update() {
+    toShow.forEach(v => {
+        hero[v] = core.getRealStatus(v);
+    });
+    floor.value = core.status.thisMap?.title;
+}
+</script>
+
+<style lang="less" scoped>
+#status-bar {
+    width: 100%;
+    height: 100%;
+    position: fixed;
+}
+</style>