页面列表与按钮样式 调整
This commit is contained in:
@ -1,5 +1,6 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Form, Select, Button, Table, Space, Modal, message } from 'antd';
|
||||
import { SearchOutlined, DeleteOutlined } from '@ant-design/icons';
|
||||
import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
|
||||
//查看弹窗
|
||||
import ViewModal from './components/ViewModal';
|
||||
@ -8,8 +9,10 @@ import ResultModal from './components/ResultModal';
|
||||
//发起准入 弹窗
|
||||
import CreateModal from './components/CreateModal';
|
||||
import CategorySelector from '@/components/CategorySelector';
|
||||
|
||||
//接口
|
||||
import { getPage, startApprove } from './services'
|
||||
//统一列表分页
|
||||
import tableProps from '@/utils/tableProps'
|
||||
|
||||
const { Option } = Select;
|
||||
|
||||
@ -60,6 +63,13 @@ const AccessManagement: React.FC = () => {
|
||||
const values = form.getFieldsValue();
|
||||
getList(values, 1, 10);
|
||||
};
|
||||
// 重置
|
||||
const handleReset = () => {
|
||||
form.resetFields()
|
||||
const values = form.getFieldsValue();
|
||||
getList(values, 1, 10);
|
||||
};
|
||||
|
||||
const handleApproval = (id: string) => {
|
||||
Modal.confirm({
|
||||
title: '是否确认发起审批?',
|
||||
@ -82,10 +92,10 @@ const AccessManagement: React.FC = () => {
|
||||
render: (_: any, __: any, idx: number) => (((pagination.current ?? 1) - 1) * (pagination.pageSize ?? 10)) + idx + 1,
|
||||
},
|
||||
{ title: '准入工作', ellipsis: true, dataIndex: 'accessWorkName' },
|
||||
{ title: '准入单位', ellipsis: true,dataIndex: 'deptId' },
|
||||
{ title: '准入部门', ellipsis: true,dataIndex: 'deptId' },
|
||||
{ title: '准入方式', ellipsis: true,dataIndex: 'accessTypeText' },
|
||||
{ title: '申请时间', ellipsis: true,dataIndex: 'createTime' },
|
||||
{ title: '准入单位', ellipsis: true, dataIndex: 'deptId' },
|
||||
{ title: '准入部门', ellipsis: true, dataIndex: 'deptId' },
|
||||
{ title: '准入方式', ellipsis: true, dataIndex: 'accessTypeText' },
|
||||
{ title: '申请时间', ellipsis: true, dataIndex: 'createTime' },
|
||||
{ title: '状态', dataIndex: 'reviewStatusText' },
|
||||
{
|
||||
title: '操作',
|
||||
@ -111,54 +121,63 @@ const AccessManagement: React.FC = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Form layout="inline" form={form} onFinish={getList}>
|
||||
<Form.Item name="accessType" label="准入方式">
|
||||
<Select style={{ width: 150 }} placeholder="请选择准入方式" allowClear >
|
||||
<Option value="online">线上准入</Option>
|
||||
<Option value="offline">线下准入</Option>
|
||||
<Option value="scattered">零星采购/应急采购/个人供应商</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item name="deptId" label="准入单位">
|
||||
<Select style={{ width: 150 }} placeholder="请选择" allowClear>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item name="categoryId" label="准入品类">
|
||||
<CategorySelector multiple={false} style={{ width: 150 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="approveStatus" label="状态">
|
||||
<Select style={{ width: 150 }} placeholder="请选择状态" allowClear>
|
||||
<Option value="0">未开始</Option>
|
||||
<Option value="1">进行中</Option>
|
||||
<Option value="2">结果汇总中</Option>
|
||||
<Option value="3">已完成</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit">查询</Button>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button onClick={() => {
|
||||
form.resetFields()
|
||||
<div className="common-container">
|
||||
<div className="filter-action-row">
|
||||
<Form layout="inline" form={form} className="filter-form" onFinish={getList}>
|
||||
<Form.Item name="accessType" label="准入方式">
|
||||
<Select style={{ width: 150 }} placeholder="请选择准入方式" allowClear >
|
||||
<Option value="online">线上准入</Option>
|
||||
<Option value="offline">线下准入</Option>
|
||||
<Option value="scattered">零星采购/应急采购/个人供应商</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item name="deptId" label="准入单位">
|
||||
<Select style={{ width: 150 }} placeholder="请选择" allowClear>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item name="categoryId" label="准入品类">
|
||||
<CategorySelector multiple={false} style={{ width: 150 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="approveStatus" label="状态">
|
||||
<Select style={{ width: 150 }} placeholder="请选择状态" allowClear>
|
||||
<Option value="0">未开始</Option>
|
||||
<Option value="1">进行中</Option>
|
||||
<Option value="2">结果汇总中</Option>
|
||||
<Option value="3">已完成</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} >
|
||||
搜索
|
||||
</Button>
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button className="buttonReset" icon={<DeleteOutlined />} onClick={handleReset} >重置</Button>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item style={{ marginLeft: 'auto' }}>
|
||||
<Button className="buttonFunctionBlock" type="primary" onClick={() => openModal('create')} >
|
||||
发起准入
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
|
||||
</div>
|
||||
<Table
|
||||
rowKey="key"
|
||||
dataSource={data}
|
||||
columns={columns}
|
||||
loading={loading}
|
||||
pagination={{...tableProps.pagination, total: pagination.total }}
|
||||
onChange={(pagination) => {
|
||||
const values = form.getFieldsValue();
|
||||
getList(values, 1, 10);
|
||||
}}>重置</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
<div style={{ marginTop: 16, marginBottom: 16 }}>
|
||||
<Button type="primary" onClick={() => openModal('create')}>发起准入</Button>
|
||||
getList(values, pagination.current!, pagination.pageSize!)
|
||||
}}
|
||||
style={{ flex: 1, minHeight: 0 }}
|
||||
scroll={{ y: 'calc(100vh - 350px)' }}
|
||||
/>
|
||||
</div>
|
||||
<Table
|
||||
rowKey="key"
|
||||
dataSource={data}
|
||||
columns={columns}
|
||||
loading={loading}
|
||||
pagination={pagination}
|
||||
onChange={(pagination) => {
|
||||
const values = form.getFieldsValue();
|
||||
getList(values, pagination.current!, pagination.pageSize!)
|
||||
}}
|
||||
/>
|
||||
{/* 弹窗区 */}
|
||||
<ViewModal visible={modalInfo.type === 'view' && modalInfo.visible} record={modalInfo.record} onCancel={closeModal} />
|
||||
<ResultModal visible={modalInfo.type === 'result' && modalInfo.visible} record={modalInfo.record} onCancel={closeModal} />
|
||||
|
Reference in New Issue
Block a user