sperains / newxy Goto Github PK

xy 			            -项目所在文件夹 
	app                 -项目源码目录
	node_modules        -javascrpt模块目录
	template            -首页 index.html模板
	index.html          -项目主页
	package.json        -npm配置文件
	webpack.config.js   -webpack配置文件(调试)
	webpack.production.config.js  -webpack配置文件(发布)

app 
	components  项目组件存放目录
		active        -喜悦活动模块相关组件目录
		donation      -喜悦捐赠模块相关组件目录
		energy        -能量管理模块相关组件目录
		feedback      -问卷反馈模块相关组件目录
		identity      -职级管理模块相关组件目录
		member        -会员管理模块相关组件目录
		number        -生命数字模块相关组件目录
		training      -正念训练模块相关组件目录
		widgets       -存放可复用小组件的目录
		Sider.js      -左侧导航菜单模块
		Sider.scss    -导航菜单模块对应的css样式文件
		TopBar.js     -顶部菜单模块
		TopBar.scss   -顶部菜单对应的css样式文件
	constants     -用于存放app常量的目录
	containers    -项目容器目录
	middleware    -用于存放项目中间件的目录
	reducers      -reducer存放目录
	resources     -项目资源文件目录
	utils         -存放自定义工具文件
	entry.js      -项目入口文件
	store.js      -项目store

hashHistory.push('/identity/new' );

<div className="wrap">    
	<TopBar />
    <div className="content">
        <Sider />
        <div className="right-wrap" id="right-wrap">
           {this.props.children}
        </div>
    </div>
</div> 

ReactDOM.render(
   <Provider store={store}>
   	<Router history={hashHistory}>
  		<Route  path="/" component={Main}>
          <Route path="" component={Training} />
		  <Route path="/train" component={Training}/>
	      <Route path="/active" component={Active} />
          <Route path="/active/enroll-list" component={ActiveEnrollList} />
    	  <Route path="/active/:type" component={ActiveEdit} />
          <Route path="/train-edit" component={TraningItemEdit} />
          <Route path="/number" component={Number} />
          <Route path="/member" component={Member} />
          <Route path="/energy-rule" component={EnergyRule} />
          <Route path="/energy-rule/edit" component={EnergyRuleEdit} />
          <Route path="/energy-rank" component={EnergyRank} />
          <Route path="/identity" component={Identity} />
          <Route path="/identity/:type" component={IdentityEdit} />
          <Route path="/feedback" component={Feedback} />
          <Route path="/donation" component={Donation} />
    	</Route>
    </Router>
   </Provider>,
    root
);

active
	Active.js            --喜悦活动模块入口文件.
	Active.scss         
	ActiveEdit.js        --喜悦活动编辑模块
	ActiveEdit.scss
	ActiveEditForm.js    --喜悦活动编辑模块的表单内容模块.
	ActiveEditForm.scss
	ActiveEnrollList.js  --活动报名详情模块
	ActiveEnrollList.scss
	ActiveItem.js        --喜悦活动项模块
	ActiveItem.scss
	ActiveList.js        --喜悦活动列表模块
	ActiveList.scss
	index.js

<Active>
	<ContentNav />
	<ActiveList>
		<ActiveItem />
	</ActiveList>
</Active>

	btnOpts : {
		text : 'string'         --按钮显示文字，
		onClick : function(){}  --按钮点击事件
	}

<ActiveEnrollList>
	<ContentWithBackNav />
	<CustomTable />
</ActiveEnrollList>

	<Training>
		<ContentNav />
		<div>
			<TrainingItem />
			<TrainingItem />
			<TrainingItem />
		</div>
	</Training>

number
	BabyNumber.js           -- 喜宝数字模块
	BabyNumber.scss
	FateNumber.js           --命运数模块
	FateNumber.scss
	index.js   
	Number.js               --生命数字模块入口文件
	Number.scss
	NumberContent.js        --生命数字内容区
	NumberContent.scss
	NumberDesc.js           --生命数字简介模块
	NumberDesc.scss
	NumberOverview.js       --生命数字概述模块
	NumberOverview.scss
	TalentNumber.js         --天赋数模块
	TalentNumber.scss

let currentEl ;
switch(this.state.currentTabIndex){
	case 0 : currentEl = <NumberDesc />;break;
	case 1 : currentEl = <BabyNumber />;break;
	case 2 : currentEl = <FateNumber />;break;
	case 3 : currentEl = <TalentNumber />;break;
}

<div className="fate-number-wrap">
	<span onClick={()=>this.onNewDetailClick()} className="fate-number-new">添加详解</span>
	<NumberContent currentNum={this.state.currentNum} />
	<div className="fate-number-footer">
		{
			[1,2,3,4,5,6,7,8,9].map( (num,index)=>{
				return (
					<span onClick={()=>this.onNumberChange(num)} className={num == this.state.currentNum ? 'active' : ''} key={index}>{num}</span>
				)
			})
		}
	</div>
</div>

energy
	EnergyRank.js          --能量排名模块
	EnergyRank.scss        
	EnergyRule.js          --能量规则模块
	EnergyRule.scss
	EnergyRuleEdit.js      --能量规则编辑模块
	EnergyRuleEdit.scss
	index.js

identity
	Identity.js            --模块入口文件
	Identity.scss    
	IdentityEdit.js        --编辑职级模块
	IdentityEdit.scss
	IdentityEditForm.js    --职级编辑模块中表单模块
	IdentityEditForm.scss
	index.js