250 lines
11 KiB
JavaScript
250 lines
11 KiB
JavaScript
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';
|
||
const WeaTable = WeaTableNew.WeaTable;
|
||
import {WeaRightMenu,WeaTop,WeaTab,WeaErrorPage,WeaBrowser,WeaTools,WeaLeftRightLayout,WeaProgress,WeaLocaleProvider} from 'ecCom';
|
||
import ListLeftTree from '../list/listLeftTree'
|
||
import ShareDialog from '../dialog/shareDialog'
|
||
import ExchangeDialog from '../dialog/exchangeDialog'
|
||
import ProjectDialog from '../dialog/projectDialog'
|
||
const getLabel = WeaLocaleProvider.getLabel;
|
||
|
||
@inject('queryPrjStore')
|
||
@observer
|
||
class QueryProjectResult extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.doInit(this.props);
|
||
}
|
||
doInit(props){
|
||
const { location:{query},queryPrjStore } = props;
|
||
const {initTreeDatas,doSearch,initDatas,form} = queryPrjStore;
|
||
initDatas(query);
|
||
//doSearch();
|
||
initTreeDatas();
|
||
|
||
}
|
||
componentDidMount() {
|
||
const {queryPrjStore, location:{query},} = this.props;
|
||
queryPrjStore.initDatas(query);
|
||
}
|
||
|
||
componentWillReceiveProps(nextProps){
|
||
const keyOld = this.props.location.key;
|
||
const keyNew = nextProps.location.key;
|
||
const queryOld = this.props.location.query;
|
||
const queryNew = nextProps.location.query;
|
||
//点击菜单路由刷新组件
|
||
const { queryPrjStore } = nextProps;
|
||
if(keyOld !== keyNew||queryOld !== queryNew) {
|
||
queryPrjStore.clearStatus();
|
||
this.doInit(nextProps);
|
||
}
|
||
}
|
||
|
||
componentWillUnmount(){
|
||
const { queryPrjStore } = this.props;
|
||
queryPrjStore.clearStatus();
|
||
}
|
||
|
||
render(){
|
||
const {queryPrjStore} = this.props;
|
||
const {title,loading,tableStore,showSearchAd,form,exchangeStore,projectInfoStore,reLoad,showLeft} = queryPrjStore;
|
||
const formParams = form.getFormParams() || {};
|
||
return (
|
||
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@mlyx8k`} datas={this.getRightMenu()} onClick={this.onRightMenuClick.bind(this)} >
|
||
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@ca7ewm`}
|
||
title={getLabel(16413,"查询项目")}
|
||
loading={loading}
|
||
icon={<i className='icon-coms-project' />}
|
||
iconBgcolor='#217346'
|
||
buttons={this.getTopButtons()}
|
||
buttonSpace={10}
|
||
showDropIcon={true}
|
||
dropMenuDatas={this.getRightMenu()}
|
||
onDropMenuClick={this.onRightMenuClick.bind(this)}
|
||
>
|
||
<WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@qha9n9`}
|
||
isNew = {true}
|
||
showLeft = {showLeft}
|
||
leftCom={<ListLeftTree ecId={`${this && this.props && this.props.ecId || ''}_ListLeftTree@8snxwo`} listStore={queryPrjStore} key={this.props.location.key} initkey={"all"} />}
|
||
onCollapse={showLeft => queryPrjStore.setLeftShow(showLeft)}
|
||
>
|
||
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@szqi74`}
|
||
buttonsAd={getAdButtons(queryPrjStore,this.props.ecId || '')}
|
||
searchType={['base','advanced']}
|
||
searchsBaseValue={formParams.name}
|
||
setShowSearchAd={bool=>{queryPrjStore.setShowSearchAd(bool)}}
|
||
hideSearchAd={()=> queryPrjStore.setShowSearchAd(false)}
|
||
searchsAd={
|
||
<div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@bmguxp`} listStore={queryPrjStore} form={form} onEnterSearch={this.onEnterSearch} ></Condition></div>
|
||
}
|
||
showSearchAd={showSearchAd}
|
||
onSearch={v=>{queryPrjStore.doSearch()}}
|
||
onSearchChange={v=>{queryPrjStore.appendFormFields({name:{value:v}})}}
|
||
onChange={ this.changeData }
|
||
/>
|
||
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@opzeuo`}
|
||
comsWeaTableStore={tableStore}
|
||
hasOrder={true}
|
||
needScroll={true}
|
||
register_table={()=>reLoad()}
|
||
getColumns={c=>this.reRenderColumns(c)}
|
||
tableWidth={this.tableWidth}
|
||
onOperatesClick={this.onOperatesClick.bind(this)}
|
||
/>
|
||
</WeaLeftRightLayout>
|
||
</WeaTop>
|
||
<ShareDialog ecId={`${this && this.props && this.props.ecId || ''}_ShareDialog@ppun94`} contentStore={queryPrjStore} />
|
||
<ExchangeDialog ecId={`${this && this.props && this.props.ecId || ''}_ExchangeDialog@dnz4uw`} contentStore={exchangeStore} />
|
||
<ProjectDialog ecId={`${this && this.props && this.props.ecId || ''}_ProjectDialog@fqu57i`} contentStore={projectInfoStore}/>
|
||
</WeaRightMenu>)
|
||
|
||
}
|
||
|
||
|
||
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}%`;
|
||
}
|
||
|
||
onEnterSearch=() =>{
|
||
const {queryPrjStore} = this.props;
|
||
queryPrjStore.doSearch();
|
||
queryPrjStore.setShowSearchAd(false);
|
||
}
|
||
|
||
getTopButtons(){
|
||
const {queryPrjStore} = this.props;
|
||
const {rightMenu,tableStore} = queryPrjStore;
|
||
let {selectedRowKeys} = tableStore;
|
||
let btnArr = [];
|
||
let that = this;
|
||
const isDisabled = !(selectedRowKeys.length>0 && `${toJS(selectedRowKeys)}`);
|
||
rightMenu && rightMenu.length>0 && toJS(rightMenu).map(m=>{
|
||
let fn = m.menuFun.indexOf('this') >= 0 ? `${m.menuFun.split('this')[0]})` : m.menuFun;
|
||
m.isTop == '1' && btnArr.length < 4 && btnArr.push(
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@5dvni6@${m.type}`} type="primary"
|
||
disabled={isDisabled && m.isControl == "1"}
|
||
onClick={()=>{
|
||
if(fn == ""){
|
||
if(m.type == "BTN_EXPORT"){ //导出Excel
|
||
queryPrjStore.doPrjExcelExp();
|
||
}
|
||
}
|
||
}}>
|
||
{m.menuName}
|
||
</Button>
|
||
);
|
||
});
|
||
return btnArr;
|
||
}
|
||
|
||
getRightMenu(){
|
||
const {queryPrjStore }= this.props;
|
||
const {rightMenu} = queryPrjStore;
|
||
let btnArr = [];
|
||
rightMenu && rightMenu.length>0 && rightMenu.map(m=>{
|
||
btnArr.push({
|
||
icon: <i className={m.menuIcon} />,
|
||
content: m.menuName
|
||
})
|
||
});
|
||
return btnArr
|
||
}
|
||
onRightMenuClick(key){
|
||
const {queryPrjStore }= this.props;
|
||
const {rightMenu} = queryPrjStore;
|
||
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"){
|
||
queryPrjStore.doSearch();
|
||
}else if(m.type == "BTN_COLUMN"){ //定制列
|
||
queryPrjStore.onShowColumn();
|
||
}else if(m.type == "BTN_EXPORT"){
|
||
queryPrjStore.doPrjExcelExp();
|
||
}
|
||
}
|
||
});
|
||
}
|
||
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@siia3c@${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;
|
||
}
|
||
changeData=(key)=>{
|
||
const {queryPrjStore} = this.props;
|
||
queryPrjStore.setShowSearchAd(false);
|
||
queryPrjStore.doSearch({
|
||
tabkey:key
|
||
});
|
||
}
|
||
|
||
onOperatesClick(record,index,operate,flag){
|
||
const {queryPrjStore} = this.props;
|
||
const {shareStore,exchangeStore,projectInfoStore} = queryPrjStore;
|
||
let _href = operate && operate.href ? operate.href : "";
|
||
let fn = _href.replace("javascript:","");
|
||
fn = fn.substring(0,fn.indexOf('('));
|
||
let that = this;
|
||
if(fn != ""){
|
||
if("onShare"==fn){ //共享
|
||
shareStore.handleShareDialog(true,"prj",record.randomFieldId)
|
||
}else if('onNormal' == fn){ //正常
|
||
queryPrjStore.doPlanOpt({method:'normal',prjid:record.randomFieldId})
|
||
}else if('onOver' == fn){ //延期
|
||
queryPrjStore.doPlanOpt({method:'delay',prjid:record.randomFieldId})
|
||
}else if('onFinish' == fn){ //完成
|
||
queryPrjStore.doPlanOpt({method:'complete',prjid:record.randomFieldId})
|
||
}else if('onFrozen' == fn){ //冻结
|
||
queryPrjStore.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,{})
|
||
}else if('onDel' == fn){ //项目删除
|
||
queryPrjStore.delPrjInfo({method:"del",prjid:record.randomFieldId,from:"mymanagerproject"})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
export default WeaTools.tryCatch(React,
|
||
props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@utlo2c`} msg={ props.error ? props.error : getLabel(383324,"对不起，该页面异常，请联系管理员")} />,
|
||
{error: ""}
|
||
)(QueryProjectResult); |