From 7ee8a3005a96350f8b3d48fa19b7578985924f0a Mon Sep 17 00:00:00 2001
From: sohot8653 <kmbin92@stam.kr>
Date: Tue, 23 Sep 2025 17:12:41 +0900
Subject: [PATCH] =?UTF-8?q?[=EA=B6=8C=ED=95=9C=20=EC=8B=9C=EC=8A=A4?=
 =?UTF-8?q?=ED=85=9C=20=EA=B0=9C=EC=84=A0]=20=EA=B6=8C=ED=95=9C=20?=
 =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=A0=91=EA=B7=BC=20=EB=B0=A9?=
 =?UTF-8?q?=EC=8B=9D=EC=9D=84=20computed=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
 =?UTF-8?q?=ED=95=98=EA=B3=A0,=20=EB=A6=AC=EC=86=8C=EC=8A=A4=EB=B3=84=20?=
 =?UTF-8?q?=EC=A0=91=EA=B7=BC=20=ED=95=A8=EC=88=98=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 composables/usePermission.ts           | 12 ++++++++++--
 pages/[tabId]/test/permission-test.vue | 25 +++++++++++++++++++++----
 2 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/composables/usePermission.ts b/composables/usePermission.ts
index c2d7b68..7594d95 100644
--- a/composables/usePermission.ts
+++ b/composables/usePermission.ts
@@ -39,7 +39,15 @@ export const usePermission = () => {
       ),
 
     // 권한 데이터 직접 접근
-    permissions: permissionsStore.permissions,
-    isLoading: permissionsStore.isLoading,
+    permissions: computed(() => permissionsStore.permissions),
+    resources: computed(() => permissionsStore.permissions?.resources),
+    isLoading: computed(() => permissionsStore.isLoading),
+
+    // 리소스별 전체 접근 함수
+    getPageGroups: () =>
+      permissionsStore.permissions?.resources?.pageGroups || [],
+    getPages: () => permissionsStore.permissions?.resources?.pages || [],
+    getComponents: () =>
+      permissionsStore.permissions?.resources?.components || [],
   };
 };
diff --git a/pages/[tabId]/test/permission-test.vue b/pages/[tabId]/test/permission-test.vue
index 2268618..fe91f4f 100644
--- a/pages/[tabId]/test/permission-test.vue
+++ b/pages/[tabId]/test/permission-test.vue
@@ -32,7 +32,7 @@
           </p>
           <p>
             <strong>권한 로딩:</strong>
-            {{ permission.isLoading ? "로딩 중..." : "완료" }}
+            {{ permission.isLoading.value ? "로딩 중..." : "완료" }}
           </p>
           <p v-if="!userStore.isLoggedIn" class="text-orange-600 text-sm">
             <strong>참고:</strong> 로그인이 필요합니다. 로그인 후 권한 데이터가
@@ -213,6 +213,18 @@
                   >보기 버튼 (권한 없음)</span
                 >
               </div>
+
+              <div class="flex items-center space-x-2">
+                <button
+                  v-if="permission.hasComponentPermission('C010122')"
+                  class="bg-gray-500 text-white px-3 py-1 rounded text-sm hover:bg-gray-600"
+                >
+                  다운로드 버튼
+                </button>
+                <span v-else class="text-gray-400 text-sm"
+                  >다운로드 버튼 (권한 없음)</span
+                >
+              </div>
             </div>
           </div>
 
@@ -468,7 +480,7 @@
             </h4>
             <ul class="space-y-1">
               <li
-                v-for="page in permission.permissions.resources.pages"
+                v-for="page in pages"
                 :key="page.oid"
                 class="text-sm bg-white p-2 rounded border"
               >
@@ -485,7 +497,7 @@
             </h4>
             <ul class="space-y-1">
               <li
-                v-for="pageGroup in permission.permissions.resources.pageGroups"
+                v-for="pageGroup in pageGroups"
                 :key="pageGroup.oid"
                 class="text-sm bg-white p-2 rounded border"
               >
@@ -504,7 +516,7 @@
             </h4>
             <ul class="space-y-1">
               <li
-                v-for="component in permission.permissions.resources.components"
+                v-for="component in components"
                 :key="component.oid"
                 class="text-sm bg-white p-2 rounded border"
               >
@@ -565,6 +577,11 @@ definePageMeta({
 const permission = usePermission();
 const userStore = useUserStore();
 
+// 리소스 데이터를 computed로 선언
+const pageGroups = computed(() => permission.getPageGroups());
+const pages = computed(() => permission.getPages());
+const components = computed(() => permission.getComponents());
+
 // 이 페이지는 /test 경로이므로 페이지 권한이 필요합니다
 // middleware/auth.ts에서 자동으로 권한을 체크합니다
 // 로그인 시 권한 데이터가 자동으로 로드됩니다