Commit ea6636fb authored by alwayOnlie's avatar alwayOnlie

修改bug

parent a11e152f
......@@ -15,6 +15,9 @@ export interface Iprops extends IAntdSchemaFormProps {
payPlanList: any,
basics: any,
contractId: any,
children?: React.ReactNode,
title?: string,
}
......@@ -23,8 +26,9 @@ const PaymentCard: React.FC<Iprops> = ({
payPlanList,
basics,
contractId,
children,
title
}) => {
console.log(IsShow, '1111111111111')
/* 非手工单进入请款 */
const like = (sourceType, item) => {
sessionStorage.setItem('basics', JSON.stringify(basics));
......@@ -35,7 +39,7 @@ const PaymentCard: React.FC<Iprops> = ({
<div className='ant-card-head'>
<div className='ant-card-head-wrapper'>
<div className='ant-card-head-wrapper'>
付款计划
{title ? title : '付款计划'}
</div>
</div>
</div>
......@@ -50,8 +54,9 @@ const PaymentCard: React.FC<Iprops> = ({
<div className={style.proportion}>{item.payRatio}%</div>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div className={style.Price}>¥{item.payAmount}</div>
{/* IsShow && <div onClick={() => like(1, item)} style={{ cursor: 'pointer', fontSize: 12, backgroundColor: '#00B37A', color: '#fff', padding: '4px 8px' }}>请款</div> */}
{
!IsShow && <div onClick={() => like(1, item)} style={{ cursor: 'pointer', fontSize: 12, backgroundColor: '#00B37A', color: '#fff', padding: '4px 8px' }}>请款</div>
children
}
</div>
<div className={style.warp_List}>
......
/* 查看付款明细弹出 */
import React, { useRef, useState } from 'react';
import {
Button,
Drawer,
Space,
Typography,
Table,
} from 'antd';
import { IAntdSchemaFormProps } from '@formily/antd'
import { StandardTable } from 'god';
import style from '../index.less'
import { ColumnType } from 'antd/lib/table/interface';
import EyePreview from '@/components/EyePreview';
export interface Iprops extends IAntdSchemaFormProps {
popupshow: any,
basicInfo?: any,
setDrawerModal: Function
}
const { Text } = Typography;
const PopupDrawer: React.FC<Iprops> = ({
popupshow,
basicInfo,
setDrawerModal
}) => {
console.log(popupshow)
const ref = useRef<any>({});
const columns: ColumnType<any>[] = [{
title: '单据号/摘要',
dataIndex: 'applyNo',
align: 'left',
render: (text: any, record: any) => {
return (
<div>
<EyePreview
url={`/memberCenter/contract/funds/levelpayment/details?applyId=${record.id}&type=PageToBeExamineOne`}
>
{text}
</EyePreview>
<p>{record.applyAbstract}</p>
</div>
);
},
}, {
title: '单据类型',
dataIndex: 'orderTime',
align: 'left',
}, {
title: '单据时间',
dataIndex: 'payeeMemberName',
align: 'left',
},
{
title: '单据状态',
dataIndex: 'payeeMemberName',
align: 'left',
},
{
dataIndex: 'contractNo',
title: (
<Space direction='vertical'>
<Text>单据金额</Text>
<Text>合计: ¥9999</Text>
</Space>
),
},
{
title: '含税/税率',
dataIndex: 'payeeMemberName',
align: 'left'
},
{
dataIndex: 'contractNo',
align: 'left',
title: (
<Space direction='vertical'>
<Text>付款金额</Text>
<Text>合计: ¥9999</Text>
</Space>
),
},
]
// 模拟请求
const fetchData = (params?: any) => {
console.log(params)//可以直接打印参数
return new Promise((resolve, reject) => {
// PublicApi.getContractApplyAmountPageToBeExamineOne({
// ...params,
// }).then(res => {
resolve([])
// })
})
}
return (
<Drawer
visible={popupshow}
onClose={() => setDrawerModal()}
title="合同付款详情"
width={900}
footer={
<div
style={{
textAlign: 'right',
}}
>
<Button onClick={() => setDrawerModal()} style={{ marginRight: 8 }}>
取消
</Button>
<Button type="primary" onClick={() => setDrawerModal()} >
确定
</Button>
</div>
}
destroyOnClose
>
<div className={style.PopupTitle}>基本信息</div>
<div className={style.menu}>
<div className={style.memuItem}>
<div className={style.menuCard}>
<div className={style.menulabel}>收款账户:</div>
<div className={style.card}>广州白马皮具交易中心</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>银行账号:</div>
<div className={style.card}>622202 110868 11424 45</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>开户行:</div>
<div className={style.card}>中国建设银行广州市分行营业部</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>付款阶段:</div>
<div className={style.card}>合同中期款</div>
</div>
</div>
<div className={style.memuItem}>
<div className={style.menuCard}>
<div className={style.menulabel}>付款金额:</div>
<div className={style.card}>¥ 36.000.00</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>付款时间:</div>
<div className={style.card}>2020-08-25 08:58</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>付款方式:</div>
<div className={style.card}>账期:30天</div>
</div>
</div>
<div className={style.memuItem}>
<div className={style.menuCard}>
<div className={style.menulabel}>支付方式:</div>
<div className={style.card}>线下支付方式:线下支付线上确认</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>发票编号:</div>
<div className={style.card}>40122826</div>
</div>
<div className={style.menuCard}>
<div className={style.menulabel}>开票日期:</div>
<div className={style.card}>2020-08-25</div>
</div>
</div>
</div>
<div className={style.PopupTitle}>付款明细</div>
<Table
rowKey="id"
style={{
width: "100%"
}}
pagination={false}
columns={columns}
// fetchTableData={(params: any) => fetchData(params)}
/>
</Drawer>
)
}
PopupDrawer.defaultProps = {
popupshow: false,
basicInfo: {},
}
export default PopupDrawer;
......@@ -189,3 +189,47 @@
font-weight: 400;
color: #303133;
}
/**付款明细弹出样式*/
.PopupTitle {
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #909399;
position: relative;
}
.PopupTitle::before {
content: '';
position: absolute;
background-color: #00B37A;
width: 4px;
height: 17px;
left: -8px;
}
.menu {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
.menu .memuItem .menuCard {
display: flex;
align-items: center;
height: 30px;
}
.menu .memuItem .menuCard .menulabel {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #909399;
}
.menu .memuItem .menuCard .card {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #303133;
}
.nowrap {
width: 400px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
......@@ -217,3 +217,51 @@
}
}
}
/**付款明细弹出样式*/
.PopupTitle{
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #909399;
position: relative;
}
.PopupTitle::before{
content: '';
position: absolute;
background-color: #00B37A;
width: 4px;
height: 17px;
left: -8px;
}
.menu{
display: flex;
justify-content: space-between;
margin-bottom: 20px;
.memuItem{
.menuCard{
display: flex;
align-items: center;
height: 30px;
.menulabel{
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #909399;
}
.card{
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #303133;
}
}
}
}
.nowrap{
width: 400px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
......@@ -14,13 +14,12 @@ import CirculationList from './circulationList'
import DetailedList from './detailedList'
import SituationList from './situationList'
import { Download } from '../../constants/utils'
import PopupDrawer from './components/Popup'
import {
FileWordFilled
} from '@ant-design/icons'
const { Link } = Anchor;
const activeAnchorClassName = 'ant-anchor-link-active'
const Details = (props: any) => {
const [form] = Form.useForm();
const [Visible, setIsModalVisible] = useState<boolean>(false)
......@@ -49,20 +48,17 @@ const Details = (props: any) => {
* @param payPlanList 付款计划
* @param contractText 合同文档
*/
const [outerTaskStepList, setouterTaskStepList] = useState<any>([])
const [innerTaskStepList, setinnerTaskStepList] = useState<any>([])
const [ListData, setListData] = useState<any>([])
const [payPlanList, setpayPlanList] = useState<any>([])
const [contractText, setcontractText] = useState<any>([])
const [signatureLogId, setsignatureLogId] = useState<any>('') // 签署地址id
const [state, setstate] = useState<any>(false);
const [targetOffset, setTargetOffset] = useState<number | undefined>(undefined);
const [contractAbstract, setcontractAbstract] = useState('');
const [tabPane, settabPane] = useState([])
const [Popup, setPopup] = useState<any>(false);
/* 获取详情的数据 */
const getDetail = () => {
PublicApi.getContractCoordinationGetDetail({ contractId }).then(res => {
......@@ -121,26 +117,27 @@ const Details = (props: any) => {
tab.push(
{ id: 'process', title: '基本流程' },
{ id: 'docking', title: '执行情况' },
{ id: 'conditions', title: '付款计划' },
{ id: 'record', title: '请款统计' },
{ id: 'conditions', title: '付款统计' },
)
} else {
// { id: 'conditions', title: '付款计划' },
tab.push(
{ id: 'progress', title: '流转进度' },
{ id: 'process', title: '基本流程' },
{ id: 'materials', title: '采购材料' },
{ id: 'conditions', title: '付款计划' },
{ id: 'docking', title: '电子合同' },
{ id: 'record', title: '流转记录' },
)
}
console.log(type, '1231', tab)
settabPane(tab)
setTargetOffset(window.innerHeight / tab.length);
getDetail()
}, []);
/* 查看付款明细回调 */
const setDrawerModal = () => {
console.log(131312);
setPopup(!Popup)
}
const handleAnchorClick = (e) => {
e.preventDefault()
}
......@@ -321,7 +318,7 @@ const Details = (props: any) => {
</div>
{
type &&
type != 'implement' &&
<div className="btn" style={{ marginRight: "20px" }}>
<Button type="primary" onClick={() => submitExamine()}>{type === 'Sign' ? '签订合同' : '审核'}</Button>
</div>
......@@ -342,8 +339,24 @@ const Details = (props: any) => {
}
{/* 付款计划 */}
{
type != 'implement' &&
<PaymentCard IsShow={true} payPlanList={payPlanList} basics={basicInfo} contractId={contractId} />
type == 'implement' &&
<PaymentCard
children={
<span style={{
color: '#00B37A',
background: '#F4F5F7',
display: 'inline-block',
padding: '5px',
borderRadius: 5,
cursor: 'pointer'
}}
onClick={setDrawerModal}
>查看详情</span>}
title="付款统计"
payPlanList={payPlanList}
basics={basicInfo}
contractId={contractId}
/>
}
{/* 交易条件 */}
{
......@@ -371,10 +384,9 @@ const Details = (props: any) => {
}
{/* 流转记录 */}
{
type != 'implement' ? <CirculationList contractId={contractId} /> : <DetailedList contractId={contractId} />
type != 'implement' ? <CirculationList contractId={contractId} /> : null
// <DetailedList contractId={contractId} />
}
{/* 请款统计 */}
</div>
{/* 提交审核 */}
<Modal footer={null} title={type == 'Sign' ? '签订合同' : '提交审核'} visible={Visible} onOk={() => setIsModalVisible(!Visible)} onCancel={() => setIsModalVisible(!Visible)}>
......@@ -418,6 +430,9 @@ const Details = (props: any) => {
</div>
</Form>
</Modal>
{/* 查看付款计划明细弹出组建 */}
{/* Popup */}
<PopupDrawer popupshow={Popup} basicInfo={basicInfo} setDrawerModal={setDrawerModal} />
</div>
)
}
......
......@@ -87,7 +87,7 @@ const purchaseList: React.FC<Iprops> = ({
</div>
<div className={style.text}>
<p>商品编号:{record.associatedMaterielNo}</p>
<p>商品名称:{record.associatedGoods}</p>
<p className={style.nowrap}>商品名称:{record.associatedGoods}</p>
</div>
<div className={style.text}>
<p>规格型号:{record.associatedType}</p>
......@@ -206,7 +206,7 @@ const purchaseList: React.FC<Iprops> = ({
<div className='ant-card-head-wrapper'>
<div className='ant-card-head-wrapper'>
采购材料
</div>
</div>
</div>
</div>
<div className='ant-card-body' >
......
......@@ -195,9 +195,10 @@ const situationList: React.FC<Iprops> = ({ contractId }) => {
startTime: "",
endTime: "",
current: current,
pageSize: size,
pageSize: pageSize,
}
console.log(data)
setSize(pageSize)
console.log(data, pageSize, current)
getContracInfoList(data)
};
return (
......@@ -206,7 +207,7 @@ const situationList: React.FC<Iprops> = ({ contractId }) => {
<div className='ant-card-head-wrapper' style={{ display: 'flex', justifyContent: 'space-between' }}>
<div className='ant-card-head-wrapper'>
执行情况
</div>
</div>
<div className={style.wrapper}>
<Input.Search
style={{ width: 240 }}
......@@ -227,6 +228,7 @@ const situationList: React.FC<Iprops> = ({ contractId }) => {
loading={listLoading}
pagination={
{
pageSize: size,
total,
onChange: handlePaginationChange
......
......@@ -69,7 +69,7 @@ const pageToBeSubmitExamine = () => {
{
title: '对应单据/寻源类型',
dataIndex: 'sourceNo',
align: 'center',
align: 'left',
render: (text, record) =>
<div>
{
......
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 React, { useState, useEffect, forwardRef } from 'react';
import { Button, Table, Input, Select, DatePicker, InputNumber } from 'antd'
import {
PlusOutlined
} from '@ant-design/icons'
import styles from '../index.less'
const { TextArea, Search } = Input
const { TextArea } = Input
const { Option } = Select;
import moment from 'moment';
const FormList = (props: any) => {
console.log(props)
const { fromData, currentRef, fetchdata } = props;
const [payNumArr, setpayNumArr] = useState<any>([1,])
const [options, setoptions] = useState<any>([
{
value: 1,
disabled: true
}
])
const [id, setId] = useState<any>(''); // 记录上次的id
const [PlanList, setPlanList] = useState<any>([
{
payNum: '1',
......@@ -22,21 +29,15 @@ const FormList = (props: any) => {
payWay: '1',
payParam: '',
id: 0,
rowId: 1,
},
]);
/* 显示模态框 */
const tabcolumns: any = [
{
title: '付款次数', dataIndex: 'payNum', align: 'center',
render: (_, item, index) => {
const options = [];
for (let i = 0; i < PlanList.length; i++) {
let Index = payNumArr.indexOf(i + 1);
options.push({
value: i + 1,
disabled: Index == -1 ? false : true
});
}
return (
<Select
style={{ width: 200 }}
......@@ -125,6 +126,7 @@ const FormList = (props: any) => {
render: (_, item, index) => <a onClick={() => Delete(item, index)}>删除</a>,
},
];
/* 添加 */
const addtable = () => {
const data = [...PlanList];
......@@ -138,35 +140,48 @@ const FormList = (props: any) => {
payWay: '1',
payParam: '',
id: 0,
rowId: data.length + 1,
},
)
console.log(data)
let optionsData = [];
data.map((item, index) => {
console.log(item.payNum, index + 1)
optionsData.push({
value: index + 1,
disabled: item.payNum ? true : false,
})
})
console.log(optionsData, 'optionsDataadd', options)
setPlanList(data)
setoptions(optionsData)
};
/* 删除 */
const Delete = (elm, idx) => {
const dataSource = [...PlanList];
const arr = [...payNumArr]
let List = dataSource.filter((item, index) => index !== idx);
let numberArr = arr.filter((item, index) => elm.payNum !== item);
console.log(numberArr);
setpayNumArr(numberArr)
setPlanList(List)
let optionsData = options.map((keys => {
if (elm.payNum == keys.value) {
keys.disabled = false;
}
return {
...keys
}
}))
console.log(optionsData, 'del')
setoptions(optionsData)
};
/* 选中设置值 */
const onSelectChange = (e, name, idx) => {
let item = [...PlanList];
let NumArr = [...payNumArr]
console.log(e, name, idx, item);
// return;
switch (name) {
case 'payWay':
item[idx].payWay = e;
break;
case 'payNum':
item[idx].payNum = e;
NumArr.push(e);
setId(e);
break;
case 'expectPayTime':
item[idx].expectPayTime = moment(e).format('YYYY-MM-DD HH:mm:ss');
......@@ -184,8 +199,30 @@ const FormList = (props: any) => {
item[idx].payParam = e;
break;
}
NumArr = Array.from(new Set(NumArr))
setpayNumArr(NumArr)
let optionsData = [];
if (id) {
optionsData = options.map((keys => {
if (id == keys.value) {
keys.disabled = false;
}
if (keys.value == e) {
keys.disabled = true;
}
return {
...keys
}
}))
} else {
optionsData = options.map((keys => {
if (keys.value == e) {
keys.disabled = true;
}
return {
...keys
}
}))
}
setoptions(optionsData)
setPlanList(item)
}
useEffect(() => {
......@@ -209,7 +246,7 @@ const FormList = (props: any) => {
<Table
columns={tabcolumns}
dataSource={PlanList}
rowKey="id"
rowKey="rowId"
style={{
width: "100%"
}}
......
......@@ -161,3 +161,9 @@
margin-left: 19px;
color: #c0c4cc;
}
.nowrap {
width: 400px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
......@@ -182,3 +182,9 @@
.nowrap{
width: 400px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
......@@ -284,7 +284,7 @@ const Details = (props: any) => {
</div>
<div className={style.text}>
<p>商品编号:{record.associatedMaterielNo}</p>
<p>商品名称:{record.associatedMaterielName}</p>
<p className={style.nowrap}>商品名称:{record.associatedGoods}</p>
</div>
<div className={style.text}>
<p>规格型号:{record.associatedType}</p>
......
......@@ -163,9 +163,9 @@ const FormList = (props: any) => {
associatedGoods: item.associatedGoods ? item.associatedGoods : '',
associatedDataId: item.associatedDataId ? item.associatedDataId : '',
associatedMaterielNo: item.associatedMaterielNo ? item.associatedMaterielNo : '',
associatedType: item.type ? item.type : '',
associatedCategory: item.customerCategory != null ? item.customerCategory.name : '',
associatedBrand: item.brand != null ? item.brand.name : '',
associatedType: item.associatedType ? item.associatedType : '',
associatedCategory: item.associatedCategory ? item.associatedCategory : '',
associatedBrand: item.associatedBrand ? item.associatedBrand : '',
})
})
resolve({
......
......@@ -129,6 +129,7 @@ const FormList = (props: any) => {
payWay: '1',
payParam: '1',
id: 0,
rowId: data.length + 1,
},
)
console.log(data)
......@@ -147,9 +148,10 @@ const FormList = (props: any) => {
/* 选中设置值 */
const onSelectChange = (e, name, idx) => {
console.log(e, name, idx)
let item = [...PlanList];
let NumArr = [...payNumArr]
console.log(e, name, idx, item);
console.log(item, '哈哈');
// return;
switch (name) {
case 'payWay':
......@@ -204,7 +206,7 @@ const FormList = (props: any) => {
<Table
columns={tabcolumns}
dataSource={PlanList}
rowKey="id"
rowKey="rowId"
style={{
width: "100%"
}}
......
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