| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | import { Form, Row, Col, Button, notification, Select, 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 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 |
| | |
| | | |
| | | class CustomForm extends Component { |
| | | static propTpyes = { |
| | | dict: PropTypes.object, // 字典项 |
| | | setting: PropTypes.object, // 设置 |
| | | scripts: PropTypes.array, // 自定义脚本列表 |
| | | searches: PropTypes.array, // 搜索条件 |
| | |
| | | editItem: null, |
| | | loading: false, |
| | | usefulFields: '', |
| | | urlFields: '', |
| | | systemScripts: [], |
| | | scriptsColumns: [ |
| | | { |
| | |
| | | render: (text) => { |
| | | let title = text.match(/^\s*\/\*.+\*\//) |
| | | title = title && title[0] ? title[0] : '' |
| | | text = title ? text.replace(title, '') : text |
| | | let _text = title ? text.replace(title, '') : text |
| | | |
| | | return ( |
| | | <div> |
| | | {title ? <span style={{color: '#a50'}}>{title}</span> : null} |
| | | <Paragraph copyable ellipsis={{ rows: 4, expandable: true }}>{text}</Paragraph> |
| | | {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> |
| | | ) |
| | | } |
| | |
| | | render: (text, record) => record.status === 'false' ? |
| | | ( |
| | | <div style={{color: '#ff4d4f'}}> |
| | | {this.props.dict['model.status.forbidden']} |
| | | 禁用 |
| | | <StopOutlined style={{marginLeft: '5px'}} /> |
| | | </div> |
| | | ) : |
| | | ( |
| | | <div style={{color: '#26C281'}}> |
| | | {this.props.dict['model.status.open']} |
| | | 启用 |
| | | <CheckCircleOutlined style={{marginLeft: '5px'}}/> |
| | | </div> |
| | | ) |
| | |
| | | dataIndex: 'operation', |
| | | render: (text, record) => |
| | | (<div style={{textAlign: 'center'}}> |
| | | <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><EditOutlined /></span> |
| | | <span className="operation-btn" title={this.props.dict['header.form.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><SwapOutlined /></span> |
| | | <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'}}><DeleteOutlined /></span> |
| | |
| | | UNSAFE_componentWillMount() { |
| | | const { searches, scripts, urlFields } = this.props |
| | | |
| | | let _usefulFields = [] |
| | | searches.forEach(item => { |
| | | if (!item.field) return |
| | | if (item.type === 'group') { |
| | | _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) |
| | | } |
| | | }) |
| | | |
| | | if (urlFields) { |
| | | _usefulFields.push(...urlFields) |
| | | } |
| | | |
| | | this.setState({ |
| | | usefulFields: _usefulFields.join(', '), |
| | | urlFields: urlFields ? urlFields.join(', ') : '', |
| | | usefulFields: getSearchFields(searches), |
| | | scripts: fromJS(scripts).toJS() |
| | | }) |
| | | } |
| | |
| | | } |
| | | |
| | | 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 = { |
| | |
| | | } |
| | | return _item |
| | | }) |
| | | |
| | | sessionStorage.setItem('mk_sys_scripts', JSON.stringify(_scripts)) |
| | | |
| | | this.setState({ |
| | | systemScripts: _scripts |
| | |
| | | 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: '自定义sql语句中,不可出现字符 -- ,注释请用 /*内容*/', |
| | | 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() |
| | |
| | | scripts: _scripts, |
| | | editItem: null |
| | | }) |
| | | |
| | | MKEmitter.emit('editLineId', values.uuid) |
| | | |
| | | this.props.scriptsUpdate(_scripts) |
| | | this.props.form.setFieldsValue({ |
| | |
| | | } |
| | | |
| | | 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) |
| | |
| | | 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 }, |
| | |
| | | </Col> |
| | | <Col span={24} className="sqlfield"> |
| | | <Form.Item label={'可用字段'}> |
| | | id, bid, loginuid, sessionuid, userid, username, fullname, RoleID, mk_departmentcode, mk_organization, login_city, 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"> |
| | |
| | | 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> |
| | | )} |
| | |
| | | <Form.Item label={'sql'}> |
| | | {getFieldDecorator('sql', { |
| | | initialValue: '' |
| | | })(<CodeMirror />)} |
| | | })(<CodeMirror/>)} |
| | | </Form.Item> |
| | | </Col> |
| | | </Row> |