From a416b6cc95e6b56eb5632b571cc5a82bfa890ef9 Mon Sep 17 00:00:00 2001 From: andrei Date: Wed, 4 Jun 2025 19:24:09 +0500 Subject: [PATCH] =?UTF-8?q?refactor:=20AppointmentView:=20=D0=9F=D0=B5?= =?UTF-8?q?=D1=80=D0=B5=D0=B8=D0=BC=D0=B5=D0=BD=D0=BE=D0=B2=D0=B0=D0=BD=20?= =?UTF-8?q?hook=20=D0=B8=20=D1=83=D0=B1=D1=80=D0=B0=D0=BD=20console.log?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-app/src/Api/appointmentFilesApi.js | 7 ++- .../AppointmentViewModal.jsx | 17 +++---- ...intmentViewUI.js => useAppointmentView.js} | 48 +++++++++++-------- 3 files changed, 40 insertions(+), 32 deletions(-) rename web-app/src/Components/Widgets/AppointmentViewModal/{useAppointmentViewUI.js => useAppointmentView.js} (69%) diff --git a/web-app/src/Api/appointmentFilesApi.js b/web-app/src/Api/appointmentFilesApi.js index af23c6b..2df0c05 100644 --- a/web-app/src/Api/appointmentFilesApi.js +++ b/web-app/src/Api/appointmentFilesApi.js @@ -1,5 +1,5 @@ -import { createApi } from "@reduxjs/toolkit/query/react"; -import { baseQueryWithAuth } from "./baseQuery.js"; +import {createApi} from "@reduxjs/toolkit/query/react"; +import {baseQueryWithAuth} from "./baseQuery.js"; export const appointmentFilesApi = createApi({ reducerPath: 'appointmentFilesApi', @@ -8,7 +8,6 @@ export const appointmentFilesApi = createApi({ endpoints: (builder) => ({ getAppointmentFiles: builder.query({ query: (appointmentId) => { - console.log(`Fetching files for appointment ID: ${appointmentId}`); return `/appointment_files/${appointmentId}/`; }, providesTags: ['AppointmentFile'], @@ -22,7 +21,7 @@ export const appointmentFilesApi = createApi({ invalidatesTags: ['AppointmentFile'], }), uploadAppointmentFile: builder.mutation({ - query: ({ appointmentId, file }) => { + query: ({appointmentId, file}) => { if (!(file instanceof File)) { throw new Error('Invalid file object'); } diff --git a/web-app/src/Components/Widgets/AppointmentViewModal/AppointmentViewModal.jsx b/web-app/src/Components/Widgets/AppointmentViewModal/AppointmentViewModal.jsx index d772052..4fff4aa 100644 --- a/web-app/src/Components/Widgets/AppointmentViewModal/AppointmentViewModal.jsx +++ b/web-app/src/Components/Widgets/AppointmentViewModal/AppointmentViewModal.jsx @@ -1,5 +1,5 @@ -import { Button, Modal, Row, Typography, Spin } from "antd"; -import useAppointmentViewUI from "./useAppointmentViewUI.js"; +import {Button, Modal, Row, Typography, Spin, Splitter, Divider} from "antd"; +import useAppointmentView from "./useAppointmentView.js"; const AppointmentViewModal = () => { const { @@ -20,7 +20,7 @@ const AppointmentViewModal = () => { isFilesLoading, downloadingFiles, downloadFile, - } = useAppointmentViewUI(); + } = useAppointmentView(); if (!selectedAppointment) { return null; @@ -67,26 +67,27 @@ const AppointmentViewModal = () => { {labels.results}

{labels.files}

{isFilesLoading ? ( - + ) : files.length > 0 ? ( files.map((file) => ( -
+ {file.file_title || labels.notSpecified} -
+ + )) ) : (

{labels.noFiles}

diff --git a/web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentViewUI.js b/web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentView.js similarity index 69% rename from web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentViewUI.js rename to web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentView.js index aeeaf1c..1b85f22 100644 --- a/web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentViewUI.js +++ b/web-app/src/Components/Widgets/AppointmentViewModal/useAppointmentView.js @@ -1,25 +1,26 @@ -import { useDispatch, useSelector } from "react-redux"; -import { setSelectedAppointment } from "../../../Redux/Slices/appointmentsSlice.js"; +import {useDispatch, useSelector} from "react-redux"; +import {setSelectedAppointment} from "../../../Redux/Slices/appointmentsSlice.js"; import dayjs from "dayjs"; -import { useState } from "react"; +import {useState} from "react"; import {useGetAppointmentFilesQuery} from "../../../Api/appointmentFilesApi.js"; import {baseQueryWithAuth} from "../../../Api/baseQuery.js"; +import {notification} from "antd"; -const useAppointmentViewUI = () => { +const useAppointmentView = () => { const dispatch = useDispatch(); - const { selectedAppointment } = useSelector((state) => state.appointmentsUI); + const {selectedAppointment} = useSelector((state) => state.appointmentsUI); - const { data: files = [], isLoading: isFilesLoading } = useGetAppointmentFilesQuery( + const {data: files = [], isLoading: isFilesLoading} = useGetAppointmentFilesQuery( selectedAppointment?.id, - { skip: !selectedAppointment?.id } + {skip: !selectedAppointment?.id} ); const [downloadingFiles, setDownloadingFiles] = useState({}); const modalWidth = 700; - const blockStyle = { marginBottom: 16 }; - const footerRowStyle = { marginTop: 16 }; - const footerButtonStyle = { marginRight: 8 }; + const blockStyle = {marginBottom: 16}; + const footerRowStyle = {marginTop: 16}; + const footerButtonStyle = {marginRight: 8}; const labels = { title: "Просмотр приема", @@ -72,19 +73,17 @@ const useAppointmentViewUI = () => { const downloadFile = async (fileId, fileName) => { try { - setDownloadingFiles((prev) => ({ ...prev, [fileId]: true })); - // Выполняем запрос с использованием fetch, применяя baseQueryWithAuth для аутентификации - const { url, ...options } = await baseQueryWithAuth( + setDownloadingFiles((prev) => ({...prev, [fileId]: true})); + const {url, ...options} = await baseQueryWithAuth( { url: `/appointment_files/${fileId}/file/`, method: 'GET', credentials: 'include', }, - { getState: () => ({}) }, + {}, {} ); - // Поскольку baseQueryWithAuth может вернуть объект с полной URL, используем его const response = await fetch(url, { ...options, method: 'GET', @@ -92,7 +91,11 @@ const useAppointmentViewUI = () => { }); if (!response.ok) { - throw new Error(`Ошибка HTTP: ${response.status} ${response.statusText}`); + notification.error({ + message: "Ошибка при скачивании файла", + description: "Не удалось загрузить файл.", + placement: "topRight", + }); } const blob = await response.blob(); @@ -104,11 +107,16 @@ const useAppointmentViewUI = () => { link.click(); link.remove(); window.URL.revokeObjectURL(downloadUrl); + } catch (error) { - console.error("Ошибка при скачивании файла:", error); - // Можно добавить уведомление, например, с antd message + console.error("Error downloading file:", error); + notification.error({ + message: "Ошибка при скачивании файлов", + description: "Не удалось загрузить файл.", + placement: "topRight", + }); } finally { - setDownloadingFiles((prev) => ({ ...prev, [fileId]: false })); + setDownloadingFiles((prev) => ({...prev, [fileId]: false})); } }; @@ -133,4 +141,4 @@ const useAppointmentViewUI = () => { }; }; -export default useAppointmentViewUI; \ No newline at end of file +export default useAppointmentView; \ No newline at end of file