Merge branch 'style0419' into test

src/components/ATabs/index.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import { Tabs,Dropdown, Button,Menu,message } from 'antd';
+import { Tabs, Dropdown, Button, Menu, message } from 'antd';
 import { DownOutlined } from '@ant-design/icons';
-import { useDispatch,useSelector } from 'react-redux'
-import { active, close, closeOther} from '../../store/reducers/tabPanes'
+import { useDispatch, useSelector } from 'react-redux'
+import { active, close, closeOther } from '../../store/reducers/tabPanes'
 import './index.less'
 import iconLt from '@images/lt.png';
 import iconRt from '@images/rt.png';
@@ -12,46 +12,64 @@ const propTypes = {
 
 }
 const defaultProps = {};
-function ATabs(){
-    const panes =useSelector(state => {
+function ATabs() {
+    const panes = useSelector(state => {
         return state.tabPanes.panes
     });
     const dispatch = useDispatch();
     const activeTab = useSelector(state => {
         return state.tabPanes.activeTab
     });
+    console.log(panes);
     //切换tab
-    function onChange(activeKey){
-        dispatch(active({idName:activeKey}))
+    function onChange(activeKey) {
+        console.log(activeKey);
+        dispatch(active({ idName: activeKey }))
     }
     //关闭当前tab
-    function onDelTab(activeKey){
+    function onDelTab(activeKey) {
         console.log(activeKey);
-        if(panes.length===1){
-            message.warning("至少保留一个标签哦~",1);
+        if (panes.length === 1) {
+            message.warning("至少保留一个标签哦~", 1);
             return;
         }
-        const paneIndex = panes.findIndex((it)=>it.key===activeKey);
-        dispatch(close({delIndex:paneIndex,active:activeKey}))
+        const paneIndex = panes.findIndex((it) => it.key === activeKey);
+        dispatch(close({ delIndex: paneIndex, active: activeKey }))
     }
     //关闭其他tab
-    function onDelOtherTab(activeKey){
-        const paneIndex = panes.findIndex((it)=>it.key===activeKey);
-        dispatch(closeOther({del:paneIndex}))
+    function onDelOtherTab(activeKey) {
+        const paneIndex = panes.findIndex((it) => it.key === activeKey);
+        dispatch(closeOther({ del: paneIndex }))
+    }
+    function goPre() {
+        const index = panes.findIndex(item => {
+            return activeTab == item.key
+        });
+        if (index != 0) {
+            dispatch(active({ idName: panes[index - 1].key }))
+        }
+    }
+    function goNext() {
+        const index = panes.findIndex(item => {
+            return activeTab == item.key
+        });
+        if (index != panes.length-1) {
+            dispatch(active({ idName: panes[index + 1].key }))
+        }
     }
     const menu = (
         <Menu>
-            <Menu.Item key="1" onClick={()=>onDelTab(activeTab)}>
+            <Menu.Item key="1" onClick={() => onDelTab(activeTab)}>
                 关闭当前标签
             </Menu.Item>
-            <Menu.Item key="2" onClick={()=>onDelOtherTab(activeTab)}>
+            <Menu.Item key="2" onClick={() => onDelOtherTab(activeTab)}>
                 关闭其他标签
             </Menu.Item>
         </Menu>
     );
     return (
         <div className="tab-container">
-            <span className='pre-tab'><img src={iconLt} alt="向左滑"/></span>
+            <span className='pre-tab' onClick={() => goPre()}><img src={iconLt} alt="向左滑" /></span>
             <Tabs
                 className='tab-cont'
                 hideAdd
@@ -66,7 +84,7 @@ function ATabs(){
                     </TabPane>
                 ))}
             </Tabs>
-            <span className='next-tab'><img src={iconRt} alt="向右滑"/></span>
+            <span className='next-tab' onClick={() => goNext()}><img src={iconRt} alt="向右滑" /></span>
             <Dropdown className='tab-oper' overlay={menu}>
                 <Button size='small'>
                     <DownOutlined />