@wener/console
Version:
Base console UI toolkit
150 lines (149 loc) • 7.66 kB
JavaScript
import React, { useEffect } from "react";
import { BiError, BiLogoChrome } from "react-icons/bi";
import { GrDocumentMissing } from "react-icons/gr";
import { HiMiniArrowLeft, HiMiniArrowPath, HiMiniHome, HiOutlineExclamationCircle } from "react-icons/hi2";
import { useInRouterContext, useNavigate, useRouteError } from "react-router";
import { ActionIcon } from "../../components/icons/index.js";
import { Button, NonIdealState } from "../../daisy/index.js";
(function (NonIdealPage) {
NonIdealPage.Layout = function (param) {
var title = param.title, icon = param.icon, description = param.description, action = param.action, children = param.children;
var inRouterContext = useInRouterContext();
var navigate = function (v) {
typeof v === "string" ? window.location.href = v : window.history.back();
};
if (inRouterContext) {
navigate = useNavigate();
}
var defaultAction = /*#__PURE__*/ React.createElement("div", {
className: "flex gap-2 opacity-95"
}, /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
navigate("/");
}
}, /*#__PURE__*/ React.createElement(HiMiniHome, {
className: "h-4 w-4"
}), "\u9996\u9875"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
navigate(-1);
}
}, /*#__PURE__*/ React.createElement(HiMiniArrowLeft, {
className: "h-4 w-4"
}), "\u8FD4\u56DE"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
window.location.reload();
}
}, /*#__PURE__*/ React.createElement(HiMiniArrowPath, {
className: "h-4 w-4"
}), "\u5237\u65B0"));
return /*#__PURE__*/ React.createElement("div", {
className: "flex h-full flex-1 items-center justify-center"
}, /*#__PURE__*/ React.createElement(NonIdealState, {
icon: icon,
title: title,
description: description,
action: action !== null && action !== void 0 ? action : defaultAction
}, children));
};
NonIdealPage.PageNotFound = function (param) {
var children = param.children;
var _globalThis_location;
return /*#__PURE__*/ React.createElement(NonIdealPage.Layout, {
icon: /*#__PURE__*/ React.createElement(GrDocumentMissing, {
className: "h-12 w-12"
}),
title: "\u9875\u9762\u4E0D\u5B58\u5728",
description: /*#__PURE__*/ React.createElement("small", {
suppressHydrationWarning: true
}, "\u5F53\u524D\u9875\u9762\u5730\u5740: ", (_globalThis_location = globalThis.location) === null || _globalThis_location === void 0 ? void 0 : _globalThis_location.href)
}, children);
};
NonIdealPage.ServerError = function (param) {
var statusCode = param.statusCode, children = param.children;
return /*#__PURE__*/ React.createElement(NonIdealPage.Layout, {
icon: /*#__PURE__*/ React.createElement(BiError, {
className: "h-12 w-12"
}),
title: "\u670D\u52A1\u5668\u5904\u7406\u9519\u8BEF",
description: /*#__PURE__*/ React.createElement("small", null, "\u9519\u8BEF\u7801\uFF1A", statusCode || "\u672A\u77E5")
}, children);
};
NonIdealPage.PageError = function (param) {
var error = param.error, _param_title = param.title, title = _param_title === void 0 ? "\u9875\u9762\u51FA\u9519\u5566!" : _param_title, onReset = param.onReset, children = param.children;
var inRouterContext = useInRouterContext();
var navigate = function (v) {
typeof v === "string" ? window.location.href = v : window.history.back();
};
if (inRouterContext) {
navigate = useNavigate();
var routerError = useRouteError();
error || (error = routerError);
}
useEffect(function () {
console.error("PageError", error);
}, [
error
]);
var action = /*#__PURE__*/ React.createElement("div", {
className: "flex gap-2 opacity-95"
}, onReset && /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
onReset();
}
}, /*#__PURE__*/ React.createElement(ActionIcon.Reset, {
className: "h-4 w-4"
}), "\u91CD\u7F6E"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
navigate("/");
}
}, /*#__PURE__*/ React.createElement(ActionIcon.Home, {
className: "h-4 w-4"
}), "\u9996\u9875"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
navigate(-1);
}
}, /*#__PURE__*/ React.createElement(ActionIcon.Backward, {
className: "h-4 w-4"
}), "\u8FD4\u56DE"), /*#__PURE__*/ React.createElement(Button, {
className: "btn-outline btn-sm",
onClick: function () {
window.location.reload();
}
}, /*#__PURE__*/ React.createElement(ActionIcon.Refresh, {
className: "h-4 w-4"
}), "\u5237\u65B0"), children);
return /*#__PURE__*/ React.createElement(NonIdealPage.Layout, {
icon: /*#__PURE__*/ React.createElement(HiOutlineExclamationCircle, {
className: "h-12 w-12"
}),
title: title,
description: /*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement("div", null, "\u8BF7\u8054\u7CFB\u7BA1\u7406\u5458\u6216\u5237\u65B0\u9875\u9762"), /*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement(Browser, null)), error && /*#__PURE__*/ React.createElement("details", null, /*#__PURE__*/ React.createElement("summary", null, "\u67E5\u770B\u8BE6\u7EC6\u9519\u8BEF"), /*#__PURE__*/ React.createElement("pre", null, String(error)))),
action: action
});
};
})(NonIdealPage || (NonIdealPage = {}));
var Browser = function () {
var _navigator_userAgent_match;
var _ref;
var _ref1 = (_ref = (_navigator_userAgent_match = navigator.userAgent.match(RegExp("(?<brand>Chrom(e|ium))\\/(?<version>[0-9]+)\\."))) === null || _navigator_userAgent_match === void 0 ? void 0 : _navigator_userAgent_match.groups) !== null && _ref !== void 0 ? _ref : {}, brand = _ref1.brand, version = _ref1.version;
if (!brand) {
return /*#__PURE__*/ React.createElement("small", {
className: "text-warning text-xs opacity-75"
}, "\u4E0D\u652F\u6301\u7684\u6D4F\u89C8\u5668\u73AF\u5883");
}
// 100 2022-03-29
// 90 2021-02-28
var old = Number.parseInt(version) < 100;
return /*#__PURE__*/ React.createElement("div", {
className: "inline-flex items-center"
}, /*#__PURE__*/ React.createElement(BiLogoChrome, null), brand, " ", version, old && /*#__PURE__*/ React.createElement("small", {
className: "text-warning text-xs opacity-75"
}, "\u5F53\u524D\u6D4F\u89C8\u5668\u7248\u672C ", version, " \u8FC7\u4F4E\uFF0C\u8BF7\u4E0B\u8F7D\u4F7F\u7528\u65B0\u7248\u672C\u6D4F\u89C8\u5668\u3002"));
};
export var NonIdealPage;