Skip to content

Commit

Permalink
обработка ошибок при выборе удалении модулей, уровней
Browse files Browse the repository at this point in the history
  • Loading branch information
@semant1cs
semant1cs committed Dec 17, 2023
1 parent ad9881a commit 631ff53
Show file tree
Hide file tree
Showing 7 changed files with 127 additions and 62 deletions.
2 changes: 1 addition & 1 deletion frontend/src/components/mapMenu/EmployeeMap/EmployeeMap.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ const EmployeeMap: React.FC<IEmployeeMap> = observer(({user, formattedDate, logO
return (
<div className="employee-interface">
<Coins coins={100} additionalClassname="coins"/>
<ChooseModuleWindow moduleName={moduleMenuStore.currentModule?.title.toUpperCase()}/>
<ChooseModuleWindow moduleName={moduleMenuStore.choosedModule?.title.toUpperCase()}/>
<UserProfile logOut={logOut} user={user} formattedDate={formattedDate}/>
<CustomProgressBar className="progress-bar-wrapper" progress={54}/>
<div className="geolocations">
Expand Down
1 change: 0 additions & 1 deletion frontend/src/components/mapMenu/MapMenu.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ const MapMenu: React.FC = observer(() => {
setUser(user)
}
})
console.log(response.data)
superUserStore.setAllUsers(response.data)

if (user) {
Expand Down
96 changes: 74 additions & 22 deletions frontend/src/components/mapMenu/SuperUserMap/SuperUserMap.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,13 @@ import CreateUnit from "./superUserControlPanel/CreateUnit.tsx";

import {observer} from "mobx-react-lite";
import mapMenuStore from "../../../store/mapMenuStore.ts";
import superUserStore from "../../../store/superUserStore.ts";
import moduleMenuStore from "../../../store/moduleMenuStore.ts";
import levelStore from "../../../store/levelStore.ts";
import superUserStore from "../../../store/superUserStore.ts";

import {IMapType} from "../../../types/MapType.ts";
import {IModuleType} from "../../../types/ModuleType.ts";
import {ILevelType} from "../../../types/LevelType.ts";

const SuperUserMap: React.FC = observer(() => {
const [isUsersListModalOpen, setIsUserListModalOpen] = useState<boolean>(false)
Expand All @@ -36,17 +38,19 @@ const SuperUserMap: React.FC = observer(() => {
}, [])

const handleOnClickOptionMap = useCallback((map: IMapType) => {
mapMenuStore.chooseMap(map)
mapMenuStore.chooseMap(map).then(() => refreshData())
}, [])

const handleOnClickDeleteMap = useCallback((mapId: string) => {
mapMenuStore.deleteMap(mapId).then(() => mapMenuStore.fetchAvailableMaps().then())
const handleOnClickDeleteMap = useCallback(() => {
mapMenuStore.deleteMap().then(() => refreshData())
}, [])

const handleOnClickCreateMap = useCallback((mapName: string) => {
mapMenuStore.createMap(mapName)
.then(() => mapMenuStore.fetchAvailableMaps()
.then(() => setMapName("")))
.then(() => {
refreshData()
setMapName("")
})
}, [])

const handleOnChangeModuleName = useCallback((e: React.FormEvent<HTMLInputElement>) => {
Expand All @@ -57,16 +61,49 @@ const SuperUserMap: React.FC = observer(() => {
moduleMenuStore.chooseModule(module)
}, [])

const handleOnClickDeleteModule = useCallback((mapId: string) => {
moduleMenuStore.deleteModule(mapId).then(() => moduleMenuStore.fetchModules().then())
const handleOnClickDeleteModule = useCallback(() => {
moduleMenuStore.deleteModule().then(() => refreshData())
}, [])

const handleOnClickCreateModule = useCallback((moduleName: string) => {
moduleMenuStore.createModule(moduleName)
.then(() => moduleMenuStore.fetchModules()
.then(() => setModuleName("")))
.then(() => {
refreshData()
setModuleName("")
})
}, [])

const handleOnChangeLevelName = useCallback((e: React.FormEvent<HTMLInputElement>) => {
setLevelName(e.currentTarget.value)
}, [])

const handleOnClickOptionLevel = useCallback((level: ILevelType) => {
levelStore.chooseLevel(level)
}, [])

const handleOnClickDeleteLevel = useCallback(() => {
levelStore.deleteLevel().then(() => refreshData())
}, [])

const handleOnClickCreateLevel = useCallback((levelName: string) => {
levelStore.createLevel(levelName)
.then(() => {
refreshData()
setLevelName("")
})
}, [])

const refreshData = () => {
mapMenuStore.fetchAvailableMaps().then(() => {
if (mapMenuStore.choosedMap !== null) {
moduleMenuStore.fetchModules().then(() => {
if (moduleMenuStore.choosedModule !== null) {
levelStore.fetchLevels().then()
}
})
}
})
}

return (
<div>
Expand Down Expand Up @@ -96,21 +133,36 @@ const SuperUserMap: React.FC = observer(() => {
unitNameValue={mapName}
handleOnChangeUnitName={handleOnChangeMapName}
handleOnClickCreateUnit={handleOnClickCreateMap}
currentUnitId={mapMenuStore.choosedMap ? mapMenuStore.choosedMap.id : null}
currentUnitId={mapMenuStore.choosedMap?.id}
// @ts-ignore: Unreachable code error
availableUnits={mapMenuStore.availableMaps}
/>

{/*<CreateUnit*/}
{/* classNameSelect="available-modules"*/}
{/* handleOnClickOptionUnit={handleOnClickOptionModule}*/}
{/* handleOnClickDeleteUnit={handleOnClickDeleteModule}*/}
{/* unitName="module"*/}
{/* unitNameValue={moduleName}*/}
{/* handleOnChangeUnitName={handleOnChangeModuleName}*/}
{/* handleOnClickCreateUnit={handleOnClickCreateModule}*/}
{/* currentUnitId={currentModule?.id}*/}
{/* availableUnits={moduleMenuStore.availableModules}*/}
{/*/>*/}
<CreateUnit
classNameSelect="available-modules"
handleOnClickOptionUnit={handleOnClickOptionModule}
handleOnClickDeleteUnit={handleOnClickDeleteModule}
unitName="module"
unitNameValue={moduleName}
handleOnChangeUnitName={handleOnChangeModuleName}
handleOnClickCreateUnit={handleOnClickCreateModule}
currentUnitId={moduleMenuStore.choosedModule?.id}
// @ts-ignore: Unreachable code error
availableUnits={moduleMenuStore.availableModules}
/>

<CreateUnit
classNameSelect="available-levels"
handleOnClickOptionUnit={handleOnClickOptionLevel}
handleOnClickDeleteUnit={handleOnClickDeleteLevel}
unitName="level"
unitNameValue={levelName}
handleOnChangeUnitName={handleOnChangeLevelName}
handleOnClickCreateUnit={handleOnClickCreateLevel}
currentUnitId={levelStore.choosedLevel?.id}
// @ts-ignore: Unreachable code error
availableUnits={levelStore.availableLevels}
/>
</div>
);
});
Expand Down
14 changes: 7 additions & 7 deletions frontend/src/components/mapMenu/SuperUserMap/superUserControlPanel/CreateUnit.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,14 @@ import {ILevelType} from "../../../../types/LevelType.ts";

interface IPropTypes {
classNameSelect: string,
handleOnClickOptionUnit: (unit: IMapType & IModuleType & ILevelType, index: number) => void,
handleOnClickOptionUnit: (unit: IMapType & IModuleType, index: number) => void,
handleOnClickDeleteUnit: (unitId: string) => void,
unitName: string,
unitNameValue: string,
handleOnChangeUnitName: (e: React.FormEvent<HTMLInputElement>) => void,
handleOnClickCreateUnit: (unitName: string) => void,
currentUnitId?: string | null,
availableUnits: IMapType[]
availableUnits: IMapType[] & IModuleType[] & ILevelType[]
}

const CreateUnit: React.FC<IPropTypes> =
Expand Down Expand Up @@ -44,13 +44,13 @@ const CreateUnit: React.FC<IPropTypes> =
<div>
<select className={classNameSelect}>
<option value="-">-</option>
{availableUnits.map((map, index) =>
{availableUnits.map((unit, index) =>
<option
key={map.id}
value={map.title}
onClick={() => handleOnClickOptionUnit(map, index)}
key={unit.id}
value={unit.title}
onClick={() => handleOnClickOptionUnit(unit, index)}
>
{map.title}
{unit.title}
</option>)
}
</select>
Expand Down
24 changes: 23 additions & 1 deletion frontend/src/store/levelStore.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {ILevelType} from "../types/LevelType.ts";
class levelStore {
chosenTaskIndex: number = 1
availableLevels: ILevelType[] = []
choosedLevel: ILevelType | null = null

constructor() {
makeAutoObservable(this)
Expand All @@ -23,17 +24,38 @@ class levelStore {
this.chosenTaskIndex = 1
}

chooseLevel(level: ILevelType) {
this.choosedLevel = level
}

setAvailableLevels(levels: ILevelType[]) {
this.availableLevels = levels
}

async fetchLevels() {
await axios.get("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/" + moduleMenuStore.currentModuleId + "/levels")
await axios.get("http://localhost:8000/maps/" + mapMenuStore.choosedMap?.id + "/modules/" + moduleMenuStore.choosedModule?.id + "/levels")
.then((response) => {
this.setAvailableLevels([])
this.setAvailableLevels(response.data)
})
}

async createLevel(levelName: string) {
if (!mapMenuStore.choosedMap?.id) {
alert("Выберите карту")
return
}

if (!moduleMenuStore.choosedModule?.id) {
alert("Выберите модуль")
return
}
await axios.post("http://localhost:8000/maps/" + mapMenuStore.choosedMap?.id + "/modules/" + moduleMenuStore.choosedModule?.id + "/levels/", {title: levelName})
}

async deleteLevel() {
await axios.delete("http://localhost:8000/maps/" + mapMenuStore.choosedMap?.id + "/modules/" + moduleMenuStore.choosedModule?.id + "/levels/" + this.choosedLevel?.id)
}
}

export default new levelStore()
7 changes: 4 additions & 3 deletions frontend/src/store/mapMenuStore.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ class MapMenuStore {

async fetchAvailableMaps() {
await axios.get("http://localhost:8000/maps/").then((response) => {
this.setMaps([])
this.setMaps(response.data)
this.chooseMap(response.data[0])
})
Expand All @@ -25,7 +26,7 @@ class MapMenuStore {
this.availableMaps = maps
}

chooseMap(map: IMapType) {
async chooseMap(map: IMapType) {
this.choosedMap = map
}

Expand All @@ -40,8 +41,8 @@ class MapMenuStore {
await axios.post("http://localhost:8000/maps/", {title: mapName}).then()
}

async deleteMap(mapId?: string) {
await axios.delete("http://localhost:8000/maps/" + mapId)
async deleteMap() {
await axios.delete("http://localhost:8000/maps/" + this.currentMapId)
}
}

Expand Down
45 changes: 18 additions & 27 deletions frontend/src/store/moduleMenuStore.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,10 @@ import {makeAutoObservable} from "mobx";
import {IModuleType} from "../types/ModuleType.ts";
import axios from "axios";
import mapMenuStore from "./mapMenuStore.ts";
import levelStore from "./levelStore.ts";

class ModuleMenuStore {
availableModules: IModuleType[] = []
currentModule: IModuleType | null = null
currentModuleIndex: number = 0
choosedModule: IModuleType | null = null

constructor() {
makeAutoObservable(this)
Expand All @@ -17,48 +15,41 @@ class ModuleMenuStore {
this.availableModules = modules
}

async selectModule(newModule: IModuleType) {
this.currentModule = newModule
chooseModule(newModule: IModuleType) {
this.choosedModule = newModule
}

async fetchModules() {
await axios.get("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/")
.then((response) => {
this.setAvailableModules([])
this.setAvailableModules(response.data.filter((module: IModuleType) => module.map_id === mapMenuStore.currentMapId))
this.setAvailableModules(response.data.filter((module: IModuleType) => module.map_id === mapMenuStore.choosedMap?.id))
})
}

async createModule(title: string) {
console.log(title)
await axios.post("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/", {
map_id: mapMenuStore.currentMapId,
title: title,
previous_module_id: null,
next_module_id: null,
})
}

async fetchModuleById(id: string) {
await axios.get("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/" + id).then((response) => {
this.selectModule(response.data)
this.chooseModule(response.data)
})
}

async deleteModule(id?: string) {
await axios.delete("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/" + id).catch(() => alert("Выберите модуль"))
}
async createModule(title: string) {
if (mapMenuStore.choosedMap?.id === undefined) {
alert("Выберите уровень для которого будете создавать карту")
return
}

updateModuleById(mapId: string, id: string, title?: string, previousModuleId?: string, nextModuleId?: string, levels?: string[]) {
axios.patch("http://localhost:8000/modules/" + id, {
id: id,
map_id: mapId,
await axios.post("http://localhost:8000/maps/" + mapMenuStore.choosedMap?.id + "/modules/", {
map_id: mapMenuStore.choosedMap?.id,
title: title,
previous_module_id: previousModuleId,
next_module_id: nextModuleId,
levels_ids: levels
previous_module_id: null,
next_module_id: null,
})
}

async deleteModule() {
await axios.delete("http://localhost:8000/maps/" + mapMenuStore.currentMapId + "/modules/" + this.choosedModule?.id).catch(() => alert("Выберите модуль"))
}
}

export default new ModuleMenuStore()

0 comments on commit 631ff53

Please sign in to comment.