diff --git a/hwe/sammo/API/Nation/GeneralList.php b/hwe/sammo/API/Nation/GeneralList.php
index ce93e391..729cd701 100644
--- a/hwe/sammo/API/Nation/GeneralList.php
+++ b/hwe/sammo/API/Nation/GeneralList.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace sammo\API\List\Nation;
+namespace sammo\API\Nation;
 
 use sammo\DB;
 use sammo\General;
@@ -180,7 +180,7 @@ class GeneralList extends \sammo\BaseAPI
             if ($reqPermission > $this->permission) {
                 continue;
             }
-            $resultColumns[] = $column;
+            $resultColumns[$column] = $column;
         }
 
         $generalList = [];
diff --git a/hwe/ts/PageNationGeneral.vue b/hwe/ts/PageNationGeneral.vue
index 065027ae..e9986766 100644
--- a/hwe/ts/PageNationGeneral.vue
+++ b/hwe/ts/PageNationGeneral.vue
@@ -1,18 +1,52 @@
 <template>
-    <BContainer id="container" :toast="{ root: true }" class="pageNationGeneral bg0">
-        <TopBackBar :title="title" />
-
-        <BottomBar />
-    </BContainer>
+  <BContainer id="container" :toast="{ root: true }" class="pageNationGeneral bg0">
+    <TopBackBar :title="title" />
+    <GeneralList :list="generalList" />
+    <BottomBar />
+  </BContainer>
 </template>
 
+<script lang="ts">
+/*declare const staticValues: {
+    serverNick: string,
+    mapName: string,
+    unitSet: string,
+};*/
+</script>
 <script lang="ts" setup>
 import TopBackBar from "@/components/TopBackBar.vue";
 import BottomBar from "@/components/BottomBar.vue";
-import { BContainer, useToast } from "bootstrap-vue-3";
-import { unwrap } from "./util/unwrap";
+import { BContainer } from "bootstrap-vue-3";
+import { onMounted, ref } from "vue";
+import { SammoAPI } from "./SammoAPI";
+import { merge2DArrToObjectArr } from "./util/merge2DArrToObjectArr";
+import type { GeneralListItem } from "./defs/API/Nation";
+import GeneralList from "./components/GeneralList.vue";
 
-const toasts = unwrap(useToast());
+const generalList = ref(new Map<number, GeneralListItem>());
 
-const title = '세력 장수';
-</script>
\ No newline at end of file
+const title = "세력 장수";
+
+onMounted(async () => {
+  try {
+    const { column, list, permission } = await SammoAPI.Nation.GeneralList();
+    //XXX: 로직상 똑같은데....
+    if (permission == 0) {
+      const rawGeneralList = merge2DArrToObjectArr(column, list);
+      generalList.value = new Map(rawGeneralList.map((v) => [v.no, { permission, ...v }]));
+    } else if (permission == 1) {
+      const rawGeneralList = merge2DArrToObjectArr(column, list);
+      generalList.value = new Map(rawGeneralList.map((v) => [v.no, { permission, ...v }]));
+    } else if ([2, 3, 4].includes(permission)) {
+      const rawGeneralList = merge2DArrToObjectArr(column, list);
+      generalList.value = new Map(rawGeneralList.map((v) => [v.no, { permission, ...v }]));
+    } else {
+      throw `?? ${permission}`;
+    }
+
+  } catch (e) {
+    console.error(e);
+    throw e;
+  }
+});
+</script>
diff --git a/hwe/ts/components/GeneralList.vue b/hwe/ts/components/GeneralList.vue
new file mode 100644
index 00000000..6e410b75
--- /dev/null
+++ b/hwe/ts/components/GeneralList.vue
@@ -0,0 +1,19 @@
+<template>
+  <div class="grid">
+    <div v-for="[generalID, general] of list" :key="generalID" class="row">
+      {{ general }}
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { GeneralListItem } from "@/defs/API/Nation";
+import type { PropType } from "vue";
+
+defineProps({
+  list: {
+    type: Object as PropType<Map<number, GeneralListItem>>,
+    required: true,
+  },
+});
+</script>
diff --git a/hwe/ts/defs/API/Nation/index.ts b/hwe/ts/defs/API/Nation/index.ts
index 71b69f31..d5fbf43a 100644
--- a/hwe/ts/defs/API/Nation/index.ts
+++ b/hwe/ts/defs/API/Nation/index.ts
@@ -43,39 +43,31 @@ export type GeneralListItemP2 = GeneralListItemP1 & {
     officer_city: number,
 
 }
-export type GeneralListItemP9 = GeneralListItemP2 & {
-    owner_name: string,
-}
+
+export type RawGeneralListItem = GeneralListItemP0 | GeneralListItemP1 | GeneralListItemP2;
 
 export type GeneralListItem =
-({permission : 0} & GeneralListItemP0) |
-({permission : 1} & GeneralListItemP1) |
-({permission : 2} & GeneralListItemP2) |
-({permission : 9} & GeneralListItemP9);
+    ({ permission: 0 } & GeneralListItemP0) |
+    ({ permission: 1 } & GeneralListItemP1) |
+    ({ permission: 2 | 3 | 4 } & GeneralListItemP2);
 
 
 export type RawGeneralListP0 = ValidResponse & {
     permission: 0,
-    column: keyof GeneralListItemP0[],
-    list: ValuesOf<GeneralListItemP0>[],
+    column: (keyof GeneralListItemP0)[],
+    list: ValuesOf<GeneralListItemP0>[][],
 }
 
 export type RawGeneralListP1 = ValidResponse & {
     permission: 1,
-    column: keyof GeneralListItemP1[],
+    column: (keyof GeneralListItemP1)[],
     list: ValuesOf<GeneralListItemP1>[][],
 }
 
 export type RawGeneralListP2 = ValidResponse & {
-    permission: 2,
-    column: keyof GeneralListItemP2[],
+    permission: 2 | 3 | 4,
+    column: (keyof GeneralListItemP2)[],
     list: ValuesOf<GeneralListItemP2>[][],
 }
 
-export type RawGeneralListP9 = ValidResponse & {
-    permission: 9,
-    column: keyof GeneralListItemP9[],
-    list: ValuesOf<GeneralListItemP9>[][],
-}
-
-export type GeneralListResponse = RawGeneralListP0 | RawGeneralListP1 | RawGeneralListP2 | RawGeneralListP9;
+export type GeneralListResponse = RawGeneralListP0 | RawGeneralListP1 | RawGeneralListP2;
diff --git a/hwe/ts/util/merge2DArrToObjectArr.ts b/hwe/ts/util/merge2DArrToObjectArr.ts
index a019d021..bea7836a 100644
--- a/hwe/ts/util/merge2DArrToObjectArr.ts
+++ b/hwe/ts/util/merge2DArrToObjectArr.ts
@@ -7,7 +7,7 @@ export function merge2DArrToObjectArr<T extends Record<string, unknown>>(column:
     for(const rawItem of list){
         const item: Record<string, unknown> = {};
 
-        if(column.length != item.length){
+        if(column.length != rawItem.length){
             throw `column과 item의 길이가 같지 않습니다: ${column.length} != ${list.length}, ${JSON.stringify(item)}`;
         }