web
/
kwgl-web
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix eslint

Browse Source
master
zhengpengju 4 years ago
parent e27bd4021e
commit 5700c002c4
3 changed files with 120 additions and 143 deletions
Show Stats Download Patch File Download Diff File

5
mock/dataSource.ts
Unescape View File

@ -75,7 +75,7 @@ const getDataSource = (req: Request, res: Response) => {
hideInTable: false, // 在 Table 中隐藏
hideInSearch: false, // 在 Table 的查询表格中隐藏
columns:[], // 嵌套子项，valueType 为 dependency 时，请使用(values) => ProFormColumnsType[]其他情况使用 ProFormColumnsType[]
width: 100
width: 150
},
{
key: '2', // 确定这个列的唯一值,一般用于 dataIndex 重复的情况
@ -189,9 +189,10 @@ const getDataSource = (req: Request, res: Response) => {
{
key: '4', // 确定这个列的唯一值,一般用于 dataIndex 重复的情况
dataIndex: 'examinationRoomTotal', // 与实体映射的 key，数组会被转化 [a,b] => Entity.a.b
valueType: 'text', // 数据的渲渲染方式，我们自带了一部分，你可以可以自定义 valueType https://procomponents.ant.design/components/schema/
valueType: 'digit', // 数据的渲渲染方式，我们自带了一部分，你可以可以自定义 valueType https://procomponents.ant.design/components/schema/
title: '考场数', // 标题的内容，在 form 中是 label
hideInSearch: true, // 在 Table 的查询表格中隐藏
width: 150
},
{
key: '5', // 确定这个列的唯一值,一般用于 dataIndex 重复的情况

254
src/pages/ListTableList2/index.tsx
Unescape View File

@ -1,5 +1,5 @@
import React, { useRef, useState } from 'react';
import { useRequest } from 'ahooks';
import React, { useEffect, useRef, useState } from 'react';
import { useRequest } from 'umi';
import type { ActionType } from '@ant-design/pro-table';
// import type { ProFormColumnsType } from '@ant-design/pro-form';
@ -9,7 +9,7 @@ import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions';
import ProDescriptions from '@ant-design/pro-descriptions';
import { BetaSchemaForm} from '@ant-design/pro-form';
import { Button, Modal } from 'antd';
import { Button, Col, Modal, Row, Space } from 'antd';
import { MobileOutlined, PhoneOutlined, PlusOutlined } from '@ant-design/icons';
import { schemaExamination, dataExamination } from './service';
@ -26,99 +26,31 @@ export type TableListItem = {
money: number;
memo: string;
};
//const initialValues = []
export default () => {
const [currentRow, setCurrentRow] = useState<TableListItem>();
const [showDetail, setShowDetail] = useState<boolean>(false);
const [showModify, setShowModify] = useState<boolean>(false);
const setInitialValues = (columns: any[], values: any) => {
console.log('setInitialValues', values)
const initialValues: any[] = [];
columns.forEach((column) => {
const key: any = column?.dataIndex || '';
initialValues.push({...column, initialValue: key ? values[key] : ''})
})
return initialValues || []
}
const [showCreate, setShowCreate] = useState<boolean>(false);
const [showUpdate, setShowUpdate] = useState<boolean>(false);
const [columns, setColumns] = useState<any[]>([]);
const ref = useRef<ActionType>();
/*
setValues([{
title: '序号',
dataIndex: 'index',
valueType: 'indexBorder',
render: (text, record, index) =>
`${(this.state.page - 1) * (this.state.pageSize) + (index + 1)}`,
width: 48,
}])
const { data } = useRequest(() => {
return schemaExamination({});
});
console.log('schema-data', data)
// console.log('columns', columns)
*/
console.log('proTable init..');
/*
let columns: ProColumns<TableListItem>[] = [
{
title: '序号',
dataIndex: 'index',
valueType: 'indexBorder',
// render: (text, record, index) =>
// `${(this.state.page - 1) * (this.state.pageSize) + (index + 1)}`,
width: 48,
},
{
title: '操作',
width: 180,
key: 'option',
valueType: 'option',
render: () => [
<a
key="view"
onClick={() => {
handleUpdateModalVisible(true);
// setCurrentRow(record);
}}
>查看</a>,
<a
key="edit"
onClick={() => {
handleUpdateModalVisible(true);
// setCurrentRow(record);
}}
>编辑</a>,
<a key="delete">删除</a>,
],
},
];
*/
/** 获取数据结构体 */
const { data } = useRequest(schemaExamination);
console.log('data---', data);
let columns: any
if(data && data.hasOwnProperty('data')){
console.log('in data')
console.log(data.data)
columns = data.data;
/**
* 获取数据结构体
* 可通过key 或 dataIndex 查找到字段项索引
*/
console.log('debug1');
useEffect(() => {
const _data = data || [];
let idx = -1;
idx = columns.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'publicTelephone' })
idx = _data?.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'publicTelephone' }) || -1;
if(idx !== -1){
columns[idx] = {...columns[idx], renderText: (val: string) => `${(val || '').replace(/(\d{2})(\d{2})(\d{4})/,"$1**$3")}`}
_data[idx] = {..._data[idx], renderText: (val: string) => `${(val || '').replace(/(\d{2})(\d{2})(\d{4})/,"$1**$3")}`}
}
idx = columns.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'examiner' })
/** 渲染复合数据项 */
idx = _data?.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'examiner' }) || -1;
if(idx !== -1){
columns[idx] = {
...columns[idx],
_data[idx] = {
..._data[idx],
render: (text: any) => (
<>
<span style={{ display: 'block' }}>{text?.realname}</span>
@ -129,54 +61,62 @@ export default () => {
}
}
/** 添加序号列 */
idx = columns.findIndex((val: { key: string; }) => { return val.key === 'option' })
if(idx === -1){ // 没有操作项时添加，避免重复添加
columns.unshift(
/** 添加序号和操作列 */
setColumns(
[
{
title: '序号',
dataIndex: 'index',
key: 'index',
valueType: 'indexBorder',
render: (index: number) =>{
render: (text: React.ReactNode, _: any, index: number) =>{
if(ref && ref?.current && ref?.current?.pageInfo){
return `${(ref?.current?.pageInfo?.current - 1) * (ref.current.pageInfo?.pageSize) + (index + 1)}`;
}else{
return index;
return '';
}
},
width: 48,
},
..._data,
{
title: '操作',
width: 180,
key: 'option',
valueType: 'option',
render: (_dom: any, entity: React.SetStateAction<TableListItem | undefined>) => [
<a key="detail" onClick={() => {
console.log('entity', entity);
setCurrentRow(entity);
setShowDetail(true);
}} >查看</a>,
<a key="update" onClick={() => {
console.log('columns1', columns)
setCurrentRow(entity);
setShowUpdate(true);
console.log('columns2', columns)
}} >编辑</a>,
<a key="delete" onClick={() => {
//
}} >删除</a>,
],
}
)
}
/** 追加操作列 */
idx = columns.findIndex((val: { key: string; }) => { return val.key === 'option' })
if(idx === -1){ // 没有操作项时添加，避免重复添加
columns.push({
title: '操作',
width: 180,
key: 'option',
valueType: 'option',
render: (_dom: any, entity: React.SetStateAction<TableListItem | undefined>) => [
<a key="view" onClick={() => {
console.log('entity', entity);
setCurrentRow(entity);
setShowDetail(true);
}} >查看</a>,
<a key="edit" onClick={() => {
setCurrentRow(entity);
setShowModify(true);
}} >编辑</a>,
<a key="delete" onClick={() => {
]
);
}, [data]);
}} >删除</a>,
],
})
}
/** 获取列数据初始值 */
const getInitialValues = (cols: any[], vals: any) => {
console.log('getInitialValues-columns', columns)
console.log('getInitialValues-values', vals)
const initialValues: any[] = [];
cols.forEach((column: { dataIndex: string; }) => {
const key: any = column?.dataIndex || '';
initialValues.push({...column, initialValue: key ? vals[key] : ''})
})
console.log('initialValues::',initialValues)
return initialValues || []
}
//
//console.log('columns---', columns);
console.log('ref.current', ref.current);
return (
<PageContainer>
<ProTable<TableListItem | any>
@ -192,29 +132,19 @@ console.log('ref.current', ref.current);
defaultCollapsed: false,
}}
dateFormatter="string"
toolbar={{
/*toolbar={{
title: '高级表格',
tooltip: '这是一个标题提示',
}}
}}*/
toolBarRender={() => [
<BetaSchemaForm<DataItem>
layout='horizontal'
trigger={<Button type="primary" key="primary"><PlusOutlined /> 新建 </Button>}
layoutType="ModalForm"
labelCol = {{ span: 8 }}
wrapperCol={{ span: 12 }}
onFinish={async (values) => {
console.log(values);
}}
// action=''
title="新建"
columns={columns}
/>
,
<Button type="primary" key="primary" onClick={() => {
console.log('columns::::', columns);
setShowCreate(true)
}}><PlusOutlined /> 新建 </Button>
]}
/>
<Modal
title={currentRow?.name}
title={currentRow?.name || '详细'}
width='60%'
visible={showDetail}
onCancel={() => {
@ -238,30 +168,74 @@ console.log('ref.current', ref.current);
/>
)}
</Modal>
<Modal
title='新建考点'
//
width='60%'
visible={showCreate}
destroyOnClose
onCancel={() => {
setShowCreate(false);
}}
footer={null}
>
<BetaSchemaForm<DataItem>
layout = 'horizontal'
layoutType = 'Form'
labelCol = {{ span: 8 }}
wrapperCol={{ span: 12 }}
onFinish={async (values) => {
console.log(values);
}}
submitter={{
render: (props, doms) => (
<Row>
<Col span={12} offset={8}>
<Space>{doms}</Space>
</Col>
</Row>
),
}}
// action = ''
title = "新建"
columns = {columns}
/>
</Modal>
<Modal
title='编辑'
width='60%'
visible={showModify}
visible={showUpdate}
destroyOnClose
onCancel={() => {
setCurrentRow(undefined); // 设置当前行
setShowModify(false);
setShowUpdate(false);
}}
footer={null}>
{currentRow?.name && (
<BetaSchemaForm<DataItem>
layout = 'horizontal'
layoutType = 'Form'
labelCol = {{ span: 8 }}
wrapperCol={{ span: 12 }}
onFinish={async (values) => {
console.log(values);
}}
submitter={{
render: (props, doms) => (
<Row>
<Col span={12} offset={8}>
<Space>{doms}</Space>
</Col>
</Row>
),
}}
// action = ''
title = "编辑"
columns = {setInitialValues(columns, currentRow)}
columns = {getInitialValues(columns, currentRow)}
/>
)}
</Modal>
</PageContainer>
);
};

4
src/pages/ListTableList2/service.ts
Unescape View File

@ -11,7 +11,9 @@ type DataItem = {
/** 获取考点数据结构 GET /api/dataSource?key=examination&schema=true&data=false */
export async function schemaExamination(
params: any,
params: {
// query
},
options?: { [key: string]: any },
) {
return request<{

Write Preview
Loading…
Cancel
Save