统一提示

code/VideoAccess-VCMP/web/client/src/layout/containers/layout/index.jsx

@@ -2,7 +2,7 @@
 
 import React, { useState, useEffect } from 'react';
 import { connect } from 'react-redux';
-import { Layout, Toast } from '@douyinfe/semi-ui';
+import { Layout, Notification } from '@douyinfe/semi-ui';
 import Sider from '../../components/sider';
 import Header from '../../components/header';
 import Footer from '../../components/footer';
@@ -11,7 +11,7 @@ import * as NProgress from 'nprogress';
 import PerfectScrollbar from 'perfect-scrollbar';
 
 NProgress.configure({
-    template: `
+   template: `
     <div class="bar" style="height:2px" role="bar">
         <div class="peg"></div>
     </div>
@@ -24,113 +24,121 @@ NProgress.configure({
 let scrollbar
 
 const LayoutContainer = props => {
-    const {
-        dispatch, msg, user, copyright, children, sections, clientWidth, clientHeight,
-        location, match, routes, history
-    } = props
-    const [collapsed, setCollapsed] = useState(false)
+   const {
+      dispatch, msg, user, copyright, children, sections, clientWidth, clientHeight,
+      location, match, routes, history
+   } = props
+   const [collapsed, setCollapsed] = useState(false)
 
-    NProgress.start();
+   NProgress.start();
 
-    const resize_ = () => {
-        dispatch(resize(
-            document.body.clientHeight,
-            document.body.clientWidth - (collapsed ? 120 : 240)
-        ));
-    }
+   const resize_ = () => {
+      dispatch(resize(
+         document.body.clientHeight,
+         document.body.clientWidth - (collapsed ? 120 : 240)
+      ));
+   }
 
-    useEffect(() => {
-        scrollbar = new PerfectScrollbar('#page-content', { suppressScrollX: true });
+   useEffect(() => {
+      scrollbar = new PerfectScrollbar('#page-content', { suppressScrollX: true });
 
-        window.addEventListener('resize', resize_);
-        return () => {
-            window.removeEventListener('resize', resize_);
-        }
-    }, [])
+      window.addEventListener('resize', resize_);
+      return () => {
+         window.removeEventListener('resize', resize_);
+      }
+   }, [])
 
-    useEffect(() => {
-        NProgress.done();
-        if (!user || !user.authorized) {
-            history.push('/signin');
-        }
-        if (msg) {
-            if (msg.done) {
-                Toast.success(msg.done);
-            }
-            if (msg.error) {
-                Toast.error(msg.error);
-            }
-        }
-        const dom = document.getElementById('page-content');
-        if (dom) {
-            scrollbar.update();
-            dom.scrollTop = 0;
-        }
-    })
+   useEffect(() => {
+      NProgress.done();
+      if (!user || !user.authorized) {
+         history.push('/signin');
+      }
+      if (msg) {
+         if (msg.done) {
+            Notification.success({
+               // title: msg.done,
+               content: msg.done,
+               duration: 2,
+            })
+         }
+         if (msg.error) {
+            Notification.error({
+               // title: msg.error,
+               content: msg.error,
+               duration: 2,
+            })
+         }
+      }
+      const dom = document.getElementById('page-content');
+      if (dom) {
+         scrollbar.update();
+         dom.scrollTop = 0;
+      }
+   })
 
-    return (
-        <Layout id="layout">
-            <Layout.Header>
-                <Header
-                    user={user}
-                    pathname={location.pathname}
-                    toggleCollapsed={() => {
-                        setCollapsed(!collapsed);
-                    }}
-                    collapsed={collapsed}
-                    history={history}
-                />
-            </Layout.Header>
-            <Layout>
-                <Layout.Sider>
-                    <Sider
-                        sections={sections}
-                        dispatch={dispatch}
-                        user={user}
-                        pathname={location.pathname}
-                        collapsed={collapsed}
-                    />
-                </Layout.Sider>
-                <Layout.Content>
-                    <div style={{
-                        margin: '12px 12px 0px',
-                        background: "#F6FAFF",
-                    }}>
-                        <div id="page-content" style={{
-                            height: clientHeight - 12,
-                            minWidth: 520,
-                            position: 'relative',
-                        }}>
-                            <div style={{
-                                minHeight: clientHeight - 32 - 12,
-                                position: 'relative',
-                                padding: '12px 8px',
-                            }}>
-                                {children}
-                            </div>
-                            <Layout.Footer>
-                                <Footer />
-                            </Layout.Footer>
-                        </div>
-                    </div>
-                </Layout.Content>
-            </Layout>
-        </Layout >
-    )
+   return (
+      <Layout id="layout">
+         <Layout.Header>
+            <Header
+               user={user}
+               pathname={location.pathname}
+               toggleCollapsed={() => {
+                  setCollapsed(!collapsed);
+               }}
+               collapsed={collapsed}
+               history={history}
+            />
+         </Layout.Header>
+         <Layout>
+            <Layout.Sider>
+               <Sider
+                  sections={sections}
+                  dispatch={dispatch}
+                  user={user}
+                  pathname={location.pathname}
+                  collapsed={collapsed}
+               />
+            </Layout.Sider>
+            <Layout.Content>
+               <div style={{
+                  margin: '12px 12px 0px',
+                  background: "#F6FAFF",
+               }}>
+                  <div id="page-content" style={{
+                     height: clientHeight - 12,
+                     minWidth: 520,
+                     position: 'relative',
+                  }}>
+                     <div style={{
+                        minHeight: clientHeight - 32 - 12,
+                        position: 'relative',
+                        padding: '12px 8px',
+                     }}>
+                        {children}
+                     </div>
+                     <Layout.Footer>
+                        <Footer />
+                     </Layout.Footer>
+                  </div>
+               </div>
+            </Layout.Content>
+         </Layout>
+      </Layout >
+   )
 }
 
 function mapStateToProps (state) {
-    const { global, auth, ajaxResponse } = state;
-    return {
-        title: global.title,
-        copyright: global.copyright,
-        sections: global.sections,
-        actions: global.actions,
-        clientWidth: global.clientWidth,
-        clientHeight: global.clientHeight,
-        msg: ajaxResponse.msg,
-        user: auth.user
-    };
+   const { global, auth, ajaxResponse } = state;
+   return {
+      title: global.title,
+      copyright: global.copyright,
+      sections: global.sections,
+      actions: global.actions,
+      clientWidth: global.clientWidth,
+      clientHeight: global.clientHeight,
+      msg: ajaxResponse.msg,
+      user: auth.user
+   };
 }
 
 export default connect(mapStateToProps)(LayoutContainer);