题库

public/react/src/modules/question/Question.js

@@ -11,6 +11,7 @@ import {
 	Input,
 	Tooltip
 } from "antd";
+import {parabola} from './animation/parabola'
 import Headplugselections from "./component/Headplugselections";
 import QuestionModal from "./component/QuestionModal";
 import QuestionModals from "./component/QuestionModals";
@@ -63,6 +64,7 @@ class Question extends Component {
 			disciplinesdatazsd:0,
 			selectallquestionsonthispages:false,
 			oj_status:null,
+			isVisible: false,
 		}
 
 	}
@@ -206,6 +208,7 @@ class Question extends Component {
 
 	}
 
+	//刷新加载
 	getdata = (data) => {
 		const url = `/item_banks.json`;
 		this.setState({
@@ -240,6 +243,34 @@ class Question extends Component {
 		});
 	}
 
+	//不刷新加载
+	getdatasy = (data) => {
+		const url = `/item_banks.json`;
+
+		axios.get((url), {params: data}).then((response) => {
+			setTimeout(()=>{
+
+			},1000);
+			if (response === null || response === undefined) {
+
+				return
+			}
+			if (response.data.status === 403 || response.data.status === 401 || response.data.status === 500) {
+
+			} else {
+
+			}
+			////console.log("item_banks");
+			////console.log(response);
+			this.setState({
+				Contentdata: response.data,
+				items_count: response.data.items_count,
+			})
+		}).catch((error) => {
+
+		});
+	}
+
 	paginationonChange = (pageNumber) => {
 		this.setState({
 			page: pageNumber,
@@ -574,11 +605,11 @@ class Question extends Component {
 						page: this.state.page,
 						per_page:10,
 					};
-					this.getdata(data);
+					this.getdatasy(data);
 					this.getbasket_listdata();
-					this.setState({
-						visible:true
-					})
+					// this.setState({
+					// 	visible:true
+					// })
 				}
 			}).catch((error) => {
 			//console.log(error);
@@ -689,6 +720,10 @@ class Question extends Component {
 		};
 		this.getdata(data);
 	}
+
+
+
+
 	render() {
 		let {
 			page, per_page, items_count, Headertop, visible, placement, modalsType, modalsTypes,basket_list,
@@ -701,8 +736,11 @@ class Question extends Component {
 			+ program_questions_count
 			+ single_questions_count
 			+ subjective_questions_count;
+
+
+
 		return (
-			<div className="newMain clearfix" ref={this.saveContainer}>
+			<div className="newMain clearfix"    ref={this.saveContainer}>
 				{
 					visible===true?
 						<style>
@@ -761,11 +799,14 @@ class Question extends Component {
 					}
 				</style>
 				<SiderBars
+					Datacount={Datacount}
 					myvisible={visible}
 					{...this.props}
 					{...this.state}
 					showDrawer={() => this.showDrawer()}
-					Headertop={Headertop}/>
+					Headertop={Headertop}
+
+				/>
 
 				{/*顶部*/}
 
@@ -781,6 +822,7 @@ class Question extends Component {
 				/>
 				{/*头部*/}
 				<Contentpart {...this.state} {...this.props}
+
 										 getitem_basketss={(id)=>this.getitem_basketss(id)}
 										 selectallquestionsonthispage={()=>this.selectallquestionsonthispage()}
 										 getitem_baskets={(e)=>this.getitem_baskets(e)}
@@ -957,12 +999,3 @@ class Question extends Component {
 }
 
 export default SnackbarHOC()(TPMIndexHOC(Question));
-{/*<Drawer*/}
-{/*	className="drawercontainer"*/}
-{/*	placement={placement}*/}
-{/*	closable={false}*/}
-{/*	onClose={() => this.onClose()}*/}
-{/*	visible={visible}*/}
-{/*	mask={false}*/}
-{/*	closable={true}*/}
-{/*>*/}

public/react/src/modules/question/animation/parabola.js

@@ -0,0 +1,51 @@
+/**
+ * 抛物线动画函数
+ * @param ballWrapper 小球的父容器
+ * @param origin 动画起点DOM
+ * @param target 动画目标DOM
+ * @param time 持续时间
+ * @param a 抛物线参数
+ * @param offset 动画尺寸
+ * @param callback 回调
+ */
+
+export function parabola(config) {
+	const {
+		ballWrapper,
+		origin,
+		target,
+		time = 1000,
+		a = 0.004,
+		callback,
+		finish,
+		offset = 0
+	} =
+	config || {};
+	const ballWrapperDimension = ballWrapper.getBoundingClientRect();
+	const originDimension = origin.getBoundingClientRect();
+	const targetDimension = target.getBoundingClientRect();
+	const x1 = originDimension.left + 0.5 * originDimension.width;
+	const y1 = originDimension.top + 0.5 * originDimension.height;
+	const x2 = targetDimension.left + 0.5 * targetDimension.width;
+	const y2 = targetDimension.top + 0.5 * targetDimension.height;
+	const diffx = x2 - x1;
+	const diffy = y2 - y1;
+	const speedx = diffx / time;
+	const b = (diffy - a * diffx * diffx) / diffx;
+
+	const refPoint_x = x1 - ballWrapperDimension.left - 0.5 * offset;
+	const refPoint_y = y1 - ballWrapperDimension.top - 0.5 * offset;
+
+	const start = Date.now();
+	const timer = setInterval(() => {
+		if (Date.now() - start > time) {
+			finish();
+			clearInterval(timer);
+			return;
+		}
+
+		const x = speedx * (Date.now() - start);
+		const y = a * x * x + b * x;
+		callback && callback(refPoint_x + x, refPoint_y + y);
+	}, 15);
+}

public/react/src/modules/question/component/SiderBars.js

@@ -93,10 +93,10 @@ class SiderBars extends Component {
 		// console.log(this.props);
 
 		var mypath= this.props&&this.props.match&&this.props.match.path;
-		let{myvisible}=this.props;
+		let{myvisible,Datacount,animateStyle}=this.props;
 		return (
 
-			<div className={myvisible===true?"-task-sidebar mystask-sidebar":"-task-sidebar mystask-sidebars"} >
+			<div className={myvisible===true?"-task-sidebar mystask-sidebar":Datacount&&Datacount>0?"-task-sidebar mystask-sidebars":"-task-sidebar mystask-sidebarss"} >
 
 				{this.props.mygetHelmetapi&&this.props.mygetHelmetapi.main_site===true?<div>
 
@@ -104,10 +104,15 @@ class SiderBars extends Component {
 						mypath&&mypath==="/question"?
 							<Tooltip placement="left" title={"试题库"}>
 
-								<div className="feedback feedbackdivcolor xiaoshou shitikus" onClick={()=>this.props.showDrawer()} >
-									<div className="shitikussmys">
-                      132
-									</div>
+								<div className="feedback feedbackdivcolor xiaoshou shitikus"  onClick={()=>this.props.showDrawer()} >
+
+									{
+										Datacount&&Datacount>0?
+											<div className="shitikussmys maxnamewidth30">
+												{Datacount}
+											</div>
+											:""
+									}
 
 									<a target="_blank" className="color_white xiaoshou" >
 										<i className="iconfont icon-shitilan color-white xiaoshou"></i>

public/react/src/modules/question/questioncss/questioncom.css

@@ -890,5 +890,27 @@
     position: absolute !important;
     font-size:11px !important;
     color:#ffffff !important;
-    line-height:14px !important;
+    line-height:20px !important;
+    top: -14px !important;
+    right: -14px !important;
+}
+
+
+.maxnamewidth30{
+    max-width: 30px;
+    overflow:hidden;
+    text-overflow:ellipsis;
+    white-space:nowrap;
+    cursor: default;
+}
+.ball {
+    width: 8px;
+    height: 8px;
+    background: #FF6601;
+    position: absolute;
+    left: 0;
+    top: 0;
+    border-radius: 50%;
+    opacity: 0;
+    z-index: 1;
 }

public/react/src/modules/tpm/TPMIndex.css

@@ -268,8 +268,32 @@ body>.-task-title {
     background: #EEEEEE;
 }
 .mystask-sidebar{
-    right: 210px !important;
+    right: 220px !important;
 }
 .mystask-sidebars{
-    right: 10px !important;
+    right: 20px !important;
+}
+.shitikussmys{
+    width:29px !important;
+    height:20px!important;
+    background:#FF6601 !important;
+    border-radius:10px !important;
+    position: absolute !important;
+    font-size:11px !important;
+    color:#ffffff !important;
+    line-height:20px !important;
+    top: -13px !important;
+    right: -10px !important;
+}
+
+
+.maxnamewidth30{
+    max-width: 30px;
+    overflow:hidden;
+    text-overflow:ellipsis;
+    white-space:nowrap;
+    cursor: default;
+}
+.mystask-sidebarss{
+    right: 5px !important;
 }