│  .gitignore
│  list.txt
│  package-lock.json
│  package.json
│  
├─config       
├─public   
├─scripts
├─server
│      model.js
│      server.js
│      user.js
└─src
    │  config.js
    │  index.css
    │  index.js
    │  reducer.js
    │  util.js
    │  
    ├─component
    │  ├─authroute
    │  │      authroute.js
    │  │      
    │  ├─avatar-selector
    │  │      avatar-selector.js  用户信息完善的头像选择组件
    │  │      
    │  ├─boss
    │  │      boss.js
    │  │      
    │  ├─dashboard
    │  │      dashboard.js                    主页面的组合显示，（即头、内容、脚组件的拼接在此处完成）
    │  │      
    │  ├─genius
    │  │      genius.js
    │  │      
    │  ├─img    存放用户可选择的头像
    │  │      
    │  ├─logo
    │  │      job.png
    │  │      logo.css
    │  │      logo.js
    │  │      
    │  ├─navlink
    │  │  │  navlink.js
    │  │  │  
    │  │  └─img   存放主页面脚部几个导航栏的图片
    │  │          boss-active.png
    │  │          boss.png
    │  │          job-active.png
    │  │          job.png
    │  │          msg-active.png
    │  │          msg.png
    │  │          user-active.png
    │  │          user.png
    │  │          
    │  ├─usercard    用户信息展示的卡片组件
    │  │      usercard.js
    │          
    ├─container
    │  ├─bossinfo
    │  │      bossinfo.js   boss信息完善页
    │  │      
    │  ├─geniusinfo
    │  │      geniusinfo.js  牛人信息完善页
    │  │      
    │  ├─login
    │  │      login.js
    │  │      
    │  └─register
    │          register.js
    │          
    └─redux
            chatuser.redux.js
            user.redux.js
            

• 1、在完成注册之后，自动跳转到完善信息的页面
• 2、未完善信息的用户在登录时也直接跳转到完善信息页面

在这里插入图片描述

头像组件位置：srccomponentavatar-selectoravatar-selector.js

然后再创建boss信息页和genius信息页
boss信息页：srccontainerbossinfobossinfo.js
genius信息页：srccontainergeniusinfogeniusinfo.js

• 1、当牛人登录的时候，显示boss信息列表
• 2、当boss登录的时候，显示牛人信息列表
  
  

• 头部导航栏
• 中间内容栏
• 脚部导航栏
• 主页面的整体组建是在dashboard.js页面中完成的，

            <div>
                <!--头部-->
                <NavBar className='fixd-header' mode='dard'>{navList.find(v=>v.path===pathname).title}</NavBar>
                <!--内容-->
                <div style={{marginTop:45}}>
                    <Switch>
                        {navList.map(v=>(
                            //component中是组件的名字
                            <Route key={v.path} path={v.path} component={v.component}></Route>
                        ))}
                    </Switch>
                </div>
                <!--脚部-->
                <div className="fixd-footer">
                     <NavLinkBar data={navList}></NavLinkBar>
                </div>
               
            </div>

navBar

TabBar

D:MyPracticeProjectreact-mukesrccomponentnavlinknavlink.js

• boss

D:MyPracticeProjectreact-mukesrccomponentbossboss.js

• genius

D:MyPracticeProjectreact-mukesrccomponentgeniusgenius.js

• 用户信息卡片组件单独抽离

srccomponentusercardusercard.js

• boss页面与genius页面的实现

srccomponentbossboss.js

srccomponentgeniusgenius.js