feat(account): 통계 AI 코멘트 카드에 절약 가이드 섹션 추가

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/views/account/AccountDashboardView.vue

@@ -24,7 +24,8 @@ const catType = ref('EXPENSE') // 분류별 파이차트 구분
 const catData = ref([]) // [{category, total}]
 const categoryList = ref([]) // 분류 목록(대/소분류 매핑용)
 const trendData = ref([]) // [{month, netWorth}]
-const aiBullets = ref([]) // AI 재무 코멘트 문장들
+const aiBullets = ref([]) // AI 재무 코멘트(현황 관찰)
+const aiTips = ref([]) // AI 절약 가이드(실행 제안)
 const aiLoading = ref(false)
 
 const periodLabel = computed(() => `${year.value}년 ${String(month.value).padStart(2, '0')}월`)
@@ -278,6 +279,7 @@ async function load() {
 async function loadAiComment() {
   aiLoading.value = true
   aiBullets.value = []
+  aiTips.value = []
   try {
     const res = await accountApi.aiComment({
       year: year.value,
@@ -290,8 +292,10 @@ async function loadAiComment() {
       categories: (catData.value || []).slice(0, 8).map((c) => ({ category: c.category, total: c.total })),
     })
     aiBullets.value = res?.bullets || []
+    aiTips.value = res?.tips || []
   } catch {
     aiBullets.value = []
+    aiTips.value = []
   } finally {
     aiLoading.value = false
   }
@@ -361,13 +365,21 @@ onMounted(async () => {
     <p v-if="loading" class="msg">불러오는 중...</p>
 
     <template v-else>
-      <!-- AI 재무 코멘트: 이번 달 집계 해석 -->
+      <!-- AI 재무 코멘트 + 절약 가이드: 이번 달 집계 해석 -->
-      <div v-if="aiLoading || aiBullets.length" class="ai-comment">
+      <div v-if="aiLoading || aiBullets.length || aiTips.length" class="ai-comment">
         <div class="ai-comment-head">✨ 이번 달 AI 코멘트</div>
         <p v-if="aiLoading" class="ai-comment-loading">집계를 분석하고 있어요…</p>
-        <ul v-else class="ai-comment-list">
+        <template v-else>
-          <li v-for="(b, i) in aiBullets" :key="i">{{ b }}</li>
+          <ul v-if="aiBullets.length" class="ai-comment-list">
-        </ul>
+            <li v-for="(b, i) in aiBullets" :key="i">{{ b }}</li>
+          </ul>
+          <div v-if="aiTips.length" class="ai-tips">
+            <div class="ai-tips-head">💡 절약 가이드</div>
+            <ul class="ai-comment-list">
+              <li v-for="(t, i) in aiTips" :key="i">{{ t }}</li>
+            </ul>
+          </div>
+        </template>
       </div>
 
       <!-- 상단: 예산 대비 지출(도넛) + 수입 대비 지출 -->
@@ -616,6 +628,17 @@ h2 {
   font-size: 0.9rem;
   line-height: 1.45;
 }
+.ai-tips {
+  margin-top: 0.7rem;
+  padding-top: 0.7rem;
+  border-top: 1px dashed hsla(160, 100%, 37%, 0.35);
+}
+.ai-tips-head {
+  font-weight: 700;
+  font-size: 0.88rem;
+  color: #b8860b;
+  margin-bottom: 0.4rem;
+}
 .panel-head {
   display: flex;
   align-items: center;