BigC
/
FinancialReimbursementSystem_frontend
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

再等等

main
白封羽 2023-01-03 17:02:28 +08:00
parent eb0d64b251
commit 80f28e57a5
3 changed files with 76 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/reimbursement/mine/MyReimbursement.tsx
View File

@ -339,7 +339,7 @@ class Subpage extends React.Component<any, any> {
<> <>
<ReimbursementDetail reimbursement={this.state.detailedReimbursement} <ReimbursementDetail reimbursement={this.state.detailedReimbursement}
closeDetail={this.closeDetail} closeDetail={this.closeDetail}
accessLevel={0} accessLevel={1}
/> />
<ProTable<TableListItem> <ProTable<TableListItem>
actionRef={this.tableAction} actionRef={this.tableAction}

100
src/pages/reimbursement/mine/ReimbursementDetail.tsx
View File

@ -1,5 +1,5 @@
import React, {ReactNode} from "react"; import React, {ReactNode} from "react";
import {Button, Col, Descriptions, Modal, Popconfirm, Popover, Row, StepProps, Steps, Tag} from "antd"; import {Button, Checkbox, Col, Descriptions, Modal, Popconfirm, Popover, Row, StepProps, Steps, Tag} from "antd";
import TextArea from "antd/es/input/TextArea"; import TextArea from "antd/es/input/TextArea";
import {ApprovalProcess, Invoice, ReimbursementDetailModal} from "../../../models/ReimbursementDetailModal"; import {ApprovalProcess, Invoice, ReimbursementDetailModal} from "../../../models/ReimbursementDetailModal";
import dayjs, {Dayjs} from "dayjs"; import dayjs, {Dayjs} from "dayjs";
@ -76,7 +76,7 @@ function displayRawInfo(reimbursement: ReimbursementDetailModal | undefined | nu
</>) </>)
} }
function displaySteps(reimbursement: ReimbursementDetailModal | undefined | null) { function displaySteps(reimbursement: ReimbursementDetailModal | undefined | null, onApprove:boolean) {
if (reimbursement == undefined) if (reimbursement == undefined)
return null; return null;
let currentStep = 0; let currentStep = 0;
@ -84,86 +84,90 @@ function displaySteps(reimbursement: ReimbursementDetailModal | undefined | null
title: '提交申请', title: '提交申请',
status: 'finish', status: 'finish',
subTitle: reimbursement.reimbursementSubmitTime.replace("T", " "), subTitle: reimbursement.reimbursementSubmitTime.replace("T", " "),
description: reimbursement.reimbursementSubmitStaff.staffName + "提交申请", description: "【" + reimbursement.reimbursementSubmitStaff.staffName + "】" + "提交申请",
}]; }];
let approvalSteps = reimbursement.approvalProcesses; let approvalSteps = reimbursement.approvalProcesses;
if (approvalSteps == null) if (approvalSteps == null)
approvalSteps = [] approvalSteps = []
for (let i = 0; i < approvalSteps.length; i++) { for (let i = 0; i < approvalSteps.length; i++) {
if (approvalSteps[i].approvalResult === i) { if (approvalSteps[i].approvalResult === i) {
let description:string|ReactNode = approvalSteps[i].approvalStaff.staffName + "审批通过"; let description: string | ReactNode = approvalSteps[i].approvalStaff.staffName + "】" + "审批通过";
if (approvalSteps[i].approvalOpinion != null && approvalSteps[i].approvalOpinion !== ""){ if (approvalSteps[i].approvalOpinion != null && approvalSteps[i].approvalOpinion !== "") {
description=(<>{approvalSteps[i].approvalStaff.staffName + "审批通过"}<Popover content={approvalSteps[i].approvalOpinion}><ExclamationCircleOutlined style={{marginLeft: 5}}/></Popover></>) description = (<>{approvalSteps[i].approvalStaff.staffName + "】" + "审批通过"}<Popover
content={approvalSteps[i].approvalOpinion}><ExclamationCircleOutlined
style={{marginLeft: 5}}/></Popover></>)
} }
items.push({ items.push({
// @ts-ignore // @ts-ignore
title: statusEnum2[i - 1] + "审批", title: statusEnum2[i - 1] + "审批",
status: 'finish', status: 'finish',
subTitle: approvalSteps[i].approvalTime.replace("T", " "), subTitle: approvalSteps[i].approvalTime.replace("T", " "),
description:description description: description
}) })
} }
} }
if (reimbursement.reimbursementStatus >= 1 && reimbursement.reimbursementStatus <= 4) { if (reimbursement.reimbursementStatus >= 1 && reimbursement.reimbursementStatus <= 4) {
items.push({ items.push({
// @ts-ignore // @ts-ignore
title: statusEnum[reimbursement.reimbursementStatus].text, title: statusEnum2[approvalSteps.length] + "审批",
status: 'process', status: 'process',
subTitle: "审批中", subTitle: onApprove?"请您审批":"审批中",
description: "", description: "",
}) })
currentStep = items.length - 1; currentStep = items.length - 2;
} else if (reimbursement.reimbursementStatus === 0) { } else if (reimbursement.reimbursementStatus === 0) {
items.push({ items.push({
title: '通知出纳', title: '通知出纳',
status: 'finish', status: 'finish',
description: "出纳已收到申请", description: "报销申请成功",
}) })
currentStep = items.length - 1; currentStep = items.length - 1;
} else if (reimbursement.reimbursementStatus === 5) { } else if (reimbursement.reimbursementStatus === 5) {
for (let i = 0; i < approvalSteps.length; i++) { for (let i = 0; i < approvalSteps.length; i++) {
if (approvalSteps[i].approvalResult === 5) { if (approvalSteps[i].approvalResult === 5) {
let description:string|ReactNode = approvalSteps[i].approvalStaff.staffName + "驳回申请"; let description: string | ReactNode = "【" + approvalSteps[i].approvalStaff.staffName + "】" + "驳回申请";
if (approvalSteps[i].approvalOpinion != null && approvalSteps[i].approvalOpinion !== ""){ if (approvalSteps[i].approvalOpinion != null && approvalSteps[i].approvalOpinion !== "") {
description=(<>{approvalSteps[i].approvalStaff.staffName + "驳回申请"}<Popover content={approvalSteps[i].approvalOpinion}><ExclamationCircleOutlined style={{marginLeft: 5}}/></Popover></>) description = (<>{"【" + approvalSteps[i].approvalStaff.staffName + "】" + "驳回申请"}<Popover
content={approvalSteps[i].approvalOpinion}><ExclamationCircleOutlined style={{marginLeft: 5}}/></Popover></>)
} }
items.push({ items.push({
// @ts-ignore // @ts-ignore
title: statusEnum2[i - 1] + "审批", title: statusEnum2[i - 1] + "审批",
status: 'error', status: 'error',
subTitle: approvalSteps[i].approvalTime.replace("T", " "), subTitle: approvalSteps[i].approvalTime.replace("T", " "),
description:description description: description
}) })
} }
} }
currentStep = items.length - 1; currentStep = items.length - 1;
} else if (reimbursement.reimbursementStatus === 6) { } else if (reimbursement.reimbursementStatus === 6) {
items.push({ for (let i = 0; i < approvalSteps.length; i++) {
title: '申请人终止', if (approvalSteps[i].approvalResult === 6) {
status: 'error', items.push({
subTitle: reimbursement.reimbursementSubmitStaff.staffName + "终止申请", title: '申请终止',
}) status: 'error',
currentStep = items.length - 1; subTitle: approvalSteps[i].approvalTime.replace("T", " "),
let nextLevel: string = "主管" description: "【" + reimbursement.reimbursementSubmitStaff.staffName + "】" + "终止申请",
if (reimbursement.approvalProcesses !== null && reimbursement.approvalProcesses !== undefined) { })
// @ts-ignore currentStep = items.length - 1;
nextLevel = statusEnum2[reimbursement.approvalProcesses.length] }
} }
items.push({ items.push({
title: nextLevel + '审批', // @ts-ignore
title: statusEnum2[approvalSteps.length - 1] + '审批',
status: 'wait', status: 'wait',
subTitle: "", subTitle: "",
}) })
} }
console.log(items, currentStep)
return ( return (
<> <>
<Descriptions <Descriptions
title="流程进度" title="流程进度"
column={{xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1}}
> >
</Descriptions> </Descriptions>
<Steps <Steps
percent={50} percent={99}
current={currentStep} current={currentStep}
direction={"vertical"} direction={"vertical"}
items={items} items={items}
@ -258,6 +262,30 @@ class ReimbursementDetail extends React.Component<any, any> {
return <></> return <></>
} }
} }
checkerMenu = () => {
if (this.props.accessLevel === 1) {
return (<>
<TextArea autoSize={{minRows:2}} placeholder="审批意见" value={this.state.approvalOpinion} onChange={(e) => {
this.setState({
approvalOpinion: e.target.value,
})
}}/>
<Row>
<Col span={18}/>
<Col span={6}>
<Checkbox style={{whiteSpace:"nowrap"}} checked={this.state.approvalChecked} onChange={(e) => {
this.setState({
approvalChecked: e.target.checked,
})
}}>批准</Checkbox>
</Col>
</Row>
</>
)
} else {
return <></>
}
}
render() { render() {
return ( return (
@ -265,19 +293,25 @@ class ReimbursementDetail extends React.Component<any, any> {
title={<>报销单详情<Tag title={<>报销单详情<Tag
style={{marginLeft: 20}}>{"单号:"}{this.state.reimbursement?.reimbursementId}</Tag></>} style={{marginLeft: 20}}>{"单号:"}{this.state.reimbursement?.reimbursementId}</Tag></>}
onCancel={this.cancel} open={this.state.open} onCancel={this.cancel} open={this.state.open}
width={1000} width={900}
destroyOnClose={true} destroyOnClose={true}
footer={[ footer={[
this.getSubmitButton(), this.getSubmitButton(),
<Button key="next" type="default" onClick={this.cancel}> <Button key="next" type="default" onClick={this.cancel}>
关闭 关闭
</Button>]}> </Button>]}>
<Row gutter={18}> <Row gutter={40}>
<Col span={14}> <Col span={15}>
{displayRawInfo(this.state.reimbursement)} {displayRawInfo(this.state.reimbursement)}
</Col> </Col>
<Col span={10}> <Col span={9}>
{displaySteps(this.state.reimbursement)} {displaySteps(this.state.reimbursement,this.props.accessLevel===1)}
<Row style={{marginTop: 50}}>
<Col span={20}>
{this.checkerMenu()}
</Col>
<Col span={4}/>
</Row>
</Col> </Col>
</Row> </Row>
</Modal> </Modal>

8
src/pages/reimbursement/mine/component/tempComponent.tsx Normal file
View File

@ -0,0 +1,8 @@
import {Invoice} from "../../../../models/ReimbursementDetailModal";
import React from "react";
function displayInvoicesList(departureInvoice: Invoice, destinationInvoice: Invoice | null, otherInvoices: Invoice[]) {
return (<></>)
}