diff --git a/.env b/.env index cf6bd35e5c9bab3e65e1d8693e6699cef259ab90..1f3ef047df457872af66811c1c332d2fa5463ab8 100644 --- a/.env +++ b/.env @@ -1 +1 @@ -REACT_APP_BASE_URL=https://pms.noosoft.ru \ No newline at end of file +REACT_APP_BASE_URL=https://ciclodion.ru \ No newline at end of file diff --git a/build.zip b/build.zip index 54c487763b97d10654d5d594cf61afefb08b462f..4c46e6724b0ea0f156f240f40fbe99816a1e67d3 100644 Binary files a/build.zip and b/build.zip differ diff --git a/package.json b/package.json index 281e3c644d12ad4d4e4fcedec5a26509333d7185..6d2e2f67b76188ffd0d114fb9e27d67d4dc3c443 100644 --- a/package.json +++ b/package.json @@ -21,8 +21,11 @@ "axios": "^1.4.0", "date-fns": "^2.30.0", "gsap": "^3.12.2", + "html2canvas": "^1.4.1", "react": "^18.2.0", + "react-contenteditable": "^3.3.7", "react-dom": "^18.2.0", + "react-draggable": "^4.4.5", "react-gsap": "^3.2.1", "react-insta-stories": "^2.6.2", "react-redux": "^8.1.0", @@ -30,6 +33,7 @@ "styled-components": "^6.0.0-rc.3", "swiper": "9.3.2", "typescript": "^4.4.2", + "use-debounce": "^9.0.4", "wavesurfer.js": "^6.2.0", "web-vitals": "^2.1.0" }, diff --git a/public/index.html b/public/index.html index f2e975806e851de7fa75e6740eae28540f8d3f3a..4a985ec5cb51805d4aae6ceac65c182df1a91022 100644 --- a/public/index.html +++ b/public/index.html @@ -27,6 +27,16 @@ Learn how to configure a non-root public URL by running `npm run build`. --> Приложение "Мой ритм" + + + + diff --git a/public/media/files/file.pdf b/public/media/files/file.pdf deleted file mode 100644 index b95d83825c3a2a2288ef7fb6c8185f5fb46ee779..0000000000000000000000000000000000000000 Binary files a/public/media/files/file.pdf and /dev/null differ diff --git a/public/media/home/banner-home.jpg b/public/media/home/banner-home.jpg deleted file mode 100644 index 3dbebca46bda1b47b440a9c882f5fe7081e7703b..0000000000000000000000000000000000000000 Binary files a/public/media/home/banner-home.jpg and /dev/null differ diff --git a/public/media/stories/1.jpg b/public/media/stories/1.jpg deleted file mode 100644 index ad7edde95bd9b9e6cc1db079890f17fab62ca3dc..0000000000000000000000000000000000000000 Binary files a/public/media/stories/1.jpg and /dev/null differ diff --git a/public/media/stories/10.jpg b/public/media/stories/10.jpg deleted file mode 100644 index 40bffbb2d27bde758a7876efec9e448dd38417ad..0000000000000000000000000000000000000000 Binary files a/public/media/stories/10.jpg and /dev/null differ diff --git a/public/media/stories/11.jpg b/public/media/stories/11.jpg deleted file mode 100644 index f42ad9c8eb67e47b8fe9138026ff365bf4be0d1b..0000000000000000000000000000000000000000 Binary files a/public/media/stories/11.jpg and /dev/null differ diff --git a/public/media/stories/12.jpg b/public/media/stories/12.jpg deleted file mode 100644 index 1232241c1e7f07971f9e0b1c1cfd3e8740dae289..0000000000000000000000000000000000000000 Binary files a/public/media/stories/12.jpg and /dev/null differ diff --git a/public/media/stories/13.jpg b/public/media/stories/13.jpg deleted file mode 100644 index d31621a41e1abaed0fb1ebec095f14bb8d0803cd..0000000000000000000000000000000000000000 Binary files a/public/media/stories/13.jpg and /dev/null differ diff --git a/public/media/stories/14.jpg b/public/media/stories/14.jpg deleted file mode 100644 index 70c005bae89bb25b90257984b532fc19ad62920a..0000000000000000000000000000000000000000 Binary files a/public/media/stories/14.jpg and /dev/null differ diff --git a/public/media/stories/15.jpg b/public/media/stories/15.jpg deleted file mode 100644 index 638a03718a254858d31a806663b5b159ac730a62..0000000000000000000000000000000000000000 Binary files a/public/media/stories/15.jpg and /dev/null differ diff --git a/public/media/stories/2.jpg b/public/media/stories/2.jpg deleted file mode 100644 index 0ad9d9e23da729729e0f386d62e3ac4946c1f4fd..0000000000000000000000000000000000000000 Binary files a/public/media/stories/2.jpg and /dev/null differ diff --git a/public/media/stories/3.jpg b/public/media/stories/3.jpg deleted file mode 100644 index 4101ef219840a6880bef0e68158ee18b6b6df02e..0000000000000000000000000000000000000000 Binary files a/public/media/stories/3.jpg and /dev/null differ diff --git a/public/media/stories/4.jpg b/public/media/stories/4.jpg deleted file mode 100644 index 60d9eb0ba8f951c5caed83e05ef07bc404155aea..0000000000000000000000000000000000000000 Binary files a/public/media/stories/4.jpg and /dev/null differ diff --git a/public/media/stories/5.jpg b/public/media/stories/5.jpg deleted file mode 100644 index 60ff93be2eec813afd1f5106828909f789d918ae..0000000000000000000000000000000000000000 Binary files a/public/media/stories/5.jpg and /dev/null differ diff --git a/public/media/stories/6.jpg b/public/media/stories/6.jpg deleted file mode 100644 index 4b5869715cb7469d73c94952cb63a30e75a7bd02..0000000000000000000000000000000000000000 Binary files a/public/media/stories/6.jpg and /dev/null differ diff --git a/public/media/stories/7.jpg b/public/media/stories/7.jpg deleted file mode 100644 index 0c9510a4eaa4f03a16def621fb5ed175057a6b18..0000000000000000000000000000000000000000 Binary files a/public/media/stories/7.jpg and /dev/null differ diff --git a/public/media/stories/8.jpg b/public/media/stories/8.jpg deleted file mode 100644 index 54cd3de9836e86c498b268676df30399602715a3..0000000000000000000000000000000000000000 Binary files a/public/media/stories/8.jpg and /dev/null differ diff --git a/public/media/stories/9.jpg b/public/media/stories/9.jpg deleted file mode 100644 index ca1ffda75fc2fb59aaf444267960f2372a026d2d..0000000000000000000000000000000000000000 Binary files a/public/media/stories/9.jpg and /dev/null differ diff --git a/public/media/contest/banner.jpg b/public/static/media/contest/banner.jpg similarity index 100% rename from public/media/contest/banner.jpg rename to public/static/media/contest/banner.jpg diff --git a/public/media/contest/emoji-group-2.png b/public/static/media/contest/emoji-group-2.png similarity index 100% rename from public/media/contest/emoji-group-2.png rename to public/static/media/contest/emoji-group-2.png diff --git a/public/media/contest/emoji-group.png b/public/static/media/contest/emoji-group.png similarity index 100% rename from public/media/contest/emoji-group.png rename to public/static/media/contest/emoji-group.png diff --git a/public/static/media/files/Guide_from_the_Cyclodinone_brand.pdf b/public/static/media/files/Guide_from_the_Cyclodinone_brand.pdf new file mode 100644 index 0000000000000000000000000000000000000000..9a4f72d62511ccb716f0bc2ab12968dd0c097b54 Binary files /dev/null and b/public/static/media/files/Guide_from_the_Cyclodinone_brand.pdf differ diff --git a/public/static/media/files/file1.pdf b/public/static/media/files/file1.pdf new file mode 100644 index 0000000000000000000000000000000000000000..631931aed69837e5987e4d6c07ee955a731624e0 Binary files /dev/null and b/public/static/media/files/file1.pdf differ diff --git a/public/static/media/files/file2.pdf b/public/static/media/files/file2.pdf new file mode 100644 index 0000000000000000000000000000000000000000..b2cc996e75efe2c31b60d98ee75285df1cdecc15 Binary files /dev/null and b/public/static/media/files/file2.pdf differ diff --git a/public/static/media/home/banner-home-mobile.jpg b/public/static/media/home/banner-home-mobile.jpg new file mode 100644 index 0000000000000000000000000000000000000000..2c43bec4fa6925c2b88d07d66150daf62bfd6339 Binary files /dev/null and b/public/static/media/home/banner-home-mobile.jpg differ diff --git a/public/static/media/home/banner-home.jpg b/public/static/media/home/banner-home.jpg new file mode 100644 index 0000000000000000000000000000000000000000..277a032bc6607fdcbcfb35d9c1e9f8e3bdf551b3 Binary files /dev/null and b/public/static/media/home/banner-home.jpg differ diff --git a/public/media/home/product.png b/public/static/media/home/product.png similarity index 100% rename from public/media/home/product.png rename to public/static/media/home/product.png diff --git a/public/static/media/icons/share.svg b/public/static/media/icons/share.svg new file mode 100644 index 0000000000000000000000000000000000000000..bdc78f15b0d3d35ccc21c2640c1d5c5cf886190d --- /dev/null +++ b/public/static/media/icons/share.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/static/media/legal/1.svg b/public/static/media/legal/1.svg new file mode 100644 index 0000000000000000000000000000000000000000..6b19217f7c61cadcf6bc6919bf8286753b0c32ed --- /dev/null +++ b/public/static/media/legal/1.svg @@ -0,0 +1,102 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/static/media/legal/2.svg b/public/static/media/legal/2.svg new file mode 100644 index 0000000000000000000000000000000000000000..338c55201a78f7d68794270612e028c12b45c6e1 --- /dev/null +++ b/public/static/media/legal/2.svg @@ -0,0 +1,101 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/media/moods/1-emoji.png b/public/static/media/moods/1-emoji.png similarity index 100% rename from public/media/moods/1-emoji.png rename to public/static/media/moods/1-emoji.png diff --git a/public/media/moods/2-emoji.png b/public/static/media/moods/2-emoji.png similarity index 100% rename from public/media/moods/2-emoji.png rename to public/static/media/moods/2-emoji.png diff --git a/public/media/moods/3-emoji.png b/public/static/media/moods/3-emoji.png similarity index 100% rename from public/media/moods/3-emoji.png rename to public/static/media/moods/3-emoji.png diff --git a/public/media/moods/4-emoji.png b/public/static/media/moods/4-emoji.png similarity index 100% rename from public/media/moods/4-emoji.png rename to public/static/media/moods/4-emoji.png diff --git a/public/media/moods/5-emoji.png b/public/static/media/moods/5-emoji.png similarity index 100% rename from public/media/moods/5-emoji.png rename to public/static/media/moods/5-emoji.png diff --git a/public/media/moods/6-emoji.png b/public/static/media/moods/6-emoji.png similarity index 100% rename from public/media/moods/6-emoji.png rename to public/static/media/moods/6-emoji.png diff --git a/public/media/moods/7-emoji.png b/public/static/media/moods/7-emoji.png similarity index 100% rename from public/media/moods/7-emoji.png rename to public/static/media/moods/7-emoji.png diff --git a/public/media/moods/8-emoji.png b/public/static/media/moods/8-emoji.png similarity index 100% rename from public/media/moods/8-emoji.png rename to public/static/media/moods/8-emoji.png diff --git a/public/media/test/1-result.jpg b/public/static/media/test/1-result.jpg similarity index 100% rename from public/media/test/1-result.jpg rename to public/static/media/test/1-result.jpg diff --git a/public/media/test/1.jpg b/public/static/media/test/1.jpg similarity index 100% rename from public/media/test/1.jpg rename to public/static/media/test/1.jpg diff --git a/public/media/test/10.jpg b/public/static/media/test/10.jpg similarity index 100% rename from public/media/test/10.jpg rename to public/static/media/test/10.jpg diff --git a/public/media/test/2-result.jpg b/public/static/media/test/2-result.jpg similarity index 100% rename from public/media/test/2-result.jpg rename to public/static/media/test/2-result.jpg diff --git a/public/media/test/2.jpg b/public/static/media/test/2.jpg similarity index 100% rename from public/media/test/2.jpg rename to public/static/media/test/2.jpg diff --git a/public/media/test/3-result.jpg b/public/static/media/test/3-result.jpg similarity index 100% rename from public/media/test/3-result.jpg rename to public/static/media/test/3-result.jpg diff --git a/public/media/test/3.jpg b/public/static/media/test/3.jpg similarity index 100% rename from public/media/test/3.jpg rename to public/static/media/test/3.jpg diff --git a/public/media/test/4.jpg b/public/static/media/test/4.jpg similarity index 100% rename from public/media/test/4.jpg rename to public/static/media/test/4.jpg diff --git a/public/media/test/5.jpg b/public/static/media/test/5.jpg similarity index 100% rename from public/media/test/5.jpg rename to public/static/media/test/5.jpg diff --git a/public/media/test/6.jpg b/public/static/media/test/6.jpg similarity index 100% rename from public/media/test/6.jpg rename to public/static/media/test/6.jpg diff --git a/public/media/test/7.jpg b/public/static/media/test/7.jpg similarity index 100% rename from public/media/test/7.jpg rename to public/static/media/test/7.jpg diff --git a/public/media/test/8.jpg b/public/static/media/test/8.jpg similarity index 100% rename from public/media/test/8.jpg rename to public/static/media/test/8.jpg diff --git a/public/media/test/9.jpg b/public/static/media/test/9.jpg similarity index 100% rename from public/media/test/9.jpg rename to public/static/media/test/9.jpg diff --git a/public/media/test/emoji.svg b/public/static/media/test/emoji.svg similarity index 100% rename from public/media/test/emoji.svg rename to public/static/media/test/emoji.svg diff --git a/public/media/test/emoji2.svg b/public/static/media/test/emoji2.svg similarity index 100% rename from public/media/test/emoji2.svg rename to public/static/media/test/emoji2.svg diff --git a/public/media/test/emoji3.svg b/public/static/media/test/emoji3.svg similarity index 100% rename from public/media/test/emoji3.svg rename to public/static/media/test/emoji3.svg diff --git a/public/media/test/emoji4.svg b/public/static/media/test/emoji4.svg similarity index 100% rename from public/media/test/emoji4.svg rename to public/static/media/test/emoji4.svg diff --git a/public/media/test/main.jpg b/public/static/media/test/main.jpg similarity index 100% rename from public/media/test/main.jpg rename to public/static/media/test/main.jpg diff --git a/src/App.tsx b/src/App.tsx index de6ea185bfffb73f825fe79ef3eb0b07c751a17e..abc6faa32cd448ad644aff05912eb228d5657a9d 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -9,10 +9,13 @@ import {PMSAlert, ProductModal, WelcomeCard, WinnerCard} from "./modules"; import {closeModal, openModal, openToast} from "./store/slices/ModalSlice"; import {useGetTokenQuery, useGetUserMutation, usePostUserMutation} from "./store/api/api"; import bridge from "@vkontakte/vk-bridge"; -import {setJoinGroup, setStatus} from "./store/slices/HomeSlice"; -import {STATUS_MODE} from "./utils/status"; +import {setIsWinner, setJoinGroup, setStatus} from "./store/slices/HomeSlice"; +import { + STATUS_MODE +} from "./utils/status"; import {APP_ID, GROUP_ID} from "./utils/consts"; - +import {StyleSheetManager} from "styled-components"; +import isPropValid from '@emotion/is-prop-valid'; export function useFetchToken() { useGetTokenQuery({ @@ -46,7 +49,8 @@ export function useUserData() { vk_id: res.id.toString(), lastname: res.last_name, firstname: res.first_name, - ava: res.photo_200 + ava: res.photo_200, + promocode: `${window.location.hash === '' ? '#' : window.location.hash}` }).then(r => { getUser(res.id.toString()) }).catch(err => { @@ -64,11 +68,6 @@ export function useUserData() { load(); }, [token]); - - // React.useEffect(() => { - // isSuccess && dispatch(openToast(MODAL_LIST.SUCCESS_DATA_USER)); - // }, [isSuccess]); - return {vkID, setVKId, postUser}; // Возвращаем значения или функции, которые могут быть полезны в компонентах, использующих этот хук } @@ -100,34 +99,34 @@ function App() { ); - React.useEffect(() => { - async function load() { - try { - const token = await bridge.send("VKWebAppGetAuthToken", { - "app_id": APP_ID, - "scope": "groups" - }); - const res = await bridge.send("VKWebAppCallAPIMethod", { - "method": "groups.get", - "request_id": "32test", - "params": {"user_ids": vkID, "v": "5.82", "access_token": token.access_token} - }).then(res => res.response.items); - - // @ts-ignore - res?.some(r => r === GROUP_ID) - ? dispatch(setJoinGroup(true)) - : dispatch(setJoinGroup(false)) - } catch (e) { - console.log(e); - dispatch(setJoinGroup(false)) - } - } - - - if (vkID) { - load() - } - }, [dispatch, vkID]); + // React.useEffect(() => { + // async function load() { + // try { + // const token = await bridge.send("VKWebAppGetAuthToken", { + // "app_id": APP_ID, + // "scope": "groups" + // }); + // const res = await bridge.send("VKWebAppCallAPIMethod", { + // "method": "groups.get", + // "request_id": "32test", + // "params": {"user_ids": vkID, "v": "5.82", "access_token": token.access_token} + // }).then(res => res.response.items); + // + // // @ts-ignore + // res?.some(r => r === GROUP_ID) + // ? dispatch(setJoinGroup(true)) + // : dispatch(setJoinGroup(false)) + // } catch (e) { + // console.log(e); + // dispatch(setJoinGroup(false)) + // } + // } + + + // if (vkID) { + // load() + // } + // }, [dispatch, vkID]); React.useEffect(() => { @@ -149,28 +148,64 @@ function App() { checkFirstVisit() }, []); + + const isWinner = useAppSelector(state => state.home.user?.isWinner); + + + + React.useEffect(() => { + if(isWinner) { + dispatch(openModal(MODAL_LIST.WINNER)); + dispatch(setIsWinner(false)) + } + + }, [dispatch, isWinner]); + return ( - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + ); } export default App; + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/styles/global.ts b/src/assets/styles/global.ts index 8c95f8f9adb3ab3f3c7c30dd8aeb73c091c77c5d..aee4851a13cded842bef2795617d63db84e839a0 100644 --- a/src/assets/styles/global.ts +++ b/src/assets/styles/global.ts @@ -133,7 +133,13 @@ export default createGlobalStyle` --vkui--font_footnote--line_height--regular: 1.4; --vkui--font_text--line_height--compact: 1.4; --vkui--font_subhead--line_height--compact: 1.2; + --vkui--color_field_background: transparent; + + } + + .vkuiSnackbar { + --vkui--z_index_popout: 9999999999; } .vkuiSnackbar__body { @@ -236,6 +242,10 @@ export default createGlobalStyle` &-bold { font-weight: var(--vkui--font_weight_accent1); } + + &-regular { + font-weight: var(--vkui--font_weight_accent2); + } } .drop-icon { diff --git a/src/components/AppBar/AppBar.tsx b/src/components/AppBar/AppBar.tsx index 3d04a39bb891cce8f775c25edb9dac608337b0d4..9876cd8dfcc81abd016a2db7abd6525af1739b85 100644 --- a/src/components/AppBar/AppBar.tsx +++ b/src/components/AppBar/AppBar.tsx @@ -8,10 +8,11 @@ import { Spacing, } from "@vkontakte/vkui"; import {Tween} from "react-gsap"; -import {useAppDispatch} from "../../store/hooks"; +import {useAppDispatch, useAppSelector} from "../../store/hooks"; import {IRoute} from "../../types/IRoute"; import {ROUTE_PATH} from "../../utils/routes"; import {actions} from "../../store/slices/RouterSlice"; +import {usePostUserGuideMutation} from "../../store/api/api"; interface AppBarProps { isMenu: boolean, @@ -31,10 +32,10 @@ export const routes: IRoute[] = [ title: 'Приятные Моменты для Себя', path: ROUTE_PATH.MOMENTS }, - { - title: 'Конкурс', - path: ROUTE_PATH.CONTEST - } + // { + // title: 'Конкурс', + // path: ROUTE_PATH.CONTEST + // } ]; const AppBar = (props: React.PropsWithChildren) => { @@ -47,8 +48,23 @@ const AppBar = (props: React.PropsWithChildren) => { const [isShow, setIsShow] = React.useState(false); const dispatch = useAppDispatch(); + const vk_id = useAppSelector(state => state.home.user?.vk_id ?? '0'); + const guide = useAppSelector(state => state.home.user?.guide ?? 0); + const onClickBurgMenu = () => setIsShow(!isShow); + const [patchGuide, { + data + }] = usePostUserGuideMutation() + + const onClickDownload = () => { + patchGuide({ + vk_id, + guide: { + guide: guide + 1 + } + }) + }; const menuHeight = isShow ? 'auto' : '0'; // Задаем высоту меню в зависимости от состояния isShow @@ -87,6 +103,15 @@ const AppBar = (props: React.PropsWithChildren) => { )) } + + + Гайд о ПМС + + diff --git a/src/components/AppBar/styles.ts b/src/components/AppBar/styles.ts index 7267d8fb40da43c9a1907e7190f6f37ad2e26f03..b71825f59a1bbc66522fd30edc64a316adcaeffa 100644 --- a/src/components/AppBar/styles.ts +++ b/src/components/AppBar/styles.ts @@ -19,7 +19,7 @@ export const AppBar = styled.div` //border: 1px solid #eee; `; -export const Link = styled.button` +export const Link = styled.a` font-size: var(--vkui--font_title2--font_size--regular); text-align: center; display: block; @@ -27,6 +27,8 @@ export const Link = styled.button` width: 100%; height: 4rem; + text-decoration: none; + & + & { margin-top: var(--bs-gutter); } diff --git a/src/components/AudioPlayer/AudioPlayer.tsx b/src/components/AudioPlayer/AudioPlayer.tsx index 5a7e2f2721c8f8008be567928e2c93d8206b724d..52115eb78cbdbba787d33546283b8bd4d8bd7ed1 100644 --- a/src/components/AudioPlayer/AudioPlayer.tsx +++ b/src/components/AudioPlayer/AudioPlayer.tsx @@ -56,12 +56,10 @@ const AudioPlayer = (props: AudioPlayerProps) => { toggleIsPlaying(true); //onClick() }); - // waveSurfer.on('interaction', () => { // console.log('play'); // onClick() // }) - return () => { waveSurfer.destroy() } diff --git a/src/components/CalendarBoard/CalendarBoard.tsx b/src/components/CalendarBoard/CalendarBoard.tsx index e00bbf63b67bc847261cf254b7d8fc9a9ee36c8c..72595c64d4d2bfd08595994cd392d509844afc22 100644 --- a/src/components/CalendarBoard/CalendarBoard.tsx +++ b/src/components/CalendarBoard/CalendarBoard.tsx @@ -3,18 +3,15 @@ import * as S from './styled'; import Day from "./Day"; import {IDay} from "../../types/IDay"; import Control from "./Control"; -import {format} from 'date-fns'; import {useGetCalendarQuery} from "../../store/api/api"; -import {useAppDispatch, useAppSelector} from "../../store/hooks"; +import {useAppSelector} from "../../store/hooks"; import {GET_BORDER_MOUNTH} from "../../helpers/getBorderMounth"; import {FILTER_ARRAY_DATE} from "../../helpers/filterArrayDate"; const CalendarBoard = () => { - const dispatch = useAppDispatch(); - const vk_id = useAppSelector(state => state.home.user?.vk_id ?? ''); const days = useAppSelector(state => state.calendar.calendar); @@ -103,7 +100,7 @@ const CalendarBoard = () => { { calendar.map((item, index) => ( - + ) => { data-current={String(isCurrent)} data-mood={mood} data-is-menstruation={String(isMenstruation)} - data-is-pns={String(isPMSDay)} + data-is-pns={isPMSDay || moodData?.mood === MOOD_VALUE.PMS} data-date={date} data-disabled={isDisabled()} number={number} diff --git a/src/components/index.ts b/src/components/index.ts index 3e54f5e916b4196b7cdf1aa20cc25f0bd370d875..d570cfdf7da85bb37bdf7cf69b2419d5e5ba216f 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -2,8 +2,9 @@ import AppBar from "./AppBar/AppBar"; import CalendarBoard from "./CalendarBoard/CalendarBoard"; import AudioPlayer from "./AudioPlayer/AudioPlayer"; + export { AppBar, CalendarBoard, - AudioPlayer + AudioPlayer, } \ No newline at end of file diff --git a/src/helpers/onLockDocument.ts b/src/helpers/onLockDocument.ts new file mode 100644 index 0000000000000000000000000000000000000000..4eafba91d859303ec0031effb849ed40b433e09a --- /dev/null +++ b/src/helpers/onLockDocument.ts @@ -0,0 +1,9 @@ +export const onLockDocument = (isOpen: boolean) => { + if(isOpen){ + document.body.style.paddingRight = 0 + 'px'; + document.documentElement.style.overflow = "visible"; + return; + } + document.body.style.paddingRight = +window.innerWidth - +document.documentElement.clientWidth + 'px'; + document.documentElement.style.overflow = 'hidden'; +}; \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index 2515ce300728bc36536edc17bfbbac5296e6519e..61e53647a68758f63502af9773f1aae7a8af6c08 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -19,12 +19,12 @@ const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement ); root.render( - + // - + // ); // If you want to start measuring performance in your app, pass a function diff --git a/src/modules/FormDay/FormDay.tsx b/src/modules/FormDay/FormDay.tsx index 8c66497a0adcb4fb5c98a1c940c33ac42dc1c20a..706ea60f56111a1c8ce41354a2aac5f828769738 100644 --- a/src/modules/FormDay/FormDay.tsx +++ b/src/modules/FormDay/FormDay.tsx @@ -3,24 +3,24 @@ import * as S from './styles' import {Button, Div, Paragraph, Spacing} from "@vkontakte/vkui"; import {CheckboxButton} from "../../ui"; import {usePatchDayMutation, usePostDayMutation} from "../../store/api/api"; -import {MOOD_VALUE, MOODS_DATA} from "../../utils/moods"; -import {Swiper as SwiperType} from 'swiper'; +import {MOOD_VALUE} from "../../utils/moods"; import {useAppDispatch, useAppSelector} from "../../store/hooks"; import {openToast} from "../../store/slices/ModalSlice"; import {MODAL_LIST} from "../../utils/modals"; import {actions} from "../../store/slices/RouterSlice"; import {ROUTE_PATH} from "../../utils/routes"; +import {IMood} from "../../types/IMood"; interface CreateDayProps { - slider: SwiperType + mood: IMood } const FormDay = (props: CreateDayProps) => { const { - slider + mood } = props; @@ -45,8 +45,6 @@ const FormDay = (props: CreateDayProps) => { const onClickCreateDay = () => { - const mood = MOODS_DATA[slider?.realIndex ?? 0]; - if(mood.mood === MOOD_VALUE.PMS && checkbox) { dispatch(openToast(MODAL_LIST.PMS_ERROR)); diff --git a/src/modules/GeneratorStories/GeneratorStories.tsx b/src/modules/GeneratorStories/GeneratorStories.tsx new file mode 100644 index 0000000000000000000000000000000000000000..d8f6a9580f95a114ce08e6f9cb4460b1908be6f9 --- /dev/null +++ b/src/modules/GeneratorStories/GeneratorStories.tsx @@ -0,0 +1,155 @@ +import React from 'react'; +import * as S from './styles'; +import {Button, FixedLayout, PanelHeader, Spacing} from "@vkontakte/vkui"; +import {Wrapper} from "../../ui"; +import Label from "./Label"; +import {Icon20PictureOutline} from '@vkontakte/icons'; +import {usePostSaveUserStoriesMutation, usePostFileMutation} from "../../store/api/api"; +import {useAppDispatch, useAppSelector} from "../../store/hooks"; +import {openToast} from "../../store/slices/ModalSlice"; +import {MODAL_LIST} from "../../utils/modals"; +import html2canvas from 'html2canvas'; + +interface IGeneratorStories { + onClose: () => void +} + +const GeneratorStories = (props: IGeneratorStories) => { + + const { + onClose + } = props; + + const [ + count, + setCount + ] = React.useState([]); + + const galleryRef = React.useRef(null); + + const [imageURL, setImageURL] = React.useState(''); + const dispatch = useAppDispatch(); + + const onCreateLabel = () => { + setCount([...count, Date.now().toString()]) + }; + + const onDeleteCount = (id: string) => { + const updatedList = count.filter(item => item !== id); + setCount(updatedList); + }; + + + const user = useAppSelector(state => state.home.user); + + const [ + postFile + ] = usePostFileMutation(); + const [ + postSaveUserStories + ] = usePostSaveUserStoriesMutation(); + + + const ref = React.useRef(null); + + + const onCreateStorie = React.useCallback(async () => { + if (ref.current === null) { + return; + } + html2canvas(ref.current).then(canvas => { + // Получаем Blob из Canvas + canvas.toBlob(async blob => { + if (blob) { + const formData = new FormData(); + formData.append('file', blob, 'screenshot.jpg'); + if (user) { + const firstResponse = await postFile(formData); + if ('error' in firstResponse) { + console.log('Error in first request:', firstResponse.error); + dispatch(openToast(MODAL_LIST.ERROR)); + return; + } + const secondResponse = await postSaveUserStories({ + id: user?.vk_id as string, + stories: { + title: firstResponse?.data.name, + pathImage: firstResponse?.data.location, + moderated: false + }, + }); + if ('error' in secondResponse) { + console.log('Error in second request:', secondResponse.error); + dispatch(openToast(MODAL_LIST.ERROR)); + return; + } + onClose(); + } + } + }, 'image/jpeg'); + }); + }, [ref, user]); + + const handleImageChange = (event: React.ChangeEvent) => { + const file = event.target.files?.[0]; + if (file) { + const reader = new FileReader(); + reader.onload = (e) => { + // @ts-ignore + setImageURL(e.target?.result); + }; + reader.readAsDataURL(file); + } + }; + + + React.useEffect(() => { + galleryRef.current?.click(); + }, []); + + return ( + + + + + + + + } style={{background: "transparent", zIndex: 20, position: "absolute", top: 0}} separator={false}/> + + + + + + + + Аа + + + + + + { + count.map((id, index) => ( + + + +
+ + + + + +
+
+
+ ); +}; + +export default GeneratorStories; \ No newline at end of file diff --git a/src/modules/GeneratorStories/Label.tsx b/src/modules/GeneratorStories/Label.tsx new file mode 100644 index 0000000000000000000000000000000000000000..e1afae2359f94065c0af6024777b7388a0307201 --- /dev/null +++ b/src/modules/GeneratorStories/Label.tsx @@ -0,0 +1,151 @@ +import React from 'react'; +import * as S from './styles'; +import Draggable from "react-draggable"; +import {FixedLayout} from "@vkontakte/vkui"; +import {useDebouncedCallback} from "use-debounce"; +import {Icon20DeleteOutline} from '@vkontakte/icons'; +import ContentEditable from 'react-contenteditable'; + +interface ILabel { + id: string, + onDelete: (id: string) => void, +} + +const Label = (props: ILabel) => { + + const { + id, + onDelete, + } = props; + + const [value, setValue] = React.useState(''); + const [editValue, setEditValue] = React.useState(''); + const [isEdit, setIsEdit] = React.useState(true); + const [isDraggable, setIsDraggable] = React.useState(false); + const [isTouch, setIsTouch] = React.useState(true); + + const [ + color, + setColor + ] = React.useState('rgba(124, 124, 239, 0.77)'); + + // const [ + // isColorPicker, + // setIsColorPicker + // ] = React.useState(false); + + const editableRef = React.useRef(null); + + + const createLabel = () => { + editValue.length <= 0 && onDelete(id); + setIsEdit(false); + } + + const onClickEditMode = (event: React.MouseEvent) => { + const target = event.target as HTMLDivElement; + if (!target.closest("[data-ignore]")) { + createLabel(); + } + }; + + const debounceOnEdit = useDebouncedCallback( + () => { + if (!isDraggable && isTouch) { + setIsEdit(true); + } + }, + 250 + ); + + const onDrag = () => { + setIsTouch(false); + setIsDraggable(true) + }; + + const onDragEnd = () => { + setIsDraggable(false) + }; + + + React.useEffect(() => { + if (isEdit && editableRef.current) { + //@ts-ignore + editableRef.current.focus(); + setEditValue(value); + } + + if (!isEdit) { + setValue(editValue); + setEditValue(''); + } + }, [isEdit]); + + return ( + + { + isEdit && + + onDelete(id)}> + + + {/* setIsColorPicker(!isColorPicker)} data-ignore>*/} + {/* {*/} + {/* isColorPicker && */} + {/* */} + {/* */} + {/* }*/} + {/* {*/} + {/* try {*/} + {/* setColor(e.target.value);*/} + {/* } catch (error) {*/} + {/* console.error("Error while setting color:", error);*/} + {/* }*/} + {/* }}*/} + {/* />*/} + {/* */} + {/**/} + +
+ setEditValue(event.target.value)} + tagName="div" + style={{ + outline: "none", + padding: editValue.length > 0 ? '8px 12px' : '8px 1px', + borderRadius: '12px', + display: 'inline-block', + margin: 'var(--bs-gutter)', + fontSize: '20px', + color: '#fff', + backgroundColor: color, + }} + /> +
+
+ } + setIsTouch(true)} + onDrag={onDrag} + onStop={onDragEnd} + onMouseDown={debounceOnEdit} + defaultPosition={{x: 0, y: 0}}> + + + {value + .replace(//g, '\n') + .replace(/ /g, ' ') + } + + + +
+ ); +}; + +export default Label; \ No newline at end of file diff --git a/src/modules/GeneratorStories/styles.ts b/src/modules/GeneratorStories/styles.ts new file mode 100644 index 0000000000000000000000000000000000000000..e0e66fd9df081fc9d7c82f4a0cd924afa45ff5ab --- /dev/null +++ b/src/modules/GeneratorStories/styles.ts @@ -0,0 +1,170 @@ +import styled from "styled-components"; + +export const GeneratorStories = styled.div` + position: fixed; + + animation-name: scaleIn; + animation-duration: 200ms; + animation-timing-function: ease-in; + animation-direction: normal; + + z-index: 1000; + inset: 0; + background: rgba(0, 0, 0, 0.9); + backdrop-filter: blur(3px); + + display: flex; + flex-direction: column; + + + --vkui--color_background_content: "transparent"; + +`; + + + +export const Banner = styled.div` + position: relative; + //inset: 0; + + //position: absolute; + //width: 100%; + //position: absolute; + //inset: 0; + //height: 100%; + //margin: auto; + //height: 100%; + //width: auto; + //display: inline-block; + + background-size: cover; + background-repeat: no-repeat; + background-position: center; + + overflow: hidden; + + + width: 100%; + height: 100%; + + object-fit: cover; + + + img { + //border-radius: 0 0 15px 15px; + object-fit: cover; + max-width: 100%; + max-height: 100%; + width: 100%; + height: 100%; + display: block; + + position: relative; + z-index: 1; + } +`; + +export const Close = styled.div` + cursor: pointer; + display: block; + width: 20px; + height: 20px; + position: relative; + z-index: 10; + margin: 5px; +`; + + +export const Label = styled.div<{ + color: string, +}>` + font-size: 20px; + font-weight: 500; + line-height: normal; + padding: 8px 16px; + border-radius: 12px; + background: ${({color}) => color}; + backdrop-filter: blur(3.5px); + color: #fff; + white-space: pre-line; + z-index: 20; + + &[data-disabled="true"] { + display: none; + } + display: inline-block; + position: absolute; + + width: max-content; + + + top: 60px; + left: 16px; +`; + + +export const Control = styled.div` + cursor: pointer; + width: 42px; + height: 42px; + backdrop-filter: blur(5px); + background: rgb(0, 0, 0, 0.5); + border-radius: 50%; + font-weight: bold; + display: flex; + justify-content: center; + align-items: center; + line-height: 0.8; + font-size: 18px; + color: #fff; + margin: var(--bs-gutter) var(--bs-gutter) var(--bs-gutter) auto; + + transition: .4s all ease; + + &:active { + transform: scale(0.9); + } + + input { + position: absolute; + width: 100%; + height: 100%; + opacity: 0; + } +`; + + +export const Container = styled.div` + //position: relative; + //flex-grow: 1; + //height: 1px; + display: flex; + justify-content: center; + + //position: absolute; + + //inset: 0; + + + max-width: 414px; + width: 100%; + margin: 0 auto; + height: 100%; +`; + + +export const EditMode = styled.div<{ + color: string +}>` + position: fixed; + inset: 0; + backdrop-filter: blur(8px); + z-index: 30; + display: flex; + flex-direction: column; + justify-content: center; + --vkui--size_border_radius--regular: 16px; + --vkui_internal--thin_border: 0; + background: rgba(0, 0, 0, 0.75); +`; + diff --git a/src/modules/Modals/ProductModal/ProductModal.tsx b/src/modules/Modals/ProductModal/ProductModal.tsx index 9e955ce8a02488fe73071acb577ed2b72ca2186e..546bab010846598ded86061e81bef67982c6c187 100644 --- a/src/modules/Modals/ProductModal/ProductModal.tsx +++ b/src/modules/Modals/ProductModal/ProductModal.tsx @@ -45,7 +45,7 @@ const ProductModal = (props: IModal) => { - + Негормональный препарат, способствует
diff --git a/src/modules/Notification/WelcomeCard.tsx b/src/modules/Notification/WelcomeCard.tsx index 33793726da9b7e1aab8888fd463fe9fba9770b4f..5221381e57b04eadf6329e407182c2853892ff04 100644 --- a/src/modules/Notification/WelcomeCard.tsx +++ b/src/modules/Notification/WelcomeCard.tsx @@ -63,7 +63,7 @@ const WelcomeCard = (props: IModal) => { вы принимаете + href={'/static/media/files/file1.pdf'}> пользовательское соглашение diff --git a/src/modules/Notification/WinnerCard.tsx b/src/modules/Notification/WinnerCard.tsx index 892f1a42f40ca81796193967d45588f6544a4ee6..6cb21869471be25331778a70c08d72a95103dc8e 100644 --- a/src/modules/Notification/WinnerCard.tsx +++ b/src/modules/Notification/WinnerCard.tsx @@ -3,10 +3,6 @@ import {Button, ModalPage, Spacing, Text} from "@vkontakte/vkui"; import {Card, Wrapper} from "../../ui"; import * as S from './styles'; import {IModal} from "../../types/IModal"; -import {useAppDispatch} from "../../store/hooks"; -import {actions} from "../../store/slices/RouterSlice"; -import {ROUTE_PATH} from "../../utils/routes"; -import {closeModal} from "../../store/slices/ModalSlice"; const WinnerCard = (props: IModal) => { @@ -14,12 +10,11 @@ const WinnerCard = (props: IModal) => { id } = props; - const dispatch = useAppDispatch(); return ( - + @@ -36,10 +31,8 @@ const WinnerCard = (props: IModal) => { )) } + @@ -88,7 +111,18 @@ const Home = (props: IPanel) => { dispatch(openModal(MODAL_LIST.PRODUCT))}> - + + + + + + + + + + + + diff --git a/src/views/Home/styles.ts b/src/views/Home/styles.ts index 69c96571614884b05664239017a1c2f12ff9dc4d..cdf41f7e406eb5df34a84239eebc2834715fe819 100644 --- a/src/views/Home/styles.ts +++ b/src/views/Home/styles.ts @@ -4,7 +4,7 @@ export const Banner = styled.div` flex-grow: 1; width: 100%; position: relative; - min-height: 20rem; + min-height: 30rem; img { position: absolute; left: 0; @@ -13,6 +13,7 @@ export const Banner = styled.div` height: 100%; object-fit: cover; display: block; + object-position: center; } @media(min-width: 576px) { min-height: 100px; @@ -21,8 +22,8 @@ export const Banner = styled.div` `; export const OpenInfo = styled.button` position: absolute; - left: 20%; - top: 55%; + left: 16%; + top: 50%; z-index: 10; width: 36px; height: 36px; @@ -106,4 +107,20 @@ export const Avatar = styled.img` height: 100px; } `; +export const Ligal = styled.div` + position: absolute; + left: 0; + right: 0; + bottom: 0; + pointer-events: none; + + z-index: 10; + margin: var(--bs-gutter); + + img { + position: relative; + width: 100%; + height: auto; + } +`; diff --git a/src/views/Moments/Moments.tsx b/src/views/Moments/Moments.tsx index 8f6f3f0402a2a7937ef690f37357f1c326e853dd..7a6c631c75c50ff03cb1250e4efd4c8750a1d5f0 100644 --- a/src/views/Moments/Moments.tsx +++ b/src/views/Moments/Moments.tsx @@ -1,93 +1,15 @@ import React from 'react'; import {IPanel} from "../../types/IPanel"; -import {Panel, Paragraph, Spacing, Title} from "@vkontakte/vkui"; +import {Panel, Spacing, Title} from "@vkontakte/vkui"; import {AppBar} from "../../components"; -import {StoriesScroll} from "../../modules"; +import {SnackbarWrapper} from "../../modules"; import {Wrapper} from "../../ui"; import Layout from "../../layout"; import * as S from './styles'; -import {IStorie} from "../../types/IStorie"; - - - -const DURATION_STORIE = 2500; -const stories: IStorie[] = [ - { - id: 1, - fullPath: '/media/stories/1.jpg', - filename: '1' - }, - { - id: 2, - fullPath: '/media/stories/2.jpg', - filename: '2' - }, - { - id: 3, - fullPath: '/media/stories/3.jpg', - filename: '3' - }, - { - id: 4, - fullPath: '/media/stories/4.jpg', - filename: '4' - }, - { - id: 5, - fullPath: '/media/stories/5.jpg', - filename: '5' - }, - { - id: 6, - fullPath: '/media/stories/6.jpg', - filename: '6' - }, - { - id: 7, - fullPath: '/media/stories/7.jpg', - filename: '7' - }, - { - id: 8, - fullPath: '/media/stories/8.jpg', - filename: '8' - }, - { - id: 9, - fullPath: '/media/stories/9.jpg', - filename: '9' - }, - { - id: 10, - fullPath: '/media/stories/10.jpg', - filename: '10' - }, - { - id: 11, - fullPath: '/media/stories/11.jpg', - filename: '11' - }, - { - id: 12, - fullPath: '/media/stories/12.jpg', - filename: '12' - }, - { - id: 13, - fullPath: '/media/stories/13.jpg', - filename: '13' - }, - { - id: 14, - fullPath: '/media/stories/14.jpg', - filename: '14' - }, - { - id: 15, - fullPath: '/media/stories/15.jpg', - filename: '15' - }, -]; +import StorisAdmin from "./views/StorisAdmin"; +import StoriesModerated from "./views/StoriesModerated"; +import StoriesUser from "./views/StoriesUser"; +import CreateStories from "./modules/CreateStories"; const Moments = (props: IPanel) => { @@ -96,46 +18,45 @@ const Moments = (props: IPanel) => { } = props; - // const { - // data: stories = [] - // } = useGetStoriesQuery(null); - return ( - - - - - - - - Приятные Моменты для Себя - - - - - - - - - - Здесь мы собрали примеры Приятных - Моментов для Себя — смотри, вдохновляйся - и создавай теплые воспоминания. Пусть дни - ПМС проходят легко! - - - {/**/} - {/**/} - {/* Также ты можешь добавить свои моменты.*/} - {/**/} - {/**/} - {/**/} - - - - + + + + + + + + + Приятные Моменты для Себя + + + + + + + + Здесь мы собрали примеры Приятных + Моментов для Себя — смотри, вдохновляйся + и создавай теплые воспоминания. Пусть дни + ПМС проходят легко! + + + + + + + + Поделись своими Приятными Моментами. + + + + + + + + + + ); }; diff --git a/src/views/Moments/modules/CreateStories.tsx b/src/views/Moments/modules/CreateStories.tsx new file mode 100644 index 0000000000000000000000000000000000000000..2cdc0ce024265fc68f2c61e85ed29f7f56fd0daf --- /dev/null +++ b/src/views/Moments/modules/CreateStories.tsx @@ -0,0 +1,61 @@ +import React from 'react'; +import * as S from "../styles"; +import {Button, Spacing} from "@vkontakte/vkui"; +import {GeneratorStories} from "../../../modules"; +import {useAppSelector} from "../../../store/hooks"; +import {useGetStoriesUserQuery} from "../../../store/api/api"; +import {onLockDocument} from "../../../helpers/onLockDocument"; + +const CreateStories = () => { + + const [ + isCreateStorie, + setIsCreateStorie + ] = React.useState(false); + + + const vk_id = useAppSelector(state => state.home.user?.vk_id ?? '0'); + + + const { + refetch + } = useGetStoriesUserQuery(vk_id); + + + React.useEffect(() => { + onLockDocument(!isCreateStorie); + if (!isCreateStorie) { + refetch(); + } + }, [isCreateStorie]); + + return ( + + + + + + Загружай свой Приятный Момент и получай + развернутый гайд о женском здоровье и ПМС + + + + + + + { + isCreateStorie && setIsCreateStorie(false)} + /> + } + + ); +}; + +export default CreateStories; \ No newline at end of file diff --git a/src/views/Moments/styles.ts b/src/views/Moments/styles.ts index 0098c2387fa9c8d9935b1b51164cf7937f8bfe0e..ec027c7a8b94a6c69d52da72dfe178a7dd501b2c 100644 --- a/src/views/Moments/styles.ts +++ b/src/views/Moments/styles.ts @@ -5,4 +5,30 @@ export const Container = styled.div` max-width: 480px; width: 100%; margin: 0 auto; +`; + + +export const Paragraph = styled.p` + font-weight: var(--vkui--font_weight_accent1); + font-size: var(--vkui--font_paragraph--font_size--regular); + line-height: var(--vkui--font_paragraph--line_height--regular); + + @media(min-width: 576px) { + font-size: 16px; + } +`; + + +export const Alert = styled.div` + position: relative; + background: #9292FF; + color: #fff; + padding: calc(var(--bs-gutter) * 1.5) var(--bs-gutter) calc(var(--bs-gutter) * 2) var(--bs-gutter); + backdrop-filter: blur(3.5px); + border-radius: 30px; + + + @media(min-width: 576px) { + padding: 16px 16px 32px 16px; + } `; \ No newline at end of file diff --git a/src/views/Moments/views/StoriesModerated.tsx b/src/views/Moments/views/StoriesModerated.tsx new file mode 100644 index 0000000000000000000000000000000000000000..0d8e7ca54abe22b56abfaf14df221691ff15dd4a --- /dev/null +++ b/src/views/Moments/views/StoriesModerated.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import {Spacing} from "@vkontakte/vkui"; +import {StoriesScroll} from "../../../modules"; +import {useGetStoriesModeratedQuery} from "../../../store/api/api"; + +const StoriesModerated = () => { + + const { + data: storiesModerated = [] + } = useGetStoriesModeratedQuery(null, { + refetchOnMountOrArgChange: true, + pollingInterval: 100000, + }); + + return ( + + + + + + ); +}; + +export default StoriesModerated; \ No newline at end of file diff --git a/src/views/Moments/views/StoriesUser.tsx b/src/views/Moments/views/StoriesUser.tsx new file mode 100644 index 0000000000000000000000000000000000000000..fbf3f4cde567489d23fbfe271d5d058bc83f80f5 --- /dev/null +++ b/src/views/Moments/views/StoriesUser.tsx @@ -0,0 +1,61 @@ +import React from 'react'; +import {Button, Spacing} from "@vkontakte/vkui"; +import {StoriesScroll} from "../../../modules"; +import {useAppDispatch, useAppSelector} from "../../../store/hooks"; +import {useGetStoriesUserQuery, usePostUserGuideMutation} from "../../../store/api/api"; +import {Wrapper} from "../../../ui"; +import {setGuideUser} from "../../../store/slices/HomeSlice"; + +const StoriesUser = () => { + + const vk_id = useAppSelector(state => state.home.user?.vk_id ?? '0'); + const guide = useAppSelector(state => state.home.user?.guide ?? 0); + const { + data: storiesUser = [], + } = useGetStoriesUserQuery(vk_id, { + refetchOnMountOrArgChange: true, + pollingInterval: 100000, + }); + + const dispatch = useAppDispatch(); + + const [patchGuide, { + data + }] = usePostUserGuideMutation() + + const onClickDownload = () => { + patchGuide({ + vk_id, + guide: { + guide: guide + 1 + } + }) + }; + + + React.useEffect(() => { + dispatch(setGuideUser(data?.guide ?? guide)) + }, [data]) + + return ( + + + + + + + + + ); +}; + +export default StoriesUser; \ No newline at end of file diff --git a/src/views/Moments/views/StorisAdmin.tsx b/src/views/Moments/views/StorisAdmin.tsx new file mode 100644 index 0000000000000000000000000000000000000000..1a7cb1caf08ed0351ef138edcf108e483eb91540 --- /dev/null +++ b/src/views/Moments/views/StorisAdmin.tsx @@ -0,0 +1,25 @@ +import React from 'react'; +import {useGetStoriesQuery} from "../../../store/api/api"; +import {Spacing} from "@vkontakte/vkui"; +import {StoriesScroll} from "../../../modules"; + +const StorisAdmin = () => { + + const { + data: stories= [], + } = useGetStoriesQuery(null, { + refetchOnMountOrArgChange: true, + pollingInterval: 100000, + }); + + + return ( + + + + + + ); +}; + +export default StorisAdmin; \ No newline at end of file diff --git a/src/views/Question/Question.tsx b/src/views/Question/Question.tsx index 609dec05d42588530dce8e5bc41a6fb359d2515c..5c89c65c53a0f073359415bc0a19596691d0d706 100644 --- a/src/views/Question/Question.tsx +++ b/src/views/Question/Question.tsx @@ -14,16 +14,16 @@ import {setAnswer} from "../../store/slices/TestSlice"; import {Icon28ErrorCircleOutline} from "@vkontakte/icons"; const banners = [ - "/media/test/1.jpg", - "/media/test/2.jpg", - "/media/test/3.jpg", - "/media/test/4.jpg", - "/media/test/5.jpg", - "/media/test/6.jpg", - "/media/test/7.jpg", - "/media/test/8.jpg", - "/media/test/9.jpg", - "/media/test/10.jpg" + "/static/media/test/1.jpg", + "/static/media/test/2.jpg", + "/static/media/test/3.jpg", + "/static/media/test/4.jpg", + "/static/media/test/5.jpg", + "/static/media/test/6.jpg", + "/static/media/test/7.jpg", + "/static/media/test/8.jpg", + "/static/media/test/9.jpg", + "/static/media/test/10.jpg" ]; diff --git a/src/views/Result/Result.tsx b/src/views/Result/Result.tsx index 45826f0ddaa4a6699ff5611e5739486264de28a6..eb11ca96f92d6c51926b7688edcde97482f97639 100644 --- a/src/views/Result/Result.tsx +++ b/src/views/Result/Result.tsx @@ -35,7 +35,7 @@ const Result = (props: IPanel) => { - + diff --git a/src/views/Test/Test.tsx b/src/views/Test/Test.tsx index ac3c36807c53179736bbe42cdb8f7ab8f6a28e81..a37e14ae1f63a24a585e0036639f3cac5f65df40 100644 --- a/src/views/Test/Test.tsx +++ b/src/views/Test/Test.tsx @@ -21,7 +21,7 @@ const Test = (props: IPanel) => { - + diff --git a/yarn.lock b/yarn.lock index 880893c9075353af5837fe1d085b4621b0878e81..9051ed81dbe44fd03d18d72b4134e4e588d96011 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3221,6 +3221,11 @@ balanced-match@^1.0.0: resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw== +base64-arraybuffer@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz#1c37589a7c4b0746e34bd1feb951da2df01c1bdc" + integrity sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ== + base64-js@^1.3.1: version "1.5.1" resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a" @@ -3534,6 +3539,11 @@ cliui@^7.0.2: strip-ansi "^6.0.0" wrap-ansi "^7.0.0" +clsx@^1.1.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12" + integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg== + co@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/co/-/co-4.6.0.tgz#6ea6bdf3d853ae54ccb8e47bfa0bf3f9031fb184" @@ -3810,6 +3820,13 @@ css-has-pseudo@^3.0.4: dependencies: postcss-selector-parser "^6.0.9" +css-line-break@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/css-line-break/-/css-line-break-2.1.0.tgz#bfef660dfa6f5397ea54116bb3cb4873edbc4fa0" + integrity sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w== + dependencies: + utrie "^1.0.2" + css-loader@^6.5.1: version "6.8.1" resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-6.8.1.tgz#0f8f52699f60f5e679eab4ec0fcd68b8e8a50a88" @@ -5486,6 +5503,14 @@ html-webpack-plugin@^5.5.0: pretty-error "^4.0.0" tapable "^2.0.0" +html2canvas@^1.4.1: + version "1.4.1" + resolved "https://registry.yarnpkg.com/html2canvas/-/html2canvas-1.4.1.tgz#7cef1888311b5011d507794a066041b14669a543" + integrity sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA== + dependencies: + css-line-break "^2.1.0" + text-segmentation "^1.0.3" + htmlparser2@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-6.1.0.tgz#c4d762b6c3371a05dbe65e94ae43a9f845fb8fb7" @@ -8124,7 +8149,7 @@ prompts@^2.0.1, prompts@^2.1.0, prompts@^2.3.2, prompts@^2.4.2: kleur "^3.0.3" sisteransi "^1.0.5" -prop-types@^15.8.1: +prop-types@^15.7.1, prop-types@^15.8.1: version "15.8.1" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5" integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg== @@ -8232,6 +8257,14 @@ react-app-polyfill@^3.0.0: regenerator-runtime "^0.13.9" whatwg-fetch "^3.6.2" +react-contenteditable@^3.3.7: + version "3.3.7" + resolved "https://registry.yarnpkg.com/react-contenteditable/-/react-contenteditable-3.3.7.tgz#18dd1f281841ba2c2b306e2d28278bc31b7929ed" + integrity sha512-GA9NbC0DkDdpN3iGvib/OMHWTJzDX2cfkgy5Tt98JJAbA3kLnyrNbBIpsSpPpq7T8d3scD39DHP+j8mAM7BIfQ== + dependencies: + fast-deep-equal "^3.1.3" + prop-types "^15.7.1" + react-dev-utils@^12.0.1: version "12.0.1" resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-12.0.1.tgz#ba92edb4a1f379bd46ccd6bcd4e7bc398df33e73" @@ -8270,6 +8303,14 @@ react-dom@^18.2.0: loose-envify "^1.1.0" scheduler "^0.23.0" +react-draggable@^4.4.5: + version "4.4.5" + resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-4.4.5.tgz#9e37fe7ce1a4cf843030f521a0a4cc41886d7e7c" + integrity sha512-OMHzJdyJbYTZo4uQE393fHcqqPYsEtkjfMgvCHr6rejT+Ezn4OZbNyGH50vv+SunC1RMvwOTSWkEODQLzw1M9g== + dependencies: + clsx "^1.1.1" + prop-types "^15.8.1" + react-error-overlay@^6.0.11: version "6.0.11" resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.11.tgz#92835de5841c5cf08ba00ddd2d677b6d17ff9adb" @@ -9416,6 +9457,13 @@ test-exclude@^6.0.0: glob "^7.1.4" minimatch "^3.0.4" +text-segmentation@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/text-segmentation/-/text-segmentation-1.0.3.tgz#52a388159efffe746b24a63ba311b6ac9f2d7943" + integrity sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw== + dependencies: + utrie "^1.0.2" + text-table@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" @@ -9722,6 +9770,11 @@ url-parse@^1.5.3: querystringify "^2.1.1" requires-port "^1.0.0" +use-debounce@^9.0.4: + version "9.0.4" + resolved "https://registry.yarnpkg.com/use-debounce/-/use-debounce-9.0.4.tgz#51d25d856fbdfeb537553972ce3943b897f1ac85" + integrity sha512-6X8H/mikbrt0XE8e+JXRtZ8yYVvKkdYRfmIhWZYsP8rcNs9hk3APV8Ua2mFkKRLcJKVdnX2/Vwrmg2GWKUQEaQ== + use-sync-external-store@^1.0.0: version "1.2.0" resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a" @@ -9759,6 +9812,13 @@ utils-merge@1.0.1: resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713" integrity sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA== +utrie@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/utrie/-/utrie-1.0.2.tgz#d42fe44de9bc0119c25de7f564a6ed1b2c87a645" + integrity sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw== + dependencies: + base64-arraybuffer "^1.0.2" + uuid@^8.3.2: version "8.3.2" resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"