feat(settings): add system autostart support

- integrate Tauri autostart management with rollback on save failures
- redesign the software settings panel for startup and close behavior
- add localized labels and responsive styling

src/i18n/ja.ts

@@ -345,10 +345,12 @@ export const jaOverrides = {
   'config.network.sessionAffinityHint': '同じセッションでは以前選択した認証情報を優先します',
   'config.network.sessionTtl': 'セッションアフィニティ TTL',
   'config.network.sessionTtlHint': '例：1h。空欄の場合はコアのデフォルト値を使用します',
-  'config.notice.softwareCloseBehaviorUpdated': 'アプリの終了動作を更新しました',
+  'config.notice.softwareUpdated': 'ソフトウェア設定を保存しました',
   'config.software.title': 'ソフトウェア設定',
-  'config.software.description': 'ウィンドウの閉じるボタンをクリックしたときのデフォルト動作を設定します。「毎回確認」を選ぶと確認ダイアログに戻ります。',
+  'config.software.autostart': 'システム起動時に開始',
+  'config.software.autostartDescription': 'サインイン後に EasyCLIProxyAPI を自動的に起動します',
   'config.software.closeBehavior': '終了動作',
+  'config.software.closeBehaviorDescription': 'ウィンドウを閉じたときにアプリを終了するか、システムトレイで実行を続けるかを選択します',
   'config.software.behavior.ask': '毎回確認',
   'config.software.behavior.minimize': 'トレイに最小化',
   'config.software.behavior.exit': 'アプリを終了',

src/i18n/resources.ts

@@ -292,10 +292,12 @@ export const zhCN = {
   'config.notice.sessionAffinityEnabled': '会话粘性路由已启用',
   'config.notice.sessionAffinityDisabled': '会话粘性路由已停用',
   'config.notice.sessionTtlUpdated': '会话粘性 TTL 已保存',
-  'config.notice.softwareCloseBehaviorUpdated': '软件关闭行为已更新',
+  'config.notice.softwareUpdated': '软件设置已保存',
   'config.software.title': '软件设置',
-  'config.software.description': '设置点击窗口关闭按钮时的默认行为。选择“每次询问”即可恢复关闭确认弹窗。',
+  'config.software.autostart': '开机自启',
+  'config.software.autostartDescription': '登录系统后自动启动 EasyCLIProxyAPI',
   'config.software.closeBehavior': '关闭行为',
+  'config.software.closeBehaviorDescription': '决定关闭窗口时是退出程序还是继续在系统托盘运行',
   'config.software.behavior.ask': '每次询问',
   'config.software.behavior.minimize': '最小化到托盘',
   'config.software.behavior.exit': '退出程序',
@@ -1221,10 +1223,12 @@ export const en: Record<MessageKey, string> = {
   'config.notice.sessionAffinityEnabled': 'Session affinity enabled',
   'config.notice.sessionAffinityDisabled': 'Session affinity disabled',
   'config.notice.sessionTtlUpdated': 'Session affinity TTL saved',
-  'config.notice.softwareCloseBehaviorUpdated': 'App close behavior updated',
+  'config.notice.softwareUpdated': 'Software settings saved',
   'config.software.title': 'Software Settings',
-  'config.software.description': 'Choose what happens by default when you click the window close button. Select “Ask every time” to restore the confirmation dialog.',
+  'config.software.autostart': 'Launch at startup',
+  'config.software.autostartDescription': 'Automatically launch EasyCLIProxyAPI when you sign in',
   'config.software.closeBehavior': 'Close behavior',
+  'config.software.closeBehaviorDescription': 'Choose whether closing the window exits the app or keeps it running in the system tray',
   'config.software.behavior.ask': 'Ask every time',
   'config.software.behavior.minimize': 'Minimize to Tray',
   'config.software.behavior.exit': 'Exit App',

src/i18n/traditional.ts

@@ -1,4 +1,8 @@
 const phraseReplacements: ReadonlyArray<readonly [string, string]> = [
+  ['登录系统后自动启动', '登入系統後自動啟動'],
+  ['系统托盘', '系統匣'],
+  ['开机自启', '開機自啟'],
+  ['行为', '行為'],
   ['兼容格式', '相容格式'],
   ['历史', '歷史'],
   ['高级设置', '進階設定'],

src/pages/ConfigPanel.tsx

@@ -59,8 +59,9 @@ type DraftRefreshMode = 'replace' | 'preserve';
 
 type NetworkDraftDirty = Record<NetworkDraftField, boolean>;
 
-type GuiSettings = {
+type SoftwareSettings = {
   closeBehavior: CloseBehavior;
+  autostartEnabled: boolean;
 };
 
 const cleanNetworkDraft = (): NetworkDraftDirty => ({
@@ -80,9 +81,10 @@ export function ConfigPanelPage() {
   const { t } = useI18n();
   const { status: coreStatus, publishStatus, refreshStatus } = useCoreRuntime();
   const [settings, setSettings] = useState<CoreConfigSettings | null>(null);
-  const [softwareSettings, setSoftwareSettings] = useState<GuiSettings | null>(null);
+  const [softwareSettings, setSoftwareSettings] = useState<SoftwareSettings | null>(null);
   const [softwareSettingsLoading, setSoftwareSettingsLoading] = useState(true);
   const [softwareCloseBehaviorDraft, setSoftwareCloseBehaviorDraft] = useState<CloseBehavior>('ask');
+  const [softwareAutostartDraft, setSoftwareAutostartDraft] = useState(false);
   const [softwareSavedStatusVisible, setSoftwareSavedStatusVisible] = useState(false);
   const [loading, setLoading] = useState(true);
   const [loadError, setLoadError] = useState('');
@@ -196,9 +198,10 @@ export function ConfigPanelPage() {
     setSoftwareSettingsLoading(true);
     setSoftwareSavedStatusVisible(false);
     try {
-      const result = await invoke<GuiSettings>('get_gui_settings');
+      const result = await invoke<SoftwareSettings>('get_software_settings');
       setSoftwareSettings(result);
       setSoftwareCloseBehaviorDraft(result.closeBehavior);
+      setSoftwareAutostartDraft(result.autostartEnabled);
     } catch (error) {
       setSoftwareSettings(null);
       showNotice(t('config.error.saveFailed', { error: String(error) }), 'error');
@@ -461,23 +464,32 @@ export function ConfigPanelPage() {
     }
   };
 
-  const saveSoftwareCloseBehavior = async () => {
+  const saveSoftwareSettings = async () => {
     if (!softwareSettings || busyAction !== null) return;
-    if (softwareCloseBehaviorDraft === softwareSettings.closeBehavior) return;
+    if (
+      softwareCloseBehaviorDraft === softwareSettings.closeBehavior
+      && softwareAutostartDraft === softwareSettings.autostartEnabled
+    ) return;
 
     setBusyAction('software');
     try {
-      const result = await invoke<GuiSettings>('save_app_close_behavior', {
-        behavior: softwareCloseBehaviorDraft,
+      const result = await invoke<SoftwareSettings>('save_software_settings', {
+        settings: {
+          closeBehavior: softwareCloseBehaviorDraft,
+          autostartEnabled: softwareAutostartDraft,
+        },
       });
       setSoftwareSettings(result);
       setSoftwareCloseBehaviorDraft(result.closeBehavior);
+      setSoftwareAutostartDraft(result.autostartEnabled);
       setSoftwareSavedStatusVisible(true);
-      showNotice(t('config.notice.softwareCloseBehaviorUpdated'), 'success');
+      showNotice(t('config.notice.softwareUpdated'), 'success');
     } catch (error) {
       setSoftwareCloseBehaviorDraft(softwareSettings.closeBehavior);
+      setSoftwareAutostartDraft(softwareSettings.autostartEnabled);
       setSoftwareSavedStatusVisible(false);
       showNotice(t('config.error.saveFailed', { error: String(error) }), 'error');
+      void loadSoftwareSettings();
     } finally {
       setBusyAction(null);
     }
@@ -504,18 +516,21 @@ export function ConfigPanelPage() {
             : '';
   const softwareCloseBehaviorDirty = softwareSettings !== null
     && softwareCloseBehaviorDraft !== softwareSettings.closeBehavior;
+  const softwareAutostartDirty = softwareSettings !== null
+    && softwareAutostartDraft !== softwareSettings.autostartEnabled;
+  const softwareSettingsDirty = softwareCloseBehaviorDirty || softwareAutostartDirty;
   const softwareStatusLabel = softwareSettingsLoading
     ? t('common.loading')
     : softwareSettings === null
       ? t('common.unavailable')
-      : softwareCloseBehaviorDirty
+      : softwareSettingsDirty
         ? t('config.network.unsaved')
         : softwareSavedStatusVisible
           ? t('config.network.saved')
           : '';
   const softwareStatusIsSaved = !softwareSettingsLoading
     && softwareSettings !== null
-    && !softwareCloseBehaviorDirty
+    && !softwareSettingsDirty
     && softwareSavedStatusVisible;
   const networkStatusIsSaved = !loading
     && settings !== null
@@ -1033,8 +1048,8 @@ export function ConfigPanelPage() {
                 <button
                   type="button"
                   className="primary-button compact-button"
-                  disabled={softwareSettingsLoading || softwareSettings === null || busyAction !== null || !softwareCloseBehaviorDirty}
-                  onClick={() => void saveSoftwareCloseBehavior()}
+                  disabled={softwareSettingsLoading || softwareSettings === null || busyAction !== null || !softwareSettingsDirty}
+                  onClick={() => void saveSoftwareSettings()}
                 >
                   <Check size={16} aria-hidden="true" />
                   {busyAction === 'software' ? t('common.saving') : t('config.network.confirmSave')}
@@ -1042,25 +1057,60 @@ export function ConfigPanelPage() {
               </div>
             </div>
             <div className="config-software-content">
-              <div className="config-software-description">
-                <p>{t('config.software.description')}</p>
+              <div className="config-software-settings-list">
+                <div className="config-software-setting-row">
+                  <div className="config-software-setting-copy">
+                    <span className="config-software-setting-icon" aria-hidden="true">
+                      <Clock3 size={18} />
+                    </span>
+                    <div>
+                      <strong>{t('config.software.autostart')}</strong>
+                      <small>{t('config.software.autostartDescription')}</small>
+                    </div>
+                  </div>
+                  <label className="switch-control" title={t('config.software.autostart')}>
+                    <input
+                      type="checkbox"
+                      role="switch"
+                      aria-label={t('config.software.autostart')}
+                      checked={softwareAutostartDraft}
+                      disabled={softwareSettingsLoading || softwareSettings === null || busyAction !== null}
+                      onChange={(event) => {
+                        setSoftwareSavedStatusVisible(false);
+                        setSoftwareAutostartDraft(event.currentTarget.checked);
+                      }}
+                    />
+                    <span className="switch-track" />
+                  </label>
+                </div>
+                <div className="config-software-setting-row config-software-close-row">
+                  <div className="config-software-setting-copy">
+                    <span className="config-software-setting-icon" aria-hidden="true">
+                      <X size={18} />
+                    </span>
+                    <div>
+                      <strong>{t('config.software.closeBehavior')}</strong>
+                      <small>{t('config.software.closeBehaviorDescription')}</small>
+                    </div>
+                  </div>
+                  <label className="config-software-select">
+                    <span className="sr-only">{t('config.software.closeBehavior')}</span>
+                    <select
+                      className="config-network-input"
+                      value={softwareCloseBehaviorDraft}
+                      disabled={softwareSettingsLoading || softwareSettings === null || busyAction !== null}
+                      onChange={(event) => {
+                        setSoftwareSavedStatusVisible(false);
+                        setSoftwareCloseBehaviorDraft(event.currentTarget.value as CloseBehavior);
+                      }}
+                    >
+                      <option value="ask">{t('config.software.behavior.ask')}</option>
+                      <option value="minimize-to-tray">{t('config.software.behavior.minimize')}</option>
+                      <option value="exit">{t('config.software.behavior.exit')}</option>
+                    </select>
+                  </label>
+                </div>
               </div>
-              <label className="config-software-field">
-                <span>{t('config.software.closeBehavior')}</span>
-                <select
-                  className="config-network-input"
-                  value={softwareCloseBehaviorDraft}
-                  disabled={softwareSettingsLoading || softwareSettings === null || busyAction !== null}
-                  onChange={(event) => {
-                    setSoftwareSavedStatusVisible(false);
-                    setSoftwareCloseBehaviorDraft(event.currentTarget.value as CloseBehavior);
-                  }}
-                >
-                  <option value="ask">{t('config.software.behavior.ask')}</option>
-                  <option value="minimize-to-tray">{t('config.software.behavior.minimize')}</option>
-                  <option value="exit">{t('config.software.behavior.exit')}</option>
-                </select>
-              </label>
             </div>
           </section>
         </div>

src/styles.css

@@ -2449,45 +2449,87 @@ textarea:focus-visible {
   gap: 18px;
 }
 
+.config-software-panel > .config-panel-heading {
+  width: min(960px, 100%);
+  margin: 0 auto;
+}
+
 .config-software-content {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
-  align-items: stretch;
-  gap: 16px;
+  width: min(960px, 100%);
+  margin: 0 auto;
 }
 
-.config-software-description,
-.config-software-field {
-  min-width: 0;
-  min-height: 112px;
-  padding: 16px;
+.config-software-setting-icon {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  justify-content: center;
   border: 1px solid var(--theme-e3e1db);
   border-radius: 8px;
-  background: var(--theme-faf8f2);
+  background: var(--theme-fffdf8);
+  color: var(--theme-777067);
 }
 
-.config-software-description {
-  display: flex;
-  align-items: center;
+.config-software-setting-copy > div {
+  display: grid;
+  min-width: 0;
+  gap: 4px;
 }
 
-.config-software-description p {
-  margin: 0;
-  color: var(--theme-6d6760);
+.config-software-setting-copy strong {
+  color: var(--theme-39352f);
   font-size: var(--font-size-body);
   line-height: var(--line-height-body);
 }
 
-.config-software-field {
-  display: grid;
-  align-content: center;
-  gap: 8px;
-  color: var(--theme-39352f);
-  font-size: var(--font-size-body);
-  font-weight: 700;
+.config-software-settings-list {
+  overflow: hidden;
+  border: 1px solid var(--theme-d5d2cb);
+  border-radius: 10px;
+  background: var(--theme-fffdf8);
 }
 
-.config-software-field .config-network-input {
+.config-software-setting-row {
+  display: flex;
+  min-height: 92px;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24px;
+  padding: 17px 20px;
+}
+
+.config-software-setting-row + .config-software-setting-row {
+  border-top: 1px solid var(--theme-e3e1db);
+}
+
+.config-software-setting-copy {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  gap: 14px;
+}
+
+.config-software-setting-icon {
+  width: 40px;
+  height: 40px;
+  background: var(--theme-faf8f2);
+}
+
+.config-software-setting-copy small {
+  color: var(--theme-7a746c);
+  font-size: var(--font-size-meta);
+  font-weight: 400;
+  line-height: var(--line-height-body);
+}
+
+.config-software-select {
+  display: grid;
+  width: 228px;
+  flex: none;
+}
+
+.config-software-select .config-network-input {
   height: 42px;
 }
 
@@ -2506,13 +2548,43 @@ textarea:focus-visible {
 }
 
 @media (max-width: 700px) {
-  .config-software-content {
-    grid-template-columns: minmax(0, 1fr);
+  .config-software-panel .config-panel-heading {
+    align-items: flex-start;
   }
 
-  .config-software-description,
-  .config-software-field {
-    min-height: 0;
+  .config-software-setting-row {
+    min-height: 84px;
+    gap: 16px;
+    padding: 15px 16px;
+  }
+
+  .config-software-close-row {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .config-software-select {
+    width: 100%;
+    padding-left: 54px;
+  }
+}
+
+@media (max-width: 480px) {
+  .config-software-setting-row {
+    padding: 14px;
+  }
+
+  .config-software-setting-copy {
+    gap: 11px;
+  }
+
+  .config-software-setting-icon {
+    width: 36px;
+    height: 36px;
+  }
+
+  .config-software-select {
+    padding-left: 47px;
   }
 }