weaver_trunk_cli/pc4mobx/prj/components/projectExecute.js

248 lines
11 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import React from 'react';
import { inject, observer } from 'mobx-react';
import { Button, Tabs,Card,Pagination,Row,Col } from 'antd';
import {toJS} from "mobx";
import {Condition,getAdButtons} from './list/listCondition';
import {WeaTableNew} from 'comsMobx';
import {WeaRightMenu,WeaTop,WeaTab,WeaErrorPage,WeaBrowser,WeaTools,WeaLeftRightLayout,WeaProgress,WeaLocaleProvider} from 'ecCom';
const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;
import ListLeftTree from './list/listLeftTree'
import ShareDialog from './dialog/shareDialog'
import ExchangeDialog from './dialog/exchangeDialog'
import ProjectDialog from './dialog/projectDialog'
@inject('prjExecuteStore')
@observer
class ProjectExecute extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {
this.doInit(this.props);
}
doInit(props){
const { location,prjExecuteStore } = props;
const {initDatas,doSearch,} = prjExecuteStore;
initDatas();
//doSearch();
}
componentWillReceiveProps(nextProps){
if(this.props.location.key !== nextProps.location.key){
const { location,prjExecuteStore } = nextProps;
prjExecuteStore.clearStatus();
this.doInit(nextProps);
}
}
componentWillUnmount(){
const { prjExecuteStore } = this.props;
prjExecuteStore.clearStatus();
}
render(){
let title = getLabel(16408,"项目执行");
let topTab = [
{
color: '#000000',
groupid: 'totalCount1',
showcount: true,
title: getLabel(332,"全部"),
tabkey: "all"
},
{
color: '#ff3232',
groupid: 'totalCount2',
showcount: true,
title: getLabel(225,"正常"),
tabkey: "doing"
},
{
color: '#fea468',
groupid: 'totalCount3',
showcount: true,
title: getLabel(2244,"延期"),
tabkey: "overtime"
},
{
color: '#9766fd',
groupid: 'totalCount4',
showcount: true,
title: getLabel(2243,"立项批准"),
tabkey: "todo"
}
];
const {prjExecuteStore} = this.props;
const {loading,tableStore,showSearchAd,showBatchSubmit,form,config,topTabCount,searchParams,exchangeStore,projectInfoStore,reLoad,showLeft} = prjExecuteStore;
const formParams = form.getFormParams() || {};
return (
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@aed262`} datas={this.getRightMenu()} onClick={this.onRightMenuClick.bind(this)} >
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@uzh0w2`}
title={title}
loading={loading}
icon={<i className='icon-coms-project' />}
iconBgcolor='#217346'
buttons={[]}
buttonSpace={10}
showDropIcon={true}
dropMenuDatas={this.getRightMenu()}
onDropMenuClick={this.onRightMenuClick.bind(this)}
>
<WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@fb1x25`}
isNew = {true}
showLeft = {showLeft}
leftCom={<ListLeftTree ecId={`${this && this.props && this.props.ecId || ''}_ListLeftTree@634cii`} listStore={prjExecuteStore} key={this.props.location.key} initkey={"all"} />}
onCollapse={showLeft => prjExecuteStore.setLeftShow(showLeft)}
>
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@3whzmy`}
datas={topTab}
counts={topTabCount}
keyParam="tabkey" //主键
countParam="groupid" //数量
selectedKey={ searchParams.tabkey }
buttonsAd={getAdButtons(prjExecuteStore,this.props.ecId || '')}
searchType={['base','advanced']}
searchsBaseValue={formParams.prjname}
setShowSearchAd={bool=>{prjExecuteStore.setShowSearchAd(bool)}}
hideSearchAd={()=> prjExecuteStore.setShowSearchAd(false)}
searchsAd={
<div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@3ui5no`} listStore={prjExecuteStore} form={form} onEnterSearch={this.onEnterSearch} ></Condition></div>
}
showSearchAd={showSearchAd}
onSearch={v=>{prjExecuteStore.doSearch()}}
onSearchChange={v=>{prjExecuteStore.setFormFields({prjname:{value:v}})}}
onChange={ this.changeData }
/>
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@06klel`}
comsWeaTableStore={tableStore}
hasOrder={true}
needScroll={true}
getColumns={c=>this.reRenderColumns(c)}
tableWidth={this.tableWidth}
register_table={()=>reLoad()}
onOperatesClick={this.onOperatesClick.bind(this)}
/>
</WeaLeftRightLayout>
</WeaTop>
<ShareDialog ecId={`${this && this.props && this.props.ecId || ''}_ShareDialog@ugkyx1`} contentStore={prjExecuteStore} />
<ExchangeDialog ecId={`${this && this.props && this.props.ecId || ''}_ExchangeDialog@q7fzty`} contentStore={exchangeStore} />
<ProjectDialog ecId={`${this && this.props && this.props.ecId || ''}_ProjectDialog@5vn7f8`} contentStore={projectInfoStore}/>
</WeaRightMenu>)
}
onEnterSearch=() =>{
const {prjExecuteStore }= this.props;
prjExecuteStore.doSearch();
prjExecuteStore.setShowSearchAd(false);
}
getRightMenu(){
const {prjExecuteStore }= this.props;
const {rightMenu} = prjExecuteStore;
let btnArr = [];
rightMenu && rightMenu.length>0 && rightMenu.map(m=>{
btnArr.push({
icon: <i className={m.menuIcon} />,
content: m.menuName
})
});
return btnArr
}
onRightMenuClick(key){
const {prjExecuteStore }= this.props;
const {rightMenu} = prjExecuteStore;
let that = this;
rightMenu && rightMenu.length>0 && rightMenu.map((m,i)=>{
if(Number(key) == i){
let fn = m.menuFun.indexOf('this') >= 0 ? `${m.menuFun.split('this')[0]})` : m.menuFun;
if(m.type == "BTN_SEARCH"){ //定制列
prjExecuteStore.doSearch();
}else if(m.type == "BTN_COLUMN"){ //定制列
prjExecuteStore.onShowColumn();
}
}
});
}
reRenderColumns(columns){
columns.forEach((c,i)=>{
if(c.dataIndex=='finish'){
c.render = function(text, record){
return <span className='wea-prj-progressStyle' >
<WeaProgress ecId={`${this && this.props && this.props.ecId || ''}_WeaProgress@18q2x2@${i}`} percent={record.finish} strokeColor={record.finishspan} />
</span>
}
} else {
// c.render = function(text, record){
// let valueSpan = record[c.dataIndex + "span"] !== undefined ? record[c.dataIndex + "span"] : record[c.dataIndex];
// return <span dangerouslySetInnerHTML={{__html: valueSpan}}></span>
// }
}
})
return columns;
}
tableWidth = (columns) => {
let width = 0;
let cols = 0;
columns.map(col => {
if (col.display === 'true') {
let oldwidth = col.oldWidth || '10%';
let widthInt = parseFloat(oldwidth.replace('%', ''));
if (widthInt <= 0) {
widthInt = 10;
}
width += widthInt;
cols++
}
})
//超过10列才出现滚动条width>100才出现滚动条
if(cols<=10){
width = 100 ;
}
return `${width}%`;
}
changeData=(key)=>{
const {prjExecuteStore} = this.props;
prjExecuteStore.setShowSearchAd(false);
prjExecuteStore.doSearch({
tabkey:key
});
}
onOperatesClick(record,index,operate,flag){
const {prjExecuteStore} = this.props;
const {shareStore,exchangeStore,projectInfoStore} = prjExecuteStore;
let _href = operate && operate.href ? operate.href : "";
let fn = _href.replace("javascript:","");
fn = fn.substring(0,fn.indexOf('('));
let that = this;
// saveCapitalId(record.randomFieldId); //保存资产id
if(fn != ""){
if("onShare"==fn){ //共享
shareStore.handleShareDialog(true,"prj",record.randomFieldId)
}else if('onNormal' == fn){ //正常
prjExecuteStore.doPlanOpt({method:'normal',prjid:record.randomFieldId})
}else if('onOver' == fn){ //延期
prjExecuteStore.doPlanOpt({method:'delay',prjid:record.randomFieldId})
}else if('onFinish' == fn){ //完成
prjExecuteStore.doPlanOpt({method:'complete',prjid:record.randomFieldId})
}else if('onFrozen' == fn){ //冻结
prjExecuteStore.doPlanOpt({method:'freeze',prjid:record.randomFieldId})
}else if('onEdit' == fn){ //编辑
projectInfoStore.handleDialog(true,record.randomFieldId,{viewtype:'edit',prjid:record.randomFieldId}) ;
}else if('onListTask' == fn){ //任务列表
}else if('onDiscuss' == fn){ //相关交流
exchangeStore.handleExchangeDialog(true,"prj",record.randomFieldId,{})
}
}
}
}
export default WeaTools.tryCatch(React,
props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@vu7u9d`} msg={ props.error ? props.error : getLabel(383324,"对不起,该页面异常,请联系管理员")} />,
{error: ""}
)(ProjectExecute);