upd: add config file

Author: ATRIOR-LCL

src/common/interface/config.interface.ts

@@ -1,10 +1,58 @@
+export interface VideoConfig {
+  id: string;
+  name: string;
+  width: number;
+  height: number;
+  frameRate: number;
+  sampleRate: number;
+}
+
+export interface AudioConfig {
+  id: string;
+  name: string;
+  sampleRate: number;
+  channelCount: number;
+}
+
 export interface AppConfigInterface {
-    rlToken: string;
-    userId: string;
-    competitionId: string;
+  version: string;
+  appConfig: {
+    autoOpenOnLogin?: boolean; // 开机自启动
+    autoStartStreaming?: boolean; // 启动时自动开始推流
+    autoHiddenOnStart?: boolean; // 启动时自动隐藏主窗口
+    videoCachePath: string; // 视频缓存路径
+  };
+  userConfig: {
+    rlToken?: string;
+    userId?: string;
+    competitionId?: string;
+  };
+  devicesConfig: {
+    screens?: Array<VideoConfig>;
+    cameras?: Array<VideoConfig>;
+    microphones?: Array<AudioConfig>;
+  };
+}
+
+export interface UpdateVideoConfigDTO {
+  id: string;
+  name: string;
+  width: number;
+  height: number;
+  frameRate: number;
+  sampleRate: number;
+}
 
-    devicesConfig: {
-        
-    }
+export interface UpdateAudioConfigDTO {
+  id: string;
+  name: string;
+  sampleRate: number;
+  channelCount: number;
+}
 
-}
+export interface UpdateAppConfigDTO {
+  autoOpenOnLogin: boolean;
+  autoStartStreaming: boolean;
+  autoHiddenOnStart: boolean;
+  videoCachePath: string;
+}

src/electron/main.ts

@@ -6,6 +6,7 @@ import { WebSocketService } from './services/websocket-service';
 import { VideoRecordingService } from './services/video-recording-service';
 import { createTray } from './utils/tray';
 import fs from 'fs';
+import { ConfigManager } from './services/config-manager';
 
 app.setName('Kessoku the Broadcaster');
 
@@ -14,6 +15,7 @@ let mainWindow: BrowserWindow;
 let webSocketService: WebSocketService;
 let videoRecordingService: VideoRecordingService;
 const SERVICE_URL: string = 'http://localhost:3001';
+let configManager: ConfigManager = new ConfigManager();
 
 app.setAboutPanelOptions({
   applicationName: app.getName(),
@@ -130,7 +132,7 @@ function createSettingsWindow() {
     resizable: false,
     show: false,
     titleBarStyle: 'hiddenInset',
-  })
+  });
 
   if (isDevelopment()) {
     settingsWindow.loadURL('http://localhost:5123/#settings');
@@ -182,9 +184,9 @@ function setupIpcHandlers() {
     }
   });
 
-  ipcMainOn("openSettingsWindow", () => {
+  ipcMainOn('openSettingsWindow', () => {
     createSettingsWindow();
-  })
+  });
 
   // 获取连接状态
   ipcMainHandle('get-connection-status', () => {
@@ -270,6 +272,33 @@ function setupIpcHandlers() {
       throw error;
     }
   });
+
+  ipcMainHandle('getAppConfig', async () => {
+    return configManager.getConfigData;
+  });
+
+  ipcMainHandle('getDevicesConfig', async () => {
+    return configManager.getDevicesConfig;
+  });
+
+  ipcMainHandle('hasDevicesConfig', async () => {
+    return configManager.hasDevicesConfig();
+  });
+
+  ipcMainHandle('updateAppConfig', async (data: UpdateAppConfigDTO) => {
+    configManager.updateAppConfig(data);
+  });
+
+  ipcMainHandle('updateAudioConfig', async (data: UpdateAudioConfigDTO[]) => {
+    configManager.updateAudioConfig(data);
+  });
+
+  ipcMainHandle(
+    'updateVideoConfig',
+    async ({ data, type }: { data: UpdateVideoConfigDTO[]; type: 'camera' | 'screen' }) => {
+      configManager.updateVideoConfig(data, type);
+    },
+  );
 }
 
 const handleCloseEvents = (mainWindow: BrowserWindow) => {

src/electron/preload.cts

@@ -91,7 +91,25 @@ electron.contextBridge.exposeInMainWorld('electron', {
   },
   openSettingsWindow: () => {
     ipcSend('openSettingsWindow');
-  }
+  },
+  getAppConfig: () => {
+    return ipcInvoke('getAppConfig');
+  },
+  getDevicesConfig: () => {
+    return ipcInvoke('getDevicesConfig');
+  },
+  hasDevicesConfig: () => {
+    return ipcInvoke('hasDevicesConfig');
+  },
+  updateVideoConfig: (data: UpdateVideoConfigDTO[], type: 'camera' | 'screen') => {
+    return ipcInvoke('updateVideoConfig', { data, type });
+  },
+  updateAudioConfig: (data: UpdateAudioConfigDTO[]) => {
+    return ipcInvoke('updateAudioConfig', data);
+  },
+  updateAppConfig: (data: UpdateAppConfigDTO) => {
+    return ipcInvoke('updateAppConfig', data);
+  },
 } satisfies Window['electron']);
 
 function ipcInvoke<Key extends keyof EventPayloadMapping>(

src/electron/services/config-manager.ts

@@ -0,0 +1,94 @@
+import {
+  AppConfigInterface,
+  UpdateAppConfigDTO,
+  UpdateAudioConfigDTO,
+  UpdateVideoConfigDTO,
+} from 'common/interface/config.interface';
+import fs from 'fs';
+import path from 'path';
+import os from 'os';
+import { app } from 'electron';
+
+export class ConfigManager {
+  protected configPath: string = os.homedir() + '/.Kessoku-the-Broadcaster/config.json';
+  private configData: AppConfigInterface;
+
+  constructor() {
+    this.loadingConfig();
+  }
+
+  private loadingConfig() {
+    if (fs.existsSync(this.configPath)) {
+      const rawData = fs.readFileSync(this.configPath, 'utf-8');
+      this.configData = JSON.parse(rawData) as AppConfigInterface;
+    } else {
+      // 确保配置目录存在
+      const configDir = path.dirname(this.configPath);
+      if (!fs.existsSync(configDir)) {
+        fs.mkdirSync(configDir, { recursive: true });
+      }
+
+      fs.writeFileSync(
+        this.configPath,
+        JSON.stringify(
+          {
+            version: app.getVersion(),
+            appConfig: {},
+            userConfig: {},
+            devicesConfig: {},
+          } as AppConfigInterface,
+          null,
+          2,
+        ),
+      );
+      this.configData = JSON.parse(fs.readFileSync(this.configPath, 'utf-8')) as AppConfigInterface;
+    }
+  }
+
+  get getConfigPath() {
+    return this.configPath;
+  }
+
+  get getConfigData() {
+    return this.configData;
+  }
+
+  get getDevicesConfig() {
+    return this.configData.devicesConfig || {};
+  }
+
+  hasDevicesConfig(): boolean {
+    const dc = this.configData.devicesConfig;
+    return !!(
+      (dc.screens && dc.screens.length > 0) ||
+      (dc.cameras && dc.cameras.length > 0) ||
+      (dc.microphones && dc.microphones.length > 0)
+    );
+  }
+
+  private saveConfig() {
+    fs.writeFileSync(this.configPath, JSON.stringify(this.configData, null, 2));
+  }
+
+  updateAppConfig(data: UpdateAppConfigDTO) {
+    this.configData.appConfig = {
+      ...this.configData.appConfig,
+      ...data,
+    };
+    this.saveConfig();
+  }
+
+  updateVideoConfig(data: UpdateVideoConfigDTO[], type: 'camera' | 'screen') {
+    if (type === 'camera') {
+      this.configData.devicesConfig.cameras = data;
+    } else if (type === 'screen') {
+      this.configData.devicesConfig.screens = data;
+    }
+    this.saveConfig();
+  }
+
+  updateAudioConfig(data: UpdateAudioConfigDTO[]) {
+    this.configData.devicesConfig.microphones = data;
+    this.saveConfig();
+  }
+}

src/ui/app.vue

@@ -1,9 +1,11 @@
 <script lang="ts">
 import { Vue, Options } from 'vue-class-component';
+import { Provide } from 'vue-property-decorator';
 
 import LoginView from './modules/login/login.view.vue';
 import HomeView from './modules/home/home.view.vue';
 import Tools from './components/tools.vue';
+import { AppConfigInterface } from 'common/interface/config.interface';
 
 @Options({
   components: {
@@ -13,15 +15,15 @@ import Tools from './components/tools.vue';
   },
 })
 export default class App extends Vue {
-  async mounted() {
+  mounted() {
     window.addEventListener('keydown', (e) => {
       if ((e.ctrlKey || e.metaKey) && ['=', '-', '0'].includes(e.key)) {
         e.preventDefault();
       }
 
       if (e.metaKey && e.key == ',') {
         e.preventDefault();
-        window.electron.openSettingsWindow()
+        window.electron.openSettingsWindow();
       }
     });
   }

src/ui/components/config-dialog.vue

@@ -90,16 +90,16 @@ export default class ConfigDialog extends Vue {
         <div class="resolution-inputs">
           <el-input-number
             v-model="deviceManager.configForm.width"
-            :min="deviceManager.currentConfigDevice?.capabilities?.width?.min"
-            :max="deviceManager.currentConfigDevice?.capabilities?.width?.max"
+            :min="deviceManager.currentConfigDevice.capabilities.width.min"
+            :max="deviceManager.currentConfigDevice.capabilities.width.max"
             :step="1"
             controls-position="right"
           />
           <span class="resolution-separator">×</span>
           <el-input-number
             v-model="deviceManager.configForm.height"
-            :min="deviceManager.currentConfigDevice?.capabilities?.height?.min"
-            :max="deviceManager.currentConfigDevice?.capabilities?.height?.max"
+            :min="deviceManager.currentConfigDevice.capabilities.height.min"
+            :max="deviceManager.currentConfigDevice.capabilities.height.max"
             :step="1"
             controls-position="right"
           />
@@ -142,8 +142,8 @@ export default class ConfigDialog extends Vue {
       <el-form-item label="帧率">
         <el-input-number
           v-model="deviceManager.configForm.frameRate"
-          :min="deviceManager.currentConfigDevice?.capabilities?.frameRate?.min"
-          :max="60"
+          :min="deviceManager.currentConfigDevice.capabilities.frameRate.min"
+          :max="deviceManager.currentConfigDevice.capabilities.frameRate.max"
           :step="1"
           controls-position="right"
         />
@@ -152,16 +152,16 @@ export default class ConfigDialog extends Vue {
 
       <el-form-item label="支持范围">
         <div class="capabilities-info">
-          <p v-if="deviceManager.currentConfigDevice?.capabilities">
+          <p v-if="deviceManager.currentConfigDevice.capabilities">
             宽度:
-            {{ Math.round(deviceManager.currentConfigDevice.capabilities.width?.min) }} -
-            {{ Math.round(deviceManager.currentConfigDevice.capabilities.width?.max) }}<br />
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.width.min) }} -
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.width.max) }}<br />
             高度:
-            {{ Math.round(deviceManager.currentConfigDevice.capabilities.height?.min) }} -
-            {{ Math.round(deviceManager.currentConfigDevice.capabilities.height?.max) }}<br />
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.height.min) }} -
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.height.max) }}<br />
             帧率:
-            {{ Math.round(deviceManager.currentConfigDevice.capabilities.frameRate?.min) }} -
-            {{ 60 }}
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.frameRate.min) }} -
+            {{ Math.round(deviceManager.currentConfigDevice.capabilities.frameRate.max) }}
             fps
           </p>
           <p v-else>待获取设备参数信息</p>

src/ui/components/device-card.vue

@@ -46,14 +46,12 @@ export default class DeviceCard extends Vue {
   @Inject()
   updateVideoElement!: (device: Device) => void;
 
-  // 使用本地响应式数据
   private localFormatSetting: string = '';
 
   mounted() {
     this.updateFormatSetting();
   }
 
-  // 公共方法：更新 formatSetting 显示
   public updateFormatSetting() {
     this.localFormatSetting = this.device?.formatSetting || '未获取当前设备参数';
   }