Skip to content

J
jinfa-platform
Commit 6b38b124 authored by 前端-钟卫鹏's avatar 前端-钟卫鹏
Browse files
Options

feat: 新增招标查询列表/详情页面

parent 5455592a
Show whitespace changes
Inline Side-by-side
Showing with 697 additions and 220 deletions
src/pages/procurement/callForBids/callForBidsSearch/detail/index.tsx
View file @ 6b38b124
import React, { useState, useCallback, useRef, useContext, useEffect, createRef } from 'react'; import React, { useState, useCallback, useRef, useContext, useEffect, createRef } from 'react';
import { history } from 'umi' import { history } from 'umi'
import { Button } from 'antd'; import { Button } from 'antd';
import style from './index.less'
import OrderDetailWrapper from '@/pages/transaction/components/OrderDetailWrapper'; import OrderDetailWrapper from '@/pages/transaction/components/OrderDetailWrapper';
import PreLoading from '@/components/PreLoading'; import PreLoading from '@/components/PreLoading';
// import { useOrderDetail } from '../../../_public/order/effects/useOrderDetail';
// import OrderDetailSection from '../../../components/orderDetailSection';
import OrderPayModal from '@/pages/transaction/components/orderPayModal'; import OrderPayModal from '@/pages/transaction/components/orderPayModal';
import { BidDetailContext } from '@/pages/procurement/_public/bid/context'; import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
import { useBidDetail } from '@/pages/procurement/_public/bid/effects/useBidDetail'; import { useBidDetail } from '@/pages/procurement/_public/bid/effects/useBidDetail';
import BidDetailHeader from '@/pages/procurement/components/bidDetailHeader'; import BidDetailHeader from '@/pages/procurement/components/bidDetailHeader';
import OrderDetailSection from '@/pages/transaction/components/orderDetailSection';
import style from './index.less'
import BidDetailSection from '@/pages/procurement/components/bidDetailSection'; import BidDetailSection from '@/pages/procurement/components/bidDetailSection';
const CallForBidsSearchDetail: React.FC = () => { const CallForBidsSearchDetail: React.FC = () => {
......
src/pages/procurement/callForBids/callForBidsSearch/model/useSelfTable.tsx
View file @ 6b38b124
...@@ -9,7 +9,7 @@ import { PlayCircleOutlined, PoweroffOutlined } from '@ant-design/icons' ...@@ -9,7 +9,7 @@ import { PlayCircleOutlined, PoweroffOutlined } from '@ant-design/icons'
import CustomTag from '@/pages/procurement/components/CustomTag' import CustomTag from '@/pages/procurement/components/CustomTag'
import CustomBadge from '@/pages/procurement/components/customBadge' import CustomBadge from '@/pages/procurement/components/customBadge'
// 业务hooks, 待支付订单 // 招标查询
export const useSelfTable = () => { export const useSelfTable = () => {
const ref = useRef<any>({}) const ref = useRef<any>({})
...@@ -21,7 +21,7 @@ export const useSelfTable = () => { ...@@ -21,7 +21,7 @@ export const useSelfTable = () => {
}) })
} }
const payOrderColumns: any[] = [ const callForBidColumns: any[] = [
{ {
title: '序号', title: '序号',
align: 'center', align: 'center',
...@@ -130,6 +130,6 @@ export const useSelfTable = () => { ...@@ -130,6 +130,6 @@ export const useSelfTable = () => {
return { return {
ref, ref,
columns: payOrderColumns columns: callForBidColumns
} }
} }
src/pages/procurement/components/basicInfo/index.tsx deleted 100644 → 0
View file @ 5455592a
import React, { useContext, useState } from 'react'
import { Row, Col, Tag, Modal } from 'antd'
import MellowCard from '@/components/MellowCard'
import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
import { formatTimeString } from '@/utils'
import style from './index.less'
import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
export interface BasicInfoProps {
cardTitle?: string;
}
const BasicInfo: React.FC<BasicInfoProps> = ({cardTitle}) => {
const bidDetailContext = useContext(BidDetailContext)
const { data, ctl } = bidDetailContext
const [showMore, setShowMore] = useState<boolean>(false)
console.log(data, 'basicInfo')
const toogleMore = () => {
setShowMore(!showMore)
}
const columnList = [
{
span: 8,
fieldList: [
{ title: '招标编号', name: 'orderNo' },
{ title: '外部状态', name: 'orderModel' },
{ title: '内部状态', name: 'orderModel' },
{ title: '发布时间', name: 'createTime', render: (text) => formatTimeString(text) },
]
},
{
span: 8,
fieldList: [
{ title: '招标项目', name: 'createMemberName' },
{ title: '项目预算', name: 'createMemberName' },
{ title: '采购类型', name: 'createMemberName' },
{ title: '招标会员', name: 'createMemberName' },
{ title: '招标摘要', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '适用地址',
name: 'paymentInformationResponses',
render: (t, r) => {
const showDataSource = showMore ? data['paymentInformationResponses'] : [...data['paymentInformationResponses']].splice(0, 3)
return <>
<p>
{
showDataSource.map((_item, _i) => <p key={_i}>{_item.payNode+'/'+(_item.payNode||'')}</p>)
}
</p>
{
data.length > 3 &&
<p onClick={toogleMore} style={{ cursor: 'pointer' }} className="commonPickColor">
展开{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</p>
}
</>
}
},
]
}
]
const RenderBasicInfoColumns = ({ infoList = [], dataSource }) => <Row>
{
infoList.map(({span, fieldList = []}, index) => (<Col key={index} span={span}>
{
// item.fieldList.map((_v, _i) => dataSource[_v.name] ? <Row key={_v.name} className={style['card-list']}>
// <Col span={6} className={style['card-list_title']}>{_v.title}</Col>
// {/* <Col flex={1} {..._v.resetCol}>{_v.render ? _v.render(dataSource[_v.name], dataSource) : dataSource[_v.name]}</Col> */}
// </Row> : null)
fieldList.length ? fieldList.map((_v, _i) => <Row key={_v.name} className={style['card-list']}>
<Col span={6} className={style['card-list_title']}>{_v.title}</Col>
<Col>{_v.render ? _v.render(dataSource[_v.name], dataSource) : dataSource[_v.name]}</Col>
</Row>) : null
}
</Col>))
}
</Row>
return (
<MellowCard
title={cardTitle}
style={{marginTop: 24}}
bordered={false}
fullHeight
>
<RenderBasicInfoColumns infoList={columnList} dataSource={data} />
</MellowCard>)
}
BasicInfo.defaultProps = {}
export default BasicInfo
src/pages/procurement/components/bidDetailHeader/index.tsx
View file @ 6b38b124
...@@ -40,7 +40,7 @@ const BidDetailHeader:React.FC<BidDetailHeaderProps> = ({ extraRight, detailList ...@@ -40,7 +40,7 @@ const BidDetailHeader:React.FC<BidDetailHeaderProps> = ({ extraRight, detailList
setCurrent(index) setCurrent(index)
} }
}) })
console.log('123456')
// 锚点导航距离顶端距离 // 锚点导航距离顶端距离
let navDom: any = document.getElementById("anchorTitle") let navDom: any = document.getElementById("anchorTitle")
let distance = navDom.offsetTop - document.documentElement.scrollTop let distance = navDom.offsetTop - document.documentElement.scrollTop
...@@ -61,6 +61,7 @@ const BidDetailHeader:React.FC<BidDetailHeaderProps> = ({ extraRight, detailList ...@@ -61,6 +61,7 @@ const BidDetailHeader:React.FC<BidDetailHeaderProps> = ({ extraRight, detailList
const clickItem = (index: any) => { const clickItem = (index: any) => {
setCurrent(index) setCurrent(index)
console.log(index, 'index')
} }
return ( return (
......
src/pages/procurement/components/bidDetailSection/index.less
View file @ 6b38b124
.anchorContentWrap { .anchorContentWrap {
div { div {
&:target { &:target {
padding-top: 160px; padding-top: 200px;
margin-top: -160px; margin-top: -200px;
} }
} }
} }
src/pages/procurement/components/bidDetailSection/index.tsx
View file @ 6b38b124
import React from 'react' import React from 'react'
import { Card, Radio } from 'antd'
import AuditProcess from '@/components/AuditProcess'
import { findLastIndexFlowState } from '@/utils' import { findLastIndexFlowState } from '@/utils'
// import OrderProductTable from '../../components/orderProductTable'
// import SaleOrderProductTable from '../../components/saleOrderProductTable'
// import OrderPayTabs from '../../components/orderPayTabs'
// import OrderMergeInfo from '../../components/orderMergeInfo'
// import OrderDeleveRecord from '../../components/orderDeleveRecord'
// import OrderTransformRecord from '../../components/orderTransformRecord'
// import OrderSaleRecord from '../orderSaleRecord'
import style from './index.less' import style from './index.less'
import MellowCard from '@/components/MellowCard'
import TransferProcess from '../transferProcess' import TransferProcess from '../transferProcess'
import BasicInfo from '../basicInfo' import DescriptionsInfo from '../descriptionsInfo'
import BidMaterial from '../bidMaterial'
import BidMethod from '../bidMethod'
import BidTransformRecord from '../transferRecord'
export interface BidDetailSectionProps { export interface BidDetailSectionProps {
formContext: any, formContext: any,
...@@ -23,54 +15,6 @@ export interface BidDetailSectionProps { ...@@ -23,54 +15,6 @@ export interface BidDetailSectionProps {
const BidDetailSection:React.FC<BidDetailSectionProps> = ({formContext, type = 'purchaseOrder', anchorList = []}) => { const BidDetailSection:React.FC<BidDetailSectionProps> = ({formContext, type = 'purchaseOrder', anchorList = []}) => {
return ( return (
// formContext.data && <div className='gray-wrap'>
// <AuditProcess
// customTitleKey='operationalProcess'
// customKey='state'
// outerVerifyCurrent={findLastIndexFlowState(formContext.data.externalWorkflowFlowRecordLogResponses)}
// innerVerifyCurrent={findLastIndexFlowState(formContext.data.interiorWorkflowFlowRecordLogResponses)}
// outerVerifySteps={
// formContext.data.externalWorkflowFlowRecordLogResponses ?
// formContext.data.externalWorkflowFlowRecordLogResponses.map(item => ({
// ...item,
// status: item.isExecute ? 'finish' : 'wait',
// })) :
// []
// }
// innerVerifySteps={
// formContext.data.interiorWorkflowFlowRecordLogResponses ?
// formContext.data.interiorWorkflowFlowRecordLogResponses.map(item => ({
// ...item,
// status: item.isExecute ? 'finish' : 'wait',
// })) :
// []
// }
// ></AuditProcess>
// { type === 'saleOrder' ? <SaleOrderProductTable/> : <OrderProductTable editable /> }
// <OrderPayTabs />
// <OrderMergeInfo />
// { type === 'saleOrder' ? <OrderSaleRecord /> : <OrderDeleveRecord /> }
// <OrderTransformRecord type={type}/>
// </div>
// const anchorTitleMapId = [
// { title: '流转进度', id: 'transferProcess' },
// { title: '基本信息', id: 'baseicInfo' },
// { title: '招标物料', id: 'bidMaterial' },
// { title: '招标要求', id: 'bidNeed' },
// { title: '报名要求', id: 'registerNeed' },
// { title: '资格预审要求', id: 'checkNeed' },
// { title: '评标要求', id: 'remarkNeed' },
// { title: '其他要求', id: 'otherNeed' },
// { title: '招标方式', id: 'bidWay' },
// { title: '流转记录', id: 'transferRecord' },
// ]
formContext.data && formContext.data &&
<div className={[style.anchorContentWrap, "anchorContent"].join(' ')}> <div className={[style.anchorContentWrap, "anchorContent"].join(' ')}>
<div id={anchorList[0]['id']}> <div id={anchorList[0]['id']}>
...@@ -99,55 +43,31 @@ const BidDetailSection:React.FC<BidDetailSectionProps> = ({formContext, type = ' ...@@ -99,55 +43,31 @@ const BidDetailSection:React.FC<BidDetailSectionProps> = ({formContext, type = '
></TransferProcess> ></TransferProcess>
</div> </div>
<div id={anchorList[1]['id']}> <div id={anchorList[1]['id']}>
<BasicInfo cardTitle={anchorList[1]['title']}/> <DescriptionsInfo cardTitle={anchorList[1]['title']} type="basicInfo" />
</div> </div>
<div id={anchorList[2]['id']}> <div id={anchorList[2]['id']}>
<MellowCard title={anchorList[2]['title']} style={{marginTop: 24}} bordered={false}> <BidMaterial cardTitle={anchorList[2]['title']} />
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
<br/>
<p>1234564654</p>
</MellowCard>
</div> </div>
<div id={anchorList[3]['id']}> <div id={anchorList[3]['id']}>
<MellowCard title={anchorList[3]['title']} style={{marginTop: 24}} bordered={false}> <DescriptionsInfo cardTitle={anchorList[3]['title']} type="bidNeed" />
<p>1234564654</p> </div>
<br/> <div id={anchorList[4]['id']}>
<p>1234564654</p> <DescriptionsInfo cardTitle={anchorList[4]['title']} type="registerNeed" />
<br/> </div>
<p>1234564654</p> <div id={anchorList[5]['id']}>
<br/> <DescriptionsInfo cardTitle={anchorList[5]['title']} type="checkNeed" />
<p>1234564654</p> </div>
<br/> <div id={anchorList[6]['id']}>
<p>1234564654</p> <DescriptionsInfo cardTitle={anchorList[6]['title']} type="remarkNeed" />
<br/> </div>
<p>1234564654</p> <div id={anchorList[7]['id']}>
<p>1234564654</p> <DescriptionsInfo cardTitle={anchorList[7]['title']} type="otherNeed" />
<br/> </div>
<p>1234564654</p> <div id={anchorList[8]['id']}>
<br/> <BidMethod cardTitle={anchorList[8]['title']} />
<p>1234564654</p> </div>
<br/> <div id={anchorList[9]['id']}>
<p>1234564654</p> <BidTransformRecord cardTitle={anchorList[9]['title']} />
<br/>
<p>1234564654</p>
</MellowCard>
</div> </div>
</div> </div>
......
src/pages/procurement/components/bidMaterial/index.tsx 0 → 100644
View file @ 6b38b124
import React, { useContext, useState } from 'react'
import { Table } from 'antd'
import MellowCard from '@/components/MellowCard'
import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
/**
* 招标物料表格
*/
export interface BidMaterialProps {
cardTitle?: string;
}
const BidMaterial: React.FC<BidMaterialProps> = ({cardTitle}) => {
const bidDetailContext = useContext(BidDetailContext)
const { data, ctl } = bidDetailContext
const dataSource = [
{
key: '1',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '2',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
{
key: '3',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '4',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
];
const columns = [
{
title: '姓名',
dataIndex: 'name',
key: 'name',
},
{
title: '年龄',
dataIndex: 'age',
key: 'age',
},
{
title: '住址',
dataIndex: 'address',
key: 'address',
},
];
return (
<MellowCard
title={cardTitle}
style={{marginTop: 24}}
bordered={false}
fullHeight
>
<Table dataSource={dataSource} columns={columns} pagination={{size: "small"}} />
</MellowCard>)
}
BidMaterial.defaultProps = {}
export default BidMaterial
src/pages/procurement/components/bidMethod/index.tsx 0 → 100644
View file @ 6b38b124
import React, { useContext, useState } from 'react'
import { Table, Button, Switch, Tooltip } from 'antd'
import MellowCard from '@/components/MellowCard'
import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
import { QuestionCircleOutlined } from '@ant-design/icons';
/**
* 招标方式
*/
export interface BidMethodProps {
cardTitle?: string;
}
const BidMethod: React.FC<BidMethodProps> = ({cardTitle}) => {
const bidDetailContext = useContext(BidDetailContext)
const { data, ctl } = bidDetailContext
const dataSource = [
{
key: '1',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '2',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
{
key: '3',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '4',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
];
const columns = [
{
title: '姓名',
dataIndex: 'name',
key: 'name',
},
{
title: '年龄',
dataIndex: 'age',
key: 'age',
},
{
title: '住址',
dataIndex: 'address',
key: 'address',
},
{
title: '是否归属会员',
dataIndex: 'address',
key: 'address',
},
{
title: <>状态<Tooltip title="打开开关，审核通过后，将招标发至对应的会员"><span>&nbsp;<QuestionCircleOutlined /></span></Tooltip></>,
dataIndex: 'address',
key: 'address',
render: (text, record) => <Switch defaultChecked onChange={() => onChange(record)} />
},
{
title: '操作',
dataIndex: 'ctl',
key: 'ctl',
render: (text, record) => <Button type='link'>进入店铺</Button>
}
];
const onChange = (record) => {
console.log(record)
}
return (
<MellowCard
title={cardTitle}
style={{marginTop: 24}}
bordered={false}
fullHeight
>
<Table dataSource={dataSource} columns={columns} pagination={{size: "small"}} />
</MellowCard>)
}
BidMethod.defaultProps = {}
export default BidMethod
src/pages/procurement/components/customBadge.tsx
View file @ 6b38b124
...@@ -45,7 +45,7 @@ const CustomBadge: React.FC<StatusColorsProps> = (props) => { ...@@ -45,7 +45,7 @@ const CustomBadge: React.FC<StatusColorsProps> = (props) => {
const { status, type } = props const { status, type } = props
const statusText = typeMaps[type] const statusText = typeMaps[type]
// const statusShowColor = matchStatusColor(status) // const statusShowColor = matchStatusColor(status)
return (<><span className={classNameMap[status]}></span>{statusText[status]}</>) return (status ? <><span className={classNameMap[status]}></span>{statusText[status]}</> : null)
} }
CustomBadge.defaultProps = {} CustomBadge.defaultProps = {}
......
src/pages/procurement/components/customTag.tsx
View file @ 6b38b124
...@@ -5,7 +5,8 @@ import { insideStatusText, outStatusText } from '../constants' ...@@ -5,7 +5,8 @@ import { insideStatusText, outStatusText } from '../constants'
// 用于标签状态控制 // 用于标签状态控制
export interface StatusColorsProps { export interface StatusColorsProps {
status: number, status: number,
type: 'out' | 'inside' /** 外部状态 内部状态 外部流转状态 内部流转状态 */
type: 'out' | 'inside' | 'transformInside' | 'transformOut'
} }
// 颜色映射 // 颜色映射
...@@ -23,11 +24,34 @@ const mapColor = [ ...@@ -23,11 +24,34 @@ const mapColor = [
"rgb(101, 84, 192)", // 紫 "rgb(101, 84, 192)", // 紫
"rgb(230, 63, 59)", // 红 "rgb(230, 63, 59)", // 红
"rgb(0, 179, 122)", // 绿 "rgb(0, 179, 122)", // 绿
"rgb(96, 98, 102)", // 灰
"rgb(255, 153, 31)", // 黄
"rgb(63, 126, 210)", // 蓝
"rgb(101, 84, 192)", // 紫
"rgb(230, 63, 59)", // 红
"rgb(0, 179, 122)", // 绿
"rgb(96, 98, 102)", // 灰
"rgb(255, 153, 31)", // 黄
"rgb(63, 126, 210)", // 蓝
"rgb(101, 84, 192)", // 紫
"rgb(230, 63, 59)", // 红
"rgb(0, 179, 122)", // 绿
"rgb(96, 98, 102)", // 灰
"rgb(255, 153, 31)", // 黄
"rgb(63, 126, 210)", // 蓝
"rgb(101, 84, 192)", // 紫
"rgb(230, 63, 59)", // 红
"rgb(0, 179, 122)", // 绿
] ]
const typeMaps = { const typeMaps = {
'out': outStatusText, 'out': outStatusText,
'inside': insideStatusText, 'inside': insideStatusText,
// transformOut:
// transformInside:
} }
// 订单内部状态显示 // 订单内部状态显示
...@@ -36,12 +60,12 @@ const CustomTag: React.FC<StatusColorsProps> = (props) => { ...@@ -36,12 +60,12 @@ const CustomTag: React.FC<StatusColorsProps> = (props) => {
const statusText = typeMaps[type] const statusText = typeMaps[type]
// const statusShowColor = matchStatusColor(status) // const statusShowColor = matchStatusColor(status)
return ( return (
<span style={{ status ? <span style={{
color: mapColor[status], color: mapColor[status],
padding: '2px 4px', padding: '2px 4px',
backgroundColor: `rgba(${mapColor[status].slice(4, mapColor[status].length-1)}, 0.1)`, backgroundColor: `rgba(${mapColor[status].slice(4, mapColor[status].length-1)}, 0.1)`,
borderRadius: '4px', borderRadius: '4px',
}}>{statusText[status]}</span> }}>{statusText[status]}</span> : null
) )
} }
......
src/pages/procurement/components/descriptionsInfo/index.tsx 0 → 100644
View file @ 6b38b124
import React, { useContext, useState } from 'react'
import { Row, Col, Tag, Modal } from 'antd'
import MellowCard from '@/components/MellowCard'
import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
import { formatTimeString } from '@/utils'
import style from './index.less'
import { CaretDownOutlined, CaretUpOutlined, FileFilled } from '@ant-design/icons';
/**
* 描述信息列表
*/
export interface BasicInfoProps {
/** title标题 */
cardTitle?: string;
/** 显示信息类型
* 'basicInfo' 基本信息 | 'bidNeed' 招标要求 | 'registerNeed' 报名要求 | 'checkNeed' 资格预审要求 | 'remarkNeed' 评标要求 | 'otherNeed' 其他要求
*/
type?: 'basicInfo' | 'bidNeed' | 'registerNeed' | 'checkNeed' | 'remarkNeed' | 'otherNeed';
}
const DescriptionsInfo: React.FC<BasicInfoProps> = ({cardTitle, type}) => {
const bidDetailContext = useContext(BidDetailContext)
const { data, ctl } = bidDetailContext
const [showMore, setShowMore] = useState<boolean>(false)
const toogleMore = () => {
setShowMore(!showMore)
}
// 基本信息
const basicColumnList = [
{
span: 8,
fieldList: [
{ title: '招标编号', name: 'orderNo' },
{ title: '外部状态', name: 'orderModel' },
{ title: '内部状态', name: 'orderModel' },
{ title: '发布时间', name: 'createTime', render: (text) => formatTimeString(text) },
]
},
{
span: 8,
fieldList: [
{ title: '招标项目', name: 'createMemberName' },
{ title: '项目预算', name: 'createMemberName' },
{ title: '采购类型', name: 'createMemberName' },
{ title: '招标会员', name: 'createMemberName' },
{ title: '招标摘要', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '适用地址',
name: 'paymentInformationResponses',
render: (t, r) => {
const showDataSource = showMore ? data['paymentInformationResponses'] : [...data['paymentInformationResponses']].splice(0, 3)
return <>
<p>
{
showDataSource.map((_item, _i) => <p key={_i}>{_item.payNode+'/'+(_item.payNode||'')}</p>)
}
</p>
{
data.length > 3 &&
<p onClick={toogleMore} style={{ cursor: 'pointer' }} className="commonPickColor">
展开{showMore ? <CaretDownOutlined /> : <CaretUpOutlined />}
</p>
}
</>
}
},
]
}
]
// 招标要求
const callForNeedList = [
{
span: 8,
fieldList: [
{ title: '投标截止时间', name: 'createTime', render: (text) => formatTimeString(text) },
{ title: '期望交付日期', name: 'createTime', render: (text) => formatTimeString(text) },
]
},
{
span: 8,
fieldList: [
{ title: '目标价', name: 'createMemberName' },
{ title: '招标要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '招标文件',
name: 'paymentInformationResponses',
render: (t, r) => (<div>
{
data['paymentInformationResponses'].map((_item, _i) => <p><a key={_i}><FileFilled /> {_item.payNode}</a></p>)
}
</div>)
},
]
}
]
// 报名要求
const registerNeedList = [
{
span: 8,
fieldList: [
{ title: '报名要求时间', name: 'createTime', render: (text) => formatTimeString(text) },
{ title: '报名要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '报名要求附件',
name: 'paymentInformationResponses',
render: (t, r) => (<div>
{
data['paymentInformationResponses'].map((_item, _i) => <p><a key={_i}><FileFilled /> {_item.payNode}</a></p>)
}
</div>)
},
]
}
]
// 资格预审要求
const checkNeedList = [
{
span: 8,
fieldList: [
{ title: '资格预审时间', name: 'createTime', render: (text) => formatTimeString(text) },
{ title: '资格预审要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '资格预审要求附件',
name: 'paymentInformationResponses',
render: (t, r) => (<div>
{
data['paymentInformationResponses'].map((_item, _i) => <p><a key={_i}><FileFilled /> {_item.payNode}</a></p>)
}
</div>)
},
]
}
]
// 评标要求
const remarkNeedList = [
{
span: 8,
fieldList: [
{ title: '评标要求时间', name: 'createTime', render: (text) => formatTimeString(text) },
{ title: '评标要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{
title: '评标要求附件',
name: 'paymentInformationResponses',
render: (t, r) => (<div>
{
data['paymentInformationResponses'].map((_item, _i) => <p><a key={_i}><FileFilled /> {_item.payNode}</a></p>)
}
</div>)
},
]
},
{
span: 8,
fieldList: [
{ title: '是否在线评标', name: 'createMemberName' },
{ title: '评标项模板', name: 'createMemberName' },
]
},
]
// 其他要求
const otherNeedList = [
{
span: 8,
fieldList: [
{ title: '付款方式', name: 'createTime' },
{ title: '交付地址', name: 'createMemberName' },
{ title: '税费要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{ title: '交付要求', name: 'createMemberName' },
{ title: '物流要求', name: 'createMemberName' },
]
},
{
span: 8,
fieldList: [
{ title: '包装要求', name: 'createMemberName' },
{ title: '其他要求', name: 'createMemberName' },
]
},
]
/** 类型数据映射 */
const Type_Data_Map = {
'basicInfo': basicColumnList,
'bidNeed': callForNeedList,
'registerNeed': registerNeedList,
'checkNeed': checkNeedList,
'remarkNeed': remarkNeedList,
'otherNeed': otherNeedList,
}
const RenderBasicInfoColumns = ({ infoList = [], dataSource }) => <Row>
{
infoList.map(({span, fieldList = []}, index) => (<Col key={index} span={span}>
{
fieldList.length ? fieldList.map((_v, _i) => <Row key={_v.name} className={style['card-list']}>
<Col span={6} className={style['card-list_title']}>{_v.title}</Col>
<Col>{_v.render ? _v.render(dataSource[_v.name], dataSource) : dataSource[_v.name]}</Col>
</Row>) : null
}
</Col>))
}
</Row>
return (
<MellowCard
title={cardTitle}
style={{marginTop: 24}}
bordered={false}
fullHeight
>
<RenderBasicInfoColumns infoList={Type_Data_Map[type]} dataSource={data} />
{
type === 'remarkNeed' ?
<div className={style['card-list']}>
<p className={style['card-list_title']}>评标专家列表</p>
<p style={{backgroundColor: '#fafbfc'}}>
<Row>
<Col span={1}>1</Col>
<Col span={2}>大佬</Col>
<Col span={4}>kuaimeizheng@qq.com</Col>
<Col span={4}>全球总监</Col>
</Row>
</p>
<p style={{backgroundColor: '#fafbfc'}}>
<Row>
<Col span={1}>1</Col>
<Col span={2}>大佬</Col>
<Col span={4}>kuaimeizheng@qq.com</Col>
<Col span={4}>宇宙总监</Col>
</Row>
</p>
<p style={{backgroundColor: '#fafbfc'}}>
<Row>
<Col span={1}>1</Col>
<Col span={2}>大佬</Col>
<Col span={4}>kuaimeizheng@qq.com</Col>
<Col span={4}>宇宙总监</Col>
</Row>
</p>
</div>
: null
}
</MellowCard>)
}
DescriptionsInfo.defaultProps = {}
export default DescriptionsInfo
src/pages/procurement/components/transferRecord/index.less 0 → 100644
View file @ 6b38b124
.cardWrap {
:global {
.ant-radio-button-wrapper:hover {
color: #606266;
}
.ant-radio-group-solid .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
color: #fff;
background: #6B778C;
border-color: #6B778C;
}
.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
background-color: #6B778C;
}
}
}
src/pages/procurement/components/transferRecord/index.tsx 0 → 100644
View file @ 6b38b124
import React, { useContext, useState } from 'react'
import { Tabs, Table, Radio } from 'antd'
import { formatTimeString } from '@/utils'
import { BidDetailContext } from '@/pages/procurement/_public/bid/context';
import MellowCard from '@/components/MellowCard'
import CustomTag from '../CustomTag';
import { TransferEnum } from '../transferProcess';
import style from './index.less'
/**
* 招标流转记录
*/
export interface BidTransformRecordProps {
cardTitle?: string;
}
const outReocrdCols: any[] = [
{
title: '流转顺序号',
dataIndex: 'no',
align: 'center',
key: 'no',
render: (_, __, index: number) => index + 1
},
{
title: '操作角色',
dataIndex: 'roleName',
align: 'center',
key: 'roleName',
},
{
title: '状态',
dataIndex: 'state',
align: 'center',
key: 'state',
// render: text => <CustomTag status={text} type='transformOut'/>
},
{
title: '操作',
dataIndex: 'operation',
align: 'center',
key: 'operation',
},
{
title: '操作时间',
dataIndex: 'operationTime',
align: 'center',
key: 'operationTime',
render: time => formatTimeString(time)
},
{
title: '审核意见',
dataIndex: 'auditOpinion',
align: 'center',
key: 'auditOpinion',
},
]
const insideRecordCols: any[] = [
{
title: '流转记录',
dataIndex: 'no',
align: 'center',
key: 'no',
render: (_, __, index: number) => index + 1
},
{
title: '操作人',
dataIndex: 'roleName',
align: 'center',
key: 'roleName',
},
{
title: '部门',
dataIndex: 'department',
align: 'center',
key: 'department',
},
{
title: '职位',
dataIndex: 'position',
align: 'center',
key: 'position',
},
{
title: '状态',
dataIndex: 'state',
align: 'center',
key: 'state',
// render: text => <CustomTag status={text} type='transformInside'/>
},
{
title: '操作',
dataIndex: 'operation',
align: 'center',
key: 'operation',
},
{
title: '操作时间',
dataIndex: 'operationTime',
align: 'center',
key: 'operationTime',
render: text => formatTimeString(text)
},
{
title: '审核意见',
dataIndex: 'auditOpinion',
align: 'center',
key: 'auditOpinion',
},
]
const BidTransformRecord:React.FC<BidTransformRecordProps> = ({cardTitle}) => {
const { data } = useContext(BidDetailContext)
const { externalProcurementOrderLogResponses, interiorProcurementOrderLogResponses } = data
const [transferRadio, setTransferRadio] = useState<TransferEnum>(TransferEnum.Outer)
const handleChangeType = (e) => {
setTransferRadio(e.target.value)
}
return (
<MellowCard
title={cardTitle}
style={{marginTop: 24}}
bordered={false}
extra={
<Radio.Group value={transferRadio} buttonStyle="solid" size="small" onChange={handleChangeType}>
{externalProcurementOrderLogResponses?.length ? <Radio.Button value={TransferEnum.Outer}>外部流转</Radio.Button> : null}
{interiorProcurementOrderLogResponses?.length ? <Radio.Button value={TransferEnum.Interior}>内部流转</Radio.Button> : null}
</Radio.Group>
}
className={style.cardWrap}
>
{
(externalProcurementOrderLogResponses?.length && transferRadio === TransferEnum.Outer) ?
<Table
columns={outReocrdCols}
dataSource={externalProcurementOrderLogResponses}
pagination={false}
rowKey="id"
/> : null
}
{
(interiorProcurementOrderLogResponses?.length && transferRadio === TransferEnum.Interior) ?
<Table
columns={insideRecordCols}
dataSource={interiorProcurementOrderLogResponses}
pagination={false}
rowKey="id"
/> : null
}
</MellowCard>
)
}
BidTransformRecord.defaultProps = {}
export default BidTransformRecord
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment