670 lines
37 KiB
JavaScript
670 lines
37 KiB
JavaScript
import React from 'react';
|
||
import { Button, Tabs, Card, Tooltip, Row, Col, Spin, Menu, Icon } from 'antd';
|
||
import { inject, observer } from 'mobx-react';
|
||
import { WeaTop, WeaInputSearch, WeaLeftRightLayout, WeaNewScroll, WeaEchart, WeaDropdown, WeaProgress, WeaNewScrollPagination, WeaSelect, WeaAlertPage, WeaTab, WeaRightMenu } from 'ecCom';
|
||
import {routerShape} from 'react-router';
|
||
const { SubMenu } = Menu;
|
||
import AddPrjGroupDialog from '../dialog/addPrjGroupDialog';
|
||
import {toJS} from 'mobx';
|
||
import {Condition,getAdButtons} from '../list/portalCondition';
|
||
import {WeaTableNew} from 'comsMobx';
|
||
const WeaTable = WeaTableNew.WeaTable;
|
||
import { WeaLocaleProvider } from 'ecCom';
|
||
const getLabel = WeaLocaleProvider.getLabel;
|
||
import loadjs from 'loadjs';
|
||
import "./index.less";
|
||
import ShareDialog from '../dialog/shareDialog'
|
||
import ExchangeDialog from '../dialog/exchangeDialog'
|
||
import ProjectDialog from '../dialog/projectDialog'
|
||
import ItemList from "../projectBoard/ItemList";
|
||
import ProjectCard from "./projectCard";
|
||
@inject("projectPortalStore","queryPrjStore","projectBoardStore")
|
||
@observer
|
||
class ProjectPortal extends React.Component {
|
||
static contextTypes = {
|
||
router: routerShape
|
||
}
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
current: 'allPrj',
|
||
ctrlHeight : 200,
|
||
viewScope : "card",
|
||
showSearchAd : false,
|
||
selectedKey : 0
|
||
};
|
||
}
|
||
componentDidMount() {
|
||
const {projectPortalStore, queryPrjStore, location:{query}, projectBoardStore} = this.props;
|
||
queryPrjStore.initDatas(query);
|
||
projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
projectBoardStore.initList();
|
||
// if (!loadjs.isDefined('weaPrjEcharts')) {
|
||
// loadjs(['/js/echart/echarts.min.js'], 'weaPrjEcharts', {
|
||
// success: () => {
|
||
// projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
// }
|
||
// });
|
||
// } else {
|
||
// projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
// }
|
||
// console.log(this.refs);
|
||
// this.setState({
|
||
// ctrlHeight: this.refs.searGroup.height
|
||
// });
|
||
|
||
}
|
||
|
||
componentWillReceiveProps(nextProps){
|
||
const keyOld = this.props.location.key;
|
||
const keyNew = nextProps.location.key;
|
||
const query = nextProps.location.query;
|
||
if(keyOld !== keyNew) {
|
||
const { projectPortalStore, queryPrjStore, projectBoardStore } = nextProps;
|
||
queryPrjStore.clearStatus();
|
||
queryPrjStore.initDatas(query);
|
||
projectPortalStore.clearStatus();
|
||
projectPortalStore.prjGroupStore1.setId('allPrj');
|
||
this.setState({viewScope : "card",current: 'allPrj'});
|
||
projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
projectBoardStore.initList();
|
||
// if (!loadjs.isDefined('weaPrjEcharts')) {
|
||
// loadjs(['/js/echart/echarts.min.js'], 'weaPrjEcharts', {
|
||
// success: () => {
|
||
// projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
// projectBoardStore.initList();
|
||
// }
|
||
// });
|
||
// } else {
|
||
// projectPortalStore.initDatas({viewScope:this.state.viewScope});
|
||
// projectBoardStore.initList();
|
||
// }
|
||
}
|
||
}
|
||
|
||
componentWillUnmount (){
|
||
const { queryPrjStore, projectPortalStore } = this.props;
|
||
queryPrjStore.clearStatus();
|
||
projectPortalStore.clearStatus();
|
||
projectPortalStore.prjGroupStore1.setId('allPrj');
|
||
this.setState({viewScope : "card",current: 'allPrj',selectedKey:0});
|
||
}
|
||
|
||
render() {
|
||
const { projectPortalStore, queryPrjStore, projectBoardStore } = this.props;
|
||
const { title, prjGroupStore, groups, prjGroupStore1, tableStore, reLoad, loadding, exchangeStore, projectInfoStore, quickSearch, counts, initDatas, isLoadJs, prjtype } = projectPortalStore;
|
||
const { form, showSearchAd } = queryPrjStore;
|
||
let prjdatas = this.getProjects();
|
||
const formParams = form.getFormParams() || {};
|
||
const topTab = [
|
||
{
|
||
title: getLabel('31458','分组') ,
|
||
viewcondition: "0"
|
||
},
|
||
{
|
||
title: getLabel('320','列表'),
|
||
viewcondition: "1"
|
||
}
|
||
];
|
||
return (
|
||
<div className="prj-portal-page">
|
||
<WeaRightMenu>
|
||
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@1gdr8p`} title={getLabel('387831','项目门户')} icon={<i className='icon-coms-project' />} buttons={this.getTopButtons()} iconBgcolor='#217346'/>
|
||
<WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@uw9p6t`}
|
||
leftWidth={300}
|
||
leftCom={
|
||
<div className="prj-portal-left">
|
||
<div className="search-group" ref="searchGroup" style={{height:"100%"}}>
|
||
{/* <WeaInputSearch
|
||
style={{width:"100%"}}
|
||
placeholder={getLabel('511884','搜索分组')}
|
||
onSearch={(v) =>{quickSearch(v)}}
|
||
/> */}
|
||
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@wj0hak`}
|
||
style={{backgroundColor:'#f9f9f9'}}
|
||
datas={topTab}
|
||
keyParam="viewcondition" //主键
|
||
selectedKey={this.state.selectedKey}
|
||
onChange={v => {
|
||
this.setState({ selectedKey: v });
|
||
queryPrjStore.form.resetConditionValue();
|
||
queryPrjStore.form.updateFields({'prjtype':'-1'});
|
||
if(v==0){
|
||
initDatas({viewScope:this.state.viewScope});
|
||
}else if(v==1){
|
||
projectBoardStore.initList();
|
||
}
|
||
}}
|
||
/>
|
||
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@4wg24v`}
|
||
buttonsAd={getAdButtons(queryPrjStore,projectPortalStore,() =>{
|
||
if(this.state.selectedKey==0){
|
||
initDatas(formParams);
|
||
}else if(this.state.selectedKey==1){
|
||
projectBoardStore.getProjectList1(formParams);
|
||
}
|
||
})}
|
||
searchType={['base','advanced']}
|
||
showSearchAd={showSearchAd}
|
||
searchsAd={
|
||
<div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@sw1t78`} listStore={queryPrjStore} form={form} onEnterSearch={this.onEnterSearch} ></Condition></div>
|
||
}
|
||
setShowSearchAd={bool=>{queryPrjStore.setShowSearchAd(bool)}}
|
||
keyParam="key"
|
||
searchsBaseValue={formParams.name}
|
||
onSearchChange={v=>{queryPrjStore.appendFormFields({name:{value:v}})}}
|
||
onSearch={() =>{
|
||
if(this.state.selectedKey==0){
|
||
initDatas(formParams);
|
||
}else if(this.state.selectedKey==1){
|
||
projectBoardStore.getProjectList1(formParams);
|
||
}
|
||
}}
|
||
leftStyle={{paddingRight: 350}}
|
||
/>
|
||
{
|
||
this.state.selectedKey==0&&
|
||
<div style={{ width: '100%',height:"calc(100% - 20px)" }} >
|
||
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@m7seuy`} height={"100%"} onScroll={(e)=>{ this.setState({ scrollTop:e.target.scrollTop, }) }}>
|
||
<Menu ecId={`${this && this.props && this.props.ecId || ''}_Menu@606msa`}
|
||
theme={'light'}
|
||
onClick={this.handleClick}
|
||
style={{ width: '100%'}}
|
||
defaultOpenKeys={['sub1']}
|
||
selectedKeys={[this.state.current]}
|
||
mode="inline"
|
||
>
|
||
<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@dz1uzu`} key="allPrj">
|
||
<i className="icon-coms-Modular-o" />
|
||
<span>{getLabel('518255','全部项目')}</span>
|
||
<span style={{color:'rgb(197, 197, 197)',float:'right'}}>{counts.allPrj}</span>
|
||
</Menu.Item>
|
||
<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@3rh2ed`} key="mineStar">
|
||
<i className="icon-coms-Collection" />
|
||
<span>{getLabel('518251','我的星标')}</span>
|
||
<span style={{color:'rgb(197, 197, 197)',float:'right'}}>{counts.mineStar}</span>
|
||
</Menu.Item>
|
||
<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@6svx8z`} key="myPrj">
|
||
<i className="icon-coms-yonghu" />
|
||
<span>{getLabel('83231','我参与的')}</span>
|
||
<span style={{color:'rgb(197, 197, 197)',float:'right'}}>{counts.myPrj}</span>
|
||
</Menu.Item>
|
||
<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@egf0x6`} key="expPrj">
|
||
<i className="icon-coms-File" />
|
||
<span>{getLabel('16408','项目执行')}</span>
|
||
<span style={{color:'rgb(197, 197, 197)',float:'right'}}>{counts.expPrj}</span>
|
||
</Menu.Item>
|
||
<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@vwlj7y`} key="endPrj">
|
||
<i className="icon-coms-currency-Task" />
|
||
<span>{getLabel('518252','已完成项目')}</span>
|
||
<span style={{color:'rgb(197, 197, 197)',float:'right'}}>{counts.endPrj}</span>
|
||
</Menu.Item>
|
||
<SubMenu ecId={`${this && this.props && this.props.ecId || ''}_SubMenu@eky2jj`}
|
||
key="sub1"
|
||
title={
|
||
<span>
|
||
<Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@mjwnlx`} type="hdd" />
|
||
<span>{getLabel('518256','项目分组')}</span>
|
||
<Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@xdwdrh`} type="plus-square" className="add-icon" onClick={(e) =>{e.stopPropagation() ;prjGroupStore.handlePrjGroupDialog(true)}} />
|
||
</span>
|
||
}
|
||
>
|
||
{this.getGroups(groups)}
|
||
</SubMenu>
|
||
</Menu>
|
||
</WeaNewScroll>
|
||
</div>
|
||
}
|
||
{
|
||
this.state.selectedKey==1&&
|
||
<ItemList ecId={`${this && this.props && this.props.ecId || ''}_ItemList@c6zywt`} title={getLabel(101, "项目")} store={projectBoardStore} fromPortal={true} formParams={formParams}/>
|
||
}
|
||
<AddPrjGroupDialog ecId={`${this && this.props && this.props.ecId || ''}_AddPrjGroupDialog@0jp2bb`} projectPortalStore={projectPortalStore} prjGroupStore={prjGroupStore} />
|
||
<AddPrjGroupDialog ecId={`${this && this.props && this.props.ecId || ''}_AddPrjGroupDialog@dikpkv`} projectPortalStore={projectPortalStore} prjGroupStore={prjGroupStore1} />
|
||
</div>
|
||
</div>
|
||
}
|
||
// onCollapse={showLeft => console.log('showLeft:', showLeft)}
|
||
>
|
||
{
|
||
this.state.selectedKey==0&&this.state.viewScope=="card" && prjdatas.length==0 &&
|
||
<div style={{height: window.innerHeight}}>
|
||
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@ba11b8`} icon="icon-coms-blank" >
|
||
<div style={{color : '#000'}}>
|
||
{getLabel(83553, '暂无数据')}
|
||
</div>
|
||
</WeaAlertPage>
|
||
</div>
|
||
}
|
||
{
|
||
this.state.selectedKey==0&&this.state.viewScope=="card" && prjdatas.length > 0 &&
|
||
<WeaNewScrollPagination ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScrollPagination@ks92hg`} height={"calc(100% - 55px)"} className="prj-portal-right" loadding={loadding} onScrollEnd={this.onScrollEnd}>
|
||
{
|
||
prjdatas.map((item,i)=>{
|
||
return <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@d060iz@${i}`}>{item}</Row>
|
||
})
|
||
}
|
||
</WeaNewScrollPagination>
|
||
}
|
||
{
|
||
this.state.selectedKey==0&&this.state.viewScope=="list" && <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@qguy17`}
|
||
comsWeaTableStore={tableStore}
|
||
hasOrder={true}
|
||
needScroll={true}
|
||
register_table={()=>reLoad()}
|
||
getColumns={c=>this.reRenderColumns(c)}
|
||
tableWidth={this.tableWidth}
|
||
onOperatesClick={this.onOperatesClick.bind(this)}
|
||
/>
|
||
}
|
||
{
|
||
this.state.selectedKey==1&&(parseInt(projectBoardStore.prjid)>0?
|
||
<ProjectCard ecId={`${this && this.props && this.props.ecId || ''}_ProjectCard@98nxoq`} prjid={projectBoardStore.prjid} fromPortal={true} dellCallBack={() =>{projectBoardStore.getProjectList1(formParams);}} changeCallBack={() =>{projectBoardStore.getProjectList1(formParams);}} ></ProjectCard>
|
||
:
|
||
<div style={{height: window.innerHeight}}>
|
||
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@penn7u`} icon="icon-coms-blank" >
|
||
<div style={{color : '#000'}}>
|
||
{getLabel(83553, '暂无数据')}
|
||
</div>
|
||
</WeaAlertPage>
|
||
</div>)
|
||
}
|
||
</WeaLeftRightLayout>
|
||
<ShareDialog ecId={`${this && this.props && this.props.ecId || ''}_ShareDialog@7xkyz5`} contentStore={projectPortalStore} />
|
||
<ExchangeDialog ecId={`${this && this.props && this.props.ecId || ''}_ExchangeDialog@2ndzbm`} contentStore={exchangeStore} />
|
||
<ProjectDialog ecId={`${this && this.props && this.props.ecId || ''}_ProjectDialog@phl8ng`} contentStore={projectInfoStore}/>
|
||
</WeaRightMenu>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
onEnterSearch=() =>{
|
||
const { projectPortalStore,queryPrjStore } = this.props;
|
||
const { form } = queryPrjStore;
|
||
const formParams = form.getFormParams() || {};
|
||
projectPortalStore.initDatas(formParams);
|
||
queryPrjStore.setShowSearhAd(false);
|
||
}
|
||
onOperatesClick(record,index,operate,flag){
|
||
const {projectPortalStore} = this.props;
|
||
const {shareStore,exchangeStore,projectInfoStore} = projectPortalStore;
|
||
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){ //正常
|
||
projectPortalStore.doPlanOpt({method:'normal',prjid:record.randomFieldId})
|
||
}else if('onOver' == fn){ //延期
|
||
projectPortalStore.doPlanOpt({method:'delay',prjid:record.randomFieldId})
|
||
}else if('onFinish' == fn){ //完成
|
||
projectPortalStore.doPlanOpt({method:'complete',prjid:record.randomFieldId})
|
||
}else if('onFrozen' == fn){ //冻结
|
||
projectPortalStore.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){ //项目删除
|
||
projectPortalStore.delPrjInfo({method:"del",prjid:record.randomFieldId,from:"mymanagerproject"})
|
||
}
|
||
}
|
||
}
|
||
|
||
onScrollEnd = () => {
|
||
const { projectPortalStore, queryPrjStore } = this.props;
|
||
const { searchNextPage } = projectPortalStore;
|
||
const { form } = queryPrjStore;
|
||
const formParams = form.getFormParams() || {};
|
||
searchNextPage(formParams);
|
||
}
|
||
|
||
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}%`;
|
||
}
|
||
|
||
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@938jt0@${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;
|
||
}
|
||
|
||
handleClick = e => {
|
||
const {projectPortalStore,queryPrjStore} = this.props;
|
||
queryPrjStore.form.resetConditionValue();
|
||
queryPrjStore.form.updateFields({'prjtype':'-1'});
|
||
projectPortalStore.setPrjType('-1');
|
||
projectPortalStore.initDatas({groupid:e.key});
|
||
projectPortalStore.prjGroupStore1.setId(e.key);
|
||
this.setState({
|
||
current: e.key,
|
||
});
|
||
};
|
||
|
||
getProjects = () => {
|
||
let row = [];
|
||
let col= [];
|
||
const { prjDatas, collectProject, counts, getPrjSearchDatas } = this.props.projectPortalStore;
|
||
let datas = prjDatas;
|
||
datas.map((item,index)=>{
|
||
let data = [];
|
||
let data2 = [];
|
||
let dataall = [];
|
||
for (var i = 0; i < item.xdata.length; i++) {
|
||
|
||
data.push([item.xdata[i],item.data[i]]);
|
||
data2.push([item.xdata[i],item.data2[i]]);
|
||
dataall.push([item.xdata[i],item.dataall[i]]);
|
||
}
|
||
|
||
col.push(
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@i648jy@${index}`} span="6">
|
||
<Card ecId={`${this && this.props && this.props.ecId || ''}_Card@yozrr5@${index}`} bordered={false}>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@u3m0vh@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@4xvm27@${index}`} span="19">
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@aiw2n2@${index}`}>
|
||
<span className="prj-card-title" title={item.name} onClick={()=>{this.forwardProjectCard("?prjid="+item.id)}}>{item.name}</span>
|
||
</Row>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@v34nme@${index}`}>
|
||
<span className="prj-card-msg">{item.dynamic}</span>
|
||
</Row>
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@48ryto@${index}`} span="5">
|
||
<Tooltip ecId={`${this && this.props && this.props.ecId || ''}_Tooltip@f4hobz@${index}`} placement="bottom" title={item.hrmname}>
|
||
<a href={'javaScript:openhrm('+item.hrmid+');'} onClick={e => window.pointerXY(e)} >
|
||
<img src={item.hrmimg} className="manager-img" />
|
||
</a>
|
||
</Tooltip>
|
||
</Col>
|
||
</Row>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@jgcnw8@${index}`}>
|
||
<div style={{height:"200px",padding:"0px"}}>
|
||
<WeaEchart ecId={`${this && this.props && this.props.ecId || ''}_WeaEchart@dgebm1@${index}`} ref="chart2" chartName={""}
|
||
option={{
|
||
xAxis: {
|
||
type: 'category',
|
||
// boundaryGap: [0, 0],
|
||
|
||
axisPointer: {
|
||
value: '2016-10-7',
|
||
snap: true,
|
||
lineStyle: {
|
||
color: '#004E52',
|
||
opacity: 0.5,
|
||
width: 0
|
||
},
|
||
label: {
|
||
show: true,
|
||
|
||
backgroundColor: '#004E52'
|
||
},
|
||
handle: {
|
||
show: true,
|
||
color: '#004E52'
|
||
}
|
||
},
|
||
splitLine: {
|
||
show: false
|
||
}
|
||
},
|
||
tooltip: {
|
||
extraCssText:"font-size:6px"
|
||
},
|
||
yAxis: {
|
||
data : [2,5,10,20,50,100],
|
||
type: 'value',
|
||
axisTick: {
|
||
inside: true
|
||
},
|
||
splitLine: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
inside: true,
|
||
},
|
||
z: 10
|
||
},
|
||
|
||
grid: {
|
||
top: 15,
|
||
left: 15,
|
||
right: 15,
|
||
bottom: 50,
|
||
height: 160
|
||
},
|
||
series: [
|
||
{
|
||
name:getLabel('518653','超期数量'),
|
||
type:'line',
|
||
smooth: true,
|
||
symbol: 'circle',
|
||
symbolSize: 6,
|
||
sampling: 'average',
|
||
// itemStyle: {
|
||
// normal: {
|
||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
||
// offset: 0,
|
||
// color: '#e87979'
|
||
// }, {
|
||
// offset: 1,
|
||
// color: '#f1f1f1'
|
||
// }])
|
||
// }
|
||
// },
|
||
stack: 'a',
|
||
areaStyle: {
|
||
normal:'#8ec6ad'
|
||
},
|
||
data: data2,
|
||
},{
|
||
name:getLabel('518343','已完成数量'),
|
||
type:'line',
|
||
smooth: true,
|
||
symbol: 'circle',
|
||
symbolSize: 6,
|
||
sampling: 'average',
|
||
// itemStyle: {
|
||
// normal: {
|
||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
||
// offset: 0,
|
||
// color: '#2db7f5'
|
||
// }, {
|
||
// offset: 1,
|
||
// color: '#f1f1f1'
|
||
// }])
|
||
// }
|
||
// },
|
||
stack: 'b',
|
||
areaStyle: {
|
||
normal:'#8ec6ad'
|
||
},
|
||
data: data,
|
||
},
|
||
]
|
||
}}
|
||
useDefault={false}/>
|
||
</div>
|
||
</Row>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@mnag2k@${index}`}>{/* 底部按钮组 */}
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2bazmr@${index}`} span="20">
|
||
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@mpsoql@${index}`} span="4">
|
||
<i className={item.isGuanZhu?'icon-coms-Collection2':'icon-coms-Collection'} style={item.isGuanZhu?{fontSize:'16px',color:'lightcoral'}:{fontSize:'16px'}} onClick={() =>{
|
||
collectProject({prjid:item.id,type:item.isGuanZhu?0:1});
|
||
item.isGuanZhu=!item.isGuanZhu;
|
||
if(item.isGuanZhu){
|
||
counts.mineStar++;
|
||
}else{
|
||
counts.mineStar--;
|
||
}
|
||
getPrjSearchDatas();
|
||
}}/>
|
||
</Col>
|
||
</Row>
|
||
</Card>
|
||
</Col>
|
||
)
|
||
if((index+1)%4 == 0){
|
||
row.push(col);
|
||
col= [];
|
||
}
|
||
if(index == datas.length-1){
|
||
row.push(col);
|
||
col= [];
|
||
}
|
||
|
||
});
|
||
return row;
|
||
}
|
||
|
||
getTopButtons = () => {
|
||
const { projectPortalStore, queryPrjStore } = this.props;
|
||
const { prjtypes, initDatas, setPrjType, setOrderBy, prjtype } = projectPortalStore;
|
||
const { form } = queryPrjStore;
|
||
const formParams = form.getFormParams() || {};
|
||
const options = [
|
||
{
|
||
key: "",
|
||
selected:true,
|
||
showname: ""
|
||
},
|
||
{
|
||
key: "createtime",
|
||
showname: getLabel('518253','按创建时间')
|
||
},
|
||
{
|
||
key: "manager",
|
||
showname: getLabel('518254','按项目经理')
|
||
}
|
||
];
|
||
let buttons = [];
|
||
if(this.state.selectedKey==0){
|
||
buttons.push(
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@fn8i80`} style={{width:'180px'}}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@nb41e1`} span={12}>
|
||
{getLabel('586','项目类型')}
|
||
</Col>
|
||
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@vhywf1`} span={1}>
|
||
</Col>
|
||
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@44dngl`} span={11}>
|
||
<WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@6cjbb`}
|
||
style={{width:'100px'}}
|
||
options={toJS(prjtypes)}
|
||
value={prjtype}
|
||
viewAttr={2}
|
||
onChange={(v, showname) => {
|
||
queryPrjStore.appendFormFields({prjtype:{value:v}})
|
||
setPrjType(v);
|
||
initDatas(formParams);
|
||
}}
|
||
/>
|
||
</Col>
|
||
</Row>
|
||
);
|
||
buttons.push(
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@5ytpfx`} style={{width:'180px'}}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@jz2isn`} span={6}>
|
||
{getLabel('338','排序')}
|
||
</Col>
|
||
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@8maelf`} span={1}>
|
||
</Col>
|
||
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@x7j905`} span={17}>
|
||
<WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@6rm310`}
|
||
style={{width:'120px'}}
|
||
options={options}
|
||
// value={value}
|
||
viewAttr={2}
|
||
onChange={(v, showname) => {
|
||
setOrderBy(v);
|
||
initDatas();
|
||
}}
|
||
/>
|
||
</Col>
|
||
</Row>
|
||
);
|
||
if(this.state.viewScope == "card"){
|
||
buttons.push( <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@uxd1je`} type="ghost" icon="bars" onClick={()=>this.changeScope("list")}/>)
|
||
}else{
|
||
buttons.push( <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@q6ooy3`} type="ghost" icon="appstore-o" onClick={()=>this.changeScope("card")}/>)
|
||
}
|
||
}
|
||
return buttons;
|
||
}
|
||
|
||
changeScope = (viewScope) => {
|
||
this.setState({viewScope : viewScope})
|
||
}
|
||
|
||
getGroups = (arr) =>{
|
||
const { projectPortalStore } = this.props;
|
||
const { deletePrjGroupInfo,prjGroupStore1 } = projectPortalStore;
|
||
let datas = [];
|
||
arr.map(c =>{
|
||
datas.push(<Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_MenuItem@9rw7gd@${c.id}`} style={{display:'relative',paddingRight:'48px'}} key={c.id} >
|
||
<span>{c.name}</span>
|
||
<i className='icon-coms-delete' style={{position:'absolute',top:'15px',right:'0px'}} onClick={(e) =>{
|
||
e.stopPropagation()
|
||
e.preventDefault();
|
||
deletePrjGroupInfo({groupid:c.id});
|
||
if(this.state.current==c.id){
|
||
this.setState({current:'allPrj'});
|
||
}
|
||
}} />
|
||
<i className='icon-coms-edit' style={{position:'absolute',top:'15px',right:'20px'}} onClick={(e) =>{
|
||
e.stopPropagation()
|
||
e.preventDefault();
|
||
prjGroupStore1.handlePrjGroupDialog(true,{id:c.id});
|
||
}} />
|
||
</Menu.Item>);
|
||
})
|
||
return datas;
|
||
}
|
||
|
||
forwardProjectCard(query){
|
||
const path = "/portal/card"+query;
|
||
this.context.router.push({
|
||
pathname: "/main/prj"+path
|
||
});
|
||
}
|
||
|
||
}
|
||
|
||
export default ProjectPortal; |