搜索弄成全局

This commit is contained in:
孙景学
2025-07-16 14:51:36 +08:00
parent af2bd823b6
commit 05f46a8dee
17 changed files with 106 additions and 628 deletions

View File

@ -0,0 +1,21 @@
import React, { useEffect, useState } from 'react';
import { Select } from 'antd';
interface options {
label: string;
value: string;
}
const AdmissionTypeSelect = () => {
const [options, setOptions] = useState<options[]>([]);
useEffect(() => {
setOptions([
{ label: '未准入', value: '0' },
{ label: '已准入', value: '1' },
{ label: '退出', value: '2' },
])
}, []);
return <Select style={{ width: 150 }} placeholder="请选择准入状态" options={options} allowClear />;
};
export default AdmissionTypeSelect;

View File

@ -0,0 +1,21 @@
import React, { useEffect, useState } from 'react';
import { Select } from 'antd';
interface options {
label: string;
value: string;
}
const AdmissionTypeSelect = () => {
const [options, setOptions] = useState<options[]>([]);
useEffect(() => {
setOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
])
}, []);
return <Select style={{ width: 150 }} placeholder="请选择企业类型" options={options} allowClear />;
};
export default AdmissionTypeSelect;

View File

@ -2,9 +2,8 @@ import React, { useState, useEffect } from 'react';
import { Modal, Input, Select, Row, Col, Table, Button, Form, Tooltip } from 'antd';
import { RightOutlined, LeftOutlined } from '@ant-design/icons';
import { coscoSupplierBase } from '../services';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
const { Option } = Select;
type OptionType = { label: string; value: string };
const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSelect?: (selected: any[]) => void; }> = ({ visible, onCancel, onSelect }) => {
// 查询
@ -21,25 +20,23 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
const [rightSelected, setRightSelected] = useState<React.Key[]>([]);
//确认 已选供应商
const [chosenSuppliers, setChosenSuppliers] = useState<any[]>([]);
// 境内/境外下拉数据
const [regionOptions, setRegionOptions] = useState<OptionType[]>([]);
//已选供应商 去重
const filteredData = (chosenSuppliers:any, selected:any) => {
const ids = new Set(chosenSuppliers.map((item:any) => item.id));
const filteredData = (chosenSuppliers: any, selected: any) => {
const ids = new Set(chosenSuppliers.map((item: any) => item.id));
// 只把 selected 里没出现过的加进去
const newSelected = selected.filter((item:any) => !ids.has(item.id));
const newSelected = selected.filter((item: any) => !ids.has(item.id));
return [...chosenSuppliers, ...newSelected];
};
//获取已选供应商
const moveToRight = () => {
const selected = tableListData.filter((item:any) => leftSelected.includes(item.id));
const selected = tableListData.filter((item: any) => leftSelected.includes(item.id));
const chosenSuppliersNew = filteredData(chosenSuppliers, selected);
setChosenSuppliers(chosenSuppliersNew);
setLeftSelected([]);
};
// 删除已选供应商
const moveToLeft = () => {
const remaining = chosenSuppliers.filter((item:any) => !rightSelected.includes(item.id));
const remaining = chosenSuppliers.filter((item: any) => !rightSelected.includes(item.id));
setChosenSuppliers(remaining);
setRightSelected([]);
};
@ -47,7 +44,7 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
const getTableList = async (values: any = {}, pageNo: number = 1, pageSize: number = 10) => {
setLoading(true);
try {
const { code, data } = await coscoSupplierBase({ ...values, basePageRequest: { pageNo, pageSize} });
const { code, data } = await coscoSupplierBase({ ...values, basePageRequest: { pageNo, pageSize } });
if (code === 200) {
setTableListData(data.records);
setPagination({ current: pageNo, pageSize, total: data.total });
@ -58,26 +55,22 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
};
// 初始化
useEffect(() => {
if(visible) {
// 境内/境外 下拉
setRegionOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
])
if (visible) {
const values = form.getFieldsValue();
getTableList(values,1 , 10)
getTableList(values, 1, 10)
}
}, [visible])
//供应商名称
const columns = [
{ title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: any) => {
const name = record.supplierType === "ovs"? record.nameEn : record.name;
return(
{
title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: any) => {
const name = record.supplierType === "ovs" ? record.nameEn : record.name;
return (
<Tooltip placement="topLeft" title={name}>
{name}
</Tooltip>)
} },
}
},
{ title: '统一社会信用代码/税号', ellipsis: true, dataIndex: 'unifiedCode' },
];
return (
@ -87,12 +80,8 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
<Form.Item name="name" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" style={{ width: 220 }} allowClear maxLength={20} />
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select style={{ width: 160 }} placeholder="请选择境内/境外" allowClear>
{regionOptions.map(opt => (
<Select.Option key={opt.value} value={opt.value}>{opt.label}</Select.Option>
))}
</Select>
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit"></Button>
@ -101,7 +90,7 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
<Button onClick={() => {
form.resetFields()
const values = form.getFieldsValue();
getTableList(values,1 , 10)
getTableList(values, 1, 10)
}}></Button>
</Form.Item>
</Form>

View File

@ -6,7 +6,7 @@ import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
import ViewModal from './components/ViewModal';
import CategorySelector from '@/components/CategorySelector';
import AdmissionTypeSelect from '@/components/CommonSelect/AdmissionTypeSelect';
import ApprovalStatusSelec from '@/components/ApprovalStatusSelec/index';
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect';
//接口
import { getPage } from './services'
//统一列表分页
@ -106,7 +106,7 @@ const SupplierCategoryEntryReview: React.FC = () => {
<CategorySelector multiple={false} style={{ width: 150 }} />
</Form.Item>
<Form.Item name="approveStatus" label="审批状态">
<ApprovalStatusSelec />
<AccessStatusSelect />
</Form.Item>
<Form.Item>

View File

@ -1,10 +1,9 @@
import React, { useState, useEffect } from 'react';
import { Modal, Input, Select, Row, Col, Table, Button, Form, Tooltip } from 'antd';
import { Modal, Input, Row, Col, Table, Button, Form, Tooltip } from 'antd';
import { RightOutlined, LeftOutlined } from '@ant-design/icons';
import { coscoSupplierBase } from '../services';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
const { Option } = Select;
type OptionType = { label: string; value: string };
const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSelect?: (selected: any[]) => void; }> = ({ visible, onCancel, onSelect }) => {
// 查询
const [form] = Form.useForm();
@ -20,8 +19,6 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
const [rightSelected, setRightSelected] = useState<React.Key[]>([]);
//确认 已选供应商
const [chosenSuppliers, setChosenSuppliers] = useState<any[]>([]);
// 境内/境外下拉数据
const [regionOptions, setRegionOptions] = useState<OptionType[]>([]);
//已选供应商 去重
const filteredData = (chosenSuppliers:any, selected:any) => {
const ids = new Set(chosenSuppliers.map((item:any) => item.id));
@ -58,12 +55,6 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
// 初始化
useEffect(() => {
if(visible) {
// 境内/境外 下拉
setRegionOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
])
const values = form.getFieldsValue();
getTableList(values,1 , 10)
}
@ -87,12 +78,8 @@ const SupplierSelector: React.FC<{ visible: boolean; onCancel: () => void; onSel
<Form.Item name="name" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" style={{ width: 220 }} allowClear maxLength={100} />
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select style={{ width: 160 }} placeholder="请选择境内/境外" allowClear>
{regionOptions.map(opt => (
<Select.Option key={opt.value} value={opt.value}>{opt.label}</Select.Option>
))}
</Select>
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>

View File

@ -10,7 +10,7 @@ import ResultModal from './components/ResultModal';
import CreateModal from './components/CreateModal';
import CategorySelector from '@/components/CategorySelector';
import AdmissionTypeSelect from '@/components/CommonSelect/AdmissionTypeSelect';
import ApprovalStatusSelec from '@/components/ApprovalStatusSelec/index';
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect';
//接口
import { getPage, startApprove } from './services'
//统一列表分页
@ -149,7 +149,7 @@ const AccessManagement: React.FC = () => {
<CategorySelector multiple={false} style={{ width: 150 }} />
</Form.Item>
<Form.Item name="approveStatus" label="审批状态">
<ApprovalStatusSelec />
<AccessStatusSelect />
</Form.Item>
<Form.Item>

View File

@ -7,7 +7,7 @@ import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
// 弹窗组件
import CategoryAddModal from './components/CategoryAddModal';
import ViewModal from './components/ViewModal';
import ApprovalStatusSelec from '@/components/ApprovalStatusSelec/index';
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect';
//接口与字典
import { getDictList } from '@/servers/api/dicts'
import { getPage, approval } from './services';
@ -212,7 +212,7 @@ const CategoryLibraryManage: React.FC = () => {
</Form.Item>
<Form.Item name="approveStatus" label="审批状态">
<ApprovalStatusSelec />
<AccessStatusSelect />
</Form.Item>
<Form.Item>

View File

@ -8,7 +8,7 @@ import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
import CategoryAddModal from './components/CategoryAddModal';
import ViewModal from './components/ViewModal';
import moment from 'moment';
import ApprovalStatusSelec from '@/components/ApprovalStatusSelec/index';
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect';
//接口
import { getPage, approval } from './services';
//统一列表分页
@ -200,7 +200,7 @@ const CategoryLibraryManage: React.FC = () => {
</Form.Item>
<Form.Item name="approveStatus" label="审批状态">
<ApprovalStatusSelec />
<AccessStatusSelect />
</Form.Item>
<Form.Item>

View File

@ -1,104 +0,0 @@
import { Request, Response } from 'express';
// 代码中会兼容本地 service mock 以及部署站点的静态数据
export default {
'GET /api/supplier/getSupplierChangeList': (req: Request, res: Response) => {
res.send({
code: 200,
msg: 'success',
data: [
{
id: 1,
name: '中山市合创展包装材料有限公司',
region: '境内',
supplierType: '中央企业',
accessTime: '2025-03-03 09:30',
changeTime: '2025-03-03 09:30',
status: '未开始',
result: '',
},
],
total: 10
});
},
'GET /api/supplier/list': (req: Request, res: Response) => {
res.send({
code: 200,
msg: 'success',
data: [
{
id: 1,
name: '中山市合创展包装材料有限公司',
region: '境内',
supplierType: '中央企业',
accessTime: '2025-03-03 09:30',
changeTime: '2025-03-03 09:30',
status: '未开始',
result: '',
},
],
total: 10
});
},
'GET /api/system/getPage': (req: Request, res: Response) => {
res.json({
code: 200,
data: [
{
deptName: '供应商名称变更',
categoryName: '2024-05-20 13:22:11',
createTime: '集团采购部',
exitTime: '已通过',
exitReason: '2024-05-21 09:10:31',
},
{
deptName: '法人代表变更',
categoryName: '2024-05-18 08:30:55',
createTime: '分公司审核部',
exitTime: '审核中',
exitReason: '',
},
],
total: 2,
msg: '操作成功'
});
},
'GET /api/system/getSupplierChangeDetail': (req: Request, res: Response) => {
res.json({
"code": 200,
"msg": "success",
"data": {
baseInfo: [
{ label: '供应商名称', value: 'xxx' },
{ label: '境内/境外', value: '境内' },
{ label: '准入单位', value: 'xxxx' },
{ label: '准入部门', value: '采购部' },
],
changeInfo: [
{ label: '供应商名称-变更前', value: 'xxxx' },
{ label: '供应商名称-变更后', value: 'xxxx' },
],
"supplierName": "中山市合创展包装材料有限公司",
"accessUnit": "中远海运(青岛)有限公司",
"region": "境内",
"accessDept": "采购部",
"beforeName": "中山市合创展包装材料有限公司",
"afterName": "中山市合创展包装有限公司",
"qualifications": [
{
"type": "CMMI资质",
"name": "CMMI资质",
"level": "高级",
"number": "546464",
"org": "XX机构",
"issueDate": "2024-09-08",
"validDate": "2028-09-10",
"file": "https://dummyimage.com/40x30/1890ff/fff.png&text=附件"
}
]
}
}
);
},
};

View File

@ -1,144 +0,0 @@
import React, { useEffect, useState } from 'react';
import { Modal, Table, Spin } from 'antd';
import { getSupplierChangeDetail } from '../services';
interface Qualification {
type: string;
name: string;
level: string;
number: string;
org: string;
issueDate: string;
validDate: string;
file?: string;
}
interface InfoItem {
label: string;
value: string;
}
interface DetailData {
baseInfo: InfoItem[];
changeInfo: InfoItem[];
qualifications: Qualification[];
}
interface DetailViewProps {
visible: boolean;
onClose: () => void;
detailId?: string | number;
}
const DetailView: React.FC<DetailViewProps> = ({ visible, onClose, detailId }) => {
const [loading, setLoading] = useState(false);
const [detailData, setDetailData] = useState<DetailData | null>(null);
useEffect(() => {
if (visible && detailId) {
setLoading(true);
getSupplierChangeDetail(detailId)
.then(res => {
if (res.code === 200) {
setDetailData(res.data);
}
})
.finally(() => setLoading(false));
}
if (!visible) setDetailData(null);
}, [visible, detailId]);
const columns = [
{ title: '资质证书类型', dataIndex: 'type', width: 120 },
{ title: '资质名称', dataIndex: 'name', width: 120 },
{ title: '资质类别和等级', dataIndex: 'level', width: 120 },
{ title: '资质证书编号', dataIndex: 'number', width: 120 },
{ title: '发证机构', dataIndex: 'org', width: 120 },
{ title: '发证日期', dataIndex: 'issueDate', width: 120 },
{ title: '资质有效期至', dataIndex: 'validDate', width: 120 },
{
title: '附件',
dataIndex: 'file',
width: 120,
render: (file: string) =>
file ? (
<span>
<img src={file} alt="附件" style={{ width: 30, verticalAlign: 'middle', marginRight: 8 }} />
<a></a>
</span>
) : (
'-'
),
},
];
// 把info数组两两合并成一行显示
function renderInfoTable(infoArr: InfoItem[]) {
const rows = [];
for (let i = 0; i < infoArr.length; i++) {
const left = infoArr[i];
const right = infoArr[i + 1] || { label: '', value: '' };
rows.push(
<tr key={i}>
<td style={tdStyleTitle}>{left.label}</td>
<td style={tdStyle}>{left.value}</td>
<td style={tdStyleTitle}>{right.label}</td>
<td style={tdStyle}>{right.value}</td>
</tr>
);
}
return (
<table style={{ width: '100%', borderCollapse: 'collapse', background: '#fff', marginBottom: 8 }}>
<tbody>{rows}</tbody>
</table>
);
}
return (
<Modal
title="供应商信息变更审批"
visible={visible}
onCancel={onClose}
footer={null}
width={1000}
bodyStyle={{ padding: 24 }}
destroyOnClose
>
<Spin spinning={loading}>
{detailData && (
<div>
{/* 基本信息 */}
{renderInfoTable(detailData.baseInfo)}
{/* 变更内容 */}
<div style={{ padding: '16px 0 0 2px', fontWeight: 700 }}></div>
{renderInfoTable(detailData.changeInfo)}
{/* 新增资质 */}
<div style={{ padding: '0 0 6px 2px', fontWeight: 700 }}>1</div>
<Table
columns={columns}
dataSource={detailData.qualifications}
rowKey="number"
size="small"
pagination={false}
bordered
style={{ margin: '0 0 16px 0' }}
/>
</div>
)}
</Spin>
</Modal>
);
};
const tdStyleTitle: React.CSSProperties = {
background: '#fafafa',
fontWeight: 700,
width: 130,
padding: 8,
border: '1px solid #f0f0f0',
};
const tdStyle: React.CSSProperties = {
background: '#fff',
padding: 8,
border: '1px solid #f0f0f0',
};
export default DetailView;

View File

@ -1,204 +0,0 @@
import React, { useEffect, useState } from 'react';
import { Table, Form, Input, Select, Button, DatePicker, Tag, Space, message } from 'antd';
import { SearchOutlined, ReloadOutlined } from '@ant-design/icons';
// 类型定义
import type { ColumnsType } from 'antd/es/table';
import DetailView from './components/DetailView';
import { list } from './services';
const { RangePicker } = DatePicker;
const regionOptions = [
{ label: '请选择', value: '' },
{ label: '境内', value: '境内' },
{ label: '境外', value: '境外' },
];
const statusOptions = [
{ label: '请选择', value: '' },
{ label: '未开始', value: '未开始' },
{ label: '进行中', value: '进行中' },
{ label: '已结束', value: '已结束' },
];
const resultOptions = [
{ label: '请选择', value: '' },
{ label: '通过', value: '通过' },
{ label: '驳回', value: '驳回' },
];
interface Columns {
name:string;
supplierTypeCn:string;
enterpriseTypeCn:string;
accessTime:string;
changeTime:string;
status:string;
result:string;
id:string;
}
const SupplierChangeManage: React.FC = () => {
const [form] = Form.useForm();
const [data, setData] = useState<Columns[]>([]);
const [loading, setLoading] = useState(false);
const [pagination, setPagination] = useState({ current: 1, pageSize: 10, total: 0 });
const [detailVisible, setDetailVisible] = useState(false);
const [currentDetailId, setCurrentDetailId] = useState<number | null>(null);
// 获取表格数据
const fetchData = async (params = {}) => {
setLoading(true);
try {
const { code, data, total, msg } = await list({
page: pagination.current,
pageSize: pagination.pageSize,
...params,
});
if (code === 200) {
setData(data);
setPagination(p => ({ ...p, total: total || 0 }));
} else {
message.error(msg || '获取数据失败');
}
} finally {
setLoading(false);
}
};
useEffect(() => {
fetchData();
}, [pagination.current, pagination.pageSize]);
// 查询
const handleSearch = () => {
setPagination(p => ({ ...p, current: 1 }));
fetchData(form.getFieldsValue());
};
// 重置
const handleReset = () => {
form.resetFields();
setPagination(p => ({ ...p, current: 1 }));
fetchData();
};
const columns: ColumnsType<Columns> = [
{
title: '序号',
dataIndex: 'index',
width: 48,
align: 'center',
render: (_: any, __: any, idx: number) => (pagination.current - 1) * pagination.pageSize + idx + 1,
},
{
title: '供应商名称',
dataIndex: 'name',
align: 'center',
ellipsis: true,
},
{
title: '境内/境外',
dataIndex: 'supplierTypeCn',
align: 'center',
},
{
title: '供应商分类',
dataIndex: 'enterpriseTypeCn',
align: 'center',
},
{
title: '准入时间',
dataIndex: 'accessTime',
align: 'center',
},
{
title: '提交变更时间',
dataIndex: 'changeTime',
align: 'center',
},
{
title: '流程状态',
dataIndex: 'status',
align: 'center',
},
{
title: '审批结果',
dataIndex: 'result',
align: 'center',
},
{
title: '操作',
key: 'action',
align: 'center',
render: (_: any, record: any) => (
<Button type="link" onClick={() => handleDetail(record)}>
</Button>
),
},
];
// 弹窗操作
const handleDetail = (record: any) => {
setCurrentDetailId(record.id);
setDetailVisible(true);
};
const handleDetailClose = () => {
setDetailVisible(false);
setCurrentDetailId(null);
};
return (
<>
{/* 查询表单 */}
<Form
form={form}
layout="inline"
style={{ width: '100%', marginBottom: 16 }}
onFinish={handleSearch}
>
<Form.Item name="name" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" allowClear />
</Form.Item>
<Form.Item name="region" label="境内/境外">
<Select options={regionOptions} allowClear style={{ width: 120 }} />
</Form.Item>
<Form.Item name="status" label="流程状态">
<Select options={statusOptions} allowClear style={{ width: 120 }} />
</Form.Item>
<Form.Item name="result" label="审批结果">
<Select options={resultOptions} allowClear style={{ width: 120 }} />
</Form.Item>
<Form.Item name="changeTime" label="提交变更时间">
<RangePicker style={{ width: 220 }} />
</Form.Item>
<Form.Item>
<Button type="primary" icon={<SearchOutlined />} htmlType="submit"></Button>
<Button icon={<ReloadOutlined />} style={{ marginLeft: 8 }} onClick={handleReset}></Button>
</Form.Item>
</Form>
{/* 数据表格 */}
<Table
columns={columns}
rowKey="id"
dataSource={data}
loading={loading}
bordered
pagination={{
...pagination,
showQuickJumper: true,
showSizeChanger: true,
onChange: (current, pageSize) => setPagination({ ...pagination, current }),
}}
/>
{/* 审批记录弹窗 */}
<DetailView
visible={detailVisible}
onClose={handleDetailClose}
detailId={currentDetailId || ''}
/>
</>
);
};
export default SupplierChangeManage;

View File

@ -1,22 +0,0 @@
import request from '@/utils/request';
export async function list(params:any) {
return request('/api/system/list', {
method: 'GET',
params
});
}
export async function getPage(params:any) {
return request('/api/system/getPage', {
method: 'GET',
params
});
}
export async function getSupplierChangeDetail(params:any) {
return request('/api/system/getSupplierChangeDetail', {
method: 'GET',
params
});
}

View File

@ -3,6 +3,7 @@ import { Table, Form, Input, Select, Button, DatePicker, Tooltip } from 'antd';
import { SearchOutlined, DeleteOutlined } from '@ant-design/icons';
//详情
import DetailView from './components/DetailView';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
//接口
import { getPage } from './services';
import type { ColumnsType } from 'antd/es/table';
@ -16,12 +17,6 @@ import tableProps from '@/utils/tableProps'
const { RangePicker } = DatePicker;
const regionOptions = [
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
];
interface Columns {
supplierName: string;
supplierType: string;
@ -202,8 +197,8 @@ const SupplierChangeReviewManage: React.FC<Props> = ({ dispatch }) => {
<Form.Item name="supplierName" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" allowClear />
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select options={regionOptions} allowClear style={{ width: 120 }} placeholder="请选择境内/境外" />
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>
<Form.Item name="approveStatus" label="审批状态">

View File

@ -1,15 +1,15 @@
import React, { useEffect, useState } from "react";
import { Form, Button, Table, Select, Input, Tree, Space, Tooltip, Spin } from 'antd';
import { Form, Button, Table, Input, Tree, Space, Tooltip, Spin } from 'antd';
import { SearchOutlined, DoubleLeftOutlined, DeleteOutlined, DoubleRightOutlined } from '@ant-design/icons';
import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
import { connect } from 'umi';
//接口
import { treeData, getPageQualified } from './services';
//组件
import tableProps from '@/utils/tableProps';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
import SupplierViewModal from './components/SupplierViewModal';
import SupplierDetailModal from './components/SupplierDetailModal';
import { treeData, getPageQualified } from './services';
import tableProps from '@/utils/tableProps';
const { Option } = Select;
type OptionType = { label: string; value: string };
interface Data {
id: number;
@ -69,7 +69,6 @@ const groupQualifiedSupplierQuery: React.FC<Props> = ({ dispatch }) => {
const [viewVisible, setViewVisible] = useState(false);
const [detailVisible, setDetailVisible] = useState(false);
const [currentRecord, setCurrentRecord] = useState<any>(null);
const [regionOptions, setRegionOptions] = useState<OptionType[]>([]);
// 查询
const handleSearch = () => {
@ -127,10 +126,6 @@ const groupQualifiedSupplierQuery: React.FC<Props> = ({ dispatch }) => {
// 初始化
useEffect(() => {
setTreeLoading(true);
setRegionOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
]);
treeData({}).then((res) => {
const { code, data } = res;
if (code === 200) {
@ -229,12 +224,8 @@ const groupQualifiedSupplierQuery: React.FC<Props> = ({ dispatch }) => {
<Form.Item name="name" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" style={{ width: 180 }} maxLength={50} />
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select style={{ width: 130 }} allowClear placeholder="请选择境内/境外" >
{regionOptions.map(opt => (
<Option key={opt.value} value={opt.value}>{opt.label}</Option>
))}
</Select>
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>
<Form.Item>
<Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} onClick={handleSearch} disabled={treeLoading}>

View File

@ -10,14 +10,13 @@ import { connect } from 'umi';
import SupplierViewModal from './components/SupplierViewModal';
import SupplierDetailModal from './components/SupplierDetailModal';
import CategorySelector from '@/components/CategorySelector';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect'
//本地服务/接口
import { getPageMy } from './services';
//统一列表分页
import tableProps from '@/utils/tableProps'
const { Option } = Select;
//下拉数据接口
type OptionType = { label: string; value: string };
// 列表数据接口
interface Data {
id: number;
@ -45,10 +44,6 @@ const mySupplierInquiry: React.FC<mySupplierInquiryProps> = ({ dispatch }) => {
const [detailVisible, setDetailVisible] = useState(false);
//查看、准入明细 参数传递
const [currentRecord, setCurrentRecord] = useState('');
// 境内/境外下拉数据
const [regionOptions, setRegionOptions] = useState<OptionType[]>([]);
// 准入状态
const [storeOptions, setStoreOptions] = useState<OptionType[]>([]);
// 导出
const handleExport = async () => {
window.open(
@ -85,20 +80,6 @@ const mySupplierInquiry: React.FC<mySupplierInquiryProps> = ({ dispatch }) => {
};
// 初始化
useEffect(() => {
// 境内/境外 下拉
setRegionOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
])
// 准入状态下拉
setStoreOptions([
{ label: '未准入', value: '0' },
{ label: '已准入', value: '1' },
{ label: '退出', value: '2' },
])
getList();
}, []);
@ -205,18 +186,10 @@ const mySupplierInquiry: React.FC<mySupplierInquiryProps> = ({ dispatch }) => {
<CategorySelector multiple={false} style={{ width: 140 }} />
</Form.Item>
<Form.Item name="accessStatus" label="准入状态">
<Select style={{ width: 140 }} allowClear placeholder="请选择准入状态">
{storeOptions.map(opt => (
<Option key={opt.value} value={opt.value}>{opt.label}</Option>
))}
</Select>
<AccessStatusSelect/>
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select style={{ width: 140 }} allowClear placeholder="请选择境内/境外" >
{regionOptions.map(opt => (
<Option key={opt.value} value={opt.value}>{opt.label}</Option>
))}
</Select>
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>
<Form.Item>
<Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} onClick={handleSearch} >

View File

@ -9,6 +9,8 @@ import { useIntl, connect } from 'umi';
//本地组件、弹窗、业务逻辑
import SupplierViewModal from './components/SupplierViewModal';
import SupplierDetailModal from './components/SupplierDetailModal';
import RegionTypeSelect from '@/components/CommonSelect/RegionTypeSelect'
import AccessStatusSelect from '@/components/CommonSelect/AccessStatusSelect'
//本地服务/接口
import { getRegisterPage } from './services';
//统一列表分页
@ -23,15 +25,12 @@ interface Data {
regTime: string;
status: string;
}
//下拉数据接口
type OptionType = { label: string; value: string };
//准入状态
const statusColor = (status: string) => {
if (status === '已驳回' || status === '已退出') return '#ef6969';
if (status === '已准入') return '#004f8e';
return undefined;
};
interface RegistrationQueryProps {
dispatch: any;
}
@ -54,10 +53,6 @@ const RegistrationQuery: React.FC<RegistrationQueryProps> = ({ dispatch }) => {
const [detailVisible, setDetailVisible] = useState(false);
//查看、准入明细 参数传递
const [currentRecord, setCurrentRecord] = useState('');
// 境内/境外下拉数据
const [regionOptions, setRegionOptions] = useState<OptionType[]>([]);
//状态 下拉数据
const [statusOptions, setStatusOptions] = useState<OptionType[]>([]);
// 搜索
const handleSearch = () => {
setPagination({ ...pagination, current: 1 });
@ -87,18 +82,6 @@ const RegistrationQuery: React.FC<RegistrationQueryProps> = ({ dispatch }) => {
};
//初始化
useEffect(() => {
// 境内/境外 下拉
setRegionOptions([
{ label: '境内企业', value: 'dvs' },
{ label: '境外企业', value: 'ovs' },
{ label: '个人', value: 'pe' },
])
//状态 下拉
setStatusOptions([
{ label: '未准入', value: '0' },
{ label: '已准入', value: '1' },
{ label: '退出', value: '2' },
])
//列表
getList();
}, [])
@ -199,19 +182,11 @@ const RegistrationQuery: React.FC<RegistrationQueryProps> = ({ dispatch }) => {
<Form.Item name="name" label="供应商名称">
<Input placeholder="请输入供应商名称关键字" style={{ width: 220 }} allowClear maxLength={20} />
</Form.Item>
<Form.Item name="supplierType" label="境内/境外">
<Select style={{ width: 160 }} placeholder="请选择境内/境外" allowClear>
{regionOptions.map(opt => (
<Select.Option key={opt.value} value={opt.value}>{opt.label}</Select.Option>
))}
</Select>
<Form.Item name="supplierType" label="企业类型">
<RegionTypeSelect />
</Form.Item>
<Form.Item name="accessStatus" label="准入状态">
<Select style={{ width: 160 }} placeholder="请选择状态" allowClear>
{statusOptions.map(opt => (
<Select.Option key={opt.value} value={opt.value}>{opt.label}</Select.Option>
))}
</Select>
<AccessStatusSelect />
</Form.Item>
<Form.Item>
<Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />}></Button>