This commit is contained in:
2024-02-28 23:43:36 +03:00
parent db6c735fdc
commit 5134d44e39
19 changed files with 2328 additions and 1793 deletions

View File

@@ -1,6 +1,7 @@
import React, { useCallback, useEffect, useRef, useState } from "react";
import dayjs from "dayjs";
import { Link } from "react-router-dom";
import { getConfigValue } from "@ijl/cli";
import {
ArrowImg,
@@ -14,20 +15,12 @@ import {
} from "./style";
import arrow from "../assets/36-arrow-right.svg";
import { connect, getSocket } from "../socket";
import { getConfigValue } from "@ijl/cli";
import { keycloak } from "../__data__/const";
import { keycloak } from "../__data__/kc";
export const Journal = () => {
const [lessons, setLessons] = useState(null);
useEffect(() => {
connect();
const socket = getSocket();
socket.on("lessons", (data) => {
setLessons(data);
});
const check = async () => {
if (keycloak.authenticated) {
keycloak;
@@ -79,8 +72,8 @@ export const Journal = () => {
(event) => {
event.preventDefault();
const socket = getSocket();
socket.emit("create-lesson", { lessonName: value });
// const socket = getSocket();
// socket.emit("create-lesson", { lessonName: value });
setValue("");
},
[value]

View File

@@ -3,7 +3,6 @@ import { useParams } from 'react-router-dom';
import dayjs from 'dayjs';
import QRCode from 'qrcode';
import { connect, getSocket } from '../socket';
import { MainWrapper, StartWrapper, QRCanvas, LessonItem, Lessonname } from './style';
export const Lesson = () => {
@@ -11,11 +10,9 @@ export const Lesson = () => {
const canvRef = useRef(null);
const [lesson, setLesson] = useState(null);
useEffect(() => {
connect();
const socket = getSocket();
socket.on('lessons', data => {
setLesson(data.find(lesson => lesson.id === lessonId));
})
// socket.on('lessons', data => {
// setLesson(data.find(lesson => lesson.id === lessonId));
// })
QRCode.toCanvas(canvRef.current, `${location.origin}/journal/u/${lessonId}` , function (error) {
if (error) console.error(error)

View File

@@ -1,7 +1,6 @@
import React, { useCallback, useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import { connect, getSocket } from '../socket';
import { ArrowImg, IconButton, InputElement, InputLabel, InputWrapper, MainWrapper, StartWrapper } from './style';
import arrow from '../assets/36-arrow-right.svg';
@@ -10,26 +9,24 @@ export const UserPage = () => {
const [error, setError] = useState(null);
const { lessonId } = useParams();
useEffect(() => {
connect();
const socket = getSocket();
socket.on('connect', () => {
const id = localStorage.getItem('socketId');
if (!id) {
localStorage.setItem('socketId', socket.id);
setSocketId(socket.id);
} else {
setSocketId(id);
}
// socket.on('connect', () => {
// const id = localStorage.getItem('socketId');
// if (!id) {
// localStorage.setItem('socketId', socket.id);
// setSocketId(socket.id);
// } else {
// setSocketId(id);
// }
const name = localStorage.getItem('name');
if (name) {
const socket = getSocket();
socket.emit('add', { socketId: id || socket.id, name, lessonid: lessonId });
}
})
socket.on('error', data => {
setError(data)
})
// const name = localStorage.getItem('name');
// if (name) {
// const socket = getSocket();
// socket.emit('add', { socketId: id || socket.id, name, lessonid: lessonId });
// }
// })
// socket.on('error', data => {
// setError(data)
// })
}, []);
const [value, setValue] = useState(localStorage.getItem('name') || '');
@@ -40,9 +37,8 @@ export const UserPage = () => {
const handleSubmit = useCallback((event) => {
event.preventDefault();
const socket = getSocket();
localStorage.setItem('name', value)
socket.emit('add', { socketId: localStorage.getItem('socketId') || socketId, name: value, lessonid: lessonId });
// socket.emit('add', { socketId: localStorage.getItem('socketId') || socketId, name: value, lessonid: lessonId });
}, [value])
return (

View File

@@ -4,69 +4,12 @@ import arrow from '../assets/36-arrow-right.svg';
import {
MainWrapper,
InputElement,
InputLabel,
InputWrapper,
ArrowImg,
IconButton,
} from './style';
import { Journal } from './Journal';
const Input = ({ onStart }) => {
const [value, setValue] = useState('');
const [inFocuse, setInfocuse] = useState(false);
const handleChange = useCallback(event => {
setValue(event.target.value.toUpperCase())
}, [setValue]);
const inputRef = useRef<HTMLInputElement>(null);
useEffect(() => {
const pass = localStorage.getItem('pass')
if (pass) {
onStart();
}
}, []);
const handleSubmit = useCallback((event) => {
event.preventDefault();
localStorage.setItem('pass', 'true')
if (value === 'OYB0Y') {
onStart()
}
}, [value])
return (
<>
<form onSubmit={handleSubmit}>
<InputWrapper>
<InputLabel
htmlFor='input'
>
Введите пароль:
</InputLabel>
<InputElement
value={value}
onChange={handleChange}
onFocus={() => setInfocuse(true)}
ref={inputRef}
id="input"
type="password"
autoComplete="off"
/>
<IconButton type="submit">
<ArrowImg src={arrow} />
</IconButton>
</InputWrapper>
</form>
</>
)
}
export const MainPage = () => {
return (
<MainWrapper>
{/* {!shoList && <Input onStart={() => setShoList(true)} />} */}
<Journal />
</MainWrapper>
);