| | |
| | | import PropTypes from 'prop-types' |
| | | import {connect} from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { BackTop, notification, Spin, Tabs, Icon, Switch, Modal, Button} from 'antd' |
| | | import { BackTop, notification, Spin, Tabs, Icon, Modal, Button} from 'antd' |
| | | import moment from 'moment' |
| | | |
| | | import Api from '@/api' |
| | | import MainTable from './mainTable' |
| | | import zhCN from '@/locales/zh-CN/main.js' |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import Utils from '@/utils/utils.js' |
| | | |
| | | import FormGroup from './formgroup' |
| | | import MainAction from '@/tabviews/tableshare/actionList' |
| | | import MainSearch from '@/tabviews/tableshare/topSearch' |
| | | import SubTable from '@/tabviews/subtable' |
| | | import NotFount from '@/components/404' |
| | | import asyncComponent from '@/utils/asyncLoadComponent' |
| | | import {refreshTabView} from '@/store/action' |
| | | import zhCN from '@/locales/zh-CN/main.js' |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import './index.scss' |
| | | |
| | | const SubTabTable = asyncComponent(() => import('@/tabviews/subtabtable')) |
| | |
| | | static propTpyes = { |
| | | MenuNo: PropTypes.string, // 菜单参数 |
| | | MenuName: PropTypes.string, // 菜单参数 |
| | | MenuID: PropTypes.string // 菜单Id |
| | | MenuID: PropTypes.string, // 菜单Id |
| | | param: PropTypes.any // 主表传递参数 |
| | | } |
| | | |
| | | state = { |
| | |
| | | loadingview: true, // 页面加载中 |
| | | viewlost: false, // 页面丢失:1、未获取到配置-页面丢失;2、页面未启用 |
| | | lostmsg: '', // 页面丢失时的提示信息 |
| | | config: {}, // 页面配置信息,包括按钮、搜索、显示列、标签等 |
| | | searchlist: null, // 搜索条件 |
| | | config: {}, // 页面配置信息,包括按钮、表单、标签等 |
| | | actions: null, // 按钮集 |
| | | columns: null, // 显示列 |
| | | arr_field: '', // 使用 sPC_Get_TableData 时的查询字段集 |
| | | setting: null, // 页面全局设置:数据源、按钮及显示列固定、主键等 |
| | | data: null, // 列表数据集 |
| | | total: 0, // 总数 |
| | | loading: false, // 列表数据加载中 |
| | | pageIndex: 1, // 页码 |
| | | pageSize: 10, // 每页数据条数 |
| | |
| | | } |
| | | |
| | | let _arrField = [] // 字段集 |
| | | let _columns = [] // 显示列 |
| | | let _hideCol = [] // 隐藏及合并列中字段的uuid集 |
| | | let colMap = new Map() |
| | | |
| | | if (this.props.param && this.props.param.arr_field) { |
| | | _arrField = this.props.param.arr_field |
| | | } else { |
| | | config.groups.forEach(group => { |
| | | group.sublist.forEach(item => { |
| | | if (!item.field) return |
| | | |
| | | _arrField.push(item.field) |
| | | }) |
| | | }) |
| | | _arrField = _arrField.join(',') |
| | | } |
| | | console.log(config) |
| | | // 权限过滤 |
| | | config.action = config.action.filter(item => permAction[item.uuid]) |
| | | // config.tabgroups.forEach(group => { |
| | | // if (!config[group]) return |
| | | // config[group] = config[group].filter(tab => permAction[tab.uuid]) |
| | | // }) |
| | | |
| | | // 1、筛选字段集,2、过滤隐藏列及合并列中的字段uuid |
| | | config.columns.forEach(col => { |
| | | if (col.field) { |
| | | _arrField.push(col.field) |
| | | } |
| | | 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) |
| | | }) |
| | | |
| | | // 生成显示列,处理合并列中的字段 |
| | | config.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 _actions = config.action.filter(item => item.position === 'toolbar') // 过滤工具栏按钮 |
| | | let _operations = config.action.filter(item => item.position === 'grid') // 添加操作列(存在时) |
| | | |
| | | if (config.gridBtn && config.gridBtn.display && _operations.length > 0) { |
| | | _columns.push({ |
| | | ...config.gridBtn, |
| | | operations: _operations |
| | | }) |
| | | } |
| | | |
| | | |
| | | let _isLinkMain = false // 检查是否有与主表关联的子表 |
| | | let supmenus = {} |
| | |
| | | loadingview: false, |
| | | config: config, |
| | | setting: config.setting, |
| | | searchlist: config.search, |
| | | actions: _actions, |
| | | columns: _columns, |
| | | actions: config.action, |
| | | isLinkMain: _isLinkMain, |
| | | arr_field: _arrField.join(','), |
| | | arr_field: _arrField, |
| | | search: Utils.initMainSearch(config.search), // 搜索条件初始化(含有时间格式,需要转化) |
| | | loading: true |
| | | }, () => { |
| | |
| | | item.key = index |
| | | return item |
| | | }), |
| | | total: result.total, |
| | | loading: false, |
| | | BIDs: { |
| | | ...BIDs, |
| | |
| | | } |
| | | |
| | | let LText = `select top ${pageSize} ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by ${orderBy}) as rows from ${_dataresource} ${_search}) tmptable where rows > ${pageSize * (pageIndex - 1)} order by tmptable.rows` |
| | | let DateCount = `select count(1) as total from ${_dataresource} ${_search}` |
| | | |
| | | param.LText = Utils.formatOptions(LText) |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000' |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | param.DateCount = Utils.formatOptions(DateCount) |
| | | |
| | | return param |
| | | } |
| | |
| | | config: {}, |
| | | searchlist: null, |
| | | actions: null, |
| | | columns: null, |
| | | arr_field: '', |
| | | setting: null, |
| | | data: null, |
| | | total: 0, |
| | | loading: false, |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | |
| | | this.reloadview() |
| | | } else if (btn.popClose === 'grid' && type === 'pop') { |
| | | this.reloadtable() |
| | | } else if (type === 'excelOut') { |
| | | this.handleDefaultExcelout(btn) |
| | | } |
| | | } |
| | | |
| | |
| | | */ |
| | | handleMainTable = () => { |
| | | this.reloadtable() |
| | | } |
| | | |
| | | /** |
| | | * @description 使用默认存储过程 sPC_Get_TableData 导出excel表格 |
| | | */ |
| | | handleDefaultExcelout = (btn) => { |
| | | const { MenuName } = this.props |
| | | const { arr_field, orderColumn, orderType, search, setting, config } = this.state |
| | | |
| | | let _arr_labels = [] // 列名称集 |
| | | let _arr_label_field = [] // 列名称字段集 |
| | | |
| | | config.columns.forEach(col => { |
| | | if (col.field) { |
| | | _arr_labels.push(col.label) |
| | | _arr_label_field.push(`${col.field} as ${col.label}`) |
| | | } |
| | | }) |
| | | |
| | | _arr_labels = _arr_labels.join(',') |
| | | _arr_label_field = _arr_label_field.join(',') |
| | | |
| | | let _search = Utils.joinMainSearchkey(search) |
| | | _search = _search ? 'where ' + _search : '' |
| | | |
| | | // 获取excel数据,与获取列表数据不同为未设置页码等参数 |
| | | let param = { |
| | | func: 'sPC_Get_TableData', |
| | | obj_name: 'data', |
| | | arr_field: _arr_labels |
| | | } |
| | | |
| | | let orderBy = orderColumn ? (orderColumn + ' ' + orderType) : setting.order |
| | | let _dataresource = setting.dataresource |
| | | |
| | | if (/\s/.test(_dataresource)) { |
| | | _dataresource = '(' + _dataresource + ') tb' |
| | | } |
| | | |
| | | let LText = `select ${_arr_label_field} from (select ${arr_field} ,ROW_NUMBER() over(order by ${orderBy}) as rows from ${_dataresource} ${_search}) tmptable order by tmptable.rows` |
| | | |
| | | param.LText = Utils.formatOptions(LText) |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000' |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | param.DateCount = '' |
| | | |
| | | let name = `${MenuName}${moment().format('YYYYMMDDHHmmss')}.xlsx` |
| | | |
| | | Api.getExcelOut(param, name).then(res => { |
| | | if (res && res.status === false) { |
| | | this.refs.mainButton.execError(res, btn) |
| | | } else { |
| | | this.refs.mainButton.execSuccess(btn) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { setting, searchlist, actions, columns, loadingview, viewlost, setsingle, pickup, isLinkMain, config } = this.state |
| | | const { setting, actions, loadingview, viewlost, isLinkMain, config } = this.state |
| | | |
| | | return ( |
| | | <div className={'commontable ' + (isLinkMain ? 'pick-control' : '')} id={'commontable' + this.props.MenuID}> |
| | | {loadingview && <Spin size="large" />} |
| | | {searchlist && searchlist.length > 0 ? |
| | | <MainSearch |
| | | {config ? |
| | | <FormGroup |
| | | dict={this.state.dict} |
| | | searchlist={searchlist} |
| | | refreshdata={this.refreshbysearch} |
| | | groups={config.groups} |
| | | wrappedComponentRef={(inst) => this.formGroupRef = inst} |
| | | /> : null |
| | | } |
| | | {actions && setting.onload !== 'false' ? |
| | |
| | | triggerPopview={this.triggerPopview} |
| | | gettableselected={this.gettableselected} |
| | | /> : null |
| | | } |
| | | {columns && setting.onload !== 'false' ? |
| | | <div className="main-table-box"> |
| | | {isLinkMain ? |
| | | <div className="pickchange"> |
| | | {setting.tableType === 'checkbox' ? <Switch title="单选切换" checkedChildren="单" unCheckedChildren="多" defaultChecked={setsingle} onChange={this.checkChange} /> : null} |
| | | {this.state.BIDs.mainTable && (setting.tableType === 'radio' || setsingle) ? <Switch title="收起" checkedChildren="开" unCheckedChildren="关" defaultChecked={pickup} onChange={this.pickupChange} /> : null} |
| | | </div> : null |
| | | } |
| | | <MainTable |
| | | ref="mainTable" |
| | | pickup={pickup} |
| | | setting={setting} |
| | | columns={columns} |
| | | setsingle={setsingle} |
| | | dict={this.state.dict} |
| | | data={this.state.data} |
| | | total={this.state.total} |
| | | MenuID={this.props.MenuID} |
| | | loading={this.state.loading} |
| | | refreshdata={this.refreshbytable} |
| | | buttonTrigger={this.buttonTrigger} |
| | | handleTableId={this.handleTableId} |
| | | /> |
| | | </div> : null |
| | | } |
| | | {setting && setting.onload !== 'false' && |
| | | config.tabgroups.map(group => { |