Merge a1a8017ce1 into 820dc5bf4c

packages-user/client-modules/src/render/index.tsx

@@ -1,6 +1,6 @@
 import { createApp, Font } from '@motajs/render';
 import { defineComponent } from 'vue';
-import { MAIN_HEIGHT, MAIN_WIDTH } from './shared';
+import { DEFAULT_FONT, MAIN_HEIGHT, MAIN_WIDTH } from './shared';
 import { hook, loading } from '@user/data-base';
 import { createLoopMap } from './loopMap';
 import { createElements } from './elements';
@@ -45,7 +45,7 @@ export function createRender() {
         sceneController.open(GameTitleUI, {});
     });
 
-    Font.setDefaults(new Font('normal', 18));
+    Font.setDefaults(DEFAULT_FONT);
 }
 
 export * from './components';

packages-user/client-modules/src/render/shared.ts

@@ -1,4 +1,5 @@
 import { ElementLocator } from '@motajs/render-core';
+import { Font } from '@motajs/render-style';
 
 // 本文件为 UI 配置文件，你可以修改下面的每个常量来控制 UI 的显示参数，每个常量都有注释说明
 
@@ -60,15 +61,17 @@ export const CENTER_LOC: ElementLocator = [
 
 /** 弹框的宽度，使用在内置 UI 与组件中，包括确认框、选择框、等待框等 */
 export const POP_BOX_WIDTH = MAP_WIDTH / 2;
+/** 默认字体 */
+export const DEFAULT_FONT = new Font('normal', 18);
 
 //#region 存档界面
 
 /** 存档缩略图尺寸 */
-export const SAVE_ITEM_SIZE = 150;
+export const SAVE_ITEM_SIZE = MAP_BLOCK_WIDTH * 10;
 /** 单个存档上方显示第几号存档的高度 */
 export const SAVE_ITEM_TOP = 24;
 /** 单个存档下方显示这个存档信息的高度 */
-export const SAVE_ITEM_DOWN = 16;
+export const SAVE_ITEM_DOWN = 24;
 /** 单个存档高度，包括存档下方的信息 */
 export const SAVE_ITEM_HEIGHT = SAVE_ITEM_SIZE + SAVE_ITEM_TOP + SAVE_ITEM_DOWN;
 /** 存档间距 */

packages-user/client-modules/src/render/ui/save.tsx

@@ -69,8 +69,8 @@ const saveBtnProps = {
 } satisfies SetupComponentOptions<SaveItemProps>;
 
 export const SaveItem = defineComponent<SaveItemProps>(props => {
-    const font = new Font('normal', 18);
-    const statusFont = new Font('normal', 14);
+    const font = Font.defaults({ size: 18 });
+    const statusFont = Font.defaults({ size: 14 });
 
     const w = computed(() => props.loc[2] ?? 200);
     const h = computed(() => props.loc[3] ?? 200);
@@ -93,6 +93,11 @@ export const SaveItem = defineComponent<SaveItemProps>(props => {
             return `${hp}/${atk}/${def}`;
         }
     });
+    const timeText = computed(() => {
+        if (!props.data) return '';
+        const date = new Date(props.data.data.time);
+        return date.toLocaleString();
+    });
 
     const strokeStyle = computed(() => {
         if (props.selected) return props.inDelete ? 'red' : 'gold';
@@ -115,8 +120,8 @@ export const SaveItem = defineComponent<SaveItemProps>(props => {
             <text
                 text={name.value}
                 font={font}
-                loc={[w.value / 2, SAVE_ITEM_TOP - 4]}
-                anc={[0.5, 1]}
+                loc={[w.value / 2, 0]}
+                anc={[0.5, 0]}
             />
             <g-rect
                 loc={imgLoc.value}
@@ -143,7 +148,14 @@ export const SaveItem = defineComponent<SaveItemProps>(props => {
                 text={statusText.value}
                 fillStyle="yellow"
                 font={statusFont}
-                loc={[w.value / 2, h.value - SAVE_ITEM_DOWN + 2]}
+                loc={[w.value / 2, h.value - SAVE_ITEM_DOWN]}
+                anc={[0.5, 0]}
+            />
+            <text
+                text={timeText.value}
+                fillStyle="yellow"
+                font={statusFont}
+                loc={[w.value / 2, h.value - SAVE_ITEM_DOWN + 12]}
                 anc={[0.5, 0]}
             />
         </container>