|
|
|
@ -1,5 +1,5 @@
|
|
|
|
|
import React, { useEffect, useRef, useState } from 'react';
|
|
|
|
|
import { useRequest } from 'ahooks-v2';
|
|
|
|
|
import { useRequest } from 'umi';
|
|
|
|
|
import type { ActionType } from '@ant-design/pro-table';
|
|
|
|
|
// import type { ProFormColumnsType } from '@ant-design/pro-form';
|
|
|
|
|
|
|
|
|
@ -7,7 +7,7 @@ import { PageContainer } from '@ant-design/pro-layout';
|
|
|
|
|
import ProTable from '@ant-design/pro-table';
|
|
|
|
|
import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions';
|
|
|
|
|
import ProDescriptions from '@ant-design/pro-descriptions';
|
|
|
|
|
import { BetaSchemaForm} from '@ant-design/pro-form';
|
|
|
|
|
import { BetaSchemaForm } from '@ant-design/pro-form';
|
|
|
|
|
|
|
|
|
|
import { Button, Col, Modal, Row, Space } from 'antd';
|
|
|
|
|
import { MobileOutlined, PhoneOutlined, PlusOutlined } from '@ant-design/icons';
|
|
|
|
@ -18,7 +18,7 @@ import type { DataItem } from '../dashboard/analysis/data';
|
|
|
|
|
export type TableListItem = {
|
|
|
|
|
id: string;
|
|
|
|
|
code: number;
|
|
|
|
|
name: string;
|
|
|
|
|
name: string;
|
|
|
|
|
creator: string;
|
|
|
|
|
status: string;
|
|
|
|
|
createdAt: number;
|
|
|
|
@ -41,82 +41,110 @@ export default () => {
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
const _data = data || [];
|
|
|
|
|
let idx = -1;
|
|
|
|
|
idx = _data?.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'publicTelephone' }) || -1;
|
|
|
|
|
if(idx !== -1){
|
|
|
|
|
_data[idx] = {..._data[idx], renderText: (val: string) => `${(val || '').replace(/(\d{2})(\d{2})(\d{4})/,"$1**$3")}`}
|
|
|
|
|
idx =
|
|
|
|
|
_data?.findIndex((val: { dataIndex: string }) => {
|
|
|
|
|
return val.dataIndex === 'publicTelephone';
|
|
|
|
|
}) || -1;
|
|
|
|
|
if (idx !== -1) {
|
|
|
|
|
_data[idx] = {
|
|
|
|
|
..._data[idx],
|
|
|
|
|
renderText: (val: string) => `${(val || '').replace(/(\d{2})(\d{2})(\d{4})/, '$1**$3')}`,
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/** 渲染复合数据项 */
|
|
|
|
|
idx = _data?.findIndex((val: { dataIndex: string; })=>{ return val.dataIndex === 'examiner' }) || -1;
|
|
|
|
|
if(idx !== -1){
|
|
|
|
|
idx =
|
|
|
|
|
_data?.findIndex((val: { dataIndex: string }) => {
|
|
|
|
|
return val.dataIndex === 'examiner';
|
|
|
|
|
}) || -1;
|
|
|
|
|
if (idx !== -1) {
|
|
|
|
|
_data[idx] = {
|
|
|
|
|
..._data[idx],
|
|
|
|
|
..._data[idx],
|
|
|
|
|
render: (text: any) => (
|
|
|
|
|
<>
|
|
|
|
|
<span style={{ display: 'block' }}>{text?.realname}</span>
|
|
|
|
|
<small style={{ display: 'inline-block', marginRight: 5 }}><PhoneOutlined /> {text?.tel}</small>
|
|
|
|
|
<small style={{ display: 'inline-block', marginRight: 5 }}><MobileOutlined /> {text?.mobile}</small>
|
|
|
|
|
<small style={{ display: 'inline-block', marginRight: 5 }}>
|
|
|
|
|
<PhoneOutlined /> {text?.tel}
|
|
|
|
|
</small>
|
|
|
|
|
<small style={{ display: 'inline-block', marginRight: 5 }}>
|
|
|
|
|
<MobileOutlined /> {text?.mobile}
|
|
|
|
|
</small>
|
|
|
|
|
</>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
),
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/** 添加序号和操作列 */
|
|
|
|
|
setColumns(
|
|
|
|
|
[
|
|
|
|
|
{
|
|
|
|
|
title: '序号',
|
|
|
|
|
key: 'index',
|
|
|
|
|
valueType: 'indexBorder',
|
|
|
|
|
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 '';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
width: 48,
|
|
|
|
|
setColumns([
|
|
|
|
|
{
|
|
|
|
|
title: '序号',
|
|
|
|
|
key: 'index',
|
|
|
|
|
valueType: 'indexBorder',
|
|
|
|
|
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 '';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
..._data,
|
|
|
|
|
{
|
|
|
|
|
title: '操作',
|
|
|
|
|
width: 180,
|
|
|
|
|
key: 'option',
|
|
|
|
|
valueType: 'option',
|
|
|
|
|
render: (_dom: any, entity: React.SetStateAction<TableListItem | undefined>) => [
|
|
|
|
|
<a key="detail" onClick={() => {
|
|
|
|
|
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)
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
查看
|
|
|
|
|
</a>,
|
|
|
|
|
<a
|
|
|
|
|
key="update"
|
|
|
|
|
onClick={() => {
|
|
|
|
|
console.log('columns1', columns);
|
|
|
|
|
setCurrentRow(entity);
|
|
|
|
|
setShowUpdate(true);
|
|
|
|
|
console.log('columns2', columns)
|
|
|
|
|
}} >编辑</a>,
|
|
|
|
|
<a key="delete" onClick={() => {
|
|
|
|
|
console.log('columns2', columns);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
编辑
|
|
|
|
|
</a>,
|
|
|
|
|
<a
|
|
|
|
|
key="delete"
|
|
|
|
|
onClick={() => {
|
|
|
|
|
//
|
|
|
|
|
}} >删除</a>,
|
|
|
|
|
],
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
删除
|
|
|
|
|
</a>,
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
]);
|
|
|
|
|
}, [data]);
|
|
|
|
|
|
|
|
|
|
/** 获取列数据初始值 */
|
|
|
|
|
const getInitialValues = (cols: any[], vals: any) => {
|
|
|
|
|
console.log('getInitialValues-columns', columns)
|
|
|
|
|
console.log('getInitialValues-values', vals)
|
|
|
|
|
console.log('getInitialValues-columns', columns);
|
|
|
|
|
console.log('getInitialValues-values', vals);
|
|
|
|
|
const initialValues: any[] = [];
|
|
|
|
|
cols.forEach((column: { dataIndex: string; }) => {
|
|
|
|
|
cols.forEach((column: { dataIndex: string }) => {
|
|
|
|
|
const key: any = column?.dataIndex || '';
|
|
|
|
|
initialValues.push({...column, initialValue: key ? vals[key] : ''})
|
|
|
|
|
})
|
|
|
|
|
console.log('initialValues::',initialValues)
|
|
|
|
|
return initialValues || []
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
initialValues.push({ ...column, initialValue: key ? vals[key] : '' });
|
|
|
|
|
});
|
|
|
|
|
console.log('initialValues::', initialValues);
|
|
|
|
|
return initialValues || [];
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<PageContainer>
|
|
|
|
|
<ProTable<TableListItem | any>
|
|
|
|
@ -135,43 +163,52 @@ export default () => {
|
|
|
|
|
/*toolbar={{
|
|
|
|
|
title: '高级表格',
|
|
|
|
|
tooltip: '这是一个标题提示',
|
|
|
|
|
}}*/
|
|
|
|
|
}}*/
|
|
|
|
|
toolBarRender={() => [
|
|
|
|
|
<Button type="primary" key="primary" onClick={() => {
|
|
|
|
|
console.log('columns::::', columns);
|
|
|
|
|
setShowCreate(true)
|
|
|
|
|
}}><PlusOutlined /> 新建 </Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="primary"
|
|
|
|
|
key="primary"
|
|
|
|
|
onClick={() => {
|
|
|
|
|
console.log('columns::::', columns);
|
|
|
|
|
setShowCreate(true);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<PlusOutlined /> 新建{' '}
|
|
|
|
|
</Button>,
|
|
|
|
|
]}
|
|
|
|
|
/>
|
|
|
|
|
<Modal
|
|
|
|
|
title={currentRow?.name || '详细'}
|
|
|
|
|
width='60%'
|
|
|
|
|
width="60%"
|
|
|
|
|
visible={showDetail}
|
|
|
|
|
onCancel={() => {
|
|
|
|
|
setCurrentRow(undefined); // 设置当前行
|
|
|
|
|
setShowDetail(false);
|
|
|
|
|
}}
|
|
|
|
|
footer={null}>
|
|
|
|
|
footer={null}
|
|
|
|
|
>
|
|
|
|
|
{currentRow?.name && (
|
|
|
|
|
<ProDescriptions<TableListItem>
|
|
|
|
|
column={2}
|
|
|
|
|
/* title={currentRow?.name} */
|
|
|
|
|
dataSource={currentRow}
|
|
|
|
|
/*
|
|
|
|
|
<ProDescriptions<TableListItem>
|
|
|
|
|
column={2}
|
|
|
|
|
/* title={currentRow?.name} */
|
|
|
|
|
dataSource={currentRow}
|
|
|
|
|
/*
|
|
|
|
|
request={async () => ({
|
|
|
|
|
data: currentRow || {},
|
|
|
|
|
})}*/
|
|
|
|
|
params={{
|
|
|
|
|
id: currentRow?.id,
|
|
|
|
|
}}
|
|
|
|
|
columns={columns.slice(0, columns.length - 1) as ProDescriptionsItemProps<TableListItem>[]}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
params={{
|
|
|
|
|
id: currentRow?.id,
|
|
|
|
|
}}
|
|
|
|
|
columns={
|
|
|
|
|
columns.slice(0, columns.length - 1) as ProDescriptionsItemProps<TableListItem>[]
|
|
|
|
|
}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
</Modal>
|
|
|
|
|
<Modal
|
|
|
|
|
title='新建考点'
|
|
|
|
|
//
|
|
|
|
|
width='60%'
|
|
|
|
|
title="新建考点"
|
|
|
|
|
//
|
|
|
|
|
width="60%"
|
|
|
|
|
visible={showCreate}
|
|
|
|
|
destroyOnClose
|
|
|
|
|
onCancel={() => {
|
|
|
|
@ -179,10 +216,10 @@ export default () => {
|
|
|
|
|
}}
|
|
|
|
|
footer={null}
|
|
|
|
|
>
|
|
|
|
|
<BetaSchemaForm<DataItem>
|
|
|
|
|
layout = 'horizontal'
|
|
|
|
|
layoutType = 'Form'
|
|
|
|
|
labelCol = {{ span: 8 }}
|
|
|
|
|
<BetaSchemaForm<DataItem>
|
|
|
|
|
layout="horizontal"
|
|
|
|
|
layoutType="Form"
|
|
|
|
|
labelCol={{ span: 8 }}
|
|
|
|
|
wrapperCol={{ span: 12 }}
|
|
|
|
|
onFinish={async (values) => {
|
|
|
|
|
console.log(values);
|
|
|
|
@ -197,45 +234,45 @@ export default () => {
|
|
|
|
|
),
|
|
|
|
|
}}
|
|
|
|
|
// action = ''
|
|
|
|
|
title = "新建"
|
|
|
|
|
columns = {columns}
|
|
|
|
|
title="新建"
|
|
|
|
|
columns={columns}
|
|
|
|
|
/>
|
|
|
|
|
</Modal>
|
|
|
|
|
|
|
|
|
|
<Modal
|
|
|
|
|
title='编辑'
|
|
|
|
|
width='60%'
|
|
|
|
|
title="编辑"
|
|
|
|
|
width="60%"
|
|
|
|
|
visible={showUpdate}
|
|
|
|
|
destroyOnClose
|
|
|
|
|
onCancel={() => {
|
|
|
|
|
setShowUpdate(false);
|
|
|
|
|
}}
|
|
|
|
|
footer={null}>
|
|
|
|
|
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 = {getInitialValues(columns, currentRow)}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
<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={getInitialValues(columns, currentRow)}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
</Modal>
|
|
|
|
|
|
|
|
|
|
</PageContainer>
|
|
|
|
|
</PageContainer>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|