diff --git a/src/api/request.js b/src/api/request.js index 36f0d2b..ec15114 100644 --- a/src/api/request.js +++ b/src/api/request.js @@ -80,7 +80,7 @@ const api = { axios.get( path, { params: data }, { responseType: 'blob' }) .then(function (response) { - const blob = new Blob([response.data]); + const blob = new Blob([response.data],{ type: 'application/pdf' }); resolve(window.URL.createObjectURL(blob)); }) .catch(function (error) { diff --git a/src/assets/style/general.css b/src/assets/style/general.css index e31456f..2979037 100644 --- a/src/assets/style/general.css +++ b/src/assets/style/general.css @@ -206,3 +206,8 @@ span { margin: 20px 0; } +.react-pdf__Page{ + display: flex; + justify-content: center; +} + diff --git a/src/pages/home/branch/manage/rate/rate.js b/src/pages/home/branch/manage/rate/rate.js index 34ca8fe..8696432 100644 --- a/src/pages/home/branch/manage/rate/rate.js +++ b/src/pages/home/branch/manage/rate/rate.js @@ -1,5 +1,6 @@ import React, { Component } from 'react' -import { Input, Button, Modal, Pagination } from 'antd' +import { Input, Button, Modal, Space } from 'antd' +import { LeftOutlined, RightOutlined } from '@ant-design/icons'; import FeTable from '@/components/table' import api from "@/api/request" import { connect } from 'react-redux'; @@ -20,12 +21,12 @@ class ManageRate extends Component { visible: false, file: "", page: 1, - totalPage: [], + numPages: null, } } - componentDidMount(){ - this.onDocumentLoadSuccess() + componentDidMount() { + } onSearch = (value) => { @@ -64,14 +65,24 @@ class ManageRate extends Component { }) } - onDocumentLoadSuccess = (value) => { - var data = [] - for (let i in value.numPages) { - data.push(i) + onDocumentLoadSuccess = ({ numPages }) => { + this.setState({ numPages }) + } + + prePage = () => { + if (this.state.page > 1) { + this.setState({ + page: this.state.page - 1 + }) + } + } + + nextPage = () => { + if (this.state.page < this.state.numPages) { + this.setState({ + page: this.state.page + 1 + }) } - this.setState({ - totalPage: data - }) } handelOnChange = (page) => { @@ -82,13 +93,15 @@ class ManageRate extends Component { onCancel = () => { this.setState({ - visible: false + visible: false, + page: 1 }) } onConfirm = () => { this.setState({ - visible: false + visible: false, + page: 1 }) } @@ -109,21 +122,20 @@ class ManageRate extends Component { title="预览" okText="确 认" cancelText="取 消" - width="80%" + width="50%" onCancel={this.onCancel} onOk={this.onConfirm} + footer={[ +

{this.state.page} of {this.state.numPages}

+ ]} > - {this.state.totalPage.map(item => { - return - })} +