Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 1b6128029e | |||
| bd7de5dee4 |
@ -1,59 +0,0 @@
|
|||||||
name: Create and publish a Docker image
|
|
||||||
|
|
||||||
on:
|
|
||||||
push:
|
|
||||||
branches: ["main"]
|
|
||||||
|
|
||||||
env:
|
|
||||||
REGISTRY: git.zetcraft.ru
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
publish:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
name: Publish image
|
|
||||||
container: catthehacker/ubuntu:act-latest
|
|
||||||
permissions:
|
|
||||||
contents: read
|
|
||||||
packages: write
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: Checkout repository
|
|
||||||
uses: actions/checkout@v3
|
|
||||||
|
|
||||||
- name: Log in to the Container registry
|
|
||||||
uses: docker/login-action@65b78e6e13532edd9afa3aa52ac7964289d1a9c1
|
|
||||||
with:
|
|
||||||
registry: ${{ env.REGISTRY }}
|
|
||||||
username: ${{ gitea.actor }}
|
|
||||||
password: ${{ secrets.TOKEN }}
|
|
||||||
|
|
||||||
- name: Extract metadata (tags, labels) for Docker
|
|
||||||
id: meta
|
|
||||||
uses: https://github.com/docker/metadata-action@v4
|
|
||||||
with:
|
|
||||||
images: ${{ env.REGISTRY }}/${{ gitea.repository }}
|
|
||||||
|
|
||||||
- name: Build and push Docker image
|
|
||||||
uses: docker/build-push-action@f2a1d5e99d037542a71f64918e516c093c6f3fc4
|
|
||||||
with:
|
|
||||||
context: ./
|
|
||||||
push: true
|
|
||||||
tags: ${{ steps.meta.outputs.tags }}
|
|
||||||
labels: ${{ steps.meta.outputs.labels }}
|
|
||||||
deploy:
|
|
||||||
needs: publish
|
|
||||||
name: Deploy image
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: install ssh keys
|
|
||||||
# check this thread to understand why its needed:
|
|
||||||
# <https://stackoverflow.com/a/70447517>
|
|
||||||
run: |
|
|
||||||
install -m 600 -D /dev/null ~/.ssh/id_rsa
|
|
||||||
echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_rsa
|
|
||||||
ssh-keyscan -H ${{ secrets.SSH_HOST }} > ~/.ssh/known_hosts
|
|
||||||
- name: connect and pull
|
|
||||||
run: ssh ${{ secrets.SSH_USER }}@${{ secrets.SSH_HOST }} "cd ${{ secrets.WORK_DIR }} && docker compose pull && docker compose up -d && docker image prune && exit"
|
|
||||||
- name: cleanup
|
|
||||||
run: rm -rf ~/.ssh
|
|
||||||
17
Dockerfile
17
Dockerfile
@ -1,17 +0,0 @@
|
|||||||
FROM node:20-alpine3.17 AS builder
|
|
||||||
|
|
||||||
WORKDIR /app
|
|
||||||
COPY package.json package-lock.json .eslintrc.cjs vite.config.js index.html ./
|
|
||||||
COPY public/ public/
|
|
||||||
COPY src/ src/
|
|
||||||
RUN npm ci
|
|
||||||
RUN npm run build
|
|
||||||
|
|
||||||
FROM nginx:1.25.2-alpine
|
|
||||||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
|
||||||
COPY --from=builder /app/build /usr/share/nginx/html
|
|
||||||
RUN touch /var/run/nginx.pid
|
|
||||||
RUN chown -R nginx:nginx /var/run/nginx.pid /usr/share/nginx/html /var/cache/nginx /var/log/nginx /etc/nginx/conf.d
|
|
||||||
USER nginx
|
|
||||||
EXPOSE 80
|
|
||||||
CMD ["nginx", "-g", "daemon off;"]
|
|
||||||
27
README.md
27
README.md
@ -1,25 +1,8 @@
|
|||||||
# CyberBloomFrontend
|
# React + Vite
|
||||||
|
|
||||||
# Docker
|
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
||||||
|
|
||||||
```bash
|
Currently, two official plugins are available:
|
||||||
docker run -d -p 80:80 \
|
|
||||||
--name CyberBloom \
|
|
||||||
--restart=always \
|
|
||||||
-e TZ=Europe/Moscow \
|
|
||||||
git.zetcraft.ru/cyberbloom/ogeetocasecybergarden:main
|
|
||||||
```
|
|
||||||
|
|
||||||
# Docker Compose
|
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
||||||
|
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
||||||
```yml
|
|
||||||
services:
|
|
||||||
cyberbloomfrontend:
|
|
||||||
ports:
|
|
||||||
- '80:80'
|
|
||||||
container_name: CyberBloom
|
|
||||||
restart: always
|
|
||||||
environment:
|
|
||||||
- TZ=Europe/Moscow
|
|
||||||
image: 'git.zetcraft.ru/cyberbloom/ogeetocasecybergarden:main'
|
|
||||||
```
|
|
||||||
|
|||||||
@ -3,7 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,600;0,700;1,500&family=Roboto+Condensed:wght@300;400;700&family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
|||||||
@ -1,9 +0,0 @@
|
|||||||
server_tokens off;
|
|
||||||
server {
|
|
||||||
listen 80;
|
|
||||||
location / {
|
|
||||||
root /usr/share/nginx/html;
|
|
||||||
index index.html index.htm;
|
|
||||||
try_files $uri /index.html;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
284
package-lock.json
generated
284
package-lock.json
generated
@ -14,14 +14,9 @@
|
|||||||
"@mui/icons-material": "^5.15.1",
|
"@mui/icons-material": "^5.15.1",
|
||||||
"@mui/material": "^5.15.1",
|
"@mui/material": "^5.15.1",
|
||||||
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
||||||
"@mui/x-date-pickers": "^6.18.6",
|
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
"dayjs": "^1.11.10",
|
|
||||||
"js-cookie": "^3.0.5",
|
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-router-dom": "^6.21.1",
|
|
||||||
"sass": "^1.69.5",
|
|
||||||
"styled-components": "^6.1.2"
|
"styled-components": "^6.1.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
@ -1373,71 +1368,6 @@
|
|||||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
|
||||||
"integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
|
"integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
|
||||||
},
|
},
|
||||||
"node_modules/@mui/x-date-pickers": {
|
|
||||||
"version": "6.18.6",
|
|
||||||
"resolved": "https://registry.npmjs.org/@mui/x-date-pickers/-/x-date-pickers-6.18.6.tgz",
|
|
||||||
"integrity": "sha512-pqOrGPUDVY/1xXrM1hofqwgquno/SB9aG9CVS1m2Rs8hKF1VWRC+jYlEa1Qk08xKmvkia5g7NsdV/BBb+tHUZw==",
|
|
||||||
"dependencies": {
|
|
||||||
"@babel/runtime": "^7.23.2",
|
|
||||||
"@mui/base": "^5.0.0-beta.22",
|
|
||||||
"@mui/utils": "^5.14.16",
|
|
||||||
"@types/react-transition-group": "^4.4.8",
|
|
||||||
"clsx": "^2.0.0",
|
|
||||||
"prop-types": "^15.8.1",
|
|
||||||
"react-transition-group": "^4.4.5"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14.0.0"
|
|
||||||
},
|
|
||||||
"funding": {
|
|
||||||
"type": "opencollective",
|
|
||||||
"url": "https://opencollective.com/mui"
|
|
||||||
},
|
|
||||||
"peerDependencies": {
|
|
||||||
"@emotion/react": "^11.9.0",
|
|
||||||
"@emotion/styled": "^11.8.1",
|
|
||||||
"@mui/material": "^5.8.6",
|
|
||||||
"@mui/system": "^5.8.0",
|
|
||||||
"date-fns": "^2.25.0",
|
|
||||||
"date-fns-jalali": "^2.13.0-0",
|
|
||||||
"dayjs": "^1.10.7",
|
|
||||||
"luxon": "^3.0.2",
|
|
||||||
"moment": "^2.29.4",
|
|
||||||
"moment-hijri": "^2.1.2",
|
|
||||||
"moment-jalaali": "^0.7.4 || ^0.8.0 || ^0.9.0 || ^0.10.0",
|
|
||||||
"react": "^17.0.0 || ^18.0.0",
|
|
||||||
"react-dom": "^17.0.0 || ^18.0.0"
|
|
||||||
},
|
|
||||||
"peerDependenciesMeta": {
|
|
||||||
"@emotion/react": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"@emotion/styled": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"date-fns": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"date-fns-jalali": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"dayjs": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"luxon": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"moment": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"moment-hijri": {
|
|
||||||
"optional": true
|
|
||||||
},
|
|
||||||
"moment-jalaali": {
|
|
||||||
"optional": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@nodelib/fs.scandir": {
|
"node_modules/@nodelib/fs.scandir": {
|
||||||
"version": "2.1.5",
|
"version": "2.1.5",
|
||||||
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
||||||
@ -1482,14 +1412,6 @@
|
|||||||
"url": "https://opencollective.com/popperjs"
|
"url": "https://opencollective.com/popperjs"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@remix-run/router": {
|
|
||||||
"version": "1.14.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.1.tgz",
|
|
||||||
"integrity": "sha512-Qg4DMQsfPNAs88rb2xkdk03N3bjK4jgX5fR24eHCTR9q6PrhZQZ4UJBPzCHJkIpTRN1UKxx2DzjZmnC+7Lj0Ow==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@rollup/rollup-android-arm-eabi": {
|
"node_modules/@rollup/rollup-android-arm-eabi": {
|
||||||
"version": "4.9.1",
|
"version": "4.9.1",
|
||||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.1.tgz",
|
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.1.tgz",
|
||||||
@ -1829,18 +1751,6 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/anymatch": {
|
|
||||||
"version": "3.1.3",
|
|
||||||
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
|
|
||||||
"integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
|
|
||||||
"dependencies": {
|
|
||||||
"normalize-path": "^3.0.0",
|
|
||||||
"picomatch": "^2.0.4"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">= 8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/argparse": {
|
"node_modules/argparse": {
|
||||||
"version": "2.0.1",
|
"version": "2.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
|
||||||
@ -2021,14 +1931,6 @@
|
|||||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node_modules/binary-extensions": {
|
|
||||||
"version": "2.2.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
|
|
||||||
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/brace-expansion": {
|
"node_modules/brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||||
@ -2039,17 +1941,6 @@
|
|||||||
"concat-map": "0.0.1"
|
"concat-map": "0.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/braces": {
|
|
||||||
"version": "3.0.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
|
|
||||||
"integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
|
|
||||||
"dependencies": {
|
|
||||||
"fill-range": "^7.0.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/browserslist": {
|
"node_modules/browserslist": {
|
||||||
"version": "4.22.2",
|
"version": "4.22.2",
|
||||||
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
|
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
|
||||||
@ -2145,43 +2036,6 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/chokidar": {
|
|
||||||
"version": "3.5.3",
|
|
||||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
|
|
||||||
"integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
|
|
||||||
"funding": [
|
|
||||||
{
|
|
||||||
"type": "individual",
|
|
||||||
"url": "https://paulmillr.com/funding/"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"dependencies": {
|
|
||||||
"anymatch": "~3.1.2",
|
|
||||||
"braces": "~3.0.2",
|
|
||||||
"glob-parent": "~5.1.2",
|
|
||||||
"is-binary-path": "~2.1.0",
|
|
||||||
"is-glob": "~4.0.1",
|
|
||||||
"normalize-path": "~3.0.0",
|
|
||||||
"readdirp": "~3.6.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">= 8.10.0"
|
|
||||||
},
|
|
||||||
"optionalDependencies": {
|
|
||||||
"fsevents": "~2.3.2"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/chokidar/node_modules/glob-parent": {
|
|
||||||
"version": "5.1.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
|
||||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
|
||||||
"dependencies": {
|
|
||||||
"is-glob": "^4.0.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">= 6"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/clsx": {
|
"node_modules/clsx": {
|
||||||
"version": "2.0.0",
|
"version": "2.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz",
|
||||||
@ -2278,11 +2132,6 @@
|
|||||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
||||||
},
|
},
|
||||||
"node_modules/dayjs": {
|
|
||||||
"version": "1.11.10",
|
|
||||||
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
|
|
||||||
"integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
|
|
||||||
},
|
|
||||||
"node_modules/debug": {
|
"node_modules/debug": {
|
||||||
"version": "4.3.4",
|
"version": "4.3.4",
|
||||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
||||||
@ -2891,17 +2740,6 @@
|
|||||||
"node": "^10.12.0 || >=12.0.0"
|
"node": "^10.12.0 || >=12.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/fill-range": {
|
|
||||||
"version": "7.0.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
|
|
||||||
"integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
|
|
||||||
"dependencies": {
|
|
||||||
"to-regex-range": "^5.0.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/find-root": {
|
"node_modules/find-root": {
|
||||||
"version": "1.1.0",
|
"version": "1.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
|
||||||
@ -2994,6 +2832,7 @@
|
|||||||
"version": "2.3.3",
|
"version": "2.3.3",
|
||||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
|
||||||
"integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
|
"integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
|
||||||
|
"dev": true,
|
||||||
"hasInstallScript": true,
|
"hasInstallScript": true,
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"os": [
|
"os": [
|
||||||
@ -3248,11 +3087,6 @@
|
|||||||
"node": ">= 4"
|
"node": ">= 4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/immutable": {
|
|
||||||
"version": "4.3.4",
|
|
||||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.4.tgz",
|
|
||||||
"integrity": "sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA=="
|
|
||||||
},
|
|
||||||
"node_modules/import-fresh": {
|
"node_modules/import-fresh": {
|
||||||
"version": "3.3.0",
|
"version": "3.3.0",
|
||||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||||
@ -3353,17 +3187,6 @@
|
|||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/is-binary-path": {
|
|
||||||
"version": "2.1.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
|
||||||
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
|
|
||||||
"dependencies": {
|
|
||||||
"binary-extensions": "^2.0.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/is-boolean-object": {
|
"node_modules/is-boolean-object": {
|
||||||
"version": "1.1.2",
|
"version": "1.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
|
||||||
@ -3422,6 +3245,7 @@
|
|||||||
"version": "2.1.1",
|
"version": "2.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||||
"integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
|
"integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
|
||||||
|
"dev": true,
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
@ -3457,6 +3281,7 @@
|
|||||||
"version": "4.0.3",
|
"version": "4.0.3",
|
||||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
|
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
|
||||||
"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
|
"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
|
||||||
|
"dev": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"is-extglob": "^2.1.1"
|
"is-extglob": "^2.1.1"
|
||||||
},
|
},
|
||||||
@ -3485,14 +3310,6 @@
|
|||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/is-number": {
|
|
||||||
"version": "7.0.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
|
||||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=0.12.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/is-number-object": {
|
"node_modules/is-number-object": {
|
||||||
"version": "1.0.7",
|
"version": "1.0.7",
|
||||||
"resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
|
||||||
@ -3658,14 +3475,6 @@
|
|||||||
"set-function-name": "^2.0.1"
|
"set-function-name": "^2.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/js-cookie": {
|
|
||||||
"version": "3.0.5",
|
|
||||||
"resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
|
|
||||||
"integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/js-tokens": {
|
"node_modules/js-tokens": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||||
@ -3879,14 +3688,6 @@
|
|||||||
"integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
|
"integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node_modules/normalize-path": {
|
|
||||||
"version": "3.0.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
|
|
||||||
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=0.10.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/object-assign": {
|
"node_modules/object-assign": {
|
||||||
"version": "4.1.1",
|
"version": "4.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
||||||
@ -4121,17 +3922,6 @@
|
|||||||
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
|
||||||
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
|
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ=="
|
||||||
},
|
},
|
||||||
"node_modules/picomatch": {
|
|
||||||
"version": "2.3.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
|
|
||||||
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8.6"
|
|
||||||
},
|
|
||||||
"funding": {
|
|
||||||
"url": "https://github.com/sponsors/jonschlinkert"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/postcss": {
|
"node_modules/postcss": {
|
||||||
"version": "8.4.32",
|
"version": "8.4.32",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
|
||||||
@ -4254,36 +4044,6 @@
|
|||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/react-router": {
|
|
||||||
"version": "6.21.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.1.tgz",
|
|
||||||
"integrity": "sha512-W0l13YlMTm1YrpVIOpjCADJqEUpz1vm+CMo47RuFX4Ftegwm6KOYsL5G3eiE52jnJpKvzm6uB/vTKTPKM8dmkA==",
|
|
||||||
"dependencies": {
|
|
||||||
"@remix-run/router": "1.14.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14.0.0"
|
|
||||||
},
|
|
||||||
"peerDependencies": {
|
|
||||||
"react": ">=16.8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/react-router-dom": {
|
|
||||||
"version": "6.21.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.1.tgz",
|
|
||||||
"integrity": "sha512-QCNrtjtDPwHDO+AO21MJd7yIcr41UetYt5jzaB9Y1UYaPTCnVuJq6S748g1dE11OQlCFIQg+RtAA1SEZIyiBeA==",
|
|
||||||
"dependencies": {
|
|
||||||
"@remix-run/router": "1.14.1",
|
|
||||||
"react-router": "6.21.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14.0.0"
|
|
||||||
},
|
|
||||||
"peerDependencies": {
|
|
||||||
"react": ">=16.8",
|
|
||||||
"react-dom": ">=16.8"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/react-transition-group": {
|
"node_modules/react-transition-group": {
|
||||||
"version": "4.4.5",
|
"version": "4.4.5",
|
||||||
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
|
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
|
||||||
@ -4299,17 +4059,6 @@
|
|||||||
"react-dom": ">=16.6.0"
|
"react-dom": ">=16.6.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/readdirp": {
|
|
||||||
"version": "3.6.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
|
|
||||||
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
|
|
||||||
"dependencies": {
|
|
||||||
"picomatch": "^2.2.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8.10.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/reflect.getprototypeof": {
|
"node_modules/reflect.getprototypeof": {
|
||||||
"version": "1.0.4",
|
"version": "1.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz",
|
||||||
@ -4486,22 +4235,6 @@
|
|||||||
"url": "https://github.com/sponsors/ljharb"
|
"url": "https://github.com/sponsors/ljharb"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/sass": {
|
|
||||||
"version": "1.69.5",
|
|
||||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz",
|
|
||||||
"integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==",
|
|
||||||
"dependencies": {
|
|
||||||
"chokidar": ">=3.0.0 <4.0.0",
|
|
||||||
"immutable": "^4.0.0",
|
|
||||||
"source-map-js": ">=0.6.2 <2.0.0"
|
|
||||||
},
|
|
||||||
"bin": {
|
|
||||||
"sass": "sass.js"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=14.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/scheduler": {
|
"node_modules/scheduler": {
|
||||||
"version": "0.23.0",
|
"version": "0.23.0",
|
||||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
|
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz",
|
||||||
@ -4766,17 +4499,6 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/to-regex-range": {
|
|
||||||
"version": "5.0.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
|
||||||
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
|
||||||
"dependencies": {
|
|
||||||
"is-number": "^7.0.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=8.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/tslib": {
|
"node_modules/tslib": {
|
||||||
"version": "2.6.2",
|
"version": "2.6.2",
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
|
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
|
||||||
|
|||||||
@ -16,15 +16,9 @@
|
|||||||
"@mui/icons-material": "^5.15.1",
|
"@mui/icons-material": "^5.15.1",
|
||||||
"@mui/material": "^5.15.1",
|
"@mui/material": "^5.15.1",
|
||||||
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
||||||
"@mui/x-date-pickers": "^6.18.6",
|
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
"dayjs": "^1.11.10",
|
|
||||||
"js-cookie": "^3.0.5",
|
|
||||||
|
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-router-dom": "^6.21.1",
|
|
||||||
"sass": "^1.69.5",
|
|
||||||
"styled-components": "^6.1.2"
|
"styled-components": "^6.1.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
#root {
|
#root {
|
||||||
width: 79%;
|
max-width: 1280px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|||||||
55
src/App.jsx
55
src/App.jsx
@ -1,38 +1,43 @@
|
|||||||
|
import { useState } from 'react'
|
||||||
|
import reactLogo from './assets/react.svg'
|
||||||
|
import viteLogo from '/vite.svg'
|
||||||
import './App.css'
|
import './App.css'
|
||||||
|
import FetchUtils from './components/fetchUtils/FetchUtils'
|
||||||
|
import TableMeets from './components/TableMeets'
|
||||||
|
|
||||||
// import FetchUtils from './components/utils/FetchUtils.jsx'
|
const events = [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
date: '10.10.2022',
|
||||||
|
time: '14:00',
|
||||||
|
title: 'Мероприятие 1',
|
||||||
|
speaker: 'Спикер 1',
|
||||||
|
avatar: 'speaker1.jpg',
|
||||||
|
description: 'Описание мероприятия 1',
|
||||||
|
isExpanded: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
date: '11.10.2022',
|
||||||
|
time: '15:30',
|
||||||
|
title: 'Мероприятие 2',
|
||||||
|
speaker: 'Спикер 2',
|
||||||
|
avatar: 'speaker2.jpg',
|
||||||
|
description: 'Описание мероприятия 2',
|
||||||
|
isExpanded: true,
|
||||||
|
},
|
||||||
|
// Добавьте другие мероприятия сюда
|
||||||
|
];
|
||||||
|
|
||||||
// import FetchUtils from './components/fetchUtils/FetchUtils.jsx'
|
|
||||||
|
|
||||||
// import TableMeets from './components/fetchUtils/TableMeets.jsx'
|
|
||||||
import AddUsers from './Components/AddUsersPage/index.jsx'
|
|
||||||
import { BrowserRouter, Routes, Route } from "react-router-dom";
|
|
||||||
import HomePage from "./Components/HomePage/index.jsx";
|
|
||||||
import MeetPage from "./Components/MeetPage/index.jsx";
|
|
||||||
import MeetAuthPage from "./Components/MeetAuthPage/index.jsx";
|
|
||||||
import ProfilePage from './Components/profilePage/index.jsx';
|
|
||||||
import MeetAuthPageAdmin from './Components/MeetAuthPageAdmin/index.jsx'
|
|
||||||
import HomeAuthPageAdmin from './Components/HomePageAdmin/index.jsx'
|
|
||||||
|
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
|
const [count, setCount] = useState(0)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{/* <FetchUtils /> */}
|
{/* <FetchUtils /> */}
|
||||||
|
<TableMeets events={ events } />
|
||||||
<BrowserRouter>
|
|
||||||
<Routes>
|
|
||||||
<Route path="/addUser" element={<AddUsers />}/>
|
|
||||||
<Route path="/" element={<HomePage />}/>
|
|
||||||
<Route path="/firstMeet" element={<MeetPage />}/>
|
|
||||||
<Route path="/firstMeetAuth" element={<MeetAuthPage />}/>
|
|
||||||
<Route path='/profile' element={<ProfilePage />}/>
|
|
||||||
<Route path='/adminMeets' element={<MeetAuthPageAdmin/>}/>
|
|
||||||
<Route path='/admin' element={<HomeAuthPageAdmin/>}/>
|
|
||||||
</Routes>
|
|
||||||
</BrowserRouter>
|
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,156 +0,0 @@
|
|||||||
import styles from './style.module.scss';
|
|
||||||
import { useState } from 'react';
|
|
||||||
import avatar from '../../img/profilePage/avatar.png';
|
|
||||||
import Header from '../Header';
|
|
||||||
import Modal from '@mui/material/Modal';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
import del from '../../img/AddUsers/delete.png';
|
|
||||||
import perm from '../../img/AddUsers/permission.png';
|
|
||||||
import newAvatar from '../../img/AddUsers/newAvatar.png';
|
|
||||||
import Users from '../post/Users';
|
|
||||||
const style = {
|
|
||||||
position: 'absolute',
|
|
||||||
top: '50%',
|
|
||||||
left: '50%',
|
|
||||||
transform: 'translate(-50%, -50%)',
|
|
||||||
width: "46%",
|
|
||||||
height: "60vh",
|
|
||||||
bgcolor: 'background.paper',
|
|
||||||
borderRadius: '25px',
|
|
||||||
boxShadow: 24,
|
|
||||||
p: 4,
|
|
||||||
};
|
|
||||||
const AddUsers = () => {
|
|
||||||
const [open, setOpen] = useState(false);
|
|
||||||
const handleOpen = () => setOpen(true);
|
|
||||||
const handleClose = () => setOpen(false);
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Header></Header>
|
|
||||||
|
|
||||||
|
|
||||||
<section className={styles.addUsers__container}>
|
|
||||||
<input className={styles.addUsers__search} type='text' placeholder='Найти мероприятие'></input>
|
|
||||||
<div className={styles.select__container}>
|
|
||||||
<select className={styles.select} name="time__meeting">
|
|
||||||
<option value="">роль пользователя</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.addUser__container}>
|
|
||||||
<div className={styles.addUser__cards_container}>
|
|
||||||
<div className={styles.addUser__card_container}>
|
|
||||||
<div onClick={handleOpen} className={styles.round}>+</div>
|
|
||||||
<div className={styles.addUser__card_text}>Добавить пользователя</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_container}>
|
|
||||||
<div className={styles.profile__user_img_container}>
|
|
||||||
<img src={avatar} className={styles.profile__user_img}></img>
|
|
||||||
<div className={styles.profile__user_role}>Участник</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_info_container}>
|
|
||||||
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
|
||||||
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
|
||||||
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
|
||||||
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
|
||||||
<div className={styles.profile__user_progress_container}>
|
|
||||||
<span>0</span>
|
|
||||||
<span className={styles.profile__user_progress_line}></span>
|
|
||||||
<span>1</span>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
|
|
||||||
<div className={styles.feautures}>Отправлено</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_container}>
|
|
||||||
<div className={styles.profile__user_img_container}>
|
|
||||||
<img src={avatar} className={styles.profile__user_img}></img>
|
|
||||||
<div className={styles.profile__user_role}>Участник</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_info_container}>
|
|
||||||
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
|
||||||
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
|
||||||
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
|
||||||
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
|
||||||
<div className={styles.profile__user_progress_container}>
|
|
||||||
<span>0</span>
|
|
||||||
<span className={styles.profile__user_progress_line}></span>
|
|
||||||
<span>1</span>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
|
|
||||||
<div className={styles.permission_container}><img src={perm} className={styles.permission_img}></img></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_container}>
|
|
||||||
<div className={styles.profile__user_img_container}>
|
|
||||||
<img src={avatar} className={styles.profile__user_img}></img>
|
|
||||||
<div className={styles.profile__user_role}>Участник</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_info_container}>
|
|
||||||
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
|
||||||
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
|
||||||
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
|
||||||
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
|
||||||
<div className={styles.profile__user_progress_container}>
|
|
||||||
<span>0</span>
|
|
||||||
<span className={styles.profile__user_progress_line}></span>
|
|
||||||
<span>1</span>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.delete_container}><img src={del} className={styles.delete_img}></img></div>
|
|
||||||
<div className={styles.permission_container}><img src={perm} className={styles.permission_img}></img></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Modal
|
|
||||||
open={open}
|
|
||||||
onClose={handleClose}
|
|
||||||
aria-labelledby="modal-modal-title"
|
|
||||||
aria-describedby="modal-modal-description"
|
|
||||||
>
|
|
||||||
<Box sx={style}>
|
|
||||||
<div className={styles.addModal__title_container}>
|
|
||||||
<div className={styles.addModal__title}>Добавление пользователя</div>
|
|
||||||
<div onClick={handleClose} className={styles.addModal__close}><div className={styles.addModal__close_img}>+</div></div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.addModal_user_container}>
|
|
||||||
<div className={styles.addModal_user_img_container}>
|
|
||||||
<form className={styles.addModal_form} method="post" encType="multipart/form-data">
|
|
||||||
<div className={styles.input_file_row}>
|
|
||||||
<label className={styles.input_file}>
|
|
||||||
<input type="file" name="file[]" multiple accept="image/*"/>
|
|
||||||
<span><img src={newAvatar}></img></span>
|
|
||||||
</label>
|
|
||||||
<div className={styles.input_file_list}></div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div className={styles.addModal_user_input_container}>
|
|
||||||
<input placeholder='ФИО специалиста' className={styles.addModal_user}></input>
|
|
||||||
<input placeholder='Должность' className={styles.addModal_user}></input>
|
|
||||||
<select className={styles.addModal_user_select}>
|
|
||||||
<option>Пользователь</option>
|
|
||||||
<option>Администратор</option>
|
|
||||||
</select>
|
|
||||||
<input placeholder='Почта' className={styles.addModal_user}></input>
|
|
||||||
<input placeholder='TG' className={styles.addModal_user}></input>
|
|
||||||
<div className={styles.modal__question_button_container}>
|
|
||||||
<button className={styles.modal__question_button + ' ' + styles.yellow}>Добавить</button>
|
|
||||||
<button className={styles.modal__question_button + ' ' + styles.gray}>Отменить</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Box>
|
|
||||||
</Modal>
|
|
||||||
<Users></Users>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</>
|
|
||||||
|
|
||||||
|
|
||||||
)
|
|
||||||
}
|
|
||||||
export default AddUsers;
|
|
||||||
@ -1,538 +0,0 @@
|
|||||||
.select {
|
|
||||||
margin-right: 50px;
|
|
||||||
height: 35px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 200px;
|
|
||||||
padding-left: 10px;
|
|
||||||
option {
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
width: 93%;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.addUsers {
|
|
||||||
|
|
||||||
|
|
||||||
&__search {
|
|
||||||
margin-top: 150px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
height: 70px;
|
|
||||||
width: 100%;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
padding-left: 40px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.profile {
|
|
||||||
&__container {
|
|
||||||
margin-top: 200px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
&__user {
|
|
||||||
&_img {
|
|
||||||
width: 180px;
|
|
||||||
height: 180px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-right: 50px;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
width: 48%;
|
|
||||||
margin-bottom: 110px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
&_info_container {
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 18px;
|
|
||||||
display: flex;
|
|
||||||
text-align: left;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
&_fullName {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 26px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
span {
|
|
||||||
color: #FD0;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
&_spaciality {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_socialMedia {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 18px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_email {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 18px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_role {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
&_progress {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
&_line {
|
|
||||||
height: 2px;
|
|
||||||
width: 140%;
|
|
||||||
background: linear-gradient(90deg, #ffdd00,#d0d2d8);
|
|
||||||
padding: 0 30px 0 30px;
|
|
||||||
margin: 0 10px 0 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.addUser {
|
|
||||||
|
|
||||||
|
|
||||||
&__cards_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 120px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
}
|
|
||||||
&__card {
|
|
||||||
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 48%;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
margin-bottom: 110px;
|
|
||||||
}
|
|
||||||
&_text {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 34px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.round {
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 80%;
|
|
||||||
height: 50px;
|
|
||||||
border: 1px solid var(--yellow, #FD0);
|
|
||||||
background: var(--yellow, #FD0);
|
|
||||||
width: 50px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 36px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
.feautures {
|
|
||||||
width: 90px;
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
bottom: 40px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-family: Montserrat;
|
|
||||||
align-items: center;
|
|
||||||
color: #60AD1E;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 16px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
background: #E7FFD2;
|
|
||||||
height: 15px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
.permission {
|
|
||||||
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
bottom: 40px;
|
|
||||||
}
|
|
||||||
&_img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.delete {
|
|
||||||
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
position: absolute;
|
|
||||||
top: 40px;
|
|
||||||
right: 0px;
|
|
||||||
}
|
|
||||||
&_img {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.addModal {
|
|
||||||
|
|
||||||
|
|
||||||
&__close {
|
|
||||||
cursor: pointer;
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
position: absolute;
|
|
||||||
height: 96px;
|
|
||||||
height: 45px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 78.625px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 200;
|
|
||||||
line-height: normal;
|
|
||||||
top: 13px;
|
|
||||||
right: 50px;
|
|
||||||
}
|
|
||||||
&__title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 36px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&_form {
|
|
||||||
margin-top: 100px;
|
|
||||||
height: 100%;
|
|
||||||
width: 30%;
|
|
||||||
}
|
|
||||||
&_user {
|
|
||||||
border-radius: 7.794px;
|
|
||||||
border: 0.779px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
height: 35px;
|
|
||||||
width: 200px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
text-align: center;
|
|
||||||
&_select {
|
|
||||||
border-radius: 7.794px;
|
|
||||||
border: 0.779px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
height: 40px;
|
|
||||||
width: 210px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
&_input_container {
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 100px;
|
|
||||||
margin-left: 10%;
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
height: 96%;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
align-items: start;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.input_file_row {
|
|
||||||
display: inline-block;
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
}
|
|
||||||
.input_file {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.input_file span {
|
|
||||||
margin-top: 159px;
|
|
||||||
padding-top: 200px;
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
cursor: pointer;
|
|
||||||
outline: none;
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 14px;
|
|
||||||
vertical-align: middle;
|
|
||||||
color: rgb(255 255 255);
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 4px;
|
|
||||||
line-height: 22px;
|
|
||||||
height: 40px;
|
|
||||||
padding: 10px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: none;
|
|
||||||
margin: 0;
|
|
||||||
transition: background-color 0.2s;
|
|
||||||
}
|
|
||||||
.input_file input[type=file] {
|
|
||||||
position: absolute;
|
|
||||||
z-index: -1;
|
|
||||||
opacity: 0;
|
|
||||||
display: block;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Focus */
|
|
||||||
// .input_file input[type=file]:focus + span {
|
|
||||||
// box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
|
|
||||||
// }
|
|
||||||
|
|
||||||
/* Hover/active */
|
|
||||||
|
|
||||||
|
|
||||||
/* Disabled */
|
|
||||||
|
|
||||||
|
|
||||||
/* Список c превью */
|
|
||||||
.input_file_list {
|
|
||||||
padding: 10px 0;
|
|
||||||
}
|
|
||||||
.input_file_list_item {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 15px 15px;
|
|
||||||
width: 150px;
|
|
||||||
vertical-align: top;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.input_file_list_item img {
|
|
||||||
width: 150px;
|
|
||||||
}
|
|
||||||
.input_file_list_name {
|
|
||||||
text-align: center;
|
|
||||||
display: block;
|
|
||||||
font-size: 12px;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.input_file_list_remove {
|
|
||||||
color: #fff;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
position: absolute;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
top: 5px;
|
|
||||||
right: 5px;
|
|
||||||
background: #ff0202;
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 16px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
.modal {
|
|
||||||
background-color: #fff;
|
|
||||||
position: absolute;
|
|
||||||
height: 400px;
|
|
||||||
width: 300px;
|
|
||||||
&__container {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
height: 5000px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: rgba(0, 0, 0, 0.40);
|
|
||||||
}
|
|
||||||
&__title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 48px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__line {
|
|
||||||
height: 1px;
|
|
||||||
width: 100%;
|
|
||||||
stroke-width: 1px;
|
|
||||||
background-color: #D0D2D8;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 40px;
|
|
||||||
}
|
|
||||||
&__close {
|
|
||||||
cursor: pointer;
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
position: absolute;
|
|
||||||
height: 96px;
|
|
||||||
height: 45px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 58.625px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 200;
|
|
||||||
line-height: normal;
|
|
||||||
top: 0px;
|
|
||||||
right: 50px;
|
|
||||||
}
|
|
||||||
&__question {
|
|
||||||
&_number {
|
|
||||||
margin-top: 50px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
span {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
&_containerSecond {
|
|
||||||
width: 48%;
|
|
||||||
height: 250px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
&_user {
|
|
||||||
&_img {
|
|
||||||
margin-right: 25px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
align-items:center;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_descr {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 18px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_time {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_like {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin: 5px 0 0 10px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_input {
|
|
||||||
margin-top: 40px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 100%;
|
|
||||||
height: 235px;
|
|
||||||
padding-top: 20px;
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
|
||||||
&_containerThird {
|
|
||||||
margin-right: 3%;
|
|
||||||
}
|
|
||||||
&_button {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.yellow {
|
|
||||||
border-radius: 10px;
|
|
||||||
background-color: #60AD1E;
|
|
||||||
width: 190px;
|
|
||||||
height: 50px;
|
|
||||||
margin-right: 30px;
|
|
||||||
}
|
|
||||||
.gray {
|
|
||||||
border-radius: 10px;
|
|
||||||
background: var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 140px;
|
|
||||||
height: 40px;
|
|
||||||
}
|
|
||||||
@ -1,10 +0,0 @@
|
|||||||
import React from "react"
|
|
||||||
import styles from "./style.module.scss";
|
|
||||||
|
|
||||||
const BeingPage = () => {
|
|
||||||
return (
|
|
||||||
<div>Hello world</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default BeingPage
|
|
||||||
@ -1 +0,0 @@
|
|||||||
/*# sourceMappingURL=style.module.css.map */
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sources":[],"names":[],"mappings":"","file":"style.module.css"}
|
|
||||||
@ -1,16 +0,0 @@
|
|||||||
|
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
|
|
||||||
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
|
|
||||||
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
|
|
||||||
import { DateCalendar } from '@mui/x-date-pickers/DateCalendar';
|
|
||||||
|
|
||||||
export default function DateCalendarFormProps() {
|
|
||||||
return (
|
|
||||||
<LocalizationProvider dateAdapter={AdapterDayjs}>
|
|
||||||
<DemoContainer components={['DateCalendar']}>
|
|
||||||
<DateCalendar defaultValue={dayjs('2023-12-24')} readOnly />
|
|
||||||
</DemoContainer>
|
|
||||||
</LocalizationProvider>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,34 +0,0 @@
|
|||||||
import './style.module.scss';
|
|
||||||
|
|
||||||
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
|
|
||||||
const httpApiMethods = new HttpApiMethods()
|
|
||||||
function extractDateTime(dateString) {
|
|
||||||
const dateTime = new Date(dateString);
|
|
||||||
const date = dateTime.toLocaleDateString();
|
|
||||||
const time = dateTime.toLocaleTimeString();
|
|
||||||
|
|
||||||
return { date, time };
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const Card = (item) => {
|
|
||||||
|
|
||||||
console.log(item);
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className='event_card' >
|
|
||||||
<div className="event-card__photo"><img className='img' src={httpApiMethods.APIURL_FILES + item.speackerImage} alt="{item.speackerImage}" /></div>
|
|
||||||
<div className="taggs">
|
|
||||||
<div className='tagged'>{item.tags}</div>
|
|
||||||
<div className="feautures">{item.type}</div>
|
|
||||||
</div>
|
|
||||||
<h4 className="event-card__title">{item.title}</h4>
|
|
||||||
<p className="event-card__date">{extractDateTime(item.time).date}, в {extractDateTime(item.time).time} по Московскому времени</p>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
export default Card;
|
|
||||||
@ -1,73 +0,0 @@
|
|||||||
.event_card {
|
|
||||||
width: 292px;
|
|
||||||
height: 626px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
margin-top: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wrapp {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-start;
|
|
||||||
/* max-width: 1521px; */
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_date {
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
/* title */
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card__photo {
|
|
||||||
width: 292px;
|
|
||||||
height: 340px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
background: #D9D9D9;
|
|
||||||
margin-bottom: 26px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.feautures {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-family: Montserrat;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 8px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: #E7FFD2;
|
|
||||||
height: 15px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tagged {
|
|
||||||
display: inline-flex;
|
|
||||||
padding: 10px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
gap: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_text, #888);
|
|
||||||
}
|
|
||||||
|
|
||||||
.taggs {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}/*# sourceMappingURL=style.module.css.map */
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sources":["style.module.scss","style.module.css"],"names":[],"mappings":"AAAA;EACI,YAAA;EACA,aAAA;EACA,cAAA;EACA,iBAAA;ACCJ;;ADEA;EACI,aAAA;EACA,2BAAA;EACA,uBAAA;ACCJ;;ADEA;EACI,gBAAA;ACCJ;;ADEA;EACI,6BAAA;EAEJ,UAAA;EACA,uBAAA;EACA,eAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;ACAA;;ADGA;EACI,YAAA;EACA,aAAA;EACA,cAAA;EACJ,mBAAA;EACA,mBAAA;ACAA;;ADGA;EACI,WAAA;EAEA,uBAAA;EACA,eAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;ACDJ;;ADGA;EAEA,aAAA;EACA,uBAAA;EACA,uBAAA;EACA,mBAAA;EACA,cAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;EACA,mBAAA;EACA,mBAAA;EACA,YAAA;EACA,aAAA;ACDA;;ADIA;EACI,oBAAA;EACJ,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,SAAA;EACA,mBAAA;EACA,wCAAA;ACDA;;ADGA;EACI,aAAA;EACA,8BAAA;ACAJ","file":"style.module.css"}
|
|
||||||
@ -1,74 +0,0 @@
|
|||||||
.event_card {
|
|
||||||
width: 292px;
|
|
||||||
height: 626px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
margin-top: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wrapp {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-start;
|
|
||||||
/* max-width: 1521px; */
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_date {
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
|
|
||||||
/* title */
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card__photo {
|
|
||||||
width: 292px;
|
|
||||||
height: 340px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
background: #D9D9D9;
|
|
||||||
margin-bottom: 26px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_title {
|
|
||||||
color: #000;
|
|
||||||
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
.feautures {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-family: Montserrat;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 8px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: #E7FFD2;
|
|
||||||
height: 15px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tagged {
|
|
||||||
display: inline-flex;
|
|
||||||
padding: 10px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
gap: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_text, #888);
|
|
||||||
}
|
|
||||||
.taggs {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
import logo from '../../img/headerImg/header.png';
|
|
||||||
import google from '../../img/headerImg/google.png';
|
|
||||||
|
|
||||||
import icon from '../../img/headerImg/Icon.png';
|
|
||||||
import Menu from '../Menu'
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
|
|
||||||
|
|
||||||
import { useState } from 'react';
|
|
||||||
|
|
||||||
const Header = () => {
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const handleHome = () => {
|
|
||||||
navigate('/');
|
|
||||||
}
|
|
||||||
const isAuth = useState(true)[0];
|
|
||||||
console.log(isAuth)
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{(isAuth ? (
|
|
||||||
<div className={styles.header__container}>
|
|
||||||
<header className={styles.header}>
|
|
||||||
<div className={styles.header__logo} onClick={handleHome} ><img onClick={handleHome} src={logo} alt="logo"></img></div>
|
|
||||||
<div className={styles.header_img_container}> <img className={styles.header_img} src={icon}></img> <Menu></Menu></div>
|
|
||||||
</header>
|
|
||||||
</div>
|
|
||||||
) :
|
|
||||||
(
|
|
||||||
<div className={styles.header__container}>
|
|
||||||
<header className={styles.header}>
|
|
||||||
<div className={styles.header__logo} onClick={handleHome} ><img onClick={handleHome} src={logo} alt="logo"></img></div>
|
|
||||||
<button className={styles.header__button}>ВХОД <img className={styles.header__button_img} src={google}></img></button>
|
|
||||||
</header>
|
|
||||||
</div>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
}
|
|
||||||
export default Header;
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
.header {
|
|
||||||
height: 75px;
|
|
||||||
width: 80%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 150px;
|
|
||||||
position: fixed;
|
|
||||||
top: 0px;
|
|
||||||
background-color: #fff;
|
|
||||||
left: 0px;
|
|
||||||
z-index: 20;
|
|
||||||
}
|
|
||||||
&__logo {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
&__button {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: #FFED00;
|
|
||||||
width: 200px;
|
|
||||||
height: 42px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 25px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
position: relative;
|
|
||||||
&_img {
|
|
||||||
|
|
||||||
width: 55px;
|
|
||||||
margin-right: 40px;
|
|
||||||
height: 55px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,94 +1,29 @@
|
|||||||
import Header from "../Header";
|
import Header from "../Header";
|
||||||
import styles from "./style.module.scss";
|
import styles from "./style.module.scss";
|
||||||
// import TableMeets from '../TableMeets/TableMeets'
|
import arrow from '../../img/homePage/downArrow.png';
|
||||||
// import EditForm from "../edit/EditMeetsForm";
|
|
||||||
// import PostForm from "../post/Meets";
|
|
||||||
// import Users from "../post/Users";
|
|
||||||
// import User from "../get/User";
|
|
||||||
// import Questions from "../post/Questions";
|
|
||||||
// import { GetQuestions } from "../get/Questions";
|
|
||||||
|
|
||||||
|
|
||||||
import muza from '../../img/homePage/muza.png';
|
|
||||||
import Home from "../Home/Home";
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
const APIURL = ''
|
|
||||||
|
|
||||||
// const events = [
|
|
||||||
// {
|
|
||||||
// id: 1,
|
|
||||||
// date: '10.10.2022',
|
|
||||||
// time: '14:00',
|
|
||||||
// title: 'Мероприятие 1',
|
|
||||||
// speaker: 'Спикер 1',
|
|
||||||
// avatar: 'speaker1.jpg',
|
|
||||||
// description: 'Описание мероприятия 1',
|
|
||||||
// isExpanded: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// id: 2,
|
|
||||||
// date: '11.10.2022',
|
|
||||||
// time: '15:30',
|
|
||||||
// title: 'Мероприятие 2',
|
|
||||||
// speaker: 'Спикер 2',
|
|
||||||
// avatar: 'speaker2.jpg',
|
|
||||||
// description: 'Описание мероприятия 2',
|
|
||||||
// isExpanded: true,
|
|
||||||
// },
|
|
||||||
// // Добавьте другие мероприятия сюда
|
|
||||||
// ];
|
|
||||||
const HomePage = () => {
|
const HomePage = () => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
||||||
<Header></Header>
|
<Header></Header>
|
||||||
<div className={styles.muza_img_container}><img src={muza} alt='muza' className={styles.muza_img}></img></div>
|
|
||||||
<section className={styles.muza__container}>
|
|
||||||
|
|
||||||
<div className={styles.muza__title}>МУЗА</div>
|
|
||||||
<div className={styles.muza__descr_container}>
|
|
||||||
<div className={styles.muza__descr}>Платформа для проведения well-being мероприятий</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<section className={styles.meeting__container}>
|
<section className={styles.meeting__container}>
|
||||||
<input className={styles.meeting__inputs} placeholder="Найти мероприятие"></input>
|
<div className={styles.meeting__cards}>
|
||||||
<div className={styles.container}>
|
<div className={styles.meeting__card}>
|
||||||
<div className={styles.select__container}>
|
<div className={styles.data__container}>
|
||||||
<select className={styles.select} name="time__meeting">
|
<div className={styles.data__time}>01.01.1990</div>
|
||||||
<option value="">Время мироприятия</option>
|
<div className={styles.data}>00:00</div>
|
||||||
</select>
|
</div>
|
||||||
<select className={styles.select} name="type__meeting">
|
<div className={styles.meeting__name}>
|
||||||
<option value="">Тип мероприятия</option>
|
Название мероприятия
|
||||||
</select>
|
</div>
|
||||||
|
<div className={styles.meeting__downArrow}><img src={arrow} alt="arrow"></img></div>
|
||||||
|
<div className={styles.blackLine}></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.NewContainer}>
|
|
||||||
<div className={styles.search_container}>
|
|
||||||
<div className={styles.search__descr}>100 мероприятий</div>
|
|
||||||
<select className={styles.select} name="type__meeting">
|
|
||||||
<option value="">Тип мероприятия</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.cards__container}>
|
|
||||||
<div className={styles.card}></div>
|
|
||||||
</div>
|
|
||||||
{/* <Questions></Questions> */}
|
|
||||||
<Home></Home>
|
|
||||||
|
|
||||||
|
|
||||||
{/* <Users></Users> */}
|
|
||||||
|
|
||||||
{/* <GetQuestions></GetQuestions> */}
|
|
||||||
{/* <Users></Users> */}
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1,96 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.muza {
|
|
||||||
&__container {
|
|
||||||
height: 780px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 100%;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
&_img {
|
|
||||||
position: absolute;
|
|
||||||
left: 0px;
|
|
||||||
top: 300px;
|
|
||||||
height: 480px;
|
|
||||||
}
|
|
||||||
&__title {
|
|
||||||
margin-top: 150px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 143.016px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
width: 90%;
|
|
||||||
z-index: 10;
|
|
||||||
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
margin-top: 100px;
|
|
||||||
margin-left: 70px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 46px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
width: 60%;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.meeting {
|
|
||||||
&__container {
|
|
||||||
height: 1400px;
|
|
||||||
}
|
|
||||||
&__inputs {
|
|
||||||
width: 90%;
|
|
||||||
height: 46px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid #000;
|
|
||||||
padding-left: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
.select {
|
|
||||||
margin-right: 50px;
|
|
||||||
height: 35px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 200px;
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
width: 93%;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.NewContainer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
.search_container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.search__descr {
|
|
||||||
margin-right: 25px;
|
|
||||||
}
|
|
||||||
@ -1,87 +0,0 @@
|
|||||||
import Header from "../Header";
|
|
||||||
import styles from "./style.module.scss";
|
|
||||||
import TableMeets from '../TableMeets/TableMeets'
|
|
||||||
// import Home from "../Home/Home";
|
|
||||||
// import FetchUtils from "../utils/FetchUtils";
|
|
||||||
// import EditForm from "../edit/EditForm";
|
|
||||||
// import PostForm from "../post/PostForm";
|
|
||||||
// import GetMeets from '../get/Meets';
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
import Users from "../post/Users";
|
|
||||||
const APIURL = ''
|
|
||||||
|
|
||||||
// const events = [
|
|
||||||
// {
|
|
||||||
// id: 1,
|
|
||||||
// date: '10.10.2022',
|
|
||||||
// time: '14:00',
|
|
||||||
// title: 'Мероприятие 1',
|
|
||||||
// speaker: 'Спикер 1',
|
|
||||||
// avatar: 'speaker1.jpg',
|
|
||||||
// description: 'Описание мероприятия 1',
|
|
||||||
// isExpanded: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// id: 2,
|
|
||||||
// date: '11.10.2022',
|
|
||||||
// time: '15:30',
|
|
||||||
// title: 'Мероприятие 2',
|
|
||||||
// speaker: 'Спикер 2',
|
|
||||||
// avatar: 'speaker2.jpg',
|
|
||||||
// description: 'Описание мероприятия 2',
|
|
||||||
// isExpanded: true,
|
|
||||||
// },
|
|
||||||
// // Добавьте другие мероприятия сюда
|
|
||||||
// ];
|
|
||||||
const HomePage = () => {
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const handleMeet = () => {
|
|
||||||
navigate('/adminMeets');
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Header></Header>
|
|
||||||
<section className={styles.muza__container}>
|
|
||||||
<button onClick={handleMeet} className={styles.muza__container_button}>Создать мероприятие</button>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<section className={styles.meeting__container}>
|
|
||||||
<input className={styles.meeting__inputs} placeholder="Найти мероприятие"></input>
|
|
||||||
<div className={styles.container}>
|
|
||||||
<div className={styles.select__container}>
|
|
||||||
<select className={styles.select} name="time__meeting">
|
|
||||||
<option value="">Время мироприятия</option>
|
|
||||||
</select>
|
|
||||||
<select className={styles.select} name="type__meeting">
|
|
||||||
<option value="">Тип мероприятия</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.NewContainer}>
|
|
||||||
<div className={styles.search_container}>
|
|
||||||
<div className={styles.search__descr}>100 мероприятий</div>
|
|
||||||
<select className={styles.select} name="type__meeting">
|
|
||||||
<option value="">Тип мероприятия</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.cards__container}>
|
|
||||||
<div className={styles.card}></div>
|
|
||||||
</div>
|
|
||||||
<Users></Users>
|
|
||||||
{/* <Home></Home> */}
|
|
||||||
{/* <FetchUtils></FetchUtils> */}
|
|
||||||
{/* <PostForm /> */}
|
|
||||||
{/* <EditForm /> */}
|
|
||||||
</section>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
|
||||||
|
|
||||||
|
|
||||||
)
|
|
||||||
}
|
|
||||||
export default HomePage;
|
|
||||||
@ -1,102 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.muza {
|
|
||||||
&__container {
|
|
||||||
height: 400px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 100%;
|
|
||||||
&_button {
|
|
||||||
margin-top: 200px;
|
|
||||||
border-radius: 15px;
|
|
||||||
background: var(--linear, #FD0);
|
|
||||||
width: 60%;
|
|
||||||
height: 130px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 40px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&__title {
|
|
||||||
margin-top: 150px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 143.016px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
width: 90%;
|
|
||||||
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
margin-top: 50px;
|
|
||||||
margin-left: 70px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 46px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
width: 60%;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.meeting {
|
|
||||||
&__container {
|
|
||||||
height: 1400px;
|
|
||||||
}
|
|
||||||
&__inputs {
|
|
||||||
width: 90%;
|
|
||||||
height: 46px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid #000;
|
|
||||||
padding-left: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
.select {
|
|
||||||
margin-right: 50px;
|
|
||||||
height: 35px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 200px;
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
width: 93%;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.NewContainer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
.search_container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.search__descr {
|
|
||||||
margin-right: 25px;
|
|
||||||
}
|
|
||||||
@ -1,263 +0,0 @@
|
|||||||
import Header from "../Header";
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
import clock from '../../img/MeetPage/Clock.png';
|
|
||||||
import globe from '../../img/MeetPage/Globe.png';
|
|
||||||
import avatar from '../../img/MeetPage/avatar.png';
|
|
||||||
import like from '../../img/MeetPage/Facebook.png';
|
|
||||||
import Card from "../Card";
|
|
||||||
import Grid from '@mui/material/Grid';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
// import { useState, CSSProperties, useEffect, useRef } from "react";
|
|
||||||
import newAvatar from '../../img/MeetPage/newAvatar.png';
|
|
||||||
import vk from '../../img/MeetPage/Vk.png';
|
|
||||||
import tg from '../../img/MeetPage/Telegram.png';
|
|
||||||
import book from '../../img/MeetPage/Book.png';
|
|
||||||
import * as React from 'react';
|
|
||||||
import Modal from '@mui/material/Modal';
|
|
||||||
|
|
||||||
const style = {
|
|
||||||
position: 'absolute',
|
|
||||||
top: '50%',
|
|
||||||
left: '50%',
|
|
||||||
transform: 'translate(-50%, -50%)',
|
|
||||||
width: "56%",
|
|
||||||
height: "80vh",
|
|
||||||
bgcolor: 'background.paper',
|
|
||||||
borderRadius: '25px',
|
|
||||||
boxShadow: 24,
|
|
||||||
p: 4,
|
|
||||||
};
|
|
||||||
const MeetPage = () => {
|
|
||||||
|
|
||||||
const [open, setOpen] = React.useState(false);
|
|
||||||
const handleOpen = () => setOpen(true);
|
|
||||||
const handleClose = () => setOpen(false);
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Header></Header>
|
|
||||||
|
|
||||||
<section className={styles.meets}>
|
|
||||||
<div className={styles.meets__mainInfo_container}>
|
|
||||||
<span className={styles.meets__mainInfo_descr}>Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»</span>
|
|
||||||
<span className={styles.meets__mainInfo_type}>Психология</span>
|
|
||||||
<div className={styles.meets__mainInfo_status}><img className={styles.meets__mainInfo_status_img} src={clock} alt="clock"></img> <span>Онлайн</span> </div>
|
|
||||||
<div className={styles.meets__mainInfo_time}><img className={styles.meets__mainInfo_status_img} src={globe} alt="globe"></img> <span>22 декабря, с 10:00 до 22:00 по Московскому времени</span> </div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.meets__img}></div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<div className={styles.container}>
|
|
||||||
|
|
||||||
<div className={styles.meets__otziv_container}>
|
|
||||||
<div className={styles.newMeeting__container}>
|
|
||||||
<button className={styles.newMeeting__button}>ЗАПИСАТЬСЯ НА МЕРОПРИЯТИЕ</button>
|
|
||||||
<a href="#" className={styles.newMeeting__link}>Ссылка на мероприятие</a>
|
|
||||||
<a href="#" className={styles.newMeeting__ling_video}>СКАЧАТЬ ВИДЕО</a>
|
|
||||||
</div>
|
|
||||||
<div onClick={handleOpen} className={styles.meets__otziv}>
|
|
||||||
<span className={styles.meets__otziv_title}>Оставить вопрос</span>
|
|
||||||
Оставьте вопрос первым
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<section className={styles.aboutMeet}>
|
|
||||||
<div className={styles.aboutMeet__title}>О мероприятии</div>
|
|
||||||
<div className={styles.aboutMeet__descr}>Известным спикером будут продемонстрированы основные механизмы психологического воздействия в политике, а также особенности восприятия общественно-политической информации. Слушатели смогут узнать, как следует противостоять манипулятивному воздействию, фейковой информации, а также порассуждать о том, возможно ли существование мира без обмана.</div>
|
|
||||||
</section>
|
|
||||||
<section className={styles.expert}>
|
|
||||||
<div className={styles.expert__title}>Специалист</div>
|
|
||||||
<div className={styles.newContainer}>
|
|
||||||
<div className={styles.expert__container}>
|
|
||||||
<div className={styles.expert__img_container}><img className={styles.expert__img} src={avatar} alt="avatar"></img></div>
|
|
||||||
|
|
||||||
<div className={styles.expert__descr_container}>
|
|
||||||
<div className={styles.expert__descr_fullname}>Иванов Иван Иванович</div>
|
|
||||||
<div className={styles.expert__descr_speciality}>Психолог, таролог</div>
|
|
||||||
<div className={styles.expert__descr_phone}>+7 (888) 888 - 88 - 88</div>
|
|
||||||
<a href="#" className={styles.expert__descr_email}>exampl@ya.ru</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.container__links}>
|
|
||||||
<div className={styles.links__title}>Ссылки на материалы специалиста</div>
|
|
||||||
<div className={styles.links__img_container}>
|
|
||||||
<a href="#"><img src={vk} className={styles.links__img}></img></a>
|
|
||||||
<a href="#"><img src={tg} className={styles.links__img}></img></a>
|
|
||||||
<a href="#"><img src={book} className={styles.links__img}></img></a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<section className={styles.comments}>
|
|
||||||
<div className={styles.comments__title}>Комментарии</div>
|
|
||||||
<div className={styles.newInputContainer}>
|
|
||||||
<div className={styles.comments__number}>3 КОММЕНТАРИЯ</div>
|
|
||||||
<div className={styles.comments__input_container}>
|
|
||||||
<div className={styles.comments__input_img_container}>
|
|
||||||
<img className={styles.comments__input_img} src={newAvatar} alt='avatar'></img>
|
|
||||||
<textarea placeholder="Дмитрий Кирканов" className={styles.comments__input}></textarea>
|
|
||||||
</div>
|
|
||||||
<div className={styles.comments__button_container}>
|
|
||||||
<button className={styles.comments__button}>ОТПРАВИТЬ</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.comments__all_container}>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__container}>
|
|
||||||
<div className={styles.oneComment__img}><img alt='avatar' src={newAvatar}></img></div>
|
|
||||||
<div className={styles.oneComment__descr_container}>
|
|
||||||
<div className={styles.oneComment__descr_title_container}>
|
|
||||||
<div className={styles.oneComment__descr_title}><span className={styles.yellowSpan}>Д</span>митрий Кирсанов</div>
|
|
||||||
<div className={styles.oneComment__descr_time}>4 мая 1990, 00:00</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.oneComment__descr}>
|
|
||||||
Хорошее мероприятие, специалист знает свое дело
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<section className={styles.someMeetings}>
|
|
||||||
<div className={styles.someMeetings__title}>Еще мероприятия</div>
|
|
||||||
<Box sx={{ flexGrow: 1 }}>
|
|
||||||
<Grid container spacing={1}>
|
|
||||||
<Grid item xs={6} md={4} lg={3} >
|
|
||||||
<Card></Card>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={6} md={4} lg={3} >
|
|
||||||
<Card></Card>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={6} md={4} lg={3} >
|
|
||||||
<Card></Card>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={6} md={4} lg={3} >
|
|
||||||
<Card></Card>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
</Grid>
|
|
||||||
</Box>
|
|
||||||
</section>
|
|
||||||
<div>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
open={open}
|
|
||||||
onClose={handleClose}
|
|
||||||
aria-labelledby="modal-modal-title"
|
|
||||||
aria-describedby="modal-modal-description"
|
|
||||||
>
|
|
||||||
<Box sx={style}>
|
|
||||||
<div className={styles.modal__title}>Вопросы</div>
|
|
||||||
<div onClick={handleClose} className={styles.modal__close}><div className={styles.modal__close_img}>+</div></div>
|
|
||||||
<div className={styles.modal__line}></div>
|
|
||||||
<div className={styles.modal__question_number}>Всего <span>1</span></div>
|
|
||||||
<div className={styles.modal__question_container}>
|
|
||||||
<div className={styles.modal__question_containerSecond}>
|
|
||||||
<div className={styles.modal__question_user}>
|
|
||||||
<div className={styles.modal__question_user_img_container}><img src={newAvatar} alt='avatar' className={styles.modal__question_user_img}></img> Дмитрий Кирсанов</div>
|
|
||||||
<div className={styles.modal__question_user_descr}>Задача организации, в особенности же начало повседневной работы по формированию позиции обеспечивает актуальность приоретизации разума над эмоциями. </div>
|
|
||||||
<div className={styles.modal__question_time_container}>
|
|
||||||
<div className={styles.modal__question_time}>4 мая 1990, 00:00</div>
|
|
||||||
<div className={styles.modal__question_like_container}><img src={like} alt='like' className={styles.modal__question_like_container}></img> <span className={styles.modal__question_like}>0</span></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.modal__question_containerThird}>
|
|
||||||
<div className={styles.modal__question_user_img_container}><img src={newAvatar} alt='avatar' className={styles.modal__question_user_img}></img> Дмитрий Кирсанов</div>
|
|
||||||
<textarea placeholder="Дмитрий Кирканов" className={styles.modal__question_input}></textarea>
|
|
||||||
<div className={styles.modal__question_button_container}>
|
|
||||||
<button className={styles.modal__question_button + ' ' + styles.yellow}>Задать вопрос</button>
|
|
||||||
<button className={styles.modal__question_button + ' ' + styles.gray}>Отменить</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Box>
|
|
||||||
</Modal>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
export default MeetPage;
|
|
||||||
@ -1,595 +0,0 @@
|
|||||||
.meets {
|
|
||||||
margin-top: 150px;
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
&__img {
|
|
||||||
width: 44%;
|
|
||||||
height: 300px;
|
|
||||||
background-color: #D9D9D9;
|
|
||||||
}
|
|
||||||
&__mainInfo {
|
|
||||||
&_container {
|
|
||||||
width: 50%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-content: start;
|
|
||||||
}
|
|
||||||
&_descr {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 30px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
&_type {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 25px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_text, #888);
|
|
||||||
width: 110px;
|
|
||||||
height: 35px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 15px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&_status {
|
|
||||||
margin-top: 40px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
&_time {
|
|
||||||
margin-top: 40px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
&_status_img {
|
|
||||||
height: 26px;
|
|
||||||
width: 30px;
|
|
||||||
margin-right: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&__otziv {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
height: 300px;
|
|
||||||
width: 44%;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
margin-top: 50px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 14px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
&_title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 25px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
position: absolute;
|
|
||||||
left: 10px;
|
|
||||||
top: 4px;
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.aboutMeet {
|
|
||||||
margin-top: 100px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
text-align: left;
|
|
||||||
color: rgba(0, 0, 0, 0.90);
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 110%; /* 27.6px */
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.expert {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
border-radius: 10000px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
.expert {
|
|
||||||
|
|
||||||
|
|
||||||
&__container {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
width: 200px;
|
|
||||||
height: 200px;
|
|
||||||
&_container {
|
|
||||||
margin-right: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
text-align: left;
|
|
||||||
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
&_fullname {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 36px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&_speciality {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 6px;
|
|
||||||
}
|
|
||||||
&_phone {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
&_email {
|
|
||||||
color: #2C41FF;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.someMeetings {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.cards_container {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.newMeeting {
|
|
||||||
&__container {
|
|
||||||
margin-top: 50px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
&__button {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: var(--yellow, #FFED00);
|
|
||||||
height: 80px;
|
|
||||||
width: 450px;
|
|
||||||
}
|
|
||||||
&__link {
|
|
||||||
margin-top: 30px;
|
|
||||||
color: #2C41FF;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
&__ling_video {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 25px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 140px;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.newContainer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
.container__links {
|
|
||||||
width: 40%;
|
|
||||||
}
|
|
||||||
.links {
|
|
||||||
|
|
||||||
&__title {
|
|
||||||
margin-top: 128px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
padding-left: 5px;
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
margin-right: 10px;
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
margin-top: 45px;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.expert {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
border-radius: 10000px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.yellowSpan {
|
|
||||||
color: #FD0
|
|
||||||
}
|
|
||||||
.comments {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__number {
|
|
||||||
margin-left: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&__input {
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
background: #FFF;
|
|
||||||
height: 200px;
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: start;
|
|
||||||
align-items: start;
|
|
||||||
padding-left: 20px;
|
|
||||||
text-align: start;
|
|
||||||
display: flex;
|
|
||||||
justify-content: start;
|
|
||||||
padding-left: 30px;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
padding-top: 30px;
|
|
||||||
&_img {
|
|
||||||
height: 60px;
|
|
||||||
width: 60px;
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
&_img_container {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 60px;
|
|
||||||
}
|
|
||||||
&_img {
|
|
||||||
margin-right: 50px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.newInputContainer {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
&__number {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 60px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 16px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__button {
|
|
||||||
border-radius: 5.833px;
|
|
||||||
background: var(--yellow, #FD0);
|
|
||||||
width: 200px;
|
|
||||||
height: 45px;
|
|
||||||
margin-top: 35px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&__all_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 500px;
|
|
||||||
margin-top: 50px;
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.oneComment {
|
|
||||||
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 70px;
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
margin-right: 50px;
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 20px;
|
|
||||||
&_title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-right: 12px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_time {
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.modal {
|
|
||||||
background-color: #fff;
|
|
||||||
position: absolute;
|
|
||||||
height: 400px;
|
|
||||||
width: 300px;
|
|
||||||
&__container {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
height: 5000px;
|
|
||||||
width: 100%;
|
|
||||||
background-color: rgba(0, 0, 0, 0.40);
|
|
||||||
}
|
|
||||||
&__title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 48px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__line {
|
|
||||||
height: 1px;
|
|
||||||
width: 100%;
|
|
||||||
stroke-width: 1px;
|
|
||||||
background-color: #D0D2D8;
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 40px;
|
|
||||||
}
|
|
||||||
&__close {
|
|
||||||
cursor: pointer;
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
position: absolute;
|
|
||||||
height: 96px;
|
|
||||||
height: 45px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 58.625px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 200;
|
|
||||||
line-height: normal;
|
|
||||||
top: 0px;
|
|
||||||
right: 50px;
|
|
||||||
}
|
|
||||||
&__question {
|
|
||||||
&_number {
|
|
||||||
margin-top: 50px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
span {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
&_containerSecond {
|
|
||||||
width: 48%;
|
|
||||||
height: 250px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
&_user {
|
|
||||||
&_img {
|
|
||||||
margin-right: 25px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
align-items:center;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_descr {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 18px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_time {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_like {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin: 5px 0 0 10px;
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_input {
|
|
||||||
margin-top: 40px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 100%;
|
|
||||||
height: 235px;
|
|
||||||
padding-top: 20px;
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
|
||||||
&_containerThird {
|
|
||||||
margin-right: 3%;
|
|
||||||
}
|
|
||||||
&_button {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.yellow {
|
|
||||||
border-radius: 10px;
|
|
||||||
background-color: #FD0;
|
|
||||||
width: 190px;
|
|
||||||
height: 50px;
|
|
||||||
margin-right: 30px;
|
|
||||||
}
|
|
||||||
.gray {
|
|
||||||
border-radius: 10px;
|
|
||||||
background: var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 140px;
|
|
||||||
height: 40px;
|
|
||||||
}
|
|
||||||
@ -1,123 +0,0 @@
|
|||||||
import Header from "../Header";
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
import clock from '../../img/MeetPage/Clock.png';
|
|
||||||
import globe from '../../img/MeetPage/Globe.png';
|
|
||||||
import avatar from '../../img/MeetPage/avatar.png';
|
|
||||||
import like from '../../img/MeetPage/Facebook.png';
|
|
||||||
import Card from "../Card";
|
|
||||||
import Grid from '@mui/material/Grid';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
// import { useState, CSSProperties, useEffect, useRef } from "react";
|
|
||||||
import newAvatar from '../../img/MeetPage/newAvatar.png';
|
|
||||||
import vk from '../../img/MeetPage/Vk.png';
|
|
||||||
import tg from '../../img/MeetPage/Telegram.png';
|
|
||||||
import book from '../../img/MeetPage/Book.png';
|
|
||||||
import * as React from 'react';
|
|
||||||
import Modal from '@mui/material/Modal';
|
|
||||||
import newAvatarSecond from '../../img/AddUsers/newAvatar.png';
|
|
||||||
import EditMeetsForm from "../edit/EditMeetsForm";
|
|
||||||
|
|
||||||
const style = {
|
|
||||||
position: 'absolute',
|
|
||||||
top: '50%',
|
|
||||||
left: '50%',
|
|
||||||
transform: 'translate(-50%, -50%)',
|
|
||||||
width: "56%",
|
|
||||||
height: "80vh",
|
|
||||||
bgcolor: 'background.paper',
|
|
||||||
borderRadius: '25px',
|
|
||||||
boxShadow: 24,
|
|
||||||
p: 4,
|
|
||||||
};
|
|
||||||
const MeetPage = () => {
|
|
||||||
|
|
||||||
const [open, setOpen] = React.useState(false);
|
|
||||||
const handleOpen = () => setOpen(true);
|
|
||||||
const handleClose = () => setOpen(false);
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Header></Header>
|
|
||||||
|
|
||||||
<section className={styles.meets}>
|
|
||||||
<div className={styles.meets__mainInfo_container}>
|
|
||||||
<input placeholder="Ввести название мероприятия" className={styles.meets__mainInfo_descr}></input>
|
|
||||||
<input placeholder='Тип мероприятия' className={styles.meets__mainInfo_type}></input>
|
|
||||||
<div className={styles.meets__mainInfo_status}><img className={styles.meets__mainInfo_status_img} src={clock} alt="clock"></img> <input className={styles.time_input} placeholder="Время миропириятия" ></input> </div>
|
|
||||||
<div className={styles.meets__mainInfo_time}><img className={styles.meets__mainInfo_status_img} src={globe} alt="globe"></img> <input className={styles.status_input} placeholder='Дата проведения'></input> </div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form className={styles.addModal_form} method="post" encType="multipart/form-data">
|
|
||||||
<div className={styles.input_file_row}>
|
|
||||||
<label className={styles.input_file}>
|
|
||||||
<input type="file" name="file[]" multiple accept="image/*"/>
|
|
||||||
<div className={styles.addUser__card_container_new}>
|
|
||||||
<div className={styles.round}>+</div>
|
|
||||||
<div className={styles.addUser__card_text}>Добавить пользователя</div>
|
|
||||||
</div>
|
|
||||||
</label>
|
|
||||||
<div className={styles.input_file_list}></div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<div className={styles.container}>
|
|
||||||
|
|
||||||
<div className={styles.meets__otziv_container}>
|
|
||||||
<div className={styles.newMeeting__container}>
|
|
||||||
|
|
||||||
<input placeholder="Ссылка на мероприятие" className={styles.newMeeting__link}></input>
|
|
||||||
<input placeholder="Добавить ссылку на видео" className={styles.newMeeting__link_video}></input>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<section className={styles.aboutMeet}>
|
|
||||||
<div className={styles.aboutMeet__title}>О мероприятии</div>
|
|
||||||
<textarea placeholder="Написать описание мероприятия" style={{marginTop: '50px'}} className={styles.comments__input}></textarea>
|
|
||||||
</section>
|
|
||||||
<section className={styles.expert}>
|
|
||||||
<div className={styles.expert__title}>Специалист</div>
|
|
||||||
<div className={styles.addModal_user_container}>
|
|
||||||
<div className={styles.addModal_user_img_container}>
|
|
||||||
<form className={styles.addModal_form} method="post" encType="multipart/form-data">
|
|
||||||
<div className={styles.input_file_row}>
|
|
||||||
<label className={styles.input_file}>
|
|
||||||
<input type="file" name="file[]" multiple accept="image/*"/>
|
|
||||||
<span><img src={newAvatarSecond}></img></span>
|
|
||||||
</label>
|
|
||||||
<div className={styles.input_file_list}></div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div className={styles.addModal_user_input_container}>
|
|
||||||
<input placeholder='ФИО специалиста' className={styles.addModal_user}></input>
|
|
||||||
<input placeholder='Должность' className={styles.addModal_user}></input>
|
|
||||||
<select className={styles.addModal_user_select}>
|
|
||||||
<option>Пользователь</option>
|
|
||||||
<option>Администратор</option>
|
|
||||||
</select>
|
|
||||||
<input placeholder='Почта' className={styles.addModal_user}></input>
|
|
||||||
<input placeholder='Номер телефона' className={styles.addModal_user}></input>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className={styles.btn_contain}>
|
|
||||||
<button className={styles.newMeeting__button}>Опубликовать мероприятие</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<EditMeetsForm></EditMeetsForm>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</>
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
export default MeetPage;
|
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,108 +0,0 @@
|
|||||||
import Header from "../Header";
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
import clock from '../../img/MeetPage/Clock.png';
|
|
||||||
import globe from '../../img/MeetPage/Globe.png';
|
|
||||||
import avatar from '../../img/MeetPage/avatar.png';
|
|
||||||
import {useState} from 'react'
|
|
||||||
import { style } from "@mui/system";
|
|
||||||
// import Card from "../Card";
|
|
||||||
import Grid from '@mui/material/Grid';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
|
|
||||||
|
|
||||||
// const httpApiMethods = new HttpApiMethods()
|
|
||||||
// const meets = await httpApiMethods.GetMeetings()
|
|
||||||
|
|
||||||
const MeetPage = () => {
|
|
||||||
|
|
||||||
// const filterMeet = meets.filter( (item, index) => index <= 3 )
|
|
||||||
// console.log(filterMeet)
|
|
||||||
// const id = 0
|
|
||||||
// console.log(httpApiMethods.APIURL_FILES + meets[id].speackerImage)
|
|
||||||
// const meetPng = (id) => {
|
|
||||||
// console.log(httpApiMethods.APIURL_FILES + meets[id].speackerImage)
|
|
||||||
// return httpApiMethods.APIURL_FILES + meets[id].speackerImage
|
|
||||||
|
|
||||||
// }
|
|
||||||
// console.log(meetPng(id))
|
|
||||||
// function extractDateTime(dateString) {
|
|
||||||
// const dateTime = new Date(dateString);
|
|
||||||
// const date = dateTime.toLocaleDateString();
|
|
||||||
// const time = dateTime.toLocaleTimeString();
|
|
||||||
|
|
||||||
// return { date, time };
|
|
||||||
// }
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Header></Header>
|
|
||||||
|
|
||||||
<section className={styles.meets}>
|
|
||||||
<div className={styles.meets__mainInfo_container}>
|
|
||||||
<span className={styles.meets__mainInfo_descr}>Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»</span>
|
|
||||||
<span className={styles.meets__mainInfo_type}>Психология</span>
|
|
||||||
<div className={styles.meets__mainInfo_status}><img className={styles.meets__mainInfo_status_img} src={clock} alt="clock"></img> <span>Онлайн</span> </div>
|
|
||||||
<div className={styles.meets__mainInfo_time}><img className={styles.meets__mainInfo_status_img} src={globe} alt="globe"></img> <span>22 декабря, с 10:00 до 22:00 по Московскому времени</span> </div>
|
|
||||||
</div>
|
|
||||||
{/* <div className={styles.meets__img}><img src={meetPng(id)}></img></div> */}
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<div className={styles.meets__otziv_container}>
|
|
||||||
<div className={styles.meets__otziv}>
|
|
||||||
<span className={styles.meets__otziv_title}>Отзывы</span>
|
|
||||||
Оставьте первый отзыв
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<section className={styles.aboutMeet}>
|
|
||||||
<div className={styles.aboutMeet__title}>О мероприятии</div>
|
|
||||||
<div className={styles.aboutMeet__descr}>Известным спикером будут продемонстрированы основные механизмы психологического воздействия в политике, а также особенности восприятия общественно-политической информации. Слушатели смогут узнать, как следует противостоять манипулятивному воздействию, фейковой информации, а также порассуждать о том, возможно ли существование мира без обмана.</div>
|
|
||||||
</section>
|
|
||||||
<section className={styles.expert}>
|
|
||||||
<div className={styles.expert__title}>Специалист</div>
|
|
||||||
<div className={styles.expert__container}>
|
|
||||||
<div className={styles.expert__img_container}><img className={styles.expert__img} src={avatar} alt="avatar"></img></div>
|
|
||||||
<div className={styles.expert__descr_container}>
|
|
||||||
<div className={styles.expert__descr_fullname}>Иванов Иван Иванович</div>
|
|
||||||
<div className={styles.expert__descr_speciality}>Психолог, таролог</div>
|
|
||||||
<div className={styles.expert__descr_phone}>+7 (888) 888 - 88 - 88</div>
|
|
||||||
<a href="#" className={styles.expert__descr_email}>exampl@ya.ru</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className={styles.someMeetings}>
|
|
||||||
<div className={styles.someMeetings__title}>Еще мероприятия</div>
|
|
||||||
<Box sx={{ flexGrow: 1 }}>
|
|
||||||
{/* <Grid container spacing={1}>
|
|
||||||
{Array.isArray(meets) ? (
|
|
||||||
filterMeet.map((item, index) => (
|
|
||||||
|
|
||||||
|
|
||||||
<Grid item sm={6} xl={3} md={6} lg={4} key={index}>
|
|
||||||
<div className='event_card' >
|
|
||||||
<div className="event-card__photo"><img className='img' src={httpApiMethods.APIURL_FILES + item.speackerImage} alt="{item.speackerImage}" /></div>
|
|
||||||
<div className="taggs">
|
|
||||||
<div className='tagged'>{item.tags}</div>
|
|
||||||
<div className="feautures">{item.type}</div>
|
|
||||||
</div>
|
|
||||||
<h4 className="event-card__title">{item.title}</h4>
|
|
||||||
<p className="event-card__date">{extractDateTime(item.time).date}, в {extractDateTime(item.time).time} по Московскому времени</p>
|
|
||||||
</div>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</Grid> */}
|
|
||||||
</Box>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
export default MeetPage;
|
|
||||||
@ -1,226 +0,0 @@
|
|||||||
.meets {
|
|
||||||
margin-top: 150px;
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
&__img {
|
|
||||||
width: 44%;
|
|
||||||
height: 300px;
|
|
||||||
|
|
||||||
|
|
||||||
img {
|
|
||||||
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&__mainInfo {
|
|
||||||
&_container {
|
|
||||||
width: 50%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-content: start;
|
|
||||||
}
|
|
||||||
&_descr {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 30px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
&_type {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 25px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_text, #888);
|
|
||||||
width: 110px;
|
|
||||||
height: 35px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 15px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&_status {
|
|
||||||
margin-top: 40px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
&_time {
|
|
||||||
margin-top: 40px;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
&_status_img {
|
|
||||||
height: 26px;
|
|
||||||
width: 30px;
|
|
||||||
margin-right: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&__otziv {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
height: 300px;
|
|
||||||
width: 44%;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
margin-top: 50px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 14px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
&_title {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 25px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
position: absolute;
|
|
||||||
left: 10px;
|
|
||||||
top: 4px;
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.aboutMeet {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
text-align: left;
|
|
||||||
color: rgba(0, 0, 0, 0.90);
|
|
||||||
font-family: Inter;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 110%; /* 27.6px */
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.expert {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
border-radius: 10000px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
.expert {
|
|
||||||
|
|
||||||
|
|
||||||
&__container {
|
|
||||||
margin-top: 60px;
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
}
|
|
||||||
&__img {
|
|
||||||
width: 200px;
|
|
||||||
height: 200px;
|
|
||||||
&_container {
|
|
||||||
margin-right: 50px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
&__descr {
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
text-align: left;
|
|
||||||
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
&_fullname {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 36px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
&_speciality {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 6px;
|
|
||||||
}
|
|
||||||
&_phone {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
&_email {
|
|
||||||
color: #2C41FF;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.someMeetings {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-top: 200px;
|
|
||||||
&__title {
|
|
||||||
display: flex;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 56px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.cards_container {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
@ -1,55 +0,0 @@
|
|||||||
import * as React from 'react';
|
|
||||||
import Button from '@mui/material/Button';
|
|
||||||
import Menu from '@mui/material/Menu';
|
|
||||||
import MenuItem from '@mui/material/MenuItem';
|
|
||||||
import avatar from '../../img/headerImg/avatar.png'
|
|
||||||
import { useNavigate } from "react-router-dom";;
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
export default function BasicMenu() {
|
|
||||||
const [anchorEl, setAnchorEl] = React.useState(null);
|
|
||||||
const open = Boolean(anchorEl);
|
|
||||||
const handleClick = (event) => {
|
|
||||||
setAnchorEl(event.currentTarget);
|
|
||||||
};
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const handleHome = () => {
|
|
||||||
navigate('/');
|
|
||||||
setAnchorEl(null);
|
|
||||||
}
|
|
||||||
const handleProfile = () => {
|
|
||||||
navigate('/profile');
|
|
||||||
setAnchorEl(null);
|
|
||||||
}
|
|
||||||
const handleAtchive = () => {
|
|
||||||
navigate('/achievements');
|
|
||||||
setAnchorEl(null);
|
|
||||||
}
|
|
||||||
const handleClose = () => {
|
|
||||||
setAnchorEl(null);
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<img
|
|
||||||
src={avatar}
|
|
||||||
className={styles.header_img}
|
|
||||||
aria-controls={open ? 'basic-menu' : undefined}
|
|
||||||
aria-expanded={open ? 'true' : undefined}
|
|
||||||
onClick={handleClick}
|
|
||||||
>
|
|
||||||
</img>
|
|
||||||
<Menu
|
|
||||||
id="basic-menu"
|
|
||||||
anchorEl={anchorEl}
|
|
||||||
open={open}
|
|
||||||
onClose={handleClose}
|
|
||||||
MenuListProps={{
|
|
||||||
'aria-labelledby': 'basic-button',
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<MenuItem onClick={handleProfile}>Профиль</MenuItem>
|
|
||||||
<MenuItem onClick={handleAtchive}>Достижения</MenuItem>
|
|
||||||
<MenuItem onClick={handleHome}>Выйти</MenuItem>
|
|
||||||
</Menu>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
.header {
|
|
||||||
&_img {
|
|
||||||
|
|
||||||
width: 55px;
|
|
||||||
margin-right: 40px;
|
|
||||||
height: 55px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,54 +0,0 @@
|
|||||||
|
|
||||||
.container {
|
|
||||||
background: #ffffff;
|
|
||||||
color: #000000;
|
|
||||||
padding: 20px;
|
|
||||||
animation: fade-in 1s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes fade-in {
|
|
||||||
0% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
font-size: 24px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.subtitle {
|
|
||||||
font-size: 18px;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
background: #000000;
|
|
||||||
color: #ffffff;
|
|
||||||
padding: 10px 20px;
|
|
||||||
border-radius: 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.meeting {
|
|
||||||
&__cards {
|
|
||||||
list-style-type: none;
|
|
||||||
width: 80%;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
&__container {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
// &__arrow {
|
|
||||||
|
|
||||||
// }
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,22 +0,0 @@
|
|||||||
|
|
||||||
import styles from './style.module.scss';
|
|
||||||
import logo from '../../img/headerImg/OgettoLogo.png';
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
|
|
||||||
const Header = () => {
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const handleHome = () => {
|
|
||||||
navigate('/');
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={styles.header__container}>
|
|
||||||
<header className={styles.header}>
|
|
||||||
<div className={styles.header__logo} onClick={handleHome} ><img onClick={handleHome} src={logo} alt="logo"></img></div>
|
|
||||||
<button className={styles.header__button}>ВХОД</button>
|
|
||||||
</header>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
|
|
||||||
}
|
|
||||||
export default Header;
|
|
||||||
@ -1,39 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
.header {
|
|
||||||
height: 75px;
|
|
||||||
width: 80%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 150px;
|
|
||||||
position: fixed;
|
|
||||||
top: 0px;
|
|
||||||
background-color: #fff;
|
|
||||||
left: 0px;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
&__logo {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
&__button {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: #FFED00;
|
|
||||||
width: 200px;
|
|
||||||
height: 42px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 25px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
File diff suppressed because one or more lines are too long
@ -1 +0,0 @@
|
|||||||
{"version":3,"sources":["../MeetAuthPage/style.module.scss"],"names":[],"mappings":"AAAA,OACI,gBAAA,CACA,UAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CACA,YACI,SAAA,CACA,YAAA,CACA,wBAAA,CAGA,2BACI,SAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,wBAAA,CAAA,mBAAA,CAEJ,uBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CAEJ,sBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,eAAA,CACA,kBAAA,CACA,uCAAA,CACA,WAAA,CACA,WAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,4BAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CAEJ,wBACI,eAAA,CAEA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAEJ,sBACI,eAAA,CAEA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAEJ,4BACI,WAAA,CACA,UAAA,CACA,iBAAA,CAGR,cACI,iBAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,YAAA,CACA,SAAA,CACA,4CAAA,CACA,eAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,oBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,iBAAA,CACA,SAAA,CACA,OAAA,CAEJ,wBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CAKZ,WACI,gBAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,kBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CAEJ,kBACI,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,eAAA,CACA,oBAAA,CACA,iBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,gBAAA,CAIR,QAEI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,gBAAA,CACA,eACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CAEJ,aACI,qBAAA,CAQJ,mBACI,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAGJ,aACI,WAAA,CACA,YAAA,CACA,uBACI,iBAAA,CAQJ,yBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,eAAA,CAEA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CAEJ,wBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CAEJ,0BACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,cAAA,CAEJ,qBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CAEJ,qBACI,aAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CAIZ,cAEI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,gBAAA,CACA,qBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CAIR,iBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAGA,uBACI,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CAEJ,oBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,kBAAA,CACA,iCAAA,CACA,WAAA,CACA,WAAA,CAEJ,kBACI,eAAA,CACA,aAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CAEJ,wBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,gBAAA,CACA,eAAA,CAGR,cACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CAEJ,kBACI,SAAA,CAIA,cACI,gBAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CACA,gBAAA,CAEJ,YACI,iBAAA,CAEA,sBACI,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA","file":"style.module.css"}
|
|
||||||
@ -1,42 +0,0 @@
|
|||||||
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
import Typography from '@mui/material/Typography';
|
|
||||||
import Modal from '@mui/material/Modal';
|
|
||||||
|
|
||||||
const style = {
|
|
||||||
position: 'absolute',
|
|
||||||
top: '50%',
|
|
||||||
left: '50%',
|
|
||||||
transform: 'translate(-50%, -50%)',
|
|
||||||
width: 400,
|
|
||||||
bgcolor: 'background.paper',
|
|
||||||
border: '2px solid #000',
|
|
||||||
boxShadow: 24,
|
|
||||||
p: 4,
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function BasicModal(open, close) {
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
<Modal
|
|
||||||
open={open}
|
|
||||||
onClose={close}
|
|
||||||
aria-labelledby="modal-modal-title"
|
|
||||||
aria-describedby="modal-modal-description"
|
|
||||||
>
|
|
||||||
<Box sx={style}>
|
|
||||||
<Typography id="modal-modal-title" variant="h6" component="h2">
|
|
||||||
Text in a modal
|
|
||||||
</Typography>
|
|
||||||
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
|
|
||||||
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
|
|
||||||
</Typography>
|
|
||||||
</Box>
|
|
||||||
</Modal>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,79 +0,0 @@
|
|||||||
import Header from "../Header";
|
|
||||||
import styles from "./style.module.scss"
|
|
||||||
import Calendar from "../Calendar";
|
|
||||||
import avatar from '../../img/profilePage/avatar.png';
|
|
||||||
import gift from '../../img/profilePage/gift.png';
|
|
||||||
import Users from "../post/Users";
|
|
||||||
import EditMeetsForm from "../edit/EditMeetsForm";
|
|
||||||
import PostForm from "../post/Meets";
|
|
||||||
// import Home from '../Home/Home';
|
|
||||||
const ProfilePage = () => {
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Header></Header>
|
|
||||||
<section className={styles.profile__container}>
|
|
||||||
<div className={styles.profile__user_container}>
|
|
||||||
<div className={styles.profile__user_img_container}>
|
|
||||||
<img src={avatar} className={styles.profile__user_img}></img>
|
|
||||||
<div className={styles.profile__user_role}>Участник</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.profile__user_info_container}>
|
|
||||||
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
|
||||||
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
|
||||||
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
|
||||||
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
|
||||||
<div className={styles.profile__user_progress_container}>
|
|
||||||
<span>0</span>
|
|
||||||
<span className={styles.profile__user_progress_line}></span>
|
|
||||||
<span>1</span>
|
|
||||||
<img src={gift} className={styles.profile__user_progress_img}></img>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.calendar__container}>
|
|
||||||
<Calendar></Calendar>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className={styles.myMeets}>
|
|
||||||
<div className={styles.myMeets__title}>Ваши мероприятия</div>
|
|
||||||
<div className={styles.meeting__container}>
|
|
||||||
<input className={styles.meeting__inputs} placeholder="Найти мероприятие"></input>
|
|
||||||
<div className={styles.container}>
|
|
||||||
<div className={styles.select__container}>
|
|
||||||
<select className={styles.select} name="time__meeting">
|
|
||||||
<option value="">Время мироприятия</option>
|
|
||||||
</select>
|
|
||||||
<select className={styles.select} name="type__meeting">
|
|
||||||
<option value="">Тип мероприятия</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.NewContainer}>
|
|
||||||
<div className={styles.search_container}>
|
|
||||||
<div className={styles.search__descr}>100 мероприятий</div>
|
|
||||||
<select className={styles.select} name="type__meeting">
|
|
||||||
<option value="">Тип мероприятия</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.cards__container}>
|
|
||||||
<div className={styles.card}></div>
|
|
||||||
</div>
|
|
||||||
{/* <Home></Home> */}
|
|
||||||
{/* <FetchUtils></FetchUtils> */}
|
|
||||||
{/* <PostForm /> */}
|
|
||||||
{/* <EditForm /> */}
|
|
||||||
<Users></Users>
|
|
||||||
<PostForm></PostForm>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
export default ProfilePage;
|
|
||||||
@ -1,154 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
.profile {
|
|
||||||
|
|
||||||
&__container {
|
|
||||||
margin-top: 200px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
&__user {
|
|
||||||
&_img {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-right: 50px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
&_info_container {
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 20px;
|
|
||||||
display: flex;
|
|
||||||
text-align: left;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
&_fullName {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 36px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
span {
|
|
||||||
color: #FD0;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
&_spaciality {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 32px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_socialMedia {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_email {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 20px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 25px;
|
|
||||||
}
|
|
||||||
&_role {
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
line-height: normal;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
&_progress {
|
|
||||||
&_container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
&_line {
|
|
||||||
height: 2px;
|
|
||||||
width: 140%;
|
|
||||||
background: linear-gradient(90deg, #ffdd00,#d0d2d8);
|
|
||||||
padding: 0 30px 0 30px;
|
|
||||||
margin: 0 10px 0 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.meeting {
|
|
||||||
&__container {
|
|
||||||
height: 1400px;
|
|
||||||
margin-top: 60px;
|
|
||||||
}
|
|
||||||
&__inputs {
|
|
||||||
width: 90%;
|
|
||||||
height: 46px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid #000;
|
|
||||||
padding-left: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
.select {
|
|
||||||
margin-right: 50px;
|
|
||||||
height: 35px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_stroke, #D0D2D8);
|
|
||||||
width: 200px;
|
|
||||||
&__container {
|
|
||||||
display: flex;
|
|
||||||
width: 93%;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.NewContainer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
.search_container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.search__descr {
|
|
||||||
margin-right: 25px;
|
|
||||||
}
|
|
||||||
.myMeets {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-content: start;
|
|
||||||
text-align: left;
|
|
||||||
justify-content: start;
|
|
||||||
&__title {
|
|
||||||
margin-top: 150px;
|
|
||||||
color: #000;
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 52px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,76 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import './style.css'
|
|
||||||
import styled from 'styled-components';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import {useState} from 'react'
|
|
||||||
import EditForm from '../post/Meets';
|
|
||||||
import Grid from '@mui/material/Grid';
|
|
||||||
import Card from '../Card';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
import { useNavigate } from 'react-router-dom';
|
|
||||||
|
|
||||||
function extractDateTime(dateString) {
|
|
||||||
const dateTime = new Date(dateString);
|
|
||||||
const date = dateTime.toLocaleDateString();
|
|
||||||
const time = dateTime.toLocaleTimeString();
|
|
||||||
|
|
||||||
return { date, time };
|
|
||||||
}
|
|
||||||
|
|
||||||
const httpApiMethods = new HttpApiMethods()
|
|
||||||
|
|
||||||
const meets = await httpApiMethods.GetMeetings()
|
|
||||||
|
|
||||||
|
|
||||||
const Home = () => {
|
|
||||||
const [count, setCount] = useState(7)
|
|
||||||
const navigate = useNavigate()
|
|
||||||
|
|
||||||
const handleNeed = () => {
|
|
||||||
navigate('/firstMeetAuth')
|
|
||||||
}
|
|
||||||
const filterMeet = meets.filter( (item, index) => index <= count )
|
|
||||||
const allMeets = () => {
|
|
||||||
setCount(meets.length)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Box sx={{ flexGrow: 1, display: 'flex', justifyContent: 'flex-end', alignItems:'center'}}>
|
|
||||||
<Grid container sx={{width: '96%'}}>
|
|
||||||
|
|
||||||
|
|
||||||
{Array.isArray(meets) ? (
|
|
||||||
filterMeet.map((item, index) => (
|
|
||||||
|
|
||||||
|
|
||||||
<Grid item sm={6} xl={3} md={6} lg={4} key={index}>
|
|
||||||
<div onClick={handleNeed} className='event_card' >
|
|
||||||
<div className="event-card__photo"><img className='img' src={httpApiMethods.APIURL_FILES + item.speackerImage} alt="{item.speackerImage}" /></div>
|
|
||||||
<div className="taggs">
|
|
||||||
<div className='tagged'>{item.tags}</div>
|
|
||||||
<div className="feautures">{item.type}</div>
|
|
||||||
</div>
|
|
||||||
<h4 className="event-card__title">{item.title}</h4>
|
|
||||||
<p className="event-card__date">{extractDateTime(item.time).date}, в {extractDateTime(item.time).time} по Московскому времени</p>
|
|
||||||
</div>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
{/* <EditForm></EditForm> */}
|
|
||||||
</Grid>
|
|
||||||
</Box>
|
|
||||||
<div className='allButton__container'>
|
|
||||||
<button onClick={allMeets} className='allButton'>Все мероприятия</button>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Home;
|
|
||||||
@ -1,110 +0,0 @@
|
|||||||
.event_card {
|
|
||||||
width: 292px;
|
|
||||||
height: 586px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
margin-top: 100px;
|
|
||||||
margin-right: 11px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wrapp {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-start;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
margin-left: 40px;
|
|
||||||
/* max-width: 1521px; */
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_date {
|
|
||||||
color: var(--gray_text, #888);
|
|
||||||
text-align: left;
|
|
||||||
|
|
||||||
/* title */
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 22px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card__photo {
|
|
||||||
width: 292px;
|
|
||||||
height: 340px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
background: #D9D9D9;
|
|
||||||
margin-bottom: 26px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.event-card_title {
|
|
||||||
color: #000;
|
|
||||||
|
|
||||||
font-family: Montserrat;
|
|
||||||
font-size: 24px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.img {
|
|
||||||
width: 292px;
|
|
||||||
height: 340px;
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
.feautures {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
font-family: Montserrat;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 8px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: normal;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: #E7FFD2;
|
|
||||||
height: 15px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tagged {
|
|
||||||
display: inline-flex;
|
|
||||||
padding: 10px;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
gap: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid var(--gray_text, #888);
|
|
||||||
}
|
|
||||||
.taggs {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
.allButton {
|
|
||||||
color: var(--Black_Text, #151515);
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
/* Buttom max */
|
|
||||||
font-family: Gilroy;
|
|
||||||
font-size: 28px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: 125%; /* 35px */
|
|
||||||
letter-spacing: -0.84px;
|
|
||||||
border-radius: 1000px;
|
|
||||||
border: 1px solid var(--Gray_Line, #D0D2D8);
|
|
||||||
width: 300px;
|
|
||||||
height: 60px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
}
|
|
||||||
.allButton__container {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const DeleteReactions = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default DeleteReactions;
|
|
||||||
@ -1,109 +0,0 @@
|
|||||||
import React, { useRef, useState, useEffect } from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
|
|
||||||
const EditMeetsForm = () => {
|
|
||||||
const formRef = useRef(null);
|
|
||||||
const [dataIsLoad, setDataIsLoad] = useState(false);
|
|
||||||
const httpApiMethods = new HttpApiMethods();
|
|
||||||
|
|
||||||
const post = async (event) => {
|
|
||||||
event.preventDefault(); // Предотвращение действия по умолчанию
|
|
||||||
let formData = new FormData(formRef.current);
|
|
||||||
setDataIsLoad(false);
|
|
||||||
const updatedMeets = await httpApiMethods.EditMeetings(formData);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleData = (data) => {
|
|
||||||
if (Array.isArray(data) && data.length > 0) {
|
|
||||||
setData(data);
|
|
||||||
} else {
|
|
||||||
setData([]);
|
|
||||||
console.error('Неверный тип данных с сервера!');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const fetchData = async () => {
|
|
||||||
try {
|
|
||||||
const data = await httpApiMethods.GetMeetings();
|
|
||||||
handleData(data);
|
|
||||||
} catch (error) {
|
|
||||||
console.error(error);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const [data, setData] = useState([]);
|
|
||||||
const [selectedId, setSelectedId] = useState('');
|
|
||||||
const [selectedData, setSelectedData] = useState(null);
|
|
||||||
|
|
||||||
const handleDataClick = (id) => {
|
|
||||||
const selected = data.find((item) => item.id === id);
|
|
||||||
setSelectedData(selected);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleChange = (event) => {
|
|
||||||
setSelectedId(event.target.value);
|
|
||||||
const selected = data.find((item) => item.id === event.target.value);
|
|
||||||
setSelectedData(selected);
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
fetchData();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const FillInputs = () => {
|
|
||||||
httpApiMethods.GetByID()
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h2>Редактирование мероприятий</h2>
|
|
||||||
<div>{dataIsLoad ? "Данные успешно загружены" : ""}</div>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
{Array.isArray(data) && data.length > 0 ? (
|
|
||||||
data.map((item, index) => (
|
|
||||||
<button style={{ border: '1px solid black' }} onClick={() => handleDataClick(item.id)} key={index}>
|
|
||||||
{/* {item.id} */}
|
|
||||||
<div>{item.title}</div>
|
|
||||||
</button>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
{/* автозаполнение инпутов */}
|
|
||||||
{selectedData && (
|
|
||||||
<>
|
|
||||||
<form ref={formRef}>
|
|
||||||
<select name="id" value={selectedData.id} onChange={handleChange}>
|
|
||||||
{data.map((item) => (
|
|
||||||
<option key={item.id} value={item.id}>
|
|
||||||
{item.id}
|
|
||||||
</option>
|
|
||||||
))}
|
|
||||||
</select>
|
|
||||||
{/* <input type="text" placeholder='id' name='id' value={selectedData.id} onChange={handleChange} /> */}
|
|
||||||
<input type="text" placeholder='name' name='title' value={selectedData.title} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='time' name='time' value={selectedData.time} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='theme' name='theme' value={selectedData.theme} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='speakerName' name='speakerName' value={selectedData.speakerName} onChange={handleChange} />
|
|
||||||
<input type="file" placeholder='speackerImage' name='speackerImage' onChange={handleChange} />
|
|
||||||
<input type="file" placeholder='placeImages' name='placeImages' onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='splecializations' name='splecializations' value={selectedData.splecializations} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='speakerEmail' name='speakerEmail' value={selectedData.speakerEmail} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='tags' name='tags' value={selectedData.tags} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='SpeakerTelephone' name='speakerTelephone' value={selectedData.speakerTelephone} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='type' name='type' value={selectedData.type} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='urls' name='urls' value={selectedData.urls} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='placeAdress' name='placeAdress' value={selectedData.placeAdress} onChange={handleChange} />
|
|
||||||
<input type="text" placeholder='duration' name='duration' value={selectedData.duration} onChange={handleChange} />
|
|
||||||
<button onClick={post}>Edit</button>
|
|
||||||
</form>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default EditMeetsForm;
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const EditQuestions = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default EditQuestions;
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const EditReviews = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default EditReviews;
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const EditUsers = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default EditUsers;
|
|
||||||
68
src/components/fetchUtils/FetchUtils.jsx
Normal file
68
src/components/fetchUtils/FetchUtils.jsx
Normal file
@ -0,0 +1,68 @@
|
|||||||
|
/* eslint-disable no-unused-vars */
|
||||||
|
import axios from "axios"
|
||||||
|
import { useState } from "react"
|
||||||
|
import './style.css'
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const FetchUtils = () => {
|
||||||
|
// default value of data is object or array/nums/string
|
||||||
|
// const [rata, setRata] = useState([])
|
||||||
|
const [user, setUser] = useState([])
|
||||||
|
// single axios feetching
|
||||||
|
|
||||||
|
// useEffect(
|
||||||
|
// () => {
|
||||||
|
// async function getData() {
|
||||||
|
// const response = await axios.get('http://localhost:5000/weatherforecast')
|
||||||
|
// console.log(response.data)
|
||||||
|
// setRata(response.data)
|
||||||
|
// }
|
||||||
|
// getData()
|
||||||
|
// }, []
|
||||||
|
// )
|
||||||
|
// useEffect(
|
||||||
|
// () => {
|
||||||
|
async function getData() {
|
||||||
|
const response = await axios.get('https://jsonplaceholder.typicode.com/users')
|
||||||
|
console.log(response.data)
|
||||||
|
setUser(response.data)
|
||||||
|
}
|
||||||
|
// getData()
|
||||||
|
// }, []
|
||||||
|
// )
|
||||||
|
// Loop of axios fetching \\
|
||||||
|
|
||||||
|
// async function getData() {
|
||||||
|
// const response = await axios.get('http://localhost:5000/weatherforecast')
|
||||||
|
// console.log(response.data)
|
||||||
|
// setRata(response.data)
|
||||||
|
// }
|
||||||
|
// getData()
|
||||||
|
const removeList = () => {
|
||||||
|
setUser([])
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<button onClick={getData}>Click to Get Data</button>
|
||||||
|
<button onClick={removeList}>Click to Remove Data Listing</button>
|
||||||
|
{/* Mapping of data */}
|
||||||
|
<div>
|
||||||
|
{Array.isArray(user) ? (
|
||||||
|
<ul>
|
||||||
|
{user.map((item) => (
|
||||||
|
<ol key={item.id}>
|
||||||
|
<li>{item.name}</li>
|
||||||
|
<li>{item.username}</li>
|
||||||
|
<li>{item.email}</li>
|
||||||
|
</ol>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
) : (
|
||||||
|
<p>Bad data type from server!</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
export default FetchUtils;
|
||||||
@ -1,85 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
import styled from 'styled-components';
|
|
||||||
// import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import {useState} from 'react'
|
|
||||||
import EditMeetsForm from '../edit/EditMeetsForm';
|
|
||||||
import Grid from '@mui/material/Grid';
|
|
||||||
// import Card from '../Card';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function extractDateTime(dateString) {
|
|
||||||
const dateTime = new Date(dateString);
|
|
||||||
const date = dateTime.toLocaleDateString();
|
|
||||||
const time = dateTime.toLocaleTimeString();
|
|
||||||
|
|
||||||
return { date, time };
|
|
||||||
}
|
|
||||||
|
|
||||||
const httpApiMethods = new HttpApiMethods()
|
|
||||||
|
|
||||||
const meets = await httpApiMethods.GetMeetings()
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const MeetsGetByID = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const GetMeets = () => {
|
|
||||||
const [count, setCount] = useState(7)
|
|
||||||
|
|
||||||
const filterMeet = meets.filter( (item, index) => index <= count )
|
|
||||||
const allMeets = () => {
|
|
||||||
setCount(meets.length)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Box sx={{ flexGrow: 1, display: 'flex', justifyContent: 'flex-end', alignItems:'center'}}>
|
|
||||||
<Grid container sx={{width: '96%'}}>
|
|
||||||
|
|
||||||
|
|
||||||
{Array.isArray(meets) ? (
|
|
||||||
filterMeet.map((item, index) => (
|
|
||||||
|
|
||||||
|
|
||||||
<Grid item sm={6} xl={3} md={6} lg={4} key={index}>
|
|
||||||
<div className='event_card' >
|
|
||||||
<div className="event-card__photo"><img className='img' src={httpApiMethods.APIURL_FILES + item.speackerImage} alt="{item.speackerImage}" /></div>
|
|
||||||
<div className="taggs">
|
|
||||||
<div className='tagged'>{item.tags}</div>
|
|
||||||
<div className="feautures">{item.type}</div>
|
|
||||||
</div>
|
|
||||||
<h4 className="event-card__title">{item.title}</h4>
|
|
||||||
<p className="event-card__date">{extractDateTime(item.time).date}, в {extractDateTime(item.time).time} по Московскому времени</p>
|
|
||||||
</div>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
{/* <EditForm></EditForm> */}
|
|
||||||
</Grid>
|
|
||||||
</Box>
|
|
||||||
<div className='allButton__container'>
|
|
||||||
<button onClick={allMeets} className='allButton'>Все мероприятия</button>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
|
|
||||||
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GetMeets;
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
|
|
||||||
const httpApiMethods = new HttpApiMethods
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const GetQuestions = async () => {
|
|
||||||
const questions = await httpApiMethods.GetQuestions()
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div>
|
|
||||||
{Array.isArray(questions) ? (
|
|
||||||
questions.map((item, index) => (
|
|
||||||
<div key={index}>
|
|
||||||
<div>{item.id}</div>
|
|
||||||
<div>{item.text}</div>
|
|
||||||
<div>{item.meetingId}</div>
|
|
||||||
<div>{item.userId}</div>
|
|
||||||
</div>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const GetQuestionsByID = async (id) => {
|
|
||||||
const question = await httpApiMethods.GetByIDQuestions(id)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{Array.isArray(question) ? (
|
|
||||||
question.map((item, index) => (
|
|
||||||
<div key={index}>
|
|
||||||
<div>{item.id}</div>
|
|
||||||
<div>{item.text}</div>
|
|
||||||
<div>{item.meetingId}</div>
|
|
||||||
<div>{item.userId}</div>
|
|
||||||
</div>
|
|
||||||
))
|
|
||||||
) : (
|
|
||||||
<p>Неверный тип данных с сервера!</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GetQuestionsByID;
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
export const GetByIDReactions = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const getReactions = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Reactions;
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
export const GetReviews = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const GetReviewsByID = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GetReviewsByID;
|
|
||||||
@ -1,36 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import Cookies from 'js-cookie';
|
|
||||||
|
|
||||||
const User = () => {
|
|
||||||
let id = '9c69d5e7-74ec-4f92-af3a-fef7d30c55bb'
|
|
||||||
// Cookies.set('userId')
|
|
||||||
const user = new HttpApiMethods().GetUsers(id)
|
|
||||||
|
|
||||||
if (!Array.isArray(user)) {
|
|
||||||
return <p>Неверный тип данных с сервера!</p>
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{user.map((item, index) => (
|
|
||||||
|
|
||||||
<div key={index}>
|
|
||||||
<p>{item.id}</p>
|
|
||||||
<img src={item.avatarUrl} alt={item.avatarUrl}/>
|
|
||||||
<p>{item.fio}</p>
|
|
||||||
<p>{item.specialities}</p>
|
|
||||||
<a>{item.telegramBotUrl}</a>
|
|
||||||
<p>{item.level}</p>
|
|
||||||
<p>{item.userName}</p>
|
|
||||||
<p>{item.normalizedUserName}</p>
|
|
||||||
<p>{item.email}</p>
|
|
||||||
<p>{item.phoneNumber}</p>
|
|
||||||
<p>{item.id}</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default User;
|
|
||||||
@ -1,50 +0,0 @@
|
|||||||
import React, { useRef, useState } from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import Cookies from 'js-cookie';
|
|
||||||
|
|
||||||
|
|
||||||
const PostForm = () => {
|
|
||||||
const formRef = useRef(null); // Добавление этой строки
|
|
||||||
const [dataIsLoad, setDataIsLoad] = useState(false)
|
|
||||||
|
|
||||||
let post = async () => {
|
|
||||||
const token = Cookies.get('token')
|
|
||||||
const httpApiMethods = new HttpApiMethods();
|
|
||||||
let formData = new FormData(formRef.current); // Изменение этой строки
|
|
||||||
setDataIsLoad(false)
|
|
||||||
const updatedMeets = httpApiMethods.AddMeetings(formData, token)
|
|
||||||
.then(
|
|
||||||
() => {
|
|
||||||
setDataIsLoad(true)
|
|
||||||
|
|
||||||
}
|
|
||||||
)
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h2>Создать мероприятие</h2>
|
|
||||||
<div>{dataIsLoad ? "ДАнные успешно загрузилисб" : ""}</div>
|
|
||||||
<form ref={formRef} action=''>
|
|
||||||
<input type="text" placeholder='title' name='title'/>
|
|
||||||
<input type="text" placeholder='time' name='time'/>
|
|
||||||
<input type="text" placeholder='theme' name='theme'/>
|
|
||||||
<input type="text" placeholder='speakerName' name='speakerName'/>
|
|
||||||
<input type="file" placeholder='speackerImage' name='speackerImage'/>
|
|
||||||
<input type="file" placeholder='placeImages' name='placeImages'/>
|
|
||||||
<input type="text" placeholder='splecializations' name='splecializations'/>
|
|
||||||
<input type="text" placeholder='speakerEmail' name='speakerEmail'/>
|
|
||||||
<input type="text" placeholder='type' name='type'/>
|
|
||||||
<input type="text" placeholder='SpeakerTelephone' name='speakerTelephone'/>
|
|
||||||
<input type="text" placeholder='tags' name='tags'/>
|
|
||||||
<input type="text" placeholder='urls' name='urls'/>
|
|
||||||
<input type="text" placeholder='placeAdress' name='placeAdress'/>
|
|
||||||
<input type="text" placeholder='duration' name='duration'/>
|
|
||||||
<button onClick={post}>Create</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default PostForm;
|
|
||||||
@ -1,13 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const PostReviews = () => {
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default PostReviews;
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
import React, { useRef, useState } from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import Cookies from 'js-cookie';
|
|
||||||
|
|
||||||
const Questions = () => {
|
|
||||||
const formRef = useRef(null);
|
|
||||||
const [dataIsLoad, setDataIsLoad] = useState(false);
|
|
||||||
const [curentUser, setCurentUser] = useState(null);
|
|
||||||
|
|
||||||
let post = async (event) => {
|
|
||||||
event.preventDefault();
|
|
||||||
const httpApiMethods = new HttpApiMethods();
|
|
||||||
const user_id = Cookies.get('userData')
|
|
||||||
let formData = new FormData(formRef.current);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
if (!formData.get('fio') || !formData.get('avatar') || !formData.get('userId') || !formData.get('text') || !formData.get('meetingId')) {
|
|
||||||
console.error('Ошибка: Не все поля формы заполнены');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setDataIsLoad(false);
|
|
||||||
httpApiMethods.PostQuestions(formData).then(response => {
|
|
||||||
console.log(response)
|
|
||||||
setDataIsLoad(true);
|
|
||||||
meets_id = '9c69d5e7-74ec-4f92-af3a-fef7d30c55bb'
|
|
||||||
// let user_id = response.data.id;
|
|
||||||
// console.log(response)
|
|
||||||
// console.log(user_id)
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h2>Создание Questions, получение ID в Cookies</h2>
|
|
||||||
<div>{dataIsLoad ? "Данные успешно загружены" : ""}</div>
|
|
||||||
<form ref={formRef} action=''>
|
|
||||||
|
|
||||||
{/* <input type="text" placeholder='userId' name={Cookies.get('userData')} /> */}
|
|
||||||
<input type="text" placeholder='userId' name='userId' value={Cookies.get('userId')} />
|
|
||||||
<input type="text" placeholder='text' name='text' />
|
|
||||||
<input type="text" placeholder='meetingId' name='meetingId' value={'9c69d5e7-74ec-4f92-af3a-fef7d30c55bb'} />
|
|
||||||
<button onClick={post}>Create</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Questions;
|
|
||||||
@ -1,13 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
|
|
||||||
const UserAuth = () => {
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserAuth;
|
|
||||||
@ -1,59 +0,0 @@
|
|||||||
import React, { useRef, useState } from 'react';
|
|
||||||
import { HttpApiMethods } from '../utils/FetchUtils';
|
|
||||||
import Cookies from 'js-cookie';
|
|
||||||
|
|
||||||
export const PostUserModerator = () => {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const Users = () => {
|
|
||||||
const formRef = useRef(null);
|
|
||||||
const [dataIsLoad, setDataIsLoad] = useState(false);
|
|
||||||
const [curentUser, setCurentUser] = useState(null);
|
|
||||||
|
|
||||||
let post = async (event) => {
|
|
||||||
event.preventDefault();
|
|
||||||
const httpApiMethods = new HttpApiMethods();
|
|
||||||
let formData = new FormData(formRef.current);
|
|
||||||
|
|
||||||
if (!formData.get('fio') || !formData.get('avatar') || !formData.get('username') || !formData.get('specialities') || !formData.get('email') || !formData.get('telegramBotUrl')) {
|
|
||||||
console.error('Ошибка: Не все поля формы заполнены');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setDataIsLoad(false);
|
|
||||||
httpApiMethods.PostUsers(formData).then(response => {
|
|
||||||
console.log(response)
|
|
||||||
setDataIsLoad(true);
|
|
||||||
// let user_id = response.data.id;
|
|
||||||
// console.log(response)
|
|
||||||
// console.log(user_id)
|
|
||||||
Cookies.set('userId', response.id);
|
|
||||||
Cookies.set('token', response.token)
|
|
||||||
// return user_id
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h2>Создание пользователя, получение ID в Cookies</h2>
|
|
||||||
<div>{dataIsLoad ? "Данные успешно загружены" : ""}</div>
|
|
||||||
<form ref={formRef} action=''>
|
|
||||||
<input type="text" placeholder='fio' name='fio' />
|
|
||||||
<input type="file" placeholder='avatar' name='avatar' />
|
|
||||||
<input type="text" placeholder='username' name='username' />
|
|
||||||
<input type="email" placeholder='email' name='email' />
|
|
||||||
<input type="text" placeholder='specialities' name='specialities' />
|
|
||||||
<input type="text" placeholder='telegramBotUrl' name='telegramBotUrl' />
|
|
||||||
<button onClick={post}>Create</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Users;
|
|
||||||
@ -1,256 +0,0 @@
|
|||||||
/* eslint-disable no-unused-vars */
|
|
||||||
import axios from "axios"
|
|
||||||
import { useState } from "react"
|
|
||||||
import './style.css'
|
|
||||||
import { Cookie } from "@mui/icons-material"
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export class HttpApiMethods {
|
|
||||||
|
|
||||||
token;
|
|
||||||
HttpApiMethods()
|
|
||||||
{
|
|
||||||
token = Cookie,get('token')
|
|
||||||
}
|
|
||||||
// URL`s
|
|
||||||
user_id = '17e5fc7a-8f22-4c0b-8b33-5dc3a6937561'
|
|
||||||
APIURL = "https://cyberbloom.zetcraft.ru/api"
|
|
||||||
APIURL_FILES = "https://cyberbloom.zetcraft.ru/api/cyber-boom-files/"
|
|
||||||
// получение мероприятий по ID
|
|
||||||
GetByID = async (id) => {
|
|
||||||
|
|
||||||
let innerUrl = this.APIURL + `/meetings?id=${id}`
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl)
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Получение всех мероприятий
|
|
||||||
//
|
|
||||||
GetMeetings = async () => {
|
|
||||||
let innerUrl = this.APIURL + `/meetings/list?offset=0&limit=20`;
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl);
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Создание мероприятия
|
|
||||||
AddMeetings = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/meetings`;
|
|
||||||
|
|
||||||
let response = await axios.postForm(innerUrl, data); //
|
|
||||||
return response.data;
|
|
||||||
|
|
||||||
}
|
|
||||||
// Редактирование уже существующего мероприятия
|
|
||||||
EditMeetings = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/meetings`;
|
|
||||||
let response = await axios.putForm(innerUrl, data); //
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Удалить мероприятие, пока что не реализовано
|
|
||||||
DeleteMeetings = async (id) => {
|
|
||||||
let innerUrl = this.APIURL + `/meetings?id=${id}`
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl) //
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Users
|
|
||||||
//
|
|
||||||
PostUsers = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/users`
|
|
||||||
const responce = await axios.postForm(innerUrl, data)
|
|
||||||
return responce.data
|
|
||||||
}
|
|
||||||
PostUsersModerator = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/users/moderator`
|
|
||||||
const responce = await axios.postForm(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} })
|
|
||||||
return responce.data.id
|
|
||||||
}
|
|
||||||
EditUsers = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/users`
|
|
||||||
const responce = await axios.putForm(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }) //
|
|
||||||
return responce.data.id
|
|
||||||
}
|
|
||||||
GetUsers = async (id) => {
|
|
||||||
let innerUrl = this.APIURL + `/users?id=${id}`
|
|
||||||
|
|
||||||
const responce = await axios.get(innerUrl) //
|
|
||||||
|
|
||||||
return responce.data
|
|
||||||
}
|
|
||||||
GetUsersStats = async (id) => {
|
|
||||||
let innerUrl = this.APIURL + `/users/stats?id=${id}`
|
|
||||||
|
|
||||||
const responce = await axios.get(innerUrl) //
|
|
||||||
|
|
||||||
return responce.data
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Questions
|
|
||||||
//
|
|
||||||
GetByIDQuestions = async (id) => {
|
|
||||||
|
|
||||||
let innerUrl = this.APIURL + `/questions?id=${id}`
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl)
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Получение всех мероприятий
|
|
||||||
GetQuestions = async () => {
|
|
||||||
let innerUrl = this.APIURL + `/questions/list?offset=0&limit=20`;
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl);
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Создание мероприятия
|
|
||||||
PostQuestions = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/questions`;
|
|
||||||
|
|
||||||
let response = await axios.post(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
|
|
||||||
}
|
|
||||||
// Редактирование уже существующего мероприятия
|
|
||||||
EditQuestions = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/questions`;
|
|
||||||
let response = await axios.put(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Reactions
|
|
||||||
//
|
|
||||||
GetByIDReactions = async (id) => {
|
|
||||||
|
|
||||||
let innerUrl = this.APIURL + `/reactions?id=${id}`
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl)
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Получение всех мероприятий
|
|
||||||
GetReactions = async () => {
|
|
||||||
let innerUrl = this.APIURL + `/reactions/list?offset=0&limit=20`;
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl);
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Создание мероприятия
|
|
||||||
PostReactions = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/reactions`;
|
|
||||||
|
|
||||||
let response = await axios.post(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
|
|
||||||
}
|
|
||||||
// Редактирование уже существующего мероприятия
|
|
||||||
DeleteReactions = async (id) => {
|
|
||||||
let innerUrl = this.APIURL + `/reactions?id=${id}`;
|
|
||||||
let response = await axios.delete(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
|
|
||||||
//
|
|
||||||
// Reviews
|
|
||||||
//
|
|
||||||
GetByIDReviews = async (id) => {
|
|
||||||
|
|
||||||
let innerUrl = this.APIURL + `/reviews?id=${id}`
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl)
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
GetReviews = async () => {
|
|
||||||
let innerUrl = this.APIURL + `/reviews/list?offset=0&limit=20`;
|
|
||||||
|
|
||||||
const response = await axios.get(innerUrl);
|
|
||||||
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
// Создание мероприятия
|
|
||||||
PostReviews = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/reviews`;
|
|
||||||
|
|
||||||
let response = await axios.post(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
|
|
||||||
}
|
|
||||||
// Редактирование уже существующего мероприятия
|
|
||||||
EditReviews = async (data) => {
|
|
||||||
let innerUrl = this.APIURL + `/reviews`;
|
|
||||||
let response = await axios.put(innerUrl, data, { headers: {"Authorization" : `Bearer ${token}`} }); //
|
|
||||||
return response.data;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const FetchUtils = async () => {
|
|
||||||
const httpApiMethods = new HttpApiMethods() // Создание экземпляра класса HttpApiMethods
|
|
||||||
|
|
||||||
const meets = await httpApiMethods.GetMeetings()
|
|
||||||
const [user, setUser] = useState([])
|
|
||||||
|
|
||||||
// async function getData() {
|
|
||||||
// const response = await axios.get()
|
|
||||||
// console.log(response.data)
|
|
||||||
// setUser(response.data)
|
|
||||||
// }
|
|
||||||
|
|
||||||
const removeList = () => {
|
|
||||||
setUser([])
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<button onClick={getData}>Click to Get Data</button>
|
|
||||||
<button onClick={removeList}>Click to Remove Data Listing</button>
|
|
||||||
{/* Mapping of data */}
|
|
||||||
<div>
|
|
||||||
{Array.isArray(meets) ? (
|
|
||||||
<ul>
|
|
||||||
{meets.map((item) => (
|
|
||||||
<ol key={item.id}>
|
|
||||||
<li>{item.title}</li>
|
|
||||||
<li>{item.time}</li>
|
|
||||||
<li>{item.speakerName}</li>
|
|
||||||
<li>{item.speackerImage}</li>
|
|
||||||
<li>{item.splecializations}</li>
|
|
||||||
<li>{item.type}</li>
|
|
||||||
<li>{item.speakerTelephone}</li>
|
|
||||||
<li>{item.speakerEmail}</li>
|
|
||||||
<li>{item.tags}</li>
|
|
||||||
<li>{item.videoUrl}</li>
|
|
||||||
</ol>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
) : (
|
|
||||||
<p>Bad data type from server!</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
export default FetchUtils;
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 688 B |
Binary file not shown.
|
Before Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 740 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 581 B |
Binary file not shown.
|
Before Width: | Height: | Size: 710 B |
Binary file not shown.
|
Before Width: | Height: | Size: 819 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1016 B |
Binary file not shown.
|
Before Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 953 B |
Binary file not shown.
|
Before Width: | Height: | Size: 7.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 637 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 316 B |
@ -3,9 +3,6 @@ import ReactDOM from 'react-dom/client'
|
|||||||
import App from './App.jsx'
|
import App from './App.jsx'
|
||||||
import './index.css'
|
import './index.css'
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
ReactDOM.createRoot(document.getElementById('root')).render(
|
ReactDOM.createRoot(document.getElementById('root')).render(
|
||||||
<React.StrictMode>
|
<React.StrictMode>
|
||||||
<App />
|
<App />
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user