feat: 웹 안내 페이지에 PC 버전(Windows) 다운로드 링크 추가

- WebOnlyNotice: PC 버전 다운로드 버튼(/download/SlimBudget-Setup.exe) + 모바일(준비 중)
- nginx: /download/ 위치 추가 — 배포(dist 교체)에 안 지워지는 /var/www/sb-downloads 에서 서빙
- 설치파일 이름 고정(SlimBudget-Setup.exe)

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

deploy/nginx-sb-front.conf

@@ -24,6 +24,15 @@ server {
         add_header Cache-Control "public, immutable";
     }
 
+    # 설치파일 다운로드 — 배포(dist 교체)에 지워지지 않도록 root 밖의 영속 디렉터리에서 서빙.
+    #   서버에 /var/www/sb-downloads/ 를 만들고 설치파일(SlimBudget-Setup.exe)을 올려두세요.
+    #   예) sudo mkdir -p /var/www/sb-downloads && sudo cp SlimBudget-Setup.exe /var/www/sb-downloads/
+    location /download/ {
+        alias /var/www/sb-downloads/;
+        add_header Content-Disposition "attachment";
+        autoindex off;
+    }
+
     # API 프록시 → 백엔드(8080)
     location /api/ {
         proxy_pass http://127.0.0.1:8080;

package.json

@@ -30,7 +30,8 @@
     ],
     "win": {
       "target": "nsis",
-      "icon": "assets/icon-only.png"
+      "icon": "assets/icon-only.png",
+      "artifactName": "SlimBudget-Setup.${ext}"
     },
     "nsis": {
       "oneClick": false,

src/components/WebOnlyNotice.vue

@@ -1,10 +1,9 @@
 <script setup>
-// PC·모바일 웹에서 노출되는 안내 페이지. 실제 이용은 앱(Capacitor)에서만.
+// PC·모바일 웹에서 노출되는 안내 페이지. 실제 이용은 앱(모바일) 또는 PC 데스크톱 클라이언트에서.
-// 앱 다운로드 링크는 준비되면 download() / href 에 연결.
+// PC 설치파일은 서버 /download/ 경로(영속 디렉터리)에서 서빙 — nginx 설정 참고.
-const downloadReady = false
+const PC_DOWNLOAD_URL = '/download/SlimBudget-Setup.exe'
-function download() {
+// 모바일 앱(APK/스토어) 링크는 준비되면 연결
-  // TODO: 앱 다운로드 링크 연결 (Play 스토어 / 직접 APK URL)
+const mobileReady = false
-}
 </script>
 
 <template>
@@ -14,13 +13,18 @@ function download() {
       <p class="tagline">슬림하게 관리하는 가계부 · 자산 · 예산</p>
 
       <div class="notice">
-        <p class="lead">📱 이 서비스는 <b>앱에서</b> 이용할 수 있어요.</p>
+        <p class="lead">🖥️ PC는 <b>설치형 앱</b>으로, 📱 모바일은 <b>앱</b>으로 이용해요.</p>
-        <p class="sub">PC·모바일 웹에서는 안내만 제공됩니다. 앱을 설치한 뒤 로그인해 주세요.</p>
+        <p class="sub">웹 브라우저에서는 안내만 제공됩니다. 설치한 뒤 로그인해 주세요.</p>
       </div>
 
-      <button type="button" class="dl-btn" :disabled="!downloadReady" @click="download">
+      <div class="dl-group">
-        {{ downloadReady ? '앱 다운로드' : '앱 다운로드 (준비 중)' }}
+        <a class="dl-btn" :href="PC_DOWNLOAD_URL" download>
+          🖥️ PC 버전 다운로드 (Windows)
+        </a>
+        <button type="button" class="dl-btn ghost" :disabled="!mobileReady">
+          {{ mobileReady ? '📱 모바일 앱 다운로드' : '📱 모바일 앱 (준비 중)' }}
         </button>
+      </div>
 
       <ul class="features">
         <li><span class="f-icon">📒</span><b>간편한 가계부</b><span>수입·지출을 빠르게 기록</span></li>
@@ -72,7 +76,13 @@ function download() {
   font-size: 0.86rem;
   opacity: 0.7;
 }
+.dl-group {
+  display: flex;
+  flex-direction: column;
+  gap: 0.6rem;
+}
 .dl-btn {
+  display: block;
   width: 100%;
   padding: 0.8rem 1rem;
   border: 1px solid hsla(160, 100%, 37%, 1);
@@ -81,7 +91,17 @@ function download() {
   color: #fff;
   font-size: 1rem;
   font-weight: 600;
+  text-align: center;
+  text-decoration: none;
   cursor: pointer;
+  box-sizing: border-box;
+}
+.dl-btn:hover {
+  background: hsla(160, 100%, 32%, 1);
+}
+.dl-btn.ghost {
+  background: transparent;
+  color: hsla(160, 100%, 37%, 1);
 }
 .dl-btn:disabled {
   opacity: 0.55;