fix: 统一端口并完善桌面端授权和安装

frontend/src/AppShell.vue

@@ -11,7 +11,17 @@
       @update:collapsed="handleSidebarCollapsed"
     >
       <div class="brand">
-        <div class="brand-mark">📊</div>
+        <div
+          class="brand-mark"
+          role="button"
+          tabindex="0"
+          title="CapacityReport"
+          @click="handleBrandMarkClick"
+          @keydown.enter.prevent="handleBrandMarkClick"
+          @keydown.space.prevent="handleBrandMarkClick"
+        >
+          📊
+        </div>
         <div class="brand-text">CapacityReport</div>
       </div>
       <n-menu
@@ -25,7 +35,7 @@
       <div class="sider-footer">
         <span class="sider-version">
           <span class="sider-version-label">版本：</span>
-          <span class="sider-version-number">v2.0.3</span>
+          <span class="sider-version-number">v3.0.0</span>
         </span>
         <span class="sider-powered">Power by：NIXEVOL</span>
       </div>
@@ -88,15 +98,6 @@
           <button class="theme-toggle" type="button" :title="themeToggleTitle" @click="toggleTheme">
             <n-icon><component :is="themeToggleIcon" /></n-icon>
           </button>
-          <button
-            class="restart-btn"
-            type="button"
-            title="重启服务"
-            :disabled="restarting"
-            @click="restartService"
-          >
-            <n-icon><PowerOutline /></n-icon>
-          </button>
           <n-button tertiary circle title="退出登录" class="logout-button" @click="logout">
             <template #icon>
               <n-icon><LogOutOutline /></n-icon>
@@ -111,18 +112,37 @@
     </n-layout>
   </n-layout>
 
-  <div v-if="restarting" class="restart-overlay" role="status" aria-live="assertive">
-    <div class="restart-overlay-content">
-      <div class="restart-overlay-spinner"></div>
-      <div class="restart-overlay-text">{{ restartOverlayText }}</div>
+  <n-modal
+    v-model:show="licenseModalVisible"
+    preset="card"
+    title="授权延期"
+    :mask-closable="!activationLoading"
+    :style="{ width: '420px', maxWidth: 'calc(100vw - 32px)' }"
+  >
+    <div class="license-dialog-body">
+      <p class="license-dialog-text">{{ licenseMessage }}</p>
+      <div class="license-key-label">key: {{ activationKeyLabel }}</div>
+      <n-input
+        v-model:value="activationCode"
+        type="textarea"
+        :autosize="{ minRows: 3, maxRows: 5 }"
+        placeholder="请输入激活码"
+        :disabled="activationLoading"
+      />
     </div>
-  </div>
+    <template #footer>
+      <div class="license-dialog-footer">
+        <n-button :disabled="activationLoading" @click="licenseModalVisible = false">取消</n-button>
+        <n-button type="primary" :loading="activationLoading" @click="submitActivation">激活</n-button>
+      </div>
+    </template>
+  </n-modal>
 </template>
 
 <script setup lang="ts">
 import { computed, h, onBeforeUnmount, onMounted, ref, watch, type Component } from 'vue';
 import { RouterView, useRoute, useRouter } from 'vue-router';
-import { useDialog, useMessage, type DropdownOption, type MenuOption, NIcon } from 'naive-ui';
+import { useMessage, type DropdownOption, type MenuOption, NIcon } from 'naive-ui';
 import {
   ChevronDownOutline,
   CloudUploadOutline,
@@ -130,30 +150,32 @@ import {
   FileTrayFullOutline,
   LogOutOutline,
   MoonOutline,
-  PowerOutline,
   ServerOutline,
   SettingsOutline,
   SunnyOutline
 } from '@vicons/ionicons5';
 
 import { apiGet, apiPost, clearToken, getToken, setToken, setUnauthorizedHandler } from './api/client';
-import type { ApiMessage, LoginResponse, ServiceStatus } from './types';
+import type { LicenseStatus, LoginResponse } from './types';
 import LoginView from './components/LoginView.vue';
 import { pageHeader, resetPageHeader, resolveHeaderValue, type PageHeaderAction } from './composables/pageHeader';
 import { themeName, toggleAppTheme } from './composables/theme';
 
 const message = useMessage();
-const dialog = useDialog();
 const route = useRoute();
 const router = useRouter();
 const token = ref(getToken());
 const loginLoading = ref(false);
-const restarting = ref(false);
-const restartOverlayText = ref('正在重启服务...');
 const sidebarCollapsed = ref(localStorage.getItem('sidebarCollapsed') === 'true');
+const licenseModalVisible = ref(false);
+const activationCode = ref('');
+const activationLoading = ref(false);
+const activationKeyLabel = ref('2026/06/20');
+const licenseMessage = ref('输入激活码可将授权到期日期延长 30 天。');
+const brandClickCount = ref(0);
 const menuKeys = ['workflow', 'history', 'database', 'script', 'settings'] as const;
 type MenuKey = (typeof menuKeys)[number];
-let restartPollTimer: number | undefined;
+let brandClickResetTimer: number | undefined;
 
 const menuOptions: MenuOption[] = [
   { label: '数据上传', key: 'workflow', icon: renderIcon(CloudUploadOutline) },
@@ -182,8 +204,8 @@ onMounted(() => {
 onBeforeUnmount(() => {
   window.removeEventListener('dragover', preventWindowFileDrop, { capture: true });
   window.removeEventListener('drop', preventWindowFileDrop, { capture: true });
-  if (restartPollTimer !== undefined) {
-    window.clearTimeout(restartPollTimer);
+  if (brandClickResetTimer !== undefined) {
+    window.clearTimeout(brandClickResetTimer);
   }
 });
 
@@ -224,66 +246,6 @@ function toggleTheme() {
   toggleAppTheme();
 }
 
-async function restartService() {
-  if (restarting.value) return;
-
-  dialog.warning({
-    title: '重启服务',
-    content: '确定要重启服务吗？这将中断当前所有操作。',
-    positiveText: '重启',
-    negativeText: '取消',
-    onPositiveClick: () => {
-      void executeRestartService();
-    }
-  });
-}
-
-async function executeRestartService() {
-  restarting.value = true;
-  restartOverlayText.value = '正在重启服务...';
-
-  try {
-    const result = await apiPost<ApiMessage>('/api/service/restart');
-    restartOverlayText.value = result.message || '正在等待服务恢复...';
-  } catch {
-    restartOverlayText.value = '正在等待服务恢复...';
-  }
-
-  pollServiceStatus();
-}
-
-function pollServiceStatus() {
-  let attempts = 0;
-  const maxAttempts = 60;
-  const pollInterval = 5000;
-
-  const checkService = async () => {
-    attempts += 1;
-
-    try {
-      await apiGet<ServiceStatus>('/api/service/status');
-      restartOverlayText.value = '服务已恢复，正在刷新页面...';
-      restartPollTimer = window.setTimeout(() => {
-        window.location.reload();
-      }, 500);
-      return;
-    } catch {
-      restartOverlayText.value = `正在等待服务恢复... (${attempts}/${maxAttempts})`;
-    }
-
-    if (attempts < maxAttempts) {
-      restartPollTimer = window.setTimeout(checkService, pollInterval);
-      return;
-    }
-
-    restarting.value = false;
-    restartOverlayText.value = '正在重启服务...';
-    message.warning('服务重启超时，请手动刷新页面');
-  };
-
-  restartPollTimer = window.setTimeout(checkService, 3000);
-}
-
 function handleMenuChange(key: string | number) {
   if (!isMenuKey(key) || key === activeMenu.value) {
     return;
@@ -291,6 +253,56 @@ function handleMenuChange(key: string | number) {
   void router.push({ name: key });
 }
 
+function handleBrandMarkClick() {
+  brandClickCount.value += 1;
+  if (brandClickResetTimer !== undefined) {
+    window.clearTimeout(brandClickResetTimer);
+  }
+
+  if (brandClickCount.value >= 8) {
+    brandClickCount.value = 0;
+    void openLicenseModal();
+    return;
+  }
+
+  brandClickResetTimer = window.setTimeout(() => {
+    brandClickCount.value = 0;
+  }, 2000);
+}
+
+async function openLicenseModal() {
+  try {
+    const status = await apiGet<LicenseStatus>('/api/license/status');
+    activationKeyLabel.value = status.key_label;
+    licenseMessage.value = `当前授权到期日期：${status.expires_on}。输入激活码可延长 30 天。`;
+    activationCode.value = '';
+    licenseModalVisible.value = true;
+  } catch (error) {
+    message.error(error instanceof Error ? error.message : '获取授权状态失败');
+  }
+}
+
+async function submitActivation() {
+  const code = activationCode.value.trim();
+  if (!code) {
+    message.warning('请输入激活码');
+    return;
+  }
+
+  activationLoading.value = true;
+  try {
+    const result = await apiPost<LicenseStatus>('/api/license/activate', { code });
+    activationKeyLabel.value = result.key_label;
+    licenseMessage.value = `当前授权到期日期：${result.expires_on}。输入激活码可继续延长 30 天。`;
+    activationCode.value = '';
+    message.success(`激活成功，到期日期: ${result.expires_on}`);
+  } catch (error) {
+    message.error(error instanceof Error ? error.message : '激活失败');
+  } finally {
+    activationLoading.value = false;
+  }
+}
+
 function isMenuKey(value: unknown): value is MenuKey {
   return typeof value === 'string' && menuKeys.includes(value as MenuKey);
 }

frontend/src/api/client.ts

@@ -1,7 +1,7 @@
 import type { ApiError, ApiErrorDetail } from '../types';
 
 const TOKEN_KEY = 'capacity_report_token';
-const DESKTOP_API_BASE = 'http://127.0.0.1:19082';
+const DESKTOP_API_BASE = 'http://127.0.0.1:9081';
 const API_BASE = resolveApiBase();
 const API_FETCH_RETRIES = 8;
 const API_FETCH_RETRY_DELAY_MS = 500;

frontend/src/main.ts

@@ -5,4 +5,21 @@ import App from './App.vue';
 import { router } from './router';
 import './styles.css';
 
+if (isTauriRuntime()) {
+  window.addEventListener('contextmenu', event => event.preventDefault());
+  window.addEventListener('keydown', event => {
+    if (event.key === 'F12' || (event.ctrlKey && event.shiftKey && event.key.toLowerCase() === 'i')) {
+      event.preventDefault();
+    }
+  });
+}
+
 createApp(App).use(router).use(naive).mount('#app');
+
+function isTauriRuntime(): boolean {
+  const win = window as Window & {
+    __TAURI__?: unknown;
+    __TAURI_INTERNALS__?: unknown;
+  };
+  return Boolean(win.__TAURI__ || win.__TAURI_INTERNALS__ || navigator.userAgent.includes('Tauri'));
+}

frontend/src/styles.css

@@ -182,6 +182,8 @@ select {
   font-size: 18px;
   background: linear-gradient(135deg, var(--td-brand-color), #618dff);
   border-radius: var(--td-radius-default);
+  cursor: default;
+  user-select: none;
 }
 
 .brand-text {
@@ -352,8 +354,7 @@ select {
   font-size: 13px;
 }
 
-.theme-toggle,
-.restart-btn {
+.theme-toggle {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -376,80 +377,12 @@ select {
   border-color: var(--td-text-color-secondary);
 }
 
-.restart-btn {
-  color: var(--td-error-color);
-  border-color: var(--td-error-color);
-}
-
-.restart-btn:hover {
-  color: var(--td-error-color);
-  background: var(--td-error-color-light);
-}
-
-.restart-btn:disabled {
-  cursor: wait;
-  opacity: 0.7;
-}
-
-.theme-toggle svg,
-.restart-btn svg {
+.theme-toggle svg {
   display: block;
   width: 16px;
   height: 16px;
 }
 
-.restart-overlay {
-  position: fixed;
-  inset: 0;
-  z-index: 5000;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--td-mask-color);
-  backdrop-filter: blur(4px);
-}
-
-.restart-overlay-content {
-  display: flex;
-  min-width: 260px;
-  align-items: center;
-  flex-direction: column;
-  gap: 18px;
-  padding: 32px 44px;
-  color: var(--td-text-color-primary);
-  background: var(--td-bg-color-container);
-  border: 1px solid var(--td-border-color-light);
-  border-radius: var(--td-radius-large);
-  box-shadow: var(--td-shadow-3);
-}
-
-.restart-overlay-spinner {
-  width: 44px;
-  height: 44px;
-  border: 4px solid var(--td-border-color-light);
-  border-top-color: var(--td-brand-color);
-  border-radius: 50%;
-  animation: spinner-rotate 1s linear infinite;
-}
-
-.restart-overlay-text {
-  color: var(--td-text-color-primary);
-  font-size: 15px;
-  font-weight: 500;
-  line-height: 22px;
-  text-align: center;
-}
-
-@keyframes spinner-rotate {
-  from {
-    transform: rotate(0deg);
-  }
-
-  to {
-    transform: rotate(360deg);
-  }
-}
-
 .logout-button {
   flex-shrink: 0;
 }

frontend/src/types.ts

@@ -139,16 +139,6 @@ export interface DatabaseInfo {
   error?: string;
 }
 
-export interface ServiceStatus {
-  status: string;
-  version: string;
-  platform: string;
-  supervisor: boolean;
-  container: boolean;
-  pid: number;
-  python_version: string;
-}
-
 export interface ApiMessage {
   success: boolean;
   message?: string;