From bb47338f71d3b13898be0692dec10d4abe77338e Mon Sep 17 00:00:00 2001
From: tengge1 <930372551@qq.com>
Date: Wed, 7 Aug 2019 21:07:19 +0800
Subject: [PATCH] LoadMask

---
 ShadowEditor.Web/src/ui/index.js              |  3 ++
 ShadowEditor.Web/src/ui/progress/LoadMask.jsx | 39 +++++++++++++++++++
 .../src/ui/progress/css/LoadMask.css          | 29 ++++++++++++++
 3 files changed, 71 insertions(+)
 create mode 100644 ShadowEditor.Web/src/ui/progress/LoadMask.jsx
 create mode 100644 ShadowEditor.Web/src/ui/progress/css/LoadMask.css

diff --git a/ShadowEditor.Web/src/ui/index.js b/ShadowEditor.Web/src/ui/index.js
index 29fc5880..98c0d3fd 100644
--- a/ShadowEditor.Web/src/ui/index.js
+++ b/ShadowEditor.Web/src/ui/index.js
@@ -52,6 +52,9 @@ export { default as MenuItemSeparator } from './menu/MenuItemSeparator.jsx';
 // panel
 export { default as Panel } from './panel/Panel.jsx';
 
+// progress
+export { default as LoadMask } from './progress/LoadMask.jsx';
+
 // property
 export { default as PropertyGrid } from './property/PropertyGrid.jsx';
 export { default as PropertyGroup } from './property/PropertyGroup.jsx';
diff --git a/ShadowEditor.Web/src/ui/progress/LoadMask.jsx b/ShadowEditor.Web/src/ui/progress/LoadMask.jsx
new file mode 100644
index 00000000..02337bce
--- /dev/null
+++ b/ShadowEditor.Web/src/ui/progress/LoadMask.jsx
@@ -0,0 +1,39 @@
+import './css/LoadMask.css';
+import classNames from 'classnames/bind';
+import PropTypes from 'prop-types';
+
+/**
+ * 加载动画
+ * @author tengge / https://github.com/tengge1
+ */
+class LoadMask extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+
+    render() {
+        const { className, style, show, text } = this.props;
+
+        return <div className={classNames('LoadMask', className, !show && 'hidden')} style={style}>
+            <div className={'box'}>
+                <div className={'msg'}>{text}</div>
+            </div>
+        </div>;
+    }
+}
+
+LoadMask.propTypes = {
+    className: PropTypes.string,
+    style: PropTypes.object,
+    show: PropTypes.show,
+    text: PropTypes.string,
+};
+
+LoadMask.defaultProps = {
+    className: null,
+    style: null,
+    show: true,
+    text: 'Waiting...',
+};
+
+export default LoadMask;
\ No newline at end of file
diff --git a/ShadowEditor.Web/src/ui/progress/css/LoadMask.css b/ShadowEditor.Web/src/ui/progress/css/LoadMask.css
new file mode 100644
index 00000000..61b38ac9
--- /dev/null
+++ b/ShadowEditor.Web/src/ui/progress/css/LoadMask.css
@@ -0,0 +1,29 @@
+.LoadMask {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background: #ccc;
+    opacity: 0.5;
+    z-index: 100;
+}
+
+.LoadMask>.box {
+    position: absolute;
+    left: 0;
+    top: 0;
+    background: #c3daf9;
+    border: 1px solid #6593cf;
+    padding: 2px;
+}
+
+.LoadMask>.box>.msg {
+    font: normal 12px 'Microsoft YaHei';
+    line-height: 16px;
+    color: #222;
+    background: #fbfbfb url(assets/image/loading.gif) no-repeat 5px 5px;
+    padding: 5px 10px 5px 25px;
+    border: 1px solid #a3bad9;
+    cursor: wait;
+}
\ No newline at end of file