From a24beb36feaa46f39cbb26ce5277e84f91241ce8 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 26 三月 2020 01:30:05 +0800
Subject: [PATCH] 2020-03-26
---
src/tabviews/zshare/verifycard/index.jsx | 643 +++++++++++++++++++++++++++-------------------------------
1 files changed, 301 insertions(+), 342 deletions(-)
diff --git a/src/tabviews/zshare/verifycard/index.jsx b/src/tabviews/zshare/verifycard/index.jsx
index 5fc7311..7b2ea3b 100644
--- a/src/tabviews/zshare/verifycard/index.jsx
+++ b/src/tabviews/zshare/verifycard/index.jsx
@@ -1,387 +1,346 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import { Form, Tabs, Row, Col, Radio, Table, Icon, Select, notification } from 'antd'
+import { Form, Tabs, notification, Spin, Icon } from 'antd'
-import Utils from '@/utils/utils.js'
+// import Utils from '@/utils/utils.js'
+import Api from '@/api'
-import ActionForm from './actionform'
+import TabCard from './tabcard'
import './index.scss'
const { TabPane } = Tabs
-const keycode = {
- 65: 'A',
- 66: 'B',
- 67: 'C',
- 68: 'D',
- 69: 'E',
- 70: 'F',
- 71: 'G',
- 72: 'H',
- 73: 'I',
- 74: 'J',
- 75: 'K',
- 76: 'L',
- 77: 'M',
- 78: 'N',
- 79: 'O',
- 80: 'P',
- 81: 'Q',
- 82: 'R',
- 83: 'S',
- 84: 'T',
- 85: 'U',
- 86: 'V',
- 87: 'W',
- 88: 'X',
- 89: 'Y',
- 90: 'Z'
-}
class VerifyCard extends Component {
static propTpyes = {
- config: PropTypes.object // 椤甸潰閰嶇疆
+ MenuID: PropTypes.string,
+ MenuName: PropTypes.string,
+ permAction: PropTypes.object,
+ permRoles: PropTypes.array,
+ userConfig: PropTypes.object,
+ columns: PropTypes.array,
+ config: PropTypes.object, // 椤甸潰閰嶇疆
+ handleParam: PropTypes.func // 閰嶇疆淇℃伅鍙樺寲
}
state = {
- colColumns: [
- {
- title: '瀛楁鍚�',
- dataIndex: 'field',
- width: '35%'
- },
- {
- title: '鎿嶄綔',
- align: 'center',
- width: '25%',
- dataIndex: 'operation',
- render: (text, record) =>
- (<div>
- <span className="operation-btn" title="缂栬緫" onClick={() => this.handleEdit(record, 'column')} style={{color: '#1890ff'}}><Icon type="edit" /></span>
- <span className="operation-btn" title="涓婄Щ" onClick={() => this.handleUpDown(record, 'up')} style={{color: '#1890ff'}}><Icon type="arrow-up" /></span>
- <span className="operation-btn" title="涓嬬Щ" onClick={() => this.handleUpDown(record, 'down')} style={{color: '#ff4d4f'}}><Icon type="arrow-down" /></span>
- <span className="operation-btn" title="鐘舵�佸垏鎹�" onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></span>
- </div>)
- }
- ],
- actionColumns: [
- {
- title: '鍚嶇О',
- dataIndex: 'label',
- width: '25%'
- },
- {
- title: '蹇嵎閿�',
- dataIndex: 'shortcut',
- width: '25%',
- render: (text, record) => {
- if (!record.shortcut || typeof(record.shortcut) !== 'object' || record.shortcut.length === 0) return ''
- let _text = keycode[record.shortcut[1]]
-
- return record.shortcut[0] + ' + ' + _text
- }
- },
- {
- title: '鎵撳嵃鏈�',
- dataIndex: 'printer',
- width: '30%'
- },
- {
- title: '鎿嶄綔',
- align: 'center',
- width: '20%',
- dataIndex: 'operation',
- render: (text, record) =>
- (<div>
- <span className="operation-btn" title="缂栬緫" onClick={() => this.handleEdit(record, 'action')} style={{color: '#1890ff'}}><Icon type="edit" /></span>
- </div>)
- }
- ]
+ loading: true,
+ menuParam: null,
+ menuconfig: null
}
- UNSAFE_componentWillMount() {
- const { config } = this.props
+ UNSAFE_componentWillMount () {
+ const { MenuID, MenuName, permAction, permRoles, config, userConfig, columns } = this.props
+ let menuParam = []
this.setState({
- config: JSON.parse(JSON.stringify(config))
+ loadingview: true
})
- }
- componentDidMount() {
- let printbtns = this.state.config.action.filter(item => item.OpenType === 'funcbutton' && item.funcType === 'print')
-
- printbtns.forEach(item => {
- if (!item.verify || !item.verify.linkUrl) {
- notification.warning({
- top: 92,
- message: '鎵撳嵃鎸夐挳銆�' + item.label + '銆嬭缃敊璇�!',
- duration: 10
- })
- } else {
- let socket = null
- socket = new WebSocket('ws://' + item.verify.linkUrl)
- // 鎵撳紑Socket
- socket.onopen = () =>{
- let request = {
- requestID: '',
- version: '',
- cmd: 'getPrinters'
- }
- socket.send(JSON.stringify(request))
- }
- // 鐩戝惉娑堟伅
- socket.onmessage = (event) => {
- let data = ''
- try {
- data = JSON.parse(event.data)
- } catch {
- data = ''
- }
-
- if (data && data.cmd === 'getPrinters' && data.status) {
- let printers = Array.from(new Set(data.printers))
-
- let _config = JSON.parse(JSON.stringify(this.state.config))
-
- _config.action = _config.action.map(cell => {
- if (item.uuid === cell.uuid) {
-
- cell.printer = cell.printer || data.defaultPrinter
- cell.printers = printers.map(print => {
- return {
- value: print,
- text: print
- }
- })
- }
- return cell
- })
-
- this.setState({
- config: _config
- })
- } else if (data && data.cmd === 'getPrinters' && !data.status) {
- notification.warning({
- top: 92,
- message: data.message,
- duration: 10
- })
- }
+ menuParam.push({
+ uuid: MenuID,
+ type: 'main',
+ label: MenuName + '(涓昏〃)',
+ setting: {
+ actionfixed: config.setting.actionfixed,
+ columnfixed: config.setting.columnfixed,
+ tableType: config.setting.tableType
+ },
+ action: config.action.map(item => {
+ let _item = {
+ uuid: item.uuid,
+ label: item.label,
+ shortcut: item.shortcut || ''
}
- socket.onerror = () => {
+ if (item.OpenType === 'funcbutton' && item.funcType === 'print') {
+ _item.type = 'print'
+ _item.verify = item.verify
+ _item.printer = item.printer || ''
+ }
+
+ return _item
+ }),
+ columns: columns.map(item => {
+ return {
+ uuid: item.uuid,
+ label: item.label,
+ Width: item.Width,
+ hidden: item.hidden || false,
+ sort: item.sort || 0
+ }
+ })
+ })
+
+ let deffers = []
+ config.tabgroups.forEach(groupId => {
+ config[groupId].forEach(tab => {
+ deffers.push(new Promise(resolve => {
+ let param = {
+ func: 'sPC_Get_LongParam',
+ MenuID: tab.linkTab
+ }
+ Api.getSystemCacheConfig(param).then(res => {
+ res.tab = tab
+ resolve(res)
+ })
+ }))
+ })
+ })
+
+ if (deffers.length > 0) {
+ Promise.all(deffers).then(result => {
+ let errors = result.filter(res => !res.status)
+ if (errors.length > 0) {
notification.warning({
top: 92,
- message: '鏃犳硶杩炴帴鍒�:' + item.verify.linkUrl,
+ message: errors[0].message,
duration: 10
})
+ return
}
- }
- })
- }
- columnChange = (values) => {
- let verify = JSON.parse(JSON.stringify(this.state.verify))
+ result.forEach(res => {
+ if (!res.LongParam) return
- if (values.uuid) {
- verify.uniques = verify.uniques.map(item => {
- if (item.uuid === values.uuid) {
- return values
- } else {
- return item
- }
- })
- } else {
- values.uuid = Utils.getuuid()
- verify.uniques.push(values)
- }
+ let subconfig = ''
+ let subUserConfig = userConfig ? userConfig[res.tab.linkTab] : ''
- this.setState({
- verify: verify
- })
- }
+ try {
+ subconfig = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
+ } catch (e) {
+ console.warn('Parse Failure')
+ errors.push('瀛愭爣绛俱��' + res.tab.label + '銆嬪弬鏁拌В鏋愰敊璇紒')
+ }
- actionChange = (values) => {
- let config = JSON.parse(JSON.stringify(this.state.config))
+ if (!subconfig || !subconfig.enabled) return
- config.action = config.action.map(item => {
- if (values.uuid === item.uuid) {
- item = {...item, ...values}
- }
+ let _columns = [] // 鏄剧ず鍒�
+ let _hideCol = [] // 闅愯棌鍙婂悎骞跺垪涓瓧娈电殑uuid闆�
+ let colMap = new Map()
- return item
- })
-
- this.setState({
- config: config
- })
- }
-
- handleEdit = (record, type) => {
- if (type === 'action') {
- this.actionForm.edit(record)
- } else if (type === 'column') {
- this.uniqueForm.edit(record)
- }
-
- let node = document.getElementById('verify-card-box-tab').parentNode
-
- if (node && node.scrollTop) {
- let inter = Math.ceil(node.scrollTop / 10)
-
- let timer = setInterval(() => {
- if (node.scrollTop - inter > 0) {
- node.scrollTop = node.scrollTop - inter
- } else {
- node.scrollTop = 0
- clearInterval(timer)
- }
- }, 10)
- }
- }
-
- handleStatus = (record) => {
- let verify = JSON.parse(JSON.stringify(this.state.verify))
- record.status = record.status === 'false' ? 'true' : 'false'
-
- verify.scripts = verify.scripts.map(item => {
- if (item.uuid === record.uuid) {
- return record
- } else {
- return item
- }
- })
-
- this.setState({
- verify: verify
- })
- }
-
- handleUpDown = (record, type, direction) => {
- let verify = JSON.parse(JSON.stringify(this.state.verify))
- let index = 0
-
- verify.customverifys = verify.customverifys.filter((item, i) => {
- if (item.uuid === record.uuid) {
- index = i
- }
-
- return item.uuid !== record.uuid
- })
- if ((index === 0 && direction === 'up') || (index === verify.customverifys.length && direction === 'down')) {
- return
- }
-
- if (direction === 'up') {
- verify.customverifys.splice(index - 1, 0, record)
- } else {
- verify.customverifys.splice(index + 1, 0, record)
- }
-
- this.setState({
- verify: verify
- })
- }
-
- handleConfirm = () => {
- const { config } = this.state
- // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭�
- return new Promise((resolve, reject) => {
- this.props.form.validateFieldsAndScroll((err, values) => {
- if (!err) {
- let _config = {}
- _config.setting = values
- _config.action = config.action.map(item => {
- return {
- uuid: item.uuid,
- shortcut: item.shortcut || '',
- shortcutkey: item.shortcutkey || '',
- printer: item.printer || ''
+ // 鏉冮檺杩囨护
+ subconfig.action = subconfig.action.filter(item => permAction[item.uuid])
+
+ subconfig.columns = subconfig.columns.filter(col => {
+ if (!col.field || !col.blacklist || col.blacklist.length === 0 || subconfig.setting.primaryKey === col.field) return true
+
+ let _black = col.blacklist.filter(v => {
+ return permRoles.indexOf(v) !== -1
+ })
+
+ if (_black.length > 0) {
+ return false
+ } else {
+ return true
}
})
-
- resolve(_config)
+
+ if (subUserConfig) {
+ subconfig.setting.tableType = subUserConfig.setting.tableType
+
+ subconfig.action = subconfig.action.map(item => {
+ if (subUserConfig.action[item.uuid]) {
+ item = {...item, ...subUserConfig.action[item.uuid]}
+ }
+ if (item.execMode) {
+ item.OpenType = 'funcbutton'
+ }
+
+ if (item.OpenType === 'funcbutton' && item.funcType === 'print' && item.verify && item.printer) {
+ item.verify.defaultPrinter = item.printer.defaultPrinter || ''
+ if (item.verify.printerTypeList && item.printer.printerList) {
+ item.verify.printerTypeList = item.verify.printerTypeList.map(cell => {
+ cell.printer = item.printer.printerList[cell.Value] || ''
+
+ return cell
+ })
+ }
+ }
+
+ return item
+ })
+ } else {
+ subconfig.action = subconfig.action.map(item => {
+ if (item.execMode) {
+ item.OpenType = 'funcbutton'
+ }
+
+ return item
+ })
+ }
+
+ // 1銆佺瓫閫夊瓧娈甸泦锛�2銆佽繃婊ら殣钘忓垪鍙婂悎骞跺垪涓殑瀛楁uuid
+ subconfig.columns.forEach(col => {
+ if (col.type === 'colspan' && col.sublist) { // 绛涢�夐殣钘忓垪
+ _hideCol = _hideCol.concat(col.sublist)
+ } else if (col.Hide === 'true') {
+ _hideCol.push(col.uuid)
+ }
+ colMap.set(col.uuid, col)
+ })
+
+ // 鐢熸垚鏄剧ず鍒楋紝澶勭悊鍚堝苟鍒椾腑鐨勫瓧娈�
+ subconfig.columns.forEach(col => {
+ if (_hideCol.includes(col.uuid)) return
+
+ if (col.type === 'colspan' && col.sublist) {
+ let _col = JSON.parse(JSON.stringify(col))
+ let subColumn = []
+ _col.sublist.forEach(sub => {
+ if (colMap.has(sub)) {
+ subColumn.push(colMap.get(sub))
+ }
+ })
+ _col.subColumn = subColumn
+ _columns.push(_col)
+ } else {
+ _columns.push(col)
+ }
+ })
+
+ let _operations = subconfig.action.filter(item => item.position === 'grid')
+
+ if (subconfig.gridBtn && subconfig.gridBtn.display && _operations.length > 0) {
+ _columns.push({
+ ...subconfig.gridBtn,
+ operations: _operations
+ })
+ }
+
+ // 娣诲姞鐢ㄦ埛鏄剧ず鍒楄缃�
+ if (subUserConfig) {
+ _columns = _columns.map(item => {
+ if (subUserConfig.columns[item.uuid]) {
+ item = {...item, ...subUserConfig.columns[item.uuid]}
+ }
+
+ return item
+ })
+
+ _columns.sort((pre, next) => {
+ return pre.sort - next.sort
+ })
+ }
+
+ menuParam.push({
+ uuid: res.tab.linkTab,
+ label: res.tab.label,
+ setting: {tableType: subconfig.setting.tableType},
+ action: subconfig.action.map(item => {
+ let _item = {
+ uuid: item.uuid,
+ label: item.label,
+ shortcut: item.shortcut || ''
+ }
+
+ if (item.OpenType === 'funcbutton' && item.funcType === 'print') {
+ _item.type = 'print'
+ _item.verify = item.verify
+ _item.printer = item.printer || ''
+ }
+
+ return _item
+ }),
+ columns: _columns.map(item => {
+ return {
+ uuid: item.uuid,
+ label: item.label,
+ Width: item.Width,
+ hidden: item.hidden || false,
+ sort: item.sort || 0
+ }
+ })
+ })
+ })
+
+ if (errors.length > 0) {
+ notification.warning({
+ top: 92,
+ message: errors[0],
+ duration: 10
+ })
+ return
}
+
+ this.setState({
+ loading: false,
+ menuParam: menuParam
+ }, () => {
+ this.getInitParam()
+ })
})
- })
+ } else {
+ this.setState({
+ loading: false
+ })
+ }
}
+ getInitParam = () => {
+ let config = JSON.parse(JSON.stringify(this.state.menuParam))
+
+ let _config = {}
+
+ config.forEach(tab => {
+ let _tab = {
+ label: tab.label,
+ setting: tab.setting,
+ action: {},
+ columns: {}
+ }
+
+ tab.action.forEach(item => {
+ _tab.action[item.uuid] = {
+ printer: item.printer || '',
+ shortcut: item.shortcut
+ }
+ })
+
+ tab.columns.forEach((item, index) => {
+ _tab.columns[item.uuid] = {
+ Width: item.Width,
+ hidden: item.hidden,
+ sort: index
+ }
+ })
+
+ _config[tab.uuid] = _tab
+ })
+
+ this.setState({
+ menuconfig: _config
+ })
+ this.props.handleParam(_config)
+ }
+
+ changeconfig = (uuid, param) => {
+ let _menuconfig = JSON.parse(JSON.stringify(this.state.menuconfig))
+
+ _menuconfig[uuid] = param
+
+ this.setState({
+ menuconfig: _menuconfig
+ })
+
+ this.props.handleParam(_menuconfig)
+ }
render() {
- const { getFieldDecorator } = this.props.form
- const { actionColumns, config } = this.state
- const formItemLayout = {
- labelCol: {
- xs: { span: 24 },
- sm: { span: 8 }
- },
- wrapperCol: {
- xs: { span: 24 },
- sm: { span: 16 }
- }
- }
+ const { menuParam, loading } = this.state
return (
- <div id="verify-card-box-tab">
- <Tabs defaultActiveKey="1" className="verify-card-box">
- <TabPane tab="鍩虹璁剧疆" key="1">
- <Form {...formItemLayout}>
- <Row gutter={24}>
- <Col span={8}>
- <Form.Item label="鍥哄畾鎸夐挳">
- {getFieldDecorator('actionfixed', {
- initialValue: config.setting.actionfixed ? 'true' : 'false'
- })(
- <Radio.Group>
- <Radio value="true">鏄�</Radio>
- <Radio value="false">鍚�</Radio>
- </Radio.Group>
- )}
- </Form.Item>
- </Col>
- <Col span={8}>
- <Form.Item label="鍥哄畾琛ㄥご">
- {getFieldDecorator('columnfixed', {
- initialValue: config.setting.columnfixed ? 'true' : 'false'
- })(
- <Radio.Group>
- <Radio value="true">鏄�</Radio>
- <Radio value="false">鍚�</Radio>
- </Radio.Group>
- )}
- </Form.Item>
- </Col>
- <Col span={8}>
- <Form.Item label="琛ㄦ牸灞炴��">
- {getFieldDecorator('tableType', {
- initialValue: config.setting.tableType || 'checkbox'
- })(
- <Select>
- <Select.Option value="">涓嶅彲閫�</Select.Option>
- <Select.Option value="radio">鍗曢��</Select.Option>
- <Select.Option value="checkbox">澶氶��</Select.Option>
- </Select>
- )}
- </Form.Item>
- </Col>
- </Row>
- </Form>
- </TabPane>
- <TabPane tab="鎸夐挳璁剧疆" key="action">
- <ActionForm
- dict={this.props.dict}
- actionChange={this.actionChange}
- wrappedComponentRef={(inst) => this.actionForm = inst}
- />
- <Table
- bordered
- rowKey="uuid"
- className="custom-table"
- dataSource={config.action}
- columns={actionColumns}
- pagination={false}
- />
- </TabPane>
- </Tabs>
+ <div id="verify-card-box-tab" className="verify-card-horizontal-box">
+ {loading ? <Spin size="large" /> : null}
+ {menuParam ? <Tabs defaultActiveKey={menuParam[0].uuid}>
+ {menuParam.map(tab => {
+ return (
+ <TabPane tab={tab.label} key={tab.uuid}>
+ <TabCard config={tab} handleconfig={this.changeconfig}/>
+ </TabPane>
+ )
+ })}
+ </Tabs> : null}
+ {!loading && !menuParam ? <div className="message-fail"><Icon type="exclamation-circle" />淇℃伅鑾峰彇澶辫触</div> : null}
</div>
)
}
--
Gitblit v1.8.0