|
@@ -17,6 +17,7 @@
|
|
|
:rules="rules"
|
|
|
:label-col="labelCol"
|
|
|
:wrapper-col="wrapperCol"
|
|
|
+ style="max-width: 100%"
|
|
|
>
|
|
|
<a-form-item ref="name" name="name">
|
|
|
<label>name:</label>
|
|
@@ -35,12 +36,12 @@
|
|
|
|
|
|
<a-form-item v-if="formState.isedit === true" ref="url" name="url">
|
|
|
<label>url:</label>
|
|
|
- <a-input v-model:value="formState.url" placeholder="输入切换地址url" />
|
|
|
+ <a-textarea v-model:value="formState.url" placeholder="输入切换地址url" class="custom-input-height" />
|
|
|
</a-form-item>
|
|
|
|
|
|
<a-form-item v-if="formState.isedit === true" ref="UrlRecover" name="UrlRecover">
|
|
|
<label>UrlRecover:</label>
|
|
|
- <a-input v-model:value="formState.UrlRecover" placeholder="输入恢复地址" />
|
|
|
+ <a-textarea v-model:value="formState.UrlRecover" placeholder="输入恢复地址" class="custom-input-height" />
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
@@ -152,10 +153,11 @@ export default defineComponent({
|
|
|
data(){
|
|
|
return {
|
|
|
labelCol: {
|
|
|
- span: 4,
|
|
|
+ style: { width: '150px' }
|
|
|
},
|
|
|
wrapperCol: {
|
|
|
- span: 14,
|
|
|
+ span: 100,
|
|
|
+
|
|
|
},
|
|
|
|
|
|
}
|
|
@@ -165,18 +167,14 @@ export default defineComponent({
|
|
|
},
|
|
|
setup() {
|
|
|
const formRef = ref()
|
|
|
- // const reload: any = inject('reload')
|
|
|
- //const reload = inject("reload");
|
|
|
const columns = [
|
|
|
{
|
|
|
title: 'Id',
|
|
|
- name: 'Id',
|
|
|
dataIndex: 'id',
|
|
|
key: 'id',
|
|
|
},
|
|
|
{
|
|
|
title: '服务器名称',
|
|
|
- name: 'name',
|
|
|
dataIndex: 'name',
|
|
|
key: 'name',
|
|
|
},
|
|
@@ -192,68 +190,55 @@ export default defineComponent({
|
|
|
},
|
|
|
{
|
|
|
title: '下线地址',
|
|
|
- key: 'url1',
|
|
|
dataIndex: 'url1',
|
|
|
+ key: 'url1',
|
|
|
},
|
|
|
{
|
|
|
title: '恢复地址',
|
|
|
- key: 'url2',
|
|
|
dataIndex: 'url2',
|
|
|
+ key: 'url2',
|
|
|
},
|
|
|
- // {
|
|
|
- // title: '更新时间',
|
|
|
- // key: 'updateAt',
|
|
|
- // dataIndex:'updateAt',
|
|
|
- // },
|
|
|
- // {
|
|
|
- // title: '创建时间',
|
|
|
- // key: 'createAt',
|
|
|
- // dataIndex: 'createAt',
|
|
|
- // },
|
|
|
{
|
|
|
title: 'PING类型',
|
|
|
- key: 'pingType',
|
|
|
dataIndex: 'pingType',
|
|
|
+ key: 'pingType',
|
|
|
},
|
|
|
{
|
|
|
title: '切换地址状态',
|
|
|
- key: 'urlStatus',
|
|
|
dataIndex: 'urlStatus',
|
|
|
+ key: 'urlStatus',
|
|
|
},
|
|
|
{
|
|
|
title: '节点延迟',
|
|
|
- key: 'nodeMs',
|
|
|
dataIndex: 'nodeMs',
|
|
|
+ key: 'nodeMs',
|
|
|
},
|
|
|
{
|
|
|
title: 'url次数',
|
|
|
- key: 'urlCount',
|
|
|
dataIndex: 'urlCount',
|
|
|
+ key: 'urlCount',
|
|
|
},
|
|
|
{
|
|
|
title: 'url返回结果',
|
|
|
- key: 'urlRet',
|
|
|
dataIndex: 'urlRet',
|
|
|
+ key: 'urlRet',
|
|
|
},
|
|
|
{
|
|
|
title: '通知电报',
|
|
|
- key: 'isNotice',
|
|
|
dataIndex: 'isNotice',
|
|
|
+ key: 'isNotice',
|
|
|
},
|
|
|
{
|
|
|
title: '删除',
|
|
|
- key: 'delete',
|
|
|
dataIndex: 'delete',
|
|
|
- // slots: { customRender: 'delete' },
|
|
|
+ key: 'delete',
|
|
|
},
|
|
|
{
|
|
|
title: '编辑',
|
|
|
- key: 'edit',
|
|
|
dataIndex: 'edit',
|
|
|
- // slots: { customRender: 'edit' },
|
|
|
+ key: 'edit',
|
|
|
},
|
|
|
];
|
|
|
- let ids = ""
|
|
|
const state = reactive({
|
|
|
datalist : [] as NodeInfo[],
|
|
|
selectedTableRow: [] as INode[],
|
|
@@ -264,12 +249,11 @@ export default defineComponent({
|
|
|
|
|
|
const rowSelection = {
|
|
|
onChange: (selectedRowKeys: Key[], selectedRows) => {
|
|
|
- //第一个参数控制选不选中,第二个参数是选中列表的数据的集合
|
|
|
state.selectedTableRow = selectedRows
|
|
|
console.log(state.selectedTableRow);
|
|
|
},
|
|
|
getCheckboxProps: (record) => ({
|
|
|
- disabled: record.releaseState === "ONLINE", //控制禁用那个按钮
|
|
|
+ disabled: record.releaseState === "ONLINE",
|
|
|
releaseState: record.releaseState,
|
|
|
}),
|
|
|
};
|
|
@@ -298,90 +282,68 @@ export default defineComponent({
|
|
|
data.urlRet = node_list.data.nodeList[dataKey].Node.urlRet
|
|
|
data.urlCount = node_list.data.nodeList[dataKey].Node.urlCount
|
|
|
data.isNotice = node_list.data.nodeList[dataKey].Node.isNotice
|
|
|
- data.url1 = extractIpFromUrl(node_list.data.nodeList[dataKey].Node.url)
|
|
|
- data.url2 = extractIpFromUrl(node_list.data.nodeList[dataKey].Node.UrlRecover)
|
|
|
+ data.url1 = extractHostname(extractDomainAfterAmpersand(node_list.data.nodeList[dataKey].Node.url)) + ":" + extractIpFromUrl(node_list.data.nodeList[dataKey].Node.url)
|
|
|
+ data.url2 = extractHostname(extractDomainAfterAmpersand(node_list.data.nodeList[dataKey].Node.UrlRecover)) + ":" + extractIpFromUrl(node_list.data.nodeList[dataKey].Node.UrlRecover)
|
|
|
if (node_list.data.nodeList[dataKey].NodeConfig != null)
|
|
|
{
|
|
|
for (let nodeConfig of node_list.data.nodeList[dataKey].NodeConfig) {
|
|
|
- // data.Id = nodeConfig.Id;
|
|
|
data.Sshpassword = nodeConfig.Sshpassword;
|
|
|
data.Sshcommand = nodeConfig.Sshcommand;
|
|
|
data.Sshusername = nodeConfig.Sshusername;
|
|
|
}
|
|
|
state.datalist.push(data)
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
formState.isedit = false
|
|
|
console.log(formState.isedit)
|
|
|
console.log(state.datalist);
|
|
|
}
|
|
|
- // state.datalist = node_list.data.nodeList
|
|
|
- // }
|
|
|
|
|
|
const addNodeList = async (data) => {
|
|
|
-
|
|
|
let ret = await nodeAddReqUse(data)
|
|
|
-
|
|
|
if (ret.code == 0)
|
|
|
{
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = false
|
|
|
await getNodeList()
|
|
|
}
|
|
|
else {
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = true
|
|
|
-
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
const editNode = async (data) => {
|
|
|
-
|
|
|
let ret = await editNodeReqUse(data)
|
|
|
if (ret.code == 0)
|
|
|
{
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = false
|
|
|
await getNodeList()
|
|
|
}
|
|
|
else {
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = true
|
|
|
-
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
-
|
|
|
const delNodeById = async (data) => {
|
|
|
-
|
|
|
let ret = await delNodeReqUse(data)
|
|
|
if (ret.code == 0)
|
|
|
{
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = false
|
|
|
await getNodeList()
|
|
|
}
|
|
|
else {
|
|
|
- console.log(state.Visible);
|
|
|
state.Visible = true
|
|
|
-
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
onMounted(async () => {
|
|
|
try {
|
|
|
- state.loading = true; // Show loading spinner or message
|
|
|
+ state.loading = true;
|
|
|
await getNodeList();
|
|
|
} catch (error) {
|
|
|
console.error("Failed to fetch data:", error);
|
|
|
- // Handle errors, e.g., show an error message
|
|
|
} finally {
|
|
|
- state.loading = false; // Hide loading spinner or message
|
|
|
+ state.loading = false;
|
|
|
}
|
|
|
});
|
|
|
|
|
@@ -403,7 +365,6 @@ export default defineComponent({
|
|
|
isNotice:0
|
|
|
})
|
|
|
|
|
|
-
|
|
|
const rules = {
|
|
|
name: [
|
|
|
{ required: true, message: "输入服务器名称", trigger: "blur" },
|
|
@@ -455,7 +416,6 @@ export default defineComponent({
|
|
|
formState.isNotice = record.isNotice
|
|
|
formState.isedit = true
|
|
|
state.Visible = true
|
|
|
-
|
|
|
}
|
|
|
|
|
|
const showAddNode = () => {
|
|
@@ -474,11 +434,8 @@ export default defineComponent({
|
|
|
state.Visible = true;
|
|
|
}
|
|
|
const handleOk= () =>{
|
|
|
-
|
|
|
- //addNodeList(data.value)
|
|
|
state.Visible = false
|
|
|
}
|
|
|
- // 对话框的中的取消按钮
|
|
|
const cancel = () => {
|
|
|
state.loading = false
|
|
|
state.Visible = false
|
|
@@ -500,17 +457,39 @@ export default defineComponent({
|
|
|
})
|
|
|
}
|
|
|
|
|
|
-
|
|
|
function extractIpFromUrl(url: string): string | null {
|
|
|
const ipRegex = /(\b25[0-5]\b|\b2[0-4][0-9]\b|\b[0-1]?[0-9]?[0-9]\b)\.(\b25[0-5]\b|\b2[0-4][0-9]\b|\b[0-1]?[0-9]?[0-9]\b)\.(\b25[0-5]\b|\b2[0-4][0-9]\b|\b[0-1]?[0-9]?[0-9]\b)\.(\b25[0-5]\b|\b2[0-4][0-9]\b|\b[0-1]?[0-9]?[0-9]\b)/;
|
|
|
const match = url.match(ipRegex);
|
|
|
return match ? match[0] : null;
|
|
|
}
|
|
|
|
|
|
+ function extractHostname(queryString: string): string | null {
|
|
|
+ if (!queryString) {
|
|
|
+ return null;
|
|
|
+ }
|
|
|
|
|
|
+ const params = new URLSearchParams(queryString);
|
|
|
+ const hostname = params.get('hostname');
|
|
|
+ return hostname;
|
|
|
+ }
|
|
|
|
|
|
- return{
|
|
|
+ function extractDomainAfterAmpersand(url: string | null | undefined): string | null {
|
|
|
+ if (!url) {
|
|
|
+ return null;
|
|
|
+ }
|
|
|
|
|
|
+ const ampersandIndex = url.indexOf('?');
|
|
|
+ if (ampersandIndex === -1) {
|
|
|
+ return null;
|
|
|
+ }
|
|
|
+
|
|
|
+ const contentAfterAmpersand = url.substring(ampersandIndex + 1);
|
|
|
+ const domainRegex = /^(?:https?:\/\/)?(?:www\.)?([^\/]+)/;
|
|
|
+ const match = contentAfterAmpersand.match(domainRegex);
|
|
|
+ return match ? match[1] : null;
|
|
|
+ }
|
|
|
+
|
|
|
+ return{
|
|
|
onDeleteALlNode,
|
|
|
showAddNode,
|
|
|
handleOk,
|
|
@@ -534,5 +513,7 @@ export default defineComponent({
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-
|
|
|
+.custom-input-height {
|
|
|
+ height: 150px; /* 设置你需要的高度 */
|
|
|
+}
|
|
|
</style>
|