2020-07-16

king

2020-07-16 9a82bce9cf0ed4a51c1b0b0669eaa38cedbace07

2020-07-16

 package-lock.json

@@ -1924,6 +1924,15 @@
        }
      }
    },
    "@uiw/react-codemirror": {
      "version": "2.2.1",
      "resolved": "https://registry.npmjs.org/@uiw/react-codemirror/-/react-codemirror-2.2.1.tgz",
      "integrity": "sha512-sHumpCEno+3Tkha5lC8rwYgWGnRYA8zB0Jh+SOuNvsoMzcqAyVw3Yz+tlu6z2TEINcD9lUWdY6KlvDsi9TRq3w==",
      "requires": {
        "codemirror": "5.52.2",
        "prop-types": "15.7.2"
      }
    },
    "@webassemblyjs/ast": {
      "version": "1.8.5",
      "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.8.5.tgz",

 package.json

@@ -10,6 +10,7 @@
    "@svgr/webpack": "4.3.2",
    "@typescript-eslint/eslint-plugin": "1.13.0",
    "@typescript-eslint/parser": "1.13.0",
    "@uiw/react-codemirror": "^2.2.1",
    "antd": "^3.23.2",
    "antd-mobile": "^2.3.3",
    "axios": "^0.19.0",

 src/components/header/index.jsx

@@ -633,6 +633,16 @@
    return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
  }

  gotoDoc = () => {
    if (options.sysType === 'local' && window.GLOB.mainSystemApi) {
      let ssodomain = window.GLOB.mainSystemApi.replace('/webapi/dostars', '')
      let url = `${ssodomain}/doc/index.html#?appkey=${window.GLOB.appkey}&LoginUID=${sessionStorage.getItem('LoginUID')}`
      window.open(url)
    } else if (options.sysType === 'SSO' || options.sysType === 'cloud') {
      window.open(`${window.location.href.replace(/\/index.html(.*)|\/#(.*)/ig, '')}/doc/index.html#?appkey=${window.GLOB.appkey}&LoginUID=${sessionStorage.getItem('LoginUID')}`)
    }
  }

  render () {
    const { thdMenuList, searchkey } = this.state

@@ -648,7 +658,8 @@
            <Menu.Item className="header-subSystem" key={'sub' + index} onClick={() => {this.changeSystem(system)}}> {system.AppName} </Menu.Item>
          ))}
        </Menu.SubMenu> : null} */}
        <Menu.Item key="2" onClick={this.logout}>{this.state.dict['main.logout']}</Menu.Item>
        <Menu.Item key="2" onClick={this.gotoDoc}>{this.state.dict['main.doc']}</Menu.Item>
        <Menu.Item key="3" onClick={this.logout}>{this.state.dict['main.logout']}</Menu.Item>
      </Menu>
    )


 src/locales/en-US/main.js

@@ -9,6 +9,7 @@
  'main.all': 'All',
  'main.cancel': 'Cancel',
  'main.logout': 'Logout',
  'main.doc': '文档中心',
  'main.logout.hint': 'Are you sure you want to log out?',
  'main.password': 'Change the password',
  'main.password.origin': 'Original Password',

 src/locales/zh-CN/main.js

@@ -9,6 +9,7 @@
  'main.all': '全部',
  'main.cancel': '取消',
  'main.logout': '退出',
  'main.doc': '文档中心',
  'main.logout.hint': '您确定要退出吗?',
  'main.password': '修改密码',
  'main.password.origin': '原密码',

 src/mob/datasource/verifycard/settingform/index.jsx

@@ -3,6 +3,14 @@
// import { fromJS } from 'immutable'
import { Form, Row, Col, Input, Radio, Select, Tooltip, Icon, notification } from 'antd'
import moment from 'moment'
// import CodeMirror from '@uiw/react-codemirror'

// import 'codemirror/theme/monokai.css'
// import 'codemirror/theme/eclipse.css'
// import 'codemirror/addon/selection/active-line'
// import 'codemirror/addon/hint/javascript-hint'
// import 'codemirror/addon/hint/show-hint'
// import 'codemirror/addon/hint/show-hint.css'

import Api from '@/api'
import Utils from '@/utils/utils.js'
@@ -251,6 +259,16 @@
                {getFieldDecorator('dataresource', {
                  initialValue: setting.dataresource || ''
                })(<TextArea rows={4} />)}
                {/* <CodeMirror
                  value={'code'}
                  options={{
                    theme: 'eclipse',
                    lineNumbers: false,
                    mode: 'SQL',
                    extraKeys: {"Ctrl": "autocomplete"},
                    styleActiveLine: true
                  }}
                /> */}
              </Form.Item>
            </Col> : null}
            {interType === 'inner' ? <Col span={8}>

 src/tabviews/commontable/index.jsx

@@ -1133,9 +1133,11 @@
              return (
                <Col span={item.width} key={item.uuid}>
                  <ChartComponent
                    BID={BID}
                    plot={item}
                    config={config}
                    data={this.state.data}
                    getexceloutparam={this.getexceloutparam}
                    loading={this.state.loading}
                  />
                </Col>

 src/tabviews/subtable/index.jsx

@@ -890,7 +890,10 @@
                  <ChartComponent
                    plot={item}
                    config={config}
                    BID={this.props.BID}
                    Tab={this.props.Tab}
                    data={this.state.data}
                    getexceloutparam={this.getexceloutparam}
                    loading={this.state.loading}
                  />
                </Col>

 src/tabviews/zshare/actionList/excelInbutton/excelin/index.jsx

@@ -8,7 +8,6 @@
class ExcelIn extends Component {
  static propTpyes = {
    btn: PropTypes.object,         // 按钮信息
    MenuID: PropTypes.string,      // 菜单ID
    returndata: PropTypes.func,    // 获取返回数据
    triggerExcelIn: PropTypes.func // 修改上传状态
  }
@@ -19,7 +18,7 @@

  exceltrigger = () => {
    const { excelId } = this.state
    let _excelInput = document.getElementById(excelId + this.props.MenuID)
    let _excelInput = document.getElementById(excelId)
    
    if (_excelInput) {
      _excelInput.click()
@@ -105,7 +104,7 @@
  render() {
    return (
      <span>
        {this.state.excelId ? <input className="excel-in-input" id={this.state.excelId + this.props.MenuID} type='file' accept='.xlsx, .xls' onAbort={this.onImportExcel} onChange={this.onImportExcel} /> : null}
        {this.state.excelId ? <input className="excel-in-input" id={this.state.excelId} type='file' accept='.xlsx, .xls' onAbort={this.onImportExcel} onChange={this.onImportExcel} /> : null}
      </span>
    )
  }

 src/tabviews/zshare/actionList/excelInbutton/index.jsx

@@ -15,15 +15,12 @@

class ExcelInButton extends Component {
  static propTpyes = {
    show: PropTypes.any,              // 显示样式
    BID: PropTypes.string,            // 主表ID
    BData: PropTypes.any,             // 主表数据
    selectedData: PropTypes.any,      // 子表中选择数据
    Tab: PropTypes.any,               // 如果当前元素为标签时，tab为标签信息
    MenuID: PropTypes.string,         // 菜单ID
    btn: PropTypes.object,            // 按钮
    columns: PropTypes.array,         // 字段列
    setting: PropTypes.any,           // 页面通用设置
    ContainerId: PropTypes.any,       // tab页面ID，用于弹窗控制
    updateStatus: PropTypes.func,     // 按钮状态更新
    triggerBtn: PropTypes.any,
  }
@@ -392,18 +389,25 @@
  }

  render() {
    const { btn } = this.props
    const { btn, show } = this.props
    const { loading } = this.state

    return (
      <div className="mk-btn-wrap">
        <Button
        {!show ? <Button
          className={'mk-btn mk-' + btn.class}
          icon={btn.icon}
          onClick={() => {this.actionTrigger()}}
          loading={loading}
        >{btn.label}</Button>
        <ExcelIn MenuID={this.props.MenuID} btn={btn} triggerExcelIn={() => this.updateStatus('start')} returndata={this.getexceldata} ref="excelIn" />
        >{btn.label}</Button> : null}
        {show === 'icon' ? <Button
          className="import-icon"
          icon="upload"
          onClick={() => {this.actionTrigger()}}
          loading={loading}
          title={btn.label}
        ></Button> : null}
        <ExcelIn btn={btn} triggerExcelIn={() => this.updateStatus('start')} returndata={this.getexceldata} ref="excelIn" />
      </div>
    )
  }

 src/tabviews/zshare/actionList/excelInbutton/index.scss

@@ -1,3 +1,8 @@
.mk-btn-wrap {
  display: inline-block;

  .import-icon {
    border: 0;
    box-shadow: unset;
  }
}

 src/tabviews/zshare/actionList/exceloutbutton/index.jsx

@@ -16,13 +16,10 @@
class ExcelOutButton extends Component {
  static propTpyes = {
    BID: PropTypes.string,            // 主表ID
    BData: PropTypes.any,             // 主表数据
    show: PropTypes.any,              // 显示样式
    Tab: PropTypes.any,               // 如果当前元素为标签时，tab为标签信息
    MenuID: PropTypes.string,         // 菜单ID
    btn: PropTypes.object,            // 按钮
    columns: PropTypes.array,         // 字段列
    setting: PropTypes.any,           // 页面通用设置
    ContainerId: PropTypes.any,       // tab页面ID，用于弹窗控制
    updateStatus: PropTypes.func,     // 按钮状态更新
    getexceloutparam: PropTypes.func, // 获取表格中参数
    triggerBtn: PropTypes.any,
@@ -704,17 +701,24 @@
  }

  render() {
    const { btn } = this.props
    const { btn, show } = this.props
    const { loading } = this.state

    return (
      <div className="mk-btn-wrap">
        <Button
        {!show ? <Button
          className={'mk-btn mk-' + btn.class}
          icon={btn.icon}
          onClick={() => {this.actionTrigger()}}
          loading={loading}
        >{btn.label}</Button>
        >{btn.label}</Button> : null}
        {show === 'icon' ? <Button
          className="export-icon"
          icon="download"
          onClick={() => {this.actionTrigger()}}
          loading={loading}
          title={btn.label}
        ></Button> : null}
      </div>
    )
  }

 src/tabviews/zshare/actionList/exceloutbutton/index.scss

@@ -1,3 +1,8 @@
.mk-btn-wrap {
  display: inline-block;

  .export-icon {
    border: 0;
    box-shadow: unset;
  }
}

 src/tabviews/zshare/actionList/index.jsx

@@ -97,10 +97,7 @@
            BID={BID}
            Tab={Tab}
            btn={item}
            BData={BData}
            setting={setting}
            columns={logcolumns}
            ContainerId={ContainerId}
            selectedData={selectedData}
            triggerBtn={this.state.triggerBtn}
            updateStatus={this.updateStatus}
@@ -113,10 +110,7 @@
            BID={BID}
            Tab={Tab}
            btn={item}
            BData={BData}
            setting={setting}
            columns={logcolumns}
            ContainerId={ContainerId}
            triggerBtn={this.state.triggerBtn}
            getexceloutparam={getexceloutparam}
            updateStatus={this.updateStatus}

 src/tabviews/zshare/chartcomponent/asyncButtonComponent.jsx

New file
@@ -0,0 +1,34 @@
import React, {Component} from 'react'
import { Button } from 'antd'

/**
 * @description 异步加载模块
 * @param {*} importComponent
 */
export default function asyncComponent(importComponent) {
  return class extends Component {
    constructor(props) {
      super(props)

      this.state = {
        component: null
      }
    }

    async componentDidMount() {
      const {default: component} = await importComponent()

      this.setState({component})
    }

    // <Button className="loading-skeleton" disabled={true}></Button> // 骨架按钮
    render() {
      const C = this.state.component
      const btn = this.props.btn || {}

      return C ?
        <C {...this.props} /> :
        <Button icon={btn.OpenType === 'excelOut' ? 'download' : 'upload'} disabled={true} title={btn.label} style={{border: 0, background: 'transparent'}}></Button>
    }
  }
}

 src/tabviews/zshare/chartcomponent/index.jsx

@@ -5,22 +5,30 @@
import DataSet from '@antv/data-set'
import { Spin, Empty, Select } from 'antd'

import asyncComponent from './asyncButtonComponent'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import './index.scss'

const ExcelOutButton = asyncComponent(() => import('@/tabviews/zshare/actionList/exceloutbutton'))
const ExcelInButton = asyncComponent(() => import('@/tabviews/zshare/actionList/excelInbutton'))

class LineChart extends Component {
  static propTpyes = {
    BID: PropTypes.any,
    Tab: PropTypes.any,
    plot: PropTypes.object,
    data: PropTypes.array,
    loading: PropTypes.bool,
    config: PropTypes.object
    config: PropTypes.object,
    getexceloutparam: PropTypes.func
  }

  state = {
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    empty: true,
    actions: [],
    chartId: Utils.getuuid(),
    chartData: [],
    chartFields: [],
@@ -28,20 +36,29 @@
  }

  componentDidMount () {
    const { plot, data } = this.props

    const { plot, data, config } = this.props
    let _state = {}
    let actions = []
    config.action.forEach(item => {
      if (!plot.actions || plot.actions.length === 0) return
      if (!(item.OpenType === 'excelOut' || (item.OpenType === 'excelIn' && item.Ot === 'notRequired'))) return
      if (plot.actions.includes(item.uuid)) {
        actions.push(fromJS(item).toJS())
      }
    })

    if (plot.datatype === 'statistics' && (plot.chartType === 'line' || plot.chartType === 'bar')) {
      let result = this.getStaticMsg(data)
      _state.chartData = result.data
      _state.chartFields = result.chartFields
      _state.selectFields = result.selectFields
      _state.actions = actions

      this.setState(_state, () => {
        this.viewrender()
      })
    } else {
      this.setState({ actions })
      this.viewrender()
    }
  }
@@ -74,7 +91,6 @@

  getdata = () => {
    const { data, plot, config } = this.props
    
    let vFields = plot.Yaxis && typeof(plot.Yaxis) === 'string' ? [plot.Yaxis] : plot.Yaxis
    let _columns = config.columns.filter(col => vFields.includes(col.field))

@@ -948,8 +964,8 @@
  }

  render() {
    const { plot, loading } = this.props
    const { empty, chartFields, selectFields } = this.state
    const { plot, loading, config, BID, Tab } = this.props
    const { empty, chartFields, selectFields, actions } = this.state

    return (
      <div className="line-chart-plot-box">
@@ -971,7 +987,39 @@
        >
          {chartFields.map((item, i) => <Select.Option key={i} value={item}>{item}</Select.Option>)}
        </Select> : null}
        <div className={'canvas' + (empty ? ' empty' : '')} style={{minHeight: plot.height ? plot.height : 400}} id={this.state.chartId}></div>
        <div className="canvas-wrap">
          <div className={'chart-action ' + (plot.title ? 'with-title' : '')}>
            {actions.map(item => {
              if (item.OpenType === 'excelOut') {
                return (
                  <ExcelOutButton
                    key={item.uuid}
                    BID={BID}
                    Tab={Tab}
                    btn={item}
                    show="icon"
                    setting={config.setting}
                    getexceloutparam={this.props.getexceloutparam}
                    updateStatus={() => {}}
                  />
                )
              } else {
                return (
                  <ExcelInButton
                    key={item.uuid}
                    BID={BID}
                    Tab={Tab}
                    btn={item}
                    show="icon"
                    setting={config.setting}
                    updateStatus={() => {}}
                  />
                )
              }
            })}
          </div>
          <div className={'canvas' + (empty ? ' empty' : '')} style={{minHeight: plot.height ? plot.height : 400}} id={this.state.chartId}></div>
        </div>
        {empty ? <Empty description={false}/> : null}
      </div>
    )

 src/tabviews/zshare/chartcomponent/index.scss

@@ -1,8 +1,23 @@
.line-chart-plot-box {
  margin-bottom: 30px;
  
  .canvas {
  .canvas-wrap {
    margin: 0 20px;
    position: relative;
    border-top: 1px solid transparent;
    .chart-action {
      position: absolute;
      top: 2px;
      right: 5px;
      z-index: 1;
    }
    .chart-action.with-title {
      top: 35px;
    }
  }

  .canvas {
    margin: 0;
    border: 1px solid #e8e8e8;
    padding: 25px 15px;
  }

 src/templates/sharecomponent/actioncomponent/verifyexcelin/index.scss

@@ -69,6 +69,7 @@
      position: relative;
      float: right;
      top: -40px;
      z-index: 1;
    }
  }
}

 src/templates/sharecomponent/chartgroupcomponent/chartform/index.jsx

@@ -210,7 +210,9 @@
      columns: _columns,
      selectlegend: _selectlegend,
      formlist: formlist.map(item => {
        if (item.key === 'height' && ['table', 'card'].includes(_type)) {
        if (item.key === 'actions' && ['table', 'card'].includes(_type)) { // 按钮组
          item.hidden = true
        } else if (item.key === 'height' && ['table', 'card'].includes(_type)) {
          item.hidden = true
        } else if (item.key === 'widthType' && _type === 'card') {
          item.hidden = false
@@ -262,7 +264,9 @@
        legends: syslegends[value] || null,
        selectlegend: syslegends[value] ? syslegends[value][0] : null,
        formlist: formlist.map(item => {
          if (item.key === 'height' && ['table', 'card'].includes(value)) {
          if (item.key === 'actions' && ['table', 'card'].includes(value)) { // 按钮组
            item.hidden = true
          } else if (item.key === 'height' && ['table', 'card'].includes(value)) {
            item.hidden = true
          } else if (item.key === 'widthType' && value === 'card') {
            item.hidden = false

 src/templates/sharecomponent/chartgroupcomponent/index.jsx

@@ -130,10 +130,18 @@
      }
    }

    let actions = config.action.filter(item => item.OpenType === 'excelOut' || (item.OpenType === 'excelIn' && item.Ot === 'notRequired'))
    actions = actions.map(cell => ({value: cell.uuid, text: cell.label}))

    if (item.actions && item.actions.length > 0) {
      let keys = actions.map(cell => cell.value)
      item.actions = item.actions.filter(cell => keys.includes(cell))
    }

    this.setState({
      card: item,
      modaltype: _type,
      formlist: getChartViewForm(item, this.props.sysRoles, _columns)
      formlist: getChartViewForm(item, this.props.sysRoles, _columns, actions)
    })
  }


 src/templates/zshare/formconfig.jsx

@@ -1579,8 +1579,9 @@
 * @param {object} card       // 搜索条件对象
 * @param {Array}  roleList   // 角色列表-黑名单
 * @param {Array}  columns    // 显示列
 * @param {Array}  actions    // 按钮组
 */
export function getChartViewForm (card, roleList = [], _columns) {
export function getChartViewForm (card, roleList = [], _columns, actions) {
  let _charts = [{
    value: 'line',
    text: '折线图'
@@ -1759,6 +1760,14 @@
      initVal: card.blacklist || [],
      required: false,
      options: roleList
    },
    {
      type: 'multiselect',
      key: 'actions',
      label: '按钮组',
      initVal: card.actions || [],
      required: false,
      options: actions
    }
  ]
}