问卷加载

public/react/src/modules/courses/poll/PollDetailTabSecond.js

@@ -1,5 +1,5 @@
 import React,{ Component } from "react";
-import { Pagination} from "antd";
+import { Pagination , Spin } from "antd";
 import NoneData from "../coursesPublic/NoneData"
 
 import '../css/members.css'
@@ -16,10 +16,14 @@ class PollDetailTabSecond extends Component{
       page:1,
       limit:10,
       questions:undefined,
-      questionsInfo:undefined
+      questionsInfo:undefined,
+      isSpin:false
     }
   }
   getInfo=(page)=>{
+    this.setState({
+      isSpin:true
+    })
     let pollId=this.props.match.params.pollId;
     let url=`/polls/${pollId}/commit_result.json?page=${page}`;
     axios.get(url).then((result)=>{
@@ -27,7 +31,8 @@ class PollDetailTabSecond extends Component{
         this.setState({
 					page: page,
           questions:result.data.questions,
-          questionsInfo:result.data.question_types
+          questionsInfo:result.data.question_types,
+          isSpin:false
         })
       }
     }).catch((error)=>{
@@ -56,11 +61,12 @@ class PollDetailTabSecond extends Component{
   }
 
   render(){
-		let {page, limit, questions, questionsInfo} = this.state;
+		let {page, limit, questions, questionsInfo , isSpin} = this.state;
     return(
+      <Spin size="large" spinning={ isSpin }>
       <div>
         {
-          questions && questions.length>0?questions.map((item,key)=>{
+          questions && questions.length>0 && questions.map((item,key)=>{
             return(
             <div className="edu-back-white mb10">
               <div className="pt20 pl30 pr30 pb10">
@@ -91,7 +97,8 @@ class PollDetailTabSecond extends Component{
                   {
                     item.question.question_type==3?
                     <ul className="clearfix">
-                      <span>文本答案</span>  
+                      <span style={{width:"6%"}}>编号</span>
+                      <span style={{width:"50%",textAlign:"left"}}>文本答案</span>    
                     </ul>
                     :
                     <ul className="clearfix">
@@ -105,19 +112,22 @@ class PollDetailTabSecond extends Component{
                 {/* 主观题 */}
                 {
                   item.question.question_type == 3 && item.question.vote_text &&
-                  <div className="countBody">  
-                    <ul className="clearfix">
-                      <span className="color-grey-3 break-word" style={{width:"100%"}}>
-                        {
-                          item.question.vote_text.map((txt,t)=>{
-                            return(
-                              <li>{t+1}.{txt}</li>
-                            )
-                          })
-                        }
-                      </span>
-                    </ul>
-                  </div>
+                  <React.Fragment>
+                    {
+                      item.question.vote_text.map((txt,t)=>{
+                        return(
+                          <div className="countBody">  
+                            <ul className="clearfix">
+                              <span style={{width:"6%"}}>{t+1}</span>
+                              <span style={{flex:"1",textAlign:"left"}} className="color-grey-3 break-word">
+                                <li>{txt}</li>
+                              </span>
+                            </ul>
+                          </div>
+                        )
+                      })
+                    }
+                  </React.Fragment>
                 }
                 {/* 单选和多选 */}
                 {
@@ -166,7 +176,10 @@ class PollDetailTabSecond extends Component{
               </div>
             </div> 
             )
-          }):<NoneData></NoneData>
+          })
+        }
+        {
+          questions && questions.length == 0 && <NoneData></NoneData>
         }
         {
 					questionsInfo && questionsInfo.q_counts > limit &&
@@ -177,6 +190,7 @@ class PollDetailTabSecond extends Component{
         }
         
       </div>
+      </Spin>
     )
   }
 }

public/react/src/modules/courses/poll/PollDetailTabThird.js

@@ -1,5 +1,5 @@
 import React,{ Component } from "react";
-
+import { Spin } from 'antd';
 import '../css/members.css'
 import '../css/busyWork.css'
 import './pollStyle.css'
@@ -12,10 +12,14 @@ class PollDetailTabThird extends Component{
   constructor(props){
     super(props);
     this.state={
-      pollDetail:undefined
+      pollDetail:undefined,
+      isSpin:false
     }
   }
   getPollInfo=()=>{
+    this.setState({
+      isSpin:true
+    })
     let pollId=this.props.match.params.pollId;
     let url=`/polls/${pollId}.json`;
     axios.get(url).then((result)=>{
@@ -23,12 +27,14 @@ class PollDetailTabThird extends Component{
 				if (result.data.status === 401) {
 					//未登入
 					this.setState({
-						pollDetail: undefined
+            pollDetail: undefined,
+            isSpin:false
 					})
 					return
 				}
         this.setState({
-          pollDetail:result.data
+          pollDetail:result.data,
+          isSpin:false
         })
       }
     }).catch((error)=>{
@@ -39,10 +45,12 @@ class PollDetailTabThird extends Component{
     this.getPollInfo();
   }
   render(){
-    let {pollDetail}=this.state;
+    let {pollDetail , isSpin}=this.state;
     return(
       <div>
-        <PollDetailTabThirdInfo {...this.props} {...this.state} pollDetail = {pollDetail}></PollDetailTabThirdInfo>
+        <Spin size="large" spinning={isSpin}>
+          <PollDetailTabThirdInfo {...this.props} {...this.state} pollDetail = {pollDetail}></PollDetailTabThirdInfo>
+        </Spin>
       </div>
     )
   }