Browse Source

add:frpc

master
秋田弘 5 months ago
parent
commit
c73b030be8
  1. 107
      frontend/src/components/setting/FrpcEdit.vue
  2. 2
      frontend/src/stores/proxy.ts

107
frontend/src/components/setting/FrpcEdit.vue

@ -1,9 +1,10 @@
<script lang="ts" setup>
import { useChooseStore } from "@/stores/choose";
import { useProxyStore } from "@/stores/proxy";
import { OpenDirDialog } from "@/util/goutil";
import { notifyError, notifySuccess } from "@/util/msg";
import { ref } from "vue";
const proxyStore = useProxyStore();
const choose = useChooseStore();
const { updateProxy } = proxyStore;
const proxyDialogShow = ref(false);
@ -12,14 +13,9 @@
//
const proxyRules = {
name: [{ required: true, message: "请输入代理名称", trigger: "blur" }],
// port: [
// { required: true, message: "", trigger: "blur" },
// { type: "number", message: "", trigger: "blur" },
// ],
domain: [{ required: false, message: "请输入域名", trigger: "blur" }],
type: [{ required: true, message: "请选择类型", trigger: "blur" }],
localIp: [
{ required: false, message: "请输入内网地址", trigger: "blur" },
{ required: true, message: "请输入内网地址", trigger: "blur" },
{
pattern: /^[\w-]+(\.[\w-]+)+$/,
message: "请输入正确的内网地址",
@ -35,6 +31,51 @@
trigger: "blur",
},
],
customDomains: [
{ required: false, message: "请输入自定义域名", trigger: "blur" },
{
pattern: /^[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
message: "请输入有效的域名",
trigger: "blur",
},
],
subdomain: [
{ required: true, message: "请输入子域名", trigger: "blur" },
{
pattern: /^[a-zA-Z0-9.-]+$/,
message: "子域名只能包含字母、数字、连字符和点号",
trigger: "blur",
},
],
basicAuth: [
{
required: true,
message: "请选择是否启用基本认证",
trigger: "change",
},
],
httpUser: [
{ required: true, message: "请输入认证用户名", trigger: "blur" },
{
min: 3,
message: "用户名至少需要3个字符",
trigger: "blur",
},
],
httpPassword: [
{ required: true, message: "请输入认证密码", trigger: "blur" },
{
min: 6,
message: "密码至少需要6个字符",
trigger: "blur",
},
],
https2httpCaFile: [
{ required: false, message: "请选择证书文件", trigger: "blur" },
],
https2httpKeyFile: [
{ required: false, message: "请选择密钥文件", trigger: "blur" },
],
};
const addProxy = async () => {
@ -87,17 +128,23 @@
{ label: "被访问者", value: "visited" },
]);
const handleSelectFile = (mod: number) => {
OpenDirDialog().then((res: string) => {
if (mod == 1) {
proxyStore.proxyData.https2httpCaFile = res;
} else if (mod == 2) {
proxyStore.proxyData.https2httpKeyFile = res;
} else if (mod == 3) {
proxyStore.proxyData.localPath = res;
}
});
const handleSelectFile = () => {
choose.select("选择文件", "*");
};
watch(
() => choose.path,
(newVal, oldVal) => {
console.log("newVal", newVal);
console.log("oldVal", oldVal);
if (newVal.length > 0) {
console.log("choose.path", choose.path);
proxyStore.proxyData.https2httpCaFile = choose.path[0];
choose.path = [];
}
},
{ deep: true }
);
</script>
<template>
@ -183,7 +230,6 @@
proxyStore.proxyData.type === 'https'
"
label="自定义域名:"
prop="customDomain"
>
<el-row
v-for="(_, index) in proxyStore.customDomains"
@ -222,11 +268,11 @@
proxyStore.proxyData.type === 'https'
"
label="子域名:"
prop="domain"
prop="subdomain"
>
<el-input
v-model="proxyStore.proxyData.subdomain"
placeholder="子域名"
placeholder="help.example.com"
/>
</el-form-item>
<el-form-item
@ -252,7 +298,7 @@
>
<el-form-item
label="HTTP基本认证:"
prop="BasicAuth"
prop="basicAuth"
>
<el-switch v-model="proxyStore.proxyData.basicAuth" />
</el-form-item>
@ -278,29 +324,38 @@
/>
</el-form-item>
</template>
<template v-if="proxyStore.proxyData.type === 'https'">
<el-form-item
label="https2http"
prop="https2http"
>
<el-switch v-model="proxyStore.proxyData.https2http" />
</el-form-item>
<el-form-item
v-if="proxyStore.proxyData.type === 'https'"
label="证书文件:"
prop="https2httpCaFile"
v-if="proxyStore.proxyData.https2http"
>
<el-input
v-model="proxyStore.proxyData.https2httpCaFile"
placeholder="点击选择证书文件"
@click="handleSelectFile(1)"
@click="handleSelectFile"
/>
</el-form-item>
<el-form-item
v-if="proxyStore.proxyData.type === 'https'"
v-if="proxyStore.proxyData.https2http"
label="密钥文件:"
prop="https2httpKeyFile"
>
<el-input
v-model="proxyStore.proxyData.https2httpKeyFile"
placeholder="点击选择密钥文件"
@click="handleSelectFile(2)"
@click="handleSelectFile"
/>
</el-form-item>
</template>
</template>
<template v-if="proxyStore.proxyData.type === 'tcp'">
<el-form-item
label="文件访问:"
@ -316,7 +371,7 @@
<el-input
v-model="proxyStore.proxyData.localPath"
placeholder="点击选择文件夹路径"
@click="handleSelectFile(3)"
@click="handleSelectFile"
/>
</el-form-item>
<el-form-item

2
frontend/src/stores/proxy.ts

@ -36,7 +36,7 @@ export interface ProxyItem {
export const useProxyStore = defineStore('proxyStore', () => {
const proxies = ref<ProxyItem[]>([]);
const customDomains = ref<string[]>([]);
const customDomains = ref<string[]>([""]);
const proxyData = ref<ProxyItem>(createNewProxyData());
const apiUrl = getSystemKey("apiUrl")
const isEditor = ref(false)

Loading…
Cancel
Save