现场人员管理
This commit is contained in:
203
src/pages/SitePerson/components/SitePersonModal.tsx
Normal file
203
src/pages/SitePerson/components/SitePersonModal.tsx
Normal file
@ -0,0 +1,203 @@
|
|||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import { Form, Input, Modal, Spin, Button, Tooltip, Radio, RadioChangeEvent } from 'antd';
|
||||||
|
import { getSessionUserData } from '@/utils/session';
|
||||||
|
|
||||||
|
|
||||||
|
interface SitePersonModalProps {
|
||||||
|
title: any;
|
||||||
|
modalVisible: boolean;
|
||||||
|
values: any;
|
||||||
|
onSubmit: any;
|
||||||
|
type: string;
|
||||||
|
onCancel: () => void;
|
||||||
|
}
|
||||||
|
const layout = {
|
||||||
|
labelCol: { span: 7 },
|
||||||
|
wrapperCol: { span: 12 },
|
||||||
|
};
|
||||||
|
const SitePersonModal: React.FC<SitePersonModalProps> = (props) => {
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const { title, modalVisible, type, values, onSubmit: handleUpdate, onCancel } = props;
|
||||||
|
//loading
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
const organizationId = getSessionUserData().organizationId;
|
||||||
|
const organizationName = getSessionUserData().organizationName;
|
||||||
|
const [value, setValue] = useState<string>("0");
|
||||||
|
|
||||||
|
const onChange = (e: RadioChangeEvent) => {
|
||||||
|
console.log('radio checked', e.target.value);
|
||||||
|
setValue(e.target.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (JSON.stringify(values) !== "{}") {
|
||||||
|
setValue(values.bankFlag);
|
||||||
|
form.setFieldsValue({
|
||||||
|
"id": values.id,
|
||||||
|
"accountName": values.accountName,
|
||||||
|
"cardNumber": values.cardNumber,
|
||||||
|
"bank": values.bank,
|
||||||
|
"bankOutlets": values.bankOutlets,
|
||||||
|
"bankUnionNumber": values.bankUnionNumber,
|
||||||
|
"bankFlag": values.bankFlag,
|
||||||
|
"companyId": values.companyId,
|
||||||
|
"companyName": values.companyName,
|
||||||
|
"type": values.type,
|
||||||
|
"contactName": values.contactName,
|
||||||
|
"contactPhone": values.contactPhone,
|
||||||
|
"contactMail": values.contactMail,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
form.setFieldsValue({
|
||||||
|
"accountName": organizationName,
|
||||||
|
"companyId": organizationId,
|
||||||
|
"companyName": organizationName,
|
||||||
|
"type": "0",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, [values])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const onOk = async () => {
|
||||||
|
const fieldsValue = await form.validateFields();
|
||||||
|
setLoading(true)
|
||||||
|
let tzsState = {
|
||||||
|
state: "1"
|
||||||
|
}
|
||||||
|
if (form.getFieldValue('bankFlag') == "0") {
|
||||||
|
fieldsValue["bank"] = "中信银行"
|
||||||
|
}
|
||||||
|
await handleUpdate({ ...fieldsValue, ...tzsState }).finally(() => {
|
||||||
|
setLoading(false)
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const renderFooter = () => {
|
||||||
|
if (type == "read") {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Button onClick={onCancel}>关闭</Button>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Button type="primary" loading={loading} onClick={onOk}>确认</Button>
|
||||||
|
<Button onClick={onCancel}>取消</Button>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
destroyOnClose={true}
|
||||||
|
title={title}
|
||||||
|
visible={modalVisible}
|
||||||
|
onCancel={() => onCancel()}
|
||||||
|
width={"60%"}
|
||||||
|
centered
|
||||||
|
footer={renderFooter()}
|
||||||
|
>
|
||||||
|
<Spin spinning={loading}>
|
||||||
|
<Form
|
||||||
|
{...layout}
|
||||||
|
name="nest-messages"
|
||||||
|
form={form}
|
||||||
|
preserve={false}
|
||||||
|
>
|
||||||
|
<Form.Item name="id" label="id" hidden>
|
||||||
|
<Input hidden />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item name="companyId" label="公司id" hidden>
|
||||||
|
<Input hidden />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item name="companyName" label="公司名称" hidden>
|
||||||
|
<Input hidden />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item name="type" label="账户类型:0-基本账户" hidden>
|
||||||
|
<Input hidden />
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item
|
||||||
|
label="账号名称"
|
||||||
|
name="accountName"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', },]}
|
||||||
|
>
|
||||||
|
<Input disabled />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="银行账号"
|
||||||
|
name="cardNumber"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', }, { pattern: /^\d{12,20}$/, message: '请输入正确的银行账号' }]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="是否中信银行账号"
|
||||||
|
name="bankFlag"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', }]}
|
||||||
|
>
|
||||||
|
<Radio.Group onChange={onChange} value={value}>
|
||||||
|
<Radio value="0">中信银行</Radio>
|
||||||
|
<Radio value="1">其他银行</Radio>
|
||||||
|
</Radio.Group>
|
||||||
|
</Form.Item>
|
||||||
|
{value == "1" ?
|
||||||
|
<Form.Item
|
||||||
|
label="开户银行"
|
||||||
|
name="bank"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', },]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
: null}
|
||||||
|
<Form.Item
|
||||||
|
label="开户网点"
|
||||||
|
name="bankOutlets"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', },]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="开户行银联号"
|
||||||
|
name="bankUnionNumber"
|
||||||
|
rules={[{ required: true, message: '当前项不可为空', }]}// , { pattern: /^\d{12}$/, message: '请输入正确的开户行银联号' }
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="联系人名称"
|
||||||
|
name="contactName"
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="联系电话"
|
||||||
|
name="contactPhone"
|
||||||
|
rules={[{ required: true },
|
||||||
|
{ pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, message: '请输入正确的电话号码' }
|
||||||
|
]}
|
||||||
|
extra="仅支持联通号段,其他运营商号段暂不支持"
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item
|
||||||
|
label="邮箱"
|
||||||
|
name="contactMail"
|
||||||
|
rules={[{ type: 'email', message: '请输入正确的邮箱格式' }]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Spin>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SitePersonModal;
|
203
src/pages/SitePerson/index.tsx
Normal file
203
src/pages/SitePerson/index.tsx
Normal file
@ -0,0 +1,203 @@
|
|||||||
|
import React, { useEffect, useRef, useState } from 'react';
|
||||||
|
import ProTable, { ActionType } from '@ant-design/pro-table';
|
||||||
|
import { getList, saveSitePerson, delAccount } from './service';
|
||||||
|
import { Button, Card, Form, message, Spin, Popconfirm } from 'antd';
|
||||||
|
import { getSessionUserData } from '@/utils/session';
|
||||||
|
import SitePersonModal from './components/SitePersonModal';
|
||||||
|
|
||||||
|
|
||||||
|
const SitePersonList: React.FC<{}> = () => {
|
||||||
|
const checkRelationRef = useRef<ActionType>(); //操作数据后刷新列表
|
||||||
|
const [isEditModalVisible, setIsEditModalVisible] = useState<boolean>(false) //控制新增或编辑模态框是否显示
|
||||||
|
const [form] = Form.useForm();//新增模块form
|
||||||
|
// const [editForm] = Form.useForm();//编辑模块form
|
||||||
|
//单条数据
|
||||||
|
const [editForm, setEditForm] = useState<any>({});
|
||||||
|
const [spinning, setSping] = useState<boolean>(false);//加载遮罩
|
||||||
|
const [accountList, setAccountList] = useState<any>([]); //账号信息
|
||||||
|
//是否可以新增
|
||||||
|
const [insertDisabled, setInsertDisabled] = useState<any>(true);
|
||||||
|
const [type, setType] = useState<any>('cease');//弹窗类型
|
||||||
|
const organizationId = getSessionUserData().organizationId;
|
||||||
|
let typename = "新增";
|
||||||
|
|
||||||
|
|
||||||
|
const columns: any = [
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
valueType: 'index',
|
||||||
|
width: 80,
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '评标场所编号',
|
||||||
|
// dataIndex: 'eroomNum',
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: '评标场所名称',
|
||||||
|
dataIndex: 'eroomName',
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '人员类型',
|
||||||
|
// dataIndex: 'bank',
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: '人员姓名',
|
||||||
|
dataIndex: 'personName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '身份证号',
|
||||||
|
dataIndex: 'identityCard',
|
||||||
|
width: 300,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '人脸照片',
|
||||||
|
dataIndex: 'facePic',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
search: false,
|
||||||
|
render: (text: any, record: any) => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<a onClick={() => setFormVals(record)}>编辑</a>
|
||||||
|
<Popconfirm placement="topRight" title={"确定删除么?"} onConfirm={async () => { delSitePerson(record.id); }} okText="确定" cancelText="取消" ><a > 删除 </a></Popconfirm>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const delSitePerson = (id: any) => { // 删除
|
||||||
|
setSping(true);
|
||||||
|
delAccount(id).then(res => {
|
||||||
|
if (res.code == 200) {
|
||||||
|
setSping(false);
|
||||||
|
message.success('删除成功');
|
||||||
|
setAccountList(null)
|
||||||
|
setInsertDisabled(false)
|
||||||
|
} else {
|
||||||
|
setSping(false);
|
||||||
|
form.resetFields()
|
||||||
|
}
|
||||||
|
}).finally(() => {
|
||||||
|
setSping(false);
|
||||||
|
});;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 编辑页面赋值
|
||||||
|
const setFormVals = (item: any) => {
|
||||||
|
typename = "编辑";
|
||||||
|
setEditForm(item);
|
||||||
|
setType("edit");
|
||||||
|
setIsEditModalVisible(true)
|
||||||
|
setSping(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增页面
|
||||||
|
const insertSitePerson = () => {
|
||||||
|
setType("insert");
|
||||||
|
setIsEditModalVisible(true)
|
||||||
|
setSping(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取页面数据
|
||||||
|
const getSitePerson = () => {
|
||||||
|
getList(organizationId).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
if (res.data.length == 0) {
|
||||||
|
setInsertDisabled(false)
|
||||||
|
}
|
||||||
|
setAccountList(res.data)
|
||||||
|
} else {
|
||||||
|
setAccountList(null)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// getSitePerson();
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Spin spinning={spinning}>
|
||||||
|
<Card title="银行账号信息维护">
|
||||||
|
|
||||||
|
<ProTable
|
||||||
|
actionRef={checkRelationRef}
|
||||||
|
columns={columns}
|
||||||
|
options={false}
|
||||||
|
size='small'
|
||||||
|
search={{
|
||||||
|
labelWidth: 100,
|
||||||
|
// defaultCollapsed: false,//是否展开搜索条件
|
||||||
|
optionRender: (searchConfig, formProps, dom) => [
|
||||||
|
...dom.reverse(),
|
||||||
|
<Button key="out" type="primary" onClick={() => insertSitePerson()}>
|
||||||
|
新增
|
||||||
|
</Button>,
|
||||||
|
],
|
||||||
|
}}
|
||||||
|
|
||||||
|
request={(params) => {
|
||||||
|
let trueParams = {
|
||||||
|
...params,
|
||||||
|
pageNo: params.current,
|
||||||
|
}
|
||||||
|
return new Promise<any>((resolve, reject) => {
|
||||||
|
getList(trueParams).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
resolve({
|
||||||
|
data: res.data.records,
|
||||||
|
success: res.success,
|
||||||
|
total: res.data.total,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
resolve({
|
||||||
|
data: [],
|
||||||
|
success: false,
|
||||||
|
total: 0,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
pagination={{ defaultPageSize: 10, showSizeChanger: false }}//默认显示条数
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
{/* 新增及编辑银行账号Modal */}
|
||||||
|
{
|
||||||
|
isEditModalVisible ?
|
||||||
|
<SitePersonModal
|
||||||
|
title={typename+"银行账号信息维护"}
|
||||||
|
type={type}
|
||||||
|
modalVisible={isEditModalVisible}
|
||||||
|
values={editForm}
|
||||||
|
onSubmit={async (value: any) => {
|
||||||
|
await saveSitePerson(value).then((res: any) => {
|
||||||
|
if (res.success === true) {
|
||||||
|
message.success("保存成功!");
|
||||||
|
setInsertDisabled(true)
|
||||||
|
setIsEditModalVisible(false);
|
||||||
|
setEditForm({});
|
||||||
|
getSitePerson();
|
||||||
|
checkRelationRef.current?.reload();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
onCancel={() => {
|
||||||
|
setIsEditModalVisible(!isEditModalVisible);
|
||||||
|
setEditForm({});
|
||||||
|
}}
|
||||||
|
></SitePersonModal>
|
||||||
|
: null
|
||||||
|
}
|
||||||
|
|
||||||
|
</Spin>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default SitePersonList;
|
33
src/pages/SitePerson/service.ts
Normal file
33
src/pages/SitePerson/service.ts
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
/**
|
||||||
|
* 查询数据并分页
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export async function getList(params?: any) {
|
||||||
|
return request('/api/biz-service-ebtp-evaluation/v1/eval/room/site/person/page', {
|
||||||
|
method: 'get',
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export async function saveSitePerson(data?: any) {
|
||||||
|
return request('/api/biz-service-ebtp-expenses//v1/bank/account/save', {
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 删除
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export async function delAccount(id?: any) {
|
||||||
|
return request('/api/biz-service-ebtp-expenses//v1/bank/account/del/'+id, {
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
Reference in New Issue
Block a user