fastlion-amis
Version:
一种MIS页面生成工具
1,250 lines • 102 kB
JavaScript
// import React from 'react';
// import Checkbox from 'antd/lib/Checkbox';
// import Pagination from 'antd/lib/Pagination';
// import Spin from 'antd/lib/Spin';
// import message from 'antd/lib/message';
// import Button from 'antd/lib/Button';
// import Popover from 'antd/lib/Popover';
// import { render as renderAmis } from '../../../../index'
// import { Renderer, RendererProps } from '../../../../factory';
// import { BaseSchema, SchemaApi } from '../../../../Schema';
// import './style/baseCss/index.css';
// import './components/MainExport/MainExport.css';
// import { Action } from '../../../../types';
// import { filter } from '../../../../utils/tpl';
// import { ScopedContext, IScopedContext } from '../../../../Scoped';
// import { CN } from './locale/pagination';
// import { findDOMNode } from 'react-dom';
// import styled from 'styled-components';
// import {
// WrapperLionTableContainer,
// WrapperLionTableFix,
// WrapperLionTableBase,
// WrapperLionTableFilter,
// WrapperLionTableHeaderToolBar,
// WrapperCommonThead,
// WrapperCommonTbody,
// WrapperCommonSurfaceGroup,
// WrapperBtnPopover
// } from './style/index';
// import { extractTemplate } from '../../utils/utils';
// import { LionTableStore, ILionTableStore } from '../../../../store/liontable';
// import { evalExpression } from '../../../../utils/tpl';
// import { handleActionCallback_10003, createObject } from '../../../../utils/helper';
// import SectionList from './components/headerSection/index'
// import { getLodop } from '../../../../utils/print/LodopFuncs'
// import { ModalPrint } from '../../LabelPrint/ModalPrint';
// import './style/baseCss/popover.css'
// import { RendererEnv } from '../../../../env';
// const StyledMargin = styled.div`
// .antd-Button{
// margin-right:5px;
// }
// `
// interface LionTableState {
// fixLeft: number; // 左侧滚动条位置
// tableBody: any; // 表格体引用
// fixColumns: any[]; // 从表列配置
// selectList: any; // 被选中的数据行
// SonList: any; // 从表数据
// checkAll: boolean; // 选中所有数据
// loading: boolean; // 表格加载loading
// pageData: any[]; // 主表分页数据
// totalSize: number;
// pageSize: number;
// page: number;
// wrapper: number;
// _container_height: any;
// table_height: any;
// _SonList: any;
// storageSource: any;
// pageSelectList: any;
// colHideList: any;
// hasFetch: boolean; // 标记是否请求过
// ModalProps: any;
// modalLabelPrintOpen: boolean;
// modalFilePrintOpen: boolean;
// surfaceItemWidth: number;
// }
// interface ColumnObject {
// label?: string;
// name?: string;
// group?: Array<any>;
// hideLabel?: boolean;
// hiddenOn?: string;
// [propName: string]: any;
// }
// export interface LionTableSchema extends BaseSchema {
// type: 'lion-table';
// /*
// 组件类型
// */
// filter?: any;
// /*
// 查询器表单
// */
// headerToolbar: Array<any>;
// /*
// 头部按钮组(非选中才能点击,普通按钮)
// */
// bulkActions: Array<any>;
// /*
// 头部按钮组(批量,有数据被选中才能点击)
// */
// primaryField?: string;
// /*
// 主表行的主键字段
// */
// columns: Array<ColumnObject>;
// /*
// 子表列配置
// */
// api?: SchemaApi;
// /*
// 数据源请求地址及参数
// */
// list_columns: Array<ColumnObject>
// /*
// 主表列配置
// */
// source: string;
// /*
// 根据字段获取响应地内容中的表格数据,默认为items
// */
// checkbox: boolean;
// /*
// 是否使用复选框
// */
// detailTableField?: string;
// /*
// 表示主表中的子表的标识符,用于提取主表中的子表数据
// */
// style?: any;
// /*
// 自定义表格的样式对象
// */
// subTableTitle?: string;
// /*
// 从表弹出框标题
// */
// width?: number;
// /*
// 设置表格宽度
// */
// totalTab?: {
// key: number;
// totalNum: string | number;
// }
// /*
// 当前tab对应的标记
// */
// setTotalNum?: (key: string | number, totalNum: number, tableName: string) => void;
// /*
// 用于当表格使用tabs组件包裹时,表格初始化完成后,用于改变tabs上的标签的内容
// */
// onAction?: (
// e: React.UIEvent<any> | void,
// action: Action,
// ctx: object,
// throwErrors: boolean,
// delegate?: IScopedContext
// ) => any;
// /*
// 按钮触发器
// */
// subSchemaApi?: SchemaApi;
// /*
// 查看全部子表内容的api
// */
// isDialogMode?: boolean;
// /*
// 是否处于弹窗模式下
// */
// initFetch?: boolean;
// /*
// 初始是否拉取数据,默认为true
// */
// keepItemSelectionOnPageChange?: boolean;
// /*
// 是否开启跨页选中
// */
// perPageAvailable?: number[];
// /*
// 分页
// */
// }
// interface LionTableContextSchema {
// env?: RendererEnv;
// handleAction?: Function;
// primaryField?: string;
// }
// export const LionTableContext = React.createContext<LionTableContextSchema>({})
// export interface LionTableProps extends RendererProps, Omit<LionTableSchema, 'type' | 'className' | 'data'> { store: ILionTableStore; }
// const calcGap = (rest: number = 0) => {
// // window.document.documentElement.clientHeight - 20 - (document.querySelector('.ant-tabs-content')?.querySelector('.antd-Tabs-links') ? 32 : 0),
// let rootDom: Element | null = document.querySelector('.ant-tabs-content');
// // let linkHeight: number = rootDom?.querySelector('.antd-Tabs-links')?.clientHeight ?? 0;
// // let thisDom: Element | null | Text = findDOMNode(this);
// let height: number = rootDom?.clientHeight! - 20;
// return height - rest
// }
// const calcInnerWidth = () => {
// let clientWidth: number = document.querySelector('.ant-tabs-content')?.clientWidth!;
// // document.documentElement.clientWidth || document.body.clientWidth 直接获取耗时差距太大,暂不使用
// return clientWidth > 1680 ? clientWidth : 1680
// }
// const antiShake = (callBack: Function, wait = 0, rest?: unknown) => {
// let timer: any = null;
// return () => {
// if (timer) {
// clearTimeout(timer);
// timer = null;
// }
// timer = setTimeout(() => {
// callBack(rest)
// }, wait)
// }
// }
// export class LionTable extends React.Component<LionTableProps, LionTableState>{
// static contextType = ScopedContext;
// constructor(props: LionTableProps, context: IScopedContext) {
// super(props);
// this.state = {
// fixLeft: 0, // 左侧滚动条位置
// tableBody: React.createRef() as any, // 表格体引用
// fixColumns: [], // 从表列配置
// selectList: {} as any, // 被选中的数据行
// pageSelectList: {} as any,
// SonList: {} as any,
// checkAll: false, // 选中所有数据
// loading: false, // 表格加载loading
// pageData: [],
// _SonList: [],
// totalSize: 0,
// pageSize: 10,
// page: 1,
// storageSource: {} as any,
// colHideList: {} as any,
// wrapper: calcInnerWidth(),
// _container_height: calcGap(),
// table_height: calcGap(40 + 46 + (props?.filter ? 50 : 0) + ((props?.headerToolbar?.length > 0 || props?.bulkActions?.length > 0) ? 40 : 10)),
// hasFetch: false, // 标记是否请求过
// ModalProps: {
// title: '打印选项',
// show: false,
// onHide: null
// },
// modalLabelPrintOpen: false,
// modalFilePrintOpen: false,
// surfaceItemWidth: 0
// }
// this.handleAction = this.handleAction.bind(this);
// const scoped = context;
// scoped.registerComponent(this);
// }
// static defaultProps: Partial<LionTableProps> = {
// source: 'items',
// ids: '_id',
// store: LionTableStore as any
// }
// _uploadRef: any;
// get dataSource() {
// return this.state.pageData
// }
// _bindRef = (ref: any) => {
// this._uploadRef = ref;
// }
// // 主表选中行
// get checkList() {
// const { selectList, storageSource } = this.state;
// let _checkList = Object.entries(selectList).filter((item: any) => {
// return item[1] === true
// }).map(item => {
// return item[0]
// })
// return _checkList.map((item: any) => {
// return storageSource[item]
// })
// }
// get record_ids() {
// const { primaryField } = this.props;
// const { pageData } = this.state;
// let _ids: string = '';
// pageData.forEach((record: any) => {
// _ids += record.hasOwnProperty(primaryField) ? record[primaryField!] + ',' : ''
// })
// return _ids.slice(0, _ids.length - 1)
// }
// get ids() {
// let _ids: string = '';
// const { primaryField } = this.props;
// this.checkList.map((_select: any) => {
// _ids += _select.hasOwnProperty(primaryField) ? _select[primaryField!] + ',' : ''
// })
// return _ids.slice(0, _ids.length - 1)
// }
// // 计算左侧固定表格的宽度
// get leftTableWidth() {
// const { fixColumns } = this.state;
// let count = 0;
// fixColumns.forEach((item: any, index: number) => {
// if (item?.fixed === 'left') {
// count += item?.width
// }
// })
// return count
// }
// // 计算右侧固定表格的宽度
// get rightTableWidth() {
// const { fixColumns } = this.state;
// let count = 0;
// fixColumns.forEach((item: any, index: number) => {
// if (item?.fixed === 'right') {
// count += item?.width
// }
// });
// return count
// }
// CounterChildWidth(fixColumns: any) {
// let count = fixColumns.reduce((prev: any, current: any, index: number) => {
// return prev + (current?.width ?? 0)
// }, 0)
// return count
// }
// get surfaceWidth() {
// const { list_columns } = this.props;
// let count = list_columns.reduce((prev, current, index) => {
// return prev + (current?.width ?? 0)
// }, 0)
// return count
// }
// // 用于添加并合并多个className
// classNames = (...names: any[]) => {
// let currentNames: string[] = [];
// names.forEach((name) => {
// if (name) currentNames.push(name)
// });
// return currentNames.join(' ');
// }
// // 用于生成唯一id以关联主从表
// uuid = () => {
// const temp_url = URL.createObjectURL(new Blob());
// const uuid = temp_url.toString();
// URL.revokeObjectURL(temp_url);
// return uuid.substr(uuid.lastIndexOf("/") + 1);
// }
// matchStr(str: string) {
// let charS = '';
// for (let s of str) {
// if (s === "$" || s === "}" || s === "{") {
// charS += s.replace(s, '')
// } else {
// charS += s
// }
// }
// return charS
// }
// requestFilterSource = (paramsField: any, isFilter: boolean = false): void => {
// const { env, columns, data } = this.props;
// let _data = {
// ...paramsField,
// ...data,
// ...data?.__super
// }
// this.setState({
// loading: true
// })
// try {
// env.fetcher(this.props?.api!, _data).then((res: any) => {
// if (!this.state.hasFetch) {
// this.setState({
// hasFetch: true
// })
// }
// if (res?.status === 0) {
// if (isFilter) {
// this.setState({
// storageSource: {},
// selectList: {},
// pageSelectList: {}
// })
// }
// this.initScrollShadow();
// this.getFixedColumns(columns, res?.data ? res?.data : {});
// } else {
// this.setState({
// loading: false
// })
// throw new Error(res?.msg);
// }
// }).catch((e: Error) => {
// env.notify('error', e.message)
// })
// } catch (err) {
// console.log('err', err)
// message.error(err);
// this.setState({
// loading: false
// })
// }
// }
// initScrollShadow = (target?: any) => {
// // 滚动主体
// const scrollBody: any = target ? target : findDOMNode(this);
// const { fixColumns } = this.state;
// let scrollClientWidth: number = this.state.wrapper > this.CounterChildWidth(fixColumns) ? this.state.wrapper : this.CounterChildWidth(fixColumns)
// // 左侧固定表格
// const fixLeftTable: any = target ? target.parentElement.parentElement.querySelector('.lion-table-container-fixed-wrapper--left') : scrollBody.querySelector('.lion-table-container-fixed-wrapper--left');
// // 右侧固定表格
// const fixRightTable: any = target ? target.parentElement.parentElement.querySelector('.lion-table-container-fixed-wrapper--right') : scrollBody.querySelector('.lion-table-container-fixed-wrapper--right');
// // 滚动主体的向左滚动距离大于0且左侧固定表格不存在阴影class时,添加阴影效果
// if (scrollBody.scrollLeft > 0 && fixLeftTable?.className.indexOf('lion-talbe--fix--left--shadow') === -1) {
// fixLeftTable.className = fixLeftTable.className + ' lion-talbe--fix--left--shadow'
// }
// // 滚动主体的向左滚动距离小于等于0,移除左侧表格的阴影class
// if (scrollBody?.scrollLeft <= 0) {
// fixLeftTable.className = fixLeftTable?.className.replace(' lion-talbe--fix--left--shadow', '')
// }
// if (target) {
// // 滚动主体的clientWidth + scrollLeft 大于等于 滚动主体的滚动条长度,说明到最右边
// if (Math.floor(scrollBody.clientWidth + scrollBody.scrollLeft) >= scrollBody.scrollWidth) {
// fixRightTable.className = fixRightTable.className.replace(' lion-talbe--fix--right--shadow', '')
// }
// // 滚动主体的clientWidth + scrollLeft 小于 滚动主体的滚动条长度
// if ((Math.floor(scrollBody.clientWidth + scrollBody.scrollLeft) < scrollBody.scrollWidth && fixRightTable.className.indexOf('lion-talbe--fix--right--shadow') === -1)) {
// fixRightTable.className = fixRightTable.className + ' lion-talbe--fix--right--shadow'
// }
// return;
// }
// // 滚动主体的clientWidth + scrollLeft 大于等于 滚动主体的滚动条长度,说明到最右边
// if (scrollBody.scrollWidth >= scrollClientWidth) {
// fixRightTable.className = fixRightTable.className.replace(' lion-talbe--fix--right--shadow', '')
// }
// // 滚动主体的clientWidth + scrollLeft 小于 滚动主体的滚动条长度
// if (scrollBody.scrollWidth < scrollClientWidth && fixRightTable.className.indexOf('lion-talbe--fix--right--shadow') === -1) {
// fixRightTable.className = fixRightTable.className + ' lion-talbe--fix--right--shadow'
// }
// }
// // 表头选择框选中
// onCheckAllChange = (e: any, isClear?: boolean) => {
// e.preventDefault();
// const pageSelectList = this.state.pageSelectList;
// const selectList = this.state.selectList;
// const { checkAll } = this.state;
// const _checkAll = isClear ? false : !checkAll
// Object.keys(pageSelectList).forEach((item: any) => {
// selectList[item] = _checkAll;
// pageSelectList[item] = _checkAll;
// });
// this.setState({
// selectList: selectList,
// checkAll: _checkAll,
// pageSelectList: pageSelectList
// });
// }
// handleSectionChange = (e: React.MouseEvent, current: string, isClear: boolean) => {
// e.preventDefault()
// if (isClear) {
// this.onCheckAllChange(e, isClear)
// } else {
// this.handleMasterChange(e, current)
// }
// }
// // 主表选择框被选中时
// handleMasterChange = (e: any, current: any) => {
// e.preventDefault();
// // 点击时阻止默认事件
// const pageSelectList = this.state.pageSelectList;
// const selectList = this.state.selectList;
// let table_height = this.state.table_height;
// let checkAll;
// // 选中所有数据
// selectList[current] = !selectList[current];
// pageSelectList[current] = selectList[current];
// // 判断是否所有从表数据均被选中,若被选中则给表头选择框添加选中效果
// checkAll = Object.values(pageSelectList).every((item: any) => {
// if (item === false) {
// return false
// }
// return true
// });
// this.setState({
// selectList: selectList,
// checkAll: checkAll,
// pageSelectList: pageSelectList
// }, () => {
// });
// }
// CounteBtnLabelWidth = (buttons: any, pageData: any, num: number) => {
// let count: number = 0;
// let label: number = 0;
// let marginLength: number = 0;
// let btn_length: number = 0;
// pageData.forEach((source: any) => {
// let show_btns = buttons.filter((item: any) => {
// return !evalExpression(item?.hiddenOn, { ...source })
// }).slice(0, num)
// if (count < show_btns?.length) {
// show_btns?.forEach((btn: any) => {
// label += btn?.label?.length;
// })
// }
// count = (count >= show_btns?.length ? count : show_btns?.length);
// })
// marginLength = (count + 1) * 5; // 35
// btn_length = (label * 13 + 26 * (count ? count : 1)); // 78 + 26 * 6
// return { count: count, labelLength: label, btn_width_lenth: (marginLength + btn_length + 25) }
// }
// getFixedColumns = (columns: any, data: any) => {
// let dataSource: any = [];
// let wrapper: number = this.state.wrapper;
// const { source, checkbox, list_columns, detailTableField, isDialogMode, primaryField, keepItemSelectionOnPageChange } = this.props;
// if (data.hasOwnProperty(source)) {
// dataSource = data[source];
// }
// if (isDialogMode) {
// let thisParent = findDOMNode(this)?.parentElement;
// wrapper = (thisParent?.clientWidth! > 500 ? thisParent?.clientWidth! : 500)
// }
// // 复制一层列配置,计算固定列的left
// let copy_columns = JSON.parse(JSON.stringify(columns));
// let fixTag: any = {}; // 将要生成的列配置
// let tagIndex: any = {};
// let tag: number = 0;
// let pageData: any = [];
// let totalSize: number = 0;
// let MainList: any[] = []; // 存储主表
// let SonList: any = {}; // 存储从表
// let temp_select: any = {}; // 存储选中行
// let _SonList: any = [];
// let btn_length_max = 0;
// let is_not_exist: any[] = []; // 不存在width属性的列的集合
// let surface_not_exist_column: any[] = [];
// let storageSource: any = {};
// let pageSelectList: any = {};
// let colHideList: any = {};
// let checkAll: boolean = false;
// let surfaceWidth: number = this.surfaceWidth;
// let surface_btn: any = list_columns?.find((_column: any) => {
// return _column?.buttons
// })
// let child_btn: any = copy_columns?.find((_column: any) => {
// return _column?.buttons
// })
// // 计算存在width的列总长度以及统计不存在width的列
// columns.forEach((_column: any) => {
// if (!_column?.width && _column?.name) {
// is_not_exist.push({
// name: _column.name,
// })
// }
// })
// let empty_col: boolean = is_not_exist?.length === 0;
// // 主表从表数据提取
// dataSource?.map((source: any, sourceIndex: number) => {
// let _id = this.uuid();
// let mainList: any = {};
// Object.keys(source).map(sourceKey => {
// if (sourceKey.toLowerCase() === detailTableField?.toLowerCase()) {
// SonList[_id] = source[sourceKey]
// _SonList = _SonList.concat(source[sourceKey])
// } else {
// mainList[sourceKey] = source[sourceKey];
// }
// })
// mainList.id = _id;
// mainList.visible = false;
// MainList.push(mainList)
// })
// pageData = MainList;
// let surface_btn_length = this.CounteBtnLabelWidth(surface_btn?.buttons ? surface_btn?.buttons : [], pageData, surface_btn?.num > surface_btn?.buttons?.length ? surface_btn?.buttons?.length : surface_btn?.num);
// let child_btn_length = this.CounteBtnLabelWidth(child_btn?.buttons ? child_btn?.buttons : [], _SonList, child_btn?.num > child_btn?.buttons?.length ? child_btn?.buttons?.length : child_btn?.num);
// if (surface_btn_length?.labelLength > child_btn_length?.labelLength) {
// btn_length_max = surface_btn_length?.btn_width_lenth
// } else if (surface_btn_length?.labelLength === child_btn_length?.labelLength) {
// btn_length_max = surface_btn_length?.count >= child_btn_length?.count ? surface_btn_length?.btn_width_lenth : child_btn_length?.btn_width_lenth
// } else {
// btn_length_max = child_btn_length?.btn_width_lenth
// }
// /*
// 初始化:
// 1. 计算主表和子表中的列分组中要隐藏的列,标记主表和子表中的group,对比确认每个列的的高度
// 2. 计算主表/子表行中的buttons的个数最大值/btn_length_max,标记surfae(child).num,标记surfae(child).buttons.length
// 3. 确认操作栏的宽度,其中宽度优先级如下
// 3.1 先计算出hiddenOn表达式未被隐藏的buttons,得出每行相比较的最大值btn_length_max
// 3.2 再标记num,比较num与btn_length_max
// 3.3 btn_length_max !=0时:num ? (btn_length_max <= num ? btn_length_max : num) : btn_length_max
// 3.4 btn_length_max == 0时:height = 0 + 60
// */
// // 处理子表没有操作列的情况
// if ((!child_btn || child_btn?.buttons?.length <= 0) && (surface_btn?.buttons && surface_btn?.buttons?.length > 0)) {
// copy_columns.push({
// name: "operation",
// label: "操作",
// fixed: "right",
// buttons: [],
// width: btn_length_max
// })
// surfaceWidth += btn_length_max;
// } else if ((child_btn && child_btn?.buttons?.length > 0)) {
// copy_columns[copy_columns.length - 1].width = btn_length_max;
// surfaceWidth += btn_length_max;
// }
// // checkbox属性存在添加选择框
// if (checkbox) {
// surfaceWidth += 50;
// copy_columns.unshift({
// name: "checkbox",
// fixed: 'left',
// width: 50,
// leftWidth: 0,
// align: 'center'
// });
// }
// /*
// 1. 主表列和从表列总宽度均大于wrapper
// 如果不存在列宽的列数量为0,则不需要再额外配置列宽
// 否则需要给不存在列宽的列添加默认列宽
// 主表列 > 从表列 : 需要在主表列总宽度的基础上为从表列计算列宽
// 主表列 < 从表列 : 维持不变即可
// 2. 主表列和从表列已知总宽均小于wrapper
// 从表列以wrapper为基础
// */
// let childWidth = this.CounterChildWidth(copy_columns);
// let equalVal: number = 0;
// let summaryVal: number = 0;
// if (childWidth > wrapper || surfaceWidth > wrapper) {
// if (!empty_col) {
// equalVal = 80;
// }
// if (empty_col && surfaceWidth > childWidth) {
// equalVal = (surfaceWidth - childWidth) / (copy_columns?.length - 2)
// }
// } else {
// let targetWidth = surfaceWidth > childWidth ? surfaceWidth : childWidth;
// summaryVal = wrapper - targetWidth;
// if (empty_col) {
// equalVal = (wrapper - childWidth) / (copy_columns?.length - 2)
// } else {
// equalVal = (wrapper - childWidth) > is_not_exist?.length * 80 ? (wrapper - childWidth) / is_not_exist?.length : 80;
// }
// }
// /*
// 1. 主表列和从表列总宽度均大于wrapper
// 主表列 > 从表列 : 需要在主表列总宽度的基础上为从表列计算列宽
// 主表列 < 从表列 : 维持不变即可
// 2. 主表列和从表列已知总宽均小于wrapper
// 从表列以wrapper为基础
// */
// // 计算固定列的left
// copy_columns.forEach((column: any, index: number) => {
// if (empty_col && (column?.name !== "checkbox" && column?.type !== "operation")) {
// column.width = (column.width ?? 0) + equalVal
// }
// if (!column?.width && !empty_col) {
// column.width = equalVal
// }
// tagIndex[tag] = column;
// if (index === 0) {
// column.leftWidth = 0;
// }
// if (index >= 1) {
// tagIndex[tag]['leftWidth'] = fixTag[tag - 1].leftWidth + fixTag[tag - 1]?.width;
// }
// tag++;
// fixTag = { ...fixTag, ...tagIndex }
// });
// if (checkbox) {
// fixTag[0].label = <Checkbox />;
// }
// fixTag.length = tag;
// fixTag = Array.from(fixTag);
// // 计算固定列的right
// copy_columns.reverse().forEach((column: any, index: number, arr: any[]) => {
// if (index === 0) {
// fixTag[arr.length - 1].rightWidth = 0;
// }
// if (index >= 1) {
// fixTag[tag - (index + 1)]['rightWidth'] = fixTag[tag - index].rightWidth + fixTag[tag - index]?.width;
// }
// })
// if (data.hasOwnProperty('total')) {
// totalSize = data?.total;
// }
// pageData.forEach((source: any) => {
// if (keepItemSelectionOnPageChange && !this.state.storageSource.hasOwnProperty(source[(primaryField ? primaryField : 'id')])) {
// storageSource[source[(primaryField ? primaryField : 'id')]] = source
// } else if (!keepItemSelectionOnPageChange) {
// storageSource[source[(primaryField ? primaryField : 'id')]] = source
// }
// if (!this.state.selectList.hasOwnProperty(source[(primaryField ? primaryField : 'id')])) {
// temp_select[source[(primaryField ? primaryField : 'id')]] = false;
// pageSelectList[source[(primaryField ? primaryField : 'id')]] = false;
// } else {
// pageSelectList[source[(primaryField ? primaryField : 'id')]] = this.state.selectList[source[(primaryField ? primaryField : 'id')]];
// }
// colHideList[source[(primaryField ? primaryField : 'id')]] = false
// });
// checkAll = Object.values(pageSelectList).every((item: any) => {
// if (item === false) {
// return false
// }
// return true
// });
// list_columns.forEach((_column: any) => {
// if (!_column?.width && !_column?.hasOwnProperty('buttons')) {
// surface_not_exist_column.push({
// name: _column.name,
// })
// }
// // if (_column?.width) {
// // summaryVal -= _column?.width
// // }
// })
// this.props?.setTotalNum && this.props?.setTotalNum(this.props.totalTab?.key!, data?.total, this.props.name)
// console.time('lionTable')
// this.setState({
// fixColumns: fixTag,
// selectList: keepItemSelectionOnPageChange ? { ...this.state.selectList, ...temp_select } : pageSelectList,
// pageData,
// totalSize,
// SonList,
// loading: false,
// checkAll: checkAll,
// _SonList: _SonList,
// wrapper: wrapper,
// storageSource: keepItemSelectionOnPageChange ? { ...this.state.storageSource, ...storageSource } : storageSource,
// pageSelectList: pageSelectList,
// colHideList: colHideList,
// surfaceItemWidth: summaryVal / surface_not_exist_column?.length
// });
// console.timeEnd('lionTable')
// }
// // 表格滚动条拖动时给固定的列添加或删除阴影效果
// handleScroll = (target: any, e: any) => {
// const { scrollLeft, scrollTop } = target;
// this.initScrollShadow(target)
// const fixBodyers: any = target.parentElement.parentElement.getElementsByClassName('lion-table-container-fixed-body');
// const tableHeaders: any = target.parentElement.parentElement.getElementsByClassName('lion-table-header');
// for (let i = 0; i < fixBodyers.length; i++) {
// fixBodyers[i].scrollTop = scrollTop
// }
// if (tableHeaders.length > 0) {
// tableHeaders[0].scrollLeft = scrollLeft;
// }
// };
// showTotal = () => {
// const { page, pageSize, totalSize } = this.state;
// const _page = totalSize === 0 ? 0 : page;
// const total = totalSize;
// const currentTotal = total === 0 ? 0 : Math.ceil(total / pageSize);
// return `${_page}/${currentTotal} 总共:${totalSize} 项`;
// }
// // 点击展开或收起操作
// handleOpenCol = (source: any, SonList: any) => {
// const { primaryField } = this.props;
// const { colHideList } = this.state;
// // const index = pageData.findIndex(item => {
// // return item === source
// // })
// // let open_source = pageData.find(item => {
// // return item === source
// // })
// // open_source.visible = !open_source.visible;
// // pageData.splice(index, 1, open_source as never);
// this.setState({
// colHideList: {
// ...colHideList,
// [source[primaryField!]]: !colHideList[source[primaryField!]]
// },
// })
// }
// // 查看全部
// handleViewAll = (surface: any) => {
// const { subSchemaApi, env, store } = this.props;
// env?.fetcher(subSchemaApi!, surface).then((res: any) => {
// })
// }
// handleAddClass = (arr: any, tabIndex: number) => {
// Array.from(arr).forEach((_node: any) => {
// if (_node?.attributes.tabindex.nodeValue === tabIndex) {
// _node.className += ' tr--hover'
// }
// })
// }
// handleTrMouseOver = (e: any) => {
// if (e.currentTarget.className.indexOf('tr--hover') !== -1) {
// return;
// }
// const _body: any = findDOMNode(this)
// const bodyTable: any = _body.querySelector('.lion-table-body');
// // 左侧固定表格
// const fixLeftTable: any = _body.querySelector('.lion-table-container-fixed-wrapper--left');
// // 右侧固定表格
// const fixRightTable: any = _body.querySelector('.lion-table-container-fixed-wrapper--right');
// const bodyTr = bodyTable.getElementsByClassName('tbody-tr--column--white');
// const fixLeftTr = fixLeftTable.getElementsByClassName('tbody-tr--column--white');
// const fixRightTr = fixRightTable.getElementsByClassName('tbody-tr--column--white');
// this.handleAddClass(bodyTr, e.currentTarget.attributes.tabindex.nodeValue)
// this.handleAddClass(fixLeftTr, e.currentTarget.attributes.tabindex.nodeValue)
// this.handleAddClass(fixRightTr, e.currentTarget.attributes.tabindex.nodeValue)
// }
// handleTrMouseOut = (e: any) => {
// const _body: any = findDOMNode(this);
// const bodyTable: any = _body?.querySelector('.lion-table-body') as any;
// // 左侧固定表格
// const fixLeftTable: any = _body?.querySelector('.lion-table-container-fixed-wrapper--left');
// // 右侧固定表格
// const fixRightTable: any = _body?.querySelector('.lion-table-container-fixed-wrapper--right');
// const bodyTr = bodyTable.getElementsByClassName('tbody-tr--column--white');
// const fixLeftTr = fixLeftTable.getElementsByClassName('tbody-tr--column--white');
// const fixRightTr = fixRightTable.getElementsByClassName('tbody-tr--column--white');
// this.handleRemoveClass(bodyTr)
// this.handleRemoveClass(fixLeftTr)
// this.handleRemoveClass(fixRightTr)
// }
// handleRemoveClass = (arr: any) => {
// Array.from(arr).forEach((_node: any) => {
// _node.className = _node.className.replace('tr--hover', '')
// })
// }
// handlePageSizeChange = (page: number, pageSize: number) => {
// if (this._uploadRef) {
// this._uploadRef?.handleBulkChange({ perPage: pageSize, page: page });
// }
// this.setState({
// page,
// pageSize,
// checkAll: false,
// pageSelectList: {}
// }, () => {
// this.requestFilterSource(this._uploadRef ? this._uploadRef?.props?.data : { perPage: pageSize, page: page });
// })
// }
// MonitorPageChanges = (e: any) => {
// // let clientWidth = window.document.documentElement.clientWidth || window.document.body.clientWidth;
// const { isDialogMode, columns, checkbox } = this.props;
// let wrapper = calcInnerWidth();
// if (isDialogMode) {
// let thisParent = findDOMNode(this)?.parentElement;
// wrapper = (thisParent?.clientWidth! > 500 ? thisParent?.clientWidth! : 500)
// }
// const _columns: any = this.state.fixColumns;
// const _wrapper: number = Math.ceil(wrapper);
// let tagIndex: any = {};
// let tag: number = 0;
// let fixTag: any = {};
// let childWidth = this.CounterChildWidth(_columns);
// let surfaceWidth = this.surfaceWidth + (checkbox ? 50 : 0) + (_columns[_columns?.length - 1]?.type === "operation" ? _columns[_columns?.length - 1]?.width : 0)
// let equalVal: number = 0;
// if (childWidth <= wrapper && surfaceWidth <= wrapper) {
// let targetWidth = surfaceWidth > childWidth ? surfaceWidth : childWidth;
// equalVal = (_wrapper - targetWidth) / (_columns?.length - 2)
// }
// if (_wrapper > 1680) {
// _columns.forEach((_column: any, index: number, _columnsArr: any[]) => {
// tagIndex[tag] = _column;
// if (index === 0) {
// _column.leftWidth = 0;
// }
// if (index >= 1) {
// tagIndex[tag]['leftWidth'] = fixTag[tag - 1].leftWidth + fixTag[tag - 1]?.width;
// }
// if (index >= 1 && _column?.name !== "checkbox" && _column?.type !== "operation") {
// tagIndex[tag]['width'] = tagIndex[tag]['width'] + equalVal;
// }
// tag++;
// fixTag = { ...fixTag, ...tagIndex }
// })
// fixTag.length = tag;
// fixTag = Array.from(fixTag)
// // 计算固定列的right
// _columns.reverse().forEach((column: any, index: number, arr: any[]) => {
// if (index === 0) {
// fixTag[arr.length - 1].rightWidth = 0;
// }
// if (index >= 1) {
// fixTag[tag - (index + 1)]['rightWidth'] = fixTag[tag - index].rightWidth + fixTag[tag - index]?.width;
// }
// })
// this.setState({
// wrapper: _wrapper,
// fixColumns: fixTag
// }, () => {
// this.initScrollShadow()
// })
// }
// }
// MonitorTableChanges = (e?: any) => {
// let isTab = this.props.totalTab;
// let _dis = 10;
// if (this.props.filter) _dis += 50
// if ((this.props.headerToolbar?.length > 0 || this.props?.bulkActions?.length > 0)) _dis += 30
// if (isTab) _dis += 32;
// if (this.props.keepItemSelectionOnPageChange) _dis += 35
// let _page_height: any = calcGap();
// let table_height = _page_height - 10 - 46 - 40 - _dis;
// // if (table_height === this.state.table_height) {
// // return
// // }
// this.setState({
// _container_height: _page_height,
// table_height: table_height
// })
// }
// handleFilterParams = (value: any) => {
// const { page, pageSize } = this.state;
// this._uploadRef?.handleBulkChange({ perPage: pageSize, page: page });
// const filterParams = this._uploadRef ? this._uploadRef?.props?.data : { perPage: pageSize, page: page };
// this.requestFilterSource({ ...value, ...filterParams }, true)
// }
// reloadTarget = (reload: string, ctx: any, callBack?: () => void) => {
// const scoped = this.context as IScopedContext;
// // callBack && callBack();
// scoped.reload(reload, ctx);
// // 用于刷新目标组件
// }
// closeTarget(target: string) {
// const scoped = this.context as IScopedContext;
// scoped.close(target);
// }
// reload = (subPath: string, query: any, ctx: any): void => {
// this.handleFilterParams(ctx)
// }
// receive = (value: any, subPath: any): void => {
// this.handleFilterParams(value)
// }
// doAction = (query: any, ctx: any): void => {
// this.handleFilterParams(ctx)
// }
// handleAction = async (
// e: React.UIEvent<any> | void,
// action: Action,
// ctx: any,
// callBack?: () => void,
// throwErrors: boolean = false,
// delegate?: IScopedContext
// ): Promise<any> => {
// const { env, store, messages, onAction } = this.props;
// if (action.actionType === 'ajax') {
// store.setCurrentAction(action);
// const res = await store
// .lionSaveRemote(action.api as string, { ...store.data, ...ctx }, {
// successMessage:
// (action.messages && action.messages.success) ||
// (messages && messages.saveSuccess),
// errorMessage:
// (action.messages && action.messages.failed) ||
// (messages && messages.saveSuccess)
// }).then(response => {
// const data = createObject(ctx, response ? response : null);
// // if ((data as any)?.status === 10003) {
// // // onAction?.(e, action, { ...store.data, ...ctx }, throwErrors, delegate || this.context);
// // handleActionCallback_10003(data, store, this.handleAction, () => { action.close && this.closeTarget(action.close) }, false, env)
// // return false
// // }
// const redirect =
// action.redirect && filter(action.redirect, store.data);
// redirect && env.jumpTo(redirect, action);
// action.reload && this.reloadTarget(action.reload, { ...store.data, ...ctx });
// return false
// }).catch((error) => { console.info(error) })
// return res
// } else if (action.actionType === 'export') {
// store.setCurrentAction(action);
// let exportData: any = action?.exportType === 2 ? ctx : {};
// exportData = { ...exportData, ...this?._uploadRef?.props?.store?.data };
// exportData.primaryField = this.props.primaryField;
// exportData.selectedItems = this.checkList;
// exportData.ids = (action?.exportType && action?.exportType === 2 ? ctx[this.props.primaryField!] : this.ids);
// store.openLionExport(exportData, env)
// return false
// } else if (action.actionType === 'loginAmazon') {
// store.setCurrentAction(action);
// store.openAmazonLoginPage(ctx, env)
// return false
// } else if (action.actionType === 'label-print') {
// // Jay
// store.setCurrentAction(action);
// const { primaryField } = this.props
// const { translate: __ } = this.props
// const LODOP = getLodop()
// if (LODOP) {
// this.setState({
// ModalProps: {
// ...action,
// title: __('CRUD.printOptions'),
// show: true,
// isFilePrint: false,
// isRow: true,
// ctx: { ...ctx, primaryField },
// onHide: () => { this.setState({ modalLabelPrintOpen: false }) },
// }
// })
// this.setState({ modalLabelPrintOpen: true })
// }
// }
// else {
// onAction?.(e, action, { ...store.data, ...ctx }, throwErrors, delegate || this.context);
// return false
// }
// }
// // 没有数据时加载占位器
// renderEmptyData = () => {
// const { width, translate: __, filter } = this.props;
// const { hasFetch } = this.state
// return <div
// className="lion-table-empty"
// style={{
// width: width ? width : '100%',
// }}
// >
// <div>
// <div className="lion-table-empty-body">
// <div className="lion-table-empty-container">
// <div>
// {/* 测试用图片 */}
// {/* <img alt='' src='https://erp.gerpgo.com/img/empty.891aa2e8.png' /> */}
// <img alt='' src='./public/images/nodata.png' />
// {!hasFetch && filter ?
// <div className='empty-placeholder'>{__('placeholder.trySearch')}</div> :
// <div className='empty-placeholder'>{__('placeholder.noData')}</div>}
// </div>
// </div>
// </div>
// </div>
// </div>
// }
// /**
// * Jay
// * 标签、文件打印
// */
// renderPrint(ctx: { items: any[], selectedItems: any[], ids: string, primaryField: string, }, schema?: any, isFilePrint?: boolean) {
// const {
// translate: __,
// classnames: nx
// } = this.props;
// const { selectedItems } = ctx
// const disabled = schema.disabled || evalExpression(schema.disabledOn, ctx)
// return (
// <>
// <Button
// type="primary"
// className={nx(schema._className, { 'is-disabled': disabled })}
// disabled={disabled}
// onClick={() => {
// const LODOP = getLodop()
// if (LODOP) {
// this.setState({
// ModalProps: {
// ...schema,
// title: __('CRUD.printOptions'),
// show: true,
// isFilePrint,
// ctx,
// onHide: () => { isFilePrint ? this.setState({ modalFilePrintOpen: false }) : this.setState({ modalLabelPrintOpen: false }) },
// query: this._uploadRef?.props?.store?.data
// }
// })
// isFilePrint ? this.setState({ modalFilePrintOpen: true }) :
// this.setState({ modalLabelPrintOpen: true })
// }
// }}
// >
// {__(schema.label ? schema.label : !isFilePrint ? 'CRUD.labelPrint' : 'CRUD.filePrint')}
// </Button>
// </>
// );
// }
// // 渲染头部按钮及批量按钮
// renderToolBars = (toolBars: any, type: string) => {
// const _className = type === 'header' ? 'blukAction' : (this.checkList?.length > 0 ? "blukAction" : "blukAction is-disabled");
// const _disabled = type === 'header' ? false : (this.checkList?.length > 0 ? false : true);
// const toolBarList: any = [];
// toolBars && toolBars?.length > 0 && toolBars?.forEach((_toolBar: any, _toolIndex: number) => {
// let _data: any = {};
// _data.selectedItems = this.checkList;
// _data.ids = this.ids;
// _data.items = this.dataSource;
// _data.record_ids = this.record_ids;
// if (_toolBar.type === 'label-print') {
// toolBarList.push(this.renderPrint(_data, { ..._toolBar, _className }));
// } else if (_toolBar.type === 'file-print') {
// toolBarList.push(this.renderPrint(_data, { ..._toolBar, _className }, true));
// } else {
// toolBarList.push(renderAmis(_toolBar, {
// className: _className,
// key: _toolIndex,
// disabled: _disabled,
// data: _data,
// onAction: this.handleAction
// }))
// }
// })
// return toolBarList?.length === 0 ? null : toolBarList
// }
// // 表格头部工具栏渲染
// renderHeaderToolbars = (): JSX.Element => {
// const { headerToolbar, bulkActions } = this.props;
// return <WrapperLionTableHeaderToolBar className="lion-table-header-toolbar">
// <div className="lion-nav-operate-group">
// {this.renderToolBars(headerToolbar, 'header')}
// {this.renderToolBars(bulkActions, 'bulk')}
// </div>
// <div className="lion-nav-tool-group">
// </div>
// </WrapperLionTableHeaderToolBar>
// }
// // 表格查询器加载
// renderFilter = (): JSX.Element | null => {
// const { filter } = this.props;
// const that = this;
// return filter ? <WrapperLionTableFilter className="lion-table-filter">
// <div className="filter-group">
// <div className="filter-container">
// <div className="filterItem">
// {
// filter ? renderAmis(filter, {
// "_bindRef": (_this: any) => {
// that._bindRef(_this)
// },
// className: 'lion-filter',
// }) : null
// }
// </div>
// </div>
// </div>
// </WrapperLionTableFilter> : null
// }
// // 展开与收起行渲染
// renderVisibleTr = (source: any, fixed?: string) => {
// const { fixColumns, SonList, colHideList } = this.state;
// const { render, subTableTitle, subSchemaApi, primaryField } = this.props;
// const fixedLeftClass = fixed ? (fixed === 'left' ? ("lion-cell--fix--" + fixed) : 'fix--hidden') : '';
// const fixedRighttClass = fixed ? (fixed === 'right' ? ("lion-cell--fix--" + fixed) : 'fix--hidden') : '';
// return subSchemaApi || (SonList.hasOwnProperty(source.id) && SonList[source.id].length > 4) ?
// <tr className='tbody-tr--column--common lion-tr--column--hide'>
// <td
// className={this.classNames('tbody-td--column', 'tbody-td--column--hide', 'tbody-td--column--hide--checkbox', fixedLeftClass)}
// >
// </td>
// <td
// style={{ padding: '0px !important' }}
// className={'tbody-td--column--hide'}
// colSpan={(Object.keys(fixColumns).length - 2)}
// >
// {
// fixed ? null : <div className="td--column--hide--cell">
// <div className="td--column--hide--cell--container">
// <div>
// <span
// className="hide--cell--operation"
// onClick={(e) => {
// subSchemaApi ? null : this.handleOpenCol(source, SonList[source.id])
// // this.handleViewAll(source)
// }}>
// {
// subSchemaApi ? render('点击查看全部数据', {
// "actionType": "dialog",
// "type": "action",
// "level": "primary",
// "name": "click_cat_all_data",
// "className": "hide--cell--operation hide--cell--action",
// "label": "点击查看全部数据",
// "close": false,
// "dialog": {
// "title": subTableTitle,
// "type": "dialog",
// "body": {
// "schemaApi": subSchemaApi,
// "data": source,
// "type": "service"
// },
// "size": "lg",
// "bodyClassName": "overflow-y-auto max-h-nestSide-dialog",
// "className": "h-full",
// "actions": []
// }
// }) : (SonList[source.id].length > 4 ? (!colHideList[source[primaryField!]] ? '共计' + SonList[source.id].length + '条数据,展开查看全部>>' : '点击收起') : null)
// }
// {/* {SonList[source.id].length > 2 && !source.visible ? '共计' + SonList[source.id].length + '条数据,展开查看全部>>' : '点击收起'} */}
// </span>
// </div>
// </div>
// </div>
// }
// </td>
// <td
// className={this.classNames('tbody-td--column', 'thead-th--column', fixedRighttClass)}
// style={{
// backgroundColor: 'inherit'
// }}
// >
// </td>
// </tr> : null
// }
// renderSurfaceTr = (source: any) => {
// const { fixColumns, surfaceItemWidth } = this.state;
// const { list_columns, checkbox, primaryField } = this.props;
// const _btn_cols = list_columns.find((_column: any) => {
// return _column?.buttons
// })
// return <tr onClick={(e) => { this.handleMasterChange(e, source[primaryField!]) }} className='tbody-tr--column--common tbody-tr--column--gray'>
// {/* 主表行单选框渲染逻辑 */}
// {
// checkbox ? <td className='tbody-td--column tbody-td--column--surface--checkbox'
// >
// </td> : null
// }
// {/* 主表行渲染 */}
// <td
// className='tbody-td--column thead-th--column tbody-td--column--surface--mainarea'
// style={{
// [checkbox ? '' : 'left']: 0
// }}
// // colSpan={Object.keys(fixColumns).length}
// colSpan={(_btn_cols && _btn_cols?.buttons?.length > 0) ? (Object.keys(fixColumns).length - 2) : Object.keys(fixColumns).length}
// >
// <div style={{ display: 'flex' }}>
// {/* 主表列分组渲染 */}
// {
// list_columns.map((_surface: any, _surfaceIndex: number) => {
// if (_surface?.buttons) return null
// return <WrapperCommonSurfaceGroup
// key={_surfaceIndex}
// style={{
// // width: _surface?.buttons ? (_surface?.width > btn_width ? _surface?.width : btn_width) : (_surface?.width ? _surface?.width : '200px'),
// width: _surface?.width ? _surface?.width : surfaceItemWidth,
// paddingLeft: _surfaceIndex === 0 ? '5px' : '',
// marginRight: _surface?.buttons ? 0 : '15px'
// }}>
// <div className="surface-group-container" style={{
// flexDirection: _surface?.group && _surface?.group?.length > 1 ? 'column' : 'row',
// justifyContent: _surface?.group && _surface?.group?.length > 1 ? 'center' : 'normal',
// alignItems: _surface?.group && _surface?.group?.length > 1 ? 'normal' : 'center'
// }}>
// {
// _surface?.group && _surface?.group?.length > 0 ? _surface?.group.map((_group: any, _groupIndex: number) => {
// let temp_element;
// let hide = _group?.hiddenOn ? evalExpression(_group?.hiddenOn, { ...source }) : false;
// if (hide) {
// return null
// }
// if (_group?.type) {
// temp_element = renderAmis({
// type: _group?.type,
// name: _group?.name,
// body: _group?.body
// }, {
// data: source
// })
// }
// return <span
// key={_groupIndex}
// className="surface-group-item"
// >
// {
// _group?.hideLabel ? (
// _group.type ? temp_element : source[_group?.name]
// ) : <><span
//