From 2a3cc4e6cecfc6dab8b60adf93f7fde898ddc939 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期二, 25 七月 2023 16:36:23 +0800 Subject: [PATCH] 2023-07-25 --- src/views/mobdesign/menuform/index.jsx | 251 +++++++++++++++++++++++++++++++++++-------------- 1 files changed, 177 insertions(+), 74 deletions(-) diff --git a/src/views/mobdesign/menuform/index.jsx b/src/views/mobdesign/menuform/index.jsx index 97f4805..49d4013 100644 --- a/src/views/mobdesign/menuform/index.jsx +++ b/src/views/mobdesign/menuform/index.jsx @@ -12,56 +12,37 @@ 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 - - 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}) + selectChange = (key, value, hex) => { + if (key === 'cacheTime' || key === 'localCacheTime') { + if (typeof(value) !== 'number') { + value = '' + } } - } - // 鑿滃崟鍚嶇О - changeName = (e) => { - this.props.updateConfig({...this.props.config, MenuName: e.target.value}) - } + let _config = {...this.props.config, [key]: value} - // 鑿滃崟鍙傛暟 - changeNo = (e) => { - this.props.updateConfig({...this.props.config, MenuNo: e.target.value}) - } - - changeRemark = (e) => { - this.props.updateConfig({...this.props.config, Remark: e.target.value}) - } - - changeCacheDay = (val) => { - if (typeof(val) !== 'number') { - val = '' + if (key === 'statusBarbgColor') { // 灏忕▼搴忕姸鎬佹爮 + if (hex) { + _config.statusBarHexColor = hex + } else { + delete _config.statusBarHexColor + } } - this.props.updateConfig({...this.props.config, cacheTime: val}) + + this.props.updateConfig(_config) } render() { - const { dict, config } = this.props + const { config, adapters } = this.props const { getFieldDecorator } = this.props.form const formItemLayout = { labelCol: { @@ -78,36 +59,67 @@ <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}/>)} + })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('MenuName', e.target.value)}}/>)} </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}/>)} + })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('MenuNo', e.target.value)}}/>)} </Form.Item> </Col> <Col span={24}> <Form.Item label={ + <Tooltip placement="topLeft" title="鏁版嵁浼氱紦瀛樺埌鐢ㄦ埛鏈湴锛屾柟渚块〉闈㈠揩閫熷憟鐜般��"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鏈湴缂撳瓨 + </Tooltip> + }> + {getFieldDecorator('cacheLocal', { + initialValue: config.cacheLocal || 'false' + })( + <Radio.Group onChange={(e) => {this.selectChange('cacheLocal', e.target.value)}}> + <Radio value="true">浣跨敤</Radio> + <Radio value="false">涓嶄娇鐢�</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> + {config.cacheLocal === 'true' ? <Col span={24}> + <Form.Item label={ + <Tooltip placement="topLeft" title="璁剧疆鏈湴缂撳瓨鏃堕暱鍚庯紝鍦ㄧ紦瀛樻湡闄愬唴涓嶅悜鍚庡彴璇锋眰鏁版嵁锛屾椂闀挎渶澶т负5澶╋紙鍗�7200鍒嗛挓锛夈�傛敞锛氭椂闀夸负绌烘椂缂撳瓨鏁版嵁鍙敤浜庨〉闈㈠揩閫熷憟鐜帮紝涓嶅奖鍝嶆帴鍙h姹傘��"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鏃堕暱(鍒�) + </Tooltip> + }> + {getFieldDecorator('localCacheTime', { + initialValue: config.localCacheTime + })( + <InputNumber min={1} max={7200} precision={0} onChange={(val) => {this.selectChange('localCacheTime', val)}}/> + )} + </Form.Item> + </Col> : null} + <Col span={24}> + <Form.Item label={ <Tooltip placement="topLeft" title="瀵逛簬涓嶇粡甯告�у彉鍔ㄧ殑淇℃伅锛岀紦瀛樻暟鎹湁鍔╀簬鎻愰珮鏌ヨ鏁堢巼銆�"> <QuestionCircleOutlined className="mk-form-tip" /> - 缂撳瓨鏁版嵁 + 鍚庣缂撳瓨 </Tooltip> }> {getFieldDecorator('cacheUseful', { @@ -120,7 +132,7 @@ )} </Form.Item> </Col> - <Col span={24}> + {/* <Col span={24}> <Form.Item label={ <Tooltip placement="topLeft" title="璺宠繃鏉冮檺楠岃瘉鏃讹紝椤甸潰涓粍浠跺強鎸夐挳涓嶅湪杩涜鏉冮檺鎺у埗銆�"> <QuestionCircleOutlined className="mk-form-tip" /> @@ -128,7 +140,7 @@ </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> @@ -136,7 +148,7 @@ </Radio.Group> )} </Form.Item> - </Col> + </Col> */} <Col span={24}> <Form.Item label={ <Tooltip placement="topLeft" title="浣跨敤鐧诲綍楠岃瘉鍚庯紝鐢ㄦ埛蹇呴』鐧诲綍绯荤粺鍚庢墠鍙互璁块棶锛屾敞锛氬惈鏈夌櫥褰曠粍浠剁殑椤甸潰涓棤鏁堛��"> @@ -159,9 +171,10 @@ {getFieldDecorator('timeUnit', { initialValue: config.timeUnit || 'day' })( - <Radio.Group onChange={(e) => {this.selectChange('timeUnit', e.target.value)}}> + <Radio.Group style={{whiteSpace: 'nowrap'}} onChange={(e) => {this.selectChange('timeUnit', e.target.value)}}> <Radio value="day">澶�</Radio> <Radio value="hour">灏忔椂</Radio> + <Radio value="minute">鍒嗛挓</Radio> </Radio.Group> )} </Form.Item> @@ -173,28 +186,14 @@ rules: [ { required: true, - message: dict['mob.required.input'] + '鏃堕暱!' + message: '璇疯緭鍏ユ椂闀�!' } ] })( - <InputNumber min={1} max={config.timeUnit !== 'hour' ? 7 : 23} precision={0} onChange={this.changeCacheDay}/> + <InputNumber min={1} max={config.timeUnit === 'day' ? 7 : (config.timeUnit === 'hour' ? 23 : 59)} precision={0} onChange={(val) => {this.selectChange('cacheTime', val)}}/> )} </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', { @@ -208,23 +207,71 @@ </Form.Item> </Col> <Col span={24}> - <Form.Item className="status-bar" label={ - <Tooltip placement="topLeft" title="鍦ㄦ槑绉戜簯APP涓紝鐘舵�佹爮鐨勮儗鏅壊銆�"> - <QuestionCircleOutlined className="mk-form-tip" /> - 鐘舵�佹爮 - </Tooltip> - }> - <ColorSketch value={config.statusBarbgColor || '#ffffff'} onChange={(val) => {this.selectChange('statusBarbgColor', val)}} /> + <Form.Item label="灞忓箷鏂瑰悜"> + {getFieldDecorator('direction', { + initialValue: config.direction || 'vertical' + })( + <Radio.Group onChange={(e) => {this.selectChange('direction', e.target.value)}}> + <Radio value="vertical">绔栧睆</Radio> + <Radio value="horizontal">妯睆</Radio> + </Radio.Group> + )} </Form.Item> </Col> - {config.advertUrl ? <Col span={24}> - <Form.Item label="鍋滅暀(s)"> + {adapters.includes('app') || adapters.includes('wxmini') ? <Col span={24}> + <Form.Item className="status-bar" label={ + <Tooltip placement="topLeft" title="鍦ㄦ槑绉戜簯APP鎴栧皬绋嬪簭涓紝鐘舵�佹爮鐨勮儗鏅壊銆�"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鐘舵�佹爮鑳屾櫙 + </Tooltip> + }> + <ColorSketch value={config.statusBarbgColor || '#ffffff'} onChange={(val, hex) => {this.selectChange('statusBarbgColor', val, hex)}} /> + </Form.Item> + </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: '璇疯緭鍏ュ仠鐣欐椂闂�!' } ] })( @@ -232,7 +279,63 @@ )} </Form.Item> </Col> : null} - <Col span={24}> + {adapters.includes('weixin') || adapters.includes('wxmini') ? <Col span={24}> + <Form.Item label={ + <Tooltip placement="topLeft" title="浣跨敤榛樿鏃惰鍦ㄥ瓙搴旂敤璁剧疆鍒嗕韩淇℃伅锛屼娇鐢╱rl鍙傛暟浼氫娇鐢ㄤ笂椤靛弬鏁版浛鎹㈢浉搴斿瓧娈碉紙@field@锛夈�傛敞锛氫娇鐢ㄨ嚜瀹氫箟鎴杣rl鍙傛暟鏃朵細鍒嗕韩褰撳墠椤甸潰銆�"> + <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} className="red-font"> <Form.Item label="澶囨敞"> {getFieldDecorator('Remark', { initialValue: config.Remark || '', @@ -242,7 +345,7 @@ message: '澶囨敞鏈�澶�512涓瓧绗︼紒' } ] - })(<TextArea rows={2} placeholder={''} onChange={this.changeRemark} />)} + })(<TextArea rows={2} placeholder={''} onChange={(e) => {this.selectChange('Remark', e.target.value)}}/>)} </Form.Item> </Col> </Row> -- Gitblit v1.8.0