pedram
/
Andishmand
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

AnswerSheet Made And Is Functional

Browse Source
main
Pedram Keshavarzi 3 years ago
parent f59a890d14
commit 38e7771575
3 changed files with 82 additions and 8 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 68
      src/components/AnswerSheet/index.js
  2. 14
      src/components/selectedCourse/index.js
  3. 8
      src/view/addExam/views/addQuestions.js

68
src/components/AnswerSheet/index.js
Unescape View File

@ -0,0 +1,68 @@
import React, { useEffect, useState } from "react";
const AnswerSheet = ({questionsQuantity, optionsQuantity }) => {
const [data, setData] = useState([]);
const [options, setOptions] = useState([]);
useEffect(() => {
let array = [];
let optionsArray = [];
for(var i =1; i <= questionsQuantity; i++){
array.push({
questionId : i,
answer: null,
});
}
for(var i =1; i<= optionsQuantity; i++){
optionsArray.push({
id: i,
active: false,
})
}
setOptions(optionsArray);
setData(array)
console.log(data, options)
}, [])
return(
<div className="w-full flex flex-col border border-gray-200 rounded-xl bg-white">
{
data.map((item, index) => (
<div className="w-full flex items-center justify-between h-14 border-b border-gray-200">
<p className="w-14 flex items-center h-full justify-center border-l border-gray-200">
{item.questionId}
</p>
<form className="flex w-full h-full px-8 items-center justify-between border-l border-gray-200">
{
options.map(
(option) => (
<p type='radio' value={option.id} className={`w-8 h-6 rounded-full border border-gray-400 cursor-pointer ${option.id == item.answer ? 'bg-green-500' : 'bg-white'}`} onClick={() => {
var newArray = [...data];
newArray[index].answer = option.id;
setData(newArray)
console.log(data)
}} />
)
)
}
</form>
<div className="w-32 ">
نمره : ۱
</div>
</div>
))
}
</div>
)
}
export default AnswerSheet

14
src/components/selectedCourse/index.js
Unescape View File

@ -1,7 +1,7 @@
import React from "react";
const SelectedCourse = ({openAnswerSheet, title, questionQuantity, coefficient, optionsQuantity }) => {
return(
const SelectedCourse = ({ openAnswerSheet, title, questionQuantity, coefficient, optionsQuantity }) => {
return (
<div className="w-full border border-gray-400 rounded-xl bg-white flex items-center justify-between px-6 py-8 mt-8">
<div className="flex flex-col w-full">
@ -9,24 +9,24 @@ const SelectedCourse = ({openAnswerSheet, title, questionQuantity, coefficient,
{title}
</h1>
<div className="w-full flex mt-4 justify-between">
<p className="flex items-center w-1/4 text-sm justify-between border-l-2 px-2 border-red52">
<p className="flex items-center w-1/4 text-sm justify-between border-l-2 px-2 border-red52">
<p>تعداد سوالات</p>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={questionQuantity}/>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={questionQuantity} />
</p>
<p className="flex items-center w-1/4 text-sm justify-between border-l-2 px-2 border-red52">
<p className="w-full text-center"> ضریب</p>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={coefficient}/>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={coefficient} />
</p>
<p className="flex items-center w-1/4 text-sm justify-between border-l-2 px-2 border-red52">
<p>تعداد گزینه</p>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={4}/>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center text-xs" value={4} />
</p>
<p className="flex items-center w-1/4 text-sm justify-between px-2 ">
<p>نمره منفی</p>
<input type='number' className="w-5 h-5 ml-1 border border-red52 outline-none rounded text-center" />
</p>
</div>
<textarea className="border border-gray-300 mt-8 rounded-xl h-32 p-4 outline-none" placeholder="توضیحات">

8
src/view/addExam/views/addQuestions.js
Unescape View File

@ -1,6 +1,7 @@
import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import AnswerSheet from "../../../components/AnswerSheet";
import Button from "../../../components/Button";
import DatePicker from "../../../components/Calendar/CalendarComponents/DatePicker";
import Checkbox from "../../../components/Checkbox";
@ -108,7 +109,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
return (
<>
{
questionarePopUp && <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center justify-center">
questionarePopUp && <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center -mt-10 justify-center">
<div className="w-1/2 bg-white rounded-xl flex flex-col shadow-lg p-6">
<div className="w-full">
<div className="w-8 h-8 text-white text-sm rounded-full cursor-pointer flex justify-center items-center bg-red52" onClick={() => setQuestionairePopUp(false)}>
@ -243,6 +244,11 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
</>)
}
</div>
<div className="w-1/2 flex justify-center">
<div className="w-4/5 py-8">
<AnswerSheet questionsQuantity={30} optionsQuantity={4}/>
</div>
</div>
</div>

Write Preview
Loading…
Cancel
Save