weaver_trunk_cli/pc4mobx/prj/components/BatchShare.js

230 lines
10 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';
const WeaTable = WeaTableNew.WeaTable;
import {WeaRightMenu,WeaTop,WeaTab,WeaErrorPage,WeaBrowser,WeaTools,WeaLeftRightLayout,WeaProgress,WeaLocaleProvider} from 'ecCom';
import ShareDialog from './dialog/shareDialog'
import ListLeftTree from './list/listLeftTree'
import BatchShareDialog from './comp/prj-batch-share'
const getLabel = WeaLocaleProvider.getLabel;
@inject('prjBatchShareStore')
@observer
class BatchShare extends React.Component {
constructor(props) {
super(props);
}
doInit(props){
const {prjBatchShareStore } = props;
const {initTreeDatas,doSearch,initDatas} = prjBatchShareStore;
//doSearch();
initDatas();
//initTreeDatas();
}
componentDidMount(){
this.doInit(this.props);
}
componentWillReceiveProps(nextProps){
if(this.props.location.key !== nextProps.location.key){
const { location,prjBatchShareStore } = nextProps;
prjBatchShareStore.clearStatus();
this.doInit(nextProps);
}
}
componentWillUnmount(){
const { prjBatchShareStore } = this.props;
prjBatchShareStore.clearStatus();
}
render(){
const {prjBatchShareStore} = this.props;
const {loading,tableStore,showSearchAd,form,reLoad,showLeft} = prjBatchShareStore;
const formParams = form.getFormParams() || {};
let {selectedRowKeys} = tableStore;
return (
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@5ycmwl`} datas={this.getRightMenu()} onClick={this.onRightMenuClick.bind(this)} >
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@fum9a8`}
title={getLabel(18037,"批量共享")}
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@u3vsge`}
isNew = {true}
showLeft = {showLeft}
leftCom={<ListLeftTree ecId={`${this && this.props && this.props.ecId || ''}_ListLeftTree@d5irbu`} listStore={prjBatchShareStore} key={this.props.location.key} initkey={"all"} />}
onCollapse={showLeft => prjBatchShareStore.setLeftShow(showLeft)}
>
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@4vvzs0`}
buttonsAd={getAdButtons(prjBatchShareStore,this.props.ecId || '')}
searchType={['base','advanced']}
searchsBaseValue={formParams.name}
setShowSearchAd={bool=>{prjBatchShareStore.setShowSearchAd(bool)}}
hideSearchAd={()=> prjBatchShareStore.setShowSearchAd(false)}
searchsAd={
<div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@698a3n`} listStore={prjBatchShareStore} form={form} onEnterSearch={this.onEnterSearch} ></Condition></div>
}
showSearchAd={showSearchAd}
onSearch={v=>{prjBatchShareStore.doSearch()}}
onSearchChange={v=>{prjBatchShareStore.appendFormFields({name:{value:v}})}}
onChange={ this.changeData }
/>
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@di9f90`}
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@ym9gr1`} contentStore={prjBatchShareStore} />
<BatchShareDialog ecId={`${this && this.props && this.props.ecId || ''}_BatchShareDialog@snmybt`}
visible={prjBatchShareStore.visible}
condition ={toJS(prjBatchShareStore.shareCondition)}
onSave={v=>{
prjBatchShareStore.saveBatchShare({prjids:`${toJS(selectedRowKeys)}`,share:JSON.stringify(v)});
}
}
onCancel={() => {prjBatchShareStore.handleShareDialog(false) }}
/>
</WeaRightMenu>)
}
getTopButtons(){
const {prjBatchShareStore} = this.props;
const {rightMenu,tableStore} = prjBatchShareStore;
let {selectedRowKeys} = tableStore;
let btnArr = [];
let that = this;
const isDisabled = !(selectedRowKeys.length>0 && `${toJS(selectedRowKeys)}`);
rightMenu && rightMenu.length>0 && toJS(rightMenu).map(m=>{
m.isTop == '1' && btnArr.length < 4 && btnArr.push(
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@q86rx3@${m.type}`} type="primary"
disabled={isDisabled && m.isControl == "1"}
onClick={()=>{
if(m.type == "BTN_SHAREBATCH"){//批量共享
prjBatchShareStore.handleShareDialog(true)
}
}}>
{m.menuName}
</Button>
);
});
return btnArr;
}
getRightMenu(){
const {prjBatchShareStore }= this.props;
const {rightMenu,tableStore} = prjBatchShareStore;
let btnArr = [];
let {selectedRowKeys} = tableStore;
const isDisabled = !(selectedRowKeys.length>0 && `${toJS(selectedRowKeys)}`);
rightMenu && rightMenu.length>0 && rightMenu.map(m=>{
btnArr.push({
icon: <i className={m.menuIcon} />,
content: m.menuName,
disabled: isDisabled && m.isControl == "1"
})
});
return btnArr
}
onRightMenuClick(key){
const {prjBatchShareStore }= this.props;
const {rightMenu,tableStore} = prjBatchShareStore;
let {selectedRowKeys} = tableStore;
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"){ //定制列
prjBatchShareStore.doSearch();
}else if(m.type == "BTN_COLUMN"){ //定制列
prjBatchShareStore.onShowColumn();
}else if(m.type == "BTN_SHAREBATCH"){ //批量共享
prjBatchShareStore.handleShareDialog(true)
}
}
});
}
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@fp09dt@${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 {prjBatchShareStore} = this.props;
prjBatchShareStore.setShowSearchAd(false);
prjBatchShareStore.doSearch({
tabkey:key
});
}
onOperatesClick(record,index,operate,flag){
const {prjBatchShareStore} = this.props;
const {shareStore,} = prjBatchShareStore;
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)
}
}
}
onEnterSearch = () =>{
const {prjBatchShareStore} = this.props;
prjBatchShareStore.doSearch();
prjBatchShareStore.setShowSearchAd(false);
}
}
export default WeaTools.tryCatch(React,
props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@0ocn5h`} msg={ props.error ? props.error : getLabel(383324,"对不起,该页面异常,请联系管理员")} />,
{error: ""}
)(BatchShare);