|
@@ -0,0 +1,302 @@
|
|
|
+import React, { Component } from "react";
|
|
|
+import {
|
|
|
+ Form,
|
|
|
+ Button,
|
|
|
+ message,
|
|
|
+ Spin,
|
|
|
+ Upload,
|
|
|
+ DatePicker,
|
|
|
+ Select,
|
|
|
+ Tabs,
|
|
|
+ Table,
|
|
|
+ Modal,
|
|
|
+} from "antd";
|
|
|
+import $ from "jquery/src/ajax";
|
|
|
+import { ShowModal } from "@/tools";
|
|
|
+import moment from "moment";
|
|
|
+import ShowModalDiv from "@/showModal.jsx";
|
|
|
+import './index.less';
|
|
|
+
|
|
|
+const { TabPane } = Tabs;
|
|
|
+const FormItem = Form.Item;
|
|
|
+const Option = Select.Option;
|
|
|
+const { RangePicker } = DatePicker;
|
|
|
+
|
|
|
+class GxPage extends Component {
|
|
|
+ constructor(props) {
|
|
|
+ super(props);
|
|
|
+ this.state = {
|
|
|
+ type: 0,
|
|
|
+ Loading: false,
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ title: "序号",
|
|
|
+ dataIndex: "id",
|
|
|
+ key: "id",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "姓名",
|
|
|
+ dataIndex: "name",
|
|
|
+ key: "name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "市",
|
|
|
+ dataIndex: "city",
|
|
|
+ key: "city",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "县",
|
|
|
+ dataIndex: "county",
|
|
|
+ key: "county",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "乡镇",
|
|
|
+ dataIndex: "township",
|
|
|
+ key: "township",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "村",
|
|
|
+ dataIndex: "village",
|
|
|
+ key: "village",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "人口数",
|
|
|
+ dataIndex: "peopleSum",
|
|
|
+ key: "peopleSum",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "与户主关系",
|
|
|
+ dataIndex: "relationship",
|
|
|
+ key: "relationship",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "脱贫年度",
|
|
|
+ dataIndex: "povertyYear",
|
|
|
+ key: "povertyYear",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ dataSource: [],
|
|
|
+ totalcount: 0,
|
|
|
+ effectiveCount: 0,
|
|
|
+ id: "",
|
|
|
+ upLoad: {
|
|
|
+ customRequest: (options) => {
|
|
|
+ this.setState({
|
|
|
+ Loading: true,
|
|
|
+ })
|
|
|
+ let params = new FormData();
|
|
|
+ params.append("file", options.file);
|
|
|
+ $.ajax({
|
|
|
+ method: "post",
|
|
|
+ url: globalConfig.context + "/open/selectPoverty",
|
|
|
+ async: true,
|
|
|
+ cache: false,
|
|
|
+ contentType: false,
|
|
|
+ processData: false,
|
|
|
+ data: params
|
|
|
+ }).done(
|
|
|
+ function (data) {
|
|
|
+ this.setState({
|
|
|
+ Loading: false,
|
|
|
+ })
|
|
|
+ if (data.error.length === 0) {
|
|
|
+ let info = data.data
|
|
|
+ this.setState({
|
|
|
+ dataSource: info.list,
|
|
|
+ totalcount: info.totalcount,
|
|
|
+ effectiveCount: info.effectiveCount,
|
|
|
+ id: info.id,
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ }
|
|
|
+ }.bind(this)
|
|
|
+ ).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ Loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ },
|
|
|
+ name: "file",
|
|
|
+ action: globalConfig.context + "/api/user/channel/import",
|
|
|
+ },
|
|
|
+ };
|
|
|
+
|
|
|
+ this.exportExec = this.exportExec.bind(this);
|
|
|
+ this.onSwitch = this.onSwitch.bind(this);
|
|
|
+ }
|
|
|
+
|
|
|
+ componentWillMount() {
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ // 导出
|
|
|
+ exportExec() {
|
|
|
+ message.config({
|
|
|
+ duration: 20,
|
|
|
+ });
|
|
|
+ let loading = message.loading("下载中...");
|
|
|
+ this.setState({
|
|
|
+ Loading: true,
|
|
|
+ });
|
|
|
+
|
|
|
+ let data = {
|
|
|
+ id: this.state.id,
|
|
|
+ type: this.state.type,
|
|
|
+ };
|
|
|
+ $.ajax({
|
|
|
+ method: "get",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/open//selectPovertyById/export",
|
|
|
+ data,
|
|
|
+ success: function (data) {
|
|
|
+ if (data.error.length === 0) {
|
|
|
+ this.download(data.data);
|
|
|
+ } else {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ loading();
|
|
|
+ this.setState({
|
|
|
+ Loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+
|
|
|
+ // 导出下载
|
|
|
+ download(fileName) {
|
|
|
+ window.location.href =
|
|
|
+ globalConfig.context + "/open/download?fileName=" + fileName;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 下载模板
|
|
|
+ downLoadFile() {
|
|
|
+ window.open(globalConfig.context + '/open/downloadPovertyTemplate')
|
|
|
+ }
|
|
|
+
|
|
|
+ // 有效数据切换
|
|
|
+ onSwitch() {
|
|
|
+ this.setState({
|
|
|
+ Loading: true,
|
|
|
+ });
|
|
|
+ $.ajax({
|
|
|
+ method: "get",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/open/selectPovertyById",
|
|
|
+ data: {
|
|
|
+ id: this.state.id,
|
|
|
+ type: this.state.type == 0 ? 1 : 0,
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ this.setState({
|
|
|
+ Loading: false,
|
|
|
+ });
|
|
|
+ if (data.error.length === 0) {
|
|
|
+ this.setState({
|
|
|
+ type: this.state.type == 0 ? 1 : 0,
|
|
|
+ dataSource: data.data.list,
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ Loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ render() {
|
|
|
+ const { columns, dataSource, totalcount, effectiveCount, id, type } = this.state;
|
|
|
+ return (
|
|
|
+ <div className="user-content">
|
|
|
+ <ShowModalDiv ShowModal={this.state.showModal} />
|
|
|
+ <div className="content-title" style={{ marginBottom: 10 }}>
|
|
|
+ <span style={{ fontWeight: 900, fontSize: 16 }}>建档立卡脱贫户-批量查询</span>
|
|
|
+ </div>
|
|
|
+ <Tabs defaultActiveKey="1">
|
|
|
+ <TabPane tab="操作" key="1">
|
|
|
+ <div
|
|
|
+ style={{
|
|
|
+ width: "100%",
|
|
|
+ paddingBottom: 10,
|
|
|
+ display: "flex",
|
|
|
+ flexDirection: "row",
|
|
|
+ justifyContent: "space-between",
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ style={{
|
|
|
+ display: "flex"
|
|
|
+
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <Upload {...this.state.upLoad} disabled={this.state.Loading}>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={() => {
|
|
|
+
|
|
|
+ }}
|
|
|
+ style={{ marginLeft: "10px" }}
|
|
|
+ >
|
|
|
+ 导入查询数据
|
|
|
+ </Button>
|
|
|
+ </Upload>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={this.downLoadFile}
|
|
|
+ style={{ marginLeft: "10px" }}
|
|
|
+ >
|
|
|
+ 下载批量查询模板
|
|
|
+ </Button>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ loading={this.state.Loading}
|
|
|
+ onClick={this.exportExec}
|
|
|
+ style={{ marginLeft: "10px" }}
|
|
|
+ disabled={!id}
|
|
|
+ >
|
|
|
+ 导出EXCEL
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>数据统计:有效数据<span style={{ color: "red" }}>{effectiveCount}</span>条,共<span style={{ color: "red" }}>{totalcount}</span>条数据</span>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={this.onSwitch}
|
|
|
+ style={{ margin: "0 10px" }}
|
|
|
+ disabled={!id}
|
|
|
+ >
|
|
|
+ {type == 0 ? "仅显示有效数据" : "显示所有数据"}
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </TabPane>
|
|
|
+ </Tabs>
|
|
|
+ <div className="patent-table">
|
|
|
+ <Spin spinning={this.state.Loading}>
|
|
|
+ <Table
|
|
|
+ bordered
|
|
|
+ size="middle"
|
|
|
+ columns={columns}
|
|
|
+ dataSource={dataSource}
|
|
|
+ />
|
|
|
+ </Spin>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+export default GxPage;
|