feat: 메인페이지 기타 설정란 tooltip(wip)

hwe/ts/PageFront.vue

@@ -25,7 +25,9 @@
             </div>
             <div class="subNPCMode">NPC선택: {{ ["불가능", "가능", "선택 생성"][globalInfo.npcMode] }}</div>
             <div class="subTournamentMode">토너먼트: 경기당 {{ calcTournamentTerm(globalInfo.turnterm) }}분</div>
-            <div class="subOtherSetting">기타 설정: (TODO)자율행동[내정, 훈련/사기진작, 사령턴, 24시간 유효]</div>
+            <div class="subOtherSetting">기타 설정:
+              <AutorunInfo :autorunMode="globalInfo.autorunUser" />
+            </div>
             <div class="subYearMonth">
               현재: {{ globalInfo.year }}年 {{ globalInfo.month }}月 ({{ globalInfo.turnterm }}분 턴 서버)
             </div>
@@ -166,6 +168,7 @@ import { formatTime } from "./util/formatTime";
 import { calcTournamentTerm } from "./utilGame";
 import MapViewer, { type CityPositionMap, type MapCityParsed, type MapCityParsedRaw } from "./components/MapViewer.vue";
 import PartialReservedCommand from "./PartialReservedCommand.vue";
+import AutorunInfo from "./components/AutorunInfo.vue";
 
 const { serverName, serverNick, serverID } = staticValues;
 

hwe/ts/components/AutorunInfo.vue

@@ -0,0 +1,63 @@
+<template>
+  <span v-if="autorunMode.limit_minutes > 0" v-b-tooltip.hover :title="tooltipText">자율행동</span>
+</template>
+<script setup lang="ts">
+import type { AutorunUserMode } from '@/defs/API/Global';
+import type { Entries } from '@/util/Entries';
+import { ref, toRef, watch } from 'vue';
+
+type AutorunMode = {
+    limit_minutes: number,
+    options: Record<AutorunUserMode, number>,
+  };
+
+const props = defineProps<{
+  autorunMode: AutorunMode
+}>();
+
+const tooltipText = ref("_");
+const autorunMode = toRef(props, 'autorunMode');
+
+function updateTooltipText(autorunMode: AutorunMode){
+  const {options, limit_minutes} = autorunMode;
+  const optionMap: Record<AutorunUserMode, string> = {
+    'battle': '출병',
+    'warp': '순간이동',
+    'recruit': '징병',
+    'recruit_high': '모병',
+    'train': '훈련/사기진작',
+    'chief': '사령턴',
+    'develop': '내정',
+  };
+
+  const response = new Map<AutorunUserMode | 'limit_minutes', string>();
+  for(const [option, value] of Object.entries(options) as Entries<typeof options>){
+    if(value > 0){
+      response.set(option, optionMap[option]);
+    }
+  }
+
+  if(response.has('recruit_high')){
+    response.delete('recruit');
+  }
+
+  if(limit_minutes >= 43200){
+    response.set('limit_minutes', '항상 유효');
+  }
+  else if(limit_minutes % 60 == 0){
+    response.set('limit_minutes', `${limit_minutes / 60}시간 유효`);
+  }
+  else{
+    response.set('limit_minutes', `${limit_minutes}분 유효`);
+  }
+
+  const text = Array.from(response.values()).join(', ');
+  tooltipText.value = text;
+}
+
+updateTooltipText(autorunMode.value);
+watch(autorunMode, (newAutorunMode) => {
+  updateTooltipText(newAutorunMode);
+});
+
+</script>