feat: 添加连接备注功能

packages/backend/src/database/migrations.ts

@@ -107,6 +107,20 @@ const definedMigrations: Migration[] = [
             );
         `
     }
+,
+{
+        id: 4,
+        name: 'Add notes column to connections table',
+        check: async (db: Database): Promise<boolean> => {
+            const notesColumnExists = await columnExists(db, 'connections', 'notes');
+            // Only run if the column does NOT exist
+            return !notesColumnExists;
+        },
+        sql: `
+            -- Add the notes column to the connections table, allowing NULL values
+            ALTER TABLE connections ADD COLUMN notes TEXT NULL;
+        `
+    },
     // --- 未来可以添加更多迁移 ---
 ];
 

packages/backend/src/database/schema.ts

@@ -86,6 +86,7 @@ CREATE TABLE IF NOT EXISTS connections (
     encrypted_passphrase TEXT NULL,
     proxy_id INTEGER NULL,
     ssh_key_id INTEGER NULL, -- 新增 ssh_key_id 列
+notes TEXT NULL,
     created_at INTEGER NOT NULL DEFAULT (strftime('%s', 'now')),
     updated_at INTEGER NOT NULL DEFAULT (strftime('%s', 'now')),
     last_connected_at INTEGER NULL,

packages/backend/src/repositories/connection.repository.ts

@@ -17,6 +17,7 @@ interface ConnectionBase {
     updated_at: number;
     last_connected_at: number | null;
     ssh_key_id?: number | null; // +++ Add ssh_key_id here as well +++
+notes?: string | null; // 新增备注字段
 }
 
 // ConnectionWithTagsRow implicitly includes 'type' and 'ssh_key_id' via ConnectionBase
@@ -35,6 +36,7 @@ export interface FullConnectionData extends ConnectionBase {
     encrypted_password?: string | null;
     encrypted_private_key?: string | null;
     encrypted_passphrase?: string | null;
+notes?: string | null; // 新增备注字段
     tag_ids?: number[];
 }
 
@@ -61,7 +63,7 @@ interface FullConnectionDbRow extends FullConnectionData {
 export const findAllConnectionsWithTags = async (): Promise<ConnectionWithTags[]> => {
     const sql = `
         SELECT
-            c.id, c.name, c.type, c.host, c.port, c.username, c.auth_method, c.proxy_id, c.ssh_key_id, -- +++ Select ssh_key_id +++
+            c.id, c.name, c.type, c.host, c.port, c.username, c.auth_method, c.proxy_id, c.ssh_key_id, c.notes, -- +++ Select ssh_key_id and notes +++
             c.created_at, c.updated_at, c.last_connected_at,
             GROUP_CONCAT(ct.tag_id) as tag_ids_str
          FROM connections c
@@ -87,7 +89,7 @@ export const findAllConnectionsWithTags = async (): Promise<ConnectionWithTags[]
 export const findConnectionByIdWithTags = async (id: number): Promise<ConnectionWithTags | null> => {
     const sql = `
         SELECT
-            c.id, c.name, c.type, c.host, c.port, c.username, c.auth_method, c.proxy_id, c.ssh_key_id, -- +++ Select ssh_key_id +++
+            c.id, c.name, c.type, c.host, c.port, c.username, c.auth_method, c.proxy_id, c.ssh_key_id, c.notes, -- +++ Select ssh_key_id and notes +++
             c.created_at, c.updated_at, c.last_connected_at,
             GROUP_CONCAT(ct.tag_id) as tag_ids_str
          FROM connections c
@@ -140,7 +142,7 @@ export const findFullConnectionById = async (id: number): Promise<FullConnection
   * 根据名称查找连接 (用于检查名称是否重复)
   */
  export const findConnectionByName = async (name: string): Promise<ConnectionBase | null> => {
-     const sql = `SELECT id, name, type, host, port, username, auth_method, proxy_id, ssh_key_id, created_at, updated_at, last_connected_at FROM connections WHERE name = ?`;
+     const sql = `SELECT id, name, type, host, port, username, auth_method, proxy_id, ssh_key_id, notes, created_at, updated_at, last_connected_at FROM connections WHERE name = ?`;
      try {
          const db = await getDbInstance();
          const row = await getDbRow<ConnectionBase>(db, sql, [name]);
@@ -154,13 +156,13 @@ export const findFullConnectionById = async (id: number): Promise<FullConnection
  
  /**
   * 创建新连接 (不处理标签)
- */
+  */
 // Update input type to reflect FullConnectionData now has 'type'
 export const createConnection = async (data: Omit<FullConnectionData, 'id' | 'created_at' | 'updated_at' | 'last_connected_at' | 'tag_ids'>): Promise<number> => {
     const now = Math.floor(Date.now() / 1000);
     const sql = `
-        INSERT INTO connections (name, type, host, port, username, auth_method, encrypted_password, encrypted_private_key, encrypted_passphrase, proxy_id, ssh_key_id, created_at, updated_at) -- +++ Add ssh_key_id column +++
+        INSERT INTO connections (name, type, host, port, username, auth_method, encrypted_password, encrypted_private_key, encrypted_passphrase, proxy_id, ssh_key_id, notes, created_at, updated_at) -- +++ Add ssh_key_id and notes columns +++
-          VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`; // +++ Add placeholder for ssh_key_id +++
+          VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`; // +++ Add placeholders for ssh_key_id and notes +++
     const params = [
         data.name ?? null,
         data.type, // Add type parameter
@@ -168,6 +170,7 @@ export const createConnection = async (data: Omit<FullConnectionData, 'id' | 'cr
         data.encrypted_password ?? null, data.encrypted_private_key ?? null, data.encrypted_passphrase ?? null,
         data.proxy_id ?? null,
         data.ssh_key_id ?? null, // +++ Add ssh_key_id parameter +++
+data.notes ?? null, // Add notes parameter
         now, now
     ];
     try {
@@ -345,7 +348,7 @@ export const bulkInsertConnections = async (
     connections: Array<Omit<FullConnectionData, 'id' | 'created_at' | 'updated_at' | 'last_connected_at'> & { tag_ids?: number[] }>
 ): Promise<{ connectionId: number, originalData: any }[]> => {
 
-    const insertConnSql = `INSERT INTO connections (name, type, host, port, username, auth_method, encrypted_password, encrypted_private_key, encrypted_passphrase, proxy_id, created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`; // Add type column and placeholder
+    const insertConnSql = `INSERT INTO connections (name, type, host, port, username, auth_method, encrypted_password, encrypted_private_key, encrypted_passphrase, proxy_id, notes, created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`; // Add type and notes columns and placeholders
     const results: { connectionId: number, originalData: any }[] = [];
     const now = Math.floor(Date.now() / 1000);
 
@@ -356,6 +359,7 @@ export const bulkInsertConnections = async (
             connData.encrypted_private_key || null,
             connData.encrypted_passphrase || null,
             connData.proxy_id || null,
+connData.notes || null, // Add notes parameter
             now, now
         ];
         try {

packages/backend/src/services/connection.service.ts

@@ -130,6 +130,7 @@ export const createConnection = async (input: CreateConnectionInput): Promise<Co
         encrypted_private_key: encryptedPrivateKey, // Null if using ssh_key_id or RDP
         encrypted_passphrase: encryptedPassphrase, // Null if using ssh_key_id or RDP
         ssh_key_id: sshKeyIdToSave, // +++ Add ssh_key_id +++
+notes: input.notes ?? null, // Add notes field
         proxy_id: input.proxy_id ?? null,
     };
     // Remove ssh_key_id property if it's null before logging/saving if repository expects exact type match without optional nulls
@@ -186,6 +187,7 @@ export const updateConnection = async (id: number, input: UpdateConnectionInput)
     if (input.host !== undefined) dataToUpdate.host = input.host;
     if (input.port !== undefined) dataToUpdate.port = input.port;
     if (input.username !== undefined) dataToUpdate.username = input.username;
+if (input.notes !== undefined) dataToUpdate.notes = input.notes; // Add notes update
     if (input.proxy_id !== undefined) dataToUpdate.proxy_id = input.proxy_id;
     // Handle ssh_key_id update (can be set to null or a new ID)
     if (input.ssh_key_id !== undefined) dataToUpdate.ssh_key_id = input.ssh_key_id;

packages/backend/src/types/connection.types.ts

@@ -12,6 +12,7 @@ export interface ConnectionBase {
     created_at: number;
     updated_at: number;
     last_connected_at: number | null;
+notes?: string | null; // 新增备注字段
 }
 
 export interface ConnectionWithTags extends ConnectionBase {
@@ -32,6 +33,7 @@ export interface CreateConnectionInput {
     ssh_key_id?: number | null; // +++ Add ssh_key_id +++
     proxy_id?: number | null;
     tag_ids?: number[];
+notes?: string | null; // 新增备注字段
 }
 
 
@@ -47,6 +49,7 @@ export interface UpdateConnectionInput {
     passphrase?: string;
     ssh_key_id?: number | null; // +++ Add ssh_key_id +++
     proxy_id?: number | null;
+notes?: string | null; // 新增备注字段
     tag_ids?: number[];
 }
 
@@ -65,6 +68,7 @@ export interface FullConnectionData {
     ssh_key_id?: number | null; // +++ Add ssh_key_id +++
     proxy_id: number | null;
     created_at: number;
+notes: string | null; // 新增备注字段 (数据库原始字段)
     updated_at: number;
     last_connected_at: number | null;
 }

packages/frontend/src/components/AddConnectionForm.vue

@@ -42,6 +42,7 @@ const initialFormData = {
   selected_ssh_key_id: null as number | null, // +++ Add field for selected key ID +++
   proxy_id: null as number | null,
   tag_ids: [] as number[], // 新增 tag_ids 字段
+notes: '', // 新增备注字段
   // Add RDP specific fields later if needed, e.g., domain
 };
 const formData = reactive({ ...initialFormData });
@@ -85,6 +86,7 @@ watch(() => props.connectionToEdit, (newVal) => {
         formData.username = newVal.username;
         formData.auth_method = newVal.auth_method;
         formData.proxy_id = newVal.proxy_id ?? null;
+formData.notes = newVal.notes ?? ''; // 填充备注
        formData.tag_ids = newVal.tag_ids ? [...newVal.tag_ids] : []; // 填充 tag_ids (深拷贝)
 
        // +++ 填充 selected_ssh_key_id (如果认证方式是 key) +++
@@ -104,6 +106,7 @@ watch(() => props.connectionToEdit, (newVal) => {
        Object.assign(formData, initialFormData);
        formData.tag_ids = []; // 确保 tag_ids 也被重置为空数组
        formData.selected_ssh_key_id = null; // 确保添加模式下也重置
+formData.notes = ''; // 重置备注
     }
 }, { immediate: true });
 
@@ -202,6 +205,7 @@ const handleSubmit = async () => {
       name: formData.name,
       host: formData.host,
       port: formData.port,
+notes: formData.notes, // 添加备注
       username: formData.username,
       proxy_id: formData.proxy_id || null,
       tag_ids: formData.tag_ids || [], // 发送 tag_ids
@@ -528,6 +532,13 @@ const testButtonText = computed(() => {
              <div v-if="isTagLoading" class="mt-1 text-xs text-text-secondary">{{ t('tags.loading') }}</div>
              <div v-if="tagStoreError" class="mt-1 text-xs text-error">{{ t('tags.error', { error: tagStoreError }) }}</div>
            </div>
+           <!-- Notes Section -->
+           <div>
+             <label for="conn-notes" class="block text-sm font-medium text-text-secondary mb-1">{{ t('connections.form.notes', '备注') }}</label>
+             <textarea id="conn-notes" v-model="formData.notes" rows="3"
+                       class="w-full px-3 py-2 border border-border rounded-md shadow-sm bg-background text-foreground focus:outline-none focus:ring-1 focus:ring-primary focus:border-primary"
+                       :placeholder="t('connections.form.notesPlaceholder', '输入连接备注...')"></textarea>
+           </div>
          </div>
 
         <!-- Error message -->

packages/frontend/src/components/CommandInputBar.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, watch, nextTick, onMounted, onBeforeUnmount, defineExpose, computed } from 'vue';
+import { ref, watch, nextTick, onMounted, onBeforeUnmount, defineExpose, computed, defineOptions } from 'vue'; // Import defineOptions
 import { useI18n } from 'vue-i18n';
 import { storeToRefs } from 'pinia';
 import { useSessionStore } from '../stores/session.store'; // +++ 导入 Session Store +++
@@ -9,6 +9,9 @@ import { useQuickCommandsStore } from '../stores/quickCommands.store';
 import { useCommandHistoryStore } from '../stores/commandHistory.store';
 import QuickCommandsModal from './QuickCommandsModal.vue'; // +++ Import the modal component +++
 
+// Disable attribute inheritance as this component has multiple root nodes (div + modal)
+defineOptions({ inheritAttrs: false });
+
 const emit = defineEmits(['send-command', 'search', 'find-next', 'find-previous', 'close-search', 'clear-terminal']); // 添加 clear-terminal 事件
 const { t } = useI18n();
 const focusSwitcherStore = useFocusSwitcherStore();
@@ -267,7 +270,7 @@ const handleQuickCommandExecute = (command: string) => {
 </script>
 
 <template>
-  <div class="flex items-center px-2 py-1.5 bg-background gap-2">
+  <div :class="$attrs.class" class="flex items-center px-2 py-1.5 bg-background gap-2"> <!-- Bind $attrs.class -->
     <div class="flex-grow flex items-center bg-transparent relative gap-2">
       <!-- Clear Terminal Button -->
       <button

packages/frontend/src/locales/en-US.json

@@ -160,6 +160,8 @@
       "proxy": "Proxy:",
       "noProxy": "No Proxy",
       "tags": "Tags:",
+"notes": "Notes:",
+      "notesPlaceholder": "Enter connection notes...",
 "connectionType": "Connection Type:",
       "typeSsh": "SSH",
       "typeRdp": "RDP",

packages/frontend/src/locales/ja-JP.json

@@ -136,6 +136,8 @@
             "sectionAuth": "認証情報",
             "sectionBasic": "基本情報",
             "tags": "タグ:",
+            "notes": "備考：",
+"notesPlaceholder": "接続に関する備考を入力してください...",
             "testConnection": "接続をテスト",
             "testing": "テスト中...",
             "title": "新しい接続を追加",

packages/frontend/src/locales/zh-CN.json

@@ -160,6 +160,8 @@
       "proxy": "代理:",
       "noProxy": "无代理",
       "tags": "标签:",
+"notes": "备注:",
+      "notesPlaceholder": "输入连接备注...",
 "connectionType": "连接类型",
       "typeSsh": "SSH",
       "typeRdp": "RDP",

packages/frontend/src/stores/connections.store.ts

@@ -16,6 +16,7 @@ export interface ConnectionInfo {
     created_at: number;
     updated_at: number;
     last_connected_at: number | null;
+notes?: string | null; // 新增备注字段
 }
 
 // 定义 Store State 的接口