Skip to content

W
WebPublic
提交 5822ea6d authored 作者: 钟是志's avatar 钟是志
浏览文件
操作

28008 生源地统计页面显示调整

上级 1e1e429f
隐藏空白字符变更
内嵌 并排
正在显示 包含 1538 行增加 和 1436 行删除
one_stop_public/libs/TableList.js
浏览文件 @ 5822ea6d
...@@ -63,7 +63,7 @@ export default class TableList extends React.Component { ...@@ -63,7 +63,7 @@ export default class TableList extends React.Component {
} }
render() { render() {
const { isTree, json } = this.props; const { isTree, json, uuid } = this.props;
const { showNo } = this.state; const { showNo } = this.state;
if(showNo){ if(showNo){
return null; return null;
...@@ -84,6 +84,7 @@ export default class TableList extends React.Component { ...@@ -84,6 +84,7 @@ export default class TableList extends React.Component {
rights={this.props.rights || []} rights={this.props.rights || []}
objCode={this.props.objCode} objCode={this.props.objCode}
isFormCom={true} isFormCom={true}
uuid={uuid}
sql={this.props.sql} sql={this.props.sql}
/> />
) : ( ) : (
...@@ -102,6 +103,7 @@ export default class TableList extends React.Component { ...@@ -102,6 +103,7 @@ export default class TableList extends React.Component {
rights={this.props.rights || []} rights={this.props.rights || []}
objCode={this.props.objCode} objCode={this.props.objCode}
isFormCom={true} isFormCom={true}
uuid={uuid}
sql={this.props.sql} sql={this.props.sql}
/> />
); );
......
one_stop_public/libs/formList/countWidth.js 0 → 100644
浏览文件 @ 5822ea6d
export default function countWidth({
json,
uuid,
}) {
let showDiv = 500;
if (json.twidth) {
// 列表宽度配置项 在 组件的 扩展的配置里面
showDiv = json.twidth;
console.log(showDiv);
return showDiv;
}
if (document.getElementsByClassName('ant-layout-content')?.length) {
// 这是大学工项目 容器元素的宽度
showDiv = document.getElementsByClassName('ant-layout-content')[0].clientWidth - 100;
// console.log(showDiv);
}
if (document.querySelector('#mobelDiv')) {
showDiv = document.querySelector('#mobelDiv')?.parentNode.clientWidth;
// 这个是一站式的元素的宽度
}
changeVisitor(json, uuid);
return showDiv;
}
/**
* json
* uuid
* 变动观察器
* 解决禅道 28008 生源地统计页面显示调整
*/
function changeVisitor(json, uuid) {
if (!uuid) {
return null;
}
let dom = document.querySelector(`td[data-cell-id="${uuid}"]`);
if (!dom) {
return null;
}
const targetNode = dom;
// 配置器的配置：需要监听的变动
const config = {
characterData: true, // 监视指定目标节点或子节点树中节点所包含的字符数据的变化 无默认值。
subtree: true, // 观察后代节点，默认为 false
childList: true, // 观察目标子节点的变化，是否有添加或者删除
};
// 变动时回调
const callback = function (mutations) {
if(!json.twidth){
let dxx = document.querySelector(`td[data-cell-id="${uuid}"] .mobelDivClassName`);
if(dxx && dxx.style.width === '500px'){
dxx.style.width = document.querySelector(`td[data-cell-id="${uuid}"] .mobelDivClassName`)?.parentNode.clientWidth + 'px';
}
}
};
// 创建一个MutationObserver实例
const observer = new MutationObserver(callback);
// 监听目标节点
observer.observe(targetNode, config);
// observer.disconnect()
}
one_stop_public/libs/formList/index.js
浏览文件 @ 5822ea6d
import React, { Fragment } from 'react'; import React, { Fragment } from 'react';
import { import {
Button, Button,
Card, Card,
DatePicker, DatePicker,
Divider, Divider,
Form, Form,
Row, Row,
Col, Col,
Input, Input,
message, message,
Select, Select,
Tooltip, Tooltip,
Spin, Spin,
Popover, Popover,
Checkbox, Checkbox,
} from 'antd'; } from 'antd';
import { connect } from 'dva'; import { connect } from 'dva';
import PageHeaderWrapper from './PageHeaderWrapper'; import PageHeaderWrapper from './PageHeaderWrapper';
...@@ -35,6 +35,7 @@ import { cloneDeep } from '../../copy/index'; ...@@ -35,6 +35,7 @@ import { cloneDeep } from '../../copy/index';
import { getPopconfirm, getModal } from '@/webPublic/one_stop_public/utils/utils'; import { getPopconfirm, getModal } from '@/webPublic/one_stop_public/utils/utils';
import { text, number, date } from '@/webPublic/one_stop_public/libs/formList/config'; import { text, number, date } from '@/webPublic/one_stop_public/libs/formList/config';
import { FormListButtons } from '@/webPublic/one_stop_public/libs/formList/SplitIndex'; import { FormListButtons } from '@/webPublic/one_stop_public/libs/formList/SplitIndex';
import countWidth from '@/webPublic/one_stop_public/libs/formList/countWidth';
const FormItem = Form.Item; const FormItem = Form.Item;
const Popconfirm = getPopconfirm(); const Popconfirm = getPopconfirm();
...@@ -43,1042 +44,1080 @@ let AllWidth = 0; // 表格总长度 ...@@ -43,1042 +44,1080 @@ let AllWidth = 0; // 表格总长度
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
const CreateForm = Form.create()((props) => { const CreateForm = Form.create()((props) => {
const { const {
modalVisible, modalVisible,
form, form,
handleAdd, handleAdd,
formData, formData,
isAdd, isAdd,
handleModalVisible, handleModalVisible,
formItem, formItem,
getItem, getItem,
isView, isView,
} = props; } = props;
//通过回调 //通过回调
const okHandle = () => { const okHandle = () => {
form.validateFields((err, fieldsValue) => { form.validateFields((err, fieldsValue) => {
if (err) return; if (err) return;
if (isView) { if (isView) {
handleModalVisible(); handleModalVisible();
return; return;
} }
formItem.map((item, index) => { formItem.map((item, index) => {
if (item.type.indexOf('DATE') > -1) { if (item.type.indexOf('DATE') > -1) {
for (let d in fieldsValue) { for (let d in fieldsValue) {
if (item.name === d && fieldsValue[d]) { if (item.name === d && fieldsValue[d]) {
//处理日期何时入库问题 //处理日期何时入库问题
try { try {
fieldsValue[d] = fieldsValue[d].format('YYYY-MM-DD HH:mm:ss'); fieldsValue[d] = fieldsValue[d].format('YYYY-MM-DD HH:mm:ss');
} catch (e) {} } catch (e) {
break; }
} break;
} }
} else if (number.includes(item.type)) { }
for (let d in fieldsValue) { } else if (number.includes(item.type)) {
if (item.name === d && fieldsValue[d] == '') { for (let d in fieldsValue) {
fieldsValue[d] = null; if (item.name === d && fieldsValue[d] == '') {
break; fieldsValue[d] = null;
} break;
} }
} }
}); }
let params = { ...fieldsValue }; });
handleAdd(params, isAdd); let params = { ...fieldsValue };
}); handleAdd(params, isAdd);
}; });
};
//需要获取动态表单
return ( //需要获取动态表单
<Modal return (
width="700px" <Modal
maskClosable={false} width="700px"
destroyOnClose maskClosable={false}
title={isView ? '查看详情' : isAdd ? '新增' : '编辑'} destroyOnClose
visible={modalVisible} title={isView ? '查看详情' : isAdd ? '新增' : '编辑'}
footer={ visible={modalVisible}
isView footer={
? null isView
: [ ? null
<Button key="back" onClick={() => handleModalVisible()}> : [
取消 <Button key="back" onClick={() => handleModalVisible()}>
</Button>, 取消
<Button key="submit" type="primary" onClick={okHandle}> </Button>,
确定 <Button key="submit" type="primary" onClick={okHandle}>
</Button>, 确定
] </Button>,
} ]
onOk={okHandle} }
onCancel={() => handleModalVisible()}> onOk={okHandle}
{formItem.map((item, index) => onCancel={() => handleModalVisible()}>
getItem(false, form, item, isAdd, formData, { span: 5 }, { span: 15 }), {formItem.map((item, index) =>
)} getItem(false, form, item, isAdd, formData, { span: 5 }, { span: 15 }),
</Modal> )}
); </Modal>
);
}); });
@connect(({ formList, DataColumn, DataObj, loading }) => ({ @connect(({
formList, formList,
DataColumn, DataColumn,
DataObj, DataObj,
loading: loading.models.formList || loading.models.DataColumn || loading.models.DataObj, loading
}) => ({
formList,
DataColumn,
DataObj,
loading: loading.models.formList || loading.models.DataColumn || loading.models.DataObj,
})) }))
@Form.create() @Form.create()
class FormList extends React.Component { class FormList extends React.Component {
state = { state = {
data: { data: {
list: [], list: [],
pagination: {}, pagination: {},
}, },
selects: [], selects: [],
modalVisible: false, modalVisible: false,
formData: null, formData: null,
formValues: {}, formValues: {},
formItem: [], formItem: [],
objId: this.props.objId || (this.props.location ? this.props.location.state.id : null), objId: this.props.objId || (this.props.location ? this.props.location.state.id : null),
isAdd: false, isAdd: false,
querys: [], querys: [],
selectedRows: [], selectedRows: [],
primaryKey: null, primaryKey: null,
options: {}, options: {},
isTable: true, isTable: true,
tableWidth: 500, tableWidth: 500,
rights: this.props.rights || [], rights: this.props.rights || [],
columnRights: [], columnRights: [],
isReady: false, isReady: false,
groups: {}, groups: {},
showDiv: '', showMobileDiv: '',
showMobileDiv: '', isView: false,
isView: false, checkedList: [], // 复选框默认选中
checkedList: [], // 复选框默认选中 cacheColumns: '', // 初始表头缓存数据 后续不做增删改查
cacheColumns: '', // 初始表头缓存数据 后续不做增删改查 };
};
columns = [];
columns = []; checkList = []; // 复选框内容
checkList = []; // 复选框内容 getOptions = () => {
getOptions = () => { const refIds = [];
const refIds = []; for (var i = 0; i < this.state.formItem.length; i++) {
for (var i = 0; i < this.state.formItem.length; i++) { if (
if ( this.state.formItem[i].referenceObjId != null &&
this.state.formItem[i].referenceObjId != null && this.state.options[this.state.formItem[i].id + ''] == null
this.state.options[this.state.formItem[i].id + ''] == null ) {
) { refIds.push(this.state.formItem[i].id);
refIds.push(this.state.formItem[i].id); }
} }
}
if (refIds.length > 0) {
if (refIds.length > 0) { this.props.dispatch({
this.props.dispatch({ type: 'formList/getBatchOptions',
type: 'formList/getBatchOptions', payload: { ids: refIds },
payload: { ids: refIds }, callback: (options) => {
callback: (options) => { this.setState({ options: { ...this.state.options, ...options } });
this.setState({ options: { ...this.state.options, ...options } }); },
}, });
}); }
} };
}; modify = (record) => {
modify = (record) => { // if (this.state.formItem.length < 10) {
// if (this.state.formItem.length < 10) { this.getOptions();
this.getOptions(); this.props.dispatch({
this.props.dispatch({ type: 'formList/getDetail',
type: 'formList/getDetail', payload: {
payload: { dataObjId: this.state.objId,
dataObjId: this.state.objId, key: this.state.primaryKey,
key: this.state.primaryKey, value: record[this.state.primaryKey],
value: record[this.state.primaryKey], isBase: false,
isBase: false, },
}, callback: (record2) => {
callback: (record2) => { this.setState({
this.setState({ formData: record2,
formData: record2, modalVisible: true,
modalVisible: true, isAdd: false,
isAdd: false, isView: false,
isView: false, });
}); },
}, });
}); };
};
view = (record) => {
view = (record) => { this.getOptions();
this.getOptions(); this.setState({
this.setState({ formData: record,
formData: record, modalVisible: true,
modalVisible: true, isAdd: false,
isAdd: false, isView: true,
isView: true, });
}); };
};
isJSON = (str) => {
isJSON = (str) => { if (typeof str == 'string') {
if (typeof str == 'string') { try {
try { var obj = JSON.parse(str);
var obj = JSON.parse(str); if (typeof obj == 'object' && obj) {
if (typeof obj == 'object' && obj) { return true;
return true; } else {
} else { return false;
return false; }
} } catch (e) {
} catch (e) { console.log('error：' + str + '!!!' + e);
console.log('error：' + str + '!!!' + e); return false;
return false; }
} }
} console.log('这不是个字符串');
console.log('这不是个字符串'); };
};
delete = (record) => {
delete = (record) => { //找出主键
//找出主键 let Keys = {};
let Keys = {}; Keys[this.state.primaryKey] = record[this.state.primaryKey];
Keys[this.state.primaryKey] = record[this.state.primaryKey]; this.props.dispatch({
this.props.dispatch({ type: 'formList/delete',
type: 'formList/delete', payload: {
payload: { keys: JSON.stringify(Keys),
keys: JSON.stringify(Keys), objId: this.state.objId,
objId: this.state.objId, },
}, callback: () => {
callback: () => { this.getPage();
this.getPage(); },
}, });
}); };
};
viewProcess = (record) => {
viewProcess = (record) => { const { dispatch } = this.props;
const { dispatch } = this.props; dispatch({
dispatch({ type: 'formList/getAppId',
type: 'formList/getAppId', payload: {
payload: { code: record.process_biz_key,
code: record.process_biz_key, },
}, callback: (data) => {
callback: (data) => { const domainName = sessionStorage.getItem('domainName')
const domainName = sessionStorage.getItem('domainName') ? sessionStorage.getItem('domainName')
? sessionStorage.getItem('domainName') : '';
: '';
window.open(domainName + '/portal/serviceCentre/getdetail?id=' + data.id, '_blank');
window.open(domainName + '/portal/serviceCentre/getdetail?id=' + data.id, '_blank'); //router.push({ pathname: '/portal/serviceCentre/getdetail', state: { id: data.id } });
//router.push({ pathname: '/portal/serviceCentre/getdetail', state: { id: data.id } }); },
}, });
}); };
};
/**
/** * 宽度自适应函数
* 宽度自适应函数 */
*/ resize = (e) => {
resize = (e) => { let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度
let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度 let showMobileDiv = scrollWidth - 77;
let showMobileDiv = scrollWidth - 77; if (document.querySelector('#previewDiv')) {
if (document.querySelector('#previewDiv')) { // 预览模式
// 预览模式 this.setState({
this.setState({ showMobileDiv: document.querySelector('#previewDiv').clientWidth - 77,
showMobileDiv: document.querySelector('#previewDiv').clientWidth - 77, });
}); } else {
} else { this.setState({
this.setState({ showMobileDiv,
showMobileDiv, });
}); }
} };
};
//渲染值
//渲染值 componentDidMount() {
componentDidMount() { const {
const { dispatch, isFormCom, isSelect, callback, valueName } = this.props; dispatch,
window.addEventListener('resize', this.resize); } = this.props;
// console.log('componentDidMount'); window.addEventListener('resize', this.resize);
if (this.props.objCode) {
const { dispatch, objCode, sql } = this.props;
// console.log('componentDidMount');
if (Number(objCode) === 1) { if (this.props.objCode) {
this.initColumn(); const {
} else { dispatch,
dispatch({ objCode,
type: 'DataObj/findByCode', sql
payload: { objCode: this.props.objCode }, } = this.props;
callback: (dataObj) => {
this.setState( if (Number(objCode) === 1) {
{ this.initColumn();
objId: dataObj.id, } else {
isTable: dataObj.isTable, dispatch({
}, type: 'DataObj/findByCode',
() => { payload: { objCode: this.props.objCode },
dispatch({ callback: (dataObj) => {
type: 'DataRight/getUserRight', this.setState(
payload: { objId: this.state.objId }, {
callback: (data) => { objId: dataObj.id,
if (!this.props.rights) { isTable: dataObj.isTable,
this.setState({ rights: data }); },
} () => {
dispatch({ dispatch({
type: 'DataRight/getUserColumnRight', type: 'DataRight/getUserRight',
payload: { objId: this.state.objId }, payload: { objId: this.state.objId },
callback: (data) => { callback: (data) => {
this.setState({ columnRights: data }); if (!this.props.rights) {
this.initColumn(); this.setState({ rights: data });
}, }
}); dispatch({
}, type: 'DataRight/getUserColumnRight',
}); payload: { objId: this.state.objId },
}, callback: (data) => {
); this.setState({ columnRights: data });
}, this.initColumn();
}); },
} });
} else { },
dispatch({ });
type: 'formList/getObjDetail', },
payload: { id: this.state.objId }, );
callback: (data) => { },
this.setState({ isTable: data.isTable }); });
}, }
}); } else {
dispatch({ dispatch({
type: 'DataRight/getUserRight', type: 'formList/getObjDetail',
payload: { objId: this.state.objId }, payload: { id: this.state.objId },
callback: (data) => { callback: (data) => {
if (!this.props.rights) { this.setState({ isTable: data.isTable });
this.setState({ rights: data }); },
} });
dispatch({ dispatch({
type: 'DataRight/getUserColumnRight', type: 'DataRight/getUserRight',
payload: { objId: this.state.objId }, payload: { objId: this.state.objId },
callback: (data) => { callback: (data) => {
this.setState({ columnRights: data }); if (!this.props.rights) {
this.initColumn(); this.setState({ rights: data });
}, }
}); dispatch({
}, type: 'DataRight/getUserColumnRight',
}); payload: { objId: this.state.objId },
} callback: (data) => {
} this.setState({ columnRights: data });
this.initColumn();
/** },
* 移除监听器 });
*/ },
componentWillUnmount() { });
window.removeEventListener('resize', this.resize); }
} }
custom = this.props.value ? JSON.stringify(this.props.value) : null; /**
* 移除监听器
componentWillReceiveProps(nextProps) { */
const b = nextProps.value || {}; componentWillUnmount() {
const a = this.props.value || {}; window.removeEventListener('resize', this.resize);
const jsonb = JSON.stringify(b); }
const jsona = JSON.stringify(a);
custom = this.props.value ? JSON.stringify(this.props.value) : null;
this.custom = jsonb;
if (jsona != jsonb) { componentWillReceiveProps(nextProps) {
let params = { const b = nextProps.value || {};
pageNo: b.pageNo ? b.pageNo : 1, const a = this.props.value || {};
pageSize: b.pageSize ? b.pageSize : this.state.data.pagination.pageSize, const jsonb = JSON.stringify(b);
query: JSON.stringify(this.state.formValues), const jsona = JSON.stringify(a);
};
this.custom = jsonb;
if (nextProps.value.columns != null && nextProps.value.columns.length > 0) { if (jsona != jsonb) {
this.columns = nextProps.value.columns; let params = {
} pageNo: b.pageNo ? b.pageNo : 1,
if(nextProps.value.selectedRows && Array.isArray(nextProps.value.selectedRows)){ pageSize: b.pageSize ? b.pageSize : this.state.data.pagination.pageSize,
// 27867 就业市场/线上招聘管理/职位信息审核，胡林那 hulinnaAdmin 马上审核通过的职位直接发布 发布不了 query: JSON.stringify(this.state.formValues),
this.setState({ };
if (nextProps.value.columns != null && nextProps.value.columns.length > 0) {
this.columns = nextProps.value.columns;
}
if (nextProps.value.selectedRows && Array.isArray(nextProps.value.selectedRows)) {
// 27867 就业市场/线上招聘管理/职位信息审核，胡林那 hulinnaAdmin 马上审核通过的职位直接发布 发布不了
this.setState({
selectedRows: nextProps.value.selectedRows, selectedRows: nextProps.value.selectedRows,
}); });
} }
if (nextProps.value.getPage) { if (nextProps.value.getPage) {
this.getPage(params, null, nextProps.value.getPage); this.getPage(params, null, nextProps.value.getPage);
} else { } else {
if (this.state.objId) this.getPage(params); if (this.state.objId) this.getPage(params);
} }
} }
const x = nextProps.selects; const x = nextProps.selects;
const y = this.props.selects; const y = this.props.selects;
if (JSON.stringify(x) != JSON.stringify(y)) { if (JSON.stringify(x) != JSON.stringify(y)) {
this.setState({ selects: x }); this.setState({ selects: x });
} }
} }
initColumn = () => { initColumn = () => {
const { dispatch, value, objCode } = this.props; const {
const { rights, columnRights } = this.state; dispatch,
if (value && value.columns) { value,
this.columns = value.columns; objCode
let cacheList = []; } = this.props;
let cacheChecked = []; const {
// 表头筛选逻辑 rights,
Array.isArray(value.columns) && columnRights
value.columns.map((item) => { } = this.state;
if (item.dataIndex != null) { if (value && value.columns) {
cacheList.push({ this.columns = value.columns;
label: item.title, let cacheList = [];
value: item.dataIndex, let cacheChecked = [];
}); // 表头筛选逻辑
cacheChecked.push(item.dataIndex); Array.isArray(value.columns) &&
} value.columns.map((item) => {
}); if (item.dataIndex != null) {
this.checkList = cacheList; cacheList.push({
label: item.title,
this.setState({ value: item.dataIndex,
checkedList: cacheChecked, });
cacheColumns: cloneDeep(value.columns), cacheChecked.push(item.dataIndex);
}); }
if (Number(objCode) === 1) { });
this.getPage(); this.checkList = cacheList;
} else {
dispatch({ this.setState({
type: 'formList/getHead', checkedList: cacheChecked,
payload: { dataObjId: this.state.objId }, cacheColumns: cloneDeep(value.columns),
callback: (datas) => { });
this.state.formItem = datas; if (Number(objCode) === 1) {
const querys = []; this.getPage();
const groups = {}; } else {
const refIds = []; dispatch({
for (let t in datas) { type: 'formList/getHead',
if (datas[t].isPrimaryKey) this.state.primaryKey = datas[t].name; payload: { dataObjId: this.state.objId },
if (datas[t].isShowQuery) { callback: (datas) => {
querys.push(datas[t]); this.state.formItem = datas;
if (datas[t].referenceObjId != null) { const querys = [];
refIds.push(datas[t].id); const groups = {};
} const refIds = [];
if (datas[t].isGroupQuery != null) { for (let t in datas) {
dispatch({ if (datas[t].isPrimaryKey) this.state.primaryKey = datas[t].name;
type: 'formList/getGroupList', if (datas[t].isShowQuery) {
payload: { columnId: datas[t].id }, querys.push(datas[t]);
callback: (gourp) => { if (datas[t].referenceObjId != null) {
groups[datas[t].id] = gourp; refIds.push(datas[t].id);
this.setState({ groups }); }
}, if (datas[t].isGroupQuery != null) {
}); dispatch({
} type: 'formList/getGroupList',
} payload: { columnId: datas[t].id },
} callback: (gourp) => {
if (querys.length > 0) { groups[datas[t].id] = gourp;
this.setState({ querys }); this.setState({ groups });
if (refIds.length > 0) { },
dispatch({ });
type: 'formList/getBatchOptions', }
payload: { ids: refIds }, }
callback: (options) => { }
this.setState({ options }); if (querys.length > 0) {
}, this.setState({ querys });
}); if (refIds.length > 0) {
} dispatch({
} type: 'formList/getBatchOptions',
this.getPage(); payload: { ids: refIds },
}, callback: (options) => {
}); this.setState({ options });
} },
return; });
} }
}
if (Number(objCode) === 1) { this.getPage();
} else { },
dispatch({ });
type: 'formList/getHead', }
payload: { dataObjId: this.state.objId }, return;
callback: (datas) => { }
const querys = [];
const refIds = []; if (Number(objCode) === 1) {
const groups = {}; } else {
if (datas) { dispatch({
this.state.formItem = datas; type: 'formList/getHead',
let i = 0; payload: { dataObjId: this.state.objId },
let cacheList = []; callback: (datas) => {
let cacheChecked = []; const querys = [];
// 表头筛选逻辑 const refIds = [];
datas.map((item) => { const groups = {};
if (item.name != null) { if (datas) {
cacheList.push({ this.state.formItem = datas;
label: item.title, let i = 0;
value: item.name, let cacheList = [];
}); let cacheChecked = [];
cacheChecked.push(item.name); // 表头筛选逻辑
} datas.map((item) => {
}); if (item.name != null) {
this.checkList = cacheList; cacheList.push({
this.setState({ label: item.title,
checkedList: cacheChecked, value: item.name,
}); });
for (let t in datas) { cacheChecked.push(item.name);
if (datas[t].isPrimaryKey) this.state.primaryKey = datas[t].name; }
if (datas[t].isHidden) { });
continue; this.checkList = cacheList;
} this.setState({
let column = {}; checkedList: cacheChecked,
column.title = datas[t].title; });
column.dataIndex = datas[t].name; for (let t in datas) {
column.width = datas[t].width; if (datas[t].isPrimaryKey) this.state.primaryKey = datas[t].name;
if (i == 0) column.fixed = 'left'; if (datas[t].isHidden) {
continue;
if (columnRights.length > 0 && !columnRights.includes(datas[t].id)) { }
continue; let column = {};
} column.title = datas[t].title;
if (date.includes(datas[t].type)) { column.dataIndex = datas[t].name;
column.render = (val) => { column.width = datas[t].width;
if (val == null) { if (i == 0) column.fixed = 'left';
return val;
} if (columnRights.length > 0 && !columnRights.includes(datas[t].id)) {
if (datas[t].dataFormatStrWeb != null) { continue;
return moment(val).format(datas[t].dataFormatStrWeb); }
} else { if (date.includes(datas[t].type)) {
return moment(val).format('YYYY-MM-DD HH:mm:ss'); column.render = (val) => {
} if (val == null) {
}; return val;
} else if (datas[t].name.indexOf('process_status') > -1) { }
column.render = (val) => (val ? (val === '0' ? '审核通过' : '审核未通过') : null); if (datas[t].dataFormatStrWeb != null) {
} else if (datas[t].extendTypeId && datas[t].extendTypeId.indexOf('file') > -1) { return moment(val)
//特殊处理附件 .format(datas[t].dataFormatStrWeb);
column.render = (val) => { } else {
if (this.isJSON(val)) { return moment(val)
val = JSON.parse(val); .format('YYYY-MM-DD HH:mm:ss');
let files = val.files; }
let xx = ( };
<ul> } else if (datas[t].name.indexOf('process_status') > -1) {
{files.map((f, index2) => { column.render = (val) => (val ? (val === '0' ? '审核通过' : '审核未通过') : null);
return ( } else if (datas[t].extendTypeId && datas[t].extendTypeId.indexOf('file') > -1) {
<li key={index2}> //特殊处理附件
<FilePreview path={queryApiActionPath() + f.path} pathName={f.name} /> column.render = (val) => {
</li> if (this.isJSON(val)) {
); val = JSON.parse(val);
})} let files = val.files;
</ul> let xx = (
); <ul>
return xx; {files.map((f, index2) => {
} else { return (
return val; <li key={index2}>
} <FilePreview path={queryApiActionPath() + f.path} pathName={f.name}/>
}; </li>
} else { );
column.render = (val) => })}
val && val.length > 100 ? ( </ul>
<Tooltip title={val} overlayStyle={{ width: 1000 }}> );
return xx;
} else {
return val;
}
};
} else {
column.render = (val) =>
val && val.length > 100 ? (
<Tooltip title={val} overlayStyle={{ width: 1000 }}>
<span <span
style={{ style={{
width: column.width || 200, width: column.width || 200,
display: 'block', display: 'block',
wordBreak: 'keep-all', wordBreak: 'keep-all',
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
overflow: 'hidden', overflow: 'hidden',
textOverflow: 'ellipsis', textOverflow: 'ellipsis',
}}> }}>
{val} {val}
</span> </span>
</Tooltip> </Tooltip>
) : ( ) : (
val val
); );
} }
this.setState({ tableWidth: (datas.length - 1) * 200 }); this.setState({ tableWidth: (datas.length - 1) * 200 });
this.columns.push(column); this.columns.push(column);
this.setState({ this.setState({
cacheColumns: cloneDeep(this.columns), cacheColumns: cloneDeep(this.columns),
}); });
if (datas[t].isShowQuery) { if (datas[t].isShowQuery) {
querys.push(datas[t]); querys.push(datas[t]);
if (datas[t].referenceObjId != null) { if (datas[t].referenceObjId != null) {
refIds.push(datas[t].id); refIds.push(datas[t].id);
} }
if (datas[t].isGroupQuery != null) { if (datas[t].isGroupQuery != null) {
dispatch({ dispatch({
type: 'formList/getGroupList', type: 'formList/getGroupList',
payload: { columnId: datas[t].id }, payload: { columnId: datas[t].id },
callback: (gourp) => { callback: (gourp) => {
groups[datas[t].id] = gourp; groups[datas[t].id] = gourp;
this.setState({ groups }); this.setState({ groups });
}, },
}); });
} }
} }
i++; i++;
} }
if (querys.length > 0) { if (querys.length > 0) {
this.setState({ querys }); this.setState({ querys });
if (refIds.length > 0) { if (refIds.length > 0) {
dispatch({ dispatch({
type: 'formList/getBatchOptions', type: 'formList/getBatchOptions',
payload: { ids: refIds }, payload: { ids: refIds },
callback: (options) => { callback: (options) => {
this.setState({ options }); this.setState({ options });
}, },
}); });
} }
} }
this.getPage(); this.getPage();
} }
}, },
}); });
} }
}; };
sqlBs16 = this.props.sql; sqlBs16 = this.props.sql;
getPage = (params, values, callPage, pageNo) => { getPage = (params, values, callPage, pageNo) => {
const { objCode } = this.props; const { objCode } = this.props;
if (this.columns == null || this.columns.length == 0) { if (this.columns == null || this.columns.length == 0) {
return; return;
} }
const { dispatch } = this.props; const { dispatch } = this.props;
const pagination = this.state.data.pagination; const pagination = this.state.data.pagination;
if (params == null) { if (params == null) {
params = { params = {
pageNo: pageNo != null ? pageNo : pagination.current ? pagination.current : 1, pageNo: pageNo != null ? pageNo : pagination.current ? pagination.current : 1,
pageSize: pagination.pageSize ? pagination.pageSize : this.props.pageSize || 10, pageSize: pagination.pageSize ? pagination.pageSize : this.props.pageSize || 10,
query: JSON.stringify(values != null ? values : this.state.formValues), query: JSON.stringify(values != null ? values : this.state.formValues),
}; };
} else { } else {
if (params.pageNo == null && callPage == null && this.props.value.getPage == null) return; if (params.pageNo == null && callPage == null && this.props.value.getPage == null) return;
} }
if (Number(objCode) === 1) { if (Number(objCode) === 1) {
if (callPage) { if (callPage) {
callPage(params, (data) => { callPage(params, (data) => {
if (!this.state.isReady) { if (!this.state.isReady) {
this.setState({ this.setState({
data, data,
isReady: true, isReady: true,
}); });
} else { } else {
this.setState({ data }); this.setState({ data });
} }
}); });
} else if (this.props.value && this.props.value.getPage) { } else if (this.props.value && this.props.value.getPage) {
this.props.value.getPage(params, (data) => { this.props.value.getPage(params, (data) => {
if (!this.state.isReady) { if (!this.state.isReady) {
this.setState({ this.setState({
data, data,
isReady: true, isReady: true,
}); });
} else { } else {
this.setState({ data }); this.setState({ data });
} }
}); });
} }
} else { } else {
dispatch({ dispatch({
type: 'formList/fetch', type: 'formList/fetch',
payload: { payload: {
custom: this.custom, custom: this.custom,
...params, ...params,
sql: this.sqlBs16, sql: this.sqlBs16,
dataObjId: this.state.objId, dataObjId: this.state.objId,
}, },
callback: (data) => { callback: (data) => {
if (!this.state.isReady) { if (!this.state.isReady) {
this.setState({ this.setState({
data, data,
isReady: true, isReady: true,
}); });
} else { } else {
this.setState({ data }); this.setState({ data });
} }
}, },
}); });
} }
}; };
handleStandardTableChange = (pagination, filtersArg, sorter) => { handleStandardTableChange = (pagination, filtersArg, sorter) => {
const filters = Object.keys(filtersArg).reduce((obj, key) => { const filters = Object.keys(filtersArg)
const newObj = { ...obj }; .reduce((obj, key) => {
newObj[key] = getValue(filtersArg[key]); const newObj = { ...obj };
return newObj; newObj[key] = getValue(filtersArg[key]);
}, {}); return newObj;
}, {});
const params = {
pageNo: pagination.current, const params = {
pageSize: pagination.pageSize, pageNo: pagination.current,
...filters, pageSize: pagination.pageSize,
query: JSON.stringify(this.state.formValues), ...filters,
}; query: JSON.stringify(this.state.formValues),
if (sorter.field) { };
params.sorter = `${sorter.field}_${sorter.order}`; if (sorter.field) {
} params.sorter = `${sorter.field}_${sorter.order}`;
this.getPage(params); }
}; this.getPage(params);
};
handleAdd = (fields, isAdd) => {
let params = { handleAdd = (fields, isAdd) => {
...fields, let params = {
}; ...fields,
this.props.dispatch({ };
type: 'formList/add', this.props.dispatch({
payload: { type: 'formList/add',
params: params, payload: {
objId: this.state.objId, params: params,
isAdd: isAdd, objId: this.state.objId,
isSelf: true, isAdd: isAdd,
isView: false, isSelf: true,
}, isView: false,
callback: () => { },
message.success('操作成功'); callback: () => {
this.setState({ message.success('操作成功');
modalVisible: false, this.setState({
}); modalVisible: false,
this.getPage(); });
}, this.getPage();
}); },
}; });
};
handleModalVisible = () => {
this.setState({ handleModalVisible = () => {
modalVisible: this.state.modalVisible ? false : true, this.setState({
formData: {}, modalVisible: this.state.modalVisible ? false : true,
isView: false, formData: {},
}); isView: false,
}; });
};
add = () => {
// if (this.state.formItem.length < 10) { add = () => {
this.getOptions(); // if (this.state.formItem.length < 10) {
this.setState({ this.getOptions();
modalVisible: true, this.setState({
formData: {}, modalVisible: true,
isAdd: true, formData: {},
isView: false, isAdd: true,
}); isView: false,
// } else { });
// router.push({ // } else {
// pathname: '/admin/ddl/dataObj/formEdit', // router.push({
// state: { id: this.state.objId,isAdd: true,isView:false } // pathname: '/admin/ddl/dataObj/formEdit',
// }); // state: { id: this.state.objId,isAdd: true,isView:false }
// } // });
}; // }
};
handleSelectRows = (rows) => {
if (this.props.onSelectRow) { handleSelectRows = (rows) => {
this.props.onSelectRow(rows); if (this.props.onSelectRow) {
} this.props.onSelectRow(rows);
this.setState({ }
selectedRows: rows, this.setState({
}); selectedRows: rows,
}; });
};
batchDelete = (e) => {
const { dispatch } = this.props; batchDelete = (e) => {
const { selectedRows } = this.state; const { dispatch } = this.props;
const { selectedRows } = this.state;
if (!selectedRows) return;
if (!selectedRows) return;
let columns = this.state.formItem;
let Keys = {}; let columns = this.state.formItem;
let Keys = {};
for (let i in columns) {
if (columns[i].isPrimaryKey) { for (let i in columns) {
//key if (columns[i].isPrimaryKey) {
Keys[columns[i].name] = selectedRows.map((row) => row[columns[i].name]).join(','); //key
} Keys[columns[i].name] = selectedRows.map((row) => row[columns[i].name])
} .join(',');
this.props.dispatch({ }
type: 'formList/delete', }
payload: { this.props.dispatch({
keys: JSON.stringify(Keys), type: 'formList/delete',
objId: this.state.objId, payload: {
// isSelf: true, keys: JSON.stringify(Keys),
}, objId: this.state.objId,
callback: () => { // isSelf: true,
this.setState({ },
selectedRows: [], callback: () => {
}); this.setState({
this.getPage(); selectedRows: [],
}, });
}); this.getPage();
}; },
});
goBack = () => { };
router.goBack();
}; goBack = () => {
handleSearch = (e) => { router.goBack();
e.preventDefault(); };
handleSearch = (e) => {
const { dispatch, form } = this.props; e.preventDefault();
const { formValues } = this.state; const {
dispatch,
form.validateFields((err, fieldsValue) => { form
if (err) return; } = this.props;
const formItem = this.state.formItem; const { formValues } = this.state;
formItem.map((item, index) => {
if (item.type.indexOf('DATE') > -1) { form.validateFields((err, fieldsValue) => {
for (let d in fieldsValue) { if (err) return;
if (item.name === d && fieldsValue[d]) {
if (fieldsValue[d] != null && fieldsValue[d].length > 0) { const formItem = this.state.formItem;
fieldsValue[d] = [ formItem.map((item, index) => {
fieldsValue[d][0].format('YYYY-MM-DD HH:mm:ss'), if (item.type.indexOf('DATE') > -1) {
fieldsValue[d][1].format('YYYY-MM-DD HH:mm:ss'), for (let d in fieldsValue) {
]; if (item.name === d && fieldsValue[d]) {
} else { if (fieldsValue[d] != null && fieldsValue[d].length > 0) {
fieldsValue[d] = ''; fieldsValue[d] = [
} fieldsValue[d][0].format('YYYY-MM-DD HH:mm:ss'),
} fieldsValue[d][1].format('YYYY-MM-DD HH:mm:ss'),
} ];
} } else {
}); fieldsValue[d] = '';
const values = { }
...this.state.formValues, }
...fieldsValue, }
}; }
this.setState({ });
formValues: fieldsValue, const values = {
}); ...this.state.formValues,
const params = { ...fieldsValue,
pageNo: 1, };
pageSize: this.props.pageSize || 10, this.setState({
query: JSON.stringify(values), formValues: fieldsValue,
}; });
this.getPage(params, values, null, 1); const params = {
}); pageNo: 1,
}; pageSize: this.props.pageSize || 10,
query: JSON.stringify(values),
hanldeHighSearch = (e) => { };
const pagination = this.props.formList.data.pagination; this.getPage(params, values, null, 1);
let params = { });
pageNo: pagination.current ? pagination.current : 1, };
pageSize: pagination.pageSize ? pagination.pageSize : this.props.pageSize || 10,
...e, hanldeHighSearch = (e) => {
}; const pagination = this.props.formList.data.pagination;
this.setState({ formValues: { ...e, ...this.state.formValues } }); let params = {
this.getPage(params); pageNo: pagination.current ? pagination.current : 1,
}; pageSize: pagination.pageSize ? pagination.pageSize : this.props.pageSize || 10,
handleFormReset = () => { ...e,
const { form, dispatch } = this.props; };
form.resetFields(); this.setState({ formValues: { ...e, ...this.state.formValues } });
this.setState( this.getPage(params);
{ };
formValues: {}, handleFormReset = () => {
}, const {
() => { form,
this.getPage(); dispatch
}, } = this.props;
); form.resetFields();
}; this.setState(
getItem = (isQuery, form, item, isAdd, formData, labelCol, wrapperCol) => { {
const { groups, isView } = this.state; formValues: {},
//如果隐藏的话 就用隐藏域放置 },
if (item.isHidden) { () => {
return ( this.getPage();
<FormItem className={styles.hidden} key={item.id}> },
{form.getFieldDecorator(item.name, { );
initialValue: formData == null ? '' : formData[item.name], };
})(<Input type="hidden" placeholder="请输入" />)} getItem = (isQuery, form, item, isAdd, formData, labelCol, wrapperCol) => {
</FormItem> const {
); groups,
} isView
} = this.state;
if (item.isPrimaryKey) { //如果隐藏的话 就用隐藏域放置
if (isAdd) { if (item.isHidden) {
return <></>; return (
} else { <FormItem className={styles.hidden} key={item.id}>
return ( {form.getFieldDecorator(item.name, {
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> initialValue: formData == null ? '' : formData[item.name],
{form.getFieldDecorator(item.name, { })(<Input type="hidden" placeholder="请输入"/>)}
initialValue: formData == null ? '' : formData[item.name], </FormItem>
rules: [{ required: !item.isNull }], );
})(<Input style={{ width: '70%' }} readOnly={!isAdd} placeholder="请输入" />)} }
</FormItem>
); if (item.isPrimaryKey) {
} if (isAdd) {
} else if (item.referenceObjId != null) { return <></>;
const { options } = this.state; } else {
const ops = options[item.id + ''] || []; return (
return ( <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> {form.getFieldDecorator(item.name, {
{form.getFieldDecorator(item.name, { initialValue: formData == null ? '' : formData[item.name],
initialValue: formData == null ? '' : formData[item.name], rules: [{ required: !item.isNull }],
rules: [{ required: !item.isNull }], })(<Input style={{ width: '70%' }} readOnly={!isAdd} placeholder="请输入"/>)}
})( </FormItem>
<Select );
disabled={isView} }
style={{ width: '70%' }} } else if (item.referenceObjId != null) {
optionFilterProp="children" const { options } = this.state;
showSearch const ops = options[item.id + ''] || [];
filterOption={(input, option) => return (
option <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
? option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 {form.getFieldDecorator(item.name, {
: false initialValue: formData == null ? '' : formData[item.name],
} rules: [{ required: !item.isNull }],
placeholder="请选择" })(
allowClear> <Select
{ops.map((r) => ( disabled={isView}
<Option value={r[item.referenceCodeName]} key={r[item.referenceCodeName]}> style={{ width: '70%' }}
{r[item.referenceNameName]} optionFilterProp="children"
</Option> showSearch
))} filterOption={(input, option) =>
</Select>, option
)} ? option.props.children.toLowerCase()
</FormItem> .indexOf(input.toLowerCase()) >= 0
); : false
} else if (item.name.indexOf('process_status') > -1) { }
return ( placeholder="请选择"
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> allowClear>
{form.getFieldDecorator(item.name, { {ops.map((r) => (
initialValue: formData == null ? '' : formData[item.name], <Option value={r[item.referenceCodeName]} key={r[item.referenceCodeName]}>
rules: [{ required: !item.isNull }], {r[item.referenceNameName]}
})( </Option>
<Select disabled={isView} style={{ width: '70%' }} placeholder="请选择" allowClear> ))}
<Option value={'0'} key={'0'}> </Select>,
审核通过 )}
</Option> </FormItem>
<Option value={'2'} key={'2'}> );
审核未通过 } else if (item.name.indexOf('process_status') > -1) {
</Option> return (
</Select>, <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
)} {form.getFieldDecorator(item.name, {
</FormItem> initialValue: formData == null ? '' : formData[item.name],
); rules: [{ required: !item.isNull }],
} else if (item.extendTypeId && item.extendTypeId.indexOf('file') > -1) { })(
//特殊处理附件 如果是查询就 跳过 <Select disabled={isView} style={{ width: '70%' }} placeholder="请选择" allowClear>
if (isQuery) return; <Option value={'0'} key={'0'}>
return ( 审核通过
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> </Option>
{form.getFieldDecorator(item.name, { <Option value={'2'} key={'2'}>
initialValue: 审核未通过
formData == null </Option>
? '' </Select>,
: formData[item.name] && this.isJSON(formData[item.name]) )}
? JSON.parse(formData[item.name]) </FormItem>
: null, );
rules: [{ required: !item.isNull }], } else if (item.extendTypeId && item.extendTypeId.indexOf('file') > -1) {
})(<UploadCom disabled={isView} />)} //特殊处理附件 如果是查询就 跳过
</FormItem> if (isQuery) return;
); return (
} else if (isQuery && item.isGroupQuery != null && item.isGroupQuery) { <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
//如果是查询 并且是组合查询 {form.getFieldDecorator(item.name, {
initialValue:
const ops = groups[item.id + ''] || []; formData == null
return ( ? ''
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> : formData[item.name] && this.isJSON(formData[item.name])
{form.getFieldDecorator(item.name, { ? JSON.parse(formData[item.name])
initialValue: formData == null ? '' : formData[item.name], : null,
rules: [{ required: !item.isNull }], rules: [{ required: !item.isNull }],
})( })(<UploadCom disabled={isView}/>)}
<Select </FormItem>
disabled={isView} );
style={{ width: 200 }} } else if (isQuery && item.isGroupQuery != null && item.isGroupQuery) {
placeholder="请选择" //如果是查询 并且是组合查询
optionFilterProp="children"
showSearch const ops = groups[item.id + ''] || [];
filterOption={(input, option) => return (
option <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
? option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 {form.getFieldDecorator(item.name, {
: false initialValue: formData == null ? '' : formData[item.name],
} rules: [{ required: !item.isNull }],
allowClear> })(
{ops.map((r) => ( <Select
<Option value={r.value} key={r.value}> disabled={isView}
{r.value} style={{ width: 200 }}
</Option> placeholder="请选择"
))} optionFilterProp="children"
</Select>, showSearch
)} filterOption={(input, option) =>
</FormItem> option
); ? option.props.children.toLowerCase()
} else if (text.indexOf(item.type) > -1) { .indexOf(input.toLowerCase()) >= 0
return ( : false
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> }
{form.getFieldDecorator(item.name, { allowClear>
initialValue: formData == null ? '' : formData[item.name], {ops.map((r) => (
rules: [{ required: !item.isNull }], <Option value={r.value} key={r.value}>
})(<Input disabled={isView} style={{ width: '70%' }} placeholder="请输入" />)} {r.value}
</FormItem> </Option>
); ))}
} else if (number.indexOf(item.type) > -1) { </Select>,
return ( )}
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> </FormItem>
{form.getFieldDecorator(item.name, { );
initialValue: formData == null ? '' : formData[item.name], } else if (text.indexOf(item.type) > -1) {
rules: [ return (
{ required: !item.isNull }, <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
(rule, value, callback) => { {form.getFieldDecorator(item.name, {
var errors = []; initialValue: formData == null ? '' : formData[item.name],
var reg = new RegExp(/(^-?[0-9][0-9]*(.[0-9]+)?)$/); rules: [{ required: !item.isNull }],
if (value != null && value != '' && !reg.test(value)) { })(<Input disabled={isView} style={{ width: '70%' }} placeholder="请输入"/>)}
errors.push(new Error('请输入'), rule.field); </FormItem>
} );
callback(errors); } else if (number.indexOf(item.type) > -1) {
}, return (
], <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
})(<Input disabled={isView} placeholder="请输入" />)} {form.getFieldDecorator(item.name, {
</FormItem> initialValue: formData == null ? '' : formData[item.name],
); rules: [
} else if (isQuery && date.indexOf(item.type) > -1) { { required: !item.isNull },
return ( (rule, value, callback) => {
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> var errors = [];
{form.getFieldDecorator(item.name, { var reg = new RegExp(/(^-?[0-9][0-9]*(.[0-9]+)?)$/);
initialValue: formData == null ? null : moment(formData[item.name]), if (value != null && value != '' && !reg.test(value)) {
rules: [{ required: !item.isNull }], errors.push(new Error('请输入'), rule.field);
})( }
<RangePicker callback(errors);
disabled={isView} },
format={item.dataFormatStrWeb == null ? 'YYYY-MM-DD HH:mm:ss' : item.dataFormatStrWeb} ],
style={{ width: '95%' }} })(<Input disabled={isView} placeholder="请输入"/>)}
/>, </FormItem>
)} );
</FormItem> } else if (isQuery && date.indexOf(item.type) > -1) {
); return (
} else if (date.indexOf(item.type) > -1) { <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
return ( {form.getFieldDecorator(item.name, {
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> initialValue: formData == null ? null : moment(formData[item.name]),
{form.getFieldDecorator(item.name, { rules: [{ required: !item.isNull }],
initialValue: })(
formData == null <RangePicker
? moment() disabled={isView}
: formData[item.name] format={item.dataFormatStrWeb == null ? 'YYYY-MM-DD HH:mm:ss' : item.dataFormatStrWeb}
? moment(formData[item.name]) style={{ width: '95%' }}
: null, />,
rules: [{ required: !item.isNull }], )}
})( </FormItem>
<DatePicker );
format={item.dataFormatStrWeb == null ? 'YYYY-MM-DD HH:mm:ss' : item.dataFormatStrWeb} } else if (date.indexOf(item.type) > -1) {
style={{ width: '100%' }} return (
placeholder="请输入" <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
disabled={isView} {form.getFieldDecorator(item.name, {
/>, initialValue:
)} formData == null
</FormItem> ? moment()
); : formData[item.name]
} else { ? moment(formData[item.name])
return ( : null,
<FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}> rules: [{ required: !item.isNull }],
{form.getFieldDecorator(item.name, { })(
initialValue: formData == null ? '' : formData[item.name], <DatePicker
rules: [{ required: !item.isNull }], format={item.dataFormatStrWeb == null ? 'YYYY-MM-DD HH:mm:ss' : item.dataFormatStrWeb}
})(<Input disabled={isView} style={{ width: '70%' }} placeholder="请输入" />)} style={{ width: '100%' }}
</FormItem> placeholder="请输入"
); disabled={isView}
} />,
}; )}
</FormItem>
renderForm() { );
const { form, get } = this.props; } else {
return (
const { querys } = this.state; <FormItem labelCol={labelCol} wrapperCol={wrapperCol} label={item.title} key={item.id}>
if (querys.length == 0) { {form.getFieldDecorator(item.name, {
return ''; initialValue: formData == null ? '' : formData[item.name],
} rules: [{ required: !item.isNull }],
})(<Input disabled={isView} style={{ width: '70%' }} placeholder="请输入"/>)}
return ( </FormItem>
<Form layout="inline"> );
<Row style={{ padding: '15px' }}> }
{querys.map((item) => ( };
<Col style={{ height: 58 }} span={get === 'mobile' ? 24 : 8} key={item.id}>
{this.getItem( renderForm() {
true, const {
form, form,
{ get
...item, } = this.props;
isNull: true,
}, const { querys } = this.state;
true, if (querys.length == 0) {
)} return '';
</Col> }
))}
return (
<Col <Form layout="inline">
span={get === 'mobile' ? 24 : 8} <Row style={{ padding: '15px' }}>
style={{ {querys.map((item) => (
textAlign: get === 'mobile' ? 'right' : '', <Col style={{ height: 58 }} span={get === 'mobile' ? 24 : 8} key={item.id}>
paddingRight: get === 'mobile' ? 12 : '', {this.getItem(
}}> true,
form,
{
...item,
isNull: true,
},
true,
)}
</Col>
))}
<Col
span={get === 'mobile' ? 24 : 8}
style={{
textAlign: get === 'mobile' ? 'right' : '',
paddingRight: get === 'mobile' ? 12 : '',
}}>
<span className={styles.submitButtons}> <span className={styles.submitButtons}>
<Button type="primary" loading={this.props.loading} onClick={this.handleSearch}> <Button type="primary" loading={this.props.loading} onClick={this.handleSearch}>
查询 查询
...@@ -1086,251 +1125,246 @@ class FormList extends React.Component { ...@@ -1086,251 +1125,246 @@ class FormList extends React.Component {
<Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}> <Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}>
重置 重置
</Button> </Button>
{/* <a style={{ marginLeft: 8 }} onClick={this.toggleForm}> {/* <a style={{ marginLeft: 8 }} onClick={this.toggleForm}>
展开 <Icon type="down" /> 展开 <Icon type="down" />
</a> */} </a> */}
</span> </span>
</Col> </Col>
</Row> </Row>
</Form> </Form>
); );
} }
/** /**
* @description: 表头筛选复选框 根据用户筛选将表头内容重置 * @description: 表头筛选复选框 根据用户筛选将表头内容重置
* @param { Array<string> } 用户选择参数 * @param { Array<string> } 用户选择参数
* @return: * @return:
*/ */
CheckboxChange = (checkedValues) => { CheckboxChange = (checkedValues) => {
if (checkedValues.length === 0) { if (checkedValues.length === 0) {
message.error('至少选择一项'); message.error('至少选择一项');
return; return;
} }
const { cacheColumns } = this.state; const { cacheColumns } = this.state;
let initList = []; let initList = [];
checkedValues.map((item) => { checkedValues.map((item) => {
let ary = cacheColumns.filter((data) => data.dataIndex === item); let ary = cacheColumns.filter((data) => data.dataIndex === item);
if (ary.length !== 0) { if (ary.length !== 0) {
initList.push(ary[0]); initList.push(ary[0]);
} }
}); });
this.columns = initList; this.columns = initList;
this.setState({ this.setState({
checkedList: checkedValues, checkedList: checkedValues,
}); });
}; };
render() { render() {
const { modalVisible, selectedRows, rights, data, isReady } = this.state; const {
modalVisible,
if (!isReady) { selectedRows,
return ( rights,
<div data,
style={{ isReady,
width: 20, } = this.state;
margin: 'auto',
}}> if (!isReady) {
<Spin /> return (
</div> <div
); style={{
} width: 20,
const { margin: 'auto',
isFormCom, }}>
isSelect, <Spin/>
get, </div>
callback, );
valueName, }
notShowBack, const {
json, isFormCom,
istableCom, // 是否有模板设计器调用 isSelect,
value: { btns }, get,
loading, callback,
} = this.props; valueName,
const { showMobileDiv, isView } = this.state; notShowBack,
json,
let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度 istableCom, // 是否有模板设计器调用
let isMobile = scrollWidth < 1000; value: { btns },
if (document.querySelector('#previewDiv')) { loading,
isMobile = true; uuid,
} } = this.props;
// console.log(json); const {
let showDiv = 500; showMobileDiv,
if (document.getElementsByClassName('ant-layout-content')?.length) { isView
// 这是大学工项目 容器元素的宽度 } = this.state;
showDiv = document.getElementsByClassName('ant-layout-content')[0].clientWidth - 100;
} let scrollWidth = document.documentElement.clientWidth || document.body.clientWidth; //可使宽度
let isMobile = scrollWidth < 1000;
if (document.querySelector('#mobelDiv')) { if (document.querySelector('#previewDiv')) {
// 这个是一站式的元素的宽度 isMobile = true;
showDiv = document.querySelector('#mobelDiv')?.parentNode.clientWidth; }
}
if (json.twidth) { const showDiv = countWidth({json, uuid});
// 列表宽度配置项 在 组件的 扩展的配置里面 const parentMethods = {
showDiv = json.twidth; handleAdd: this.handleAdd,
} handleModalVisible: this.handleModalVisible,
// console.log(showDiv); formData: this.state.formData,
formItem: this.state.formItem,
const parentMethods = { isAdd: this.state.isAdd,
handleAdd: this.handleAdd, getItem: this.getItem,
handleModalVisible: this.handleModalVisible, isView: isView,
formData: this.state.formData, };
formItem: this.state.formItem,
isAdd: this.state.isAdd, if (
getItem: this.getItem, !isSelect &&
isView: isView, !rights.includes('edit') &&
}; !rights.includes('delete') &&
!rights.includes('view') &&
if ( !rights.includes('viewProcess')
!isSelect && ) {
!rights.includes('edit') && } else {
!rights.includes('delete') && let width = 0;
!rights.includes('view') && if (rights && rights.includes('viewProcess')) {
!rights.includes('viewProcess') width = width + 120;
) { }
} else { if (rights && rights.includes('view')) {
let width = 0; width = width + 120;
if (rights && rights.includes('viewProcess')) { }
width = width + 120; if (rights && rights.includes('edit')) {
} width = width + 70;
if (rights && rights.includes('view')) { }
width = width + 120; if (rights && rights.includes('delete')) {
} width = width + 70;
if (rights && rights.includes('edit')) { }
width = width + 70; const column = {
} title: '操作',
if (rights && rights.includes('delete')) { fixed: 'right',
width = width + 70; width: width,
} render: (text, record) => {
const column = { let Dom = [];
title: '操作', if (isSelect) {
fixed: 'right', if (this.state.selects.includes(record[valueName])) {
width: width, Dom.push(<span>已选择</span>);
render: (text, record) => { } else {
let Dom = []; Dom.push(<a onClick={callback.bind(this, record, this.columns)}>选择</a>);
if (isSelect) { }
if (this.state.selects.includes(record[valueName])) { }
Dom.push(<span>已选择</span>); if (rights) {
} else { if (rights.includes('view')) {
Dom.push(<a onClick={callback.bind(this, record, this.columns)}>选择</a>); Dom.push(<a onClick={this.view.bind(this, record)}>查看详情</a>);
} }
} if (rights.includes('edit')) {
if (rights) { Dom.push(<a onClick={this.modify.bind(this, record)}>编辑</a>);
if (rights.includes('view')) { }
Dom.push(<a onClick={this.view.bind(this, record)}>查看详情</a>); if (rights.includes('viewProcess') && record.process_biz_key) {
} Dom.push(<a onClick={this.viewProcess.bind(this, record)}>流程详情</a>);
if (rights.includes('edit')) { }
Dom.push(<a onClick={this.modify.bind(this, record)}>编辑</a>); if (rights.includes('delete')) {
} Dom.push(
if (rights.includes('viewProcess') && record.process_biz_key) { <Popconfirm
Dom.push(<a onClick={this.viewProcess.bind(this, record)}>流程详情</a>); title="确定删除该数据?"
} onConfirm={this.delete.bind(this, record)}
if (rights.includes('delete')) { okText="确定"
Dom.push( cancelText="取消">
<Popconfirm <a>删除</a>
title="确定删除该数据?" </Popconfirm>,
onConfirm={this.delete.bind(this, record)} );
okText="确定" }
cancelText="取消"> }
<a>删除</a> return (
</Popconfirm>, <Fragment>
); <div
} style={{
} textAlign: 'center',
return ( paddingLeft: '0px',
<Fragment> paddingRight: '0px',
<div }}>
style={{ {Dom &&
textAlign: 'center', Dom.length &&
paddingLeft: '0px', Dom.map((x, index) => (
paddingRight: '0px', <Fragment key={Math.random()}>
}}> {x}
{Dom && {index > 0 && index !== Dom.length - 1 && <Divider type="vertical"/>}
Dom.length && </Fragment>
Dom.map((x, index) => ( ))}
<Fragment key={Math.random()}> </div>
{x} </Fragment>
{index > 0 && index !== Dom.length - 1 && <Divider type="vertical" />} );
</Fragment> },
))} };
</div> if (this.columns.length > 0 && this.columns[this.columns.length - 1].title == '操作') {
</Fragment> this.columns[this.columns.length - 1] = column;
); } else {
}, this.columns.push(column);
}; }
if (this.columns.length > 0 && this.columns[this.columns.length - 1].title == '操作') { }
this.columns[this.columns.length - 1] = column; // console.log(this.columns);
} else { if (this.columns) {
this.columns.push(column); /**
} * 计算总长度
} */
// console.log(this.columns); AllWidth = 0;
if (this.columns) { this.columns = this.columns.map((item, index) => {
/** if (isEmpty(item)) {
* 计算总长度 return item;
*/ }
AllWidth = 0; if (
this.columns = this.columns.map((item, index) => { index === this.columns.length - 1 &&
if (isEmpty(item)) { this.columns[this.columns.length - 1].title !== '操作'
return item; ) {
} AllWidth += 150;
if ( item.width = '';
index === this.columns.length - 1 && return item;
this.columns[this.columns.length - 1].title !== '操作' }
) { let width = item.width ? item.width : 150;
AllWidth += 150; if (!item.width) {
item.width = ''; item.width = 150;
return item; }
} AllWidth += width;
let width = item.width ? item.width : 150; return item;
if (!item.width) { });
item.width = 150; if (
} !isEmpty(this.columns[this.columns.length - 1]) &&
AllWidth += width; this.columns[this.columns.length - 1].title === '操作'
return item; ) {
}); if (this.columns[this.columns.length - 2]) {
if ( this.columns[this.columns.length - 2].width = '';
!isEmpty(this.columns[this.columns.length - 1]) && AllWidth += 100;
this.columns[this.columns.length - 1].title === '操作' }
) { }
if (this.columns[this.columns.length - 2]) { }
this.columns[this.columns.length - 2].width = '';
AllWidth += 100; const xxxx = (
} <>
} <Card
} bordered={false}
bodyStyle={{
const xxxx = ( padding: 0,
<> width: json.twidth ? json.twidth : '100%',
<Card }}>
bordered={false} <div className={styles.tableList}>
bodyStyle={{ <div className={styles.tableListForm}>{this.renderForm()}</div>
padding: 0, <div className={styles.tableListOperator}>
width: json.twidth ? json.twidth : '100%', {notShowBack ? (
}}> notShowBack
<div className={styles.tableList}> ) : (
<div className={styles.tableListForm}>{this.renderForm()}</div> <Button icon="rollback" type="primary" onClick={this.goBack}>
<div className={styles.tableListOperator}> 返回
{notShowBack ? ( </Button>
notShowBack )}
) : (
<Button icon="rollback" type="primary" onClick={this.goBack}> <FormListButtons
返回 btns={btns}
</Button> loading={loading}
)} importConfig={(this.props.value && this.props.value.importConfig) || []}
exportConfig={(this.props.value && this.props.value.exportConfig) || []}
<FormListButtons getPage={this.getPage}
btns={btns} objId={this.state.objId}
loading={loading} query={JSON.stringify(this.state.formValues)}
importConfig={(this.props.value && this.props.value.importConfig) || []} custom={this.props.value ? Base16Encode(JSON.stringify(this.props.value)) : null}
exportConfig={(this.props.value && this.props.value.exportConfig) || []} sql={Base16Encode(this.props.sql)}
getPage={this.getPage} />
objId={this.state.objId} {/* {this.props.value && this.props.value.importConfig // 导入配置项
query={JSON.stringify(this.state.formValues)}
custom={this.props.value ? Base16Encode(JSON.stringify(this.props.value)) : null}
sql={Base16Encode(this.props.sql)}
/>
{/* {this.props.value && this.props.value.importConfig // 导入配置项
? this.props.value.importConfig.map((r, i) => ( ? this.props.value.importConfig.map((r, i) => (
<ImportUtil <ImportUtil
btn={r.btn} btn={r.btn}
...@@ -1345,7 +1379,7 @@ class FormList extends React.Component { ...@@ -1345,7 +1379,7 @@ class FormList extends React.Component {
)) ))
: ''}*/} : ''}*/}
{/* {this.props.value && this.props.value.exportConfig // 导出配置项 {/* {this.props.value && this.props.value.exportConfig // 导出配置项
? this.props.value.exportConfig.map((r, i) => ( ? this.props.value.exportConfig.map((r, i) => (
<ExportCurrentInfo <ExportCurrentInfo
objId={this.state.objId} objId={this.state.objId}
...@@ -1361,164 +1395,164 @@ class FormList extends React.Component { ...@@ -1361,164 +1395,164 @@ class FormList extends React.Component {
)) ))
: ''} : ''}
*/} */}
{rights && !rights.includes('add') ? ( {rights && !rights.includes('add') ? (
'' ''
) : ( ) : (
<Button icon="plus" type="primary" onClick={this.add}> <Button icon="plus" type="primary" onClick={this.add}>
新建 新建
</Button> </Button>
)} )}
{rights && !rights.includes('searchData') ? ( {rights && !rights.includes('searchData') ? (
'' ''
) : ( ) : (
<SearchInfo hanldeHighSearch={this.hanldeHighSearch} objId={this.state.objId} /> <SearchInfo hanldeHighSearch={this.hanldeHighSearch} objId={this.state.objId}/>
)} )}
{rights && !rights.includes('importData') ? ( {rights && !rights.includes('importData') ? (
'' ''
) : ( ) : (
<ImportUtil objId={this.state.objId} callback={() => this.getPage()} /> <ImportUtil objId={this.state.objId} callback={() => this.getPage()}/>
)} )}
{rights && !rights.includes('exportCurrent') ? ( {rights && !rights.includes('exportCurrent') ? (
'' ''
) : ( ) : (
<ExportCurrentInfo <ExportCurrentInfo
objId={this.state.objId} objId={this.state.objId}
query={JSON.stringify(this.state.formValues)} query={JSON.stringify(this.state.formValues)}
custom={this.props.value ? Base16Encode(JSON.stringify(this.props.value)) : null} custom={this.props.value ? Base16Encode(JSON.stringify(this.props.value)) : null}
sql={Base16Encode(this.props.sql)} sql={Base16Encode(this.props.sql)}
/> />
)} )}
{rights && !rights.includes('exportData') ? ( {rights && !rights.includes('exportData') ? (
'' ''
) : ( ) : (
<ExportInfo objId={this.state.objId} /> <ExportInfo objId={this.state.objId}/>
)} )}
{rights && !rights.includes('statistics') ? ( {rights && !rights.includes('statistics') ? (
'' ''
) : ( ) : (
<StatisticsInfo objId={this.state.objId} /> <StatisticsInfo objId={this.state.objId}/>
)} )}
{rights && !rights.includes('delete') {rights && !rights.includes('delete')
? '' ? ''
: selectedRows.length > 0 && ( : selectedRows.length > 0 && (
<span> <span>
<Popconfirm <Popconfirm
title="确定删除该数据?" title="确定删除该数据?"
onConfirm={this.batchDelete} onConfirm={this.batchDelete}
okText="确定" okText="确定"
cancelText="取消"> cancelText="取消">
<Button>批量删除</Button> <Button>批量删除</Button>
</Popconfirm> </Popconfirm>
</span> </span>
)} )}
{rights && !rights.includes('headerFilter') ? ( {rights && !rights.includes('headerFilter') ? (
'' ''
) : ( ) : (
<Popover // 划入选择栏 <Popover // 划入选择栏
content={ content={
<div <div
style={{ style={{
width: 150, width: 150,
}}> }}>
<Checkbox.Group <Checkbox.Group
onChange={this.CheckboxChange} onChange={this.CheckboxChange}
value={this.state.checkedList} value={this.state.checkedList}
options={this.checkList} options={this.checkList}
/> />
</div> </div>
} }
title="请选择表头展示" title="请选择表头展示"
trigger="click" trigger="click"
placement="bottom"> placement="bottom">
<Button // 表头筛选控件 <Button // 表头筛选控件
className={styles.filter_btn} className={styles.filter_btn}
icon="filter"> icon="filter">
表头筛选 表头筛选
</Button> </Button>
</Popover> </Popover>
)} )}
{btns && btns.after && btns.after.length > 0 {btns && btns.after && btns.after.length > 0
? btns.after.map((r) => <Button {...r} loading={loading} />) ? btns.after.map((r) => <Button {...r} loading={loading}/>)
: ''} : ''}
{!!this.props.otherProps && {!!this.props.otherProps &&
!!this.props.otherProps.showRightTips && !!this.props.otherProps.showRightTips &&
this.props.otherProps.RightTipsComponent} this.props.otherProps.RightTipsComponent}
</div> </div>
{!istableCom || (this.props.value && this.props.value.columns) ? ( {!istableCom || (this.props.value && this.props.value.columns) ? (
<div <div
id="mobelDiv" id="mobelDiv"
className={'mobelDivClassName'} className={'mobelDivClassName'}
style={{ style={{
overflow: 'hidden', overflow: 'hidden',
width: isMobile ? showMobileDiv : showDiv, width: isMobile ? showMobileDiv : showDiv,
height: '100%', height: '100%',
}}> }}>
{showDiv && ( {showDiv && (
<StandardTable <StandardTable
showHeader={this.props.showHeader != null ? this.props.showHeader : true} showHeader={this.props.showHeader != null ? this.props.showHeader : true}
noSelectRow={ noSelectRow={
this.props.onSelectRow == null && this.props.onSelectRow == null &&
(rights == null || !rights.includes('delete')) (rights == null || !rights.includes('delete'))
} }
rowKey={this.props.value?.rowKey ? this.props.value.rowKey : 'row_id'} rowKey={this.props.value?.rowKey ? this.props.value.rowKey : 'row_id'}
data={data} data={data}
isHiddenPage={this.props.isHiddenPage != null ? this.props.isHiddenPage : false} isHiddenPage={this.props.isHiddenPage != null ? this.props.isHiddenPage : false}
columns={this.columns} columns={this.columns}
scroll={{ x: AllWidth }} scroll={{ x: AllWidth }}
selectedRows={selectedRows} selectedRows={selectedRows}
onSelectRow={this.handleSelectRows} onSelectRow={this.handleSelectRows}
onChange={this.handleStandardTableChange} onChange={this.handleStandardTableChange}
loading={this.props.loading} loading={this.props.loading}
/> />
)} )}
</div> </div>
) : ( ) : (
<div <div
id="mobelDiv" id="mobelDiv"
style={{ style={{
overflow: 'hidden', overflow: 'hidden',
width: isMobile ? showMobileDiv : showDiv, width: isMobile ? showMobileDiv : showDiv,
height: '100%', height: '100%',
}}> }}>
<div> <div>
{get === 'mobile' ? <div>手机端,请使用浏览器将手机横屏查看</div> : null} {get === 'mobile' ? <div>手机端,请使用浏览器将手机横屏查看</div> : null}
{showDiv && ( {showDiv && (
<StandardTable <StandardTable
showHeader={this.props.showHeader != null ? this.props.showHeader : true} showHeader={this.props.showHeader != null ? this.props.showHeader : true}
noSelectRow={ noSelectRow={
this.props.onSelectRow == null && this.props.onSelectRow == null &&
(rights == null || !rights.includes('delete')) (rights == null || !rights.includes('delete'))
} }
rowKey={this.props.value?.rowKey ? this.props.value.rowKey : 'row_id'} rowKey={this.props.value?.rowKey ? this.props.value.rowKey : 'row_id'}
data={data} data={data}
columns={this.columns} columns={this.columns}
scroll={this.props.value && this.props.value.columns ? {} : { x: AllWidth }} scroll={this.props.value && this.props.value.columns ? {} : { x: AllWidth }}
selectedRows={selectedRows} selectedRows={selectedRows}
isHiddenPage={ isHiddenPage={
this.props.isHiddenPage != null ? this.props.isHiddenPage : false this.props.isHiddenPage != null ? this.props.isHiddenPage : false
} }
onSelectRow={this.handleSelectRows} onSelectRow={this.handleSelectRows}
onChange={this.handleStandardTableChange} onChange={this.handleStandardTableChange}
loading={this.props.loading} loading={this.props.loading}
/> />
)} )}
</div> </div>
</div> </div>
)} )}
</div> </div>
</Card> </Card>
<CreateForm {...parentMethods} modalVisible={modalVisible} /> <CreateForm {...parentMethods} modalVisible={modalVisible}/>
</> </>
); );
if (isFormCom) { if (isFormCom) {
return xxxx; return xxxx;
} }
return <PageHeaderWrapper title="">{xxxx}</PageHeaderWrapper>; return <PageHeaderWrapper title="">{xxxx}</PageHeaderWrapper>;
} }
} }
export default FormList; export default FormList;
one_stop_public/tableCompon/index.jsx
浏览文件 @ 5822ea6d
...@@ -2622,6 +2622,7 @@ ${obj[dataColumn.base52]} ...@@ -2622,6 +2622,7 @@ ${obj[dataColumn.base52]}
cm = ( cm = (
<TableList <TableList
get={get} get={get}
uuid={uuid}
isTree={json.isTree} isTree={json.isTree}
json={json} json={json}
loading={this.props.loading} loading={this.props.loading}
...@@ -3788,6 +3789,7 @@ ${obj[dataColumn.base52]} ...@@ -3788,6 +3789,7 @@ ${obj[dataColumn.base52]}
})( })(
<TableList <TableList
json={json} json={json}
uuid={uuid}
isTree={json.isTree} isTree={json.isTree}
isHiddenPage={json.isHiddenPage} isHiddenPage={json.isHiddenPage}
showHeader={json.showHeader} showHeader={json.showHeader}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论