diff --git a/src/pages/Invoice/mine/InvoiceListView.tsx b/src/pages/Invoice/mine/InvoiceListView.tsx index 85e13f1..24e921b 100644 --- a/src/pages/Invoice/mine/InvoiceListView.tsx +++ b/src/pages/Invoice/mine/InvoiceListView.tsx @@ -1,29 +1,57 @@ -import {Card, Dropdown, List,Menu,Input,Button,Radio,Divider} from "antd"; -import type { MenuProps } from 'antd'; -import { Icon } from '@ant-design/compatible' -import { DownOutlined,UploadOutlined } from '@ant-design/icons'; -import React, {ReactElement, JSXElementConstructor, ReactFragment, ReactPortal,useState } from "react"; -import {Invoice,InvoiceSearchOption} from "../../../models/Staff" -import { Space, Typography } from 'antd'; +import {Card, Dropdown, List, Menu, Input, Button, Radio, Divider, DatePicker, Form, TimePicker, Select} from "antd"; +import type {MenuProps} from 'antd'; +import {Icon} from '@ant-design/compatible' +import {DownOutlined, UploadOutlined} from '@ant-design/icons'; +import React, {ReactElement, JSXElementConstructor, ReactFragment, ReactPortal, useState} from "react"; +import {Invoice, InvoiceSearchOption} from "../../../models/Staff" +import {Space, Typography} from 'antd'; import {SizeType} from "antd/es/config-provider/SizeContext"; import axios from "axios"; import axiosInstance, {baseUrl} from "../../../utils/axiosInstance"; +import {Simulate} from "react-dom/test-utils"; +import change = Simulate.change; +import {useNavigate} from "react-router-dom"; +import {useAppDispatch} from "../../../models/hooks"; + const {Meta} = Card; -const { Search } = Input; -let invoices:Array +const {Search} = Input; +const {Option} = Select +let invoices: Array +const {RangePicker} = DatePicker; +const formItemLayout = { + labelCol: { + xs: {span: 24}, + sm: {span: 8}, + }, + wrapperCol: { + xs: {span: 24}, + sm: {span: 16}, + }, +}; +const config = { + rules: [{type: 'object' as const, required: false, message: 'Please select time!'}], +}; +const rangeConfig = { + rules: [{type: 'array' as const, required: false, message: 'Please select time!'}], +}; class InvoiceSearch extends React.Component { constructor(props: { handleSearchData: any; }) { super(props); this.state = { - activatedOption:"发票代码", - searchContent:'请在此输入', - invoiceSearchOption:new InvoiceSearchOption() + activatedOption: "发票代码", + searchContent: '请在此输入', + complexEnabled:true, + invoiceSearchOption: new InvoiceSearchOption() } this.onSearch('') } - onSearch=(value: string)=>{ - if(this.state.activatedOption === "发票代码") { + + onSearch = (value: string) => { + if(!this.state.complexEnabled) + this.state.invoiceSearchOption.clear() + console.log(this.state.invoiceSearchOption.toString()) + if (this.state.activatedOption === "发票代码") { this.state.invoiceSearchOption.invoiceCode = value; } else { this.state.invoiceSearchOption.invoiceNo = value; @@ -32,8 +60,8 @@ class InvoiceSearch extends React.Component { const {handleSearchData} = this.props //const dispatch = useAppDispatch(); //const navigate = useNavigate(); - console.log(baseUrl + 'common/invoice/list?'+this.state.invoiceSearchOption.toString()) - axiosInstance.get(baseUrl + 'common/invoice/list?'+this.state.invoiceSearchOption.toString()).then(function (response) { + console.log(baseUrl + 'common/invoice/list?' + this.state.invoiceSearchOption.toString()) + axiosInstance.get(baseUrl + 'common/invoice/list?' + this.state.invoiceSearchOption.toString()).then(function (response) { console.log(response.data) //console.log(this.state) handleSearchData(response.data.records) @@ -47,24 +75,27 @@ class InvoiceSearch extends React.Component { //console.log(value) //this.props.handleSearchData(value) } - render(){ + + render() { const items: MenuProps['items'] = [ { - key:'1', - label:({ + key: '1', + label: ( { this.state.invoiceSearchOption.clear(); - this.setState({activatedOption:"发票代码"} - )}}> + this.setState({activatedOption: "发票代码"} + ) + }}> 发票代码 ) }, { - key:'2', - label:({ + key: '2', + label: ( { this.state.invoiceSearchOption.clear(); - this.setState({activatedOption:"发票编号"} - )}}> + this.setState({activatedOption: "发票编号"} + ) + }}> 发票编号 ) } @@ -119,7 +150,7 @@ class InvoiceItem extends React.Component { width: 250, height: 300, background: "dimgrey", - margin:30 + margin: 30 }} cover={thumbnail {
  • {this.state.invoiceNo}
  • {this.state.invoiceKind}
    • -
  • ¥{(this.state.invoiceAmountWithoutTax/100.0).toFixed(2)}
    • +
  • ¥{(this.state.invoiceAmountWithoutTax / 100.0).toFixed(2)}
  • {this.state.invoiceDate}
    • ) } } -class InvoiceListView extends React.Component{ + +class InvoiceListView extends React.Component { constructor(props: {}) { super(props); - this.state={ + this.state = { isNoOrCode: '1', invoices: [], invoiceNo: null, @@ -147,14 +179,16 @@ class InvoiceListView extends React.Component{ pageSize: 20 } } + handleInvoice(value: string) { - if(this.state.isNoOrCode == '1') - this.setState( {invoiceNo:value, invoiceCode: null}); - else this.setState({invoiceNo:null, invoiceCode: value}) + if (this.state.isNoOrCode == '1') + this.setState({invoiceNo: value, invoiceCode: null}); + else this.setState({invoiceNo: null, invoiceCode: value}) } - handleInvoicesContent=(value:Array)=>{ + + handleInvoicesContent = (value: Array) => { console.log(value) - this.setState({invoices:value}) + this.setState({invoices: value}) } render() { @@ -162,8 +196,8 @@ class InvoiceListView extends React.Component{
    // TODO:复杂搜索 -
    - {this.state.invoices.map((item:Invoice)=> +
    + {this.state.invoices.map((item: Invoice) => )}