| | |
| | | |
| | | class CustomMenuForm extends Component { |
| | | static propTpyes = { |
| | | dict: PropTypes.object, // 字典项 |
| | | config: PropTypes.object, |
| | | MenuId: PropTypes.string, |
| | | adapters: PropTypes.array, |
| | | updateConfig: PropTypes.func |
| | | } |
| | | |
| | | state = {} |
| | | |
| | | // 一二级菜单切换 |
| | | selectChange = (key, value) => { |
| | | const { config } = this.props |
| | | selectChange = (key, value, hex) => { |
| | | let _config = {...this.props.config, [key]: value} |
| | | |
| | | if (key === 'cacheUseful') { |
| | | this.props.updateConfig({...config, cacheUseful: value}) |
| | | } else if (key === 'timeUnit') { |
| | | this.props.updateConfig({...config, timeUnit: value}) |
| | | } else if (key === 'advertUrl') { |
| | | this.props.updateConfig({...config, advertUrl: value}) |
| | | } else if (key === 'advertTime') { |
| | | this.props.updateConfig({...config, advertTime: value}) |
| | | } else if (key === 'pullRefresh') { |
| | | this.props.updateConfig({...config, pullRefresh: value}) |
| | | } else if (key === 'statusBarbgColor') { |
| | | this.props.updateConfig({...config, statusBarbgColor: value}) |
| | | if (key === 'statusBarbgColor' && hex) { |
| | | _config.statusBarHexColor = hex |
| | | } |
| | | |
| | | this.props.updateConfig(_config) |
| | | } |
| | | |
| | | // 菜单名称 |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { dict, config } = this.props |
| | | const { config, adapters } = this.props |
| | | const { getFieldDecorator } = this.props.form |
| | | const formItemLayout = { |
| | | labelCol: { |
| | |
| | | <Form {...formItemLayout} className="custom-menu-form"> |
| | | <Row> |
| | | <Col span={24}> |
| | | <Form.Item label={dict['mob.menu'] + dict['mob.name']}> |
| | | <Form.Item label="菜单名称"> |
| | | {getFieldDecorator('MenuName', { |
| | | initialValue: config.MenuName, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.name'] + '!' |
| | | message: '请输入菜单名称!' |
| | | } |
| | | ] |
| | | })(<Input placeholder="" autoComplete="off" onChange={this.changeName}/>)} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={24}> |
| | | <Form.Item label={dict['mob.menu'] + dict['mob.param']}> |
| | | <Form.Item label="菜单参数"> |
| | | {getFieldDecorator('MenuNo', { |
| | | initialValue: config.MenuNo, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.param'] + '!' |
| | | message: '请输入菜单参数!' |
| | | } |
| | | ] |
| | | })(<Input placeholder="" autoComplete="off" onChange={this.changeNo}/>)} |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={24}> |
| | | {/* <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="跳过权限验证时,页面中组件及按钮不在进行权限控制。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('permission', { |
| | | initialValue: config.permission || 'true' |
| | | initialValue: config.permission || 'false' |
| | | })( |
| | | <Radio.Group onChange={(e) => {this.selectChange('permission', e.target.value)}}> |
| | | <Radio value="true">使用</Radio> |
| | |
| | | </Radio.Group> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | </Col> */} |
| | | <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="使用登录验证后,用户必须登录系统后才可以访问,注:含有登录组件的页面中无效。"> |
| | |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: dict['mob.required.input'] + '时长!' |
| | | message: '请输入时长!' |
| | | } |
| | | ] |
| | | })( |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="在明科云APP中有效。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 广告页 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('advertUrl', { |
| | | initialValue: config.advertUrl || '' |
| | | })( |
| | | <SourceComponent type="picture" placement="right" onChange={(val) => {this.selectChange('advertUrl', val)}}/> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={24}> |
| | | <Form.Item label="下拉刷新"> |
| | | {getFieldDecorator('pullRefresh', { |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | <Col span={24}> |
| | | {adapters.includes('app') || adapters.includes('wxmini') ? <Col span={24}> |
| | | <Form.Item className="status-bar" label={ |
| | | <Tooltip placement="topLeft" title="在明科云APP中,状态栏的背景色。"> |
| | | <Tooltip placement="topLeft" title="在明科云APP或小程序中,状态栏的背景色。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 状态栏 |
| | | 状态栏背景 |
| | | </Tooltip> |
| | | }> |
| | | <ColorSketch value={config.statusBarbgColor || '#ffffff'} onChange={(val) => {this.selectChange('statusBarbgColor', val)}} /> |
| | | <ColorSketch value={config.statusBarbgColor || '#ffffff'} onChange={(val, hex) => {this.selectChange('statusBarbgColor', val, hex)}} /> |
| | | </Form.Item> |
| | | </Col> |
| | | {config.advertUrl ? <Col span={24}> |
| | | <Form.Item label="停留(s)"> |
| | | </Col> : null} |
| | | {adapters.includes('wxmini') ? <Col span={24}> |
| | | <Form.Item className="status-bar-color" label={ |
| | | <Tooltip placement="topLeft" title="在使用小程序时,状态栏的字体颜色。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 状态栏字体 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('statusBarColor', { |
| | | initialValue: config.statusBarColor || 'black' |
| | | })( |
| | | <Radio.Group onChange={(e) => {this.selectChange('statusBarColor', e.target.value)}}> |
| | | <Radio value="black">黑色</Radio> |
| | | <Radio value="white">白色</Radio> |
| | | </Radio.Group> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {adapters.includes('app') ? <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="在明科云APP中有效。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 广告页 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('advertUrl', { |
| | | initialValue: config.advertUrl || '' |
| | | })( |
| | | <SourceComponent type="picture" placement="right" onChange={(val) => {this.selectChange('advertUrl', val)}}/> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {adapters.includes('app') && config.advertUrl ? <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="广告页的停留时间。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 停留(s) |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('advertTime', { |
| | | initialValue: config.advertTime || 3, |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: dict['mob.required.input'] + '停留时间!' |
| | | message: '请输入停留时间!' |
| | | } |
| | | ] |
| | | })( |
| | |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {adapters.includes('weixin') || adapters.includes('wxmini') ? <Col span={24}> |
| | | <Form.Item label={ |
| | | <Tooltip placement="topLeft" title="使用默认时请在子应用设置分享信息,使用url参数会使用上页参数替换相应字段(@field@)。注:使用自定义或url参数时会分享当前页面。"> |
| | | <QuestionCircleOutlined className="mk-form-tip" /> |
| | | 分享 |
| | | </Tooltip> |
| | | }> |
| | | {getFieldDecorator('share', { |
| | | initialValue: config.share || 'default' |
| | | })( |
| | | <Radio.Group className="mini-radio" onChange={(e) => {this.selectChange('share', e.target.value)}}> |
| | | <Radio value="default">默认</Radio> |
| | | <Radio value="custom">自定义</Radio> |
| | | <Radio value="url">url参数</Radio> |
| | | </Radio.Group> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {['custom', 'url'].includes(config.share) && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={24}> |
| | | <Form.Item label="分享标题"> |
| | | {getFieldDecorator('share_title', { |
| | | initialValue: config.share_title || '', |
| | | rules: [ |
| | | { |
| | | required: true, |
| | | message: '请输入分享标题!' |
| | | } |
| | | ] |
| | | })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('share_title', e.target.value)}}/>)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {['custom', 'url'].includes(config.share) && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={24}> |
| | | <Form.Item label="分享描述"> |
| | | {getFieldDecorator('share_des', { |
| | | initialValue: config.share_des || '' |
| | | })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('share_des', e.target.value)}}/>)} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {config.share === 'custom' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={24}> |
| | | <Form.Item label="分享图片"> |
| | | {getFieldDecorator('share_url', { |
| | | initialValue: config.share_url || '' |
| | | })( |
| | | <SourceComponent type="picture" placement="right" onChange={(val) => {this.selectChange('share_url', val)}}/> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | {config.share === 'url' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={24}> |
| | | <Form.Item label="分享图片"> |
| | | {getFieldDecorator('share_url', { |
| | | initialValue: config.share_url || '' |
| | | })( |
| | | <Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('share_url', e.target.value)}}/> |
| | | )} |
| | | </Form.Item> |
| | | </Col> : null} |
| | | <Col span={24}> |
| | | <Form.Item label="备注"> |
| | | {getFieldDecorator('Remark', { |