113 lines
4.2 KiB
JavaScript
113 lines
4.2 KiB
JavaScript
|
/*
|
|||
|
|
* @Author: lusx
|
|||
|
|
* @Date: 2020-03-02 14:51:29
|
|||
|
|
* @Last Modified by: lusx
|
|||
|
|
* @Last Modified time: 2020-05-20 11:14:53
|
|||
|
|
*/
|
|||
|
|
import React from 'react';
|
|||
|
|
import { Popover } from 'antd';
|
|||
|
|
import {WeaTools} from 'ecCom';
|
|||
|
|
import classnames from 'classnames';
|
|||
|
|
import Content from "./content";
|
|||
|
|
import { toJS } from "mobx";
|
|||
|
|
import _ from "lodash";
|
|||
|
|
import "./prjSelect.less";
|
|||
|
|
import { WeaLocaleProvider } from 'ecCom';
|
|||
|
|
const getLabel = WeaLocaleProvider.getLabel;
|
|||
|
|
const { ls } = WeaTools;
|
|||
|
|
export default class PrjSelect extends React.Component {
|
|||
|
|
static defaultProps = {
|
|||
|
|
prefixCls: 'prj-select'
|
|||
|
|
};
|
|||
|
|
constructor() {
|
|||
|
|
super();
|
|||
|
|
this.state = { open: false, copyOPtions: {}, options: {} };
|
|||
|
|
this.total = 0;
|
|||
|
|
}
|
|||
|
|
componentDidMount() {
|
|||
|
|
const { value } = this.props;
|
|||
|
|
const prjdatas = toJS(ls.getJSONObj("prj_portal_datas"));
|
|||
|
|
const total = toJS(ls.getJSONObj("prj_portal_count"));
|
|||
|
|
this.total = total;
|
|||
|
|
const options = { menus: prjdatas, total: this.total };
|
|||
|
|
this.setState({ options });
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
render() {
|
|||
|
|
const { prefixCls, onChange, value, title } = this.props;
|
|||
|
|
let selected = title;
|
|||
|
|
const prjdatas = toJS(ls.getJSONObj("prj_portal_datas"));
|
|||
|
|
prjdatas.forEach(data=>{
|
|||
|
|
data.datas.length > 0 && data.datas.forEach(d=>{
|
|||
|
|
if(d.id == value) {
|
|||
|
|
selected = d.name;
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
const { open, options } = this.state;
|
|||
|
|
const iconClass = classnames({
|
|||
|
|
'icon-jiantou-xia': !open,
|
|||
|
|
'icon-jiantou-shang': open
|
|||
|
|
});
|
|||
|
|
return (
|
|||
|
|
<Popover ecId={`${this && this.props && this.props.ecId || ''}_Popover@lxz0xu`}
|
|||
|
|
content={<Content ecId={`${this && this.props && this.props.ecId || ''}_Content@w8w0pp`} options={options} _inputChangeFun={this._inputChangeFun} _clearFun={this._clearFun} onChange={onChange} handleVisibleChange={this.handleVisibleChange} selectedKey={value} />}
|
|||
|
|
trigger="click"
|
|||
|
|
visible={open}
|
|||
|
|
arrowPointAtCenter
|
|||
|
|
onVisibleChange={this.handleVisibleChange}
|
|||
|
|
>
|
|||
|
|
<div className={`${prefixCls}-wraps`}>
|
|||
|
|
<div className={`${prefixCls}-dropdown-select ${prefixCls}-project_select`}>
|
|||
|
|
<span className={`${prefixCls}-dropdown-select-label`}>{getLabel('101','项目')}：</span>
|
|||
|
|
<div className={`${prefixCls}-dropdown-select-selected-item`}>
|
|||
|
|
<div className={`${prefixCls}-dropdown-select-selected-item-menu`} onClick={this.clickFun}>
|
|||
|
|
<a>{selected}</a>
|
|||
|
|
</div>
|
|||
|
|
<span className={`${iconClass} icon iconfont`}></span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</Popover>
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
handleVisibleChange = (visible) => {
|
|||
|
|
this.setState({ open: visible });
|
|||
|
|
}
|
|||
|
|
clickFun = (ev) => {
|
|||
|
|
const oEvent = ev || event;
|
|||
|
|
oEvent.preventDefault();
|
|||
|
|
this.setState(pre => ({ open: !pre.open }));
|
|||
|
|
}
|
|||
|
|
_inputChangeFun = (ev) => {
|
|||
|
|
const oEvent = ev || event;
|
|||
|
|
oEvent.preventDefault();
|
|||
|
|
const prjdatas = toJS(ls.getJSONObj("prj_portal_datas"));
|
|||
|
|
const options = { menus: prjdatas, total: this.total };
|
|||
|
|
if (oEvent.target.value.length > 0) {
|
|||
|
|
let searchListDatas = { menus: [] };
|
|||
|
|
options.menus.map((m, index) => {
|
|||
|
|
let ff = m.datas.filter(i =>
|
|||
|
|
i.name.includes(oEvent.target.value)
|
|||
|
|
)
|
|||
|
|
searchListDatas.menus[index] = { showname: m.showname, datas: ff, key: m.key };
|
|||
|
|
}
|
|||
|
|
)
|
|||
|
|
searchListDatas = Object.assign({ ...searchListDatas }, { total: this.total });
|
|||
|
|
this.setState({ options: searchListDatas })
|
|||
|
|
} else {
|
|||
|
|
this.setState({ options });
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
_clearFun = () => {
|
|||
|
|
const prjdatas = toJS(ls.getJSONObj("prj_portal_datas"));
|
|||
|
|
const options = { menus: prjdatas, total: this.total };
|
|||
|
|
this.setState({ options });
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|