You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
852 lines
35 KiB
852 lines
35 KiB
"use strict";
|
|
(self["webpackChunk"] = self["webpackChunk"] || []).push([[3590],{
|
|
|
|
/***/ 45634:
|
|
/*!*********************************************!*\
|
|
!*** ./src/pages/tasks/vnc-view/index.less ***!
|
|
\*********************************************/
|
|
/***/ (function() {
|
|
|
|
// extracted by mini-css-extract-plugin
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ 65444:
|
|
/*!******************************************************************!*\
|
|
!*** ./src/pages/tasks/vnc-view/vnc-panel/index.tsx + 2 modules ***!
|
|
\******************************************************************/
|
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
|
|
|
|
// EXPORTS
|
|
__webpack_require__.d(__webpack_exports__, {
|
|
Z: function() { return /* binding */ vnc_panel; }
|
|
});
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
|
var _react_17_0_2_react = __webpack_require__(59301);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/modal/index.js + 16 modules
|
|
var modal = __webpack_require__(43418);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/message/index.js + 4 modules
|
|
var message = __webpack_require__(8591);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/progress/index.js + 13 modules
|
|
var progress = __webpack_require__(93948);
|
|
// EXTERNAL MODULE: ./src/components/Spinner/index.tsx + 1 modules
|
|
var Spinner = __webpack_require__(18343);
|
|
// EXTERNAL MODULE: ./node_modules/_resize-observer-polyfill@1.5.1@resize-observer-polyfill/dist/ResizeObserver.es.js
|
|
var ResizeObserver_es = __webpack_require__(76374);
|
|
// EXTERNAL MODULE: ./src/components/modal.tsx
|
|
var components_modal = __webpack_require__(9805);
|
|
// EXTERNAL MODULE: ./src/.umi-production/exports.ts + 15 modules
|
|
var _umi_production_exports = __webpack_require__(23852);
|
|
// EXTERNAL MODULE: ./src/utils/util.tsx
|
|
var util = __webpack_require__(75798);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/input/index.js + 5 modules
|
|
var input = __webpack_require__(20008);
|
|
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/button/index.js
|
|
var es_button = __webpack_require__(3113);
|
|
;// CONCATENATED MODULE: ./src/pages/tasks/vnc-view/clipboard-box/index.less
|
|
// extracted by mini-css-extract-plugin
|
|
|
|
;// CONCATENATED MODULE: ./src/pages/tasks/vnc-view/clipboard-box/index.tsx
|
|
|
|
|
|
|
|
const TextArea = input["default"].TextArea;
|
|
/* harmony default export */ var clipboard_box = (({ onCancel, onSave, content }) => {
|
|
const [value, setValue] = (0,_react_17_0_2_react.useState)(content);
|
|
function onChangeValue(e) {
|
|
setValue(e.target.value);
|
|
}
|
|
function onSaveContent() {
|
|
onSave(value);
|
|
}
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
setValue(content);
|
|
}, [content]);
|
|
return /* @__PURE__ */ _react_17_0_2_react.createElement("div", { className: "clipboard-box" }, /* @__PURE__ */ _react_17_0_2_react.createElement("h3", null, "\u5B9E\u9A8C\u73AF\u5883\u526A\u5207\u677F\uFF1A"), /* @__PURE__ */ _react_17_0_2_react.createElement(TextArea, { value, onChange: onChangeValue, className: "clipboard" }), /* @__PURE__ */ _react_17_0_2_react.createElement("p", null, " ", /* @__PURE__ */ _react_17_0_2_react.createElement("b", null, " 1.\u4ECE\u5916\u90E8\u590D\u5236\u5185\u5BB9\u5230\u5B9E\u9A8C\u73AF\u5883\u5185\uFF1A "), " \u7C98\u8D34\u5185\u5BB9\u5230\u4E0A\u9762\u6587\u672C\u6846\uFF0C\u70B9\u51FB\u4FDD\u5B58\uFF0C\u7136\u540E\u5728\u5B9E\u9A8C\u73AF\u5883\u4E2D\u8FDB\u884C\u7C98\u8D34\u3002 "), /* @__PURE__ */ _react_17_0_2_react.createElement("p", null, " ", /* @__PURE__ */ _react_17_0_2_react.createElement("b", null, " 2.\u83B7\u53D6\u5B9E\u9A8C\u73AF\u5883\u4E2D\u7684\u5185\u5BB9\uFF1A "), " \u8BF7\u5148\u5728\u73AF\u5883\u4E2D\u590D\u5236\u5185\u5BB9\uFF0C\u590D\u5236\u52A8\u4F5C\u5B8C\u6210\u540E\u5185\u5BB9\u4F1A\u663E\u793A\u5728\u4E0A\u9762\u6587\u672C\u6846\uFF0C\u7136\u540E\u5728\u4E0A\u9762\u6587\u672C\u6846\u4E2D\u518D\u6B21\u590D\u5236\u3002 "), /* @__PURE__ */ _react_17_0_2_react.createElement("div", { className: "btn-action-container" }, /* @__PURE__ */ _react_17_0_2_react.createElement(es_button/* default */.ZP, { type: "ghost", onClick: onCancel, style: { marginRight: 10 } }, "\u53D6\u6D88"), /* @__PURE__ */ _react_17_0_2_react.createElement(es_button/* default */.ZP, { type: "primary", onClick: onSaveContent }, "\u4FDD\u5B58")));
|
|
});
|
|
|
|
// EXTERNAL MODULE: ./src/utils/fullscreen.ts
|
|
var fullscreen = __webpack_require__(91676);
|
|
// EXTERNAL MODULE: ./src/pages/tasks/service/index.js
|
|
var service = __webpack_require__(92487);
|
|
// EXTERNAL MODULE: ./node_modules/_novncrfb@1.2.1@novncrfb/lib/rfb.js
|
|
var rfb = __webpack_require__(62013);
|
|
// EXTERNAL MODULE: ./src/components/mediator.js
|
|
var mediator = __webpack_require__(50993);
|
|
// EXTERNAL MODULE: ./src/utils/fetch.ts
|
|
var fetch = __webpack_require__(64841);
|
|
;// CONCATENATED MODULE: ./src/pages/tasks/vnc-view/vnc-panel/index.tsx
|
|
var __defProp = Object.defineProperty;
|
|
var __defProps = Object.defineProperties;
|
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
var __spreadValues = (a, b) => {
|
|
for (var prop in b || (b = {}))
|
|
if (__hasOwnProp.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
if (__getOwnPropSymbols)
|
|
for (var prop of __getOwnPropSymbols(b)) {
|
|
if (__propIsEnum.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
}
|
|
return a;
|
|
};
|
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
var __async = (__this, __arguments, generator) => {
|
|
return new Promise((resolve, reject) => {
|
|
var fulfilled = (value) => {
|
|
try {
|
|
step(generator.next(value));
|
|
} catch (e) {
|
|
reject(e);
|
|
}
|
|
};
|
|
var rejected = (value) => {
|
|
try {
|
|
step(generator.throw(value));
|
|
} catch (e) {
|
|
reject(e);
|
|
}
|
|
};
|
|
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
step((generator = generator.apply(__this, __arguments)).next());
|
|
});
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function unicodeUnEscape(str) {
|
|
return str.replace(/\\u([\dA-Za-z]{4})/g, function(_, m1) {
|
|
return String.fromCharCode(parseInt("0x" + m1));
|
|
});
|
|
}
|
|
function getJsonFromUrl(url) {
|
|
if (!url)
|
|
url = window.location.search;
|
|
let query = url.substr(1);
|
|
let result = {};
|
|
query.split("&").forEach(function(part) {
|
|
let item = part.split("=");
|
|
result[item[0]] = decodeURIComponent(item[1]);
|
|
});
|
|
return result;
|
|
}
|
|
const initialState = {
|
|
loading: true,
|
|
isLarge: false,
|
|
showClipBoardBox: false,
|
|
transferContent: "",
|
|
mes: "\u5B9E\u9A8C\u73AF\u5883\u51C6\u5907\u4E2D"
|
|
};
|
|
var Types = /* @__PURE__ */ ((Types2) => {
|
|
Types2[Types2["SET_LOADING"] = 0] = "SET_LOADING";
|
|
Types2[Types2["SET_IS_LARGE"] = 1] = "SET_IS_LARGE";
|
|
Types2[Types2["SET_MES"] = 2] = "SET_MES";
|
|
Types2[Types2["SET_STATE"] = 3] = "SET_STATE";
|
|
Types2[Types2["SHOW_CLIPBOARD_BOX"] = 4] = "SHOW_CLIPBOARD_BOX";
|
|
Types2[Types2["SET_TRANSFER_CONTENT"] = 5] = "SET_TRANSFER_CONTENT";
|
|
Types2[Types2["UPDATE_ALL"] = 6] = "UPDATE_ALL";
|
|
return Types2;
|
|
})(Types || {});
|
|
function reducer(state, action) {
|
|
switch (action.type) {
|
|
case 0 /* SET_LOADING */:
|
|
return __spreadProps(__spreadValues({}, state), { loading: action.payload });
|
|
case 1 /* SET_IS_LARGE */:
|
|
return __spreadValues({}, __spreadProps(__spreadValues({}, state), { isLarge: action.payload }));
|
|
case 2 /* SET_MES */:
|
|
return __spreadProps(__spreadValues({}, state), { mes: action.payload });
|
|
case 3 /* SET_STATE */:
|
|
return __spreadValues(__spreadValues({}, state), action.payload);
|
|
case 5 /* SET_TRANSFER_CONTENT */:
|
|
return __spreadProps(__spreadValues({}, state), { transferContent: action.payload });
|
|
case 4 /* SHOW_CLIPBOARD_BOX */:
|
|
return __spreadProps(__spreadValues({}, state), { showClipBoardBox: action.payload });
|
|
case 6 /* UPDATE_ALL */:
|
|
return __spreadValues({ loading: state.loading }, action.payload);
|
|
default:
|
|
throw new Error();
|
|
}
|
|
}
|
|
/* harmony default export */ var vnc_panel = (({
|
|
vnc_url,
|
|
window_vnc_url,
|
|
linux_vnc,
|
|
virtual_machine,
|
|
taskData,
|
|
shixun_environment_id,
|
|
tab_type,
|
|
instance_startup_type,
|
|
//1VNC 2RDP
|
|
index_tab,
|
|
tpi_type
|
|
}) => {
|
|
const el = (0,_react_17_0_2_react.useRef)();
|
|
const guacaRef = (0,_react_17_0_2_react.useRef)();
|
|
const rfbRef = (0,_react_17_0_2_react.useRef)();
|
|
const roRef = (0,_react_17_0_2_react.useRef)();
|
|
const iframeRef = (0,_react_17_0_2_react.useRef)();
|
|
const passwordRef = (0,_react_17_0_2_react.useRef)();
|
|
const socketUrlRef = (0,_react_17_0_2_react.useRef)();
|
|
const reConnectRef = (0,_react_17_0_2_react.useRef)();
|
|
const [state, dispatch] = (0,_react_17_0_2_react.useReducer)(reducer, initialState);
|
|
const [linkNum, setLinkNum] = (0,_react_17_0_2_react.useState)(0);
|
|
const { mes, loading, showClipBoardBox, isLarge, transferContent } = state;
|
|
const heartbeatTimerRef = (0,_react_17_0_2_react.useRef)();
|
|
const loadingRef = (0,_react_17_0_2_react.useRef)();
|
|
let [percent, setPercent] = (0,_react_17_0_2_react.useState)(0);
|
|
let timeout = (0,_react_17_0_2_react.useRef)();
|
|
const params = (0,_umi_production_exports.useParams)();
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
return () => {
|
|
var _a, _b;
|
|
(_b = (_a = guacaRef.current) == null ? void 0 : _a.disconnect) == null ? void 0 : _b.call(_a);
|
|
clearTimeout(reConnectRef.current);
|
|
clearInterval(heartbeatTimerRef.current);
|
|
};
|
|
}, []);
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
loadingRef.current = state.loading;
|
|
}, [state.loading]);
|
|
const fullChange = () => {
|
|
var _a;
|
|
if (instance_startup_type === 2) {
|
|
setTimeout(() => {
|
|
doResize();
|
|
}, 1500);
|
|
} else if (((_a = rfbRef == null ? void 0 : rfbRef.current) == null ? void 0 : _a.resizeSession) !== void 0) {
|
|
if ((0,fullscreen/* IsFull */.vp)()) {
|
|
rfbRef.current.resizeSession = true;
|
|
} else {
|
|
setTimeout(() => {
|
|
rfbRef.current.resizeSession = false;
|
|
}, 900);
|
|
}
|
|
}
|
|
};
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
document.addEventListener((0,fullscreen/* fullscreenChange */.gH)(), fullChange);
|
|
return () => {
|
|
document.removeEventListener((0,fullscreen/* fullscreenChange */.gH)(), fullChange);
|
|
};
|
|
}, []);
|
|
function onCancelClipboardBox() {
|
|
dispatch({
|
|
type: 4 /* SHOW_CLIPBOARD_BOX */,
|
|
payload: false
|
|
});
|
|
}
|
|
function onResizeSet() {
|
|
dispatch({
|
|
type: 1 /* SET_IS_LARGE */,
|
|
payload: !isLarge
|
|
});
|
|
}
|
|
function onLayout(rfb) {
|
|
if (el.current) {
|
|
roRef.current = new ResizeObserver_es/* default */.Z((entries) => {
|
|
for (let entry of entries) {
|
|
if (instance_startup_type === 2) {
|
|
doResize();
|
|
}
|
|
if (entry.target.offsetHeight > 0 || entry.target.offsetWidth > 0) {
|
|
rfb.scaleViewport = true;
|
|
}
|
|
}
|
|
});
|
|
roRef.current.observe(el.current);
|
|
}
|
|
return roRef.current;
|
|
}
|
|
const getWindowVnc = () => __async(void 0, null, function* () {
|
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
const res = yield (0,service/* startInit */.sA)((_a = taskData.myshixun) == null ? void 0 : _a.identifier, __spreadProps(__spreadValues({}, params), {
|
|
taskId: params.taskId,
|
|
shixun_environment_id,
|
|
tab_type
|
|
}));
|
|
if (!!((_c = (_b = res == null ? void 0 : res.data) == null ? void 0 : _b.data_list) == null ? void 0 : _c.length)) {
|
|
mediator/* default */.Z.publish("pod-restrict-data", {
|
|
identifier: (_d = res == null ? void 0 : res.data) == null ? void 0 : _d.identifier,
|
|
data_list: (_e = res == null ? void 0 : res.data) == null ? void 0 : _e.data_list
|
|
});
|
|
return Promise.reject();
|
|
}
|
|
if ((res == null ? void 0 : res.status) === -3) {
|
|
return new Promise((resolve, reject) => __async(void 0, null, function* () {
|
|
modal["default"].confirm({
|
|
content: "\u68C0\u6D4B\u5230\u60A8\u5DF2\u7ECF\u5F00\u542F\u4E86\u5176\u4ED6\u5B9E\u9A8C\u73AF\u5883\uFF0C\u8BF7\u5148\u5173\u95ED\u73AF\u5883\u540E\uFF0C\u518D\u8FDE\u63A5",
|
|
okText: "\u7ACB\u5373\u5173\u95ED",
|
|
cancelText: "\u7A0D\u540E\u5173\u95ED",
|
|
onOk: () => __async(void 0, null, function* () {
|
|
clearTimeout(timeout.current);
|
|
setPercent(0);
|
|
yield (0,service/* closeWindowsVnc */.fA)(params.taskId, res == null ? void 0 : res.message);
|
|
setLinkNum(linkNum + 1);
|
|
return;
|
|
})
|
|
});
|
|
}));
|
|
}
|
|
if ((res == null ? void 0 : res.status) === -1) {
|
|
throw new String(res == null ? void 0 : res.message);
|
|
}
|
|
if ((res == null ? void 0 : res.status) === 0) {
|
|
if (virtual_machine) {
|
|
(0,util/* setCookie */.d8)("PVEAuthCookie", (_g = (_f = res == null ? void 0 : res.data) == null ? void 0 : _f.cookie_options) == null ? void 0 : _g.cookies_value, 1);
|
|
(0,util/* setCookie */.d8)("PVELangCookie", "zh_CN", 1);
|
|
}
|
|
mediator/* default */.Z.publish("update-windows-time", res == null ? void 0 : res.data);
|
|
mediator/* default */.Z.publish("send-tabs-result-data", __spreadProps(__spreadValues({}, res == null ? void 0 : res.data), { index_tab }));
|
|
return res;
|
|
}
|
|
});
|
|
function onConnect() {
|
|
setPercent(100);
|
|
clearTimeout(timeout.current);
|
|
setTimeout(() => {
|
|
rfbRef.current.resizeSession = false;
|
|
dispatch({
|
|
type: 0 /* SET_LOADING */,
|
|
payload: false
|
|
});
|
|
}, 1300);
|
|
clearTimeout(heartbeatTimerRef.current);
|
|
}
|
|
const toConnect = () => {
|
|
rfbRef.current = new rfb/* default */.Z(el.current, socketUrlRef.current, {
|
|
credentials: { password: passwordRef.current },
|
|
wsProtocols: ["binary"],
|
|
// resize: "scale",
|
|
show_dot: true
|
|
});
|
|
rfbRef.current.removeEventListener("disconnect", onDisconnect);
|
|
rfbRef.current.removeEventListener("connect", onConnect);
|
|
rfbRef.current.removeEventListener("clipboard", onClipboardReceive);
|
|
window.rfbs2 = rfbRef.current;
|
|
roRef.current = onLayout(rfbRef.current);
|
|
rfbRef.current.viewOnly = params.view_only || false;
|
|
rfbRef.current.scaleViewport = params.scale || true;
|
|
rfbRef.current.showDotCursor = true;
|
|
rfbRef.current.resizeSession = true;
|
|
rfbRef.current.addEventListener("disconnect", onDisconnect);
|
|
rfbRef.current.addEventListener("connect", onConnect);
|
|
rfbRef.current.addEventListener("clipboard", onClipboardReceive);
|
|
};
|
|
function onClipboardReceive(e) {
|
|
const rs = unicodeUnEscape(e.detail.text);
|
|
dispatch({
|
|
type: 5 /* SET_TRANSFER_CONTENT */,
|
|
payload: rs
|
|
});
|
|
}
|
|
function onDisconnect() {
|
|
if (window_vnc_url) {
|
|
dispatch({
|
|
type: 0 /* SET_LOADING */,
|
|
payload: true
|
|
});
|
|
setLinkNum(linkNum + 1);
|
|
} else {
|
|
clearTimeout(reConnectRef.current);
|
|
if (loadingRef.current)
|
|
return;
|
|
reConnectRef.current = setTimeout(() => {
|
|
setLinkNum(linkNum + 1);
|
|
}, 6e3);
|
|
}
|
|
setTimeout(() => {
|
|
var _a, _b;
|
|
(_b = (_a = rfbRef.current) == null ? void 0 : _a.connect) == null ? void 0 : _b.call(_a);
|
|
}, 3e3);
|
|
}
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
mediator/* default */.Z.subscribe(`reset-linux-windows-vnc-${index_tab}`, () => {
|
|
setLinkNum(linkNum + 1);
|
|
});
|
|
if ((window_vnc_url || vnc_url || linux_vnc || virtual_machine) && el.current) {
|
|
clearTimeout(timeout.current);
|
|
if (instance_startup_type === 2) {
|
|
doResize();
|
|
}
|
|
new Promise(() => __async(void 0, null, function* () {
|
|
var _a, _b, _c, _d, _e;
|
|
const params2 = getJsonFromUrl();
|
|
let res = yield getWindowVnc();
|
|
if (linux_vnc || virtual_machine) {
|
|
const character = ((_b = (_a = res == null ? void 0 : res.data) == null ? void 0 : _a.link_url) == null ? void 0 : _b.includes("?")) ? "&" : "?";
|
|
iframeRef.current.src = ((_c = res == null ? void 0 : res.data) == null ? void 0 : _c.link_url) + character + "time=" + Date.now();
|
|
dispatch({
|
|
type: 0 /* SET_LOADING */,
|
|
payload: false
|
|
});
|
|
return;
|
|
} else if (window_vnc_url) {
|
|
passwordRef.current = "Edu123";
|
|
socketUrlRef.current = decodeURIComponent((_d = res == null ? void 0 : res.data) == null ? void 0 : _d.link_url);
|
|
} else {
|
|
const urlParser = new URL(decodeURIComponent((_e = res == null ? void 0 : res.data) == null ? void 0 : _e.link_url));
|
|
const { protocol, searchParams, host } = urlParser;
|
|
passwordRef.current = searchParams.get("password");
|
|
socketUrlRef.current = `${protocol === "https:" ? "wss" : "ws"}://${host}/${params2.path || "websockify"}`;
|
|
}
|
|
if (instance_startup_type === 2) {
|
|
setTimeout(() => {
|
|
var _a2;
|
|
onLayout();
|
|
iframeRef.current.style.cssText = iframeRef.current.style.cssText + "width:1920px;height:1080px;position:initial";
|
|
iframeRef.current.src = `/rdp.html?tpiId=${(_a2 = taskData == null ? void 0 : taskData.myshixun) == null ? void 0 : _a2.id}&envId=${shixun_environment_id}&tpiType=${tpi_type}`;
|
|
dispatch({
|
|
type: 0 /* SET_LOADING */,
|
|
payload: false
|
|
});
|
|
}, 5e3);
|
|
return;
|
|
}
|
|
toConnect();
|
|
}));
|
|
const unsub = mediator/* default */.Z.subscribe(`vnc-reset-${index_tab}`, (text) => {
|
|
if (text === "\u53D6\u6D88") {
|
|
dispatch({
|
|
type: 0 /* SET_LOADING */,
|
|
payload: false
|
|
});
|
|
return;
|
|
}
|
|
setPercent(0);
|
|
dispatch({
|
|
type: 3 /* SET_STATE */,
|
|
payload: {
|
|
loading: true,
|
|
mes: text || "\u5B9E\u9A8C\u73AF\u5883\u91CD\u7F6E\u4E2D"
|
|
}
|
|
});
|
|
});
|
|
const unsub2 = mediator/* default */.Z.subscribe(`send-ctrl-alt-delete-${index_tab}`, () => {
|
|
var _a;
|
|
(_a = rfbRef.current) == null ? void 0 : _a.sendCtrlAltDel();
|
|
message/* default */.ZP.success("\u53D1\u9001\u6210\u529F");
|
|
});
|
|
const unSub3 = mediator/* default */.Z.subscribe(`show-clipboard-box-${index_tab}`, () => {
|
|
dispatch({
|
|
type: 4 /* SHOW_CLIPBOARD_BOX */,
|
|
payload: true
|
|
});
|
|
});
|
|
setPercent(0);
|
|
return () => {
|
|
var _a, _b, _c, _d;
|
|
(_a = rfbRef.current) == null ? void 0 : _a.removeEventListener("disconnect", onDisconnect);
|
|
(_b = rfbRef.current) == null ? void 0 : _b.removeEventListener("connect", onConnect);
|
|
(_c = rfbRef.current) == null ? void 0 : _c.removeEventListener("clipboard", onClipboardReceive);
|
|
unsub();
|
|
unsub2();
|
|
unSub3();
|
|
el.current && ((_d = roRef.current) == null ? void 0 : _d.unobserve(el.current));
|
|
};
|
|
}
|
|
}, [vnc_url, window_vnc_url, linux_vnc, linkNum, shixun_environment_id, tab_type]);
|
|
function sendRFBMessage() {
|
|
var _a, _b;
|
|
(_b = (_a = rfbRef.current) == null ? void 0 : _a.sendKey) == null ? void 0 : _b.call(_a, 135);
|
|
}
|
|
function clipboardSend(content) {
|
|
return __async(this, null, function* () {
|
|
var _a;
|
|
if (vnc_url) {
|
|
const s = content;
|
|
const res = yield (0,fetch/* default */.ZP)(`/api/tasks/${params.taskId}/vnc_paste.json`, {
|
|
method: "post",
|
|
body: {
|
|
content: Base64.encode(s),
|
|
shixun_environment_id
|
|
}
|
|
});
|
|
if ((res == null ? void 0 : res.status) === 0) {
|
|
dispatch({
|
|
type: 5 /* SET_TRANSFER_CONTENT */,
|
|
payload: content
|
|
});
|
|
message/* default */.ZP.success("\u4FDD\u5B58\u6210\u529F\uFF01\u4F60\u53EF\u4EE5\u5728\u5B9E\u9A8C\u73AF\u5883\u4E2D\u7C98\u8D34\u8BE5\u5185\u5BB9");
|
|
onCancelClipboardBox();
|
|
}
|
|
} else {
|
|
(_a = rfbRef.current) == null ? void 0 : _a.clipboardPasteFrom(content);
|
|
dispatch({
|
|
type: 5 /* SET_TRANSFER_CONTENT */,
|
|
payload: content
|
|
});
|
|
message/* default */.ZP.success("\u4FDD\u5B58\u6210\u529F\uFF01\u4F60\u53EF\u4EE5\u5728\u5B9E\u9A8C\u73AF\u5883\u4E2D\u7C98\u8D34\u8BE5\u5185\u5BB9");
|
|
onCancelClipboardBox();
|
|
}
|
|
});
|
|
}
|
|
function doResize() {
|
|
var scale, origin;
|
|
scale = Math.min(
|
|
document.getElementById("task-right-panel").clientWidth / 1920,
|
|
document.getElementById("task-right-panel").clientHeight / 1260
|
|
);
|
|
iframeRef.current.parentElement.className = "wh1080p";
|
|
iframeRef.current.parentElement.style.cssText = `transform:scale(${scale});transform-origin:center center`;
|
|
el.current.style.cssText = "translate(-50%, -50%) scale(" + scale + ")";
|
|
}
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
if (percent == 0) {
|
|
clearTimeout(timeout.current);
|
|
increase();
|
|
}
|
|
}, [percent]);
|
|
const increase = () => {
|
|
if (percent > 99) {
|
|
percent = 99;
|
|
} else {
|
|
percent = percent + 1;
|
|
timeout.current = setTimeout(() => {
|
|
increase();
|
|
}, 1500);
|
|
}
|
|
if (percent < 100)
|
|
setPercent(percent);
|
|
};
|
|
const showIframe = (0,_react_17_0_2_react.useMemo)(() => {
|
|
if (loading) {
|
|
return "none";
|
|
}
|
|
if (linux_vnc || virtual_machine || window_vnc_url && instance_startup_type === 2) {
|
|
return "block";
|
|
} else {
|
|
return "none";
|
|
}
|
|
}, [linux_vnc, loading, virtual_machine, window_vnc_url]);
|
|
return /* @__PURE__ */ _react_17_0_2_react.createElement(_react_17_0_2_react.Fragment, null, isLarge && /* @__PURE__ */ _react_17_0_2_react.createElement("a", { className: "btn-vnc-resize", onClick: onResizeSet }, /* @__PURE__ */ _react_17_0_2_react.createElement("i", { className: `iconfont icon-tuichuquanping` })), /* @__PURE__ */ _react_17_0_2_react.createElement("div", { style: { width: "100%", height: "100%", overflow: "hidden", position: "absolute", display: showIframe === "block" ? "flex" : "none", alignItems: "center", justifyContent: "center", zIndex: 6 } }, /* @__PURE__ */ _react_17_0_2_react.createElement("div", null, /* @__PURE__ */ _react_17_0_2_react.createElement("iframe", { style: { position: isLarge ? "fixed" : "absolute", left: 0, top: isLarge ? 40 : 0, width: "100%", height: `calc(100% - ${isLarge ? "100px" : "0px"})` }, frameBorder: "0", ref: iframeRef, allowFullScreen: true }))), /* @__PURE__ */ _react_17_0_2_react.createElement("div", { style: { position: isLarge ? "fixed" : "absolute", left: 0, top: isLarge ? 40 : 0, zIndex: 5, width: "100%", height: `calc(100% - ${isLarge ? "100px" : "0px"})` }, className: `${window_vnc_url ? "vnc-panel-wrapper-windows" : "vnc-panel-wrapper"} ${isLarge ? "full-screen" : ""}` }, loading ? /* @__PURE__ */ _react_17_0_2_react.createElement(Spinner/* default */.Z, { message: mes, style: { color: "#0152d9" } }, /* @__PURE__ */ _react_17_0_2_react.createElement("div", { className: "tc", style: { width: 500, margin: "0 auto", color: "#FFF" } }, /* @__PURE__ */ _react_17_0_2_react.createElement(progress/* default */.Z, { percent, format: (p) => /* @__PURE__ */ _react_17_0_2_react.createElement("span", { className: "c-white" }, p, "%") }))) : null, /* @__PURE__ */ _react_17_0_2_react.createElement("div", { ref: el, className: `vnc-panel ${loading ? "hidden zIndexf1" : "animated fadeIn"}` })), /* @__PURE__ */ _react_17_0_2_react.createElement(components_modal/* default */.Z, null, /* @__PURE__ */ _react_17_0_2_react.createElement(
|
|
modal["default"],
|
|
{
|
|
title: "\u590D\u5236\u7C98\u8D34",
|
|
centered: true,
|
|
maskClosable: false,
|
|
open: showClipBoardBox,
|
|
onCancel: onCancelClipboardBox,
|
|
footer: null
|
|
},
|
|
/* @__PURE__ */ _react_17_0_2_react.createElement(clipboard_box, { onCancel: onCancelClipboardBox, onSave: clipboardSend, content: transferContent })
|
|
)));
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ 4887:
|
|
/*!***********************************************************!*\
|
|
!*** ./src/pages/tasks/xterm-panel/index.jsx + 1 modules ***!
|
|
\***********************************************************/
|
|
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
|
|
|
|
// EXPORTS
|
|
__webpack_require__.d(__webpack_exports__, {
|
|
Z: function() { return /* binding */ xterm_panel; }
|
|
});
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
|
var _react_17_0_2_react = __webpack_require__(59301);
|
|
// EXTERNAL MODULE: ./node_modules/_js-base64@2.6.4@js-base64/base64.js
|
|
var base64 = __webpack_require__(24334);
|
|
// EXTERNAL MODULE: ./node_modules/_xterm@4.8.1@xterm/lib/xterm.js
|
|
var xterm = __webpack_require__(34376);
|
|
// EXTERNAL MODULE: ./node_modules/_xterm@4.8.1@xterm/css/xterm.css
|
|
var css_xterm = __webpack_require__(45791);
|
|
;// CONCATENATED MODULE: ./src/pages/tasks/xterm-panel/index.less?modules
|
|
// extracted by mini-css-extract-plugin
|
|
/* harmony default export */ var xterm_panelmodules = ({"xterm-panel":"xterm-panel___XA0p9"});
|
|
// EXTERNAL MODULE: ./src/components/mediator.js
|
|
var mediator = __webpack_require__(50993);
|
|
// EXTERNAL MODULE: ./node_modules/_resize-observer-polyfill@1.5.1@resize-observer-polyfill/dist/ResizeObserver.es.js
|
|
var ResizeObserver_es = __webpack_require__(76374);
|
|
// EXTERNAL MODULE: ./src/pages/tasks/service/index.js
|
|
var service = __webpack_require__(92487);
|
|
// EXTERNAL MODULE: ./src/.umi-production/exports.ts + 15 modules
|
|
var _umi_production_exports = __webpack_require__(23852);
|
|
// EXTERNAL MODULE: ./src/utils/util.tsx
|
|
var util = __webpack_require__(75798);
|
|
;// CONCATENATED MODULE: ./src/pages/tasks/xterm-panel/index.jsx
|
|
/* provided dependency */ var React = __webpack_require__(/*! react */ 59301);
|
|
var __defProp = Object.defineProperty;
|
|
var __defProps = Object.defineProperties;
|
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
var __spreadValues = (a, b) => {
|
|
for (var prop in b || (b = {}))
|
|
if (__hasOwnProp.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
if (__getOwnPropSymbols)
|
|
for (var prop of __getOwnPropSymbols(b)) {
|
|
if (__propIsEnum.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
}
|
|
return a;
|
|
};
|
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
var __async = (__this, __arguments, generator) => {
|
|
return new Promise((resolve, reject) => {
|
|
var fulfilled = (value) => {
|
|
try {
|
|
step(generator.next(value));
|
|
} catch (e) {
|
|
reject(e);
|
|
}
|
|
};
|
|
var rejected = (value) => {
|
|
try {
|
|
step(generator.throw(value));
|
|
} catch (e) {
|
|
reject(e);
|
|
}
|
|
};
|
|
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
step((generator = generator.apply(__this, __arguments)).next());
|
|
});
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const TimeTicket = 3e4;
|
|
/* harmony default export */ var xterm_panel = (({ itemData = {}, game, myshixun }) => {
|
|
const params = (0,_umi_production_exports.useParams)();
|
|
const [term, setTerm] = (0,_react_17_0_2_react.useState)(null);
|
|
const [sshConfigData, setSshConfigData] = (0,_react_17_0_2_react.useState)({});
|
|
const { link_url, password, port } = sshConfigData;
|
|
const el = (0,_react_17_0_2_react.useRef)();
|
|
const socket = (0,_react_17_0_2_react.useRef)();
|
|
const isFirstConnected = (0,_react_17_0_2_react.useRef)(false);
|
|
const lockConnectFail = (0,_react_17_0_2_react.useRef)(false);
|
|
const urlParamsAll = (0,util/* getJsonFromUrl */.oP)();
|
|
const {
|
|
shixun_environment_id,
|
|
position,
|
|
tab_type,
|
|
index_tab
|
|
} = itemData;
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
getInitData();
|
|
}, []);
|
|
function getColsAndRows(width, height, term2) {
|
|
let w = term2._core._renderService.dimensions.actualCellWidth || 9.5;
|
|
let h = term2._core._renderService.dimensions.actualCellHeight || 18;
|
|
const rows = Math.floor(height / h);
|
|
const cols = Math.floor(width / w);
|
|
return [cols, rows];
|
|
}
|
|
function onLayout(term2, el2) {
|
|
const ro = new ResizeObserver_es/* default */.Z((entries) => {
|
|
for (let entry of entries) {
|
|
if (entry.target.offsetHeight > 0 || entry.target.offsetWidth > 0) {
|
|
const [cols, rows] = getColsAndRows(
|
|
entry.target.offsetWidth,
|
|
entry.target.offsetHeight,
|
|
term2
|
|
);
|
|
console.log("cols, rows", cols, rows);
|
|
mediator/* default */.Z.publish(`ssh-xterm-resize-${index_tab}`, {
|
|
columns: cols,
|
|
rows,
|
|
width: entry.target.offsetWidth,
|
|
height: entry.target.offsetHeight
|
|
});
|
|
term2.resize(cols, rows);
|
|
const data1 = base64.Base64.decode("IA==");
|
|
const data = base64.Base64.decode("CBtbSw==");
|
|
term2.write(data1);
|
|
term2.write(data);
|
|
}
|
|
}
|
|
});
|
|
ro.observe(el2);
|
|
return ro;
|
|
}
|
|
function getInitData() {
|
|
return __async(this, null, function* () {
|
|
var _a, _b, _c, _d;
|
|
const response = yield (0,service/* startInit */.sA)(myshixun == null ? void 0 : myshixun.identifier, __spreadValues({
|
|
shixun_environment_id,
|
|
tab_type,
|
|
game_id: game.id
|
|
}, urlParamsAll));
|
|
if (!!((_b = (_a = response == null ? void 0 : response.data) == null ? void 0 : _a.data_list) == null ? void 0 : _b.length)) {
|
|
mediator/* default */.Z.publish("pod-restrict-data", {
|
|
identifier: (_c = response == null ? void 0 : response.data) == null ? void 0 : _c.identifier,
|
|
data_list: (_d = response == null ? void 0 : response.data) == null ? void 0 : _d.data_list
|
|
});
|
|
return;
|
|
}
|
|
if ((response == null ? void 0 : response.status) === -3) {
|
|
return new Promise((resolve, reject) => __async(this, null, function* () {
|
|
Modal.confirm({
|
|
content: "\u68C0\u6D4B\u5230\u60A8\u5DF2\u7ECF\u5F00\u542F\u4E86\u5176\u4ED6\u5B9E\u9A8C\u73AF\u5883\uFF0C\u8BF7\u5148\u5173\u95ED\u73AF\u5883\u540E\uFF0C\u518D\u8FDE\u63A5",
|
|
okText: "\u7ACB\u5373\u5173\u95ED",
|
|
cancelText: "\u7A0D\u540E\u5173\u95ED",
|
|
onOk: () => __async(this, null, function* () {
|
|
yield closeWindowsVnc(params.taskId, response == null ? void 0 : response.message);
|
|
init();
|
|
return;
|
|
})
|
|
});
|
|
}));
|
|
}
|
|
if ((response == null ? void 0 : response.status) === 0) {
|
|
mediator/* default */.Z.publish("update-windows-time", response == null ? void 0 : response.data);
|
|
mediator/* default */.Z.publish("send-tabs-result-data", __spreadProps(__spreadValues({}, response == null ? void 0 : response.data), { index_tab }));
|
|
setSshConfigData(response.data);
|
|
setTimeout(() => mediator/* default */.Z.publish(`create-socket-${index_tab}`), 300);
|
|
}
|
|
});
|
|
}
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
if (el.current && link_url) {
|
|
const term2 = new xterm.Terminal({ fontSize: 16, rendererType: "dom" });
|
|
term2.open(el.current);
|
|
term2.onData((data) => {
|
|
if (socket.current) {
|
|
if (socket.current.readyState === 1) {
|
|
socket.current.send(JSON.stringify({ tp: "client", data }));
|
|
}
|
|
}
|
|
});
|
|
term2.write("Connecting...");
|
|
setTerm(term2);
|
|
const ro = onLayout(term2, el.current);
|
|
return () => {
|
|
term2.dispose();
|
|
el.current && (ro == null ? void 0 : ro.unobserve(el.current));
|
|
};
|
|
}
|
|
}, [link_url, el.current]);
|
|
(0,_react_17_0_2_react.useEffect)(() => {
|
|
if (term && link_url) {
|
|
let createSocket = function() {
|
|
const socketInstance = new WebSocket(link_url);
|
|
socket.current = socketInstance;
|
|
socketInstance.onopen = () => {
|
|
let container = term.element.parentElement;
|
|
if (container) {
|
|
let width = container.offsetWidth;
|
|
let height = container.offsetHeight;
|
|
console.log("init", {
|
|
tp: "init",
|
|
data: __spreadProps(__spreadValues({}, sshConfigData), {
|
|
secret: password,
|
|
width,
|
|
height,
|
|
rows: term.rows,
|
|
columns: term.cols
|
|
})
|
|
});
|
|
socketInstance.send(
|
|
JSON.stringify({
|
|
tp: "init",
|
|
data: __spreadProps(__spreadValues({}, sshConfigData), {
|
|
secret: password,
|
|
width,
|
|
height,
|
|
rows: term.rows,
|
|
columns: term.cols
|
|
})
|
|
})
|
|
);
|
|
}
|
|
term.focus();
|
|
};
|
|
socketInstance.onerror = (error) => {
|
|
console.log(
|
|
"------in socket error----",
|
|
error,
|
|
socketInstance,
|
|
link_url
|
|
);
|
|
};
|
|
socketInstance.onmessage = (event) => {
|
|
lockConnectFail.current = false;
|
|
if (!isFirstConnected.current) {
|
|
term.write("\r");
|
|
setTimeout(() => {
|
|
}, 1e3);
|
|
}
|
|
isFirstConnected.current = true;
|
|
console.log("event:", event);
|
|
const data = base64.Base64.decode(event.data.toString());
|
|
let w = term._core._renderService.dimensions.actualCellWidth || 9.5;
|
|
console.log("data:", data, w, term);
|
|
term.write(data);
|
|
};
|
|
const tid = setInterval(() => {
|
|
var _a;
|
|
if (socket.current) {
|
|
(_a = socket.current) == null ? void 0 : _a.send(JSON.stringify({ tp: "h" }));
|
|
}
|
|
}, TimeTicket);
|
|
socketInstance.onclose = (evt) => {
|
|
if (tid) {
|
|
clearInterval(tid);
|
|
}
|
|
console.log(tid, "tid", index_tab);
|
|
if (!lockConnectFail.current)
|
|
term.write("\r\nconnection closed");
|
|
lockConnectFail.current = true;
|
|
setTimeout(() => {
|
|
createSocket();
|
|
}, 10 * 1e3);
|
|
};
|
|
};
|
|
const unSubCreate = mediator/* default */.Z.subscribe(`create-socket-${index_tab}`, () => {
|
|
createSocket();
|
|
});
|
|
const unSubResize = mediator/* default */.Z.subscribe(`ssh-xterm-resize-${index_tab}`, (option) => {
|
|
if (socket.current && socket.current.readyState === 1) {
|
|
socket.current.send(
|
|
JSON.stringify({ tp: "resize", data: __spreadValues({}, option) })
|
|
);
|
|
}
|
|
});
|
|
return () => {
|
|
unSubCreate();
|
|
unSubResize();
|
|
if (socket.current) {
|
|
socket.current.close();
|
|
isFirstConnected.current = false;
|
|
}
|
|
};
|
|
}
|
|
}, [term, link_url, port]);
|
|
return /* @__PURE__ */ React.createElement("div", { ref: el, className: xterm_panelmodules["xterm-panel"] }, !link_url ? /* @__PURE__ */ React.createElement("p", { style: { color: "#fff" } }, "\u6B63\u5728\u8FDE\u63A5\u547D\u4EE4\u884C\u670D\u52A1...") : null);
|
|
});
|
|
|
|
|
|
/***/ })
|
|
|
|
}]); |