weaver_trunk_cli/pc4public/portal/wea-custom-setting/index.js

84 lines
4.8 KiB
JavaScript

import React from 'react';
import { inject, observer } from 'mobx-react';
import { Button, Row, Col, Spin } from 'antd';
import { WeaTools, WeaLocaleProvider, WeaErrorPage, WeaSearchGroup, WeaFormItem, WeaCheckbox } from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import { PortalSetting } from 'weaPortal';
import PortalMenu from '../wea-portalmenu/';
import './style/';
class SettingButton extends React.Component {
render() {
return (
<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@fcu65c`} label={this.props.label} labelCol={{ span: 10 }} wrapperCol={{ span: 14 }}>
<div className="wea-custom-setting-btn" onClick={this.props.onSetting}>
<i className="icon-coms-Flow-setting" />
</div>
</WeaFormItem>
);
}
}
class SwitchButton extends React.Component {
render() {
return (
<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@clcuh5`} label={this.props.label} labelCol={{ span: 10 }} wrapperCol={{ span: 14 }}>
<WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@3zlrjr`} display="switch" value={this.props.value} onChange={value => this.props.onSetState(value)} />
</WeaFormItem>
);
}
}
@inject('weaportal_customsetting_store')
@observer
class WeaCustomSetting extends React.Component {
constructor(props) {
super(props);
this.onPortalSetting = this.onPortalSetting.bind(this);
}
componentWillMount() {
const { weaportal_customsetting_store } = this.props;
weaportal_customsetting_store.getPortalData();
}
onPortalSetting(params) {
this.refs.portalsetting.handleOnSetting({
from: 'addElement',
viewtype: 'edit',
isSetting: true,
...params,
});
}
render() {
const { weaportal_customsetting_store } = this.props;
const { state, onSetState } = weaportal_customsetting_store;
const { loading, isRemeberTab, isOpenSortTopByUsage, isSortTopByUsage, quickSearchShowMenu, hplist } = state;
return (
<div>
<PortalSetting ecId={`${this && this.props && this.props.ecId || ''}_PortalSetting@3mt0di`} ref="portalsetting" />
<PortalMenu ecId={`${this && this.props && this.props.ecId || ''}_PortalMenu@3acdej`} ref="portalmenu" />
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@ygz3re`} spinning={loading}>
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@bwjnwx`} title={getLabel(17721, '菜单自定义')} showGroup={true} center={true} size="large">
<SettingButton ecId={`${this && this.props && this.props.ecId || ''}_SettingButton@r6r7gc`} label={getLabel(33676, '后端菜单')} onSetting={() => this.refs.portalmenu.onShow({ type: 'top' })} />
<SettingButton ecId={`${this && this.props && this.props.ecId || ''}_SettingButton@cjc2qu`} label={getLabel(33675, '前端菜单')} onSetting={() => this.refs.portalmenu.onShow({ type: 'left' })} />
{isOpenSortTopByUsage == '1' ? <SwitchButton ecId={`${this && this.props && this.props.ecId || ''}_SwitchButton@j7dmtk`} label={getLabel(385974, '前端菜单按使用频率自动排序')} value={isSortTopByUsage} onSetState={value => onSetState({ isSortTopByUsage: value })} /> : ''}
<SwitchButton ecId={`${this && this.props && this.props.ecId || ''}_SwitchButton@bvy9dh`} label={getLabel(385975, '快捷搜索栏显示搜索推荐')} value={quickSearchShowMenu} onSetState={value => onSetState({ quickSearchShowMenu: value })} />
</WeaSearchGroup>
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@890kui`} title={getLabel(33434, '门户自定义')} showGroup={true} center={true} size="large">
{hplist.map(item => <SettingButton ecId={`${this && this.props && this.props.ecId || ''}_SettingButton@gj7x43@${item.hpid}`} label={item.title} onSetting={this.onPortalSetting.bind(this, item)} />)}
</WeaSearchGroup>
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@569v3y`} title={getLabel(126226, '元素设置')} showGroup={true} center={true} size="large">
<SwitchButton ecId={`${this && this.props && this.props.ecId || ''}_SwitchButton@zj3jdr`} label={getLabel(126225, '记录最后一次选中标签')} value={isRemeberTab} onSetState={value => onSetState({ isRemeberTab: value })} />
</WeaSearchGroup>
</Spin>
</div>
);
}
}
export default WeaCustomSetting;