From 58826d6f4eab9f8c9acf9fa8696f60039c645cfe Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 20 八月 2024 18:18:00 +0800
Subject: [PATCH] 2024-08-20

---
 src/templates/sharecomponent/settingcomponent/settingform/index.jsx |  427 ++++++++++++++++++++++++++++++-----------------------
 1 files changed, 241 insertions(+), 186 deletions(-)

diff --git a/src/templates/sharecomponent/settingcomponent/settingform/index.jsx b/src/templates/sharecomponent/settingcomponent/settingform/index.jsx
index 3012249..ff665b9 100644
--- a/src/templates/sharecomponent/settingcomponent/settingform/index.jsx
+++ b/src/templates/sharecomponent/settingcomponent/settingform/index.jsx
@@ -1,36 +1,43 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { fromJS } from 'immutable'
-import { Form, notification, Modal, Spin, Tabs } from 'antd'
-import moment from 'moment'
+import { Form, notification, Modal, Spin, Tabs, Typography, Popconfirm, Button } from 'antd'
+import { CheckCircleOutlined, StopOutlined, SwapOutlined, DeleteOutlined, BorderOutlined } from '@ant-design/icons'
 
 import Api from '@/api'
 import Utils from '@/utils/utils.js'
+import { formatSearch, joinMainSearchkey } from '@/utils/utils-custom.js'
 import SettingUtils from './utils.jsx'
-import CustomScript from '@/templates/zshare/customscript'
+import asyncComponent from '@/utils/asyncComponent'
 import DataSource from './datasource'
+import MinView from '@/assets/img/minview.png'
 import './index.scss'
 
 const { TabPane } = Tabs
+const { Paragraph } = Typography
+const CodeMirror = asyncComponent(() => import('@/templates/zshare/codemirror'))
+const CustomScript = asyncComponent(() => import('@/templates/zshare/customscript'))
 
 class SettingForm extends Component {
   static propTpyes = {
-    dict: PropTypes.object,         // 瀛楀吀椤�
     menu: PropTypes.object,         // 鑿滃崟淇℃伅
     config: PropTypes.object,       // 椤甸潰閰嶇疆淇℃伅
-    permFuncField: PropTypes.array, // 鑷畾涔夊嚱鏁板彲鐢ㄥ瓧娈�
-    search: PropTypes.array         // 鎼滅储鏉′欢
+    search: PropTypes.array,        // 鎼滅储鏉′欢
+    updRecord: PropTypes.func
   }
 
   state = {
     formlist: [],
     btnloading: false,
     activeKey: 'setting',
-    search: '',
+    searches: [],
     arr_field: '',
-    regoptions: [],
     setting: null,
-    defaultSql: ''
+    defaultSql: '',
+    visible: false,
+    script: null,
+    scriptValue: '',
+    status: {}
   }
 
   UNSAFE_componentWillMount() {
@@ -70,120 +77,54 @@
       })
     }
 
-    // 鎼滅储鏉′欢锛屾鍒欐浛鎹�
-    let allSearch = Utils.initMainSearch(search)
-    allSearch = Utils.getAllSearchOptions(allSearch)
+    let status = fromJS(_setting).toJS()
 
-    // 鎼滅储鐨剋here鏉′欢
-    let _search = this.formatSearch(search)
-    _search = Utils.joinMainSearchkey(_search)
-
-    _search = _search.replace(/@\$@/ig, '')
-    _search = _search ? 'where ' + _search : ''
+    // if (window.GLOB.funcs && window.GLOB.funcs.length > 0) {
+    //   window.GLOB.funcs.forEach(m => {
+    //     let reg = new RegExp(`\\/\\*\\$ex@${m.func_code}-begin\\*\\/[\\s\\S]+\\/\\*@ex\\$-end\\*\\/`, 'ig')
+    //     _scripts.forEach(item => {
+    //       item.sql = item.sql.replace(reg, `$ex@${m.func_code}@ex$`)
+    //     })
+    //     if (_setting.dataresource) {
+    //       _setting.dataresource = _setting.dataresource.replace(reg, `$ex@${m.func_code}@ex$`)
+    //     }
+    //   })
+    // }
 
     this.setState({
       setting: _setting,
-      search: _search,
+      searches: formatSearch(search),
       arr_field: arr_field.join(','),
-      regoptions: allSearch,
       columns: columns,
-      scripts: _scripts
+      scripts: _scripts,
+      status
     })
   }
 
-  /**
-   * @description 鑾峰彇鍏ㄩ儴鎼滅储鏉′欢
-   * @param {Array} searches 鎼滅储鏉′欢鏁扮粍
-   */
-  formatSearch (searches) {
-    if (!searches || searches.length === 0) return []
-
-    let newsearches = []
-    searches.forEach(search => {
-      let item = {
-        key: search.field,
-        match: search.match,
-        type: search.type,
-        label: search.label,
-        value: search.initval,
-        required: search.required === 'true'
-      }
-      if (item.type === 'group') {
-        let copy = fromJS(item).toJS()
-        copy.key = search.datefield
-
-        item.value = search.initval && search.initval[0] ? search.initval[0] : '@$@'
-        item.match = '='
-        
-        copy.type = 'daterange'
-        copy.match = 'between'
-        copy.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
-
-        if (search.transfer === 'true') {
-          newsearches.push(item)
-        }
-        newsearches.push(copy)
-        return
-      } else if (item.type === 'date') {
-        item.value = moment().format('YYYY-MM-DD')
-      } else if (item.type === 'datemonth') {
-        item.value = moment().format('YYYY-MM')
-      } else if (item.type === 'dateweek') {
-        item.value = [moment().startOf('week').format('YYYY-MM-DD'), moment().endOf('week').format('YYYY-MM-DD')]
-      } else if (item.type === 'daterange') {
-        item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
-      } else if (item.type === 'multiselect') {
-        item.value = ['@$@']
-      } else {
-        item.value = '@$@'
-      }
-      newsearches.push(item)
-    })
-    
-    return newsearches
+  componentDidMount () {
+    this.props.updRecord(this.state.status)
   }
 
   handleConfirm = (trigger) => {
     const { activeKey, setting, scripts } = this.state
 
+    if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.scriptsForm.props.form.getFieldValue('sql'))) {
+      notification.warning({
+        top: 92,
+        message: '瀛樺湪鏈繚瀛樿剼鏈紝璇风偣鍑荤‘瀹氫繚瀛橈紝鎴栫偣鍑诲彇娑堟斁寮冧慨鏀癸紒',
+        duration: 5
+      })
+      return Promise.reject()
+    }
+
     if (trigger) {
       this.setState({loading: true})
     }
-
-    let _scripts = scripts.filter(script => script.status !== 'false')
 
     // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭�
     if (activeKey === 'setting') {
       return new Promise((resolve, reject) => {
         this.settingForm.handleConfirm().then(res => {
-          if (trigger === 'func' && res.interType !== 'inner') {
-            notification.warning({
-              top: 92,
-              message: '浣跨敤鍐呴儴鎺ュ彛锛屾墠鍙互鍒涘缓瀛樺偍杩囩▼锛�',
-              duration: 5
-            })
-            this.setState({loading: false})
-            reject()
-            return
-          } else if (trigger === 'interface' && res.interType !== 'system') {
-            notification.warning({
-              top: 92,
-              message: '浣跨敤绯荤粺鎺ュ彛鏃讹紝鎵嶅彲浠ュ垱寤烘帴鍙o紒',
-              duration: 5
-            })
-            this.setState({loading: false})
-            reject()
-            return
-          } else if (res.interType === 'system' && res.default === 'false' && _scripts.length === 0) {
-            notification.warning({
-              top: 92,
-              message: '涓嶆墽琛岄粯璁ql鏃讹紝璇锋坊鍔犺嚜瀹氫箟鑴氭湰锛�',
-              duration: 5
-            })
-            reject()
-            return
-          }
-
           this.setState({
             setting: res
           }, () => {
@@ -200,54 +141,27 @@
           reject()
         })
       })
-    } else {
+    } else if (activeKey === 'scripts') {
       return new Promise((resolve, reject) => {
-        let _loading = false
-        if (this.scriptsForm && this.scriptsForm.state.editItem) {
-          _loading = true
-        } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql')) {
-          _loading = true
-        }
-  
-        if (trigger === 'func' && setting.interType !== 'inner') {
-          notification.warning({
-            top: 92,
-            message: '浣跨敤鍐呴儴鎺ュ彛锛屾墠鍙互鍒涘缓瀛樺偍杩囩▼锛�',
-            duration: 5
-          })
+        this.sqlverify(() => {
+          this.setState({loading: false})
+          resolve({...setting, scripts})
+        }, () => {
           this.setState({loading: false})
           reject()
-        } else if (_loading) {
-          notification.warning({
-            top: 92,
-            message: '瀛樺湪鏈繚瀛樿剼鏈紝璇风偣鍑荤‘瀹氫繚瀛橈紝鎴栫偣鍑诲彇娑堟斁寮冧慨鏀癸紒',
-            duration: 5
-          })
-          this.setState({loading: false})
-          reject()
-        } else if (setting.interType === 'system' && setting.default === 'false' && _scripts.length === 0) {
-          notification.warning({
-            top: 92,
-            message: '涓嶆墽琛岄粯璁ql鏃讹紝璇锋坊鍔犺嚜瀹氫箟鑴氭湰锛�',
-            duration: 5
-          })
-          this.setState({loading: false})
-          reject()
-        } else {
-          this.sqlverify(() => {
-            this.setState({loading: false})
-            resolve({...setting, scripts})
-          }, () => {
-            this.setState({loading: false})
-            reject()
-          }, 'submit')
-        }
+        }, 'submit')
+      })
+    } else {
+      this.setState({loading: false})
+      return new Promise((resolve) => {
+        resolve({...setting, scripts})
       })
     }
   }
 
   sqlverify = (_resolve, _reject, type, uscripts) => {
-    const { setting, scripts, arr_field, regoptions, search } = this.state
+    const { config } = this.props
+    const { setting, scripts, arr_field, searches } = this.state
 
     if (setting.interType !== 'system') { // 涓嶄娇鐢ㄧ郴缁熸帴鍙f椂锛屼笉闇�瑕乻ql楠岃瘉
       _resolve()
@@ -266,16 +180,18 @@
     } else if (type === 'scripts' && _scripts.length === 0) {
       _resolve()
     } else { // type 涓� submit 銆� verify 锛屼互鍙婂叾浠栭渶瑕侀獙璇佺殑鍦烘櫙
-      let param = {
-        func: 's_debug_sql',
-        LText: SettingUtils.getDebugSql(setting, _scripts, arr_field, regoptions, search)
+      let r = SettingUtils.getDebugSql(setting, _scripts, arr_field, searches, config.urlFields)
+
+      if (r.errors) {
+        notification.warning({
+          top: 92,
+          message: r.errors,
+          duration: 5
+        })
       }
-      param.LText = Utils.formatOptions(param.LText)
-      param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
-      param.secretkey = Utils.encrypt(param.LText, param.timestamp)
       
-      Api.getLocalConfig(param).then(result => {
-        if (result.status) {
+      Api.sDebug(r.sql).then(result => {
+        if (result.status || result.ErrCode === '-2') {
           _resolve()
         } else {
           _reject()
@@ -289,28 +205,29 @@
 
   // 鏍囩鍒囨崲
   changeTab = (val) => {
-    const { activeKey, search, arr_field } = this.state
+    const { activeKey, searches, arr_field } = this.state
+
+    if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.scriptsForm.props.form.getFieldValue('sql'))) {
+      notification.warning({
+        top: 92,
+        message: '瀛樺湪鏈繚瀛樼殑鑴氭湰锛�',
+        duration: 5
+      })
+    }
 
     if (activeKey === 'setting') {
       let _defaultSql = ''
       this.settingForm.handleConfirm().then(res => {
-        if (res.interType !== 'system') {
-          notification.warning({
-            top: 92,
-            message: '浣跨敤绯荤粺鎺ュ彛鏃讹紝鎵嶅彲浠ヨ缃嚜瀹氫箟鑴氭湰锛�',
-            duration: 5
-          })
-          return
-        }
-
         if (res.dataresource) {
           let _dataresource = res.dataresource
+
+          let _search = joinMainSearchkey(searches)
 
           if (/\s/.test(_dataresource)) {
             _dataresource = '(' + _dataresource + ') tb'
           }
 
-          _defaultSql = `select top @pageSize@ ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by @orderBy@) as rows from ${_dataresource} ${search}) tmptable where rows > (@pageSize@ * (@pageIndex@ - 1)) order by tmptable.rows`
+          _defaultSql = `select top @pageSize@ ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by @orderBy@) as rows from ${_dataresource} ${_search}) tmptable where rows > (@pageSize@ * (@pageIndex@ - 1)) order by tmptable.rows`
         }
         
         this.setState({
@@ -325,28 +242,13 @@
             })
           }, () => {             // 楠岃瘉澶辫触
             this.setState({
+              activeKey: val,
               loading: false
             })
           }, activeKey)
         })
       })
     } else if (activeKey === 'scripts') {
-      let _loading = false
-      if (this.scriptsForm && this.scriptsForm.state.editItem) {
-        _loading = true
-      } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql')) {
-        _loading = true
-      }
-
-      if (_loading) {
-        notification.warning({
-          top: 92,
-          message: '瀛樺湪鏈繚瀛樿剼鏈紝璇风偣鍑荤‘瀹氫繚瀛橈紝鎴栫偣鍑诲彇娑堟斁寮冧慨鏀癸紒',
-          duration: 5
-        })
-        return
-      }
-    
       this.setState({loading: true})
       this.sqlverify(() => { // 楠岃瘉鎴愬姛
         this.setState({
@@ -355,9 +257,14 @@
         })
       }, () => {             // 楠岃瘉澶辫触
         this.setState({
+          activeKey: val,
           loading: false
         })
       }, activeKey)
+    } else {
+      this.setState({
+        activeKey: val
+      })
     }
   }
 
@@ -368,44 +275,192 @@
     })
   }
 
+  triggerConfirm = () => {
+    const { script, scriptValue, scripts } = this.state
+    let _scripts = fromJS(scripts).toJS()
+
+    if (!scriptValue) {
+      notification.warning({
+        top: 92,
+        message: '璇疯緭鍏ql!',
+        duration: 5
+      })
+      return
+    }
+
+    if (script) {
+      _scripts = _scripts.map(item => {
+        if (script.uuid === item.uuid) {
+          item.sql = scriptValue
+        }
+        return item
+      })
+    } else {
+      let _script = {
+        uuid: Utils.getuuid(),
+        sql: scriptValue,
+        $index: _scripts.length + 1,
+        status: 'true'
+      }
+
+      _scripts.push(_script)
+    }
+
+    this.setState({loading: true})
+
+    this.sqlverify(() => {this.setState({scripts: _scripts, script: null, scriptValue: '', loading: false})}, () => {this.setState({loading: false})}, 'verify', _scripts)
+  }
+
   // 鑷畾涔夎剼鏈洿鏂�
   scriptsUpdate = (scripts) => {
     this.setState({scripts})
   }
 
+  handleDelete = (item) => {
+    const { script, scripts } = this.state
+
+    if (script && script.uuid === item.uuid) {
+      this.setState({script: null})
+    }
+    this.setState({scripts: scripts.filter(cell => cell.uuid !== item.uuid)})
+  }
+
+  handleStatus = (item) => {
+    item.status = item.status === 'false' ? 'true' : 'false'
+
+    this.setState({scripts: this.state.scripts.map(cell => {
+      if (cell.uuid === item.uuid) {
+        return item
+      }
+      return cell
+    })})
+  }
+
+  updateStatus = (status) => {
+    let _status = {...this.state.status, ...status}
+    this.setState({status: _status})
+    this.props.updRecord(_status)
+  }
+
   render() {
-    const { config, menu, dict, permFuncField } = this.props
-    const { loading, activeKey, setting, defaultSql, columns, scripts } = this.state
+    const { config, menu } = this.props
+    const { loading, activeKey, setting, defaultSql, columns, scripts, status, visible, script, scriptValue } = this.state
 
     return (
-      <div className="model-table-setting-form-box" id="model-setting-form-body">
+      <div className="model-table-setting-form-box">
         {loading && <Spin size="large" />}
-        <Tabs activeKey={activeKey} className="verify-card-box" onChange={this.changeTab}>
+        <Tabs activeKey={activeKey} onChange={this.changeTab}>
           <TabPane tab="鏁版嵁婧�" key="setting">
             <DataSource
-              type={config.Template === 'CommonTable' ? 'main' : ''}
               menu={menu}
-              dict={dict}
+              config={config}
               columns={columns}
               setting={setting}
               scripts={scripts}
-              permFuncField={permFuncField}
+              updateStatus={this.updateStatus}
               wrappedComponentRef={(inst) => this.settingForm = inst}
             />
           </TabPane>
-          <TabPane tab="鑷畾涔夎剼鏈�" key="scripts">
+          <TabPane tab={
+            <span>
+              鑷畾涔夎剼鏈�
+              {scripts.length ? <span className="count-tip">{scripts.length}</span> : null}
+            </span>
+          } disabled={status.interType !== 'system'} key="scripts" id="mk-setting-scripts">
+            {scripts.length ? <BorderOutlined className="full-scripts" onClick={() => {
+              if (this.scriptsForm && (this.scriptsForm.state.editItem || (this.scriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.scriptsForm.props.form.getFieldValue('sql'))))) {
+                notification.warning({
+                  top: 92,
+                  message: '璇蜂繚瀛樿嚜瀹氫箟鑴氭湰锛�',
+                  duration: 5
+                })
+                return
+              }
+              this.setState({visible: true, script: null, scriptValue: ''})
+            }}/> : null}
             <CustomScript
-              dict={dict}
               setting={setting}
               scripts={scripts}
               defaultSql={defaultSql}
-              searches={this.props.search}
+              urlFields={config.urlFields}
+              searches={this.state.searches}
               scriptsChange={this.scriptsChange}
               scriptsUpdate={this.scriptsUpdate}
               wrappedComponentRef={(inst) => this.scriptsForm = inst}
             />
           </TabPane>
         </Tabs>
+        <Modal
+          wrapClassName="model-custom-table-scripts-modal"
+          title="鑷畾涔夎剼鏈�"
+          visible={visible}
+          width={'95vw'}
+          maskClosable={false}
+          destroyOnClose
+        >
+          <img className="unfull-scripts" src={MinView} onClick={() => this.setState({visible: false, script: null})} alt=""/>
+          <div className="script-table-wrap">
+            {scripts.map(item => {
+              let title = item.sql.match(/^\s*\/\*.+\*\//)
+              title = title && title[0] ? title[0] : ''
+              let _text = title ? item.sql.replace(title, '') : item.sql
+
+              if (item.status === 'false') {
+                return (
+                  <div className="script-item" key={item.uuid}>
+                    <div style={{cursor: 'not-allowed'}}>
+                      {title ? <div style={{color: '#a50', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis'}}>{title}</div> : null}
+                      <Paragraph copyable={{ text: item.sql }} ellipsis={{ rows: 4 }}>{_text}</Paragraph>
+                      <div>
+                        <span style={{color: '#ff4d4f', marginLeft: '20px'}}>
+                          绂佺敤
+                          <StopOutlined style={{marginLeft: '5px'}} />
+                        </span>
+                      </div>
+                    </div>
+                    <div style={{height: '24px'}}></div>
+                  </div>
+                )
+              } else {
+                return (
+                  <div className={'script-item ' + (script && script.uuid === item.uuid ? 'active' : '') } key={item.uuid}>
+                    <div style={{cursor: 'pointer'}} onClick={() => {
+                      this.setState({script: item, scriptValue: item.sql})
+                    }}>
+                      {title ? <div style={{color: '#a50', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis'}}>{title}</div> : null}
+                      <Paragraph copyable={{ text: item.sql }} ellipsis={{ rows: 4 }}>{_text}</Paragraph>
+                      <div>
+                        <span style={{color: '#26C281', marginLeft: '20px'}}>
+                          鍚敤
+                          <CheckCircleOutlined style={{marginLeft: '5px'}}/>
+                        </span>
+                      </div>
+                    </div>
+                    <div style={{textAlign: 'right'}}>
+                      <span className="operation-btn" onClick={() => this.handleStatus(item)} style={{color: '#8E44AD'}}><SwapOutlined /></span>
+                      <Popconfirm
+                        overlayClassName="popover-confirm"
+                        title="纭畾鍒犻櫎鍚�?"
+                        onConfirm={() => this.handleDelete(item)
+                      }>
+                        <span className="operation-btn" style={{color: '#ff4d4f'}}><DeleteOutlined /></span>
+                      </Popconfirm>
+                    </div>
+                  </div>
+                )
+              }
+            })}
+          </div>
+          <div className="script-button">
+            <Button onClick={this.triggerConfirm} loading={loading} className="mk-green" style={{marginBottom: 15, marginLeft: 40}}>
+              {script ? '淇濆瓨' : '娣诲姞'}
+            </Button>
+            <Button onClick={() => {this.setState({script: null, scriptValue: ''})}} style={{marginBottom: 15, marginLeft: 10}}>
+              鍙栨秷
+            </Button>
+          </div>
+          <CodeMirror value={scriptValue} onChange={(val) => {this.setState({scriptValue: val})}}></CodeMirror>
+        </Modal>
       </div>
     )
   }

--
Gitblit v1.8.0