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 |  315 +++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 239 insertions(+), 76 deletions(-)

diff --git a/src/views/appmanage/submutilform/index.jsx b/src/views/appmanage/submutilform/index.jsx
index 611f749..9c4cb9c 100644
--- a/src/views/appmanage/submutilform/index.jsx
+++ b/src/views/appmanage/submutilform/index.jsx
@@ -1,11 +1,13 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
-import { Form, Row, Col, Select, Radio, Input } 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'
 import './index.scss'
 
-const FileUpload = asyncComponent(() => import('@/tabviews/zshare/fileupload'))
+const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))
+const SourceComponent = asyncComponent(() => import('@/menu/components/share/sourcecomponent'))
 
 class MainSearch extends Component {
   static propTpyes = {
@@ -14,7 +16,30 @@
     inputSubmit: PropTypes.func  // input鍥炶溅鎻愪氦
   }
 
-  state = {}
+  state = {typename: 'mob', adapters: [], exts: []}
+
+  UNSAFE_componentWillMount() {
+    const { card } = this.props
+    let adapters = []
+    let exts = []
+    let typename = 'mob'
+
+    if (card) {
+      typename = card.typename || 'mob'
+      adapters = card.adapter ? card.adapter.split(',') : []
+
+      if (typename !== 'pc') {
+        if (card.user_binding === 'true') {
+          exts.push('user_binding')
+        }
+        if (card.share === 'true') {
+          exts.push('share')
+        }
+      }
+    }
+
+    this.setState({typename, adapters, exts})
+  }
 
   /**
    * @description 鑾峰彇琛ㄥ崟鍊�
@@ -23,10 +48,25 @@
     return new Promise(resolve => {
       this.props.form.validateFieldsAndScroll((err, values) => {
         if (!err) {
+          values.adapter = values.adapter ? values.adapter.join(',') : ''
+
+          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)
         }
       })
     })
+  }
+
+  onAdapterChange = (vals) => {
+    if (!vals.includes('weixin') && !vals.includes('wxmini')) {
+      this.setState({exts: []})
+    }
+    this.setState({adapters: vals})
   }
 
   /**
@@ -40,6 +80,7 @@
   render() {
     const { card, type } = this.props
     const { getFieldDecorator } = this.props.form
+    const { typename, adapters, exts } = this.state
     const formItemLayout = {
       labelCol: {
         xs: { span: 24 },
@@ -51,22 +92,17 @@
       }
     }
 
-    let file = ''
-
-    if (type === 'edit' && card && card.favicon) {
-      file = card.favicon
-    }
-
     return (
-      <Form {...formItemLayout} className="mob-card-edit-form">
+      <Form {...formItemLayout} className="sub-app-edit-form">
         <Row gutter={24}>
           <Col span={12}>
             <Form.Item label="搴旂敤绫诲瀷">
               {getFieldDecorator('typename', {
-                initialValue: card ? card.typename : 'mob'
+                initialValue: typename
               })(
-                <Select disabled={type === 'edit'}>
-                  <Select.Option value="mob">绉诲姩绔�(鍖呮嫭android銆乮os)</Select.Option>
+                <Select disabled={type === 'edit'} onChange={(val) => this.setState({typename: val})}>
+                  <Select.Option value="mob">绉诲姩绔�</Select.Option>
+                  <Select.Option value="pad">Pad绔�</Select.Option>
                   <Select.Option value="pc">PC绔�</Select.Option>
                 </Select>
               )}
@@ -85,33 +121,9 @@
             </Form.Item>
           </Col>
           <Col span={12}>
-            <Form.Item label="鐧诲綍">
-              {getFieldDecorator('login_types', {
-                initialValue: card ? card.login_types || 'true' : 'true'
-              })(
-                <Radio.Group>
-                  <Radio value="true">闇�瑕�</Radio>
-                  <Radio value="false">涓嶉渶瑕�</Radio>
-                </Radio.Group>
-              )}
-            </Form.Item>
-          </Col>
-          <Col span={12}>
             <Form.Item label="鏉冮檺绠＄悊">
               {getFieldDecorator('role_type', {
-                initialValue: card ? card.role_type || 'true' : 'true'
-              })(
-                <Radio.Group>
-                  <Radio value="true">鍚敤</Radio>
-                  <Radio value="false">涓嶅惎鐢�</Radio>
-                </Radio.Group>
-              )}
-            </Form.Item>
-          </Col>
-          <Col span={12}>
-            <Form.Item label="鐭繛鎺�">
-              {getFieldDecorator('link_type', {
-                initialValue: card ? card.link_type || 'true' : 'true'
+                initialValue: card ? card.role_type || 'false' : 'false'
               })(
                 <Radio.Group>
                   <Radio value="true">鍚敤</Radio>
@@ -126,57 +138,208 @@
                 initialValue: card ? card.css : 'bg_black_style_blue'
               })(
                 <Select>
-                  <Select.Option value="bg_black_style_blue">钃濋粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_blue">钃濈櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_red">绾㈤粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_red">绾㈢櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_orange_red">姗欑孩榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_orange_red">姗欑孩鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_orange">姗欓粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_orange">姗欑櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_orange_yellow">姗欓粍榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_orange_yellow">姗欓粍鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_yellow">榛勯粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_yellow">榛勭櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_yellow_green">榛勭豢榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_yellow_green">榛勭豢鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_green">缁块粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_green">缁跨櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_cyan">闈掗粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_cyan">闈掔櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_blue_purple">钃濈传榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_blue_purple">钃濈传鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_purple">绱粦鑹茬郴</Select.Option>
-                  <Select.Option value="bg_white_style_purple">绱櫧鑹茬郴</Select.Option>
-                  <Select.Option value="bg_black_style_magenta">娲嬬孩榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_magenta">娲嬬孩鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_grass_green">鑽夌豢榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_style_grass_green">鑽夌豢鐧借壊绯�</Select.Option>
-                  <Select.Option value="bg_black_style_deep_red">娣辩孩榛戣壊绯�</Select.Option>
-                  <Select.Option value="bg_white_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>
           </Col>
+          {typename !== 'pc' ? <Col span={12}>
+            <Form.Item label="閫傞厤">
+              {getFieldDecorator('adapter', {
+                initialValue: adapters
+              })(
+                <Checkbox.Group onChange={this.onAdapterChange}>
+                  <Checkbox value="app">app</Checkbox>
+                  <Checkbox value="weixin">鍏紬鍙�</Checkbox>
+                  <Checkbox value="wxmini">灏忕▼搴�</Checkbox>
+                </Checkbox.Group>
+              )}
+            </Form.Item>
+          </Col> : null}
+          {typename !== 'pc' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={12}>
+            <Form.Item label={
+              <Tooltip placement="topLeft" title="鍦ㄥ叕浼楀彿鎴栧皬绋嬪簭涓紝鍙坊鍔犵粦瀹氱郴缁熺敤鎴枫�佽嚜瀹氫箟鍒嗕韩绛夊姛鑳斤紝鑷畾涔夊垎浜缃悗锛屽綋鍓嶅瓙搴旂敤灏嗛粯璁や娇鐢ㄦ鍒嗕韩閾炬帴銆�">
+                <QuestionCircleOutlined className="mk-form-tip" />
+                鎵╁睍鍔熻兘
+              </Tooltip>
+            }>
+              {getFieldDecorator('exts', {
+                initialValue: exts
+              })(
+                <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' && (adapters.includes('weixin') || adapters.includes('wxmini')) ? <Col span={12}>
+            <Form.Item label="鐢ㄦ埛缁戝畾">
+              {getFieldDecorator('user_binding', {
+                initialValue: card ? card.user_binding : 'false'
+              })(
+                <Radio.Group>
+                  <Radio value="true">闇�瑕�</Radio>
+                  <Radio value="false">涓嶉渶瑕�</Radio>
+                </Radio.Group>
+              )}
+            </Form.Item>
+          </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="鍥炬爣">
+            <Form.Item label="缃戠珯澶村儚">
               {getFieldDecorator('favicon', {
-                initialValue: file
-              })(<FileUpload config={{
-                initval: file,
-                suffix: '.jpg,.png,.gif,.pjp,.pjpeg,.jpeg,.jfif,.webp,.ico',
-                maxfile: 1,
-                fileType: 'text'
-              }}/>)}
+                initialValue: card ? card.favicon : ''
+              })(
+                <SourceComponent type="picture" placement="right"/>
+              )}
             </Form.Item>
           </Col>
+          {typename !== 'pc' && adapters.includes('app') ? <Col span={12}>
+            <Form.Item label={
+              <Tooltip placement="topLeft" title="鍦ㄤ娇鐢ㄦ槑绉戜簯APP鏃讹紝椤甸潰鐨勫垏鎹㈡ā寮忋�傛敞锛氳嫻鏋淎PP鏆備笉鏀寔H5妯″紡銆�">
+                <QuestionCircleOutlined className="mk-form-tip" />
+                搴旂敤妯″紡
+              </Tooltip>
+            }>
+              {getFieldDecorator('apptype', {
+                initialValue: card ? card.apptype || 'H5' : 'H5'
+              })(
+                <Radio.Group>
+                  <Radio value="H5">H5</Radio>
+                  <Radio value="app">app</Radio>
+                </Radio.Group>
+              )}
+            </Form.Item>
+          </Col> : null}
+          {typename !== 'pc' ? <Col span={12}>
+            <Form.Item label={
+              <Tooltip placement="topLeft" title="鍦ㄤ娇鐢ㄥ皬绋嬪簭鎴栨槑绉戜簯APP鏃讹紙app妯″紡涓級鏃犳晥">
+                <QuestionCircleOutlined className="mk-form-tip" />
+                寤惰繜鍔犺浇(ms)
+              </Tooltip>
+            }>
+              {getFieldDecorator('delay', {
+                initialValue: card ? card.delay || 0 : 200
+              })(<InputNumber min={0} max={5000} precision={0} onPressEnter={this.handleSubmit}/>)}
+            </Form.Item>
+          </Col> : null}
+          {typename !== 'pc' && adapters.includes('app') ? <Col span={12}>
+            <Form.Item label={
+              <Tooltip placement="topLeft" title="鍦ㄤ娇鐢ㄦ槑绉戜簯APP鏃讹紝鐘舵�佹爮鐨勫瓧浣撻鑹层��">
+                <QuestionCircleOutlined className="mk-form-tip" />
+                鐘舵�佹爮
+              </Tooltip>
+            }>
+              {getFieldDecorator('statusBarColor', {
+                initialValue: card ? card.statusBarColor || 'black' : 'black'
+              })(
+                <Radio.Group>
+                  <Radio value="black">榛戣壊</Radio>
+                  <Radio value="white">鐧借壊</Radio>
+                </Radio.Group>
+              )}
+            </Form.Item>
+          </Col> : null}
+          <Col span={12}>
+            <Form.Item className="sys-bgcolor" label={
+              <Tooltip placement="topLeft" title="瀛愬簲鐢ㄩ�氱敤鐨勮儗鏅壊锛屽瓙搴旂敤椤甸潰鍒涘缓鏃朵細榛樿娣诲姞姝よ儗鏅壊銆�">
+                <QuestionCircleOutlined className="mk-form-tip" />
+                鑳屾櫙鑹�
+              </Tooltip>
+            }>
+              {getFieldDecorator('sysBgColor', {
+                initialValue: 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