供应商名称点击弹出问题

This commit is contained in:
孙景学
2025-07-18 11:32:41 +08:00
parent 6960d402b2
commit e637f62d86
16 changed files with 123 additions and 37 deletions

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import { Modal, Descriptions } from 'antd';
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
import { coscoAccessWorkCategory } from '../services'
@ -32,6 +33,8 @@ const ViewModal: React.FC<{
}> = ({ visible, record = {}, onCancel }) => {
//渲染数据
const [data, setData] = useState<Data | null>(null);
const supplierDetailModal = useSupplierDetailModal();
//初始化
useEffect(() => {
if (record.id) {
@ -52,7 +55,7 @@ const ViewModal: React.FC<{
<Descriptions.Item label="准入供应商">
{data.coscoAccessSupplierList.map((item) => {
return (
<div style={{ margin: '5px' }}>{item.supplierName}</div>
<div style={{ margin: '5px', color: '#004f8e', cursor: 'pointer' }} onClick={() => supplierDetailModal?.(item.supplierId)} >{item.supplierName}</div>
)
})}
</Descriptions.Item>

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import { Modal, Descriptions } from 'antd';
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
import { coscoAccessWorkCategory } from '../services'
@ -32,6 +33,8 @@ const ViewModal: React.FC<{
}> = ({ visible, record = {}, onCancel }) => {
//渲染数据
const [data, setData] = useState<Data | null>(null);
const supplierDetailModal = useSupplierDetailModal();
//初始化
useEffect(() => {
if (record.id) {
@ -52,7 +55,7 @@ const ViewModal: React.FC<{
<Descriptions.Item label="准入供应商">
{data.coscoAccessSupplierList.map((item) => {
return (
<div style={{ margin: '5px' }}>{item.supplierName}</div>
<div style={{ margin: '5px', color: '#004f8e', cursor: 'pointer' }} onClick={() => supplierDetailModal?.(item.supplierId)} >{item.supplierName}</div>
)
})}
</Descriptions.Item>

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import { Modal, Descriptions } from 'antd';
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
import { coscoAccessWork } from '../services'
@ -47,6 +48,7 @@ const ViewModal: React.FC<{
}> = ({ visible, record = {}, onCancel }) => {
//渲染数据
const [data, setData] = useState<Data | null>(null);
const supplierDetailModal = useSupplierDetailModal();
//初始化
useEffect(() => {
if (record) {
@ -67,7 +69,7 @@ const ViewModal: React.FC<{
<Descriptions.Item label="准入供应商">
{data.coscoAccessSupplierList.map((item) => {
return (
<div style={{ margin: '5px' }}>{item.supplierName}</div>
<div style={{ margin: '5px', color: '#004f8e', cursor: 'pointer' }} onClick={() => supplierDetailModal?.(item.supplierId)} >{item.supplierName}</div>
)
})}
</Descriptions.Item>

View File

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Table, Form, Select, Button, message, Space } from 'antd';
import { Table, Form, Select, Button, message, Space, Tooltip } from 'antd';
import { SearchOutlined, DeleteOutlined } from '@ant-design/icons';
import type { ColumnsType } from 'antd/es/table';
//接口
@ -146,14 +146,21 @@ const SupplierEntryReview: React.FC = () => {
dataIndex: 'categoryNameList',
width: 120,
align: 'center',
render: (_: any, record: any) => {
render: (value: { item: string }[] = []) => {
if (!value || value.length === 0) return '-';
if (value.length === 1) {
return <span>{value[0].item}</span>;
}
// 多于1条
const allNames = value.map(item => item).join('、');
return (
<>
{record.categoryNameList && record.categoryNameList.map((item: string) => {
return <div>{`${item}`}</div>
})}
</>
)
<Tooltip title={allNames} overlayStyle={{ zIndex: 1200 }}>
<span>
{value[0]}
<span></span>
</span>
</Tooltip>
);
},
},
{

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import { Modal, Descriptions } from 'antd';
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
import { coscoAccessWork } from '../services'
@ -47,6 +48,8 @@ const ViewModal: React.FC<{
}> = ({ visible, record = {}, onCancel }) => {
//渲染数据
const [data, setData] = useState<Data | null>(null);
const supplierDetailModal = useSupplierDetailModal();
//初始化
useEffect(() => {
if (record.id) {
@ -67,7 +70,8 @@ const ViewModal: React.FC<{
<Descriptions.Item label="准入供应商">
{data.coscoAccessSupplierList.map((item) => {
return (
<div style={{ margin: '5px' }}>{item.supplierName}</div>
<div style={{ margin: '5px', color: '#004f8e', cursor: 'pointer' }} onClick={() => supplierDetailModal?.(item.supplierId)} >{item.supplierName}</div>
)
})}
</Descriptions.Item>

View File

@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
import { Modal, Descriptions } from 'antd';
import { coscoAccessWork } from '../services'
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';
//数据接口
interface Data {
@ -47,6 +48,7 @@ const ViewModal: React.FC<{
}> = ({ visible, record = {}, onCancel }) => {
//渲染数据
const [data, setData] = useState<Data | null>(null);
const supplierDetailModal = useSupplierDetailModal();
//初始化
useEffect(() => {
if (record.id) {
@ -65,11 +67,13 @@ const ViewModal: React.FC<{
<Descriptions bordered column={1} labelStyle={{ width: 160 }}>
<Descriptions.Item label="准入部门" >{data.coscoAccessWork.deptName}</Descriptions.Item>
<Descriptions.Item label="准入供应商">
{data.coscoAccessSupplierList.map((item) => {
return (
<div style={{ margin: '5px' }}>{item.supplierName}</div>
<div style={{ margin: '5px', color: '#004f8e', cursor: 'pointer' }} onClick={() => supplierDetailModal?.(item.supplierId)} >{item.supplierName}</div>
)
})}
</Descriptions.Item>
{data.coscoAccessWork.accessType === 'scattered' && (

View File

@ -1,6 +1,6 @@
import React, { useEffect, useState } from "react";
import { useIntl } from 'umi';
import { Form, Button, Table, Space, Input } from 'antd';
import { Form, Button, Table, Space, Input, Tooltip } from 'antd';
import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
import { SearchOutlined, DeleteOutlined } from '@ant-design/icons';
//接口
@ -117,14 +117,21 @@ const CooperateEnterprise: React.FC = () => {
dataIndex: 'categoryNameList',
align: 'center',
width: 160,
render: (_: any, record: Data) => {
render: (value: { item: string }[] = []) => {
if (!value || value.length === 0) return '-';
if (value.length === 1) {
return <span>{value[0].item}</span>;
}
// 多于1条
const allNames = value.map(item => item).join('、');
return (
<>
{record.categoryNameList && record.categoryNameList.map((item: string) => {
return <div>{`${item}`}</div>
})}
</>
)
<Tooltip title={allNames} overlayStyle={{ zIndex: 1200 }}>
<span>
{value[0]}
<span></span>
</span>
</Tooltip>
);
},
},
{