import React, {Component} from 'react'
|
import PropTypes from 'prop-types'
|
import {connect} from 'react-redux'
|
import { Button, Affix, Modal, notification } from 'antd'
|
import MutilForm from '@/components/mutilform'
|
import {modifyTabview} from '@/store/action'
|
import Api from '@/api'
|
import './index.scss'
|
|
const { confirm } = Modal
|
|
class MainAction extends Component {
|
static propTpyes = {
|
MenuNo: PropTypes.string, // 菜单参数
|
columns: PropTypes.array, // 显示列用于表单列
|
actions: PropTypes.array, // 搜索条件列表
|
dict: PropTypes.object, // 字典项
|
mainKey: PropTypes.array
|
}
|
|
state = {
|
visible: false, // 弹窗是否显示
|
formdata: null, // 表单显示列数据
|
tabledata: null, // 列表选择数据
|
confirmLoading: false, // 确认中
|
execAction: null, // 执行按钮属性
|
primarykey: null, // 主键
|
bidkey: null, // BID
|
defaultproc: { // 默认添加、修改、删除存储过程
|
Add: 'sDataManageAdd',
|
Update: 'sDataManageUpt',
|
Delete: 'sDataManageDel'
|
}
|
}
|
|
submitaction = (action, datalist, primarykey, bidkey) => {
|
if (action.Ot === 'requiredSgl' || action.Ot === 'requiredOnce') { // 选择单行或多行id拼接执行
|
let ids = datalist.map(data => {
|
return data[primarykey]
|
})
|
let bids = null
|
if (bidkey) {
|
bids = datalist.map(data => {
|
return data[bidkey] || ''
|
})
|
}
|
return Api.submitInterface({
|
func: action.AuditProc || this.state.defaultproc[action.Action],
|
ID: ids.join(','), // 主键字段
|
BID: bids ? bids.join(',') : '' // BID字段
|
})
|
} else if (action.Ot === 'required') { // 可选多行，循环执行
|
let deffers = datalist.map(data => {
|
return new Promise((resolve, reject) => {
|
Api.submitInterface({
|
func: action.AuditProc || this.state.defaultproc[action.Action],
|
ID: data[primarykey], // 主键字段
|
BID: data[bidkey] || '' // BID字段
|
}).then(res => {
|
resolve(res)
|
})
|
})
|
})
|
return Promise.all(deffers)
|
} else { // 不选行
|
return Api.submitInterface({
|
func: action.AuditProc || this.state.defaultproc[action.Action],
|
ID: '', // 主键字段
|
BID: '' // BID字段
|
})
|
}
|
}
|
actionTrigger = (item) => {
|
let _this = this
|
let datalist = this.props.gettableselected() || []
|
|
/************* 校验列表数据选择是否正确 **************/
|
|
if ((item.Ot === 'requiredSgl' || item.Ot === 'required' || item.Ot === 'requiredOnce') && datalist.length === 0) {
|
// 需要选择行时，校验数据
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.confirm.selectline'],
|
duration: 10
|
})
|
return
|
} else if (item.Ot === 'requiredSgl' && datalist.length > 1) {
|
// 需要选择单行时，校验数据
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.confirm.selectSingleLine'],
|
duration: 10
|
})
|
return
|
}
|
|
/************* 校验主键与BID **************/
|
let ID = []
|
let BID = []
|
if (item.Ot === 'requiredSgl' || item.Ot === 'required' || item.Ot === 'requiredOnce') {
|
this.props.mainKey.forEach(key => {
|
if (key.IDField === '1') {
|
ID.push(key.FieldName)
|
} else {
|
BID.push(key.FieldName)
|
}
|
})
|
|
if (ID.length === 0) { // 主键校验
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.primarykey.required'],
|
duration: 10
|
})
|
return
|
} else if (ID.length > 1) {
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.primarykey.repetition'],
|
duration: 10
|
})
|
return
|
}
|
|
if (BID.length > 1) { // BID校验
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.primarykey.repetitionbid'],
|
duration: 10
|
})
|
return
|
}
|
}
|
|
/********************* 操作处理 **********************/
|
|
if (item.OpenType === 'prompt') { // 确认框
|
confirm({
|
title: this.props.dict['main.action.confirm.tip'],
|
onOk() {
|
return _this.submitaction(item, datalist, ID[0], (BID.length === 1 ? BID[0] : ''))
|
.then(res => {
|
if (Array.isArray(res)) {
|
let iserror = false
|
res.forEach(result => {
|
if (!result.status && !iserror) {
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 15
|
})
|
iserror = true
|
}
|
})
|
if (!iserror) {
|
notification.success({
|
top: 92,
|
message: _this.props.dict['main.action.confirm.success']
|
})
|
|
_this.props.refreshdata(item.ReloadForm) // 刷新页面
|
}
|
} else {
|
if (res.status) {
|
notification.success({
|
top: 92,
|
message: _this.props.dict['main.action.confirm.success']
|
})
|
|
_this.props.refreshdata(item.ReloadForm) // 刷新页面
|
} else {
|
notification.error({
|
top: 92,
|
message: res.message,
|
duration: 15
|
})
|
}
|
}
|
})
|
},
|
onCancel() {}
|
})
|
} else if (item.OpenType === 'execproc') { // 直接执行
|
this.submitaction(item, datalist, ID[0], (BID.length === 1 ? BID[0] : ''))
|
.then(res => {
|
if (Array.isArray(res)) {
|
let iserror = false
|
res.forEach(result => {
|
if (!result.status && !iserror) {
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 15
|
})
|
iserror = true
|
}
|
})
|
if (!iserror) {
|
notification.success({
|
top: 92,
|
message: this.props.dict['main.action.confirm.success']
|
})
|
|
this.props.refreshdata(item.ReloadForm) // 刷新页面
|
}
|
} else {
|
if (res.status) {
|
notification.success({
|
top: 92,
|
message: this.props.dict['main.action.confirm.success']
|
})
|
|
this.props.refreshdata(item.ReloadForm) // 刷新页面
|
} else {
|
notification.error({
|
top: 92,
|
message: res.message,
|
duration: 15
|
})
|
}
|
}
|
})
|
} else if (item.OpenType === 'newpage') { // 打开新页面
|
let src = '#/' + item.LinkUrl + '?param=' + window.btoa(JSON.stringify({UserId: sessionStorage.getItem('UserID'), ID: datalist[0][ID[0]], BID: BID.length === 1 ? datalist[0][BID[0]] : ''}))
|
window.open(src)
|
} else if (item.OpenType === 'pop') { // 模态框
|
this.setState({
|
formdata: this.props.columns.map(column => {
|
column.readonly = false
|
if (column.ReadOnly.includes(item.MenuID)) {
|
column.readonly = true
|
}
|
return column
|
}),
|
visible: true,
|
execAction: item,
|
primarykey: ID[0],
|
bidkey: BID.length === 1 ? BID[0] : '',
|
tabledata: datalist[0] || ''
|
})
|
} else if (item.OpenType === 'tab') { // 打开新标签页
|
let menu = {
|
MenuNo: this.props.MenuNo,
|
MenuID: item.MenuID,
|
MenuName: item.MenuName,
|
type: 'TabForm',
|
param: {
|
formdata: this.props.columns.map(column => {
|
column.readonly = false
|
if (column.ReadOnly.includes(item.MenuID)) {
|
column.readonly = true
|
}
|
return column
|
}),
|
execAction: item,
|
primarykey: ID[0],
|
bidkey: BID.length === 1 ? BID[0] : '',
|
tabledata: datalist[0] || '',
|
defaultproc: this.state.defaultproc,
|
dict: this.props.dict
|
}
|
}
|
let tabs = JSON.parse(JSON.stringify(this.props.tabviews))
|
let _index = null
|
let isexit = false
|
tabs = tabs.map((tab, index) => {
|
tab.selected = false
|
if (tab.MenuNo === this.props.MenuNo && tab.MenuID === item.MenuID) {
|
isexit = true
|
tab.selected = true
|
tab.param = menu.param
|
} else if (tab.MenuNo === this.props.MenuNo && tab.type !== 'TabForm') {
|
_index = index
|
menu.MenuName = tab.MenuName + '-' + menu.MenuName
|
menu.selected = true
|
}
|
return tab
|
})
|
if (!isexit) {
|
tabs.splice(_index + 1, 0, menu)
|
}
|
this.props.modifyTabview(tabs)
|
} else if (item.OpenType === 'blank') { // 当前页面跳转
|
this.props.switchformview({
|
formdata: this.props.columns.map(column => {
|
column.readonly = false
|
if (column.ReadOnly.includes(item.MenuID)) {
|
column.readonly = true
|
}
|
return column
|
}),
|
execAction: item,
|
primarykey: ID[0],
|
bidkey: BID.length === 1 ? BID[0] : '',
|
tabledata: datalist[0] || '',
|
defaultproc: this.state.defaultproc
|
})
|
} else {
|
notification.warning({
|
top: 92,
|
message: this.props.dict['main.action.settingerror'],
|
duration: 10
|
})
|
}
|
}
|
|
getModels = () => {
|
// 获取弹窗表单信息
|
if (!this.state.execAction) return
|
let cols = +this.state.execAction.FormLineQty
|
if (![1, 2, 3].includes(cols)) {
|
cols = 2
|
}
|
return (
|
<Modal
|
wrapClassName='action-modal'
|
title={this.state.execAction.MenuName || ''}
|
visible={this.state.visible}
|
width={document.body.clientWidth * this.state.execAction.PopWidth}
|
onOk={this.handleOk}
|
confirmLoading={this.state.confirmLoading}
|
onCancel={this.handleCancel}
|
>
|
{this.state.formdata &&
|
<MutilForm
|
dict={this.props.dict}
|
formlist={this.state.formdata}
|
data={this.state.tabledata}
|
cols={cols}
|
wrappedComponentRef={(inst) => this.formRef = inst}
|
/>}
|
</Modal>
|
)
|
}
|
|
handleOk = () => {
|
this.formRef.handleConfirm().then(res => {
|
this.setState({
|
confirmLoading: true
|
})
|
let values = []
|
// 从表单中获取填写数据
|
this.props.columns.forEach(column => {
|
let value = ''
|
if (res.hasOwnProperty(column.FieldName)) { // 依次选取表单值、初始值
|
value = res[column.FieldName]
|
} else if (column.InitVal) {
|
value = column.InitVal
|
}
|
values.push(value)
|
})
|
|
let queryparam = { // 请求参数
|
func: this.state.execAction.AuditProc || this.state.defaultproc[this.state.execAction.Action],
|
ID: (this.state.tabledata && this.state.primarykey) ? this.state.tabledata[this.state.primarykey] : '', // 主键字段
|
BID: (this.state.tabledata && this.state.bidkey) ? this.state.tabledata[this.state.bidkey] : '' // BID字段
|
}
|
// 添加和修改请求参数字段不同
|
if (this.state.execAction.Action === 'Add') {
|
queryparam.AddLongText = values.join(',')
|
} else if (this.state.execAction.Action === 'Update') {
|
queryparam.UptLongText = values.join(',')
|
}
|
|
// 提交请求
|
Api.submitInterface(queryparam).then(result => {
|
if (result.status) {
|
notification.success({
|
top: 92,
|
message: this.props.dict['main.action.confirm.success']
|
})
|
this.setState({
|
confirmLoading: false,
|
visible: false
|
})
|
|
this.props.refreshdata(this.state.execAction.ReloadForm) // 刷新页面
|
} else {
|
this.setState({
|
confirmLoading: false
|
})
|
notification.error({
|
top: 92,
|
message: result.message,
|
duration: 15
|
})
|
}
|
})
|
}, () => {})
|
}
|
|
handleCancel = () => {
|
// 取消
|
this.setState({
|
confirmLoading: false,
|
visible: false
|
})
|
this.formRef.handleReset()
|
}
|
|
render() {
|
return (
|
<Affix offsetTop={48}>
|
<div className="button-list" id={this.props.MenuNo + 'mainaction'}>
|
{this.props.actions.map((item, index) => {
|
return (
|
<Button
|
className={'mk-btn ' + item.CssClass + ' mk-' + item.CssClass}
|
icon={item.Icon}
|
key={'action' + index}
|
onClick={() => {this.actionTrigger(item)}}
|
>{item.MenuName}</Button>
|
)
|
})}
|
{this.getModels()}
|
</div>
|
</Affix>
|
)
|
}
|
}
|
|
const mapStateToProps = (state) => {
|
return {
|
tabviews: state.tabviews
|
}
|
}
|
|
const mapDispatchToProps = (dispatch) => {
|
return {
|
modifyTabview: (tabviews) => dispatch(modifyTabview(tabviews))
|
}
|
}
|
|
export default connect(mapStateToProps, mapDispatchToProps)(MainAction)
|
