供应商退出申请弹窗/黑名单申请与供应商名称弹出
This commit is contained in:
@ -9,25 +9,13 @@ const AccessCategoryTable = ({id}:{id:string}) => {
|
||||
const columns = [
|
||||
{
|
||||
title: '准入单位',
|
||||
dataIndex: 'deptId',
|
||||
key: 'deptId',
|
||||
dataIndex: 'deptName',
|
||||
key: 'deptName',
|
||||
},
|
||||
{
|
||||
title: '准入品类',
|
||||
dataIndex: 'categoryNames',
|
||||
key: 'categoryNames',
|
||||
render: (_: any, record: any) => {
|
||||
console.log(record.categoryNames);
|
||||
const arr = record.categoryNames ? record.categoryNames.split(',') : [];
|
||||
|
||||
return arr.length
|
||||
? arr.map((item: string, idx: number) => (
|
||||
<div key={idx} style={{ marginBottom: 4 }}>
|
||||
{item}
|
||||
</div>
|
||||
))
|
||||
: '';
|
||||
},
|
||||
dataIndex: 'categoryName',
|
||||
key: 'categoryName',
|
||||
},
|
||||
{
|
||||
title: '准入时间',
|
||||
|
@ -18,7 +18,7 @@ export const SupplierDetailModalProvider = ({ children }: { children: React.Reac
|
||||
return (
|
||||
<SupplierDetailModalContext.Provider value={showSupplierDetail}>
|
||||
{children}
|
||||
<Modal visible={visible} onCancel={() => setVisible(false)} footer={null} width="90%" title={
|
||||
<Modal visible={visible} zIndex={1100} onCancel={() => setVisible(false)} footer={null} width="90%" title={
|
||||
<div style={{ display: 'flex', justifyContent: 'flex-start', alignItems: 'center' }}>
|
||||
<span>{intl.formatMessage({ id: 'component.globalModal.title' })}</span>
|
||||
</div>
|
||||
|
@ -80,25 +80,13 @@ const CooperateEnterprise: React.FC = () => {
|
||||
},
|
||||
{
|
||||
title: '准入单位',
|
||||
dataIndex: 'deptId',
|
||||
key: 'deptId',
|
||||
dataIndex: 'deptName',
|
||||
key: 'deptName',
|
||||
},
|
||||
{
|
||||
title: '准入品类',
|
||||
dataIndex: 'categoryNames',
|
||||
key: 'categoryNames',
|
||||
render: (_: any, record: any) => {
|
||||
console.log(record.categoryNames);
|
||||
const arr = record.categoryNames ? record.categoryNames.split(',') : [];
|
||||
|
||||
return arr.length
|
||||
? arr.map((item: string, idx: number) => (
|
||||
<div key={idx} style={{ marginBottom: 4 }}>
|
||||
{item}
|
||||
</div>
|
||||
))
|
||||
: '';
|
||||
},
|
||||
dataIndex: 'categoryName',
|
||||
key: 'categoryName',
|
||||
},
|
||||
{
|
||||
title: '准入时间',
|
||||
|
@ -1,19 +1,25 @@
|
||||
import React, { useEffect , useState } from "react";
|
||||
import { Modal, Button, Select, Input, Table, message, Form, Tooltip } from "antd";
|
||||
import SupplierSelectModal from "./SupplierSelectModal";
|
||||
import { blacklist, getAllList } from "../services";
|
||||
import type { ColumnsType } from 'antd/es/table';
|
||||
//组件
|
||||
import SupplierSelectModal from "./SupplierSelectModal";
|
||||
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
|
||||
//接口
|
||||
import { blacklist, getAllList } from "../services";
|
||||
|
||||
|
||||
const { Option } = Select;
|
||||
interface Supplier {
|
||||
id: number; // 作为 rowKey 用于唯一标识
|
||||
id: string; // 作为 rowKey 用于唯一标识
|
||||
supplierName: string; // 供应商名称
|
||||
unit: string; // 准入部门
|
||||
accessTime: string; // 准入时间
|
||||
categoryName: string; // 准入品类
|
||||
lastEval: string; // 最近一次评价
|
||||
lastEvalDate: string; // 评价时间
|
||||
supplierId: string;
|
||||
categoryId: string;
|
||||
supplierType: string;
|
||||
nameEn: string;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface CreateBlacklistModalProps {
|
||||
@ -27,12 +33,13 @@ const CreateBlacklistModal: React.FC<CreateBlacklistModalProps> = ({
|
||||
onOk,
|
||||
onCancel,
|
||||
}) => {
|
||||
const [form] = Form.useForm();
|
||||
const [selectVisible, setSelectVisible] = useState(false);
|
||||
const [suppliers, setSuppliers] = useState<Supplier[]>([]);
|
||||
const [timelimitOption, setTimelimitOption] = useState<any[]>([]);
|
||||
const [form] = Form.useForm();
|
||||
const supplierDetailModal = useSupplierDetailModal();
|
||||
|
||||
const removeSupplier = (id: number) => {
|
||||
const removeSupplier = (id: string) => {
|
||||
setSuppliers(suppliers.filter((s) => s.id !== id));
|
||||
};
|
||||
|
||||
@ -79,25 +86,21 @@ const CreateBlacklistModal: React.FC<CreateBlacklistModalProps> = ({
|
||||
setTimelimitOption(data)
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
setSuppliers([]);
|
||||
form.resetFields();
|
||||
}
|
||||
}, [visible]);
|
||||
const columns: ColumnsType<Supplier> = [
|
||||
{ title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: any) => {
|
||||
{ title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: Supplier) => {
|
||||
const name = record.supplierType === "ovs"? record.nameEn : record.name;
|
||||
return(
|
||||
<Tooltip placement="topLeft" title={name}>
|
||||
{name}
|
||||
<a onClick={() => supplierDetailModal?.(record.id)}>{name}</a>
|
||||
</Tooltip>)
|
||||
} },
|
||||
{ title: "准入部门", dataIndex: "unit", align: "center" },
|
||||
{ title: "准入时间", dataIndex: "accessTime", align: "center", render: () => "2023-04-20 13:00" },
|
||||
{ title: "准入时间", dataIndex: "accessTime", align: "center" },
|
||||
{ title: "准入品类", dataIndex: "categoryName", align: "center" },
|
||||
{ title: "最近一次评价", dataIndex: "lastEval", align: "center" },
|
||||
{ title: "评价时间", dataIndex: "lastEvalDate", align: "center" },
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "option",
|
||||
|
@ -1,23 +1,24 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
Modal, Table, Button, Checkbox, Row, Col, Input, Select, Form, Space, message, Tooltip
|
||||
Modal, Table, Button, Checkbox, Row, Col, Input, Form, Space, message, Tooltip
|
||||
} from "antd";
|
||||
//接口
|
||||
import { getSupplierCategoryPage } from '../services';
|
||||
//组件
|
||||
import CategorySelector from '@/components/CategorySelector';
|
||||
const { Option } = Select;
|
||||
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
|
||||
|
||||
interface Supplier {
|
||||
id: number;
|
||||
id: string;
|
||||
supplierId: string;
|
||||
categoryId: string;
|
||||
supplierName: string;
|
||||
|
||||
unit: string; // 准入部门
|
||||
accessTime: string; // 准入时间
|
||||
categoryName: string; // 准入品类
|
||||
lastEval: string; // 最近一次评价
|
||||
lastEvalDate: string; // 评价时间
|
||||
|
||||
supplierType: string;
|
||||
nameEn: string;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface SupplierSelectModalProps {
|
||||
@ -35,12 +36,13 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
onCancel,
|
||||
}) => {
|
||||
const [form] = Form.useForm();
|
||||
const [leftSelected, setLeftSelected] = useState<number[]>([]);
|
||||
const [rightSelected, setRightSelected] = useState<number[]>([]);
|
||||
const [leftSelected, setLeftSelected] = useState<string[]>([]);
|
||||
const [rightSelected, setRightSelected] = useState<string[]>([]);
|
||||
const [rightData, setRightData] = useState<Supplier[]>([]);
|
||||
const [data, setData] = useState<Supplier[]>([]);
|
||||
const [pagination, setPagination] = useState({ current: 1, pageSize: 5, total: 0 });
|
||||
const [loading, setLoading] = useState(false);
|
||||
const supplierDetailModal = useSupplierDetailModal();
|
||||
|
||||
useEffect(() => {
|
||||
if (visible) {
|
||||
@ -114,11 +116,11 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
></Checkbox>
|
||||
)
|
||||
},
|
||||
{ title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: any) => {
|
||||
{ title: '供应商名称', dataIndex: 'name', ellipsis: true, width: 160, render: (_: any, record: Supplier) => {
|
||||
const name = record.supplierType === "ovs"? record.nameEn : record.name;
|
||||
return(
|
||||
<Tooltip placement="topLeft" title={name}>
|
||||
{name}
|
||||
<a onClick={() => supplierDetailModal?.(record.id)}>{name}</a>
|
||||
</Tooltip>)
|
||||
} },
|
||||
{ title: "准入品类", dataIndex: "categoryName", ellipsis: true, width: 100, render: (_: any, record: any) => {
|
||||
@ -179,22 +181,12 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
bodyStyle={{ padding: 24 }}
|
||||
>
|
||||
<Form layout="inline" form={form} style={{ marginBottom: 16 }}>
|
||||
|
||||
|
||||
<Form.Item name="name" label="供应商名称">
|
||||
<Input style={{ width: 140 }} allowClear maxLength={50} placeholder="请输入供应商名称" />
|
||||
</Form.Item>
|
||||
<Form.Item name="levelName" label="最近一次评价等级">
|
||||
<Select style={{ width: 140 }} allowClear placeholder="请选择最近一次评价等级" >
|
||||
{['A', 'B', 'C', 'D'].map(level => (
|
||||
<Option key={level} value={level}>{level}</Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item name="categoryId" label="准入品类">
|
||||
<CategorySelector multiple={false} style={{ width: 140 }} />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item>
|
||||
<Space>
|
||||
<Button type="primary" onClick={handleSearch}>查询</Button>
|
||||
@ -205,7 +197,7 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
|
||||
<Row gutter={32}>
|
||||
<Col span={11}>
|
||||
<div style={{ marginBottom: 8 }}>备选供应商</div>
|
||||
<div>备选供应商</div>
|
||||
<Table
|
||||
rowKey="id"
|
||||
dataSource={data}
|
||||
@ -224,7 +216,7 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
<Button disabled={!rightSelected.length} onClick={handleRemove}>{"<"}</Button>
|
||||
</Col>
|
||||
<Col span={11}>
|
||||
<div style={{ marginBottom: 8 }}>已选供应商</div>
|
||||
<div>已选供应商</div>
|
||||
<Table
|
||||
rowKey="id"
|
||||
dataSource={rightData}
|
||||
|
@ -135,12 +135,10 @@ const blacklistManage: React.FC = () => {
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="time" label="发起时间">
|
||||
<DatePicker.RangePicker style={{ width: 220 }} allowClear />
|
||||
</Form.Item>
|
||||
|
||||
|
||||
<Form.Item>
|
||||
<Button className="buttonSubmit" type="primary" htmlType="submit" icon={<SearchOutlined />} onClick={handleSearch} >
|
||||
搜索
|
||||
|
@ -1,7 +1,8 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { Modal, Button, Table, Descriptions, Spin, message } from "antd";
|
||||
import {coscoSupplierexit } from "../services"; // 假设的接口
|
||||
import { Modal, Button, Table, Descriptions, Spin, message, Tooltip } from "antd";
|
||||
import {coscoSupplierexit } from "../services";
|
||||
import type { ColumnsType } from 'antd/es/table';
|
||||
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
|
||||
|
||||
interface Supplier {
|
||||
id: number; // 作为 rowKey 用于唯一标识
|
||||
@ -35,7 +36,7 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [detail, setDetail] = useState<DetailData | null>(null);
|
||||
const [suppliers, setSuppliers] = useState<Supplier[]>([]);
|
||||
|
||||
const supplierDetailModal = useSupplierDetailModal();
|
||||
const fetchData = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
@ -65,12 +66,20 @@ const ViewBlacklistModal: React.FC<ViewBlacklistModalProps> = ({
|
||||
}, [visible, recordId]);
|
||||
|
||||
const columns:ColumnsType<Supplier> = [
|
||||
{ title: "供应商名称", dataIndex: "supplierName", align: "center" },
|
||||
{ title: "准入部门", dataIndex: "deptId", align: "center" },
|
||||
// { title: "准入时间", dataIndex: "accessTime", align: "center" },
|
||||
{ title: "退出品类", dataIndex: "categoryName", align: "center" },
|
||||
// { title: "最近一次评价", dataIndex: "lastEval", align: "center" },
|
||||
// { title: "评价时间", dataIndex: "lastEvalDate", align: "center" },
|
||||
{
|
||||
title: "供应商名称", dataIndex: "supplierName", align: "left",
|
||||
width: 360,
|
||||
ellipsis: true,
|
||||
render: (dom, record) => {
|
||||
return (
|
||||
<Tooltip>
|
||||
<a onClick={() => supplierDetailModal?.(record.supplierId)}>{record.supplierName || ''}</a>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
},
|
||||
{ title: "准入部门", dataIndex: "deptId", align: "center", width: 160 },
|
||||
{ title: "退出品类", dataIndex: "categoryName", align: "center", width: 160 },
|
||||
];
|
||||
|
||||
return (
|
||||
|
@ -98,8 +98,6 @@ const CreateBlacklistModal: React.FC<CreateBlacklistModalProps> = ({
|
||||
{ title: "准入部门", dataIndex: "deptId", align: "center" },
|
||||
{ title: "准入时间", dataIndex: "createTime", align: "center" },
|
||||
{ title: "准入品类", dataIndex: "categoryName", align: "center" },
|
||||
{ title: "最近一次评价", dataIndex: "lastEval", align: "center" },
|
||||
{ title: "评价时间", dataIndex: "lastEvalDate", align: "center" },
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "option",
|
||||
|
@ -1,24 +1,22 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
Modal, Table, Button, Checkbox, Row, Col, Input, Select, Form, Space, message
|
||||
Modal, Table, Button, Checkbox, Row, Col, Input, Tooltip, Form, Space, message
|
||||
} from "antd";
|
||||
import { RightOutlined, LeftOutlined } from '@ant-design/icons';
|
||||
import type { ColumnsType } from 'antd/es/table';
|
||||
//接口
|
||||
import { getSupplierCategoryPage } from '../services';
|
||||
//组件
|
||||
import CategorySelector from '@/components/CategorySelector';
|
||||
const { Option } = Select;
|
||||
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
|
||||
|
||||
|
||||
interface Supplier {
|
||||
id: number;
|
||||
supplierId: string;
|
||||
categoryId: string;
|
||||
supplierName: string;
|
||||
|
||||
unit: string; // 准入部门
|
||||
accessTime: string; // 准入时间
|
||||
categoryName: string; // 准入品类
|
||||
lastEval: string; // 最近一次评价
|
||||
lastEvalDate: string; // 评价时间
|
||||
|
||||
}
|
||||
|
||||
interface SupplierSelectModalProps {
|
||||
@ -42,6 +40,7 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
const [data, setData] = useState<Supplier[]>([]);
|
||||
const [pagination, setPagination] = useState({ current: 1, pageSize: 5, total: 0 });
|
||||
const [loading, setLoading] = useState(false);
|
||||
const supplierDetailModal = useSupplierDetailModal();
|
||||
|
||||
useEffect(() => {
|
||||
if (visible) {
|
||||
@ -93,7 +92,7 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
onOk(rightData);
|
||||
};
|
||||
|
||||
const columns = [
|
||||
const columns: ColumnsType<Supplier> = [
|
||||
{
|
||||
title: <Checkbox
|
||||
checked={leftSelected.length === data.length && data.length > 0}
|
||||
@ -115,8 +114,19 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
></Checkbox>
|
||||
)
|
||||
},
|
||||
{ title: "供应商名称", dataIndex: "supplierName" },
|
||||
{ title: "准入品类", dataIndex: "categoryName" }
|
||||
{
|
||||
title: "供应商名称", dataIndex: "supplierName", align: "left",
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
render: (_: any, record: Supplier) => {
|
||||
return (
|
||||
<Tooltip>
|
||||
<a onClick={() => supplierDetailModal?.(record.supplierId)}>{record.supplierName || ''}</a>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
},
|
||||
{ title: "准入品类", dataIndex: "categoryName", width: 120 }
|
||||
];
|
||||
|
||||
const rightColumns = [
|
||||
@ -141,8 +151,8 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
></Checkbox>
|
||||
)
|
||||
},
|
||||
{ title: "供应商名称", dataIndex: "supplierName" },
|
||||
{ title: "准入品类", dataIndex: "categoryName" }
|
||||
{ title: "供应商名称", dataIndex: "supplierName", width: 200 },
|
||||
{ title: "准入品类", dataIndex: "categoryName", width: 120 }
|
||||
];
|
||||
|
||||
return (
|
||||
@ -161,13 +171,7 @@ const SupplierSelectModal: React.FC<SupplierSelectModalProps> = ({
|
||||
<Form.Item name="name" label="供应商名称">
|
||||
<Input style={{ width: 140 }} allowClear maxLength={50} placeholder="请输入供应商名称" />
|
||||
</Form.Item>
|
||||
<Form.Item name="levelName" label="最近一次评价等级">
|
||||
<Select style={{ width: 140 }} allowClear placeholder="请选择最近一次评价等级" >
|
||||
{['A', 'B', 'C', 'D'].map(level => (
|
||||
<Option key={level} value={level}>{level}</Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="categoryId" label="准入品类">
|
||||
<CategorySelector multiple={false} style={{ width: 140 }} />
|
||||
</Form.Item>
|
||||
|
@ -4,8 +4,9 @@ import type { ColumnsType } from 'antd/es/table';
|
||||
//umi 相关
|
||||
import { connect } from 'umi';
|
||||
//接口
|
||||
import { coscoSupplierexit } from "../services"; // 假设的接口
|
||||
import { coscoSupplierexit } from "../services";
|
||||
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
|
||||
|
||||
interface Supplier {
|
||||
id: string; // 作为 rowKey 用于唯一标识
|
||||
supplierName: string; // 供应商名称
|
||||
|
Reference in New Issue
Block a user