2022-11-21

king

2022-11-21 f6626b05f1275cc2f8ca77f773d4f6a6af1b0a89

 src/views/billprint/index.jsx

@@ -26,6 +26,7 @@
const SandBox = asyncComponent(() => import('@/tabviews/custom/components/code/sand-box'))
const TimeLine = asyncComponent(() => import('@/tabviews/custom/components/timeline/normal-timeline'))
const Balcony = asyncComponent(() => import('@/tabviews/custom/components/card/balcony'))
const DebugTable = asyncComponent(() => import('@/tabviews/debugtable'))

class BillPrint extends Component {
  state = {
@@ -38,6 +39,7 @@
    tempId: '',
    config: null,
    urlParam: null,
    visible: false,
    auto: true
  }

@@ -62,7 +64,9 @@
          tempId: param.tempId,
          urlParam: param
        }, () => {
          this.getMenuParam()
          setTimeout(() => {
            this.getMenuParam()
          }, 200)
        })
      } catch (e) {
        notification.warning({
@@ -78,6 +82,53 @@
    return !is(fromJS(this.state), fromJS(nextState))
  }

  componentDidMount() {
    const _this = this

    Object.defineProperty(window, 'debug', {
      configurable: true,
      enumerable: true,
      set(value) {
        if (value + '' === 'false') {
          window.debugger = false
          window.GLOB.breakpoint = false
          sessionStorage.removeItem('breakpoint')
        } else {
          window.debugger = true
          window.GLOB.breakpoint = value + ''
          sessionStorage.setItem('breakpoint', value)
        }
        _this.debugChange()
      }
    })

    document.onkeydown = (event) => {
      let e = event || window.event
      let keyCode = e.keyCode || e.which || e.charCode
      let preKey = ''

      if (e.ctrlKey) {
        preKey = 'ctrl'
      } else if (e.shiftKey) {
        preKey = 'shift'
      } else if (e.altKey) {
        preKey = 'alt'
      }

      if (!preKey || !keyCode) return
      
      let _shortcut = `${preKey}+${keyCode}`

      if (window.GLOB.breakpoint && _shortcut === 'ctrl+67') {
        window.debugger = false
        window.GLOB.breakpoint = false
        sessionStorage.removeItem('breakpoint')
        
        _this.debugChange()
      }
    }
  }

  /**
   * @description 组件销毁，清除state更新
   */
@@ -85,6 +136,10 @@
    this.setState = () => {
      return
    }
  }

  debugChange = () => {
    this.setState({visible: !this.state.visible})
  }

  getTouristMsg = () => {
@@ -146,11 +201,7 @@

    window.GLOB.dataFormat = false // 打印去除水印

    if (window.GLOB.mainSystemApi) { // 从单点登录服务器取打印配置信息
      _param.rduri = window.GLOB.mainSystemApi
    }

    Api.genericInterface(_param).then(result => {
    Api.getCacheConfig(_param).then(result => {
      if (result.status) {
        let config = ''

@@ -262,7 +313,11 @@
          if (component.search) component.search = []
          component.data = [] // 初始化数据为空

          if (component.type === 'table' && component.subtype === 'normaltable') {
          if (component.subtype === 'tablecard') { // 兼容
            component.type = 'card'
          }

          if (component.type === 'table') {
            let getColumns = (cols) => {
              return cols.map(item => {
                if (item.type === 'colspan') {
@@ -629,10 +684,30 @@
    })
  }

  canvasToImage(canvas) {
    let image = new Image()
    image.src = canvas.toDataURL('image/jpg')
    image.style = 'width:100%;height:100%;position:absolute;z-index:1;left:0px;top:0px;'
    return image
  }

  print = () => {
    const { config, printing } = this.state

    
    if (printing) return

    let qrcodes = document.getElementsByClassName('qrcode-box')

    for (let i = 0; i < qrcodes.length; i++) {
      let canvas = qrcodes[i].getElementsByTagName('canvas')[0]

      if (canvas) {
        let img = this.canvasToImage(canvas)
  
        canvas.remove()
        qrcodes[i].append(img)
      }
    }

    let jubuData = document.getElementById('bill-print').innerHTML

@@ -684,69 +759,75 @@

  getComponents = (components) => {
    return components.map(item => {
      let style = null

      if (item.style && item.style.clear === 'left') {
        style = {clear: 'left'}
      }

      if (item.type === 'bar' || item.type === 'line') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <AntvBarAndLine config={item} initdata={item.data} mainSearch={[]} />
          </Col>
        )
      } else if (item.type === 'pie') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <AntvPie config={item} initdata={item.data} mainSearch={[]} />
          </Col>
        )
      } else if (item.type === 'scatter') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <AntvScatter config={item} initdata={item.data} mainSearch={[]}/>
          </Col>
        )
      } else if (item.type === 'dashboard') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <AntvDashboard config={item} initdata={item.data} mainSearch={[]}/>
          </Col>
        )
      } else if (item.type === 'card' && item.subtype === 'datacard') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <DataCard config={item} initdata={item.data} mainSearch={[]} />
          </Col>
        )
      } else if (item.type === 'card' && item.subtype === 'propcard') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <PropCard config={item} initdata={item.data} mainSearch={[]} />
          </Col>
        )
      } else if (item.type === 'table' && item.subtype === 'tablecard') {
      } else if (item.type === 'card' && item.subtype === 'tablecard') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <TableCard config={item} initdata={item.data} mainSearch={[]}/>
          </Col>
        )
      } else if (item.type === 'table' && item.subtype === 'normaltable') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <NormalTable config={item} initdata={item.data} mainSearch={[]}/>
          </Col>
        )
      } else if (item.type === 'code') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <SandBox config={item} initdata={item.data} mainSearch={[]}/>
          </Col>
        )
      } else if (item.type === 'balcony') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <Balcony config={item} initdata={item.data}/>
          </Col>
        )
      } else if (item.type === 'timeline') {
        return (
          <Col span={item.width} key={item.uuid}>
          <Col span={item.width} style={style} key={item.uuid}>
            <TimeLine config={item} initdata={item.data}/>
          </Col>
        )
@@ -766,6 +847,7 @@
          {pages.map((components, index) => (<div className={'print-page' + (auto ? ' auto' : '')} key={index} style={{...config.style, overflow: 'hidden', boxSizing: 'border-box'}}><Row>{this.getComponents(components)}</Row></div>))}
        </div> : null}
        {viewlost ? <NotFount msg={this.state.lostmsg} /> : null}
        {config && window.GLOB.breakpoint ? <DebugTable /> : null}
        {pages && !loadingview && !viewlost ? <div className="print-button"><Button icon="printer" size="large" shape="circle" onClick={this.print}></Button></div> : null}
        {!loadingview && !viewlost ? <div className="refresh-button"><Button icon="reload" size="large" shape="circle" onClick={this.reload}></Button></div> : null}
      </div>