Skip to content

J
jinfa-platform
Commit c7244582 authored by 卢均锐's avatar 卢均锐
Browse files
Options

feat:采购竞价&在线竞价增加静态页面，分离组件

parent ba047d1f
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 475 additions and 22 deletions
config/routes/procurementRoute/onlineBid.ts
View file @ c7244582
......@@ -22,12 +22,27 @@ export const onlineBidRoute = [
name: '待竞价报名',
component: '@/pages/transaction/purchaseAbility/onlineBid/readySignUp'
},
// 竞价报名
{
path: '/memberCenter/procurementAbility/onlineBid/readySignUp/signUp',
name: '竞价报名',
component: '@/pages/transaction/purchaseAbility/onlineBid/readySignUp/signUp',
hideInMenu: true,
},
// 待竞价
{
path: '/memberCenter/procurementAbility/onlineBid/readyBid',
name: '待竞价',
component: '@/pages/transaction/purchaseAbility/onlineBid/readyBid'
},
// 待竞价详情
{
path: '/memberCenter/procurementAbility/onlineBid/readyBid/detail',
name: '待竞价详情',
component: '@/pages/transaction/purchaseAbility/onlineBid/readyBid/detail',
hideInMenu: true,
noMargin: true,
},
]
},
]
src/pages/transaction/purchaseAbility/components/detail/components/bidCommonLayout/index.less
View file @ c7244582
......@@ -17,4 +17,19 @@
color: #303133;
}
}
}
.baseItem{
display: flex;
font-size: 12px;
margin-bottom: 16px;
.label{
width: 104px;
color: #909399;
margin: 0;
}
.content{
flex: 1;
margin: 0;
}
}
\ No newline at end of file
src/pages/transaction/purchaseAbility/components/detail/components/bidCommonLayout/index.tsx
View file @ c7244582
......@@ -7,7 +7,6 @@ import { PublicApi } from '@/services/api';
import Card from '../../../card';
import { Context } from '../context';
import style from '../basicLayout/index.less';
import selfStyles from './index.less';
import MsgItem from './msgItem';
......@@ -34,13 +33,13 @@ const BidCommonLayout: React.FC<BidCommonLayoutProps> = (props: any) => {
const _returnChild = (child, key) => {
if (child.type === 'text') {
return (
<div className={style.cell} key={key}>
<h5 className={style.label}>
<div className={selfStyles.baseItem} key={key}>
<h5 className={selfStyles.label}>
{child.tips ? <Tooltip placement="top" title={child.tips}>
{child.label}<QuestionCircleOutlined style={ICON_STYLE} />
</Tooltip> : `${child.label}: `}
</h5>
<h5 className={style.content}>{child.extra}</h5>
<h5 className={selfStyles.content}>{child.extra}</h5>
</div>
)
}else if(child.type === 'pie'){
......@@ -82,13 +81,13 @@ const BidCommonLayout: React.FC<BidCommonLayoutProps> = (props: any) => {
))}
<Col span={24}>
<Divider dashed style={{ color: '#EBECF0' }} />
<div className={style.cell}>
<h5 className={style.label}>授标意见: </h5>
<h5 className={style.content}>最低价中标</h5>
<div className={selfStyles.baseItem}>
<h5 className={selfStyles.label}>授标意见: </h5>
<h5 className={selfStyles.content}>最低价中标</h5>
</div>
<div className={style.cell}>
<h5 className={style.label}>附件: </h5>
<h5 className={style.content}></h5>
<div className={selfStyles.baseItem}>
<h5 className={selfStyles.label}>附件: </h5>
<h5 className={selfStyles.content}></h5>
</div>
</Col>
</Row>
......
src/pages/transaction/purchaseAbility/components/detail/components/bidDetailLayout/btnItem/index.less
View file @ c7244582
......@@ -80,12 +80,6 @@
flex: 1;
color: #303133;
}
div {
color: #E63F3B;
background-color: #FFEBE6;
padding: 0 2px;
}
}
}
}
......
src/pages/transaction/purchaseAbility/components/detail/components/bidDetailLayout/btnItem/index.tsx
View file @ c7244582
......@@ -2,6 +2,7 @@ import React, { useContext, useEffect, useState } from 'react';
import { Row, Col, Table, Button } from 'antd';
import { CaretDownOutlined } from '@ant-design/icons'
import TrendTag from '../../trendTag';
import styles from './index.less';
interface BtnItemProps {
......@@ -41,10 +42,7 @@ const BtnItem: React.FC<BtnItemProps> = (props: any) => {
</div>
<div className={styles.time}>
<span>10:43:56</span>
<div>
<CaretDownOutlined style={{color: '#E63F3B',fontSize: '10px',marginRight: '10px'}} />
24.5%
</div>
<TrendTag />
</div>
</div>
</div>
......
src/pages/transaction/purchaseAbility/components/detail/components/quotationDeskLayout/index.tsx
View file @ c7244582
......@@ -156,8 +156,8 @@ const QuotationDesk: React.FC<QuotationDeskProps> = (props: any) => {
// line={{ style: { stroke: "#ff0000" } }}
tickLine={{ style: { lineWidth: 1 }, length: 5 }}
/>
<Line position="year*value" color="type" />
<Point position="year*value" color="type" />
<Line position="year*value" color={['type',['#5B8FF9','#00B37A']]} />
<Point position="year*value" color={['type',['#5B8FF9','#00B37A']]} shape='circle' />
<Tooltip shared showCrosshairs />
</Chart>
</Card>
......
src/pages/transaction/purchaseAbility/components/detail/components/trendTag/index.less 0 → 100644
View file @ c7244582
.trendTag {
color: #E63F3B;
background-color: #FFEBE6;
padding: 0 2px;
}
src/pages/transaction/purchaseAbility/components/detail/components/trendTag/index.tsx 0 → 100644
View file @ c7244582
import React from 'react'
import { CaretDownOutlined } from '@ant-design/icons'
import styles from './index.less';
const TrendTag = () => {
return (
<div className={styles.trendTag}>
<CaretDownOutlined style={{ color: '#E63F3B', fontSize: '10px', marginRight: '2px' }} />
24.5%
</div>
)
}
export default TrendTag
\ No newline at end of file
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/history/index.less 0 → 100644
View file @ c7244582
.history {
border-radius: 8px;
overflow: hidden;
.historyHeader {
height: 209px;
background: -webkit-linear-gradient(top, rgba(91,143,249, 1), #FFFFFF);
padding: 16px;
h5 {
font-size: 14px;
color: #FFFFFF;
margin-bottom: 24px;
}
}
.box{
color: #909399;
font-size: 12px;
text-align: center;
position: relative;
background-color: #fff;
border-radius: 8px;
padding: 16px 0;
.icon{
width: 24px;
position: absolute;
left: 16px;
top: 16px;
}
.rightPosition{
position: absolute;
right: 16px;
top: 20px;
}
p{
margin: 0;
}
.currentPrice{
color: #303133;
font-size: 24px;
margin: 6px 0 12px 0;
span{
font-size: 12px;
margin-right: 8px;
}
}
.row{
display: flex;
flex-direction: row;
justify-content: center;
.col{
flex: 1;
span{
color: #303133;
}
}
}
}
.historyFootter{
background-color: #FFFFFF;
padding: 16px;
h5{
font-size: 14px;
color: #303133;
margin-bottom: 16px;
}
}
}
\ No newline at end of file
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/history/index.tsx 0 → 100644
View file @ c7244582
import React, { useEffect, useState } from 'react';
import { Row, Col, Tabs, Button } from 'antd';
import level1 from '@/assets/icons/the_first.png';
import TrendTag from '../../../../components/detail/components/trendTag';
import styles from './index.less';
import OfferItem from '../offer';
const HistoryItem = () => {
return (
<div className={styles.history}>
<div className={styles.historyHeader}>
<h5>报价历史</h5>
<div className={styles.box}>
<img src={level1} alt="第一名" className={styles.icon}/>
<div className={styles.rightPosition}>
<TrendTag />
</div>
<p>本次报价金额</p>
<p className={styles.currentPrice}><span>¥</span>900.00</p>
<div className={styles.row}>
<div className={styles.col} style={{borderRight: '1px solid #EBECF0'}}>当前最低价：<span>¥ 900.00</span></div>
<div className={styles.col}>报价次数：<span>5</span></div>
</div>
</div>
</div>
<div className={styles.historyFootter}>
<h5>最近报价</h5>
<OfferItem />
<OfferItem />
<OfferItem />
</div>
</div>
)
}
export default HistoryItem;
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/index.less 0 → 100644
View file @ c7244582
.warp {
.header {
display: flex;
height: 48px;
line-height: 48px;
font-size: 16px;
background-color: #FFFFFF;
color: #303133;
padding: 0 16px;
align-items: center;
span{
color: #909399;
font-size: 14px;
margin: 0 10px 0 24px;
}
&::before {
content: " ";
width: 2px;
height: 16px;
background: @primary-color;
margin-right: 6px;
}
}
.layout {
margin: 24px;
}
:global {
.ant-card-head-wrapper{
padding: 12px 0;
.ant-card-head-wrapper{
padding: 0;
}
}
}
}
\ No newline at end of file
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/index.tsx 0 → 100644
View file @ c7244582
import React, { useEffect, useState } from 'react';
import { Row, Col, Tooltip, Button } from 'antd';
import HistoryItem from './history';
import StatusBox from '../../../purchaseBid/readyBid/management/components/statusBox';
import QuotationDeskLayout from '../../../components/detail/components/quotationDeskLayout';
import BidDetailLayout from '../../../components/detail/components/bidDetailLayout';
import IMBtn from '../../../components/detail/components/iMBtn';
import styles from './index.less';
const Detail = () => {
return (
<div className={styles.warp}>
<div className={styles.header}>进口头层黄牛皮荔枝纹竞价<span>温州龙昌手袋有限公司</span><IMBtn /></div>
<div className={styles.layout}>
<Row gutter={[8,8]}>
<Col span={6}>
<HistoryItem />
</Col>
<Col span={12}>
<QuotationDeskLayout />
</Col>
<Col>
<StatusBox />
</Col>
</Row>
<Row>
<BidDetailLayout />
</Row>
</div>
</div>
)
}
export default Detail;
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/offer/index.less 0 → 100644
View file @ c7244582
.offerItem{
display: flex;
flex-direction: row;
font-size: 12px;
color: #909399;
align-items: center;
margin-bottom: 10px;
.left{
width: 19px;
background-color: #F7F8FA;
padding: 2px;
margin-right: 8px;
text-align: center;
}
.right{
flex: 1;
.row{
display: flex;
flex-direction: row;
margin-bottom: 2px;
.rowPrice{
flex: 1;
span{
font-size: 14px;
color: #303133;
}
}
.rowTime{
color: #303133;
flex: 1;
}
}
}
}
\ No newline at end of file
src/pages/transaction/purchaseAbility/onlineBid/readyBid/detail/offer/index.tsx 0 → 100644
View file @ c7244582
import React, { useEffect, useState } from 'react';
import TrendTag from '../../../../components/detail/components/trendTag';
import styles from './index.less';
const OfferItem = () => {
return (
<div className={styles.offerItem}>
<div className={styles.left}>第2名</div>
<div className={styles.right}>
<div className={styles.row}>
<div className={styles.rowPrice}>
<span>¥ 900.00</span>
当前最低价：¥1,000.00
</div>
第2次
</div>
<div className={styles.row}>
<div className={styles.rowTime}>
10:43:56
</div>
<TrendTag />
</div>
</div>
</div>
)
}
export default OfferItem
\ No newline at end of file
src/pages/transaction/purchaseAbility/onlineBid/readySignUp/signUp.tsx 0 → 100644
View file @ c7244582
import React, { useState, useRef, useEffect } from 'react';
import { history } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Tabs, Card, Button, Badge,message } from 'antd';
import { createFormActions } from '@formily/antd'
import { SaveOutlined } from '@ant-design/icons'
import { ArrayTable } from '@formily/antd-components'
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect'
import { PublicApi } from '@/services/api'
import { usePageStatus, PageStatus } from '@/hooks/usePageStatus'
import NiceForm from '@/components/NiceForm'
import ReutrnEle from '@/components/ReturnEle';
import Basic from './components/basic';
import Requirement from './components/requirement';
import File from './components/file';
import { formSchema } from './schema'
// 页面表单全部提交
const addSchemaAction = createFormActions()
const { TabPane } = Tabs;
const TabFormErrors = (props) => {
return (
<Badge size="small" count={props.dot} offset={[6, -5]}>
{props.children}
</Badge>
)
}
const SignUpForm = () => {
const { number } = history.location.query;
const { memberId, memberRoleId, name } = JSON.parse(localStorage.getItem('auth'));
/** 基本信息 */
const [basic, setBasic] = useState<any>({});
/** 添加采购物料 */
const [material, setMaterial] = useState<any>({});
/** 竞价规则 */
const [rules, setRules] = useState<any>({});
/** 报名需求 */
const [requirement, setRequirement] = useState<any>({});
/** 交易条件 */
const [condition, setCondition] = useState<any>({});
/** 需求对接 */
const [demand, setDemand] = useState<any>({});
/** 附件 */
const [file, setfile] = useState<any>([]);
const [badge, setbadge] = useState<any>([0, 0, 0, 0, 0, 0]);
const [loading, setLoading] = useState<boolean>(false);
const {
id,
preview,
pageStatus
} = usePageStatus()
const [formLoading, setFormLoading] = useState(false)
const [btnLoading, setBtnLoading] = useState(false)
const [initFormValue, setInitFormValue] = useState<any>({})
/** 拿表单数据的 */
const currentBasic = useRef<any>({});
const currentRules = useRef<any>({});
const currentRequirement = useRef<any>({});
const currentMaterial = useRef<any>({});
const currentCondition = useRef<any>({});
const currentDemand = useRef<any>({});
const currentFile = useRef<any>({});
/**必填没填写出现角标 */
const getError = (num: number, idx: number) => {
const data = [...badge];
data[idx] = num;
setbadge(data);
if (num !== 0) {
setLoading(false);
}
}
const getCountryCodeId = async () => {
const res = await PublicApi.getManageCountryAreaGetTelCode()
if(res.code === 1000) {
return { phoneCode: res.data }
}
return {}
}
const formDataTransformParams = (param) => {
let params: any = {...param}
params['provinceName'] = params.tenderAddress[0].province
params['cityName'] = params.tenderAddress[0].city
params['provinceCode'] = params.tenderAddress[0].provinceCode
params['cityCode'] = params.tenderAddress[0].cityCode
params['regionCode'] = params.tenderAddress[0].areaCode
params['regionName'] = params.tenderAddress[0].area
return params
}
const handleSubmit = async (value) => {
const result = formDataTransformParams(value)
PublicApi.postPurchaseSubmitTenderSubmitTenderRegister(result).then(res => {
if(res.code === 1000) {
history.goBack()
}
})
}
const beforeUpload = file => {
if (file.size / 1024 / 1024 > 20) {
message.warning('附件大小超过20M');
return Promise.reject();
}
}
return (
<PageHeaderWrapper
onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回" />}
extra={
<Button loading={loading} type="primary" onClick={() => addSchemaAction.submit()} loading={btnLoading} icon={<SaveOutlined />}> 保存</Button>
}
>
<Card>
<NiceForm
loading={formLoading}
previewPlaceholder=' '
editable={pageStatus !== PageStatus.PREVIEW}
value={initFormValue}
actions={addSchemaAction}
schema={formSchema}
onSubmit={handleSubmit}
components={{
ArrayTable
}}
effects={($, ctx) => {
$('onFormMount').subscribe(() => {
})
useAsyncInitSelect(
['phoneCode'],
getCountryCodeId,
);
}}
expressionScope={{
beforeUpload,
}}
/>
</Card>
</PageHeaderWrapper>
)
}
export default SignUpForm
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