hc-busin-components 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +53 -0
- package/dist/Actions/index.d.ts +20 -0
- package/dist/Actions/index.js +142 -0
- package/dist/Actions/index.less +9 -0
- package/dist/AuthComponents/authDivider.d.ts +15 -0
- package/dist/AuthComponents/authDivider.js +104 -0
- package/dist/AuthComponents/index.d.ts +4 -0
- package/dist/AuthComponents/index.js +14 -0
- package/dist/BasicFilesRead/images/back.png +0 -0
- package/dist/BasicFilesRead/images/excel.png +0 -0
- package/dist/BasicFilesRead/images/folder.png +0 -0
- package/dist/BasicFilesRead/images/image.png +0 -0
- package/dist/BasicFilesRead/images/jpeg.png +0 -0
- package/dist/BasicFilesRead/images/jpg.png +0 -0
- package/dist/BasicFilesRead/images/normal.png +0 -0
- package/dist/BasicFilesRead/images/png.png +0 -0
- package/dist/BasicFilesRead/images/tar.png +0 -0
- package/dist/BasicFilesRead/images/text.png +0 -0
- package/dist/BasicFilesRead/images/zip.png +0 -0
- package/dist/BasicFilesRead/index.d.ts +31 -0
- package/dist/BasicFilesRead/index.js +286 -0
- package/dist/BasicFilesRead/styles/index.d.ts +3 -0
- package/dist/BasicFilesRead/styles/index.js +9 -0
- package/dist/CombinTable/components/RenderContent.d.ts +9 -0
- package/dist/CombinTable/components/RenderContent.js +201 -0
- package/dist/CombinTable/hooks/useTableParams.d.ts +20 -0
- package/dist/CombinTable/hooks/useTableParams.js +75 -0
- package/dist/CombinTable/hooks/useTableState.d.ts +5 -0
- package/dist/CombinTable/hooks/useTableState.js +22 -0
- package/dist/CombinTable/index.d.ts +4 -0
- package/dist/CombinTable/index.js +225 -0
- package/dist/CombinTable/styles/index.d.ts +3 -0
- package/dist/CombinTable/styles/index.js +11 -0
- package/dist/CombinTable/types/index.d.ts +21 -0
- package/dist/CombinTable/types/index.js +1 -0
- package/dist/CombineSearch/components/Content.d.ts +13 -0
- package/dist/CombineSearch/components/Content.js +249 -0
- package/dist/CombineSearch/components/Tags.d.ts +14 -0
- package/dist/CombineSearch/components/Tags.js +115 -0
- package/dist/CombineSearch/hooks/useCombineState.d.ts +5 -0
- package/dist/CombineSearch/hooks/useCombineState.js +17 -0
- package/dist/CombineSearch/index.d.ts +4 -0
- package/dist/CombineSearch/index.js +168 -0
- package/dist/CombineSearch/style/edit.svg +1 -0
- package/dist/CombineSearch/style/index.d.ts +14 -0
- package/dist/CombineSearch/style/index.js +26 -0
- package/dist/CombineSearch/types/index.d.ts +46 -0
- package/dist/CombineSearch/types/index.js +0 -0
- package/dist/ComponentUninstalled/assets/comp-unintall-background.png +0 -0
- package/dist/ComponentUninstalled/assets/comp-unintall-bg.png +0 -0
- package/dist/ComponentUninstalled/index.d.ts +32 -0
- package/dist/ComponentUninstalled/index.js +164 -0
- package/dist/ComponentUninstalled/index.less +108 -0
- package/dist/ComponentUninstalled/locale.d.ts +14 -0
- package/dist/ComponentUninstalled/locale.js +21 -0
- package/dist/DataCountPopover/index.d.ts +23 -0
- package/dist/DataCountPopover/index.js +121 -0
- package/dist/DataCountPopover/index.less +62 -0
- package/dist/DateRangePicker/index.d.ts +38 -0
- package/dist/DateRangePicker/index.js +483 -0
- package/dist/DateRangePicker/index.less +196 -0
- package/dist/DeleteConfirm/index.d.ts +23 -0
- package/dist/DeleteConfirm/index.js +109 -0
- package/dist/DeleteConfirm/index.less +44 -0
- package/dist/DeleteConfirm/locale.d.ts +7 -0
- package/dist/DeleteConfirm/locale.js +7 -0
- package/dist/DisplayButton/index.d.ts +7 -0
- package/dist/DisplayButton/index.js +23 -0
- package/dist/FileRead/images/back.png +0 -0
- package/dist/FileRead/images/excel.png +0 -0
- package/dist/FileRead/images/folder.png +0 -0
- package/dist/FileRead/images/image.png +0 -0
- package/dist/FileRead/images/jpeg.png +0 -0
- package/dist/FileRead/images/jpg.png +0 -0
- package/dist/FileRead/images/normal.png +0 -0
- package/dist/FileRead/images/png.png +0 -0
- package/dist/FileRead/images/tar.png +0 -0
- package/dist/FileRead/images/text.png +0 -0
- package/dist/FileRead/images/zip.png +0 -0
- package/dist/FileRead/index.d.ts +31 -0
- package/dist/FileRead/index.js +417 -0
- package/dist/FileRead/styles/index.d.ts +3 -0
- package/dist/FileRead/styles/index.js +9 -0
- package/dist/Icon/iconfont.d.ts +1 -0
- package/dist/Icon/iconfont.js +1 -0
- package/dist/Icon/index.d.ts +10 -0
- package/dist/Icon/index.js +20 -0
- package/dist/Icon/index.less +11 -0
- package/dist/IconPopTips/index.d.ts +10 -0
- package/dist/IconPopTips/index.js +26 -0
- package/dist/IconPopTips/index.less +33 -0
- package/dist/IconText/index.d.ts +15 -0
- package/dist/IconText/index.js +19 -0
- package/dist/IconText/index.less +38 -0
- package/dist/LogCenter/assets/empty.png +0 -0
- package/dist/LogCenter/context.d.ts +24 -0
- package/dist/LogCenter/context.js +66 -0
- package/dist/LogCenter/history-log.d.ts +35 -0
- package/dist/LogCenter/history-log.js +1214 -0
- package/dist/LogCenter/index.d.ts +8 -0
- package/dist/LogCenter/index.js +130 -0
- package/dist/LogCenter/index.less +577 -0
- package/dist/LogCenter/locale.d.ts +3 -0
- package/dist/LogCenter/locale.js +81 -0
- package/dist/LogCenter/realtime-log.d.ts +35 -0
- package/dist/LogCenter/realtime-log.js +641 -0
- package/dist/LogCenter/select-with-all.d.ts +28 -0
- package/dist/LogCenter/select-with-all.js +337 -0
- package/dist/LogCenter/select-with-all.less +81 -0
- package/dist/LogCenter/services.d.ts +27 -0
- package/dist/LogCenter/services.js +93 -0
- package/dist/LogCenter/tools.d.ts +9 -0
- package/dist/LogCenter/tools.js +137 -0
- package/dist/LogCenter/types.d.ts +133 -0
- package/dist/LogCenter/types.js +1 -0
- package/dist/LogicalResourceFilter/index.d.ts +7 -0
- package/dist/LogicalResourceFilter/index.js +426 -0
- package/dist/LogicalResourceFilter/index.less +139 -0
- package/dist/LogicalResourceFilter/locale.d.ts +2 -0
- package/dist/LogicalResourceFilter/locale.js +10 -0
- package/dist/LogicalResourceFilter/types.d.ts +58 -0
- package/dist/LogicalResourceFilter/types.js +1 -0
- package/dist/MetadataCount/index.d.ts +16 -0
- package/dist/MetadataCount/index.js +97 -0
- package/dist/MetadataCount/index.less +40 -0
- package/dist/MetadataForm/index.d.ts +18 -0
- package/dist/MetadataForm/index.js +85 -0
- package/dist/MetadataForm/index.less +108 -0
- package/dist/MetadataForm/label.d.ts +13 -0
- package/dist/MetadataForm/label.js +447 -0
- package/dist/MetadataPopoverList/fetchArray.d.ts +3 -0
- package/dist/MetadataPopoverList/fetchArray.js +74 -0
- package/dist/MetadataPopoverList/index.d.ts +13 -0
- package/dist/MetadataPopoverList/index.js +98 -0
- package/dist/MetadataPopoverList/index.less +74 -0
- package/dist/MetadataTags/index.d.ts +17 -0
- package/dist/MetadataTags/index.js +109 -0
- package/dist/MetadataTags/index.less +26 -0
- package/dist/OverFlow/index.d.ts +4 -0
- package/dist/OverFlow/index.js +66 -0
- package/dist/OverFlow/types/index.d.ts +11 -0
- package/dist/OverFlow/types/index.js +1 -0
- package/dist/PageHeader/index.d.ts +16 -0
- package/dist/PageHeader/index.js +41 -0
- package/dist/PageHeader/index.less +89 -0
- package/dist/ResourceProgress/index.d.ts +6 -0
- package/dist/ResourceProgress/index.js +102 -0
- package/dist/ResourceProgress/index.less +86 -0
- package/dist/ResourceProgress/types/index.d.ts +15 -0
- package/dist/ResourceProgress/types/index.js +1 -0
- package/dist/Terminal/index.d.ts +44 -0
- package/dist/Terminal/index.js +390 -0
- package/dist/Terminal/index.less +39 -0
- package/dist/TextCopy/index.d.ts +21 -0
- package/dist/TextCopy/index.js +38 -0
- package/dist/TextCopy/index.less +51 -0
- package/dist/TextEllipsis/index.d.ts +18 -0
- package/dist/TextEllipsis/index.js +31 -0
- package/dist/TextEllipsis/index.less +3 -0
- package/dist/ThemeForm/index.d.ts +6 -0
- package/dist/ThemeForm/index.js +15 -0
- package/dist/ThemeForm/index.less +15 -0
- package/dist/ThemeSubmit/index.d.ts +16 -0
- package/dist/ThemeSubmit/index.js +60 -0
- package/dist/ThemeSubmit/index.less +30 -0
- package/dist/TooltipSpan/index.d.ts +6 -0
- package/dist/TooltipSpan/index.js +72 -0
- package/dist/UsageCycle/index.d.ts +12 -0
- package/dist/UsageCycle/index.js +71 -0
- package/dist/UsageCycle/index.less +56 -0
- package/dist/Yaml/CodeMirrorWrapper.d.ts +14 -0
- package/dist/Yaml/CodeMirrorWrapper.js +106 -0
- package/dist/Yaml/index.d.ts +6 -0
- package/dist/Yaml/index.js +470 -0
- package/dist/Yaml/index.less +190 -0
- package/dist/Yaml/types.d.ts +38 -0
- package/dist/Yaml/types.js +1 -0
- package/dist/index.d.ts +52 -0
- package/dist/index.js +32 -0
- package/dist/metadata/locale.d.ts +52 -0
- package/dist/metadata/locale.js +69 -0
- package/dist/showMore/index.d.ts +6 -0
- package/dist/showMore/index.js +40 -0
- package/package.json +121 -0
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Terminal as XTerm } from 'xterm';
|
|
3
|
+
import 'xterm/css/xterm.css';
|
|
4
|
+
import './index.less';
|
|
5
|
+
export interface TerminalTooltips {
|
|
6
|
+
pause?: string;
|
|
7
|
+
resume?: string;
|
|
8
|
+
refresh?: string;
|
|
9
|
+
download?: string;
|
|
10
|
+
}
|
|
11
|
+
export interface TerminalProps {
|
|
12
|
+
/** 交互模式:终端或只读日志 */
|
|
13
|
+
mode?: 'terminal' | 'log';
|
|
14
|
+
/** 页面协议,默认当前页 `location.protocol` */
|
|
15
|
+
protocol?: 'http:' | 'https:';
|
|
16
|
+
/** 主机名,默认 `location.hostname` */
|
|
17
|
+
hostname?: string;
|
|
18
|
+
/** 端口,默认由当前页协议推导 */
|
|
19
|
+
port?: string;
|
|
20
|
+
/** WebSocket 路径,如 `/wscaas/terminal` */
|
|
21
|
+
apiUrl: string;
|
|
22
|
+
/** 查询参数,如 `{ clusterId: 'x' }` */
|
|
23
|
+
params?: Record<string, string | number | boolean>;
|
|
24
|
+
/** 作为 WebSocket 子协议传入(与后端约定一致时保留) */
|
|
25
|
+
token?: string;
|
|
26
|
+
/** 日志模式下的日志类型 */
|
|
27
|
+
logType?: string;
|
|
28
|
+
/** 日志模式是否初始化即开 WebSocket */
|
|
29
|
+
initWs?: boolean;
|
|
30
|
+
/** 日志模式关闭实时后,用于拉取静态日志 */
|
|
31
|
+
refreshMethod?: () => Promise<string>;
|
|
32
|
+
/**
|
|
33
|
+
* 自定义处理服务端消息;默认解析 JSON `{ type, text }`,`TERMINAL_PRINT` 时 `term.write(text)`
|
|
34
|
+
*/
|
|
35
|
+
onMessage?: (term: XTerm, e: MessageEvent) => void;
|
|
36
|
+
/**
|
|
37
|
+
* @deprecated 拼写错误,请使用 `onMessage`
|
|
38
|
+
*/
|
|
39
|
+
onMessgae?: (term: XTerm, e: MessageEvent) => void;
|
|
40
|
+
/** 覆盖日志条 Tooltip 文案 */
|
|
41
|
+
tooltips?: Partial<TerminalTooltips>;
|
|
42
|
+
}
|
|
43
|
+
declare const Terminal: React.FC<TerminalProps>;
|
|
44
|
+
export default Terminal;
|
|
@@ -0,0 +1,390 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
3
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
4
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
5
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
6
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
7
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
8
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
|
|
9
|
+
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
10
|
+
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
11
|
+
import { CaretRightOutlined, DownloadOutlined, PauseOutlined, ReloadOutlined } from '@ant-design/icons';
|
|
12
|
+
import { Tooltip } from 'antd';
|
|
13
|
+
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
14
|
+
import { Terminal as XTerm } from 'xterm';
|
|
15
|
+
import { FitAddon } from 'xterm-addon-fit';
|
|
16
|
+
import 'xterm/css/xterm.css';
|
|
17
|
+
import "./index.less";
|
|
18
|
+
var defaultRefresh = /*#__PURE__*/function () {
|
|
19
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
|
|
20
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
21
|
+
while (1) switch (_context.prev = _context.next) {
|
|
22
|
+
case 0:
|
|
23
|
+
return _context.abrupt("return", '');
|
|
24
|
+
case 1:
|
|
25
|
+
case "end":
|
|
26
|
+
return _context.stop();
|
|
27
|
+
}
|
|
28
|
+
}, _callee);
|
|
29
|
+
}));
|
|
30
|
+
return function defaultRefresh() {
|
|
31
|
+
return _ref.apply(this, arguments);
|
|
32
|
+
};
|
|
33
|
+
}();
|
|
34
|
+
var Terminal = function Terminal(props) {
|
|
35
|
+
var _tooltipsProp$pause, _tooltipsProp$resume, _tooltipsProp$refresh, _tooltipsProp$downloa;
|
|
36
|
+
var _props$protocol = props.protocol,
|
|
37
|
+
protocol = _props$protocol === void 0 ? typeof window !== 'undefined' ? window.location.protocol : 'http:' : _props$protocol,
|
|
38
|
+
_props$port = props.port,
|
|
39
|
+
port = _props$port === void 0 ? typeof window !== 'undefined' && window.location.port ? window.location.port : typeof window !== 'undefined' && window.location.protocol === 'http:' ? '80' : '443' : _props$port,
|
|
40
|
+
_props$hostname = props.hostname,
|
|
41
|
+
hostname = _props$hostname === void 0 ? typeof window !== 'undefined' ? window.location.hostname : '' : _props$hostname,
|
|
42
|
+
_props$logType = props.logType,
|
|
43
|
+
logType = _props$logType === void 0 ? 'stdoutlog' : _props$logType,
|
|
44
|
+
apiUrl = props.apiUrl,
|
|
45
|
+
_props$params = props.params,
|
|
46
|
+
params = _props$params === void 0 ? {} : _props$params,
|
|
47
|
+
_props$token = props.token,
|
|
48
|
+
token = _props$token === void 0 ? '' : _props$token,
|
|
49
|
+
_props$initWs = props.initWs,
|
|
50
|
+
initWs = _props$initWs === void 0 ? false : _props$initWs,
|
|
51
|
+
_props$mode = props.mode,
|
|
52
|
+
mode = _props$mode === void 0 ? 'terminal' : _props$mode,
|
|
53
|
+
_props$refreshMethod = props.refreshMethod,
|
|
54
|
+
refreshMethod = _props$refreshMethod === void 0 ? defaultRefresh : _props$refreshMethod,
|
|
55
|
+
tooltipsProp = props.tooltips,
|
|
56
|
+
onMessage = props.onMessage,
|
|
57
|
+
onMessgae = props.onMessgae;
|
|
58
|
+
var mergedTooltips = {
|
|
59
|
+
pause: (_tooltipsProp$pause = tooltipsProp === null || tooltipsProp === void 0 ? void 0 : tooltipsProp.pause) !== null && _tooltipsProp$pause !== void 0 ? _tooltipsProp$pause : '暂停实时',
|
|
60
|
+
resume: (_tooltipsProp$resume = tooltipsProp === null || tooltipsProp === void 0 ? void 0 : tooltipsProp.resume) !== null && _tooltipsProp$resume !== void 0 ? _tooltipsProp$resume : '开始实时',
|
|
61
|
+
refresh: (_tooltipsProp$refresh = tooltipsProp === null || tooltipsProp === void 0 ? void 0 : tooltipsProp.refresh) !== null && _tooltipsProp$refresh !== void 0 ? _tooltipsProp$refresh : '刷新',
|
|
62
|
+
download: (_tooltipsProp$downloa = tooltipsProp === null || tooltipsProp === void 0 ? void 0 : tooltipsProp.download) !== null && _tooltipsProp$downloa !== void 0 ? _tooltipsProp$downloa : '下载'
|
|
63
|
+
};
|
|
64
|
+
var customMessage = onMessage !== null && onMessage !== void 0 ? onMessage : onMessgae;
|
|
65
|
+
var _useState = useState(mode === 'log' ? initWs : true),
|
|
66
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
67
|
+
socketActive = _useState2[0],
|
|
68
|
+
setSocketActive = _useState2[1];
|
|
69
|
+
var _useState3 = useState(mode === 'log' ? initWs : true),
|
|
70
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
71
|
+
isRunnedSocket = _useState4[0],
|
|
72
|
+
setIsRunnedSocket = _useState4[1];
|
|
73
|
+
var _useState5 = useState(null),
|
|
74
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
75
|
+
term = _useState6[0],
|
|
76
|
+
setTerm = _useState6[1];
|
|
77
|
+
var terminalRef = useRef(null);
|
|
78
|
+
var termRef = useRef(null);
|
|
79
|
+
var wsRef = useRef(null);
|
|
80
|
+
var fitAddonRef = useRef(null);
|
|
81
|
+
var resizeTimeoutRef = useRef(null);
|
|
82
|
+
var modeRef = useRef(mode);
|
|
83
|
+
var lastWsConnectKeyRef = useRef(null);
|
|
84
|
+
modeRef.current = mode;
|
|
85
|
+
var action = function action(type, data) {
|
|
86
|
+
return JSON.stringify(Object.assign({
|
|
87
|
+
terminalType: type
|
|
88
|
+
}, data));
|
|
89
|
+
};
|
|
90
|
+
var getParamStr = function getParamStr() {
|
|
91
|
+
var str = '';
|
|
92
|
+
Object.keys(params).forEach(function (key) {
|
|
93
|
+
str += "&".concat(key, "=").concat(String(params[key]));
|
|
94
|
+
});
|
|
95
|
+
return str.slice(1);
|
|
96
|
+
};
|
|
97
|
+
var defaultOnMessage = function defaultOnMessage(t, e) {
|
|
98
|
+
try {
|
|
99
|
+
var data = JSON.parse(e.data);
|
|
100
|
+
if (data.type === 'TERMINAL_PRINT' && typeof data.text === 'string') {
|
|
101
|
+
t.write(data.text);
|
|
102
|
+
}
|
|
103
|
+
} catch (_unused) {
|
|
104
|
+
// 非 JSON 消息忽略
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
var resizeScreen = function resizeScreen(t) {
|
|
108
|
+
try {
|
|
109
|
+
t.onResize(function () {
|
|
110
|
+
if (resizeTimeoutRef.current !== null) {
|
|
111
|
+
clearTimeout(resizeTimeoutRef.current);
|
|
112
|
+
}
|
|
113
|
+
resizeTimeoutRef.current = setTimeout(function () {
|
|
114
|
+
var ws = wsRef.current;
|
|
115
|
+
if (modeRef.current === 'terminal' && ws && ws.readyState === 1) {
|
|
116
|
+
ws.send(action('resize', {
|
|
117
|
+
columns: t.cols,
|
|
118
|
+
rows: t.rows
|
|
119
|
+
}));
|
|
120
|
+
}
|
|
121
|
+
resizeTimeoutRef.current = null;
|
|
122
|
+
}, 300);
|
|
123
|
+
});
|
|
124
|
+
} catch (_unused2) {
|
|
125
|
+
// ignore
|
|
126
|
+
}
|
|
127
|
+
};
|
|
128
|
+
var initTerm = function initTerm() {
|
|
129
|
+
var terminalDOM = terminalRef.current;
|
|
130
|
+
var containerWidth = terminalDOM.offsetWidth;
|
|
131
|
+
var containerHeight = terminalDOM.offsetHeight;
|
|
132
|
+
// 容器尚未布局完成时避免回退到 80 列撑宽父级,由 FitAddon 在 resize 后校正
|
|
133
|
+
var cols = containerWidth > 0 ? Math.max(1, Math.floor(containerWidth / 9)) : 1;
|
|
134
|
+
var rows = containerHeight > 0 ? Math.max(1, Math.floor(containerHeight / 17)) : 1;
|
|
135
|
+
var next = new XTerm({
|
|
136
|
+
rendererType: 'canvas',
|
|
137
|
+
convertEol: false,
|
|
138
|
+
cols: cols,
|
|
139
|
+
rows: rows,
|
|
140
|
+
scrollback: 100000,
|
|
141
|
+
disableStdin: modeRef.current === 'log',
|
|
142
|
+
cursorStyle: 'underline',
|
|
143
|
+
cursorBlink: true,
|
|
144
|
+
theme: {
|
|
145
|
+
foreground: modeRef.current === 'log' ? '#b7c4d1' : 'white',
|
|
146
|
+
background: '#242e42',
|
|
147
|
+
cursor: 'help'
|
|
148
|
+
}
|
|
149
|
+
});
|
|
150
|
+
var fit = new FitAddon();
|
|
151
|
+
fitAddonRef.current = fit;
|
|
152
|
+
next.loadAddon(fit);
|
|
153
|
+
next.open(terminalDOM);
|
|
154
|
+
resizeScreen(next);
|
|
155
|
+
var runFit = function runFit() {
|
|
156
|
+
try {
|
|
157
|
+
fit.fit();
|
|
158
|
+
} catch (_unused3) {
|
|
159
|
+
// ignore
|
|
160
|
+
}
|
|
161
|
+
};
|
|
162
|
+
runFit();
|
|
163
|
+
requestAnimationFrame(runFit);
|
|
164
|
+
termRef.current = next;
|
|
165
|
+
setTerm(next);
|
|
166
|
+
return next;
|
|
167
|
+
};
|
|
168
|
+
var websocketConnect = function websocketConnect(t) {
|
|
169
|
+
var wsProtocol = protocol === 'https:' ? 'wss:' : 'ws:';
|
|
170
|
+
var paramStr = getParamStr();
|
|
171
|
+
if (!paramStr) return;
|
|
172
|
+
setIsRunnedSocket(true);
|
|
173
|
+
var url = "".concat(wsProtocol, "//").concat(hostname, ":").concat(port).concat(apiUrl, "?").concat(paramStr);
|
|
174
|
+
try {
|
|
175
|
+
var ws = token ? new WebSocket(url, token) : new WebSocket(url);
|
|
176
|
+
wsRef.current = ws;
|
|
177
|
+
ws.onopen = function () {
|
|
178
|
+
t.writeln('Connection succeeded');
|
|
179
|
+
t.writeln('');
|
|
180
|
+
if (modeRef.current === 'terminal') {
|
|
181
|
+
ws.send(action('ready'));
|
|
182
|
+
ws.send(action('resize', {
|
|
183
|
+
columns: t.cols,
|
|
184
|
+
rows: t.rows
|
|
185
|
+
}));
|
|
186
|
+
t.write('\r\n #');
|
|
187
|
+
t.onData(function (command) {
|
|
188
|
+
ws.send(action('command', {
|
|
189
|
+
command: command
|
|
190
|
+
}));
|
|
191
|
+
});
|
|
192
|
+
} else if (modeRef.current === 'log') {
|
|
193
|
+
ws.send(JSON.stringify({
|
|
194
|
+
logType: logType
|
|
195
|
+
}));
|
|
196
|
+
}
|
|
197
|
+
};
|
|
198
|
+
ws.onerror = function () {
|
|
199
|
+
t.writeln('Connection error');
|
|
200
|
+
};
|
|
201
|
+
ws.onclose = function () {
|
|
202
|
+
t.writeln('Connection closed');
|
|
203
|
+
};
|
|
204
|
+
ws.onmessage = function (e) {
|
|
205
|
+
if (typeof customMessage === 'function') {
|
|
206
|
+
customMessage(t, e);
|
|
207
|
+
return;
|
|
208
|
+
}
|
|
209
|
+
defaultOnMessage(t, e);
|
|
210
|
+
};
|
|
211
|
+
} catch (_unused4) {
|
|
212
|
+
t.writeln('Connection failed');
|
|
213
|
+
wsRef.current = null;
|
|
214
|
+
}
|
|
215
|
+
};
|
|
216
|
+
var getLogHandle = /*#__PURE__*/function () {
|
|
217
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(t) {
|
|
218
|
+
var res, resArr;
|
|
219
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
220
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
221
|
+
case 0:
|
|
222
|
+
if (t) {
|
|
223
|
+
_context2.next = 2;
|
|
224
|
+
break;
|
|
225
|
+
}
|
|
226
|
+
return _context2.abrupt("return");
|
|
227
|
+
case 2:
|
|
228
|
+
if (socketActive) {
|
|
229
|
+
_context2.next = 11;
|
|
230
|
+
break;
|
|
231
|
+
}
|
|
232
|
+
_context2.next = 5;
|
|
233
|
+
return refreshMethod();
|
|
234
|
+
case 5:
|
|
235
|
+
res = _context2.sent;
|
|
236
|
+
t.clear();
|
|
237
|
+
t.writeln('Connection succeeded');
|
|
238
|
+
t.writeln('');
|
|
239
|
+
resArr = res ? res.split('\n') : [];
|
|
240
|
+
resArr.forEach(function (resItem) {
|
|
241
|
+
t.writeln(resItem);
|
|
242
|
+
});
|
|
243
|
+
case 11:
|
|
244
|
+
case "end":
|
|
245
|
+
return _context2.stop();
|
|
246
|
+
}
|
|
247
|
+
}, _callee2);
|
|
248
|
+
}));
|
|
249
|
+
return function getLogHandle(_x) {
|
|
250
|
+
return _ref2.apply(this, arguments);
|
|
251
|
+
};
|
|
252
|
+
}();
|
|
253
|
+
var fakeClick = function fakeClick(obj) {
|
|
254
|
+
obj.dispatchEvent(new MouseEvent('click'));
|
|
255
|
+
};
|
|
256
|
+
var download = function download() {
|
|
257
|
+
var t = termRef.current;
|
|
258
|
+
if (!t) return;
|
|
259
|
+
t.selectAll();
|
|
260
|
+
var content = t.getSelection();
|
|
261
|
+
t.clearSelection();
|
|
262
|
+
var exportBlob = new Blob([content]);
|
|
263
|
+
var saveLink = document.createElement('a');
|
|
264
|
+
saveLink.href = window.URL.createObjectURL(exportBlob);
|
|
265
|
+
var dateStr = new Date().toJSON().split('.')[0].replace('T', '').replace(/-/g, '').replace(/:/g, '');
|
|
266
|
+
saveLink.download = "".concat(logType, "_").concat(dateStr, "_log.txt");
|
|
267
|
+
fakeClick(saveLink);
|
|
268
|
+
};
|
|
269
|
+
var handleResize = useCallback(function () {
|
|
270
|
+
var t = termRef.current;
|
|
271
|
+
var fit = fitAddonRef.current;
|
|
272
|
+
if (terminalRef.current && t && fit) {
|
|
273
|
+
try {
|
|
274
|
+
fit.fit();
|
|
275
|
+
} catch (_unused5) {
|
|
276
|
+
// ignore
|
|
277
|
+
}
|
|
278
|
+
}
|
|
279
|
+
}, []);
|
|
280
|
+
useEffect(function () {
|
|
281
|
+
if (!terminalRef.current) return;
|
|
282
|
+
var initialTerm = initTerm();
|
|
283
|
+
window.addEventListener('resize', handleResize);
|
|
284
|
+
return function () {
|
|
285
|
+
var _wsRef$current;
|
|
286
|
+
window.removeEventListener('resize', handleResize);
|
|
287
|
+
(_wsRef$current = wsRef.current) === null || _wsRef$current === void 0 || _wsRef$current.close();
|
|
288
|
+
wsRef.current = null;
|
|
289
|
+
fitAddonRef.current = null;
|
|
290
|
+
initialTerm.dispose();
|
|
291
|
+
termRef.current = null;
|
|
292
|
+
setTerm(null);
|
|
293
|
+
};
|
|
294
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps -- 仅挂载时创建终端
|
|
295
|
+
}, []);
|
|
296
|
+
useEffect(function () {
|
|
297
|
+
if (terminalRef.current && term) {
|
|
298
|
+
var resizeObserver = new ResizeObserver(function () {
|
|
299
|
+
var fit = fitAddonRef.current;
|
|
300
|
+
if (fit) {
|
|
301
|
+
try {
|
|
302
|
+
fit.fit();
|
|
303
|
+
} catch (_unused6) {
|
|
304
|
+
// ignore
|
|
305
|
+
}
|
|
306
|
+
}
|
|
307
|
+
});
|
|
308
|
+
resizeObserver.observe(terminalRef.current);
|
|
309
|
+
return function () {
|
|
310
|
+
resizeObserver.disconnect();
|
|
311
|
+
};
|
|
312
|
+
}
|
|
313
|
+
}, [term]);
|
|
314
|
+
useEffect(function () {
|
|
315
|
+
var hasParams = Object.keys(params).length > 0;
|
|
316
|
+
var connectKey = "".concat(JSON.stringify(params), "|").concat(logType, "|").concat(token);
|
|
317
|
+
if (term && socketActive) {
|
|
318
|
+
var _wsRef$current2;
|
|
319
|
+
if (lastWsConnectKeyRef.current === connectKey) {
|
|
320
|
+
return;
|
|
321
|
+
}
|
|
322
|
+
lastWsConnectKeyRef.current = connectKey;
|
|
323
|
+
term.dispose();
|
|
324
|
+
(_wsRef$current2 = wsRef.current) === null || _wsRef$current2 === void 0 || _wsRef$current2.close();
|
|
325
|
+
wsRef.current = null;
|
|
326
|
+
var newTerm = initTerm();
|
|
327
|
+
if (hasParams) {
|
|
328
|
+
websocketConnect(newTerm);
|
|
329
|
+
}
|
|
330
|
+
} else if (term && mode === 'log' && hasParams && isRunnedSocket) {
|
|
331
|
+
getLogHandle(term);
|
|
332
|
+
}
|
|
333
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
334
|
+
}, [params, logType, token, term]);
|
|
335
|
+
useEffect(function () {
|
|
336
|
+
var t = termRef.current;
|
|
337
|
+
if (!t) return;
|
|
338
|
+
if (socketActive) {
|
|
339
|
+
var _wsRef$current3;
|
|
340
|
+
(_wsRef$current3 = wsRef.current) === null || _wsRef$current3 === void 0 || _wsRef$current3.close();
|
|
341
|
+
wsRef.current = null;
|
|
342
|
+
t.clear();
|
|
343
|
+
websocketConnect(t);
|
|
344
|
+
} else {
|
|
345
|
+
var _wsRef$current4;
|
|
346
|
+
(_wsRef$current4 = wsRef.current) === null || _wsRef$current4 === void 0 || _wsRef$current4.close();
|
|
347
|
+
wsRef.current = null;
|
|
348
|
+
}
|
|
349
|
+
}, [socketActive]);
|
|
350
|
+
useEffect(function () {
|
|
351
|
+
setSocketActive(mode === 'log' ? initWs : true);
|
|
352
|
+
}, [initWs, mode]);
|
|
353
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
354
|
+
ref: terminalRef,
|
|
355
|
+
className: "qkd-terminal-container"
|
|
356
|
+
}, mode === 'log' && /*#__PURE__*/React.createElement("div", {
|
|
357
|
+
className: "operate"
|
|
358
|
+
}, socketActive && /*#__PURE__*/React.createElement(Tooltip, {
|
|
359
|
+
title: mergedTooltips.pause,
|
|
360
|
+
placement: "bottom"
|
|
361
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
362
|
+
role: "presentation",
|
|
363
|
+
onClick: function onClick() {
|
|
364
|
+
setSocketActive(false);
|
|
365
|
+
}
|
|
366
|
+
}, /*#__PURE__*/React.createElement(PauseOutlined, null))), !socketActive && /*#__PURE__*/React.createElement(Tooltip, {
|
|
367
|
+
title: mergedTooltips.resume,
|
|
368
|
+
placement: "bottom"
|
|
369
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
370
|
+
role: "presentation",
|
|
371
|
+
onClick: function onClick() {
|
|
372
|
+
setSocketActive(true);
|
|
373
|
+
}
|
|
374
|
+
}, /*#__PURE__*/React.createElement(CaretRightOutlined, null))), /*#__PURE__*/React.createElement(Tooltip, {
|
|
375
|
+
title: mergedTooltips.refresh,
|
|
376
|
+
placement: "bottom"
|
|
377
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
378
|
+
role: "presentation",
|
|
379
|
+
onClick: function onClick() {
|
|
380
|
+
getLogHandle(termRef.current);
|
|
381
|
+
}
|
|
382
|
+
}, /*#__PURE__*/React.createElement(ReloadOutlined, null))), /*#__PURE__*/React.createElement(Tooltip, {
|
|
383
|
+
title: mergedTooltips.download,
|
|
384
|
+
placement: "bottom"
|
|
385
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
386
|
+
role: "presentation",
|
|
387
|
+
onClick: download
|
|
388
|
+
}, /*#__PURE__*/React.createElement(DownloadOutlined, null)))));
|
|
389
|
+
};
|
|
390
|
+
export default Terminal;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
.qkd-terminal-container {
|
|
2
|
+
position: relative;
|
|
3
|
+
width: 100%;
|
|
4
|
+
height: 100%;
|
|
5
|
+
padding: 5px;
|
|
6
|
+
background: #242e42;
|
|
7
|
+
|
|
8
|
+
.operate {
|
|
9
|
+
position: absolute;
|
|
10
|
+
top: 5px;
|
|
11
|
+
right: 5px;
|
|
12
|
+
z-index: 4;
|
|
13
|
+
display: flex;
|
|
14
|
+
justify-content: space-between;
|
|
15
|
+
width: 80px;
|
|
16
|
+
height: 26px;
|
|
17
|
+
padding: 0 8px;
|
|
18
|
+
font-size: 16px;
|
|
19
|
+
background-color: #36435c;
|
|
20
|
+
border-radius: 10px;
|
|
21
|
+
|
|
22
|
+
p {
|
|
23
|
+
height: 80%;
|
|
24
|
+
margin: 0;
|
|
25
|
+
color: #b6c2cd;
|
|
26
|
+
cursor: pointer;
|
|
27
|
+
|
|
28
|
+
&:hover {
|
|
29
|
+
color: #fff;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.xterm {
|
|
35
|
+
.xterm-viewport {
|
|
36
|
+
background-color: transparent !important;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
export interface TextCopyProps {
|
|
4
|
+
/** 复制的内容 */
|
|
5
|
+
content: string;
|
|
6
|
+
/** 显示的内容,默认与复制内容一致 */
|
|
7
|
+
text?: string;
|
|
8
|
+
/** 显示字符最大长度,默认 15;为 0 表示不截断 */
|
|
9
|
+
limit?: number;
|
|
10
|
+
/** 是否仅显示复制图标 */
|
|
11
|
+
onlyIcon?: boolean;
|
|
12
|
+
/** 根节点类名 */
|
|
13
|
+
className?: string;
|
|
14
|
+
/**
|
|
15
|
+
* 为 false 时复制按钮常显;为 true 时默认仅在悬浮/聚焦时显示复制按钮
|
|
16
|
+
* @default true
|
|
17
|
+
*/
|
|
18
|
+
hoverShow?: boolean;
|
|
19
|
+
}
|
|
20
|
+
declare const TextCopy: React.FC<TextCopyProps>;
|
|
21
|
+
export default TextCopy;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { CopyOutlined } from '@ant-design/icons';
|
|
2
|
+
import { Button, message } from 'antd';
|
|
3
|
+
import copy from 'copy-to-clipboard';
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import TextEllipsis from "../TextEllipsis";
|
|
6
|
+
import "./index.less";
|
|
7
|
+
var TextCopy = function TextCopy(_ref) {
|
|
8
|
+
var content = _ref.content,
|
|
9
|
+
text = _ref.text,
|
|
10
|
+
_ref$limit = _ref.limit,
|
|
11
|
+
limit = _ref$limit === void 0 ? 15 : _ref$limit,
|
|
12
|
+
_ref$onlyIcon = _ref.onlyIcon,
|
|
13
|
+
onlyIcon = _ref$onlyIcon === void 0 ? false : _ref$onlyIcon,
|
|
14
|
+
className = _ref.className,
|
|
15
|
+
_ref$hoverShow = _ref.hoverShow,
|
|
16
|
+
hoverShow = _ref$hoverShow === void 0 ? true : _ref$hoverShow;
|
|
17
|
+
var rootClass = ['qkd-text-copy', onlyIcon ? 'icon-only' : '', hoverShow ? '' : 'always-show', className || ''].filter(Boolean).join(' ');
|
|
18
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
19
|
+
className: rootClass
|
|
20
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
21
|
+
className: "qkd-text-copy-text"
|
|
22
|
+
}, limit === 0 ? /*#__PURE__*/React.createElement(React.Fragment, null, text || content) : /*#__PURE__*/React.createElement(TextEllipsis, {
|
|
23
|
+
content: text || content,
|
|
24
|
+
limit: limit
|
|
25
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
26
|
+
className: "oper"
|
|
27
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
28
|
+
type: "text",
|
|
29
|
+
size: "small",
|
|
30
|
+
icon: /*#__PURE__*/React.createElement(CopyOutlined, null),
|
|
31
|
+
onClick: function onClick(e) {
|
|
32
|
+
e.stopPropagation();
|
|
33
|
+
copy(content);
|
|
34
|
+
message.success('复制成功');
|
|
35
|
+
}
|
|
36
|
+
})));
|
|
37
|
+
};
|
|
38
|
+
export default TextCopy;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
.qkd-text-copy {
|
|
2
|
+
.oper {
|
|
3
|
+
display: inline-block;
|
|
4
|
+
width: 14px;
|
|
5
|
+
min-height: 14px;
|
|
6
|
+
margin-left: 4px;
|
|
7
|
+
line-height: 100%;
|
|
8
|
+
vertical-align: top;
|
|
9
|
+
|
|
10
|
+
.ant-btn {
|
|
11
|
+
display: none;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.ant-btn-icon-only {
|
|
16
|
+
&.ant-btn-sm {
|
|
17
|
+
width: 14px;
|
|
18
|
+
height: 14px;
|
|
19
|
+
padding: 0;
|
|
20
|
+
line-height: 100%;
|
|
21
|
+
vertical-align: 0;
|
|
22
|
+
|
|
23
|
+
& > * {
|
|
24
|
+
font-size: 14px;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
&:hover,
|
|
28
|
+
&:focus {
|
|
29
|
+
color: var(--ant-color-link);
|
|
30
|
+
background: none;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
&:focus,
|
|
36
|
+
&:hover,
|
|
37
|
+
&.icon-only,
|
|
38
|
+
&.always-show {
|
|
39
|
+
.oper {
|
|
40
|
+
.ant-btn {
|
|
41
|
+
display: block;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&.icon-only {
|
|
47
|
+
.qkd-text-copy-text {
|
|
48
|
+
display: none;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { PopoverProps } from 'antd';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import './index.less';
|
|
4
|
+
import './index.less';
|
|
5
|
+
export interface TextEllipsisProps {
|
|
6
|
+
/** 字符串 */
|
|
7
|
+
content: string;
|
|
8
|
+
/** 字符串最大长度,默认 15 */
|
|
9
|
+
limit?: number;
|
|
10
|
+
/** 弹窗方向,默认 topLeft */
|
|
11
|
+
placement?: PopoverProps['placement'];
|
|
12
|
+
/** 弹窗内容区样式(antd5 映射到 styles.body) */
|
|
13
|
+
popoverStyle?: React.CSSProperties;
|
|
14
|
+
/** 弹层根节点类名 */
|
|
15
|
+
popoverClassName?: string;
|
|
16
|
+
}
|
|
17
|
+
declare const TextEllipsis: React.FC<TextEllipsisProps>;
|
|
18
|
+
export default TextEllipsis;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
import { Popover } from 'antd';
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import "./index.less";
|
|
10
|
+
import "./index.less";
|
|
11
|
+
var TextEllipsis = function TextEllipsis(_ref) {
|
|
12
|
+
var content = _ref.content,
|
|
13
|
+
_ref$limit = _ref.limit,
|
|
14
|
+
limit = _ref$limit === void 0 ? 15 : _ref$limit,
|
|
15
|
+
_ref$placement = _ref.placement,
|
|
16
|
+
placement = _ref$placement === void 0 ? 'topLeft' : _ref$placement,
|
|
17
|
+
popoverStyle = _ref.popoverStyle,
|
|
18
|
+
popoverClassName = _ref.popoverClassName;
|
|
19
|
+
return content && content.length > limit ? /*#__PURE__*/React.createElement(Popover, {
|
|
20
|
+
content: content,
|
|
21
|
+
placement: placement,
|
|
22
|
+
rootClassName: ['qkd-text-ellipsis-popover', popoverClassName].filter(Boolean).join(' '),
|
|
23
|
+
styles: {
|
|
24
|
+
body: _objectSpread({
|
|
25
|
+
maxWidth: 480,
|
|
26
|
+
wordBreak: 'break-all'
|
|
27
|
+
}, popoverStyle)
|
|
28
|
+
}
|
|
29
|
+
}, /*#__PURE__*/React.createElement("span", null, content.substring(0, limit) + '...')) : /*#__PURE__*/React.createElement(React.Fragment, null, content || '--');
|
|
30
|
+
};
|
|
31
|
+
export default TextEllipsis;
|