From 24bfb39e86c7a265803486bc4b546ea2bfaef4a5 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期日, 02 四月 2023 23:40:30 +0800
Subject: [PATCH] 2023-04-02
---
src/views/billprint/index.jsx | 191 +++++++++++++++++++++++++++++++++++++++++------
1 files changed, 167 insertions(+), 24 deletions(-)
diff --git a/src/views/billprint/index.jsx b/src/views/billprint/index.jsx
index 4d32fa7..70a2505 100644
--- a/src/views/billprint/index.jsx
+++ b/src/views/billprint/index.jsx
@@ -21,11 +21,15 @@
const AntvScatter = asyncComponent(() => import('@/tabviews/custom/components/chart/antv-scatter'))
const DataCard = asyncComponent(() => import('@/tabviews/custom/components/card/data-card'))
const PropCard = asyncComponent(() => import('@/tabviews/custom/components/card/prop-card'))
+const DoubleDataCard = asyncComponent(() => import('@/tabviews/custom/components/card/double-data-card'))
const TableCard = asyncComponent(() => import('@/tabviews/custom/components/card/table-card'))
const NormalTable = asyncComponent(() => import('@/tabviews/custom/components/table/normal-table'))
const SandBox = asyncComponent(() => import('@/tabviews/custom/components/code/sand-box'))
const TimeLine = asyncComponent(() => import('@/tabviews/custom/components/timeline/normal-timeline'))
+const BraftEditor = asyncComponent(() => import('@/tabviews/custom/components/editor/braft-editor'))
const Balcony = asyncComponent(() => import('@/tabviews/custom/components/card/balcony'))
+const AntvG6 = asyncComponent(() => import('@/tabviews/custom/components/chart/antv-G6'))
+const DebugTable = asyncComponent(() => import('@/tabviews/debugtable'))
class BillPrint extends Component {
state = {
@@ -38,6 +42,7 @@
tempId: '',
config: null,
urlParam: null,
+ visible: false,
auto: true
}
@@ -56,13 +61,14 @@
let param = JSON.parse(window.decodeURIComponent(window.atob(params.param)))
sessionStorage.setItem('dataM', param.dataM || '')
- sessionStorage.setItem('localDataM', param.dataM || '')
this.setState({
BID: param.id || '',
tempId: param.tempId,
urlParam: param
}, () => {
- this.getMenuParam()
+ setTimeout(() => {
+ this.getMenuParam()
+ }, 200)
})
} catch (e) {
notification.warning({
@@ -78,6 +84,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 +138,10 @@
this.setState = () => {
return
}
+ }
+
+ debugChange = () => {
+ this.setState({visible: !this.state.visible})
}
getTouristMsg = () => {
@@ -146,11 +203,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 = ''
@@ -257,6 +310,8 @@
})
}
+ window.GLOB.CacheData.set(tempId, {$BID: BID})
+
config.components = config.components.map(component => {
if (component.action) component.action = []
if (component.search) component.search = []
@@ -264,6 +319,16 @@
if (component.subtype === 'tablecard') { // 鍏煎
component.type = 'card'
+ }
+
+ component.$pageId = tempId
+ if (component.setting && component.setting.supModule) {
+ let pid = component.setting.supModule.pop()
+ if (pid && pid !== 'empty') {
+ component.setting.supModule = pid
+ } else {
+ component.setting.supModule = ''
+ }
}
if (component.type === 'table') {
@@ -279,9 +344,10 @@
})
}
component.cols = getColumns(component.cols)
+ component.statFields = []
}
- if (component.wrap.datatype === 'static') {
+ if (component.wrap && component.wrap.datatype === 'static') {
component.format = ''
}
@@ -333,7 +399,7 @@
// floor 缁勪欢鐨勫眰绾�
// pageable 鏄惁鍒嗛〉锛岀粍浠跺睘鎬э紝涓嶅垎椤电殑缁勪欢鎵嶅彲浠ョ粺涓�鏌ヨ
if (component.setting.sync === 'true') {
- component.dataName = Utils.getdataName()
+ component.dataName = 'mk' + component.uuid.slice(-18)
let param = this.getDefaultParam(component)
_pars.push(param)
} else {
@@ -389,13 +455,23 @@
}
reload = () => {
+ const { tempId } = this.state
+
this.setState({
loadingview: true,
pages: null,
data: '',
config: null
}, () => {
- this.getMenuParam()
+ Api.deleteMenuStorage(tempId)
+ setTimeout(() => {
+ this.getMenuParam()
+ }, 50)
+ // Api.getAppVersion(tempId).then(() => {
+ // this.getMenuParam()
+ // }, () => {
+ // this.getMenuParam()
+ // })
})
}
@@ -633,10 +709,52 @@
})
}
+ 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
+ }
+
+ chartToImage(canvas) {
+ let image = new Image()
+ image.src = canvas.toDataURL('image/jpg')
+ image.style = `width:100%;height:${canvas.style.height || '100%'};`
+ 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 charts = document.getElementsByTagName('canvas')
+
+ if (charts.length) {
+ for (let i = 0; i < charts.length; i++) {
+ let img = this.chartToImage(charts[i])
+ let parentNode = charts[i].parentNode
+
+ parentNode.append(img)
+ }
+
+ while (charts[0]) {
+ charts[0].remove()
+ }
+ }
let jubuData = document.getElementById('bill-print').innerHTML
@@ -688,70 +806,94 @@
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 === 'card' && item.subtype === 'dualdatacard') {
+ return (
+ <Col span={item.width} style={style} key={item.uuid}>
+ <DoubleDataCard config={item} mainSearch={[]}/>
</Col>
)
} 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}>
- <TimeLine config={item} initdata={item.data}/>
+ <Col span={item.width} style={style} key={item.uuid}>
+ <TimeLine config={item} initdata={item.data} mainSearch={[]}/>
+ </Col>
+ )
+ } else if (item.type === 'editor') {
+ return (
+ <Col span={item.width} style={style} key={item.uuid}>
+ <BraftEditor config={item} initdata={item.data} mainSearch={[]}/>
+ </Col>
+ )
+ } else if (item.type === 'antvG6') {
+ return (
+ <Col span={item.width} style={style} key={item.uuid}>
+ <AntvG6 config={item} initdata={item.data} mainSearch={[]}/>
</Col>
)
} else {
@@ -767,9 +909,10 @@
<div className="bill-print-wrap" >
{loadingview && <Spin size="large" />}
{pages ? <div id="bill-print">
- {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>))}
+ {pages.map((components, index) => (<div className={'print-page' + (auto ? ' auto' : '')} key={index} style={{...config.style, overflow: 'hidden', boxSizing: 'border-box'}}><Row className="component-wrap">{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>
--
Gitblit v1.8.0