From 5b66fe77e55767eabbf1df66a026157356dd807d Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期六, 07 一月 2023 17:28:28 +0800 Subject: [PATCH] 2023-01-07 --- src/views/appmanage/submutilform/index.jsx | 218 +++++++++++++++++++++++++++++++----------------------- 1 files changed, 125 insertions(+), 93 deletions(-) diff --git a/src/views/appmanage/submutilform/index.jsx b/src/views/appmanage/submutilform/index.jsx index ac533bf..9c4cb9c 100644 --- a/src/views/appmanage/submutilform/index.jsx +++ b/src/views/appmanage/submutilform/index.jsx @@ -1,6 +1,6 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import { Form, Row, Col, Select, Radio, Input, Tooltip, notification, InputNumber, Checkbox } from 'antd' +import { Form, Row, Col, Select, Radio, Input, Tooltip, InputNumber, Checkbox } from 'antd' import { QuestionCircleOutlined } from '@ant-design/icons' import asyncComponent from '@/utils/asyncComponent' @@ -16,26 +16,29 @@ inputSubmit: PropTypes.func // input鍥炶溅鎻愪氦 } - state = {msgs: [], typename: 'mob', user_binding: [], adapters: []} + state = {typename: 'mob', adapters: [], exts: []} UNSAFE_componentWillMount() { const { card } = this.props - let msgs = sessionStorage.getItem('msgTemplate') - let user_binding = [] let adapters = [] + let exts = [] let typename = 'mob' if (card) { typename = card.typename || 'mob' - user_binding = card.user_binding ? card.user_binding.split(',') : [] adapters = card.adapter ? card.adapter.split(',') : [] - if (!adapters.includes('weixin') && !adapters.includes('wxmini')) { - user_binding = [] + if (typename !== 'pc') { + if (card.user_binding === 'true') { + exts.push('user_binding') + } + if (card.share === 'true') { + exts.push('share') + } } } - this.setState({msgs: JSON.parse(msgs), typename, user_binding, adapters}) + this.setState({typename, adapters, exts}) } /** @@ -45,31 +48,25 @@ return new Promise(resolve => { this.props.form.validateFieldsAndScroll((err, values) => { if (!err) { - values.user_binding = values.user_binding ? values.user_binding.join(',') : '' values.adapter = values.adapter ? values.adapter.join(',') : '' - if (values.user_binding.indexOf('sms_vcode') > -1 && !values.sms_id) { - notification.warning({ - top: 92, - message: '鎵嬫満鍙风粦瀹氭椂锛岄渶瑕佺煭淇℃ā鏉匡紒', - duration: 5 - }) - return + + if (values.exts) { + values.user_binding = values.exts.includes('user_binding') ? 'true' : 'false' + values.share = values.exts.includes('share') ? 'true' : 'false' + delete values.exts } + resolve(values) } }) }) } - onChange = (vals) => { - this.setState({user_binding: vals}) - } - onAdapterChange = (vals) => { - this.setState({adapters: vals}) if (!vals.includes('weixin') && !vals.includes('wxmini')) { - this.setState({user_binding: []}) + this.setState({exts: []}) } + this.setState({adapters: vals}) } /** @@ -83,7 +80,7 @@ render() { const { card, type } = this.props const { getFieldDecorator } = this.props.form - const { msgs, typename, user_binding, adapters } = this.state + const { typename, adapters, exts } = this.state const formItemLayout = { labelCol: { xs: { span: 24 }, @@ -141,20 +138,21 @@ initialValue: card ? card.css : 'bg_black_style_blue' })( <Select> - <Select.Option value="bg_black_style_blue">钃濊壊</Select.Option> - <Select.Option value="bg_black_style_red">绾㈣壊</Select.Option> - <Select.Option value="bg_black_style_orange_red">姗欑孩鑹�</Select.Option> - <Select.Option value="bg_black_style_orange">姗欒壊</Select.Option> - <Select.Option value="bg_black_style_orange_yellow">姗欓粍鑹�</Select.Option> - <Select.Option value="bg_black_style_yellow">榛勮壊</Select.Option> - <Select.Option value="bg_black_style_yellow_green">榛勭豢鑹�</Select.Option> - <Select.Option value="bg_black_style_green">缁胯壊</Select.Option> - <Select.Option value="bg_black_style_cyan">闈掕壊</Select.Option> - <Select.Option value="bg_black_style_blue_purple">钃濈传鑹�</Select.Option> - <Select.Option value="bg_black_style_purple">绱壊</Select.Option> - <Select.Option value="bg_black_style_magenta">娲嬬孩鑹�</Select.Option> - <Select.Option value="bg_black_style_grass_green">鑽夌豢鑹�</Select.Option> - <Select.Option value="bg_black_style_deep_red">娣辩孩鑹�</Select.Option> + <Select.Option value="bg_black_style_blue"><span className="color-block" style={{background: '#1890ff'}}></span>钃濊壊锛�#1890ff锛�</Select.Option> + <Select.Option value="bg_black_style_red"><span className="color-block" style={{background: '#f5222d'}}></span>绾㈣壊锛�#f5222d锛�</Select.Option> + <Select.Option value="bg_black_style_orange_red"><span className="color-block" style={{background: '#fa541c'}}></span>姗欑孩鑹诧紙#fa541c锛�</Select.Option> + <Select.Option value="bg_black_style_orange"><span className="color-block" style={{background: '#fa8c16'}}></span>姗欒壊锛�#fa8c16锛�</Select.Option> + <Select.Option value="bg_black_style_orange_yellow"><span className="color-block" style={{background: '#faad14'}}></span>姗欓粍鑹诧紙#faad14锛�</Select.Option> + <Select.Option value="bg_black_style_yellow"><span className="color-block" style={{background: '#fadb14'}}></span>榛勮壊锛�#fadb14锛�</Select.Option> + <Select.Option value="bg_black_style_yellow_green"><span className="color-block" style={{background: '#a0d911'}}></span>榛勭豢鑹诧紙#a0d911锛�</Select.Option> + <Select.Option value="bg_black_style_green"><span className="color-block" style={{background: '#52c41a'}}></span>缁胯壊锛�#52c41a锛�</Select.Option> + <Select.Option value="bg_black_style_cyan"><span className="color-block" style={{background: '#13c2c2'}}></span>闈掕壊锛�#13c2c2锛�</Select.Option> + <Select.Option value="bg_black_style_blue_purple"><span className="color-block" style={{background: '#2f54eb'}}></span>钃濈传鑹诧紙#2f54eb锛�</Select.Option> + <Select.Option value="bg_black_style_purple"><span className="color-block" style={{background: '#722ed1'}}></span>绱壊锛�#722ed1锛�</Select.Option> + <Select.Option value="bg_black_style_magenta"><span className="color-block" style={{background: '#eb2f96'}}></span>娲嬬孩鑹诧紙#eb2f96锛�</Select.Option> + <Select.Option value="bg_black_style_grass_green"><span className="color-block" style={{background: '#aeb303'}}></span>鑽夌豢鑹诧紙#aeb303锛�</Select.Option> + <Select.Option value="bg_black_style_deep_red"><span className="color-block" style={{background: '#c32539'}}></span>娣辩孩鑹诧紙#c32539锛�</Select.Option> + <Select.Option value="bg_black_style_deep_blue"><span className="color-block" style={{background: '#1d3661'}}></span>娣辫摑鑹诧紙#1d3661锛�</Select.Option> </Select> )} </Form.Item> @@ -173,46 +171,89 @@ </Form.Item> </Col> : null} {typename !== 'pc' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={12}> - <Form.Item label="鐢ㄦ埛缁戝畾"> - {getFieldDecorator('user_binding', { - initialValue: user_binding + <Form.Item label={ + <Tooltip placement="topLeft" title="鍦ㄥ叕浼楀彿鎴栧皬绋嬪簭涓紝鍙坊鍔犵粦瀹氱郴缁熺敤鎴枫�佽嚜瀹氫箟鍒嗕韩绛夊姛鑳斤紝鑷畾涔夊垎浜缃悗锛屽綋鍓嶅瓙搴旂敤灏嗛粯璁や娇鐢ㄦ鍒嗕韩閾炬帴銆�"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鎵╁睍鍔熻兘 + </Tooltip> + }> + {getFieldDecorator('exts', { + initialValue: exts })( - <Checkbox.Group onChange={this.onChange}> - <Checkbox value="uname_pwd">璐﹀彿</Checkbox> - <Checkbox value="sms_vcode">鎵嬫満鐭俊</Checkbox> + <Checkbox.Group onChange={(vals) => this.setState({exts: vals})}> + <Checkbox value="user_binding">鐢ㄦ埛缁戝畾</Checkbox> + <Checkbox value="share">鍒嗕韩</Checkbox> </Checkbox.Group> )} </Form.Item> </Col> : null} - {typename !== 'pc' && user_binding.includes('sms_vcode') ? <Col span={12}> - <Form.Item label={ - <Tooltip placement="topLeft" title="鐭俊妯℃澘鍙湪 浜戠郴缁�->搴旂敤鏈嶅姟->寮�鍙戣�呬腑蹇�->鐭俊妯℃澘 澶勬坊鍔犮��"> - <QuestionCircleOutlined className="mk-form-tip" /> - 鐭俊妯℃澘 - </Tooltip> - }> - {getFieldDecorator('sms_id', { - initialValue: card ? card.sms_id || '' : '', - rules: [{ - required: true, - message: '浣跨敤鎵嬫満鐭俊鏃惰閫夋嫨鐭俊妯℃澘!' - }] + {/* {typename !== 'pc' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={12}> + <Form.Item label="鐢ㄦ埛缁戝畾"> + {getFieldDecorator('user_binding', { + initialValue: card ? card.user_binding : 'false' })( - <Select allowClear> - {msgs.map(option => - <Select.Option key={option.ID} value={option.ID}>{option.SignName + ' - ' + option.TemplateCode}</Select.Option> - )} - </Select> + <Radio.Group> + <Radio value="true">闇�瑕�</Radio> + <Radio value="false">涓嶉渶瑕�</Radio> + </Radio.Group> )} </Form.Item> - </Col> : null} + </Col> : null} */} <Col span={12}> - <Form.Item label="鏍囬"> + <Form.Item label={ + exts.includes('share') ? + <Tooltip placement="topLeft" title="瀛愬簲鐢ㄥ強鍒嗕韩鏃剁殑鏍囬銆�"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鏍囬 + </Tooltip> : '鏍囬' + }> {getFieldDecorator('title', { - initialValue: card ? card.title || '' : '' + initialValue: card ? card.title || '' : '', + rules: exts.includes('share') ? [{ + required: true, + message: '璇峰~鍐欐爣棰�!' + }] : [] })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} </Form.Item> </Col> + {exts.includes('share') ? <Col span={12}> + <Form.Item label={ + <Tooltip placement="topLeft" title="鍒嗕韩鏃剁殑鎻忚堪淇℃伅銆�"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鍒嗕韩鎻忚堪 + </Tooltip> + }> + {getFieldDecorator('share_des', { + initialValue: card ? card.share_des || '' : '' + })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} + </Form.Item> + </Col> : null} + {exts.includes('share') ? <Col span={12}> + <Form.Item label="鍒嗕韩鍥剧墖"> + {getFieldDecorator('share_url', { + initialValue: card ? card.share_url : '' + })( + <SourceComponent type="picture" placement="right"/> + )} + </Form.Item> + </Col> : null} + {exts.includes('share') ? <Col span={12}> + <Form.Item label={ + <Tooltip placement="topLeft" title="鍒嗕韩鐨勯摼鎺ヤ负鐢ㄦ埛娴忚鐨勯〉闈㈠湴鍧�鎴栧綋鍓嶅簲鐢ㄧ殑鍏ュ彛鍦板潃銆傛敞锛氬彲鍦ㄩ〉闈腑鑷畾涔夎缃��"> + <QuestionCircleOutlined className="mk-form-tip" /> + 鍒嗕韩閾炬帴 + </Tooltip> + }> + {getFieldDecorator('share_link', { + initialValue: card ? card.share_link || 'main' : 'main' + })( + <Radio.Group> + <Radio value="main">搴旂敤鍏ュ彛</Radio> + <Radio value="view">椤甸潰閾炬帴</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> : null} <Col span={12}> <Form.Item label="缃戠珯澶村儚"> {getFieldDecorator('favicon', { @@ -222,35 +263,9 @@ )} </Form.Item> </Col> - {typename !== 'pc' && user_binding.length > 0 ? <Col span={12}> - <Form.Item label={ - <Tooltip placement="topLeft" title="浣跨敤寰俊鎺堟潈鐧诲綍鏃讹紝缁戝畾鐢ㄦ埛椤甸潰鐨勭増鏉冨0鏄庯紝娉細鍙坊鍔爃tml鏍囩銆�"> - <QuestionCircleOutlined className="mk-form-tip" /> - 鐗堟潈 - </Tooltip> - }> - {getFieldDecorator('copyright', { - initialValue: card ? card.copyright || '' : '' - })(<Input placeholder="" autoComplete="off" onPressEnter={this.handleSubmit} />)} - </Form.Item> - </Col> : null} - {typename !== 'pc' && user_binding.length > 0 ? <Col span={12}> - <Form.Item label={ - <Tooltip placement="topLeft" title="浣跨敤寰俊鎺堟潈鐧诲綍鏃讹紝缁戝畾鐢ㄦ埛椤甸潰鐨凩OGO銆�"> - <QuestionCircleOutlined className="mk-form-tip" /> - LOGO - </Tooltip> - }> - {getFieldDecorator('logo', { - initialValue: card ? card.logo : '' - })( - <SourceComponent type="picture" placement="right"/> - )} - </Form.Item> - </Col> : null} {typename !== 'pc' && adapters.includes('app') ? <Col span={12}> <Form.Item label={ - <Tooltip placement="topLeft" title="鍦ㄤ娇鐢ㄦ槑绉戜簯APP鏃讹紝椤甸潰鐨勫垏鎹㈡ā寮�"> + <Tooltip placement="topLeft" title="鍦ㄤ娇鐢ㄦ槑绉戜簯APP鏃讹紝椤甸潰鐨勫垏鎹㈡ā寮忋�傛敞锛氳嫻鏋淎PP鏆備笉鏀寔H5妯″紡銆�"> <QuestionCircleOutlined className="mk-form-tip" /> 搴旂敤妯″紡 </Tooltip> @@ -273,7 +288,7 @@ </Tooltip> }> {getFieldDecorator('delay', { - initialValue: card ? card.delay || 0 : 0 + initialValue: card ? card.delay || 0 : 200 })(<InputNumber min={0} max={5000} precision={0} onPressEnter={this.handleSubmit}/>)} </Form.Item> </Col> : null} @@ -304,10 +319,27 @@ {getFieldDecorator('sysBgColor', { initialValue: card ? card.sysBgColor || '#ffffff' : '#ffffff' })( - <ColorSketch value={card ? card.sysBgColor || '#ffffff' : '#ffffff'}/> + <ColorSketch/> )} </Form.Item> </Col> + {typename === 'pad' ? <Col span={12}> + <Form.Item label={ + <Tooltip placement="topLeft" title="绯荤粺榛樿灞忓箷鏂瑰悜锛屽崟涓〉闈㈡柟鍚戣鍦ㄩ〉闈腑閰嶇疆銆�"> + <QuestionCircleOutlined className="mk-form-tip" /> + 灞忓箷鏂瑰悜 + </Tooltip> + }> + {getFieldDecorator('direction', { + initialValue: card ? card.direction || 'vertical' : 'vertical' + })( + <Radio.Group> + <Radio value="vertical">绔栧睆</Radio> + <Radio value="horizontal">妯睆</Radio> + </Radio.Group> + )} + </Form.Item> + </Col> : null} </Row> </Form> ) -- Gitblit v1.8.0