From 415075c2177606126fa6f880bbafe0390df05def Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=99=BD=E5=B0=81=E7=BE=BD?= <2360164671@qq.com> Date: Mon, 26 Dec 2022 21:20:24 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=BA=86=E7=88=86=E7=82=B8?= =?UTF-8?q?=E7=8E=B0=E5=9C=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/models/Staff.ts | 1 + src/pages/login/LoginView.tsx | 250 +++++++++++++--------------------- src/utils/axiosInstance.ts | 8 +- 3 files changed, 97 insertions(+), 162 deletions(-) diff --git a/src/models/Staff.ts b/src/models/Staff.ts index 70a9176..f0f0026 100644 --- a/src/models/Staff.ts +++ b/src/models/Staff.ts @@ -1,3 +1,4 @@ + export interface Token { accessToken: string; refreshToken: string; diff --git a/src/pages/login/LoginView.tsx b/src/pages/login/LoginView.tsx index ac68fed..2e93f11 100644 --- a/src/pages/login/LoginView.tsx +++ b/src/pages/login/LoginView.tsx @@ -1,178 +1,110 @@ -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 {SizeType} from "antd/es/config-provider/SizeContext"; +import React from 'react'; +import {Button, Form, Input} from 'antd'; +import {LockOutlined, UserOutlined} from '@ant-design/icons'; +import './LoginView.css'; +import loginImg from '../../assets/login.png' import axios from "axios"; import {baseUrl} from "../../utils/axiosInstance"; -import {setToken} from "../../models/store"; -import {useAppDispatch} from "../../models/hooks"; import {useNavigate} from "react-router-dom"; -const {Meta} = Card; -const { Search } = Input; -let invoices:Array +import {useAppDispatch} from "../../models/hooks"; +import {setToken} from "../../models/store"; -class InvoiceSearch extends React.Component { - constructor(props: { handleSearchData: any; }) { - super(props); - this.state = { - activatedOption:"发票代码", - searchContent:'请在此输入', - invoiceSearchOption:new InvoiceSearchOption() - } - } - onSearch=(value: string)=>{ - if(this.state.activatedOption === "发票代码") { - this.state.invoiceSearchOption.invoiceCode = value; - } else { - this.state.invoiceSearchOption.invoiceNo = value; - } +function LoginView() { + const navigate = useNavigate(); + const dispatch = useAppDispatch(); - const {handleSearchData} = this.props - //const dispatch = useAppDispatch(); - //const navigate = useNavigate(); - console.log(baseUrl + 'invoice/list?'+this.state.invoiceSearchOption.toString()) - axios.get(baseUrl + 'invoice/list?'+this.state.invoiceSearchOption.toString()).then(function (this:any,response) { + const onFinish = (values: any) => { + console.log(values) + const data = new FormData(); + data.append('staffId', values.staffId); + data.append('staffPassword', values.staffPassword); + axios.post(baseUrl + 'login', data).then(function (response) { console.log(response.data) - //console.log(this.state) - handleSearchData(response.data.records) - //dispatch(this.props.handleSearchData(response.data.records)) + dispatch(setToken({ + accessToken: response.data.accessToken, + refreshToken: response.data.refreshToken + })) //models.commit('setStaff', response.data.data) - //navigate('/') + navigate('/') }).catch(function (error) { console.log(error); //showAlert.value = true }); - //console.log(value) - //this.props.handleSearchData(value) - } - render(){ + console.log('Success:', values); + }; + const onFinishFailed = (errorInfo: any) => { + console.log('Failed:', errorInfo); + }; - const items: MenuProps['items'] = [ - { - key:'1', - label:({ - this.state.invoiceSearchOption.clear(); - this.setState({activatedOption:"发票代码"} - )}}> - 发票代码 - ) - }, - { - key:'2', - label:({ - this.state.invoiceSearchOption.clear(); - this.setState({activatedOption:"发票编号"} - )}}> - 发票编号 - ) - } - ]; - return ( -
- +
+
+ +
+
+
+

登录

+

欢迎回来，请登录以智能财务报销系统

+ +
- - - {this.state.activatedOption} - - - - } - placeholder={this.state.searchContent} - allowClear - onSearch={(value)=>this.onSearch(value)} - style={{ width: 304 }} - enterButton - /> - -
- ) - } -} + + } placeholder="用户名"/> + -class InvoiceItem extends React.Component { - constructor(props: { invoice: Invoice }) { - super(props); - this.state = { - invoiceKind: props.invoice.invoiceKind, - invoiceAmount: props.invoice.invoiceAmount, - invoiceDate: props.invoice.invoiceDate, - invoiceNo: props.invoice.invoiceNo, - } - } - - render() { - return ( - } - > -
-
  • {this.state.invoiceNo}
    • -
  • {this.state.invoiceKind}
    • -
  • ¥{this.state.invoiceAmount}
    • -
  • {this.state.invoiceDate}
    • -
    -     - ) - } -} -class InvoiceListView extends React.Component{ - constructor(props: {}) { - super(props); - this.state={ - isNoOrCode: '1', - invoices: [], - invoiceNo: null, - invoiceCode: null, - pageNum: 0, - pageSize: 20 - } - } - handleInvoice(value: string) { - if(this.state.isNoOrCode == '1') - this.setState( {invoiceNo:value, invoiceCode: null}); - else this.setState({invoiceNo:null, invoiceCode: value}) - } - handleInvoicesContent=(value:Array)=>{ - console.log(value) - this.setState({invoices:value}) - } - - render() { - return ( -
    - // TODO:复杂搜索 - -
    - {this.state.invoices.map((item:Invoice)=> - - )} + + } + placeholder="密码"/> + + + + + +
    - ) - } +
    + + ); + } -export default InvoiceListView \ No newline at end of file +export default LoginView; \ No newline at end of file diff --git a/src/utils/axiosInstance.ts b/src/utils/axiosInstance.ts index 5762dd5..abf1cfa 100644 --- a/src/utils/axiosInstance.ts +++ b/src/utils/axiosInstance.ts @@ -1,7 +1,8 @@ import axios, {AxiosRequestConfig, AxiosResponse} from "axios"; +import {store} from "../models/store"; -//export const baseUrl = "https://www.hammer-hfut.tk/api/" -export const baseUrl = "https://mock.apifox.cn/m1/2116708-0-ae5ae4e4/" +export const baseUrl = "http://101.34.228.45:8080/" +//export const baseUrl = "https://mock.apifox.cn/m1/2116708-0-ae5ae4e4/" const axiosInstance = axios.create({ baseURL: baseUrl, @@ -11,7 +12,8 @@ const axiosInstance = axios.create({ axiosInstance.interceptors.request.use( function (config: AxiosRequestConfig) { console.log(config) - + // @ts-ignore + config.headers.Authorization = "bearer "+store.getState().token.accessToken return config }, function (error) {