import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import { is, fromJS } from 'immutable'
|
import { Modal, Button, notification } from 'antd'
|
import moment from 'moment'
|
|
import Api from '@/api'
|
import Utils from '@/utils/utils.js'
|
import { setLangSingleTrans } from '@/utils/utils-custom.js'
|
import SettingForm from './settingform'
|
import { queryTableSql } from '@/utils/option.js'
|
import './index.scss'
|
|
class ReplaceField extends Component {
|
static propTpyes = {
|
config: PropTypes.object,
|
updateConfig: PropTypes.func
|
}
|
|
state = {
|
visible: false,
|
loadingTable: false,
|
confirming: false,
|
tables: [],
|
}
|
|
shouldComponentUpdate (nextProps, nextState) {
|
return !is(fromJS(this.state), fromJS(nextState))
|
}
|
|
trigger = () => {
|
const { tables } = this.state
|
|
if (tables.length === 0) {
|
let param = {
|
func: 'sPC_Get_SelectedList',
|
LText: queryTableSql,
|
obj_name: 'data',
|
arr_field: 'TbName,Remark',
|
exec_type: 'x'
|
}
|
|
param.LText = Utils.formatOptions(param.LText, 'x')
|
param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
|
param.secretkey = Utils.encrypt('', param.timestamp)
|
param.open_key = Utils.encryptOpenKey(param.secretkey, param.timestamp) // 云端数据验证
|
|
if (window.GLOB.cloudServiceApi) { // 且存在云端地址
|
param.rduri = window.GLOB.cloudServiceApi
|
param.userid = sessionStorage.getItem('CloudUserID') || ''
|
param.LoginUID = sessionStorage.getItem('CloudLoginUID') || ''
|
}
|
|
this.setState({
|
loadingTable: true
|
})
|
|
Api.getSystemCacheConfig(param).then(res => {
|
if (res.status) {
|
this.setState({
|
visible: true,
|
confirming: false,
|
tables: res.data,
|
loadingTable: false
|
})
|
} else {
|
this.setState({
|
confirming: false,
|
loadingTable: false
|
})
|
notification.warning({
|
top: 92,
|
message: res.message,
|
duration: 5
|
})
|
}
|
})
|
} else {
|
this.setState({
|
confirming: false,
|
visible: true
|
})
|
}
|
}
|
|
submit = () => {
|
this.settingRef.handleConfirm().then(res => {
|
this.setState({confirming: true})
|
|
if (res.resource === 'custom') {
|
if (res.reType === 'name') {
|
let map = {[res.field.toLowerCase()]: {
|
FieldDec: res.field,
|
FieldName: res.label,
|
datatype: ''
|
}}
|
|
this.exec(map)
|
} else {
|
let map = {[res.field.toLowerCase()]: {
|
FieldDec: res.label,
|
FieldName: res.field,
|
datatype: ''
|
}}
|
|
this.execLabel(map)
|
}
|
} else if (res.resource === 'langs') {
|
this.getDicts()
|
} else {
|
let param = {func: 'sPC_Get_FieldName', TBName: res.table}
|
if (window.GLOB.cloudServiceApi) { // 且存在云端地址
|
param.rduri = window.GLOB.cloudServiceApi
|
param.userid = sessionStorage.getItem('CloudUserID') || ''
|
param.LoginUID = sessionStorage.getItem('CloudLoginUID') || ''
|
}
|
|
Api.getSystemCacheConfig(param).then(result => {
|
if (!result.status) {
|
this.setState({
|
confirming: false
|
})
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
return
|
}
|
|
if (res.reType === 'name') {
|
let map = {}
|
|
result.FDName.forEach(item => {
|
if (!item.FieldDec) return
|
if (/NVARCHAR|INT|Decimal/ig.test(item.FieldType)) {
|
item.datatype = item.FieldType
|
}
|
map[item.FieldDec.toLowerCase()] = item
|
})
|
|
this.exec(map)
|
} else {
|
let map = {}
|
|
result.FDName.forEach(item => {
|
if (!item.FieldName) return
|
map[item.FieldName.toLowerCase()] = item
|
})
|
|
this.execLabel(map)
|
}
|
})
|
}
|
})
|
}
|
|
getDicts = () => {
|
let sql = `select mother_tongue as reg,translation as value,use_type as type,case when use_type='menu' then '菜单' when use_type='button' then '按钮' when use_type='title' then '标题' when use_type='list' then '选项' else '文本' end as use_type_text from s_app_lang_translation where appkey=@appkey@ and deleted=0 and translation != '' and lang='${sessionStorage.getItem('lang') || ''}'`
|
|
let param = {
|
func: 'sPC_Get_SelectedList',
|
LText: Utils.formatOptions(sql, 'x'),
|
obj_name: 'data',
|
arr_field: 'reg,value,type',
|
exec_type: 'x'
|
}
|
|
param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
|
param.secretkey = Utils.encrypt('', param.timestamp)
|
param.open_key = Utils.encryptOpenKey(param.secretkey, param.timestamp)
|
|
this.$Api.getCloudConfig(param).then(result => {
|
if (!result.status) {
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
this.setState({
|
confirming: false
|
})
|
return
|
} else if (!result.data || result.data.length === 0) {
|
notification.warning({
|
top: 92,
|
message: '替换数据为空,请检查当前语言下是否存在语言包!',
|
duration: 5
|
})
|
this.setState({
|
confirming: false
|
})
|
return
|
}
|
|
let btnDict = {}
|
let titDict = {}
|
let lisDict = {}
|
let menuDict = {}
|
let regs = []
|
|
result.data.forEach(item => {
|
if (item.type === 'button') {
|
btnDict[item.reg] = item.value
|
} else if (item.type === 'title') {
|
titDict[item.reg] = item.value
|
} else if (item.type === 'list') {
|
lisDict[item.reg] = item.value
|
} else if (item.type === 'text') {
|
regs.push({reg: new RegExp(item.reg, 'g'), value: item.value, sort: item.reg.length})
|
} else if (item.type === 'menu') {
|
menuDict[item.reg] = item.value
|
}
|
})
|
|
regs.sort((a, b) => b.sort - a.sort)
|
|
let config = fromJS(this.props.config).toJS()
|
|
setLangSingleTrans(config, btnDict, titDict, lisDict, menuDict, regs)
|
|
this.setState({
|
confirming: false,
|
visible: false
|
})
|
|
if (is(fromJS(this.props.config), fromJS(config))) {
|
notification.success({
|
top: 92,
|
message: '未发现需要替换的信息。',
|
duration: 3
|
})
|
return
|
}
|
|
notification.success({
|
top: 92,
|
message: '替换已完成。',
|
duration: 3
|
})
|
this.props.updateConfig(config)
|
})
|
}
|
|
// 依据原字段替换为新字段
|
exec = (map) => {
|
let config = fromJS(this.props.config).toJS()
|
|
let getVal = (val) => {
|
let _val = val.toLowerCase()
|
if (map[_val]) {
|
return map[_val].FieldName
|
}
|
return val
|
}
|
|
let resetForm = (m) => {
|
if (m.field) {
|
m.field = getVal(m.field)
|
}
|
if (m.type === 'split' && m.splitctrl) {
|
m.splitctrl = getVal(m.splitctrl)
|
}
|
if (m.tabField) {
|
m.tabField = getVal(m.tabField)
|
}
|
if (m.linkField) {
|
m.linkField = getVal(m.linkField)
|
}
|
if (m.supField) {
|
m.supField = getVal(m.supField)
|
}
|
if (m.phoneField) {
|
m.phoneField = getVal(m.phoneField)
|
}
|
if (m.linkSubField) {
|
m.linkSubField = m.linkSubField.map(n => getVal(n))
|
m.linkSubField = Array.from(new Set(m.linkSubField))
|
}
|
}
|
let resetMark = (m) => {
|
m.marks = m.marks.map(n => {
|
if (n.field && Array.isArray(n.field)) {
|
if (n.field[1] === 'static') {
|
n.field[0] = getVal(n.field[0])
|
} else {
|
if (n.field[0]) {
|
n.field[0] = getVal(n.field[0])
|
}
|
if (n.field[2]) {
|
n.field[2] = getVal(n.field[2])
|
}
|
}
|
}
|
|
return n
|
})
|
}
|
let resetElement = (m) => {
|
if (m.field) {
|
m.field = getVal(m.field)
|
}
|
if (m.posterField) {
|
m.posterField = getVal(m.posterField)
|
}
|
if (m.bgImage) {
|
m.bgImage = getVal(m.bgImage)
|
}
|
if (m.linkurl && /^[a-zA-Z0-9_]+$/.test(m.linkurl)) {
|
m.linkurl = getVal(m.linkurl)
|
}
|
if (m.modal && m.modal.fields) {
|
if (m.modal.setting) {
|
if (m.modal.setting.focus) {
|
m.modal.setting.focus = getVal(m.modal.setting.focus)
|
}
|
if (m.modal.setting.errFocus) {
|
m.modal.setting.errFocus = getVal(m.modal.setting.errFocus)
|
}
|
}
|
m.modal.fields = m.modal.fields.map(col => {
|
resetForm(col)
|
return col
|
})
|
}
|
if (m.verify) {
|
if (m.verify.columns) {
|
m.verify.columns = m.verify.columns.map(col => {
|
if (col.Column) {
|
col.Column = getVal(col.Column)
|
}
|
return col
|
})
|
}
|
if (m.verify.uniques) {
|
m.verify.uniques = m.verify.uniques.map(col => {
|
if (col.field) {
|
col.field = col.field.split(',').map(_field => {
|
if (_field === 'BID') return _field
|
return getVal(_field)
|
}).join(',')
|
}
|
return col
|
})
|
}
|
if (m.verify.billcodes) {
|
m.verify.billcodes = m.verify.billcodes.map(col => {
|
if (col.field) {
|
col.field = getVal(col.field)
|
}
|
if (col.linkField && col.linkField !== 'BID') {
|
col.linkField = getVal(col.linkField)
|
}
|
return col
|
})
|
}
|
|
if (m.verify.accountfield && m.verify.accountfield !== 'BID') {
|
m.verify.accountfield = getVal(m.verify.accountfield)
|
}
|
if (m.verify.voucher && m.verify.voucher.linkField && m.verify.voucher.linkField !== 'BID') {
|
m.verify.voucher.linkField = getVal(m.verify.voucher.linkField)
|
}
|
}
|
if (m.controlField) {
|
m.controlField = getVal(m.controlField)
|
}
|
|
if (m.marks && m.marks.length) {
|
resetMark(m)
|
}
|
|
if (m.config && m.config.components) {
|
m.config.components = _replace(m.config.components)
|
}
|
}
|
|
let _replace = (components) => {
|
return components.map(item => {
|
if (item.type === 'tabs') {
|
item.subtabs.forEach(tab => {
|
tab.components = _replace(tab.components)
|
})
|
return item
|
} else if (item.type === 'group') {
|
item.components = _replace(item.components)
|
return item
|
}
|
|
if (item.columns) {
|
item.columns = item.columns.map(col => {
|
let cell = map[col.field.toLowerCase()]
|
if (cell) {
|
col.field = cell.FieldName
|
if (cell.datatype) {
|
col.datatype = cell.datatype
|
}
|
}
|
return col
|
})
|
}
|
if (item.search) {
|
item.search = item.search.map(col => {
|
if (col.field) {
|
col.field = getVal(col.field)
|
}
|
return col
|
})
|
}
|
|
if (item.action) {
|
item.action.forEach(m => {
|
resetElement(m)
|
})
|
}
|
|
if (item.subcards) {
|
item.subcards.forEach(card => {
|
if (card.setting) {
|
if (card.setting.controlField) {
|
card.setting.controlField = getVal(card.setting.controlField)
|
}
|
if (card.setting.bgField) {
|
card.setting.bgField = getVal(card.setting.bgField)
|
}
|
if (card.setting.menuType) {
|
card.setting.menuType = getVal(card.setting.menuType)
|
}
|
}
|
|
if (card.elements) { // 卡片
|
card.elements = card.elements.map(m => {
|
resetElement(m)
|
return m
|
})
|
}
|
|
if (card.backElements) { // 卡片
|
card.backElements = card.backElements.map(m => {
|
resetElement(m)
|
return m
|
})
|
}
|
|
if (card.fields) { // 表单
|
card.fields = card.fields.map(m => {
|
resetForm(m)
|
return m
|
})
|
}
|
|
if (card.subButton) {
|
resetElement(card.subButton)
|
|
if (card.subButton.resetForms) {
|
card.subButton.resetForms = card.subButton.resetForms.map(n => getVal(n))
|
}
|
}
|
})
|
}
|
|
if (item.elements) {
|
item.elements = item.elements.map(m => {
|
resetElement(m)
|
return m
|
})
|
}
|
|
if (item.plot) {
|
if (item.plot.Xaxis) {
|
item.plot.Xaxis = getVal(item.plot.Xaxis)
|
}
|
// 统计图
|
if (item.plot.InfoValue) {
|
item.plot.InfoValue = getVal(item.plot.InfoValue)
|
}
|
if (item.plot.InfoType) {
|
item.plot.InfoType = getVal(item.plot.InfoType)
|
}
|
// 占比图
|
if (item.plot.valueField) {
|
item.plot.valueField = getVal(item.plot.valueField)
|
}
|
if (item.plot.labelField) {
|
item.plot.labelField = getVal(item.plot.labelField)
|
}
|
// 饼图
|
if (item.plot.type) {
|
item.plot.type = getVal(item.plot.type)
|
}
|
// 散点图
|
if (item.plot.gender) {
|
item.plot.gender = getVal(item.plot.gender)
|
}
|
if (item.Yaxis) {
|
if (Array.isArray(item.Yaxis)) {
|
item.Yaxis = item.Yaxis.map(m => getVal(m))
|
} else {
|
item.Yaxis = getVal(item.Yaxis)
|
}
|
}
|
}
|
|
if (item.cols) {
|
let _update = (cols) => {
|
return cols.map(col => {
|
if (col.type === 'custom' && col.elements) {
|
col.elements = col.elements.map(m => {
|
resetElement(m)
|
return m
|
})
|
} else if (col.type === 'colspan') {
|
col.subcols = _update(col.subcols)
|
} else if (col.field) {
|
col.field = getVal(col.field)
|
}
|
|
return col
|
})
|
}
|
|
item.cols = _update(item.cols)
|
|
if (item.lineMarks) {
|
item.lineMarks = item.lineMarks.map(n => {
|
if (n.field && Array.isArray(n.field)) {
|
if (n.field[1] === 'static') {
|
n.field[0] = getVal(n.field[0])
|
} else {
|
if (n.field[0]) {
|
n.field[0] = getVal(n.field[0])
|
}
|
if (n.field[2]) {
|
n.field[2] = getVal(n.field[2])
|
}
|
}
|
}
|
|
return n
|
})
|
}
|
}
|
|
if (item.subMenus) {
|
item.subMenus = item.subMenus.map(m => {
|
if (m.setting && m.setting.tip) {
|
m.setting.tip = getVal(m.setting.tip)
|
}
|
return m
|
})
|
}
|
|
if (item.wrap) {
|
if (item.wrap.field) {
|
item.wrap.field = getVal(item.wrap.field)
|
}
|
if (item.wrap.tipField) {
|
item.wrap.tipField = getVal(item.wrap.tipField)
|
}
|
if (item.wrap.controlField) {
|
item.wrap.controlField = getVal(item.wrap.controlField)
|
}
|
if (item.wrap.valueField) {
|
item.wrap.valueField = getVal(item.wrap.valueField)
|
}
|
if (item.wrap.labelField) {
|
item.wrap.labelField = getVal(item.wrap.labelField)
|
}
|
if (item.wrap.parentField) {
|
item.wrap.parentField = getVal(item.wrap.parentField)
|
}
|
if (item.wrap.broadcast) {
|
item.wrap.broadcast = getVal(item.wrap.broadcast)
|
}
|
if (item.wrap.jumpField) {
|
item.wrap.jumpField = getVal(item.wrap.jumpField)
|
}
|
if (item.wrap.link) {
|
item.wrap.link = getVal(item.wrap.link)
|
}
|
if (item.wrap.linkField) {
|
item.wrap.linkField = getVal(item.wrap.linkField)
|
}
|
if (item.wrap.focus) {
|
item.wrap.focus = getVal(item.wrap.focus)
|
}
|
if (item.wrap.refocus) {
|
item.wrap.refocus = getVal(item.wrap.refocus)
|
}
|
if (item.wrap.statusControl) {
|
item.wrap.statusControl = getVal(item.wrap.statusControl)
|
}
|
if (item.wrap.timeField) {
|
item.wrap.timeField = getVal(item.wrap.timeField)
|
}
|
if (item.wrap.endField) {
|
item.wrap.endField = getVal(item.wrap.endField)
|
}
|
if (item.wrap.remarkField) {
|
item.wrap.remarkField = getVal(item.wrap.remarkField)
|
}
|
if (item.wrap.colorField) {
|
item.wrap.colorField = getVal(item.wrap.colorField)
|
}
|
if (item.wrap.menuType) {
|
item.wrap.menuType = getVal(item.wrap.menuType)
|
}
|
|
if (item.type === 'timeline') {
|
if (item.wrap.label) {
|
item.wrap.label = getVal(item.wrap.label)
|
}
|
if (item.wrap.node) {
|
item.wrap.node = getVal(item.wrap.node)
|
}
|
}
|
}
|
|
return item
|
})
|
}
|
|
config.components = _replace(config.components)
|
|
config.interfaces && config.interfaces.forEach(item => {
|
if (item.columns) {
|
item.columns = item.columns.map(col => {
|
let cell = map[col.field.toLowerCase()]
|
if (cell) {
|
col.field = cell.FieldName
|
if (cell.datatype) {
|
col.datatype = cell.datatype
|
}
|
}
|
return col
|
})
|
}
|
})
|
|
this.setState({
|
confirming: false,
|
visible: false
|
})
|
|
if (is(fromJS(this.props.config), fromJS(config))) {
|
notification.success({
|
top: 92,
|
message: '未查询到需要替换的字段。',
|
duration: 3
|
})
|
return
|
}
|
|
notification.success({
|
top: 92,
|
message: '更新已完成。',
|
duration: 3
|
})
|
this.props.updateConfig(config)
|
}
|
|
// 依据字段替换名称
|
execLabel = (map) => {
|
let config = fromJS(this.props.config).toJS()
|
|
let _replace = (components) => {
|
return components.map(item => {
|
if (item.type === 'tabs') {
|
item.subtabs.forEach(tab => {
|
tab.components = _replace(tab.components)
|
})
|
return item
|
} else if (item.type === 'group') {
|
item.components = _replace(item.components)
|
return item
|
}
|
|
if (item.columns) {
|
item.columns = item.columns.map(col => {
|
if (col.field && map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
if (item.search) {
|
item.search = item.search.map(col => {
|
if (col.field && map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
|
if (item.action) {
|
item.action.forEach(m => {
|
if (m.modal && m.modal.fields) {
|
m.modal.fields = m.modal.fields.map(col => {
|
if (col.field && map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
if (m.verify && m.verify.columns) {
|
m.verify.columns = m.verify.columns.map(col => {
|
if (col.Column && map[col.Column.toLowerCase()]) {
|
col.Text = map[col.Column.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
if (m.config && m.config.components) {
|
m.config.components = _replace(m.config.components)
|
}
|
})
|
}
|
|
if (item.cols) {
|
let _update = (cols) => {
|
return cols.map(col => {
|
if (col.type === 'custom' && col.elements) {
|
col.elements = col.elements.map(m => {
|
if (m.eleType === 'button') {
|
if (m.modal && m.modal.fields) {
|
m.modal.fields = m.modal.fields.map(col => {
|
if (col.field && map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
if (m.verify && m.verify.columns) {
|
m.verify.columns = m.verify.columns.map(col => {
|
if (col.Column && map[col.Column.toLowerCase()]) {
|
col.Text = map[col.Column.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
if (m.config && m.config.components) {
|
m.config.components = _replace(m.config.components)
|
}
|
}
|
|
return m
|
})
|
} else if (col.type === 'colspan') {
|
col.subcols = _update(col.subcols)
|
} else if (col.field) {
|
if (map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
}
|
|
return col
|
})
|
}
|
|
item.cols = _update(item.cols)
|
}
|
|
return item
|
})
|
}
|
|
config.components = _replace(config.components)
|
|
config.interfaces && config.interfaces.forEach(item => {
|
if (item.columns) {
|
item.columns = item.columns.map(col => {
|
if (col.field && map[col.field.toLowerCase()]) {
|
col.label = map[col.field.toLowerCase()].FieldDec
|
}
|
return col
|
})
|
}
|
})
|
|
this.setState({
|
confirming: false,
|
visible: false
|
})
|
|
if (is(fromJS(this.props.config), fromJS(config))) {
|
notification.success({
|
top: 92,
|
message: '未查询到需要替换的字段。',
|
duration: 3
|
})
|
return
|
}
|
|
notification.success({
|
top: 92,
|
message: '更新已完成。',
|
duration: 3
|
})
|
this.props.updateConfig(config)
|
}
|
|
render() {
|
const { visible, loadingTable, tables, confirming } = this.state
|
|
return (
|
<>
|
<Button className="mk-border-yellow" icon="swap" loading={loadingTable} onClick={this.trigger}>字段替换</Button>
|
<Modal
|
title="字段替换"
|
wrapClassName="replace-field-modal"
|
visible={visible}
|
width={600}
|
maskClosable={false}
|
onOk={this.submit}
|
onCancel={() => { this.setState({ visible: false })}}
|
confirmLoading={confirming}
|
destroyOnClose
|
>
|
<SettingForm tables={tables} wrappedComponentRef={(inst) => this.settingRef = inst}/>
|
</Modal>
|
</>
|
)
|
}
|
}
|
|
export default ReplaceField
|