Merge branch 'feature/wufan/20210713/refactore-placeholder' into 'master'

Feature/wufan/20210713/refactore placeholder

See merge request !70

src/modules/college-manage/CollegeInfoPage.jsx

@@ -111,9 +111,8 @@ class CollegeInfoPage extends React.Component {
     } = this.state;
     } = this.state;
     return (
     return (
       <div className="page college-info-page">
       <div className="page college-info-page">
-        <div className="content-header">学院基本信息</div>
+        <div className="content-header">学院信息</div>
         <div className="box">
         <div className="box">
-          <div className="college-info-header">学院基本信息</div>
           <div className="college-info-page-form">
           <div className="college-info-page-form">
            
            
             <Form ref={this.formRef}>
             <Form ref={this.formRef}>

src/modules/knowledge-base/components/Classification.jsx

@@ -188,7 +188,7 @@ class Classification extends Component {
         <div className='sider-title'>知识分类</div>
         <div className='sider-title'>知识分类</div>
         <Search
         <Search
           className='sider-search'
           className='sider-search'
-          placeholder='搜索名称分类'
+          placeholder='搜索分类名称'
           onSearch={(value) => {
           onSearch={(value) => {
             this.queryCategoryTree(value);
             this.queryCategoryTree(value);
           }}
           }}

src/modules/root/Menu.less

@@ -97,7 +97,7 @@
         margin: 6px 8px;
         margin: 6px 8px;
         width: calc(100% - 15px);
         width: calc(100% - 15px);
         &:hover {
         &:hover {
-          background: #f3f6fa;
+          background: rgba(41, 102, 255, .05);
           border-radius: 2px;
           border-radius: 2px;
           color: #333;
           color: #333;
         }
         }
@@ -106,8 +106,10 @@
         background-color: @active-color;
         background-color: @active-color;
         color: #fff;
         color: #fff;
         border-radius: 2px;
         border-radius: 2px;
-        &:hover {
-          color: #fff;
+        &.single-menu {
+          background: rgba(41, 102, 255, .1) !important;
+          color: @active-color;
+          font-weight:500;
         }
         }
       }
       }
       .ant-menu-submenu {
       .ant-menu-submenu {
@@ -117,6 +119,9 @@
         }
         }
         .ant-menu-item {
         .ant-menu-item {
           padding-left: 46px !important;
           padding-left: 46px !important;
+          &:hover {
+            color: #333!important;
+          }
         }
         }
       }
       }
 
 
@@ -124,14 +129,22 @@
         color: @active-color;
         color: @active-color;
 
 
         .ant-menu-item-selected {
         .ant-menu-item-selected {
-          color: #fff;
+          color: @active-color;
+          font-weight: 500;
+          &:hover {
+            color: @active-color!important;
+          }
           .listType {
           .listType {
             background: @active-color;
             background: @active-color;
           }
           }
         }
         }
+        .ant-menu-submenu-arrow {
+          right: 10px!important;
+          color: @active-color;
+        }
       }
       }
       .ant-menu-submenu-arrow {
       .ant-menu-submenu-arrow {
-        right: 22px;
+        right: 10px!important;
         color: #5e606a;
         color: #5e606a;
       }
       }
     }
     }
@@ -266,16 +279,30 @@
   .shink-footer {
   .shink-footer {
     left: 74px;
     left: 74px;
   }
   }
-  // &:hover{
-  //   .menu-type-icon{
-  //     display:inline-block;
-  //   }
-  // }
-
 }
 }
 
 
+.ant-menu-inline .ant-menu-item, .ant-menu-inline .ant-menu-submenu-title {
+  width: calc(100% - 15px)!important;
+}
+.ant-menu-submenu:hover {
+  // background: rgba(41, 102, 255, .05) !important;
+  &.ant-menu-submenu-title:hover {
+    color: #333333!important;
+  }
+ .ant-menu-submenu-title > .ant-menu-submenu-arrow {
+   color: #5e606a!important;
+ }
+  
+  &.icon-img-box {
+    background-color: rgba(41, 102, 255, .05)!important;
+  }
+}
+.ant-menu-light .ant-menu-submenu-title:hover {
+  color: #333!important;
+  background: rgba(41, 102, 255, .05) !important;
+}
 .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
 .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
-  background: @active-color !important;
+  background: rgba(41, 102, 255, .1) !important;
 }
 }
 .ant-menu.ant-menu-dark,
 .ant-menu.ant-menu-dark,
 .ant-menu-dark .ant-menu-sub,
 .ant-menu-dark .ant-menu-sub,

src/modules/root/Menu.tsx

@@ -239,10 +239,10 @@ function Aside(props: any) {
                     icon={
                     icon={
                       !menuType && item.groupCode === selectKeyParent ? (
                       !menuType && item.groupCode === selectKeyParent ? (
                         <div className='icon-img-box' style={{ backgroundColor: '#2966FF', width: '40px', height: '40px' }}>
                         <div className='icon-img-box' style={{ backgroundColor: '#2966FF', width: '40px', height: '40px' }}>
-                          <img src={item.selectImg} className='icon-img' />
+                          <img src={item.img} className='icon-img' />
                         </div>
                         </div>
                       ) : (
                       ) : (
-                        <div className='icon-img-box' style={{ backgroundColor: '#fff', width: '40px', height: '40px', display: 'inline-block' }}>
+                        <div className='icon-img-box' style={{ width: '40px', height: '40px', display: 'inline-block' }}>
                           <img src={item.img} className='icon-img' />
                           <img src={item.img} className='icon-img' />
                         </div>
                         </div>
                       )
                       )
@@ -269,6 +269,7 @@ function Aside(props: any) {
               } else {
               } else {
                 return (
                 return (
                   <Menu.Item
                   <Menu.Item
+                    className="single-menu"
                     onClick={() => {
                     onClick={() => {
                       toggleMenu(item, item.groupCode);
                       toggleMenu(item, item.groupCode);
                     }}
                     }}
@@ -276,11 +277,11 @@ function Aside(props: any) {
                     icon={
                     icon={
                       !menuType && item.groupCode === selectKeyParent ? (
                       !menuType && item.groupCode === selectKeyParent ? (
                         <div className='icon-img-box' style={{ backgroundColor: '#2966FF' }}>
                         <div className='icon-img-box' style={{ backgroundColor: '#2966FF' }}>
-                          <img src={item.selectImg} className='icon-img' />
+                          <img src={item.img} className='icon-img' />
                         </div>
                         </div>
                       ) : (
                       ) : (
                         <div className='icon-img-box'>
                         <div className='icon-img-box'>
-                          <img src={selectKey === item.groupCode ? item.selectImg : item.img} className='icon-img' />
+                          <img src={item.img} className='icon-img' />
                         </div>
                         </div>
                       )
                       )
                     }>
                     }>

src/modules/teach-tool/components/CourseCategoryManage.jsx

@@ -539,15 +539,15 @@ class CourseCategoryManage extends Component {
     return (
     return (
       <div className='page course-category-manage'>
       <div className='page course-category-manage'>
         {['aid', 'knowledge'].includes(getParameterByName('from')) ? (
         {['aid', 'knowledge'].includes(getParameterByName('from')) ? (
-          <Breadcrumbs navList='课程分类' goBack={() => window.RCHistory.goBack()} />
+          <Breadcrumbs navList='分类管理' goBack={() => window.RCHistory.goBack()} />
         ) : (
         ) : (
-          <div className='content-header'>课程分类</div>
+          <div className='content-header'>分类管理</div>
         )}
         )}
         <div className='box'>
         <div className='box'>
           <div className='search-condition'>
           <div className='search-condition'>
             <span className='search-label'>搜索名称：</span>
             <span className='search-label'>搜索名称：</span>
             <Search
             <Search
-              placeholder='请输入名称'
+              placeholder='搜索分类名称'
               style={{ width: '300px' }}
               style={{ width: '300px' }}
               onSearch={(value) => this.queryCategoryTree('init', value)}
               onSearch={(value) => this.queryCategoryTree('init', value)}
               className='search-input'
               className='search-input'

src/modules/teach-tool/components/CourseCategorySiderTree.jsx

@@ -189,7 +189,7 @@ class CourseCategorySiderTree extends Component {
         )}
         )}
         <Search
         <Search
           className='sider-search'
           className='sider-search'
-          placeholder='搜索名称分类'
+          placeholder='搜索分类名称'
           onSearch={(value) => {
           onSearch={(value) => {
             this.queryCategoryTree('init', value);
             this.queryCategoryTree('init', value);
           }}
           }}