Add correct edit right widget

This commit is contained in:
2025-06-03 12:31:47 +03:00
parent 5814e65953
commit f0e03c3a1d
10 changed files with 806 additions and 233 deletions

View File

@ -22,7 +22,7 @@ type SightLanguageInfo = {
media_type: number;
}[];
};
right: { heading: string; body: string }[];
right: { id: number; heading: string; body: string; media: [] }[];
};
type SightCommonInfo = {
@ -90,19 +90,43 @@ class CreateSightStore {
makeAutoObservable(this);
}
createNewRightArticle = () => {
this.sight.ru.right.push({
createNewRightArticle = async () => {
const articleId = await languageInstance("ru").post("/article", {
heading: "Введите русский заголовок",
body: "Введите русский текст",
});
this.sight.en.right.push({
const { id } = articleId.data;
await languageInstance("en").patch(`/article/${id}`, {
heading: "Enter the English heading",
body: "Enter the English text",
});
this.sight.zh.right.push({
await languageInstance("zh").patch(`/article/${id}`, {
heading: "Введите китайский заголовок",
body: "Введите китайский текст",
});
await authInstance.post(`/sight/${this.sight.id}/article`, {
article_id: id,
page_num: this.sight.ru.right.length + 1,
});
this.sight.ru.right.push({
id: id,
heading: "Введите русский заголовок",
body: "Введите русский текст",
media: [],
});
this.sight.en.right.push({
id: id,
heading: "Enter the English heading",
body: "Enter the English text",
media: [],
});
this.sight.zh.right.push({
id: id,
heading: "Введите китайский заголовок",
body: "Введите китайский текст",
media: [],
});
};
updateLeftInfo = (language: Language, heading: string, body: string) => {
@ -444,6 +468,32 @@ class CreateSightStore {
filename: media.filename,
});
};
unlinkRightAritcle = async (id: number) => {
this.sight.ru.right = this.sight.ru.right.filter(
(article) => article.id !== id
);
this.sight.en.right = this.sight.en.right.filter(
(article) => article.id !== id
);
this.sight.zh.right = this.sight.zh.right.filter(
(article) => article.id !== id
);
};
deleteRightArticle = async (id: number) => {
await authInstance.delete(`/article/${id}`);
this.sight.ru.right = this.sight.ru.right.filter(
(article) => article.id !== id
);
this.sight.en.right = this.sight.en.right.filter(
(article) => article.id !== id
);
this.sight.zh.right = this.sight.zh.right.filter(
(article) => article.id !== id
);
};
}
export const createSightStore = new CreateSightStore();

View File

@ -11,7 +11,12 @@ export type SightLanguageInfo = {
body: string;
media: { id: string; media_type: number; filename: string }[];
};
right: { heading: string; body: string }[];
right: {
id: number;
heading: string;
body: string;
media: { id: string; media_type: number; filename: string }[];
}[];
};
export type SightCommonInfo = {
@ -111,21 +116,42 @@ class EditSightStore {
};
getRightArticles = async (id: number) => {
const responseRu = await languageInstance("ru").get(`/sight/${id}/article`);
const responseEn = await languageInstance("en").get(`/sight/${id}/article`);
const responseZh = await languageInstance("zh").get(`/sight/${id}/article`);
let responseRu = await languageInstance("ru").get(`/sight/${id}/article`);
let responseEn = await languageInstance("en").get(`/sight/${id}/article`);
let responseZh = await languageInstance("zh").get(`/sight/${id}/article`);
// Function to fetch media for a given set of articles
const fetchMediaForArticles = async (articles: any[]) => {
const articlesWithMedia = [];
for (const article of articles) {
const responseMedia = await authInstance.get(
`/article/${article.id}/media`
);
articlesWithMedia.push({
...article,
media: responseMedia.data,
});
}
return articlesWithMedia;
};
// Fetch media for articles in each language
const ruArticlesWithMedia = await fetchMediaForArticles(responseRu.data);
const enArticlesWithMedia = await fetchMediaForArticles(responseEn.data);
const zhArticlesWithMedia = await fetchMediaForArticles(responseZh.data);
const data = {
ru: {
right: responseRu.data,
right: ruArticlesWithMedia,
},
en: {
right: responseEn.data,
right: enArticlesWithMedia,
},
zh: {
right: responseZh.data,
right: zhArticlesWithMedia,
},
};
runInAction(() => {
this.sight = {
...this.sight,
@ -137,7 +163,6 @@ class EditSightStore {
...this.sight.en,
right: data.en.right,
},
zh: {
...this.sight.zh,
right: data.zh.right,
@ -279,8 +304,13 @@ class EditSightStore {
left_article: createdLeftArticleId,
});
if (this.sight.common.left_article == 0) {
return;
for (const language of ["ru", "en", "zh"] as Language[]) {
for (const article of this.sight[language].right) {
await languageInstance(language).patch(`/article/${article.id}`, {
heading: article.heading,
body: article.body,
});
}
}
// await languageInstance("ru").patch(
@ -375,6 +405,38 @@ class EditSightStore {
);
};
unlinkRightArticle = async (article_id: number) => {
await authInstance.delete(`/sight/${this.sight.common.id}/article`, {
data: {
article_id: article_id,
},
});
this.sight.ru.right = this.sight.ru.right.filter(
(article) => article.id !== article_id
);
this.sight.en.right = this.sight.en.right.filter(
(article) => article.id !== article_id
);
this.sight.zh.right = this.sight.zh.right.filter(
(article) => article.id !== article_id
);
};
deleteRightArticle = async (article_id: number) => {
this.sight.ru.right = this.sight.ru.right.filter(
(article) => article.id !== article_id
);
this.sight.en.right = this.sight.en.right.filter(
(article) => article.id !== article_id
);
this.sight.zh.right = this.sight.zh.right.filter(
(article) => article.id !== article_id
);
await authInstance.delete(`/article/${article_id}`);
};
uploadMediaOpen = false;
setUploadMediaOpen = (open: boolean) => {
this.uploadMediaOpen = open;
@ -442,6 +504,168 @@ class EditSightStore {
filename: media.filename,
});
};
unlinkPreviewMedia = async () => {
this.sight.common.preview_media = null;
};
linkPreviewMedia = async (mediaId: string) => {
this.sight.common.preview_media = mediaId;
};
linkArticle = async (article_id: number) => {
const response = await languageInstance("ru").get(`/article/${article_id}`);
const responseEn = await languageInstance("en").get(
`/article/${article_id}`
);
const responseZh = await languageInstance("zh").get(
`/article/${article_id}`
);
const mediaIds = await authInstance.get(`/article/${article_id}/media`);
runInAction(() => {
this.sight.ru.right.push({
id: article_id,
heading: response.data.heading,
body: response.data.body,
media: mediaIds.data,
});
this.sight.en.right.push({
id: article_id,
heading: responseEn.data.heading,
body: responseEn.data.body,
media: mediaIds.data,
});
this.sight.zh.right.push({
id: article_id,
heading: responseZh.data.heading,
body: responseZh.data.body,
media: mediaIds.data,
});
});
};
deleteRightArticleMedia = async (article_id: number, media_id: string) => {
await authInstance.delete(`/article/${article_id}/media`, {
data: {
media_id: media_id,
},
});
this.sight.ru.right = this.sight.ru.right.map((article) => {
if (article.id === article_id) {
article.media = article.media.filter((media) => media.id !== media_id);
}
return article;
});
this.sight.en.right = this.sight.en.right.map((article) => {
if (article.id === article_id) {
article.media = article.media.filter((media) => media.id !== media_id);
}
return article;
});
this.sight.zh.right = this.sight.zh.right.map((article) => {
if (article.id === article_id) {
article.media = article.media.filter((media) => media.id !== media_id);
}
return article;
});
};
createNewRightArticle = async () => {
const articleId = await languageInstance("ru").post("/article", {
heading: "Введите русский заголовок",
body: "Введите русский текст",
});
const { id } = articleId.data;
await languageInstance("en").patch(`/article/${id}`, {
heading: "Enter the English heading",
body: "Enter the English text",
});
await languageInstance("zh").patch(`/article/${id}`, {
heading: "Введите китайский заголовок",
body: "Введите китайский текст",
});
await authInstance.post(`/sight/${this.sight.common.id}/article`, {
article_id: id,
page_num: this.sight.ru.right.length + 1,
});
this.sight.ru.right.push({
id: id,
heading: "Введите русский заголовок",
body: "Введите русский текст",
media: [],
});
this.sight.en.right.push({
id: id,
heading: "Enter the English heading",
body: "Enter the English text",
media: [],
});
this.sight.zh.right.push({
id: id,
heading: "Введите китайский заголовок",
body: "Введите китайский текст",
media: [],
});
};
createLinkWithRightArticle = async (
media: {
id: string;
filename: string;
media_name?: string;
media_type: number;
},
article_id: number
) => {
await authInstance.post(`/article/${article_id}/media`, {
media_id: media.id,
media_order: 1,
});
this.sight.ru.right = this.sight.ru.right.map((article) => {
if (article.id === article_id) {
article.media.unshift({
id: media.id,
media_type: media.media_type,
filename: media.filename,
});
}
return article;
});
this.sight.en.right = this.sight.en.right.map((article) => {
if (article.id === article_id) {
article.media.unshift({
id: media.id,
media_type: media.media_type,
filename: media.filename,
});
}
return article;
});
this.sight.zh.right = this.sight.zh.right.map((article) => {
if (article.id === article_id) {
article.media.unshift({
id: media.id,
media_type: media.media_type,
filename: media.filename,
});
}
return article;
});
};
updateRightArticleInfo = (
index: number,
language: Language,
heading: string,
body: string
) => {
this.sight[language].right[index].heading = heading;
this.sight[language].right[index].body = body;
};
}
export const editSightStore = new EditSightStore();