From a7bb755ee5f797eb390aef581cd9f758d9944f9a Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 04 四月 2023 11:33:59 +0800
Subject: [PATCH] 2023-04-04

---
 src/templates/zshare/codemirror/index.jsx |   94 ++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 72 insertions(+), 22 deletions(-)

diff --git a/src/templates/zshare/codemirror/index.jsx b/src/templates/zshare/codemirror/index.jsx
index aa4698f..60376cc 100644
--- a/src/templates/zshare/codemirror/index.jsx
+++ b/src/templates/zshare/codemirror/index.jsx
@@ -1,11 +1,12 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Dropdown, Menu } from 'antd'
-import { FullscreenOutlined, FullscreenExitOutlined, FontSizeOutlined, FormatPainterOutlined } from '@ant-design/icons'
+import { Dropdown, Menu, Modal, notification } from 'antd'
+import { FullscreenOutlined, FullscreenExitOutlined, FontSizeOutlined, FormatPainterOutlined, SwapOutlined } from '@ant-design/icons'
 
 import {UnControlled as CodeMirror} from 'react-codemirror2'
 import sqlFormatter from '@/utils/sqlFormatter.js'
+import ReplaceForm from './replaceform'
 import 'codemirror/mode/javascript/javascript'
 import 'codemirror/mode/sql/sql'
 import 'codemirror/mode/xml/xml'
@@ -33,7 +34,8 @@
     options: null,  // mode : text/xml, text/css, text/javascript銆乼ext/x-mysql ; theme : cobalt - 榛戝簳
     fullScreen: false,
     style: {fontSize: '18px', lineHeight: '32px'},
-    display: true
+    display: true,
+    visible: false
   }
 
   editor = null
@@ -149,9 +151,42 @@
     this.props.onChange(_sql)
   }
 
+  submit = () => {
+    let _sql = this.state.value
+
+    this.ReplaceRef.handleConfirm().then(res => {
+      let reg = new RegExp(res.origin, 'ig')
+      let times = _sql.match(reg)
+
+      if (!times) {
+        notification.warning({
+          top: 92,
+          message: '鏈煡璇㈠埌瀛楃銆�' + res.origin + '銆嬨��',
+          duration: 5
+        })
+        return
+      }
+
+      _sql = _sql.replace(reg, res.value)
+
+      this.setState({display: false, defaultVal: _sql}, () => {
+        this.setState({display: true})
+      })
+      
+      this.props.onChange(_sql)
+
+      notification.success({
+        top: 92,
+        message: `鍏辨浛鎹�${times.length}澶勫瓧绗︺��${res.origin}銆嬨�俙,
+        duration: 5
+      })
+      this.setState({ visible: false })
+    })
+  }
+
   render() {
     const { mode, func } = this.props
-    const { defaultVal, options, fullScreen, style, display } = this.state
+    const { defaultVal, options, fullScreen, style, display, visible } = this.state
     const menu = (
       <Menu>
         <Menu.Item
@@ -194,24 +229,39 @@
     )
 
     return (
-      <div className="code-mirror-wrap" style={fullScreen || func ? style : null}>
-        {!mode && !fullScreen ? <FormatPainterOutlined onClick={this.handleFormat}/> : null}
-        {!fullScreen ? <FullscreenOutlined onClick={this.fullScreenChange}/> : null}
-        {fullScreen ? <FullscreenExitOutlined onClick={this.fullScreenChange}/> : null}
-        {fullScreen || func ? <Dropdown overlayClassName="mk-mirror-font" overlay={menu} placement="bottomRight">
-          <FontSizeOutlined />
-        </Dropdown> : null}
-        {display ? <CodeMirror
-          className="code-mirror-area"
-          value={defaultVal}
-          options={options}
-          editorDidMount={editor => { this.editor = editor }}
-          onChange={(editor, data, value) => {
-            this.setState({value})
-            this.props.onChange(value)
-          }}
-        /> : null}
-      </div>
+      <>
+        <div className={'code-mirror-wrap ' + (fullScreen ? 'mk-fullscreen' : '')} style={fullScreen || func ? style : null}>
+          {!mode ? <FormatPainterOutlined title="鏍煎紡鍖�" onClick={this.handleFormat}/> : null}
+          <FullscreenOutlined title="鏈�澶у寲" onClick={this.fullScreenChange}/>
+          <FullscreenExitOutlined title="鍚戜笅杩樺師" onClick={this.fullScreenChange}/>
+          {fullScreen || func ? <Dropdown overlayClassName="mk-mirror-font" overlay={menu} placement="bottomRight">
+            <FontSizeOutlined />
+          </Dropdown> : null}
+          <SwapOutlined title="瀛楃鏇挎崲" onClick={() => this.setState({visible: true})}/>
+          {display ? <CodeMirror
+            className="code-mirror-area"
+            value={defaultVal}
+            options={options}
+            editorDidMount={editor => { this.editor = editor }}
+            onChange={(editor, data, value) => {
+              this.setState({value})
+              this.props.onChange(value)
+            }}
+          /> : null}
+        </div>
+        <Modal
+          title="瀛楃鏇挎崲"
+          visible={visible}
+          width={500}
+          maskClosable={false}
+          okText="鏇挎崲"
+          onOk={this.submit}
+          onCancel={() => {this.setState({ visible: false })}}
+          destroyOnClose
+        >
+          <ReplaceForm inputSubmit={this.submit} wrappedComponentRef={(inst) => this.ReplaceRef = inst}/>
+        </Modal>
+      </>
     )
   }
 }

--
Gitblit v1.8.0