From 1e4a7720c748bc0206b02b30f4a2e0b3dafb54f3 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 19 二月 2024 13:31:13 +0800 Subject: [PATCH] 2024-02-19 --- src/templates/zshare/customscript/index.jsx | 199 ++++++++++++++++++------------------------------- 1 files changed, 73 insertions(+), 126 deletions(-) diff --git a/src/templates/zshare/customscript/index.jsx b/src/templates/zshare/customscript/index.jsx index c4c411f..50e6ad5 100644 --- a/src/templates/zshare/customscript/index.jsx +++ b/src/templates/zshare/customscript/index.jsx @@ -1,23 +1,27 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { fromJS } from 'immutable' -import { Form, Row, Col, Icon, Button, notification, Select, Table, Popconfirm, Typography } from 'antd' +import { Form, Row, Col, Button, notification, Select, Popconfirm, Typography, Tooltip } from 'antd' +import { StopOutlined, CheckCircleOutlined, EditOutlined, SwapOutlined, DeleteOutlined } from '@ant-design/icons' import moment from 'moment' import Utils from '@/utils/utils.js' -// import SettingUtils from '../utils.jsx' import Api from '@/api' +import { checkSQL, getSearchFields } from '@/utils/utils-custom.js' import CodeMirror from '@/templates/zshare/codemirror' +import asyncComponent from '@/utils/asyncComponent' +import MKEmitter from '@/utils/events.js' import './index.scss' const { Paragraph } = Typography +const EditTable = asyncComponent(() => import('@/templates/zshare/editTable')) class CustomForm extends Component { static propTpyes = { - dict: PropTypes.object, // 瀛楀吀椤� setting: PropTypes.object, // 璁剧疆 scripts: PropTypes.array, // 鑷畾涔夎剼鏈垪琛� searches: PropTypes.array, // 鎼滅储鏉′欢 + urlFields: PropTypes.any, // url鍙橀噺 defaultSql: PropTypes.string, // 榛樿sql scriptsChange: PropTypes.func, // 鑷畾涔夎剼鏈垏鎹㈡椂楠岃瘉 scriptsUpdate: PropTypes.func // 琛ㄥ崟 @@ -27,51 +31,59 @@ editItem: null, loading: false, usefulFields: '', + urlFields: '', systemScripts: [], scriptsColumns: [ { title: 'SQL', dataIndex: 'sql', - width: '70%', - render: (text) => ( - <Paragraph copyable ellipsis={{ rows: 5, expandable: true }}>{text}</Paragraph> - ) + width: '73%', + render: (text) => { + let title = text.match(/^\s*\/\*.+\*\//) + title = title && title[0] ? title[0] : '' + let _text = title ? text.replace(title, '') : text + + return ( + <div> + {title ? <span style={{color: '#a50'}}>{title}<span style={{fontSize: '12px', marginLeft: '5px'}}>{_text.length}</span></span> : null} + <Paragraph copyable={{ text: text }} ellipsis={{ rows: 4, expandable: true }}>{_text}</Paragraph> + </div> + ) + } }, { title: '鐘舵��', dataIndex: 'status', - width: '10%', + width: '12%', render: (text, record) => record.status === 'false' ? ( - <div> - {this.props.dict['model.status.forbidden']} - <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" /> + <div style={{color: '#ff4d4f'}}> + 绂佺敤 + <StopOutlined style={{marginLeft: '5px'}} /> </div> ) : ( - <div> - {this.props.dict['model.status.open']} - <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" /> + <div style={{color: '#26C281'}}> + 鍚敤 + <CheckCircleOutlined style={{marginLeft: '5px'}}/> </div> ) }, { title: '鎿嶄綔', align: 'center', - width: '20%', + width: '15%', dataIndex: 'operation', render: (text, record) => - (<div> - <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><Icon type="edit" /></span> - <span className="operation-btn" title={this.props.dict['header.form.up']} onClick={() => this.handleUpDown(record, 'up')} style={{color: '#1890ff'}}><Icon type="arrow-up" /></span> - <span className="operation-btn" title={this.props.dict['header.form.down']} onClick={() => this.handleUpDown(record, 'down')} style={{color: '#ff4d4f'}}><Icon type="arrow-down" /></span> - <span className="operation-btn" title={this.props.dict['header.form.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></span> + (<div style={{textAlign: 'center'}}> + <span className="operation-btn" title="缂栬緫" onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><EditOutlined /></span> + <span className="operation-btn" title="鐘舵�佸垏鎹�" onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><SwapOutlined /></span> <Popconfirm overlayClassName="popover-confirm" - title={this.props.dict['model.query.delete']} + title="纭畾鍒犻櫎鍚�?" onConfirm={() => this.handleDelete(record) }> - <span className="operation-btn" style={{color: '#ff4d4f'}}><Icon type="delete" /></span> + <span className="operation-btn" style={{color: '#ff4d4f'}}><DeleteOutlined /></span> </Popconfirm> </div>) } @@ -79,28 +91,11 @@ } UNSAFE_componentWillMount() { - const { searches, scripts } = this.props - - let _usefulFields = [] - searches.forEach(item => { - if (item.type === 'group') { - if (item.transfer === 'true') { - _usefulFields.push(item.field) - } - _usefulFields.push(item.datefield) - _usefulFields.push(item.datefield + '1') - } else if (['dateweek', 'datemonth', 'daterange'].includes(item.type)) { - _usefulFields.push(item.field) - _usefulFields.push(item.field + '1') - } else if (_usefulFields.includes(item.field)) { - _usefulFields.push(item.field + '1') - } else { - _usefulFields.push(item.field) - } - }) + const { searches, scripts, urlFields } = this.props this.setState({ - usefulFields: _usefulFields.join(', '), + urlFields: urlFields ? urlFields.join(', ') : '', + usefulFields: getSearchFields(searches), scripts: fromJS(scripts).toJS() }) } @@ -110,30 +105,39 @@ } getsysScript = () => { + if (sessionStorage.getItem('mk_sys_scripts')) { + this.setState({ + systemScripts: JSON.parse(sessionStorage.getItem('mk_sys_scripts')) + }) + return + } let _scriptSql = `Select distinct func+Remark as funcname,longparam, s.Sort from聽 s_custom_script s inner join (select OpenID from sapp where ID=@Appkey@) p on s.openid = case when s.appkey='' then s.openid else p.OpenID end order by s.Sort` - _scriptSql = Utils.formatOptions(_scriptSql) + _scriptSql = Utils.formatOptions(_scriptSql, 'x') let _sParam = { func: 'sPC_Get_SelectedList', LText: _scriptSql, obj_name: 'data', - arr_field: 'funcname,longparam' + arr_field: 'funcname,longparam', + exec_type: 'x' } _sParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') - _sParam.secretkey = Utils.encrypt(_sParam.LText, _sParam.timestamp) + _sParam.secretkey = Utils.encrypt('', _sParam.timestamp) _sParam.open_key = Utils.encryptOpenKey(_sParam.secretkey, _sParam.timestamp) // 浜戠鏁版嵁楠岃瘉 - Api.getSystemConfig(_sParam).then(res => { + Api.getCloudConfig(_sParam).then(res => { if (res.status) { let _scripts = res.data.map(item => { let _item = { name: item.funcname, - value: Utils.UnformatOptions(item.longparam) + value: window.decodeURIComponent(window.atob(item.longparam)) } return _item }) + + sessionStorage.setItem('mk_sys_scripts', JSON.stringify(_scripts)) this.setState({ systemScripts: _scripts @@ -147,8 +151,6 @@ } }) } - - handleCancel = () => { this.setState({ @@ -180,51 +182,13 @@ return } + let pass = checkSQL(_sql, 'customscript') + + if (!pass) return + let values = { uuid: editItem && editItem.uuid ? editItem.uuid : Utils.getuuid(), sql: _sql - } - - let _quot = values.sql.match(/'{1}/g) - let _lparen = values.sql.match(/\({1}/g) - let _rparen = values.sql.match(/\){1}/g) - - _quot = _quot ? _quot.length : 0 - _lparen = _lparen ? _lparen.length : 0 - _rparen = _rparen ? _rparen.length : 0 - - if (_quot % 2 !== 0) { - notification.warning({ - top: 92, - message: 'sql涓璡'蹇呴』鎴愬鍑虹幇', - duration: 5 - }) - return - } else if (_lparen !== _rparen) { - notification.warning({ - top: 92, - message: 'sql涓�()蹇呴』鎴愬鍑虹幇', - duration: 5 - }) - return - } else if (/--/ig.test(values.sql)) { - notification.warning({ - top: 92, - message: '鑷畾涔塻ql璇彞涓紝涓嶅彲鍑虹幇瀛楃 -- 锛屾敞閲婅鐢� /*鍐呭*/', - duration: 5 - }) - return - } - - let error = Utils.verifySql(values.sql, 'customscript') - - if (error) { - notification.warning({ - top: 92, - message: 'sql涓笉鍙娇鐢�' + error, - duration: 5 - }) - return } let _scripts = fromJS(scripts).toJS() @@ -249,6 +213,8 @@ editItem: null }) + MKEmitter.emit('editLineId', values.uuid) + this.props.scriptsUpdate(_scripts) this.props.form.setFieldsValue({ sql: '' @@ -259,6 +225,7 @@ } selectScript = (value, option) => { + if (!value || !option) return let _sql = this.props.form.getFieldValue('sql') if (_sql) { _sql = _sql + ` @@ -290,7 +257,7 @@ } scrolltop = () => { - let node = document.getElementById('model-setting-form-body').parentNode + let node = document.getElementById('mk-setting-scripts') if (node && node.scrollTop) { let inter = Math.ceil(node.scrollTop / 10) @@ -306,27 +273,7 @@ } } - handleUpDown = (record, direction) => { - let scripts = fromJS(this.state.scripts).toJS() - let index = 0 - - scripts = scripts.filter((item, i) => { - if (item.uuid === record.uuid) { - index = i - } - - return item.uuid !== record.uuid - }) - if ((index === 0 && direction === 'up') || (index === scripts.length && direction === 'down')) { - return - } - - if (direction === 'up') { - scripts.splice(index - 1, 0, record) - } else { - scripts.splice(index + 1, 0, record) - } - + changeScripts = (scripts) => { this.setState({scripts}) this.props.scriptsUpdate(scripts) } @@ -358,7 +305,7 @@ render() { const { setting, defaultSql, scripts } = this.props const { getFieldDecorator } = this.props.form - const { usefulFields, scriptsColumns, systemScripts } = this.state + const { usefulFields, scriptsColumns, systemScripts, urlFields } = this.state const formItemLayout = { labelCol: { xs: { span: 24 }, @@ -371,8 +318,8 @@ } return ( - <div> - <Form {...formItemLayout} className="modal-menu-setting-script"> + <div className="modal-menu-setting-script"> + <Form {...formItemLayout}> <Row gutter={24}> {setting.tableName ? <Col span={8}> <Form.Item label={'琛ㄥ悕'} style={{whiteSpace: 'nowrap', margin: 0}}> @@ -386,17 +333,24 @@ </Col> <Col span={24} className="sqlfield"> <Form.Item label={'鍙敤瀛楁'}> - id, bid, loginuid, sessionuid, userid, appkey, time_id, orderBy{setting.laypage === 'true' ? ', pageSize, pageIndex': ''}{usefulFields ? ', ' + usefulFields : ''} + <Tooltip mouseLeaveDelay={0.3} mouseEnterDelay={0.3} placement="top" title={'鍏叡鍊硷紝璇锋寜鐓xxx@鏍煎紡浣跨敤銆�'}><span style={{color: '#1890ff'}}>BID, ID, LoginUID, SessionUid, UserID, Appkey, time_id</span></Tooltip>, + <Tooltip mouseLeaveDelay={0.3} mouseEnterDelay={0.3} placement="top" title={'绯荤粺鍙橀噺锛岀郴缁熶細瀹氫箟鍙橀噺骞惰祴鍊笺��'}><span style={{color: '#fa8c16'}}>UserName, FullName, RoleID, mk_departmentcode, mk_organization, mk_user_type, mk_nation, mk_province, mk_city, mk_district, mk_address</span></Tooltip>, + <Tooltip mouseLeaveDelay={0.3} mouseEnterDelay={0.3} placement="top" title={'鎺掑簭銆佸垎椤典互鍙婃悳绱㈡潯浠跺彉閲忥紝璇锋寜鐓xxx@鏍煎紡浣跨敤銆�'}>orderBy{setting.laypage === 'true' ? ', pageSize, pageIndex': ''}{usefulFields ? ', ' + usefulFields : ''}</Tooltip> + {urlFields ?<Tooltip mouseLeaveDelay={0.3} mouseEnterDelay={0.3} placement="top" title={'url鍙橀噺锛岃鎸夌収@xxx@鏍煎紡浣跨敤銆�'}>, <span style={{color: '#13c2c2'}}>{urlFields}</span></Tooltip> : ''} </Form.Item> </Col> <Col span={10} className="quick-add"> <Form.Item label={'蹇嵎娣诲姞'} style={{marginBottom: 0}}> <Select + allowClear showSearch filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} onChange={this.selectScript} > <Select.Option key="default" value={defaultSql}>榛樿sql</Select.Option> + <Select.Option key="debugger" value={`z_debug: select @ErrorCode='E',@retmsg='娴嬭瘯鏂偣' goto aaa`}> + 娴嬭瘯鏂偣 + </Select.Option> {systemScripts.map((option, i) => <Select.Option style={{whiteSpace: 'normal'}} key={i} value={option.value}>{option.name}</Select.Option> )} @@ -415,19 +369,12 @@ <Form.Item label={'sql'}> {getFieldDecorator('sql', { initialValue: '' - })(<CodeMirror />)} + })(<CodeMirror/>)} </Form.Item> </Col> </Row> </Form> - <Table - bordered - rowKey="uuid" - className="custom-table" - dataSource={scripts} - columns={scriptsColumns} - pagination={false} - /> + <EditTable data={scripts} actions={['move']} columns={scriptsColumns} onChange={this.changeScripts}/> </div> ) } -- Gitblit v1.8.0