Skip to content
Snippets Groups Projects
Commit 9bbbff8e authored by Дмитрий Малюгин's avatar Дмитрий Малюгин :clock4:
Browse files

refactor in process

parent 1ed1a30a
No related branches found
No related tags found
1 merge request!15Refactor/code
Showing
with 244 additions and 337 deletions
public/favicon.ico

4.31 KiB | W: | H:

public/favicon.ico

96.8 KiB | W: | H:

public/favicon.ico
public/favicon.ico
public/favicon.ico
public/favicon.ico
  • 2-up
  • Swipe
  • Onion skin
This diff is collapsed.
src/app/assets/ShelfNoteLogoCircle.png

297 KiB

......@@ -153,7 +153,7 @@ body {
display: flex;
flex-flow: column;
}
#pageContainer {
#sheetContainer {
padding-top: 80px;
}
#app > main {
......@@ -173,6 +173,7 @@ body {
box-sizing: border-box;
user-select: none;
color: white;
font-weight: 500;
}
/* Links */
......
......@@ -15,60 +15,64 @@ declare module 'vue' {
BaseLoader: typeof import('./../shared/BaseLoader.vue')['default']
Button: typeof import('./../shared/ui/Button.vue')['default']
CloseCircle: typeof import('./../shared/icons/CloseCircle.vue')['default']
ConfirmDeleteEntityModal: typeof import('./../modules/ConfirmDeleteEntityModal.vue')['default']
CreateEntityMenu: typeof import('./../components/CreateEntityMenu.vue')['default']
CloseCircleIcon: typeof import('./../shared/icons/CloseCircleIcon.vue')['default']
CreateEntityMenu: typeof import('./../components/common/CreateEntityMenu.vue')['default']
CropIcon: typeof import('./../shared/icons/CropIcon.vue')['default']
CropImageModal: typeof import('./../modules/CropImageModal.vue')['default']
CropImageModal: typeof import('./../modules/common/CropImageModal.vue')['default']
DashedIcon: typeof import('./../shared/icons/DashedIcon.vue')['default']
DeleteEntityConfirmModal: typeof import('./../modules/common/DeleteEntityConfirmModal.vue')['default']
Divider: typeof import('./../shared/ui/Divider.vue')['default']
DividerItem: typeof import('./../modules/entities/DividerItem.vue')['default']
DividerSettings: typeof import('./../components/entities/settings/DividerSettings.vue')['default']
DividerSettingsList: typeof import('./../components/entities/settings/lists/DividerSettingsList.vue')['default']
DividerEntity: typeof import('./../modules/sheets/entities/items/DividerEntity.vue')['default']
DividerSettings: typeof import('./../components/sheets/entities/settings/DividerSettings.vue')['default']
DividerSettingsList: typeof import('./../components/sheets/entities/settings/lists/DividerSettingsList.vue')['default']
DottedIcon: typeof import('./../shared/icons/DottedIcon.vue')['default']
Drawer: typeof import('./../shared/ui/Drawer.vue')['default']
EntitiesList: typeof import('./../modules/entities/EntitiesList.vue')['default']
EntityItem: typeof import('./../modules/entities/EntityItem.vue')['default']
EntityPositionSettings: typeof import('./../components/entities/settings/EntityPositionSettings.vue')['default']
EntityTitle: typeof import('./../components/entities/share/EntityTitle.vue')['default']
EntitiesList: typeof import('./../modules/sheets/entities/EntitiesList.vue')['default']
EntityItem: typeof import('./../modules/sheets/entities/EntityItem.vue')['default']
EntityPositionSettings: typeof import('./../components/sheets/entities/settings/EntityPositionSettings.vue')['default']
EntityTitle: typeof import('./../components/sheets/entities/share/EntityTitle.vue')['default']
ExitIcon: typeof import('./../shared/icons/ExitIcon.vue')['default']
HamburgerIcon: typeof import('./../shared/icons/HamburgerIcon.vue')['default']
HomeIcon: typeof import('./../shared/icons/HomeIcon.vue')['default']
HorizontalLineIcon: typeof import('./../shared/icons/HorizontalLineIcon.vue')['default']
ImageEditIcon: typeof import('./../shared/icons/ImageEditIcon.vue')['default']
ImageEntity: typeof import('./../modules/sheets/entities/items/ImageEntity.vue')['default']
ImageIcon: typeof import('./../shared/icons/ImageIcon.vue')['default']
ImageItem: typeof import('./../modules/entities/ImageItem.vue')['default']
ImageSettings: typeof import('./../components/entities/settings/ImageSettings.vue')['default']
ImageSettingsList: typeof import('./../components/entities/settings/lists/ImageSettingsList.vue')['default']
LogoAndLabel: typeof import('./../components/LogoAndLabel.vue')['default']
ImageSettings: typeof import('./../components/sheets/entities/settings/ImageSettings.vue')['default']
ImageSettingsList: typeof import('./../components/sheets/entities/settings/lists/ImageSettingsList.vue')['default']
MenuDial: typeof import('./../shared/ui/MenuDial.vue')['default']
Modal: typeof import('./../shared/ui/Modal.vue')['default']
NavigationIcon: typeof import('./../shared/icons/NavigationIcon.vue')['default']
PageBackgroundMenu: typeof import('./../modules/PageBackgroundMenu.vue')['default']
PageHeader: typeof import('./../modules/PageHeader.vue')['default']
PageMenuButton: typeof import('./../components/PageMenuButton.vue')['default']
ParagraphEntity: typeof import('./../modules/sheets/entities/items/ParagraphEntity.vue')['default']
ParagraphIcon: typeof import('./../shared/icons/ParagraphIcon.vue')['default']
ParagraphItem: typeof import('./../modules/entities/ParagraphItem.vue')['default']
ParagraphSettings: typeof import('./../components/entities/settings/ParagraphSettings.vue')['default']
ParagraphSettingsList: typeof import('./../components/entities/settings/lists/ParagraphSettingsList.vue')['default']
ParagraphSettings: typeof import('./../components/sheets/entities/settings/ParagraphSettings.vue')['default']
ParagraphSettingsList: typeof import('./../components/sheets/entities/settings/lists/ParagraphSettingsList.vue')['default']
PlusIcon: typeof import('./../shared/icons/PlusIcon.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SaveIcon: typeof import('./../shared/icons/SaveIcon.vue')['default']
SettingsIcon: typeof import('./../shared/icons/SettingsIcon.vue')['default']
SheetBackgroundMenu: typeof import('./../modules/sheets/SheetBackgroundMenu.vue')['default']
SheetHeader: typeof import('./../modules/sheets/SheetHeader.vue')['default']
SheetPage: typeof import('./../pages/[uuid]/SheetPage.vue')['default']
SidebarMenuContent: typeof import('./../modules/SidebarMenuContent.vue')['default']
SheetPageContent: typeof import('./../modules/sheets/SheetPageContent.vue')['default']
SheetTelegramSection: typeof import('./../modules/sheets/SheetTelegramSection.vue')['default']
SidebarMenu: typeof import('./../modules/common/SidebarMenu.vue')['default']
SidebarMenuButton: typeof import('./../components/common/SidebarMenuButton.vue')['default']
SignIn: typeof import('./../pages/authorization/signIn.vue')['default']
SignUp: typeof import('./../pages/authorization/signUp.vue')['default']
Slider: typeof import('./../shared/ui/Slider.vue')['default']
SolidIcon: typeof import('./../shared/icons/SolidIcon.vue')['default']
TableIcon: typeof import('./../shared/icons/TableIcon.vue')['default']
TelegramSection: typeof import('./../modules/TelegramSection.vue')['default']
TextFontMenu: typeof import('./../components/entities/share/TextFontMenu.vue')['default']
TextPositionMenu: typeof import('./../components/entities/text/TextPositionMenu.vue')['default']
TextStateMenu: typeof import('./../components/entities/text/TextStateMenu.vue')['default']
TextFontMenu: typeof import('@/components/sheets/entities/share/TextFontMenu.vue')['default']
TextPositionMenu: typeof import('@/components/sheets/entities/text/TextPositionMenu.vue')['default']
TextStateMenu: typeof import('@/components/sheets/entities/text/TextStateMenu.vue')['default']
ToggleButton: typeof import('./../shared/ui/ToggleButton.vue')['default']
ToggleSwitch: typeof import('./../shared/ui/ToggleSwitch.vue')['default']
TrashIcon: typeof import('./../shared/icons/TrashIcon.vue')['default']
Tree: typeof import('./../shared/ui/Tree.vue')['default']
TriangleOpenIcon: typeof import('./../shared/ui/icons/TriangleOpenIcon.vue')['default']
UploadIcon: typeof import('./../shared/icons/UploadIcon.vue')['default']
VerticalArrowsIcon: typeof import('./../shared/icons/VerticalArrowsIcon.vue')['default']
}
}
import { useInterfaceStore } from '@/app/stores/interface';
import { useDataStore } from '@/app/stores/data';
import { useWebsocketStore } from '@/app/stores/websocket';
import type { IEntity, TTheme } from '@/app/interfaces/environment';
import type { IEntity } from '@/app/interfaces/environment';
import { checkIsImage } from '@/app/helpers/images';
import { useFilesWebsocketStore } from '@/app/stores/filesWebsocket';
import cookies from '@/app/plugins/Cookie';
export const fetchForEntities = (page_uuid: string) => {
export const fetchForEntities = (sheet_uuid: string) => {
const dataStore = useDataStore();
const interfaceStore = useInterfaceStore();
const websocketStore = useWebsocketStore();
......@@ -14,12 +14,12 @@ export const fetchForEntities = (page_uuid: string) => {
const filesBuffer = filesWebsocketStore.filesBuffer;
if (filesBuffer.length) {
filesBuffer[0] = new Blob([filesBuffer[0].data], { type: 'image/jpeg' });
interfaceStore.setPageBackgroundFromDB(URL.createObjectURL(filesBuffer[0]));
interfaceStore.setSheetBackgroundFromDB(URL.createObjectURL(filesBuffer[0]));
}
if (!dataStore.entities.length) {
const getEntitiesData = {
event: 'getPageEntities',
body: { page_uuid }
event: 'getSheetEntities',
body: { sheet_uuid }
};
websocketStore.sendData(getEntitiesData);
}
......@@ -28,7 +28,7 @@ export const fetchForEntities = (page_uuid: string) => {
export const createEntity = (newEntity: IEntity) => {
const websocketStore = useWebsocketStore();
const page_uuid = cookies.get('current_page_uuid');
const sheet_uuid = cookies.get('current_sheet_uuid');
if (newEntity.image_buffer) {
websocketStore.setFileData(newEntity);
const filesWebsocketStore = useFilesWebsocketStore();
......@@ -36,7 +36,7 @@ export const createEntity = (newEntity: IEntity) => {
}
const data = {
event: 'createEntity',
body: { ...newEntity, page_uuid }
body: { ...newEntity, sheet_uuid }
};
websocketStore.sendData(data);
};
......@@ -51,24 +51,15 @@ export const editEntity = (newState: IEntity) => {
websocketStore.sendData(data);
};
export const sendReturnOriginalSize = (newState: IEntity) => {
const websocketStore = useWebsocketStore();
const data = {
event: 'returnOriginalImageSize',
body: { ...newState }
};
websocketStore.sendData(data);
};
export const deleteEntity = (entityUuid: string) => {
const dataStore = useDataStore();
const websocketStore = useWebsocketStore();
const page_uuid = cookies.get('current_page_uuid');
const sheet_uuid = cookies.get('current_sheet_uuid');
const entities = dataStore.entities;
const entityToDelete = entities.find((entity) => entity.entity_uuid === entityUuid);
const data = {
event: 'deleteEntity',
body: { ...entityToDelete, page_uuid }
body: { ...entityToDelete, sheet_uuid }
};
websocketStore.sendData(data);
};
......@@ -90,126 +81,3 @@ export const changeEntitiesOrder = (entityUuid: string, direction: 'up' | 'down'
};
websocketStore.sendData(data);
};
export const convertThemeToColorWhiteDefault = (theme: string | undefined) => {
if (!theme) return '#ffffff';
switch (theme) {
case 'white':
return '#ffffff';
case 'slate':
return '#64748b';
case 'blue':
return '#3b82f6';
case 'sky':
return '#0ea5e9';
case 'teal':
return '#14b8a6';
case 'lime':
return '#84cc16';
case 'green':
return '#22c55e';
case 'yellow':
return '#eab308';
case 'amber':
return '#f59e0b';
case 'orange':
return '#f97316';
case 'pink':
return '#ec4899';
case 'fuchsia':
return '#d946ef';
case 'purple':
return '#a855f7';
case 'indigo':
return '#6366f1';
case 'rose':
return '#f43f5e';
case 'red':
return '#ef4444';
case 'black':
return '#000000';
}
return '#ffffff';
};
export const convert800ThemeToColorGrayDefault = (theme: string | undefined) => {
if (!theme) return '#9294a1';
switch (theme) {
case 'white':
return '#ffffff';
case 'slate':
return '#1e293b';
case 'blue':
return '#1e40af';
case 'sky':
return '#075985';
case 'teal':
return '#115e59';
case 'lime':
return '#3f6212';
case 'green':
return '#166534';
case 'yellow':
return '#854d0e';
case 'amber':
return '#92400e';
case 'orange':
return '#9a3412';
case 'pink':
return '#9d174d';
case 'fuchsia':
return '#86198f';
case 'purple':
return '#6b21a8';
case 'indigo':
return '#3730a3';
case 'rose':
return '#9f1239';
case 'red':
return '#991b1b';
case 'black':
return '#000000';
}
return '#9294a1';
};
export const convertThemeToColorBlackDefault = (theme: string | undefined) => {
if (!theme) return '#000000';
switch (theme) {
case 'white':
return '#ffffff';
case 'slate':
return '#64748b';
case 'blue':
return '#3b82f6';
case 'sky':
return '#0ea5e9';
case 'teal':
return '#14b8a6';
case 'lime':
return '#84cc16';
case 'green':
return '#22c55e';
case 'yellow':
return '#eab308';
case 'amber':
return '#f59e0b';
case 'orange':
return '#f97316';
case 'pink':
return '#ec4899';
case 'fuchsia':
return '#d946ef';
case 'purple':
return '#a855f7';
case 'indigo':
return '#6366f1';
case 'rose':
return '#f43f5e';
case 'red':
return '#ef4444';
case 'black':
return '#000000';
}
return '#000000';
};
......@@ -3,11 +3,55 @@ import { useFilesWebsocketStore } from '@/app/stores/filesWebsocket';
import type { IImage } from '@/app/interfaces/entities';
import { useWebsocketStore } from '@/app/stores/websocket';
import { useInterfaceStore } from '@/app/stores/interface';
import { imageScaleOptions } from '@/components/entities/settings/lists/constants/options';
import { imageScaleOptions } from '@/components/sheets/entities/settings/lists/constants/options';
import type { IImageMainInfo } from '@/app/interfaces';
export const setDefaultPageBackground = () => {
export const calcImageWidth = (fileWidth: number, windowWidth: number) => {
let imageWidth = Math.ceil((fileWidth / (windowWidth - 128)) * 100);
if (imageWidth > 100) {
imageWidth = 100;
}
if (imageWidth < 5) {
imageWidth = 5;
}
return imageWidth;
};
export const sendReturnOriginalSize = (newState: IEntity) => {
const websocketStore = useWebsocketStore();
const data = {
event: 'returnOriginalImageSize',
body: { ...newState }
};
websocketStore.sendData(data);
};
export const uploadImage = ($event) => {
const target = $event.target as HTMLInputElement;
const image = new Image();
const file = target.files![0];
image.src = URL.createObjectURL(file);
return image;
};
export const backgroundImageOnLoad = (image, windowWidth: number) => {
const backgroundImageInfo = {
image_url: '',
image_width: 0,
file_width: 0,
file_height: 0
};
const imageWidth = calcImageWidth(image.width, windowWidth);
backgroundImageInfo.image_url = image.src;
backgroundImageInfo.image_width = imageWidth;
backgroundImageInfo.file_width = image.width;
backgroundImageInfo.file_height = image.height;
return backgroundImageInfo;
};
export const setDefaultSheetBackground = () => {
const interfaceStore = useInterfaceStore();
interfaceStore.resetPageBackground();
interfaceStore.resetSheetBackground();
};
export const addUrlsToImageEntities = (entities: IEntity[]) => {
......@@ -46,17 +90,6 @@ export const checkIsImage = (entity: IEntity) => {
return entityToReturn;
};
export const calcImageWidth = (fileWidth: number, windowWidth: number) => {
let imageWidth = Math.ceil((fileWidth / (windowWidth - 128)) * 100);
if (imageWidth > 100) {
imageWidth = 100;
}
if (imageWidth < 5) {
imageWidth = 5;
}
return imageWidth;
};
export const sendCropImage = async (newUrl: string, entity: IImage) => {
const filesWebsocketStore = useFilesWebsocketStore();
filesWebsocketStore.saveImageUrl(newUrl);
......
......@@ -11,10 +11,10 @@ export interface ITable extends IEntity {
}[];
}
export interface ITableColumn {
column_uuid: string;
column_uuid?: string;
name: string;
type: ITableColumnTypes;
data: never;
data?: never;
}
type ITableColumnTypes =
| 'text'
......
import type { ITableColumn } from '@/app/interfaces/entities';
export interface IPageInfo {
page_uuid: string;
page_title: string;
page_icon: string;
page_navigation_order: string;
export interface ISheetInfo {
sheet_uuid: string;
sheet_title: string;
sheet_icon: string;
sheet_navigation_order: string;
entities?: {
entity_uuid: string;
entity_type: 'divider' | 'paragraph' | 'image' | 'table';
......@@ -12,7 +12,7 @@ export interface IPageInfo {
}
export interface IEntity {
entity_uuid: string;
entity_uuid?: string;
entity_user?: string;
user_nick_name?: string;
entity_order?: number;
......@@ -24,7 +24,7 @@ export interface IEntity {
font_size?: string | null;
paragraph_size?: string | null;
text_position?: string | null;
image_buffer?: string;
image_buffer?: string | ArrayBuffer;
image_url_initial?: string;
image_width_initial?: number;
file_width_initial?: number;
......
......@@ -23,7 +23,7 @@ export const useAuthorizationStore = defineStore('authorizationStore', () => {
userNickName.value = '';
userData.value = null;
cookies.remove('user_uuid');
cookies.remove('current_page_uuid');
cookies.remove('current_sheet_uuid');
cookies.remove('home_uuid');
cookies.remove('favorite_color');
router.push('/signUp');
......
import { defineStore } from 'pinia';
import type { IEntity, IPageInfo } from '@/app/interfaces/environment';
import type { IEntity, ISheetInfo } from '@/app/interfaces/environment';
import cookies from '@/app/plugins/Cookie';
export const useDataStore = defineStore('dataStore', () => {
......@@ -36,22 +36,22 @@ export const useDataStore = defineStore('dataStore', () => {
}
]);
const pagesData = ref<IPageInfo[]>([]);
const currentPage = computed<IPageInfo>(() =>
pagesData.value.find((page) => page.page_uuid === cookies.get('current_page_uuid'))
const sheetsData = ref<ISheetInfo[]>([]);
const currentSheet = computed<ISheetInfo>(() =>
sheetsData.value.find((sheet) => sheet.sheet_uuid === cookies.get('current_sheet_uuid'))
);
const entities = ref<IEntity[]>([]);
function setCurrentPageUuid(uuid: string) {
cookies.set('current_page_uuid', uuid);
function setCurrentSheetUuid(uuid: string) {
cookies.set('current_sheet_uuid', uuid);
}
function setCurrentPageData(data: IPageInfo) {
currentPage.value = data;
function setCurrentSheetData(data: ISheetInfo) {
// currentSheet.value = data;
}
function setPagesData(data: IPageInfo[]) {
pagesData.value = data;
function setSheetsData(data: ISheetInfo[]) {
sheetsData.value = data;
}
function addPageData(data: IPageInfo) {
pagesData.value.push(data);
function addSheetData(data: ISheetInfo) {
sheetsData.value.push(data);
}
function editEntities(newState: IEntity[]) {
entities.value = newState.sort(
......@@ -61,12 +61,12 @@ export const useDataStore = defineStore('dataStore', () => {
return {
sheets,
entities,
pagesData,
currentPage,
setCurrentPageUuid,
setCurrentPageData,
setPagesData,
addPageData,
sheetsData,
currentSheet,
setCurrentSheetUuid,
setCurrentSheetData,
setSheetsData,
addSheetData,
editEntities
};
});
......@@ -5,31 +5,31 @@ export const useInterfaceStore = defineStore('interfaceStore', () => {
const websocketStore = useWebsocketStore();
const isDarkMode = ref<boolean>(true);
const defaultPageBackground = ref<string>(
const defaultSheetBackground = ref<string>(
'https://t3.ftcdn.net/jpg/05/01/28/98/360_F_501289843_4ITbthNCydFQGgJmoZe4IQKchItBubqZ.jpg'
);
const pageBackground = ref<string>(defaultPageBackground.value);
const sheetBackground = ref<string>(defaultSheetBackground.value);
const isFetchedForBackground = ref<boolean>(false);
function setIsFetchedForBackground() {
isFetchedForBackground.value = true;
}
function resetPageBackground() {
pageBackground.value = defaultPageBackground.value;
function resetSheetBackground() {
sheetBackground.value = defaultSheetBackground.value;
const data = {
event: 'deletePageBackground'
event: 'deleteSheetBackground'
};
websocketStore.sendData(data);
}
function editPageBackground(newUrl: string) {
pageBackground.value = newUrl;
function editSheetBackground(newUrl: string) {
sheetBackground.value = newUrl;
const image = new Image();
image.src = newUrl;
image.onload = async () => {
const response = await fetch(newUrl);
const blob = await response.blob();
const data = {
event: 'editPageBackground',
event: 'editSheetBackground',
body: {
background_url: newUrl,
extension: blob.type
......@@ -38,20 +38,20 @@ export const useInterfaceStore = defineStore('interfaceStore', () => {
websocketStore.sendData(data);
};
}
function setPageBackgroundFromDB(url: string | null) {
function setSheetBackgroundFromDB(url: string | null) {
if (!url) {
return;
}
pageBackground.value = url;
sheetBackground.value = url;
}
return {
isDarkMode,
pageBackground,
defaultPageBackground,
sheetBackground,
defaultSheetBackground,
isFetchedForBackground,
setIsFetchedForBackground,
resetPageBackground,
editPageBackground,
setPageBackgroundFromDB
resetSheetBackground,
editSheetBackground,
setSheetBackgroundFromDB
};
});
......@@ -6,7 +6,7 @@ import { addUrlsToImageEntities } from '@/app/helpers/images';
import { useFilesWebsocketStore } from '@/app/stores/filesWebsocket';
import { useAuthorizationStore } from '@/app/stores/authorization';
import cookies from '@/app/plugins/Cookie';
import { editEntity } from '@/app/helpers';
import { editEntity } from '@/app/helpers/entities';
export const useWebsocketStore = defineStore('websocketStore', () => {
const dataStore = useDataStore();
......@@ -39,14 +39,14 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
}
};
sendData(getUserData);
const pageUuid = cookies.get('current_page_uuid');
const getPageData = {
event: 'getPage',
const sheetUuid = cookies.get('current_sheet_uuid');
const getSheetData = {
event: 'getSheet',
body: {
page_uuid: pageUuid
sheet_uuid: sheetUuid
}
};
sendData(getPageData);
sendData(getSheetData);
}
if (initialDataToSend.value) socket.value.send(JSON.stringify(initialDataToSend.value));
};
......@@ -57,11 +57,11 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
// create
case 'createUser': {
cookies.set('user_uuid', response.data.user_uuid);
const pagesUuid = response.data.pages_uuid;
const homePageUuid = pagesUuid[0];
const sheetsUuid = response.data.sheets_uuid;
const homeSheetUuid = sheetsUuid[0];
const userSettings = response.data.settings;
cookies.set('favorite_color', userSettings.favorite_color);
cookies.set('home_uuid', homePageUuid);
cookies.set('home_uuid', homeSheetUuid);
const getUserData = {
event: 'getUser',
body: {
......@@ -69,18 +69,18 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
}
};
sendData(getUserData);
const getPageData = {
event: 'getPage',
const getSheetData = {
event: 'getSheet',
body: {
page_uuid: homePageUuid
sheet_uuid: homeSheetUuid
}
};
sendData(getPageData);
await router.push(`/${homePageUuid}`);
sendData(getSheetData);
await router.push(`/${homeSheetUuid}`);
break;
}
case 'createPage': {
dataStore.addPageData(response.data);
case 'createSheet': {
dataStore.addSheetData(response.data);
break;
}
case 'createEntity': {
......@@ -96,12 +96,12 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
}
case 'createImageEntity': {
if (!file.value) break;
const page_uuid = cookies.get('current_page_uuid');
const sheet_uuid = cookies.get('current_sheet_uuid');
const data = {
event: 'createEntity',
body: {
...file.value,
page_uuid
sheet_uuid
}
};
file.value = null;
......@@ -112,15 +112,15 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
case 'getUser': {
authorizationStore.setUserNickName(response.data.nick_name);
authorizationStore.setUserData(response.data);
dataStore.setPagesData(response.data.pages_uuid);
dataStore.setSheetsData(response.data.sheets_uuid);
break;
}
case 'getPage': {
dataStore.setCurrentPageUuid(response.data.page_uuid);
dataStore.setCurrentPageData(response.data);
case 'getSheet': {
dataStore.setCurrentSheetUuid(response.data.sheet_uuid);
// dataStore.setCurrentSheetData(response.data);
break;
}
case 'getPageEntities': {
case 'getSheetEntities': {
const newState = response.data;
if (imageEntitiesCount.value && filesBufferLength.value === imageEntitiesCount.value) {
const entitiesAddedUrls = addUrlsToImageEntities(newState);
......@@ -130,12 +130,12 @@ export const useWebsocketStore = defineStore('websocketStore', () => {
}
break;
}
case 'getPageBackground': {
case 'getSheetBackground': {
const blob = new Blob([response.data.setting_value.data], {
type: `image/jpeg`
});
const url = URL.createObjectURL(blob);
interfaceStore.setPageBackgroundFromDB(url);
interfaceStore.setSheetBackgroundFromDB(url);
break;
}
// update
......
<script setup lang="ts"></script>
<template>
<section class="inline-flex items-center gap-10">
<img
src="@/app/assets/ShelfNote.svg"
alt="ShelfNote logo"
class="bg-white size-12 rounded-full"
/>
<span class="font-semibold text-2xl text-primary">ShelfNote</span>
</section>
</template>
<style scoped></style>
......@@ -5,8 +5,7 @@ import { useFilesWebsocketStore } from '@/app/stores/filesWebsocket';
import { useDataStore } from '@/app/stores/data';
import cookies from '@/app/plugins/Cookie';
import { calcImageWidth } from '@/app/helpers/images';
const emit = defineEmits(['createEntity']);
import { createEntity } from '@/app/helpers/entities';
const { open: uploadFile, onChange } = useFileDialog({
accept: 'image/*',
......@@ -39,7 +38,7 @@ const addImage = async (files: FileList) => {
image.width *= coefficient;
}
const imageWidth = calcImageWidth(image.width, windowWidth.value);
emit('createEntity', {
createEntity({
entity_type: 'image',
entity_order: entitiesCount.value + 1,
image_buffer: buffer,
......@@ -70,7 +69,7 @@ const speedDialItems = ref([
textStyle: 'bold',
theme: 'blue',
onClick: () => {
emit('createEntity', {
createEntity({
entity_type: 'divider',
entity_order: entitiesCount.value + 1,
divider_height: 1,
......@@ -83,7 +82,7 @@ const speedDialItems = ref([
textStyle: 'bold',
theme: 'green',
onClick: () => {
emit('createEntity', {
createEntity({
entity_type: 'paragraph',
entity_order: entitiesCount.value + 1,
text: '',
......@@ -104,7 +103,7 @@ const speedDialItems = ref([
textStyle: 'bold',
theme: 'red',
onClick: () => {
emit('createEntity', {
createEntity({
entity_type: 'table',
entity_order: entitiesCount.value + 1,
table_columns: [
......
......@@ -3,7 +3,7 @@ const emit = defineEmits(['openMenu']);
</script>
<template>
<div class="fixed top-0 left-0 z-20">
<div class="fixed z-20">
<button
class="px-4 py-2 text-white font-bold hover:bg-slate-800 transition-all rounded-md flex flex-col items-center justify-center gap-1.5"
@click.prevent="emit('openMenu')"
......
<script setup lang="ts">
import { convertThemeToColorWhiteDefault, deleteEntity } from '@/app/helpers';
import { convertThemeToColorWhiteDefault } from '@/app/helpers';
import { deleteEntity } from '@/app/helpers/entities';
import type { IDivider } from '@/app/interfaces/entities';
import type { TTheme } from '@/app/interfaces/environment';
import cookies from '@/app/plugins/Cookie';
......
<script setup lang="ts">
import { changeEntitiesOrder } from '@/app/helpers';
import { changeEntitiesOrder } from '@/app/helpers/entities';
import cookies from '@/app/plugins/Cookie';
interface Props {
......
<script setup lang="ts">
import type { IImage } from '@/app/interfaces/entities';
import { convertThemeToColorWhiteDefault, deleteEntity, editEntity } from '@/app/helpers';
import { convertThemeToColorWhiteDefault } from '@/app/helpers';
import { deleteEntity, editEntity } from '@/app/helpers/entities';
import type { TTheme } from '@/app/interfaces/environment';
import cookies from '@/app/plugins/Cookie';
import { sendCropImage } from '@/app/helpers/images';
......@@ -121,7 +123,7 @@ const openCropImageModal = () => (isModalCropImage.value = true);
v-model:imageInfo="newEntityData"
@cropImage="cropImage"
/>
<ConfirmDeleteEntityModal
<DeleteEntityConfirmModal
v-model:isModalToDeleteEntity="isModalToDeleteImage"
@deleteEntity="deleteImage"
@toggleConfirmDeleteEntityModal="toggleConfirmDeleteImageModal"
......
<script setup lang="ts">
import { convertThemeToColorWhiteDefault, deleteEntity, editEntity } from '@/app/helpers';
import { convertThemeToColorWhiteDefault } from '@/app/helpers';
import { deleteEntity, editEntity } from '@/app/helpers/entities';
import type { IParagraph } from '@/app/interfaces/entities';
import type { TTheme } from '@/app/interfaces/environment';
import cookies from '@/app/plugins/Cookie';
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment