feat: ag-grid에서 iActionInfo를 툴팁으로 띄움

hwe/sammo/API/Nation/GeneralList.php

@@ -113,8 +113,6 @@ class GeneralList extends \sammo\BaseAPI
         $customViewColumns = [
             'officerLevel' => 0,
             'officerLevelText' => 0,
-            'specialDomesticTest' => 0,
-            'specialWarText' => 0,
             'lbonus' => 0,
             'ownerName' => 0,
             'honorText' => 0,
@@ -131,15 +129,6 @@ class GeneralList extends \sammo\BaseAPI
                 $level = $this->getOfficerLevel($rawGeneral);
                 return getOfficerLevelText($level, $nationArr['level']);
             },
-            'specialDomesticTest' => function ($rawGeneral) {
-                return getGeneralSpecialDomesticName($rawGeneral['special']);
-            },
-            'specialWarText' => function ($rawGeneral) {
-                return getGeneralSpecialWarName($rawGeneral['special2']);
-            },
-            'personal' => function ($rawGeneral) {
-                return getGenChar($rawGeneral['personal']);
-            },
             'lbonus' => function ($rawGeneral) use ($nationArr) {
                 return calcLeadershipBonus($rawGeneral['officer_level'], $nationArr['level']);
             },

hwe/ts/components/GeneralList.vue

@@ -34,12 +34,12 @@ import type {
   GridReadyEvent,
 } from "ag-grid-community";
 import { getNpcColor } from "@/common_legacy";
-import type {
+import type { BaseWithValueColDefParams, ValueGetterParams } from "ag-grid-community/dist/lib/entities/colDef";
-  BaseWithValueColDefParams,
-  ValueGetterParams,
-} from "ag-grid-community/dist/lib/entities/colDef";
 import type { GameConstStore } from "@/GameConstStore";
 import { unwrap } from "@/util/unwrap";
+import SimpleTooltipCell from "@/gridCellRenderer/SimpleTooltipCell.vue";
+import GridTooltipCell from "@/gridCellRenderer/GridTooltipCell.vue";
+import type { GameIActionInfo } from "@/defs/GameObj";
 
 const props = defineProps({
   list: {
@@ -54,7 +54,7 @@ const props = defineProps({
   },
 });
 
-const gameConstStore = unwrap(inject<Ref<GameConstStore>>('gameConstStore'));
+const gameConstStore = unwrap(inject<Ref<GameConstStore>>("gameConstStore"));
 const iActionInfo = gameConstStore.value.iActionInfo;
 console.log(iActionInfo);
 //debug
@@ -144,6 +144,12 @@ interface GenCellClassParams extends CellClassParams {
   data: GeneralListItem;
 }
 
+type GridCellInfo = {
+  iActionMap?: Record<string, GameIActionInfo>;
+  info?: string;
+  target: keyof GeneralListItem;
+};
+
 function naiveCheClassNameFilter(value: string): string {
   const text = value.split("_").pop() ?? "None";
   if (text === "None") {
@@ -310,11 +316,17 @@ const columnRawDefs = ref<Partial<Record<headerType, GenColDef | GenColGroupDef>
     children: [
       {
         headerName: "요약",
-        cellRenderer: ({ data }: GenValueParams) => {
+        cellRenderer: GridTooltipCell,
-          const personal = naiveCheClassNameFilter(data.personal);
+        cellRendererParams: {
-          const specialDomestic = naiveCheClassNameFilter(data.specialDomestic);
+          cells: ((): GridCellInfo[][] => {
-          const specialWar = naiveCheClassNameFilter(data.specialWar);
+            return [
-          return `${personal}<br><div class="row gx-1 m-0 cell-sp"><div class="col">${specialDomestic}</div><div class="col">${specialWar}</div>`;
+              [{ target: "personal", iActionMap: gameConstStore.value.iActionInfo.personality }],
+              [
+                { target: "specialDomestic", iActionMap: gameConstStore.value.iActionInfo.specialDomestic },
+                { target: "specialWar", iActionMap: gameConstStore.value.iActionInfo.specialWar },
+              ],
+            ];
+          })(),
         },
         width: 90,
         columnGroupShow: "closed",
@@ -322,7 +334,10 @@ const columnRawDefs = ref<Partial<Record<headerType, GenColDef | GenColGroupDef>
       {
         headerName: "성격",
         field: "personal",
-        valueFormatter: naiveCheClassNameFilterFromRow("personal"),
+        cellRenderer: SimpleTooltipCell,
+        cellRendererParams: {
+          iActionMap: gameConstStore.value.iActionInfo.personality,
+        },
         width: 70,
         sortable: true,
         filter: true,
@@ -331,7 +346,10 @@ const columnRawDefs = ref<Partial<Record<headerType, GenColDef | GenColGroupDef>
       {
         headerName: "내특",
         field: "specialDomestic",
-        valueFormatter: naiveCheClassNameFilterFromRow("specialDomestic"),
+        cellRenderer: SimpleTooltipCell,
+        cellRendererParams: {
+          iActionMap: gameConstStore.value.iActionInfo.specialDomestic,
+        },
         width: 70,
         sortable: true,
         filter: true,
@@ -340,7 +358,10 @@ const columnRawDefs = ref<Partial<Record<headerType, GenColDef | GenColGroupDef>
       {
         headerName: "전특",
         field: "specialWar",
-        valueFormatter: naiveCheClassNameFilterFromRow("specialWar"),
+        cellRenderer: SimpleTooltipCell,
+        cellRendererParams: {
+          iActionMap: gameConstStore.value.iActionInfo.specialWar,
+        },
         width: 70,
         sortable: true,
         filter: true,

hwe/ts/gridCellRenderer/GridTooltipCell.vue

@@ -0,0 +1,49 @@
+<template>
+  <div>
+    <div v-for="(rowValue, rowIdx) in props.params.cells" :key="rowIdx" class="row gx-1 m-0 cell-sp">
+      <template v-for="colValue of rowValue" :key="colValue.target">
+        <div
+          v-if="colValue.iActionMap"
+          v-b-tooltip.hover
+          class="col"
+          :title="colValue.iActionMap[params.data[colValue.target ] as string ].info??''"
+        >
+          {{ colValue.iActionMap[params.data[colValue.target] as string ].name }}
+        </div>
+        <div v-else v-b-tooltip.hover class="col" :title="colValue.info ?? ''">
+          {{params.data[colValue.target] as string}}
+        </div>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { GeneralListItem } from "@/defs/API/Nation";
+import type { GameIActionInfo } from "@/defs/GameObj";
+import type { CellClassParams } from "ag-grid-community";
+import type { PropType } from "vue";
+
+interface GenCellClassParams extends CellClassParams {
+  data: GeneralListItem;
+}
+
+type GridCellInfo = {
+  iActionMap?: Record<string, GameIActionInfo>;
+  info?: string;
+  target: keyof GeneralListItem;
+};
+
+const props = defineProps({
+  params: {
+    type: Object as PropType<
+      GenCellClassParams & {
+        cells: GridCellInfo[][];
+      }
+    >,
+    required: true,
+  },
+});
+
+console.log(props.params.cells);
+</script>

hwe/ts/gridCellRenderer/SimpleTooltipCell.vue

@@ -0,0 +1,42 @@
+<template>
+  <span v-if="params.iActionMap" v-b-tooltip.hover :title="params.iActionMap[props.params.value].info??''">{{ params.iActionMap[props.params.value].name }}</span>
+  <span v-else-if="params.info" v-b-tooltip.hover :title="params.info">{{ displayValue }}</span>
+  <span v-else>{{ displayValue }}</span>
+</template>
+
+<script lang="ts" setup>
+import type { GameIActionInfo } from "@/defs/GameObj";
+import type { ValueFormatterParams } from "ag-grid-community";
+import { isNumber, isString } from "lodash";
+import { ref, watch, type PropType } from "vue";
+
+const props = defineProps({
+  params: {
+    type: Object as PropType<
+      ValueFormatterParams & {
+        info?: string;
+        iActionMap?: Record<string, GameIActionInfo>
+      }
+    >,
+    required: true,
+  },
+});
+
+function convertValue(value: unknown): string {
+  if (isString(value)) {
+    return value;
+  }
+  if (isNumber(value)) {
+    return value.toLocaleString();
+  }
+  return `${value}`;
+}
+
+const displayValue = ref<string>(convertValue(props.params.value));
+watch(
+  () => props.params,
+  (newParams) => {
+    displayValue.value = convertValue(newParams.value);
+  }
+);
+</script>