first commit
This commit is contained in:
cieanyau committed
commit
db5762abd4
687 files changed
+171307
No files matched your search
@@ -0,0 +1,511 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudDefence.B2vl5Yip.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 { isRef } from "vue";
|
||||
import { createElementBlock } 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 select from "primevue/select";
|
||||
import { n as cloud_instance_management_n } from "~/lib/cloud-instance-management.js";
|
||||
import { s as cloud_instance_management_s } from "~/lib/cloud-instance-management.js";
|
||||
import { t as cloud_instance_management_t } from "~/lib/cloud-instance-management.js";
|
||||
var E = {
|
||||
class: `defence network-section`,
|
||||
},
|
||||
D = {
|
||||
class: `network-head`,
|
||||
},
|
||||
O = {
|
||||
class: `network-actions`,
|
||||
},
|
||||
te = {
|
||||
key: 0,
|
||||
},
|
||||
ne = {
|
||||
key: 1,
|
||||
class: `muted`,
|
||||
},
|
||||
re = {
|
||||
key: 2,
|
||||
class: `muted`,
|
||||
},
|
||||
ie = {
|
||||
key: 3,
|
||||
class: `muted`,
|
||||
},
|
||||
ae = {
|
||||
key: 4,
|
||||
class: `muted`,
|
||||
},
|
||||
oe = {
|
||||
class: `form`,
|
||||
},
|
||||
se = {
|
||||
key: 0,
|
||||
},
|
||||
k = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudDefence`,
|
||||
props: {
|
||||
hostId: {},
|
||||
module: {},
|
||||
ips: {},
|
||||
active: {
|
||||
type: Boolean,
|
||||
},
|
||||
upgradeAllowed: {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
emits: [`pay`],
|
||||
setup(h, { emit: b }) {
|
||||
let k = h,
|
||||
ce = b,
|
||||
A = useApi(),
|
||||
le = useId(),
|
||||
j = ref(k.ips[0] ?? ``),
|
||||
M = ref(``),
|
||||
N = ref(``),
|
||||
P = ref([]),
|
||||
F = ref(!1),
|
||||
I = ref(!1),
|
||||
L = ref(``),
|
||||
R = ref(``),
|
||||
z = ref(!1),
|
||||
B = ref(!1),
|
||||
V = ref(``),
|
||||
H = ref(``),
|
||||
U = computed(() =>
|
||||
JSON.stringify([
|
||||
k.hostId,
|
||||
k.module,
|
||||
j.value,
|
||||
M.value,
|
||||
z.value,
|
||||
k.upgradeAllowed,
|
||||
]),
|
||||
),
|
||||
W = ref(``),
|
||||
G = computed(() =>
|
||||
P.value.filter((e) => String(e.value) !== String(N.value)),
|
||||
),
|
||||
K = computed(
|
||||
() =>
|
||||
!!W.value &&
|
||||
W.value === U.value &&
|
||||
!B.value &&
|
||||
!I.value &&
|
||||
k.upgradeAllowed &&
|
||||
k.active &&
|
||||
G.value.some((e) => String(e.value) === String(M.value)),
|
||||
),
|
||||
q = 0,
|
||||
J = 0,
|
||||
Y = 0,
|
||||
X = !1;
|
||||
function Z() {
|
||||
(J++,
|
||||
(W.value = ``),
|
||||
(V.value = ``),
|
||||
(H.value = ``),
|
||||
(B.value = !1));
|
||||
}
|
||||
watch(U, Z, {
|
||||
flush: `sync`,
|
||||
});
|
||||
async function Q() {
|
||||
let e = ++q,
|
||||
t = j.value,
|
||||
n = k.hostId,
|
||||
r = k.module;
|
||||
if (
|
||||
((P.value = []),
|
||||
(L.value = ``),
|
||||
(F.value = !0),
|
||||
(N.value = ``),
|
||||
Z(),
|
||||
!t)
|
||||
) {
|
||||
F.value = !1;
|
||||
return;
|
||||
}
|
||||
try {
|
||||
let i = await A.get(`/${r}/${n}/upgrade_defence_config`, {
|
||||
ip: t,
|
||||
});
|
||||
if (X || e !== q) return;
|
||||
let a = cloud_instance_management_n(i);
|
||||
((P.value = a.options), (N.value = a.current));
|
||||
} catch (t) {
|
||||
!X &&
|
||||
e === q &&
|
||||
(L.value = t instanceof Error ? t.message : `加载防御配置失败`);
|
||||
} finally {
|
||||
!X && e === q && (F.value = !1);
|
||||
}
|
||||
}
|
||||
function ue() {
|
||||
k.upgradeAllowed &&
|
||||
k.active &&
|
||||
!I.value &&
|
||||
!F.value &&
|
||||
G.value.length &&
|
||||
((M.value = ``), (R.value = ``), (z.value = !0));
|
||||
}
|
||||
async function $() {
|
||||
if (
|
||||
(Z(),
|
||||
!z.value ||
|
||||
!k.upgradeAllowed ||
|
||||
!G.value.some((e) => String(e.value) === String(M.value)))
|
||||
)
|
||||
return;
|
||||
let e = ++J,
|
||||
t = U.value;
|
||||
((B.value = !0), (R.value = ``));
|
||||
try {
|
||||
let n = await A.get(
|
||||
`/${k.module}/${k.hostId}/upgrade_defence/price`,
|
||||
{
|
||||
ip: j.value,
|
||||
peak_defence: M.value,
|
||||
},
|
||||
);
|
||||
if (X || e !== J || t !== U.value) return;
|
||||
((V.value = cloud_instance_management_t(n.price)),
|
||||
(H.value = String(n.renew_price_difference ?? ``)),
|
||||
(W.value = t));
|
||||
} catch (t) {
|
||||
!X &&
|
||||
e === J &&
|
||||
(R.value = t instanceof Error ? t.message : `报价失败`);
|
||||
} finally {
|
||||
!X && e === J && (B.value = !1);
|
||||
}
|
||||
}
|
||||
async function de() {
|
||||
if (!K.value || X) return;
|
||||
let e = U.value,
|
||||
t = V.value,
|
||||
n = ++Y;
|
||||
((I.value = !0), (R.value = ``));
|
||||
try {
|
||||
let n = await A.post(
|
||||
`/${k.module}/${k.hostId}/upgrade_defence/order`,
|
||||
{
|
||||
ip: j.value,
|
||||
peak_defence: M.value,
|
||||
},
|
||||
);
|
||||
if (X || e !== U.value) return;
|
||||
let r = cloud_instance_management_s(n.id);
|
||||
((z.value = !1),
|
||||
ce(`pay`, {
|
||||
order_id: r,
|
||||
amount:
|
||||
n.amount == null
|
||||
? t
|
||||
: cloud_instance_management_t(n.amount),
|
||||
}));
|
||||
} catch (t) {
|
||||
!X &&
|
||||
e === U.value &&
|
||||
(R.value = t instanceof Error ? t.message : `创建订单失败`);
|
||||
} finally {
|
||||
!X && n === Y && (I.value = !1);
|
||||
}
|
||||
}
|
||||
return (
|
||||
watch(j, () => {
|
||||
((z.value = !1), Q());
|
||||
}),
|
||||
watch(
|
||||
() => [k.hostId, k.module, k.ips.join(`,`)],
|
||||
() => {
|
||||
(Y++,
|
||||
(z.value = !1),
|
||||
(I.value = !1),
|
||||
(j.value = k.ips.includes(j.value)
|
||||
? j.value
|
||||
: (k.ips[0] ?? ``)),
|
||||
Q());
|
||||
},
|
||||
),
|
||||
onMounted(Q),
|
||||
onBeforeUnmount(() => {
|
||||
((X = !0), q++, Z());
|
||||
}),
|
||||
(t, n) => {
|
||||
let r = select,
|
||||
i = button,
|
||||
o = message,
|
||||
l = dialog;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`section`, E, [
|
||||
createElementVNode(`div`, D, [
|
||||
(n[4] ||= createElementVNode(`h4`, null, `每 IP 防御`, -1)),
|
||||
createElementVNode(`div`, O, [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
class: `defence-ip`,
|
||||
modelValue: unref(j),
|
||||
"onUpdate:modelValue": (n[0] ||= (e) =>
|
||||
isRef(j) ? (j.value = e) : null),
|
||||
options: h.ips,
|
||||
"input-id": `${unref(le)}-ip`,
|
||||
"aria-label": `防御 IP`,
|
||||
disabled: unref(I) || !h.ips.length,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`modelValue`, `options`, `input-id`, `disabled`],
|
||||
),
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
label: `刷新`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
loading: unref(F),
|
||||
disabled: unref(I),
|
||||
onClick: Q,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
label: `调整防御`,
|
||||
size: `small`,
|
||||
disabled:
|
||||
!h.upgradeAllowed ||
|
||||
!h.active ||
|
||||
unref(I) ||
|
||||
unref(F) ||
|
||||
!unref(G).length,
|
||||
onClick: ue,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
]),
|
||||
]),
|
||||
unref(N) === ``
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
te,
|
||||
`当前防御：` + toDisplayString(unref(N)) + ` Gbps`,
|
||||
1,
|
||||
)),
|
||||
h.ips.length
|
||||
? !unref(F) && !unref(L) && !unref(P).length
|
||||
? (openBlock(),
|
||||
createElementBlock(`p`, re, `当前 IP 未开放防御调整。`))
|
||||
: !unref(F) && !unref(L) && !unref(G).length
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
ie,
|
||||
`当前 IP 没有其他可选防御档位。`,
|
||||
))
|
||||
: createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
ne,
|
||||
`暂无可调整防御的 IP 地址。`,
|
||||
)),
|
||||
h.upgradeAllowed
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(`p`, ae, `当前实例不允许升降级。`)),
|
||||
unref(L)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
o,
|
||||
{
|
||||
key: 5,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(L)), 1),
|
||||
createVNode(i, {
|
||||
label: `重试`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
onClick: Q,
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
l,
|
||||
{
|
||||
visible: unref(z),
|
||||
"onUpdate:visible": (n[3] ||= (e) =>
|
||||
isRef(z) ? (z.value = e) : null),
|
||||
header: `调整 IP 防御`,
|
||||
modal: ``,
|
||||
closable: !unref(I),
|
||||
"close-on-escape": !unref(I),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(I),
|
||||
onClick: (n[2] ||= (e) => (z.value = !1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
label: `创建订单`,
|
||||
loading: unref(I),
|
||||
disabled: !unref(K),
|
||||
onClick: de,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(`div`, oe, [
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
toDisplayString(unref(j)),
|
||||
1,
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
modelValue: unref(M),
|
||||
"onUpdate:modelValue": (n[1] ||= (e) =>
|
||||
isRef(M) ? (M.value = e) : null),
|
||||
options: unref(G),
|
||||
"option-label": `desc`,
|
||||
"option-value": `value`,
|
||||
"aria-label": `目标防御峰值`,
|
||||
disabled: unref(I),
|
||||
onChange: $,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`modelValue`, `options`, `disabled`],
|
||||
),
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
`本次费用：` +
|
||||
toDisplayString(
|
||||
unref(B)
|
||||
? `正在计算…`
|
||||
: unref(V) === ``
|
||||
? `待确认`
|
||||
: `¥${unref(V)}`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
unref(H) === ``
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
se,
|
||||
`续费差价：¥` + toDisplayString(unref(H)),
|
||||
1,
|
||||
)),
|
||||
unref(R)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
o,
|
||||
{
|
||||
key: 1,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(
|
||||
toDisplayString(unref(R)),
|
||||
1,
|
||||
),
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
label: `重新报价`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
disabled: unref(I),
|
||||
onClick: $,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `closable`, `close-on-escape`],
|
||||
),
|
||||
])
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-b0c2bd86`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudDefence`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default k;
|
||||
</script>
|
||||
@@ -0,0 +1,726 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudIps.jhFnuvcs.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { onMounted } 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 datatable from "primevue/datatable";
|
||||
import inputnumber from "primevue/inputnumber";
|
||||
import column from "primevue/column";
|
||||
import OperationNotice from "~/components/OperationNotice.vue";
|
||||
import { i as cloud_instance_management_i } from "~/lib/cloud-instance-management.js";
|
||||
import { s as cloud_instance_management_s } from "~/lib/cloud-instance-management.js";
|
||||
import { t as cloud_instance_management_t } from "~/lib/cloud-instance-management.js";
|
||||
var ce = {
|
||||
class: `ips`,
|
||||
},
|
||||
C = {
|
||||
class: `ips-head network-head`,
|
||||
},
|
||||
w = {
|
||||
class: `ips-title`,
|
||||
},
|
||||
T = {
|
||||
key: 0,
|
||||
class: `count`,
|
||||
},
|
||||
E = {
|
||||
class: `network-actions`,
|
||||
},
|
||||
le = {
|
||||
class: `col-mono`,
|
||||
},
|
||||
ue = {
|
||||
class: `col-mono`,
|
||||
},
|
||||
de = {
|
||||
class: `col-mono`,
|
||||
},
|
||||
fe = {
|
||||
class: `ipv6-group`,
|
||||
},
|
||||
pe = {
|
||||
class: `ips-title ipv6-title`,
|
||||
},
|
||||
me = {
|
||||
key: 0,
|
||||
class: `count`,
|
||||
},
|
||||
he = {
|
||||
class: `col-mono`,
|
||||
},
|
||||
ge = {
|
||||
class: `dlg`,
|
||||
},
|
||||
_e = {
|
||||
class: `form-row`,
|
||||
},
|
||||
ve = {
|
||||
class: `form-row`,
|
||||
},
|
||||
ye = {
|
||||
class: `quote`,
|
||||
},
|
||||
be = {
|
||||
class: `quote-value`,
|
||||
},
|
||||
D = {
|
||||
key: 0,
|
||||
class: `pi pi-spin pi-spinner`,
|
||||
},
|
||||
O = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudIps`,
|
||||
props: {
|
||||
hostId: {},
|
||||
module: {
|
||||
default: `mf_cloud`,
|
||||
},
|
||||
upgradeAllowed: {
|
||||
type: Boolean,
|
||||
default: !0,
|
||||
},
|
||||
},
|
||||
emits: [`pay`, `addresses`],
|
||||
setup(h, { emit: b }) {
|
||||
let O = h,
|
||||
k = b,
|
||||
A = useApi(),
|
||||
j = ref(``),
|
||||
M = ref([]),
|
||||
N = ref([]),
|
||||
P = ref(!1),
|
||||
F = ref(``),
|
||||
I = ref(``),
|
||||
L = 0,
|
||||
R = 0,
|
||||
z = 0,
|
||||
B = !1;
|
||||
async function V() {
|
||||
let e = ++L,
|
||||
t = `/${O.module}/${O.hostId}`;
|
||||
((P.value = !0), (F.value = ``), (I.value = ``));
|
||||
async function n(n) {
|
||||
let r = [],
|
||||
i = 1;
|
||||
for (;;) {
|
||||
let a = await A.get(`${t}/${n}`, {
|
||||
page: i,
|
||||
limit: 100,
|
||||
});
|
||||
if (B || e !== L) return null;
|
||||
if (!Array.isArray(a.list)) throw Error(`地址列表无效，请重试`);
|
||||
if (
|
||||
(r.push(...a.list),
|
||||
a.count === void 0
|
||||
? a.list.length < 100
|
||||
: r.length >= Number(a.count))
|
||||
)
|
||||
return r;
|
||||
if (!a.list.length) throw Error(`地址列表不完整，请重试`);
|
||||
i++;
|
||||
}
|
||||
}
|
||||
(await Promise.allSettled([
|
||||
n(`ip`)
|
||||
.then((e) => {
|
||||
e &&
|
||||
((M.value = e),
|
||||
k(`addresses`, e.map((e) => e.ip).filter(Boolean)));
|
||||
})
|
||||
.catch((t) => {
|
||||
!B &&
|
||||
e === L &&
|
||||
(F.value =
|
||||
t instanceof Error ? t.message : `IPv4 加载失败`);
|
||||
}),
|
||||
...(cloud_instance_management_i(O.module)
|
||||
? [
|
||||
n(`ipv6`)
|
||||
.then((e) => {
|
||||
e && (N.value = e);
|
||||
})
|
||||
.catch((t) => {
|
||||
!B &&
|
||||
e === L &&
|
||||
(I.value =
|
||||
t instanceof Error ? t.message : `IPv6 加载失败`);
|
||||
}),
|
||||
]
|
||||
: []),
|
||||
]),
|
||||
!B && e === L && (P.value = !1));
|
||||
}
|
||||
let H = ref(!1),
|
||||
U = ref(!1),
|
||||
W = ref(``),
|
||||
G = reactive({
|
||||
ip_num: 1,
|
||||
ipv6_num: 0,
|
||||
}),
|
||||
K = ref(``),
|
||||
q = ref(!1),
|
||||
J = ref(``),
|
||||
Y = computed(() =>
|
||||
JSON.stringify([
|
||||
O.hostId,
|
||||
O.module,
|
||||
O.upgradeAllowed,
|
||||
H.value,
|
||||
G,
|
||||
]),
|
||||
),
|
||||
X = computed(
|
||||
() =>
|
||||
Number.isInteger(G.ip_num) &&
|
||||
G.ip_num >= 0 &&
|
||||
Number.isInteger(G.ipv6_num) &&
|
||||
G.ipv6_num >= 0 &&
|
||||
G.ip_num + G.ipv6_num > 0,
|
||||
),
|
||||
Z = computed(
|
||||
() =>
|
||||
O.upgradeAllowed !== !1 &&
|
||||
H.value &&
|
||||
X.value &&
|
||||
!!J.value &&
|
||||
J.value === Y.value &&
|
||||
!q.value &&
|
||||
!U.value,
|
||||
);
|
||||
function Q() {
|
||||
(R++, (K.value = ``), (J.value = ``), (q.value = !1));
|
||||
}
|
||||
watch(Y, Q, {
|
||||
flush: `sync`,
|
||||
});
|
||||
async function xe() {
|
||||
O.upgradeAllowed !== !1 &&
|
||||
!U.value &&
|
||||
cloud_instance_management_i(O.module) &&
|
||||
((G.ip_num = 1),
|
||||
(G.ipv6_num = 0),
|
||||
(W.value = ``),
|
||||
(H.value = !0),
|
||||
await $());
|
||||
}
|
||||
async function $() {
|
||||
if ((Q(), O.upgradeAllowed === !1 || !H.value || !X.value)) return;
|
||||
let e = ++R,
|
||||
t = Y.value;
|
||||
((q.value = !0), (W.value = ``));
|
||||
try {
|
||||
let n = await A.get(`/${O.module}/${O.hostId}/ip_num`, {
|
||||
ip_num: G.ip_num,
|
||||
ipv6_num: G.ipv6_num,
|
||||
});
|
||||
if (B || e !== R || t !== Y.value) return;
|
||||
((K.value = cloud_instance_management_t(n.price)), (J.value = t));
|
||||
} catch (t) {
|
||||
!B &&
|
||||
e === R &&
|
||||
(W.value = t instanceof Error ? t.message : `询价失败`);
|
||||
} finally {
|
||||
!B && e === R && (q.value = !1);
|
||||
}
|
||||
}
|
||||
async function Se() {
|
||||
if (!Z.value || B) return;
|
||||
let e = Y.value,
|
||||
t = K.value,
|
||||
n = ++z;
|
||||
((U.value = !0), (W.value = ``), (j.value = ``));
|
||||
try {
|
||||
let n = await A.post(`/${O.module}/${O.hostId}/ip_num/order`, {
|
||||
ip_num: G.ip_num,
|
||||
ipv6_num: G.ipv6_num,
|
||||
});
|
||||
if (B || e !== Y.value) return;
|
||||
let r = cloud_instance_management_s(n.id);
|
||||
((H.value = !1),
|
||||
k(`pay`, {
|
||||
order_id: r,
|
||||
amount: t,
|
||||
}));
|
||||
} catch (t) {
|
||||
!B &&
|
||||
e === Y.value &&
|
||||
(W.value = t instanceof Error ? t.message : `下单失败`);
|
||||
} finally {
|
||||
!B && n === z && (U.value = !1);
|
||||
}
|
||||
}
|
||||
return (
|
||||
onMounted(V),
|
||||
watch(
|
||||
() => [O.hostId, O.module],
|
||||
() => {
|
||||
(z++,
|
||||
(H.value = !1),
|
||||
(U.value = !1),
|
||||
(M.value = []),
|
||||
(N.value = []),
|
||||
V());
|
||||
},
|
||||
),
|
||||
onBeforeUnmount(() => {
|
||||
((B = !0), L++, Q());
|
||||
}),
|
||||
(t, n) => {
|
||||
let r = OperationNotice,
|
||||
a = button,
|
||||
c = message,
|
||||
l = column,
|
||||
v = datatable,
|
||||
b = inputnumber,
|
||||
x = dialog;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`div`, ce, [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
message: unref(j),
|
||||
severity: `error`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`message`],
|
||||
),
|
||||
createElementVNode(`div`, C, [
|
||||
createElementVNode(`div`, w, [
|
||||
(n[4] ||= createTextVNode(`IP 列表`, -1)),
|
||||
unref(M).length
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
T,
|
||||
`（` + toDisplayString(unref(M).length) + `）`,
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
createElementVNode(`div`, E, [
|
||||
h.upgradeAllowed === !1
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createBlock(a, {
|
||||
key: 0,
|
||||
label: `购买附加 IP`,
|
||||
icon: `pi pi-plus`,
|
||||
size: `small`,
|
||||
onClick: xe,
|
||||
})),
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
label: `刷新地址`,
|
||||
icon: `pi pi-refresh`,
|
||||
size: `small`,
|
||||
text: ``,
|
||||
loading: unref(P),
|
||||
onClick: V,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
]),
|
||||
unref(F)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
c,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(F)), 1),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
v,
|
||||
{
|
||||
class: `network-table ipv4-table`,
|
||||
value: unref(M),
|
||||
loading: unref(P),
|
||||
size: `small`,
|
||||
scrollable: ``,
|
||||
},
|
||||
{
|
||||
empty: withCtx(() => [
|
||||
...(n[5] ||= [
|
||||
createElementVNode(
|
||||
`div`,
|
||||
{
|
||||
class: `empty`,
|
||||
},
|
||||
`暂无 IP 信息`,
|
||||
-1,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createVNode(
|
||||
l,
|
||||
{
|
||||
field: `ip`,
|
||||
header: `IP 地址`,
|
||||
style: {
|
||||
width: `40%`,
|
||||
},
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
le,
|
||||
toDisplayString(t.ip),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
createVNode(
|
||||
l,
|
||||
{
|
||||
field: `subnet_mask`,
|
||||
header: `子网掩码`,
|
||||
style: {
|
||||
width: `30%`,
|
||||
},
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
ue,
|
||||
toDisplayString(t.subnet_mask || `—`),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
createVNode(
|
||||
l,
|
||||
{
|
||||
field: `gateway`,
|
||||
header: `网关`,
|
||||
style: {
|
||||
width: `30%`,
|
||||
},
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
de,
|
||||
toDisplayString(t.gateway || `—`),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`value`, `loading`],
|
||||
),
|
||||
createElementVNode(`div`, fe, [
|
||||
createElementVNode(`div`, pe, [
|
||||
(n[6] ||= createTextVNode(`IPv6 地址`, -1)),
|
||||
unref(N).length
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
me,
|
||||
`（` + toDisplayString(unref(N).length) + `）`,
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
unref(I)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
c,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(I)), 1),
|
||||
createVNode(a, {
|
||||
label: `重试`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
onClick: V,
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
v,
|
||||
{
|
||||
class: `network-table ipv6-table`,
|
||||
"show-headers": !1,
|
||||
value: unref(N),
|
||||
loading: unref(P),
|
||||
size: `small`,
|
||||
scrollable: ``,
|
||||
},
|
||||
{
|
||||
empty: withCtx(() => [
|
||||
...(n[7] ||= [
|
||||
createElementVNode(
|
||||
`div`,
|
||||
{
|
||||
class: `empty`,
|
||||
},
|
||||
`暂无 IPv6 地址`,
|
||||
-1,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createVNode(
|
||||
l,
|
||||
{
|
||||
field: `ipv6`,
|
||||
header: `IPv6 地址`,
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
he,
|
||||
toDisplayString(t.ipv6),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`value`, `loading`],
|
||||
),
|
||||
]),
|
||||
h.upgradeAllowed === !1
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createBlock(
|
||||
x,
|
||||
{
|
||||
key: 1,
|
||||
visible: unref(H),
|
||||
"onUpdate:visible": (n[3] ||= (e) =>
|
||||
isRef(H) ? (H.value = e) : null),
|
||||
header: `购买附加 IP`,
|
||||
modal: ``,
|
||||
style: {
|
||||
width: `420px`,
|
||||
},
|
||||
draggable: !1,
|
||||
closable: !unref(U),
|
||||
"close-on-escape": !unref(U),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
label: `取消`,
|
||||
severity: `secondary`,
|
||||
text: ``,
|
||||
disabled: unref(U),
|
||||
onClick: (n[2] ||= (e) => (H.value = !1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
label: `提交订单`,
|
||||
loading: unref(U),
|
||||
disabled: !unref(Z),
|
||||
onClick: Se,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(`div`, ge, [
|
||||
createElementVNode(`div`, _e, [
|
||||
(n[8] ||= createElementVNode(
|
||||
`label`,
|
||||
null,
|
||||
`IPv4 数量`,
|
||||
-1,
|
||||
)),
|
||||
createVNode(
|
||||
b,
|
||||
{
|
||||
modelValue: unref(G).ip_num,
|
||||
"onUpdate:modelValue": [
|
||||
(n[0] ||= (e) => (unref(G).ip_num = e)),
|
||||
$,
|
||||
],
|
||||
min: 0,
|
||||
disabled: unref(U),
|
||||
showButtons: ``,
|
||||
buttonLayout: `horizontal`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`modelValue`, `disabled`],
|
||||
),
|
||||
]),
|
||||
createElementVNode(`div`, ve, [
|
||||
(n[9] ||= createElementVNode(
|
||||
`label`,
|
||||
null,
|
||||
`IPv6 数量`,
|
||||
-1,
|
||||
)),
|
||||
createVNode(
|
||||
b,
|
||||
{
|
||||
modelValue: unref(G).ipv6_num,
|
||||
"onUpdate:modelValue": [
|
||||
(n[1] ||= (e) => (unref(G).ipv6_num = e)),
|
||||
$,
|
||||
],
|
||||
min: 0,
|
||||
disabled: unref(U),
|
||||
showButtons: ``,
|
||||
buttonLayout: `horizontal`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`modelValue`, `disabled`],
|
||||
),
|
||||
]),
|
||||
createElementVNode(`div`, ye, [
|
||||
(n[10] ||= createElementVNode(
|
||||
`span`,
|
||||
null,
|
||||
`应付金额`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(`span`, be, [
|
||||
unref(q)
|
||||
? (openBlock(), createElementBlock(`i`, D))
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
{
|
||||
key: 1,
|
||||
},
|
||||
[
|
||||
createTextVNode(
|
||||
toDisplayString(
|
||||
unref(K) ? `¥${unref(K)}` : `—`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
],
|
||||
64,
|
||||
)),
|
||||
]),
|
||||
]),
|
||||
unref(W)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
c,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(
|
||||
toDisplayString(unref(W)),
|
||||
1,
|
||||
),
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
label: `重新报价`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
disabled: unref(U),
|
||||
onClick: $,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `closable`, `close-on-escape`],
|
||||
)),
|
||||
])
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-9ba8a1b3`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudIps`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default O;
|
||||
</script>
|
||||
@@ -0,0 +1,406 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudLogs.MTqtLGjA.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { onMounted } 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 { isRef } from "vue";
|
||||
import { createElementBlock } 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 { withModifiers } from "vue";
|
||||
import { operationMessage } from "~/lib/auth.js";
|
||||
import { useApi } from "~/lib/auth.js";
|
||||
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 { r as dict_r } from "~/lib/dict.js";
|
||||
import datatable from "primevue/datatable";
|
||||
import iconfield from "primevue/iconfield";
|
||||
import inputicon from "primevue/inputicon";
|
||||
import column from "primevue/column";
|
||||
import ListEmpty from "~/components/ListEmpty.vue";
|
||||
import { i as instance_data_i } from "~/lib/instance-data.js";
|
||||
import { l as instance_data_l } from "~/lib/instance-data.js";
|
||||
import { o as instance_data_o } from "~/lib/instance-data.js";
|
||||
var N = {
|
||||
class: `logs`,
|
||||
},
|
||||
ee = {
|
||||
class: `logs-heading`,
|
||||
},
|
||||
P = {
|
||||
class: `log-time`,
|
||||
},
|
||||
F = {
|
||||
class: `log-content`,
|
||||
},
|
||||
I = {
|
||||
key: 2,
|
||||
class: `logs-foot`,
|
||||
},
|
||||
L = {
|
||||
key: 0,
|
||||
},
|
||||
R = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudLogs`,
|
||||
props: {
|
||||
hostId: {},
|
||||
module: {
|
||||
default: `mf_cloud`,
|
||||
},
|
||||
},
|
||||
setup(m) {
|
||||
let x = m,
|
||||
R = useApi(),
|
||||
z = ref(``),
|
||||
B = ref(``),
|
||||
V = ref([]),
|
||||
H = ref(null),
|
||||
U = ref(1),
|
||||
W = ref(10),
|
||||
G = ref(!1),
|
||||
K = ref(``),
|
||||
q = 0,
|
||||
J = computed(() =>
|
||||
H.value === null
|
||||
? V.value.length === W.value
|
||||
: U.value * W.value < H.value,
|
||||
);
|
||||
async function Y() {
|
||||
let e = ++q;
|
||||
((G.value = !0), (K.value = ``));
|
||||
try {
|
||||
let t = await R.get(
|
||||
`/${x.module}/${x.hostId}/log`,
|
||||
{
|
||||
page: U.value,
|
||||
limit: W.value,
|
||||
keywords: B.value,
|
||||
},
|
||||
!0,
|
||||
);
|
||||
if (e !== q) return;
|
||||
let n = instance_data_l(t);
|
||||
V.value = instance_data_i(
|
||||
Array.isArray(t) ? t : (n.list ?? n.logs ?? n.log),
|
||||
).map(instance_data_o);
|
||||
let r = Number(n.count ?? n.total);
|
||||
H.value =
|
||||
Number.isFinite(r) &&
|
||||
r >= (U.value - 1) * W.value + V.value.length &&
|
||||
r < 1e8
|
||||
? r
|
||||
: null;
|
||||
} catch (t) {
|
||||
if (e !== q) return;
|
||||
((K.value = t instanceof Error ? t.message : `日志加载失败`),
|
||||
(V.value = []),
|
||||
(H.value = null));
|
||||
} finally {
|
||||
e === q && (G.value = !1);
|
||||
}
|
||||
}
|
||||
function X() {
|
||||
return ((U.value = 1), Y());
|
||||
}
|
||||
function Z() {
|
||||
((B.value = z.value.trim()), X());
|
||||
}
|
||||
function Q() {
|
||||
((z.value = ``), (B.value = ``), X());
|
||||
}
|
||||
function $(e) {
|
||||
G.value ||
|
||||
(e > 0 && !J.value) ||
|
||||
((U.value = Math.max(1, U.value + e)), Y());
|
||||
}
|
||||
return (
|
||||
watch(
|
||||
() => [x.hostId, x.module],
|
||||
() => {
|
||||
((z.value = ``), (B.value = ``), (V.value = []), X());
|
||||
},
|
||||
),
|
||||
onMounted(Y),
|
||||
onBeforeUnmount(() => {
|
||||
q++;
|
||||
}),
|
||||
(t, n) => {
|
||||
let r = button,
|
||||
a = inputicon,
|
||||
c = inputtext,
|
||||
m = iconfield,
|
||||
y = message,
|
||||
x = ListEmpty,
|
||||
A = column,
|
||||
j = datatable;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`section`, N, [
|
||||
createElementVNode(`div`, ee, [
|
||||
(n[3] ||= createElementVNode(
|
||||
`div`,
|
||||
null,
|
||||
[
|
||||
createElementVNode(`h4`, null, `操作日志`),
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
`查看实例操作记录与执行时间。`,
|
||||
),
|
||||
],
|
||||
-1,
|
||||
)),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `刷新`,
|
||||
icon: `pi pi-refresh`,
|
||||
severity: `secondary`,
|
||||
outlined: ``,
|
||||
loading: unref(G),
|
||||
onClick: Y,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
createElementVNode(
|
||||
`form`,
|
||||
{
|
||||
class: `logs-toolbar`,
|
||||
onSubmit: withModifiers(Z, [`prevent`]),
|
||||
},
|
||||
[
|
||||
createVNode(m, null, {
|
||||
default: withCtx(() => [
|
||||
createVNode(a, {
|
||||
class: `pi pi-search`,
|
||||
}),
|
||||
createVNode(
|
||||
c,
|
||||
{
|
||||
modelValue: unref(z),
|
||||
"onUpdate:modelValue": (n[0] ||= (e) =>
|
||||
isRef(z) ? (z.value = e) : null),
|
||||
placeholder: `搜索操作内容`,
|
||||
"aria-label": `搜索操作日志`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`modelValue`],
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
}),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
type: `submit`,
|
||||
label: `搜索`,
|
||||
disabled: unref(G),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
unref(B)
|
||||
? (openBlock(),
|
||||
createBlock(r, {
|
||||
key: 0,
|
||||
label: `清除筛选`,
|
||||
severity: `secondary`,
|
||||
text: ``,
|
||||
onClick: Q,
|
||||
}))
|
||||
: createCommentVNode(``, !0),
|
||||
],
|
||||
32,
|
||||
),
|
||||
unref(K)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
y,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(K)), 1),
|
||||
createVNode(r, {
|
||||
label: `重试`,
|
||||
severity: `secondary`,
|
||||
text: ``,
|
||||
onClick: Y,
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: (openBlock(),
|
||||
createBlock(
|
||||
j,
|
||||
{
|
||||
key: 1,
|
||||
value: unref(V),
|
||||
loading: unref(G),
|
||||
dataKey: `id`,
|
||||
size: `small`,
|
||||
scrollable: ``,
|
||||
class: `logs-table`,
|
||||
},
|
||||
{
|
||||
empty: withCtx(() => [
|
||||
createVNode(
|
||||
x,
|
||||
{
|
||||
icon: `pi pi-history`,
|
||||
title: unref(G)
|
||||
? `正在加载操作日志`
|
||||
: unref(B)
|
||||
? `未找到匹配的日志`
|
||||
: `暂无操作日志`,
|
||||
description: unref(B)
|
||||
? `更换关键词或清除筛选后重试`
|
||||
: `实例产生操作记录后会显示在这里`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`title`, `description`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createVNode(
|
||||
A,
|
||||
{
|
||||
header: `时间`,
|
||||
style: {
|
||||
"min-width": `180px`,
|
||||
width: `22%`,
|
||||
},
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: n }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
P,
|
||||
toDisplayString(
|
||||
n.create_time
|
||||
? (`formatTime` in t
|
||||
? t.formatTime
|
||||
: unref(dict_r))(n.create_time)
|
||||
: `—`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
createVNode(
|
||||
A,
|
||||
{
|
||||
header: `操作内容`,
|
||||
style: {
|
||||
"min-width": `280px`,
|
||||
},
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
F,
|
||||
toDisplayString(
|
||||
unref(operationMessage)(t.description),
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`value`, `loading`],
|
||||
)),
|
||||
unref(U) > 1 || unref(V).length
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, I, [
|
||||
unref(H) === null
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
L,
|
||||
`共 ` + toDisplayString(unref(H)) + ` 条`,
|
||||
1,
|
||||
)),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
icon: `pi pi-angle-left`,
|
||||
severity: `secondary`,
|
||||
outlined: ``,
|
||||
"aria-label": `上一页`,
|
||||
disabled: unref(G) || unref(U) <= 1,
|
||||
onClick: (n[1] ||= (e) => $(-1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createElementVNode(
|
||||
`span`,
|
||||
null,
|
||||
`第 ` + toDisplayString(unref(U)) + ` 页`,
|
||||
1,
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
icon: `pi pi-angle-right`,
|
||||
severity: `secondary`,
|
||||
outlined: ``,
|
||||
"aria-label": `下一页`,
|
||||
disabled: unref(G) || !unref(J),
|
||||
onClick: (n[2] ||= (e) => $(1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
]))
|
||||
: createCommentVNode(``, !0),
|
||||
])
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-c4521240`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudLogs`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default R;
|
||||
</script>
|
||||
@@ -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>
|
||||
@@ -0,0 +1,572 @@
|
||||
<script>
|
||||
import "~/assets/styles/ConfigBandwidth.CWSH1WJZ.css";
|
||||
import "~/assets/styles/MfCloudResourceUpgrade.bSwLWjPg.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { renderList } from "vue";
|
||||
import { onMounted } from "vue";
|
||||
import { useId } from "vue";
|
||||
import { normalizeClass } 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 { 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 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 inputnumber from "primevue/inputnumber";
|
||||
import OperationNotice from "~/components/OperationNotice.vue";
|
||||
import skeleton from "primevue/skeleton";
|
||||
import ConfigBandwidth from "~/components/config/ConfigBandwidth.vue";
|
||||
var ne = {
|
||||
key: 0,
|
||||
class: `resource-upgrade`,
|
||||
},
|
||||
re = {
|
||||
class: `config-field`,
|
||||
},
|
||||
ie = {
|
||||
class: `choices`,
|
||||
},
|
||||
ae = [`aria-pressed`, `disabled`, `onClick`],
|
||||
oe = {
|
||||
class: `config-field`,
|
||||
},
|
||||
se = [`for`],
|
||||
ce = {
|
||||
key: 1,
|
||||
class: `choices`,
|
||||
},
|
||||
le = [`aria-pressed`, `disabled`, `onClick`],
|
||||
ue = {
|
||||
key: 0,
|
||||
class: `config-field`,
|
||||
},
|
||||
de = {
|
||||
class: `choices`,
|
||||
},
|
||||
fe = [`aria-pressed`, `disabled`, `onClick`],
|
||||
D = {
|
||||
class: `upgrade-total`,
|
||||
},
|
||||
O = {
|
||||
key: 2,
|
||||
class: `muted`,
|
||||
},
|
||||
k = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudResourceUpgrade`,
|
||||
props: {
|
||||
hostId: {},
|
||||
productId: {},
|
||||
current: {},
|
||||
upgradeAllowed: {
|
||||
type: Boolean,
|
||||
default: !0,
|
||||
},
|
||||
module: {
|
||||
default: `mf_cloud`,
|
||||
},
|
||||
},
|
||||
emits: [`pay`],
|
||||
setup(_, { emit: S }) {
|
||||
let k = _,
|
||||
A = computed(() => k.module || `mf_cloud`),
|
||||
pe = S,
|
||||
j = useApi(),
|
||||
M = ref(``),
|
||||
N = useId(),
|
||||
P = ref(null),
|
||||
F = ref(null),
|
||||
I = ref(!1),
|
||||
L = ref(!1),
|
||||
R = ref(!1),
|
||||
z = ref(``),
|
||||
B = reactive({
|
||||
cpu: Number(k.current.cpu || 0),
|
||||
memory: Number(k.current.memory || 0),
|
||||
bw: Number(k.current.bw || 0),
|
||||
flow: Number(k.current.flow || 0),
|
||||
peak_defence: Number(k.current.peak_defence || 0),
|
||||
}),
|
||||
V = ref(null),
|
||||
H = 0,
|
||||
U = 0,
|
||||
W = ``,
|
||||
G = () => JSON.stringify([k.hostId, A.value, B]),
|
||||
K = computed(() =>
|
||||
Object.entries(B).some(
|
||||
([e, t]) => t !== Number(k.current[e] || 0),
|
||||
),
|
||||
);
|
||||
function q(e) {
|
||||
let t = [];
|
||||
for (let n of e || [])
|
||||
if (
|
||||
n.type === `step` ||
|
||||
(n.min_value != null &&
|
||||
n.max_value != null &&
|
||||
n.type !== `radio`)
|
||||
) {
|
||||
let e = Math.max(1, Number(n.step || 1));
|
||||
for (
|
||||
let r = Number(n.min_value);
|
||||
r <= Number(n.max_value) && t.length < 1e3;
|
||||
r += e
|
||||
)
|
||||
t.push(r);
|
||||
} else
|
||||
Number.isFinite(Number(n.value)) && t.push(Number(n.value));
|
||||
return [...new Set(t)];
|
||||
}
|
||||
let me = computed(() => q(P.value?.cpu)),
|
||||
he = computed(() => q(P.value?.memory));
|
||||
function ge(e) {
|
||||
return !e?.length ||
|
||||
e.every((e) => e.type === `radio` || e.min_value == null)
|
||||
? null
|
||||
: {
|
||||
min: Math.min(
|
||||
...e.map((e) => Number(e.min_value ?? e.value)),
|
||||
),
|
||||
max: Math.max(
|
||||
...e.map((e) => Number(e.max_value ?? e.value)),
|
||||
),
|
||||
step: Math.max(
|
||||
1,
|
||||
Math.min(...e.map((e) => Number(e.step || 1))),
|
||||
),
|
||||
};
|
||||
}
|
||||
let J = computed(() => ge(P.value?.memory)),
|
||||
Y = computed(() =>
|
||||
(F.value?.bw || []).map((e) => ({
|
||||
...e,
|
||||
type:
|
||||
e.type !== `radio` &&
|
||||
e.min_value != null &&
|
||||
e.max_value != null
|
||||
? `step`
|
||||
: e.type,
|
||||
})),
|
||||
),
|
||||
X = computed(() =>
|
||||
(F.value?.flow || []).map((e) => Number(e.value)),
|
||||
);
|
||||
async function Z() {
|
||||
if (k.upgradeAllowed === !1) return;
|
||||
let e = ++H;
|
||||
((I.value = !0), (z.value = ``), (V.value = null));
|
||||
try {
|
||||
let t = Number(k.current.line?.id || k.current.line_id),
|
||||
[n, r] = await Promise.all([
|
||||
j.get(`/product/${k.productId}/${A.value}/order_page`),
|
||||
t
|
||||
? j.get(`/product/${k.productId}/${A.value}/line/${t}`)
|
||||
: Promise.resolve(null),
|
||||
]);
|
||||
if (e !== H) return;
|
||||
((P.value = n), (F.value = r));
|
||||
} catch (t) {
|
||||
e === H &&
|
||||
(z.value = t instanceof Error ? t.message : `升级配置加载失败`);
|
||||
} finally {
|
||||
e === H && (I.value = !1);
|
||||
}
|
||||
}
|
||||
async function Q() {
|
||||
if (k.upgradeAllowed === !1) return;
|
||||
let e = ++U,
|
||||
t = G();
|
||||
if (((V.value = null), (W = ``), (z.value = ``), !K.value)) {
|
||||
L.value = !1;
|
||||
return;
|
||||
}
|
||||
L.value = !0;
|
||||
try {
|
||||
let n = await j.get(`/${A.value}/${k.hostId}/common_config`, {
|
||||
...B,
|
||||
});
|
||||
if (e !== U || G() !== t) return;
|
||||
if (
|
||||
n.price == null ||
|
||||
n.price === `` ||
|
||||
!Number.isFinite(Number(n.price))
|
||||
)
|
||||
throw Error(`报价无效，请重试`);
|
||||
((V.value = n), (W = t));
|
||||
} catch (t) {
|
||||
e === U &&
|
||||
(z.value = t instanceof Error ? t.message : `询价失败`);
|
||||
} finally {
|
||||
e === U && (L.value = !1);
|
||||
}
|
||||
}
|
||||
function $(e, t) {
|
||||
k.upgradeAllowed === !1 || R.value || ((B[e] = t), Q());
|
||||
}
|
||||
function _e(e) {
|
||||
k.upgradeAllowed === !1 ||
|
||||
R.value ||
|
||||
((B.bw = e), U++, (V.value = null), (W = ``), (L.value = !1));
|
||||
}
|
||||
async function ve() {
|
||||
if (
|
||||
k.upgradeAllowed === !1 ||
|
||||
R.value ||
|
||||
L.value ||
|
||||
!V.value ||
|
||||
W !== G() ||
|
||||
!K.value
|
||||
)
|
||||
return;
|
||||
((R.value = !0), (z.value = ``), (M.value = ``));
|
||||
let e = H,
|
||||
t = G(),
|
||||
n = V.value.price;
|
||||
try {
|
||||
let r = await j.post(
|
||||
`/${A.value}/${k.hostId}/common_config/order`,
|
||||
{
|
||||
...B,
|
||||
},
|
||||
);
|
||||
if (e !== H || t !== G()) return;
|
||||
if (!Number.isSafeInteger(Number(r.id)) || Number(r.id) <= 0)
|
||||
throw Error(`订单信息无效，请重试`);
|
||||
((V.value = null),
|
||||
(W = ``),
|
||||
pe(`pay`, {
|
||||
order_id: r.id,
|
||||
amount: n,
|
||||
}));
|
||||
} catch (e) {
|
||||
M.value = e instanceof Error ? e.message : `提交失败`;
|
||||
} finally {
|
||||
R.value = !1;
|
||||
}
|
||||
}
|
||||
return (
|
||||
onMounted(Z),
|
||||
watch(() => [k.hostId, k.module, k.productId], Z),
|
||||
onBeforeUnmount(() => {
|
||||
(H++, U++);
|
||||
}),
|
||||
(n, r) => {
|
||||
let a = OperationNotice,
|
||||
o = skeleton,
|
||||
c = inputnumber,
|
||||
u = ConfigBandwidth,
|
||||
d = button,
|
||||
b = message;
|
||||
return _.upgradeAllowed === !1
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(`div`, ne, [
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
message: unref(M),
|
||||
severity: `error`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`message`],
|
||||
),
|
||||
unref(I)
|
||||
? (openBlock(),
|
||||
createBlock(o, {
|
||||
key: 0,
|
||||
height: `240px`,
|
||||
}))
|
||||
: unref(P)
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
{
|
||||
key: 1,
|
||||
},
|
||||
[
|
||||
createElementVNode(`div`, re, [
|
||||
(r[2] ||= createElementVNode(
|
||||
`span`,
|
||||
null,
|
||||
`CPU`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(`div`, ie, [
|
||||
(openBlock(!0),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
null,
|
||||
renderList(
|
||||
unref(me),
|
||||
(t) => (
|
||||
openBlock(),
|
||||
createElementBlock(
|
||||
`button`,
|
||||
{
|
||||
key: t,
|
||||
type: `button`,
|
||||
class: normalizeClass({
|
||||
selected: unref(B).cpu === t,
|
||||
}),
|
||||
"aria-pressed": unref(B).cpu === t,
|
||||
disabled: unref(R),
|
||||
onClick: (e) => $(`cpu`, t),
|
||||
},
|
||||
toDisplayString(t) + ` 核`,
|
||||
11,
|
||||
ae,
|
||||
)
|
||||
),
|
||||
),
|
||||
128,
|
||||
)),
|
||||
]),
|
||||
]),
|
||||
createElementVNode(`div`, oe, [
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(N)}-memory`,
|
||||
},
|
||||
`内存`,
|
||||
8,
|
||||
se,
|
||||
),
|
||||
unref(J)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
c,
|
||||
{
|
||||
key: 0,
|
||||
"input-id": `${unref(N)}-memory`,
|
||||
"model-value": unref(B).memory,
|
||||
min: unref(J).min,
|
||||
max: unref(J).max,
|
||||
step: unref(J).step,
|
||||
suffix: ` ${unref(P).config?.memory_unit || `GB`}`,
|
||||
disabled: unref(R),
|
||||
"show-buttons": ``,
|
||||
"onUpdate:modelValue": (r[0] ||= (
|
||||
e,
|
||||
) => {
|
||||
e != null && $(`memory`, e);
|
||||
}),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[
|
||||
`input-id`,
|
||||
`model-value`,
|
||||
`min`,
|
||||
`max`,
|
||||
`step`,
|
||||
`suffix`,
|
||||
`disabled`,
|
||||
],
|
||||
))
|
||||
: (openBlock(),
|
||||
createElementBlock(`div`, ce, [
|
||||
(openBlock(!0),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
null,
|
||||
renderList(
|
||||
unref(he),
|
||||
(t) => (
|
||||
openBlock(),
|
||||
createElementBlock(
|
||||
`button`,
|
||||
{
|
||||
key: t,
|
||||
type: `button`,
|
||||
class: normalizeClass({
|
||||
selected:
|
||||
unref(B).memory === t,
|
||||
}),
|
||||
"aria-pressed":
|
||||
unref(B).memory === t,
|
||||
disabled: unref(R),
|
||||
onClick: (e) => $(`memory`, t),
|
||||
},
|
||||
toDisplayString(t) +
|
||||
` ` +
|
||||
toDisplayString(
|
||||
unref(P).config
|
||||
?.memory_unit || `GB`,
|
||||
),
|
||||
11,
|
||||
le,
|
||||
)
|
||||
),
|
||||
),
|
||||
128,
|
||||
)),
|
||||
])),
|
||||
]),
|
||||
unref(F)?.bill_type === `flow` && unref(X).length
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, ue, [
|
||||
(r[3] ||= createElementVNode(
|
||||
`span`,
|
||||
null,
|
||||
`流量配额`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(`div`, de, [
|
||||
(openBlock(!0),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
null,
|
||||
renderList(
|
||||
unref(X),
|
||||
(t) => (
|
||||
openBlock(),
|
||||
createElementBlock(
|
||||
`button`,
|
||||
{
|
||||
key: t,
|
||||
type: `button`,
|
||||
class: normalizeClass({
|
||||
selected: unref(B).flow === t,
|
||||
}),
|
||||
"aria-pressed":
|
||||
unref(B).flow === t,
|
||||
disabled: unref(R),
|
||||
onClick: (e) => $(`flow`, t),
|
||||
},
|
||||
toDisplayString(
|
||||
t > 0 ? `${t} GB` : `不限量`,
|
||||
),
|
||||
11,
|
||||
fe,
|
||||
)
|
||||
),
|
||||
),
|
||||
128,
|
||||
)),
|
||||
]),
|
||||
]))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(F)?.bill_type === `bw` && unref(Y).length
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
u,
|
||||
{
|
||||
key: 1,
|
||||
"model-value": unref(B).bw,
|
||||
options: unref(Y),
|
||||
disabled: unref(R),
|
||||
"onUpdate:modelValue": _e,
|
||||
onChange: Q,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`model-value`, `options`, `disabled`],
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createElementVNode(`div`, D, [
|
||||
createElementVNode(`span`, null, [
|
||||
(r[4] ||= createTextVNode(`所需费用：`, -1)),
|
||||
createElementVNode(
|
||||
`b`,
|
||||
null,
|
||||
toDisplayString(
|
||||
unref(L)
|
||||
? `正在计算…`
|
||||
: unref(V)
|
||||
? `¥${unref(V).price}`
|
||||
: unref(K)
|
||||
? `等待有效报价`
|
||||
: `未变更配置`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
createVNode(
|
||||
d,
|
||||
{
|
||||
label: `确认升降级`,
|
||||
icon: `pi pi-check`,
|
||||
loading: unref(R),
|
||||
disabled:
|
||||
!unref(K) ||
|
||||
!unref(V) ||
|
||||
unref(L) ||
|
||||
unref(R),
|
||||
onClick: ve,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
]),
|
||||
unref(V)?.renew_price_difference
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
O,
|
||||
`续费差价：¥` +
|
||||
toDisplayString(
|
||||
unref(V).renew_price_difference,
|
||||
),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
],
|
||||
64,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(z)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
b,
|
||||
{
|
||||
key: 2,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(z)), 1),
|
||||
createVNode(d, {
|
||||
label: `重试`,
|
||||
severity: `secondary`,
|
||||
text: ``,
|
||||
onClick: (r[1] ||= (e) =>
|
||||
unref(P) ? Q() : Z()),
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]));
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-c9212028`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudResourceUpgrade`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default k;
|
||||
</script>
|
||||
@@ -0,0 +1,493 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudUpgrade.N7TNG8F1.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { renderList } from "vue";
|
||||
import { onMounted } from "vue";
|
||||
import { normalizeClass } 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 { 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 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 OperationNotice from "~/components/OperationNotice.vue";
|
||||
import skeleton from "primevue/skeleton";
|
||||
var w = {
|
||||
key: 0,
|
||||
class: `up`,
|
||||
},
|
||||
T = {
|
||||
key: 0,
|
||||
class: `current`,
|
||||
},
|
||||
te = {
|
||||
class: `current-spec`,
|
||||
},
|
||||
ne = {
|
||||
key: 2,
|
||||
class: `grid`,
|
||||
},
|
||||
re = {
|
||||
key: 3,
|
||||
class: `grid`,
|
||||
},
|
||||
ie = [`disabled`, `aria-pressed`, `onClick`],
|
||||
E = {
|
||||
class: `plan-head`,
|
||||
},
|
||||
D = {
|
||||
class: `plan-name`,
|
||||
},
|
||||
O = {
|
||||
key: 0,
|
||||
class: `pi pi-check-circle plan-check`,
|
||||
},
|
||||
k = {
|
||||
key: 0,
|
||||
class: `plan-desc`,
|
||||
},
|
||||
A = {
|
||||
class: `plan-spec`,
|
||||
},
|
||||
j = {
|
||||
key: 5,
|
||||
class: `bar`,
|
||||
},
|
||||
M = {
|
||||
class: `bar-price`,
|
||||
},
|
||||
N = {
|
||||
class: `bar-value`,
|
||||
},
|
||||
P = {
|
||||
key: 0,
|
||||
class: `pi pi-spin pi-spinner`,
|
||||
},
|
||||
F = {
|
||||
key: 0,
|
||||
class: `bar-sub`,
|
||||
},
|
||||
I = {
|
||||
key: 1,
|
||||
class: `bar-sub`,
|
||||
},
|
||||
L = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudUpgrade`,
|
||||
props: {
|
||||
hostId: {},
|
||||
module: {
|
||||
default: `mf_cloud`,
|
||||
},
|
||||
upgradeAllowed: {
|
||||
type: Boolean,
|
||||
default: !0,
|
||||
},
|
||||
current: {},
|
||||
},
|
||||
emits: [`pay`],
|
||||
setup(g, { emit: b }) {
|
||||
let L = g,
|
||||
R = computed(() => L.module || `mf_cloud`),
|
||||
z = b,
|
||||
B = useApi(),
|
||||
V = ref(``),
|
||||
H = ref([]),
|
||||
U = ref(!1),
|
||||
W = ref(``),
|
||||
G = ref(null),
|
||||
K = ref(null),
|
||||
q = ref(!1),
|
||||
J = ref(!1),
|
||||
Y = 0,
|
||||
X = 0,
|
||||
Z = null;
|
||||
async function Q() {
|
||||
if (L.upgradeAllowed === !1) return;
|
||||
let e = ++X;
|
||||
(++Y,
|
||||
(G.value = null),
|
||||
(K.value = null),
|
||||
(Z = null),
|
||||
(H.value = []),
|
||||
(U.value = !0),
|
||||
(W.value = ``));
|
||||
try {
|
||||
let t = await B.get(`/${R.value}/${L.hostId}/recommend_config`);
|
||||
if (e !== X) return;
|
||||
H.value = (t.list ?? []).filter(
|
||||
(e) => Number(e.hidden) !== 1 && Number(e.upgrade_range) !== 0,
|
||||
);
|
||||
} catch (t) {
|
||||
e === X &&
|
||||
(W.value = t instanceof Error ? t.message : `加载失败`);
|
||||
} finally {
|
||||
e === X && (U.value = !1);
|
||||
}
|
||||
}
|
||||
async function ae(e) {
|
||||
if (L.upgradeAllowed === !1 || J.value) return;
|
||||
let t = ++Y;
|
||||
((Z = null),
|
||||
(G.value = e.id),
|
||||
(K.value = null),
|
||||
(q.value = !0),
|
||||
(W.value = ``));
|
||||
try {
|
||||
let n = await B.get(
|
||||
`/${R.value}/${L.hostId}/recommend_config/price`,
|
||||
{
|
||||
recommend_config_id: e.id,
|
||||
},
|
||||
);
|
||||
if (t !== Y || G.value !== e.id) return;
|
||||
if (
|
||||
n.price == null ||
|
||||
String(n.price).trim() === `` ||
|
||||
!Number.isFinite(Number(n.price))
|
||||
)
|
||||
throw Error(`报价无效，请重试`);
|
||||
((K.value = n), (Z = e.id));
|
||||
} catch (e) {
|
||||
t === Y &&
|
||||
(W.value = e instanceof Error ? e.message : `询价失败`);
|
||||
} finally {
|
||||
t === Y && (q.value = !1);
|
||||
}
|
||||
}
|
||||
async function oe() {
|
||||
if (
|
||||
L.upgradeAllowed === !1 ||
|
||||
J.value ||
|
||||
q.value ||
|
||||
!K.value ||
|
||||
!G.value ||
|
||||
Z !== G.value
|
||||
)
|
||||
return;
|
||||
J.value = !0;
|
||||
let e = X,
|
||||
t = K.value.price;
|
||||
((W.value = ``), (V.value = ``));
|
||||
try {
|
||||
let n = await B.post(
|
||||
`/${R.value}/${L.hostId}/recommend_config/order`,
|
||||
{
|
||||
recommend_config_id: G.value,
|
||||
},
|
||||
);
|
||||
if (e !== X) return;
|
||||
if (!Number.isSafeInteger(Number(n?.id)) || Number(n.id) <= 0)
|
||||
throw Error(`订单信息无效，请重试`);
|
||||
((K.value = null),
|
||||
(Z = null),
|
||||
z(`pay`, {
|
||||
order_id: n.id,
|
||||
amount: t,
|
||||
}));
|
||||
} catch (e) {
|
||||
V.value = e instanceof Error ? e.message : `下单失败`;
|
||||
} finally {
|
||||
J.value = !1;
|
||||
}
|
||||
}
|
||||
function se(e) {
|
||||
return [
|
||||
e.cpu ? `${e.cpu} 核` : ``,
|
||||
e.memory ? `${e.memory} GB 内存` : ``,
|
||||
e.system_disk_size ? `${e.system_disk_size} GB 系统盘` : ``,
|
||||
e.data_disk_size ? `${e.data_disk_size} GB 数据盘` : ``,
|
||||
e.bw ? `${e.bw} Mbps` : ``,
|
||||
e.flow ? `${e.flow} GB 流量` : ``,
|
||||
e.peak_defence ? `${e.peak_defence} G 防御` : ``,
|
||||
e.gpu_name ? `${e.gpu_num ?? 1}× ${e.gpu_name}` : ``,
|
||||
].filter(Boolean);
|
||||
}
|
||||
let $ = computed(() =>
|
||||
[
|
||||
L.current.cpu ? `${L.current.cpu} 核` : ``,
|
||||
L.current.memory ? `${L.current.memory} GB 内存` : ``,
|
||||
L.current.system_disk?.size
|
||||
? `${L.current.system_disk.size} GB 系统盘`
|
||||
: ``,
|
||||
L.current.bw ? `${L.current.bw} Mbps` : ``,
|
||||
]
|
||||
.filter(Boolean)
|
||||
.join(` · `),
|
||||
);
|
||||
return (
|
||||
onMounted(Q),
|
||||
watch(() => [L.hostId, L.module], Q),
|
||||
onBeforeUnmount(() => {
|
||||
(Y++, X++);
|
||||
}),
|
||||
(n, i) => {
|
||||
let a = OperationNotice,
|
||||
s = message,
|
||||
u = skeleton,
|
||||
y = button;
|
||||
return g.upgradeAllowed === !1
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createElementBlock(`div`, w, [
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
message: unref(V),
|
||||
severity: `error`,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`message`],
|
||||
),
|
||||
unref($)
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, T, [
|
||||
(i[0] ||= createElementVNode(
|
||||
`span`,
|
||||
{
|
||||
class: `current-label`,
|
||||
},
|
||||
`当前配置`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(
|
||||
`span`,
|
||||
te,
|
||||
toDisplayString(unref($)),
|
||||
1,
|
||||
),
|
||||
]))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(W)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
s,
|
||||
{
|
||||
key: 1,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(W)), 1),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(U)
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, ne, [
|
||||
(openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
null,
|
||||
renderList(3, (e) =>
|
||||
createElementVNode(
|
||||
`div`,
|
||||
{
|
||||
key: e,
|
||||
class: `plan`,
|
||||
},
|
||||
[
|
||||
createVNode(u, {
|
||||
height: `90px`,
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
64,
|
||||
)),
|
||||
]))
|
||||
: unref(H).length
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, re, [
|
||||
(openBlock(!0),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
null,
|
||||
renderList(
|
||||
unref(H),
|
||||
(t) => (
|
||||
openBlock(),
|
||||
createElementBlock(
|
||||
`button`,
|
||||
{
|
||||
key: t.id,
|
||||
type: `button`,
|
||||
class: normalizeClass([
|
||||
`plan`,
|
||||
{
|
||||
active: unref(G) === t.id,
|
||||
},
|
||||
]),
|
||||
disabled: unref(J),
|
||||
"aria-pressed": unref(G) === t.id,
|
||||
onClick: (e) => ae(t),
|
||||
},
|
||||
[
|
||||
createElementVNode(`div`, E, [
|
||||
createElementVNode(
|
||||
`span`,
|
||||
D,
|
||||
toDisplayString(t.name),
|
||||
1,
|
||||
),
|
||||
unref(G) === t.id
|
||||
? (openBlock(),
|
||||
createElementBlock(`i`, O))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
t.description
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`div`,
|
||||
k,
|
||||
toDisplayString(t.description),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createElementVNode(
|
||||
`div`,
|
||||
A,
|
||||
toDisplayString(se(t).join(` · `)),
|
||||
1,
|
||||
),
|
||||
],
|
||||
10,
|
||||
ie,
|
||||
)
|
||||
),
|
||||
),
|
||||
128,
|
||||
)),
|
||||
]))
|
||||
: unref(W)
|
||||
? createCommentVNode(``, !0)
|
||||
: (openBlock(),
|
||||
createBlock(
|
||||
s,
|
||||
{
|
||||
key: 4,
|
||||
severity: `info`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
...(i[1] ||= [
|
||||
createTextVNode(
|
||||
`当前实例没有可升级的套餐。`,
|
||||
-1,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
)),
|
||||
unref(G)
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, j, [
|
||||
createElementVNode(`div`, M, [
|
||||
(i[2] ||= createElementVNode(
|
||||
`span`,
|
||||
{
|
||||
class: `bar-label`,
|
||||
},
|
||||
`升级费用`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(`span`, N, [
|
||||
unref(q)
|
||||
? (openBlock(), createElementBlock(`i`, P))
|
||||
: (openBlock(),
|
||||
createElementBlock(
|
||||
Fragment,
|
||||
{
|
||||
key: 1,
|
||||
},
|
||||
[
|
||||
createTextVNode(
|
||||
toDisplayString(
|
||||
unref(K) ? `¥${unref(K).price}` : `—`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
],
|
||||
64,
|
||||
)),
|
||||
]),
|
||||
unref(K)?.price_difference
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
F,
|
||||
`差价 ¥` +
|
||||
toDisplayString(unref(K).price_difference),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(K)?.renew_price_difference
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`span`,
|
||||
I,
|
||||
`续费差价 ¥` +
|
||||
toDisplayString(
|
||||
unref(K).renew_price_difference,
|
||||
),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
createVNode(
|
||||
y,
|
||||
{
|
||||
label: `确认升降级`,
|
||||
icon: `pi pi-arrow-up`,
|
||||
loading: unref(J),
|
||||
disabled: !unref(K) || unref(q) || unref(J),
|
||||
onClick: oe,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
]))
|
||||
: createCommentVNode(``, !0),
|
||||
(i[3] ||= createElementVNode(
|
||||
`p`,
|
||||
{
|
||||
class: `hint`,
|
||||
},
|
||||
`升级为变更配置，原配置将被替换；部分套餐可能要求实例处于运行中状态。`,
|
||||
-1,
|
||||
)),
|
||||
]));
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-b98b2e63`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudUpgrade`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default L;
|
||||
</script>
|
||||
@@ -0,0 +1,864 @@
|
||||
<script>
|
||||
import "~/assets/styles/MfCloudVpc.CpOEbuWs.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 { isRef } from "vue";
|
||||
import { createElementBlock } 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 column from "primevue/column";
|
||||
import { c as cloud_instance_management_c } from "~/lib/cloud-instance-management.js";
|
||||
import { i as cloud_instance_management_i } from "~/lib/cloud-instance-management.js";
|
||||
var ie = {
|
||||
class: `vpc-panel network-section`,
|
||||
},
|
||||
ae = {
|
||||
class: `network-head`,
|
||||
},
|
||||
T = {
|
||||
class: `network-actions`,
|
||||
},
|
||||
oe = {
|
||||
key: 0,
|
||||
class: `muted`,
|
||||
},
|
||||
se = {
|
||||
class: `form`,
|
||||
},
|
||||
ce = [`for`],
|
||||
E = [`for`],
|
||||
le = {
|
||||
key: 0,
|
||||
class: `muted`,
|
||||
},
|
||||
ue = {
|
||||
class: `form`,
|
||||
},
|
||||
de = [`for`],
|
||||
D = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `MfCloudVpc`,
|
||||
props: {
|
||||
hostId: {},
|
||||
productId: {},
|
||||
module: {},
|
||||
networkType: {},
|
||||
dataCenterId: {},
|
||||
active: {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
emits: [`refresh`],
|
||||
setup(h, { emit: y }) {
|
||||
let D = h,
|
||||
O = y,
|
||||
k = useApi(),
|
||||
A = useId(),
|
||||
j = ref(!1),
|
||||
M = computed(
|
||||
() =>
|
||||
cloud_instance_management_i(D.module) &&
|
||||
(D.networkType === `vpc` || j.value),
|
||||
),
|
||||
N = computed(() => `/${D.module}/${D.hostId}/vpc_network`),
|
||||
P = ref([]),
|
||||
F = ref([]),
|
||||
I = ref([]),
|
||||
L = ref([]),
|
||||
R = ref(!1),
|
||||
z = ref(!1),
|
||||
B = ref(``),
|
||||
V = ref(``),
|
||||
H = ref(!1),
|
||||
U = ref(``),
|
||||
W = ref(``),
|
||||
G = ref(null),
|
||||
K = ref(null),
|
||||
q = ref(null),
|
||||
J = ref(!1),
|
||||
Y = 0,
|
||||
X = 0,
|
||||
Z = !1;
|
||||
async function Q() {
|
||||
let e = ++Y,
|
||||
t = N.value;
|
||||
((B.value = ``), (R.value = !0));
|
||||
try {
|
||||
if (
|
||||
cloud_instance_management_i(D.module) &&
|
||||
D.networkType !== `vpc` &&
|
||||
D.productId
|
||||
) {
|
||||
let t = await k.get(
|
||||
`/product/${D.productId}/${D.module}/order_page`,
|
||||
);
|
||||
if (Z || e !== Y) return;
|
||||
if (t.config?.support_vpc_network === void 0)
|
||||
throw Error(`VPC 能力信息未返回，请重试`);
|
||||
j.value = Number(t.config.support_vpc_network) === 1;
|
||||
}
|
||||
if (!M.value) {
|
||||
((P.value = []), (F.value = []));
|
||||
return;
|
||||
}
|
||||
let n = [],
|
||||
r = 1;
|
||||
for (;;) {
|
||||
let i = await k.get(t, {
|
||||
page: r,
|
||||
limit: 100,
|
||||
orderby: `id`,
|
||||
sort: `desc`,
|
||||
});
|
||||
if (Z || e !== Y) return;
|
||||
if (!Array.isArray(i.list)) throw Error(`VPC 列表无效，请重试`);
|
||||
if (
|
||||
(n.push(...i.list),
|
||||
(L.value = i.vpc_cidr_limit ?? []),
|
||||
i.count === void 0
|
||||
? i.list.length < 100
|
||||
: n.length >= Number(i.count))
|
||||
)
|
||||
break;
|
||||
if (!i.list.length) throw Error(`VPC 列表不完整，请刷新重试`);
|
||||
r++;
|
||||
}
|
||||
if (((P.value = n), (F.value = n), D.productId)) {
|
||||
let t = await k.get(
|
||||
`/product/${D.productId}/${D.module}/vpc_network/search`,
|
||||
{
|
||||
...(D.dataCenterId
|
||||
? {
|
||||
data_center_id: D.dataCenterId,
|
||||
}
|
||||
: {}),
|
||||
},
|
||||
);
|
||||
if (Z || e !== Y) return;
|
||||
if (!Array.isArray(t.list))
|
||||
throw Error(`可用 VPC 网络列表无效，请重试`);
|
||||
F.value = t.list;
|
||||
}
|
||||
} catch (t) {
|
||||
!Z &&
|
||||
e === Y &&
|
||||
(B.value = t instanceof Error ? t.message : `加载 VPC 失败`);
|
||||
} finally {
|
||||
!Z && e === Y && (R.value = !1);
|
||||
}
|
||||
}
|
||||
function fe() {
|
||||
!M.value ||
|
||||
z.value ||
|
||||
R.value ||
|
||||
B.value ||
|
||||
!D.active ||
|
||||
((U.value = ``), (W.value = ``), (V.value = ``), (H.value = !0));
|
||||
}
|
||||
async function pe() {
|
||||
if (z.value || !H.value || !M.value || !D.active) return;
|
||||
let e;
|
||||
try {
|
||||
e = cloud_instance_management_c(U.value, W.value, L.value);
|
||||
} catch (e) {
|
||||
V.value = e.message;
|
||||
return;
|
||||
}
|
||||
let t = N.value,
|
||||
n = Y;
|
||||
((z.value = !0), (V.value = ``));
|
||||
try {
|
||||
if ((await k.post(t, e), Z || n !== Y)) return;
|
||||
((H.value = !1), await Q());
|
||||
} catch (e) {
|
||||
!Z &&
|
||||
t === N.value &&
|
||||
(V.value = e instanceof Error ? e.message : `创建失败`);
|
||||
} finally {
|
||||
!Z && t === N.value && (z.value = !1);
|
||||
}
|
||||
}
|
||||
async function $(e) {
|
||||
if (
|
||||
!M.value ||
|
||||
z.value ||
|
||||
B.value ||
|
||||
!D.active ||
|
||||
!F.value.some((t) => t.id === e.id) ||
|
||||
((K.value = e),
|
||||
(q.value = Number(D.hostId)),
|
||||
(V.value = ``),
|
||||
(I.value = [
|
||||
{
|
||||
id: Number(D.hostId),
|
||||
name: `当前实例 #${D.hostId}`,
|
||||
},
|
||||
]),
|
||||
D.module !== `mf_cloud`)
|
||||
)
|
||||
return;
|
||||
let t = ++X;
|
||||
J.value = !0;
|
||||
try {
|
||||
let e = [],
|
||||
n = 1;
|
||||
for (;;) {
|
||||
let r = await k.get(`/mf_cloud/vpc_network/host`, {
|
||||
page: n,
|
||||
limit: 100,
|
||||
...(D.dataCenterId
|
||||
? {
|
||||
data_center_id: D.dataCenterId,
|
||||
}
|
||||
: {}),
|
||||
});
|
||||
if (Z || t !== X) return;
|
||||
if (!Array.isArray(r.list)) throw Error(`可分配实例列表无效`);
|
||||
if (
|
||||
(e.push(...r.list),
|
||||
r.count === void 0
|
||||
? r.list.length < 100
|
||||
: e.length >= Number(r.count))
|
||||
)
|
||||
break;
|
||||
if (!r.list.length) throw Error(`可分配实例列表不完整，请重试`);
|
||||
n++;
|
||||
}
|
||||
((I.value = e),
|
||||
e.some((e) => e.id === q.value) ||
|
||||
(q.value = e[0]?.id ?? null));
|
||||
} catch (e) {
|
||||
!Z &&
|
||||
t === X &&
|
||||
((I.value = []),
|
||||
(V.value =
|
||||
e instanceof Error ? e.message : `加载可分配实例失败`));
|
||||
} finally {
|
||||
!Z && t === X && (J.value = !1);
|
||||
}
|
||||
}
|
||||
async function me() {
|
||||
let e = K.value,
|
||||
t = q.value;
|
||||
if (
|
||||
!e ||
|
||||
!t ||
|
||||
z.value ||
|
||||
J.value ||
|
||||
!M.value ||
|
||||
!D.active ||
|
||||
!I.value.some((e) => e.id === t) ||
|
||||
!F.value.some((t) => t.id === e.id)
|
||||
)
|
||||
return;
|
||||
let n = N.value,
|
||||
r = Y,
|
||||
i = D.module;
|
||||
((z.value = !0), (V.value = ``));
|
||||
try {
|
||||
if (
|
||||
(await k.put(`/${i}/${t}/vpc_network`, {
|
||||
vpc_network_id: e.id,
|
||||
}),
|
||||
Z || r !== Y)
|
||||
)
|
||||
return;
|
||||
((K.value = null), await Q(), O(`refresh`));
|
||||
} catch (e) {
|
||||
!Z &&
|
||||
n === N.value &&
|
||||
(V.value = e instanceof Error ? e.message : `分配网络失败`);
|
||||
} finally {
|
||||
!Z && n === N.value && (z.value = !1);
|
||||
}
|
||||
}
|
||||
async function he() {
|
||||
let e = G.value;
|
||||
if (
|
||||
!e ||
|
||||
z.value ||
|
||||
!M.value ||
|
||||
!D.active ||
|
||||
e.host?.length ||
|
||||
!P.value.some((t) => t.id === e.id)
|
||||
)
|
||||
return;
|
||||
let t = N.value,
|
||||
n = Y;
|
||||
((z.value = !0), (V.value = ``));
|
||||
try {
|
||||
if ((await k.del(`${t}/${e.id}`), Z || n !== Y)) return;
|
||||
((G.value = null), await Q());
|
||||
} catch (e) {
|
||||
!Z &&
|
||||
t === N.value &&
|
||||
(V.value = e instanceof Error ? e.message : `删除失败`);
|
||||
} finally {
|
||||
!Z && t === N.value && (z.value = !1);
|
||||
}
|
||||
}
|
||||
return (
|
||||
watch(
|
||||
() => [D.hostId, D.module, D.networkType, D.productId],
|
||||
() => {
|
||||
(X++,
|
||||
(j.value = !1),
|
||||
(P.value = []),
|
||||
(z.value = !1),
|
||||
(H.value = !1),
|
||||
(G.value = null),
|
||||
(K.value = null),
|
||||
Q());
|
||||
},
|
||||
),
|
||||
onMounted(Q),
|
||||
onBeforeUnmount(() => {
|
||||
((Z = !0), Y++, X++);
|
||||
}),
|
||||
(t, n) => {
|
||||
let r = button,
|
||||
i = message,
|
||||
o = column,
|
||||
l = datatable,
|
||||
v = inputtext,
|
||||
y = dialog,
|
||||
C = select;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`section`, ie, [
|
||||
createElementVNode(`div`, ae, [
|
||||
(n[10] ||= createElementVNode(`h4`, null, `VPC 网络`, -1)),
|
||||
createElementVNode(`div`, T, [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `新建 VPC`,
|
||||
icon: `pi pi-plus`,
|
||||
size: `small`,
|
||||
disabled:
|
||||
!unref(M) ||
|
||||
!h.active ||
|
||||
unref(z) ||
|
||||
unref(R) ||
|
||||
!!unref(B),
|
||||
onClick: fe,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
unref(M)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
r,
|
||||
{
|
||||
key: 0,
|
||||
label: `刷新`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
loading: unref(R),
|
||||
disabled: unref(z),
|
||||
onClick: Q,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
!unref(M) && !unref(R) && !unref(B)
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
oe,
|
||||
`当前实例未开放 VPC 网络能力。`,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(B)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 1,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(B)), 1),
|
||||
createVNode(r, {
|
||||
label: `重试`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
onClick: Q,
|
||||
}),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(M)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
l,
|
||||
{
|
||||
key: 2,
|
||||
class: `network-table`,
|
||||
value: unref(P),
|
||||
loading: unref(R),
|
||||
size: `small`,
|
||||
scrollable: ``,
|
||||
},
|
||||
{
|
||||
empty: withCtx(() => [
|
||||
...(n[11] ||= [
|
||||
createTextVNode(`暂无 VPC 网络`, -1),
|
||||
]),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createVNode(o, {
|
||||
field: `name`,
|
||||
header: `名称`,
|
||||
}),
|
||||
createVNode(o, {
|
||||
field: `ips`,
|
||||
header: `网段`,
|
||||
}),
|
||||
createVNode(
|
||||
o,
|
||||
{
|
||||
header: `已分配实例`,
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: t }) => [
|
||||
createTextVNode(
|
||||
toDisplayString(
|
||||
(t.host || [])
|
||||
.map((e) => e.name)
|
||||
.join(`、`) || `未分配`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
createVNode(
|
||||
o,
|
||||
{
|
||||
header: `操作`,
|
||||
},
|
||||
{
|
||||
body: withCtx(({ data: e }) => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `分配 / 切换`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
disabled:
|
||||
unref(z) ||
|
||||
!h.active ||
|
||||
!!unref(B) ||
|
||||
!unref(F).some((t) => t.id === e.id),
|
||||
onClick: (t) => $(e),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`, `onClick`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `删除`,
|
||||
text: ``,
|
||||
severity: `danger`,
|
||||
size: `small`,
|
||||
disabled:
|
||||
unref(z) ||
|
||||
!h.active ||
|
||||
!!e.host?.length,
|
||||
onClick: (t) => {
|
||||
((G.value = e), (V.value = ``));
|
||||
},
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`, `onClick`],
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`value`, `loading`],
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
createVNode(
|
||||
y,
|
||||
{
|
||||
visible: unref(H),
|
||||
"onUpdate:visible": (n[3] ||= (e) =>
|
||||
isRef(H) ? (H.value = e) : null),
|
||||
header: `新建 VPC 网络`,
|
||||
modal: ``,
|
||||
closable: !unref(z),
|
||||
"close-on-escape": !unref(z),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(z),
|
||||
onClick: (n[2] ||= (e) => (H.value = !1)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `创建`,
|
||||
loading: unref(z),
|
||||
onClick: pe,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(`div`, se, [
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(A)}-name`,
|
||||
},
|
||||
`名称`,
|
||||
8,
|
||||
ce,
|
||||
),
|
||||
createVNode(
|
||||
v,
|
||||
{
|
||||
id: `${unref(A)}-name`,
|
||||
modelValue: unref(U),
|
||||
"onUpdate:modelValue": (n[0] ||= (e) =>
|
||||
isRef(U) ? (U.value = e) : null),
|
||||
disabled: unref(z),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`id`, `modelValue`, `disabled`],
|
||||
),
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(A)}-cidr`,
|
||||
},
|
||||
`网段（留空自动分配）`,
|
||||
8,
|
||||
E,
|
||||
),
|
||||
createVNode(
|
||||
v,
|
||||
{
|
||||
id: `${unref(A)}-cidr`,
|
||||
modelValue: unref(W),
|
||||
"onUpdate:modelValue": (n[1] ||= (e) =>
|
||||
isRef(W) ? (W.value = e) : null),
|
||||
placeholder: `10.0.0.0/16`,
|
||||
disabled: unref(z),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`id`, `modelValue`, `disabled`],
|
||||
),
|
||||
unref(L).length
|
||||
? (openBlock(),
|
||||
createElementBlock(
|
||||
`p`,
|
||||
le,
|
||||
`允许掩码：` +
|
||||
toDisplayString(unref(L).join(`、`)),
|
||||
1,
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
unref(V)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 1,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(
|
||||
toDisplayString(unref(V)),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `closable`, `close-on-escape`],
|
||||
),
|
||||
createVNode(
|
||||
y,
|
||||
{
|
||||
visible: !!unref(K),
|
||||
header: `分配 / 切换 VPC`,
|
||||
modal: ``,
|
||||
closable: !unref(z),
|
||||
"close-on-escape": !unref(z),
|
||||
"onUpdate:visible": (n[7] ||= (e) => {
|
||||
!e && !unref(z) && (K.value = null);
|
||||
}),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(z),
|
||||
onClick: (n[6] ||= (e) => (K.value = null)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `确认分配`,
|
||||
loading: unref(z),
|
||||
disabled: !unref(q) || unref(J) || !unref(I).length,
|
||||
onClick: me,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`, `disabled`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(`div`, ue, [
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
`目标网络：` + toDisplayString(unref(K)?.name),
|
||||
1,
|
||||
),
|
||||
createElementVNode(
|
||||
`label`,
|
||||
{
|
||||
for: `${unref(A)}-host`,
|
||||
},
|
||||
`实例`,
|
||||
8,
|
||||
de,
|
||||
),
|
||||
createVNode(
|
||||
C,
|
||||
{
|
||||
"input-id": `${unref(A)}-host`,
|
||||
modelValue: unref(q),
|
||||
"onUpdate:modelValue": (n[4] ||= (e) =>
|
||||
isRef(q) ? (q.value = e) : null),
|
||||
options: unref(I),
|
||||
"option-label": `name`,
|
||||
"option-value": `id`,
|
||||
loading: unref(J),
|
||||
disabled: unref(z),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[
|
||||
`input-id`,
|
||||
`modelValue`,
|
||||
`options`,
|
||||
`loading`,
|
||||
`disabled`,
|
||||
],
|
||||
),
|
||||
createVNode(
|
||||
i,
|
||||
{
|
||||
severity: `warn`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
...(n[12] ||= [
|
||||
createTextVNode(
|
||||
`切换 VPC 会改变实例内网连接，请确认相关服务已准备好。`,
|
||||
-1,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
unref(V)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(
|
||||
toDisplayString(unref(V)),
|
||||
1,
|
||||
),
|
||||
!unref(I).length && unref(K)
|
||||
? (openBlock(),
|
||||
createBlock(r, {
|
||||
key: 0,
|
||||
label: `重试`,
|
||||
text: ``,
|
||||
size: `small`,
|
||||
onClick: (n[5] ||= (e) =>
|
||||
$(unref(K))),
|
||||
}))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `closable`, `close-on-escape`],
|
||||
),
|
||||
createVNode(
|
||||
y,
|
||||
{
|
||||
visible: !!unref(G),
|
||||
header: `删除 VPC 网络`,
|
||||
modal: ``,
|
||||
closable: !unref(z),
|
||||
"close-on-escape": !unref(z),
|
||||
"onUpdate:visible": (n[9] ||= (e) => {
|
||||
!e && !unref(z) && (G.value = null);
|
||||
}),
|
||||
},
|
||||
{
|
||||
footer: withCtx(() => [
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `取消`,
|
||||
text: ``,
|
||||
severity: `secondary`,
|
||||
disabled: unref(z),
|
||||
onClick: (n[8] ||= (e) => (G.value = null)),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`disabled`],
|
||||
),
|
||||
createVNode(
|
||||
r,
|
||||
{
|
||||
label: `确认删除`,
|
||||
severity: `danger`,
|
||||
loading: unref(z),
|
||||
onClick: he,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`loading`],
|
||||
),
|
||||
]),
|
||||
default: withCtx(() => [
|
||||
createElementVNode(
|
||||
`p`,
|
||||
null,
|
||||
`确认删除 ` + toDisplayString(unref(G)?.name) + `？`,
|
||||
1,
|
||||
),
|
||||
unref(V)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
i,
|
||||
{
|
||||
key: 0,
|
||||
severity: `error`,
|
||||
closable: !1,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
createTextVNode(toDisplayString(unref(V)), 1),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
))
|
||||
: createCommentVNode(``, !0),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
8,
|
||||
[`visible`, `closable`, `close-on-escape`],
|
||||
),
|
||||
])
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-1d12fc4b`]],
|
||||
),
|
||||
{
|
||||
__name: `MfCloudVpc`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default D;
|
||||
</script>
|
||||
Reference in new issue
Block a user