uas手机版

通用菜单item组件添加分割线样式

uas-office-web/uas-mobile/.gitignore

@@ -21,3 +21,4 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+/debug.log

uas-office-web/uas-mobile/src/components/common/func/FuncGroup.jsx

@@ -26,22 +26,31 @@ export default class FuncGroup extends Component {
   }
 
   render () {
-    let { funcGroup } = this.props
+    let { funcGroup, line } = this.props
     let funcItems = []
     if (!isObjEmpty(funcGroup.funcList)) {
       funcGroup.funcList.forEach((funcItem, funcIndex) => {
         funcItems.push(
           <FuncItem
             funcObj={funcItem}
+            line={line}
             onFuncClick={this.onFuncClick}/>,
         )
       })
     }
 
     return (
-      <div>
+      <div
+        style={{
+          overflowX: 'hidden',
+        }}>
         <FuncTltle funcTitle={funcGroup}/>
-        {funcItems}
+        <div
+          style={{
+            marginRight: line ? '-1px' : '0px',
+          }}>
+          {funcItems}
+        </div>
       </div>
     )
   }

uas-office-web/uas-mobile/src/components/common/func/FuncItem.jsx

@@ -30,7 +30,9 @@ export default class FuncItem extends Component {
     return (
       isObjEmpty(funcObj) ?
         <div></div> :
-        <div className='func-func-root' onClick={this.onFuncClick}>
+        <div
+          className={this.props.line ? 'func-func-root-line' : 'func-func-root'}
+          onClick={this.onFuncClick}>
           <div className='func-func-layout'>
             <img className='func-func-icon'
                  src={funcObj.imgUrl}/>
@@ -44,7 +46,6 @@ export default class FuncItem extends Component {
                 position: 'absolute',
                 top: '6px',
                 right: '6px',
-                padding: '1px',
               }}
               onClick={this.onCancelClick}
             />

uas-office-web/uas-mobile/src/components/common/func/common-func.less

@@ -28,6 +28,12 @@
   background: white;
 }
 
+.func-func-root-line {
+  border-bottom: 1px solid lightgray;
+  border-right: 1px solid lightgray;
+  .func-func-root
+}
+
 .func-func-layout {
   display: flex;
   flex-direction: column;

uas-office-web/uas-mobile/src/configs/theme.config.less

@@ -19,6 +19,7 @@
   display: flex;
   flex-direction: column;
   overflow-y: scroll;
+  overflow-x: hidden;
   -webkit-overflow-scrolling: touch;
 
   &::-webkit-scrollbar {

uas-office-web/uas-mobile/src/pages/private/homePage/HomePage.jsx

@@ -61,7 +61,8 @@ class HomePage extends Component {
         icon={<UasIcon type="uas-main-normal"/>}
         selectedIcon={<UasIcon type="uas-main-select"/>}
         selected={this.props.homeState.selectedTab === 0}
-        // badge={''}
+        badge={'新'}
+        dot={false}
         onPress={this.onMainTabSelected}
       >
         {this.renderMainTab()}
@@ -77,7 +78,8 @@ class HomePage extends Component {
         icon={<UasIcon type="uas-report-normal"/>}
         selectedIcon={<UasIcon type="uas-report-select"/>}
         selected={this.props.homeState.selectedTab === 1}
-        // badge={''}
+        badge={100}
+        dot={true}
         onPress={this.onReportTabSelected}
       >
         {this.renderReportTab()}
@@ -93,7 +95,8 @@ class HomePage extends Component {
         icon={<UasIcon type="uas-doc-normal"/>}
         selectedIcon={<UasIcon type="uas-doc-select"/>}
         selected={this.props.homeState.selectedTab === 2}
-        // badge={''}
+        badge={''}
+        dot={true}
         onPress={this.onDocTabSelected}
       >
         {this.renderDocTab()}
@@ -109,7 +112,8 @@ class HomePage extends Component {
         icon={<UasIcon type="uas-mine-normal"/>}
         selectedIcon={<UasIcon type="uas-mine-select"/>}
         selected={this.props.homeState.selectedTab === 3}
-        // badge={''}
+        badge={''}
+        dot={true}
         onPress={this.onMineTabSelected}
       >
         {this.renderMineTab()}

uas-office-web/uas-mobile/src/pages/private/homePage/ReportRoot.jsx

@@ -52,6 +52,19 @@ class ReportRoot extends Component {
     }
     return (
       <div>
+        <FuncGroup
+          funcGroup={funcGroup}
+          line
+        />
+        <FuncGroup
+          funcGroup={funcGroup1}
+        />
+        <FuncGroup
+          funcGroup={funcGroup}
+        />
+        <FuncGroup
+          funcGroup={funcGroup1}
+        />
         <FuncGroup
           funcGroup={funcGroup}
         />