| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import md5 from 'md5' |
| | | import { connect } from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Table, Typography, Col, Switch, message } from 'antd' |
| | | |
| | |
| | | import MKEmitter from '@/utils/events.js' |
| | | import zhCN from '@/locales/zh-CN/main.js' |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import Encrypts from '@/components/encrypts' |
| | | import '@/assets/css/table.scss' |
| | | import './index.scss' |
| | | |
| | |
| | | content = `${content.substr(0, 4)}-${content.substr(5, 2)}-${content.substr(8, 2)}` |
| | | } else if (col.textFormat === 'YYYY-MM-DD HH:mm:ss' && /^[1-9]\d{3}(-|\/)(0[1-9]|1[0-2])(-|\/)(0[1-9]|[1-2][0-9]|3[0-1]).([0-1][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]/.test(content)) { |
| | | content = `${content.substr(0, 4)}-${content.substr(5, 2)}-${content.substr(8, 2)} ${content.substr(11, 2)}:${content.substr(14, 2)}:${content.substr(17, 2)}` |
| | | } else if (col.textFormat === 'encryption') { |
| | | content = <span>{col.prefix || ''}<Encrypts value={content} />{col.postfix || ''}</span> |
| | | } |
| | | |
| | | content = (col.prefix || '') + content + (col.postfix || '') |
| | | |
| | | if (col.textFormat !== 'encryption') { |
| | | content = (col.prefix || '') + content + (col.postfix || '') |
| | | } |
| | | } |
| | | |
| | | if (col.marks) { |
| | |
| | | |
| | | if (mark.icon) { |
| | | if (mark.position === 'front') { |
| | | content = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {content}</span> |
| | | content = <span><MkIcon style={mark.innerStyle} type={mark.icon} /> {content}</span> |
| | | } else { |
| | | content = <span>{content} <MkIcon style={{color: mark.color}} type={mark.icon} /></span> |
| | | content = <span>{content} <MkIcon style={mark.innerStyle} type={mark.icon} /></span> |
| | | } |
| | | } else if (mark.innerStyle) { |
| | | content = <span style={mark.innerStyle}>{content}</span> |
| | | } |
| | | } |
| | | if (col.blur) { |
| | |
| | | } |
| | | |
| | | if (content !== '') { |
| | | let decimal = col.decimal || 0 |
| | | if (col.round) { |
| | | content = Math.round(content * col.round) / col.round |
| | | } |
| | | if (col.format === 'percent') { |
| | | content = content * 100 |
| | | decimal = decimal > 2 ? decimal - 2 : 0 |
| | | } else if (col.format === 'abs') { |
| | | content = Math.abs(content) |
| | | } |
| | | |
| | | content = content.toFixed(decimal) |
| | | if (col.round) { |
| | | content = content.toFixed(col.decimal) |
| | | } |
| | | |
| | | if (col.format === 'thdSeparator') { |
| | | content = content.replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g, '$&,') |
| | | } |
| | | |
| | | content = col.prefix + content + col.postfix |
| | | content = (col.prefix || '') + content + (col.postfix || '') |
| | | } |
| | | |
| | | if (col.marks) { |
| | |
| | | |
| | | if (mark.icon) { |
| | | if (mark.position === 'front') { |
| | | content = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {content}</span> |
| | | content = <span><MkIcon style={mark.innerStyle} type={mark.icon} /> {content}</span> |
| | | } else { |
| | | content = <span>{content} <MkIcon style={{color: mark.color}} type={mark.icon} /></span> |
| | | content = <span>{content} <MkIcon style={mark.innerStyle} type={mark.icon} /></span> |
| | | } |
| | | } else if (mark.innerStyle) { |
| | | content = <span style={mark.innerStyle}>{content}</span> |
| | | } |
| | | } |
| | | |
| | |
| | | photos = photos.split(',').filter(Boolean) |
| | | } |
| | | |
| | | let cols = 24 / (col.picSort || 1) |
| | | let paddingTop = '100%' |
| | | let scale = col.scale === 'true' |
| | | |
| | |
| | | |
| | | resProps.children = ( |
| | | <div> |
| | | {photos && photos.map((url, i) => ( |
| | | <Col key={i} span={cols}> |
| | | {photos.map((url, i) => ( |
| | | <Col key={i} span={col.span || 24}> |
| | | <div className={'ant-mk-picture' + (scale ? ' scale' : '')} onClick={() => { |
| | | if (!scale) return |
| | | MKEmitter.emit('mkImageScale', url, photos) |
| | |
| | | } |
| | | |
| | | if (content) { |
| | | content = col.prefix + content + col.postfix |
| | | content = (col.prefix || '') + content + (col.postfix || '') |
| | | } |
| | | |
| | | if (col.blur) { |
| | |
| | | |
| | | if (mark.icon) { |
| | | if (mark.position === 'front') { |
| | | content = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {content}</span> |
| | | content = <span><MkIcon style={mark.innerStyle} type={mark.icon} /> {content}</span> |
| | | } else { |
| | | content = <span>{content} <MkIcon style={{color: mark.color}} type={mark.icon} /></span> |
| | | content = <span>{content} <MkIcon style={mark.innerStyle} type={mark.icon} /></span> |
| | | } |
| | | } else if (mark.innerStyle) { |
| | | content = <span style={mark.innerStyle}>{content}</span> |
| | | } |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { menuType, memberLevel, setting, fields, columns } = this.props |
| | | const { setting, fields, columns } = this.props |
| | | let radio = 5 // 虚化比例 |
| | | let _format = false // 是否虚化处理 |
| | | let rowspans = [] |
| | | let orderfields = {} |
| | | |
| | | if (window.GLOB.dataFormat && menuType !== 'HS' && memberLevel) { |
| | | if (window.GLOB.dataFormat && !window.GLOB.mkHS) { |
| | | _format = true |
| | | |
| | | if (memberLevel >= 30) { |
| | | if (window.GLOB.memberLevel >= 30) { |
| | | radio = 20 |
| | | } else if (memberLevel >= 20) { |
| | | } else if (window.GLOB.memberLevel >= 20) { |
| | | radio = 10 |
| | | } |
| | | } |
| | |
| | | return uuid.join('') |
| | | }) () |
| | | |
| | | if (setting.borderColor) { // 边框颜色 |
| | | let style = `#${tableId} table, #${tableId} tr, #${tableId} th, #${tableId} td {border-color: ${setting.borderColor}}` |
| | | let ele = document.createElement('style') |
| | | ele.innerHTML = style |
| | | document.getElementsByTagName('head')[0].appendChild(ele) |
| | | } |
| | | // if (setting.borderColor) { // 边框颜色 |
| | | // let style = `#${tableId} table, #${tableId} tr, #${tableId} th, #${tableId} td {border-color: ${setting.borderColor}}` |
| | | // let ele = document.createElement('style') |
| | | // ele.innerHTML = style |
| | | // document.getElementsByTagName('head')[0].appendChild(ele) |
| | | // } |
| | | |
| | | let size = (setting.pageSize || 10) + '' |
| | | let pageOptions = ['10', '25', '50', '100', '500', '1000'] |
| | |
| | | rowspans, |
| | | tableId, |
| | | orderfields |
| | | }, () => { |
| | | const element = document.getElementById(tableId) |
| | | element && element.style.setProperty('--mk-table-border-color', setting.borderColor || '#e8e8e8') |
| | | element && element.style.setProperty('--mk-table-color', setting.color || 'rgba(0, 0, 0, 0.65)') |
| | | element && element.style.setProperty('--mk-table-font-size', setting.fontSize || '14px') |
| | | element && element.style.setProperty('--mk-table-font-weight', setting.fontWeight || 'normal') |
| | | }) |
| | | } |
| | | |
| | |
| | | } else if (item.linkurl) { |
| | | let src = item.linkurl |
| | | |
| | | if (src.indexOf('paramsmain/') > -1) { |
| | | try { |
| | | let _url = item.linkurl.split('paramsmain/')[0] + 'paramsmain/' |
| | | let _param = JSON.parse(window.decodeURIComponent(window.atob(item.linkurl.split('paramsmain/')[1]))) |
| | | _param.UserID = sessionStorage.getItem('UserID') |
| | | _param.LoginUID = sessionStorage.getItem('LoginUID') |
| | | _param.User_Name = sessionStorage.getItem('User_Name') |
| | | _param.param = __param |
| | | src = _url + window.btoa(window.encodeURIComponent(JSON.stringify(_param))) |
| | | } catch (e) { |
| | | console.warn('菜单参数解析错误!') |
| | | } |
| | | } else { |
| | | let con = '?' |
| | | let con = '?' |
| | | |
| | | if (/\?/ig.test(src)) { |
| | | con = '&' |
| | | } |
| | | |
| | | if (item.linkfields && item.linkfields.length > 0) { |
| | | item.linkfields.forEach(field => { |
| | | if (field.toLowerCase() === 'id') return |
| | | con += `${field}=${record[field] || ''}&` |
| | | }) |
| | | } |
| | | |
| | | src = src + `${con}id=${record.$$uuid}&appkey=${window.GLOB.appkey}&userid=${sessionStorage.getItem('UserID')}&LoginUID=${sessionStorage.getItem('LoginUID') || ''}` |
| | | if (/\?/ig.test(src)) { |
| | | con = '&' |
| | | } |
| | | |
| | | if (item.linkfields && item.linkfields.length > 0) { |
| | | item.linkfields.forEach(field => { |
| | | if (field.toLowerCase() === 'id') return |
| | | con += `${field}=${record[field] || ''}&` |
| | | }) |
| | | } |
| | | |
| | | src = src + `${con}id=${record.$$uuid}&appkey=${window.GLOB.appkey}&userid=${sessionStorage.getItem('UserID')}&LoginUID=${sessionStorage.getItem('LoginUID') || ''}` |
| | | |
| | | window.open(src) |
| | | } |
| | |
| | | let index = '' |
| | | let _activeIndex = null |
| | | if (selectedRowKeys.length > 0) { |
| | | selectedRowKeys = selectedRowKeys.filter(key => !data[key].$disabled) |
| | | index = selectedRowKeys.slice(-1)[0] |
| | | } |
| | | |
| | |
| | | |
| | | this.setState({ selectedRowKeys, activeIndex: _activeIndex }) |
| | | |
| | | let selects = this.props.data.filter((item, _index) => selectedRowKeys.includes(_index) && !item.$disabled) |
| | | let selects = data.filter((item, _index) => selectedRowKeys.includes(_index) && !item.$disabled) |
| | | |
| | | this.props.chgSelectData(selects) |
| | | if (setting.$hasSyncModule) { |
| | |
| | | if (!setting.doubleClick) return |
| | | if (record.$disabled) return |
| | | |
| | | MKEmitter.emit('triggerBtnId', setting.doubleClick, [record]) |
| | | MKEmitter.emit('triggerBtnId', setting.doubleClick, [record], 'linkbtn') |
| | | } |
| | | |
| | | render() { |
| | |
| | | } |
| | | <Table |
| | | components={components} |
| | | style={setting.style} |
| | | // style={setting.style} |
| | | size={setting.size || 'middle'} |
| | | bordered={setting.bordered !== 'false'} |
| | | rowSelection={rowSelection} |
| | |
| | | } |
| | | } |
| | | |
| | | const mapStateToProps = (state) => { |
| | | return { |
| | | menuType: state.editLevel, |
| | | memberLevel: state.memberLevel |
| | | } |
| | | } |
| | | |
| | | const mapDispatchToProps = () => { |
| | | return {} |
| | | } |
| | | |
| | | export default connect(mapStateToProps, mapDispatchToProps)(NormalTable) |
| | | export default NormalTable |