增加上传动画，优化提示

js/component/manageCenter/index/contacts/index.jsx

@@ -29,6 +29,7 @@ class Content extends Component {
     this.state = {
       dataSource: [], // table数据
       loading: false, // 加载loading
+      upLoadFileLoading: false, // 上传loading
       searchInfor: {}, // 查询条件
       visible: false, // 控制弹窗变量
       rowdata: {}, // 行数据
@@ -206,6 +207,9 @@ class Content extends Component {
                   this.loadData();
                 } else {
                   message.success(`${data.data.OK}条数据导入成功！`);
+                  if (data.data.ERROR.length != 0) {
+                    this.onTips(data)
+                  }
                   this.loadData();
                 }
               } else {
@@ -232,17 +236,18 @@ class Content extends Component {
   onTips(data) {
     if (data.data.ERROR.length > 0) {
       Modal.info({
-        title: <span>部分导入失败,您有以下
-          <span style={{ color: "red" }}>&nbsp;{data.data.ERROR.length}&nbsp;</span>条数据重复！
-        </span>,
+        title: "提示",
+        width: 700,
         content: (
           <div>
+            <div><span style={{ color: "red" }}>{data.data.OK}&nbsp;</span>条数据导入成功！</div>
+            <div>部分导入失败，您有以下<span style={{ color: "red" }}>&nbsp;{data.data.ERROR.length}&nbsp;</span>条数据有误！</div>
             {
               data.data.ERROR.map((item, index) =>
-                <p key={index}>研发活动编号为[<span style={{ color: "red" }}>&nbsp;{item}&nbsp;</span>]</p>
+                <p key={index}><span style={{ color: "red" }}>{item}</span></p>
               )
             }
-            <div style={{ color: "red", marginTop: 20 }}>以上数据因研发活动编号重复无法导入</div>
+            {/* <div style={{ color: "red", marginTop: 20 }}>以上数据因研发活动编号重复无法导入</div> */}
           </div>
         ),
         okText: '确定',
@@ -377,117 +382,123 @@ class Content extends Component {
   }
 
   render() {
-    const { columns, searchInfor } = this.state;
+    const { columns, searchInfor, upLoadFileLoading } = this.state;
     return (
-      <div className="user-content">
-        {/* <div className="content-title">
+      <Spin
+        size="large"
+        tip="Loading..."
+        spinning={upLoadFileLoading}
+      >
+        <div className="user-content">
+          {/* <div className="content-title">
         </div> */}
-        <div className="patent-table">
-          <div className="user-search">
-            <RangePicker
-              style={{ width: 200 }}
-              value={[
-                searchInfor.rdStart ? moment(searchInfor.rdStart) : null,
-                searchInfor.rdEnd ? moment(searchInfor.rdEnd) : null,
-              ]}
-              onChange={(data, dataString) => {
-                this.setState({
-                  searchInfor: Object.assign(searchInfor, {
-                    rdStart: dataString[0],
-                    rdEnd: dataString[1],
-                  }),
-                });
-              }}
-            />
-            <Input
-              placeholder={"请输入研发活动名称"}
-              style={{ width: 180 }}
-              value={searchInfor.rdName}
-              onChange={(e) => {
-                this.setState({
-                  searchInfor: Object.assign(searchInfor, {
-                    rdName: e.target.value,
-                  }),
-                });
-              }}
-            />
-            <Input
-              placeholder={"请输入咨询师名称"}
-              style={{ width: 180 }}
-              value={searchInfor.consultantName}
-              onChange={(e) => {
-                this.setState({
-                  searchInfor: Object.assign(searchInfor, {
-                    consultantName: e.target.value,
-                  }),
-                });
-              }}
-            />
-            <Button
-              type="primary"
-              onClick={() => {
-                this.loadData();
-              }}
-              style={{ margin: "0 5px" }}
-            >
-              搜索
-            </Button>
-            <Button
-              onClick={this.resetAll.bind(this)}
-              style={{ margin: "0 5px" }}
-            >
-              重置
-            </Button>
-            <div className="button">
-              <Upload {...this.state.upLoad}>
-                <Button
-                  type="primary"
-                  style={{ marginLeft: 10 }}
-                >
-                  <Icon type="upload" />
-                  导入数据
-                </Button>
-              </Upload>
+          <div className="patent-table">
+            <div className="user-search">
+              <RangePicker
+                style={{ width: 200 }}
+                value={[
+                  searchInfor.rdStart ? moment(searchInfor.rdStart) : null,
+                  searchInfor.rdEnd ? moment(searchInfor.rdEnd) : null,
+                ]}
+                onChange={(data, dataString) => {
+                  this.setState({
+                    searchInfor: Object.assign(searchInfor, {
+                      rdStart: dataString[0],
+                      rdEnd: dataString[1],
+                    }),
+                  });
+                }}
+              />
+              <Input
+                placeholder={"请输入研发活动名称"}
+                style={{ width: 180 }}
+                value={searchInfor.rdName}
+                onChange={(e) => {
+                  this.setState({
+                    searchInfor: Object.assign(searchInfor, {
+                      rdName: e.target.value,
+                    }),
+                  });
+                }}
+              />
+              <Input
+                placeholder={"请输入咨询师名称"}
+                style={{ width: 180 }}
+                value={searchInfor.consultantName}
+                onChange={(e) => {
+                  this.setState({
+                    searchInfor: Object.assign(searchInfor, {
+                      consultantName: e.target.value,
+                    }),
+                  });
+                }}
+              />
               <Button
                 type="primary"
-                onClick={this.downloadTemplate.bind(this, "/api/admin/RD/downloadTemplate")}
-                style={{ marginLeft: 10 }}
+                onClick={() => {
+                  this.loadData();
+                }}
+                style={{ margin: "0 5px" }}
               >
-                <Icon type="download" />
-                下载上传模板
+                搜索
               </Button>
               <Button
-                type="primary"
-                onClick={this.exportExec.bind(this)}
-                style={{ marginLeft: 10 }}
+                onClick={this.resetAll.bind(this)}
+                style={{ margin: "0 5px" }}
               >
-                <Icon type="download" />
-                导出Excel
+                重置
               </Button>
+              <div className="button">
+                <Upload {...this.state.upLoad}>
+                  <Button
+                    type="primary"
+                    style={{ marginLeft: 10 }}
+                  >
+                    <Icon type="upload" />
+                    导入数据
+                  </Button>
+                </Upload>
+                <Button
+                  type="primary"
+                  onClick={this.downloadTemplate.bind(this, "/api/admin/RD/downloadTemplate")}
+                  style={{ marginLeft: 10 }}
+                >
+                  <Icon type="download" />
+                  下载上传模板
+                </Button>
+                <Button
+                  type="primary"
+                  onClick={this.exportExec.bind(this)}
+                  style={{ marginLeft: 10 }}
+                >
+                  <Icon type="download" />
+                  导出Excel
+                </Button>
+              </div>
             </div>
+            <Spin spinning={this.state.loading}>
+              <Table
+                size="middle"
+                bordered
+                columns={columns}
+                scroll={{ x: window.innerWidth > 1536 ? '130%' : window.innerWidth < 1152 ? '280%' : '200%' }}
+                dataSource={this.state.dataSource}
+                pagination={this.state.pagination}
+                onRowDoubleClick={this.onRowDoubleClick.bind(this)}
+              />
+            </Spin>
           </div>
-          <Spin spinning={this.state.loading}>
-            <Table
-              size="middle"
-              bordered
-              columns={columns}
-              scroll={{ x: window.innerWidth > 1536 ? '130%' : window.innerWidth < 1152 ? '280%' : '200%' }}
-              dataSource={this.state.dataSource}
-              pagination={this.state.pagination}
-              onRowDoubleClick={this.onRowDoubleClick.bind(this)}
+          {
+            // 详情
+            this.state.visible &&
+            <Detail
+              rowdata={this.state.rowdata}
+              visible={this.state.visible}
+              onCancel={this.onCancel.bind(this)}
             />
-          </Spin>
+          }
         </div>
-        {
-          // 详情
-          this.state.visible &&
-          <Detail
-            rowdata={this.state.rowdata}
-            visible={this.state.visible}
-            onCancel={this.onCancel.bind(this)}
-          />
-        }
-      </div>
+      </Spin>
     );
   }
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "afanti",
-  "version": "1.0.02",
+  "version": "1.0.03",
   "description": "",
   "main": "index.js",
   "scripts": {