还在报销
白封羽
parent
3fb745a430
commit
a54402dffb
|
|
@ -70,17 +70,17 @@ const statusEnum = {
|
|||
|
||||
class Subpage extends React.Component<any, any> {
|
||||
tableAction = React.createRef<ActionType>();
|
||||
|
||||
departments=new Map<number,string>()
|
||||
constructor(props: {}) {
|
||||
super(props);
|
||||
this.state = {
|
||||
searchWord: "",
|
||||
onCreated: false,
|
||||
|
||||
}
|
||||
this.pullDepartment()
|
||||
}
|
||||
|
||||
department = new Map<number, string>()
|
||||
createRef = React.createRef<ReimbursementCreate>();
|
||||
columns: ProColumns<TableListItem>[] = [
|
||||
{
|
||||
|
|
@ -145,7 +145,7 @@ class Subpage extends React.Component<any, any> {
|
|||
width: 80,
|
||||
search: false,
|
||||
dataIndex: 'departmentId',
|
||||
valueEnum: this.department,
|
||||
valueEnum: this.departments,
|
||||
filters: true,
|
||||
onFilter: false,
|
||||
//render: (_) => <a>{_}</a>,
|
||||
|
|
@ -224,12 +224,13 @@ class Subpage extends React.Component<any, any> {
|
|||
}
|
||||
|
||||
pullDepartment() {
|
||||
this.department.clear()
|
||||
axiosInstance.get('common/department').then(response => {
|
||||
this.departments.clear()
|
||||
response.data.forEach((value: any) => {
|
||||
this.department.set(value.departmentId, value.departmentName)
|
||||
this.departments.set(value.departmentId, value.departmentName)
|
||||
}
|
||||
)
|
||||
console.log(this.departments)
|
||||
this.tableAction.current?.reload()
|
||||
})
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import React, {ReactNode} from "react";
|
||||
import React, {Key, ReactNode} from "react";
|
||||
import {ReimbursementApplication} from "../../../models/Reimbursement";
|
||||
import {Button, Col, Form, Input, InputNumber, Modal, Popover, Row, Select} from "antd";
|
||||
import {Button, Card, Col, Form, Input, InputNumber, Modal, Popover, Radio, Row, Select} from "antd";
|
||||
import {FormInstance} from "antd/es/form";
|
||||
import {Invoice} from "../../../models/Reimbursement";
|
||||
import axiosInstance from "../../../utils/axiosInstance";
|
||||
|
|
@ -11,13 +11,81 @@ import {Dropdown, message, Space, Tooltip} from 'antd';
|
|||
import {store} from "../../../models/store";
|
||||
import {FieldData} from "rc-field-form/lib/interface";
|
||||
|
||||
function InvoiceCard(props: { invoice: Invoice }) {
|
||||
const invoice = props.invoice;
|
||||
return (
|
||||
<Card
|
||||
style={{width: 300}}
|
||||
cover={
|
||||
<img
|
||||
alt="example"
|
||||
src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
|
||||
/>
|
||||
}
|
||||
>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
|
||||
class InvoiceRadioCard extends React.Component<any, any> {
|
||||
constructor(props: {
|
||||
invoice: any;
|
||||
hidden: boolean;
|
||||
selected: boolean;
|
||||
index: number;
|
||||
click: any;
|
||||
}) {
|
||||
super(props);
|
||||
this.state = {
|
||||
invoice: props.invoice,
|
||||
hidden: props.hidden,
|
||||
selected: props.selected,
|
||||
index: props.index,
|
||||
click: props.click
|
||||
}
|
||||
}
|
||||
|
||||
static getDerivedStateFromProps(props: {
|
||||
invoice: any;
|
||||
hidden: boolean;
|
||||
selected: boolean;
|
||||
index: number;
|
||||
click: any;
|
||||
}) {
|
||||
return {
|
||||
invoice: props.invoice,
|
||||
hidden: props.hidden,
|
||||
selected: props.selected,
|
||||
index: props.index,
|
||||
click: props.click
|
||||
}
|
||||
}
|
||||
|
||||
select(e: any) {
|
||||
if (this.state.selected)
|
||||
return
|
||||
this.setState({selected: true})
|
||||
this.props.click(this.props.index, true)
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Card hidden={this.state.hidden}
|
||||
cover={<img alt="example" src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"/>}
|
||||
actions={[<Radio checked={this.state.selected} onClick={(e) => {
|
||||
this.select(e)
|
||||
}} defaultChecked={this.state.selected}/>]}>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class SingleInvoiceSelector extends React.Component<any, any> {
|
||||
value: any
|
||||
onChange: any
|
||||
|
||||
constructor(props: {
|
||||
invoices: Invoice[];
|
||||
pickerOpen: boolean;
|
||||
pickerTitle: string;
|
||||
value: any;
|
||||
|
|
@ -27,9 +95,10 @@ class SingleInvoiceSelector extends React.Component<any, any> {
|
|||
this.value = props.value
|
||||
this.onChange = props.onChange
|
||||
this.state = {
|
||||
selectedIndex: -1,
|
||||
selectedInvoice: {},
|
||||
singleLimit: true,
|
||||
invoices: props.invoices,
|
||||
invoices: [{invoiceId:1},{invoiceId:2},{invoiceId:3}],
|
||||
pickerOpen: props.pickerOpen,
|
||||
pickerTitle: props.pickerTitle
|
||||
}
|
||||
|
|
@ -40,21 +109,55 @@ class SingleInvoiceSelector extends React.Component<any, any> {
|
|||
if (this.state.selectedInvoice.invoiceId === null || this.state.selectedInvoice.invoiceId === undefined) {
|
||||
return (<>请选择一张{this.state.pickerTitle}</>)
|
||||
}
|
||||
return (<>
|
||||
|
||||
|
||||
</>)
|
||||
return (<InvoiceCard invoice={this.state.selectedInvoice}/>)
|
||||
}
|
||||
pickerOpen = (value: boolean) => {
|
||||
this.setState({pickerOpen: value})
|
||||
}
|
||||
confirm = () => {
|
||||
//TODO
|
||||
this.onChange(this.state.selectedInvoice.invoiceId)
|
||||
this.setState({pickerOpen: false})
|
||||
}
|
||||
cancelSelect = () => {
|
||||
this.setState({selectedInvoices: []})
|
||||
this.onChange({})
|
||||
this.setState({selectedIndex: -1, selectedInvoice: {}})
|
||||
}
|
||||
|
||||
click = (index: number, status: boolean) => {
|
||||
if (status) {
|
||||
this.setState({selectedIndex: index, selectedInvoice: this.state.invoices[index]})
|
||||
this.onChange({invoice: this.state.invoices[index]})
|
||||
}
|
||||
}
|
||||
|
||||
cardList = () => {
|
||||
let cards = []
|
||||
for (let i = 0; i < this.state.invoices.length; i += 2) {
|
||||
if (i + 1 >= this.state.invoices.length) {
|
||||
cards.push(
|
||||
<Row gutter={18}>
|
||||
<Col span={12}>
|
||||
<InvoiceRadioCard invoice={this.state.invoices[i]} selected={this.state.selectedIndex === i}
|
||||
hidden={false} index={i} click={this.click}/>
|
||||
</Col>
|
||||
</Row>)
|
||||
} else {
|
||||
cards.push(
|
||||
<Row gutter={18}>
|
||||
<Col span={12}>
|
||||
<InvoiceRadioCard invoice={this.state.invoices[i]} selected={this.state.selectedIndex === i}
|
||||
hidden={false} index={i} click={this.click}/>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<InvoiceRadioCard invoice={this.state.invoices[i + 1]}
|
||||
selected={this.state.selectedIndex === i + 1}
|
||||
hidden={false} index={i + 1} click={this.click}/>
|
||||
</Col>
|
||||
</Row>)
|
||||
}
|
||||
}
|
||||
return (
|
||||
<>{cards}</>
|
||||
)
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
@ -74,11 +177,16 @@ class SingleInvoiceSelector extends React.Component<any, any> {
|
|||
onCancel={() => this.pickerOpen(false)}
|
||||
destroyOnClose={true}
|
||||
footer={[
|
||||
<Button key="clear" type="primary" onClick={this.cancelSelect}>
|
||||
清除
|
||||
</Button>,
|
||||
<Button key="confirm" type="primary" onClick={this.confirm}>
|
||||
确定
|
||||
</Button>
|
||||
]}
|
||||
>
|
||||
|
||||
{this.cardList()}
|
||||
</Modal>
|
||||
</>)
|
||||
}
|
||||
|
|
@ -141,14 +249,6 @@ class ReimbursementCreate extends React.Component<any, any> {
|
|||
})
|
||||
}
|
||||
|
||||
findInvoiceById = (id: number):null|Invoice => {
|
||||
//return this.state.invoices[0]
|
||||
this.state.invoices.map((item:Invoice)=>{
|
||||
if(item.invoiceId === id)
|
||||
return item
|
||||
})
|
||||
return null
|
||||
}
|
||||
handleMenuClick: MenuProps['onClick'] = (e) => {
|
||||
this.setState({
|
||||
selectedDepartment: {
|
||||
|
|
@ -173,23 +273,17 @@ class ReimbursementCreate extends React.Component<any, any> {
|
|||
this.setState({duration: value})
|
||||
}
|
||||
formFieldsChange = (changedFields: any, allFields: any) => {
|
||||
let block = false
|
||||
let startId = allFields['departureInvoiceId']
|
||||
let endId = allFields['destinationInvoiceId']
|
||||
if (typeof startId == "number" && typeof endId == "number") {
|
||||
let s = this.findInvoiceById(startId)
|
||||
let t = this.findInvoiceById(endId)
|
||||
if (s !== null && t !== null) {
|
||||
let x=Math.floor((Date.parse(t.invoiceDate)-Date.parse(s.invoiceDate))/24/60/60/1000) + 1
|
||||
let start = allFields['departureInvoiceId']
|
||||
let end = allFields['destinationInvoiceId']
|
||||
if (start !== undefined && end !== undefined && start.invoiceDate !== undefined && end.invoiceDate !== undefined) {
|
||||
let x = Math.floor((Date.parse(end.invoiceDate) - Date.parse(start.invoiceDate)) / 24 / 60 / 60 / 1000) + 1
|
||||
this.setState({back: true, duration: x})
|
||||
this.formRef.current?.setFieldValue('duration', x)
|
||||
block = true
|
||||
}
|
||||
}
|
||||
if(!block){
|
||||
}else{
|
||||
this.setState({back: false, duration: 0})
|
||||
this.formRef.current?.setFieldValue('duration', 0)
|
||||
}
|
||||
console.log(allFields)
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
@ -229,13 +323,13 @@ class ReimbursementCreate extends React.Component<any, any> {
|
|||
|
||||
<Row gutter={18}>
|
||||
<Col span={12}>
|
||||
<Form.Item label="出发票据" name="departureInvoiceId" rules={[{required: true}]}>
|
||||
<Form.Item help="" label="出发票据" name="departureInvoice" rules={[{required: true}]}>
|
||||
<SingleInvoiceSelector invoices={[]} pickerOpen={false}
|
||||
pickerTitle={"出发票据"} ref={this.invoiceSelector1}/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item label="返程票据" name="destinationInvoiceId" rules={[{required: false}]}>
|
||||
<Form.Item label="返程票据" name="destinationInvoice" rules={[{required: false}]}>
|
||||
<SingleInvoiceSelector invoices={[]} pickerOpen={false}
|
||||
pickerTitle={"返程票据"} ref={this.invoiceSelector2}/>
|
||||
</Form.Item>
|
||||
|
|
|
|||
Loading…
Reference in New Issue