基本信息页面暂存
This commit is contained in:
xixi
parent
8a25fc7b1a
commit
c5c1792fc1
@ -54,7 +54,7 @@ export default function ListProj() {
|
||||
setIsLoading(true);
|
||||
},
|
||||
onSuccess({ data }) {
|
||||
console.log('看看结果', data);
|
||||
// console.log('看看结果', data);
|
||||
|
||||
setPage(data.page);
|
||||
setTotal(data.total);
|
||||
|
||||
@ -26,7 +26,7 @@ html, body {
|
||||
padding: 0;
|
||||
font-size: 14px;
|
||||
background-color: #EEEEEE;
|
||||
/* 禁止书香滚动条占位 隐藏浏览器默认的滚动条样式 */
|
||||
/* 禁止滚动条占位 隐藏浏览器默认的滚动条样式 */
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
|
||||
3
src/layout/Type/statedata.d.ts
vendored
Normal file
3
src/layout/Type/statedata.d.ts
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
interface BelongDataType{
|
||||
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
import './proj-edit-step.css';
|
||||
import { Breadcrumb, Col, DatePicker, Flex, message, Modal, Row, Spin, Select, Table, Space } from "antd";
|
||||
import { Breadcrumb, Cascader, Col, DatePicker, Flex, message, Modal, Row, Spin, Select, Table, Space } from "antd";
|
||||
import { FolderAddOutlined } from '@ant-design/icons';
|
||||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { Link, useNavigate, useParams } from "react-router-dom";
|
||||
@ -9,9 +9,11 @@ import { Button, Form, Input } from 'antd';
|
||||
import { AxiosResponse } from "axios";
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import type { SearchProps } from 'antd/es/input/Search';
|
||||
import type { TableColumnsType } from 'antd';
|
||||
// import type { TableColumnsType } from 'antd';
|
||||
import { ITree } from "../../../interfaces/dict/IDict.ts";
|
||||
const { Search } = Input;
|
||||
const { Column } = Table;
|
||||
// 基本信息文件类型
|
||||
type FieldType = {
|
||||
projSubName: string;
|
||||
projVersion: string;
|
||||
@ -19,25 +21,45 @@ type FieldType = {
|
||||
companyName: string;
|
||||
companyNameEn: string;
|
||||
};
|
||||
// 所属人信息类型
|
||||
type BelongPeopleType = {
|
||||
authorName: string;
|
||||
authorIdCardType: string;
|
||||
authorIdCard: string;
|
||||
authorNation: string;
|
||||
authorProvince: string;
|
||||
authorEstablishDate: Dayjs;
|
||||
}
|
||||
interface DataType {
|
||||
key: React.Key;
|
||||
name: string;
|
||||
age: number;
|
||||
address: string;
|
||||
select: boolean;
|
||||
}
|
||||
interface Option {
|
||||
value?: string | number | null;
|
||||
label: React.ReactNode;
|
||||
children?: Option[];
|
||||
isLeaf?: boolean;
|
||||
id: string;
|
||||
pId: string;
|
||||
}
|
||||
|
||||
export default function ProjEditStep2() {
|
||||
const nav = useNavigate();
|
||||
const pathParams = useParams();
|
||||
const [messageApi, contextHolder] = message.useMessage();
|
||||
const [form] = Form.useForm<FieldType>();
|
||||
const [formInfo] = Form.useForm<FieldType>();
|
||||
const [formBelong] = Form.useForm<BelongPeopleType>();
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [isEditModalOpen, setIsEditModalOpen] = useState(false);
|
||||
const height = window.innerHeight - 180;
|
||||
const [isNewBelongOpen, setIsNewBelongOpen] = useState(false)
|
||||
const height = window.innerHeight - 220;
|
||||
const dateFormat = 'YYYY年MM月DD日';
|
||||
|
||||
// 表格第几行数据
|
||||
const [clom,setClom] = useState('')
|
||||
// const [clom, setClom] = useState('')
|
||||
// 著作人搜索
|
||||
const belongPeopleSearch: SearchProps['onSearch'] = (value, _e, info) => (
|
||||
console.log(info?.source, value),
|
||||
@ -55,46 +77,120 @@ export default function ProjEditStep2() {
|
||||
// selectedRowKeys: React.Key[]
|
||||
onChange: (selectedRowKeys: React.Key[], selectedRows: DataType[]) => {
|
||||
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
|
||||
setClom(String(selectedRowKeys))
|
||||
// setClom(String(selectedRowKeys))
|
||||
setSelectedKeyst(selectedRowKeys)
|
||||
},
|
||||
|
||||
|
||||
};
|
||||
// 表格数据
|
||||
const datanew = []
|
||||
// 所属着表格数据
|
||||
const [tableBelongData, setTableBelongData] = useState<BelongDataType>([])
|
||||
const data: DataType[] = [
|
||||
{
|
||||
key: '1',
|
||||
name: 'John Brown',
|
||||
age: 32,
|
||||
address: 'New York No. 1 Lake Park',
|
||||
select: false
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'Jim Green',
|
||||
age: 42,
|
||||
address: 'London No. 1 Lake Park',
|
||||
select: true
|
||||
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: 'Joe Black',
|
||||
age: 32,
|
||||
address: 'Sydney No. 1 Lake Park',
|
||||
select: false
|
||||
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
name: 'Disabled User',
|
||||
age: 99,
|
||||
address: 'Sydney No. 1 Lake Park',
|
||||
},
|
||||
];
|
||||
select: false
|
||||
|
||||
},
|
||||
{
|
||||
key: '5',
|
||||
name: '嘻嘻',
|
||||
age: 99,
|
||||
address: 'Sydney No. 1 Lake Park',
|
||||
select: false
|
||||
|
||||
},
|
||||
{
|
||||
key: '6',
|
||||
name: '呵呵',
|
||||
age: 99,
|
||||
address: 'Sydney No. 1 Lake Park',
|
||||
select: false
|
||||
|
||||
},
|
||||
|
||||
|
||||
|
||||
];
|
||||
const [selectedKeys, setSelectedKeyst] = useState(data.filter(item => item.select).map(item => item.key))
|
||||
// const selectedKeys = data.filter(item => item.select).map(item => item.key);
|
||||
console.log('selectedKeys:', selectedKeys);
|
||||
|
||||
// 创建所属者弹窗数据
|
||||
const [belongTitle, setbelongTitle] = useState('')
|
||||
const [areaArray, setAreaArray] = useState<Option[]>([]);
|
||||
const listArea = (pId: string) => {
|
||||
return new Promise<ITree[]>((resolve) => {
|
||||
get<ITree[]>({
|
||||
messageApi,
|
||||
url: '/api/area/list-area-ztree',
|
||||
config: {
|
||||
params: {
|
||||
id: pId
|
||||
}
|
||||
},
|
||||
onSuccess({ data }) {
|
||||
resolve(data);
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 验证创建著作人表单信息
|
||||
const handleOk = () => {
|
||||
formBelong.validateFields().then(() => {
|
||||
// 如果验证通过，则执行确认操作
|
||||
// 这里可以放置你的确认操作逻辑
|
||||
// alert(formBelong.getFieldValue('authorName'));
|
||||
|
||||
// 关闭 弹窗
|
||||
setIsNewBelongOpen(false)
|
||||
// 初始化数据
|
||||
formBelong.resetFields(); // 重置表单字段为初始值
|
||||
// alert('嘻嘻')
|
||||
|
||||
}).catch(() => {
|
||||
// 如果验证不通过，可以根据需要处理错误信息
|
||||
// (errorInfo);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
// 基本信息页面信息
|
||||
get({
|
||||
messageApi,
|
||||
url: `/api/proj/get/edit-step2/${pathParams.projId}`,
|
||||
onSuccess({ data }: AxiosResponse) {
|
||||
form.setFieldsValue({
|
||||
// console.log('基本信息',data);
|
||||
|
||||
formInfo.setFieldsValue({
|
||||
projSubName: data.projSubName,
|
||||
projVersion: data.projVersion,
|
||||
projDevCompleteDate: data.projDevCompleteDate ? dayjs(data.projDevCompleteDate, 'YYYY-MM-DD') : '',
|
||||
@ -103,11 +199,49 @@ export default function ProjEditStep2() {
|
||||
})
|
||||
}
|
||||
})
|
||||
// 所属者信息
|
||||
get({
|
||||
messageApi,
|
||||
url: `/api/proj/get/edit-step4/${pathParams.projId}`,
|
||||
onSuccess({data}: AxiosResponse) {
|
||||
console.log('所属者信息',data);
|
||||
|
||||
}
|
||||
})
|
||||
// 所属者表格
|
||||
get({
|
||||
messageApi,
|
||||
// url: `/api/proj/get/edit-step2/${pathParams.projId}`,
|
||||
|
||||
url: `/api/proj-owner/listpage`,
|
||||
// config: {
|
||||
// params: {
|
||||
// }
|
||||
// },
|
||||
onSuccess({ data }: AxiosResponse) {
|
||||
console.log('所属者表格', data);
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
listArea('0').then(data => {
|
||||
const options: Option[] = data.map(item => {
|
||||
return {
|
||||
value: item.name,
|
||||
label: item.name,
|
||||
isLeaf: !item.isParent,
|
||||
id: item.id,
|
||||
pId: item.pId
|
||||
}
|
||||
})
|
||||
setAreaArray(options);
|
||||
});
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<div style={{ height: `${height}px`, overflow: 'auto' }}>
|
||||
<div style={{ marginTop: '26px', height: `${height}px`, overflow: 'auto', background: 'var(--color-light)', position: 'relative' }}>
|
||||
|
||||
|
||||
{contextHolder}
|
||||
@ -119,7 +253,7 @@ export default function ProjEditStep2() {
|
||||
{title: '基本信息'},
|
||||
]}
|
||||
/> */}
|
||||
<div style={{ marginTop: '26px', height: '1500px', marginBottom: '40px', background: 'var(--color-light)' }}>
|
||||
<div style={{ height: '100%', marginBottom: '40px', background: 'var(--color-light)' }}>
|
||||
|
||||
<div className="form-container" >
|
||||
<div className='Step-title'>
|
||||
@ -128,8 +262,8 @@ export default function ProjEditStep2() {
|
||||
</div>
|
||||
<div className="form-body">
|
||||
<Form
|
||||
name="basic"
|
||||
form={form}
|
||||
name="Info"
|
||||
form={formInfo}
|
||||
layout="vertical"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 24 }}
|
||||
@ -246,6 +380,7 @@ export default function ProjEditStep2() {
|
||||
rules={[{ required: true, message: '请输入公司英文名称' }]}
|
||||
>
|
||||
<Input
|
||||
|
||||
style={{ height: '50px', width: '411px', fontSize: '16px' }}
|
||||
|
||||
placeholder="请输入公司英文名称" />
|
||||
@ -264,8 +399,10 @@ export default function ProjEditStep2() {
|
||||
</div>
|
||||
<div className='belongPeople-center'>
|
||||
<Button onClick={() => {
|
||||
alert(' 创建所属者')
|
||||
|
||||
// 先初始化数据
|
||||
formBelong.resetFields()
|
||||
setIsNewBelongOpen(true)
|
||||
setbelongTitle('创建所属者')
|
||||
}} type="primary" icon={<FolderAddOutlined style={{ fontSize: '18px' }} />} style={{ width: "160px", height: '43px', fontSize: '14px' }}>
|
||||
创建所属者
|
||||
</Button>
|
||||
@ -311,24 +448,74 @@ export default function ProjEditStep2() {
|
||||
rowSelection={{
|
||||
type: 'radio',
|
||||
...rowSelection,
|
||||
selectedRowKeys: selectedKeys // 设置默认选中的行
|
||||
}}
|
||||
// columns={columns}
|
||||
|
||||
|
||||
dataSource={data}
|
||||
pagination={{
|
||||
defaultPageSize: 5, // 设置默认一页显示 5 条数据
|
||||
}}
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
>
|
||||
<Column title="所属者名称" dataIndex="name" key="key" />
|
||||
<Column title="所属类型" dataIndex="name" key="key" />
|
||||
<Column title="所属证件类型" dataIndex="address" key="key" />
|
||||
<Column title="所属者身份证号" dataIndex="address" key="key" />
|
||||
<Column title="实名认证状态" dataIndex="address" key="key" />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
title="Action"
|
||||
title="操作"
|
||||
key="action"
|
||||
render={() => (
|
||||
render={(text, record: any) => (
|
||||
<Space size="middle">
|
||||
<a onClick={() => { alert(`编辑第${clom}行数据`)}}>编辑 </a>
|
||||
<span style={ {color:'red'}}>|</span>
|
||||
<a onClick={() => { alert(`查看第${clom}行数据`)}}>查看</a>
|
||||
<a onClick={() => {
|
||||
console.log('text:', text);
|
||||
console.log('record:', record);
|
||||
|
||||
|
||||
setbelongTitle('编辑所属者')
|
||||
setIsNewBelongOpen(true)
|
||||
// 发起请求给formBelong 表单赋值
|
||||
formBelong.setFieldsValue({
|
||||
// 公司名
|
||||
authorName: '嘻嘻',
|
||||
// 证件类型
|
||||
authorIdCardType: 'BUSINESS_LICENSE',
|
||||
// 证件号
|
||||
authorIdCard: '12345678',
|
||||
// 国籍
|
||||
authorNation: '中国',
|
||||
// 地区
|
||||
authorProvince: '',
|
||||
// 成立日期
|
||||
authorEstablishDate: '',
|
||||
})
|
||||
}}>编辑 </a>
|
||||
<span style={{ color: '#3472EE' }}>|</span>
|
||||
<a onClick={() => {
|
||||
alert('删除' + record.key)
|
||||
}}>删除</a>
|
||||
<span style={{ color: '#3472EE' }}>|</span>
|
||||
<a onClick={() => {
|
||||
setbelongTitle('查看所属者')
|
||||
setIsNewBelongOpen(true)
|
||||
// 发起请求给formBelong 表单赋值
|
||||
formBelong.setFieldsValue({
|
||||
// 公司名
|
||||
authorName: '查看',
|
||||
// 证件类型
|
||||
authorIdCardType: 'BUSINESS_LICENSE',
|
||||
// 证件号
|
||||
authorIdCard: '12345678',
|
||||
// 国籍
|
||||
authorNation: '中国',
|
||||
// 地区
|
||||
authorProvince: '',
|
||||
// 成立日期
|
||||
authorEstablishDate: '',
|
||||
})
|
||||
}}>查看</a>
|
||||
|
||||
</Space>
|
||||
)}
|
||||
/>
|
||||
@ -357,68 +544,309 @@ export default function ProjEditStep2() {
|
||||
</div>
|
||||
<div className='belongPeople-bot'>
|
||||
{/* 表格 */}
|
||||
<Table
|
||||
rowSelection={{
|
||||
type: 'radio',
|
||||
...rowSelection,
|
||||
selectedRowKeys: selectedKeys // 设置默认选中的行
|
||||
}}
|
||||
// columns={columns}
|
||||
|
||||
dataSource={data}
|
||||
pagination={{
|
||||
defaultPageSize: 5, // 设置默认一页显示 5 条数据
|
||||
}}
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
>
|
||||
<Column title="所属者名称" dataIndex="name" key="key" />
|
||||
<Column title="所属类型" dataIndex="name" key="key" />
|
||||
<Column title="所属证件类型" dataIndex="address" key="key" />
|
||||
<Column title="所属者身份证号" dataIndex="address" key="key" />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
title="操作"
|
||||
key="action"
|
||||
render={(text, record: any) => (
|
||||
<Space size="middle">
|
||||
<a onClick={() => {
|
||||
alert(text)
|
||||
|
||||
}}>编辑 </a>
|
||||
<span style={{ color: '#3472EE' }}>|</span>
|
||||
<a onClick={() => { alert(record.key) }}>查看</a>
|
||||
</Space>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div style={{ marginTop: '107px' }}>
|
||||
<div style={{ marginTop: '107px', display: 'flex', justifyContent: 'flex-end', paddingRight: '15px' }}>
|
||||
<Form.Item wrapperCol={{ span: 24 }}>
|
||||
<Flex align="center" justify="center" gap="large">
|
||||
<Button type="primary"
|
||||
htmlType="submit"
|
||||
style={{ backgroundColor: 'var(--color-primary)' }}>
|
||||
保存
|
||||
</Button>
|
||||
<Button type="default" htmlType="button" onClick={() => {
|
||||
nav(-1);
|
||||
}}>
|
||||
}}
|
||||
style={{ height: '49px', width: '104px', color: '#4B4B4B', background: '#D1D1D1', fontSize: '16px' }}>
|
||||
返回
|
||||
</Button>
|
||||
<Button type="primary"
|
||||
htmlType="submit"
|
||||
style={{ height: '49px', width: '104px', color: '#FDFDF2', background: '#1564ED', fontSize: '16px' }}>
|
||||
|
||||
保存
|
||||
</Button>
|
||||
|
||||
</Flex>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div style={{ height: '200px' }}></div>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* 总体选择保存的提示 */}
|
||||
<Modal title="提示"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
open={isEditModalOpen}
|
||||
onOk={() => {
|
||||
setIsEditModalOpen(false);
|
||||
put({
|
||||
messageApi,
|
||||
url: `/api/proj/update/edit-step2/${pathParams.projId}`,
|
||||
body: {
|
||||
projSubName: form.getFieldValue('projSubName'),
|
||||
projVersion: form.getFieldValue('projVersion'),
|
||||
projDevCompleteDate: dayjs(form.getFieldValue('projDevCompleteDate')).format(dateFormat),
|
||||
companyName: form.getFieldValue('companyName'),
|
||||
companyNameEn: form.getFieldValue('companyNameEn'),
|
||||
},
|
||||
onBefore() {
|
||||
setLoading(true);
|
||||
},
|
||||
onSuccess() {
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '编辑成功'
|
||||
})
|
||||
},
|
||||
onFinally() {
|
||||
setLoading(false);
|
||||
}
|
||||
})
|
||||
// 美哟u创建所属者 应该还得判断一下没选中所属者
|
||||
if (data.length == 0) {
|
||||
// alert('所属者不能为空')
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: '所属者不能为空'
|
||||
})
|
||||
setIsEditModalOpen(false);
|
||||
// 没有申请人 应该还得判断一下没选中申请人
|
||||
} else if (datanew.length == 0) {
|
||||
// alert('申请人不能为空')
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: '申请人不能为空'
|
||||
})
|
||||
setIsEditModalOpen(false);
|
||||
} else if (selectedKeys.length == 0) {
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: '请选择所属者'
|
||||
})
|
||||
setIsEditModalOpen(false);
|
||||
|
||||
} else {
|
||||
setIsEditModalOpen(false);
|
||||
put({
|
||||
messageApi,
|
||||
url: `/api/proj/update/edit-step2/${pathParams.projId}`,
|
||||
body: {
|
||||
projSubName: formInfo.getFieldValue('projSubName'),
|
||||
projVersion: formInfo.getFieldValue('projVersion'),
|
||||
projDevCompleteDate: dayjs(formInfo.getFieldValue('projDevCompleteDate')).format(dateFormat),
|
||||
companyName: formInfo.getFieldValue('companyName'),
|
||||
companyNameEn: formInfo.getFieldValue('companyNameEn'),
|
||||
},
|
||||
onBefore() {
|
||||
setLoading(true);
|
||||
},
|
||||
onSuccess() {
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '编辑成功'
|
||||
})
|
||||
},
|
||||
onFinally() {
|
||||
setLoading(false);
|
||||
}
|
||||
})
|
||||
}
|
||||
// setIsEditModalOpen(false);
|
||||
// put({
|
||||
// messageApi,
|
||||
// url: `/api/proj/update/edit-step2/${pathParams.projId}`,
|
||||
// body: {
|
||||
// projSubName: form.getFieldValue('projSubName'),
|
||||
// projVersion: form.getFieldValue('projVersion'),
|
||||
// projDevCompleteDate: dayjs(form.getFieldValue('projDevCompleteDate')).format(dateFormat),
|
||||
// companyName: form.getFieldValue('companyName'),
|
||||
// companyNameEn: form.getFieldValue('companyNameEn'),
|
||||
// },
|
||||
// onBefore() {
|
||||
// setLoading(true);
|
||||
// },
|
||||
// onSuccess() {
|
||||
// messageApi.open({
|
||||
// type: 'success',
|
||||
// content: '编辑成功'
|
||||
// })
|
||||
// },
|
||||
// onFinally() {
|
||||
// setLoading(false);
|
||||
// }
|
||||
// })
|
||||
}}
|
||||
onCancel={() => {
|
||||
setIsEditModalOpen(false);
|
||||
}}>
|
||||
<div>确定提交吗？</div>
|
||||
</Modal>
|
||||
|
||||
|
||||
{/* 选择创建所属者 */}
|
||||
<Modal
|
||||
okText="确认"
|
||||
// cancelText="取消"
|
||||
cancelText={belongTitle === '查看所属者' ? '返回' : '取消'}
|
||||
open={isNewBelongOpen}
|
||||
// 点击确认上传事件
|
||||
// onOk={() => {
|
||||
// }}
|
||||
onOk={
|
||||
handleOk
|
||||
}
|
||||
width={'66.67%'}
|
||||
// 确认按钮样式
|
||||
okButtonProps={{ style: { width: '102px', height: '49px', background: '#FFBA00', fontSize: '18px', color: '#FFFFFF', display: belongTitle == '查看所属者' ? 'none' : 'block' } }}
|
||||
// 返回按钮样式
|
||||
cancelButtonProps={{ style: { border: 'none', width: '102px', height: '49px', background: '#F3F3F3', fontSize: '18px', color: '#8C8C8C' } }}
|
||||
onCancel={() => { setIsNewBelongOpen(false) }}
|
||||
>
|
||||
<div className='belongPeople-Modal'>
|
||||
<div className='belongPeople-Mtop'>
|
||||
{belongTitle}
|
||||
</div>
|
||||
<div>
|
||||
<Form
|
||||
name="belongInfo"
|
||||
form={formBelong}
|
||||
layout="vertical"
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 24 }}
|
||||
style={{ width: '800px' }}
|
||||
onFinish={() => {
|
||||
// setIsNewBelongOpen(true);
|
||||
}}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Row gutter={15}>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="姓名或公司名称"
|
||||
name="authorName"
|
||||
rules={[{ required: true, message: '请输入姓名或公司名称' }]}
|
||||
>
|
||||
<Input placeholder="请输入姓名或公司名称"
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="成立日期"
|
||||
name="authorEstablishDate"
|
||||
rules={[{ required: true, message: '请选择成立日期' }]}
|
||||
>
|
||||
<DatePicker placeholder="请选择成立日期"
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
style={{ width: '100%' }}
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row gutter={15}>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="证件类型"
|
||||
name="authorIdCardType"
|
||||
rules={[{ required: true, message: '请选择证件类型' }]}
|
||||
>
|
||||
<Select
|
||||
placeholder="请选择样证件类型"
|
||||
onChange={(value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
}}
|
||||
options={[
|
||||
{ value: 'BUSINESS_LICENSE', label: '营业执照' },
|
||||
{ value: 'ID_CARD', label: '身份证' },
|
||||
]}
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="证件号"
|
||||
name="authorIdCard"
|
||||
rules={[{ required: true, message: '请输入证件号' }]}
|
||||
>
|
||||
<Input placeholder="请输入证件号"
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row gutter={15}>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="国籍"
|
||||
name="authorNation"
|
||||
rules={[{ required: true, message: '请选择国籍' }]}
|
||||
>
|
||||
<Select
|
||||
placeholder="请选择国籍"
|
||||
options={[
|
||||
{ value: '中国', label: '中国' },
|
||||
]}
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item<BelongPeopleType>
|
||||
label="省市"
|
||||
name="authorProvince"
|
||||
rules={[{ required: true, message: '请选择省市' }]}
|
||||
>
|
||||
<Cascader options={areaArray}
|
||||
loadData={(selectedOptions: Option[]) => {
|
||||
const targetOption = selectedOptions[selectedOptions.length - 1];
|
||||
listArea(targetOption.id).then(data => {
|
||||
targetOption.children = data.map(item => {
|
||||
return {
|
||||
value: item.name,
|
||||
label: item.name,
|
||||
isLeaf: !item.isParent,
|
||||
id: item.id,
|
||||
pId: item.pId
|
||||
}
|
||||
});
|
||||
setAreaArray([
|
||||
...areaArray
|
||||
])
|
||||
});
|
||||
}}
|
||||
placeholder="请选择省市"
|
||||
changeOnSelect
|
||||
disabled={belongTitle == '查看所属者' ? true : false}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</Modal>
|
||||
<Spin tip="正在提交..." spinning={loading} fullscreen />
|
||||
</div>
|
||||
</div >
|
||||
|
||||
</>
|
||||
)
|
||||
|
||||
@ -68,28 +68,59 @@
|
||||
/* background-color: pink; */
|
||||
/* width: 100%; */
|
||||
}
|
||||
.belongPeople-center{
|
||||
|
||||
.belongPeople-center {
|
||||
display: flex;
|
||||
margin-top: 11px;
|
||||
}
|
||||
|
||||
.belongPeople-search {
|
||||
margin-left: 14px;
|
||||
}
|
||||
.belongPeople-select{
|
||||
|
||||
.belongPeople-select {
|
||||
margin-left: 27px;
|
||||
}
|
||||
.belongPeople-search .css-dev-only-do-not-override-1ae8k9u.ant-input-group >.ant-input{
|
||||
|
||||
.belongPeople-search .css-dev-only-do-not-override-1ae8k9u.ant-input-group>.ant-input {
|
||||
height: 43px;
|
||||
}
|
||||
.belongPeople-search .css-dev-only-do-not-override-1ae8k9u.ant-input-search >.ant-input-group >.ant-input-group-addon:last-child .ant-input-search-button{
|
||||
|
||||
.belongPeople-search .css-dev-only-do-not-override-1ae8k9u.ant-input-search>.ant-input-group>.ant-input-group-addon:last-child .ant-input-search-button {
|
||||
height: 43px;
|
||||
width: 43px;
|
||||
}
|
||||
|
||||
.belongPeople-bot {
|
||||
margin-top: 13px;
|
||||
}
|
||||
.belongPeople-bot .css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-thead >tr>th, .css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-thead >tr>td{
|
||||
|
||||
.belongPeople-bot .css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-thead>tr>th,
|
||||
.css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-thead>tr>td {
|
||||
background-color: #E6E6E6;
|
||||
/* text-align: center; */
|
||||
text-align: center;
|
||||
height: 41px;
|
||||
}
|
||||
|
||||
.belongPeople-bot .css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-tbody>tr>th,
|
||||
.css-dev-only-do-not-override-1ae8k9u.ant-table-wrapper .ant-table-tbody>tr>td {
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.belongPeople-Modal {}
|
||||
|
||||
.belongPeople-Mtop {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 800;
|
||||
font-size: 24px;
|
||||
color: #222222;
|
||||
border-bottom: 1px solid #EFEFEE;
|
||||
/* display: block; */
|
||||
}
|
||||
|
||||
|
||||
.css-dev-only-do-not-override-1ae8k9u.ant-modal .ant-modal-footer{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user