first commit
This commit is contained in:
cieanyau committed
commit
db5762abd4
687 files changed
+171307
No files matched your search
@@ -0,0 +1,744 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudNat.C1uXa4fX.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { onMounted } from "vue";
|
||||
import { useId } from "vue";
|
||||
import { onBeforeUnmount } from "vue";
|
||||
import { watch } from "vue";
|
||||
import { createBlock } from "vue";
|
||||
import { ref } from "vue";
|
||||
import { withCtx } from "vue";
|
||||
import { createCommentVNode } from "vue";
|
||||
import { computed } from "vue";
|
||||
import { reactive } from "vue";
|
||||
import { isRef } from "vue";
|
||||
import { createElementBlock } from "vue";
|
||||
import { Fragment } from "vue";
|
||||
import { createElementVNode } from "vue";
|
||||
import { createTextVNode } from "vue";
|
||||
import { unref } from "vue";
|
||||
import { defineComponent } from "vue";
|
||||
import { createVNode } from "vue";
|
||||
import { openBlock } from "vue";
|
||||
import { useApi } from "~/lib/auth.js";
|
||||
import dialog from "primevue/dialog";
|
||||
import button from "primevue/button";
|
||||
import { t as _plugin_vue_export_helper_t } from "~/lib/_plugin-vue_export-helper.js";
|
||||
import message from "primevue/message";
|
||||
import inputtext from "primevue/inputtext";
|
||||
import datatable from "primevue/datatable";
|
||||
import select from "primevue/select";
|
||||
import inputnumber from "primevue/inputnumber";
|
||||
import column from "primevue/column";
|
||||
import { a as cloud_instance_management_a } from "~/lib/cloud-instance-management.js";
|
||||
import { i as cloud_instance_management_i } from "~/lib/cloud-instance-management.js";
|
||||
var A = {
|
||||
class: `nat-panel network-section`,
|
||||
},
|
||||
j = {
|
||||
class: `network-head`,
|
||||
},
|
||||
M = {
|
||||
class: `network-heading`,
|
||||
},
|
||||
N = {
|
||||
key: 0,
|
||||
class: `network-count`,
|
||||
},
|
||||
ne = {
|
||||
class: `network-actions`,
|
||||
},
|
||||
re = {
|
||||
key: 0,
|
||||
class: `muted`,
|
||||
},
|
||||
ie = {
|
||||
class: `form`,
|
||||
},
|
||||
ae = [`for`],
|
||||
P = [`for`],
|
||||
F = [`for`],
|
||||
I = [`for`],
|
||||
L = [`for`],
|
||||
R = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudNat`,
|
||||
props: {
|
||||
hostId: {},
|
||||
module: {},
|
||||
kind: {},
|
||||
limit: {},
|
||||
active: {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
setup(_) {
|
||||
let C = _,
|
||||
R = useApi(),
|
||||
z = useId(),
|
||||
B = ref([]),
|
||||
V = ref(!1),
|
||||
H = ref(!1),
|
||||
U = ref(``),
|
||||
W = ref(``),
|
||||
G = ref(!1),
|
||||
K = ref(null),
|
||||
q = reactive({
|
||||
name: ``,
|
||||
domain: ``,
|
||||
int_port: 80,
|
||||
ext_port: null,
|
||||
protocol: 1,
|
||||
}),
|
||||
J = computed(() => (C.kind === `acl` ? `NAT 转发` : `NAT 建站`)),
|
||||
Y = computed(
|
||||
() =>
|
||||
cloud_instance_management_i(C.module) && Number(C.limit) > 0,
|
||||
),
|
||||
X = computed(() => `/${C.module}/${C.hostId}/nat_${C.kind}`),
|
||||
Z = 0,
|
||||
Q = !1;
|
||||
async function $() {
|
||||
let e = ++Z,
|
||||
t = X.value;
|
||||
if (((V.value = !0), (U.value = ``), !Y.value)) {
|
||||
((B.value = []), (V.value = !1));
|
||||
return;
|
||||
}
|
||||
try {
|
||||
let n = await R.get(t);
|
||||
if (Q || e !== Z) return;
|
||||
if (!Array.isArray(n.list))
|
||||
throw Error(`${J.value}列表无效，请重试`);
|
||||
B.value = n.list;
|
||||
} catch (t) {
|
||||
!Q &&
|
||||
e === Z &&
|
||||
(U.value = t instanceof Error ? t.message : `加载失败`);
|
||||
} finally {
|
||||
!Q && e === Z && (V.value = !1);
|
||||
}
|
||||
}
|
||||
function oe() {
|
||||
!Y.value ||
|
||||
!C.active ||
|
||||
H.value ||
|
||||
V.value ||
|
||||
U.value ||
|
||||
B.value.length >= C.limit ||
|
||||
(Object.assign(q, {
|
||||
name: ``,
|
||||
domain: ``,
|
||||
int_port: 80,
|
||||
ext_port: null,
|
||||
protocol: 1,
|
||||
}),
|
||||
(W.value = ``),
|
||||
(G.value = !0));
|
||||
}
|
||||
async function se() {
|
||||
if (
|
||||
Q ||
|
||||
H.value ||
|
||||
!G.value ||
|
||||
!Y.value ||
|
||||
!C.active ||
|
||||
V.value ||
|
||||
U.value ||
|
||||
B.value.length >= C.limit
|
||||
)
|
||||
return;
|
||||
W.value = ``;
|
||||
let e;
|
||||
try {
|
||||
e = cloud_instance_management_a(C.kind, q);
|
||||
} catch (e) {
|
||||
W.value = e.message;
|
||||
return;
|
||||
}
|
||||
let t = X.value,
|
||||
n = Z;
|
||||
H.value = !0;
|
||||
try {
|
||||
if ((await R.post(t, e), Q || n !== Z)) return;
|
||||
((G.value = !1), await $());
|
||||
} catch (e) {
|
||||
!Q &&
|
||||
t === X.value &&
|
||||
(W.value = e instanceof Error ? e.message : `创建失败`);
|
||||
} finally {
|
||||
!Q && t === X.value && (H.value = !1);
|
||||
}
|
||||
}
|
||||
async function ce() {
|
||||
let e = K.value;
|
||||
if (
|
||||
!e ||
|
||||
H.value ||
|
||||
!Y.value ||
|
||||
!C.active ||
|
||||
!B.value.some((t) => t.id === e.id)
|
||||
)
|
||||
return;
|
||||
let t = X.value,
|
||||
n = C.kind,
|
||||
r = Z;
|
||||
((H.value = !0), (W.value = ``));
|
||||
try {
|
||||
if (
|
||||
(await R.del(t, {
|
||||
[`nat_${n}_id`]: e.id,
|
||||
}),
|
||||
Q || r !== Z)
|
||||
)
|
||||
return;
|
||||
((K.value = null), await $());
|
||||
} catch (e) {
|
||||
!Q &&
|
||||
t === X.value &&
|
||||
(W.value = e instanceof Error ? e.message : `删除失败`);
|
||||
} finally {
|
||||
!Q && t === X.value && (H.value = !1);
|
||||
}
|
||||
}
|
||||
return (
|
||||
watch(
|
||||
() => [C.hostId, C.module, C.kind, C.limit],
|
||||
() => {
|
||||
((G.value = !1),
|
||||
(K.value = null),
|
||||
(H.value = !1),
|
||||
(B.value = []),
|
||||
$());
|
||||
},
|
||||
),
|
||||
onMounted($),
|
||||
onBeforeUnmount(() => {
|
||||
((Q = !0), Z++);
|
||||
}),
|
||||
(t, n) => {
|
||||
let r = button,
|
||||
i = message,
|
||||
o = column,
|
||||
l = datatable,
|
||||
u = inputtext,
|
||||
b = select,
|
||||
C = inputnumber,
|
||||
O = dialog;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`section`, A, [
|
||||
createElementVNode(`div`, j, [
|
||||
createElementVNode(`div`, M, [
|
||||
createElementVNode(
|
||||
`h4`,
|
||||
null,
|
||||
toDisplayString(unref(J)),
|
||||
1,
|
||||
),
|
||||
unref(Y)
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
N,
|
||||
toDisplayString(unref(B).length) +
|
||||
`/` +
|
||||
toDisplayString(_.limit),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
createElementVNode(`div`, ne, [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `创建${unref(J)}`,
|
||||
icon: `pi pi-plus`,
|
||||
size: `small`,
|
||||
disabled:
|
||||
!unref(Y) ||
|
||||
!_.active ||
|
||||
unref(H) ||
|
||||
unref(V) ||
|
||||
!!unref(U) ||
|
||||
unref(B).length >= _.limit,
|
||||
onClick: oe,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`label`, `disabled`],
|
||||
),
|
||||
unref(Y)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
r,
|
||||
{
|
||||
key: 0,
|
||||
label: `刷新`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
loading: unref(V),
|
||||
disabled: unref(H),
|
||||
onClick: $,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
unref(Y)
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
re,
|
||||
`当前实例未开通` + toDisplayString(unref(J)) + `能力。`,
|
||||
1,
|
||||
)),
|
||||
unref(U)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 1,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(U)), 1),
|
||||
createVNode(r, {
|
||||
label: `重试`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
onClick: $,
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(Y)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
l,
|
||||
{
|
||||
key: 2,
|
||||
class: `network-table`,
|
||||
value: unref(B),
|
||||
loading: unref(V),
|
||||
size: `small`,
|
||||
scrollable: ``,
|
||||
},
|
||||
{
|
||||
empty: withCtx(() => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
null,
|
||||
`暂无` + toDisplayString(unref(J)) + `记录`,
|
||||
1,
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createVNode(
|
||||
o,
|
||||
{
|
||||
field: _.kind === `acl` ? `name` : `domain`,
|
||||
header: _.kind === `acl` ? `名称` : `域名`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`field`, `header`],
|
||||
),
|
||||
_.kind === `acl`
|
||||
? (openBlock(),
|
||||
createBlock(o, {
|
||||
key: 0,
|
||||
field: `ip`,
|
||||
header: `外网地址与端口`,
|
||||
}))
|
||||
: (openBlock(),
|
||||
createBlock(o, {
|
||||
key: 1,
|
||||
field: `ext_port`,
|
||||
header: `外部端口`,
|
||||
})),
|
||||
createVNode(o, {
|
||||
field: `int_port`,
|
||||
header: `内部端口`,
|
||||
}),
|
||||
_.kind === `acl`
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
o,
|
||||
{
|
||||
key: 2,
|
||||
header: `协议`,
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createTextVNode(
|
||||
toDisplayString(
|
||||
{
|
||||
1: `TCP`,
|
||||
2: `UDP`,
|
||||
3: `TCP + UDP`,
|
||||
}[t.protocol] || `—`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
o,
|
||||
{
|
||||
header: `操作`,
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: e }) => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `删除`,
|
||||
text: ``,
|
||||
severity: `danger`,
|
||||
size: `small`,
|
||||
disabled: unref(H) || !_.active,
|
||||
onClick: (t) => {
|
||||
((K.value = e), (W.value = ``));
|
||||
},
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`, `onClick`],
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`value`, `loading`],
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
O,
|
||||
{
|
||||
visible: unref(G),
|
||||
"onUpdate:visible": (n[6] ||= (e) =>
|
||||
isRef(G) ? (G.value = e) : null),
|
||||
header: `创建${unref(J)}`,
|
||||
modal: ``,
|
||||
closable: !unref(H),
|
||||
"close-on-escape": !unref(H),
|
||||
style: {
|
||||
width: `460px`,
|
||||
},
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(H),
|
||||
onClick: (n[5] ||= (e) => (G.value = !1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `创建`,
|
||||
loading: unref(H),
|
||||
onClick: se,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(`div`, ie, [
|
||||
_.kind === `acl`
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
{
|
||||
key: 0,
|
||||
},
|
||||
[
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(z)}-name`,
|
||||
},
|
||||
`转发名称`,
|
||||
8,
|
||||
ae,
|
||||
),
|
||||
createVNode(
|
||||
u,
|
||||
{
|
||||
id: `${unref(z)}-name`,
|
||||
modelValue: unref(q).name,
|
||||
"onUpdate:modelValue": (n[0] ||= (e) =>
|
||||
(unref(q).name = e)),
|
||||
disabled: unref(H),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`id`, `modelValue`, `disabled`],
|
||||
),
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(z)}-protocol`,
|
||||
},
|
||||
`协议`,
|
||||
8,
|
||||
P,
|
||||
),
|
||||
createVNode(
|
||||
b,
|
||||
{
|
||||
"input-id": `${unref(z)}-protocol`,
|
||||
modelValue: unref(q).protocol,
|
||||
"onUpdate:modelValue": (n[1] ||= (e) =>
|
||||
(unref(q).protocol = e)),
|
||||
options: [
|
||||
{
|
||||
label: `TCP`,
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: `UDP`,
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: `TCP + UDP`,
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
"option-label": `label`,
|
||||
"option-value": `value`,
|
||||
disabled: unref(H),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`input-id`, `modelValue`, `disabled`],
|
||||
),
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(z)}-ext`,
|
||||
},
|
||||
`外部端口（留空自动分配）`,
|
||||
8,
|
||||
F,
|
||||
),
|
||||
createVNode(
|
||||
C,
|
||||
{
|
||||
"input-id": `${unref(z)}-ext`,
|
||||
modelValue: unref(q).ext_port,
|
||||
"onUpdate:modelValue": (n[2] ||= (e) =>
|
||||
(unref(q).ext_port = e)),
|
||||
min: 0,
|
||||
max: 65535,
|
||||
"use-grouping": !1,
|
||||
disabled: unref(H),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`input-id`, `modelValue`, `disabled`],
|
||||
),
|
||||
],
|
||||
64,
|
||||
))
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
{
|
||||
key: 1,
|
||||
},
|
||||
[
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(z)}-domain`,
|
||||
},
|
||||
`域名`,
|
||||
8,
|
||||
I,
|
||||
),
|
||||
createVNode(
|
||||
u,
|
||||
{
|
||||
id: `${unref(z)}-domain`,
|
||||
modelValue: unref(q).domain,
|
||||
"onUpdate:modelValue": (n[3] ||= (e) =>
|
||||
(unref(q).domain = e)),
|
||||
placeholder: `example.com`,
|
||||
disabled: unref(H),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`id`, `modelValue`, `disabled`],
|
||||
),
|
||||
],
|
||||
64,
|
||||
)),
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(z)}-int`,
|
||||
},
|
||||
`内部端口`,
|
||||
8,
|
||||
L,
|
||||
),
|
||||
createVNode(
|
||||
C,
|
||||
{
|
||||
"input-id": `${unref(z)}-int`,
|
||||
modelValue: unref(q).int_port,
|
||||
"onUpdate:modelValue": (n[4] ||= (e) =>
|
||||
(unref(q).int_port = e)),
|
||||
min: 1,
|
||||
max: 65535,
|
||||
"use-grouping": !1,
|
||||
disabled: unref(H),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`input-id`, `modelValue`, `disabled`],
|
||||
),
|
||||
unref(W)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 2,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(
|
||||
toDisplayString(unref(W)),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `header`, `closable`, `close-on-escape`],
|
||||
),
|
||||
createVNode(
|
||||
O,
|
||||
{
|
||||
visible: !!unref(K),
|
||||
header: `删除${unref(J)}`,
|
||||
modal: ``,
|
||||
closable: !unref(H),
|
||||
"close-on-escape": !unref(H),
|
||||
"onUpdate:visible": (n[8] ||= (e) => {
|
||||
!e && !unref(H) && (K.value = null);
|
||||
}),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(H),
|
||||
onClick: (n[7] ||= (e) => (K.value = null)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `确认删除`,
|
||||
severity: `danger`,
|
||||
loading: unref(H),
|
||||
onClick: ce,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
`确认删除 ` +
|
||||
toDisplayString(
|
||||
unref(K)?.domain || unref(K)?.name,
|
||||
) +
|
||||
`？相关访问规则将立即失效。`,
|
||||
1,
|
||||
),
|
||||
unref(W)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(W)), 1),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `header`, `closable`, `close-on-escape`],
|
||||
),
|
||||
])
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-1ff078ab`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudNat`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default R;
|
||||
</script>
|
||||
Reference in new issue
Block a user