outman/frpc-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ 增加TLS和日志配置

Browse Source
This commit is contained in:
刘嘉伟 2023-12-01 14:16:53 +08:00
parent c749a2d84a
commit 36507b05c2
4 changed files with 115 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
electron/api/file.ts Normal file
View File

@ -0,0 +1,13 @@
import {dialog, ipcMain} from "electron";
export const initFileApi = () => {
ipcMain.handle("file.selectFile", async (event, args) => {
const result = dialog.showOpenDialogSync({
properties: ['openFile'],
filters: [
{name: 'Text Files', extensions: args},
]
})
return result;
});
}

2
electron/main/index.ts
View File

@ -6,6 +6,7 @@ import { initConfigApi } from "../api/config";
import { initProxyApi } from "../api/proxy";
import { initFrpcApi } from "../api/frpc";
import { initLoggerApi } from "../api/logger";
import {initFileApi} from "../api/file";
// The built directory structure
//
// ├─┬ dist-electron
@ -138,3 +139,4 @@ initConfigApi();
initProxyApi();
initFrpcApi();
initLoggerApi();
initFileApi();

5
electron/storage/config.ts
View File

@ -15,6 +15,11 @@ export type Config = {
authToken: string;
logLevel: string;
logMaxDays: number;
tlsConfigEnable: boolean;
tlsConfigCertFile: string;
tlsConfigKeyFile: string;
tlsConfigTrustedCaFile: string;
tlsConfigServerName: string;
};
/**

98
src/views/config/index.vue
View File

@ -19,6 +19,12 @@ type Config = {
authToken: string;
logLevel: string;
logMaxDays: number;
tlsConfigEnable: boolean;
tlsConfigCertFile: string;
tlsConfigKeyFile: string;
tlsConfigTrustedCaFile: string;
tlsConfigServerName: string;
};
type Version = {
@ -33,7 +39,12 @@ const formData = ref<Config>({
authMethod: "",
authToken: "",
logLevel: "info",
logMaxDays: 3
logMaxDays: 3,
tlsConfigEnable: false,
tlsConfigCertFile: "",
tlsConfigKeyFile: "",
tlsConfigTrustedCaFile: "",
tlsConfigServerName: "",
});
const loading = ref(1);
@ -54,7 +65,12 @@ const rules = reactive<FormRules>({
// authMethod: [{ required: true, message: "请选择验证方式", trigger: "blur" }],
authToken: [{required: true, message: "请输入token值 ", trigger: "blur"}],
logLevel: [{required: true, message: "请选择日志级别 ", trigger: "blur"}],
logMaxDays: [{required: true, message: "请输入日志保留天数 ", trigger: "blur"}]
logMaxDays: [{required: true, message: "请输入日志保留天数 ", trigger: "blur"}],
tlsConfigEnable: [{required: true, message: "请选择TLS状态", trigger: "change"}],
tlsConfigCertFile: [{required: true, message: "请选择TLS证书文件", trigger: "change"}],
tlsConfigKeyFile: [{required: true, message: "请选择TLS密钥文件", trigger: "change"}],
tlsConfigTrustedCaFile: [{required: true, message: "请选择CA证书文件", trigger: "change"}],
tlsConfigServerName: [{required: true, message: "请输入TLS Server名称", trigger: "blur"}]
});
const versions = ref<Array<Version>>([]);
@ -103,6 +119,24 @@ onMounted(() => {
});
});
const handleSelectFile = (type: number, ext: string[]) => {
ipcRenderer.invoke("file.selectFile", ext).then(r => {
switch (type) {
case 1:
formData.value.tlsConfigCertFile = r[0]
break;
case 2:
formData.value.tlsConfigKeyFile = r[0]
break;
case 3:
formData.value.tlsConfigTrustedCaFile = r[0]
break;
}
console.log(r)
})
}
onUnmounted(() => {
ipcRenderer.removeAllListeners("Config.getConfig.hook");
ipcRenderer.removeAllListeners("Config.saveConfig.hook");
@ -121,7 +155,7 @@ onUnmounted(() => {
:rules="rules"
label-position="right"
ref="formRef"
label-width="120"
label-width="140"
>
<el-row :gutter="10">
<el-col :span="24">
@ -196,6 +230,60 @@ onUnmounted(() => {
/>
</el-form-item>
</el-col>
<el-col :span="24">
<div class="h2">TSL Config</div>
</el-col>
<el-col :span="24">
<el-form-item label="是否启用TSL：" prop="tlsConfigEnable">
<el-switch active-text="开"
inline-prompt
inactive-text="关"
v-model="formData.tlsConfigEnable"/>
</el-form-item>
</el-col>
<template v-if="formData.tlsConfigEnable">
<el-col :span="24">
<el-form-item label="TLS证书文件：" prop="tlsConfigCertFile">
<el-input
class="button-input"
v-model="formData.tlsConfigCertFile"
placeholder="请选择TLS证书文件"
readonly
/>
<el-button class="ml-2" type="primary" @click="handleSelectFile(1, ['crt'])">选择</el-button>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="TLS密钥文件：" prop="tlsConfigKeyFile">
<el-input
class="button-input"
v-model="formData.tlsConfigKeyFile"
placeholder="请选择TLS密钥文件"
readonly
/>
<el-button class="ml-2" type="primary" @click="handleSelectFile(2, ['key'])">选择</el-button>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="CA证书文件：" prop="tlsConfigTrustedCaFile">
<el-input
class="button-input"
v-model="formData.tlsConfigTrustedCaFile"
placeholder="请选择CA证书文件"
readonly
/>
<el-button class="ml-2" type="primary" @click="handleSelectFile(3, ['crt'])">选择</el-button>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="TLS Server名称：" prop="tlsConfigServerName">
<el-input
v-model="formData.tlsConfigServerName"
placeholder="请输入TLS Server名称"
/>
</el-form-item>
</el-col>
</template>
<el-col :span="24">
<div class="h2">日志配置</div>
</el-col>
@ -242,4 +330,8 @@ onUnmounted(() => {
background-color: #EEEBF6;
margin-bottom: 18px;
}
.button-input {
width: calc(100% - 68px);
}
</style>