@yesdgq/claude-buddy 1.1.1017 → 1.1.1019

package/assets/config.html

@@ -79,17 +79,40 @@
                 <li><strong>{{ t.feature5Title }}</strong>：{{ t.feature5Desc }}</li>
               </ul>
 
+              <h3 class="command-title">
+                <i class="fa fa-book"></i>
+                {{ t.installTitle }}
+              </h3>
+              <ul class="install-list">
+                <li
+                  v-for="cmd in installCommands"
+                  :key="cmd.command"
+                  class="command-item"
+                  :title="t.clickToCopy"
+                  @click="copyCommand(cmd.command)"
+                >
+                  <i class="fa fa-chevron-right"></i>
+                  <code class="item-cmd">{{ cmd.command }}</code>
+                  <span class="item-desc">{{ cmd.desc }}</span>
+                </li>
+              </ul>
+
               <h3 class="command-title">
                 <i class="fa fa-book"></i>
                 {{ t.commandUsageTitle }}
               </h3>
               <ul class="command-list">
-                <li><i class="fa fa-chevron-right"></i><code>ccby config</code> {{ t.command1 }}</li>
-                <li><i class="fa fa-chevron-right"></i><code>ccby</code> {{ t.command2 }}</li>
-                <li><i class="fa fa-chevron-right"></i><code>ccby -r</code> {{ t.command3 }}</li>
-                <li><i class="fa fa-chevron-right"></i><code>ccby -c</code> {{ t.command4 }}</li>
-                <li><i class="fa fa-chevron-right"></i><code>ccby --version</code> {{ t.command5 }}</li>
-                <li><i class="fa fa-chevron-right"></i><code>claude --version</code> {{ t.command6 }}</li>
+                <li
+                  v-for="cmd in usageCommands"
+                  :key="cmd.command"
+                  class="command-item"
+                  :title="t.clickToCopy"
+                  @click="copyCommand(cmd.command)"
+                >
+                  <i class="fa fa-chevron-right"></i>
+                  <code class="item-cmd">{{ cmd.command }}</code>
+                  <span class="item-desc">{{ cmd.desc }}</span>
+                </li>
               </ul>
             </div>
 
@@ -124,16 +147,18 @@
 
 
       <!-- AUTH 配置列表 -->
-      <div v-if="!loading">
-        <div v-for="(auth, index) in config.AUTH" :key="index"
-             :class="['auth-card', { 'auth-card-current': index === config.activeIndex, 'auth-card-dragging': draggingIndex === index, 'auth-card-drag-over': dragOverIndex === index }]"
-             @dragover="handleDragOver(index, $event)"
-             @dragleave="handleDragLeave($event)"
-             @drop="handleDrop(index, $event)">
-          <div class="drag-handle"
-               draggable="true"
-               @dragstart="handleDragStart(index, $event)"
-               @dragend="handleDragEnd($event)">
+      <div v-if="!loading" :class="{ 'auth-list-ready': authListReady }">
+        <div v-for="(auth, index) in config.AUTH" :key="authKeys[index] || index"
+             :class="['auth-card', getDragShiftClass(index), { 'auth-card-current': index === config.activeIndex, 'auth-card-dragging': draggingIndex === index, 'auth-card-drag-over': dragOverIndex === index }]"
+             :style="getDragShiftStyle(index)"
+             @dragover="handleDragOver(index, $event)"
+             @dragleave="handleDragLeave($event)"
+             @drop="handleDrop(index, $event)">
+          <div class="drag-handle"
+               draggable="true"
+               @dragstart="handleDragStart(index, $event)"
+               @drag="handleDrag($event)"
+               @dragend="handleDragEnd($event)">
             <i class="fa fa-ellipsis-v"></i>
           </div>
           <div class="auth-header">
@@ -217,11 +242,29 @@
                   </button>
                 </div>
               </div>
-            </div>
-
-            <!-- 模型管理 -->
-            <div class="models-section" :class="{ 'is-expanded': showModelSections[index] }">
-              <div class="models-header">
+            </div>
+
+            <div v-if="currentCli === 'Codex'" class="codex-default-model">
+              <div class="default-model-header">
+                <label>
+                  <i class="fa fa-terminal"></i>
+                  {{ t.defaultModelTitle }}
+                </label>
+                <span class="default-model-chip">Codex</span>
+              </div>
+              <div class="default-model-input-wrap">
+                <i class="fa fa-magic"></i>
+                <input
+                  v-model="auth.DEFAULT_MODEL"
+                  type="text"
+                  :placeholder="t.defaultModelPlaceholder"
+                >
+              </div>
+            </div>
+
+            <!-- 模型管理 -->
+            <div v-if="currentCli !== 'Codex'" class="models-section" :class="{ 'is-expanded': showModelSections[index] }">
+              <div class="models-header">
                 <label>
                   <i class="fa fa-cogs"></i>
                   {{ t.modelManagement }}
@@ -267,7 +310,7 @@
             </div>
 
             <!-- 环境变量配置 -->
-            <div class="env-section" :class="{ 'is-expanded': showEnvSections[index] }">
+            <div v-if="currentCli !== 'Codex'" class="env-section" :class="{ 'is-expanded': showEnvSections[index] }">
               <div class="env-header">
                 <label>
                   <i class="fa fa-cogs"></i>
@@ -315,17 +358,8 @@
           </div>
         </div>
 
-        <!-- 添加新配置按钮 -->
-        <button
-          @click="addAuth"
-          class="btn btn-primary"
-        >
-          <i class="fa fa-plus-circle"></i>
-          {{ t.addNewConfig }}
-        </button>
-
-        <!-- 保存按钮 -->
-        <div class="btn-group">
+        <!-- 保存按钮 -->
+        <div class="btn-group">
           <button
             @click="saveConfig"
             :disabled="saving"
@@ -346,11 +380,20 @@
       </div>
     </div>
 
-    <!-- Toast 容器 -->
-    <div id="toast-container"></div>
-
-    <!-- 右下角悬浮保存按钮 -->
-    <button
+    <!-- Toast 容器 -->
+    <div id="toast-container"></div>
+
+    <!-- 右下角悬浮添加配置按钮 -->
+    <button
+      @click="addAuth"
+      class="fab-add"
+      :title="t.addNewConfig"
+    >
+      <i class="fa fa-plus"></i>
+    </button>
+
+    <!-- 右下角悬浮保存按钮 -->
+    <button
       @click="saveConfig"
       :disabled="saving"
       class="fab-save"

package/assets/config.js

@@ -11,6 +11,8 @@ createApp({
       showTokens: [],
       showEnvSections: [],
       showModelSections: [],
+      authKeys: [],
+      authListReady: false,
       configPath: '',
       showHelp: false,
       currentCli: 'Claude',
@@ -25,9 +27,32 @@ createApp({
         { name: 'Codex', label: 'Codex', icon: 'images/gpt.png' },
         { name: 'Gemini', label: 'Gemini', icon: 'images/gemini.png' }
       ],
+      // 安装命令列表
+      installCommands: [
+        { command: 'npm install -g @yesdgq/claude-buddy -f', desc: '安装包（强制覆盖）' },
+        { command: 'npm update -g @yesdgq/claude-buddy', desc: '更新包，同步更新 claude code' },
+        { command: 'npm install -g @yesdgq/claude-buddy@latest', desc: '更新包到最新版，同步更新 claude code' },
+        { command: 'npm uninstall -g @yesdgq/claude-buddy', desc: '删除包' }
+      ],
+      // 命令使用列表
+      usageCommands: [
+        { command: 'ccby config', desc: '打开配置页面，配置您的 API 地址和访问令牌(TOKEN)' },
+        { command: 'ccby', desc: '启动claude code' },
+        { command: 'ccby -r', desc: '查看历史会话' },
+        { command: 'ccby -c', desc: '继续上次会话' },
+        { command: 'ccby --version', desc: '查看Claude-Buddy版本' },
+        { command: 'claude --version', desc: '查看Claude版本' }
+      ],
       // 拖拽相关状态
       draggingIndex: null,
       dragOverIndex: null,
+      dropTargetIndex: null,
+      draggedCardHeight: 0,
+      draggedCardVisualHeight: 0,
+      dragCardRects: [],
+      dragStartY: 0,
+      dragCurrentY: 0,
+      isDropping: false,
       // 版本更新信息
       updateInfo: {
         hasUpdate: false,
@@ -57,6 +82,7 @@ createApp({
           feature4Desc: 'Visual interface, configure in seconds',
           feature5Title: 'Developer First',
           feature5Desc: 'Built for developers who love efficiency',
+          installTitle: 'ccby Update/Install',
           commandUsageTitle: 'Command Usage',
           command1: 'Open the configuration page to set your API URL and access token',
           command2: 'Launch Claude Code',
@@ -73,6 +99,8 @@ createApp({
           deleteThisConfig: 'Delete this configuration',
           emptyConfigCannotDelete: 'Empty configuration cannot be deleted',
           modelManagement: 'Model Management',
+          defaultModelTitle: 'Default Model',
+          defaultModelPlaceholder: 'Enter default GPT model',
           collapse: 'Collapse',
           expand: 'Expand',
           modelNamePlaceholder: 'Model name',
@@ -108,9 +136,10 @@ createApp({
           baseUrlPlaceholder: 'https://api.example.com',
           tokenPlaceholder: 'Enter your API token',
           updateAvailable: 'New version available:',
-          clickToCopy: 'Click to copy update command',
+          clickToCopy: 'Click to copy command',
           dismiss: 'Dismiss',
-          updateCmdCopied: 'Update command copied!'
+          updateCmdCopied: 'Update command copied!',
+          cmdCopied: 'Command copied!'
         },
         zh: {
           helpTitle: '使用说明',
@@ -125,6 +154,7 @@ createApp({
           feature4Desc: '可视化界面，几秒完成设置',
           feature5Title: '开发者友好',
           feature5Desc: '专为追求效率的开发者打造',
+          installTitle: 'ccby更新/安装',
           commandUsageTitle: '命令使用',
           command1: '打开配置页面，配置您的 API 地址和访问令牌(TOKEN)',
           command2: '启动claude code',
@@ -141,6 +171,8 @@ createApp({
           deleteThisConfig: '删除此配置',
           emptyConfigCannotDelete: '空配置不能删除',
           modelManagement: '模型管理',
+          defaultModelTitle: '默认模型',
+          defaultModelPlaceholder: '输入默认gpt模型',
           collapse: '收起',
           expand: '展开',
           modelNamePlaceholder: '模型名称',
@@ -176,9 +208,10 @@ createApp({
           baseUrlPlaceholder: 'https://api.example.com',
           tokenPlaceholder: '输入您的 API 令牌',
           updateAvailable: '新版本可用：',
-          clickToCopy: '点击复制更新命令',
+          clickToCopy: '点击复制命令',
           dismiss: '关闭',
-          updateCmdCopied: '更新命令已复制！'
+          updateCmdCopied: '更新命令已复制！',
+          cmdCopied: '命令已复制！'
         }
       }
     };
@@ -300,6 +333,28 @@ createApp({
       });
     },
 
+    // 通用复制命令方法
+    copyCommand(cmd) {
+      navigator.clipboard.writeText(cmd).then(() => {
+        this.showToast(this.t.cmdCopied);
+      }).catch(() => {
+        // fallback: 创建临时textarea并选中文本
+        const textarea = document.createElement('textarea');
+        textarea.value = cmd;
+        textarea.style.position = 'fixed';
+        textarea.style.opacity = '0';
+        document.body.appendChild(textarea);
+        textarea.select();
+        try {
+          document.execCommand('copy');
+          this.showToast(this.t.cmdCopied);
+        } catch (err) {
+          this.showToast('Copy failed', 'error');
+        }
+        document.body.removeChild(textarea);
+      });
+    },
+
     // 重置服务器倒计时
     async resetTimer() {
       try {
@@ -388,6 +443,7 @@ createApp({
         cliType = this.currentCli.toLowerCase();
       }
       this.loading = true;
+      this.authListReady = false;
       this.error = null;
       try {
         const response = await axios.get('/api/config', {
@@ -416,6 +472,7 @@ createApp({
             name: '',
             BASE_URL: '',
             TOKEN: '',
+            DEFAULT_MODEL: '',
             MODELS: [],
             ENV: []
           }];
@@ -430,12 +487,16 @@ createApp({
           if (!auth.MODELS) {
             auth.MODELS = [];
           }
+          if (cliType === 'codex' && typeof auth.DEFAULT_MODEL !== 'string') {
+            auth.DEFAULT_MODEL = '';
+          }
         });
 
         // 先设置辅助数组，再设置 config，确保 Vue 响应式正确更新
         this.showTokens = new Array(config.AUTH.length).fill(false);
         this.showEnvSections = new Array(config.AUTH.length).fill(false);
         this.showModelSections = new Array(config.AUTH.length).fill(false);
+        this.authKeys = config.AUTH.map(() => this.createAuthKey());
 
         // 最后更新 config
         this.config = config;
@@ -447,6 +508,11 @@ createApp({
         this.showToast(this.t.configLoadFailed + ': ' + (err.response?.data?.error || err.message), 'error');
       } finally {
         this.loading = false;
+        this.$nextTick(() => {
+          requestAnimationFrame(() => {
+            this.authListReady = true;
+          });
+        });
       }
     },
 
@@ -455,6 +521,7 @@ createApp({
       this.error = null;
       this.successMessage = null;
       try {
+        this.normalizeCodexDefaults();
         // 创建配置副本,过滤掉空配置项
         const configToSave = {
           ...this.config,
@@ -483,17 +550,28 @@ createApp({
       }
     },
 
+    normalizeCodexDefaults() {
+      if (this.currentCli !== 'Codex') {
+        return;
+      }
+      this.config.AUTH.forEach(auth => {
+        auth.DEFAULT_MODEL = (auth.DEFAULT_MODEL || '').trim();
+      });
+    },
+
     addAuth() {
       this.config.AUTH.push({
         name: '',
         BASE_URL: '',
         TOKEN: '',
+        DEFAULT_MODEL: '',
         MODELS: [],
         ENV: []
       });
       this.showTokens.push(false);
       this.showEnvSections.push(false);
       this.showModelSections.push(false);
+      this.authKeys.push(this.createAuthKey());
       // 重置服务器倒计时
       this.resetTimer();
     },
@@ -517,6 +595,7 @@ createApp({
         const deletedTokenState = this.showTokens[index];
         const deletedEnvState = this.showEnvSections[index];
         const deletedModelState = this.showModelSections[index];
+        const deletedAuthKey = this.authKeys[index];
         const oldActiveIndex = this.config.activeIndex;
 
         // 从列表中删除
@@ -524,6 +603,7 @@ createApp({
         this.showTokens.splice(index, 1);
         this.showEnvSections.splice(index, 1);
         this.showModelSections.splice(index, 1);
+        this.authKeys.splice(index, 1);
 
         // 调整 activeIndex：如果删除的是当前使用的配置，或者删除的配置在当前使用配置之前
         if (index === this.config.activeIndex) {
@@ -541,17 +621,20 @@ createApp({
             name: '',
             BASE_URL: '',
             TOKEN: '',
+            DEFAULT_MODEL: '',
             MODELS: [],
             ENV: []
           });
           this.showTokens.push(false);
           this.showEnvSections.push(false);
           this.showModelSections.push(false);
+          this.authKeys.push(this.createAuthKey());
           this.config.activeIndex = 0;
         }
 
         // 立即保存配置,过滤掉空配置项（但保留至少一个配置）
         try {
+          this.normalizeCodexDefaults();
           const filteredAuth = this.config.AUTH.filter(auth => !this.isEmptyConfig(auth));
           const configToSave = {
             ...this.config,
@@ -572,6 +655,7 @@ createApp({
           this.showTokens.splice(index, 0, deletedTokenState);
           this.showEnvSections.splice(index, 0, deletedEnvState);
           this.showModelSections.splice(index, 0, deletedModelState);
+          this.authKeys.splice(index, 0, deletedAuthKey);
           this.config.activeIndex = oldActiveIndex;
         }
       });
@@ -588,6 +672,7 @@ createApp({
 
       // 立即保存配置
       try {
+        this.normalizeCodexDefaults();
         const configToSave = {
           ...this.config,
           AUTH: this.config.AUTH.filter(auth => !this.isEmptyConfig(auth))
@@ -650,7 +735,12 @@ createApp({
 
     // 判断是否为空配置
     isEmptyConfig(auth) {
-      return !auth.name && !auth.BASE_URL && !auth.TOKEN && (!auth.ENV || auth.ENV.length === 0) && (!auth.MODELS || auth.MODELS.length === 0);
+      const hasDefaultModel = this.currentCli === 'Codex' && auth.DEFAULT_MODEL && auth.DEFAULT_MODEL.trim();
+      return !auth.name && !auth.BASE_URL && !auth.TOKEN && !hasDefaultModel && (!auth.ENV || auth.ENV.length === 0) && (!auth.MODELS || auth.MODELS.length === 0);
+    },
+
+    createAuthKey() {
+      return `auth-${Date.now()}-${Math.random().toString(36).slice(2)}`;
     },
 
     // 切换使用说明显示/隐藏
@@ -658,6 +748,41 @@ createApp({
       this.showHelp = !this.showHelp;
     },
 
+    getDragShiftClass(index) {
+      if (this.draggingIndex === null || this.dropTargetIndex === null || this.isDropping || index === this.draggingIndex) {
+        return '';
+      }
+
+      if (this.draggingIndex < this.dropTargetIndex && index > this.draggingIndex && index <= this.dropTargetIndex) {
+        return 'auth-card-shift-up';
+      }
+
+      if (this.draggingIndex > this.dropTargetIndex && index >= this.dropTargetIndex && index < this.draggingIndex) {
+        return 'auth-card-shift-down';
+      }
+
+      return '';
+    },
+
+    getDragShiftStyle(index) {
+      if (index === this.draggingIndex) {
+        const offset = this.dragCurrentY - this.dragStartY;
+        return {
+          '--drag-follow-offset': `${offset}px`
+        };
+      }
+
+      const shiftClass = this.getDragShiftClass(index);
+      if (!shiftClass || !this.draggedCardHeight) {
+        return {};
+      }
+
+      const offset = shiftClass === 'auth-card-shift-up' ? -this.draggedCardHeight : this.draggedCardHeight;
+      return {
+        '--drag-shift-offset': `${offset}px`
+      };
+    },
+
     // 选择 CLI 类型
     async selectCli(cliName) {
       if (cliName === 'Gemini') {
@@ -672,25 +797,105 @@ createApp({
     // 拖拽开始
     handleDragStart(index, event) {
       this.draggingIndex = index;
+      this.dragOverIndex = null;
+      this.dropTargetIndex = null;
+      this.isDropping = false;
+      const card = event.currentTarget.closest('.auth-card');
+      const cardStyle = window.getComputedStyle(card);
+      this.draggedCardHeight = card.offsetHeight + parseFloat(cardStyle.marginBottom || 0);
+      this.draggedCardVisualHeight = card.offsetHeight;
+      this.dragCardRects = Array.from(document.querySelectorAll('.auth-card')).map(cardEl => {
+        const rect = cardEl.getBoundingClientRect();
+        return {
+          top: rect.top,
+          bottom: rect.bottom,
+          height: rect.height
+        };
+      });
+      this.dragStartY = event.clientY;
+      this.dragCurrentY = event.clientY;
       event.dataTransfer.effectAllowed = 'move';
       // 设置拖拽时的透明度
       event.target.style.opacity = '0.5';
     },
 
+    handleDrag(event) {
+      if (this.draggingIndex === null || event.clientY === 0) {
+        return;
+      }
+      this.dragCurrentY = event.clientY;
+      this.updateDropTargetByY(event.clientY);
+    },
+
     // 拖拽结束
     handleDragEnd(event) {
+      if (this.isDropping) {
+        event.target.style.opacity = '1';
+        return;
+      }
       this.draggingIndex = null;
       this.dragOverIndex = null;
+      this.dropTargetIndex = null;
+      this.draggedCardHeight = 0;
+      this.draggedCardVisualHeight = 0;
+      this.dragCardRects = [];
+      this.dragStartY = 0;
+      this.dragCurrentY = 0;
+      this.isDropping = false;
       event.target.style.opacity = '1';
     },
 
     // 拖拽经过
     handleDragOver(index, event) {
       event.preventDefault();
-      if (this.draggingIndex === null || this.draggingIndex === index) {
+      if (this.draggingIndex === null) {
+        return;
+      }
+      if (this.draggingIndex === index) {
+        return;
+      }
+      if (event.clientY !== 0) {
+        this.dragCurrentY = event.clientY;
+      }
+      this.updateDropTargetByY(event.clientY);
+      if (this.dragOverIndex !== index) {
+        this.dragOverIndex = index;
+      }
+    },
+
+    updateDropTargetByY(clientY) {
+      if (this.draggingIndex === null || clientY === 0) {
         return;
       }
-      this.dragOverIndex = index;
+
+      const dragOffset = clientY - this.dragStartY;
+      const draggedRect = this.dragCardRects[this.draggingIndex];
+      if (!draggedRect) {
+        return;
+      }
+
+      const draggedTop = draggedRect.top + dragOffset;
+      const draggedBottom = draggedTop + this.draggedCardVisualHeight;
+
+      const crossedIndexes = this.dragCardRects
+        .map((rect, index) => ({ rect, index }))
+        .filter(({ index }) => index !== this.draggingIndex)
+        .filter(({ rect, index }) => {
+          const targetMiddle = rect.top + rect.height / 2;
+          return this.draggingIndex < index
+            ? draggedBottom > targetMiddle
+            : draggedTop < targetMiddle;
+        })
+        .map(({ index }) => index);
+
+      const nextTargetIndex = this.draggingIndex < (crossedIndexes[0] ?? this.draggingIndex)
+        ? crossedIndexes[crossedIndexes.length - 1]
+        : crossedIndexes[0];
+
+      const normalizedTargetIndex = nextTargetIndex === undefined ? null : nextTargetIndex;
+      if (this.dropTargetIndex !== normalizedTargetIndex) {
+        this.dropTargetIndex = normalizedTargetIndex;
+      }
     },
 
     // 拖拽离开
@@ -701,10 +906,13 @@ createApp({
     // 放下
     async handleDrop(index, event) {
       event.preventDefault();
-      if (this.draggingIndex === null || this.draggingIndex === index) {
+      const targetIndex = this.dropTargetIndex ?? index;
+      if (this.draggingIndex === null || this.draggingIndex === targetIndex) {
         this.dragOverIndex = null;
+        this.dropTargetIndex = null;
         return;
       }
+      this.isDropping = true;
 
       // 保存原始数据，以便失败时恢复
       const oldAuth = [...this.config.AUTH];
@@ -712,41 +920,63 @@ createApp({
       const oldShowTokens = [...this.showTokens];
       const oldShowEnvSections = [...this.showEnvSections];
       const oldShowModelSections = [...this.showModelSections];
+      const oldAuthKeys = [...this.authKeys];
 
       // 移动配置项
       const [movedAuth] = this.config.AUTH.splice(this.draggingIndex, 1);
-      this.config.AUTH.splice(index, 0, movedAuth);
+      this.config.AUTH.splice(targetIndex, 0, movedAuth);
 
       // 同步移动显示状态
       const [movedToken] = this.showTokens.splice(this.draggingIndex, 1);
-      this.showTokens.splice(index, 0, movedToken);
+      this.showTokens.splice(targetIndex, 0, movedToken);
 
       const [movedEnv] = this.showEnvSections.splice(this.draggingIndex, 1);
-      this.showEnvSections.splice(index, 0, movedEnv);
+      this.showEnvSections.splice(targetIndex, 0, movedEnv);
 
       const [movedModel] = this.showModelSections.splice(this.draggingIndex, 1);
-      this.showModelSections.splice(index, 0, movedModel);
+      this.showModelSections.splice(targetIndex, 0, movedModel);
+
+      const [movedAuthKey] = this.authKeys.splice(this.draggingIndex, 1);
+      this.authKeys.splice(targetIndex, 0, movedAuthKey);
 
       // 调整 activeIndex
       if (this.draggingIndex === this.config.activeIndex) {
         // 拖拽的是当前使用的配置，直接移动到目标位置
-        this.config.activeIndex = index;
-      } else if (this.draggingIndex < this.config.activeIndex && index >= this.config.activeIndex) {
+        this.config.activeIndex = targetIndex;
+      } else if (this.draggingIndex < this.config.activeIndex && targetIndex >= this.config.activeIndex) {
         // 从前向后拖拽，经过当前使用的配置
         // activeIndex 位置的元素被向前移了一位，所以需要减 1
         this.config.activeIndex--;
-      } else if (this.draggingIndex > this.config.activeIndex && index <= this.config.activeIndex) {
+      } else if (this.draggingIndex > this.config.activeIndex && targetIndex <= this.config.activeIndex) {
         // 从后向前拖拽，经过当前使用的配置
         // activeIndex 位置的元素被向后移了一位，所以需要加 1
         this.config.activeIndex++;
       }
 
-      // 重置拖拽状态
-      this.draggingIndex = null;
+      this.draggingIndex = targetIndex;
       this.dragOverIndex = null;
+      this.dropTargetIndex = null;
+      this.dragCurrentY = this.dragStartY;
+
+      // 先完成 DOM 重排，下一帧再清理拖拽状态，避免松手时出现明显回弹刷新。
+      requestAnimationFrame(() => {
+        if (!this.isDropping || this.draggingIndex !== targetIndex) {
+          return;
+        }
+        this.draggingIndex = null;
+        this.dragOverIndex = null;
+        this.dropTargetIndex = null;
+        this.draggedCardHeight = 0;
+        this.draggedCardVisualHeight = 0;
+        this.dragCardRects = [];
+        this.dragStartY = 0;
+        this.dragCurrentY = 0;
+        this.isDropping = false;
+      });
 
       // 保存配置
       try {
+        this.normalizeCodexDefaults();
         const configToSave = {
           ...this.config,
           AUTH: this.config.AUTH.filter(auth => !this.isEmptyConfig(auth))
@@ -766,6 +996,7 @@ createApp({
         this.showTokens = oldShowTokens;
         this.showEnvSections = oldShowEnvSections;
         this.showModelSections = oldShowModelSections;
+        this.authKeys = oldAuthKeys;
       }
     }
   },