Commit 5a6302e6 authored by alwayOnlie's avatar alwayOnlie

请款

parent e8eae9c6
......@@ -187,7 +187,7 @@ const contracRoute = {
name: '请款单查询详情',
hideInMenu: true,
noMargin: true,
component: '@/pages/contract/funds/bill/details',
component: '@/pages/contract/funds/details',
},
{
path: '/memberCenter/contract/funds/addbill',
......
import React, { useEffect, useState, useRef } from 'react';
import { Anchor, Radio, Steps, Row, Col, Table, Drawer, Space, Typography, Button, Modal, Form, message, Input, } from 'antd';
import { Anchor, Radio, Steps, Row, Col, Upload, Table, Drawer, Space, Typography, Button, Modal, Form, message, Input, } from 'antd';
import style from './index.less';
import { ArrowLeftOutlined } from '@ant-design/icons';
import { ArrowLeftOutlined, UploadOutlined } from '@ant-design/icons';
import { StandardTable } from 'god';
import StatusTag from '@/components/StatusTag';
import { PublicApi } from '@/services/api';
......@@ -27,6 +27,7 @@ const Details = (props: any) => {
const [Drawervisible, setDrawervisible] = useState<boolean>(false)
/* 合同id */
const { location: { query: { contractId, type } } } = props;
console.log(type, 'type')
const ref = useRef({});
const [currLink, setCurrLink] = useState(activeAnchorClassName)
/**
......@@ -224,7 +225,7 @@ const Details = (props: any) => {
}
};
/* 下拉的子元素 */
const listItem = (record) => (
const listItem = (record, index) => (
<div className={style.listItem}>
<div className={style.label}>
<p>关联</p>
......@@ -302,17 +303,44 @@ const Details = (props: any) => {
]
const infoListcolumnsgetData = (params) => {
return new Promise((resolve, reject) => {
PublicApi.getContractExecutePageListForSummary({
...params,
contractId: contractId
}).then(res => {
console.log(res.data, listIndex)
resolve(res.data)
}).catch(err => {
console.log(err)
})
})
console.log('====================================');
console.log(params);
console.log('====================================');
// return new Promise((resolve, reject) => {
// PublicApi.getContractExecutePageListForSummary({
// ...params,
// contractId: contractId
// }).then(res => {
// console.log(res.data, listIndex)
// resolve(res.data)
// }).catch(err => {
// console.log(err)
// })
// })
}
const uploadProps = {
name: 'file',
action: '/api/file/file/upload/prefix',
data: {
fileType: 1,
prefix: '/procurment/tender/',
},
onChange(info) {
if (info.file.status !== 'uploading') {
}
if (info.file.status === 'done') {
} else if (info.file.status === 'error') {
message.error(`${info.file.name} 上传失败`);
}
},
beforeUpload(file) {
if (file.size / 1024 / 1024 > 20) {
message.warning('附件大小超过20M');
return Promise.reject();
}
},
}
/** 确定关联商品 */
const handleConfirm = (params: any) => {
......@@ -344,9 +372,9 @@ const Details = (props: any) => {
});
PublicApi.postContractCoordinationAssociatedOfferGoods(res_data).then(res => {
if (res.code === 1000) {
setTimeout(() => {
history.push('/memberCenter/contract/coordination/pageToBeSubmitExamine')
}, 2000);
// setTimeout(() => {
// history.push('/memberCenter/contract/coordination/pageToBeSubmitExamine')
// }, 2000);
}
}).finally(() => {
msg();
......@@ -381,6 +409,9 @@ const Details = (props: any) => {
case 'pageToBeExamineTwo':
fn = PublicApi.postContractCoordinationExamineStepTwo;
break;
case 'Sign':
fn = PublicApi.postContractCoordinationSign;
break;
default:
break;
}
......@@ -399,6 +430,9 @@ const Details = (props: any) => {
case 'pageToBeExamineTwo':
history.push('/memberCenter/contract/coordination/pageToBeExamineTwo')
break;
case 'Sign':
history.push('/memberCenter/contract/coordination/Sign')
break;
default:
break;
}
......@@ -454,11 +488,29 @@ const Details = (props: any) => {
</div>
</div>
{
type == 'submitExamine' || type == 'levelexamine' || type == 'pageToBeExamineTwo' &&
type === 'submitExamine' &&
<div className="btn" style={{ marginRight: "20px" }}>
<Button type="primary" onClick={() => submitExamine()}>审核</Button>
</div>
}
{
type === 'levelexamine' &&
<div className="btn" style={{ marginRight: "20px" }}>
<Button type="primary" onClick={() => submitExamine()}>审核</Button>
</div>
}
{
type === 'pageToBeExamineTwo' &&
<div className="btn" style={{ marginRight: "20px" }}>
<Button type="primary" onClick={() => submitExamine()}>审核</Button>
</div>
}
{
type === 'Sign' &&
<div className="btn" style={{ marginRight: "20px" }}>
<Button type="primary" onClick={() => submitExamine()}>签订合同</Button>
</div>
}
</Anchor>
<div id='content' className={style.card}>
{/* 流转进度 */}
......@@ -554,7 +606,7 @@ const Details = (props: any) => {
columns={columns}
rowKey='id'
expandable={{
expandedRowRender: record => listItem(record),
expandedRowRender: (record, index) => listItem(record, index),
onExpand: record => onExpand(record)
}}
dataSource={ListData}
......@@ -586,7 +638,7 @@ const Details = (props: any) => {
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div className={style.Price}>¥{item.payAmount}</div>
{
type == 'sign' && <div style={{ cursor: 'pointer', fontSize: 12, backgroundColor: '#F4F5F7', color: '#00B37A', padding: 5 }} onClick={() => setDrawervisible(true)}>查看详情</div>
type == 'implement' && <div style={{ cursor: 'pointer', fontSize: 12, backgroundColor: '#F4F5F7', color: '#00B37A', padding: 5 }} onClick={() => setDrawervisible(true)}>查看详情</div>
}
</div>
<div className={style.warp_List}>
......@@ -616,14 +668,14 @@ const Details = (props: any) => {
<div className='ant-card-head'>
<div className='ant-card-head-wrapper'>
<div className='ant-card-head-wrapper'>
电子合同
{contractText.isUseElectronicContract != 1 ? '纸质合同' : ' 电子合同'}
</div>
</div>
</div>
<div className='ant-card-body'>
<div className={style.upload_item} style={{ width: 680 }}>
<div className='ant-card-head-wrapper'>
电子合同
{contractText.isUseElectronicContract != 1 ? '纸质合同' : ' 电子合同'}
</div>
<div className={style.upload_left} style={{ width: 600 }}>
<FileWordFilled />
......@@ -666,9 +718,9 @@ const Details = (props: any) => {
onClose={() => setVisible(false)}
onClick={handleConfirm}
/>
{/* Sign */}
{/* 提交审核 */}
<Modal footer={null} title="提交审核" visible={Visible} onOk={() => setIsModalVisible(!Visible)} onCancel={() => setIsModalVisible(!Visible)}>
<Modal footer={null} title={type == 'Sign' ? '签订合同' : '提交审核'} visible={Visible} onOk={() => setIsModalVisible(!Visible)} onCancel={() => setIsModalVisible(!Visible)}>
<Form
name="basic"
form={form}
......@@ -676,6 +728,21 @@ const Details = (props: any) => {
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
{
type == 'Sign' &&
<div>
<p style={{ paddingTop: 10, paddingBottom: 10, }}>纸质合同(乙方已盖章签字)</p>
<Row style={{ marginBottom: 30, }}>
<Col>
<Upload
{...uploadProps}
>
<Button icon={<UploadOutlined />}>上传附件</Button>
</Upload>
</Col>
</Row>
</div>
}
<Form.Item name="isPass" label="" rules={[{ required: true, message: '请选择作废日期' }]} initialValue={isPass} >
<Radio.Group onChange={handleIsAllMemberChange}>
<Radio value={1}>通过</Radio>
......@@ -756,7 +823,7 @@ const Details = (props: any) => {
</div>
</div>
<div className={style.infoTitle}>付款明细</div>
<div className={style.infoTitle} style={{ marginTop: 20, }}>付款明细</div>
<StandardTable
tableProps={{
rowKey: 'id',
......
......@@ -28,7 +28,7 @@ const Sign = () => {
render: (text, record) =>
<div>
<EyePreview
url={`/memberCenter/contract/coordination/implement/details?contractId=${record.id}&type=sign`}
url={`/memberCenter/contract/coordination/implement/details?contractId=${record.id}&type=implement`}
>
{text}
</EyePreview>
......
......@@ -105,8 +105,7 @@ const Sign = () => {
render: (text, record) => {
return (
<div>
<span style={{ color: '#00B37A', cursor: 'pointer', marginRight: 10 }} onClick={() => submitExamine(record.id)}>签订合同</span>
<span style={{ color: '#00B37A', cursor: 'pointer' }} onClick={() => history.push(`/memberCenter/contract/coordination/pageToBeSubmitExamine/details?contractId=${record.id}&type=submitExamine`)}>查看</span>
<span style={{ color: '#00B37A', cursor: 'pointer' }} onClick={() => history.push(`/memberCenter/contract/coordination/pageToBeSubmitExamine/details?contractId=${record.id}&type=Sign`)}>签订合同</span>
</div>
)
}
......
import React, { useRef } from 'react'
import React, { useState, useRef, ReactNode } from 'react'
import { history, Link } from 'umi';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Card } from 'antd';
import { Anchor, Radio, Steps, Row, Col, Input, message, Modal, Card } from 'antd';
import statuStyle from '../../common/colorTag'
import { ColumnType } from 'antd/lib/table/interface';
import { StandardTable } from 'god';
import EyePreview from '@/components/EyePreview'
import { FORM_FILTER_PATH } from '@/formSchema/const'
import { ApplySchema } from '../schema'
import StatusTag from '@/components/StatusTag';
import { SchemaBli } from '../schema';
import EyePreview from '@/components/EyePreview';
import { PublicApi } from '@/services/api'
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch'
import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect';
import { FORM_FILTER_PATH } from '@/formSchema/const'
import Submit from '@/components/NiceForm/components/Submit'
import SearchSelect from '@/components/NiceForm/components/SearchSelect'
import DateRangePickerUnix from '@/components/NiceForm/components/DateRangePickerUnix'
import { PublicApi } from '@/services/api';
import moment from 'moment';
const bill = () => {
const { TextArea } = Input;
const Bill: React.FC<{}> = () => {
const ref = useRef<any>({});
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
const [selectRow, setSelectRow] = useState<any[]>([]) // 模态框选择的行数据
const [id, setId] = useState('');
const [isModalVisible, setIsModalVisible] = useState(false);
const today = moment(); // 当天日期
const [isAllMember, setIsAllMember] = useState(true)
const [reason, setDatareason] = useState('')
;
//表头
const columns: ColumnType<any>[] = [{
title: '请款单号/摘要',
dataIndex: 'applyNo',
align: 'center',
render: (text, record) =>
<div>
<EyePreview
url={`/memberCenter/contract/funds/bill/details?id=${record.id}`}
>
{text}
</EyePreview>
<p>{record.applyAbstract}</p>
</div>
render: (text: any, record: any) => {
return (
<div>
<EyePreview
type="button"
>
{text}
</EyePreview>
<p>{record.applyAbstract}</p>
</div>
);
},
}, {
title: '单据时间',
dataIndex: 'orderTime',
align: 'center',
dataIndex: 'orderTime',
}, {
title: '收款方',
dataIndex: 'payeeMemberName',
align: 'center',
dataIndex: 'payeeMemberName',
},
{
title: '合同编号',
dataIndex: 'contractNo',
align: 'center',
defaultSortOrder: 'descend',
sorter: (a, b) => a.age - b.age,
dataIndex: 'contractNo',
render: (text: any, record: any) => <EyePreview
type="button"
>
{text}
</EyePreview>
},
{
title: '合同总金额',
dataIndex: 'contractAmount',
align: 'center',
dataIndex: 'contractAmount',
render: (text: any, record: any) =>
<span>{text}</span>
},
{
title: '请款金额',
dataIndex: 'applyAmount',
align: 'center',
render: (text: any, record: any) =>
<span>{text}</span>
},
{
title: '内部状态',
dataIndex: 'statusName',
align: 'center',
render: (text) => {
render: (text: any, record: any) => {
let component: ReactNode = null
component = (
<>
<span style={statuStyle.success}>已完成签约</span>
</>
)
return component
}
}, {
title: '操作',
dataIndex: 'action',
align: 'center',
render: (text: any, record: any) => {
// 作废:待付款、已付款、待提交审核状态的不能作废
return (
<span style={statuStyle.success}>{text}</span>
<>
{
record.status != 9 || record.status != 7 || record.status != 8 || record.status != 1 && <span style={{ color: '#00B37A', marginRight: 20, cursor: 'pointer', }} onClick={() => invalid(record.id)}>作废</span>
}
<span style={{ color: '#00B37A', marginRight: 20, cursor: 'pointer', }} onClick={() => history.push(`/memberCenter/contract/funds/bill/details?applyId=${record.id}`)}>查看</span>
</>
)
}
}]
// 列表数据
const handleIsAllMemberChange = (v: any) => {
setIsAllMember(v.target.value)
}
const invalid = (id) => {
setId(id)
setIsModalVisible(!isModalVisible)
}
// 模拟请求
const fetchData = (params?: any) => {
console.log(params)//可以直接打印参数
params.status = params.status ? params.status : 0;
params.startTime = params.startTime ? moment().format('YYYY-MM-DD') : '';
params.endTime = params.endTime ? moment().format('YYYY-MM-DD') : '';
return new Promise((resolve, reject) => {
PublicApi.getContractApplyAmountPageList({
...params,
status: params.status || 0,
}).then(res => {
resolve(res.data)
}).catch(err => {
reject(err)
})
})
}
const fetchOptions = (service) => {
return async function () {
const res = await service();
if (res.code === 1000) {
return res.data.map((item) => { return { label: item.name, value: item.status } })
}
return [];
}
}
const rowSelection: any = {
selectedRowKeys: selectedRowKeys,
onChange: (selectedRowKeys: any, selectedRows: any) => {
setSelectedRowKeys(selectedRowKeys)
setSelectRow(selectedRows)
}
};
/* 作废 */
const oninvalid = () => {
let res_data: any = {
applyId: id,
reason,
}
if (isAllMember) {
const msg = message.loading({
content: '正在操作',
duration: 0,
});
PublicApi.postContractApplyAmountInvalid(res_data).then(res => {
if (res.code === 1000) {
handleCancel()
ref.current.reload();
}
}).finally(() => {
msg();
})
} else {
handleCancel()
}
}
const setreason = (e) => {
setDatareason(e.target.value);
}
const handleCancel = () => {
setIsModalVisible(!isModalVisible);
};
return (
<PageHeaderWrapper>
<Card>
......@@ -93,11 +189,12 @@ const bill = () => {
}}
columns={columns}
currentRef={ref}
rowSelection={rowSelection}
fetchTableData={(params: any) => fetchData(params)}
formilyProps={{
ctx: {
inline: false,
schema: ApplySchema,
schema: SchemaBli,
effects: ($, actions) => {
useStateFilterSearchLinkageEffect(
$,
......@@ -105,17 +202,31 @@ const bill = () => {
'applyNo',
FORM_FILTER_PATH,
);
useAsyncSelect(
"status",
fetchOptions(PublicApi.getContractApplyAmountGetStatusList)
)
},
components: {
DateRangePickerUnix,
Submit
Submit,
SearchSelect
}
}
}}
/>
</Card>
<Modal title="单据作废" visible={isModalVisible} onCancel={handleCancel} onOk={oninvalid}>
<Radio.Group onChange={handleIsAllMemberChange} defaultValue={isAllMember} value={isAllMember}>
<Radio value={true}>作废</Radio>
<Radio value={false}>不作废</Radio>
</Radio.Group>
<p style={{ padding: 10, margin: 0 }}>单据作废原因 <span style={{ color: 'red' }}>*</span></p>
<TextArea placeholder="在此输入你的原因,最多60个汉字" maxLength={120} onChange={(e) => setreason(e)} />
</Modal>
</PageHeaderWrapper>
)
}
export default bill
export default Bill
......@@ -10,6 +10,7 @@ import statuStyle from '../../common/colorTag'
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch'
import Submit from '@/components/NiceForm/components/Submit'
import { FORM_FILTER_PATH } from '@/formSchema/const'
import { PublicApi } from '@/services/api';
import DateRangePickerUnix from '@/components/NiceForm/components/DateRangePickerUnix'
const { Link } = Anchor;
......@@ -21,6 +22,7 @@ const BillDetails = (props: any) => {
const ref = useRef({});
const [currLink, setCurrLink] = useState(activeAnchorClassName)
const [isAllMember, setIsAllMember] = useState(true)
const { location: { query: { applyId } } } = props
const [tabPane] = useState([
{ id: 'progress', title: '流转进度' },
{ id: 'process', title: '基本流程' },
......@@ -29,6 +31,7 @@ const BillDetails = (props: any) => {
])
const [targetOffset, setTargetOffset] = useState<number | undefined>(undefined);
const [Visible, setIsModalVisible] = useState<boolean>(false)
const [StepList, setStepList] = useState<any>([]);
useEffect(() => {
setTargetOffset(window.innerHeight / 6);
}, []);
......@@ -43,23 +46,65 @@ const BillDetails = (props: any) => {
}
};
/** 基本信息 */
const basicInfo = {
col1: [
{ label: '合同编号:', extra: 'SPTY12' },
{ label: '合同摘要:', extra: '待提交采购需求单' },
{ label: '外部状态:', extra: '待审核采购需求单(一级)' },
{ label: '内部状态:', extra: '2020-12-25 09:00' },
],
col2: [
{ label: '寻源类型:', extra: '进口头层黄牛皮荔枝纹' },
{ label: '对应单据:', extra: '协议采购' },
{ label: '授标会员:', extra: '非密封补价' },
{ label: '授标金额', extra: '温州龙昌手袋有限公司' },
],
col3: [
{ label: '合同有效期:', extra: '2020-08-25 至 2020-10-25' },
],
const [basicInfo, setbasicInfo] = useState<any>({
col1: [],
col2: [],
col3: []
})
/* 获取详情的数据 */
const getDetail = () => {
PublicApi.getContractApplyAmountGetDetail({ applyId }).then(res => {
if (res.code === 1000) {
let { basics, taskStepList } = res.data
let payWay = [
"",
"现结",
"账期",
"月结",
]
const basicInfo = {
col1: [
{ label: '请款单号:', extra: basics.applyNo ? basics.applyNo : '' },
{ label: '请款摘要:', extra: basics.applyAbstract ? basics.applyAbstract : '' },
{ label: '内部状态:', extra: basics.statusName ? basics.statusName : '' },
{ label: '发票编号:', extra: basics.innerStatusName ? basics.innerStatusName : '' },
{ label: '开票日期:', extra: basics.orderTime ? basics.orderTime : '' },
{ label: '单据时间:', extra: basics.orderTime ? basics.orderTime : '' },
],
col2: [
{ label: '合同编号:', extra: basics.contractNo ? basics.contractNo : '' },
{ label: '收款方:', extra: basics.payeeMemberName ? basics.payeeMemberName : '' },
{ label: '收款账户:', extra: basics.payeeName ? basics.payeeName : '' },
{ label: '银行账号:', extra: basics.bankAccount ? basics.bankAccount : '' },
{ label: '开户行:', extra: basics.bankDeposit ? basics.bankDeposit : '' },
{ label: '请款备注:', extra: basics.remark ? basics.remark : '' },
],
col3: [
{ label: '合同付款阶段:', extra: basics.payStage ? basics.payStage : '' },
{ label: '合同付款比例:', extra: basics.payRatio ? `${basics.payRatio}%` : '' },
{ label: '请款金额:', extra: basics.payRatio ? `¥${basics.payRatio}` : '' },
{ label: '预计付款时间:', extra: basics.expectPayTime ? basics.expectPayTime : '' },
{ label: '付款方式:', extra: `${payWay[basics.payWay]}:${basics.payParam}${basics.payWay == 3 ? '月' : basics.payWay == 2 ? '天' : ''}` },
{ label: '支付方式:', extra: basics.moneyPayWay == 2 ? '线下支付' : '' },
],
}
setbasicInfo(basicInfo)
setStepList(taskStepList);
}
})
}
useEffect(() => {
setTargetOffset(window.innerHeight / 6);
getDetail()
let data = {
current: 1,
pageSize: 10
}
// fetchListData(data)
}, []);
const isTitle = (title, Price) => {
return (
<div className="a">
......@@ -72,55 +117,55 @@ const BillDetails = (props: any) => {
/* 请款明细 */
const columns: ColumnType<any>[] = [{
title: '单据号/摘要',
dataIndex: 'No',
dataIndex: 'orderNO',
align: 'center',
render: (text, record) =>
<div>
<EyePreview
url={`/memberCenter/contract/funds/bill/details?id=${record.id}`}
type="button"
>
{text}
</EyePreview>
<p>{record.name}</p>
<p>{record.orderAbstract}</p>
</div>
}, {
title: '单据类型',
dataIndex: 'number',
dataIndex: 'orderTypeName',
align: 'center',
}, {
title: '单据状态',
dataIndex: 'memberName',
dataIndex: 'orderTypeName',
align: 'center',
},
{
title: '单据时间',
dataIndex: 'time',
dataIndex: 'orderTime',
align: 'center',
defaultSortOrder: 'descend',
},
{
title: isTitle('单据金额', '188999'),
dataIndex: 'Price',
dataIndex: 'orderAmount',
align: 'center',
},
{
title: '含税/税率',
dataIndex: 'Price',
dataIndex: 'isHasTaxName',
align: 'center',
},
{
title: isTitle('已付款', '188999'),
dataIndex: 'Price',
dataIndex: 'payAmount',
align: 'center',
},
{
title: isTitle('已请款待付款', '188999'),
dataIndex: 'Price',
dataIndex: 'unPayApplyAmount',
align: 'center',
},
{
title: isTitle('请款金额', '18000'),
dataIndex: 'Price',
dataIndex: 'applyAmount',
align: 'center',
}]
......@@ -165,53 +210,17 @@ const BillDetails = (props: any) => {
align: 'center',
},
// {
// title: '外部状态',
// dataIndex: 'state',
// align: 'center',
// render: (record) => {
// return (
// <span style={statuStyle.success}>已完成签约</span>
// )
// }
// }
]
// 列表数据
const fetchData = (params?: any) => {
console.log(params)//可以直接打印参数
return new Promise((resolve, reject) => {
let data = {
totalCount: 1,
data: [
{
id: '1',
No: 'ZPTY12',
name: '进口头层黄牛皮荔枝纹',
number: 'ZPTY12',
memberName: '温州龙昌手袋有限公司',
time: '2020-12-25 09:00',
Price: '¥50,000.00',
status: 1,
insidestatus: 1,
addText: '创建采购招标合同',
state: '',
},
{
id: '2',
No: 'ZPTY12',
name: '进口头层黄牛皮荔枝纹',
number: 'ZPTY12',
memberName: '温州龙昌手袋有限公司',
time: '2020-12-25 09:00',
Price: '¥50,000.00',
status: 1,
insidestatus: 1,
addText: '创建采购招标合同',
state: '',
}
]
}
resolve(data)
PublicApi.getContractApplyAmountPageDetailList({
applyId,
...params
}).then(res => {
resolve(res.data)
})
})
}
......@@ -279,10 +288,16 @@ const BillDetails = (props: any) => {
</div>
</div>
<div className='ant-card-body'>
<Steps current={1} progressDot>
<Step title="Finished" description="This is a description" />
<Step title="In Process" description="This is a description" />
<Step title="Waiting" description="This is a description" />
<Steps progressDot>
{
StepList.map((item: any) => (
<Step
title={item.taskName}
description={item.roleName}
status={item.isExecute ? 'finish' : 'wait'}
/>
))
}
</Steps>
</div>
</div>
......
This diff is collapsed.
import React, { useRef, useState, useEffect, useImperativeHandle, forwardRef } from 'react';
import { Button, Card, Tabs, Table, Input, Select, DatePicker, Popconfirm, Form, Checkbox, Drawer, Typography, Modal, InputNumber } from 'antd'
import {
SaveOutlined,
LinkOutlined,
FileWordFilled,
PlusOutlined
} from '@ant-design/icons'
import { StandardTable } from 'god';
import { useRowSelectionTable } from '@/hooks/useRowSelectionTable';
import styles from '../index.less'
import { goodcolumns } from '../Table'
import { PublicApi } from '@/services/api';
const { Option } = Select;
const { Text } = Typography;
const FormList = (props: any, ref: any) => {
/* 显示模态框 */
const [isModalVisible, setIsModalVisible] = useState(false);
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
const [selectRow, setSelectRow] = useState<any[]>([]) // 模态框选择的行数据
const [data, setData] = useState([])
const columnsTab: any = [
{
title: '物料编号/名称', dataIndex: 'name', align: 'center',
render: (text, item) =>
<div>
<p>{item.code}</p>
<p>{text}</p>
</div>
},
{ title: '规格型号', dataIndex: 'type', align: 'center', },
{
title: '品类', dataIndex: 'customerCategory', align: 'center',
render: (text, item) =>
<p>{item.customerCategory.name ? item.customerCategory.name : ''}</p>
},
{
title: '品牌', dataIndex: 'brand', align: 'center',
render: (text, item) =>
<p>{item.brand ? item.brand.name : ''}</p>
},
{ title: '单位', dataIndex: 'unitName', align: 'center', },
{
title: '采购数量',
dataIndex: 'purchaseCount',
key: 'purchaseCount',
align: 'center',
render: (_, record, index) => <Input
style={{
width: 120,
}}
placeholder=""
onChange={(e) => setInput(e, 'purchaseCount', index)}
/>
},
{
title: '含税', dataIndex: 'isHasTax', align: 'center',
render: (text, record, index) =>
<Form.Item
name={`isHasTax${index}`}
initialValue={text}
rules={[{ required: true, message: '请选择' }]}
>
<Select
style={{ width: 80 }}
onChange={(e) => setInput(e, 'isHasTax', index)}
>
<Option value="0" key={0}></Option>
<Option value="1" key={1}></Option>
</Select>
</Form.Item>
},
{
title: '税率', dataIndex: 'taxRate', align: 'center',
render: (text: any, record: any, index: number) =>
<Form.Item
name={`taxRate${index}`}
initialValue={text}
rules={[{ required: true, message: '请输入' }]}
>
<Input
style={{
width: 120,
}}
onChange={(e) => setInput(e, 'taxRate', index)}
addonAfter="%"
/>
</Form.Item>
},
{
title: '单价(含税)', dataIndex: 'price', align: 'center',
render: (text: any, record: any, index: number) =>
<Form.Item
name={`price${index}`}
initialValue={text}
rules={[{ required: true, message: '请输入' }]}
>
<Input
style={{
width: 120,
}}
onChange={(e) => setInput(e, 'price', index)}
addonBefore="¥"
/>
</Form.Item>
},
{
title: '授标数量', dataIndex: 'bidCount', align: 'center',
render: (_, text, index) =>
<Form.Item
name={`bidCount${index}`}
rules={[{ required: true, message: '请输入' }]}
>
<Input
style={{
width: 120,
}}
onChange={(e) => setInput(e, 'bidCount', index)}
addonBefore="¥"
/>
</Form.Item>
},
{
title: '金额(含税)',
dataIndex: 'bidAmount',
key: 'bidAmount',
align: 'center',
render: (text: any, record: any) => <Text>{record.bidCount && record.price ? Number(record.bidCount) * Number(record.price) : ''}</Text>
},
{
title: '操作',
dataIndex: 'del',
align: 'center',
key: 'del',
render: (_, record, index) =>
<Popconfirm title="确定要删除吗?" onConfirm={() => handleDelete(record.id)}>
<a>删除</a>
</Popconfirm>
},
];
const setInput = (e, name, idx) => {
let item = [...data];
switch (name) {
case 'isHasTax':
item[idx].isHasTax = Number(e)
break;
case 'taxRate':
item[idx].taxRate = e.target.value;
break;
case 'price':
item[idx].price = e.target.value;
break;
case 'bidCount':
item[idx].bidCount = e.target.value;
break;
case 'purchaseCount':
item[idx].purchaseCount = e.target.value;
break;
}
setData(item)
}
const showModal = () => {
setIsModalVisible(true);
};
const rowSelectionGood: any = {
selectedRowKeys: selectedRowKeys,
onChange: (selectedRowKeys: any, selectedRows: any) => {
setSelectedRowKeys(selectedRowKeys)
setSelectRow(selectedRows)
}
};
/* 确定 */
const handleOk = () => {
console.log(selectRow);
let dataArr = [];
selectRow.map((item: any) => {
dataArr.push(item);
})
setData(dataArr)
setIsModalVisible(false);
};
/* 获取商品 */
const getGoodsList = (params) => {
return new Promise(resolve => {
PublicApi.getProductGoodsGetGoodsList(params).then(res => {
console.log(res);
resolve(res.data)
})
})
}
/* 删除 */
const handleDelete = (id) => {
const dataSource = [...data];
const RowKeys = [...selectedRowKeys]
let List = dataSource.filter((item) => item.id !== id);
const RowKeysList = RowKeys.filter(item => item !== id);
setData(List)
setSelectedRowKeys(RowKeysList)
};
const handleCancel = () => {
setIsModalVisible(false);
};
/* 下拉的子元素 */
const listItem = (record) => (
<div className={styles.listItem}>
<div className={styles.label}>
<p>关联</p>
<p>报价商品</p>
</div>
<div className={styles.text}>
<p>商品ID:{record.customerCategory.id}</p>
<p>商品名称:{record.name}</p>
</div>
<div className={styles.text}>
<p>规格:{record.type}</p>
<p>品类:{record.customerCategory.name}</p>
</div>
<div className={styles.text}>
<p>品牌:{record.brand ? record.brand.name : ''}</p>
</div>
</div>
)
return (
<div className={styles.box}>
<div style={{ paddingTop: 12, paddingBottom: 12, }} onClick={showModal}>
<Button block type='dashed'><PlusOutlined />选择采购物料</Button>
</div>
<Table
rowKey="id"
columns={columnsTab}
expandable={{
expandedRowRender: record => listItem(record),
}}
dataSource={data}
style={{
width: "100%"
}}
/>
{/* 模态框 */}
<Modal title="选择采购物料" width={900} visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
<StandardTable
tableProps={{
rowKey: 'id',
}}
columns={goodcolumns}
currentRef={ref}
rowSelection={rowSelectionGood}
fetchTableData={(params: any) => getGoodsList(params)}
/>
</Modal>
</div>
)
}
export default forwardRef(FormList)
......@@ -33,6 +33,7 @@ const Information = (props: any, ref: any) => {
const [FromData, setFromData] = useState<any>({})
const [startTime, setstartTime] = useState('');
const [endTime, setendTime] = useState('');
const [falg, setfalg] = useState<boolean>(false);
/* 显示弹出 */
const Choose = (sourceType?) => {
if (sourceType) {
......@@ -85,7 +86,11 @@ const Information = (props: any, ref: any) => {
/* 确认选中 */
const Confirm = () => {
if (FromData.sourceType == '4') {
setfalg(!falg)
FromData.partyBName = RowCtl.selectRow[0].name;
FromData.partyBMemberId = RowCtl.selectRow[0].memberId;
// setmemberInfo(RowCtl.selectRow[0]);
attrValueForm.setFieldsValue(FromData);
} else {
let totalAmount, sourceId, partyBName, partyBMemberId, sourceNo;
switch (fromData.sourceType) {
......@@ -237,7 +242,7 @@ const Information = (props: any, ref: any) => {
wrapperCol={{ span: 8 }}
>
{
FromData.sourceNo ?
FromData.sourceNo || falg ?
<Input placeholder='最长60个字符,30个汉字' disabled />
:
<Search placeholder="最长60个字符,30个汉字" readOnly enterButton={<div onClick={() => Choose(fromData.sourceType == '4' ? '1' : fromData.sourceType)} ><LinkOutlined /> 选择</div>} />
......@@ -252,7 +257,7 @@ const Information = (props: any, ref: any) => {
wrapperCol={{ span: 8 }}
>
{
FromData.partyBName ?
FromData.partyBName && !falg ?
<Input placeholder='最长60个字符,30个汉字' disabled />
:
<Search placeholder="最长60个字符,30个汉字" readOnly enterButton={<div onClick={() => Choose('4')} ><LinkOutlined /> 选择</div>} />
......
......@@ -2,6 +2,7 @@ import React, { useState, useRef, useEffect } from 'react'
import { Button, Card, Tabs, Form } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import Information from './components/information'
import FormList from './components/FormList'
import {
......@@ -32,18 +33,23 @@ const Add: React.FC<{}> = (props) => {
*/
const TabList = [
{ name: '基本信息', components: <Information ref={childRef} fromData={fromData ? fromData : ''} /> },
// { name: '采购物料', components: FormList() },
{ name: '采购物料', components: <FormList ref={childRef} /> },
// { name: '付款计划', components: table() },
// { name: '合同文本', components: FromDom() },
]
/* 提交*/
const submit = () => {
const data = childRef.current.FormData()
console.log('====================================');
console.log(data);
console.log('====================================');
let basicsVO = {
let basicsVO = {
// id: contractId ? contractId : 0,
// contractNo: data.contractNo ? data.contractNo : '',
// sourceType: data.sourceType ? data.sourceType : '',
// startTime: data.startTime ? data.startTime : '',
// endTime: data.endTime ? data.endTime : '',
// // sourceId: data.sourceId ? data.
// sourceId: sourceId ? sourceId : '',
// partyBMemberId: partyBMemberId ? partyBMemberId : '',
}
console.log(basicsVO)
......
......@@ -176,6 +176,7 @@ const Examine = () => {
const fetchData = (params?: any) => {
console.log(params)//可以直接打印参数
return new Promise((resolve, reject) => {
// /contract/manage / submitExamine
PublicApi.getContractManagePageToBeSubmitExamine({
...params,
}).then(res => {
......
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